/* hero */
.hero{position:relative;height:580vh}
.stage{position:sticky;top:0;height:100vh;overflow:hidden}
.cam{position:absolute;left:0;top:0;width:100vh;height:100vh;transform-origin:0 0;will-change:transform}
.cam img,.cam .dim,.cam .glow,.cam .plan{position:absolute;inset:0;width:100%;height:100%}
.cam img{object-fit:cover;opacity:0;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 3%,#000 97%,transparent);
  -webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent,#000 4%,#000 96%,transparent),linear-gradient(transparent,#000 3%,#000 97%,transparent);mask-composite:intersect}
.cam .dim{background:#0A1020;opacity:.55}
.cam .glow{opacity:0}
.glow{mix-blend-mode:screen;background:
  radial-gradient(circle at 23.9% 21.7%,rgba(255,196,120,.55),transparent 5%),
  radial-gradient(circle at 36.8% 21.7%,rgba(255,196,120,.55),transparent 5%),
  radial-gradient(circle at 50.8% 21.7%,rgba(255,196,120,.55),transparent 5%),
  radial-gradient(ellipse 14% 10% at 42% 34%,rgba(255,200,130,.28),transparent 100%),
  radial-gradient(circle at 24% 51%,rgba(255,196,120,.45),transparent 4.5%),
  radial-gradient(circle at 46% 50.5%,rgba(255,196,120,.45),transparent 4.5%),
  radial-gradient(circle at 67% 51%,rgba(255,196,120,.45),transparent 4.5%),
  radial-gradient(ellipse 12% 10% at 56% 62%,rgba(255,190,110,.3),transparent 100%),
  radial-gradient(circle at 4% 73%,rgba(255,200,120,.4),transparent 6%),
  radial-gradient(circle at 12% 77%,rgba(255,200,120,.35),transparent 5%),
  radial-gradient(circle at 90% 74%,rgba(255,200,120,.35),transparent 6%),
  radial-gradient(circle at 71% 78%,rgba(255,200,120,.3),transparent 5%)}
.plan{overflow:visible;--draw:0}
.plan path{fill:none;stroke:var(--accent);stroke-width:1.8;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;
  --d:clamp(0,(var(--draw) - var(--t,0))*3.2,1);stroke-dashoffset:calc(1 - var(--d))}
.plan .fine path{stroke:var(--line);stroke-width:1.1}
.plan .cota path{stroke:var(--line);stroke-width:1.1}
.plan text{font:500 22px var(--display);fill:var(--text-secondary);letter-spacing:.16em;opacity:clamp(0,(var(--draw) - .7)*4,1)}
.scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 55% 45%,rgba(10,14,26,0) 40%,rgba(10,14,26,.6) 100%)}
.shade{position:absolute;inset:0;pointer-events:none;opacity:0;background:linear-gradient(90deg,rgba(8,12,22,.88) 0%,rgba(8,12,22,.6) 30%,rgba(8,12,22,0) 60%),linear-gradient(0deg,rgba(8,12,22,.7) 0%,rgba(8,12,22,0) 42%)}

