/* site-style.css - Chiaradia Sapag Child. CSS extraido de site/index.html e site/assets/css/design-system.css (etapa 7.7): header, rodape, tokens e tipografia do site. As @font-face saem pelo functions.php em todas as paginas. */
/* =====================================================================
   Elyte (Framer) - clone fiel pela URL original, etapa 2 (clone-template)
   Breakpoints do original: desktop >=1200 | tablet 810-1199 | celular <=809
   G-23: body e bandas 100%; o clamp mora SO no .container (1200, gutter 20)
   ===================================================================== */
:root{
  /* ETAPA 5 palette-mapper (2026-10-08): paleta MEDIDA no pixel do logo publico (cliente.yaml visual.paleta).
     Marinho do logo no lugar do preto azulado do Elyte, creme do logo no fundo, ouro so como acento em 3 papeis. */
  /* superficies */
  --bg:#F2F1EA;            /* fundo da pagina e das bandas claras, mega menu, signup (era #F2F3F5; paleta.fundo_claro, 1,13:1 contra o --surface) */
  --surface:#FFFFFF;       /* cards brancos, botao principal, quadrado da seta */
  --white:#FFFFFF;
  /* tinta */
  --ink:#081830;           /* texto principal (era #081014; paleta.fundo_escuro: 15,67:1 no --bg, 17,74:1 no branco) */
  --muted:#5A6272;         /* texto secundario (era #707070 = 4,46:1, reprovava AA; ardosia puxada ao marinho: 5,42:1 no --bg, 6,13:1 no branco) */
  --on-dark:#FFFFFF;       /* 17,40:1 no --dark */
  --on-dark-muted:#C8CDD6; /* (era #C8C8C8; cinza-azulado do marinho: 10,91:1 no --dark) */
  /* escuro (fundo) */
  --dark:#0A1A32;          /* hero, painel mobile, caixa de icone, Subscribe (era #081014; paleta.primaria) */
  --dark-rgb:10,26,50;     /* base de todos os scrims e vidros escuros (era 8,16,20) */
  --video-rgb:8,24,48;     /* scrim proprio do card de video (era 18,18,20; paleta.fundo_escuro) */
  /* filetes e vidros */
  --border:rgba(8,24,48,.12);   /* (era rgba(8,16,20,.12)) */
  --border-strong:#7D621C;      /* filete do item aberto e barra do nome (era #081014; = --gold-text, 5,10:1 no --bg) */
  --border-light:rgba(255,255,255,.12);
  --glass-light:rgba(255,255,255,.12);
  --glass-dark:rgba(10,26,50,.12); /* (era rgba(8,16,20,.12)) */
  --glass-border:rgba(255,255,255,.08);
  /* destaque: ouro claro do logo sobre escuro (negrito do H1, ponto do eyebrow e hover do botao contorno no hero) */
  --accent-soft:#D4C08A;   /* paleta.terciaria (era #C8C8C8): 9,70:1 no --dark */
  /* ouro do logo em 3 papeis (tokens novos; o Elyte nao tem cor de destaque) */
  --gold:#B89028;          /* paleta.accent/secundaria: PREENCHIMENTO e acento nao-textual. Texto sobre ele = --ink (5,96:1); branco reprova (2,98:1); como texto no --bg reprova (2,63:1) */
  --gold-text:#7D621C;     /* ouro ESCURECIDO (hsl 43/64/30, mesmo matiz) para texto e icone sobre claro: 5,10:1 no --bg, 5,78:1 no branco */
  --gold-light:#D5AA3F;    /* ouro clareado (hsl 43/64/54) sobre a banda escura e hover do preenchimento: 8,00:1 no --dark, --ink sobre ele 8,15:1 */
  /* tipografia */
  --font:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif;
  /* medidas */
  --container:1200px;
  --gutter:20px;
  --ease:cubic-bezier(.22,1,.36,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;
  font-feature-settings:"blwf","cv03","cv04","cv09","cv11";-webkit-font-smoothing:antialiased;overflow-x:clip}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{list-style:none}

.container{width:100%;max-width:var(--container);margin:0 auto;padding:0 var(--gutter)}

/* ---------- tipografia ---------- */
.eyebrow{font-size:14px;line-height:19.6px;font-weight:600;letter-spacing:.84px;text-transform:uppercase;color:var(--ink)}
.eyebrow--light{color:var(--on-dark)}
.h1{font-size:72px;line-height:79.2px;font-weight:400;letter-spacing:-.06em;color:var(--on-dark)}
.h2{font-size:52px;line-height:57.2px;font-weight:400;letter-spacing:-.06em;color:var(--ink)}
.h3{font-size:20px;line-height:24px;font-weight:400;letter-spacing:-.4px;color:var(--ink)}
.h3-lg{font-size:24px;line-height:28.8px;font-weight:400;letter-spacing:-.96px;color:var(--ink)}
.p16{font-size:16px;line-height:24px;color:var(--muted)}
.p14{font-size:14px;line-height:19.6px;color:var(--muted)}
.lead{font-size:18px;line-height:25.2px;color:var(--on-dark-muted)}
.caps{font-size:12px;line-height:16.8px;font-weight:500;letter-spacing:.72px;text-transform:uppercase}
.sec-head{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.sec-head--center{align-items:center;text-align:center}
.br-t{display:none}

/* ---------- seta (mascara do original) ---------- */
.ic-arrow{display:block;width:20px;height:20px;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 1 0 L 1 2 L 9.59 2 L 0 11.59 L 1.41 13 L 11 3.41 L 11 12 L 13 12 L 13 0 Z' transform='translate(5.5 5.5)'/%3E%3C/svg%3E") center/100% 100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M 1 0 L 1 2 L 9.59 2 L 0 11.59 L 1.41 13 L 11 3.41 L 11 12 L 13 12 L 13 0 Z' transform='translate(5.5 5.5)'/%3E%3C/svg%3E") center/100% 100% no-repeat}
.arw{position:relative;width:20px;height:20px;overflow:hidden;flex:none;color:var(--ink)}
.arw i{position:absolute;left:0;top:0;transition:transform .45s var(--ease)}
.arw i:last-child{transform:translate(-24px,24px)}
.hov:hover .arw i:first-child{transform:translate(24px,-24px)}
.hov:hover .arw i:last-child{transform:translate(0,0)}

/* ---------- botoes (raio 0) ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;
  font-size:16px;line-height:22.4px;font-weight:500;position:relative;white-space:nowrap;transition:background-color .3s var(--ease)}
.btn--white{background:var(--surface);color:var(--ink)}
.btn--white:hover{background:var(--bg)}
.btn--outline-light{color:var(--on-dark);box-shadow:inset 0 0 0 1px var(--border-light)}
.btn--outline-light:hover{background:var(--glass-light)}

/* ---------- card de seta (Big CTA) e quadrado de canto ---------- */
.big-cta{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;width:236px;height:130px;
  padding:12px;background:var(--surface);color:var(--ink);transition:background-color .3s var(--ease)}
.big-cta:hover{background:var(--bg)}
.big-cta__label{align-self:stretch;font-size:16px;line-height:22.4px;font-weight:500}
.corner{position:absolute;top:0;right:0;width:52px;height:52px;background:var(--surface);display:flex;align-items:center;justify-content:center;z-index:2}

/* =====================================================================
   HEADER
   ===================================================================== */
.site-header{position:absolute;top:0;left:0;right:0;z-index:50}
.nav{position:relative;height:86.4px;padding:18px var(--gutter);max-width:var(--container);margin:0 auto;display:flex;align-items:center;gap:10px}
.nav__logo{flex:none;width:97px;height:30px}
.nav__logo img{width:97px;height:30px;object-fit:contain;object-position:0 50%}
.nav__menu{flex:1;display:flex;justify-content:center;align-items:center;gap:32px}
.nav__menu > li > a,.nav__svc{font-size:15px;line-height:21px;font-weight:500;letter-spacing:-.3px;color:var(--on-dark);display:flex;align-items:center;gap:8px;transition:color .25s}
.nav__menu > li > a:hover,.nav__svc:hover{color:var(--on-dark-muted)}
.caret{width:8px;height:4px;flex:none;transition:transform .3s var(--ease)}
.nav__svc[aria-expanded="true"] .caret{transform:rotate(180deg)}
.nav__cta{flex:none}
.nav__rule{position:absolute;left:var(--gutter);right:var(--gutter);top:85px;height:1px;background:var(--border-light)}
.burger{display:none}

/* mega menu de servicos (desktop) */
.mega{position:absolute;top:86.4px;left:var(--gutter);right:var(--gutter);height:360px;display:flex;align-items:center;gap:44px;
  padding:6px 6px 6px 24px;background:var(--bg);box-shadow:0 16px 24px -10px rgba(var(--dark-rgb),.12);
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s}
.mega.is-open{opacity:1;visibility:visible;transform:none}
.mega__list{flex:1;display:flex;flex-direction:column;gap:36px;padding:14px 0 18px}
.mega__title{font-size:16px;line-height:24px;font-weight:500;color:var(--ink);padding-bottom:12px;box-shadow:inset 0 -1px 0 var(--border)}
.mega__items{display:flex;flex-direction:column;gap:32px}
.mega__item{display:flex;align-items:center;gap:16px}
.mega__icon{width:44px;height:41.2px;flex:none;background:var(--dark);display:flex;align-items:center;justify-content:center}
.mega__icon img{width:24px;height:24px;object-fit:contain}
.mega__name{display:block;font-size:16px;line-height:17.6px;font-weight:500;letter-spacing:-.32px;color:var(--ink)}
.mega__desc{display:block;margin-top:4px;font-size:14px;line-height:19.6px;color:var(--muted)}
.mega__item:hover .mega__name{color:var(--muted)}
.mega__cta{position:relative;flex:none;width:420px;height:348px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:var(--on-dark)}
.mega__cta > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.mega__cta::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(var(--dark-rgb),0) 38%,rgb(var(--dark-rgb)) 100%)}
.mega__cta .h3-lg{position:relative;color:var(--on-dark)}
.mega__cta p{position:relative;margin-top:10px;font-size:14px;line-height:19.6px;color:var(--on-dark-muted)}

/* painel mobile (tablet e celular) */
.mpanel{display:none}

/* =====================================================================
   HERO
   ===================================================================== */
/* hero full-bleed canonico (G-21, pipeline/hero-canonico.md) */
.hero{position:relative;overflow:hidden;color:var(--on-dark)}
.hero--fullbleed{padding:0;min-height:724px;display:flex;align-items:center;background:var(--ink)}
.hero--fullbleed .hero-bgphoto{position:absolute;inset:0;width:100% !important;height:100% !important;max-width:none !important;object-fit:cover;object-position:70% center;z-index:0}
.hero--fullbleed::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,
  rgba(var(--dark-rgb),.95) 0%,rgba(var(--dark-rgb),.84) 26%,rgba(var(--dark-rgb),.52) 48%,rgba(var(--dark-rgb),.12) 68%,rgba(var(--dark-rgb),.30) 100%)}
