@font-face{font-family:Roboto;src:url(assets/roboto-regular.woff) format("woff");font-weight:400;font-display:swap}
@font-face{font-family:Roboto;src:url(assets/roboto-bold.woff) format("woff");font-weight:700;font-display:swap}
:root{--ink:#111827;--muted:#4b5563;--line:#dce1e5;--pale:#f1f3f5;--accent:#f46400;--accent-dark:#9b3e00;--white:#fff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);font:16px/1.5 Roboto,Arial,sans-serif;background:white}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
:focus-visible{outline:3px solid #0078ad;outline-offset:4px}
[hidden]{display:none!important}
h1,h2,h3,p,ol{margin:0}
h2,h3{line-height:1.12}
h2{font-size:clamp(32px,4.1vw,54px);letter-spacing:-.035em}
h3{font-size:25px;letter-spacing:-.025em}
.wrap{width:min(1280px,calc(100% - 80px));margin-inline:auto}
.sr,.skip:not(:focus){position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap}
.skip:focus{position:absolute;left:12px;top:12px;z-index:5;background:white;padding:10px}
.header{background:white;border-bottom:1px solid var(--line)}
.header-row{min-height:78px;display:flex;align-items:center;gap:28px}
.header nav{margin:auto;display:flex;gap:27px;color:#343b44;font-size:15px}
.header nav a:hover,.phone:hover,footer a:hover{color:var(--accent-dark)}
.phone{font-weight:700;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:17px;padding:12px 20px;min-height:48px;line-height:1.2;border:1px solid transparent;font-size:15px;font-weight:700;transition:background .15s,color .15s,border-color .15s}
.btn-primary{background:var(--accent);color:#17110b;border-color:var(--accent)}
.btn-primary:hover{background:#ff8a36;border-color:#ff8a36}
.btn-outline{border-color:var(--ink);color:var(--ink)}
.btn-outline:hover{color:white;background:var(--ink)}
.btn-light{border-color:#cbd2d8;color:white;background:#17232c55}
.btn-light:hover{background:white;color:var(--ink)}
.preview{background:#f0f2f4;border-bottom:1px solid #dce0e4}
.preview-row{display:flex;align-items:center;gap:14px 25px;flex-wrap:wrap;padding-block:10px}
.preview strong{color:#374151;font-size:12px}
.preview strong span{color:var(--accent-dark);margin:0 3px}
.variants{display:flex;flex-wrap:wrap;gap:5px}
.variants button{font-size:12px;line-height:1.25;padding:7px 10px;background:white;border:1px solid #d4d8db;color:var(--ink)}
.variants button[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:white}
.variants button:hover{border-color:var(--ink)}
.hero{position:relative;isolation:isolate;background:#121d26;color:white;border-top:3px solid var(--accent)}
.hero-image,.hero::after{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero-image{object-fit:cover;object-position:center 49%}
.hero::after{content:"";background:linear-gradient(90deg,#101a23 1%,#101a23f7 25%,#101a23d9 40%,#101a2350 69%,#101a2314 100%)}
.hero-inner{display:flex;align-items:center;min-height:clamp(520px,43vw,645px);padding-block:64px 74px;position:relative}
.hero-content{max-width:660px}
.eyebrow{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.115em;color:var(--accent-dark);margin-bottom:14px}
.hero-label{color:#ff9f5e;display:flex;align-items:center;gap:10px;margin-bottom:23px}
.hero-label span{color:#ffd3b5}
h1{font-size:clamp(44px,5.35vw,76px);letter-spacing:-.045em;line-height:1.02;text-wrap:balance}
.hero-text{color:#edf0f2;font-size:clamp(17px,1.55vw,21px);max-width:490px;margin-top:22px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:29px}
.hero-caption{position:absolute;bottom:24px;right:0;display:flex;align-items:center;gap:9px;padding:7px 11px;color:white;background:#101a23e8;font-size:11px;letter-spacing:.02em}
.hero-caption span{width:7px;height:7px;background:var(--accent)}
.trust{border-bottom:1px solid var(--line);background:#f7f8f9}
.trust-grid{display:grid;grid-template-columns:repeat(3,1fr);padding-block:25px}
.trust-grid>div{display:flex;align-items:center;gap:15px;padding-inline:26px;border-left:1px solid var(--line)}
.trust-grid>div:first-child{border:0;padding-left:0}
.trust svg{width:29px;height:29px;flex:none;stroke:var(--accent-dark);stroke-width:1.5;fill:none;stroke-linejoin:round;stroke-linecap:round}
.trust strong,.trust small{display:block}
.trust strong{font-size:17px}
.trust small{color:var(--muted);font-size:13px}
.section{padding-block:75px}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:15px 30px;margin-bottom:28px}
.section-head p{max-width:330px;color:var(--muted)}
.cards,.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.card{border:1px solid var(--line);display:flex;flex-direction:column}
.product-image{position:relative;background:var(--pale);padding:49px 22px 14px;height:222px;display:grid;place-items:center}
.product-image img{width:100%;height:154px;object-fit:contain}
.tag{position:absolute;top:14px;left:14px;padding:4px 9px;background:white;font-size:12px;font-weight:700;color:#3c454e}
.product-body{display:flex;flex-direction:column;flex:1;padding:20px}
.product-body p{color:var(--muted);margin-top:8px;margin-bottom:20px}
.spec{margin-top:auto;display:flex;flex-wrap:wrap;justify-content:space-between;gap:3px 8px;border-block:1px solid var(--line);padding-block:10px;font-size:14px}
.spec span{color:var(--muted)}
.card-actions{display:flex;flex-wrap:wrap;justify-content:space-between;gap:8px 10px;margin-top:14px;font-size:13px;font-weight:700}
.card-actions a:first-child{color:var(--accent-dark)}
.card-actions a:hover{text-decoration:underline}
.field{background:#17212a;color:white}
.field .eyebrow,.request .eyebrow{color:#ffab70}
.field .section-head p,.request-grid>div>p:not(.eyebrow){color:#d5dce2}
.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.video{display:block;border:1px solid #45525e;background:#202e39}
.video:hover .play{background:#ff9a52}
.video-image{position:relative;aspect-ratio:2.15;overflow:hidden;background:#101a23}
.video-image img{width:100%;height:100%;object-fit:cover}
.wall-video img{object-position:50% 46%}
.play{position:absolute;left:18px;bottom:16px;width:45px;height:45px;display:grid;place-items:center;background:var(--accent);color:#17110b;font-size:15px}
.video-info{padding:15px 18px;display:grid;gap:3px}
.video-info>span:not(.sr){color:#c6d0d7;font-size:12px}
.video-info strong{font-size:19px;display:flex;justify-content:space-between;gap:12px}
.steps{list-style:none;padding:0;margin-top:30px}
.steps li{border-top:1px solid var(--line);padding:14px 18px 0 0}
.steps li>span{color:var(--accent-dark);font-size:15px;font-weight:700;display:block;margin-bottom:14px}
.steps p{color:var(--muted);margin-top:9px}
.faq{background:var(--pale)}
.faq-grid{display:grid;grid-template-columns:1fr 1.55fr;gap:32px}
details{border-bottom:1px solid #ccd4db}
details:first-child{border-top:1px solid #ccd4db}
summary{cursor:pointer;font-weight:700;list-style:none;display:flex;justify-content:space-between;align-items:start;gap:20px;padding:16px 0}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:20px;color:var(--accent-dark);line-height:1.2}
details[open] summary::after{content:"−"}
details p{padding:0 24px 17px 0;color:var(--muted)}
.request{background:#17212a;color:white;padding-block:74px}
.request-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(24px,6vw,110px);align-items:start}
.request-grid>div>p:not(.eyebrow){margin-top:17px;max-width:420px}
.request-phone{display:inline-block;margin-top:26px;font-size:23px;font-weight:700}
.request-phone:hover{text-decoration:underline}
.request-grid>div>small{display:block;color:#d5dce2;margin-top:3px}
form{background:white;color:var(--ink);padding:25px;display:grid;gap:13px}
form label{display:grid;gap:5px;font-weight:700;font-size:14px}
form label small{display:inline;color:var(--muted);font-weight:400}
input,textarea,select{width:100%;min-height:44px;border:1px solid #aab4bf;background:#fff;color:var(--ink);padding:8px 10px;border-radius:0}
textarea{resize:vertical}
form button{justify-content:space-between!important;width:100%}
form button:disabled{opacity:.55;cursor:default}
.form-note,.form-model,.form-result{font-size:13px}
.form-note{color:var(--muted)}
.form-model,.form-result{background:var(--pale);padding:9px 12px}
.form-result{border-left:3px solid #137243}
.footer-row{min-height:78px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px 20px;padding-block:15px;font-size:13px;color:#45515b}
.footer-row img{width:117px;height:auto}
@media(max-width:1040px){
  .header-row{gap:17px}.header nav{gap:16px}.wrap{width:calc(100% - 48px)}
  .product-body{padding:16px}.trust-grid>div{padding-inline:16px}
}
@media(max-width:760px){
  .wrap{width:calc(100% - 36px)}.header-row{min-height:65px;justify-content:space-between}.header nav,.header-cta{display:none}
  .header img{width:126px;height:auto}.phone{font-size:14px}
  .preview-row{gap:6px;padding-block:8px}.variants{gap:4px}.variants button{padding:6px 7px}
  .hero{display:flex;flex-direction:column}.hero::after{display:none}.hero-image{position:static;height:clamp(180px,44vw,330px);order:2}
  .hero-inner{position:static;min-height:0;padding-block:31px 29px}.hero-label{margin-bottom:13px}.hero-text{margin-top:14px}.hero-actions{margin-top:20px}
  h1{font-size:clamp(34px,7.3vw,54px);text-wrap:wrap}.hero-caption{bottom:8px;right:9px}
  .section,.request{padding-block:48px}.section-head{display:block;margin-bottom:20px}.section-head p{margin-top:10px}
  .trust-grid{gap:12px;padding-block:15px;grid-template-columns:1fr}.trust-grid>div,.trust-grid>div:first-child{border:0;padding:0;gap:10px}.trust-grid>div span{display:flex;flex-wrap:wrap;align-items:baseline;gap:3px 8px}
  .trust svg{width:23px;height:23px}.trust strong{font-size:14px}.trust small{font-size:12px}
  .cards,.steps,.faq-grid,.request-grid{grid-template-columns:1fr}.product-image{height:190px}.product-image img{height:127px}
  .steps,.faq-grid{gap:22px}.video-grid{gap:9px}.video-info{padding:10px}.video-info strong{font-size:15px}.play{width:33px;height:33px;left:10px;bottom:8px}
  form{padding:16px}.footer-row{justify-content:start}
}
@media(max-width:430px){.hero-actions .btn{flex:1 1 100%;justify-content:space-between}.video-grid{grid-template-columns:1fr}.video-image{aspect-ratio:2.2}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