.band{position:absolute;left:var(--gutter);top:50%;transform:translateY(-50%);width:min(29vw,480px);opacity:0;text-shadow:var(--tshadow);--k:0}
.band::before{content:"";position:absolute;inset:-30% -40% -30% -60%;z-index:-1;pointer-events:none;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 60% 56% at 42% 50%,rgba(6,9,18,var(--sa,.55)) 0%,rgba(6,9,18,calc(var(--sa,.55)*.62)) 46%,rgba(6,9,18,0) 76%)}
.band .kick{margin-bottom:22px}
.band .t{font:400 clamp(36px,4vw,64px)/1.06 var(--display);letter-spacing:-.01em}
.band .s{margin-top:22px;font-size:clamp(17px,1.3vw,19.5px);color:var(--text-secondary);max-width:38ch}
.band.settle{top:auto;bottom:11vh;transform:none;width:min(48vw,700px)}
.band.settle .t{font-size:clamp(40px,4.6vw,74px)}
.band.settle .s{color:#DCD6CB}
.band .btn{text-shadow:none}
.w{display:inline-block;white-space:nowrap}
.c{display:inline-block}

/* faixa 1: alinhamento em grade, como uma caneta escrevendo */
.e-grid .c{--kc:clamp(0,(var(--k) - var(--th,0))*3,1);opacity:var(--kc);transform:translateX(calc((1 - var(--kc))*var(--jx,0px)))}
.e-grid .s,.e-grid .kick{opacity:clamp(0,(var(--k) - .45)*3,1)}
/* faixa 2: desfoque para nítido */
.e-blur .stack{display:grid}
.e-blur .stack>*{grid-area:1/1}
.e-blur .soft{filter:blur(10px);opacity:calc(min(1,var(--k)*2.5)*(1 - var(--k)))}
.e-blur .sharp{opacity:clamp(0,(var(--k) - .25)/.75,1)}
.e-blur .s,.e-blur .kick{opacity:clamp(0,(var(--k) - .5)*3,1)}
/* faixa 3: deriva para baixo */
.e-drift .w{--kc:clamp(0,(var(--k) - var(--th,0))*2.8,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*-26px))}
.e-drift .kick{opacity:var(--k)}
/* faixa 4: subida em etapas */
.e-rise .w{--kc:clamp(0,(var(--k) - var(--th,0))*3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*28px))}
.e-rise .kick{opacity:clamp(0,var(--k)*3,1)}
.e-rise .s{--ks:clamp(0,(var(--k) - .62)*4,1);opacity:var(--ks);transform:translateY(calc((1 - var(--ks))*14px))}
.e-rise .ctas{--kb:clamp(0,(var(--k) - .76)*5,1);opacity:var(--kb);transform:translateY(calc((1 - var(--kb))*14px));display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}

.hud{position:absolute;right:var(--gutter);bottom:5vh;display:flex;gap:14px;align-items:center;padding:10px 14px;font:500 11.5px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.chip{background:rgba(8,12,22,.55);border:1px solid rgba(127,141,168,.3);border-radius:10px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);text-shadow:0 1px 3px rgba(5,8,16,.85)}
.hud b{font-weight:500;color:var(--text-primary)}
.hud .bar{width:90px;height:2px;background:rgba(127,141,168,.3);position:relative;overflow:hidden;border-radius:2px}
.hud .bar i{position:absolute;inset:0;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--hp,0))}
.cue{position:absolute;left:50%;bottom:4.5vh;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font:500 11.5px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--text-secondary);transition:opacity .6s var(--ease-out)}
.cue span{display:block;width:1px;height:42px;background:linear-gradient(var(--accent),transparent);transform-origin:top;animation:cue 2.6s var(--ease-io) infinite;animation-delay:-.8s}
@keyframes cue{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
.cue.gone{opacity:0}
@media (max-height:560px){.hud,.cue{display:none}}

/* hero estático: os cinco portões, idênticos aos do JS */
@media (max-width:720px),(orientation:portrait) and (max-width:1024px),(orientation:portrait) and (pointer:coarse),(orientation:landscape) and (pointer:coarse) and (max-height:560px),(prefers-reduced-motion:reduce){
  .hero{height:auto}
  .stage{position:relative;height:auto;min-height:100svh;display:flex;align-items:flex-end}
  .cam{width:100%!important;height:100%!important;transform:none!important}
  .cam img{opacity:1!important;object-position:58% 74%;-webkit-mask-image:none;mask-image:none}
  .cam .dim{opacity:0!important}.cam .glow{opacity:.8!important}
  .plan,.hud,.cue,.shade,.band:not(.settle){display:none}
  .stage::after{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,14,26,.2) 15%,rgba(10,14,26,.78) 55%,rgba(10,14,26,.94) 92%);pointer-events:none}
  .band.settle{position:relative;z-index:2;opacity:1!important;--k:1!important;left:auto;bottom:auto;width:auto;margin:0 var(--gutter);padding:140px 0 64px;max-width:640px}
  .band.settle::before{display:none}
}

