:root{
  --navy:#0B1F33; --navy-2:#122B45; --sky:#01BAFF; --sky-ink:#0877B0;
  --paper:#F5F7F9; --ink:#0B1F33; --muted:#5B6B7B; --line:#DCE2E8; --line-d:rgba(255,255,255,.14);
  --mono:"IBM Plex Mono",ui-monospace,monospace; --sans:Archivo,system-ui,sans-serif;
  --wrap:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font:400 17px/1.6 var(--sans);color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
@media(max-width:700px){.wrap{padding:0 18px}}
h1,h2,h3{font-weight:400;font-stretch:92%;letter-spacing:-.025em;line-height:1.02}
h1{font-size:clamp(2.7rem,7.4vw,6.6rem);letter-spacing:-.045em;line-height:.95}
h2{font-size:clamp(2rem,4vw,3.4rem);letter-spacing:-.035em}
h3{font-size:1.3rem;font-weight:500}
p{color:var(--muted)}
.mono{font:500 .75rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase}
.dark{background:var(--navy);color:#fff}
.dark p{color:#A9B7C6}
section[id]{scroll-margin-top:70px}

/* botões: retos, azul-céu com texto marinho */
.btn{display:inline-flex;align-items:center;gap:12px;height:52px;padding:0 24px;font:500 1rem/1 var(--sans);border:1px solid transparent;border-radius:2px;cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn svg{width:18px;height:18px}
.btn-sky{background:var(--sky);color:var(--navy)}
.btn-sky:hover{background:#fff}
.btn-ghost{border-color:currentColor;opacity:.85}
.btn-ghost:hover{opacity:1}
.arrow::after{content:"↗";font-family:var(--mono);margin-left:4px}

/* barra e topo */
.bar{background:var(--navy);color:#A9B7C6;border-bottom:1px solid var(--line-d)}
.bar .wrap{display:flex;justify-content:space-between;gap:16px;height:36px;align-items:center}
.bar a:hover{color:#fff}
@media(max-width:700px){.bar .hide-m{display:none}}
header{position:sticky;top:0;z-index:40;background:var(--navy);color:#fff;border-bottom:1px solid var(--line-d)}
header .wrap{display:flex;align-items:center;gap:32px;height:68px}
.logo{line-height:0}
.logo img{height:34px;width:auto}
header nav{display:flex;gap:28px;margin-left:auto}
header nav a{color:#A9B7C6;display:flex;gap:8px;align-items:baseline}

header nav a:hover{color:#fff}
.tabs{display:flex;border:1px solid var(--line-d)}
.tabs a{padding:8px 14px;color:#A9B7C6}
.tabs a[aria-current]{background:#fff;color:var(--navy)}
header .btn{height:40px;padding:0 16px;font-size:.93rem}
@media(max-width:1000px){header nav{display:none}.tabs{margin-left:auto}}
@media(max-width:700px){header .btn{display:none}.logo img{height:28px}}

/* abertura */
.hero{padding:72px 0 0}
.hero .kicker{color:var(--sky);margin-bottom:28px;display:block}
.hero h1 em{font-style:normal;color:var(--sky)}
.hero-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:0 24px;align-items:start;margin-top:56px;border-top:1px solid var(--line-d)}
.hero-photo{grid-column:1/9;position:relative;margin-top:-1px}
.hero-photo img{width:100%;aspect-ratio:16/10;object-fit:cover}
.hero-photo figcaption{position:absolute;left:0;bottom:0;background:var(--navy);color:#A9B7C6;padding:10px 16px}
.hero-side{grid-column:9/13;padding:32px 0 48px;display:flex;flex-direction:column;gap:28px}
.hero-side .lead{font-size:1.1rem;color:#C9D4DF}
.hero-side .ctas{display:grid;gap:10px}
.hero-side .ctas .btn{justify-content:space-between}
.specs{list-style:none;border-top:1px solid var(--line-d);margin-top:auto}
.specs li{display:flex;justify-content:space-between;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--line-d)}
.specs b{font:400 1.7rem/1 var(--sans);letter-spacing:-.03em;color:#fff}
.specs .mono{color:#7F93A8}
@media(max-width:900px){.hero{padding-top:44px}.hero-photo,.hero-side{grid-column:1/-1}.hero-side{padding:28px 0 40px}}

/* clientes em duas faixas */
.clients{padding:40px 0 48px;border-top:1px solid var(--line-d)}
.clients .mono{color:#7F93A8;display:block;margin-bottom:24px}
.marquee{overflow:hidden;border-top:1px solid var(--line-d);border-bottom:1px solid var(--line-d)}
.marquee+.marquee{border-top:0}
.track{display:flex;width:max-content;animation:slide var(--dur,55s) linear infinite;will-change:transform}
.marquee.rev .track{animation-direction:reverse}
.track img{height:96px;width:220px;padding:24px 34px;object-fit:contain;border-right:1px solid var(--line-d);filter:brightness(0) invert(1);opacity:.6}
@keyframes slide{from{transform:translateX(-50%)}to{transform:none}}
@media(max-width:700px){.track img{height:72px;width:150px;padding:18px 22px}}

/* seções com índice fixo à esquerda */
.block{padding:120px 0;border-bottom:1px solid var(--line)}
.block.dark{border-color:var(--line-d)}
.block .wrap{display:grid;grid-template-columns:4fr 8fr;gap:48px}
.block .side{align-self:start;position:sticky;top:110px}
.block .side .mono{color:var(--sky-ink);display:block;margin-bottom:18px}
.block.dark .side .mono{color:var(--sky)}
.block .side p{margin-top:18px;max-width:340px}
@media(max-width:900px){.block{padding:80px 0}.block .wrap{grid-template-columns:1fr;gap:36px}.block .side{position:static}}

/* serviços em grade com linhas */
.cells{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.cells>*{padding:32px 30px 36px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.cells .mono{color:var(--muted);display:block;margin-bottom:16px}
.cells h3{margin-bottom:8px}
.cells p{font-size:.97rem}
.cells a.cell-link{background:var(--navy);color:#fff}
.cells a.cell-link .mono{color:var(--sky)}
.cells a.cell-link p{color:#A9B7C6}
@media(max-width:600px){.cells{grid-template-columns:1fr}.cells .mono{margin-bottom:20px}}

/* ficha técnica dos tipos de ar */
.sheet{border-top:1px solid var(--ink)}
.sheet .row{display:grid;grid-template-columns:150px 1.1fr 1fr 1.6fr;gap:24px;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.sheet .row img{width:150px;aspect-ratio:4/3;object-fit:cover}
.sheet .row h3{font-size:1.25rem}
.sheet .row .mono{color:var(--sky-ink)}
.sheet .row p{font-size:.95rem}
.sheet .head{padding:12px 0;color:var(--muted)}
.sheet .head span:first-child{grid-column:1/3}
@media(max-width:900px){.sheet .head{display:none}.sheet .row{grid-template-columns:110px 1fr;gap:6px 18px;align-items:start}.sheet .row img{width:110px;grid-row:span 3}.sheet .row p{grid-column:2}}

/* obras em mosaico */
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:220px;gap:6px}
.bento figure{position:relative;overflow:hidden;background:var(--navy-2)}
.bento figure:nth-child(1){grid-column:span 2;grid-row:span 2}

.bento img{width:100%;height:100%;object-fit:cover}
.bento figcaption{position:absolute;left:0;top:0;background:var(--navy);color:var(--sky);padding:6px 10px}
.bento-foot{display:flex;justify-content:space-between;margin-top:20px;color:#A9B7C6;gap:16px;flex-wrap:wrap}
.bento-foot a{color:#fff}
@media(max-width:700px){.bento{grid-template-columns:1fr 1fr;grid-auto-rows:160px}}

/* garantia */
.warranty{display:grid;grid-template-columns:1fr 1fr;gap:0;border:1px solid var(--line)}
.warranty>div{padding:40px}
.warranty>div+div{border-left:1px solid var(--line)}
.warranty .num{font:400 clamp(4.5rem,10vw,8rem)/.85 var(--sans);font-stretch:85%;letter-spacing:-.06em;color:var(--ink)}
.warranty .num sup{font:500 .8rem var(--mono);letter-spacing:.08em;vertical-align:top;margin-left:8px;color:var(--sky-ink)}
.warranty p{margin-top:20px}
.brand-list{columns:2;column-gap:24px;list-style:none;font:400 .95rem/2.2 var(--mono);color:var(--muted)}
.brand-list li{border-bottom:1px solid var(--line)}
@media(max-width:800px){.warranty{grid-template-columns:1fr}.warranty>div{padding:28px}.warranty>div+div{border-left:0;border-top:1px solid var(--line)}}

/* avaliações: três colunas correndo em sentidos opostos, com esmaecido no topo e na base */
.reviews-head{display:flex;justify-content:space-between;align-items:end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.reviews-head .mono{color:var(--sky-ink);display:block;margin-bottom:18px}
.rating{display:flex;align-items:baseline;gap:14px}
.rating strong{font:400 4rem/1 var(--sans);letter-spacing:-.05em;color:var(--ink)}
.stars{color:#F5A623;letter-spacing:2px}
.wall{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;height:820px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 13%,#000 87%,transparent);mask-image:linear-gradient(transparent,#000 13%,#000 87%,transparent)}
.col{min-width:0}
.col-track{animation:rise var(--dur,90s) linear infinite}
.col.down .col-track{animation-name:fall}
@keyframes rise{from{transform:translateY(0)}to{transform:translateY(-50%)}}
@keyframes fall{from{transform:translateY(-50%)}to{transform:translateY(0)}}
.review{background:var(--paper);border:1px solid var(--line);padding:24px;margin-bottom:16px;display:flex;flex-direction:column;gap:12px}
.review p{color:var(--ink);font-size:.98rem}
.review footer{display:flex;justify-content:space-between;align-items:baseline;gap:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:12px}
.review footer b{font-weight:500;color:var(--ink)}
@media(max-width:900px){.wall{grid-template-columns:1fr 1fr;height:720px}.col:nth-child(3){display:none}}
@media(max-width:560px){.wall{grid-template-columns:1fr;height:640px}.col:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){.wall{overflow-y:auto}}

/* chamada para empresas */
.biz{display:grid;grid-template-columns:1fr 1fr;background:var(--sky);color:var(--navy)}
.biz img{width:100%;height:100%;object-fit:cover;min-height:360px}
.biz>div{padding:56px;display:flex;flex-direction:column;gap:18px;justify-content:center}
.biz p{color:#0B3350}
.biz .go{font:500 1.05rem var(--sans);display:flex;gap:10px;align-items:center}
.biz .go::after{content:"→"}
@media(max-width:800px){.biz{grid-template-columns:1fr}.biz>div{padding:32px 24px}.biz img{min-height:220px}}

/* fechamento: frase gigante correndo atrás do título (adaptado do "Worth Keeping CTA" do 21st.dev) */
.closing{position:relative;overflow:hidden;padding:140px 0;text-align:center}
.closing .wrap{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:22px}
.closing h2{font-size:clamp(2.4rem,6vw,5rem);color:#fff}
.giant{position:absolute;inset:0;display:flex;align-items:center;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent);mask-image:linear-gradient(90deg,transparent,#000 20%,#000 80%,transparent)}
.giant-track{white-space:nowrap;font-size:clamp(5rem,16vw,14rem);font-weight:500;letter-spacing:-.04em;text-transform:none;color:rgba(255,255,255,.045);animation:slide 90s linear infinite}
.btn-xl{height:64px;padding:0 30px;font-size:1.1rem;gap:40px;margin-top:10px}

/* calculadora de BTUs (régua de marcações inspirada no "Marks Slider" do 21st.dev) */
.calc{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);border:1px solid var(--line)}
.calc-in{padding:32px;display:grid;gap:28px}
.calc fieldset{border:0;display:grid;gap:12px}
.calc legend,.calc .field>label{color:var(--muted);margin-bottom:12px;display:block}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:block;padding:10px 16px;border:1px solid var(--line);cursor:pointer;font-size:.95rem}
.chips input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.chips input:focus-visible+span{outline:2px solid var(--sky);outline-offset:2px}
.area-row{display:flex;align-items:center;gap:18px}
.area-row output{font:400 2.4rem/1 var(--sans);letter-spacing:-.04em;min-width:2.2ch;text-align:right}
.area-row .unit{color:var(--muted);margin-left:-12px}
input[type=range]{flex:1;-webkit-appearance:none;appearance:none;height:4px;background:linear-gradient(90deg,var(--sky) var(--p,10%),var(--line) var(--p,10%));outline:none}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;background:var(--navy);border:3px solid var(--sky);cursor:grab}
input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--navy);border:3px solid var(--sky);border-radius:0;cursor:grab}
input[type=range]:focus-visible::-webkit-slider-thumb{outline:2px solid var(--sky);outline-offset:3px}
.ruler{display:flex;justify-content:space-between;margin-top:10px;color:var(--muted);padding-right:90px;background:repeating-linear-gradient(90deg,var(--line) 0 1px,transparent 1px calc((100% - 90px)/15)) top/100% 6px no-repeat;padding-top:10px}
.steps2{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:end}
.step{display:grid;grid-template-columns:48px 1fr 48px;height:48px;border:1px solid var(--line)}
.step button{border:0;background:var(--paper);font-size:1.3rem;cursor:pointer;color:var(--ink)}
.step input{border:0;border-left:1px solid var(--line);border-right:1px solid var(--line);text-align:center;font:500 1.1rem var(--sans);color:var(--ink);-moz-appearance:textfield;width:100%}
.step input::-webkit-inner-spin-button{-webkit-appearance:none}
.calc-out{background:var(--navy);color:#fff;padding:32px;display:flex;flex-direction:column;gap:14px}
.calc-out>.mono{color:var(--sky)}
.btu{display:flex;align-items:baseline;gap:12px}
.btu strong{font:400 clamp(3rem,5vw,4.6rem)/1 var(--sans);letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.btu .mono{color:#7F93A8}
.calc-out p{color:#C9D4DF}
.calc-out .btn{justify-content:space-between}
.calc-out .js-add{margin-top:auto;color:#fff;border-color:rgba(255,255,255,.35);background:transparent}
.calc-out .js-add .mono{color:#7F93A8;font-size:.7rem}
.calc-note{font-size:.85rem;color:#7F93A8!important}
@media(max-width:900px){.calc{grid-template-columns:1fr}.calc-in,.calc-out{padding:24px}.steps2{grid-template-columns:1fr}.ruler{padding-right:74px}}

footer.site{background:var(--navy);color:#A9B7C6;border-top:1px solid var(--line-d);padding:56px 0 32px;font-size:.95rem}
footer.site .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:32px}
footer.site .mono{color:#7F93A8;display:block;margin-bottom:14px}
footer.site ul{list-style:none;display:grid;gap:8px}
footer.site a:hover{color:#fff}
footer.site .base{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:48px;padding-top:20px;border-top:1px solid var(--line-d)}
footer.site .made b{color:#fff;font-weight:600;letter-spacing:.04em}
@media(max-width:760px){footer.site .cols{grid-template-columns:1fr}}

.wa{position:fixed;right:18px;bottom:18px;z-index:50;width:56px;height:56px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.wa svg{width:28px;height:28px;color:#fff}

/* empresas */
.clauses{list-style:none;border-top:1px solid var(--line)}
.clauses li{display:grid;grid-template-columns:120px 1fr;gap:24px;padding:24px 0;border-bottom:1px solid var(--line)}
.clauses .mono{color:var(--sky-ink);padding-top:4px}
.clauses p{color:var(--ink)}
.clauses small{display:block;color:var(--muted);font-size:.9rem;margin-top:4px}
.alert{margin-top:28px;background:var(--navy);color:#fff;padding:24px 28px;display:flex;gap:18px}
.alert .mono{color:var(--sky);white-space:nowrap;padding-top:3px}
.who{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
.who span{border:1px solid var(--line);padding:8px 14px;font-size:.93rem}
.timeline{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-d)}
.timeline li{padding:28px 24px 0 0;position:relative}
.timeline li::before{content:"";position:absolute;top:-5px;left:0;width:9px;height:9px;background:var(--sky)}
.timeline .mono{color:var(--sky);display:block;margin-bottom:14px}
.timeline b{font-weight:500;display:block;margin-bottom:6px;color:#fff}
@media(max-width:800px){.timeline{grid-template-columns:1fr 1fr;gap:32px 0}}
.segs{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.segs figure{position:relative;aspect-ratio:3/4;overflow:hidden}
.segs img{width:100%;height:100%;object-fit:cover}
.segs figcaption{position:absolute;left:0;bottom:0;right:0;padding:14px;background:linear-gradient(transparent,rgba(11,31,51,.85));color:#fff}
@media(max-width:800px){.segs{grid-template-columns:1fr 1fr}}
details{border-bottom:1px solid var(--line)}
details:first-child{border-top:1px solid var(--line)}
summary{list-style:none;cursor:pointer;padding:22px 0;font-size:1.1rem;display:flex;justify-content:space-between;gap:24px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:400 1.4rem/1 var(--mono);color:var(--sky-ink)}
details[open] summary::after{content:"−"}
details p{padding:0 40px 24px 0}

/* movimento: só texto e entrada de blocos; foto fica parada */
.js [data-reveal]{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--d,0)*80ms)}
.js [data-reveal].in{opacity:1;transform:none}
.js .hero h1 .ln{display:block;overflow:hidden;padding:.02em 0 .12em;margin-bottom:-.1em}
.js .hero h1 .ln>span{display:block;transform:translateY(105%);animation:up .9s cubic-bezier(.2,.7,.2,1) forwards;animation-delay:calc(var(--i)*110ms + 100ms)}
@keyframes up{to{transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js [data-reveal],.js .hero h1 .ln>span{opacity:1!important;transform:none!important}}
.track img.solid{filter:grayscale(1) contrast(1.1);opacity:.75;padding:20px 70px}
.hero-photo img{height:auto}
.block .wrap>*{min-width:0}
.calc.is-projeto .btu strong{font-size:clamp(2.2rem,3.6vw,3.2rem);letter-spacing:-.035em;line-height:1.02;color:var(--sky)}
.calc.is-projeto .btu .mono{display:none}
/* lista de ambientes da calculadora */
.lista{grid-column:1/-1;border-top:1px solid var(--line);padding:24px 32px 28px;background:var(--paper)}
.lista-head{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--muted);margin-bottom:12px}
.lista-head .js-total{color:var(--ink)}
.lista ul{list-style:none}
.lista li{display:grid;grid-template-columns:1fr 1.4fr auto 36px;gap:16px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line)}
.lista li b{font-weight:500}
.lista li span{color:var(--muted);font-size:.95rem}
.lista li strong{font-weight:500;font-variant-numeric:tabular-nums}
.lista li button{width:32px;height:32px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:1.1rem;color:var(--muted)}
@media(max-width:600px){.lista{padding:20px}.lista li{grid-template-columns:1fr auto 36px}.lista li span{grid-column:1;grid-row:2;font-size:.85rem}}
