/* ============================================================
   ECHAD RH — site
   Dinamica herdada do site da One Conecta RH (mesmo app.js): smooth
   scroll, header pilula com progresso, titulos por palavra, hero que
   vira cartao ao rolar, luz que segue o cursor, manifesto que acende,
   carrossel, linha do processo, CTA que encolhe e desenha a marca.
   Identidade: Echad. Marinho estrutura, ouro so no destaque, Sora.
   Nenhuma cor literal fora do :root.
   ============================================================ */
:root{
  --ink:#0A1C2E; --marinho:#0F2A45; --marinho-2:#173C61;
  --ouro:#CAA228; --ouro-p:#806410; --ouro-grad:linear-gradient(135deg, #CAA228 0%, #D9B84A 55%, #E6CB6E 100%);
  --papel:#F7F8FA; --secao:#F1F3F6; --card:#FCFDFE; --nevoa:#DDE3EA; --azul:#9DB4CC;
  --txt:#0A1C2E; --txt-2:#2E4560; --txt-3:#5B6B7C;
  --inv-2:#C6D0DB; --inv-3:#98A6B6;
  --linha:rgba(10,28,46,.12); --linha-inv:rgba(247,248,250,.16);
  --fonte:"Sora", system-ui, -apple-system, "Segoe UI", sans-serif;
  --container:1240px; --gutter:clamp(20px,4vw,48px);
  --sec:clamp(88px,10vw,150px);
  --ease:cubic-bezier(.22,1,.36,1); --ease-soft:cubic-bezier(.45,0,.15,1);
  --r-sm:12px; --r-md:20px; --r-lg:28px;

  --barra:0px;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ -webkit-text-size-adjust:100%; }
body{ font-family:var(--fonte); font-size:1.0625rem; line-height:1.65; color:var(--txt); background:var(--papel);
  -webkit-font-smoothing:antialiased; overflow-x:hidden; }
img,svg{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
ul,ol{ list-style:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
::selection{ background:var(--ouro); color:var(--ink); }
:focus-visible{ outline:2px solid var(--ouro); outline-offset:3px; border-radius:6px; }
.skip-link{ position:fixed; left:12px; top:12px; z-index:999; background:var(--ouro); color:var(--ink); padding:10px 16px; border-radius:999px; font-weight:600; transform:translateY(-200%); }
.skip-link:focus{ transform:none; }
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }

/* ---------- smooth-scroll shell (app.js liga no mac, fora do toque) ---------- */
html.has-smooth #smooth{ position:fixed; inset:0 0 auto 0; will-change:transform; }

/* ---------- tipografia ---------- */
h1,h2,h3{ font-weight:600; letter-spacing:-.03em; text-wrap:balance; }
h1{ font-size:clamp(2.7rem,6.4vw,5.6rem); line-height:1.04; letter-spacing:-.042em; }
h2{ font-size:clamp(2.1rem,4.6vw,3.9rem); line-height:1.1; }
h3{ font-size:clamp(1.2rem,1.7vw,1.45rem); line-height:1.25; letter-spacing:-.018em; }
.em{ color:var(--marinho); position:relative; }
.lead{ font-size:clamp(1.08rem,1.35vw,1.3rem); line-height:1.6; font-weight:300; color:var(--txt-2); max-width:44ch; }
.section{ padding-block:var(--sec); position:relative; }
.section--segue{ padding-top:0; }
.section-head{ display:grid; grid-template-columns:1.2fr .8fr; gap:clamp(24px,5vw,90px); align-items:end; margin-bottom:clamp(40px,5vw,72px); }
@media (max-width:860px){ .section-head{ grid-template-columns:1fr; } }

/* ---------- icones (sprite de fontes/icones.py) ---------- */
.ico{ width:30px; height:30px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }

/* ---------- botoes ---------- */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:52px; padding:0 26px;
  border-radius:999px; font-weight:600; font-size:.98rem; letter-spacing:-.005em; white-space:nowrap;
  transition:transform .45s var(--ease), background-color .3s ease, color .3s ease, box-shadow .45s var(--ease), border-color .3s ease; }
.btn svg{ transition:transform .35s var(--ease); }
.btn:hover svg{ transform:translateX(3px); }
.btn--primary{ background:var(--marinho); color:var(--papel); box-shadow:0 12px 28px -16px rgba(10,28,46,.7); }
.btn--primary:hover{ background:var(--ink); }
.btn--ouro{ background:var(--ouro-grad); color:var(--ink); box-shadow:0 14px 34px -16px rgba(128,100,16,.75); }
.btn--ouro:hover{ box-shadow:0 20px 44px -18px rgba(128,100,16,.85); }
.btn--vidro{ color:var(--papel); border:1px solid var(--linha-inv); background:rgba(247,248,250,.06); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); }
.btn--vidro:hover{ background:rgba(247,248,250,.14); }
.btn--linha{ color:var(--marinho); border:1px solid color-mix(in srgb, var(--marinho) 30%, transparent); }
.btn--linha:hover{ background:var(--marinho); color:var(--papel); }