/* cota: a assinatura, compacta */
.cota{display:flex;align-items:center;gap:14px;width:min(100%,340px);color:var(--accent);font:500 12px/1 var(--display);letter-spacing:.22em;text-transform:uppercase}
.cota svg{flex:1;min-width:0;width:100%;height:16px;overflow:visible}
.cota path{fill:none;stroke:var(--accent);stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s var(--ease-io)}
.in .cota path{stroke-dashoffset:0}
.cota .tick{transition-delay:.8s}

/* 1: o seu sonho */
.sonho{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(40px,7vw,120px);align-items:end}
.sonho .side p{color:var(--text-secondary);max-width:42ch}
.sonho .side p+p{margin-top:18px}
.sonho .side strong{color:var(--text-primary);font-weight:500}
.sonho .side .cota{margin-top:34px}
.desejos{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,28px);margin-top:clamp(48px,6vw,80px);list-style:none}
.desejos li{position:relative;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line-soft);border-radius:18px;overflow:hidden;transition:transform .5s var(--ease-out),border-color .5s var(--ease-out),opacity .9s var(--ease-out)}
.desejos li:hover{transform:translateY(-4px);border-color:rgba(205,140,40,.45)}
.ill{display:block;aspect-ratio:16/10;background:radial-gradient(ellipse 70% 80% at 50% 100%,rgba(205,140,40,.12),transparent 70%),linear-gradient(180deg,var(--panel-2),var(--panel));border-bottom:1px solid var(--line-soft)}
.ill svg{width:100%;height:100%}
.ill path,.ill circle,.ill rect{fill:none;stroke:#AEB8CC;stroke-width:1.8;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset 2s var(--ease-io)}
.ill .g{stroke:var(--accent);stroke-width:2.2}
.ill .f{fill:rgba(205,140,40,.18);stroke:none;opacity:0;transition:opacity 1.2s var(--ease-out) 1.4s}
.in .ill path,.in .ill circle,.in .ill rect{stroke-dashoffset:0}
.in .ill .f{opacity:1}
.ill .d2{transition-delay:.35s}.ill .d3{transition-delay:.7s}
.live .ill .sun{animation:sunpulse 6s var(--ease-io) infinite;animation-delay:-2s}
@keyframes sunpulse{0%,100%{opacity:1}50%{opacity:.55}}
.desejos .txt{padding:24px 26px 28px}
.desejos .n{display:block;font:500 12px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.desejos b{display:block;font:500 21px/1.3 var(--display);margin-bottom:8px}
.desejos span:not(.n){color:var(--text-secondary);font-size:16px}
@media (max-width:860px){.sonho{grid-template-columns:minmax(0,1fr)}.desejos{grid-template-columns:minmax(0,1fr)}}

/* um dia na casa nova: o sol atravessa o céu de manhã até a noite */
.dia .como-head{margin-bottom:clamp(24px,3vw,40px)}
.arco{position:relative;height:120px;margin:0 0 clamp(18px,2vw,28px)}
.arco svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
.arco path{fill:none;stroke:var(--line);stroke-width:1.2;vector-effect:non-scaling-stroke;stroke-dasharray:1 1;stroke-dashoffset:1;opacity:.7;transition:stroke-dashoffset 2.4s var(--ease-io)}
.in .arco path{stroke-dashoffset:0}
.arco i{position:absolute;left:var(--x);top:var(--y);width:16px;height:16px;margin:-8px 0 0 -8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 6px rgba(205,140,40,.16),0 0 28px 6px rgba(205,140,40,.45);opacity:0;transform:scale(.3);transition:opacity .8s var(--ease-out),transform .9s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(.6s + var(--d)*.55s)}
.arco i.lua{background:#E6E2D6;box-shadow:0 0 0 6px rgba(230,226,214,.1),0 0 26px 4px rgba(200,210,235,.35)}
.in .arco i{opacity:1;transform:none}
.live .arco i:not(.lua){animation:sunpulse 5s var(--ease-io) infinite}
.dia-list{list-style:none;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,36px);counter-reset:d}
.dia-ph{position:relative;margin:0 0 24px;border-radius:18px;aspect-ratio:4/5;background:var(--panel)}
.dia-ph img{object-position:50% 60%}
.dia-ph::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 60%,rgba(8,12,22,.45));pointer-events:none}
.hora{display:flex;align-items:baseline;gap:12px;font:400 clamp(34px,3.2vw,48px)/1 var(--display);color:var(--accent)}
.hora small{font:500 12px/1 var(--display);letter-spacing:.22em;text-transform:uppercase;color:var(--text-secondary)}
.dia-list h3{margin:14px 0 10px}
.dia-list p{color:var(--text-secondary);font-size:16.5px;max-width:34ch}
.dia-fim{display:flex;justify-content:center;align-items:center;gap:20px 32px;flex-wrap:wrap;margin-top:clamp(48px,6vw,80px);padding-top:clamp(32px,4vw,48px);border-top:1px solid var(--line-soft);text-align:center}
.dia-fim p{font:400 clamp(22px,2.2vw,32px)/1.25 var(--display)}
@media (max-width:860px){.arco{display:none}.dia-list{grid-template-columns:minmax(0,1fr);gap:56px}.dia-ph{aspect-ratio:4/4.4}}