.hero--fullbleed .hero-inner{position:relative;z-index:2;display:grid;width:100%;grid-template-columns:minmax(0,640px);justify-content:start;padding-top:84px;padding-bottom:96px}
.hero-copy{display:flex;flex-direction:column;gap:24px;align-items:flex-start}
.hero--fullbleed h1{font-size:60px;line-height:1.1;font-weight:400;letter-spacing:-.05em;color:#FFFFFB;text-wrap:wrap;text-wrap:pretty}
.hero--fullbleed h1 b{font-weight:500;color:var(--accent-soft)}
.hero-lead{font-size:18px;line-height:27px;color:rgba(255,255,251,.85)}
.hero--fullbleed .eyebrow{display:inline-flex;align-items:center;gap:10px;color:rgba(255,255,251,.88)}
.hero--fullbleed .eyebrow .dot{width:6px;height:6px;border-radius:50%;background:var(--accent-soft);flex:none}
.hero-cta{display:flex;gap:20px;flex-wrap:wrap}
.btn-ghost-dark{background:transparent;color:#FFFFFB;box-shadow:inset 0 0 0 1px rgba(255,255,251,.38);transition:box-shadow .3s var(--ease),color .3s var(--ease)}
.btn-ghost-dark:hover{box-shadow:inset 0 0 0 1px var(--accent-soft);color:var(--accent-soft)}
@media (min-width:1025px) and (max-width:1440px){
  .hero--fullbleed{min-height:640px}
  .hero--fullbleed .hero-bgphoto{object-position:74% center}
}

/* =====================================================================
   LOGOS (ticker)
   ===================================================================== */
.logos{height:90px;display:flex;align-items:center;box-shadow:inset 0 -1px 0 var(--border)}
.logos__mask{width:100%;max-width:var(--container);margin:0 auto;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
          mask-image:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%)}
.logos__track{display:flex;width:max-content;animation:ticker 140.1s linear infinite}
.logos__set{display:flex;align-items:center;gap:72px;padding-right:72px}
.logos__set img{height:30px;width:auto;flex:none}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-33.3333%)}}

/* =====================================================================
   PILLARS
   ===================================================================== */
#pillars{padding:160px 0 140px}
.pillars{display:flex;gap:40px;align-items:flex-start}
.pillars__text{width:560px;flex:none;display:flex;flex-direction:column;gap:50px}
.pillars__text .h2{max-width:560px}
.steps{display:flex;flex-direction:column;gap:50px}
.step{display:flex;flex-direction:column;gap:20px}
.step__num{width:36px;height:36px;border-radius:100px;box-shadow:inset 0 0 0 1px var(--border);display:flex;align-items:center;justify-content:center;font-size:14px;line-height:19.6px;color:var(--ink)}
.step__body{display:flex;flex-direction:column;gap:12px}
.pillars__media{position:relative;width:560px;flex:none;aspect-ratio:560/564.7;overflow:hidden;background:var(--dark);display:flex;flex-direction:column;justify-content:flex-end;padding:8px}
.pillars__media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.pillars__media::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(var(--dark-rgb),0) 60%,rgb(var(--dark-rgb)) 100%)}
.founder{position:relative;display:flex;align-items:center;gap:20px;padding:16px;background:var(--glass-light);
  -webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:var(--on-dark);transition:background-color .3s var(--ease),color .3s var(--ease)}
.founder__avatar{width:60px;height:59.7px;border-radius:100px;overflow:hidden;flex:none}
.founder__avatar img{width:100%;height:100%;object-fit:cover}
.founder__who{flex:1;display:flex;flex-direction:column;gap:10px}
.founder__who .h3{color:inherit}
.founder__who .caps{color:var(--on-dark-muted);transition:color .3s var(--ease)}
.founder__go{display:flex;align-items:center;gap:10px;font-size:16px;line-height:22.4px;font-weight:500}
.founder .arw{color:var(--on-dark);transition:color .3s var(--ease)}
.founder:hover{background:var(--surface);color:var(--ink)}
.founder:hover .caps{color:var(--muted)}
.founder:hover .arw{color:var(--ink)}

/* =====================================================================
   SERVICES
   ===================================================================== */
#services{padding:120px 0}
.services{display:flex;flex-direction:column;gap:50px}
.services .h2{max-width:696px}
.svc-grid{display:flex;gap:10px}
.svc{flex:1;display:flex;flex-direction:column;gap:20px;min-width:0}
.svc__media{position:relative;display:block;height:520px;overflow:hidden;background:var(--dark)}
.svc__media > img{position:absolute;left:-1.9px;top:-2.1px;width:calc(100% + 3.8px);height:calc(100% + 5.2px);object-fit:cover;transition:transform .7s var(--ease)}
.svc__media::before{content:"";position:absolute;left:-1.9px;top:-2.1px;width:calc(100% + 3.8px);height:calc(100% + 5.2px);z-index:1;
  background:linear-gradient(rgba(var(--dark-rgb),.4) 43.618%,rgb(var(--dark-rgb)) 100%)}
.svc__title{position:absolute;left:24px;right:24px;bottom:24px;height:28.8px;overflow:hidden;z-index:2}
.svc__title span{display:block;color:var(--on-dark);transition:transform .5s var(--ease)}
.svc__media:hover > img{transform:scale(1.07)}
.svc__media:hover .svc__title span{transform:translateY(-36px)}
.svc__title span + span{margin-top:7.2px}

/* =====================================================================
   FRAMEWORK
   ===================================================================== */
#framework{padding:120px 0 0}
.framework{display:flex;flex-direction:column;gap:100px}
.framework .h2{max-width:744px}
.fw-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:80px 58px}
.fw{display:flex;flex-direction:column;gap:44px;max-width:346px}
.fw__icon{width:24px;height:24px;background:var(--ink);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.fw__body{display:flex;flex-direction:column;gap:16px}
.fw-rule{height:1px;background:var(--border)}
.ic-fw1{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2)' d='M 18 0 L 2 0 C 0.9 0 0.01 0.9 0.01 2 L 0 20 L 4 16 L 18 16 C 19.1 16 20 15.1 20 14 L 20 2 C 20 0.9 19.1 0 18 0 Z M 18 14 L 3.17 14 L 2 15.17 L 2 2 L 18 2 Z'/%3E%3Cpath transform='translate(7 6)' d='M 1 8 L 7 8 C 7.55 8 8 7.55 8 7 L 8 5.01 L 10 7 L 10 1 L 8 2.99 L 8 1 C 8 0.45 7.55 0 7 0 L 1 0 C 0.45 0 0 0.45 0 1 L 0 7 C 0 7.55 0.45 8 1 8 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2)' d='M 18 0 L 2 0 C 0.9 0 0.01 0.9 0.01 2 L 0 20 L 4 16 L 18 16 C 19.1 16 20 15.1 20 14 L 20 2 C 20 0.9 19.1 0 18 0 Z M 18 14 L 3.17 14 L 2 15.17 L 2 2 L 18 2 Z'/%3E%3Cpath transform='translate(7 6)' d='M 1 8 L 7 8 C 7.55 8 8 7.55 8 7 L 8 5.01 L 10 7 L 10 1 L 8 2.99 L 8 1 C 8 0.45 7.55 0 7 0 L 1 0 C 0.45 0 0 0.45 0 1 L 0 7 C 0 7.55 0.45 8 1 8 Z'/%3E%3C/svg%3E")}
.ic-fw2{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='9' width='4' height='11'/%3E%3Crect x='4' y='4' width='4' height='4'/%3E%3Crect x='10' y='7' width='4' height='4'/%3E%3Crect x='16' y='10' width='4' height='4'/%3E%3Crect x='16' y='15' width='4' height='5'/%3E%3Crect x='10' y='12' width='4' height='8'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='9' width='4' height='11'/%3E%3Crect x='4' y='4' width='4' height='4'/%3E%3Crect x='10' y='7' width='4' height='4'/%3E%3Crect x='16' y='10' width='4' height='4'/%3E%3Crect x='16' y='15' width='4' height='5'/%3E%3Crect x='10' y='12' width='4' height='8'/%3E%3C/svg%3E")}
.ic-fw3{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 3)' d='M 18 0 L 2 0 C 0.89 0 0 0.89 0 2 L 0 14 C 0 15.1 0.89 16 2 16 L 6 16 L 6 18 L 14 18 L 14 16 L 18 16 C 19.1 16 20 15.1 20 14 L 20 2 C 20 0.89 19.1 0 18 0 Z M 18 14 L 2 14 L 2 2 L 18 2 Z'/%3E%3Crect x='6' y='8.25' width='8' height='1.5'/%3E%3Cpath transform='translate(15 7)' d='M 1.5 2.75 L 3 2.75 L 3 1.25 L 1.5 1.25 L 1.5 0 L 0 0 L 0 4 L 1.5 4 Z'/%3E%3Crect x='10' y='12.25' width='8' height='1.5'/%3E%3Cpath transform='translate(6 11)' d='M 1.5 4 L 3 4 L 3 0 L 1.5 0 L 1.5 1.25 L 0 1.25 L 0 2.75 L 1.5 2.75 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 3)' d='M 18 0 L 2 0 C 0.89 0 0 0.89 0 2 L 0 14 C 0 15.1 0.89 16 2 16 L 6 16 L 6 18 L 14 18 L 14 16 L 18 16 C 19.1 16 20 15.1 20 14 L 20 2 C 20 0.89 19.1 0 18 0 Z M 18 14 L 2 14 L 2 2 L 18 2 Z'/%3E%3Crect x='6' y='8.25' width='8' height='1.5'/%3E%3Cpath transform='translate(15 7)' d='M 1.5 2.75 L 3 2.75 L 3 1.25 L 1.5 1.25 L 1.5 0 L 0 0 L 0 4 L 1.5 4 Z'/%3E%3Crect x='10' y='12.25' width='8' height='1.5'/%3E%3Cpath transform='translate(6 11)' d='M 1.5 4 L 3 4 L 3 0 L 1.5 0 L 1.5 1.25 L 0 1.25 L 0 2.75 L 1.5 2.75 Z'/%3E%3C/svg%3E")}
.ic-fw4{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(0 3.5)' d='M 22 15 L 22 0 L 2 0 L 2 15 L 0 15 L 0 17 L 24 17 L 24 15 Z M 14 15 L 10 15 L 10 14 L 14 14 Z M 20 12 L 4 12 L 4 2 L 20 2 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(0 3.5)' d='M 22 15 L 22 0 L 2 0 L 2 15 L 0 15 L 0 17 L 24 17 L 24 15 Z M 14 15 L 10 15 L 10 14 L 14 14 Z M 20 12 L 4 12 L 4 2 L 20 2 Z'/%3E%3C/svg%3E")}
.ic-fw5{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2.5)' d='M 8 13 L 13.88 13 C 14.15 12.69 14.55 12.5 15 12.5 C 15.83 12.5 16.5 13.17 16.5 14 C 16.5 14.83 15.83 15.5 15 15.5 C 14.56 15.5 14.16 15.31 13.88 15 L 9.9 15 C 9.44 17.28 7.42 19 5 19 C 2.24 19 0 16.76 0 14 C 0 11.58 1.72 9.56 4 9.1 L 4 11.17 C 2.84 11.58 2 12.7 2 14 C 2 15.650 3.35 17 5 17 C 6.65 17 8 15.65 8 14 Z M 10.5 2 C 12.15 2 13.5 3.35 13.5 5 L 15.5 5 C 15.5 2.24 13.26 0 10.5 0 C 7.74 0 5.5 2.24 5.5 5 C 5.5 6.43 6.1 7.71 7.05 8.62 L 4.7 12.52 C 4.02 12.66 3.5 13.27 3.5 14 C 3.5 14.83 4.17 15.5 5 15.5 C 5.83 15.5 6.5 14.83 6.5 14 C 6.5 13.84 6.48 13.69 6.43 13.55 L 9.81 7.92 C 8.49 7.61 7.5 6.42 7.5 5 C 7.5 3.35 8.85 2 10.5 2 Z M 15 11 C 14.36 11 13.77 11.2 13.28 11.54 L 10.23 6.47 C 9.53 6.35 9 5.74 9 5 C 9 4.17 9.67 3.5 10.5 3.5 C 11.33 3.5 12 4.17 12 5 C 12 5.15 11.98 5.29 11.94 5.43 L 14.13 9.08 C 14.41 9.03 14.7 9 15 9 C 17.76 9 20 11.24 20 14 C 20 16.76 17.76 19 15 19 C 13.15 19 11.53 17.99 10.67 16.5 L 13.34 16.5 C 13.82 16.82 14.39 17 15 17 C 16.65 17 18 15.65 18 14 C 18 12.35 16.65 11 15 11 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2.5)' d='M 8 13 L 13.88 13 C 14.15 12.69 14.55 12.5 15 12.5 C 15.83 12.5 16.5 13.17 16.5 14 C 16.5 14.83 15.83 15.5 15 15.5 C 14.56 15.5 14.16 15.31 13.88 15 L 9.9 15 C 9.44 17.28 7.42 19 5 19 C 2.24 19 0 16.76 0 14 C 0 11.58 1.72 9.56 4 9.1 L 4 11.17 C 2.84 11.58 2 12.7 2 14 C 2 15.650 3.35 17 5 17 C 6.65 17 8 15.65 8 14 Z M 10.5 2 C 12.15 2 13.5 3.35 13.5 5 L 15.5 5 C 15.5 2.24 13.26 0 10.5 0 C 7.74 0 5.5 2.24 5.5 5 C 5.5 6.43 6.1 7.71 7.05 8.62 L 4.7 12.52 C 4.02 12.66 3.5 13.27 3.5 14 C 3.5 14.83 4.17 15.5 5 15.5 C 5.83 15.5 6.5 14.83 6.5 14 C 6.5 13.84 6.48 13.69 6.43 13.55 L 9.81 7.92 C 8.49 7.61 7.5 6.42 7.5 5 C 7.5 3.35 8.85 2 10.5 2 Z M 15 11 C 14.36 11 13.77 11.2 13.28 11.54 L 10.23 6.47 C 9.53 6.35 9 5.74 9 5 C 9 4.17 9.67 3.5 10.5 3.5 C 11.33 3.5 12 4.17 12 5 C 12 5.15 11.98 5.29 11.94 5.43 L 14.13 9.08 C 14.41 9.03 14.7 9 15 9 C 17.76 9 20 11.24 20 14 C 20 16.76 17.76 19 15 19 C 13.150 19 11.53 17.99 10.67 16.5 L 13.34 16.5 C 13.82 16.82 14.39 17 15 17 C 16.65 17 18 15.65 18 14 C 18 12.35 16.65 11 15 11 Z'/%3E%3C/svg%3E")}
.ic-fw6{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2.51)' d='M 0 17.48 L 7.5 9.97 L 11.5 13.97 L 18.59 6 L 20 7.41 L 11.5 16.97 L 7.5 12.97 L 1.5 18.98 Z M 1.5 12.98 L 7.5 6.97 L 11.5 10.97 L 20 1.41 L 18.59 0 L 11.5 7.97 L 7.5 3.97 L 0 11.48 Z'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath transform='translate(2 2.51)' d='M 0 17.48 L 7.5 9.97 L 11.5 13.97 L 18.59 6 L 20 7.41 L 11.5 16.97 L 7.5 12.97 L 1.5 18.98 Z M 1.5 12.98 L 7.5 6.97 L 11.5 10.97 L 20 1.41 L 18.59 0 L 11.5 7.97 L 7.5 3.97 L 0 11.48 Z'/%3E%3C/svg%3E")}

