
/* Layout: página papel quente com o hero em "moldura" de foto arredondada (modelo Steelform);
   títulos finos em caixa-alta gigantes, quase nenhuma interface, âmbar só onde importa. */
:root{
  --papel:#ECEAE5;      /* fundo da página */
  --papel-2:#E3DFD8;    /* superfície sutil */
  --tinta:#15130F;      /* texto principal */
  --cinza:#6B655C;      /* texto secundário, puxado pro quente */
  --areia:#CFC3B1;      /* fios e detalhes */
  --ambar:#E8951A;      /* cor da marca: LED, botão, destaque */
  --cobre:#9A560C;      /* âmbar escurecido para texto sobre papel */
  --fosco:#191714;      /* seções escuras */
  --fosco-2:#24211D;
  --osso:#EDE7DD;       /* texto sobre escuro */
  --linha:rgba(21,19,15,.12);
  --linha-e:rgba(237,231,221,.12);
  --f-display:"Urbanist","Barlow",system-ui,sans-serif;
  --f-texto:"Barlow",system-ui,-apple-system,"Segoe UI",sans-serif;
  --r-s:8px; --r-m:16px; --r-l:28px;
  --sombra:0 1px 2px rgba(21,19,15,.08),0 12px 32px -12px rgba(21,19,15,.28);
  --ease:cubic-bezier(.16,1,.3,1);
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--papel);color:var(--tinta);font:400 17px/1.6 var(--f-texto);-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--ambar);outline-offset:3px;border-radius:4px}
.wrap{max-width:1280px;margin:0 auto;padding-inline:clamp(16px,3vw,32px)}
.caps{font-family:var(--f-display);text-transform:uppercase;letter-spacing:-.01em;line-height:1.02;font-weight:300}
.rotulo{font:500 13px/1.3 var(--f-texto);letter-spacing:.04em;color:var(--cinza)}
.rotulo b{color:var(--cobre);font-weight:500}
.btn{display:inline-flex;align-items:center;gap:10px;height:48px;padding:0 26px;border-radius:999px;font:500 15px/1 var(--f-texto);text-decoration:none;border:1px solid transparent;transition:transform .2s var(--ease),background .2s,border-color .2s;cursor:pointer}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn-claro{background:#FBFAF8;color:var(--tinta)}
.btn-linha{border-color:var(--tinta);color:var(--tinta);background:transparent}
.btn-linha:hover{background:var(--tinta);color:var(--papel)}
.btn-ambar{background:var(--ambar);color:#1A1004}
.secao{padding-block:clamp(72px,10vw,128px)}

/* ---------- HERO ---------- */
.hero-casca{padding:clamp(10px,1.6vw,20px)}
.hero{position:relative;border-radius:var(--r-l);overflow:hidden;min-height:clamp(600px,82vh,800px);color:#FBFAF8;isolation:isolate;display:flex;flex-direction:column}
.hero>img.fundo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.06);animation:respira 1.6s var(--ease) forwards}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(14,12,10,.55) 0%,rgba(14,12,10,.08) 34%,rgba(14,12,10,.18) 55%,rgba(14,12,10,.78) 100%)}
@keyframes respira{to{transform:scale(1)}}
.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px clamp(18px,3vw,36px)}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none}
.logo img{height:30px;width:auto}
.logo span{font:400 15px/1 var(--f-display);letter-spacing:.32em}
.menu{display:flex;gap:28px;list-style:none;margin:0;padding:0;font:500 14px/1 var(--f-texto)}
.menu a{text-decoration:none;opacity:.86}
.menu a:hover{opacity:1}
.nav .tel{font:500 14px/1 var(--f-texto);font-variant-numeric:tabular-nums;opacity:.9;text-decoration:none}
.hero-titulo{padding:0 clamp(18px,3vw,36px);margin-top:clamp(4px,2vw,24px)}
.hero-titulo h1{margin:0;font-size:clamp(64px,13.4vw,196px);font-weight:200;letter-spacing:-.035em;line-height:.86}
.hero-titulo h1 span{display:block;opacity:0;transform:translateY(24px);animation:sobe .9s var(--ease) forwards}
.hero-titulo h1 span:nth-child(2){padding-left:clamp(40px,12vw,220px);animation-delay:.08s}
@keyframes sobe{to{opacity:1;transform:none}}
.hero-base{margin-top:auto;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) auto;align-items:end;gap:24px;padding:0 clamp(18px,3vw,36px) clamp(18px,3vw,32px)}
.hero-frase{opacity:0;animation:sobe .9s var(--ease) .22s forwards}
.hero-frase p.caps{font-size:clamp(20px,2.2vw,30px);margin:0 0 6px;font-weight:400;max-width:22ch}
.hero-frase p.sub{margin:0 0 22px;font-size:15px;line-height:1.5;opacity:.82;max-width:46ch}
.hero-prova{display:flex;align-items:center;gap:14px;justify-self:center;opacity:0;animation:sobe .9s var(--ease) .3s forwards}
.hero-prova .selo{width:46px;height:46px;border-radius:50%;border:1px solid rgba(251,250,248,.5);display:grid;place-items:center;font:500 11px/1 var(--f-texto);letter-spacing:.06em}
.hero-prova p{margin:0;font-size:14px;line-height:1.35;opacity:.9}
.hero-prova b{display:block;font:400 22px/1.1 var(--f-display)}
.hero-lado{display:flex;flex-direction:column;gap:10px;width:clamp(150px,15vw,200px);opacity:0;animation:sobe .9s var(--ease) .38s forwards}
.hero-lado .mini{border-radius:12px;overflow:hidden;border:1px solid rgba(251,250,248,.35);aspect-ratio:16/10;box-shadow:0 12px 30px -10px rgba(0,0,0,.6)}
.hero-lado .mini img{width:100%;height:100%;object-fit:cover}
.hero-lado .cartao{background:#FBFAF8;color:var(--tinta);border-radius:12px;padding:14px 16px}
.hero-lado .cartao b{font:400 30px/1 var(--f-display);letter-spacing:-.02em;display:block;font-variant-numeric:tabular-nums}
.hero-lado .cartao span{font-size:12.5px;line-height:1.35;color:var(--cinza);display:block;margin-top:6px}

/* ---------- MANIFESTO ---------- */
.manifesto{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.9fr);gap:clamp(32px,6vw,96px);align-items:start}
.manifesto .nums{display:flex;gap:40px;margin-top:clamp(40px,8vw,120px)}
.manifesto .nums b{font:300 40px/1 var(--f-display);letter-spacing:-.03em;display:block;font-variant-numeric:tabular-nums}
.manifesto .nums span{font-size:13px;color:var(--cinza);display:block;margin-top:8px;max-width:16ch;line-height:1.35}
.manifesto h2{margin:0;font-size:clamp(28px,3.6vw,50px);text-align:right;text-wrap:balance}
.manifesto h2 em{font-style:normal;color:var(--cobre)}
.manifesto .pe{display:flex;justify-content:flex-end;align-items:center;gap:32px;margin-top:32px;flex-wrap:wrap}
.manifesto .pe p{margin:0;max-width:52ch;font-size:15px;color:var(--cinza)}