/* ---------- preloader: o monograma se desenha, preenche, o nome entra ---------- */
.loader{ position:fixed; inset:0; z-index:200; background:var(--ink); display:grid; place-items:center;
  transition:clip-path .7s var(--ease-soft), visibility 0s .7s; clip-path:inset(0 0 0 0); }
.loader__palco{ display:grid; justify-items:center; gap:22px; }
.loader__traco{ width:min(300px,56vw); height:auto; overflow:visible;
  fill:transparent; stroke:var(--papel); stroke-width:6; stroke-dasharray:1; stroke-dashoffset:1;
  animation:desenha .9s var(--ease-soft) .1s forwards; }
.loader.fill .loader__traco{ transition:fill .45s ease .8s, stroke .45s ease .8s; fill:var(--papel); stroke:transparent; }
.loader__nome{ font-size:clamp(.9rem,1.4vw,1.05rem); font-weight:600; letter-spacing:.42em; text-transform:uppercase; color:var(--inv-2);
  clip-path:inset(0 100% 0 0); transition:clip-path .7s var(--ease) 1.05s; margin-right:-.42em; }
.loader.fill .loader__nome{ clip-path:inset(0 0 0 0); }
.loader.done{ clip-path:inset(0 0 100% 0); visibility:hidden; }
@keyframes desenha{ to{ stroke-dashoffset:0; } }

/* ---------- cursor ---------- */
.cursor{ position:fixed; left:0; top:0; z-index:300; width:10px; height:10px; border-radius:50%; background:var(--ouro);
  pointer-events:none; opacity:0; transition:width .3s var(--ease), height .3s var(--ease), opacity .3s ease, background-color .3s ease; mix-blend-mode:normal; }
.cursor.on{ opacity:1; }
.cursor.grow{ width:44px; height:44px; background:color-mix(in srgb, var(--ouro) 28%, transparent); }
@media (hover:none),(pointer:coarse){ .cursor{ display:none; } }

/* ---------- header: pilula que clareia, some ao descer, volta ao subir ---------- */
.header{ position:fixed; z-index:100; top:14px; left:0; right:var(--barra); padding-inline:clamp(12px,2vw,24px);
  transition:transform .55s var(--ease); }
.header.hide{ transform:translateY(-140%); }
.header__inner{ max-width:calc(var(--container) + 32px); margin-inline:auto; display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:12px 12px 12px 26px; border-radius:999px; background:transparent; border:1px solid transparent;
  transition:background-color .4s ease, border-color .4s ease, box-shadow .4s ease, -webkit-backdrop-filter .4s ease, backdrop-filter .4s ease; }
.header.scrolled .header__inner{ background:rgba(247,248,250,.82); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px);
  border-color:var(--linha); box-shadow:0 14px 34px -24px rgba(10,28,46,.45); }
.header__prog{ position:absolute; left:calc(clamp(12px,2vw,24px) + 30px); right:calc(clamp(12px,2vw,24px) + 30px); bottom:0; height:2px; border-radius:2px;
  background:var(--ouro); transform-origin:left; transform:scaleX(var(--p,0)); opacity:0; transition:opacity .3s ease; pointer-events:none; }
.header.scrolled .header__prog{ opacity:1; }
.header__logo svg{ width:clamp(150px,14vw,184px); height:auto; color:var(--ink); --eh-caixa:var(--marinho); --eh-mono:var(--papel); transition:color .3s ease; }
.header.sobre-escuro .header__logo svg{ color:var(--papel); --eh-caixa:var(--papel); --eh-mono:var(--marinho); }
.header__nav{ display:flex; gap:clamp(18px,2.4vw,36px); font-size:.95rem; font-weight:500; }
.header__nav a{ position:relative; padding-block:6px; color:var(--txt-2); transition:color .25s ease; }
.header__nav a::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:2px; background:var(--ouro); transform:scaleX(0); transform-origin:right; transition:transform .45s var(--ease); }
.header__nav a:hover{ color:var(--ink); }
.header__nav a:hover::after{ transform:scaleX(1); transform-origin:left; }
.header.sobre-escuro .header__nav a{ color:var(--inv-2); }
.header.sobre-escuro .header__nav a:hover{ color:var(--papel); }
.header__actions{ display:flex; align-items:center; gap:10px; }
.header__cta{ min-height:46px; padding:0 22px; font-size:.92rem; }
.header.sobre-escuro .header__cta{ background:var(--ouro-grad); color:var(--ink); }
.burger{ display:none; width:46px; height:46px; border-radius:50%; position:relative; background:var(--marinho); }
.burger span{ position:absolute; left:14px; right:14px; height:1.8px; background:var(--papel); border-radius:2px; transition:transform .3s var(--ease); }
.burger span:first-child{ top:19px; } .burger span:last-child{ bottom:19px; }
@media (max-width:900px){
  .header__nav, .header__cta{ display:none; }
  .burger{ display:block; }
  .header__inner{ padding:8px 8px 8px 20px; }
}

