/* Dardah Masonry · site
   Blocos, formas, texturas e animações tirados das referências escolhidas pelo Lucas:
   header do Buildexo (painel azul com corte diagonal), hero da Home do Indox (foto inteira, cartão escuro, marcador amarelo, quarto de círculo),
   hero de Services e Projects do Consik (centrado, barra de formulário, cunha), hero de Contact do BuildNest home 3 (claro, foto arredondada),
   sobre do Indox (quarto de círculo "Since", lista com setas), contadores do Carpento (círculos sobre caixas contornadas),
   serviços do Consten (ícone de linha, base angulada, barra de progresso), textura hexagonal e cortes do Consik,
   página de serviço do Carpento (barra lateral), cards escuros do BuildNest.
   Paleta da identidade Dardah: azul predominante, amarelo de detalhe, cinza e branco para respirar. */

:root{
  --navy:#0a1a40;--navy-2:#002a45;--navy-3:#061232;--ink:#1b1b1b;
  --yellow:#fdc500;--yellow-2:#c8920a;--cream:#ffefc7;--white:#fff;
  --gray-1:#f4f5f7;--gray-2:#e6e8ec;--gray-3:#c9ced6;--gray-5:#5a6578;
  --on-navy:#e9edf5;--on-navy-muted:#aeb8cc;
  --display:"Varien","Unbounded","Archivo Black",Impact,sans-serif;
  --body:"Agrandir Wide","Archivo","Segoe UI",Roboto,Arial,sans-serif;
  --human:"Gaglio","Outfit","Archivo",Arial,sans-serif;
  --w:1240px;--gutter:clamp(16px,4vw,40px);--r:6px;
  --shadow:0 18px 50px rgba(6,18,50,.18);--ease:cubic-bezier(.2,.7,.2,1);--t:.45s;
  --hex:url("/assets/img/brand/hex.svg");--hex-navy:url("/assets/img/brand/hex-navy.svg");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--white);color:var(--ink);font:400 16px/1.6 var(--body);font-stretch:110%;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--display);line-height:1.08;margin:0;letter-spacing:-.01em;text-wrap:balance}