/* =====================================================================
   CASE STUDIES
   ===================================================================== */
#case-studies{padding:120px 0}
.cases-sec{display:flex;flex-direction:column;gap:44px}
.cases-sec .h2{max-width:744px}
.cases{position:relative;display:flex;flex-direction:column;gap:12px}
.case{position:relative;height:659px;overflow:hidden;background:var(--dark);display:flex;padding:12px}
.case > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.case::before{content:"";position:absolute;inset:0;background:linear-gradient(270deg,rgba(var(--dark-rgb),.4) 24%,rgb(var(--dark-rgb)) 100%)}
.case__box{position:relative;width:482px;display:flex;flex-direction:column;justify-content:space-between;padding:36px;
  background:var(--glass-dark);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:inset 0 0 0 1px var(--glass-border)}
.case__logo{width:107px;height:48px}
.case__logo img{width:100%;height:100%;object-fit:contain;object-position:0 0}
.case__body{display:flex;flex-direction:column;gap:24px}
.case__copy{display:flex;flex-direction:column;gap:12px}
.case__copy .h3-lg{color:var(--on-dark)}
.case__copy p{font-size:16px;line-height:24px;color:var(--on-dark-muted)}
.case__body > p{line-height:17.6px}
.case__body > p{line-height:17.6px}
.case__link{font-size:16px;line-height:17.6px;font-weight:500;color:var(--on-dark);text-decoration:underline;text-underline-offset:2px;transition:color .25s}
.case__link:hover{color:var(--on-dark-muted)}
.cases__all{position:absolute;right:12px;bottom:12px;z-index:2}

/* =====================================================================
   APPROACH
   ===================================================================== */
#approach{padding:120px 0}
.approach{display:flex;gap:60px;align-items:center}
.approach__media{position:relative;width:550px;flex:none;aspect-ratio:550/727.7;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:12px}
.approach__media > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.approach__media .big-cta{position:relative}
.approach__text{width:550px;flex:none;display:flex;flex-direction:column;gap:160px}
.acc{display:flex;flex-direction:column;gap:24px}
.acc__item{padding-bottom:24px;box-shadow:inset 0 -1px 0 var(--border);transition:box-shadow .3s}
.acc__item.is-open{box-shadow:inset 0 -1px 0 var(--border-strong)}
.acc__head{width:100%;display:flex;align-items:center;gap:10px;text-align:left}
.acc__head .h3-lg{flex:1}
.acc__num{flex:1;text-align:right;font-size:18px;line-height:25.2px;color:var(--ink)}
.collapse{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s var(--ease)}
.collapse > div{overflow:hidden}
.is-open > .collapse{grid-template-rows:1fr}
.acc__item .collapse p{padding-top:12px}

/* =====================================================================
   TESTIMONIALS
   ===================================================================== */
#testimonials{padding:120px 0 112px}
.tst-sec{display:flex;flex-direction:column;gap:44px}
.tst-sec .h2{max-width:774px}
.tst-grid{display:flex;gap:10px}
.tcard{flex:1;min-width:0;height:500px;background:var(--surface);padding:32px;display:flex;flex-direction:column;justify-content:space-between}
.tcard__top{display:flex;justify-content:space-between;align-items:center}
.tcard__avatar{width:60px;height:59.7px;border-radius:100px;overflow:hidden;flex:none}
.tcard__avatar img{width:100%;height:100%;object-fit:cover}
.tcard__logo{width:136px;height:44px}
.tcard__logo img{width:100%;height:100%;object-fit:contain;object-position:100% 50%}
.tcard .h3-lg{color:var(--ink)}
.who{display:flex;flex-direction:column;gap:10px;padding-left:20px;box-shadow:inset 1px 0 0 var(--border-strong)}
.who .caps{color:var(--muted)}
.tcard--video{position:relative;overflow:hidden;background:var(--dark);justify-content:flex-end;color:var(--on-dark)}
.tcard--video > img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tcard--video::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(var(--video-rgb),0) 24.5865%,rgb(var(--video-rgb)) 100%)}
.play{position:relative;flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center}
.play__btn{width:70px;height:70px;border-radius:100px;background:var(--surface);display:flex;align-items:center;justify-content:center}
.play__txt{display:flex;flex-direction:column;gap:4px}
.play__txt b{font-size:16px;line-height:24px;font-weight:600;color:var(--on-dark)}
.play__txt span{font-size:14px;line-height:19.6px;color:var(--on-dark-muted)}
.tcard--video .who{position:relative;box-shadow:inset 1px 0 0 var(--white)}
.tcard--video .who .h3{color:var(--on-dark)}
.tcard--video .who .caps{color:var(--on-dark-muted)}

/* =====================================================================
   FAQ
   ===================================================================== */
#faq{padding:112px 0 160px}
.faq{display:flex;gap:112px;align-items:stretch}
.faq__side{width:494px;flex:none;display:flex;flex-direction:column;justify-content:space-between}
.faq__side .h2{max-width:494px}
.faq-cta{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;height:150px;padding:20px;background:var(--surface);color:var(--ink);transition:background-color .3s var(--ease),color .3s var(--ease)}
.faq-cta__txt{align-self:stretch;display:flex;flex-direction:column;gap:6px}
.faq-cta__txt b{font-size:16px;line-height:22.4px;font-weight:500}
.faq-cta__txt span{font-size:14px;line-height:19.6px;color:var(--muted);transition:color .3s var(--ease)}
.faq-cta:hover{background:var(--dark);color:var(--on-dark)}
.faq-cta:hover .faq-cta__txt span{color:var(--on-dark-muted)}
.faq-cta:hover .arw{color:var(--on-dark)}
.faq__list{flex:1;display:flex;flex-direction:column;gap:34px}
.faq-item{padding-bottom:32px;box-shadow:inset 0 -1px 0 var(--border);transition:padding .45s var(--ease)}
.faq-item.is-open{padding-bottom:24px;box-shadow:inset 0 -1px 0 var(--border-strong)}
.faq-q{width:100%;display:flex;align-items:center;gap:10px;text-align:left}
.faq-q .h3{flex:1;color:var(--muted);transition:color .3s}
.faq-item.is-open .faq-q .h3{color:var(--ink)}
.plus{position:relative;width:24px;height:24px;flex:none;transition:transform .45s var(--ease);transform:rotate(90deg)}
.plus::before,.plus::after{content:"";position:absolute;background:var(--muted);border-radius:10px}
.plus::before{left:4px;top:11px;width:16px;height:2px}
.plus::after{left:11px;top:4px;width:2px;height:16px;transition:opacity .3s}
.faq-item.is-open .plus{transform:rotate(180deg)}
.faq-item.is-open .plus::after{opacity:0}
.faq-item .collapse p{padding-top:22px}

/* =====================================================================
   CLOSING (footer)
   ===================================================================== */
.closing{position:relative;overflow:hidden;background:var(--dark);color:var(--on-dark);padding:400px var(--gutter) 60px}
.closing__bg{position:absolute;inset:0}
.closing__bg img{width:100%;height:100%;object-fit:cover}
.closing__inner{position:relative;max-width:var(--container);margin:0 auto;display:flex;flex-direction:column;gap:50px}
.closing__top{display:flex;align-items:flex-end;gap:24px}
.closing__title{width:696px;flex:none;display:flex;flex-direction:column;gap:10px}
.closing__title .h2{color:var(--on-dark);max-width:576px}
.closing__top .lead{width:480px;margin-left:auto}
.closing__body{display:flex;flex-direction:column;gap:10px}
.closing__row{display:flex;gap:10px}
.signup{flex:1;display:flex;gap:40px;padding:16px 32px;background:var(--bg);color:var(--ink)}
.signup__label{height:34px;display:flex;align-items:flex-end;flex:none}
.signup__label .h3{white-space:nowrap}
.signup__form{flex:1;display:flex;flex-direction:column;gap:8px;min-width:0}
.signup__field{position:relative;height:61px}
.signup__field input{width:100%;height:61px;border:0;outline:0;background:var(--surface);padding:20px 140px 20px 20px;font:inherit;font-size:16px;line-height:21px;color:var(--ink)}
.signup__field input::placeholder{color:rgba(var(--dark-rgb),.6)}
.signup__field button{position:absolute;top:5px;right:5px;width:120px;height:51px;background:var(--dark);color:var(--on-dark);font-size:16px;font-weight:500;padding:0 15px}
.signup__note{font-size:14px;line-height:19.6px;color:var(--muted)}
.signup__note a{text-decoration:underline}
.closing__row .big-cta{height:auto}
.closing__foot{display:flex;flex-direction:column;gap:60px}
.foot-card{display:flex;background:var(--surface);color:var(--ink);min-height:308px}
.foot-card__left{width:50%;padding:32px;display:flex;flex-direction:column;gap:24px}
.foot-card__right{width:50%;padding:32px;display:flex;justify-content:center;gap:60px;box-shadow:inset 1px 0 0 var(--border)}
.foot-label{font-size:12px;line-height:16.8px;font-weight:600;letter-spacing:.72px;text-transform:uppercase;font-feature-settings:normal;color:var(--ink)}
.foot-addr{display:flex;flex-direction:column;gap:20px}
.foot-addr p:not(.foot-label){width:160px;font-size:14px;line-height:19.6px;color:var(--muted)}
.foot-social{display:flex;gap:12px}
.foot-social img{width:16px;height:16px;object-fit:contain}
.foot-col{width:184px;display:flex;flex-direction:column;gap:20px}
.foot-col ul{display:flex;flex-direction:column;gap:12px}
.foot-col li{font-size:14px;line-height:19.6px}
.foot-col a{font-size:14px;line-height:19.6px;color:var(--muted);transition:color .25s}
.foot-col a:hover{color:var(--ink)}
.foot-bar{display:flex;align-items:center;justify-content:space-between;gap:30px}
.foot-bar__left{display:flex;align-items:center;gap:30px}
.foot-bar img{width:97px;height:30px;object-fit:contain;object-position:0 50%}
.foot-bar p{font-size:14px;line-height:19.6px;color:var(--on-dark-muted)}
.foot-bar p a{color:var(--on-dark)}