/* ---------- menu (dialog nativo) ---------- */
.menu{ position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; border:0; padding:0;
  background:var(--ink); color:var(--papel); opacity:0; transition:opacity .45s var(--ease); overflow:hidden; }
.menu.in{ opacity:1; }
.menu::backdrop{ background:transparent; }
.menu__marca{ position:absolute; right:-18%; bottom:-6%; width:90%; color:var(--papel); opacity:.05; }
.menu__inner{ position:relative; height:100%; display:grid; grid-template-rows:auto 1fr auto; padding:26px var(--gutter) 40px; }
.menu__close{ justify-self:end; width:46px; height:46px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--linha-inv); }
.menu__nav{ align-self:center; display:grid; gap:6px; }
.menu__nav a{ font-size:clamp(2.2rem,9vw,3.4rem); font-weight:600; letter-spacing:-.035em; line-height:1.2;
  transform:translateY(24px); opacity:0; transition:transform .6s var(--ease), opacity .6s ease; }
.menu.in .menu__nav a{ transform:none; opacity:1; }
.menu.in .menu__nav a:nth-child(2){ transition-delay:.05s; } .menu.in .menu__nav a:nth-child(3){ transition-delay:.1s; } .menu.in .menu__nav a:nth-child(4){ transition-delay:.15s; }

/* ---------- reveals e titulo por palavra ---------- */
[data-reveal]{ opacity:0; transform:translateY(30px); transition:opacity .9s var(--ease) var(--d,0s), transform 1s var(--ease) var(--d,0s); }
[data-reveal="esq"]{ transform:translateX(-46px) scale(.985); }
[data-reveal="dir"]{ transform:translateX(46px) scale(.985); }
[data-reveal].in{ opacity:1; transform:none; }
[data-split] .w{ display:inline-block; overflow:hidden; vertical-align:top; padding-bottom:.1em; margin-bottom:-.1em; }
[data-split] .w > span{ display:inline-block; transform:translateY(112%); transition:transform 1s var(--ease); }
[data-split].in .w > span{ transform:none; }
html.reduced [data-reveal], html.reduced [data-split] .w > span{ opacity:1 !important; transform:none !important; }
@media (prefers-reduced-motion:reduce){
  [data-reveal]{ transform:none; transition-property:opacity; }
  [data-split] .w > span{ transform:none; }
}

/* ---------- hero: sangrada, vira cartao conforme rola (--encolhe do app.js) ---------- */
.hero{ --e:var(--encolhe,0); position:relative; min-height:100svh; display:grid; align-content:end; color:var(--papel); background:var(--ink);
  padding:clamp(140px,18vh,200px) 0 clamp(120px,14vh,160px); overflow:hidden;
  clip-path:inset(calc(var(--e) * 18px) calc(var(--e) * var(--gutter)) 0 calc(var(--e) * var(--gutter)) round calc(var(--e) * var(--r-lg))); }