/* 2: como trabalhamos */
.como-head{display:flex;justify-content:space-between;align-items:end;gap:40px;flex-wrap:wrap;margin-bottom:clamp(56px,7vw,90px)}
.steps{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.6vw,40px);list-style:none}
.steps::before{content:"";position:absolute;left:0;right:0;top:27px;height:1px;background:var(--line);opacity:.6;transform-origin:0 50%;transform:scaleX(0);transition:transform 2.2s var(--ease-io)}
.steps.in::before{transform:scaleX(1)}
.step .num{position:relative;display:inline-flex;align-items:center;justify-content:center;width:54px;height:54px;border-radius:50%;background:var(--canvas);border:1px solid var(--border);font:500 14px var(--display);color:var(--accent);letter-spacing:.08em}
.step .ico{display:block;width:100%;aspect-ratio:4/3;margin:30px 0 26px;border:1px solid var(--line-soft);border-radius:14px;background:linear-gradient(180deg,rgba(27,40,67,.7),rgba(22,33,58,.35))}
.step .ico svg{width:100%;height:100%}
.step .ico path,.step .ico rect,.step .ico circle{fill:none;stroke:var(--line);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linecap:round;stroke-linejoin:round}
.step .ico .g{stroke:var(--accent);stroke-width:1.8}
.step h3{margin-bottom:10px}
.step p{color:var(--text-secondary);font-size:16.5px;max-width:30ch}
.live .step .ico .g{animation:breathe 5s var(--ease-io) infinite}
.step:nth-child(2) .ico .g{animation-delay:-1.2s}.step:nth-child(3) .ico .g{animation-delay:-2.4s}.step:nth-child(4) .ico .g{animation-delay:-3.6s}
@keyframes breathe{0%,100%{opacity:1}50%{opacity:.45}}
@media (max-width:980px){.steps{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:56px}.steps::before{display:none}}
@media (max-width:560px){.steps{grid-template-columns:minmax(0,1fr)}}

