/* ==========================================================================
   Washington Moura Advocacia — Design System v2
   Cinza (grafite / claros neutros) + dourado #BE8E24 · botões em pílula
   Estrutura e estética inspiradas no site de referência (Bueno, Chagas & Batista)
   ========================================================================== */

:root{
  /* grafites (base escura) */
  --black:        #18181a;
  --black-2:      #202023;
  --black-card:   #2a2a2d;
  --black-up:     #343438;
  --slate:        #2b2b2e;
  --black-line:   rgba(255,255,255,.09);
  --black-line-2: rgba(255,255,255,.16);

  /* dourado da referência */
  --gold:         #BE8E24;
  --gold-light:   #D4A93A;
  --gold-pale:    #E7C877;
  --gold-deep:    #9A7216;
  --gold-soft:    rgba(190,142,36,.14);
  --gold-grad:    linear-gradient(180deg,#E7C877 0%,#CFA13A 45%,#B0801A 100%);
  --gold-grad-h:  linear-gradient(180deg,#EED48C 0%,#D6AA45 45%,#BA8A22 100%);

  /* claros — cinzas neutros */
  --cream:        #f6f6f5;
  --cream-dim:    #ebebea;
  --cream-deep:   #dededc;
  --cream-line:   #d6d6d3;
  --card:         #f9f9f8;

  /* tipografia */
  --ink:          #1a1a1a;
  --ink-soft:     #3d3d3d;
  --muted:        #5b5b5b;
  --on-dark:      #f2f2f2;
  --on-dark-soft: #c4c4c4;

  /* whatsapp (só no botão flutuante) */
  --wa:           #0d8a44;
  --wa-grad:       linear-gradient(165deg, #1fa75a 0%, #0e8a45 52%, #0a7538 100%);
  --wa-grad-hover: linear-gradient(165deg, #1b9450 0%, #0b7a3c 52%, #086830 100%);

  --sans:    "Inter", "Segoe UI", Arial, sans-serif;
  --display: "Libre Baskerville", "Baskerville", Georgia, "Times New Roman", serif;

  --max: 1220px;
  --pad: clamp(20px, 4.5vw, 64px);

  --r-sm: 6px;
  --r:    8px;
  --r-lg: 12px;
  --r-xl: 14px;
  --r-pill: 999px;

  --sh-card: 0 2px 8px rgba(0,0,0,.06), 0 8px 28px rgba(0,0,0,.09);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:700;
  line-height:1.22;
  margin:0 0 .5em;
  color:var(--ink);
}
p{ margin:0 0 1em; }
.on-dark{ color:var(--on-dark); }
.on-dark h1,.on-dark h2,.on-dark h3{ color:#fff; }
::selection{ background:var(--gold); color:#fff; }

.wrap{
  max-width:var(--max);
  margin:0 auto;
  padding-left:var(--pad);
  padding-right:var(--pad);
}

/* ---------- eyebrow / kicker ---------- */
.eyebrow, .kicker{
  display:block;
  font-family:var(--sans);
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--gold-deep);
  margin-bottom:14px;
}
.hero .eyebrow, .section-dark .eyebrow, .section-slate .eyebrow, .cta-band .eyebrow,
.on-dark .eyebrow, .section-dark .kicker, .section-slate .kicker, .on-dark .kicker, .page-head .eyebrow{ color:var(--gold-light); }

/* ---------- botões (pílula, dourado em degradê) ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.65em;
  padding:15px 32px;
  font-family:var(--sans);
  font-size:12px; font-weight:700;
  letter-spacing:.13em; text-transform:uppercase;
  line-height:1.3;
  border-radius:var(--r-pill);
  border:1px solid transparent;
  cursor:pointer;
  text-align:center;
  transition:background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), box-shadow .25s var(--ease), transform .25s var(--ease);
}
.btn svg{ width:17px; height:17px; flex:none; }

.btn-gold, .btn-whats{
  background:var(--gold-grad); color:#1a1a1a;
  border-color:var(--gold);
  box-shadow:0 4px 16px rgba(190,142,36,.28);
}
.btn-gold:hover, .btn-whats:hover{
  background:var(--gold-grad-h); color:#000;
  box-shadow:0 6px 22px rgba(190,142,36,.42);
  transform:translateY(-1px);
}
.btn-dark{ background:var(--black); color:var(--gold-pale); border-color:var(--black); }
.btn-dark:hover{ background:var(--black-up); }
.btn-line{ background:transparent; border-color:var(--ink); color:var(--ink); }
.btn-line:hover{ border-color:var(--gold); color:var(--gold-deep); }
.btn-line-dark{ background:transparent; border-color:rgba(255,255,255,.35); color:#fff; }
.btn-line-dark:hover{ border-color:var(--gold-light); color:var(--gold-light); }
.btn-lg{ padding:17px 36px; font-size:12.5px; }

.btn-ghost{
  display:inline-flex; align-items:center; gap:8px;
  font-size:13.5px; font-weight:400; color:rgba(255,255,255,.72);
  transition:color .2s var(--ease);
}
.btn-ghost::after{ content:"→"; }
.btn-ghost:hover{ color:var(--gold-light); }

/* ---------- header ---------- */
.site-header{
  position:sticky; top:0; z-index:60;
  background:var(--black);
  border-bottom:1px solid var(--black-line);
}
.site-header .wrap{
  display:flex; align-items:center; gap:clamp(12px,2vw,28px);
  height:98px;
}
.brand{ display:flex; align-items:center; flex:none; }
.brand img{ height:56px; width:auto; }

.main-nav{ display:flex; align-items:center; gap:2px; margin:0 0 0 auto; }
.main-nav > a, .has-dropdown > a{
  display:inline-flex; align-items:center; gap:6px;
  font-size:14.5px; font-weight:500; white-space:nowrap;
  color:var(--on-dark-soft);
  padding:10px 16px;
  border-radius:var(--r-pill);
  transition:background .2s var(--ease), color .2s var(--ease);
}
.main-nav > a:hover, .has-dropdown > a:hover, .has-dropdown:hover > a{ color:#fff; background:rgba(255,255,255,.06); }
.main-nav a.active{ color:var(--gold-light); }
.has-dropdown > a::after{
  content:""; width:6px; height:6px; flex:none;
  border-right:1.6px solid currentColor; border-bottom:1.6px solid currentColor;
  transform:rotate(45deg) translateY(-2px); opacity:.6;
  transition:transform .2s var(--ease);
}
.has-dropdown:hover > a::after{ transform:rotate(225deg) translateY(-2px); }

.header-cta{ display:flex; align-items:center; gap:10px; flex:none; }
.header-cta .btn{ padding:11px 22px; font-size:11.5px; }
.header-cta .btn svg{ width:16px; height:16px; }

.has-dropdown{ position:relative; }
.dropdown{
  position:absolute; top:calc(100% + 4px); left:50%;
  transform:translateX(-50%) translateY(6px);
  background:var(--black-card);
  border:1px solid var(--black-line-2);
  border-top:2px solid var(--gold);
  border-radius:var(--r);
  min-width:260px; padding:6px;
  opacity:0; visibility:hidden;
  transition:opacity .18s var(--ease), transform .18s var(--ease);
}
.has-dropdown::after{ content:""; position:absolute; left:0; right:0; top:100%; height:12px; }
.has-dropdown:hover .dropdown{ opacity:1; visibility:visible; transform:translateX(-50%) translateY(0); }
.dropdown a{
  display:block; padding:11px 14px; font-size:14px;
  color:var(--on-dark-soft); border-radius:var(--r-sm);
  transition:background .16s var(--ease), color .16s var(--ease);
}
.dropdown a:hover{ color:var(--gold-light); background:rgba(255,255,255,.06); }
.dropdown a.active{ color:var(--gold-light); }

.nav-toggle{
  display:none; width:42px; height:42px; flex:none;
  align-items:center; justify-content:center;
  border:1px solid var(--black-line-2); background:transparent;
  border-radius:var(--r-pill); cursor:pointer;
}
.nav-toggle span{ display:block; width:18px; height:1.6px; background:#fff; position:relative; }
.nav-toggle span::before,.nav-toggle span::after{ content:""; position:absolute; left:0; width:18px; height:1.6px; background:#fff; }
.nav-toggle span::before{ top:-6px; }
.nav-toggle span::after{ top:6px; }

/* ---------- hero ---------- */
.hero{
  position:relative;
  background:var(--black);
  color:var(--on-dark);
  overflow:hidden;
  padding:0;
}
.hero-art{ position:absolute; inset:0; z-index:1; width:100%; height:100%; opacity:.55; pointer-events:none; }
.hero-grid{
  position:relative; z-index:2;
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:1.15fr .85fr;
  gap:clamp(28px,4vw,56px); align-items:center;
  padding:clamp(56px,6.5vw,96px) var(--pad) clamp(40px,4vw,56px);
}
.hero h1{
  font-size:clamp(30px, 3.6vw, 48px);
  font-weight:400;
  color:#fff;
  margin-bottom:0;
}
.hero h1 em{ font-style:italic; color:var(--gold); }
.hero .lede{
  max-width:54ch;
  color:var(--on-dark-soft);
  font-size:16.5px;
  margin:22px 0 34px;
}
.hero .lede b{ color:#fff; font-weight:600; }
.hero .cta-row{ display:flex; gap:18px; flex-wrap:wrap; align-items:center; }

/* foto do hero: dissolve no fundo grafite, como na referência */
.hero-photo{
  position:relative;
  aspect-ratio:4/5;
  max-height:600px; justify-self:end; width:100%;
  background:transparent;
}
.hero-photo img{
  width:100%; height:100%; object-fit:cover; object-position:50% 8%;
  -webkit-mask-image:linear-gradient(to right, transparent 0%, rgba(0,0,0,.55) 22%, #000 55%), linear-gradient(to top, transparent 0%, #000 24%);
  -webkit-mask-composite:source-in; mask-composite:intersect;
  mask-image:linear-gradient(to right, transparent 0%, rgba(0,0,0,.55) 22%, #000 55%), linear-gradient(to top, transparent 0%, #000 24%);
}
.hero-photo .photo-tag{ position:absolute; z-index:2; left:8%; right:4%; bottom:5%; }
.hero-photo .photo-tag small{
  display:block; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold-light); margin-bottom:5px; font-weight:700;
}
.hero-photo .photo-tag b{ display:block; font-family:var(--display); font-size:19px; color:#fff; font-weight:400; line-height:1.25; }
.hero-photo .photo-tag .oab{ display:block; font-size:12px; color:var(--on-dark-soft); letter-spacing:.04em; margin-top:2px; }

/* faixa de diferenciais — parte inferior da primeira dobra */
.hero-trust{
  position:relative; z-index:2;
  max-width:var(--max); margin:0 auto;
  padding:0 var(--pad);
}
.hero-trust .ht-row{
  display:grid; grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(255,255,255,.1);
  padding:clamp(26px,3vw,38px) 0 clamp(32px,3.4vw,46px);
}
.hero-trust .ht-row.three{ grid-template-columns:repeat(3,1fr); }
.ht-item{ text-align:center; padding:0 18px; border-left:1px solid rgba(255,255,255,.1); display:flex; flex-direction:column; justify-content:center; }
.ht-item:first-child{ border-left:0; }
.ht-num{ font-family:var(--display); font-size:clamp(19px,2vw,26px); color:var(--gold-pale); line-height:1.25; margin-bottom:6px; }
.ht-label{ font-size:13px; color:var(--on-dark-soft); }

/* hero das páginas de área */
.hero-page h1{
  font-size:clamp(30px,3.8vw,50px);
  text-transform:uppercase; letter-spacing:.01em; line-height:1.12;
}
.hero-page .crumb{ margin-bottom:22px; }
.hero-page .hero-geo{ display:flex; align-items:center; gap:8px; color:var(--gold); font-size:14px; margin:0 0 28px; }
.hero-page .hero-geo svg{ width:15px; height:15px; flex:none; }
.hero-page .lede{ margin:20px 0 14px; }

.hero-card{
  background:rgba(255,255,255,.045);
  border:1px solid rgba(190,142,36,.38);
  border-radius:var(--r-xl);
  padding:clamp(24px,2.6vw,34px);
  backdrop-filter:blur(4px);
}
.hero-card .hc-title{ font-family:var(--display); font-size:22px; color:#fff; margin-bottom:10px; }
.hero-card p{ color:var(--on-dark-soft); font-size:14.5px; margin-bottom:18px; }
.hero-card .ff{ margin-bottom:12px; }
.hero-card label{ display:block; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-light); font-weight:600; margin-bottom:5px; }
.hero-card input{
  width:100%; padding:12px 16px; border-radius:var(--r-pill);
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.16);
  color:#fff; font:inherit; font-size:14.5px;
}
.hero-card input::placeholder{ color:rgba(255,255,255,.4); }
.hero-card input:focus{ outline:0; border-color:var(--gold); }
.hero-card .btn{ width:100%; margin-top:6px; }
.hero-card .form-priv{ font-size:12px; color:rgba(255,255,255,.55); margin:12px 0 0; text-align:center; }

/* ---------- barra de rótulo ---------- */
.label-bar{
  background:#fff; padding:13px var(--pad);
  display:flex; align-items:center; gap:16px;
  border-top:1px solid rgba(0,0,0,.07); border-bottom:1px solid rgba(0,0,0,.07);
}
.label-bar span{ font-size:11px; font-weight:700; letter-spacing:.24em; text-transform:uppercase; color:var(--ink); white-space:nowrap; }
.label-bar::after{ content:""; flex:1; height:1px; background:rgba(190,142,36,.35); }

/* ---------- sections ---------- */
section{ padding:clamp(60px,6.5vw,96px) var(--pad); }
section[id]{ scroll-margin-top:98px; }
.section-dark{ background:var(--black); }
.section-slate{ background:var(--slate); }
.section-cream{ background:var(--cream-dim); }
.section-cream-dim{ background:var(--cream); }
.section-white{ background:#fff; }
.section-head{ max-width:700px; margin:0 0 52px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2{ font-size:clamp(25px, 2.9vw, 36px); font-weight:400; }
.section-head h2 em{ font-style:italic; color:var(--gold-deep); }
.section-dark .section-head h2 em, .section-slate .section-head h2 em, .on-dark h2 em{ color:var(--gold-light); }
.section-head p{ color:var(--muted); font-size:16px; margin-bottom:0; }
.section-dark .section-head p, .section-slate .section-head p{ color:var(--on-dark-soft); }
.section-head::after{
  content:""; display:block; width:56px; height:3px; margin-top:22px; border-radius:2px; background:var(--gold-grad);
}
.section-head.center::after{ margin-left:auto; margin-right:auto; }

/* ---------- cards de áreas (home) ---------- */
.areas-grid{ display:grid; grid-template-columns:repeat(3, 1fr); gap:18px; }
.area-card{
  position:relative;
  background:var(--card);
  border:1px solid var(--cream-line);
  border-top:3px solid var(--gold);
  border-radius:var(--r-lg);
  padding:34px 30px 30px;
  display:flex; flex-direction:column;
  min-height:290px;
  box-shadow:var(--sh-card);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), border-color .25s var(--ease);
}
.area-card:hover{ transform:translateY(-4px); box-shadow:0 4px 12px rgba(0,0,0,.08), 0 16px 38px rgba(0,0,0,.14); }
.area-card .icon{
  width:50px; height:50px; padding:12px;
  margin-bottom:22px;
  color:#1a1a1a; background:var(--gold-grad);
  border-radius:50%;
}
.area-card h3{ font-size:18.5px; margin-bottom:10px; }
.area-card p{ color:var(--muted); font-size:14.8px; flex:1; }
.area-card .go{
  margin-top:20px; font-size:11.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-deep); display:inline-flex; align-items:center; gap:8px;
}
.area-card .go svg{ width:15px; height:15px; transition:transform .2s var(--ease); }
.area-card:hover .go svg{ transform:translateX(4px); }
.area-card.feature{ background:var(--gold-grad); border-color:var(--gold); color:#1a1a1a; }
.area-card.feature h3{ color:#141414; }
.area-card.feature p{ color:#2b2208; }
.area-card.feature .icon{ color:var(--gold-pale); background:var(--black); }
.area-card.feature .go{ color:#141414; }

/* ---------- split (sobre / como atuamos) ---------- */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,72px); align-items:center; }
.split.reverse .col-media{ order:2; }
.col-media{
  aspect-ratio:4/5;
  background:var(--black);
  border-radius:var(--r-xl);
  border-bottom:4px solid var(--gold);
  position:relative; overflow:hidden;
  box-shadow:var(--sh-card);
}
.col-media img{ width:100%; height:100%; object-fit:cover; object-position:50% 20%; }
.col-media .media-badge{
  position:absolute; left:20px; bottom:22px; right:20px;
  background:rgba(24,24,26,.72); backdrop-filter:blur(6px);
  border:1px solid rgba(190,142,36,.4);
  border-radius:var(--r);
  padding:16px 18px; color:var(--on-dark);
}
.col-media .media-badge small{ display:block; font-size:10.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-light); margin-bottom:4px; font-weight:700; }
.col-media .media-badge b{ display:block; font-family:var(--display); font-size:17px; font-weight:400; color:#fff; }
.col-media .media-badge .oab{ display:block; font-size:12.5px; color:var(--on-dark-soft); margin-top:2px; }
.col-copy h2{ font-size:clamp(24px,2.7vw,34px); font-weight:400; margin-bottom:18px; }
.col-copy h2 em{ font-style:italic; color:var(--gold-deep); }
.col-copy p{ color:var(--muted); }
.col-copy .btn{ margin-top:14px; }

/* ---------- valores / missão ---------- */
.values-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:22px; }
.value-item{
  background:var(--black-card);
  border:1px solid var(--black-line);
  border-top:2px solid var(--gold);
  border-radius:var(--r);
  padding:22px 20px;
}
.value-item h4{ color:var(--gold-pale); font-size:15px; font-weight:700; margin-bottom:8px; font-family:var(--display); }
.value-item p{ color:var(--on-dark-soft); font-size:14px; margin:0; }
.mv-block{ margin-bottom:34px; }
.mv-block:last-child{ margin-bottom:0; }
.mv-block p{ color:#e6e6e6; font-size:16.5px; margin:0; }

/* ---------- passos ---------- */
.steps{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.step{
  position:relative;
  background:var(--card);
  border:1px solid var(--cream-line);
  border-radius:var(--r-lg);
  padding:28px 24px;
  box-shadow:var(--sh-card);
}
.step .num{
  font-family:var(--display); color:#1a1a1a; font-size:13.5px; font-weight:700;
  width:40px; height:40px; border-radius:50%;
  background:var(--gold-grad);
  display:inline-flex; align-items:center; justify-content:center;
  margin-bottom:16px;
}
.step h4{ font-size:16px; margin-bottom:8px; }
.step p{ font-size:14px; color:var(--muted); margin:0; }
.steps-split{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(28px,4vw,56px); align-items:center; }
.steps-split .steps{ grid-template-columns:1fr 1fr; }
.steps-split .col-media{ aspect-ratio:4/5; }
.steps-split .col-media img{ object-position:60% 55%; }

/* ---------- FAQ (duas colunas, fundo claro) ---------- */
.sec-faq{ background:var(--cream); }
.faq-split{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,5vw,72px); align-items:start; max-width:var(--max); margin:0 auto; }
.faq-i h2{ font-size:clamp(26px,3vw,36px); font-weight:400; }
.faq-i p{ color:var(--muted); font-size:15px; }
.faq-i .btn{ margin-top:16px; }
.faq-list{ display:grid; gap:0; }
.faq-item{ border-bottom:1px solid rgba(0,0,0,.12); }
.faq-item summary{
  cursor:pointer; list-style:none;
  padding:20px 4px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  font-family:var(--sans); font-weight:600; font-size:15.5px; color:var(--ink);
  transition:color .2s var(--ease);
}
.faq-item summary::-webkit-details-marker{ display:none; }
.faq-item[open] summary, .faq-item summary:hover{ color:var(--gold-deep); }
.faq-item summary .plus{ width:22px; height:22px; flex:none; position:relative; border:1.5px solid var(--gold); border-radius:50%; }
.faq-item[open] summary .plus{ background:var(--gold); }
.faq-item summary .plus::before,.faq-item summary .plus::after{
  content:""; position:absolute; background:var(--gold-deep); transition:transform .22s var(--ease), opacity .22s var(--ease);
}
.faq-item[open] summary .plus::before, .faq-item[open] summary .plus::after{ background:#fff; }
.faq-item summary .plus::before{ left:5px; top:9.2px; width:9px; height:1.6px; }
.faq-item summary .plus::after{ left:9.2px; top:5px; width:1.6px; height:9px; }
.faq-item[open] summary .plus::after{ transform:rotate(90deg); opacity:0; }
.faq-item .faq-a{ padding:0 4px 22px; color:var(--muted); font-size:15px; }

/* ---------- contato ---------- */
.contact-grid{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,56px); align-items:stretch; }
.contact-card{
  background:#fff;
  border:1px solid var(--cream-line);
  border-top:3px solid var(--gold);
  border-radius:var(--r-xl);
  padding:clamp(26px,3vw,38px);
  box-shadow:var(--sh-card);
}
.contact-list{ display:grid; gap:18px; margin:0 0 30px; }
.contact-list .row{ display:flex; align-items:center; gap:15px; }
.contact-list .row > svg{ width:38px; height:38px; padding:9px; flex:none; color:#1a1a1a; background:var(--gold-grad); border-radius:50%; }
.contact-list .row > svg.wa-i{ color:#1a1a1a; background:var(--gold-grad); }
.contact-list .row div{ font-size:15.5px; color:var(--ink-soft); }
.map-box{ border-radius:var(--r-xl); overflow:hidden; border:1px solid var(--cream-line); background:var(--cream-dim); min-height:100%; box-shadow:var(--sh-card); }
.map-box iframe{ width:100%; height:100%; min-height:420px; border:0; display:block; filter:grayscale(1) contrast(1.05); }

/* ---------- faixa de CTA dourada ---------- */
.cta-strip, .cta-band{
  background-color:var(--gold);
  background-image:linear-gradient(180deg,#CFA13A 0%,#BE8E24 60%,#A87A14 100%);
  padding:clamp(40px,4.5vw,56px) var(--pad);
}
.cta-strip-in, .cta-band .wrap{
  max-width:var(--max); margin:0 auto; padding:0;
  display:flex; align-items:center; justify-content:space-between; gap:40px; flex-wrap:wrap;
}
.cta-strip h2, .cta-band h2{ color:#18181a; font-size:clamp(22px,2.6vw,30px); font-weight:400; line-height:1.25; max-width:24ch; margin:0; }
.cta-band h2 em{ font-style:italic; color:#18181a; }
.cta-band p, .cta-band .eyebrow{ display:none; }
.cta-strip-r{ display:flex; flex-direction:column; align-items:flex-start; gap:12px; }
.cta-strip .btn-dark, .cta-band .btn-whats{ background:#18181a; color:var(--gold-pale); border-color:#18181a; box-shadow:none; }
.cta-strip .btn-dark:hover, .cta-band .btn-whats:hover{ background:#000; color:#fff; transform:none; }
.cta-wpp{ font-size:13.5px; color:#18181a; display:flex; align-items:center; gap:8px; }
.cta-wpp svg{ width:15px; height:15px; }

/* ---------- blog ---------- */
.page-head{ background:var(--black); padding:clamp(52px,6vw,86px) var(--pad); text-align:center; }
.page-head h1{ color:#fff; font-size:clamp(28px,3.4vw,42px); font-weight:400; letter-spacing:.06em; text-transform:uppercase; margin:0 0 18px; }
.page-head p{ color:var(--on-dark-soft); max-width:62ch; margin:0 auto; font-size:16.5px; }
.blog-grid{ max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.post-card{
  background:var(--card); border:1px solid var(--cream-line); border-top:3px solid var(--gold);
  border-radius:var(--r-lg); padding:30px 28px; display:flex; flex-direction:column;
  box-shadow:var(--sh-card);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
}
.post-card:hover{ transform:translateY(-4px); }
.post-card h2{ font-size:18.5px; margin-bottom:12px; }
.post-card p{ color:var(--muted); font-size:14.8px; flex:1; margin-bottom:22px; }
.post-card .go{ font-size:11.5px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-deep); display:inline-flex; align-items:center; gap:8px; }
.post-card .go svg{ width:15px; height:15px; }

.page-head.with-photo{ position:relative; overflow:hidden; text-align:left; padding:0; }
.page-head.with-photo .ph-grid{
  max-width:var(--max); margin:0 auto;
  display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(28px,4vw,60px); align-items:center;
  padding:clamp(44px,5vw,72px) var(--pad);
}
.page-head.with-photo p{ margin:0; }
.page-head.with-photo .ph-photo{ aspect-ratio:4/3; border-radius:var(--r-xl); overflow:hidden; border-bottom:4px solid var(--gold); }
.page-head.with-photo .ph-photo img{ width:100%; height:100%; object-fit:cover; object-position:60% 62%; }

/* ---------- footer ---------- */
.site-footer{ background:var(--black); color:var(--on-dark-soft); padding:clamp(52px,6vw,76px) var(--pad) 26px; border-top:3px solid var(--gold); }
.footer-grid{ max-width:var(--max); margin:0 auto; display:grid; grid-template-columns:1.5fr 1fr 1fr 1.1fr; gap:clamp(28px,4vw,48px); }
.site-footer .brand img{ height:48px; }
.site-footer p.tag{ font-size:14px; max-width:34ch; margin-top:20px; }
.footer-social{ display:flex; gap:9px; margin-top:22px; }
.footer-social a{
  width:40px; height:40px; border-radius:50%;
  border:1px solid rgba(190,142,36,.5);
  display:inline-flex; align-items:center; justify-content:center; color:var(--gold-pale);
  transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease);
}
.footer-social a svg{ width:18px; height:18px; }
.footer-social a:hover, .footer-social a.wa:hover{ color:#1a1a1a; background:var(--gold-grad); border-color:var(--gold); }
.footer-col h5{ color:var(--gold-pale); font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; margin-bottom:18px; font-weight:700; font-family:var(--sans); }
.footer-col a, .footer-col span{ display:block; font-size:14px; margin-bottom:11px; color:var(--on-dark-soft); }
.footer-col a{ transition:color .18s var(--ease); }
.footer-col a:hover{ color:var(--gold-light); }
.footer-bottom{
  max-width:var(--max); margin:clamp(40px,5vw,58px) auto 0;
  padding-top:24px; border-top:1px solid var(--black-line);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;
  font-size:12.5px; color:#8a8a8a;
}
.footer-bottom .credit{ color:#8a8a8a; }
.footer-bottom .credit a:hover{ color:var(--on-dark-soft); }

/* ---------- botão flutuante whatsapp ---------- */
.wa-float{
  position:fixed; right:clamp(16px,2.4vw,26px); bottom:clamp(16px,2.4vw,26px); z-index:70;
  display:inline-flex; align-items:center; justify-content:center;
  width:58px; height:58px;
  background:var(--wa); background-image:var(--wa-grad); color:#fff;
  border-radius:50%; box-shadow:0 6px 20px rgba(0,0,0,.28);
  transition:background-image .2s var(--ease);
}
.wa-float svg{ width:28px; height:28px; }
.wa-float:hover{ background-image:var(--wa-grad-hover); }

/* ---------- breadcrumb ---------- */
.crumb{ font-size:13px; color:var(--on-dark-soft); margin-bottom:20px; }
.crumb a{ color:var(--gold-light); }
.crumb a:hover{ text-decoration:underline; }
.crumb span{ opacity:.45; margin:0 8px; }

/* ---------- páginas de área: cards numerados em bloco ---------- */
.g3{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.card-s{
  position:relative;
  background:var(--card);
  border:1px solid var(--cream-line);
  border-bottom:3px solid var(--gold);
  border-radius:var(--r-lg);
  padding:32px 28px 28px;
  box-shadow:var(--sh-card);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
}
.card-s:hover{ transform:translateY(-4px); background:#fff; box-shadow:0 4px 12px rgba(0,0,0,.08), 0 16px 38px rgba(0,0,0,.14); }
.card-s .cs-num{
  position:absolute; top:14px; right:20px;
  font-family:var(--display); font-size:42px; line-height:1;
  color:rgba(190,142,36,.22); user-select:none; transition:color .25s var(--ease);
}
.card-s:hover .cs-num{ color:rgba(190,142,36,.5); }
.card-s .cs-ico{
  display:flex; align-items:center; justify-content:center;
  width:50px; height:50px; margin-bottom:18px; border-radius:50%;
  background:var(--gold-grad); color:#1a1a1a;
}
.card-s .cs-ico svg{ width:23px; height:23px; }
.card-s .cs-t{ font-size:17.5px; margin-bottom:8px; }
.card-s .cs-d{ color:var(--muted); font-size:14.6px; margin:0; }

.sec-intro{ max-width:760px; margin:0 auto 44px; text-align:center; }
.sec-intro h2{ font-size:clamp(25px,2.9vw,36px); font-weight:400; }
.sec-intro p{ color:var(--muted); }
.sec-intro::after{ content:""; display:block; width:56px; height:3px; margin:22px auto 0; border-radius:2px; background:var(--gold-grad); }

.side-copy .eyebrow{ margin-bottom:12px; }
.side-copy h2{ font-size:clamp(24px,2.7vw,34px); font-weight:400; }
.side-copy p{ color:var(--muted); }
.cta-box{
  margin-top:26px; padding:24px 26px;
  background:var(--black); color:var(--on-dark);
  border-left:4px solid var(--gold); border-radius:var(--r-lg);
}
.cta-box strong{ display:block; font-family:var(--display); font-weight:400; font-size:19px; color:#fff; margin-bottom:6px; }
.cta-box p{ color:var(--on-dark-soft); font-size:14.5px; margin-bottom:14px; }
.cta-box .btn{ padding:12px 26px; font-size:11.5px; }

/* ---------- responsive ---------- */
@media (max-width:1180px){
  .main-nav > a, .has-dropdown > a{ padding:10px 12px; font-size:14px; }
}
@media (max-width:1100px){
  .site-header .wrap{ height:84px; gap:14px; }
  .brand img{ height:46px; }
  .nav-toggle{ display:inline-flex; order:3; }
  .header-cta{ margin-left:auto; }
  .main-nav{
    position:absolute; top:100%; left:0; right:0;
    background:var(--black-2);
    border-bottom:1px solid var(--black-line-2);
    flex-direction:column; align-items:stretch;
    padding:10px var(--pad) 20px; margin:0; display:none;
  }
  .main-nav.open{ display:flex; }
  .main-nav > a, .has-dropdown > a{ padding:13px 12px; font-size:15.5px; }
  .has-dropdown > a::after{ margin-left:auto; }
  .dropdown{
    position:static; transform:none; opacity:1; visibility:visible;
    border:none; border-left:1px solid var(--black-line-2);
    border-radius:0; min-width:0; padding:0 0 0 10px; margin:0 0 6px 12px; background:transparent;
  }
}
@media (max-width:980px){
  .hero-grid{ grid-template-columns:1fr; gap:34px; }
  .hero-photo{ aspect-ratio:16/12; max-height:none; justify-self:stretch; }
  .hero-photo img{ object-position:50% 12%;
    -webkit-mask-image:linear-gradient(to top, transparent 0%, #000 30%); mask-image:linear-gradient(to top, transparent 0%, #000 30%); }
  .hero-trust .ht-row, .hero-trust .ht-row.three{ grid-template-columns:1fr 1fr; row-gap:26px; }
  .ht-item:nth-child(3){ border-left:0; }
  .areas-grid, .g3{ grid-template-columns:1fr 1fr; }
  .split, .two-col, .contact-grid, .faq-split, .steps-split, .page-head.with-photo .ph-grid{ grid-template-columns:1fr; }
  .split .col-media{ order:-1 !important; }
  .col-media, .steps-split .col-media{ aspect-ratio:16/12; }
  .values-row{ grid-template-columns:1fr 1fr; }
  .steps{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .map-box iframe{ min-height:330px; }
  .blog-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .header-cta .btn-whats, .header-cta .btn-gold{
    width:42px; height:42px; padding:0; gap:0; border-radius:50%; font-size:0;
  }
  .header-cta .btn svg{ width:21px; height:21px; }
}
@media (max-width:620px){
  .areas-grid, .g3, .blog-grid, .values-row, .steps, .steps-split .steps, .footer-grid{ grid-template-columns:1fr; }
  .hero .cta-row .btn, .cta-strip .btn{ width:100%; }
  .footer-bottom{ flex-direction:column; gap:8px; }
  .hero-trust .ht-row, .hero-trust .ht-row.three{ grid-template-columns:1fr; }
  .ht-item{ border-left:0; border-top:1px solid rgba(255,255,255,.1); padding:16px 0; }
  .ht-item:first-child{ border-top:0; }
  .cta-strip-r{ width:100%; }
}

.col-media img[src*="inss"]{ object-position:62% 60%; }
@media (min-width:981px){ .g3 .card-s:last-child:nth-child(3n+1){ grid-column:2; } }