.hero__fundo{ position:absolute; inset:0; overflow:hidden; }
.hero__fundo img{ width:100%; height:100%; object-fit:cover; object-position:70% 50%; transform:translate3d(0,var(--py,0%),0) scale(1.08); }
/* veu para o texto ler sobre a foto, e a luz que segue o cursor (--mx/--my) */
.hero::before{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(90deg, rgba(10,28,46,.88) 0%, rgba(10,28,46,.68) 48%, rgba(10,28,46,0) 78%); }
.hero::after{ content:""; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:0; transition:opacity .6s ease;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,42%), rgba(157,180,204,.16), transparent 70%); }
.hero.cursor-ativo::after{ opacity:1; }
.hero__head{ position:relative; z-index:2; display:grid; gap:28px; justify-items:start; }
.hero h1{ max-width:13ch; }
.hero .em{ color:var(--ouro); }
.hero .lead{ color:var(--inv-2); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; }
.marquee{ position:absolute; z-index:2; left:0; right:0; bottom:0; overflow:hidden; border-top:1px solid var(--linha-inv); padding-block:20px; }
.marquee__track{ display:flex; width:max-content; animation:corre 42s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
.marquee__track span{ font-size:.95rem; font-weight:500; color:var(--inv-3); padding-inline:28px; white-space:nowrap; display:flex; align-items:center; gap:56px; }
.marquee__track span::after{ content:""; width:6px; height:6px; border-radius:50%; background:var(--ouro); margin-left:28px; }
@keyframes corre{ to{ transform:translateX(-25%); } }
@media (max-width:700px){
  .hero::before{ background:linear-gradient(180deg, rgba(10,28,46,.35) 0%, rgba(10,28,46,.85) 62%); }
  .hero__fundo img{ object-position:50% 70%; }
}

/* ---------- manifesto: as palavras acendem com a rolagem ---------- */
.manifesto__corpo{ display:grid; gap:40px; }
.manifesto__texto{ font-size:clamp(1.9rem,4.2vw,3.6rem); line-height:1.22; font-weight:500; letter-spacing:-.03em; max-width:24ch; }
.mw{ opacity:.14; transition:opacity .25s linear; }
.mw.lit{ opacity:1; }
.manifesto__pe{ font-size:clamp(1.05rem,1.3vw,1.25rem); font-weight:300; color:var(--txt-2); max-width:52ch; padding-left:64px; position:relative; }
.manifesto__pe::before{ content:""; position:absolute; left:0; top:.8em; width:44px; height:3px; background:var(--ouro); }

/* ---------- dupla: o nome + a proposta ---------- */
.dupla{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.dcard{ position:relative; overflow:hidden; border-radius:var(--r-lg); padding:clamp(32px,4vw,56px); min-height:520px;
  display:flex; flex-direction:column; justify-content:space-between; gap:40px; }
.dcard__corpo{ display:grid; gap:18px; position:relative; }
.dcard p{ color:var(--txt-3); max-width:46ch; }
.dcard--escuro{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); color:var(--papel); }
.dcard--escuro p{ color:var(--inv-2); }
.dcard--escuro .em{ color:var(--ouro); }
.dcard .btn{ justify-self:start; margin-top:10px; }
.dcard__logo{ width:clamp(150px,16vw,210px); height:auto; color:var(--papel); }
.dcard--claro{ background:var(--card); border:1px solid var(--linha); }
.dcard__frentes{ list-style:none; display:flex; flex-wrap:wrap; gap:10px; }
.dcard__frentes li{ display:inline-flex; align-items:center; gap:10px; padding:10px 16px 10px 12px; border-radius:999px; background:var(--secao); color:var(--marinho); font-size:.95rem; font-weight:500; }
.dcard__frentes .ico{ width:20px; height:20px; color:var(--ouro-p); }
@media (max-width:860px){ .dupla{ grid-template-columns:1fr; } .dcard{ min-height:0; } }

/* ---------- servicos: carrossel (rola de lado com setas, roda e arrasto) ---------- */
.servicos{ background:var(--secao); }
.carrossel__trilho{ display:grid; grid-auto-flow:column; grid-auto-columns:clamp(290px,30vw,400px); gap:18px;
  overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; cursor:grab;
  padding-inline:max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter))); scroll-padding-inline:max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter))); padding-block:14px 60px; margin-block:-14px -54px; }
.carrossel__trilho::-webkit-scrollbar{ display:none; }
.scard{ scroll-snap-align:start; background:var(--card); border:1px solid var(--linha); border-radius:var(--r-lg); padding:34px 32px;
  display:flex; flex-direction:column; gap:16px; min-height:380px; transition:transform .5s var(--ease), box-shadow .5s var(--ease); color:var(--txt); }
.scard:hover{ transform:translateY(-6px); box-shadow:0 26px 50px -30px rgba(10,28,46,.4); }
.scard .ico{ width:44px; height:44px; color:var(--marinho); }
.scard ul{ display:grid; gap:9px; margin-top:auto; padding-top:20px; border-top:1px solid var(--linha); }
.scard li{ font-size:.95rem; color:var(--txt-3); padding-left:22px; position:relative; line-height:1.45; }
.scard li::before{ content:""; position:absolute; left:0; top:.68em; width:10px; height:1.5px; background:var(--ouro); }
.scard--ouro{ background:var(--ouro-grad); border-color:transparent; }
.scard--ouro .ico{ color:var(--ink); } .scard--ouro li{ color:rgba(10,28,46,.82); } .scard--ouro ul{ border-color:rgba(10,28,46,.16); }
.scard--ouro li::before{ background:var(--ink); }
.scard--escuro{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); border-color:transparent; color:var(--papel); }
.scard--escuro .ico{ color:var(--azul); } .scard--escuro li{ color:var(--inv-2); } .scard--escuro ul{ border-color:var(--linha-inv); }
.carrossel__controles{ display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:32px; }
.carrossel__rail{ position:relative; flex:1; max-width:420px; height:2px; background:var(--linha); border-radius:2px; overflow:hidden; }
.carrossel__rail i{ position:absolute; top:0; bottom:0; left:var(--x,0%); width:var(--w,30%); background:var(--marinho); border-radius:2px; transition:left .15s linear; }
.carrossel__setas{ display:flex; gap:10px; }
.carrossel__seta{ width:52px; height:52px; border-radius:50%; display:grid; place-items:center; border:1px solid var(--linha); color:var(--marinho);
  transition:background-color .3s ease, color .3s ease, opacity .3s ease; }
.carrossel__seta:hover:not(:disabled){ background:var(--marinho); color:var(--papel); }
.carrossel__seta:disabled{ opacity:.35; cursor:default; }