/* ---------- reveal (G-35: invisivel so atras de html.js) ---------- */
html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
html.js .reveal-blur{opacity:0;filter:blur(8px);transition:opacity .9s var(--ease),filter .9s var(--ease)}
html.js .reveal.visible,html.js .reveal-blur.visible{opacity:1;transform:none;filter:none}
html.js .reveal.d1,html.js .reveal-blur.d1{transition-delay:.08s}
html.js .reveal.d2,html.js .reveal-blur.d2{transition-delay:.16s}
html.js .reveal.d3,html.js .reveal-blur.d3{transition-delay:.24s}
html.js .reveal.d4,html.js .reveal-blur.d4{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){
  html.js .reveal,html.js .reveal-blur{opacity:1;transform:none;filter:none;transition:none}
  .logos__track{animation:none}
}

/* =====================================================================
   TABLET (810-1199)
   ===================================================================== */
@media (max-width:1199px){
  .h1{font-size:58px;line-height:63.8px}
  .h2{font-size:42px;line-height:46.2px}
  .br-t{display:inline}

  /* header vira barra fixa com degrade + hamburger */
  .site-header{position:fixed}
  .nav{height:68px;padding:12px var(--gutter);max-width:none;background:linear-gradient(rgba(var(--dark-rgb),.72) 0%,rgba(var(--dark-rgb),0) 100%)}
  .nav__menu,.nav__cta,.mega{display:none}
  .nav__logo{margin-right:auto}
  .burger{display:block;position:relative;width:44px;height:44px;flex:none}
  .burger span{position:absolute;left:12px;width:20px;height:2px;border-radius:10px;background:var(--on-dark);transition:transform .35s var(--ease),top .35s var(--ease)}
  .burger span:first-child{top:15.5px}
  .burger span:last-child{top:26.5px}
  .site-header.is-open .burger span{top:21px}
  .site-header.is-open .burger span:first-child{transform:rotate(45deg)}
  .site-header.is-open .burger span:last-child{transform:rotate(-45deg)}
  .site-header.is-open .nav{background:var(--dark)}
  .site-header.is-open .nav__rule{display:none}
  .mpanel{display:none;background:var(--dark);padding:20px var(--gutter) 32px;box-shadow:inset 0 -1px 0 var(--border-light)}
  .site-header.is-open .mpanel{display:flex;flex-direction:column;gap:32px;align-items:center}
  .mpanel > a,.mpanel__svc > button{font-size:15px;line-height:21px;font-weight:500;letter-spacing:-.3px;color:var(--on-dark)}
  .mpanel__svc{align-self:stretch;display:flex;flex-direction:column;align-items:center;gap:16px}
  .mpanel__svc > button{display:flex;align-items:center;gap:8px}
  .mpanel__svc[aria-expanded="true"] .caret{transform:rotate(180deg)}
  .mpanel__sub{display:none;flex-direction:column;align-items:center;gap:16px;align-self:stretch;padding-bottom:20px;box-shadow:inset 0 -1px 0 var(--border-light)}
  .mpanel__svc.is-open .mpanel__sub{display:flex}
  .mpanel__sub a{font-size:14px;line-height:19.6px;color:var(--on-dark)}
  .mpanel .btn{align-self:stretch}

  .hero--fullbleed h1{font-size:46px}

  #pillars{padding:120px 0 140px}
  .pillars{flex-direction:column-reverse;gap:40px}
  .pillars__text,.pillars__media{width:100%}
  .pillars__text .h2{max-width:none}
  .pillars__media{aspect-ratio:969/977.1}

  .svc-grid{flex-direction:column;gap:60px}

  .fw-grid{grid-template-columns:repeat(2,1fr)}

  .case{height:560px;padding:10px;align-items:flex-end}
  .case::before{background:linear-gradient(rgba(var(--dark-rgb),.4) 0%,rgb(var(--dark-rgb)) 100%)}
  .case__box{width:100%;padding:24px;gap:24px;justify-content:center;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none}
  .case__logo{width:100px;height:25.5px}
  .cases__all{position:static;width:100%}

  #approach{padding:120px 0 100px}
  .approach{flex-direction:column;align-items:stretch;gap:60px}
  .approach__media,.approach__text{width:100%}
  .approach__media{aspect-ratio:969/1282.1}
  .approach__text{gap:80px}
  .approach__text .h2{max-width:594px}

  .tst-grid{flex-direction:column}
  .tcard{flex:none}
  .tcard--video{height:484px}

  .faq{flex-direction:column;gap:36px}
  .faq__side{width:100%}
  .faq-cta{display:none}

  .closing{padding:240px var(--gutter) 60px}
  .closing__top{flex-direction:column;align-items:stretch;gap:24px}
  .closing__title{width:auto}
  .closing__top .lead{width:auto;margin-left:0}
  .signup{flex-direction:column;gap:12px;padding:24px 32px}
  .signup__label{height:auto}
  .foot-card__right{justify-content:flex-start}
  .foot-col{flex:1;width:auto}
  .foot-bar__left{flex:1}
  .foot-bar p{flex:1}
  .foot-bar > p{text-align:right}
}

/* hero canonico no celular: foto em bloco 10/11, sem scrim sobre a pessoa */
@media (max-width:768px){
  .hero.hero--fullbleed{display:block;min-height:auto;padding:0;background:var(--ink)}
  .hero--fullbleed::before{display:none}
  .hero--fullbleed picture{display:block;line-height:0;position:relative;margin:0}
  .hero--fullbleed picture::after{content:"";position:absolute;left:0;right:0;bottom:0;height:42%;pointer-events:none;
    background:linear-gradient(180deg,rgba(var(--dark-rgb),0) 0%,rgba(var(--dark-rgb),.45) 45%,rgba(var(--dark-rgb),.85) 76%,var(--ink) 100%)}
  .hero--fullbleed .hero-bgphoto{position:static;display:block !important;width:100% !important;height:auto !important;aspect-ratio:10/11;object-fit:cover;object-position:center top;margin:0}
  .hero--fullbleed .hero-inner{padding:0 22px 52px;margin-top:-96px}
}

/* =====================================================================
   CELULAR (<=809)
   ===================================================================== */
@media (max-width:809px){
  .h1{font-size:36px;line-height:39.6px}
  .h2{font-size:32px;line-height:35.2px}
  .br-d,.br-t{display:none}

  .hero--fullbleed h1{font-size:34px;line-height:1.12}
  .hero-lead{font-size:16px;line-height:24px}
  .hero-cta{flex-direction:column;gap:12px;align-self:stretch}
  .hero-cta .btn{width:100%}

  .logos__mask{max-width:none}

  #pillars{padding:60px 0}
  .pillars{gap:36px}
  .pillars__text{gap:36px}
  .steps{gap:36px}
  .pillars__media{aspect-ratio:350/440}
  .founder{flex-direction:column;align-items:flex-start;gap:20px}
  .founder__who{flex:none}

  #services{padding:60px 0}
  .services{gap:36px}
  .svc-grid{gap:36px}

  #framework{padding:60px 0}
  .framework{gap:46px}
  .fw-grid{grid-template-columns:1fr}

  #case-studies{padding:60px 0}
  .cases-sec{gap:36px}
  .cases{gap:20px}
  .case{height:640px}

  #approach{padding:60px 0}
  .approach{gap:44px}
  .approach__media{aspect-ratio:350/463.1}
  .approach__text{gap:36px}

  #testimonials{padding:60px 0}
  .tcard--video{height:500px}

  #faq{padding:60px 0}
  .faq{gap:24px}

  .closing{padding:240px var(--gutter) 60px}
  .closing__body{gap:10px}
  .closing__row{flex-direction:column}
  .signup{padding:20px;gap:24px}
  .closing__row .big-cta{width:100%;height:140px}
  .closing__body{margin-top:-14px}
  .foot-card{flex-direction:column;min-height:0}
  .foot-card__left,.foot-card__right{width:100%;padding:20px}
  .foot-card__right{flex-direction:column;gap:40px;box-shadow:inset 0 1px 0 var(--border)}
  .foot-bar,.foot-bar__left{flex-direction:column;align-items:flex-start;gap:30px}
  .foot-bar > p{text-align:left}
}

/* =====================================================================
   ETAPA 3 (site-personalizer, 2026-10-08) - chiaradia-sapag
   So o minimo para as secoes novas e adaptadas, reusando tokens e
   padroes do proprio Elyte (G-22). Paleta e fontes: etapas 5 e 5b.
   ===================================================================== */

/* logo em texto (sem logo enviado) */
.nav__logo.nav__logo--txt{width:auto;height:auto;display:flex;align-items:center}
.logo-txt{display:flex;flex-direction:column;gap:3px;color:var(--on-dark);line-height:1}
.logo-txt b{font-size:19px;line-height:20px;font-weight:500;letter-spacing:-.04em;white-space:nowrap}
.logo-txt span{font-size:10px;line-height:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--on-dark-muted);white-space:nowrap}

/* mega menu: altura automatica, 3 colunas (uma por area) + card de CTA */
.mega{height:auto;align-items:stretch}
.mega__list{padding:20px 0 26px;gap:24px}
.mega__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.mega__col{display:flex;flex-direction:column;gap:18px;min-width:0}
.mega__col .mega__item{align-items:flex-start}
.mega__subs{display:flex;flex-direction:column;gap:2px;padding-left:60px}
.mega__subs a{display:block;padding:6px 0;font-size:14px;line-height:19.6px;color:var(--muted);transition:color .25s}
.mega__subs a:hover{color:var(--ink)}
.mega__cta{width:340px;height:auto;min-height:348px}
.mega__cta .h3-lg{margin-top:auto}

/* painel mobile: areas agrupadas */
.mpanel__area{font-weight:600}
.mpanel__meta{display:none}

/* Sobre */
.pillars__lead{max-width:560px}
.founder__avatar--mono{display:flex;align-items:center;justify-content:center;background:var(--dark);color:var(--on-dark);font-size:15px;font-weight:500;letter-spacing:-.02em;box-shadow:inset 0 0 0 1px var(--border-light)}

/* Servicos: lista de situacoes linkadas abaixo do card */
.services__intro{max-width:696px}
.svc__links{display:flex;flex-direction:column}
.svc__links a{display:block;padding:12px 0;font-size:15px;line-height:21px;font-weight:500;letter-spacing:-.3px;color:var(--ink);box-shadow:inset 0 -1px 0 var(--border);transition:color .25s}
.svc__links a:hover{color:var(--muted)}

