:root{--red:#c8102e;--red-dark:#a70d27;--red-soft:#fcecef;--ink:#252525;--muted:#6b6b68;--line:#e5e4e0;--paper:#f8f7f4;--green:#27644c;--radius:18px;--container:1240px}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:110px}
body{margin:0;font:15px/1.65 'Manrope',Arial,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased}
button,input,textarea,select{font:inherit}
a{color:inherit;text-decoration:none}
button,a,input,textarea,select,summary{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
img{display:block;max-width:100%}
button{color:inherit}
button:disabled{cursor:not-allowed;opacity:.5}
input,textarea,select{min-width:0}
textarea{resize:vertical}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #247bad;outline-offset:5px}
input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #b8d9ed;outline-offset:1px;border-color:#247bad}
h1,h2,h3,p{margin:0}
h1,h2,h3{line-height:1.15;font-weight:800;letter-spacing:-.045em}
h1{font-size:clamp(42px,4.8vw,68px)}
h2{font-size:clamp(30px,3.1vw,44px)}
h3{font-size:21px;letter-spacing:-.025em}
p{color:var(--muted)}
small,.small{font-size:14px}
strong{font-weight:800}
ul{padding-left:20px}
fieldset{margin:0;padding:0;border:0}
button{border:0;background:none}
::selection{background:#f4bac4}
.container{width:min(calc(100% - 64px),var(--container));margin-inline:auto}
.icon{width:22px;height:22px;stroke:currentColor;stroke-width:1.65;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr-only,.honeypot{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
[hidden]{display:none!important}
.skip-link{position:fixed;top:8px;left:8px;z-index:200;background:#fff;padding:12px 20px;transform:translateY(-150%)}
.skip-link:focus{transform:translateY(0)}
.eyebrow{display:block;color:var(--red);font-size:14px;letter-spacing:.14em;text-transform:uppercase;font-weight:800;line-height:1.6;margin-bottom:16px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:54px;padding:15px 24px;border:1px solid transparent;border-radius:8px;font-size:14px;font-weight:800;line-height:1.4;transition:background .18s,transform .18s,box-shadow .18s;text-align:center}
.btn:hover{transform:translateY(-2px)}
.btn .icon{width:19px;height:19px}
.btn-primary{background:var(--red);color:white;box-shadow:0 4px 10px #c8102e0e}
.btn-primary:hover{background:var(--red-dark);box-shadow:0 5px 18px #c8102e24}
.btn-secondary{background:#fff;border-color:#d8d8d4}
.btn-secondary:hover{background:var(--paper);border-color:#a9a9a4}
.btn-small{min-height:44px;padding:11px 17px;font-size:14px}
.btn-full{width:100%}
.text-link{display:inline-flex;align-items:center;gap:12px;font-size:14px;font-weight:800;color:var(--ink);border-bottom:1px solid #c6c4bf;padding-bottom:5px}
.text-link:hover{color:var(--red);border-color:var(--red)}
.text-link .icon{width:17px;height:17px}
.text-link-plain{border-bottom:0;padding-bottom:0}
.topbar{background:var(--ink);color:#fff;font-size:14px;letter-spacing:.025em}
.topbar .container{display:flex;align-items:center;justify-content:space-between;min-height:32px}
.topbar .container>span:last-child{display:flex;align-items:center;gap:8px;color:#e5e5e1}
.topbar .icon{width:12px;height:12px}
.topbar-divider{opacity:.35;margin:0 12px}
.header{position:sticky;top:0;z-index:40;background:#ffFFfff5;backdrop-filter:blur(16px);border-bottom:1px solid #eeeeeb}
.header-inner{height:90px;display:flex;align-items:center;gap:35px}
.brand{display:block;flex-shrink:0;width:205px}
.brand img{width:100%;height:auto}
.header nav{display:flex;gap:27px;margin-left:auto;white-space:nowrap}
.header nav a{font-size:14px;font-weight:700;padding:12px 0}
.header nav a:hover{color:var(--red)}
.header-actions{display:flex;gap:24px;align-items:center}
.header-phone{display:flex;align-items:center;gap:7px;font-size:14px;font-weight:800;white-space:nowrap}
.header-phone .icon{width:16px;height:16px}
.menu-toggle{display:none;width:44px;height:44px}
.hero{background:linear-gradient(100deg,#faf9f6,#fff);padding:64px 0 66px}
.hero-grid{display:grid;grid-template-columns:1fr 1.07fr;gap:50px;align-items:center}
.hero h1{font-size:clamp(42px,4.5vw,64px);line-height:1.1;letter-spacing:-.056em;margin-bottom:25px}
.hero h1 span{color:var(--red)}
.hero-copy>p{font-size:16px;line-height:1.8;max-width:440px}
.hero-ctas{display:flex;gap:10px;margin-top:30px}
.hero-ctas .btn{font-size:14px;padding-inline:18px;gap:12px}
.hero-photo{position:relative;padding-bottom:36px;align-self:stretch;min-height:475px}
.hero-photo>img{width:100%;height:100%;max-height:485px;min-height:440px;object-fit:cover;object-position:49% center;border-radius:var(--radius)}
.hero-price{position:absolute;bottom:40px;left:-25px;background:#fff;box-shadow:0 12px 40px #22222212;display:flex;align-items:center;justify-content:space-between;gap:26px;padding:21px 24px;border-radius:12px;border:1px solid #ecebe6;min-width:330px}
.hero-price>div>span{display:block;font-size:14px;color:var(--muted)}
.hero-price strong{display:block;font-size:39px;line-height:1.3;letter-spacing:-.045em;margin:3px 0}
.hero-price strong small{font-size:14px;letter-spacing:-.015em}
.hero-price>a{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;color:var(--red);background:var(--red-soft)}
.hero-price>a:hover{background:var(--red);color:white}
.image-caption{position:absolute;bottom:10px;right:0;font-size:14px;color:#878781}
.benefit-strip{border-block:1px solid var(--line);background:#fff}
.benefit-grid{display:grid;grid-template-columns:repeat(4,1fr);padding-block:29px}
.benefit-grid>div{display:flex;align-items:center;gap:15px;border-right:1px solid var(--line);padding-inline:26px}
.benefit-grid>div:first-child{padding-left:0}
.benefit-grid>div:last-child{border:0;padding-right:0}
.benefit-grid .icon{color:var(--red);width:27px;height:27px}
.benefit-grid span{display:block;font-size:14px;color:var(--muted)}
.benefit-grid strong{display:block;font-size:14px;color:var(--ink);margin-bottom:2px}
.section{padding:88px 0;scroll-margin-top:12px}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:38px}
.section-head>p{font-size:14px;line-height:1.85;max-width:400px;padding-bottom:4px}
.section-head h2{letter-spacing:-.05em}
.materials-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.material-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff;transition:transform .2s,box-shadow .2s}
.material-card:hover{transform:translateY(-4px);box-shadow:0 15px 30px #25252508}
.material-card.premium{border-color:#d67d8a}
.material-visual{height:160px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#f0eee8}
.premium .material-visual{background:#e9eeea}
.mesh .material-visual{background:#e9edf0}
.reflex .material-visual{background:#292b31}
.material-visual>.icon{position:absolute;bottom:12px;right:12px;width:20px;height:20px;opacity:.4}
.reflex .material-visual>.icon{color:#fff}
.mini-banner{width:71%;height:80px;background:#e1bf74;transform:perspective(600px) rotateY(-17deg) rotateZ(-6deg);box-shadow:7px 12px 16px #0002;position:relative;border:1px solid #fff5;display:flex;align-items:center;justify-content:center}
.mini-banner:before{content:'';position:absolute;inset:5px;border:1px solid #0001}
.mini-banner span{font-size:22px;font-weight:800;letter-spacing:.06em;color:#5f4722}
.mini-banner i{position:absolute;width:5px;height:5px;border-radius:50%;background:#ecebe6;border:1px solid #8b897e;top:5px;left:5px}
.mini-banner i:nth-of-type(2){left:auto;right:5px}
.mini-banner i:nth-of-type(3){top:auto;bottom:5px}
.mini-banner i:nth-of-type(4){top:auto;left:auto;right:5px;bottom:5px}
.premium .mini-banner{background:#3b6250}
.premium .mini-banner span{color:#f9f7e7}
.mesh .mini-banner{background-color:#c3d1d7;background-image:radial-gradient(#4d697c 1px,transparent 1px);background-size:4px 4px}
.mesh .mini-banner span{color:#273f50;background:#c3d1d7;padding:4px 8px}
.reflex .mini-banner{background:linear-gradient(115deg,#b5b6ae,#f5f7db 50%,#c4c4b4 65%,#92958c)}
.reflex .mini-banner span{color:#383c2d}
.material-body{padding:22px 20px}
.material-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;gap:3px}
.material-top .eyebrow{margin:0;font-size:14px}
.tag{display:inline-block;font-size:14px;line-height:1.6;font-weight:800;color:var(--green);background:#eaf2eb;padding:3px 7px;border-radius:4px}
.premium .tag{color:var(--red);background:var(--red-soft)}
.material-body h3{font-size:20px;min-height:47px;letter-spacing:-.035em}
.material-spec{font-size:14px;margin:11px 0 20px}
.checklist{list-style:none;padding:0;margin:0 0 20px;font-size:14px}
.checklist li{display:flex;align-items:center;gap:6px;margin-block:7px}
.checklist .icon{width:13px;height:13px;color:var(--green)}
.material-price{border-top:1px solid var(--line);padding-top:17px;margin-bottom:17px;display:flex;align-items:baseline;gap:7px}
.material-price strong{font-size:30px;letter-spacing:-.05em;white-space:nowrap}
.material-price strong span{font-size:16px;letter-spacing:-.02em}
.material-price>span{font-size:14px;color:var(--muted)}
.material-body .btn{width:100%;font-size:14px;padding:12px;min-height:45px;justify-content:space-between}
.under-cards{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:23px}
.under-cards>span{font-size:14px;color:var(--muted)}
.under-cards .text-link{font-size:14px}
.use-section{background:var(--paper)}
.use-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.use-card{padding:27px 22px;background:#fff;border:1px solid var(--line);border-radius:12px;transition:border-color .2s,transform .2s}
.use-card:hover{border-color:var(--red);transform:translateY(-3px)}
.use-icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;background:var(--paper);border-radius:9px;margin-bottom:24px}
.use-icon .icon{width:23px;height:23px}
.use-card h3{font-size:17px;margin-bottom:11px}
.use-card p{font-size:14px;min-height:45px}
.use-bottom{display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:800;margin-top:25px;padding-top:15px;border-top:1px solid var(--line)}
.use-bottom .icon{width:18px;height:18px;color:var(--red)}
.discount-section{padding-bottom:30px}
.discount-banner{display:grid;grid-template-columns:.75fr 1.5fr 1fr;gap:40px;align-items:center;background:#f8edeb;border:1px solid #f0ddd9;border-radius:16px;padding:46px}
.discount-number{font-size:95px;letter-spacing:-.085em;color:var(--red);font-weight:800;line-height:1;position:relative;white-space:nowrap}
.discount-number>span:first-child{font-size:50px}
.discount-spark{position:absolute;top:-39px;right:0;font-size:34px}
.discount-copy h2{font-size:30px;letter-spacing:-.04em}
.discount-copy .eyebrow{font-size:14px;margin-bottom:12px}
.discount-copy p{font-size:14px;line-height:1.8;margin:15px 0 10px;max-width:350px}
.discount-copy small{font-size:14px;color:var(--muted)}
.discount-action{display:flex;flex-direction:column;gap:14px}
.discount-action .btn{font-size:14px;padding-inline:16px;gap:10px}
.discount-action>span{font-size:14px;text-align:center;color:var(--muted)}
.quote-section{background:var(--paper);border-block:1px solid var(--line)}
.quote-grid{display:grid;grid-template-columns:1fr 1.13fr;gap:100px;align-items:start}
.quote-copy{padding-top:20px}
.quote-copy h2{font-size:43px;line-height:1.17}
.quote-copy h2 span{color:var(--red)}
.quote-copy>p{font-size:14px;margin-top:24px;max-width:370px;line-height:1.9}
.quote-benefits{list-style:none;padding:0;margin:30px 0 34px;font-size:14px;font-weight:700}
.quote-benefits li{display:flex;align-items:center;gap:10px;margin:12px 0}
.quote-benefits .icon{width:18px;height:18px;color:var(--green)}
.quote-contact{border-top:1px solid #dcdcd4;padding-top:28px;display:flex;align-items:flex-start;flex-direction:column;gap:8px;max-width:365px}
.quote-contact>span{font-size:14px;color:var(--muted)}
.quote-contact a{display:flex;align-items:center;gap:10px;font-size:26px;font-weight:800;letter-spacing:-.04em}
.quote-contact .icon{width:21px;height:21px;color:var(--red)}
.quote-contact a.small-link{font-size:14px;font-weight:600;letter-spacing:0}
.quote-form{padding:32px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 30px #25252503}
.form-heading{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:23px}
.form-heading h3{font-size:20px}
.form-heading>span{display:flex;gap:5px;align-items:center;font-size:14px;color:var(--muted);white-space:nowrap}
.form-heading .icon{width:13px;height:13px}
form label{display:block;font-size:14px;font-weight:800}
.optional{color:var(--muted);font-size:14px;font-weight:400;margin-left:5px}
.required{color:var(--red)}
input:not([type=checkbox],[type=radio],[type=file]),textarea,select{border:1px solid #dcdcd6;border-radius:6px;background:#fff;width:100%;padding:11px 13px;color:var(--ink);font-size:14px;font-weight:500;line-height:1.6;margin-top:7px;transition:border-color .2s}
input::placeholder,textarea::placeholder{color:#898984;opacity:1;font-size:14px}
input:user-invalid,textarea:user-invalid{border-color:var(--red)}
form>label,form>.form-row{margin-bottom:15px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.quote-form>small{display:block;color:var(--muted);font-size:14px;margin-top:-8px}
.upload{margin-block:22px}
.upload>input{position:absolute;width:1px;height:1px;opacity:0}
.dropzone{display:flex;align-items:center;gap:12px;border:1px dashed #c9c9c1;background:#fbfbf9;border-radius:8px;padding:18px;cursor:pointer;font-weight:400;transition:background .2s,border-color .2s}
.upload>input:focus-visible+label{outline:3px solid #247bad;outline-offset:3px}
.dropzone:hover,.upload.dragging .dropzone{background:var(--red-soft);border-color:var(--red)}
.dropzone>.icon{color:var(--red);width:21px;height:21px}
.dropzone>span{font-size:14px}
.dropzone strong{color:var(--red);font-weight:800}
.dropzone small{display:block;font-size:14px;line-height:1.7;color:var(--muted);margin-top:4px}
.dropzone>.optional{margin-left:auto;font-size:14px}
.field-error{color:#af0926;font-size:14px;line-height:1.7}
.field-error:empty{display:none}
.upload .field-error{margin-top:8px}
.file-list{list-style:none;padding:0;margin:0}
.file-list li{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px}
.file-list small{color:var(--muted);font-size:14px}
.file-list button{width:32px;height:32px;border-radius:5px;background:var(--paper);flex-shrink:0}
.file-list button:hover{background:var(--red-soft);color:var(--red)}
.privacy-note{font-size:14px;line-height:1.9;margin:20px 0}
.privacy-note a{text-decoration:underline;text-underline-offset:3px}
.demo-note{font-size:14px;text-align:center;margin-top:12px;color:#777772}
.faq-grid{display:grid;grid-template-columns:.9fr 1.3fr;gap:85px}
.faq-grid>div>p{margin-top:22px;font-size:14px;line-height:1.9}
.faq-grid .text-link{margin-top:25px;font-size:14px}
.faq-list{border-top:1px solid var(--line)}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:14px;font-weight:800;padding:20px 0;line-height:1.65}
summary::-webkit-details-marker{display:none}
summary .icon{width:17px;height:17px;transition:transform .2s}
details[open]>summary .icon{transform:rotate(45deg)}
details p{font-size:14px;line-height:1.9;padding-bottom:20px;max-width:96%}
.last-cta{padding:42px 0;background:var(--ink);color:#fff}
.last-cta .container{display:flex;justify-content:space-between;align-items:center;gap:35px}
.last-cta .eyebrow{color:#bdbcb8;font-size:14px;margin-bottom:10px}
.last-cta h2{font-size:29px;letter-spacing:-.035em}
.last-cta .btn{white-space:nowrap}
.footer{background:#fff;padding:60px 0 24px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.1fr;gap:40px;margin-bottom:46px}
.footer-brand{width:190px;margin-bottom:20px}
.footer p{font-size:14px;line-height:1.85;margin:14px 0}
.footer h3{font-size:14px;letter-spacing:0;margin:10px 0 20px}
.footer-grid>div>a:not(.brand){display:block;font-size:14px;color:var(--muted);margin-bottom:10px}
.footer-grid a:hover{color:var(--red)}
.footer-grid>div>a.footer-phone{font-size:23px;font-weight:800;letter-spacing:-.04em;color:var(--ink);margin-bottom:4px}
.company{padding-top:25px;border-top:1px solid var(--line);display:flex;gap:20px;flex-wrap:wrap;font-size:14px;color:var(--muted)}
.company strong{color:var(--ink)}
.footer p.registry{font-size:14px;margin:8px 0 23px}
.footer-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;gap:20px;font-size:14px;color:var(--muted)}
.mobile-bar{display:none}
.notice{padding:14px 17px;background:#fcf6e9;border:1px solid #eddfc4;border-radius:7px;font-size:14px;line-height:1.8;color:#72551f;margin-block:15px}
.breadcrumbs{display:flex;gap:12px;font-size:14px;color:var(--muted);margin-bottom:28px}
.breadcrumbs a:hover{color:var(--red)}
.config-main{background:var(--paper);padding:30px 0 72px}
.config-heading{display:flex;justify-content:space-between;gap:30px;align-items:flex-end;margin-bottom:32px}
.config-heading h1{font-size:38px;letter-spacing:-.05em}
.config-heading .eyebrow{font-size:14px;margin-bottom:11px}
.config-heading p{font-size:14px;margin-top:15px}
.config-heading .text-link{font-size:14px;white-space:nowrap;margin-bottom:4px}
.config-layout{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:30px;align-items:start}
.config-editor{min-width:0}
.config-steps{display:flex;gap:2px;background:#ecece6;padding:5px;border-radius:10px;margin-bottom:20px}
.config-steps button{display:flex;align-items:center;justify-content:center;gap:9px;flex:1;padding:12px 5px;font-size:14px;font-weight:800;border-radius:6px;color:var(--muted)}
.config-steps button > .step-index{display:grid;place-items:center;border:1px solid #c6c7c0;border-radius:50%;width:23px;height:23px;font-size:14px}
.config-steps button.active{background:#fff;box-shadow:0 2px 6px #00000008;color:var(--ink)}
.config-steps button.active > .step-index{background:var(--red);border-color:var(--red);color:#fff}
.config-steps button.completed > .step-index{background:var(--green);color:#fff;border-color:var(--green)}
.config-panel{padding:30px;background:white;border:1px solid var(--line);border-radius:12px}
.panel-heading{display:flex;align-items:flex-start;gap:15px;margin-bottom:27px}
.section-number{font-size:14px;padding-top:5px;font-weight:800;color:var(--red)}
.panel-heading h2{font-size:24px;letter-spacing:-.035em}
.panel-heading p{font-size:14px;margin-top:9px}
.material-options{display:grid;gap:9px}
.material-option{position:relative;display:flex;align-items:center;gap:12px;padding:15px 16px;border:1px solid var(--line);border-radius:8px;cursor:pointer;transition:border-color .2s,background .2s}
.material-option:has(input:checked){border-color:var(--red);background:#fff8f9;box-shadow:0 0 0 1px var(--red)}
.material-option input{position:absolute;opacity:0;width:1px;height:1px}
.material-option:has(input:focus-visible){outline:3px solid #247bad;outline-offset:3px}
.radio-check{width:17px;height:17px;border-radius:50%;border:1px solid #b5b5ae;flex-shrink:0}
.material-option input:checked+.radio-check{border:5px solid var(--red)}
.option-body{flex:1;min-width:0}
.option-body>strong{display:flex;align-items:center;gap:9px;font-size:14px;letter-spacing:.01em}
.option-body em{font-style:normal;font-size:14px;color:var(--red);background:#f9e2e7;border-radius:4px;padding:2px 6px;letter-spacing:0}
.option-body>small{display:block;font-size:14px;color:var(--muted);font-weight:500;margin-top:3px}
.option-price{font-size:21px;font-weight:800;line-height:1.3;letter-spacing:-.04em;text-align:right}
.option-price small{display:block;font-size:14px;color:var(--muted);font-weight:500;letter-spacing:0}
.selected-material-note{font-size:14px;color:var(--muted);padding:12px 3px;line-height:1.8}
.subheading{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:19px 0 15px}
.subheading h3{font-size:17px}
.subheading span{font-size:14px;color:var(--muted)}
.presets{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:18px}
.presets button{border:1px solid var(--line);border-radius:5px;font-size:14px;padding:7px 13px;min-height:34px;font-weight:700}
.presets button[aria-pressed=true]{border-color:var(--ink);background:var(--ink);color:white}
.presets button:hover{border-color:var(--red)}
.dimensions{display:grid;grid-template-columns:1fr 12px 1fr 1.12fr;gap:10px;align-items:end}
.dimension-x{height:44px;display:grid;place-items:center;color:#aaa}
.input-unit{position:relative}
.input-unit input{padding-right:35px;font-size:17px;font-weight:800;height:47px}
.input-unit>span{position:absolute;right:13px;bottom:13px;color:var(--muted);font-size:14px;font-weight:500}
.input-unit input::-webkit-inner-spin-button{appearance:none}
.qty-label{margin-left:6px}
.stepper{display:flex;align-items:center;margin-top:7px;border:1px solid #dcdcd6;border-radius:6px;height:47px;overflow:hidden}
.stepper input{border:0!important;padding:7px 0!important;text-align:center;font-size:16px!important;font-weight:800!important;margin:0!important;appearance:textfield;-moz-appearance:textfield;width:42px;flex:1;border-radius:0}
.stepper input::-webkit-inner-spin-button{appearance:none}
.stepper button{padding:0 9px;height:100%;font-size:19px;flex-shrink:0}
.stepper button:hover{background:var(--paper)}
.dimension-help{font-size:14px;margin:9px 0 4px}
.finish-info{display:flex;align-items:flex-start;gap:11px;background:var(--paper);border-radius:7px;padding:15px;margin:23px 0}
.finish-info>.icon{width:18px;height:18px;color:var(--green);margin-top:2px}
.finish-info strong{font-size:14px;display:block}
.finish-info span{display:block;font-size:14px;color:var(--muted);margin:3px 0}
.finish-info a{font-size:14px;text-decoration:underline;text-underline-offset:3px}
.logo-option{display:flex;align-items:center;gap:12px;border:1px solid #f1ced5;border-radius:8px;padding:17px 13px;background:#fff9fa;position:relative;cursor:pointer}
.logo-option>input{position:absolute;opacity:0;width:1px;height:1px}
.logo-option:has(input:focus-visible){outline:3px solid #247bad;outline-offset:3px}
.toggle{width:33px;height:20px;background:#c9c8c4;border-radius:20px;padding:3px;flex-shrink:0;transition:background .2s}
.toggle:after{content:'';display:block;width:14px;height:14px;background:#fff;border-radius:50%;transition:transform .2s}
.logo-option input:checked+.toggle{background:var(--red)}
.logo-option input:checked+.toggle:after{transform:translateX(13px)}
.logo-option strong{display:block;font-size:14px}
.logo-option small{display:block;font-size:14px;font-weight:500;color:var(--muted);margin-top:4px}
.discount-pill{margin-left:auto;background:var(--red-soft);color:var(--red);border-radius:5px;padding:5px 6px;white-space:nowrap;font-size:14px}
.panel-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid var(--line);padding-top:22px;margin-top:26px}
.panel-bottom>span{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:14px}
.panel-bottom>span .icon{width:14px;height:14px}
.panel-bottom .btn{font-size:14px;padding:13px 17px;min-height:47px}
.config-help{display:flex;justify-content:center;align-items:center;gap:10px;font-size:14px;margin-top:21px;color:var(--muted)}
.config-help .icon{width:15px;height:15px}
.config-help a{font-weight:800;color:var(--ink)}
.config-summary{position:sticky;top:112px;border:1px solid var(--line);border-radius:12px;background:white;padding:24px;min-width:0}
.summary-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.summary-head h2{font-size:18px;letter-spacing:-.025em}
.summary-head .tag{background:var(--paper);color:var(--muted);font-weight:600}
.preview-stage{height:207px;display:flex;align-items:center;justify-content:center;padding:28px 28px 16px 35px;position:relative;border-radius:8px;background-color:#f0f0eb;background-image:radial-gradient(#cfcec7 .7px,transparent .7px);background-size:12px 12px;overflow:hidden}
.preview-width{position:absolute;top:8px;left:0;right:0;text-align:center;font-size:14px;color:var(--muted)}
.preview-height{position:absolute;left:7px;top:50%;writing-mode:vertical-rl;transform:rotate(180deg) translateY(50%);font-size:14px;color:var(--muted)}
.banner-preview{position:relative;aspect-ratio:3/1;width:100%;max-height:158px;background:#ebe5d4;border:1px solid #c4c0b6;box-shadow:3px 7px 10px #00000015;overflow:hidden;container-type:size}
.preview-default{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#315540;padding:8%;gap:5%;background:linear-gradient(115deg,#ece7d8,#f8f5e9)}
.preview-default>span:first-child{font-size:clamp(5px,3.5cqw,12px);font-weight:600;letter-spacing:.16em}
.preview-default strong{font-size:clamp(6px,6cqw,23px);line-height:1.1;letter-spacing:-.05em;white-space:nowrap}
.preview-default>span:last-child{font-size:clamp(4px,2.5cqw,8px);letter-spacing:.14em}
.banner-preview[data-material=MESH] .preview-default{background-color:#e9edeb;background-image:radial-gradient(#99a8a3 .6px,transparent .7px);background-size:4px 4px}
.banner-preview[data-material=REFLEX] .preview-default{background:linear-gradient(120deg,#b7b8b0,#fafbe2 45%,#c1c5b6)}
.banner-preview>img#artwork-preview{position:absolute;width:100%;height:100%;inset:0;object-fit:contain;background:white}
.banner-preview>#preview-logo{position:absolute;right:3%;bottom:9%;width:19%;height:auto;z-index:3;background:#fff;padding:1%;max-height:15%}
.safe-zone{position:absolute;inset:5%;z-index:2;border:1px dashed #c8102e;box-shadow:0 0 0 100px #c8102e10;pointer-events:none}
.eyelets{position:absolute;inset:0;pointer-events:none;z-index:4}
.eyelets i{position:absolute;width:5px;height:5px;border:1px solid #969991;border-radius:50%;background:#f5f4eb;transform:translate(-50%,-50%);box-shadow:0 0 0 1px #00000009}
.preview-disclaimer{font-size:14px;line-height:1.7;margin:9px 0 16px}
.summary-details{padding-bottom:16px;border-bottom:1px solid var(--line);display:grid;gap:5px}
.summary-details>div{display:flex;justify-content:space-between;gap:8px;font-size:14px}
.summary-details span{color:var(--muted)}
.price-breakdown{display:grid;gap:7px;margin:18px 0}
.price-breakdown>div{display:flex;justify-content:space-between;gap:12px;font-size:14px}
.price-breakdown dt{color:var(--muted)}
.price-breakdown dd{margin:0;font-weight:700;white-space:nowrap}
.green-text,#price-tier,#price-logo{color:var(--green)}
.total-row{border-top:1px solid var(--line);padding-top:19px;display:flex;justify-content:space-between;align-items:flex-end}
.total-row>div>span{font-size:14px;display:block}
.total-row strong{display:block;font-size:39px;letter-spacing:-.055em;line-height:1.25;margin-top:4px}
.total-row>span{font-size:14px;color:var(--muted);padding-bottom:6px}
.vat-price{font-size:14px;margin-top:4px}
.summary-extras{font-size:14px;margin-top:16px;line-height:1.8}
.saving-note{background:#edf5ee;color:var(--green);font-size:14px;padding:10px 12px;border-radius:5px;margin-top:15px;font-weight:700}
.tier-details{margin-top:10px}
.tier-details summary{font-size:14px;padding:15px 0}
.tier-details summary .icon{width:13px;height:13px}
.tier-details p{font-size:14px;padding-bottom:12px}
.tier-mini{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin-bottom:12px}
.tier-mini>span{font-size:14px;background:var(--paper);padding:6px 8px;display:flex;justify-content:space-between}
.artwork-options{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.artwork-options label{position:relative;cursor:pointer}
.artwork-options input{position:absolute;top:13px;right:12px;accent-color:var(--red);width:14px;height:14px}
.artwork-options label>span{display:block;border:1px solid var(--line);border-radius:8px;padding:18px 13px;min-height:135px}
.artwork-options input:checked+span{border-color:var(--red);background:#fff7f8;box-shadow:0 0 0 1px var(--red)}
.artwork-options .icon{display:block;margin-bottom:15px;color:var(--red);width:21px;height:21px}
.artwork-options strong{display:block;font-size:14px}
.artwork-options small{display:block;font-size:14px;color:var(--muted);font-weight:400;margin-top:4px}
.input-hint{font-size:14px;margin:10px 0 22px;line-height:1.8}
.config-panel>label{margin:18px 0}
.config-panel>.form-row{margin-bottom:17px}
.data-tips{padding:20px;background:var(--paper);border-radius:8px;margin-top:25px;display:flex;gap:15px}
.data-tips>.icon{color:var(--red);width:24px;height:24px}
.data-tips strong{font-size:14px}
.data-tips p{font-size:14px;margin:5px 0 12px}
.data-tips a{font-size:14px}
.preview-controls{display:flex;gap:12px;align-items:center;margin-top:12px}
.preview-controls label{font-size:14px;flex:1;color:var(--muted)}
.preview-controls select{font-size:14px;padding:5px 6px;margin-top:4px}
.preview-controls .check-label{display:flex;align-items:center;gap:5px;justify-content:flex-end}
.check-label input{accent-color:var(--red)}
.config-mobile-bar{display:none}
.document-page{padding-top:32px;padding-bottom:80px}
.document-page h1{max-width:850px;font-size:48px;line-height:1.2;margin-bottom:23px}
.document-lead{font-size:17px;max-width:690px;line-height:1.9}
.guide-nav{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.guide-nav a{border:1px solid var(--line);padding:10px 16px;border-radius:7px;font-size:14px;font-weight:700}
.guide-nav a:hover{border-color:var(--red);color:var(--red)}
.document-section{padding-top:60px;margin-top:35px;border-top:1px solid var(--line);scroll-margin-top:25px}
.document-section h2{font-size:32px;line-height:1.3;margin-bottom:25px}
.document-section h3{font-size:20px;margin-top:22px;margin-bottom:15px}
.document-section p{font-size:14px;line-height:1.9;margin:15px 0;max-width:920px}
.document-section li{font-size:14px;color:var(--muted);line-height:1.9;margin-bottom:6px}
.document-section p a{color:var(--red);text-decoration:underline}
.guide-columns{display:grid;grid-template-columns:1fr 1fr;gap:65px;margin:25px 0}
.table-scroll{overflow:auto;border:1px solid var(--line);border-radius:10px}
.table-scroll table{width:100%;border-collapse:collapse;text-align:left;font-size:14px;min-width:730px}
.table-scroll caption{text-align:left;font-weight:800;padding:16px;background:var(--paper);font-size:14px}
.table-scroll th,.table-scroll td{padding:16px;border-bottom:1px solid var(--line);vertical-align:top}
.table-scroll thead{background:var(--ink);color:white}
.table-scroll tbody th{font-size:14px}
.table-scroll tbody tr:last-child td,.table-scroll tbody tr:last-child th{border-bottom:0}
.table-scroll td{color:var(--muted);font-size:14px}
.document-section p.small{font-size:14px}
.privacy-page{max-width:940px}
.privacy-page .document-section h2{font-size:25px;margin-top:35px;margin-bottom:15px}
.privacy-page .document-section{padding-top:10px}
.not-found{padding-block:100px}
.not-found p{margin:25px 0}
.not-found h1{font-size:50px}
dialog{border:1px solid var(--line);border-radius:16px;padding:28px;max-width:610px;width:calc(100% - 32px);max-height:85dvh;color:var(--ink);box-shadow:0 20px 100px #0003}
dialog::backdrop{background:#20232299;backdrop-filter:blur(3px)}
.dialog-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.dialog-head .eyebrow{margin:0;font-size:14px}
.icon-button{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;background:var(--paper)}
dialog h2{font-size:29px;margin-bottom:15px}
dialog>p{font-size:14px;line-height:1.9}
dialog>small{display:block;color:var(--muted);font-size:14px;margin-top:15px}
.review-list{margin:22px 0;font-size:14px}
.review-list>div{display:grid;grid-template-columns:130px 1fr;gap:15px;border-bottom:1px solid var(--line);padding:9px 0}
.review-list dt{color:var(--muted)}
.review-list dd{margin:0;font-weight:600;overflow-wrap:anywhere;white-space:pre-wrap}
.dialog-actions{display:flex;gap:10px;flex-wrap:wrap}
.dialog-actions .btn{font-size:14px}
body.dialog-open{overflow:hidden}

@media(min-width:1550px){.hero{padding-block:80px}
.hero-photo{min-height:505px}
.hero-photo>img{max-height:500px}
.hero h1{font-size:68px}
}

@media(max-width:1200px){.header-inner{gap:24px}
.header nav{gap:19px}
.header-phone{display:none}
.hero-grid{gap:34px}
.hero-ctas{flex-wrap:wrap}
.hero-price{left:-14px;min-width:300px}
.benefit-grid>div{padding-inline:16px;gap:10px}
.material-body{padding:20px 15px}
.material-body h3{font-size:18px}
.material-top{align-items:flex-start;flex-direction:column;min-height:40px;gap:4px}
.material-top .eyebrow{margin-top:3px}
.material-price{gap:5px}
.material-price strong{font-size:27px}
.material-price>span{font-size:14px}
.quote-grid{gap:55px}
.discount-banner{gap:30px;padding:35px}
.discount-number{font-size:76px}
.discount-number>span:first-child{font-size:39px}
.discount-copy h2{font-size:27px}
.config-layout{gap:20px}
.config-panel{padding:23px}
.config-summary{padding:20px}
.option-body em{display:none}
.panel-bottom>span{max-width:125px}
.config-heading h1{font-size:34px}
.dimensions{gap:7px}
.stepper button{padding-inline:7px}
}

@media(max-width:950px){.container{width:calc(100% - 40px)}
.header-inner{height:76px;gap:20px}
.brand{width:180px}
.header nav{gap:17px}
.header nav a{font-size:14px}
.header-actions .btn{font-size:14px;padding-inline:12px}
.hero{padding-top:45px;padding-bottom:40px}
.hero h1{font-size:43px}
.hero-copy>p{font-size:14px}
.hero-photo{min-height:430px}
.hero-photo>img{min-height:400px}
.hero-price{min-width:270px;padding:18px;left:-8px;bottom:34px}
.hero-price strong{font-size:33px}
.benefit-grid{grid-template-columns:repeat(2,1fr);gap:24px 30px}
.benefit-grid>div{border:0;padding:0}
.section{padding-block:65px}
.materials-grid{grid-template-columns:repeat(2,1fr);gap:22px}
.material-visual{height:175px}
.mini-banner{width:63%;height:90px}
.material-body{padding:24px}
.material-top{flex-direction:row;align-items:center;min-height:0}
.material-body h3{font-size:23px;min-height:0}
.material-spec{font-size:14px}
.checklist{font-size:14px}
.material-price strong{font-size:32px}
.material-price>span{font-size:14px}
.material-body .btn{font-size:14px}
.use-grid{grid-template-columns:repeat(2,1fr)}
.discount-banner{grid-template-columns:.65fr 1.5fr;gap:25px}
.discount-action{grid-column:2;align-items:flex-start}
.discount-copy h2{font-size:31px}
.discount-number{font-size:86px}
.discount-section{padding-bottom:15px}
.quote-grid{gap:30px;grid-template-columns:.9fr 1.1fr}
.quote-copy h2{font-size:33px}
.quote-form{padding:24px}
.form-heading{align-items:flex-start;flex-direction:column;gap:5px}
.dropzone{padding:13px;gap:9px}
.dropzone>.optional{display:none}
.quote-benefits{font-size:14px}
.quote-contact a{font-size:25px}
.quote-grid .form-row{grid-template-columns:1fr;gap:14px}
.faq-grid{gap:45px}
.last-cta h2{font-size:24px}
.footer-grid{gap:24px}
.footer-grid>div>a.footer-phone{font-size:20px}
.config-layout{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr)}
.config-heading{display:block}
.config-heading .text-link{margin-top:16px}
.config-panel{padding:20px}
.panel-heading{gap:10px}
.panel-heading h2{font-size:21px}
.material-option{padding:12px 10px;gap:8px}
.option-body>small{font-size:14px}
.option-price{font-size:19px}
.dimensions{grid-template-columns:1fr 10px 1fr}
.qty-label{grid-column:1/-1;margin-left:0;max-width:155px;margin-top:9px}
.subheading{display:block}
.subheading h3{margin-bottom:5px}
.presets{gap:5px}
.presets button{font-size:14px;padding:7px 9px}
.logo-option{gap:9px;padding:13px 10px}
.logo-option strong{font-size:14px}
.discount-pill{display:none}
.panel-bottom{flex-wrap:wrap}
.panel-bottom>span{max-width:none}
.panel-bottom .btn-primary{margin-left:auto}
.total-row strong{font-size:32px}
.preview-stage{height:180px;padding-inline:26px 20px}
.banner-preview{max-height:130px}
.config-summary{top:96px;padding:17px}
.artwork-options{grid-template-columns:1fr}
.artwork-options label>span{min-height:0;padding:13px 15px 13px 45px}
.artwork-options .icon{position:absolute;left:15px;top:20px;width:18px;height:18px}
.artwork-options strong{font-size:14px}
.artwork-options small{font-size:14px}
.config-panel .form-row{grid-template-columns:1fr;gap:15px}
.config-help{font-size:14px}
.config-steps button{font-size:14px;gap:6px}
.config-steps button > .step-index{width:20px;height:20px}
.guide-columns{gap:35px}
.document-page h1{font-size:40px}
}

@media(max-width:760px){html{scroll-padding-top:88px}
.container{width:calc(100% - 36px)}
.topbar .container{justify-content:center;min-height:28px}
.topbar .container>span:first-child{display:none}
.topbar{font-size:14px}
.header-inner{height:70px;justify-content:space-between}
.brand{width:178px}
.header-actions{gap:8px}
.header-actions .btn{min-height:37px;padding:10px 12px;font-size:14px;gap:7px}
.header-actions .btn .icon{width:14px;height:14px}
.menu-toggle{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;width:36px;height:40px}
.menu-toggle span{display:block;width:20px;height:1.5px;background:var(--ink);transition:transform .2s}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.75px) rotate(45deg)}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.75px) rotate(-45deg)}
.header nav{display:none;position:absolute;top:70px;left:0;right:0;background:white;padding:14px 25px 24px;box-shadow:0 15px 20px #0000000a;border-bottom:1px solid var(--line)}
.header nav.open{display:flex;flex-direction:column;gap:0}
.header nav a{font-size:14px;border-bottom:1px solid var(--line);padding:14px 0}
.hero{padding:38px 0 25px}
.hero-grid{grid-template-columns:1fr;gap:30px}
.hero h1{font-size:clamp(40px,8.4vw,60px);line-height:1.08;margin-bottom:22px}
.hero-copy>p{font-size:14px;max-width:530px}
.hero-ctas{margin-top:25px;flex-wrap:nowrap;gap:8px}
.hero-ctas .btn{font-size:14px;flex:1;padding:14px 11px;gap:8px;min-height:50px}
.hero-photo{min-height:0;height:355px;padding-bottom:33px;margin-left:12px}
.hero-photo>img{min-height:0;height:100%;max-height:none;object-position:50% 50%;border-radius:12px}
.hero-price{left:-12px;bottom:28px;padding:16px 18px;min-width:250px;gap:24px;border-radius:10px}
.hero-price strong{font-size:30px;line-height:1.2}
.hero-price>div>span{font-size:14px}
.hero-price strong small{font-size:14px}
.hero-price>a{width:35px;height:35px}
.image-caption{bottom:5px;font-size:14px}
.benefit-grid{padding-block:22px;gap:21px 18px}
.benefit-grid strong{font-size:14px}
.benefit-grid span{font-size:14px}
.benefit-grid .icon{width:23px;height:23px}
.benefit-grid>div{gap:10px}
.section{padding-block:51px}
.section-head{display:block;margin-bottom:27px}
.eyebrow{font-size:14px;margin-bottom:12px}
h2{font-size:32px}
.section-head>p{margin-top:17px;font-size:14px}
.section-head>p br{display:none}
.materials-grid{gap:13px}
.material-visual{height:125px}
.mini-banner{width:75%;height:61px}
.mini-banner span{font-size:15px}
.material-visual>.icon{width:16px;height:16px;bottom:9px;right:9px}
.material-body{padding:17px 13px}
.material-top{flex-direction:column;align-items:flex-start;min-height:38px;gap:2px;margin-bottom:11px}
.material-top .eyebrow{font-size:14px}
.material-top .tag{font-size:14px;padding:2px 5px}
.material-body h3{font-size:17px;min-height:40px;line-height:1.2}
.material-spec{font-size:14px;margin:9px 0 15px}
.checklist{font-size:14px;margin-bottom:15px}
.checklist .icon{width:11px;height:11px}
.checklist li{gap:4px;align-items:flex-start;line-height:1.6}
.material-price{display:block;padding-top:12px;margin-bottom:13px}
.material-price strong{font-size:29px;line-height:1.3;display:block}
.material-price strong span{font-size:15px}
.material-price>span{font-size:14px}
.material-body .btn{font-size:14px;padding:10px 9px;gap:4px;min-height:42px}
.material-body .btn .icon{width:14px;height:14px}
.under-cards{flex-direction:column;align-items:flex-start;gap:13px;margin-top:20px}
.under-cards>span{font-size:14px}
.under-cards .text-link{font-size:14px}
.use-grid{gap:13px}
.use-card{padding:20px 15px}
.use-icon{width:38px;height:38px;margin-bottom:20px}
.use-card h3{font-size:16px;line-height:1.25}
.use-card p{font-size:14px;min-height:45px}
.use-bottom{font-size:14px;margin-top:18px;gap:4px}
.use-bottom .icon{width:15px;height:15px}
.discount-section{padding-bottom:10px}
.discount-banner{padding:28px 24px;gap:22px;grid-template-columns:1fr}
.discount-number{font-size:72px;letter-spacing:-.07em}
.discount-number>span:first-child{font-size:42px}
.discount-spark{top:0;right:8px;font-size:46px}
.discount-copy h2{font-size:31px}
.discount-copy p{max-width:100%;font-size:14px}
.discount-action{grid-column:auto;align-items:stretch}
.discount-action .btn{font-size:14px}
.discount-copy small{font-size:14px}
.section-head>.text-link{margin-top:20px;font-size:14px}
.quote-grid{grid-template-columns:1fr;gap:30px}
.quote-copy{padding:0}
.quote-copy h2{font-size:35px}
.quote-copy h2 br:nth-child(2){display:none}
.quote-copy>p{font-size:14px;margin-top:18px;max-width:100%}
.quote-benefits{font-size:14px;margin:20px 0}
.quote-contact{padding-top:20px;max-width:100%;gap:5px}
.quote-contact a{font-size:24px}
.quote-form{padding:24px 20px}
.form-heading{flex-direction:row;align-items:center}
.form-heading h3{font-size:19px}
.form-heading>span{font-size:14px}
.quote-grid .form-row{grid-template-columns:1fr 1fr;gap:12px}
.dropzone{padding:17px 13px}
.dropzone>span{font-size:14px}
.dropzone small{font-size:14px}
.privacy-note{font-size:14px}
.demo-note{font-size:14px}
.faq-grid{grid-template-columns:1fr;gap:26px}
.faq-grid>div>p{font-size:14px;margin-top:15px}
.faq-grid h2 br{display:none}
.faq-grid .text-link{margin-top:15px}
.faq-list summary{font-size:14px;padding-block:18px}
.faq-list details p{font-size:14px}
.last-cta{padding:32px 0}
.last-cta .container{display:block}
.last-cta h2{font-size:28px;line-height:1.25;max-width:340px}
.last-cta .btn{margin-top:22px;font-size:14px;min-height:48px}
.footer{padding-top:38px;padding-bottom:95px}
.footer-grid{grid-template-columns:1fr 1fr;gap:30px 20px;margin-bottom:28px}
.footer-grid>div:first-child{grid-column:1/-1}
.footer-brand{width:190px}
.footer-grid>div:last-child{grid-column:1/-1;border-top:1px solid var(--line);padding-top:12px}
.footer-grid>div>a:not(.brand){font-size:14px}
.footer-grid>div>a.footer-phone{font-size:26px}
.footer-grid h3{margin-bottom:17px}
.footer p{font-size:14px}
.company{flex-direction:column;gap:5px;font-size:14px;padding-top:20px}
.footer p.registry{font-size:14px}
.footer-bottom{font-size:14px;gap:10px;flex-wrap:wrap}
.footer-bottom>span:nth-child(2){display:none}
.mobile-bar{display:grid;grid-template-columns:1fr 1.1fr;gap:9px;position:fixed;z-index:35;bottom:0;left:0;right:0;padding:10px 18px calc(10px + env(safe-area-inset-bottom));background:#fffffff7;backdrop-filter:blur(10px);box-shadow:0 -2px 15px #00000007;border-top:1px solid var(--line)}
.mobile-bar .btn{font-size:14px;min-height:44px;padding:11px 10px;gap:8px}
.config-main{padding:20px 0 45px}
.breadcrumbs{font-size:14px;margin-bottom:23px}
.config-heading{margin-bottom:23px}
.config-heading h1{font-size:32px;line-height:1.15}
.config-heading p{font-size:14px;line-height:1.8;margin-top:12px}
.config-heading .text-link{font-size:14px;margin-top:14px}
.config-layout{grid-template-columns:1fr;gap:24px}
.config-steps{position:sticky;top:70px;z-index:20;margin-bottom:15px;border-radius:8px}
.config-steps button{padding-block:12px;font-size:14px}
.config-panel{padding:23px 19px}
.panel-heading h2{font-size:22px}
.panel-heading p{font-size:14px}
.panel-heading{gap:10px;margin-bottom:22px}
.material-option{padding:15px 12px;gap:10px}
.option-body>strong{font-size:14px}
.option-body em{display:inline-block;font-size:14px}
.option-body>small{font-size:14px}
.option-price{font-size:23px}
.selected-material-note{font-size:14px;padding:12px 0}
.subheading{margin-top:16px}
.subheading h3{font-size:17px}
.subheading span{font-size:14px}
.dimensions{grid-template-columns:1fr 10px 1fr 1.12fr;gap:8px}
.qty-label{grid-column:auto;max-width:none;margin-top:0;margin-left:4px}
.dimensions>label{font-size:14px}
.input-unit input{font-size:16px;padding-left:10px;padding-right:28px}
.input-unit span{right:9px;font-size:14px}
.stepper button{padding-inline:7px;font-size:18px}
.stepper input{width:25px;font-size:14px!important}
.presets{gap:6px}
.presets button{padding:8px 10px;font-size:14px}
.logo-option{padding:16px 12px;gap:12px}
.logo-option strong{font-size:14px}
.logo-option small{font-size:14px}
.panel-bottom{gap:17px}
.panel-bottom>span{font-size:14px;flex:1}
.panel-bottom .btn{font-size:14px;padding:13px}
.config-help{font-size:14px;gap:7px}
.config-summary{position:relative;top:auto;padding:23px}
.summary-head h2{font-size:20px}
.preview-stage{height:225px;padding:30px 28px 17px 35px}
.banner-preview{max-height:175px}
.preview-width,.preview-height{font-size:14px}
.preview-disclaimer{font-size:14px;margin-top:11px}
.summary-details>div{font-size:14px}
.price-breakdown>div{font-size:14px}
.total-row strong{font-size:41px}
.total-row>div>span{font-size:14px}
.summary-extras{font-size:14px}
.tier-details summary{font-size:14px}
.tier-details p{font-size:14px}
.config-mobile-bar{display:flex;position:fixed;bottom:0;left:0;right:0;background:#fff;box-shadow:0 -2px 15px #00000008;border-top:1px solid var(--line);padding:10px 18px calc(10px + env(safe-area-inset-bottom));align-items:center;justify-content:space-between;gap:18px;z-index:35}
.config-mobile-bar strong{font-size:22px;line-height:1.3;letter-spacing:-.04em;display:block}
.config-mobile-bar small{font-size:14px;color:var(--muted);display:block}
.config-mobile-bar .btn{min-height:44px;font-size:14px;padding:12px 20px}
.config-panel .form-row{grid-template-columns:1fr 1fr;gap:14px}
.artwork-options{grid-template-columns:1fr}
.artwork-options label>span{padding:17px 15px 17px 51px}
.artwork-options .icon{left:17px;top:24px}
.artwork-options input{top:23px;right:17px}
.artwork-options strong{font-size:14px}
.artwork-options small{font-size:14px}
.preview-controls label{font-size:14px}
.preview-controls select{font-size:14px}
.document-page{padding-top:25px;padding-bottom:55px}
.document-page h1{font-size:34px}
.document-lead{font-size:14px}
.guide-nav{gap:8px}
.guide-nav a{font-size:14px;padding:9px 11px}
.document-section{padding-top:35px;margin-top:35px}
.document-section h2{font-size:27px;line-height:1.3}
.document-section p{font-size:14px}
.guide-columns{grid-template-columns:1fr;gap:10px;margin:10px 0}
.document-section li{font-size:14px}
.table-scroll{margin-inline:-2px}
.document-section h3{font-size:20px}
.document-section .btn{font-size:14px}
.privacy-page .document-section h2{font-size:23px}
.not-found h1{font-size:35px}
.not-found{padding-block:60px}
dialog{padding:22px 19px}
dialog h2{font-size:25px}
.review-list>div{grid-template-columns:95px 1fr;gap:10px;font-size:14px}
.dialog-actions .btn{flex:1;padding-inline:10px;gap:7px;font-size:14px}
}

@media(max-width:370px){.container{width:calc(100% - 28px)}
.brand{width:151px}
.header-actions .btn{font-size:14px;padding-inline:9px}
.header-actions .btn .icon{display:none}
.header-inner{gap:10px}
.hero h1{font-size:38px}
.hero-ctas .btn{font-size:14px;padding-inline:8px}
.hero-photo{height:310px}
.material-body{padding:15px 11px}
.material-body h3{font-size:15px}
.material-body .btn{font-size:14px}
.mini-banner{height:54px}
.mini-banner span{font-size:14px}
.checklist{font-size:14px}
.material-top .tag{font-size:14px}
.material-visual{height:110px}
.form-row,.quote-grid .form-row,.config-panel .form-row{grid-template-columns:1fr}
.form-heading{flex-direction:column;align-items:flex-start}
.dimensions{grid-template-columns:1fr 10px 1fr}
.qty-label{grid-column:1/-1;max-width:140px;margin:8px 0 0}
.option-body em{display:none}
.option-body>small{font-size:14px}
.config-panel{padding:20px 15px}
.panel-heading h2{font-size:20px}
.panel-bottom>span{display:none}
.config-mobile-bar strong{font-size:20px}
.mobile-bar .btn{font-size:14px}
.footer-bottom{font-size:14px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*,*:before,*:after{transition:none!important;animation:none!important}
}

@media print{.header,.topbar,.footer,.mobile-bar,.config-mobile-bar,.config-steps,.panel-bottom,.config-help{display:none!important}
body{font-size:11pt}
.config-layout{display:block}
.config-summary{position:static;break-inside:avoid;margin-top:20px}
.config-panel{break-inside:avoid}
.container{width:100%}
.config-main{padding:0}
a[href^=http]:after{content:' (' attr(href) ')';font-size:9pt}
.hero-photo{height:300px}
.section{padding-block:25px}
}

/* Final readability and touch refinements. */
.header-actions .btn{white-space:nowrap}
.quote-copy h2 span{display:block}
.file-list button{width:44px;height:44px}
.file-list li{font-size:14px}
.file-list small{font-size:14px}
.config-panel .dropzone small{font-size:14px}
.config-panel .dropzone>span{font-size:14px}
.config-panel .input-hint{font-size:14px}
.config-panel .privacy-note{font-size:14px}
.config-panel .data-tips p{font-size:14px}
.config-panel .data-tips a{font-size:14px}
.config-panel .data-tips strong{font-size:14px}
.price-breakdown>div{font-size:14px}
.summary-details>div{font-size:14px}
.summary-extras{font-size:14px}
.preview-disclaimer{font-size:14px}
.option-body>small{font-size:14px}
.selected-material-note{font-size:14px}
.dimension-help{font-size:14px}
.finish-info strong{font-size:14px}
.finish-info span{font-size:14px}
.finish-info a{font-size:14px}
.logo-option strong{font-size:14px}
.logo-option small{font-size:14px}
.panel-heading p{font-size:14px}
.config-steps button{font-size:14px}
.panel-bottom .btn{font-size:14px}
.preview-controls label{font-size:14px}
.preview-controls select{font-size:14px}
.config-help{font-size:14px}
.tier-details summary{font-size:14px}
.tier-details p{font-size:14px}
.artwork-options strong{font-size:14px}
.artwork-options small{font-size:14px}
.input-hint{font-size:14px}
.quote-form label{font-size:14px}
.quote-form .optional{font-size:14px}
.quote-form .dropzone>span{font-size:14px}
.quote-form .dropzone small{font-size:14px}
.quote-form>small{font-size:14px}
.quote-form .privacy-note{font-size:14px}
.quote-form .demo-note{font-size:14px}

@media(max-width:950px) and (min-width:761px){.option-body>small{font-size:14px}
.option-body>strong{font-size:14px}
.config-panel .dropzone{align-items:flex-start}
.price-breakdown>div,.summary-details>div{font-size:14px}
.config-steps button{font-size:14px}
}

@media(max-width:760px){.header-inner{gap:12px}
.header .brand{width:165px}
.header-actions{gap:4px}
.header-actions .btn{font-size:14px;min-height:42px;padding:10px 12px}
.header-actions .btn .icon{display:none}
.menu-toggle{width:44px;height:44px}
.benefit-grid strong{font-size:14px}
.benefit-grid span{font-size:14px}
.benefit-grid>div{align-items:flex-start}
.material-body .btn{min-height:44px}
.quote-copy h2 br:nth-child(2){display:block}
.form-heading>span{font-size:14px}
.form-heading{flex-wrap:wrap}
form label,.quote-form label{font-size:14px}
.optional,.quote-form .optional{font-size:14px}
input:not([type=checkbox],[type=radio],[type=file]),textarea,select{font-size:16px;min-height:46px}
input::placeholder,textarea::placeholder{font-size:14px}
.quote-form .dropzone>span{font-size:14px}
.quote-form .dropzone small{font-size:14px}
.quote-form .demo-note{font-size:14px}
.quote-form .privacy-note{font-size:14px}
.quote-form>small{font-size:14px}
.quote-benefits{font-size:14px}
.quote-contact>span{font-size:14px}
.quote-copy>p{font-size:14px}
.quote-form>.btn{font-size:14px}
.faq-list summary{font-size:14px}
.faq-list details p{font-size:14px}
.footer p,.footer-grid>div>a:not(.brand){font-size:14px}
.footer-grid h3{font-size:14px}
.company{font-size:14px}
.footer p.registry{font-size:14px}
.footer-bottom{font-size:14px}
.config-steps button{font-size:14px}
.config-steps button > .step-index{width:23px;height:23px}
.config-panel{padding:23px 18px}
.option-body>strong{font-size:14px}
.option-body>small{font-size:14px}
.option-body em{display:none}
.option-price small{font-size:14px}
.material-option{padding:15px 12px}
.subheading span{font-size:14px}
.presets button{min-height:44px;font-size:14px;padding:9px 11px}
.dimensions>label{font-size:14px}
.stepper input{font-size:16px!important}
.stepper button{min-width:28px}
.input-unit span{font-size:14px}
.dimension-help{font-size:14px}
.field-error{font-size:14px}
.panel-bottom{align-items:stretch}
.panel-bottom>span{font-size:14px;line-height:1.7}
.panel-bottom .btn{font-size:14px}
.config-help{font-size:14px;align-items:flex-start}
.config-help span{max-width:270px}
.config-help .icon{margin-top:3px}
.config-panel .form-row{grid-template-columns:1fr}
.summary-head .tag{font-size:14px}
.summary-details>div,.price-breakdown>div{font-size:14px}
.total-row>div>span{font-size:14px}
.total-row>span,.vat-price{font-size:14px}
.summary-extras{font-size:14px}
.saving-note{font-size:14px}
.tier-details summary{font-size:14px}
.tier-details p,.tier-mini>span{font-size:14px}
.artwork-options strong{font-size:14px}
.artwork-options small{font-size:14px}
.config-panel .demo-note{font-size:14px}
.config-panel .dropzone small{font-size:14px}
.preview-controls{align-items:flex-end}
.preview-controls label{font-size:14px}
.preview-controls select{font-size:16px}
.preview-controls .check-label{padding-bottom:10px}
.config-mobile-bar .btn{font-size:14px}
.config-mobile-bar small{font-size:14px}
.use-card h3{font-size:17px}
.use-card p{font-size:14px;min-height:60px}
.use-bottom{font-size:14px}
.discount-copy p{font-size:14px}
.discount-copy small,.discount-action>span{font-size:14px}
.notice{font-size:14px}
.document-section p{font-size:14px}
.document-section li{font-size:14px}
.review-list>div{font-size:14px}
.dialog-actions .btn{font-size:14px}
.under-cards>span{font-size:14px}
.under-cards .text-link{font-size:14px}
.mobile-bar .btn{font-size:14px}
}

@media(max-width:550px){.materials-grid{grid-template-columns:1fr;gap:18px}
.material-card{display:grid;grid-template-columns:84px minmax(0,1fr)}
.material-visual{height:100%;min-height:280px;border-radius:0;overflow:hidden}
.mini-banner{width:95px;flex-shrink:0;height:52px;transform:perspective(600px) rotateY(-22deg) rotateZ(-90deg)}
.mini-banner span{font-size:14px}
.material-visual>.icon{bottom:20px;right:31px;width:22px;height:22px}
.material-body{padding:21px 18px}
.material-top{flex-direction:row;align-items:center;min-height:0;margin-bottom:14px}
.material-top .eyebrow{font-size:14px}
.material-top .tag{font-size:14px}
.material-body h3{font-size:22px;min-height:0;line-height:1.2}
.material-spec{font-size:14px;margin-top:12px;margin-bottom:15px}
.checklist{font-size:14px;margin-bottom:15px}
.checklist li{gap:6px;margin-block:8px}
.checklist .icon{width:14px;height:14px}
.material-price{display:flex;align-items:baseline;gap:7px;margin-bottom:15px}
.material-price strong{font-size:30px}
.material-price>span{font-size:14px}
.material-body .btn{font-size:14px;padding-inline:12px}
.material-body .btn .icon{width:16px;height:16px}
.hero-ctas .btn{font-size:14px}
.quote-grid .form-row{grid-template-columns:1fr}
.quote-copy h2{font-size:34px}
.form-heading h3{font-size:21px}
.option-body>small{font-size:14px}
.panel-bottom>span{display:none}
.panel-bottom .btn-primary{flex:1}
.subheading span{font-size:14px}
}

@media(max-width:370px){.header .brand{width:148px}
.header-actions .btn{font-size:14px;padding:9px}
.header-inner{gap:5px}
.header-actions{gap:0}
.material-card{grid-template-columns:68px minmax(0,1fr)}
.material-body{padding:18px 14px}
.material-body h3{font-size:20px}
.material-top{align-items:flex-start;flex-direction:column;gap:5px}
.material-visual>.icon{right:23px}
.hero h1{font-size:37px}
.hero-ctas .btn{font-size:14px}
.benefit-grid{gap:18px 12px}
.benefit-grid strong{font-size:14px}
.benefit-grid span{font-size:14px}
.option-body>small{font-size:14px}
.config-steps button{font-size:14px}
.mobile-bar .btn{font-size:14px}
.use-card p{font-size:14px}
.use-bottom{font-size:14px}
}

.total-row strong.compact-price{font-size:27px;white-space:nowrap}
.config-mobile-bar strong.compact-price{font-size:15px;white-space:nowrap}
.config-mobile-bar>div{min-width:0}
.config-mobile-bar .btn{flex-shrink:0}
.table-scroll:focus-visible{outline:3px solid #247bad;outline-offset:3px}

@media(max-width:370px){.config-mobile-bar{gap:9px;padding-inline:14px}
.config-mobile-bar .btn{padding-inline:12px;font-size:14px}
.config-mobile-bar strong.compact-price{font-size:14px}
.total-row strong.compact-price{font-size:24px}
}

.banner-preview:focus-visible{outline:3px solid #247bad;outline-offset:3px}
.banner-preview.editable-preview{cursor:grab;touch-action:none;user-select:none}
.banner-preview.dragging-artwork{cursor:grabbing}
.banner-preview>#preview-logo{pointer-events:none}
.artwork-adjustments{padding:14px 0 4px}
.artwork-adjustments>label{font-size:14px;display:flex;align-items:center;justify-content:space-between;font-weight:700}
.artwork-adjustments input[type=range]{width:100%;min-height:32px;padding:0;border:0;accent-color:var(--red);margin:4px 0}
.artwork-adjustments>div{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;color:var(--muted)}
.artwork-adjustments button{min-height:36px;color:var(--red);font-size:14px;text-decoration:underline;text-underline-offset:3px;padding:0}
.config-summary:has(.artwork-adjustments:not([hidden])){position:static}

@media(max-width:760px){.artwork-adjustments>label{font-size:14px}
.artwork-adjustments>div{font-size:14px}
.artwork-adjustments button{min-height:44px;font-size:14px}
.artwork-adjustments input[type=range]{min-height:40px}
}


/* Shared visual system: readable text, consistent rhythm and content-led grids. */
:root {
  --ink: #222b2b;
  --muted: #5c6465;
  --paper: #f5f6f3;
  --line: #dce0da;
  --radius: 20px;
  --container: 1320px;
}
body { font-size: 18px; line-height: 1.7; }
h1, h2, h3 { text-wrap: balance; }
h2 { font-size: clamp(34px, 3.4vw, 48px); line-height: 1.15; }
p { text-wrap: pretty; }
.container { width: min(calc(100% - 80px), var(--container)); }
.btn { min-height: 56px; padding: 15px 22px; font-size: 16px; border-radius: 10px; gap: 14px; }
.btn-small { min-height: 48px; font-size: 15px; padding: 12px 18px; }
.btn-primary { box-shadow: 0 5px 15px #c8102e18; }
.text-link { font-size: 15px; line-height: 1.6; min-height: 44px; }
.eyebrow { font-size: 13px; letter-spacing: .1em; margin-bottom: 18px; }
.topbar { background: var(--ink); font-size: 13px; }
.topbar .container { min-height: 36px; }
.topbar .icon { width: 15px; height: 15px; }
.header { background: #fffffff5; border-color: var(--line); }
.header-inner { height: 88px; gap: 26px; }
.brand { width: 210px; }
.header nav { gap: 24px; }
.header nav a { font-size: 15px; }
.header-phone { font-size: 15px; }
.header-actions { gap: 20px; }
.header-actions .btn { font-size: 15px; }
.hero { background: #f5f6f1; padding: 70px 0 64px; }
.hero-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 56px; }
.hero h1 { font-size: clamp(46px, 4.65vw, 68px); letter-spacing: -.055em; line-height: 1.07; margin-bottom: 28px; }
.hero-copy > p { font-size: 20px; line-height: 1.75; max-width: 490px; }
.hero-ctas { gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.hero-ctas .btn { font-size: 16px; padding-inline: 22px; }
.hero-photo { min-height: 510px; padding-bottom: 32px; }
.hero-photo > img { min-height: 470px; max-height: none; border-radius: 24px; }
.hero-price { bottom: 52px; left: -24px; min-width: 350px; border-radius: 16px; padding: 24px 26px; box-shadow: 0 12px 36px #1f2c241a; }
.hero-price > div > span { font-size: 14px; }
.hero-price strong { font-size: 44px; }
.hero-price strong small { display: inline-flex; flex-direction: column; vertical-align: middle; font-size: 18px; line-height: 1.4; }
.hero-price-tax { font-size: 11px; font-weight: 400; letter-spacing: 0; color: var(--muted); }
.hero-price > div { min-width: 0; }
.hero-price > a { width: 48px; height: 48px; flex-shrink: 0; }
.image-caption { font-size: 12px; color: var(--muted); }
.benefit-grid { padding-block: 30px; }
.benefit-grid > div { padding-inline: 24px; align-items: flex-start; }
.benefit-grid .icon { margin-top: 4px; }
.benefit-grid strong { font-size: 16px; line-height: 1.45; margin-bottom: 5px; }
.benefit-grid span { font-size: 14px; line-height: 1.6; }
.section { padding-block: 88px; }
.section-head { margin-bottom: 36px; gap: 32px; }
.section-head > p { font-size: 17px; max-width: 380px; line-height: 1.7; }
.materials-grid { gap: 20px; }
.material-card { display: grid; grid-template-rows: 180px 1fr; border-radius: 16px; }
.material-card.premium { border-color: var(--red); box-shadow: 0 6px 22px #c8102e0a; }
.material-visual { height: 180px; }
.material-body { padding: 24px; display: flex; flex-direction: column; min-width: 0; }
.material-top { flex-direction: row; flex-wrap: wrap; align-items: center; gap: 8px; min-height: 26px; margin-bottom: 16px; }
.material-top .eyebrow { font-size: 13px; margin: 0; }
.tag, .material-top .tag { font-size: 12px; padding: 4px 8px; line-height: 1.5; }
.material-body h3 { font-size: 25px; line-height: 1.25; min-height: 2.5em; }
.material-spec { font-size: 14px; margin-block: 14px 18px; }
.checklist { font-size: 14px; line-height: 1.6; margin-bottom: 22px; }
.checklist li { align-items: flex-start; gap: 8px; margin-block: 10px; }
.checklist .icon { width: 17px; height: 17px; margin-top: 3px; }
.material-price { margin-top: auto; padding-top: 20px; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.material-price strong { font-size: 36px; line-height: 1.2; }
.material-price strong span { font-size: 20px; }
.material-price > span { font-size: 13px; }
.material-body .btn { font-size: 15px; min-height: 50px; padding: 13px 15px; }
.under-cards > span { font-size: 14px; }
.under-cards .text-link { font-size: 14px; }
.use-grid { gap: 20px; }
.use-card { display: flex; flex-direction: column; padding: 28px; border-radius: 16px; }
.use-icon { width: 48px; height: 48px; margin-bottom: 24px; }
.use-card h3 { font-size: 23px; line-height: 1.25; margin-bottom: 14px; }
.use-card p { font-size: 16px; line-height: 1.7; min-height: 0; margin-bottom: 24px; }
.use-bottom { margin-top: auto; font-size: 14px; gap: 8px; }
.discount-section { padding-bottom: 0; }
.discount-banner { background: #fbeeed; padding: 48px; gap: 40px; grid-template-columns: .7fr 1.25fr 1fr; border-radius: 22px; }
.discount-copy h2 { font-size: 38px; }
.discount-copy .eyebrow { font-size: 13px; }
.discount-copy p { font-size: 17px; line-height: 1.7; }
.discount-copy small, .discount-action > span { font-size: 14px; }
.discount-action .btn { font-size: 15px; }
.quote-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1.12fr); gap: 80px; }
.quote-copy h2 { font-size: clamp(36px, 3.5vw, 48px); }
.quote-copy > p { font-size: 19px; line-height: 1.75; max-width: 450px; }
.quote-benefits { font-size: 16px; }
.quote-contact { max-width: 450px; }
.quote-contact a { font-size: 30px; }
.quote-contact a.small-link { font-size: 17px; }
.quote-form { padding: 36px; border-radius: 20px; box-shadow: 0 12px 40px #222b2b06; }
.form-heading { align-items: flex-start; flex-wrap: wrap; }
.form-heading h3 { font-size: 26px; }
.form-heading > span { font-size: 13px; }
form label { font-size: 16px; line-height: 1.5; }
.optional { font-size: 14px; }
input:not([type=checkbox],[type=radio],[type=file]), textarea, select { font-size: 17px; min-height: 54px; padding: 13px 14px; border-color: #bfc7c1; border-radius: 9px; }
input::placeholder, textarea::placeholder { font-size: 16px; color: #6a7370; }
form > label, form > .form-row { margin-bottom: 20px; }
.form-row { gap: 20px; align-items: start; }
.dropzone { padding: 22px; border-radius: 12px; }
.dropzone > span { font-size: 16px; }
.dropzone small { font-size: 13px; }
.dropzone > .optional { display: none; }
.field-error { font-size: 14px; }
.file-list li { font-size: 15px; }
.file-list small { font-size: 13px; }
.file-list button, .icon-button { width: 44px; height: 44px; flex-shrink: 0; }
.privacy-note, .demo-note, .quote-form > small { font-size: 14px; line-height: 1.7; }
.demo-note { color: var(--muted); }
.faq-grid { grid-template-columns: minmax(0, .85fr) minmax(0, 1.3fr); gap: 80px; }
.faq-grid > div > p { font-size: 18px; }
.faq-grid .text-link { font-size: 16px; }
.faq-list summary { font-size: 18px; line-height: 1.5; padding-block: 24px; }
.faq-list details p { font-size: 17px; line-height: 1.8; }
.last-cta { padding-block: 52px; }
.last-cta h2 { font-size: 38px; }
.last-cta .eyebrow { font-size: 13px; }
.footer { padding-top: 64px; }
.footer-grid { grid-template-columns: 1.2fr 1fr 1fr 1.1fr; gap: 36px; }
.footer h3 { font-size: 16px; margin-top: 0; }
.footer p, .footer-grid > div > a:not(.brand) { font-size: 15px; line-height: 1.75; }
.footer-grid > div > a.footer-phone { font-size: 28px; white-space: nowrap; }
.company, .footer p.registry, .footer-bottom { font-size: 13px; }
.footer-brand { width: 210px; }
.footer-grid a { overflow-wrap: anywhere; }
.document-page { padding-top: 36px; }
.document-page h1 { font-size: clamp(38px, 4vw, 56px); }
.document-lead { font-size: 20px; max-width: 780px; line-height: 1.75; }
.document-section h2 { font-size: 36px; }
.document-section h3 { font-size: 25px; }
.document-section p, .document-section li { font-size: 18px; line-height: 1.8; }
.document-section p.small { font-size: 14px; }
.guide-nav a { font-size: 16px; min-height: 48px; }
.table-scroll table, .table-scroll td, .table-scroll tbody th, .table-scroll caption { font-size: 15px; line-height: 1.65; }
.table-scroll th, .table-scroll td { padding: 20px; }
.table-scroll tbody tr:nth-child(even) { background: var(--paper); }
.guide-columns { gap: 56px; }
dialog { padding: 32px; border-radius: 20px; }
.dialog-head { gap: 16px; }
dialog > p { font-size: 17px; }
dialog > small { font-size: 14px; }
.dialog-actions .btn { font-size: 15px; }
.review-list > div { font-size: 16px; }
html { scroll-padding-top: 112px; }
@media (max-width: 1200px) {
  .header-inner { gap: 20px; }
  .header nav { gap: 18px; }
  .header-phone { display: none; }
  .hero-grid { gap: 36px; }
  .hero-ctas { flex-direction: column; align-items: stretch; max-width: 320px; }
  .benefit-grid > div { padding-inline: 16px; }
  .materials-grid, .use-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .material-body h3 { min-height: 0; }
  .material-top { min-height: 26px; }
  .material-visual .mini-banner { max-width: 260px; }
  .discount-banner { grid-template-columns: .7fr 1.3fr; }
  .discount-action { grid-column: 2; align-items: stretch; }
  .quote-grid, .faq-grid { gap: 40px; }
  .footer-grid { gap: 24px; grid-template-columns: 1.2fr 1fr 1fr; }
  .footer-grid > div:last-child { grid-column: 1 / -1; border-top: 1px solid var(--line); padding-top: 24px; }
}
@media (max-width: 1000px) {
  .container { width: calc(100% - 48px); }
  .header-inner { height: 76px; justify-content: space-between; }
  .header-actions .btn { font-size: 14px; }
  .menu-toggle { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; width: 44px; height: 44px; }
  .menu-toggle span { display: block; width: 22px; height: 2px; background: var(--ink); }
  .menu-toggle[aria-expanded=true] span:first-child { transform: translateY(4px) rotate(45deg); }
  .menu-toggle[aria-expanded=true] span:last-child { transform: translateY(-4px) rotate(-45deg); }
  .header nav { display: none; position: absolute; top: 100%; left: 0; right: 0; margin: 0; background: white; padding: 12px 24px 24px; box-shadow: 0 18px 24px #222b2b12; border-bottom: 1px solid var(--line); }
  .header nav.open { display: flex; flex-direction: column; gap: 0; }
  .header nav a { font-size: 17px; padding: 15px 0; border-bottom: 1px solid var(--line); }
  .hero h1 { font-size: 48px; }
  .hero-copy > p { font-size: 18px; }
  .hero-photo { min-height: 480px; }
  .hero-price { min-width: 300px; padding: 20px; left: -16px; }
  .hero-price strong { font-size: 38px; }
  .benefit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
  .benefit-grid > div { padding: 0; border: 0; }
  .section-head { align-items: flex-start; }
  .quote-grid { grid-template-columns: 1fr; }
  .quote-copy > p, .quote-contact { max-width: 620px; }
  .quote-grid .form-row { grid-template-columns: 1fr 1fr; }
  .form-heading { flex-direction: row; align-items: center; }
}
@media (max-width: 760px) {
  body { font-size: 17px; }
  .container { width: calc(100% - 40px); }
  .topbar .container { min-height: 32px; justify-content: center; }
  .topbar .container > span:first-child { display: inline; font-size: 12px; }
  .topbar .container > span:last-child { display: none; }
  .header-inner { height: 72px; gap: 12px; }
  .brand { width: 184px; }
  .header-actions { gap: 8px; }
  .hero { padding: 40px 0 28px; }
  .hero-grid { grid-template-columns: 1fr; gap: 32px; }
  .hero h1 { font-size: clamp(40px, 8.8vw, 58px); margin-bottom: 24px; }
  .hero-copy > p { font-size: 18px; max-width: 540px; }
  .hero-ctas { max-width: none; gap: 12px; margin-top: 26px; }
  .hero-ctas .btn { font-size: 16px; min-height: 56px; justify-content: space-between; }
  .hero-photo { min-height: 0; height: 380px; margin-left: 0; padding-bottom: 26px; }
  .hero-photo > img { min-height: 0; height: 100%; border-radius: 18px; }
  .hero-price { left: 12px; right: 12px; bottom: 40px; min-width: 0; padding: 18px 20px; }
  .hero-price > div > span { font-size: 13px; }
  .hero-price strong { font-size: 38px; }
  .hero-price strong small { font-size: 16px; }
  .image-caption { font-size: 12px; bottom: 0; }
  .benefit-grid { gap: 24px 20px; }
  .benefit-grid strong { font-size: 15px; }
  .benefit-grid span { font-size: 13px; }
  .benefit-grid > div { gap: 10px; }
  .section { padding-block: 56px; }
  .section-head { display: block; margin-bottom: 28px; }
  .section-head > p { font-size: 16px; margin-top: 16px; }
  .eyebrow { font-size: 12px; }
  .materials-grid, .use-grid { gap: 20px; }
  .material-body { padding: 24px; }
  .material-body h3 { font-size: 26px; }
  .material-spec, .checklist { font-size: 15px; }
  .material-top { flex-direction: row; min-height: 0; }
  .material-body .btn { font-size: 16px; min-height: 52px; }
  .material-price strong { font-size: 36px; }
  .use-card { padding: 26px; }
  .use-card h3 { font-size: 24px; }
  .use-card p { font-size: 17px; }
  .use-bottom { font-size: 14px; }
  .discount-section { padding-bottom: 0; }
  .discount-banner { grid-template-columns: 1fr; padding: 32px 26px; gap: 24px; }
  .discount-action { grid-column: auto; }
  .discount-copy h2 { font-size: 36px; }
  .discount-copy p { font-size: 17px; }
  .discount-action .btn { font-size: 16px; }
  .quote-copy h2 { font-size: 38px; }
  .quote-copy h2 br { display: none; }
  .quote-copy > p { font-size: 18px; }
  .quote-form { padding: 26px; }
  .form-heading { flex-direction: column; align-items: flex-start; gap: 8px; }
  .form-heading h3 { font-size: 25px; }
  .quote-grid .form-row { grid-template-columns: 1fr; }
  .dropzone { padding: 20px 16px; }
  .faq-grid { grid-template-columns: 1fr; gap: 28px; }
  .faq-list summary { font-size: 17px; }
  .faq-list details p { font-size: 16px; }
  .last-cta h2 { font-size: 34px; max-width: none; }
  .last-cta .btn { font-size: 16px; min-height: 54px; }
  .footer { padding-block: 44px 112px; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 30px 20px; }
  .footer-grid > div:first-child { grid-column: 1 / -1; }
  .mobile-bar { gap: 10px; padding-inline: 16px; }
  .mobile-bar .btn { font-size: 14px; min-height: 50px; }
  .document-page h1 { font-size: 38px; }
  .document-lead { font-size: 18px; }
  .document-section h2 { font-size: 30px; }
  .document-section p, .document-section li { font-size: 17px; }
  .guide-columns { grid-template-columns: 1fr; gap: 12px; }
  dialog { padding: 24px; }
  .review-list > div { font-size: 15px; grid-template-columns: 1fr; gap: 4px; }
  .dialog-actions .btn { font-size: 15px; flex: 1 1 100%; }
  html { scroll-padding-top: 92px; scroll-padding-bottom: 100px; }
}
@media (max-width: 600px) {
  .materials-grid, .use-grid { grid-template-columns: 1fr; }
  .material-card { grid-template-columns: 1fr; grid-template-rows: 145px 1fr; }
  .material-visual { height: 145px; min-height: 0; }
  .mini-banner { width: 62%; height: 78px; transform: perspective(600px) rotateY(-17deg) rotateZ(-6deg); }
  .mini-banner span { font-size: 23px; }
  .material-visual > .icon { right: 18px; bottom: 18px; }
  .use-card { padding: 26px; }
  .use-icon { position: static; margin: 0 0 20px; }
  .header-actions .btn { display: none; }
  .header .brand { width: 184px; }
}
@media (max-width: 370px) {
  .container { width: calc(100% - 32px); }
  .hero h1 { font-size: 38px; }
  .hero-price { padding: 16px; gap: 10px; }
  .hero-price strong { font-size: 34px; }
  .hero-price strong small { font-size: 14px; }
  .hero-price > a { width: 44px; height: 44px; }
  .benefit-grid { grid-template-columns: 1fr; }
  .quote-form { padding: 22px 18px; }
  .mobile-bar .btn { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; animation: none !important; }
}
@media print {
  .header, .topbar, .mobile-bar, .config-mobile-bar { display: none !important; }
  .container { width: 100%; }
}

/* Homepage: the three steps form one distinct, ordered section. */
.process-shell { background: #223c32; border-radius: 28px; padding: 48px; }
.process-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; margin-bottom: 36px; }
.process-heading .eyebrow { color: #b9d0c2; margin-bottom: 16px; }
.process-heading h2 { color: #fff; font-size: clamp(34px, 3.3vw, 48px); line-height: 1.12; }
.process-heading .btn { flex-shrink: 0; }
.steps-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; list-style: none; padding: 0; margin: 0; }
.process-step { background: #f7f8f3; border-radius: 18px; padding: 28px; }
.process-step-top { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 32px; }
.process-icon { display: grid; place-items: center; width: 52px; height: 52px; background: #fff; border-radius: 14px; color: var(--red); }
.process-icon .icon { width: 28px; height: 28px; stroke-width: 1.5; }
.step-number { font-size: 44px; font-weight: 500; line-height: 1; letter-spacing: -.06em; color: #6c8176; }
.process-step h3 { font-size: 25px; line-height: 1.25; margin-bottom: 14px; max-width: 250px; }
.process-step p { font-size: 16px; line-height: 1.75; color: #59675e; }
@media (max-width: 1100px) {
  .process-shell { padding: 32px; }
  .steps-grid { gap: 16px; }
  .process-step { padding: 24px; }
  .process-step h3 { font-size: 23px; }
}
@media (max-width: 800px) {
  .process-shell { padding: 28px; border-radius: 22px; }
  .process-heading { align-items: flex-start; flex-direction: column; gap: 24px; margin-bottom: 28px; }
  .steps-grid { grid-template-columns: 1fr; }
  .process-step { padding: 24px; }
  .process-step-top { margin-bottom: 20px; }
  .process-step h3 { max-width: none; font-size: 24px; margin-bottom: 10px; }
}
@media (max-width: 420px) {
  .process-shell { padding: 24px 20px; }
  .process-heading h2 { font-size: 32px; }
  .process-heading .btn { width: 100%; }
  .process-step { padding: 22px 20px; }
  .process-step h3 { font-size: 22px; }
  .process-icon { width: 44px; height: 44px; border-radius: 12px; }
  .process-icon .icon { width: 25px; height: 25px; }
  .step-number { font-size: 38px; }
}

/* A prominent entry to the online configurator, between materials and uses. */
.config-promo { background: var(--red); color: #fff; padding-block: 72px; }
.config-promo-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; gap: 56px; }
.config-promo-copy h2 { color: #fff; font-size: clamp(36px, 3.8vw, 56px); line-height: 1.12; letter-spacing: -.045em; max-width: 640px; }
.config-promo-copy > p { color: #fff; font-size: 19px; line-height: 1.75; max-width: 510px; margin-top: 24px; }
.config-promo-button { background: #fff; color: var(--red); min-height: 60px; padding: 17px 26px; margin-top: 32px; font-size: 17px; gap: 24px; box-shadow: 0 8px 24px #71021b24; }
.config-promo-button:hover { background: #fff3f5; color: var(--red-dark); }
.config-promo-button:focus-visible { outline-color: #fff; outline-offset: 6px; }
.config-promo-visual { min-width: 0; }
.config-promo-drawing { display: block; width: 100%; height: auto; overflow: visible; font-family: 'Manrope', Arial, sans-serif; }
@media (max-width: 1100px) {
  .config-promo { padding-block: 56px; }
  .config-promo-grid { gap: 24px; }
  .config-promo-copy > p { font-size: 18px; }
}
@media (max-width: 800px) {
  .config-promo-grid { grid-template-columns: 1fr; gap: 32px; }
  .config-promo-copy { max-width: 600px; }
  .config-promo-copy h2 { font-size: clamp(34px, 6.2vw, 46px); }
  .config-promo-copy > p { margin-top: 20px; }
  .config-promo-button { margin-top: 26px; }
  .config-promo-visual { width: min(100%, 530px); justify-self: center; }
}
@media (max-width: 420px) {
  .config-promo { padding-block: 44px 32px; }
  .config-promo-copy h2 { font-size: 34px; }
  .config-promo-copy > p { font-size: 17px; }
  .config-promo-button { width: 100%; padding-inline: 20px; font-size: 16px; gap: 16px; justify-content: space-between; }
  .config-promo-grid { gap: 26px; }
}

/* Confirmation after the configurator's simulated submission. */
.thank-you-page { min-height: 100vh; display: flex; flex-direction: column; background: var(--paper); }
.thank-you-header { background: #fff; padding-block: 24px; }
.thank-you-header > .container { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.thank-you-phone { display: inline-flex; align-items: center; gap: 10px; font-size: 16px; font-weight: 800; white-space: nowrap; }
.thank-you-main { width: min(calc(100% - 48px), 920px); padding-block: 56px 36px; flex: 1; }
.thank-you-card { background: #fff; padding: 48px 56px; border: 1px solid var(--line); border-radius: 24px; text-align: center; }
.thank-you-check { display: grid; place-items: center; width: 72px; height: 72px; margin: 0 auto 24px; background: #eaf4ec; color: var(--green); border-radius: 50%; }
.thank-you-check .icon { width: 36px; height: 36px; stroke-width: 2; }
.thank-you-card > .eyebrow { color: var(--green); margin-bottom: 14px; }
.thank-you-card h1 { font-size: clamp(34px, 4.2vw, 48px); line-height: 1.15; }
.thank-you-lead { font-size: 18px; line-height: 1.8; margin-top: 24px; }
.thank-you-lead strong { color: var(--ink); font-weight: 700; }
.thank-you-next { text-align: left; margin: 36px 0 32px; padding: 28px; border-radius: 16px; background: #f5f7f2; }
.thank-you-next h2 { font-size: 22px; margin-bottom: 24px; }
.thank-you-next-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.thank-you-step { display: grid; place-items: center; width: 28px; height: 28px; margin-bottom: 14px; color: var(--green); background: #e4edde; font-size: 14px; font-weight: 800; border-radius: 50%; }
.thank-you-next h3 { font-size: 18px; line-height: 1.4; margin-bottom: 8px; }
.thank-you-next p { font-size: 15px; line-height: 1.75; }
.thank-you-card > .btn { font-size: 16px; }
.thank-you-contact { font-size: 14px; text-align: center; margin-top: 24px; }
.thank-you-contact a, .thank-you-footer a { text-decoration: underline; text-underline-offset: 3px; }
.thank-you-footer { padding-block: 24px; font-size: 13px; color: var(--muted); }
.thank-you-footer > .container { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px 24px; }
@media (max-width: 600px) {
  .thank-you-header { padding-block: 18px; }
  .thank-you-header .brand { width: 165px; }
  .thank-you-header .container { width: calc(100% - 32px); gap: 12px; }
  .thank-you-phone { font-size: 13px; }
  .thank-you-phone .icon { display: none; }
  .thank-you-main { width: calc(100% - 32px); padding-block: 28px; }
  .thank-you-card { padding: 32px 22px; border-radius: 18px; }
  .thank-you-check { width: 60px; height: 60px; }
  .thank-you-card h1 { font-size: 34px; }
  .thank-you-lead { font-size: 16px; margin-top: 20px; }
  .thank-you-next { padding: 22px; margin-top: 28px; }
  .thank-you-next-grid { grid-template-columns: 1fr; gap: 24px; }
  .thank-you-next h2 { font-size: 21px; }
  .thank-you-card > .btn { width: 100%; }
  .thank-you-contact { padding-inline: 8px; }
}

/* Shared attachment previews in both forms and the configuration summary. */
.file-thumbnail { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; width: 64px; height: 64px; flex: 0 0 64px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: #f0f3ef; color: #5b6c62; }
.file-thumbnail--pdf { background: #fff1f3; color: var(--red); border-color: #f0d9df; }
.file-thumbnail--vector { background: #edf5ef; color: #315c46; border-color: #d6e5da; }
.file-thumbnail--archive { background: #fbf4e5; color: #91691f; border-color: #ebdfc4; }
.file-thumbnail-icon { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.file-thumbnail-type { font-size: 10px; font-weight: 800; line-height: 1; letter-spacing: .04em; }
.file-thumbnail img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; padding: 3px; background: white; opacity: 0; }
.file-thumbnail.has-image img { opacity: 1; }
.file-thumbnail.has-image .file-thumbnail-icon, .file-thumbnail.has-image .file-thumbnail-type { visibility: hidden; }
.file-list li { gap: 14px; padding-block: 12px; }
.file-list .file-details { flex: 1; min-width: 0; overflow-wrap: anywhere; line-height: 1.5; }
.file-list .file-name-text { display: block; font-weight: 600; }
.file-list .file-details > small { display: block; margin-top: 2px; }
@media (max-width: 480px) {
  .file-thumbnail { width: 56px; height: 56px; flex-basis: 56px; border-radius: 8px; }
  .file-list li { gap: 10px; }
}

/* Text links: underline on pointer hover and keyboard focus.
   Buttons, linked cards, the logo and boxed navigation keep their own treatment. */
a[href]:not(:where(.btn, .brand, .use-card, .guide-nav a, .hero-price > a, .icon-button, [role="button"])):is(:hover, :focus-visible) {
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  text-decoration-skip-ink: auto;
}
/* Replace the decorative rule with a text underline without shifting the layout. */
a.text-link:is(:hover, :focus-visible) { border-bottom-color: transparent; }
/* The compact header hides the parent text on mobile; underline the phone itself. */
a.config-header-help:is(:hover, :focus-visible) strong {
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
}