h1{font-weight:700;font-size:clamp(32px,4.6vw,58px)}
h2{font-weight:700;font-size:clamp(26px,3.3vw,42px)}
h3{font-weight:600;font-size:clamp(18px,1.6vw,22px)}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit}
.hl{color:var(--yellow)}
.hl2{color:var(--yellow-2)}
.wrap{max-width:var(--w);margin:0 auto;padding:0 var(--gutter)}
.skip{position:absolute;left:-9999px;top:0;background:var(--yellow);color:var(--navy);padding:8px 12px;z-index:200}
.skip:focus{left:8px;top:8px}
.pend{border-bottom:2px dashed var(--yellow-2);cursor:help}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ---------- botões ---------- */
.btn{display:inline-flex;align-items:center;gap:10px;font:600 15px/1 var(--body);text-decoration:none;padding:16px 24px;border-radius:var(--r);border:2px solid transparent;cursor:pointer;transition:transform var(--t) var(--ease),background var(--t),color var(--t),box-shadow var(--t);white-space:nowrap}
.btn svg{width:18px;height:18px;flex:none;transition:transform var(--t) var(--ease)}
.btn:hover svg{transform:translateX(4px)}
.btn-y{background:var(--yellow);color:var(--navy)}
.btn-y:hover{background:#ffd43a;transform:translateY(-2px);box-shadow:0 10px 24px rgba(253,197,0,.35)}
.btn-n{background:var(--navy);color:#fff}
.btn-n:hover{background:var(--navy-2);transform:translateY(-2px)}
.btn-o{background:transparent;color:#fff;border-color:rgba(255,255,255,.45)}
.btn-o:hover{border-color:#fff;background:rgba(255,255,255,.08)}
.btn-ghost{background:transparent;color:var(--navy);border-color:var(--navy)}
.btn-ghost:hover{background:var(--navy);color:#fff}
.btn-block{width:100%;justify-content:center}
.btn-pill{border-radius:999px;padding:16px 28px}
.btn-cut{border-radius:0;clip-path:polygon(0 0,100% 0,calc(100% - 14px) 100%,0 100%);padding-right:34px}
.link{display:inline-flex;align-items:center;gap:8px;font-weight:600;color:var(--navy);text-decoration:none;border-bottom:2px solid var(--yellow);padding-bottom:2px}
.link svg{width:16px;height:16px;transition:transform var(--t) var(--ease)}
.link:hover svg{transform:translateX(4px)}
.phone{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:600}
.phone .ic{width:40px;height:40px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;flex:none}
.phone .ic svg{width:18px;height:18px}
.phone small{display:block;font:400 12px/1.2 var(--body);opacity:.75;white-space:nowrap}
.phone b{display:block;font:600 17px/1.2 var(--body);white-space:nowrap}
/* ---------- header (Buildexo: branco com painel azul em corte diagonal) ---------- */
.topbar{display:none}
.header{position:sticky;top:0;z-index:100;background:#fff;color:var(--navy);transition:box-shadow var(--t)}
.header.scrolled{box-shadow:0 8px 30px rgba(6,18,50,.14)}
.header .wrap{display:grid;grid-template-columns:auto 1fr;align-items:stretch;gap:0;max-width:none;padding:0 0 0 var(--gutter)}
.header .brandbox{display:flex;align-items:center;padding-right:44px}
.topcall{display:none}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.brand img{flex:none}
.brand .mk{width:58px;height:58px;transition:width var(--t),height var(--t)}
.brand .wm{height:52px;width:auto;transition:height var(--t)}
.brand .wm-y{display:none}
.header .panel{background:var(--navy);color:#fff;clip-path:polygon(28px 0,100% 0,100% 100%,0 100%);padding-left:52px;display:flex;flex-direction:column;justify-content:stretch;transition:clip-path var(--t) var(--ease)}
.header .info{display:flex;justify-content:space-between;align-items:center;gap:20px;height:36px;border-bottom:1px solid rgba(255,255,255,.1);font-size:12.5px;color:var(--on-navy-muted);padding-right:var(--gutter);max-height:36px;overflow:hidden;transition:max-height var(--t) var(--ease),opacity var(--t)}
.header .info b{color:#fff;font-weight:600;letter-spacing:.02em}
.header .info span{display:inline-flex;align-items:center;gap:6px}
.header .info a{color:var(--on-navy);text-decoration:none}
.header .info a:hover{color:var(--yellow)}
.header .info svg{width:14px;height:14px;color:var(--yellow)}
.header .info .right{display:flex;gap:22px}
.header .main{display:flex;align-items:center;gap:22px;height:80px;padding-right:0}
.nav{display:flex;gap:4px;margin-right:auto}
.nav a{color:#fff;text-decoration:none;font-weight:600;font-size:15px;padding:10px 14px;border-radius:var(--r);position:relative}
.nav a::after{content:"";position:absolute;left:14px;right:14px;bottom:4px;height:2px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform var(--t) var(--ease)}
.nav a:hover::after,.nav a[aria-current="page"]::after{transform:scaleX(1)}
.header .phone{color:#fff;flex:none}
.header .btn{border-radius:0;align-self:stretch;height:80px;padding:0 30px;font-size:14px;letter-spacing:.04em;text-transform:uppercase}
.header.scrolled .info{max-height:0;opacity:0;border:0}
.header.scrolled .main{height:68px}
.header.scrolled .btn{height:68px}
.header.scrolled .brand .mk{width:46px;height:46px}
.header.scrolled .brand .wm{height:42px}
.burger{display:none;background:none;border:0;color:var(--navy);width:44px;height:44px;cursor:pointer;margin-left:auto}
.burger span{display:block;width:24px;height:2px;background:currentColor;margin:5px auto;transition:transform var(--t),opacity var(--t)}
.menu-open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-open .burger span:nth-child(2){opacity:0}
.menu-open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{display:none}
.mobile-bar{display:none}

/* ---------- seções ---------- */
.sec{padding:clamp(56px,8vw,104px) 0;position:relative}
.sec-gray{background:var(--gray-1)}
.sec-navy{background:var(--navy);color:#fff}
.sec-navy h2,.sec-navy h3{color:#fff}
.sec-cream{background:var(--cream)}
.tex-hex{position:relative}
.tex-hex::before{content:"";position:absolute;inset:0;background:var(--hex) 0 0/56px 64px;opacity:.06;pointer-events:none}
.tex-hex-light::before{content:"";position:absolute;inset:0;background:var(--hex-navy) 0 0/56px 64px;opacity:.045;pointer-events:none}
.label{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--navy-2);margin-bottom:14px}
.label::before{content:"";width:28px;height:3px;background:var(--yellow)}
.label.bars::before{width:14px;height:14px;background:repeating-linear-gradient(90deg,var(--yellow) 0 3px,transparent 3px 6px)}
.sec-navy .label{color:var(--yellow)}
.sec-head{max-width:760px;margin-bottom:clamp(28px,4vw,48px);position:relative}
.sec-head p{font-size:17px;color:var(--gray-5);margin:14px 0 0}
.sec-navy .sec-head p{color:var(--on-navy-muted)}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head.center .label{justify-content:center}
.sec-head.row{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:24px}
.sec-head.row > div{max-width:760px}
/* título centrado com ícone (Consten / Consik) */
.sec-head.icon .topic{width:34px;height:34px;margin:0 auto 10px;color:var(--yellow)}
.sec-head.icon .topic svg{width:34px;height:34px}
.sec-head.icon h2{text-transform:uppercase;letter-spacing:.01em}
.divider{display:flex;align-items:center;justify-content:flex-start;gap:8px;margin:14px 0 18px}
.divider::before,.divider::after{content:"";width:46px;height:2px;background:var(--yellow)}
.divider i{width:10px;height:10px;background:var(--yellow);transform:rotate(45deg)}
.center .divider{justify-content:center}
.ghost{position:absolute;right:var(--gutter);top:clamp(20px,3vw,40px);font:800 clamp(60px,10vw,150px)/1 var(--display);color:transparent;-webkit-text-stroke:1px rgba(10,26,64,.10);letter-spacing:.02em;pointer-events:none;user-select:none;text-transform:uppercase}
.sec-navy .ghost{-webkit-text-stroke-color:rgba(255,255,255,.08)}
.tape{height:10px;background:repeating-linear-gradient(135deg,var(--yellow) 0 18px,var(--navy) 18px 36px)}

/* ---------- reveal ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.1s}.rv-d2{transition-delay:.2s}.rv-d3{transition-delay:.3s}.rv-d4{transition-delay:.4s}.rv-d5{transition-delay:.5s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}
.no-fx .rv{opacity:1;transform:none;transition:none}
.no-fx :is(.hero,.hero-c,.hero-d) :is(h1 .w span,.eyebrow,.sub,.card,.bar,.micro,.photo,.side,.crumbs){animation:none;opacity:1;transform:none}
.no-fx .hero h1 .hl::after{animation:none;transform:skewX(-8deg)}
.no-fx :is(.hero,.hero-c) .bg img{animation:none;transform:none}

/* ---------- heros: base comum (Home = E Indox; Services e Projects = C Consik; Contact = D BuildNest home 3) ---------- */
.hero,.hero-c,.hero-d{position:relative;color:#fff;background:var(--navy);overflow:hidden}
:is(.hero,.hero-c) .bg{position:absolute;inset:0;z-index:0}
:is(.hero,.hero-c) .bg img{width:100%;height:100%;object-fit:cover;transform:scale(1.06);animation:heroZoom 12s var(--ease) forwards}
@keyframes heroZoom{to{transform:scale(1)}}
:is(.hero,.hero-c,.hero-d) .tex{position:absolute;inset:0;z-index:1;background:var(--hex) 0 0/56px 64px;opacity:.07;pointer-events:none}
:is(.hero,.hero-c,.hero-d) .wrap{position:relative;z-index:2;display:grid;align-items:center;padding-top:clamp(56px,7vw,96px);padding-bottom:clamp(56px,7vw,96px)}
:is(.hero,.hero-c,.hero-d) .eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);margin-bottom:22px;opacity:0;animation:fadeUp .8s .05s var(--ease) forwards}
:is(.hero,.hero-c,.hero-d) .eyebrow::before{content:"";width:14px;height:14px;background:repeating-linear-gradient(90deg,var(--yellow) 0 3px,transparent 3px 6px)}
:is(.hero,.hero-c,.hero-d) h1{font-size:clamp(30px,3.9vw,54px)}
:is(.hero,.hero-c,.hero-d) h1 .w{display:inline-block;overflow:hidden;vertical-align:bottom}
:is(.hero,.hero-c,.hero-d) h1 .w span{display:inline-block;transform:translateY(110%);animation:wordUp .8s var(--ease) forwards}
@keyframes wordUp{to{transform:none}}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
:is(.hero,.hero-c,.hero-d) .sub{font:500 clamp(16px,1.35vw,19px)/1.55 var(--human);color:var(--on-navy);max-width:560px;margin:20px 0 0;opacity:0;animation:fadeUp .8s .6s var(--ease) forwards}
.hero .card,.hero-d .card,.hero-c .bar,.hero-c .micro,.hero-c .crumbs,.hero-d .photo,.hero-d .side{opacity:0;animation:fadeUp .9s .5s var(--ease) forwards}
.hero-c .crumbs{animation-delay:.7s}.hero-c .micro{animation-delay:.8s}.hero-d .photo{animation-delay:.3s}.hero-d .side{animation-delay:.7s}
:is(.hero,.hero-c,.hero-d).done :is(h1 .w span,.eyebrow,.sub,.card,.bar,.micro,.photo,.side,.crumbs){animation:none;opacity:1;transform:none}

/* Home (E · Indox): foto inteira, cartão escuro translúcido, marcador amarelo sob a palavra, quarto de círculo com a marca */
.hero .bg img{object-position:center 55%}
.hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,26,64,.92) 0%,rgba(10,26,64,.66) 40%,rgba(10,26,64,.2) 100%)} /* véu mais leve: a foto precisa aparecer */
.hero .wrap{grid-template-columns:minmax(0,1.1fr) minmax(340px,420px);gap:clamp(28px,4vw,72px);min-height:calc(100svh - 116px)}
.hero h1 .hl{position:relative;display:inline-block;color:#fff}
.hero h1 .hl::after{content:"";position:absolute;left:0;right:0;bottom:0;height:.26em;background:var(--yellow);opacity:.95;z-index:-1;transform:skewX(-8deg) scaleX(0);transform-origin:left;animation:markIn .6s 1.1s var(--ease) forwards}
@keyframes markIn{to{transform:skewX(-8deg) scaleX(1)}}
.hero.done h1 .hl::after{animation:none;transform:skewX(-8deg)}
.hero .card{background:rgba(6,18,50,.78);color:#fff;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 60px rgba(0,0,0,.35)}

/* cartão escuro do formulário (Home e Contact) */
:is(.hero,.hero-d) .card h3{color:#fff}
:is(.hero,.hero-d) .card .lead{color:var(--on-navy-muted)}
:is(.hero,.hero-d) .f label{color:#fff}
:is(.hero,.hero-d) .f label small{color:var(--on-navy-muted)}
:is(.hero,.hero-d) .f :is(input,select,textarea){border-color:transparent}
:is(.hero,.hero-d) .f input[type=file]{color:var(--on-navy)}
:is(.hero,.hero-d) .f :is(.micro,.consent){color:var(--on-navy-muted)}
:is(.hero,.hero-d) .f .step2{border-top-color:rgba(255,255,255,.15)}
:is(.hero,.hero-d) .chips label{border-color:rgba(255,255,255,.3);color:#fff}
:is(.hero,.hero-d) .chips label:has(input:checked){background:var(--yellow);color:var(--navy);border-color:var(--yellow)}
:is(.hero,.hero-d) .chips input{accent-color:var(--yellow)}
:is(.hero,.hero-d) .f .ok{background:rgba(253,197,0,.16);color:#fff}

/* Services e Projects (C · Consik): tudo centrado, barra de formulário de um passo, cunha amarela */
.hero-c .bg img{object-position:center 40%}
.hero-c .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,26,64,.84),rgba(10,26,64,.9))}
.hero-c .wrap{grid-template-columns:1fr;text-align:center;justify-items:center}
.hero-c.cut .wrap{padding-bottom:clamp(90px,10vw,130px)}
.hero-c:not(.cut) .wrap{padding-bottom:clamp(96px,10vw,140px)} /* espaço para os cartões de contadores que sobem sobre o hero (Services) */
.hero-c .topic{width:38px;height:38px;color:var(--yellow);margin-bottom:14px}
.hero-c .topic svg{width:38px;height:38px}
.hero-c h1{text-transform:uppercase;letter-spacing:.01em;font-size:clamp(30px,4.4vw,62px);max-width:980px}
.hero-c .sub{margin:20px auto 0;max-width:680px}
.hero-c .bar{margin-top:30px;width:100%;max-width:1000px;background:#fff;color:var(--ink);border-radius:var(--r);padding:12px 12px 12px 18px;box-shadow:var(--shadow);position:relative;text-align:left}
.hero-c .bar::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;background:var(--yellow);border-radius:var(--r) 0 0 var(--r)}
.hero-c .bar form{display:grid;grid-template-columns:1.1fr 1fr 1fr auto;gap:10px;align-items:stretch}
.hero-c .bar :is(input,select){font:400 15px/1.3 var(--body);padding:15px 14px;border:1.5px solid var(--gray-2);border-radius:var(--r);background:var(--gray-1);width:100%;color:var(--ink)}
.hero-c .bar :is(input,select):focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(253,197,0,.35)}
.hero-c .bar input.is-invalid{border-color:#b42318;background:#fff5f4}
.hero-c .bar .btn{height:100%;padding:0 26px;white-space:nowrap}
.hero-c .micro{font:500 13px/1.45 var(--human);color:var(--on-navy);margin:14px 0 0}
.hero-c .cutw{position:absolute;left:0;right:0;bottom:0;height:64px;background:var(--yellow);clip-path:polygon(0 100%,100% 30%,100% 100%);z-index:1}

/* Contact (D · BuildNest home 3): hero claro, foto com cantos arredondados e moldura amarela, cartão azul */
.hero-d{background:var(--gray-1);color:var(--ink)}
.hero-d .tex{background:var(--hex-navy) 0 0/56px 64px;opacity:.05}
.hero-d .wrap{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,64px);align-items:start;padding-top:clamp(40px,5vw,64px);padding-bottom:clamp(40px,5vw,64px)}
.hero-d .eyebrow{color:var(--navy-2)}
.hero-d .eyebrow::before{background:repeating-linear-gradient(90deg,var(--yellow-2) 0 3px,transparent 3px 6px)}
.hero-d h1{color:var(--navy);font-size:clamp(30px,3.6vw,50px)}
.hero-d h1 .hl{color:var(--yellow-2)}
.hero-d .sub{color:var(--gray-5)}
.hero-d .card{background:var(--navy);color:#fff;border-radius:14px;margin-top:28px}
.hero-d .wrap > div:last-child{display:flex;flex-direction:column;align-self:stretch} /* a foto cresce até a altura do formulário, sem sobra em branco */
.hero-d .photo{position:relative;flex:1;min-height:320px;margin:14px 14px 0 0}
.hero-d .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0 120px 0 120px;z-index:1}
.hero-d .photo::before{content:"";position:absolute;inset:-14px -14px 14px 14px;border:3px solid var(--yellow);border-radius:0 120px 0 120px;z-index:0}
.hero-d .side{margin-top:34px}
.hero-d .cbox{margin-bottom:16px}

/* ---------- cartão do formulário ---------- */
.card{background:#fff;color:var(--ink);border-radius:14px;padding:clamp(22px,2.4vw,30px);box-shadow:var(--shadow);position:relative}
.card::before{content:"";position:absolute;left:0;top:0;right:0;height:6px;background:var(--yellow);border-radius:14px 14px 0 0}
.card h3{font-size:21px;margin-bottom:6px;color:var(--navy)}
.card .lead{color:var(--gray-5);font-size:14px;margin-bottom:18px}
.f{display:grid;gap:12px}
.f label{display:grid;gap:6px;font:600 13px/1.2 var(--body);color:var(--navy)}
.f label small{font-weight:400;color:var(--gray-5)}
.f input,.f select,.f textarea{width:100%;font:400 15px/1.3 var(--body);padding:13px 14px;border:1.5px solid var(--gray-3);border-radius:var(--r);background:#fff;color:var(--ink);transition:border-color var(--t),box-shadow var(--t)}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--navy);box-shadow:0 0 0 3px rgba(253,197,0,.35)}
.f .err{display:none;color:#b42318;font-size:13px}
.f .is-invalid input,.f input.is-invalid{border-color:#b42318}
.f .is-invalid .err{display:block}
.f .micro{font:500 13px/1.45 var(--human);color:var(--gray-5);margin:4px 0 0;text-align:center}
.f .consent{font-size:11.5px;line-height:1.4;color:var(--gray-5);margin:0}
.f .row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.f fieldset{border:0;padding:0;margin:0;display:grid;gap:12px}
.f .step2{display:none;gap:12px;border-top:1px solid var(--gray-2);padding-top:14px}
.f .step2.show{display:grid}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--gray-3);border-radius:999px;padding:7px 12px;font:500 13px/1 var(--body);cursor:pointer}
.chips input{width:auto;padding:0;margin:0;accent-color:var(--navy)}
.chips label:has(input:checked){background:var(--navy);color:#fff;border-color:var(--navy)}
.f .ok{display:none;background:var(--cream);border-radius:var(--r);padding:14px;font:500 15px/1.4 var(--human);color:var(--navy)}
.f .ok.show{display:block}
/* formulário sublinhado (calculadora do Buildexo home 4) */
.f.lined input,.f.lined select,.f.lined textarea{border:0;border-bottom:2px solid var(--gray-3);border-radius:0;padding:12px 2px;background:transparent}
.f.lined input:focus,.f.lined select:focus,.f.lined textarea:focus{box-shadow:none;border-color:var(--yellow)}
.f.lined label{font-size:14px}
.f.lined .btn{justify-self:start;width:auto}

/* ---------- sobre (Indox) ---------- */
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,72px);align-items:center}
.collage{position:relative;display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:auto auto;gap:14px}
.collage img{width:100%;height:100%;object-fit:cover;border-radius:12px}
.collage .a{grid-row:1/3;aspect-ratio:3/4}
.collage .b{aspect-ratio:4/3}
.collage .c{aspect-ratio:4/3}
/* colagem Indox: foto, quarto de círculo "since", foto, foto (grade 2x2 cheia, sem célula vazia; o contador de cidades saiu daqui, a prova fica nos contadores) */
.indox{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:18px;align-items:stretch}
.indox :is(.p1,.p2,.p3){aspect-ratio:1;border-radius:14px;overflow:hidden}
.indox .p1{grid-column:1;grid-row:1}
.indox .p2{grid-column:1;grid-row:2;border-radius:14px 14px 14px 110px}
.indox .p3{grid-column:2;grid-row:2}
.indox img{width:100%;height:100%;object-fit:cover}
.indox .since{grid-column:2;grid-row:1;aspect-ratio:1;background:var(--yellow);color:var(--navy);border-radius:14px 110px 14px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:20px}
.indox .since .ring{width:78px;height:78px;border-radius:50%;border:3px solid var(--navy);display:grid;place-items:center;background:#fff}
.indox .since .ring svg{width:30px;height:30px;color:var(--navy)}
.indox .since b{font:700 20px/1 var(--display);letter-spacing:.04em}
.about p{color:var(--gray-5);font-size:16.5px}
.arrows{display:grid;gap:10px;margin:18px 0 28px}
.arrows li{display:flex;gap:12px;align-items:flex-start;font-weight:500;font-size:15.5px;color:var(--ink)}
.arrows svg{width:18px;height:18px;flex:none;color:var(--yellow-2);margin-top:3px}
.checks{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;margin:20px 0 26px}
.checks li{display:flex;gap:10px;align-items:flex-start;font-weight:500;font-size:15px}
.checks svg{width:22px;height:22px;flex:none;color:var(--yellow-2);background:var(--cream);border-radius:50%;padding:4px}
.about .foot{display:flex;flex-wrap:wrap;gap:22px 32px;align-items:center}
.owners{display:flex;align-items:center;gap:12px}
.owners .av{width:48px;height:48px;border-radius:50%;background:var(--navy);color:var(--yellow);display:grid;place-items:center;font:700 16px var(--display)}
.owners b{display:block;font-weight:600;font-size:15px}
.owners small{color:var(--gray-5);font-size:13px}

/* ---------- contadores (Carpento) ---------- */
.counters{padding:clamp(56px,7vw,96px) 0 clamp(48px,6vw,72px)}
.counters .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:28px;padding-top:62px}
.counter{position:relative;border:1px solid rgba(255,255,255,.14);padding:78px 20px 34px;text-align:center}
.counter .ic{position:absolute;left:50%;top:-62px;transform:translateX(-50%);width:124px;height:124px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;box-shadow:0 14px 30px rgba(0,0,0,.3)}
.counter .ic svg{width:48px;height:48px}
.counter b{font:800 clamp(40px,4.2vw,54px)/1 var(--display);color:#fff;display:block;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.counter b sup{font-size:.5em;vertical-align:top;top:.15em;position:relative}
.counter span{display:block;font:500 15px/1.4 var(--body);color:var(--on-navy);margin-top:10px}
.counter small{display:block;color:var(--on-navy-muted);font-size:12.5px;margin-top:4px}
.counter.seal-item b{font-size:clamp(20px,1.8vw,24px);line-height:1.2}
.counter .bbb{display:block;margin:16px auto 0;height:30px;width:auto}

/* ---------- serviços (Consten) ---------- */
.svc-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 44px)/3);gap:22px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 4px 18px;scrollbar-width:none}
.svc-track::-webkit-scrollbar{display:none}
.svc{scroll-snap-align:start;position:relative;display:flex;flex-direction:column;background:#fff;border:1px solid var(--gray-2);text-decoration:none;color:var(--ink);transition:transform var(--t) var(--ease),box-shadow var(--t);overflow:hidden}
.svc::before{content:"";position:absolute;inset:0 0 auto 0;height:150px;background:var(--hex-navy) 0 0/56px 64px;opacity:.06;pointer-events:none}
.svc:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.svc .body{padding:34px 26px 18px;text-align:center;display:flex;flex-direction:column;gap:12px;flex:1;position:relative}
.svc .lic{width:64px;height:64px;margin:0 auto 4px;color:var(--yellow-2)}
.svc .lic svg{width:64px;height:64px;stroke-width:1.4}
.svc h3{color:var(--navy);font-size:20px}
.svc p{color:var(--gray-5);font-size:14.5px;margin:0;flex:1}
.svc .base{position:relative;height:96px;margin-top:8px}
.svc .base svg{position:absolute;inset:0;width:100%;height:100%}
.svc .base .go{position:absolute;left:50%;top:14px;transform:translateX(-50%);width:96px;height:44px;background:var(--navy);color:#fff;display:grid;place-items:center;transition:background var(--t),color var(--t)}
.svc .base .go svg{width:22px;height:22px;position:static}
.svc.alt .base .go{background:var(--yellow);color:var(--navy)}
.svc:hover .base .go{background:var(--yellow);color:var(--navy)}
.svc.alt:hover .base .go{background:var(--navy);color:#fff}
.progress{height:8px;border:1px solid var(--yellow);margin-top:10px;position:relative;background:#fff}
.progress i{position:absolute;left:0;top:0;bottom:0;background:var(--yellow);width:30%;transition:width .3s var(--ease),left .3s var(--ease)}
.progress i::after{content:"";position:absolute;right:30%;top:0;bottom:0;width:18%;background:var(--navy)}
.svc-nav{display:flex;gap:10px;justify-content:flex-end;margin-top:-28px;margin-bottom:10px}
.svc-nav button{width:44px;height:44px;border:1.5px solid var(--navy);background:#fff;color:var(--navy);cursor:pointer;display:grid;place-items:center;transition:background var(--t),color var(--t)}
.svc-nav button:hover{background:var(--navy);color:#fff}
.svc-nav button svg{width:18px;height:18px}

/* ---------- processo ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;position:relative}
.steps::before{content:"";position:absolute;left:8%;right:8%;top:46px;border-top:2px dashed var(--gray-3)}
.step{position:relative;background:#fff;border-radius:10px;padding:28px 26px;border:1px solid var(--gray-2)}
.step .n{width:92px;height:92px;border-radius:50%;background:var(--navy);color:var(--yellow);display:grid;place-items:center;font:800 30px/1 var(--display);margin:-74px auto 18px;border:8px solid var(--gray-1);box-shadow:0 10px 24px rgba(6,18,50,.15)}
.steps.white .step .n{border-color:#fff}
.steps.white .step{background:var(--gray-1);border-color:var(--gray-2)}
.step h3{color:var(--navy);margin-bottom:8px;text-align:center}
.step p{color:var(--gray-5);font-size:15px;margin:0;text-align:center}
.steps-wrap{padding-top:74px}

/* ---------- por que ---------- */
.why{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center}
.why .photo{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:4/5}
.why .photo img{width:100%;height:100%;object-fit:cover}
.why .photo .badge{position:absolute;right:18px;bottom:18px;background:var(--yellow);color:var(--navy);font:700 14px/1 var(--display);padding:12px 14px;border-radius:6px;letter-spacing:.04em}
.why .photo .rotor{left:-24px;top:-24px}
.why p.lead{color:var(--gray-5);font-size:16.5px;margin-bottom:28px}
.feat{display:grid;grid-template-columns:1fr 1fr;gap:22px 28px}
.feat li{display:grid;grid-template-columns:48px 1fr;gap:14px}
.feat .ic{width:48px;height:48px;border-radius:8px;background:var(--navy);color:var(--yellow);display:grid;place-items:center}
.feat .ic svg{width:24px;height:24px}
.feat h3{font-size:17px;color:var(--navy);margin-bottom:6px}
.feat p{font-size:14.5px;color:var(--gray-5);margin:0}

/* ---------- projetos ---------- */
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.tab{background:#fff;border:1.5px solid var(--gray-3);color:var(--navy);font:600 14px/1 var(--body);padding:11px 16px;border-radius:999px;cursor:pointer;transition:background var(--t),color var(--t),border-color var(--t)}
.tab:hover{border-color:var(--navy)}
.tab.on{background:var(--navy);color:#fff;border-color:var(--navy)}
.projects{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.proj{position:relative;display:block;border-radius:12px;overflow:hidden;background:var(--navy);color:#fff;text-decoration:none;aspect-ratio:4/3;transition:opacity .4s,transform .4s}
.proj img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease),opacity .6s}
.proj:hover img{transform:scale(1.06)}
.proj .cap{position:absolute;inset:auto 0 0 0;padding:70px 18px 18px;background:linear-gradient(180deg,transparent,rgba(6,18,50,.92))}
.proj .cap b{display:block;font:600 16px/1.3 var(--body)}
.proj .cap span{display:block;font-size:13px;color:var(--on-navy-muted);margin-top:4px}
.proj .tag{position:absolute;left:14px;top:14px;background:var(--yellow);color:var(--navy);font:600 12px/1 var(--body);letter-spacing:.04em;padding:7px 10px;border-radius:4px}
.proj.hide{display:none}
.proj.before .tag{background:#fff}
.projects.gallery{grid-template-columns:repeat(4,1fr)}

/* ---------- cards escuros (BuildNest) ---------- */
.dark-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.dcard{background:var(--navy);color:#fff;padding:30px 24px;text-align:center;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.08)}
.dcard::before{content:"";position:absolute;inset:0;background:var(--hex) 0 0/56px 64px;opacity:.05;pointer-events:none}
.dcard .ic{width:64px;height:64px;margin:0 auto 18px;background:var(--yellow);color:var(--navy);display:grid;place-items:center;position:relative}
.dcard .ic svg{width:30px;height:30px}
.dcard h3{font-size:18px;color:#fff;margin-bottom:10px;position:relative}
.dcard p{font-size:14.5px;color:var(--on-navy-muted);margin:0;position:relative}

/* ---------- avaliações ---------- */
.reviews{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.rcard{background:#fff;border:1px solid var(--gray-2);border-radius:12px;padding:26px;display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center}
.rcard .logo{width:64px;height:64px;border-radius:12px;display:grid;place-items:center;background:var(--gray-1)}
.rcard .logo svg{width:36px;height:36px}
.rcard .score{font:800 36px/1 var(--display);color:var(--navy)}
.rcard .stars{color:var(--yellow);letter-spacing:2px;font-size:18px;margin:4px 0}
.rcard .meta{font-size:14px;color:var(--gray-5)}
.rcard .link{margin-top:10px;font-size:14px}
.creds{display:flex;flex-wrap:wrap;gap:10px 28px;justify-content:center;margin-top:34px;padding-top:24px;border-top:1px solid var(--gray-2);font:600 13px/1 var(--body);color:var(--navy);letter-spacing:.04em;text-transform:uppercase}
.creds span{display:inline-flex;align-items:center;gap:8px}
.creds svg{width:16px;height:16px;color:var(--yellow-2)}

/* ---------- FAQ ---------- */
.faq-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,5vw,72px);align-items:start}
.faq-wrap .sticky{position:sticky;top:110px}
.faq-wrap .sticky p{color:var(--gray-5)}
.faq{display:grid;gap:10px}
.faq details{background:#fff;border:1px solid var(--gray-2);border-radius:8px;overflow:hidden}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 20px;font:600 16px/1.35 var(--body);color:var(--navy)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .pm{width:28px;height:28px;flex:none;border-radius:50%;background:var(--cream);color:var(--navy);display:grid;place-items:center;transition:transform var(--t),background var(--t)}
.faq summary .pm svg{width:14px;height:14px}
.faq details[open] summary .pm{transform:rotate(45deg);background:var(--yellow)}
.faq details[open] summary{border-bottom:1px solid var(--gray-2)}
.faq .a{padding:16px 20px 20px;color:var(--gray-5);font-size:15px}
.faq .a p{margin:0}

/* ---------- chamada final (Buildexo home 4: foto, faixa amarela diagonal, formulário sublinhado) ---------- */
.cta-final{position:relative;background:#fff;color:var(--ink);overflow:hidden}
.cta-final .wrap{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,5vw,80px);align-items:center}
.cta-final .pic{position:relative;aspect-ratio:4/5;border-radius:14px;overflow:hidden}
.cta-final .pic img{width:100%;height:100%;object-fit:cover}
.cta-final .pic::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:linear-gradient(180deg,transparent,rgba(10,26,64,.75))}
.cta-final .stripe{position:absolute;top:-10%;bottom:-10%;right:-40px;width:120px;background:var(--yellow);transform:skewX(-8deg);pointer-events:none}
.cta-final .stripe::after{content:"";position:absolute;inset:0 auto 0 -16px;width:6px;background:var(--navy)}
.cta-final h2{font-size:clamp(28px,3.4vw,44px);color:var(--navy)}
.cta-final p.intro{color:var(--gray-5);font-size:17px;margin:12px 0 26px}
.cta-final .phone{color:var(--navy);margin-top:18px}

/* ---------- rodapé ---------- */
.footer{background:var(--navy-3);color:var(--on-navy-muted);font-size:14px;position:relative}
.footer::before{content:"";position:absolute;inset:0;background:var(--hex) 0 0/56px 64px;opacity:.035;pointer-events:none}
.footer .wrap{position:relative}
.footer .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;padding:clamp(48px,6vw,72px) 0 40px;border-bottom:1px solid rgba(255,255,255,.1)}
.footer h4{color:#fff;font:600 13px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;margin-bottom:16px}
.footer .brand{margin:0 0 18px}
.footer .brand .wm-n{display:none}
.footer .brand .wm-y{display:block}
.footer p{max-width:380px}
.footer ul{display:grid;gap:9px}
.footer a{color:var(--on-navy);text-decoration:none}
.footer a:hover{color:var(--yellow)}
.footer .towns{line-height:1.8}
.footer .nap b{color:#fff;font-weight:600}
.footer .nap a{color:var(--yellow);font-weight:600;font-size:17px}
.footer .bottom{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:20px 0;font-size:13px}
.footer .social{display:flex;gap:12px}
.footer .social a{width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.18);display:grid;place-items:center}
.footer .social svg{width:18px;height:18px}

/* ---------- páginas internas: hero com título centrado e breadcrumb (Carpento / Consik) ---------- */
.page-hero{position:relative;background:var(--navy);color:#fff;overflow:hidden}
.page-hero .bg{position:absolute;inset:0}
.page-hero .bg img{width:100%;height:100%;object-fit:cover;opacity:.5}
.page-hero .bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,26,64,.75),rgba(10,26,64,.88))}
.page-hero .wrap{position:relative;z-index:1;padding:clamp(56px,7vw,100px) var(--gutter);text-align:center}
.page-hero .eyebrow{display:inline-flex;align-items:center;gap:10px;font:600 13px/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--yellow);margin-bottom:16px}
.page-hero h1{font-size:clamp(34px,4.6vw,60px)}
.page-hero .sub{font:500 clamp(16px,1.3vw,19px)/1.55 var(--human);color:var(--on-navy);max-width:720px;margin:18px auto 0}
.crumbs{display:inline-flex;align-items:center;gap:10px;margin-top:22px;font:600 13px/1 var(--body);letter-spacing:.06em;text-transform:uppercase;color:var(--on-navy)}
.crumbs a{color:#fff;text-decoration:none}
.crumbs svg{width:12px;height:12px;color:var(--yellow)}
.crumbs .cur{color:var(--yellow)}
.page-hero .actions{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;justify-content:center;margin-top:26px}
.page-hero .actions .phone{color:#fff}
.page-hero .tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:22px}
.page-hero .tags span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:8px 14px;font:500 13px/1 var(--body)}
.anchors{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:22px}
.anchors a{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.2);color:#fff;text-decoration:none;border-radius:999px;padding:9px 14px;font:600 13px/1 var(--body)}
.anchors a:hover{background:var(--yellow);color:var(--navy);border-color:var(--yellow)}

/* contadores em cartões brancos sobrepostos ao hero (BuildNest services) */
.stat-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:-54px;position:relative;z-index:2}
.stat-cards .sc{background:#fff;border:1px solid var(--gray-2);padding:26px 22px 22px;box-shadow:0 14px 34px rgba(6,18,50,.1)}
.stat-cards b{font:800 40px/1 var(--display);color:var(--navy);display:block}
.stat-cards b sup{font-size:.5em;position:relative;top:.1em}
.stat-cards span{display:block;font:600 12px/1.3 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--gray-5);margin-top:12px;padding-top:12px;border-top:3px solid var(--yellow);width:max-content;max-width:100%}

/* grade de serviços com ícone (BuildNest "what we build") */
.icon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px 36px}
.icon-grid a{text-decoration:none;color:var(--ink);display:block}
.icon-grid .ic{width:60px;height:60px;background:var(--navy);color:var(--yellow);display:grid;place-items:center;margin-bottom:18px;transition:background var(--t),color var(--t)}
.icon-grid a:hover .ic{background:var(--yellow);color:var(--navy)}
.icon-grid .ic svg{width:30px;height:30px}
.icon-grid h3{font-size:19px;color:var(--navy);margin-bottom:8px}
.icon-grid p{font-size:14.5px;color:var(--gray-5);margin:0 0 12px}
.icon-grid .more{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--navy)}
.icon-grid .more i{width:26px;height:18px;background:var(--yellow);display:grid;place-items:center}
.icon-grid .more svg{width:14px;height:14px}

/* página de serviço (Carpento): barra lateral + conteúdo */
.svc-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.svc-side{position:sticky;top:96px;display:grid;gap:20px}
.svc-side .list{display:grid;gap:8px}
.svc-side .list a{display:flex;justify-content:space-between;align-items:center;gap:12px;background:var(--gray-1);border:1px solid var(--gray-2);padding:16px 18px;text-decoration:none;color:var(--navy);font:600 15px/1.2 var(--body);transition:background var(--t),color var(--t)}
.svc-side .list a i{width:26px;height:26px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;flex:none}
.svc-side .list a svg{width:14px;height:14px}
.svc-side .list a:hover,.svc-side .list a.on{background:var(--navy);color:#fff}
.svc-side .help{position:relative;background:var(--navy);color:#fff;padding:0 0 26px;text-align:center;overflow:hidden}
.svc-side .help img{width:100%;aspect-ratio:4/3;object-fit:cover;opacity:.55}
.svc-side .help .ic{width:66px;height:66px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;margin:-33px auto 14px;position:relative;border:4px solid var(--navy)}
.svc-side .help .ic svg{width:28px;height:28px}
.svc-side .help small{display:block;font:600 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--on-navy-muted)}
.svc-side .help a{display:block;color:#fff;text-decoration:none;font:800 22px/1.2 var(--display);margin-top:8px}
.service{padding:0 0 clamp(40px,5vw,64px);margin-bottom:clamp(40px,5vw,64px);border-bottom:1px solid var(--gray-2);scroll-margin-top:96px}
.service:last-of-type{border-bottom:0;margin-bottom:0}
.service .media{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:16/9;margin:18px 0 22px}
.service .media img{width:100%;height:100%;object-fit:cover}
.service .media .cap{position:absolute;left:14px;bottom:14px;background:rgba(6,18,50,.85);color:#fff;font-size:12.5px;padding:7px 10px;border-radius:4px}
.service h2{font-size:clamp(24px,2.6vw,34px);color:var(--navy)}
.service p{color:var(--gray-5)}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:22px 0 24px}
.cols2 h4{font:600 13px/1 var(--body);letter-spacing:.1em;text-transform:uppercase;color:var(--navy-2);margin-bottom:10px}
.cols2 ul{display:grid;gap:7px}
.cols2 li{font-size:14.5px;display:flex;gap:8px;align-items:flex-start}
.cols2 li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--yellow);flex:none;margin-top:7px}
.cols2 .call li::before{background:var(--navy)}
.service .actions{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}

/* lista adicional */
/* serviços adicionais: seção azul, cartões com número em contorno, quadrado amarelo cortado, lista com setas, canto dobrado */
.fulllist{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;position:relative}
.fulllist .gcard{position:relative;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);padding:28px 26px 30px;overflow:hidden;transition:background var(--t),transform var(--t) var(--ease),border-color var(--t)}
.fulllist .gcard::before{content:"";position:absolute;left:0;top:0;width:72px;height:4px;background:var(--yellow)}
.fulllist .gcard::after{content:"";position:absolute;right:0;bottom:0;width:26px;height:26px;background:var(--yellow);clip-path:polygon(100% 0,100% 100%,0 100%)}
.fulllist .gcard:hover{background:rgba(255,255,255,.09);transform:translateY(-4px);border-color:rgba(253,197,0,.5)}
.fulllist .gn{position:absolute;right:18px;top:8px;font:800 76px/1 var(--display);color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.14);letter-spacing:-.02em;pointer-events:none}
.fulllist .num{display:inline-grid;place-items:center;width:46px;height:46px;background:var(--yellow);color:var(--navy);font:800 15px var(--display);clip-path:polygon(0 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%);margin-bottom:18px}
.fulllist h3{font-size:19px;color:#fff;margin-bottom:16px}
.fulllist ul{display:grid;gap:9px}
.fulllist li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--on-navy)}
.fulllist li svg{width:14px;height:14px;flex:none;color:var(--yellow);margin-top:5px}
/* o que entra no orçamento: seção azul escura, cartões com número grande amarelo e faixa diagonal */
/* nota do orçamento (Services): cartão branco com fio azul sobre fundo claro; o tom azul diferente (--navy-2) foi reprovado */
.est-note{background:#fff;border-left:6px solid var(--navy);padding:clamp(28px,4vw,44px);max-width:900px;box-shadow:0 14px 34px rgba(6,18,50,.08)}
.est-note h2{color:var(--navy)}
.est-note p{color:var(--gray-5);font-size:17px;margin:14px 0 24px;max-width:720px}
.est{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:24px 0 20px}
.est li{position:relative;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);padding:22px 22px 22px 28px;display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:start;font-size:14.5px;color:var(--on-navy-muted);overflow:hidden;transition:background var(--t),transform var(--t) var(--ease)}
.est li::before{content:"";position:absolute;left:-4px;top:-10%;bottom:-10%;width:8px;background:var(--yellow);transform:skewX(-10deg)}
.est li:hover{background:rgba(255,255,255,.09);transform:translateY(-4px)}
.est .n{font:800 34px/1 var(--display);color:var(--yellow);letter-spacing:-.02em;padding-top:1px;font-variant-numeric:tabular-nums}
.est b{display:block;color:#fff;margin-bottom:4px;font-size:15.5px}

/* sobre (Consik): colagem com caixa de contador contornada */
/* colagem do About: lugar para a foto dos donos (alta, à esquerda) e duas fotos de obra empilhadas */
.consik{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);grid-template-rows:1fr 1fr;gap:16px;align-items:stretch}
.consik :is(.q1,.q2){position:relative;overflow:hidden;border-radius:4px;min-height:0;min-width:0}
.consik img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.consik .q1{grid-column:2;grid-row:1}
.consik .q2{grid-column:2;grid-row:2}
.consik .owners{grid-column:1;grid-row:1/3;aspect-ratio:3/4;min-width:0;border-radius:4px;background:var(--navy) var(--hex) 0 0/56px 64px;border:2px dashed rgba(253,197,0,.7);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:24px}
.consik .owners .ph-ic{width:84px;height:84px;border-radius:50%;background:var(--yellow);color:var(--navy);display:grid;place-items:center;margin-bottom:10px}
.consik .owners .ph-ic svg{width:40px;height:40px}
.consik .owners b{font:600 18px/1.2 var(--display)}
.consik .owners span{font:500 14px/1.4 var(--body);color:var(--on-navy)}
.consik .owners small{font:600 12px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--yellow);margin-top:8px;border-bottom-color:var(--yellow)}
.lists2{display:grid;grid-template-columns:1fr 1fr;gap:26px}
.lists2 h4{font:600 13px/1 var(--body);letter-spacing:.12em;text-transform:uppercase;color:var(--navy);margin-bottom:12px}
.lists2 li{font-size:15px;color:var(--gray-5);display:flex;gap:10px;align-items:flex-start;margin-bottom:8px}
.lists2 li::before{content:"";width:8px;height:8px;background:var(--yellow);flex:none;margin-top:8px}
.values{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.val{background:#fff;border:1px solid var(--gray-2);border-radius:10px;padding:24px;border-top:4px solid var(--yellow);position:relative;overflow:hidden}
.val::before{content:"";position:absolute;inset:0 0 auto 0;height:90px;background:var(--hex-navy) 0 0/56px 64px;opacity:.05;pointer-events:none}
.val .ic{width:44px;height:44px;border-radius:8px;background:var(--navy);color:var(--yellow);display:grid;place-items:center;margin-bottom:14px;position:relative}
.val .ic svg{width:22px;height:22px}
.val h3{font-size:17px;color:var(--navy);margin-bottom:8px;position:relative}
.val p{font-size:14.5px;color:var(--gray-5);margin:0;position:relative}
.people{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.person{display:grid;grid-template-columns:72px 1fr;gap:16px;align-items:center;background:#fff;border:1px solid var(--gray-2);border-radius:10px;padding:18px}
.person{grid-template-columns:88px 1fr}
.person .ph{width:88px;height:88px;border-radius:10px;background:var(--navy) var(--hex) 0 0/40px 46px;border:2px dashed rgba(253,197,0,.7);color:var(--yellow);display:grid;place-items:center;font:800 22px var(--display);cursor:help} /* lugar para a foto de cada dono */
.person b{display:block;font-size:16px;color:var(--navy);font-family:var(--display);font-weight:600}
.person span{display:block;font-size:14px;color:var(--gray-5);margin-top:4px}
.credlist{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.credlist li{background:#fff;border:1px solid var(--gray-2);border-radius:8px;padding:18px;display:flex;gap:12px;align-items:center;font-size:14.5px}
.credlist svg{width:22px;height:22px;color:var(--yellow-2);flex:none}

/* contato */
.contact{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:start}
.cbox{background:#fff;border:1px solid var(--gray-2);border-radius:10px;padding:24px;margin-bottom:18px}
.cbox h3{color:var(--navy);margin-bottom:12px}
.cbox .phone b{font-size:22px;color:var(--navy)}
.cbox ol{margin:0;padding-left:20px;color:var(--gray-5);display:grid;gap:8px;font-size:15px;list-style:decimal}
.map{border-radius:10px;overflow:hidden;border:1px solid var(--gray-2);aspect-ratio:16/10;background:var(--gray-1)}
.map iframe{width:100%;height:100%;border:0;display:block}
.towns-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px 16px;margin-top:18px}
.towns-grid li{font-size:14.5px;display:flex;gap:8px;align-items:center}
.towns-grid li::before{content:"";width:8px;height:8px;background:var(--yellow);border-radius:2px;flex:none}
.towns-grid li.home{font-weight:600;color:var(--navy)}

/* obrigado / 404 */
.simple{min-height:60vh;display:grid;place-items:center;text-align:center}
.simple .box{max-width:640px}
.simple p{color:var(--gray-5);font-size:17px}
.simple .actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:24px}

/* ---------- blocos sobre fundo azul (azul predominante: Por que, Projetos, What we build, Galeria, Liderança, Área atendida, Avaliações) ---------- */
.sec-navy .link{color:#fff}
.sec-navy .about p{color:var(--on-navy)}
.sec-navy .why p.lead{color:var(--on-navy)}
.sec-navy .feat .ic{background:var(--yellow);color:var(--navy)}
.sec-navy .feat h3{color:#fff}
.sec-navy .feat p{color:var(--on-navy-muted)}
.sec-navy .tab{background:transparent;border-color:rgba(255,255,255,.35);color:#fff}
.sec-navy .tab:hover{border-color:var(--yellow)}
.sec-navy .tab.on{background:var(--yellow);color:var(--navy);border-color:var(--yellow)}
.sec-navy .proj{border:1px solid rgba(255,255,255,.14)}
.sec-navy .icon-grid a,.sec-navy .icon-grid h3{color:#fff}
.sec-navy .icon-grid p{color:var(--on-navy-muted)}
.sec-navy .icon-grid .ic{background:var(--yellow);color:var(--navy)}
.sec-navy .icon-grid a:hover .ic{background:#fff}
.sec-navy .icon-grid .more{color:var(--yellow)}
.sec-navy .icon-grid .more i{color:var(--navy)}
.sec-navy .towns-grid li.home{color:var(--yellow)}
.sec-navy .map{border-color:rgba(255,255,255,.14);background:var(--navy-2)}
.sec-navy .person,.sec-navy .rcard,.sec-navy .credlist li{border-color:transparent;box-shadow:0 14px 34px rgba(0,0,0,.25)}
.sec-navy .reviews-intro,.sec-navy .rv > p{color:inherit}
.no-fx .hero .wrap{min-height:0} /* prints de página inteira */

/* ---------- copy v13: campos novos do formulário, listas em duas colunas, grades de 2 e 4 ---------- */
.f .opt{display:flex;gap:10px;align-items:flex-start;font:400 13px/1.45 var(--body);color:var(--gray-5)}
.f .opt input{width:auto;margin-top:3px;accent-color:var(--navy)}
.f label small.note{font:400 12.5px/1.4 var(--body);color:var(--gray-5);margin-top:2px}
:is(.hero,.hero-d) .f .opt,:is(.hero,.hero-d) .f label small.note{color:var(--on-navy-muted)}
:is(.hero,.hero-d) .f .opt input{accent-color:var(--yellow)}
.f select:invalid,.f select option[value=""]{color:var(--gray-5)}
.service ul.twocol{columns:2;column-gap:28px}
.service ul.twocol li{break-inside:avoid}
.values.two{grid-template-columns:repeat(2,1fr)}
.est.four{grid-template-columns:repeat(4,1fr)}
.hero-c .bar form{grid-template-columns:1.1fr 1fr .9fr 1fr auto}

/* ---------- produção (dardahmasonry.com): campo-armadilha, aviso de envio, foto no lugar dos donos, página de privacidade ---------- */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;opacity:0}
.f .ok.err-msg{background:#fdecec;color:#7a1a1a}
.f button[disabled]{opacity:.7;cursor:wait}
.consik .q0{grid-column:1;grid-row:1/3;aspect-ratio:3/4;position:relative;overflow:hidden;border-radius:4px;min-width:0}
.prod .person .ph{border:2px solid var(--yellow);cursor:default}
.legal{max-width:820px}
.legal h1{font-size:clamp(30px,4vw,46px);color:var(--navy)}
.legal .updated{color:var(--gray-5);margin:12px 0 30px;font-size:15px}
.legal h2{font-size:clamp(20px,2vw,24px);color:var(--navy);margin:34px 0 10px}
.legal p,.legal li{color:#33394a;font-size:16.5px;line-height:1.7}
.legal ul{list-style:disc;padding-left:22px;margin:0 0 1em;display:grid;gap:6px}
.legal a{color:var(--navy);font-weight:600}
.footer .bottom a{color:inherit}

/* ---------- responsivo ---------- */
@media (max-width:1240px){
  .header .phone{display:none}
}
@media (max-width:1100px){
  .est.four{grid-template-columns:repeat(2,1fr)}
  .hero-c .bar form{grid-template-columns:1fr 1fr}
  .hero-c .bar .btn{grid-column:1/3;height:auto;padding:16px;justify-content:center}
  .svc-track{grid-auto-columns:calc((100% - 22px)/2)}
  .projects.gallery{grid-template-columns:repeat(3,1fr)}
  .footer .top{grid-template-columns:1fr 1fr}
  .values,.dark-cards,.stat-cards{grid-template-columns:repeat(2,1fr)}
  .svc-layout{grid-template-columns:1fr}
  .svc-side{position:static}
  .svc-side .list{grid-template-columns:1fr 1fr}
  .svc-side .help{display:none}
  .icon-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:960px){
  .topcall{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--navy-3);color:#fff;text-decoration:none;font:500 14px/1 var(--body);padding:11px var(--gutter);max-height:40px;overflow:hidden;transition:max-height var(--t) var(--ease),padding var(--t),opacity var(--t)}
  .topcall svg{width:15px;height:15px;color:var(--yellow)}
  .topcall b{color:var(--yellow);font:700 16px/1 var(--display)}
  .header.scrolled .topcall{max-height:0;padding-top:0;padding-bottom:0;opacity:0}
  .header .wrap{display:flex;align-items:center;height:92px;padding:0 var(--gutter);background:var(--navy);transition:height var(--t) var(--ease)}
  .header.scrolled .wrap{height:76px}
  .header .brandbox{padding:0;flex:1;display:flex;align-items:center}
  .header .panel,.header .info,.nav,.header .main{display:none}
  /* opção C (04/11): logo num bloco branco com corte diagonal sobre o azul, o mesmo recurso do desktop */
  .brand{gap:14px;background:#fff;height:92px;margin-left:calc(-1 * var(--gutter));padding:0 46px 0 var(--gutter);clip-path:polygon(0 0,100% 0,calc(100% - 28px) 100%,0 100%);transition:height var(--t) var(--ease)}
  .header.scrolled .brand{height:76px}
  .burger{display:block;background:var(--yellow);color:var(--navy);width:52px;height:52px;border-radius:10px}
  .brand .wm{height:52px}.brand .mk{width:58px;height:58px}
  .mobile-menu{display:block;position:fixed;inset:0;background:var(--navy);color:#fff;z-index:99;padding:150px var(--gutter) 24px;transform:translateX(100%);transition:transform var(--t) var(--ease);overflow:auto}
  .menu-open .mobile-menu{transform:none}
  .mobile-menu a{display:block;color:#fff;text-decoration:none;font:600 22px/1 var(--display);padding:16px 0;border-bottom:1px solid rgba(255,255,255,.1)}
  .mobile-menu .btn{margin-top:24px;justify-content:center;font-size:16px;font-family:var(--body);border-radius:var(--r)}
  .mobile-menu .phone{color:#fff;margin-top:22px;font-family:var(--body);font-size:16px;padding:0;border:0}
  .mobile-bar{display:grid;grid-template-columns:1fr 1.4fr;position:fixed;left:0;right:0;bottom:0;z-index:98;background:var(--navy-3);padding:10px var(--gutter);gap:10px;transform:translateY(110%);transition:transform var(--t) var(--ease);box-shadow:0 -8px 24px rgba(0,0,0,.25)}
  .mobile-bar.show{transform:none}
  .mobile-bar .btn{justify-content:center;padding:14px 10px}
  body.has-bar{padding-bottom:70px}
  :is(.hero,.hero-d) .wrap{grid-template-columns:1fr;min-height:0}
  .hero .bg::after{background:linear-gradient(180deg,rgba(10,26,64,.88) 0%,rgba(10,26,64,.58) 42%,rgba(10,26,64,.42) 100%)} /* no celular o véu é vertical, para a foto aparecer abaixo do título */
  .hero .bg img{object-position:center 40%}
  :is(.hero,.hero-c,.hero-d) h1{font-size:clamp(30px,7vw,44px)}
  .hero-c .bar form{grid-template-columns:1fr}
  .hero-c .bar .btn{grid-column:auto}
  .service ul.twocol{columns:1}
  .values.two{grid-template-columns:1fr}
  .hero-c .bar .btn{height:auto;padding:16px;justify-content:center}
  .hero-c .bar{padding:12px}
  .hero-c .bar::before{display:none}
  .hero-c.cut .wrap{padding-bottom:90px}
  .hero-d .photo{margin:0 14px 0 0;flex:none;aspect-ratio:4/3;min-height:0}
  .hero-d .photo img,.hero-d .photo::before{border-radius:0 70px 0 70px}
  .about,.why,.faq-wrap,.cta-final .wrap,.contact{grid-template-columns:1fr}
  .cta-final .stripe{display:none}
  .faq-wrap .sticky{position:static}
  .counters .grid{grid-template-columns:1fr 1fr;gap:80px 20px}
  .steps{grid-template-columns:1fr;gap:60px}
  .steps::before{display:none}
  .fulllist,.est,.reviews,.people,.credlist{grid-template-columns:1fr}
  .projects,.projects.gallery{grid-template-columns:repeat(2,1fr)}
  .ghost{display:none}
  .towns-grid{grid-template-columns:repeat(2,1fr)}
  .sec-head.row{flex-direction:column;align-items:flex-start}
  .svc-nav{justify-content:flex-start;margin-top:0}
}
@media (max-width:560px){
  .svc-track{grid-auto-columns:100%}
  .projects,.projects.gallery{grid-template-columns:1fr}
  .checks,.feat{grid-template-columns:1fr}
  .f .row2{grid-template-columns:1fr}
  .counters .grid{grid-template-columns:1fr;gap:80px}
  .footer .top{grid-template-columns:1fr}
  .collage{grid-template-columns:1fr 1fr}
  .collage .a{grid-row:auto;grid-column:1/3;aspect-ratio:16/10}
  .rcard{grid-template-columns:1fr}
  .indox{grid-template-columns:1fr 1fr}
  .values,.dark-cards,.stat-cards,.icon-grid,.lists2,.svc-side .list,.cols2{grid-template-columns:1fr}
  .consik{grid-template-columns:1fr 1fr;grid-template-rows:auto auto auto}
  .consik .owners,.consik .q0{grid-column:1/3;grid-row:1;aspect-ratio:4/3}
  .consik .q1{grid-column:1;grid-row:2;aspect-ratio:4/3}
  .consik .q2{grid-column:2;grid-row:2;aspect-ratio:4/3}
}