/* Socios (doadoras: .pillars__media + .founder e .tcard) */
.equipe{padding:120px 0 112px}
.equipe-grid{display:flex;gap:10px;align-items:flex-start}
.socio{flex:1;min-width:0;display:flex;flex-direction:column;gap:24px}
.socio__media{position:relative;height:500px;overflow:hidden;background:var(--dark);display:flex;flex-direction:column;justify-content:flex-end;padding:8px;color:rgba(255,255,255,.14)}
.socio__media::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(var(--dark-rgb),0) 60%,rgb(var(--dark-rgb)) 100%);z-index:1}
.socio__sil{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:46%;height:auto}
.socio__tag{position:absolute;top:16px;left:16px;z-index:2;padding:6px 10px;color:var(--on-dark);background:var(--glass-light);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
.socio__media .founder{z-index:2}
.founder--static:hover{background:var(--glass-light);color:var(--on-dark)}
.founder--static:hover .caps{color:var(--on-dark-muted)}
.socio__cred{display:flex;flex-direction:column}
.socio__cred li{padding:12px 0;font-size:16px;line-height:24px;color:var(--muted);box-shadow:inset 0 -1px 0 var(--border)}
.tcard--dark{background:var(--dark);color:var(--on-dark)}
.tcard--dark > .caps{color:var(--on-dark-muted)}
.tcard__quote{font-size:32px;line-height:38px;font-weight:400;font-style:italic;letter-spacing:-.04em;color:var(--on-dark)}
.tcard__go{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.who--light{box-shadow:inset 1px 0 0 var(--white)}
.who--light .h3{color:var(--on-dark)}
.who--light .caps{color:var(--on-dark-muted)}
.tcard__go .arw{color:var(--on-dark)}

/* Localizacao (doadora: .case dos Case studies) - mapa no lugar da foto */
.local{padding:120px 0}
.case.case--map{padding:12px}
.case--map::before{display:none}
.case__map{position:absolute;inset:0;background:var(--bg)}
.case__map iframe{width:100%;height:100%;border:0;display:block}
.case--map .case__box{background:var(--dark);-webkit-backdrop-filter:none;backdrop-filter:none;box-shadow:none;z-index:2}
.case__label{color:var(--on-dark-muted)}
.case--map .case__copy p + p{margin-top:0}

/* Rodape: caixa do WhatsApp no lugar da newsletter (sem formulario) */
.signup__field--wa{display:flex;align-items:center;gap:12px;height:61px;padding:5px 5px 5px 20px;background:var(--surface);color:var(--ink)}
.signup__num{flex:1;min-width:0;font-size:18px;line-height:24px;white-space:nowrap}
.signup__btn{display:inline-flex;align-items:center;height:51px;padding:0 18px;background:var(--dark);color:var(--on-dark);font-size:16px;font-weight:500;white-space:nowrap;transition:background-color .3s var(--ease)}
.signup__field--wa:hover .signup__btn{background:rgba(var(--dark-rgb),.85)}
.foot-card__right{gap:40px}
.foot-col{width:auto;flex:1;min-width:0}
.foot-col li{color:var(--muted)}
.foot-addr p:not(.foot-label){width:auto;max-width:300px}
.foot-social a{display:inline-flex;color:var(--ink)}
.logo-txt--foot{color:var(--on-dark)}

/* WhatsApp flutuante (G-10) */
.whatsapp-float{position:fixed;bottom:24px;right:24px;width:60px;height:60px;background:#25D366;color:#fff;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;box-shadow:0 6px 24px rgba(0,0,0,.18),0 2px 8px rgba(37,211,102,.32);z-index:999;transition:transform .25s ease}
.whatsapp-float:hover{transform:scale(1.06)}
.whatsapp-float svg{width:32px;height:32px;fill:currentColor}
.whatsapp-float::before{content:"";position:absolute;inset:-6px;border-radius:50%;background:rgba(37,211,102,.32);animation:wa-pulse 2.4s ease-out infinite;z-index:-1}
@keyframes wa-pulse{0%{transform:scale(.9);opacity:.7}100%{transform:scale(1.6);opacity:0}}

/* titulos de acordeao em <button> quebram linha (hello-elementor poe nowrap em button) */
.acc__head,.acc__head span,.faq-q,.faq-q span{white-space:normal}
h2,h3{text-wrap:balance}

/* ---------- TABLET ---------- */
@media (max-width:1199px){
  .equipe{padding:120px 0 112px}
  .equipe-grid{flex-direction:column;gap:60px;align-items:stretch}
  .tcard--dark{flex:none;height:auto;min-height:320px;gap:40px}
  .local{padding:120px 0}
  .case.case--map{height:auto;flex-direction:column;align-items:stretch;padding:0}
  .case__map{position:relative;inset:auto;height:420px}
  .case--map .case__box{width:100%;padding:32px 24px;background:var(--dark)}
  .site-header.is-open .mpanel{max-height:calc(100vh - 68px);max-height:calc(100dvh - 68px);overflow-y:auto;-webkit-overflow-scrolling:touch}
  .mpanel__meta{display:block;font-size:13px;line-height:18px;color:var(--on-dark-muted);text-align:center;max-width:300px}
  .foot-card__right{flex-wrap:wrap}
}

/* ---------- CELULAR ---------- */
@media (max-width:809px){
  .equipe{padding:60px 0}
  .equipe-grid{gap:44px}
  .socio__media{height:440px}
  .tcard__quote{font-size:26px;line-height:31px}
  .local{padding:60px 0}
  .case__map{height:360px}
  .signup__field--wa{height:auto;flex-direction:column;align-items:stretch;padding:12px;gap:10px}
  .signup__num{font-size:17px;text-align:center}
  .signup__btn{justify-content:center}
  .foot-card__right{gap:32px}
  .whatsapp-float{width:54px;height:54px;bottom:18px;right:18px}
  .whatsapp-float svg{width:28px;height:28px}
}

/* =========================================================
   ETAPA 3b visual-copy-reviewer (2026-10-08). Pass 1.5: so o que passava do Max de
   pipeline/tipografia-canonica.md, reduzido ao alvo (faixas <=640, 641-1024, 1025-1919, >=1920).
   Pass 1: 2 dos 9 H2 (areas e CTA final) tinham 3 linhas de 1680 a 2560; com 40 os 9 ficam em 2.
   Mesma decisao do christian-simons (mesmo Elyte). Paleta, fontes e letter-spacing intocados.
   ========================================================= */
/* H2 de secao: 52 em 1025-1919 (Max 48) e com 3 linhas a >=1920 -> 40 (alvo FHD 36-40, alvo 2K 40-46);
   42 em 641-1024 (Max tablet 40) -> 32 (alvo 28-32). Entrelinha 1,1 do Elyte mantida. */
@media (min-width:1025px){ .h2{font-size:40px;line-height:44px} }
@media (min-width:641px) and (max-width:1024.98px){ .h2{font-size:32px;line-height:35.2px} }
/* celular: H3 grande 24 (Max 22) -> 20; texto de card 16 (Max 15) -> 15;
   eyebrow 14 (Max 13) -> 13; meta do rodape 14 (Max 13) -> 13 */
@media (max-width:640px){
  .h3-lg{font-size:20px;line-height:24px;letter-spacing:-.8px}
  .svc__title{height:24px}
  .svc__media:hover .svc__title span{transform:translateY(-31.2px)}
  .svc .p16,.fw .p16,.case__copy p{font-size:15px;line-height:22px}
  .eyebrow{font-size:13px;line-height:18.2px}
  .signup__note,.foot-bar p{font-size:13px;line-height:18.2px}
}

/* =========================================================
   ETAPA 3c responsive-tuner (2026-10-08). So CSS responsivo, medido com Playwright por CDP
   (celular com is_mobile/touch e innerWidth conferido) de 360 a 2560. Imagens, paleta, familias
   de fonte e copy intocadas; body com overflow-x:clip (G-33) e reveal atras de html.js (G-35) intactos.
   Gabarito: christian-simons (mesmo Elyte, 3c de 2026-10-06).
   ========================================================= */
/* Fase 1.5, abaixo do Min: intro de secao (linha Body lead) 16 -> 17 em 1025-1919 e 18 em >=1920;
   em >=1920 .h3 20 -> 22, .caps 12 -> 13 e links/enderecos do cartao do rodape 14 -> 15 (Min 2K de Card) */
@media (min-width:1025px){ .services__intro{font-size:17px;line-height:25.5px} }
@media (min-width:1920px){
  .services__intro{font-size:18px;line-height:27px}
  .h3{font-size:22px;line-height:26.4px;letter-spacing:-.44px}
  .caps{font-size:13px;line-height:18.2px}
  .foot-col a,.foot-col li,.foot-addr p:not(.foot-label){font-size:15px;line-height:21px}
}

/* Hero 769-1199: a coluna de 640px chegava a 79% da tela a 810, na faixa em que o par 21:9 da 4b poe o
   cliente. Encolhe com a tela, nunca alarga (G-31). H1 tablet 46 -> 40 (alvo 40-44) em 769-1024. */
@media (min-width:769px) and (max-width:1199.98px){
  .hero.hero--fullbleed .hero-inner{grid-template-columns:minmax(0,min(640px,calc(60vw - 24px)))}
}
@media (min-width:769px) and (max-width:1024.98px){ .hero.hero--fullbleed h1{font-size:40px} }
/* eyebrow do hero quando quebra: o ponto entra na 1a linha (ficava solto a esquerda do bloco de 2 linhas) */
@media (max-width:1199.98px){
  .hero.hero--fullbleed .eyebrow{display:block;text-wrap:balance}
  .hero.hero--fullbleed .eyebrow .dot{display:inline-block;vertical-align:middle;margin:-2px 10px 0 0}
}
/* Hero empilhado (<=768): texto centralizado (G-06). Imagem 10/11, fade e margem -96px do contrato intocados. */
@media (max-width:768px){
  .hero.hero--fullbleed .hero-inner{justify-content:center}
  .hero.hero--fullbleed .hero-copy{align-items:center;text-align:center}
  .hero.hero--fullbleed .hero-cta{justify-content:center}
}
/* Tablet em pe 641-768: foto 10/11 com teto de altura e botoes lado a lado (CTA saia da 1a tela a 768x1024) */
@media (min-width:641px) and (max-width:768px){
  .hero.hero--fullbleed .hero-bgphoto{max-height:max(400px,62vh)!important;max-height:max(400px,62svh)!important}
  .hero.hero--fullbleed .hero-cta{flex-direction:row;flex-wrap:wrap;align-items:center;align-self:center}
  .hero.hero--fullbleed .hero-cta .btn{width:auto}
}
/* Celular (<=640): H1 34 -> 32 (alvo 32-36) com entrelinha 1,05; respiros menores; o 2o botao fica na
   largura do texto, centralizado, fora da faixa do WhatsApp flutuante (ficava embaixo dele a 390).
   H2 32 -> 28 (alvo 26-28); G-30: h1-h4 com pretty (wrap antes = fallback). */
@media (max-width:640px){
  .hero.hero--fullbleed .hero-copy{gap:16px}
  .hero.hero--fullbleed h1{font-size:32px;line-height:1.05}
  .hero.hero--fullbleed .hero-cta{margin-top:8px;gap:10px;align-items:center}
  .hero.hero--fullbleed .hero-cta .btn--white{align-self:stretch}
  .hero.hero--fullbleed .hero-cta .btn-ghost-dark{align-self:center;width:auto}
  .h2{font-size:28px;line-height:31px}
  h1,h2,h3,h4,.h3,.h3-lg{text-wrap:wrap;text-wrap:pretty}
}
@media (max-width:380px){
  .hero.hero--fullbleed .hero-inner{margin-top:-116px}
  .hero.hero--fullbleed .hero-copy{gap:12px}
  .hero.hero--fullbleed .hero-lead{font-size:15px;line-height:22px}
  .h2{font-size:26px;line-height:29px}
}

/* G-06: centralizacao no celular nos seletores REAIS devolvidos pelo detector a 360, 390 e 414. Vai ate 809
   (celular do Elyte, tudo ja em coluna unica) para 641-809 nao ficar misto. Numero+titulo do processo e
   pergunta+icone do FAQ empilham; o filete lateral de .who vira filete de topo. */
@media (max-width:809.98px){
  .sec-head{align-items:center;text-align:center}
  .pillars__text,.step{align-items:center;text-align:center}
  .founder{align-items:center;text-align:center}
  .founder__who{align-items:center}
  .svc{text-align:center}
  .svc__title{text-align:center}
  .svc__links a{text-align:center}
  .socio{text-align:center}
  .socio__cred li{text-align:center}
  .fw{justify-self:center;align-items:center;text-align:center;max-width:none}
  .tcard{text-align:center;align-items:center}
  .tcard__go{flex-direction:column;align-items:center;gap:16px}
  .who{align-items:center;padding-left:0;padding-top:16px;box-shadow:inset 0 1px 0 var(--border-strong)}
  .who--light{box-shadow:inset 0 1px 0 var(--white)}
  .approach__media{align-items:center}
  .acc{text-align:center}
  .acc__head{flex-direction:column-reverse;align-items:center;gap:8px;text-align:center}
  .acc__head .h3-lg,.acc__num{flex:none;text-align:center}
  .case__box,.case__body,.case__copy{align-items:center;text-align:center}
  .big-cta__label{text-align:center}
  .faq-q{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:14px}
  .faq-q .h3{flex:none}
  .faq-item .collapse p{text-align:center}
  .closing__top,.closing__title{align-items:center;text-align:center}
  .signup{align-items:center;text-align:center}
  .signup__form{align-self:stretch}
  .foot-card__left{align-items:center}
  .foot-addr{align-items:center;text-align:center}
  .foot-social{justify-content:center}
  .foot-card__right{align-items:center}
  .foot-col{align-items:center;text-align:center}
  .foot-col ul{align-items:center}
  .foot-bar,.foot-bar__left{align-items:center;text-align:center}
  .foot-bar > p{text-align:center}
}

/* =========================================================
   ETAPA 5 palette-mapper (2026-10-08). So COR: tokens no :root (marinho, creme e o ouro do logo em 3 papeis).
   Aqui so quem consome o ouro; layout, copy, fonte e imagem intocados. Gabarito: christian-simons (mesmo Elyte).
   ========================================================= */
/* eyebrow sobre claro no ouro escurecido (5,10:1 no --bg); o do hero segue no branco quente (.hero--fullbleed .eyebrow vence).
   Sobre a banda final (foto de fundo, sem scrim) vai o ouro claro de maior margem (9,70:1 contra o marinho). */
.eyebrow{color:var(--gold-text)}
.eyebrow--light{color:var(--accent-soft)}
/* numeral romano: o anel vira ouro (nao-textual); o numeral segue no --ink */
.step__num{box-shadow:inset 0 0 0 1px var(--gold)}
/* icones dos diferenciais (mascara CSS): ouro escurecido, 5,10:1 */
.fw__icon{background:var(--gold-text)}
/* rotulos do cartao branco do rodape: ouro escurecido, 5,78:1 no branco */
.foot-label{color:var(--gold-text)}
/* botao "Abrir conversa" da faixa do WhatsApp: preenchimento ouro com texto --ink (5,96:1); branco reprovaria (2,98:1) */
.signup__btn{background:var(--gold);color:var(--ink)}
.signup__field--wa:hover .signup__btn{background:var(--gold-light);color:var(--ink)}

/* =========================================================
   ETAPA 6 motion-designer (2026-10-08). Vibe profissional + moderna; tom confiavel e firme. O movimento do
   Elyte fica como esta: reveal .9s (fade + 24px), titulos com blur 8px, stagger .08/.16s, seta que troca,
   zoom 1,07 e titulo que rola nos cards das areas, acordeoes .45s. Sem parallax (hero e o LCP), sem contador
   (o "5 anos" e o "300 a 500" nao ganham nada contando), sem hover-lift (fora do vocabulario do Elyte, G-22).
   Gabarito: christian-simons (mesmo Elyte, etapa 6 de 2026-10-06). So movimento; cada item apaga sozinho.
   O par JS deste bloco e o <script> "ETAPA 6" antes do </body>.
   ========================================================= */
/* 6.1 Rolagem suave nas ancoras do menu (vibe moderna). Desligada sob prefers-reduced-motion (6.5). So liga
       depois do load (classe posta pelo script ETAPA 6): com smooth desde o inicio, quem abre o link com #faq
       parava 115px antes do alvo (medido a 390 e 1680), porque o salto inicial animava ate um alvo antigo. */
html.e6-suave{scroll-behavior:smooth}
/* 6.2 Pouso de ancora abaixo de 1200, onde a barra e fixa com 68px: a 360 e 390 o salto para #faq deixava o
       eyebrow em y=60, sob a barra (medido). scroll-margin muda so o ponto de pouso, nao o layout. */
@media (max-width:1199.98px){ section[id],footer[id]{scroll-margin-top:68px} }
/* 6.3 Stagger nos 4 passos do Sobre (I a IV entravam juntos, delay 0s medido). Mesma escala do template. */
html.js .steps > .step.reveal:nth-child(2){transition-delay:.08s}
html.js .steps > .step.reveal:nth-child(3){transition-delay:.16s}
html.js .steps > .step.reveal:nth-child(4){transition-delay:.24s}
/* 6.4 WhatsApp flutuante: o halo pulsava sem fim (wa-pulse infinite). O canone proibe pulso infinito em CTA.
       3 ciclos e para (precedente adriana-monteiro e christian-simons). */
.whatsapp-float::before{animation:wa-pulse 2.4s ease-out 3 forwards}
/* 6.5 prefers-reduced-motion (canone, secao 8). O template ja desligava o reveal; faltavam o halo, a rolagem
       suave e as transicoes de hover, acordeao, menu e seta (.25s a .7s, medido). */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;transition-delay:0s !important;scroll-behavior:auto !important}
  .whatsapp-float::before{animation:none}
}
/* ==== FOTOS E LOGO DO CLIENTE (2026-10-09) ==== */
.logo-mark{height:40px;width:auto;flex:none;display:block}
.nav__logo.nav__logo--txt{gap:12px}
.logo-foot{display:flex;align-items:center;gap:12px}
.socio__media--foto{padding:8px}
.socio__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 18%;filter:none}
.socio__link{color:var(--gold-text);text-decoration:underline;text-underline-offset:3px}
.socio__link:hover{color:var(--ink)}
@media (max-width:640px){.logo-mark{height:34px}.nav__logo.nav__logo--txt{gap:10px}}
/* ==== HEADER BRANCO DE PONTA A PONTA (2026-10-09, pedido do operador) ====
   Faixa branca full-bleed (G-23: o clamp continua só no .nav); deixa de flutuar sobre o hero e ocupa o próprio espaço.
   Logo na versão marinho; menu, botão e hamburger em --ink. Substitui o degradê de topo do HERO INTERINO. */