/* ---------- diferenciais: bento ---------- */
.bento{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.bcard{ border-radius:var(--r-lg); padding:32px; display:flex; flex-direction:column; justify-content:space-between; gap:40px; min-height:240px;
  background:var(--card); border:1px solid var(--linha); transition:transform .5s var(--ease); }
.bcard:hover{ transform:translateY(-6px); }
.bcard .ico{ width:40px; height:40px; color:var(--marinho); }
.bcard--largo{ grid-column:span 2; grid-row:span 2; }
.bcard--escuro{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); color:var(--papel); border-color:transparent; }
.bcard--escuro .ico{ color:var(--ouro); width:52px; height:52px; }
.bcard--escuro h3{ font-size:clamp(1.6rem,2.6vw,2.3rem); max-width:16ch; }
.bcard--escuro p{ color:var(--inv-2); max-width:40ch; }
.bcard--ouro{ background:var(--ouro-grad); border-color:transparent; }
.bcard--ouro .ico{ color:var(--ink); }
@media (max-width:980px){ .bento{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .bento{ grid-template-columns:1fr; } .bcard--largo{ grid-column:auto; grid-row:auto; } }

/* ---------- processo: a linha se preenche com a rolagem (--p) ---------- */
.process__wrap{ position:relative; }
.process__line{ position:absolute; left:0; right:0; top:11px; height:2px; background:var(--linha); }
.process__line i{ position:absolute; inset:0; background:var(--ouro); transform-origin:left; transform:scaleX(var(--p,0)); }
.steps{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; position:relative; }
.step{ display:grid; gap:14px; align-content:start; }
.step__dot{ width:24px; height:24px; border-radius:50%; background:var(--papel); border:2px solid var(--nevoa); transition:background-color .4s ease, border-color .4s ease, transform .4s var(--ease); }
.step.active .step__dot{ background:var(--ouro); border-color:var(--ouro); transform:scale(1.1); }
.step h3{ margin-top:14px; }
.step p{ font-size:.98rem; color:var(--txt-3); }
@media (max-width:1023px){
  .process__line{ left:11px; right:auto; top:0; bottom:0; width:2px; height:auto; }
  .process__line i{ transform-origin:top; transform:scaleY(var(--p,0)); }
  .steps{ grid-template-columns:1fr; gap:40px; padding-left:0; }
  .step{ grid-template-columns:24px 1fr; column-gap:24px; }
  .step h3, .step p{ grid-column:2; }
  .step h3{ margin-top:-2px; }
}

/* ---------- CTA: nasce sangrado e vira cartao (--encolhe); o monograma se desenha (--traco) ---------- */
.cta{ --e:var(--encolhe,0); position:relative; overflow:hidden; background:var(--ink); color:var(--papel);
  padding-block:clamp(120px,16vw,220px); margin-bottom:0;
  clip-path:inset(calc(var(--e) * var(--gutter)) calc(var(--e) * var(--gutter)) calc(var(--e) * var(--gutter)) calc(var(--e) * var(--gutter)) round calc(var(--e) * var(--r-lg))); }
.cta::before{ content:""; position:absolute; inset:0; background:radial-gradient(80% 110% at 0% 0%, rgba(20,54,88,.85) 0%, transparent 65%); pointer-events:none; }
.cta__traco{ position:absolute; right:-6%; bottom:-10%; width:min(900px,70vw); height:auto; overflow:visible;
  fill:transparent; stroke:var(--ouro); stroke-width:3; stroke-dasharray:1; stroke-dashoffset:calc(1 - var(--traco,0)); opacity:.5;
  transform:translate3d(0,var(--py,0%),0); will-change:transform; }
.cta__corpo{ position:relative; display:grid; gap:28px; justify-items:start; }
.cta h2{ max-width:15ch; font-size:clamp(2.4rem,5.4vw,4.6rem); }
.cta .em{ color:var(--ouro); }
.cta .lead{ color:var(--inv-2); }
/* quando vira cartao, o texto recua junto com a borda (so onde a margem do container nao basta) */
.hero > .container, .cta > .container{ padding-inline:max(var(--gutter), calc(var(--gutter) * (1 + var(--e)) - max(0px, (100vw - var(--container)) / 2))); }

/* ---------- rodape ---------- */
.footer{ background:var(--ink); color:var(--inv-2); padding-block:clamp(64px,8vw,110px) 36px; }
.footer__grade{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; padding-bottom:48px; border-bottom:1px solid var(--linha-inv); }
.footer__marca{ display:grid; gap:20px; align-content:start; }
.footer__marca svg{ width:150px; height:auto; color:var(--papel); }
.footer__marca p{ font-size:.95rem; color:var(--inv-3); max-width:30ch; }
.footer__redes{ display:flex; gap:10px; }
.footer__redes a{ width:44px; height:44px; display:grid; place-items:center; border-radius:50%; border:1px solid var(--linha-inv); color:var(--inv-2); transition:color .25s ease, border-color .25s ease, transform .3s var(--ease); }
.footer__redes a:hover{ color:var(--ouro); border-color:var(--ouro); transform:translateY(-2px); }
.footer__redes .ico{ width:20px; height:20px; }
.footer__col-cab{ list-style:none; font-size:.8rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:var(--inv-3); margin-bottom:18px; cursor:default; }
.footer__col-cab::-webkit-details-marker{ display:none; }
.footer__col-corpo{ display:grid; gap:10px; }
.footer__col-corpo a{ color:var(--inv-2); width:fit-content; transition:color .25s ease; }
.footer__col-corpo a:hover{ color:var(--ouro); }
.footer__base{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; padding-top:28px; font-size:.85rem; color:var(--inv-3); }
.footer__base{ padding-right:84px; } /* nao passa por baixo do botao flutuante do WhatsApp */
@media (max-width:860px){ .footer__base{ padding-right:0; } .footer{ padding-bottom:104px; } }
.footer__rexor{ color:var(--inv-3); transition:color .25s ease; }
.footer__rexor b{ font-weight:500; color:var(--inv-2); }
.footer__rexor:hover, .footer__rexor:hover b{ color:var(--papel); }
.footer__topo{ margin-top:22px; padding:12px 20px; font-size:.9rem; }
.footer__topo .ico{ width:16px; height:16px; }
@media (max-width:860px){
  .footer__grade{ grid-template-columns:1fr; gap:0; }
  .footer__marca{ padding-bottom:32px; }
  .footer__col{ border-top:1px solid var(--linha-inv); }
  .footer__col-cab{ cursor:pointer; margin:0; padding-block:20px; display:flex; justify-content:space-between; }
  .footer__col-cab::after{ content:"+"; font-size:1.2rem; letter-spacing:0; }
  .footer__col[open] .footer__col-cab::after{ content:"–"; }
  .footer__col-corpo{ padding-bottom:22px; }
}

/* ---------- whatsapp flutuante ---------- */
.wa-float{ position:fixed; z-index:90; right:calc(clamp(16px,2.4vw,28px) + var(--barra)); bottom:clamp(16px,2.4vw,28px);
  width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:var(--ouro-grad); color:var(--ink);
  box-shadow:0 16px 34px -14px rgba(128,100,16,.8); transition:transform .4s var(--ease); }
.wa-float:hover{ transform:translateY(-3px) scale(1.04); }

/* ============================================================
   PAGINAS INTERNAS
   ============================================================ */
.header__nav a[aria-current="page"]{ color:var(--ink); }
.header__nav a[aria-current="page"]::after{ transform:scaleX(1); }
.header.sobre-escuro .header__nav a[aria-current="page"]{ color:var(--papel); }
.menu__nav a[aria-current="page"]{ color:var(--ouro); }
.carrossel__todos{ display:inline-flex; align-items:center; gap:8px; font-weight:600; color:var(--marinho); margin-left:auto; margin-right:24px; }
.carrossel__todos svg{ transition:transform .35s var(--ease); }
.carrossel__todos:hover svg{ transform:translateX(3px); }
@media (max-width:640px){ .carrossel__todos{ display:none; } }

/* hero curto: a mesma capa que vira cartao, com meia altura */
.hero--curto{ min-height:auto; padding:clamp(170px,22vh,230px) 0 clamp(80px,10vh,120px); }
.hero--curto h1{ max-width:12ch; font-size:clamp(2.5rem,5.6vw,4.8rem); }
.hero--curto .lead{ max-width:44ch; }
/* veu mais firme: o monograma da foto passa atras do texto */
.hero--curto::before{ background:linear-gradient(90deg, rgba(10,28,46,.94) 0%, rgba(10,28,46,.72) 45%, rgba(10,28,46,.08) 82%); }
@media (max-width:700px){ .hero--curto::before{ background:linear-gradient(180deg, rgba(10,28,46,.5) 0%, rgba(10,28,46,.9) 55%); } }

/* topo sem foto (contato): papel com a luz do cursor */
.pagina-topo{ position:relative; overflow:hidden; padding-block:clamp(170px,20vw,240px) clamp(40px,5vw,64px); }
.pagina-topo::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:0; transition:opacity .6s ease;
  background:radial-gradient(560px circle at var(--mx,50%) var(--my,40%), rgba(202,162,40,.10), transparent 70%); }