/* 3: detalhes */
.detalhes{display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,2fr);gap:clamp(40px,6vw,96px);align-items:start}
.detalhes .intro{position:sticky;top:120px}
.detalhes .intro p{margin-top:24px}
.gal{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,2vw,28px)}
.card{position:relative;margin:0;border-radius:16px;overflow:hidden;background:var(--panel);aspect-ratio:4/5}
.card:nth-child(even){margin-top:clamp(40px,6vw,96px)}
.card img{width:100%;height:100%;object-fit:cover;transform:scale(1.04);transition:transform 1.6s var(--ease-out)}
.card:hover img{transform:scale(1.1)}
.card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 50%,rgba(8,12,22,.85));pointer-events:none}
.card::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(105deg,transparent 40%,rgba(255,220,170,.12) 50%,transparent 60%);transform:translateX(-120%)}
.live .card::before{animation:sweep 9s var(--ease-io) infinite}
.card:nth-child(2)::before{animation-delay:-2.2s}.card:nth-child(3)::before{animation-delay:-4.4s}.card:nth-child(4)::before{animation-delay:-6.6s}
@keyframes sweep{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
.card figcaption{position:absolute;left:20px;right:20px;bottom:20px;z-index:2;font-size:16.5px;line-height:1.35}
.card figcaption span{display:block;font:500 11.5px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
@media (max-width:980px){.detalhes{grid-template-columns:minmax(0,1fr)}.detalhes .intro{position:static}}
@media (max-width:640px){.card:nth-child(even){margin-top:40px}}

/* obras entregues (montado pelo gerador) */
.obras{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:clamp(16px,2.2vw,32px)}
.obras .pcard .ph{aspect-ratio:16/10}

/* 4: garantias, o momento interativo */
.garantias{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:center;--h:0}
.casa-noite{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:1/1;background:var(--panel)}
.casa-noite img,.casa-noite .dim,.casa-noite .glow{position:absolute;inset:0;width:100%;height:100%}
.casa-noite img{object-fit:cover}
.casa-noite .dim{background:#070C18;opacity:calc(.78*(1 - var(--h)))}
.casa-noite .glow{opacity:var(--h)}
.casa-noite .tag{position:absolute;left:18px;top:18px;padding:9px 12px;font:500 11.5px/1 var(--display);letter-spacing:.2em;text-transform:uppercase;color:var(--text-secondary)}
.hold{position:relative;margin-top:36px;display:inline-flex;align-items:center;gap:16px;padding:10px 26px 10px 10px;border-radius:999px;border:1px solid var(--border);background:rgba(22,33,58,.6);color:var(--text-primary);font:500 16px/1.2 var(--body);cursor:pointer;user-select:none;-webkit-user-select:none;touch-action:none;transition:border-color .4s var(--ease-out),background .4s var(--ease-out),opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.hold:hover{border-color:var(--accent)}
.hold .ring{position:relative;width:52px;height:52px;flex:none}
.hold .ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.hold .ring circle{fill:none;stroke-width:2.5}
.hold .ring .bg{stroke:rgba(127,141,168,.3)}
.hold .ring .fg{stroke:var(--accent);stroke-dasharray:126;stroke-dashoffset:calc(126*(1 - var(--h)))}
.hold .ring .key{position:absolute;inset:0;margin:auto;width:20px;height:20px;color:var(--accent);transform:none}
.hold .ring::after{content:"";position:absolute;inset:-6px;border-radius:50%;box-shadow:0 0 26px 4px rgba(205,140,40,.45);opacity:0}
.live .hold .ring::after{animation:pulse 4.5s var(--ease-io) infinite;animation-delay:-1s}
@keyframes pulse{0%,100%{opacity:0}50%{opacity:.7}}
.garantias.done .hold{border-color:var(--accent);cursor:default}
.garantias.done .ring::after{animation:none!important;opacity:.5}
.glist{list-style:none;margin-top:44px;display:grid}
.glist li{display:grid;grid-template-columns:28px 1fr;gap:14px;padding:16px 0;border-top:1px solid var(--line-soft);opacity:.84;transition:opacity .8s var(--ease-out)}
.glist li:last-child{border-bottom:1px solid var(--line-soft)}
.glist svg{width:20px;height:20px;margin-top:3px}
.glist svg path{fill:none;stroke:var(--accent);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1 1;stroke-dashoffset:1;transition:stroke-dashoffset .7s var(--ease-out)}
.glist b{display:block;font:500 18px/1.3 var(--body)}
.glist span{color:var(--text-secondary);font-size:16px}
.garantias.done .glist li{opacity:1;transition-delay:calc(var(--i)*140ms)}
.garantias.done .glist svg path{stroke-dashoffset:0;transition-delay:calc(var(--i)*140ms + 120ms)}
@media (max-width:900px){.garantias{grid-template-columns:minmax(0,1fr)}}

/* 5: perguntas */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(40px,6vw,110px);align-items:start}
.faq-list details{border-top:1px solid var(--line-soft)}
.faq-list details:last-child{border-bottom:1px solid var(--line-soft)}
.faq-list summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:24px 0;font:500 clamp(18px,1.45vw,21px)/1.35 var(--body);transition:color .3s var(--ease-out)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:hover{color:var(--accent-hover)}
.faq-list summary i{position:relative;flex:none;width:14px;height:14px}
.faq-list summary i::before,.faq-list summary i::after{content:"";position:absolute;left:0;top:6.5px;width:14px;height:1.5px;background:currentColor;transition:transform .45s var(--ease-out)}
.faq-list summary i::after{transform:rotate(90deg)}
.faq-list details[open] summary i::after{transform:rotate(0)}
.faq-list .a{overflow:hidden;display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease-out)}
.faq-list details[open] .a{grid-template-rows:1fr}
.faq-list .a>div{min-height:0}
.faq-list .a p{padding:0 0 26px;color:var(--text-secondary);max-width:58ch}
@media (max-width:860px){.faq{grid-template-columns:minmax(0,1fr)}}

/* 6: contato */
.contato{position:relative;overflow:hidden;padding:clamp(110px,14vw,190px) var(--gutter)}
.contato .bgimg{position:absolute;inset:0;z-index:-1}
.contato .bgimg img{width:100%;height:100%;object-fit:cover;object-position:50% 70%;opacity:.42}
.contato .bgimg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--canvas) 18%,rgba(14,22,38,.8) 55%,rgba(14,22,38,.45)),linear-gradient(var(--canvas),transparent 20%,transparent 80%,var(--canvas))}
.contato-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,100px);align-items:start}
.form{background:rgba(22,33,58,.85);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid var(--line-soft);border-radius:20px;padding:clamp(24px,3vw,40px)}
.field{display:grid;gap:8px;margin-bottom:18px}
.field label{font:500 12px/1.2 var(--display);letter-spacing:.18em;text-transform:uppercase;color:var(--text-secondary)}
.field input,.field select,.field textarea{width:100%;font:400 16px/1.4 var(--body);color:var(--text-primary);background:rgba(14,22,38,.7);border:1px solid var(--border);border-radius:10px;padding:14px;transition:border-color .3s var(--ease-out),background .3s var(--ease-out);-webkit-appearance:none;appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--text-secondary) 50%),linear-gradient(135deg,var(--text-secondary) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.field select option{background:var(--panel);color:var(--text-primary)}
.field textarea{min-height:96px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#8A93A6}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--accent);background:rgba(14,22,38,.95)}
.row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}
.form .btn{width:100%;margin-top:8px}
.micro{margin-top:14px;font-size:14px;color:var(--text-secondary);text-align:center}
.ok{display:none;text-align:center;padding:30px 6px}
.ok svg{width:54px;height:54px;margin:0 auto 20px}
.ok svg path,.ok svg circle{fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ok h3{margin-bottom:10px}
.ok p{color:var(--text-secondary)}
.ok a{color:var(--accent-hover)}
.form.sent form{display:none}
.form.sent .ok{display:block;animation:pagein .8s var(--ease-out) both}
.contato .lede{margin-top:24px}
.perks{list-style:none;margin-top:36px;display:grid;gap:14px}
.perks li{display:flex;align-items:baseline;gap:14px;color:var(--text-secondary)}
.perks li::before{content:"";flex:none;width:18px;height:1.5px;background:var(--accent);transform:translateY(-4px)}
@media (max-width:900px){.contato-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:480px){.row2{grid-template-columns:minmax(0,1fr)}}

@media (prefers-reduced-motion:reduce){
  .cota path,.ill path,.ill circle,.ill rect,.arco path{stroke-dashoffset:0}
  .arco i{opacity:1;transform:none}
  .ill .f{opacity:1}
  .steps::before{transform:scaleX(1)}
  .garantias{--h:1!important}
  .glist li{opacity:1}.glist svg path{stroke-dashoffset:0}
}