.site-header{position:relative;background:#fff;box-shadow:0 1px 0 var(--border)}
.nav__rule{display:none}
.nav__menu > li > a,.nav__svc{color:var(--ink)}
.nav__menu > li > a:hover,.nav__svc:hover,.nav__svc[aria-expanded="true"]{color:var(--gold-text)}
.site-header .logo-txt{color:var(--ink)}
.site-header .logo-txt span{color:var(--muted)}
.nav__cta.btn--outline-light{color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.nav__cta.btn--outline-light:hover{background:var(--ink);color:#fff}
.mega{box-shadow:0 16px 40px rgba(var(--dark-rgb),.14)}
@media (max-width:1199px){
  .site-header{position:fixed;top:0;left:0;right:0}
  .site-header .nav,.site-header.is-open .nav{background:#fff}
  .burger span{background:var(--ink)}
  body{padding-top:68px}
}
@media (max-width:768px){
  .hero--fullbleed picture::before{display:none}
}
/* ==== HEADER SÓ COM O LOGO + FOOTER 25% MENOR (2026-10-09, pedido do operador) ====
   Header: o nome em texto saiu (o link mantém aria-label com o nome completo); símbolo maior.
   Footer: 1.165 px -> ~870 px a 1920 (-25%), tirando do vão de fundo antes do título e dos espaçamentos; tipografia intocada. */
.site-header .logo-mark{height:48px}
@media (max-width:1199px){.site-header .logo-mark{height:40px}}
.closing{padding-top:160px;padding-bottom:48px}
.closing__inner{gap:32px}
.closing__foot{gap:36px}
/* ==== FOOTER CHAPADO EM MARINHO, SEM CARDS (2026-10-09, pedido do operador) ====
   Substitui a banda com foto, o card do WhatsApp, o big-cta e o card branco. Mesmo marinho do hero. */
.closing.closing--flat{background:var(--color-navy);padding:88px var(--gutter) 32px !important}
.closing--flat .closing__inner{gap:56px !important}
.cf-top{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:64px;align-items:end}
.cf-title{display:flex;flex-direction:column;gap:16px}
.cf-title .h2{color:var(--color-bg) !important;max-width:600px}
.cf-cta{display:flex;flex-direction:column;gap:24px}
.cf-actions{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.cf-phone{font-family:var(--font-sans);font-weight:500;font-size:17px;color:var(--color-bg);border-bottom:1px solid var(--color-gold);padding-bottom:2px}
.cf-phone:hover{color:var(--color-gold-light)}
.cf-grid{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:48px;padding-top:48px;border-top:1px solid rgba(251,248,243,.14)}
.cf-col{display:flex;flex-direction:column;gap:12px}
.cf-col .foot-label{margin-bottom:4px}
.cf-label-gap{margin-top:16px}
.cf-col p,.cf-col li{color:rgba(251,248,243,.78) !important}
.cf-col ul{display:flex;flex-direction:column;gap:10px}
.cf-col a{color:rgba(251,248,243,.78);transition:color .25s}
.cf-col a:hover{color:var(--color-gold-light)}
.closing--flat .foot-social{display:flex;gap:16px;margin-top:8px}
.closing--flat .foot-social a{color:var(--color-bg)}
.closing--flat .foot-social img{filter:brightness(0) invert(1)}
.closing--flat .foot-bar{display:flex;justify-content:space-between;align-items:center;gap:32px;padding-top:28px;border-top:1px solid rgba(251,248,243,.14);margin:0}
.closing--flat .foot-bar__left{display:flex;align-items:center;gap:32px}
.closing--flat .foot-bar p{font-size:14px !important;line-height:1.5 !important;color:rgba(251,248,243,.62) !important}
.closing--flat .foot-bar a{color:var(--color-bg)}
@media (max-width:1024px){
  .cf-top{grid-template-columns:1fr;gap:32px}
  .cf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 32px}
  .closing--flat .foot-bar,.closing--flat .foot-bar__left{flex-direction:column;align-items:flex-start;gap:16px}
}
@media (max-width:640px){
  .closing.closing--flat{padding:64px var(--gutter) 28px !important}
  .closing--flat .closing__inner{gap:40px !important}
  .cf-top,.cf-title,.cf-cta{text-align:center;align-items:center}
  .cf-title .h2{margin:0 auto}
  .cf-title h2.h2::after{margin-left:auto;margin-right:auto}
  .cf-actions{flex-direction:column;gap:16px}
  .cf-grid{grid-template-columns:1fr;gap:32px;text-align:center}
  .cf-col{align-items:center}
  .closing--flat .foot-social{justify-content:center}
  .closing--flat .foot-bar,.closing--flat .foot-bar__left{align-items:center;text-align:center}
}
/* ==== AJUSTES DE LAYOUT (2026-10-09, pedidos do operador) ==== */
/* header acompanha a rolagem também no desktop */
@media (min-width:1200px){.site-header{position:sticky;top:0}}
/* FAQ: card "A sua dúvida não está aqui?" colado ao título */
.faq__side{justify-content:flex-start !important;gap:40px}
.faq__side .faq-cta{height:auto;min-height:120px}
/* Processo: sem card sobre a foto; passos em tópicos abertos */
.approach__text{gap:48px !important}
.topics{list-style:none;display:flex;flex-direction:column}
.topic{display:grid;grid-template-columns:44px minmax(0,1fr);gap:20px;padding:22px 0;border-top:1px solid var(--border)}
.topic:last-child{border-bottom:1px solid var(--border)}
.topic__num{width:36px;height:36px;border:1px solid var(--color-gold,#B79224);border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-family:var(--font-body);font-weight:600;font-size:.875rem;color:var(--ink)}
.topic__body{display:flex;flex-direction:column;gap:8px}
/* Localização: mapa à esquerda e card azul à direita, separados */
.loc-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:24px;margin-top:8px}
.loc-card{min-width:0}
.loc-card--map{min-height:520px;background:var(--surface);overflow:hidden}
.loc-card--map iframe{display:block;width:100%;height:100%;min-height:520px;border:0}
.loc-card--info.case__box{position:static !important;inset:auto !important;width:auto !important;max-width:none !important;height:auto !important;margin:0 !important;
  background:var(--dark);color:var(--on-dark);padding:40px;display:flex;flex-direction:column;justify-content:space-between;gap:32px}
.loc-card--info .h3-lg{color:var(--color-bg,#FBF8F3) !important}
.loc-actions{display:flex;flex-wrap:wrap;align-items:center;gap:20px}
@media (max-width:1024px){
  .loc-grid{grid-template-columns:1fr}
  .loc-card--map,.loc-card--map iframe{min-height:360px}
  .loc-card--info.case__box{padding:32px 24px}
}
@media (max-width:640px){.loc-actions{flex-direction:column}}
/* Sócios: só os dois sócios, ocupando a largura */
.equipe-grid{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.equipe-grid .socio__media{height:600px}
@media (max-width:767.98px){.equipe-grid{grid-template-columns:1fr}.equipe-grid .socio__media{height:480px}}
@media (min-width:1200px){section[id],footer[id]{scroll-margin-top:96px}}
/* ==== HERO COM AS IMAGENS DO OPERADOR (2026-10-09): par desktop 1916x821 e mobile 1024x1536, sem pessoa ==== */
@media (max-width:768px){.hero--fullbleed .hero-bgphoto{object-position:50% 52% !important}}
@media (min-width:769px){.hero--fullbleed::before{background:linear-gradient(90deg,rgba(var(--dark-rgb),.95) 0%,rgba(var(--dark-rgb),.9) 30%,rgba(var(--dark-rgb),.66) 50%,rgba(var(--dark-rgb),.14) 68%,rgba(var(--dark-rgb),.24) 100%)}}
/* FAQ: coluna da esquerda (título + card) acompanha a rolagem, logo abaixo do header fixo (2026-10-09) */
@media (min-width:1200px){.faq{align-items:flex-start !important}.faq__side{position:sticky;top:120px;align-self:flex-start}}
/* Sócios: seção inteira centralizada (2026-10-09, pedido do operador) */
#socios .sec-head{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
#socios .sec-head p{margin-left:auto;margin-right:auto}
#socios h2.h2::after{margin-left:auto;margin-right:auto}
#socios .socio{text-align:center;align-items:stretch}
#socios .founder{justify-content:center;text-align:center}
#socios .founder__who{align-items:center}
#socios .socio__cred li{text-align:center}
/* Como trabalhamos: seção inteira centralizada (2026-10-09, pedido do operador) */
#framework .sec-head{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
#framework .sec-head p{margin-left:auto;margin-right:auto}
#framework h2.h2::after{margin-left:auto;margin-right:auto}
#framework .fw-grid{justify-items:center}
#framework .fw{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
#framework .fw__body{align-items:center}
#framework .fw__body p{margin-left:auto;margin-right:auto}
/* Áreas de atuação: seção centralizada + título do card com troca no hover medida em em (2026-10-09) */
#services .sec-head{align-items:center;text-align:center;margin-left:auto;margin-right:auto}
#services .sec-head p{margin-left:auto;margin-right:auto}
#services h2.h2::after{margin-left:auto;margin-right:auto}
#services .svc{text-align:center}
#services .svc .p16{margin-left:auto;margin-right:auto}
#services .svc .badges{justify-content:center}
#services .svc__links a{text-align:center}
.svc__title{height:1.2em !important;text-align:center;white-space:nowrap}
.svc__title span{line-height:1.2em}
.svc__title span + span{margin-top:.3em !important}
.svc__media:hover .svc__title span{transform:translateY(-1.5em) !important}
/* Sobre em grade (2026-10-09, pedido do operador): texto + I e II ao lado da foto (mesma altura);
   III embaixo à esquerda e IV embaixo da foto, alinhados. No celular: texto, I a IV, foto. */
.pillars.pillars--grid{display:grid !important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:56px;row-gap:48px;
  grid-template-areas:"text media" "s3 s4";align-items:stretch}
.pillars--grid .pillars__text{grid-area:text;width:auto !important;gap:36px}
.pillars--grid .steps{gap:32px}
.pillars--grid .pillars__media{grid-area:media;width:auto !important;aspect-ratio:auto !important;height:auto;min-height:100%}
.pillars--grid .pillars__media > img{object-position:50% 18%}
.pillars--grid .pillars__s3{grid-area:s3}
.pillars--grid .pillars__s4{grid-area:s4}
@media (max-width:1024px){
  .pillars.pillars--grid{grid-template-columns:1fr;grid-template-areas:"text" "s3" "s4" "media";row-gap:32px}
  .pillars--grid .pillars__media{min-height:0;aspect-ratio:4/5 !important}
}
@media (max-width:640px){.pillars--grid .pillars__media{aspect-ratio:350/430 !important}}
.pillars__media .founder:not(:hover){background:rgba(var(--dark-rgb),.78)}
.pillars__media .founder__who .h3{white-space:nowrap}
/* Áreas de atuação: descrição, badges e lista começam na mesma linha nos 3 cards (subgrid, 2026-10-09) */
@media (min-width:1025px){
  #services .svc-grid{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:10px;row-gap:0}
  #services .svc{display:grid !important;grid-row:span 4;grid-template-rows:subgrid;row-gap:20px}
  #services .svc .badges{align-self:start}
}
/* FAQ: card "A sua dúvida não está aqui?" em uma linha (2026-10-09) */
.faq__side .faq-cta{flex-direction:row-reverse !important;align-items:center !important;justify-content:space-between;gap:16px;height:auto !important;min-height:0 !important;padding:16px 20px !important}
.faq__side .faq-cta__txt{flex-direction:row !important;align-items:baseline;gap:6px;flex-wrap:nowrap;white-space:nowrap}
.faq__side .faq-cta__txt b{font-size:15px !important}
.faq__side .faq-cta__txt span{font-size:14px !important}
@media (max-width:640px){.faq__side .faq-cta__txt{flex-wrap:wrap;white-space:normal;justify-content:center}}
.faq__side .faq-cta{padding:14px 16px !important;gap:12px}
.faq__side .faq-cta__txt{gap:5px;min-width:0}
.faq__side .faq-cta__txt b{font-size:14px !important}
.faq__side .faq-cta__txt span{font-size:13px !important}
/* bolinhas numeradas (I-IV em O escritório, 1-4 em Como funciona): marinho com número dourado (2026-10-09) */
.step__num,.topic__num{background:var(--color-navy,#091A36) !important;color:var(--color-gold,#B79224) !important;
  box-shadow:none !important;border:0 !important;font-weight:600 !important}
/* Como trabalhamos: cada item num card marinho (2026-10-09) */
#framework .fw-grid{gap:20px !important;align-items:stretch;justify-items:stretch !important}
#framework .fw{max-width:none !important;width:100%;height:100%;background:var(--color-navy,#091A36);padding:40px 28px;gap:24px !important;justify-content:flex-start}
#framework .fw .h3,#framework .fw h3{color:var(--color-bg,#FBF8F3) !important}
#framework .fw p{color:rgba(251,248,243,.82) !important}
#framework .fw__icon{background:var(--color-gold,#B79224) !important}
@media (max-width:1024px){#framework .fw-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){#framework .fw-grid{grid-template-columns:1fr}#framework .fw{padding:32px 22px}}
/* badges das áreas clicáveis (decisão do operador em 2026-10-09; exceção registrada à regra "badge não é link") */
.badge--link{cursor:pointer;text-decoration:none}
.badge--link:hover{background:var(--color-navy,#091A36);border-color:var(--color-navy,#091A36);color:var(--color-bg,#FBF8F3)}
.badge--link:focus-visible{outline:2px solid var(--color-gold,#B79224);outline-offset:2px}
/* seta no fim de cada página de serviço da lista das áreas (2026-10-09): mostra que é clicável */
.svc__links a::after{content:"";display:inline-block;width:15px;height:15px;margin-left:8px;vertical-align:-2px;background:var(--color-gold,#B79224);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h9M8.5 4.5 12 8l-3.5 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h9M8.5 4.5 12 8l-3.5 3.5' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center/contain;transition:transform .25s var(--ease)}
.svc__links a:hover::after{transform:translateX(4px)}
/* cards de área: sem véu azul em cima; o degradê fica só no rodapé, atrás do nome da área (2026-10-09) */
.svc__media::before{background:linear-gradient(180deg,rgba(var(--dark-rgb),0) 0%,rgba(var(--dark-rgb),0) 58%,rgba(var(--dark-rgb),.55) 78%,rgba(var(--dark-rgb),.92) 100%) !important}
/* card do Sobre: "Conte o que aconteceu" numa linha, colado à seta (2026-10-09) */
.pillars__media .founder{gap:14px}
.pillars__media .founder__go{white-space:nowrap;gap:6px;flex:none;margin-left:auto}
@media (min-width:1025px) and (max-width:1199px){.pillars__media .founder__avatar{display:none}}
@media (max-width:1024px){.pillars__media .founder__go{margin-left:auto;margin-right:auto;justify-content:center;align-self:center}}
/* cards de área: imagem e degradê encaixados no card (sem frações de pixel que expunham o fundo marinho na borda) */
.svc__media{background:transparent !important}
.svc__media > img,.svc__media::before{left:0 !important;top:0 !important;right:0;bottom:0;width:100% !important;height:100% !important}
.svc__media > img{transform-origin:50% 50%}
@media (max-width:640px){.cf-top p,.cf-title .eyebrow{margin-left:auto !important;margin-right:auto !important;text-align:center}}
/* ETAPA 7.5 content-depth-builder (G-25 v2, 2026-10-13): materias tecnicas como itens da FAQ.
   h3.mat-t embrulha o button (titulo = heading, visual identico ao das perguntas); corpo .mat-body. */
.mat-t{margin:0;padding:0;font:inherit;text-wrap:inherit;letter-spacing:inherit;color:inherit}
.faq-item .collapse .mat-body{padding-top:22px;color:var(--color-text)}
.faq-item .collapse .mat-body p{padding-top:0;margin:0 0 14px}
.faq-item .mat-body h4{font-family:var(--font-heading);font-size:18px;line-height:1.35;font-weight:600;letter-spacing:0;color:var(--color-navy);margin:24px 0 10px;text-wrap:pretty}
.faq-item .mat-body h4:first-child{margin-top:0}
.faq-item .mat-body ul{list-style:disc;margin:0 0 16px;padding-left:22px;max-width:65ch}
.faq-item .mat-body li{margin-bottom:8px}
.faq-item .mat-body li::marker{color:var(--color-gold)}
.faq-item .mat-body a{color:var(--color-navy);text-decoration:underline;text-decoration-color:var(--color-gold);text-underline-offset:2px}
.faq-item .collapse .mat-body .mat-nota{margin:20px 0 0;font-style:italic;color:var(--color-text-muted)}
@media (max-width:640px){
  .faq-item .mat-body h4{font-size:16px;text-align:center}
  .faq-item .mat-body ul{list-style:none;padding-left:0;text-align:center}
  .faq-item .mat-body li{text-align:center}
}
/* ---------- ETAPA 7.7 (blog-theme-builder): secao Ultimos artigos, vocabulario do site (cards brancos, badge em pilula, filete dourado) ---------- */
.blog-home{background:var(--surface)}
.blog-home .container{padding-top:112px;padding-bottom:120px;display:flex;flex-direction:column;gap:56px}
.blog-home__intro{max-width:640px;color:var(--color-text-muted)}
.blog-home__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.bpost{display:flex;flex-direction:column;min-width:0;background:var(--color-bg);box-shadow:inset 0 -2px 0 var(--color-gold)}
.bpost__media{display:block;position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--color-navy)}
.bpost__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.bpost__ph{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--color-navy) 0%,var(--color-navy) 38%,var(--color-surface-2) 100%);color:var(--color-gold-light)}
.bpost__ph svg{width:44px;height:44px;transition:transform .7s var(--ease)}
.bpost:hover .bpost__media img,.bpost:hover .bpost__ph svg{transform:scale(1.06)}
.bpost__body{flex:1;display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding:28px 28px 32px}
.bpost__t{font-family:var(--font-heading);font-size:1.25rem !important;line-height:1.3 !important;font-weight:600 !important;color:var(--color-navy);text-wrap:pretty;max-width:none}
.bpost__t a{color:inherit;transition:color .25s}
.bpost__t a:hover{color:var(--gold-text)}
.bpost__ex{font-size:.9375rem !important;line-height:1.6 !important;color:var(--color-text-muted) !important}
.bpost__go{margin-top:auto;display:inline-flex;align-items:center;gap:10px;font-family:var(--font-body);font-weight:600;font-size:.8125rem;line-height:1.4;letter-spacing:.08em;text-transform:uppercase;color:var(--color-navy)}
.bpost__go .arw{width:16px;height:16px;color:var(--gold-text)}
.bpost__go .arw i{width:16px;height:16px}
.blog-home__foot{display:flex;justify-content:center}
.blog-home__all .arw{color:currentColor}
@media (max-width:1199px){
  .blog-home .container{padding-top:80px;padding-bottom:88px;gap:40px}
  .blog-home__grid{grid-template-columns:minmax(0,1fr);max-width:640px;margin:0 auto;width:100%}
}
@media (max-width:809px){
  .blog-home .container{padding-top:60px;padding-bottom:64px;gap:32px}
  .bpost__body{padding:22px 20px 26px;align-items:center;text-align:center}
  .bpost__t{font-size:1.125rem !important}
  .blog-home__all{align-self:stretch}
}
/* =====================================================================
   DESIGN SYSTEM CS ADVOGADOS (Chiaradia & Sapag Advogados Associados)
   Variáveis, tipografia e badges. Arquivo único, carregado DEPOIS do <style> da página.
   2026-10-09, especificação do operador. Títulos: fonte mais próxima da logo (serifa do "CS"),
   Playfair Display 600/700, no lugar da Montserrat (cláusula "fonte da logo"). Corpo: Inter 400/500/600.
   As propriedades tipográficas usam !important porque o <style> da página traz os blocos das etapas 3 a 6
   com seletores mais específicos.
   ===================================================================== */

/* ---------- fontes locais (WOFF2 variável, subconjunto latino, um arquivo por família) ---------- */
/* fallbacks métricos sobre a Arial (medidos com fontTools em 2026-10-09) para não pular layout na troca */

/* ---------- variáveis ---------- */
:root{
  --color-navy:#091A36;
  --color-gold:#B79224;
  --color-gold-light:#DCC78D;
  --color-bg:#FBF8F3;
  --color-text:rgba(9,26,54,.85);
  --color-primary:var(--color-navy);
  --color-surface-2:#EFE9DD;
  --color-text-muted:#4A556B;            /* 6,6:1 no --color-surface-2 e 7,3:1 no --color-bg */
  --font-heading:"Playfair Display","Playfair Display Fallback",Arial,sans-serif;
  --font-body:"Inter","Inter Fallback",Arial,sans-serif;
  --radius:2px;
  /* nomes antigos da página apontando para os novos */
  --font-serif:var(--font-heading);--font-sans:var(--font-body);--font:var(--font-body);
  --dark:#091A36;--dark-rgb:9,26,54;--ink:#091A36;--bg:#FBF8F3;
  --gold:#B79224;--gold-light:#DCC78D;--accent-soft:#DCC78D;--on-dark:#FBF8F3;--muted:rgba(9,26,54,.85);
  --border:rgba(9,26,54,.12);--border-strong:#B79224;
}

/* ---------- base ---------- */
html{font-size:100%}
body{font-family:var(--font-body);font-size:1rem;line-height:1.6;font-feature-settings:normal;color:var(--color-text)}
b,strong{font-weight:600}

/* ---------- títulos ---------- */
h1,h2,h3,.h1,.h2,.h3,.h3-lg,.svc__title,.mega__name,.mpanel__area,.logo-txt b,.founder__who .h3{
  font-family:var(--font-heading) !important;line-height:1.2 !important;letter-spacing:-.01em !important;text-transform:none !important}
h1,.h1{font-size:clamp(2rem,5vw,3.25rem) !important;font-weight:700 !important;line-height:1.15 !important;letter-spacing:-.02em !important}
h2,.h2{font-size:clamp(1.6rem,3.5vw,2.25rem) !important;font-weight:700 !important}
h3,.h3,.h3-lg,.svc__title{font-size:clamp(1.25rem,2.5vw,1.5rem) !important;font-weight:600 !important}
.mega__name,.mpanel__area,.logo-txt b,.founder__who .h3{font-weight:600 !important}
.hero h1 b{font-weight:700 !important}
h2,.h2,h3,.h3,.h3-lg{color:var(--color-navy)}
.hero h1,.hero h1 b,.closing h2,.closing .h2,.tcard--dark .h3,.svc__title,.logo-txt b{color:var(--color-bg)}
/* nome nos cards sobre foto: herda a cor do card (claro em repouso, marinho no hover do card do Sobre) */
.founder{color:var(--color-bg)}
.founder__who .h3{color:inherit !important}
.founder:hover{color:var(--color-navy)}
.founder--static,.founder--static:hover{color:var(--color-bg)}
.mega__name{color:var(--color-navy) !important}
/* linha dourada sob o título de seção (chapada, nunca gradiente) */
h2.h2::after{content:"";display:block;width:48px;height:1px;background:var(--color-gold);margin-top:16px}
.sec-head--center h2.h2::after{margin-left:auto;margin-right:auto}

/* ---------- sobretítulos (rótulo acima do h2): único lugar com dourado em texto ---------- */
.eyebrow,.eyebrow--light,.hero--fullbleed .eyebrow,.foot-label,
.closing p.eyebrow,.closing p.foot-label,.cf-col p.foot-label{
  font-family:var(--font-body) !important;font-weight:600 !important;font-size:.75rem !important;line-height:1.4 !important;
  text-transform:uppercase !important;letter-spacing:.18em !important;color:var(--color-gold) !important}

/* ---------- corpo: 1rem / 1.6; texto pequeno .875rem; parágrafos até 65ch ---------- */
p,li,.p16,.lead,.hero-lead,.socio__cred li,.svc__links a,.faq .collapse p,.foot-col li{
  font-family:var(--font-body) !important;font-weight:400;font-size:1rem !important;line-height:1.6 !important}
.p14,.foot-bar p,.signup__note{font-size:.875rem !important;line-height:1.6 !important}
p{max-width:65ch}
.sec-head--center p,.cf-top p,.foot-bar p{margin-left:auto;margin-right:auto}
.cf-top p{margin-left:0}
p,li,.p16,.p14{color:var(--color-text)}
.hero-lead,.closing .lead,.closing p,.tcard--dark p,.hero p{color:rgba(251,248,243,.86) !important}
.socio__link{color:var(--color-navy) !important;text-decoration-color:var(--color-gold)}
.fw__icon{background:var(--color-navy) !important}

/* ---------- menu e submenus ---------- */
.nav__menu > li > a,.nav__svc,.mpanel > a,.mpanel__svc > button{
  font-family:var(--font-body) !important;font-weight:600 !important;font-size:.875rem !important;
  text-transform:uppercase !important;letter-spacing:.08em !important}
.mega__subs a,.mpanel__sub a,.mega__desc{font-family:var(--font-body) !important;font-size:.875rem !important;line-height:1.45 !important}

/* ---------- labels ---------- */
.caps{font-family:var(--font-body) !important;font-weight:600 !important;font-size:.75rem !important;
  text-transform:uppercase !important;letter-spacing:.08em !important}

/* ---------- botões ---------- */
.btn,.signup__btn{font-family:var(--font-body) !important;font-weight:600 !important;font-size:.875rem !important;
  text-transform:uppercase !important;letter-spacing:.08em !important;border-radius:var(--radius) !important}
.btn--white{background:var(--color-gold) !important;color:var(--color-navy) !important}
.btn--white:hover{background:var(--color-gold-light) !important}
.btn--outline-light,.nav__cta.btn--outline-light{background:transparent !important;color:var(--color-navy) !important;box-shadow:inset 0 0 0 1px var(--color-navy) !important}
.btn--outline-light:hover{background:var(--color-navy) !important;color:var(--color-bg) !important}
.closing .btn--outline-light,.hero .btn--outline-light,.btn-ghost-dark{background:transparent !important;color:var(--color-gold-light) !important;box-shadow:inset 0 0 0 1px var(--color-gold-light) !important}
.btn-ghost-dark:hover,.closing .btn--outline-light:hover{background:rgba(220,199,141,.12) !important}
.signup__btn{background:var(--color-gold) !important;color:var(--color-navy) !important}

/* ---------- badges ---------- */
.badges{display:flex;flex-wrap:wrap;gap:8px}
.badge{display:inline-flex;align-items:center;gap:.4rem;font-family:var(--font-body);font-size:.75rem;font-weight:600;
  text-transform:uppercase;letter-spacing:.08em;line-height:1;padding:.4rem .75rem;border-radius:999px;white-space:nowrap;
  box-shadow:none;background-image:none;animation:none;transition:none}
.badge svg{width:14px;height:14px;flex:none}
.badge--soft{background:color-mix(in srgb,var(--color-primary) 10%,transparent);color:var(--color-primary);border:0}
.badge--outline{background:transparent;color:var(--color-primary);border:1px solid color-mix(in srgb,var(--color-primary) 40%,transparent)}
.badge--solid{background:var(--color-primary);color:#fff;border:0}
.badge--neutral{background:var(--color-surface-2);color:var(--color-text-muted);border:0}
.hero .badge--soft,.closing .badge--soft{background:rgba(255,255,255,.12);color:#fff}
.hero .badges{margin-top:4px}
.svc .badges{margin:4px 0 2px}

/* ---------- tema do blog (chiaradia-sapag-child): ajustes do contexto WordPress ---------- */
body.admin-bar .site-header{top:32px}
@media (max-width:782px){body.admin-bar .site-header{top:46px}}
.csa-foot.closing.closing--flat{padding-top:64px!important}
.csa-foot .cf-grid{border-top:0;padding-top:0}
.site-header .nav__menu > li > a[aria-current="page"]{color:var(--gold-text)}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px);white-space:nowrap}
/* ETAPA 7.9 (2026-10-13): CTA do menu mobile. O design system pinta .btn--outline-light de marinho e o painel e marinho: o botao sumia.
   Mesmo tratamento que o design system da a ele em fundo escuro (igual as paginas do site). */
.mpanel .btn--outline-light{background:transparent !important;color:var(--color-gold-light) !important;box-shadow:inset 0 0 0 1px var(--color-gold-light) !important}
.mpanel .btn--outline-light:hover{background:rgba(220,199,141,.12) !important;color:var(--color-gold-light) !important}