.pagina-topo.cursor-ativo::before{ opacity:1; }
.pagina-topo .container{ position:relative; display:grid; gap:26px; }
.pagina-topo h1{ max-width:14ch; }
.pagina-topo .em{ background:linear-gradient(135deg, #9C7A14 0%, #B8911F 55%, #C9A12A 100%); -webkit-background-clip:text; background-clip:text; color:transparent; }

/* sobre + proposito */
.pilares__grade{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.pilar{ position:relative; overflow:hidden; border-radius:var(--r-lg); padding:clamp(32px,4vw,56px); display:grid; gap:22px; align-content:start;
  background:var(--card); border:1px solid var(--linha); }
.pilar p{ color:var(--txt-3); }
.pilar--escuro{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); border-color:transparent; color:var(--papel); }
.pilar--escuro .lead{ color:var(--inv-2); } .pilar--escuro p{ color:var(--inv-3); } .pilar--escuro .em{ color:var(--ouro); }
.pilar__marca{ position:absolute; right:-12%; bottom:-14%; width:80%; color:var(--papel); opacity:.05; }
@media (max-width:860px){ .pilares__grade{ grid-template-columns:1fr; } }

/* missao e visao */
.declaracoes{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.declara{ display:flex; flex-direction:column; gap:18px; padding:clamp(28px,3.6vw,52px); border-radius:var(--r-lg); background:var(--card); border:1px solid var(--linha); }
.declara .ico{ width:48px; height:48px; color:var(--ouro-p); }
.declara h3{ font-size:clamp(1.6rem,2.4vw,2.1rem); letter-spacing:-.02em; margin-top:auto; padding-top:28px; }
.declara p{ font-size:clamp(1.1rem,1.5vw,1.3rem); line-height:1.55; color:var(--txt-3); }
.declara--escura{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); border-color:transparent; color:var(--papel); }
.declara--escura .ico{ color:var(--ouro); } .declara--escura p{ color:var(--inv-2); }
.declara--ouro{ background:var(--ouro-grad); border-color:transparent; }
.declara--ouro .ico{ color:var(--ink); }
.declara__lista{ list-style:none; display:grid; gap:8px; }
.declara__lista li{ position:relative; padding-left:20px; font-size:1.02rem; font-weight:500; color:rgba(10,28,46,.86); }
.declara__lista li::before{ content:""; position:absolute; left:0; top:.72em; width:10px; height:1.5px; background:var(--ink); }
@media (max-width:1080px){ .declaracoes{ grid-template-columns:1fr 1fr; } .declara--ouro{ grid-column:1 / -1; } }
@media (max-width:760px){ .declaracoes{ grid-template-columns:1fr; } }

/* valores: caixas em grade; Proposito e unidade (o proprio nome) ocupa duas */
.valores{ background:var(--secao); }
.valores__grade{ display:grid; gap:clamp(40px,5vw,64px); }
.valores__cab{ display:grid; grid-template-columns:1fr 1fr; gap:24px 60px; align-items:end; }
.valores__lista{ list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; grid-auto-flow:dense; }
.valores__lista li{ display:flex; flex-direction:column; gap:12px; padding:28px; border-radius:var(--r-md); background:var(--card); border:1px solid var(--linha); min-height:250px; transition:transform .5s var(--ease); }
.valores__lista li:hover{ transform:translateY(-6px); }
.valores__lista .ico{ width:40px; height:40px; color:var(--marinho); margin-bottom:auto; }
.valores__lista b{ font-size:1.2rem; font-weight:600; letter-spacing:-.015em; line-height:1.25; padding-top:24px; }
.valores__lista span{ font-size:.95rem; color:var(--txt-3); line-height:1.5; }
.valores__lista li.ouro{ grid-column:span 2; background:var(--ouro-grad); border-color:transparent; }
.valores__lista li.ouro .ico{ color:var(--ink); } .valores__lista li.ouro span{ color:rgba(10,28,46,.82); }
.valores__lista li.ouro b{ font-size:clamp(1.4rem,2.2vw,1.9rem); }
@media (max-width:980px){ .valores__cab{ grid-template-columns:1fr; } .valores__lista{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .valores__lista{ grid-template-columns:1fr; } .valores__lista li.ouro{ grid-column:auto; } .valores__lista li{ min-height:0; } }

/* secao escura generica */
.section--escura{ background:var(--ink); color:var(--papel); }
.section--escura .lead{ color:var(--inv-2); } .section--escura .em{ color:var(--ouro); }

/* colunas de fio no topo */
.colunas{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(28px,4vw,56px); }
.colunas--4{ grid-template-columns:repeat(4,minmax(0,1fr)); }
.col{ border-top:1px solid var(--linha); padding-top:28px; display:grid; gap:14px; align-content:start; position:relative; }
.col::before{ content:""; position:absolute; top:-2px; left:0; width:44px; height:3px; background:var(--marinho); }
.col .ico{ width:40px; height:40px; color:var(--marinho); }
.col p, .col li{ color:var(--txt-3); font-size:.98rem; }
.col ul{ display:grid; gap:8px; }
.col li{ padding-left:20px; position:relative; }
.col li::before{ content:""; position:absolute; left:0; top:.72em; width:9px; height:1.5px; background:var(--ouro); }
.col--ouro::before{ background:var(--ouro); }
.col--ouro .ico{ color:var(--ouro-p); }
.section--escura .col{ border-color:var(--linha-inv); }
.section--escura .col::before{ background:var(--azul); }
.section--escura .col--ouro::before{ background:var(--ouro); }
.section--escura .col .ico{ color:var(--azul); }
.section--escura .col--ouro .ico{ color:var(--ouro); }
.section--escura .col p, .section--escura .col li{ color:var(--inv-2); }
@media (max-width:980px){ .colunas, .colunas--4{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .colunas, .colunas--4{ grid-template-columns:1fr; } }

/* servicos: indice fixo + as seis frentes */
.frentes .container{ display:grid; grid-template-columns:240px 1fr; gap:clamp(40px,6vw,96px); align-items:start; }
.frentes__indice{ position:sticky; top:130px; display:grid; gap:4px; }
.frentes__indice a{ padding:10px 0 10px 18px; border-left:2px solid var(--linha); color:var(--txt-3); font-weight:500; transition:color .25s ease, border-color .25s ease; }
.frentes__indice a:hover{ color:var(--ink); border-color:var(--ouro); }
.frentes__lista{ display:grid; gap:18px; }
.frente{ border-radius:var(--r-lg); padding:clamp(28px,3.4vw,48px); background:var(--card); border:1px solid var(--linha);
  display:grid; grid-template-columns:1fr 1fr; gap:22px 48px; scroll-margin-top:120px; }
.frente__cab{ grid-column:1 / -1; display:flex; align-items:center; gap:18px; }
.frente__cab .ico{ width:48px; height:48px; color:var(--marinho); }
.frente h2{ font-size:clamp(1.6rem,2.8vw,2.3rem); }
.frente__desc{ font-size:1.1rem; line-height:1.55; color:var(--txt-2); font-weight:300; }
.frente ul{ display:grid; gap:10px; }
.frente li{ padding-left:22px; position:relative; color:var(--txt-3); }
.frente li::before{ content:""; position:absolute; left:0; top:.78em; width:10px; height:1.5px; background:var(--ouro); }
.frente--ouro{ background:var(--ouro-grad); border-color:transparent; }
.frente--ouro .ico{ color:var(--ink); } .frente--ouro .frente__desc{ color:var(--ink); } .frente--ouro li{ color:rgba(10,28,46,.82); } .frente--ouro li::before{ background:var(--ink); }
.frente--escura{ background:linear-gradient(158deg, var(--marinho-2) 0%, var(--ink) 70%); border-color:transparent; color:var(--papel); }
.frente--escura .ico{ color:var(--azul); } .frente--escura .frente__desc{ color:var(--inv-2); } .frente--escura li{ color:var(--inv-2); }
@media (max-width:980px){ .frentes .container{ grid-template-columns:1fr; } .frentes__indice{ display:none; } }
@media (max-width:680px){ .frente{ grid-template-columns:1fr; } }

/* formas de contratar */
.formas li{ display:grid; grid-template-columns:40px minmax(0,1fr) minmax(0,.8fr) minmax(0,1.4fr); gap:0 28px; align-items:center; padding:24px 0; border-top:1px solid var(--linha-inv); }
.formas li:last-child{ border-bottom:1px solid var(--linha-inv); }
.formas .ico{ color:var(--azul); }
.formas li.ouro .ico{ color:var(--ouro); }
.formas b{ font-size:clamp(1.2rem,2vw,1.6rem); font-weight:600; letter-spacing:-.02em; }
.formas em{ font-style:normal; font-weight:600; color:var(--ouro); }
.formas span{ color:var(--inv-2); }
@media (max-width:760px){ .formas li{ grid-template-columns:40px 1fr; row-gap:6px; } .formas em, .formas span{ grid-column:2; } }

/* contato: canais */
.canais__grade{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
.canal{ text-align:left; border-radius:var(--r-lg); padding:32px; min-height:240px; display:grid; align-content:start; gap:10px;
  background:var(--card); border:1px solid var(--linha); transition:transform .5s var(--ease), box-shadow .5s var(--ease); }
.canal:hover{ transform:translateY(-6px); box-shadow:0 26px 50px -30px rgba(10,28,46,.4); }
.canal .ico{ width:40px; height:40px; color:var(--marinho); margin-bottom:18px; }
.canal__rot{ font-size:.9rem; color:var(--txt-3); }
.canal__dado{ font-size:clamp(1.15rem,1.7vw,1.4rem); font-weight:600; letter-spacing:-.015em; word-break:break-word; }
.canal__acao{ margin-top:auto; padding-top:18px; display:inline-flex; align-items:center; gap:8px; font-weight:600; color:var(--marinho); }
.canal--ouro{ background:var(--ouro-grad); border-color:transparent; }
.canal--ouro .ico, .canal--ouro .canal__acao{ color:var(--ink); } .canal--ouro .canal__rot{ color:rgba(10,28,46,.75); }
.canal.copiado{ border-color:var(--marinho); }
.ccard__aviso{ color:var(--ouro-p); }
@media (max-width:860px){ .canais__grade{ grid-template-columns:1fr; } .canal{ min-height:0; } }