/* ---------- AMBIENTES ---------- */
.ambientes{display:grid;grid-template-columns:1fr 1.08fr 1fr;gap:clamp(12px,1.6vw,20px);align-items:start}
.amb{text-decoration:none;display:block}
.amb figure{margin:0;border-radius:var(--r-m);overflow:hidden;aspect-ratio:4/3;background:var(--papel-2)}
.amb:nth-child(2) figure{aspect-ratio:4/3.6;margin-top:-28px}
.amb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.amb:hover img{transform:scale(1.03)}
.amb h3{margin:14px 0 2px;font:500 16px/1.3 var(--f-texto)}
.amb p{margin:0;font-size:14px;color:var(--cinza);line-height:1.45}
.outras{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:40px;align-items:center}
.outras .rotulo{margin-right:8px}
.chip{display:inline-flex;align-items:center;height:36px;padding:0 16px;border-radius:999px;border:1px solid var(--linha);font:500 14px/1 var(--f-texto);text-decoration:none;transition:border-color .2s,background .2s}
.chip:hover{border-color:var(--tinta);background:#F6F4F0}
.topo-sec{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:clamp(36px,5vw,56px);flex-wrap:wrap}
.topo-sec h2{margin:8px 0 0;font-size:clamp(30px,4vw,56px);text-wrap:balance}

/* ---------- O TOQUE (elemento memorável) ---------- */
.toque{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);margin-inline:clamp(10px,1.6vw,20px);overflow:hidden}
.toque .rotulo{color:#A39B8F}
.toque .rotulo b{color:var(--ambar)}
.toque-grade{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:stretch}
.toque h2{margin:10px 0 16px;font-size:clamp(30px,4vw,56px)}
.toque .intro{color:#B8AFA2;max-width:52ch;margin:0 0 32px;font-size:16px}
.palco{position:relative;border-radius:var(--r-m);overflow:hidden;aspect-ratio:16/10;background:#0E0D0B}
.palco img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;opacity:0;transition:opacity .7s var(--ease),filter .7s var(--ease)}
.palco img.ativa{opacity:1}
.palco[data-cena="desligar"] img.ativa{filter:brightness(.16) saturate(.4)}
.palco .tag{position:absolute;left:16px;bottom:16px;background:rgba(14,13,11,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid var(--linha-e);border-radius:999px;padding:8px 14px;font:500 13px/1 var(--f-texto);display:flex;align-items:center;gap:8px}
.led{width:7px;height:7px;border-radius:50%;background:var(--ambar);box-shadow:0 0 0 3px rgba(232,149,26,.18),0 0 12px rgba(232,149,26,.7)}
.lado-toque{display:flex;flex-direction:column;gap:20px}
.placa{background:linear-gradient(180deg,#2A2722,#1F1C18);border:1px solid rgba(237,231,221,.1);border-radius:18px;padding:18px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 20px 40px -20px rgba(0,0,0,.7)}
.placa-topo{display:flex;justify-content:space-between;font:500 11px/1 var(--f-texto);letter-spacing:.14em;color:#8C8478;margin-bottom:14px;text-transform:uppercase}
.botoes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.tecla{position:relative;height:64px;border-radius:10px;border:1px solid rgba(237,231,221,.1);background:#171512;color:#CFC7BA;font:500 14px/1.2 var(--f-texto);text-align:left;padding:12px 14px;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.tecla:hover{border-color:rgba(237,231,221,.24)}
.tecla .pt{position:absolute;right:12px;top:12px;width:6px;height:6px;border-radius:50%;background:#3A352E;transition:background .2s,box-shadow .2s}
.tecla[aria-pressed="true"]{background:#221E19;color:#FBF6EE;border-color:rgba(232,149,26,.45)}
.tecla[aria-pressed="true"] .pt{background:var(--ambar);box-shadow:0 0 10px rgba(232,149,26,.8)}
.estado{list-style:none;margin:0;padding:0;border-top:1px solid var(--linha-e)}
.estado li{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--linha-e);font-size:14.5px}
.estado li span:first-child{color:#9E9588}
.estado li span:last-child{font-variant-numeric:tabular-nums;transition:color .3s}
.estado li.mudou span:last-child{color:var(--ambar)}
.nota-toque{font-size:13px;color:#8C8478;margin:0}

/* ---------- OBRA ---------- */
.obra-foto{position:relative;border-radius:var(--r-l);overflow:hidden;aspect-ratio:21/9;min-height:280px}
.obra-foto img{width:100%;height:100%;object-fit:cover}
.obra-foto .lista{position:absolute;right:18px;bottom:18px;display:flex;gap:10px}
.obra-foto .lista figure{margin:0;width:clamp(72px,9vw,120px);aspect-ratio:1;border-radius:12px;overflow:hidden;border:1px solid rgba(251,250,248,.4);box-shadow:0 10px 24px -10px rgba(0,0,0,.6)}
.obra-foto .lista img{width:100%;height:100%;object-fit:cover}
.obra-pe{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr) auto;gap:32px;align-items:start;margin-top:28px}
.obra-pe h2{margin:0;font-size:clamp(26px,3vw,40px)}
.obra-pe h2 em{font-style:normal;color:var(--cobre)}
.obra-pe p{margin:0;font-size:15px;color:var(--cinza);max-width:48ch}
.obra-pe ul{margin:0;padding:0;list-style:none;font-size:13.5px;color:var(--cinza);text-align:right;line-height:1.7}

/* ---------- PROCESSO ---------- */
.processo{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--tinta)}
.etapa{padding:22px 20px 0 0;position:relative}
.etapa::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--tinta)}
.etapa:last-child::before{background:var(--ambar)}
.etapa small{font:500 12px/1 var(--f-texto);color:var(--cinza);letter-spacing:.06em;font-variant-numeric:tabular-nums}
.etapa h3{margin:10px 0 8px;font:400 22px/1.15 var(--f-display);letter-spacing:-.01em}
.etapa p{margin:0;font-size:14.5px;color:var(--cinza);line-height:1.5}

/* ---------- MARCAS ---------- */
.marcas{border-block:1px solid var(--linha);padding-block:28px;overflow:hidden;display:flex;gap:0}
.faixa{display:flex;gap:56px;padding-right:56px;flex-shrink:0;animation:corre 46s linear infinite;align-items:center}
.faixa span{font:400 26px/1 var(--f-display);letter-spacing:.02em;color:#8A8378;white-space:nowrap}
@keyframes corre{to{transform:translateX(-100%)}}
.marcas-pe{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:18px;font-size:14px;color:var(--cinza)}
.marcas-pe a{color:var(--tinta);font-weight:500}

/* ---------- ARTIGOS ---------- */
.artigos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.art{text-decoration:none;display:flex;flex-direction:column}
.art figure{margin:0 0 16px;border-radius:var(--r-m);overflow:hidden;aspect-ratio:3/2;background:var(--papel-2)}
.art img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.art:hover img{transform:scale(1.03)}
.art .meta{font-size:13px;color:var(--cinza);display:flex;justify-content:space-between;gap:12px}
.art .meta b{font-weight:500;color:var(--cobre)}
.art h3{margin:8px 0 0;font:400 22px/1.2 var(--f-display);letter-spacing:-.01em;text-wrap:balance}

/* ---------- RESIDENCIAL ---------- */
.resid{position:relative;border-radius:var(--r-l);overflow:hidden;min-height:520px;display:flex;align-items:flex-end;color:#FBFAF8;isolation:isolate;margin-inline:clamp(10px,1.6vw,20px)}
.resid img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:85% 50%;z-index:-2}
.resid::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(14,12,10,.82) 0%,rgba(14,12,10,.35) 55%,rgba(14,12,10,0) 100%)}
.resid .conteudo{padding:clamp(24px,5vw,64px);max-width:640px}
.resid h2{margin:10px 0 16px;font-size:clamp(34px,5vw,72px);font-weight:200;letter-spacing:-.03em}
.resid p{margin:0 0 28px;opacity:.86;font-size:16px;max-width:46ch}
.resid .rotulo{color:#D9CFC1}

/* ---------- CONTATO ---------- */
.contato{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(32px,6vw,96px)}
.contato h2{margin:10px 0 18px;font-size:clamp(32px,4.4vw,60px)}
.contato .lead{color:var(--cinza);max-width:44ch;margin:0 0 36px}
.canais{list-style:none;margin:0;padding:0;border-top:1px solid var(--linha)}
.canais li{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--linha);font-size:15.5px}
.canais li span:first-child{color:var(--cinza);font-size:13.5px;padding-top:2px}
.canais b{font-weight:500;font-variant-numeric:tabular-nums;user-select:all}
.faq{margin-top:40px}
.faq details{border-bottom:1px solid var(--linha);padding:16px 0}
.faq summary{cursor:pointer;list-style:none;font:500 16px/1.4 var(--f-texto);display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:300 22px/1 var(--f-display);color:var(--cinza);transition:transform .2s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:10px 0 0;color:var(--cinza);font-size:15px;max-width:60ch}
.form{background:#F7F5F2;border-radius:var(--r-l);padding:clamp(22px,3.4vw,40px);box-shadow:var(--sombra);display:grid;gap:18px;align-self:start}
.form .duas{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form label{display:grid;gap:7px;font:500 13px/1.2 var(--f-texto);color:var(--cinza)}
.form input,.form select,.form textarea{width:100%;height:46px;border-radius:var(--r-s);border:1px solid var(--linha);background:#FFFFFF;padding:0 14px;font:400 16px/1.2 var(--f-texto);color:var(--tinta);transition:border-color .15s,box-shadow .15s}
.form textarea{height:auto;min-height:110px;padding:12px 14px;resize:vertical;line-height:1.5}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--ambar);box-shadow:0 0 0 3px rgba(232,149,26,.22)}
.form .rodape-form{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.form .rodape-form small{color:var(--cinza);font-size:13px}
.ok{background:#EAF1E6;color:#2D4A24;border-radius:var(--r-s);padding:12px 14px;font-size:14.5px}

/* ---------- RODAPÉ ---------- */
.rodape{background:var(--fosco);color:var(--osso);margin:clamp(10px,1.6vw,20px);border-radius:var(--r-l);overflow:hidden;padding-top:clamp(48px,6vw,80px)}
.rod-grade{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
.rodape h4{margin:0 0 14px;font:500 12px/1 var(--f-texto);letter-spacing:.12em;color:#8C8478;text-transform:uppercase}
.rodape ul{list-style:none;margin:0;padding:0;display:grid;gap:9px;font-size:14.5px}
.rodape a{text-decoration:none;opacity:.86}
.rodape a:not(.btn):not(.btn-loja):hover{opacity:1;color:var(--ambar)}
.rodape .end{font-size:14px;color:#A39B8F;max-width:34ch;line-height:1.55}
.marca-gigante{font:200 clamp(64px,19vw,300px)/.8 var(--f-display);letter-spacing:-.05em;text-transform:uppercase;color:#2A2622;margin-top:clamp(40px,6vw,72px);white-space:nowrap;text-align:center;user-select:none}
.legal{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:12.5px;color:#7D766B;padding-block:20px;border-top:1px solid var(--linha-e)}

/* ---------- RESPONSIVO ---------- */
@media (max-width:1040px){
  .menu{display:none}
  .rod-grade{grid-template-columns:1fr 1fr}
  .processo{grid-template-columns:repeat(2,minmax(0,1fr));border-top:0;gap:28px 24px}
  .etapa{border-top:1px solid var(--tinta)}
}
@media (max-width:860px){
  .hero-base{grid-template-columns:1fr}
  .hero-prova{justify-self:start}
  .hero-lado{flex-direction:row;width:100%}
  .hero-lado .mini{flex:1;aspect-ratio:4/3}
  .hero-lado .cartao{flex:1.2}
  .manifesto,.toque-grade,.contato{grid-template-columns:1fr}
  .manifesto h2{text-align:left}
  .manifesto .pe{justify-content:flex-start}
  .manifesto .nums{margin-top:0}
  .ambientes{grid-template-columns:1fr 1fr}
  .amb:nth-child(2) figure{margin-top:0;aspect-ratio:4/3}
  .amb:nth-child(3){grid-column:1/-1}
  .amb:nth-child(3) figure{aspect-ratio:16/9}
  .obra-pe{grid-template-columns:1fr}
  .obra-pe ul{text-align:left}
  .artigos{grid-template-columns:1fr}
  .art{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}
  .art figure{margin:0;aspect-ratio:1}
  .art h3{font-size:18px}
}
@media (max-width:560px){
  .nav .tel{display:none}
  .hero-lado .mini:nth-child(2){display:none}
  .ambientes{grid-template-columns:1fr}
  .processo{grid-template-columns:1fr}
  .form .duas{grid-template-columns:1fr}
  .obra-foto{aspect-ratio:4/3}
  .obra-foto .lista figure:nth-child(n+3){display:none}
  .rod-grade{grid-template-columns:1fr}
  .canais li{grid-template-columns:1fr;gap:2px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s!important;animation-delay:0s!important;transition-duration:.001s!important}
  .faixa{animation:none}
}

/* ================= SITE COMPLETO: componentes das páginas internas ================= */
.logo img{height:30px;width:auto}
.nav-acoes{display:flex;align-items:center;gap:18px}
.btn-menu{display:none;align-items:center;gap:8px;height:40px;padding:0 16px;border-radius:999px;border:1px solid rgba(251,250,248,.45);background:transparent;color:inherit;font:500 14px/1 var(--f-texto);cursor:pointer}
.btn-menu span{display:block;width:16px;height:1.5px;background:currentColor;box-shadow:0 5px 0 currentColor}
.menu a[aria-current="page"]{opacity:1;box-shadow:0 1.5px 0 var(--ambar);padding-bottom:4px}
@media (max-width:1040px){.btn-menu{display:inline-flex}}
.gaveta{position:fixed;inset:0;z-index:80;background:rgba(14,12,10,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);display:flex;justify-content:flex-end}
.gaveta-corpo{width:min(420px,100%);height:100%;background:var(--papel);padding:calc(24px + env(safe-area-inset-top,0px)) 28px calc(28px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:28px;overflow:auto}
.gaveta-topo{display:flex;justify-content:space-between;align-items:center}
.gaveta-topo .rotulo{margin:0}
.fechar{width:40px;height:40px;border-radius:50%;border:1px solid var(--linha);background:transparent;font:300 24px/1 var(--f-display);cursor:pointer;color:var(--tinta)}
.gaveta ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--linha)}
.gaveta li a{display:flex;justify-content:space-between;padding:16px 0;border-bottom:1px solid var(--linha);font:300 24px/1.1 var(--f-display);text-decoration:none;text-transform:uppercase}
.gaveta li a:hover{color:var(--cobre)}
.gaveta .sub li a{font:500 15px/1.2 var(--f-texto);text-transform:none;padding:12px 0}
.gaveta .contatos{font-size:14px;color:var(--cinza);display:grid;gap:4px}

/* barra clara (artigos) */
.barra{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;background:rgba(236,234,229,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--linha)}
.barra .nav{padding-block:14px;color:var(--tinta)}
.barra .logo{background:var(--fosco);border-radius:10px;padding:6px 12px}
.barra .logo img{height:24px}
.barra .btn-menu{border-color:var(--linha)}

/* topo das páginas internas */
.hero-int{min-height:clamp(520px,68vh,680px)}
.hero-int .hero-texto{margin-top:auto;padding:0 clamp(18px,3vw,36px) clamp(24px,4vw,44px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:end}
.hero-int .trilha{font:500 13px/1.3 var(--f-texto);letter-spacing:.04em;opacity:.82;margin:0 0 14px;display:flex;gap:8px;flex-wrap:wrap}
.hero-int .trilha a{text-decoration:none}
.hero-int .trilha a:hover{color:var(--ambar)}
.hero-int h1{margin:0;font-size:clamp(38px,5.8vw,86px);font-weight:200;letter-spacing:-.03em;line-height:.98;max-width:17ch;text-wrap:balance;opacity:0;animation:sobe .9s var(--ease) forwards}
.hero-int .sub{margin:18px 0 0;max-width:54ch;font-size:16px;line-height:1.55;opacity:.86}
.hero-int .acoes{display:flex;gap:10px;flex-wrap:wrap}
.btn-vidro{background:rgba(251,250,248,.12);color:#FBFAF8;border-color:rgba(251,250,248,.4);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn-vidro:hover{background:rgba(251,250,248,.22)}

/* texto em duas colunas */
.texto2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(28px,6vw,96px);align-items:start}
.texto2 h2{margin:10px 0 0;font-size:clamp(28px,3.4vw,48px);text-wrap:balance}
.texto2 h2 em,.caps em{font-style:normal;color:var(--cobre)}
.texto2 .corpo p{margin:0 0 18px;font-size:17px;max-width:62ch}
.texto2 .corpo p:first-child{font-size:19px;color:var(--tinta)}
.texto2 .corpo p:not(:first-child){color:var(--cinza)}
.sep{border:0;border-top:1px solid var(--linha);margin:0}

/* escopo (lista com fio) */
.escopo-cab{display:flex;justify-content:space-between;gap:24px;align-items:end;flex-wrap:wrap;margin-bottom:32px}
.escopo-cab h2{margin:8px 0 0;font-size:clamp(28px,3.4vw,48px)}
.escopo-cab .lead{margin:0;max-width:44ch;color:var(--cinza);font-size:15px}
.escopo{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,64px);border-top:1px solid var(--tinta)}
.escopo li{display:grid;grid-template-columns:14px 1fr;gap:14px;align-items:baseline;padding:16px 0;border-bottom:1px solid var(--linha);font-size:16px}
.escopo li::before{content:"";width:7px;height:7px;background:var(--ambar);border-radius:1px;transform:translateY(-2px)}
.escopo.uma{grid-template-columns:1fr}
.nota{margin:18px 0 0;font-size:13.5px;color:var(--cinza)}

/* galeria */
.galeria{display:grid;gap:clamp(8px,1.2vw,14px);grid-auto-rows:clamp(150px,17vw,250px)}
.galeria .foto{position:relative;margin:0;border-radius:var(--r-m);overflow:hidden;background:var(--papel-2);cursor:zoom-in;border:0;padding:0;text-align:left;color:#FBFAF8;font:inherit;display:block;width:100%;height:100%}
.galeria .foto img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.galeria .foto:hover img{transform:scale(1.03)}
.galeria .foto figcaption,.galeria .foto .leg{position:absolute;left:10px;bottom:10px;right:10px;font:500 13px/1.3 var(--f-texto);background:rgba(14,12,10,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:8px;padding:7px 10px;width:fit-content;max-width:calc(100% - 20px)}
.galeria.g1{grid-template-columns:1fr;grid-auto-rows:clamp(240px,34vw,460px)}
.galeria.g2{grid-template-columns:1.3fr 1fr;grid-auto-rows:clamp(220px,28vw,400px)}
.galeria.g4{grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(200px,24vw,340px)}
.galeria.g6{grid-template-columns:repeat(3,1fr)}
.galeria.g8{grid-template-columns:repeat(4,1fr)}
.galeria.g3{grid-template-columns:2fr 1fr}
.galeria.g5{grid-template-columns:2fr 1fr 1fr}
.galeria.g7{grid-template-columns:2fr 1fr 1fr 1fr}
.galeria.g3 .foto:first-child,.galeria.g5 .foto:first-child,.galeria.g7 .foto:first-child{grid-row:span 2}
.galeria-cab{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:24px}
.galeria-cab h2{margin:8px 0 0;font-size:clamp(26px,3vw,42px)}
.galeria-cab p{margin:0;max-width:52ch;color:var(--cinza);font-size:15px}
.galeria-cab .conta{font:300 40px/1 var(--f-display);color:var(--areia);font-variant-numeric:tabular-nums}

/* ampliar foto */
.caixa-foto{position:fixed;inset:0;z-index:90;background:rgba(10,9,8,.92);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:calc(56px + env(safe-area-inset-top,0px)) 16px calc(24px + env(safe-area-inset-bottom,0px))}
.caixa-foto img{max-width:min(1200px,100%);max-height:78vh;object-fit:contain;border-radius:12px}
.caixa-foto p{color:var(--osso);margin:0;font-size:14.5px;text-align:center;max-width:70ch}
.caixa-foto .fechar{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:16px;color:var(--osso);border-color:var(--linha-e)}
.caixa-foto .setas{display:flex;gap:10px}
.caixa-foto .setas button{height:40px;padding:0 18px;border-radius:999px;border:1px solid var(--linha-e);background:transparent;color:var(--osso);font:500 14px/1 var(--f-texto);cursor:pointer}

/* bastidores (vídeo) */
.videos{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,210px),1fr));gap:16px}
.video-card{margin:0}
.video-card .quadro{position:relative;border-radius:var(--r-m);overflow:hidden;aspect-ratio:9/14;background:#0E0D0B}
.video-card .quadro img{width:100%;height:100%;object-fit:cover}
.video-card .tag{position:absolute;left:12px;top:12px;background:rgba(14,13,11,.7);color:var(--osso);border-radius:999px;padding:6px 12px;font:500 12px/1 var(--f-texto);display:flex;gap:7px;align-items:center}
.video-card h3{margin:12px 0 2px;font:500 16px/1.3 var(--f-texto)}
.video-card p{margin:0;color:var(--cinza);font-size:14px}
.bastidores{display:grid;grid-template-columns:1fr;gap:28px}
.bastidores>div:first-child{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap}
.bastidores h2{margin:8px 0 14px;font-size:clamp(28px,3.4vw,48px)}

/* marcas da linha */
.logos-linha{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));border-top:1px solid var(--linha);border-left:1px solid var(--linha)}
.logos-linha .lg{height:96px;display:grid;place-items:center;border-right:1px solid var(--linha);border-bottom:1px solid var(--linha);padding:18px}
.logos-linha img{max-height:30px;max-width:100%;width:auto;filter:invert(1) brightness(.35) sepia(.2);opacity:.85;transition:opacity .2s}
.logos-linha .lg:hover img{opacity:1}
.logos-linha .nome{font:400 17px/1.2 var(--f-display);color:#8A8378;text-align:center}

/* perguntas */
.duvidas{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(28px,6vw,96px);align-items:start}
.duvidas h2{margin:10px 0 0;font-size:clamp(28px,3.4vw,48px)}
.duvidas .faq{margin:0;border-top:1px solid var(--tinta)}

/* contato compacto */
.contato-int{background:#F7F5F2;border-radius:var(--r-l);box-shadow:var(--sombra);padding:clamp(24px,4vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:clamp(24px,5vw,72px)}
.contato-int h2{margin:10px 0 14px;font-size:clamp(28px,3.4vw,46px)}
.contato-int .lead{margin:0 0 24px;color:var(--cinza)}
.contato-int .canais li{grid-template-columns:96px 1fr;padding:12px 0;font-size:15px}
.contato-int .form{box-shadow:none;background:transparent;padding:0}

/* frase de fechamento */
.fecho{border-top:1px solid var(--tinta);padding-top:clamp(28px,4vw,48px);display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:end}
.fecho h2{margin:0;font-size:clamp(30px,4.2vw,60px);text-wrap:balance}
.fecho p{margin:0 0 22px;color:var(--cinza);max-width:46ch}

/* artigo */
.art-topo{padding-block:clamp(40px,7vw,96px) clamp(28px,4vw,48px)}
.art-topo .trilha{font:500 13px/1.3 var(--f-texto);color:var(--cinza);display:flex;gap:8px;flex-wrap:wrap;margin:0 0 24px}
.art-topo .trilha a{text-decoration:none}
.art-topo .trilha a:hover{color:var(--cobre)}
.art-topo h1{margin:0;font:300 clamp(36px,5.4vw,72px)/1.02 var(--f-display);letter-spacing:-.03em;max-width:20ch;text-wrap:balance}
.art-topo .resumo{margin:22px 0 0;font-size:clamp(18px,1.6vw,21px);color:var(--cinza);max-width:56ch;line-height:1.5}
.art-meta{display:flex;flex-wrap:wrap;gap:8px 24px;margin-top:28px;padding-top:18px;border-top:1px solid var(--linha);font-size:14px;color:var(--cinza);font-variant-numeric:tabular-nums}
.art-meta b{color:var(--tinta);font-weight:500}
.art-meta .cat{color:var(--cobre);font-weight:500}
.art-capa{margin:0 auto;max-width:1280px;padding-inline:clamp(10px,1.6vw,20px)}
.art-capa img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--r-l)}
.art-corpo{max-width:720px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(16px,3vw,32px) 0}
.art-corpo p{margin:0 0 22px;font-size:18.5px;line-height:1.72;color:#2A2622}
.art-corpo p.abre{font-size:21px;line-height:1.6;color:var(--tinta)}
.art-corpo h2{margin:48px 0 14px;font:400 clamp(24px,2.6vw,32px)/1.15 var(--f-display);letter-spacing:-.015em;text-wrap:balance}
.art-corpo ul{margin:0 0 22px;padding-left:20px;font-size:18px;line-height:1.7}
.art-corpo blockquote{margin:28px 0;padding:4px 0 4px 22px;border-left:2px solid var(--ambar);font:300 23px/1.45 var(--f-display);color:var(--tinta)}
.art-corpo strong{font-weight:500;color:var(--tinta)}
.cta-art{max-width:720px;margin:clamp(32px,5vw,56px) auto 0;padding-inline:clamp(16px,3vw,32px)}
.cta-art .caixa{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);padding:clamp(24px,4vw,40px);display:flex;justify-content:space-between;gap:24px;align-items:center;flex-wrap:wrap}
.cta-art h2{margin:0 0 6px;font:300 clamp(24px,2.6vw,32px)/1.1 var(--f-display);letter-spacing:-.01em}
.cta-art p{margin:0;color:#B8AFA2;font-size:15px;max-width:44ch}

/* biblioteca de artigos */
.destaque{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:center;text-decoration:none;padding-bottom:clamp(40px,6vw,72px);border-bottom:1px solid var(--linha)}
.destaque figure{margin:0;border-radius:var(--r-l);overflow:hidden;aspect-ratio:4/3}
.destaque img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.destaque:hover img{transform:scale(1.03)}
.destaque h2{margin:12px 0 14px;font:300 clamp(30px,3.6vw,52px)/1.04 var(--f-display);letter-spacing:-.025em;text-wrap:balance}
.destaque p{margin:0 0 20px;color:var(--cinza);max-width:46ch}
.destaque .meta{font-size:13.5px;color:var(--cinza);display:flex;gap:14px;flex-wrap:wrap}
.destaque .meta b{color:var(--cobre);font-weight:500}
.filtro{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:clamp(32px,5vw,48px) 0 8px}
.filtro .rotulo{margin-right:8px}
.filtro button{height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--linha);background:transparent;font:500 14px/1 var(--f-texto);color:var(--tinta);cursor:pointer;display:inline-flex;gap:8px;align-items:center}
.filtro button small{color:var(--cinza);font-variant-numeric:tabular-nums}
.filtro button[aria-pressed="true"]{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.filtro button[aria-pressed="true"] small{color:var(--areia)}
.indice{list-style:none;margin:0;padding:0}
.indice li a{display:grid;grid-template-columns:120px minmax(0,1fr) auto;gap:clamp(14px,3vw,32px);align-items:center;padding:20px 0;border-bottom:1px solid var(--linha);text-decoration:none;transition:background .2s}
.indice li a:hover h3{color:var(--cobre)}
.indice figure{margin:0;border-radius:12px;overflow:hidden;aspect-ratio:4/3}
.indice img{width:100%;height:100%;object-fit:cover}
.indice .cat{font-size:13px;color:var(--cobre);font-weight:500}
.indice h3{margin:4px 0 4px;font:400 clamp(19px,1.8vw,24px)/1.2 var(--f-display);letter-spacing:-.01em;transition:color .2s;text-wrap:balance}
.indice p{margin:0;color:var(--cinza);font-size:14.5px;max-width:64ch}
.indice .min{font-size:13px;color:var(--cinza);white-space:nowrap;font-variant-numeric:tabular-nums}

/* linhas (índice das soluções) */
.linhas{list-style:none;margin:0;padding:0;border-top:1px solid var(--tinta)}
.linhas a{display:grid;grid-template-columns:56px minmax(0,1.1fr) minmax(0,1fr) 150px;gap:clamp(14px,3vw,32px);align-items:center;padding:18px 0;border-bottom:1px solid var(--linha);text-decoration:none;position:relative}
.linhas a::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:0;background:var(--ambar);transition:width .5s var(--ease)}
.linhas a:hover::after{width:100%}
.linhas .n{font:300 24px/1 var(--f-display);color:var(--areia);font-variant-numeric:tabular-nums;transition:color .2s}
.linhas a:hover .n{color:var(--ambar)}
.linhas h3{margin:0;font:400 clamp(20px,2vw,28px)/1.15 var(--f-display);letter-spacing:-.01em}
.linhas p{margin:0;color:var(--cinza);font-size:15px}
.linhas figure{margin:0;border-radius:12px;overflow:hidden;aspect-ratio:3/2}
.linhas img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.linhas a:hover img{transform:scale(1.05)}

/* guia de soluções */
.guia{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(24px,5vw,72px);align-items:start}
.guia h2{margin:8px 0 10px;font-size:clamp(30px,3.8vw,54px)}
.guia .pergunta{margin-top:28px}
.guia .pergunta h3{margin:0 0 12px;font:500 15px/1.3 var(--f-texto)}
.opcoes{display:flex;flex-wrap:wrap;gap:8px}
.opcoes button{min-height:42px;padding:8px 16px;border-radius:999px;border:1px solid var(--linha);background:#F7F5F2;font:500 14.5px/1.2 var(--f-texto);color:var(--tinta);cursor:pointer;text-align:left}
.opcoes button:hover{border-color:var(--tinta)}
.opcoes button[aria-pressed="true"]{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.resultado{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);overflow:hidden;position:sticky;top:24px}
.resultado figure{margin:0;aspect-ratio:16/10;background:#0E0D0B}
.resultado figure img{width:100%;height:100%;object-fit:cover}
.resultado .txt{padding:24px clamp(20px,3vw,32px) 28px}
.resultado .rotulo{color:#A39B8F}
.resultado .rotulo b{color:var(--ambar)}
.resultado h3{margin:8px 0 8px;font:300 clamp(24px,2.6vw,34px)/1.1 var(--f-display);letter-spacing:-.015em}
.resultado p{margin:0 0 20px;color:#B8AFA2}
.resultado .acoes{display:flex;gap:10px;flex-wrap:wrap}
.resultado .btn-linha{border-color:rgba(237,231,221,.4);color:var(--osso)}
.resultado .btn-linha:hover{background:var(--osso);color:var(--fosco)}
.resultado .vazio{padding:clamp(28px,4vw,40px);color:#B8AFA2}
.atalhos{display:flex;flex-wrap:wrap;gap:6px;margin-top:28px}

/* princípios */
.principios{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,2vw,20px)}
.principio{background:#F7F5F2;border-radius:var(--r-m);padding:clamp(22px,3vw,36px);border:1px solid var(--linha)}
.principio h3{margin:0 0 10px;font:300 clamp(22px,2.4vw,30px)/1.15 var(--f-display);letter-spacing:-.015em;text-wrap:balance}
.principio p{margin:0;color:var(--cinza)}

/* livro-razão */
.razao{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:clamp(24px,5vw,80px);align-items:start}
.razao h2{margin:8px 0 14px;font-size:clamp(28px,3.4vw,48px)}
.razao .lead{color:var(--cinza);margin:0;max-width:46ch}
.razao dl{margin:0;border-top:1px solid var(--tinta)}
.razao dl div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;padding:18px 0;border-bottom:1px solid var(--linha)}
.razao dt{font:400 20px/1.25 var(--f-display)}
.razao dd{margin:0;color:var(--cinza)}

/* tríptico */
.triptico{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:clamp(10px,1.6vw,20px);align-items:end}
.triptico a{text-decoration:none}
.triptico figure{margin:0;border-radius:var(--r-m);overflow:hidden;aspect-ratio:3/4}
.triptico a:nth-child(2) figure{aspect-ratio:3/4.4}
.triptico img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.triptico a:hover img{transform:scale(1.03)}
.triptico h3{margin:14px 0 2px;font:500 16px/1.3 var(--f-texto)}
.triptico p{margin:0;color:var(--cinza);font-size:14px}

/* camadas */
.camadas{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:start}
.camadas h2{margin:8px 0 12px;font-size:clamp(30px,3.8vw,54px)}
.camadas .intro{color:var(--cinza);margin:0 0 28px;max-width:52ch}
.camadas .palco{aspect-ratio:4/3;position:sticky;top:24px}
.camada{display:grid;grid-template-columns:72px 1fr;gap:16px;width:100%;text-align:left;background:transparent;border:0;border-top:1px solid var(--linha);padding:18px 0;cursor:pointer;color:var(--tinta);font:inherit}
.camada:last-of-type{border-bottom:1px solid var(--linha)}
.camada small{font:500 12px/1.4 var(--f-texto);color:var(--cinza);letter-spacing:.04em;font-variant-numeric:tabular-nums}
.camada b{display:block;font:400 22px/1.2 var(--f-display);letter-spacing:-.01em;transition:color .2s}
.camada span.t{display:block;color:var(--cinza);font-size:15px;margin-top:6px;max-height:0;overflow:hidden;opacity:0;transition:max-height .4s var(--ease),opacity .3s}
.camada[aria-pressed="true"] b{color:var(--cobre)}
.camada[aria-pressed="true"] small{color:var(--cobre)}
.camada[aria-pressed="true"] span.t{max-height:160px;opacity:1}
.camadas .fecho-c{margin:24px 0 0;font:300 22px/1.35 var(--f-display)}
.camadas .fecho-c em{font-style:normal;color:var(--cobre)}

/* palavras grandes */
.palavras p{margin:0;font:200 clamp(34px,5.6vw,84px)/1.02 var(--f-display);letter-spacing:-.035em;text-transform:uppercase;text-wrap:balance}
.palavras p span{color:#B7AD9F}

/* faixa de nome (Yealink) */
.faixa-nome{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);margin-inline:clamp(10px,1.6vw,20px);padding:clamp(32px,5vw,64px) clamp(20px,4vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,4vw,56px);align-items:end;overflow:hidden}
.faixa-nome .nome{font:200 clamp(64px,12vw,190px)/.82 var(--f-display);letter-spacing:-.05em;text-transform:uppercase;color:var(--ambar)}
.faixa-nome p{margin:0;color:#C9C0B3;font-size:16.5px;max-width:52ch}

/* showroom */
.showroom{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(16px,3vw,32px);align-items:stretch}
.showroom figure{margin:0;border-radius:var(--r-l);overflow:hidden;min-height:420px}
.showroom figure img{width:100%;height:100%;object-fit:cover}
.showroom .ficha{background:#F7F5F2;border-radius:var(--r-l);box-shadow:var(--sombra);padding:clamp(24px,3.4vw,44px);display:flex;flex-direction:column;gap:18px}
.showroom h2{margin:6px 0 0;font-size:clamp(28px,3.2vw,44px)}
.showroom .frase{margin:0;color:var(--cinza)}
.showroom .end{font-size:15px;line-height:1.55}
.showroom .end b{font-weight:500}
.showroom ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--linha)}
.showroom ul li{padding:10px 0;border-bottom:1px solid var(--linha);font-size:15px;display:flex;gap:10px;align-items:baseline}
.showroom ul li::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--ambar);flex-shrink:0;transform:translateY(-2px)}
.showroom .tels{display:flex;gap:16px 28px;flex-wrap:wrap;font-variant-numeric:tabular-nums;font-size:15px}

/* abas (residencial) */
.abas{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.5fr);gap:clamp(20px,4vw,56px);align-items:start}
.abas-lista{display:flex;flex-direction:column;border-top:1px solid var(--tinta)}
.aba{display:flex;justify-content:space-between;align-items:center;gap:12px;background:transparent;border:0;border-bottom:1px solid var(--linha);padding:16px 0;text-align:left;font:300 clamp(20px,2vw,26px)/1.15 var(--f-display);color:var(--cinza);cursor:pointer;text-transform:uppercase;letter-spacing:-.01em}
.aba::after{content:"";width:7px;height:7px;border-radius:50%;background:transparent;transition:background .2s}
.aba:hover{color:var(--tinta)}
.aba[aria-selected="true"]{color:var(--tinta)}
.aba[aria-selected="true"]::after{background:var(--ambar);box-shadow:0 0 10px rgba(232,149,26,.7)}
.painel figure{margin:0 0 20px;border-radius:var(--r-l);overflow:hidden;aspect-ratio:16/10}
.painel figure img{width:100%;height:100%;object-fit:cover}
.painel h3{margin:0 0 10px;font:300 clamp(26px,2.8vw,38px)/1.08 var(--f-display);letter-spacing:-.02em}
.painel p{margin:0 0 18px;color:var(--cinza);max-width:62ch}
.painel .escopo{margin-bottom:20px}
.tira{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px}
.tira button{margin:0;padding:0;border:0;border-radius:10px;overflow:hidden;aspect-ratio:1;cursor:zoom-in;background:var(--papel-2)}
.tira img{width:100%;height:100%;object-fit:cover}

/* marcas */
.portao{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);padding:clamp(24px,4vw,48px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(20px,4vw,56px);align-items:center}
.portao h2{margin:8px 0 10px;font-size:clamp(26px,3.2vw,44px)}
.portao h2 em{font-style:normal;color:var(--ambar)}
.portao p{margin:0;color:#B8AFA2}
.portao .rotulo{color:#A39B8F}
.portao form{display:grid;gap:12px}
.portao .duas{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.portao input{width:100%;height:46px;border-radius:var(--r-s);border:1px solid var(--linha-e);background:#110F0D;color:var(--osso);padding:0 14px;font:400 16px/1.2 var(--f-texto)}
.portao input:focus{outline:none;border-color:var(--ambar);box-shadow:0 0 0 3px rgba(232,149,26,.22)}
.portao .ok{background:rgba(120,170,100,.14);color:#BFD9B0}
.grupo-marcas{padding-top:clamp(36px,5vw,56px)}
.grupo-marcas h2{margin:0 0 18px;font:400 clamp(22px,2.4vw,30px)/1.15 var(--f-display);letter-spacing:-.01em;display:flex;justify-content:space-between;gap:16px;align-items:baseline}
.grupo-marcas h2 small{font:500 13px/1 var(--f-texto);color:var(--cinza);font-variant-numeric:tabular-nums}
.grupo-marcas.travado .logos-linha{filter:blur(6px);opacity:.55;pointer-events:none;user-select:none}

/* segmentos */
.segmentos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--tinta)}
.segmentos a{display:flex;justify-content:space-between;align-items:end;gap:12px;min-height:120px;padding:18px 18px 18px 0;border-bottom:1px solid var(--linha);text-decoration:none;font:300 clamp(20px,2vw,26px)/1.1 var(--f-display);text-transform:uppercase;letter-spacing:-.01em}
.segmentos a:not(:nth-child(4n)){border-right:1px solid var(--linha)}
.segmentos a:not(:nth-child(4n+1)){padding-left:18px}
.segmentos a span{font:500 12px/1 var(--f-texto);color:var(--cinza);text-transform:none;white-space:nowrap}
.segmentos a:hover{color:var(--cobre)}

/* whatsapp discreto */
.zap{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border-radius:999px;background:var(--fosco);color:var(--osso);text-decoration:none;font:500 14px/1 var(--f-texto);box-shadow:0 10px 30px -10px rgba(0,0,0,.5);border:1px solid rgba(237,231,221,.12)}
.zap .led{width:7px;height:7px}

@media (max-width:1040px){
  .linhas a{grid-template-columns:40px minmax(0,1fr) 120px}
  .linhas a p{grid-column:2;grid-row:2}
  .linhas figure{grid-row:span 2;grid-column:3}
  .segmentos{grid-template-columns:repeat(2,minmax(0,1fr))}
  .segmentos a{border-right:0!important;padding-left:0!important}
  .segmentos a:nth-child(odd){border-right:1px solid var(--linha)!important}
  .segmentos a:nth-child(even){padding-left:18px!important}
}
@media (max-width:860px){
  .hero-int .hero-texto{grid-template-columns:1fr}
  .texto2,.duvidas,.contato-int,.fecho,.bastidores,.guia,.razao,.camadas,.faixa-nome,.showroom,.abas,.portao,.destaque{grid-template-columns:1fr}
  .escopo{grid-template-columns:1fr}
  .galeria.g4,.galeria.g6,.galeria.g8,.galeria.g5,.galeria.g7,.galeria.g3{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(140px,36vw,240px)}
  .galeria .foto:first-child{grid-column:1/-1;grid-row:span 1!important}
  .galeria.g2{grid-template-columns:1fr}
  .triptico{grid-template-columns:1fr 1fr}
  .triptico a:nth-child(2){grid-column:1/-1;grid-row:1}
  .triptico a:nth-child(2) figure{aspect-ratio:16/10}
  .principios{grid-template-columns:1fr}
  .camadas .palco,.resultado{position:static}
  .indice li a{grid-template-columns:88px minmax(0,1fr)}
  .indice .min{grid-column:2}
  .razao dl div{grid-template-columns:1fr;gap:4px}
  .showroom figure{min-height:260px}
}
@media (max-width:560px){
  .linhas a{grid-template-columns:minmax(0,1fr) 96px}
  .linhas .n{display:none}
  .linhas h3,.linhas a p{grid-column:1}
  .linhas figure{grid-column:2}
  .segmentos{grid-template-columns:1fr}
  .segmentos a{border-right:0!important;padding-left:0!important;min-height:80px}
  .portao .duas{grid-template-columns:1fr}
}
.caps,.palavras p,.faixa-nome .nome,h1,h2,h3{overflow-wrap:break-word}
@media (max-width:560px){.caps,h1,h2{-webkit-hyphens:auto;hyphens:auto}}
body{overflow-x:clip}
@media (min-width:1041px){.processo.p3{grid-template-columns:repeat(3,minmax(0,1fr))}.processo.p4{grid-template-columns:repeat(4,minmax(0,1fr))}.processo.p6{grid-template-columns:repeat(6,minmax(0,1fr))}}
/* vídeo do topo com pontilhado (estilo grade 3x3 sobre o vídeo) */
.hero>video.fundo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;background:#14120f}
.hero .pontos{position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(10,9,8,.62) 0.9px,transparent 1.1px);background-size:3px 3px}
/* placa: coluna da direita ocupa toda a altura da foto, sem vazio no fim */
.lado-toque{height:100%}
.lado-toque .estado{flex:1;display:flex;flex-direction:column}
.lado-toque .estado li{flex:1;align-items:center;min-height:44px}
.lado-toque .nota-toque{margin-top:auto}
@media (max-width:860px){.lado-toque{height:auto}.lado-toque .estado li{flex:none}}
/* obra: miniaturas trocam a foto principal */
.obra-foto{background:#14120f}
.obra-foto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .6s var(--ease)}
.obra-foto>img.ativa{opacity:1}
.tag-obra{position:absolute;left:18px;bottom:18px;background:rgba(14,13,11,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(237,231,221,.14);color:var(--osso);border-radius:999px;padding:9px 16px;font:500 14px/1 var(--f-texto);display:flex;align-items:center;gap:9px}
.obra-foto .lista{gap:10px}
.mini-obra{position:relative;width:clamp(76px,8.4vw,116px);aspect-ratio:1;padding:0;border-radius:12px;overflow:hidden;border:2px solid rgba(251,250,248,.5);background:#14120f;cursor:pointer;box-shadow:0 10px 24px -10px rgba(0,0,0,.6);transition:transform .25s var(--ease),border-color .2s}
.mini-obra img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.mini-obra span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.mini-obra:hover{transform:translateY(-4px)}
.mini-obra:hover img{transform:scale(1.06)}
.mini-obra[aria-pressed="true"]{border-color:var(--ambar);box-shadow:0 0 0 3px rgba(232,149,26,.25),0 10px 24px -10px rgba(0,0,0,.6)}
.obra-pe{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;align-items:end}
.obra-pe p{font-size:16px;max-width:52ch;justify-self:end}
@media (max-width:860px){.obra-pe{grid-template-columns:1fr!important}.obra-pe p{justify-self:start}
  .obra-foto{aspect-ratio:4/3}.obra-foto .lista{left:12px;right:12px;bottom:60px;justify-content:flex-start;flex-wrap:nowrap;overflow-x:auto}
  .obra-foto .lista figure,.mini-obra{flex:0 0 auto}.tag-obra{left:12px;bottom:12px}}
/* faixa de marcas com logos oficiais */
.faixa{gap:clamp(48px,6vw,88px);padding-right:clamp(48px,6vw,88px)}
.faixa img{height:32px;width:auto;max-width:150px;object-fit:contain;filter:invert(1) brightness(.3) sepia(.15);opacity:.75;transition:opacity .2s}
.marcas:hover .faixa{animation-play-state:paused}
.faixa img:hover{opacity:1}

/* contato: formulário acompanha a altura da coluna ao lado, sem vazio */
.contato,.contato-int{align-items:stretch}
.contato .form,.contato-int .form{align-self:stretch;display:flex;flex-direction:column}
.contato .form label:has(textarea),.contato-int .form label:has(textarea){flex:1;display:flex;flex-direction:column}
.contato .form textarea,.contato-int .form textarea{flex:1;min-height:110px}
.contato h2{font-size:clamp(30px,3.6vw,52px)}
@media (max-width:860px){.contato .form label:has(textarea),.contato-int .form label:has(textarea){flex:none}}
/* perguntas frequentes em destaque */
.faq-grande{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.4fr);gap:clamp(32px,6vw,96px);align-items:start;border-top:1px solid var(--linha)}
.faq-lado{position:sticky;top:32px}
.faq-lado h2{margin:10px 0 16px;font-size:clamp(34px,4.4vw,64px);text-wrap:balance}
.faq-lado p:not(.rotulo){margin:0 0 24px;color:var(--cinza);max-width:40ch}
.faq-grupo{margin-bottom:clamp(28px,4vw,44px)}
.faq-grupo:last-child{margin-bottom:0}
.faq-grupo h3{margin:0 0 4px;padding-bottom:12px;border-bottom:1px solid var(--tinta);font:500 13px/1.3 var(--f-texto);letter-spacing:.06em;text-transform:uppercase;color:var(--cobre);display:flex;justify-content:space-between}
.faq-grupo h3 small{color:var(--cinza);font-variant-numeric:tabular-nums}
.faq-grupo details,.duvidas .faq details{border-bottom:1px solid var(--linha);padding:22px 0}
.faq-grupo summary,.duvidas .faq summary{cursor:pointer;list-style:none;font:400 clamp(19px,1.7vw,23px)/1.3 var(--f-display);letter-spacing:-.01em;display:flex;justify-content:space-between;gap:20px;align-items:baseline}
.faq-grupo summary::-webkit-details-marker{display:none}
.faq-grupo summary::after,.duvidas .faq summary::after{content:"+";font:300 28px/1 var(--f-display);color:var(--cobre);transition:transform .25s var(--ease);flex-shrink:0}
.faq-grupo details[open] summary::after,.duvidas .faq details[open] summary::after{transform:rotate(45deg)}
.faq-grupo details p,.duvidas .faq details p{margin:12px 0 0;color:var(--cinza);font-size:16.5px;line-height:1.65;max-width:62ch}
.faq-grupo summary:hover,.duvidas .faq summary:hover{color:var(--cobre)}
@media (max-width:860px){.faq-grande{grid-template-columns:1fr}.faq-lado{position:static}}
/* rodapé: marca maior e "Cinemma Group" */
.marca-gigante{font-size:clamp(34px,9.2vw,148px);letter-spacing:-.04em}
.marca-gigante span{color:rgba(232,149,26,.24)}
.logo img{height:40px}
.barra .logo img{height:28px}
/* botão da loja virtual */
.btn-loja{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 16px;border-radius:999px;border:1px solid rgba(251,250,248,.5);font:500 14px/1 var(--f-texto);text-decoration:none;transition:background .2s,border-color .2s,color .2s;white-space:nowrap}
.btn-loja:hover{background:var(--ambar);border-color:var(--ambar);color:#1A1004}
.barra .btn-loja{border-color:var(--linha)}
.menu{gap:24px}
@media (max-width:1320px){.nav .tel{display:none}}
@media (max-width:1180px){.menu{gap:18px;font-size:13.5px}}
@media (max-width:560px){.btn-loja{display:none}}
/* guia de soluções organizado e com resultado desde o início */
.guia{align-items:stretch}
.guia .pergunta{margin-top:24px;padding-top:20px;border-top:1px solid var(--linha)}
.guia .pergunta h3{display:flex;align-items:center;gap:10px;margin:0 0 14px;font:500 16px/1.3 var(--f-texto)}
.guia .pergunta h3 span{width:24px;height:24px;border-radius:50%;background:var(--tinta);color:var(--papel);display:grid;place-items:center;font:500 12px/1 var(--f-texto);font-variant-numeric:tabular-nums;flex-shrink:0}
.opcoes.g2,.opcoes.g3,.opcoes.g4{display:grid;gap:8px}
.opcoes.g2{grid-template-columns:repeat(2,minmax(0,1fr))}
.opcoes.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.opcoes.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.opcoes.g2 button,.opcoes.g3 button{min-height:46px;border-radius:12px;padding:10px 14px;text-align:left}
.atalhos{margin-top:24px;padding-top:20px;border-top:1px solid var(--linha)}
.atalhos .rotulo{margin:0 0 12px}
.opcoes.g4 button{min-height:38px;border-radius:999px;padding:6px 10px;font-size:13.5px;text-align:center;background:transparent}
.resultado{position:static;display:flex;flex-direction:column}
.resultado figure{flex:1;min-height:260px;aspect-ratio:auto}
@media (max-width:860px){.opcoes.g4{grid-template-columns:repeat(2,minmax(0,1fr))}.resultado figure{flex:none;aspect-ratio:16/10;min-height:0}}
@media (max-width:420px){.opcoes.g2{grid-template-columns:1fr}}
/* texto com foto ao lado do título */
.texto2.com-foto{align-items:stretch}
.texto2-lado{display:flex;flex-direction:column}
.texto-foto{margin:28px 0 0;flex:1;min-height:240px;border-radius:var(--r-l);overflow:hidden;position:relative}
.texto-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.texto-foto{flex:none;aspect-ratio:16/10;min-height:0}}

/* escopo em faixa escura com cartões */
.escopo-faixa{background:var(--fosco);color:var(--osso);border-radius:var(--r-l);margin-inline:clamp(10px,1.6vw,20px);padding:clamp(28px,5vw,72px) max(clamp(20px,4vw,56px),calc((100% - 1216px)/2));display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(24px,5vw,72px);align-items:start}
.escopo-lado .rotulo{color:#A39B8F}.escopo-lado .rotulo b{color:var(--ambar)}
.escopo-lado h2{margin:10px 0 14px;font-size:clamp(28px,3.4vw,48px)}
.escopo-lado .lead{color:#B8AFA2;margin:0 0 14px}
.escopo-lado .nota{color:#8C8478;margin:0 0 24px}
.escopo-cartoes{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;counter-reset:e}
.escopo-cartoes.uma{grid-template-columns:1fr}
.escopo-cartoes li{position:relative;background:#211E1A;border:1px solid rgba(237,231,221,.08);border-radius:var(--r-m);padding:20px 20px 20px 52px;font-size:16.5px;line-height:1.45;color:#EDE7DD;transition:border-color .2s,transform .2s var(--ease)}
.escopo-cartoes li::before{content:"";position:absolute;left:20px;top:25px;width:14px;height:14px;border-radius:4px;background:rgba(232,149,26,.18);box-shadow:inset 0 0 0 1.5px var(--ambar)}
.escopo-cartoes li::after{content:"";position:absolute;left:24px;top:29px;width:6px;height:6px;border-radius:1px;background:var(--ambar)}
.escopo-cartoes li:hover{border-color:rgba(232,149,26,.45);transform:translateY(-2px)}
@media (max-width:860px){.escopo-faixa{grid-template-columns:1fr}.escopo-cartoes{grid-template-columns:1fr}}

/* princípios com foto */
.principio.pf{padding:0;overflow:hidden;display:grid;grid-template-rows:220px auto;background:var(--fosco);color:var(--osso);border:0}
.principio.pf img{width:100%;height:100%;object-fit:cover}
.principio.pf>div{padding:clamp(22px,3vw,32px)}
.principio.pf small{font:500 12px/1 var(--f-texto);letter-spacing:.06em;color:var(--ambar);text-transform:uppercase}
.principio.pf h3{margin:10px 0 10px;color:var(--osso)}
.principio.pf p{color:#B8AFA2}

/* abas: miniaturas à esquerda, painel sem vazio */
.abas-esq{position:sticky;top:24px}
.abas-esq .tira{grid-template-columns:repeat(3,1fr)}
.painel p{max-width:none}
@media (max-width:860px){.abas-esq{position:static}}

/* página Revel */
.rv-hero{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(24px,5vw,72px);align-items:center;padding-block:clamp(36px,6vw,80px) clamp(48px,7vw,96px)}
.rv-hero .trilha{font:500 13px/1.3 var(--f-texto);color:var(--cinza);display:flex;gap:8px;flex-wrap:wrap;margin:0 0 28px}
.rv-hero .trilha a{text-decoration:none}
.rv-hero h1{margin:12px 0 18px;font-size:clamp(44px,6.4vw,96px);font-weight:200;letter-spacing:-.035em;line-height:.95}
.rv-hero .sub{margin:0 0 28px;color:var(--cinza);font-size:18px;max-width:50ch}
.rv-hero .acoes{display:flex;gap:10px;flex-wrap:wrap}
.rv-num{display:flex;gap:clamp(20px,4vw,48px);margin:36px 0 0;padding-top:24px;border-top:1px solid var(--linha);flex-wrap:wrap}
.rv-num dt{font:300 34px/1 var(--f-display);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.rv-num dd{margin:6px 0 0;font-size:13px;color:var(--cinza)}
.rv-hero-foto{position:relative;aspect-ratio:1;display:grid;place-items:center}
.rv-disco{position:absolute;inset:4%;border-radius:50%;background:radial-gradient(circle at 50% 45%,#FFFFFF 0%,#F4F2EE 55%,#E3DFD8 100%);box-shadow:0 40px 80px -40px rgba(21,19,15,.35)}
.rv-hero-foto img{position:relative;width:78%;mix-blend-mode:multiply;animation:sobe 1s var(--ease) both}
.rv-legenda{position:absolute;bottom:6%;left:50%;transform:translateX(-50%);background:var(--fosco);color:var(--osso);border-radius:999px;padding:8px 16px;font:500 13px/1 var(--f-texto);white-space:nowrap}
.rv-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.rv-card{background:#FFFFFF;border-radius:var(--r-l);overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--linha);transition:transform .3s var(--ease),box-shadow .3s}
.rv-card:hover{transform:translateY(-4px);box-shadow:var(--sombra)}
.rv-foto{position:relative;aspect-ratio:1/.82;display:grid;place-items:center;background:#FFFFFF}
.rv-foto img{width:72%;height:86%;object-fit:contain;transition:opacity .45s var(--ease),transform .6s var(--ease)}
.rv-foto .rv-alt{position:absolute;opacity:0}
.rv-card:hover .rv-foto img:first-child{opacity:0;transform:scale(.96)}
.rv-card:hover .rv-alt{opacity:1}
.rv-tag{position:absolute;left:16px;top:16px;background:var(--papel);border-radius:999px;padding:6px 12px;font:500 12px/1 var(--f-texto)}
.rv-tag.xc{background:var(--fosco);color:var(--ambar)}
.rv-txt{padding:4px clamp(18px,2vw,26px) 24px;display:flex;flex-direction:column;flex:1;border-top:1px solid var(--linha)}
.rv-tipo{margin:18px 0 4px;font-size:13px;color:var(--cobre);font-weight:500}
.rv-txt h3{margin:0 0 8px;font:300 30px/1.05 var(--f-display);letter-spacing:-.02em}
.rv-resumo{margin:0 0 16px;color:var(--cinza);font-size:15px}
.rv-ficha{margin:auto 0 0;border-top:1px solid var(--linha)}
.rv-ficha div{display:grid;grid-template-columns:118px 1fr;gap:10px;padding:9px 0;border-bottom:1px solid var(--linha);font-size:13.5px}
.rv-ficha dt{color:var(--cinza)}.rv-ficha dd{margin:0}
.rv-forro{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(24px,5vw,72px);align-items:center;background:#F7F5F2;border-radius:var(--r-l);padding:clamp(24px,4vw,56px);box-shadow:var(--sombra)}
.rv-forro h2{margin:8px 0 12px;font-size:clamp(28px,3.4vw,48px)}
.rv-forro .lead{color:var(--cinza);margin:0 0 24px}
.rv-slider{display:flex;justify-content:space-between;align-items:baseline;font-size:14px;color:var(--cinza);margin-bottom:10px}
.rv-slider output{font:300 34px/1 var(--f-display);color:var(--tinta);font-variant-numeric:tabular-nums}
#rv-espaco{width:100%;accent-color:var(--ambar);height:28px}
.rv-barras{display:grid;gap:12px;position:relative}
.rv-barra{display:grid;grid-template-columns:76px 1fr 64px;gap:14px;align-items:center;font-size:14px}
.rv-nome{font-weight:500}
.rv-trilho{height:34px;border-radius:10px;background:var(--papel-2);position:relative;overflow:hidden}
.rv-cheio{position:absolute;left:0;top:0;bottom:0;border-radius:10px;background:#CFC6B8;transition:background .3s}
.rv-barra.cabe .rv-cheio{background:var(--ambar)}
.rv-barra .rv-cm{text-align:right;font-variant-numeric:tabular-nums;color:var(--cinza)}
.rv-barra.cabe .rv-nome::after{content:" · cabe";color:var(--cobre);font-weight:400}
.rv-barras::after{content:"";position:absolute;top:-6px;bottom:-6px;left:calc(76px + 14px + (100% - 76px - 64px - 28px) * var(--lim,0) / 100%);width:2px;background:var(--tinta);border-radius:2px}
.rv-xc{align-items:center}
.rv-xc .nome{color:var(--ambar)}
.rv-lista{margin:18px 0 0;padding:0;list-style:none;display:grid;gap:8px;color:#C9C0B3;font-size:15px}
.rv-lista li{padding-left:18px;position:relative}.rv-lista li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:1px;background:var(--ambar)}
.rv-tab-caixa{overflow-x:auto;border:1px solid var(--linha);border-radius:var(--r-m);background:#FFFFFF}
.rv-tab{border-collapse:collapse;min-width:1200px;width:100%;font-size:14px}
.rv-tab th{text-align:left;font:500 12px/1.3 var(--f-texto);color:var(--cinza);letter-spacing:.04em;padding:14px 16px;border-bottom:1px solid var(--tinta);background:#FBFAF8;white-space:nowrap}
.rv-tab td{padding:14px 16px;border-bottom:1px solid var(--linha);vertical-align:top;font-variant-numeric:tabular-nums}
.rv-tab td:first-child{font-weight:500;white-space:nowrap;position:sticky;left:0;background:#FFFFFF}
.rv-tab tr:hover td{background:#FAF7F2}
.rv-promo{display:grid;grid-template-columns:200px minmax(0,1fr) auto;gap:clamp(20px,4vw,48px);align-items:center;text-decoration:none;background:#FFFFFF;border:1px solid var(--linha);border-radius:var(--r-l);padding:clamp(16px,2.4vw,28px);transition:transform .3s var(--ease),box-shadow .3s}
.rv-promo:hover{transform:translateY(-3px);box-shadow:var(--sombra)}
.rv-promo img{width:100%;aspect-ratio:1;object-fit:contain}
.rv-promo h2{margin:8px 0 8px;font-size:clamp(24px,2.8vw,38px)}
.rv-promo p:not(.rotulo){margin:0;color:var(--cinza)}
@media (max-width:1040px){.rv-grade{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){.rv-hero,.rv-forro{grid-template-columns:1fr}.rv-hero-foto{max-width:420px;margin:0 auto;width:100%}.rv-promo{grid-template-columns:110px minmax(0,1fr)}.rv-promo .btn{grid-column:1/-1}}
@media (max-width:560px){.rv-grade{grid-template-columns:1fr}.rv-barra{grid-template-columns:64px 1fr 52px;gap:8px}.rv-barras::after{display:none}}

[hidden]{display:none!important}
body.sub{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
.bloco{padding-block:clamp(48px,7vw,96px)}
.interna>.bloco:first-child{padding-top:clamp(64px,9vw,120px)}

/* Pontilhado do topo nas páginas internas e nos artigos (aprovado pelo Raphael, 10/10).
   Mesmo ponto do .hero .pontos da home. A home não tem .hero-int, então não dobra; a
   revel-architectural usa .rv-hero e fica de fora; galerias e fotos que ampliam não são tocadas. */
.hero-int::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(10,9,8,.62) 0.9px,transparent 1.1px);background-size:3px 3px}
.art-capa{position:relative}
.art-capa::after{content:"";position:absolute;top:0;bottom:0;left:clamp(10px,1.6vw,20px);right:clamp(10px,1.6vw,20px);border-radius:var(--r-l);pointer-events:none;background-image:radial-gradient(rgba(10,9,8,.62) 0.9px,transparent 1.1px),linear-gradient(rgba(14,12,10,.10),rgba(14,12,10,.10));background-size:3px 3px,auto}
/* Celular: o .palco perdia o position (static) e as fotos ocultas do bloco "camadas", em absolute,
   subiam por cima do topo da /a-empresa e bloqueavam o título e os botões. Sai o sticky, fica relative. */
@media (max-width:860px){.camadas .palco{position:relative}}

/* /a-empresa, bloco de abertura (10/10): rótulo, título e números num bloco só; a foto de obra
   ocupa a coluna do meio e o texto fica ao lado, sem coluna vazia nem alinhamento à direita. */
.manif-foto{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.9fr);gap:clamp(24px,3.4vw,52px);align-items:stretch}
.manif-foto .mf-cab{display:flex;flex-direction:column;justify-content:space-between;gap:36px}
.manif-foto h2{text-align:left;margin-top:16px}
.manif-foto .nums{margin-top:0}
.manif-foto .mf-foto{margin:0;flex:none;min-height:0;aspect-ratio:1/1}
.manif-foto .mf-texto{display:flex;flex-direction:column;justify-content:flex-end;gap:16px}
.manif-foto .mf-texto p{margin:0;font-size:15px;line-height:1.6;color:var(--cinza);max-width:52ch}
@media (max-width:860px){
  .manif-foto{grid-template-columns:1fr;gap:28px}
  .manif-foto .mf-foto{aspect-ratio:16/10}
  .manif-foto .mf-texto{justify-content:flex-start}
}

/* /a-empresa, tríptico (10/10): o do meio vira cartão de destaque em degrau, com fundo escuro,
   sombra suave e o texto dentro; termina abaixo dos outros dois. Os de fora ficam como estavam. */
.triptico{align-items:start}
.triptico a:nth-child(2){background:var(--fosco);color:#FBFAF8;border-radius:var(--r-l);padding:clamp(12px,1.2vw,16px) clamp(12px,1.2vw,16px) clamp(20px,2vw,26px);box-shadow:0 24px 48px -18px rgba(21,19,15,.45),0 8px 18px -10px rgba(21,19,15,.25);margin-top:clamp(24px,2.8vw,40px)}
.triptico a:nth-child(2) figure{aspect-ratio:3/4}
.triptico a:nth-child(2) h3{margin:18px 6px 4px;color:#FBFAF8}
.triptico a:nth-child(2) p{margin:0 6px;color:rgba(251,250,248,.68)}
@media (max-width:860px){
  .triptico{grid-template-columns:1fr}
  .triptico a:nth-child(2){grid-row:auto;margin-top:0}
  .triptico figure,.triptico a:nth-child(2) figure{aspect-ratio:16/10}
}

/* revel-architectural, simulador "Monte o home theater no teto" (10/10). */
.ht{background:#F7F5F2;border-radius:var(--r-l);padding:clamp(18px,3.6vw,48px);box-shadow:var(--sombra);margin-top:clamp(24px,3vw,36px)}
.ht-ctrl{display:flex;flex-wrap:wrap;gap:12px clamp(20px,3vw,40px)}
.ht-ctrl .filtro{margin:0}
.ht-corpo{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(20px,3.4vw,48px);align-items:start;margin-top:clamp(20px,3vw,32px)}
.ht-planta{margin:0;background:#FFFFFF;border:1px solid var(--linha);border-radius:var(--r-m);padding:clamp(6px,1.4vw,18px)}
.ht-planta svg{display:block;width:100%;height:auto;font-family:var(--f-texto)}
.ht-planta figcaption{font-size:12.5px;color:var(--cinza);margin-top:8px;text-align:center}
.ht-resumo{margin:0 0 14px;font:300 clamp(22px,2.2vw,30px)/1.15 var(--f-display);letter-spacing:-.02em}
.ht-tab{width:100%;border-collapse:collapse;font-size:14px}
.ht-tab th{text-align:left;font:500 12px/1.3 var(--f-texto);color:var(--cinza);letter-spacing:.04em;padding:0 0 8px;border-bottom:1px solid var(--tinta)}
.ht-tab td{padding:9px 10px 9px 0;border-bottom:1px solid var(--linha);vertical-align:top}
.ht-tab td b{font-weight:600}
.ht-tab td:first-child b{display:inline-block;min-width:30px;color:var(--cobre)}
.ht-tab td small{display:block;color:var(--cinza);font-size:12.5px;margin-top:2px}
.ht-tab tr.ht-sub td{color:var(--cinza)}
.ht-total{margin:14px 0 0;font-size:14.5px;color:var(--cinza)}
.ht-total b{color:var(--tinta);font-weight:600}
.ht-pe{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px 32px;margin-top:clamp(20px,3vw,32px);padding-top:clamp(18px,2.4vw,24px);border-top:1px solid var(--linha)}
.ht-pe p{margin:0;color:var(--cinza);font-size:15px;max-width:60ch}
.rv-barra.ht-sel .rv-nome{color:var(--tinta);font-weight:600}
.ht-forro-nota{margin:10px 0 0;font-size:13.5px;color:var(--cinza)}
.ht-forro-nota:empty{display:none}
@media (max-width:860px){.ht-corpo{grid-template-columns:1fr}.ht-pe .btn{width:100%;justify-content:center}}
/* 10/10, 2ª rodada: zona 2, coluna do desenho na altura da lista, celular mais legível. */
.ht-z2{display:flex;flex-wrap:wrap;flex-basis:100%;gap:12px clamp(20px,3vw,40px);margin-top:2px;padding-top:14px;border-top:1px dashed var(--linha);align-items:center}
.ht-z2-txt{margin:0;flex-basis:100%;font-size:13.5px;color:var(--cobre)}
.ht-corpo{align-items:stretch}
.ht-planta{display:flex;flex-direction:column;justify-content:center}
.ht-tab tr.ht-grupo th{padding:16px 0 8px;text-align:left;font:600 13px/1.3 var(--f-texto);color:var(--tinta);border-bottom:1px solid var(--tinta)}
.ht-tab tr.ht-grupo th span{font-weight:400;color:var(--cinza)}
@media (max-width:560px){
  .ht-resumo span{display:block}
  .ht-resumo span+span{font-size:.72em;color:var(--cinza);margin-top:4px}
  .ht-planta{padding:6px}
}
.ht-tab td:first-child b{min-width:38px}
.ht-tab td:first-child small{padding-left:42px}

/* 10/10, 3ª rodada: no computador o simulador cabe numa tela (1366x768 e 1440x900). Celular não muda. */
@media (min-width:861px){
  .ht{padding:20px 26px 22px;margin-top:20px}
  .ht-ctrl{flex-wrap:nowrap;gap:6px 14px;align-items:center}
  .ht-ctrl .filtro{flex-wrap:nowrap;gap:4px}
  .ht-ctrl .filtro .rotulo{margin-right:4px;font-size:12px}
  .ht-ctrl .filtro button{height:32px;padding:0 11px;font-size:13px;white-space:nowrap}
  .ht-z2{flex-basis:auto;flex-wrap:nowrap;gap:14px;margin:0;padding:0 0 0 14px;border-top:0;border-left:1px dashed var(--linha)}
  .ht-z2-txt{display:none}
  .ht-corpo{margin-top:16px;gap:26px;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
  .ht-planta{padding:10px}
  .ht-planta svg{max-height:calc(100vh - 380px);margin-inline:auto}
  .ht-planta figcaption{margin-top:4px;font-size:12px}
  .ht-resumo{font-size:22px;margin-bottom:10px}
  .ht-compacto .ht-tab thead{display:none}
  .ht-compacto .ht-tab{border-top:1px solid var(--tinta)}
  .ht-compacto .ht-tab td{padding:8px 10px 8px 0;white-space:nowrap;font-size:13.5px;vertical-align:baseline}
  .ht-compacto .ht-tab td small{display:inline;margin:0 0 0 4px;padding:0;font-size:12px}
  .ht-compacto .ht-tab td:first-child b{min-width:0}
  .ht-compacto .ht-tab td:last-child{text-align:right;padding-right:0}
  .ht-compacto .ht-tab td:last-child small{display:none}
  .ht-compacto .ht-tab td[title] b{text-decoration:underline dotted rgba(21,19,15,.35);text-underline-offset:3px;cursor:help}
  .ht-compacto .ht-tab tr.ht-z2l td{border-top:1px solid var(--tinta)}
  .ht-total{margin-top:10px;font-size:13.5px}
  .ht-pe{margin-top:12px;padding-top:12px;gap:12px 20px;flex-wrap:nowrap}
  .ht-pe p{font-size:13px;line-height:1.4}
  .ht-pe .btn{flex:none;height:44px;padding:0 22px}
}

/* 10/10: o setup no forro é marcado por etiqueta, não por contorno na barra. */
.rv-barras .rv-nome{display:flex;flex-wrap:wrap;align-items:baseline}
.rv-barra.cabe .rv-nome::after{content:"\00a0· cabe";order:1}
.rv-nome .ht-tag{display:none;order:2;flex-basis:100%;margin-top:4px;line-height:1}
.rv-nome .ht-tag i{display:inline-block;font:500 10.5px/1 var(--f-texto);font-style:normal;color:var(--cobre);background:#F6E6CC;border-radius:999px;padding:3px 7px;white-space:nowrap}
.rv-barra.ht-sel .ht-tag{display:block}
@media (min-width:561px){.rv-barra{grid-template-columns:100px 1fr 64px}.rv-barras::after{left:calc(100px + 14px + (100% - 100px - 64px - 28px) * var(--lim,0) / 100%)}}
@media (max-width:560px){.rv-barra{grid-template-columns:76px 1fr 54px}.rv-nome .ht-tag i{font-size:10px;padding:3px 6px}}

/* 10/10, 4ª rodada: no computador o simulador usa a largura quase toda (até 1600px) e o desenho preenche a caixa. */
@media (min-width:861px){
  #home-theater{max-width:1600px;padding-inline:clamp(32px,3vw,48px);padding-top:88px}
  #home-theater .escopo-cab{margin-bottom:16px}
  #home-theater .escopo-cab h2{font-size:clamp(28px,2.8vw,40px)}
  .ht{margin-top:0;padding:18px 24px 20px}
  .ht-corpo{grid-template-columns:minmax(0,.85fr) minmax(0,1fr);gap:24px;margin-top:14px}
  .ht-com-z2 .ht-corpo{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr)}
  .ht-planta{padding:12px 14px 8px;justify-content:center;align-items:stretch}
  .ht-planta{display:flex;flex-direction:column;justify-content:flex-start}
  .ht-planta svg{flex:1 1 auto;width:100%;height:auto;min-height:0;max-height:calc(100vh - 420px);margin:0 auto}
  .ht-planta figcaption{margin-top:auto;padding-top:4px}
}

/* 10/10, 5ª rodada: frase e botão em faixa própria embaixo, na largura toda; a lista fica da altura do desenho. */
@media (min-width:861px){
  .ht-pe{margin-top:14px;padding-top:12px}
  .ht-pe p{max-width:none}
}

/* /a-empresa, camadas (10/10): no computador a foto ocupa a altura inteira da coluna de texto.
   Para o bloco não pular ao trocar de camada, o texto aberto tem altura FIXA e igual nas quatro
   (uma fecha enquanto a outra abre, com a mesma curva, e a soma fica constante). */
@media (min-width:861px){
  .camadas{align-items:stretch}
  .camadas .palco{aspect-ratio:auto!important;position:relative;top:auto;height:100%;min-height:360px}
  .camada span.t{max-height:none;height:0;line-height:1.55;transition:height .4s var(--ease),opacity .3s}
  .camada[aria-pressed="true"] span.t{max-height:none;height:4.65em}
}
@media (min-width:861px) and (max-width:1180px){.camada[aria-pressed="true"] span.t{height:7.75em}}

/* /a-empresa, faixa Yealink (10/10): coluna da direita completa e centrada na palavra. */
.fn-yealink{align-items:center}
.fn-yealink .rotulo b{color:var(--ambar)}
.fn-yealink h2{margin:10px 0 16px;font-size:clamp(26px,2.8vw,40px);color:var(--osso);text-wrap:balance}
.fn-yealink .btn-linha-clara{margin-top:24px;border:1px solid rgba(237,231,221,.5);color:var(--osso);background:transparent}
.fn-yealink .btn-linha-clara:hover{background:var(--osso);color:var(--fosco)}
.fn-yealink h2{hyphens:manual;-webkit-hyphens:manual}

/* Rodapé (10/10): logo maior em todas as páginas. A altura vem inline no HTML (68px),
   por isso o !important; a largura acompanha (auto) e a proporção fica. */
.rod-grade>div:first-child>img{height:96px!important;width:auto!important}
@media (max-width:860px){.rod-grade>div:first-child>img{height:80px!important}}

/* /a-empresa, showroom (10/10): vídeo vertical do showroom no lugar da foto; a foto fica embaixo, de reserva. */
.showroom .sr-midia{position:relative;background:#121110}
.showroom .sr-midia video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}

/* /residencial, "Casa grande pede infraestrutura de empresa" (10/10). */
.cg-grade{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.6vw,20px)}
.cg-card{background:#FFFFFF;border:1px solid var(--linha);border-radius:var(--r-l);overflow:hidden;display:flex;flex-direction:column}
.cg-card figure{margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--papel-2)}
.cg-card img{width:100%;height:100%;object-fit:cover}
.cg-card h3{margin:18px clamp(16px,1.6vw,22px) 8px;font:400 21px/1.2 var(--f-display);letter-spacing:-.01em;text-wrap:balance}
.cg-card p{margin:0 clamp(16px,1.6vw,22px) 22px;color:var(--cinza);font-size:15px;line-height:1.55}
.cg-pe{margin-top:clamp(20px,2.6vw,32px);display:flex;justify-content:flex-end}
@media (max-width:1040px){.cg-grade{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.cg-grade{grid-template-columns:1fr}.cg-pe .btn{width:100%;justify-content:center}}
.casa-grande h2{hyphens:manual;-webkit-hyphens:manual}

/* /residencial, "Casa grande" (10/10, 2ª rodada): botão ao lado do parágrafo, sem botão sozinho embaixo. */
.cg-cab h2{margin:8px 0 0;font-size:clamp(28px,3.4vw,48px)}
.cg-intro{display:flex;justify-content:space-between;align-items:center;gap:20px 40px;margin:20px 0 clamp(24px,3vw,36px)}
.cg-intro .lead{margin:0;max-width:62ch;color:var(--cinza);font-size:16px}
.cg-intro .btn{flex:none}
@media (max-width:860px){.cg-intro{flex-direction:column;align-items:stretch}.cg-intro .btn{justify-content:center}}


/* ---------- v20 (11/10/2026) ---------- */

/* CARTÃO ÚNICO do site: fundo um tom acima do papel, borda fina, sombra suave, foto arredondada dentro,
   texto dentro; no hover sobe, a sombra cresce e a foto aproxima 1.03. Vale para todos os grupos de cartões. */
:root{--cartao:#F7F5F2;--sombra-c:0 1px 2px rgba(21,19,15,.06),0 10px 26px -14px rgba(21,19,15,.24);--sombra-c2:0 2px 6px rgba(21,19,15,.08),0 24px 46px -18px rgba(21,19,15,.34)}
.amb,.art,.triptico a,.cg-card,.video-card,.indice li a{background:var(--cartao);border:1px solid var(--linha);border-radius:20px;box-shadow:var(--sombra-c);padding:10px 10px 18px;color:var(--tinta);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.amb:hover,.art:hover,.triptico a:hover,.cg-card:hover,.video-card:hover,.indice li a:hover{transform:translateY(-5px);box-shadow:var(--sombra-c2)}
.amb figure,.art figure,.triptico figure,.cg-card figure,.video-card .quadro,.indice figure{border-radius:12px}
.cg-card img,.video-card .quadro img,.indice img{transition:transform .6s var(--ease)}
.cg-card:hover img,.video-card:hover .quadro img,.indice li a:hover img{transform:scale(1.03)}
.amb h3,.amb p,.triptico h3,.triptico p,.video-card h3,.video-card p{padding-inline:6px}
.art figure{margin:0 0 14px}
.art>div{padding-inline:6px}
.triptico a{display:block}
.cg-card{padding-bottom:14px}
.cg-card figure{position:relative}
.cg-card h3{margin:16px 8px 6px}
.cg-card p{margin:0 8px 6px}
.cg-leg{position:absolute;left:10px;bottom:10px;font:500 12px/1.3 var(--f-texto);background:rgba(14,12,10,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#FBFAF8;border-radius:8px;padding:6px 9px}
.indice li+li{margin-top:12px}
.indice li a{padding:12px 20px 12px 12px;border-bottom:1px solid var(--linha)}
.rv-card{background:var(--cartao);border-radius:20px;box-shadow:var(--sombra-c);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.rv-card:hover{transform:translateY(-5px);box-shadow:var(--sombra-c2)}
.rv-foto{margin:10px 10px 0;border-radius:12px}

/* home: cartões de soluções, o do meio escuro e em degrau */
.ambientes .amb:nth-child(2){background:var(--fosco);border-color:transparent;color:var(--osso);margin-top:28px;box-shadow:0 2px 6px rgba(14,12,10,.18),0 28px 56px -20px rgba(14,12,10,.6)}
.ambientes .amb:nth-child(2):hover{box-shadow:0 4px 10px rgba(14,12,10,.2),0 36px 70px -22px rgba(14,12,10,.7)}
.ambientes .amb:nth-child(2) figure{margin-top:0}
.ambientes .amb:nth-child(2) h3{color:#FBFAF8}
.ambientes .amb:nth-child(2) p{color:rgba(237,231,221,.72)}

/* home: manifesto com foto e cartão dos números */
.manifesto.mf2{align-items:stretch}
.mf2-foto{position:relative;margin:0;border-radius:var(--r-l);overflow:hidden;min-height:440px;background:var(--papel-2)}
.mf2-foto>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mf2-cartao{position:absolute;left:14px;right:14px;bottom:14px;background:#FBFAF8;color:var(--tinta);border-radius:12px;padding:16px 18px;display:grid;grid-template-columns:1fr 1fr;gap:16px;box-shadow:0 14px 34px -14px rgba(0,0,0,.5)}
.mf2-cartao b{font:400 30px/1 var(--f-display);letter-spacing:-.02em;display:block;font-variant-numeric:tabular-nums}
.mf2-cartao span{font-size:12.5px;line-height:1.35;color:var(--cinza);display:block;margin-top:6px}
.mf2-texto{display:flex;flex-direction:column}
.mf2-texto .rotulo{text-align:right;margin:0 0 18px}
.mf2-texto .pe{margin-top:auto;padding-top:32px}

/* home: miniaturas do topo que se abrem dentro do próprio topo */
.hero-lado button.mini{padding:0;background:none;display:block;width:100%;cursor:zoom-in;color:inherit;font:inherit;transition:transform .25s var(--ease),border-color .2s}
.hero-lado button.mini:hover{transform:translateY(-3px);border-color:rgba(251,250,248,.7)}
.hero-lado button.mini:focus-visible{outline:2px solid var(--ambar);outline-offset:3px}
.hero-previa{position:absolute;z-index:5;margin:0;border-radius:18px;overflow:hidden;background:#0E0D0B;border:1px solid rgba(251,250,248,.35);box-shadow:0 30px 70px -20px rgba(0,0,0,.75);transition:left .45s var(--ease),top .45s var(--ease),width .45s var(--ease),height .45s var(--ease),border-radius .45s var(--ease)}
.hero-previa img{width:100%;height:100%;object-fit:cover;display:block}
.hero-previa .x{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;border:0;background:rgba(14,12,10,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);color:#FBFAF8;font:300 22px/1 var(--f-texto);cursor:pointer;display:grid;place-items:center;padding:0}
.hero-previa .x:focus-visible{outline:2px solid var(--ambar);outline-offset:2px}

/* galerias com vídeo (Mostra Magna) */
.galeria .vid{position:relative;margin:0;border-radius:var(--r-m);overflow:hidden;background:#0E0D0B}
.galeria .vid video{width:100%;height:100%;object-fit:cover;display:block}
.galeria .vid .leg{position:absolute;left:10px;bottom:10px;font:500 13px/1.3 var(--f-texto);background:rgba(14,12,10,.6);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:8px;padding:7px 10px;color:#FBFAF8}
.galeria.gv2{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);grid-auto-rows:clamp(340px,42vw,600px)}
.galeria.gv4{grid-template-columns:minmax(0,.9fr) minmax(0,1fr) minmax(0,1fr);grid-auto-rows:clamp(200px,22vw,320px)}
.galeria.gv4 .vid{grid-row:span 2}
.galeria.gv4 .foto:last-child{grid-column:span 2}
.mg-lado{display:flex;align-items:center;gap:22px;max-width:60ch}
.mg-lado p{margin:0;color:var(--cinza);font-size:15px}
.mg-logo{height:40px;width:auto;flex:none;filter:brightness(0);opacity:.78}
.galeria.gv4 .foto:last-child img{object-position:50% 35%}

@media (max-width:860px){
  .ambientes .amb:nth-child(2){margin-top:0}
  .mf2-foto{order:2;min-height:0;aspect-ratio:4/5}
  .mf2-texto .rotulo{text-align:left}
  .mf2-texto .pe{margin-top:32px;padding-top:0}
  .galeria.gv2{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(260px,70vw,420px)}
  .galeria.gv4{grid-template-columns:1fr 1fr;grid-auto-rows:clamp(150px,40vw,260px)}
  .galeria.gv4 .foto:last-child{grid-column:1/-1}
  .mg-lado{flex-direction:column;align-items:flex-start;gap:12px}
}
@media (prefers-reduced-motion:reduce){
  .amb,.art,.triptico a,.cg-card,.video-card,.indice li a,.rv-card,.hero-previa,.hero-lado button.mini{transition:none}
  .amb:hover,.art:hover,.triptico a:hover,.cg-card:hover,.video-card:hover,.indice li a:hover,.rv-card:hover,.hero-lado button.mini:hover{transform:none}
}

/* v21: "Também projetamos" vira faixa de 5 mini-cartões no estilo único de cartão */
.outras2{margin-top:clamp(56px,6.4vw,88px)}
.outras2 .rotulo{margin:0 0 14px}
.mini-linhas{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(10px,1.4vw,16px)}
.ml{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--tinta);background:var(--cartao);border:1px solid var(--linha);border-radius:16px;box-shadow:var(--sombra-c);padding:8px 14px 8px 8px;transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.ml figure{margin:0;width:64px;aspect-ratio:1;border-radius:10px;overflow:hidden;flex:none;background:var(--papel-2)}
.ml img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.ml span{flex:1;min-width:0;font:500 14px/1.3 var(--f-texto)}
.ml b{font-weight:400;color:var(--cobre);transition:transform .3s var(--ease)}
.ml:hover{transform:translateY(-5px);box-shadow:var(--sombra-c2)}
.ml:hover img{transform:scale(1.03)}
.ml:hover b{transform:translateX(3px)}
@media (max-width:1100px){.mini-linhas{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:860px){.mini-linhas{grid-template-columns:repeat(2,minmax(0,1fr))}.mini-linhas .ml:last-child{grid-column:1/-1}.ml{gap:8px;padding:7px 9px 7px 7px}.ml figure{width:44px}.ml span{font-size:13px}}
@media (prefers-reduced-motion:reduce){.ml,.ml img,.ml b{transition:none}.ml:hover,.ml:hover b{transform:none}}

/* v21: /a-empresa, abertura com a coluna da direita do topo à base da foto */
@media (min-width:861px){
  .manif-foto .mf-foto{aspect-ratio:auto;min-height:440px;align-self:stretch}
  .manif-foto .mf-foto img{width:100%;height:100%;object-fit:cover}
}
.manif-foto .mf-texto2{justify-content:space-between;gap:22px}
.manif-foto .mf-texto2 p.rotulo{font:500 13px/1.3 var(--f-texto);letter-spacing:.04em;margin:0}
.manif-foto .mf-texto2 p.mf-frase{margin:10px 0 0;font:300 clamp(24px,2.3vw,32px)/1.16 var(--f-display);letter-spacing:-.015em;color:var(--tinta);max-width:20ch;text-wrap:balance}
.mf-corpo{display:grid;gap:14px}
.manif-foto .mf-texto2 .btn{align-self:flex-start}

/* v21: SOMBRA PADRÃO de foto e vídeo grandes soltos sobre o papel (relevo). Contorno claro finíssimo + camadas, mais forte embaixo.
   Fica fora: topos (hero), faixas escuras (.toque, .faixa-nome, .resultado) e os cartões (já têm o estilo de cartão). */
:root{--sombra-foto:0 0 0 1px rgba(255,255,255,.55),0 2px 4px rgba(0,0,0,.06),0 12px 24px rgba(0,0,0,.10),0 32px 60px -12px rgba(0,0,0,.22)}
.camadas .palco,.manif-foto .mf-foto,.showroom figure,.texto-foto,.mf2-foto,.galeria .foto,.galeria .vid,.destaque figure,.obra-foto,.painel figure,.art-capa img{box-shadow:var(--sombra-foto)}
.toque .palco{box-shadow:none}
/* v21: pontilhado de 3 px do vídeo da home também sobre o vídeo do showroom (cantos seguem o figure, não bloqueia clique) */
.showroom .sr-midia::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background-image:radial-gradient(rgba(10,9,8,.62) 0.9px,transparent 1.1px);background-size:3px 3px;border-radius:inherit}
/* v21: painel do guia da /solucoes com a sombra padrão de foto grande */
.resultado{box-shadow:var(--sombra-foto)}

/* v21: /projetos, "A obra em movimento" como linha do tempo (3 cartões numerados ligados por um trilho âmbar) */
.bast2-cab{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 40px;flex-wrap:wrap;margin-bottom:clamp(28px,3.4vw,44px)}
.bast2-cab h2{margin:8px 0 0;font-size:clamp(28px,3.4vw,48px)}
.bast2-cab>p{margin:28px 0 0;color:var(--cinza);max-width:44ch;font-size:15px}
.trilho-obra{--g:clamp(36px,4.6vw,72px);position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g)}
.trilho-obra::before{content:"";position:absolute;left:4%;right:4%;top:46%;height:1.5px;background:linear-gradient(90deg,transparent,var(--ambar) 8%,var(--ambar) 92%,transparent);z-index:0}
.to-item{position:relative;z-index:1}
.to-item:not(:last-child)::after{content:"→";position:absolute;top:46%;right:calc(var(--g) / -2);transform:translate(50%,-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--papel);border:1.5px solid var(--ambar);color:var(--cobre);font:500 16px/1 var(--f-texto)}
.to-num{display:inline-flex;align-items:center;gap:8px;margin:0 0 10px 4px;font:500 13px/1 var(--f-texto);letter-spacing:.08em;color:var(--cobre);font-variant-numeric:tabular-nums}
.to-num i{width:8px;height:8px;border-radius:50%;background:var(--ambar);animation:to-pulsa 2.4s ease-out infinite}
@keyframes to-pulsa{0%{box-shadow:0 0 0 0 rgba(232,149,26,.55)}70%{box-shadow:0 0 0 9px rgba(232,149,26,0)}100%{box-shadow:0 0 0 0 rgba(232,149,26,0)}}
.to-card .quadro{aspect-ratio:4/5;position:relative}
.to-card video{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s var(--ease)}
.to-card:hover video{transform:scale(1.03)}
.to-card .tag{z-index:2}
.to-abre{position:absolute;inset:0;z-index:3;border:0;padding:0;margin:0;background:transparent;cursor:zoom-in}
.to-abre:focus-visible{outline:2px solid var(--ambar);outline-offset:-4px;border-radius:12px}
.caixa-foto video{max-width:min(1200px,100%);max-height:78vh;border-radius:12px;background:#000}
@media (max-width:860px){
  .trilho-obra{grid-template-columns:1fr;gap:34px;padding-left:28px}
  .trilho-obra::before{left:8px;right:auto;top:6px;bottom:6px;width:1.5px;height:auto;background:linear-gradient(180deg,transparent,var(--ambar) 4%,var(--ambar) 96%,transparent)}
  .to-item:not(:last-child)::after{content:"↓";top:auto;bottom:-17px;right:auto;left:-20px;transform:translate(-50%,50%);width:28px;height:28px;font-size:14px}
  .to-num{margin-left:0}
  .to-card .quadro{aspect-ratio:4/5}
}
@media (prefers-reduced-motion:reduce){.to-num i{animation:none}.to-card video{transition:none}.to-card:hover video{transform:none}}

/* v23: /conteudo com páginas reais; o filtro virou links (cada ambiente tem a própria lista) */
.filtro a{height:38px;padding:0 16px;border-radius:999px;border:1px solid var(--linha);background:transparent;font:500 14px/1 var(--f-texto);color:var(--tinta);display:inline-flex;gap:8px;align-items:center;text-decoration:none;transition:border-color .2s,background .2s}
.filtro a small{color:var(--cinza);font-variant-numeric:tabular-nums}
.filtro a:hover{border-color:rgba(21,19,15,.35)}
.filtro a[aria-current="page"]{background:var(--tinta);color:var(--papel);border-color:var(--tinta)}
.filtro a[aria-current="page"] small{color:var(--areia)}
.lista-grupo{margin:0;font-size:14px}
.paginacao{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:10px;margin:clamp(40px,5vw,64px) 0 clamp(24px,4vw,48px)}
.paginacao a,.paginacao span.pg-lado{height:42px;min-width:42px;padding:0 16px;border-radius:999px;border:1px solid var(--linha);display:inline-flex;align-items:center;justify-content:center;font:500 14px/1 var(--f-texto);color:var(--tinta);text-decoration:none;font-variant-numeric:tabular-nums;transition:border-color .2s,background .2s}
.paginacao a:hover{border-color:rgba(21,19,15,.4);background:rgba(255,255,255,.4)}
.paginacao .pg-nums{display:inline-flex;gap:8px}
.paginacao a[aria-current="page"]{background:var(--ambar);border-color:var(--ambar);color:#1A1712}
.paginacao span.pg-lado{opacity:.4}
@media (max-width:560px){.paginacao .pg-lado{padding:0 12px;font-size:13px}}

/* v23: "Também projetamos" mais leve: fundo transparente e só a borda; no hover ganha tom, sombra, seta e zoom */
.mini-linhas .ml{background:transparent;box-shadow:none;border-color:var(--linha);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease),border-color .35s var(--ease)}
.mini-linhas .ml:hover{background:rgba(255,255,255,.4);border-color:rgba(21,19,15,.28);box-shadow:var(--sombra-c);transform:translateY(-3px)}
.mini-linhas .ml:hover b{transform:translateX(4px)}
.mini-linhas .ml:hover img{transform:scale(1.03)}
@media (prefers-reduced-motion:reduce){.mini-linhas .ml:hover{transform:none}.mini-linhas .ml:hover b{transform:none}}

/* v23: guia da /solucoes — o painel tem a altura da coluna de perguntas e não pula ao trocar de linha;
   a foto tem altura fixa (50% do painel), cortada por object-fit, com enquadramento por foto ("pos" no JSON) */
@media (min-width:861px){
  .guia{align-items:stretch}
  .guia>.resultado{align-self:stretch;height:auto;min-height:0}
  .resultado figure{flex:0 0 50%;min-height:0;position:relative;overflow:hidden}
  .resultado figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .resultado .txt{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;padding-top:clamp(16px,1.8vw,24px);padding-bottom:clamp(18px,2vw,26px)}
  .resultado .txt p:not(.rotulo){margin-bottom:14px}
  .resultado .acoes{margin-top:auto}
}

/* v24: pontilhado bem fraco (38% do ponto do topo da home) só no vídeo "A caixa que acende na parede" */
.galeria .vid-pontos::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;border-radius:inherit;background-image:radial-gradient(rgba(10,9,8,.24) 0.9px,transparent 1.1px);background-size:3px 3px}
.galeria .vid-pontos .leg{z-index:2}

/* v25: estados de botão sempre legíveis. A cor de hover de link (ex.: .rodape a:hover) não pode vencer a cor do botão:
   o âmbar escurece um pouco no hover e mantém o texto escuro; foco por teclado com anel âmbar visível em fundo claro e escuro. */
.rodape a.btn,.rodape a.btn-loja{opacity:1}
a.btn.btn-ambar,a.btn.btn-ambar:hover,a.btn.btn-ambar:focus-visible,a.btn.btn-ambar:active,button.btn.btn-ambar:hover,button.btn.btn-ambar:active{color:#1A1004}
.btn.btn-ambar:hover{background:#D4850F}
.btn.btn-ambar:active{background:#C27A0E}
.btn:focus-visible,.btn-loja:focus-visible,.chip:focus-visible,.ml:focus-visible,.filtro a:focus-visible,.paginacao a:focus-visible,.opcoes button:focus-visible{outline:2px solid var(--ambar);outline-offset:3px}
.btn:active{transform:translateY(0)}

/* v27: formulários reais — campo-armadilha fora da tela, erro legível com WhatsApp, botão "Enviando…" */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.erro{background:#F6E7E4;color:#6E2A1B;border-radius:var(--r-s);padding:12px 14px;font-size:14.5px;line-height:1.45}
.erro a{color:inherit;font-weight:600;text-decoration:underline;text-underline-offset:2px;white-space:nowrap}
.portao .erro{background:rgba(205,95,70,.16);color:#F2C7BB}
form[data-pedido] button[disabled]{opacity:.72;cursor:progress;transform:none}

/* v27: cartões de soluções da home no estilo da faixa "Também projetamos" (transparentes, só borda) */
.ambientes .amb{background:transparent;box-shadow:none;border-color:var(--linha);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease),border-color .35s var(--ease)}
.ambientes .amb:hover{background:rgba(255,255,255,.4);border-color:rgba(21,19,15,.28);box-shadow:var(--sombra-c)}
.ambientes .amb:nth-child(2){background:rgba(21,19,15,.07);border-color:rgba(21,19,15,.22);color:var(--tinta);box-shadow:0 1px 2px rgba(21,19,15,.05),0 14px 30px -18px rgba(21,19,15,.32)}
.ambientes .amb:nth-child(2) h3{color:var(--tinta)}
.ambientes .amb:nth-child(2) p{color:var(--cinza)}
.ambientes .amb:nth-child(2):hover{background:rgba(21,19,15,.09);border-color:rgba(21,19,15,.34);box-shadow:var(--sombra-c2)}

/* v27: faixa de logos da home branca de ponta a ponta, laterais esmaecidas, logos com o mesmo peso */
.marcas-sec{background:#fff;border-block:1px solid var(--linha);padding-block:clamp(24px,3.2vw,40px);margin-bottom:clamp(72px,10vw,128px)}
.marcas-sec .marcas{border:0;padding-block:8px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
.marcas-sec .faixa img{max-width:none;filter:invert(1) brightness(.45);opacity:.62;transition:opacity .25s,filter .25s}
.marcas-sec .faixa img:hover{filter:invert(1) brightness(.06);opacity:1}
.marcas-sec .marcas-pe{margin-top:clamp(16px,2.2vw,24px)}


/* ---------- v30 (13/10/2026): cartão de vídeo dentro das galerias de foto ---------- */
.galeria .vid.to-card .tag{position:absolute;left:10px;top:10px;z-index:2;background:rgba(14,13,11,.7);color:var(--osso);border-radius:999px;padding:6px 12px;font:500 12px/1 var(--f-texto);display:flex;gap:7px;align-items:center}
.galeria .vid.to-card .leg{z-index:2}
.galeria .vid.to-card{cursor:zoom-in}

/* v32: correções técnicas da revisão de 15/10 — a aparência não muda */
h1,h2,h3,.caps{-webkit-hyphens:manual!important;hyphens:manual!important}
.nw{white-space:nowrap}
a.ct-link,a.ct-link:hover,a.ct-link:focus,a.ct-link:visited,a.ct-link:active{color:inherit!important;text-decoration:inherit!important;font:inherit!important;letter-spacing:inherit!important;text-transform:inherit!important;background:none!important;border:0!important;padding:0!important;margin:0!important;box-shadow:none!important;transform:none!important;opacity:1!important}
.so-toque{display:none}
@media (hover:none){.so-mouse{display:none}.so-toque{display:inline}}
.rv-card.ver-grade .rv-foto img:first-child{opacity:0;transform:scale(.96)}
.rv-card.ver-grade .rv-alt{opacity:1}

/* ===== v33 (16/10/2026): arrumação aprovada pelo Raphael (AJ-03, 07, 14, 15, 16, 17, 19) ===== */

/* AJ-03: "Bastidores" com 1 ou 2 vídeos. Mesmo cabeçalho e mesmos cartões da /projetos; o cabeçalho
   ocupa as colunas que os cartões deixam livres, então o cartão tem a largura exata do da /projetos e não sobra faixa vazia. */
.bast2-poucos{--g:clamp(36px,4.6vw,72px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--g);align-items:start}
.bast2-poucos .bast2-cab{flex-direction:column;flex-wrap:nowrap;justify-content:flex-start;gap:0;margin:0}
.bast2-poucos .bast2-cab>p{margin:20px 0 0}
.bast2-poucos.n1 .bast2-cab{grid-column:span 2}
.bast2-poucos.n1 .trilho-obra{grid-template-columns:1fr}
.bast2-poucos.n1 .trilho-obra::before{display:none}
.bast2-poucos.n2 .trilho-obra{grid-column:span 2;grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:860px){
  .bast2-poucos{display:block}
  .bast2-poucos .bast2-cab{margin-bottom:28px}
  .bast2-poucos.n1 .trilho-obra{padding-left:0}
  .bast2-poucos.n2 .trilho-obra{grid-template-columns:1fr}
}

/* AJ-07: "O que já executamos" com 1 ou 2 itens: título numa linha só no alto; embaixo, texto e botão
   à esquerda e os cartões empilhados à direita. Sem o vão que sobrava sob os cartões. */
.escopo-faixa.poucos{row-gap:0;align-items:start}
.escopo-faixa.poucos .escopo-lado{display:contents}
.escopo-faixa.poucos .rotulo,.escopo-faixa.poucos h2{grid-column:1/-1}
.escopo-faixa.poucos h2{margin:10px 0 28px}
.escopo-faixa.poucos .nota{grid-column:1;grid-row:3}
.escopo-faixa.poucos .btn{grid-column:1;grid-row:4;justify-self:start}
.escopo-faixa.poucos .escopo-cartoes{grid-column:2;grid-row:3/5;grid-template-columns:1fr}
@media (max-width:860px){
  .escopo-faixa.poucos .nota,.escopo-faixa.poucos .btn,.escopo-faixa.poucos .escopo-cartoes{grid-column:1;grid-row:auto}
  .escopo-faixa.poucos h2{margin:10px 0 14px}
  .escopo-faixa.poucos .escopo-cartoes{margin-top:24px}
}

/* AJ-14: galeria no celular. A 1ª foto já ocupa a linha inteira; se sobrar uma sozinha no fim, ela ocupa a linha também. */
@media (max-width:860px){
  .galeria:is(.g3,.g4,.g5,.g6,.g7,.g8)>:last-child:nth-child(even){grid-column:1/-1}
}

/* AJ-15: lista de 3 itens no computador em 3 colunas, sem o vão da 2ª coluna. */
@media (min-width:861px){
  .escopo:has(>li:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
}

/* AJ-16: categoria e tempo de leitura dos cartões sem quebrar no meio; o tempo desce inteiro se não couber. */
.art .meta{flex-wrap:wrap;row-gap:2px}
.art .meta>*{white-space:nowrap}

/* AJ-17: trilha do topo legível sobre foto clara no celular. */
@media (max-width:860px){
  .hero-int .trilha{opacity:1;text-shadow:0 1px 2px rgba(10,9,8,.6),0 0 14px rgba(10,9,8,.45)}
}

/* AJ-19: grade de logos com o número de colunas certo para a quantidade (sem logo sozinho na 2ª linha
   nem coluna vazia no fim) e logos quadrados ou estreitos um pouco maiores. */
@media (min-width:1100px){
  .logos-linha.lgc-5{grid-template-columns:repeat(5,minmax(0,1fr))}
  .logos-linha.lgc-6{grid-template-columns:repeat(6,minmax(0,1fr))}
  .logos-linha.lgc-7{grid-template-columns:repeat(7,minmax(0,1fr))}
  .logos-linha.lgc-8{grid-template-columns:repeat(8,minmax(0,1fr))}
  .logos-linha.lgc-9{grid-template-columns:repeat(9,minmax(0,1fr))}
}
.logos-linha img[src*="jbl"],.logos-linha img[src*="ubiquiti"]{max-height:46px}
.logos-linha img[src*="mersive"]{max-height:38px}
.logos-linha .lg:has(img[src*="clockaudio"]){padding-inline:10px}
.logos-linha img[src*="clockaudio"]{max-height:36px;opacity:1}

/* Furo da /revel sem quebrar o "Ø 20,3 cm" em várias linhas (os dados novos estreitaram a coluna). */
.rv-tab td:nth-child(6){white-space:nowrap}
