/* =========================================================================
   GIOVANA DE SÁ BEZERRA — ADVOGADA
   Identidade: branco / off-white · vinho profundo · dourado sofisticado
   ========================================================================= */

/* ---------- 1. TOKENS ---------- */
:root{
  /* vinho — amostrado da logo original */
  --vinho-900:#2B0A0F;
  --vinho-800:#3D1016;
  --vinho-700:#46161A;
  --vinho-600:#5A1218;
  --vinho-500:#6E1D26;

  /* dourado — amostrado da espada e da balança */
  --ouro-900:#764218;
  --ouro-700:#8A5A22;   /* textos pequenos sobre fundo claro (AA) */
  --ouro-500:#A9793F;   /* linhas, molduras, ornamentos */
  --ouro-300:#D9B27C;   /* sobre fundos vinho */
  --ouro-100:#F0E2CC;

  --champanhe:#EFE5DC;
  --bege:#F6F1EA;
  --offwhite:#FBF9F6;
  --branco:#FFFFFF;

  --tinta:#2B0A0F;
  --texto:#3A2A2C;
  --texto-mudo:#6B5B5D;
  --linha:rgba(169,121,63,.24);
  --linha-forte:rgba(169,121,63,.48);

  --serif:"Cormorant Garamond","Iowan Old Style","Times New Roman",Georgia,serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;

  --h-topo:74px;
  --raio:2px;
  --larg:1200px;
  --sombra-sutil:0 1px 2px rgba(43,10,15,.04), 0 14px 34px -22px rgba(43,10,15,.30);
  --sombra-media:0 2px 4px rgba(43,10,15,.05), 0 26px 50px -28px rgba(43,10,15,.42);
  --ease:cubic-bezier(.22,.72,.26,1);
}

/* ---------- 2. BASE ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }

body{
  margin:0;
  font:400 16px/1.7 var(--sans);
  color:var(--texto);
  background:var(--offwhite);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  overflow-wrap:break-word;
}
img,svg,picture{max-width:100%}
img{height:auto}
a{color:inherit}
button{font:inherit; color:inherit}
::selection{background:var(--vinho-600); color:#fff}

section[id],main[id]{scroll-margin-top:calc(var(--h-topo) + 14px)}

/* itens de grid/flex nao podem ter min-content maior que a coluna
   (evita rolagem horizontal em telas muito estreitas) */
.hero__grid>*,.sobre__grid>*,.duvidas__grid>*,.contato__grid>*,.rodape__topo>*,
.cartao-id>*,.lista-contato li>*,.garantias li>*,.etapa>*,.mini-card>*{min-width:0}

.container{width:100%; max-width:var(--larg); margin-inline:auto; padding-inline:clamp(20px,5vw,40px)}
.container--estreito{max-width:860px}

.pular{
  position:absolute; left:-9999px; top:0; z-index:999;
  background:var(--vinho-600); color:#fff; padding:12px 20px;
  font:600 13px/1 var(--sans); letter-spacing:.08em; text-decoration:none;
}
.pular:focus{left:12px; top:12px}

:focus-visible{outline:2px solid var(--ouro-500); outline-offset:3px; border-radius:1px}

/* ---------- 3. TIPOGRAFIA ---------- */
h1,h2,h3{
  font-family:var(--serif); font-weight:500; color:var(--tinta);
  margin:0; line-height:1.14; letter-spacing:.004em;
  text-wrap:balance;
}
h1{font-size:clamp(2.15rem,1.35rem + 3.4vw,3.7rem); line-height:1.1}
h2{font-size:clamp(1.85rem,1.25rem + 2.5vw,2.95rem)}
h3{font-size:clamp(1.2rem,1.05rem + .6vw,1.42rem); line-height:1.25}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}

.lead{
  font-size:clamp(1rem,.96rem + .22vw,1.115rem);
  line-height:1.72; color:var(--texto-mudo); max-width:56ch;
  text-wrap:pretty;
}
.lead--centro{margin-inline:auto; text-align:center}

.sobrancelha{
  display:flex; align-items:center; gap:.85em;
  margin:0 0 20px;
  font:600 clamp(.63rem,.6rem + .1vw,.7rem)/1 var(--sans);
  letter-spacing:.24em; text-transform:uppercase; color:var(--ouro-700);
}
.sobrancelha::before{content:""; width:34px; height:1px; background:currentColor; opacity:.6; flex:none}
.sobrancelha--claro{color:var(--ouro-300)}

.cabec{margin-bottom:clamp(38px,4.4vw,58px)}
.cabec--centro{text-align:center; max-width:760px; margin-inline:auto}
.cabec--centro .sobrancelha{justify-content:center}
.cabec--centro .sobrancelha::after{content:""; width:34px; height:1px; background:currentColor; opacity:.6; flex:none}

/* ornamento: filete — losango — filete (citação da identidade) */
.ornamento{
  display:block; position:relative; height:10px; width:min(260px,66%); margin:22px auto 24px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Cpath d='M5 0 10 5 5 10 0 5Z' fill='%23A9793F'/%3E%3C/svg%3E") center/10px 10px no-repeat;
}
.ornamento::before,.ornamento::after{
  content:""; position:absolute; top:50%; height:1px; width:calc(50% - 15px);
}
.ornamento::before{left:0;  background:linear-gradient(90deg,transparent,var(--ouro-500))}
.ornamento::after{right:0;  background:linear-gradient(90deg,var(--ouro-500),transparent)}
.ornamento--esq{margin-inline:0}
.ornamento--claro{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10'%3E%3Cpath d='M5 0 10 5 5 10 0 5Z' fill='%23D9B27C'/%3E%3C/svg%3E")}
.ornamento--claro::before{background:linear-gradient(90deg,transparent,var(--ouro-300))}
.ornamento--claro::after{background:linear-gradient(90deg,var(--ouro-300),transparent)}

.nota{font-size:.895rem; color:var(--texto-mudo); max-width:62ch}
.nota-mini{margin:12px 0 0; font-size:.815rem; line-height:1.6; color:var(--texto-mudo); font-style:italic}
.nota-inline{
  margin:14px 0 0; padding:11px 0 11px 15px; border-left:2px solid var(--linha-forte);
  font-size:.83rem; line-height:1.62; color:var(--texto-mudo);
}

/* ---------- 4. SEÇÕES ---------- */
.secao{padding-block:clamp(64px,8.4vw,124px); position:relative}
.secao--bege{background:var(--bege)}

/* ---------- 5. ÍCONES ---------- */
.ico{
  width:100%; height:100%; display:block;
  fill:none; stroke:currentColor; stroke-width:1.35;
  stroke-linecap:round; stroke-linejoin:round;
}
.ico-zap{width:17px; height:17px; flex:none; fill:currentColor}
.seta{width:15px; height:15px; flex:none; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.sprite{position:absolute; width:0; height:0; overflow:hidden}

/* ---------- 6. BOTÕES ---------- */
.btn{
  --bg:var(--vinho-600); --fg:#fff; --bd:var(--vinho-600);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:15px 30px; border:1px solid var(--bd); border-radius:var(--raio);
  background:var(--bg); color:var(--fg);
  font:600 .735rem/1 var(--sans); letter-spacing:.15em; text-transform:uppercase;
  text-decoration:none; cursor:pointer; text-align:center;
  transition:background-color .28s var(--ease), border-color .28s var(--ease),
             color .28s var(--ease), transform .28s var(--ease), box-shadow .28s var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}

.btn--vinho{box-shadow:0 12px 26px -16px rgba(90,18,24,.7)}
.btn--vinho:hover{--bg:var(--vinho-500); --bd:var(--vinho-500); box-shadow:0 16px 30px -14px rgba(90,18,24,.6)}

.btn--linha{--bg:transparent; --fg:var(--ouro-700); --bd:var(--linha-forte)}
.btn--linha:hover{--bg:rgba(169,121,63,.09); --bd:var(--ouro-500); --fg:var(--ouro-900)}

.btn--ouro{
  --fg:var(--vinho-900); --bd:transparent;
  background:linear-gradient(160deg,#E3C89A 0%,#C79A55 52%,#AE7C3B 100%);
  box-shadow:0 12px 26px -16px rgba(0,0,0,.6);
}
.btn--ouro:hover{background:linear-gradient(160deg,#EBD5AE 0%,#D0A660 52%,#B98846 100%)}

.btn--sm{padding:11px 20px; font-size:.68rem; letter-spacing:.13em}
.btn--bloco{width:100%}

/* ---------- 7. MOLDURAS E CANTOS ---------- */
.moldura{position:relative; isolation:isolate}
.moldura img{display:block; width:100%; position:relative; z-index:1; border-radius:var(--raio); box-shadow:var(--sombra-media)}
.moldura__offset{position:absolute; inset:26px -26px -26px 26px; border:1px solid var(--linha-forte); z-index:0; border-radius:var(--raio)}

.canto{position:absolute; z-index:2; width:26px; height:26px; border:1px solid var(--ouro-500); pointer-events:none; opacity:.85}
.canto--tl{top:-9px; left:-9px; border-right:0; border-bottom:0}
.canto--tr{top:-9px; right:-9px; border-left:0; border-bottom:0}
.canto--bl{bottom:-9px; left:-9px; border-right:0; border-top:0}
.canto--br{bottom:-9px; right:-9px; border-left:0; border-top:0}

/* ---------- 8. CHIPS E TÓPICOS ---------- */
.chips{display:flex; flex-wrap:wrap; gap:7px; list-style:none; margin:16px 0 0; padding:0}
.chips li{
  font:500 .705rem/1 var(--sans); letter-spacing:.045em; color:var(--ouro-900);
  border:1px solid var(--linha); background:rgba(169,121,63,.07);
  padding:7px 11px; border-radius:var(--raio);
}
.chips--claro li{color:var(--ouro-100); border-color:rgba(217,178,124,.32); background:rgba(217,178,124,.09)}

.topicos{margin:0; padding:0; list-style:none; display:grid; gap:8px}
.topicos li{position:relative; padding-left:19px; font-size:.86rem; line-height:1.55; color:var(--texto)}
.topicos li::before{
  content:""; position:absolute; left:1px; top:.55em; width:6px; height:6px;
  background:var(--ouro-500); transform:rotate(45deg);
}

/* ---------- 9. REVEAL ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .75s var(--ease), transform .75s var(--ease)}
.reveal.visivel{opacity:1; transform:none}
html:not(.js) .reveal{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1 !important; transform:none !important; transition:none}
  .btn:hover{transform:none}
}

/* ---------- 10. CABEÇALHO ---------- */
.topo{
  position:sticky; top:0; z-index:100;
  background:rgba(251,249,246,.90); border-bottom:1px solid var(--linha);
  transition:box-shadow .3s var(--ease), background-color .3s var(--ease);
}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .topo{-webkit-backdrop-filter:saturate(1.4) blur(14px); backdrop-filter:saturate(1.4) blur(14px)}
}
.topo.rolou{background:rgba(251,249,246,.97); box-shadow:0 12px 30px -24px rgba(43,10,15,.65)}
.topo__inner{display:flex; align-items:center; gap:clamp(16px,2vw,30px); height:var(--h-topo)}

.marca{display:flex; align-items:center; gap:11px; text-decoration:none; flex:none}
.marca__simbolo{width:38px; height:38px; object-fit:contain; flex:none}
.marca__txt{display:grid; gap:4px}
.marca__nome{font:600 1.02rem/1 var(--serif); letter-spacing:.05em; color:var(--vinho-900); white-space:nowrap}
.marca__oab{font:500 .565rem/1 var(--sans); letter-spacing:.185em; text-transform:uppercase; color:var(--ouro-700); white-space:nowrap}
.marca__oab i,.assinatura__oab i,.cartao-id__oab i,.rodape__oab i{font-style:normal; opacity:.45; margin-inline:.4em}

.nav{margin-left:auto; display:flex; align-items:center; gap:clamp(18px,2.4vw,34px)}
.nav__lista{display:flex; align-items:center; gap:clamp(14px,1.8vw,27px); list-style:none; margin:0; padding:0}
.nav__lista a{
  position:relative; display:block; padding:7px 0; text-decoration:none; white-space:nowrap;
  font:500 .715rem/1 var(--sans); letter-spacing:.135em; text-transform:uppercase; color:var(--texto);
  transition:color .25s var(--ease);
}
.nav__lista a::after{
  content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:var(--ouro-500);
  transform:scaleX(0); transform-origin:left; transition:transform .32s var(--ease);
}
.nav__lista a:hover,.nav__lista a.ativo{color:var(--vinho-600)}
.nav__lista a:hover::after,.nav__lista a.ativo::after{transform:scaleX(1)}

.hamb{display:none; margin-left:auto; width:44px; height:44px; padding:0; gap:5px;
  border:1px solid var(--linha); background:transparent; border-radius:var(--raio); cursor:pointer}
.hamb span{display:block; width:20px; height:1.4px; background:var(--vinho-800); margin-inline:auto;
  transition:transform .3s var(--ease), opacity .2s var(--ease)}
.hamb[aria-expanded="true"] span:nth-child(1){transform:translateY(6.4px) rotate(45deg)}
.hamb[aria-expanded="true"] span:nth-child(2){opacity:0}
.hamb[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.4px) rotate(-45deg)}

/* ---------- 11. HERO ---------- */
.hero{
  position:relative; overflow:hidden;
  padding-block:clamp(48px,6.4vw,90px) clamp(66px,8vw,116px);
  background:radial-gradient(118% 86% at 86% 4%, rgba(239,229,220,.9) 0%, rgba(251,249,246,0) 62%), var(--offwhite);
}
.hero__marca{position:absolute; z-index:0; right:-7%; top:4%; width:min(640px,60vw); opacity:.05; pointer-events:none}
.hero__grid{position:relative; z-index:1; display:grid; grid-template-columns:1.03fr .97fr; gap:clamp(40px,5.4vw,80px); align-items:center}
.hero__txt h1{margin-bottom:22px}
.hero__acoes{display:flex; flex-wrap:wrap; gap:13px; margin-top:34px}
.hero__selos{display:flex; flex-wrap:wrap; margin-top:42px; padding-top:26px; border-top:1px solid var(--linha)}
.selo{padding-right:clamp(20px,2.6vw,34px); margin-right:clamp(20px,2.6vw,34px); border-right:1px solid var(--linha)}
.selo:last-child{border-right:0; margin-right:0; padding-right:0}
.selo__rot{display:block; margin-bottom:7px; font:600 .605rem/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--ouro-700)}
.selo__val{display:block; font:400 1.06rem/1.3 var(--serif); color:var(--vinho-900)}

.hero__foto{justify-self:center; width:100%; max-width:470px; padding:26px 26px 0 0}
.moldura__placa{
  position:absolute; z-index:3; left:-18px; bottom:36px; margin:0; display:grid; gap:4px;
  background:var(--branco); border:1px solid var(--linha); border-left:3px solid var(--vinho-600);
  padding:13px 24px 14px 19px; box-shadow:0 22px 44px -24px rgba(43,10,15,.55); border-radius:var(--raio);
}
.moldura__placa strong{font:600 1.04rem/1.2 var(--serif); color:var(--vinho-900); letter-spacing:.02em}
.moldura__placa span{font:500 .585rem/1 var(--sans); letter-spacing:.17em; text-transform:uppercase; color:var(--ouro-700)}
.moldura__placa i{font-style:normal; opacity:.45; margin-inline:.4em}

/* ---------- 12. SOBRE ---------- */
.sobre__grid{display:grid; grid-template-columns:.86fr 1.14fr; gap:clamp(38px,5.6vw,86px); align-items:center}
.sobre__img .moldura{max-width:460px; margin-inline:auto}
.moldura--simples img{box-shadow:var(--sombra-sutil)}
.assinatura{margin:26px 0 22px; padding-left:17px; border-left:2px solid var(--ouro-500)}
.assinatura__nome{margin:0; font:500 1.55rem/1.2 var(--serif); color:var(--vinho-900)}
.assinatura__oab{margin:6px 0 0; font:500 .645rem/1 var(--sans); letter-spacing:.19em; text-transform:uppercase; color:var(--ouro-700)}
.sobre__txt>p{max-width:60ch}
.sobre__cards{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:34px}
.mini-card{background:var(--branco); border:1px solid var(--linha); border-radius:var(--raio);
  padding:24px 24px 22px; box-shadow:var(--sombra-sutil)}
.mini-card .ico{width:25px; height:25px; color:var(--ouro-500); margin-bottom:15px}
.mini-card__rot{margin:0 0 7px; font:600 .61rem/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--ouro-700)}
.mini-card__val{margin:0; font:400 1.08rem/1.35 var(--serif); color:var(--vinho-900)}

/* ---------- 13. ÁREAS DE ATUAÇÃO ---------- */
.areas__grade{display:flex; flex-wrap:wrap; justify-content:center; gap:clamp(18px,2vw,24px)}
.area{flex:1 1 288px; max-width:382px}
.area{
  position:relative; display:flex; flex-direction:column; overflow:hidden;
  background:var(--branco); border:1px solid var(--linha); border-radius:var(--raio);
  padding:clamp(24px,2.4vw,32px); box-shadow:var(--sombra-sutil);
  transition:border-color .32s var(--ease), box-shadow .32s var(--ease), transform .32s var(--ease);
}
.area::before{
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background:linear-gradient(90deg,var(--ouro-500),var(--vinho-600));
  transform:scaleX(0); transform-origin:left; transition:transform .5s var(--ease);
}
.area:hover{border-color:var(--linha-forte); box-shadow:var(--sombra-media); transform:translateY(-3px)}
.area:hover::before,.area:focus-within::before{transform:scaleX(1)}
.area__ico{display:grid; place-items:center; width:52px; height:52px; margin-bottom:20px;
  border:1px solid var(--linha); background:var(--champanhe); color:var(--ouro-900); border-radius:var(--raio)}
.area__ico .ico{width:26px; height:26px}
.area h3{margin-bottom:12px}
.area>p:not([class]){font-size:.895rem; line-height:1.68; color:var(--texto-mudo)}
.area__mais{margin-top:18px; padding-top:18px; border-top:1px solid var(--linha)}
.area__mais p{font-size:.875rem; line-height:1.68; color:var(--texto-mudo)}
.js .area__mais{display:none}
.js .area__mais.aberto{display:block; animation:desce .38s var(--ease)}
@keyframes desce{from{opacity:0; transform:translateY(-7px)} to{opacity:1; transform:none}}
.area__pe{margin-top:auto; padding-top:18px; border-top:1px solid var(--linha);
  display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px 14px}
.link-mais{
  background:none; border:0; padding:0; cursor:pointer; display:inline-flex; align-items:center; gap:.5em;
  font:600 .645rem/1 var(--sans); letter-spacing:.105em; text-transform:uppercase; color:var(--ouro-700);
  transition:color .25s;
}
.link-mais::after{content:"+"; font-size:1.15em; font-weight:400; line-height:0}
.link-mais[aria-expanded="true"]::after{content:"\2212"}
.link-mais:hover{color:var(--ouro-900)}
.link-zap{
  display:inline-flex; align-items:center; gap:.5em; text-decoration:none;
  font:600 .645rem/1 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:var(--vinho-600);
  transition:color .25s;
}
.link-zap:hover{color:var(--vinho-500)}
.link-zap .seta{transition:transform .3s var(--ease)}
.link-zap:hover .seta{transform:translateX(4px)}

/* ---------- 14. URGÊNCIAS ---------- */
.urgencias{
  overflow:hidden; color:var(--champanhe); border-block:1px solid rgba(217,178,124,.26);
  background:radial-gradient(96% 74% at 50% 0%, rgba(110,29,38,.6) 0%, rgba(70,22,26,0) 68%),
             linear-gradient(180deg,#4A181C 0%,#3B0F15 100%);
}
.urgencias h2,.urgencias h3{color:var(--branco)}
.urgencias .lead{color:rgba(240,226,204,.82)}
.urgencias__marca{position:absolute; z-index:0; left:50%; top:50%; translate:-50% -50%;
  width:min(800px,92vw); opacity:.055; pointer-events:none}
.urgencias .container{position:relative; z-index:1}
.urg__grade{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr)); gap:clamp(20px,2.6vw,32px)}
.urg{
  position:relative; display:flex; flex-direction:column; border-radius:var(--raio);
  background:rgba(255,255,255,.045); border:1px solid rgba(217,178,124,.24);
  padding:clamp(28px,3vw,44px);
}
.urg .canto{border-color:var(--ouro-300); opacity:.85; width:22px; height:22px}
.urg .canto--tl{top:-1px; left:-1px}
.urg .canto--br{bottom:-1px; right:-1px}
.urg__ico{display:grid; place-items:center; width:60px; height:60px; margin-bottom:24px;
  border:1px solid rgba(217,178,124,.38); color:var(--ouro-300); border-radius:var(--raio)}
.urg__ico .ico{width:30px; height:30px}
.urg h3{margin-bottom:14px}
.urg>p:not([class]){color:rgba(240,226,204,.84); font-size:.925rem; line-height:1.72}
.aviso{margin:22px 0 28px; padding:14px 0 14px 16px; border-left:2px solid var(--ouro-300);
  font-size:.815rem; line-height:1.62; color:rgba(240,226,204,.7)}
.urg .btn{margin-top:auto; align-self:flex-start}

/* ---------- 15. FRAUDES ---------- */
.fraudes__grade{display:grid; grid-template-columns:repeat(auto-fit,minmax(min(256px,100%),1fr)); gap:clamp(18px,2vw,24px)}
.destaque{position:relative; overflow:hidden; background:var(--branco); border:1px solid var(--linha);
  border-radius:var(--raio); padding:clamp(26px,2.6vw,34px); box-shadow:var(--sombra-sutil)}
.destaque::after{content:""; position:absolute; left:0; bottom:0; width:100%; height:2px;
  background:linear-gradient(90deg,var(--ouro-500),transparent); opacity:.55}
.destaque__num{position:absolute; right:14px; top:2px; font:500 3.7rem/1 var(--serif); color:var(--ouro-500); opacity:.15}
.destaque h3{font-size:1.12rem; margin-bottom:10px; padding-right:40px}
.destaque p{font-size:.88rem; line-height:1.66; color:var(--texto-mudo)}
.fraudes__pe{margin-top:clamp(32px,3.6vw,46px); display:flex; flex-direction:column; align-items:center; gap:24px; text-align:center}

/* ---------- 16. COMO FUNCIONA ---------- */
.etapas__linha{list-style:none; margin:0; padding:0; position:relative;
  display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,2.4vw,32px)}
.etapas__linha::before{
  content:""; position:absolute; top:27px; left:12%; right:12%; height:1px; opacity:.5;
  background:linear-gradient(90deg,transparent,var(--ouro-500) 12%,var(--ouro-500) 88%,transparent);
}
.etapa{text-align:center}
.etapa__num{
  position:relative; z-index:1; display:grid; place-items:center; width:56px; height:56px; margin:0 auto 20px;
  background:var(--offwhite); border:1px solid var(--linha-forte); border-radius:var(--raio);
  font:500 1.3rem/1 var(--serif); color:var(--ouro-700); letter-spacing:.03em;
}
.etapa h3{font-size:1.1rem; margin-bottom:10px}
.etapa p{font-size:.875rem; line-height:1.65; color:var(--texto-mudo)}
.etapas__nota{margin:clamp(34px,3.6vw,48px) auto 0; text-align:center; max-width:52ch;
  font:400 1.02rem/1.5 var(--serif); color:var(--vinho-900)}

/* ---------- 17. ENVIE SUA DÚVIDA ---------- */
.duvidas__grid{display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(38px,5vw,74px); align-items:start}
.garantias{list-style:none; margin:34px 0 0; padding:0; display:grid; gap:20px}
.garantias li{display:grid; grid-template-columns:22px 1fr; gap:15px; align-items:start;
  font-size:.865rem; line-height:1.62; color:var(--texto-mudo)}
.garantias .ico{width:22px; height:22px; color:var(--ouro-500); margin-top:3px}

.form{display:grid; gap:19px; background:var(--branco); border:1px solid var(--linha);
  border-radius:var(--raio); padding:clamp(26px,3vw,42px); box-shadow:var(--sombra-media)}
.campo{display:grid; gap:7px}
.campo-dupla{display:grid; grid-template-columns:1fr 1fr; gap:19px}
.campo label{font:600 .655rem/1.3 var(--sans); letter-spacing:.15em; text-transform:uppercase; color:var(--vinho-900)}
.req{color:var(--vinho-600)}
.opc{font-weight:400; letter-spacing:.05em; text-transform:none; color:var(--texto-mudo); font-size:.92em}

.campo input,.campo textarea,.sel select{
  width:100%; font:400 .95rem/1.5 var(--sans); color:var(--tinta);
  background:var(--offwhite); border:1px solid rgba(43,10,15,.15); border-radius:var(--raio);
  padding:13px 15px; transition:border-color .22s, box-shadow .22s, background-color .22s;
}
.campo textarea{resize:vertical; min-height:132px; line-height:1.62}
.campo input::placeholder,.campo textarea::placeholder{color:#9C8E90; opacity:1}
.campo input:hover,.campo textarea:hover,.sel select:hover{border-color:rgba(43,10,15,.27)}
.campo input:focus,.campo textarea:focus,.sel select:focus{
  outline:0; background:var(--branco); border-color:var(--ouro-500); box-shadow:0 0 0 3px rgba(169,121,63,.15)}
.campo.invalido input,.campo.invalido textarea,.campo.invalido .sel select{border-color:#A32B33; background:#FDF6F6}
.erro{display:none; font-size:.78rem; line-height:1.45; color:#A32B33}
.campo.invalido .erro{display:block}

.sel{position:relative}
.sel select{appearance:none; -webkit-appearance:none; padding-right:46px; cursor:pointer}
.sel__seta{position:absolute; right:16px; top:50%; translate:0 -50%; width:17px; height:17px; pointer-events:none;
  fill:none; stroke:var(--ouro-700); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.conta{justify-self:end; font-size:.715rem; letter-spacing:.04em; color:var(--texto-mudo)}

.check{display:grid; grid-template-columns:20px 1fr; gap:13px; align-items:start; cursor:pointer}
.check input{position:absolute; width:1px; height:1px; opacity:0}
.check__box{width:20px; height:20px; margin-top:2px; display:grid; place-items:center;
  border:1px solid rgba(43,10,15,.28); border-radius:var(--raio); background:var(--offwhite);
  transition:background-color .2s, border-color .2s}
.check__box svg{width:13px; height:13px; opacity:0; transform:scale(.6);
  fill:none; stroke:#fff; stroke-width:2.6; stroke-linecap:round; stroke-linejoin:round;
  transition:opacity .2s var(--ease), transform .2s var(--ease)}
.check input:checked + .check__box{background:var(--vinho-600); border-color:var(--vinho-600)}
.check input:checked + .check__box svg{opacity:1; transform:none}
.check input:focus-visible + .check__box{outline:2px solid var(--ouro-500); outline-offset:2px}
.check__txt{font:400 .83rem/1.58 var(--sans); letter-spacing:normal; text-transform:none; color:var(--texto-mudo)}
.check__txt a{color:var(--ouro-700); text-underline-offset:3px}

.mel{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}

.alerta-urg[hidden]{display:none}
.alerta-urg{
  display:grid; gap:15px; justify-items:start; padding:19px 21px; border-radius:var(--raio);
  border:1px solid var(--linha-forte); border-left:3px solid var(--vinho-600);
  background:linear-gradient(135deg, rgba(239,229,220,.9), rgba(251,249,246,.95));
  animation:desce .38s var(--ease);
}
.alerta-urg__tit{margin:0; font:600 .715rem/1.5 var(--sans); letter-spacing:.13em; text-transform:uppercase; color:var(--vinho-800)}

.form__status{display:none; margin:0; font-size:.865rem; line-height:1.6}
.form__status.mostrar{display:block; padding:14px 17px; border-radius:var(--raio); border-left:3px solid}
.form__status.ok{background:rgba(169,121,63,.10); border-color:var(--ouro-500); color:var(--ouro-900)}
.form__status.falha{background:#FDF6F6; border-color:#A32B33; color:#8C242B}
.form__nota{margin:0; padding-top:2px; text-align:center; font-size:.775rem; line-height:1.62; color:var(--texto-mudo)}
.btn[aria-busy="true"]{opacity:.6; pointer-events:none}

/* ---------- 18. FAIXA WHATSAPP ---------- */
.faixa-zap{position:relative; overflow:hidden; padding-block:clamp(54px,6vw,86px);
  background:var(--champanhe); border-block:1px solid var(--linha)}
.faixa-zap__marca{position:absolute; left:50%; top:50%; translate:-50% -50%; width:min(460px,64vw); opacity:.038; pointer-events:none}
.faixa-zap__inner{position:relative; z-index:1; display:grid; justify-items:center; gap:12px; text-align:center}
.faixa-zap h2{font-size:clamp(1.55rem,1.2rem + 1.6vw,2.3rem)}
.faixa-zap p{margin:0; color:var(--texto-mudo)}
.faixa-zap .btn{margin-top:12px}

/* ---------- 19. FAQ ---------- */
.acordeao{border-top:1px solid var(--linha)}
.acc{border-bottom:1px solid var(--linha)}
.acc h3{margin:0; font:inherit}
.acc__btn{
  width:100%; padding:23px 4px; background:none; border:0; cursor:pointer; text-align:left;
  display:flex; align-items:center; justify-content:space-between; gap:26px;
  font:500 clamp(1.02rem,.98rem + .32vw,1.22rem)/1.45 var(--serif); color:var(--tinta);
  transition:color .25s var(--ease);
}
.acc__btn:hover{color:var(--vinho-600)}
.acc__mais{position:relative; flex:none; width:16px; height:16px}
.acc__mais::before,.acc__mais::after{content:""; position:absolute; background:var(--ouro-500); transition:transform .32s var(--ease)}
.acc__mais::before{left:0; top:7.3px; width:16px; height:1.4px}
.acc__mais::after{left:7.3px; top:0; width:1.4px; height:16px}
.acc__btn[aria-expanded="true"] .acc__mais::after{transform:scaleY(0)}
.acc__corpo{padding:0 4px 26px; max-width:68ch}
.acc__corpo p{margin:0; font-size:.925rem; line-height:1.74; color:var(--texto-mudo)}
.js .acc__corpo{display:none}
.js .acc__corpo.aberto{display:block; animation:desce .38s var(--ease)}

/* ---------- 20. CONTATO ---------- */
.contato__grid{display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(34px,4.6vw,66px); align-items:start}
.cartao-id{display:flex; align-items:center; gap:17px; padding-bottom:26px; margin-bottom:28px; border-bottom:1px solid var(--linha)}
.cartao-id img{width:58px; height:58px; object-fit:contain; flex:none}
.cartao-id__nome{margin:0; font:500 1.42rem/1.2 var(--serif); color:var(--vinho-900)}
.cartao-id__oab{margin:7px 0 0; font:500 .625rem/1 var(--sans); letter-spacing:.19em; text-transform:uppercase; color:var(--ouro-700)}

.lista-contato{list-style:none; margin:0; padding:0; display:grid; gap:28px}
.lista-contato li{display:grid; grid-template-columns:25px 1fr; gap:17px; align-items:start}
.lista-contato .ico{width:24px; height:24px; color:var(--ouro-500); margin-top:3px}
.lista-contato__rot{margin:0 0 7px; font:600 .61rem/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; color:var(--ouro-700)}
.lista-contato address{font-style:normal; font-size:.95rem; line-height:1.64; color:var(--texto)}
.lista-contato__val{margin:0; font-size:1rem; overflow-wrap:anywhere}
.lista-contato__val a{color:var(--tinta); text-decoration:none; padding-bottom:2px;
  border-bottom:1px solid var(--linha-forte); transition:color .25s, border-color .25s}
.lista-contato__val a:hover{color:var(--vinho-600); border-color:var(--vinho-600)}
.lista-contato__extra{margin:10px 0 0; font-size:.82rem; line-height:1.58; color:var(--texto-mudo)}
.lista-contato .btn{margin-top:13px}

.mapa{position:relative; overflow:hidden; width:100%; max-width:100%; min-height:320px; aspect-ratio:4/3.3;
  border:1px solid var(--linha); border-radius:var(--raio); background:var(--champanhe); box-shadow:var(--sombra-sutil)}
.mapa iframe{display:block; width:100%; height:100%; border:0}
.mapa__placeholder{
  position:absolute; inset:0; display:grid; place-content:center; justify-items:center; gap:15px;
  padding:34px; text-align:center;
  background:linear-gradient(rgba(239,229,220,.92),rgba(239,229,220,.92)),
    repeating-linear-gradient(45deg, transparent 0 24px, rgba(169,121,63,.11) 24px 25px),
    repeating-linear-gradient(-45deg, transparent 0 24px, rgba(169,121,63,.07) 24px 25px);
}
.mapa__placeholder .ico{width:32px; height:32px; color:var(--ouro-500)}
.mapa__end{margin:0; font:400 1.02rem/1.5 var(--serif); color:var(--vinho-900)}
.mapa__nota{margin:0; max-width:36ch; font-size:.715rem; line-height:1.5; color:var(--texto-mudo)}
.link-externo{display:inline-flex; align-items:center; gap:.55em; margin-top:17px; text-decoration:none;
  font:600 .685rem/1 var(--sans); letter-spacing:.13em; text-transform:uppercase; color:var(--ouro-700); transition:color .25s}
.link-externo:hover{color:var(--ouro-900)}
.link-externo .seta{transition:transform .3s var(--ease)}
.link-externo:hover .seta{transform:translateX(4px)}

/* ---------- 21. RODAPÉ ---------- */
.rodape{background:linear-gradient(180deg,#3D1016,#280910); color:rgba(240,226,204,.78); padding-top:clamp(46px,5vw,68px)}
.rodape__topo{display:grid; grid-template-columns:auto 1fr; gap:clamp(30px,4.4vw,64px);
  align-items:center; padding-bottom:clamp(34px,3.8vw,48px)}
.placa{display:inline-block; padding:22px 26px; background:var(--offwhite); border-radius:var(--raio);
  border:1px solid rgba(217,178,124,.28); box-shadow:0 22px 46px -26px rgba(0,0,0,.85)}
.placa img{display:block; width:190px}
.rodape__nome{margin:0; font:500 1.5rem/1.2 var(--serif); color:#fff}
.rodape__oab{margin:8px 0 19px; font:500 .625rem/1 var(--sans); letter-spacing:.19em; text-transform:uppercase; color:var(--ouro-300)}
.rodape__lista{list-style:none; margin:0; padding:0; display:grid; gap:8px; font-size:.875rem; line-height:1.55; overflow-wrap:anywhere}
.rodape__lista a{color:inherit; text-decoration:none; border-bottom:1px solid rgba(217,178,124,.26);
  transition:color .25s, border-color .25s}
.rodape__lista a:hover{color:var(--ouro-300); border-color:var(--ouro-300)}
.rodape__lista i{font-style:normal; opacity:.45; margin-inline:.55em}
.rodape__base{display:grid; justify-items:center; gap:15px; text-align:center;
  padding-block:27px 32px; border-top:1px solid rgba(217,178,124,.18)}
.rodape__links{display:flex; align-items:center; gap:.9em; font:600 .68rem/1 var(--sans); letter-spacing:.13em; text-transform:uppercase}
.rodape__links a{color:var(--ouro-300); text-decoration:none; transition:color .25s}
.rodape__links a:hover{color:#fff}
.rodape__links i{font-style:normal; opacity:.4}
.rodape__aviso{margin:0; max-width:76ch; font-size:.775rem; line-height:1.62; color:rgba(240,226,204,.55)}
.rodape__copy{margin:0; font-size:.735rem; letter-spacing:.045em; color:rgba(240,226,204,.42)}

/* ---------- 22. WHATSAPP FLUTUANTE ---------- */
.zap-flutua{
  position:fixed; z-index:90; display:grid; place-items:center; width:56px; height:56px; border-radius:50%;
  right:clamp(16px,2.4vw,26px);
  bottom:max(clamp(16px,2.4vw,26px), env(safe-area-inset-bottom, 0px));
  background:var(--vinho-600); color:#fff;
  box-shadow:0 14px 30px -12px rgba(43,10,15,.65), 0 0 0 1px rgba(217,178,124,.45);
  opacity:0; visibility:hidden; transform:translateY(12px) scale(.92);
  transition:opacity .35s var(--ease), transform .35s var(--ease), visibility .35s, background-color .25s;
}
.zap-flutua.visivel{opacity:1; visibility:visible; transform:none}
.zap-flutua:hover{background:var(--vinho-500)}
.zap-flutua svg{width:27px; height:27px; fill:currentColor}
html:not(.js) .zap-flutua{opacity:1; visibility:visible; transform:none}

/* ---------- 23. RESPONSIVO ---------- */
@media (max-width:1080px){
  .hamb{display:grid}
  .nav{
    position:fixed; top:var(--h-topo); left:0; right:0; margin:0; z-index:99;
    flex-direction:column; align-items:stretch; gap:0;
    padding:6px clamp(20px,5vw,40px) 26px;
    background:var(--offwhite); border-bottom:1px solid var(--linha);
    box-shadow:0 26px 46px -30px rgba(43,10,15,.7);
    max-height:calc(100dvh - var(--h-topo)); overflow-y:auto;
    opacity:0; visibility:hidden; transform:translateY(-10px);
    transition:opacity .26s var(--ease), transform .26s var(--ease), visibility .26s;
  }
  .nav.aberto{opacity:1; visibility:visible; transform:none}
  .nav__lista{flex-direction:column; align-items:stretch; gap:0}
  .nav__lista a{padding:16px 2px; border-bottom:1px solid var(--linha); font-size:.775rem}
  .nav__lista a::after{display:none}
  .nav__zap{margin-top:22px; width:100%}

  html:not(.js) .hamb{display:none}
  html:not(.js) .topo__inner{height:auto; flex-wrap:wrap; gap:14px; padding-block:14px}
  html:not(.js) .nav{position:static; opacity:1; visibility:visible; transform:none; padding:0;
    background:none; border:0; box-shadow:none; max-height:none; flex-direction:row; flex-wrap:wrap; gap:12px 20px}
  html:not(.js) .nav__lista{flex-direction:row; flex-wrap:wrap; gap:10px 20px}
  html:not(.js) .nav__lista a{padding:4px 0; border:0}
  html:not(.js) .nav__zap{margin-top:0; width:auto}
}

@media (max-width:980px){
  .hero__grid{grid-template-columns:1fr; gap:clamp(44px,6vw,60px)}
  .hero__foto{max-width:420px; justify-self:start}
  .sobre__grid{grid-template-columns:1fr; gap:44px}
  .sobre__img .moldura{max-width:400px; margin-inline:0}
  .duvidas__grid{grid-template-columns:1fr; gap:42px}
  .contato__grid{grid-template-columns:1fr}
}

@media (max-width:760px){
  :root{--h-topo:64px}
  .etapas__linha{grid-template-columns:1fr; gap:0}
  .etapas__linha::before{top:10px; bottom:10px; left:27px; right:auto; width:1px; height:auto;
    background:linear-gradient(180deg,transparent,var(--ouro-500) 7%,var(--ouro-500) 93%,transparent)}
  .etapa{display:grid; grid-template-columns:56px 1fr; gap:0 20px; text-align:left; padding-bottom:34px}
  .etapa:last-child{padding-bottom:0}
  .etapa__num{margin:0; grid-row:1/span 2}
  .etapa h3{align-self:center}
  .etapa p{grid-column:2}
  .sobre__cards{grid-template-columns:1fr}
  .campo-dupla{grid-template-columns:1fr}
  .rodape__topo{grid-template-columns:1fr; justify-items:start; gap:30px}
  .hero__selos{gap:22px}
  .selo{border-right:0; padding-right:0; margin-right:0}
  .hero__foto{padding:18px 18px 0 0}
  .moldura__offset{inset:18px -18px -18px 18px}
  .moldura__placa{left:10px; bottom:14px; padding:11px 18px 12px 15px}
  .mapa{min-height:280px; aspect-ratio:4/3.6}
}

@media (max-width:520px){
  .marca__simbolo{width:34px; height:34px}
  .marca__nome{font-size:.94rem}
  .btn{padding:15px 22px; font-size:.7rem; letter-spacing:.12em}
  .hero__acoes{gap:11px}
  .hero__acoes .btn,.urg .btn,.fraudes__pe .btn,.faixa-zap .btn{width:100%}
  .fraudes__pe{align-items:stretch}
  .area__pe{gap:14px 16px}
  .acc__btn{gap:18px; padding:20px 2px}
  .placa{padding:18px 20px}
  .placa img{width:165px}
  .zap-flutua{width:56px; height:56px}
  .zap-flutua svg{width:27px; height:27px}
}

/* ---------- 24. PÁGINAS INTERNAS (privacidade / termos) ---------- */
.topo--simples .nav{margin-left:auto}
.legal{padding-block:clamp(44px,5.4vw,84px) clamp(56px,6.4vw,100px)}
.legal__cabec{padding-bottom:clamp(28px,3vw,40px); margin-bottom:clamp(28px,3vw,40px); border-bottom:1px solid var(--linha)}
.legal__cabec h1{font-size:clamp(1.95rem,1.4rem + 2.2vw,2.9rem); margin-bottom:14px}
.legal__meta{margin:0; font:500 .655rem/1.5 var(--sans); letter-spacing:.17em; text-transform:uppercase; color:var(--ouro-700)}
.legal__corpo{max-width:74ch}
.legal__corpo h2,.legal__corpo h3{font-variant-numeric:lining-nums; font-feature-settings:"lnum" 1}
.legal__corpo h2{font-size:clamp(1.26rem,1.12rem + .7vw,1.58rem); margin:clamp(34px,3.4vw,50px) 0 14px}
.legal__corpo h2:first-child{margin-top:0}
.legal__corpo h3{font-size:1.08rem; margin:28px 0 10px}
.legal__corpo p,.legal__corpo li{font-size:.945rem; line-height:1.8; color:var(--texto)}
.legal__corpo ul,.legal__corpo ol{margin:0 0 1.1em; padding-left:22px}
.legal__corpo li{margin-bottom:.55em}
.legal__corpo li::marker{color:var(--ouro-500)}
.legal__corpo a{color:var(--ouro-900); text-underline-offset:3px}
.legal__corpo strong{color:var(--vinho-900); font-weight:600}
.caixa-dado{margin:22px 0; padding:22px 24px; background:var(--bege); border:1px solid var(--linha);
  border-left:3px solid var(--ouro-500); border-radius:var(--raio)}
.caixa-dado p{margin:0 0 .5em}
.caixa-dado p:last-child{margin:0}
.voltar{display:inline-flex; align-items:center; gap:.6em; margin-top:clamp(38px,4vw,54px); text-decoration:none;
  font:600 .69rem/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--ouro-700); transition:color .25s}
.voltar:hover{color:var(--ouro-900)}
.voltar .seta{transform:rotate(180deg); transition:transform .3s var(--ease)}
.voltar:hover .seta{transform:rotate(180deg) translateX(4px)}

/* ---------- 25. PÁGINA DE CONFIRMAÇÃO ---------- */
.obrigado{display:grid; justify-items:center; text-align:center; padding-block:clamp(28px,4vw,56px)}
.obrigado__ico{display:grid; place-items:center; width:70px; height:70px; margin-bottom:28px;
  border:1px solid var(--linha-forte); border-radius:50%; color:var(--ouro-500); background:var(--branco)}
.obrigado__ico .ico{width:34px; height:34px}
.obrigado h1{font-size:clamp(1.95rem,1.4rem + 2.2vw,2.9rem)}
.obrigado .sobrancelha{justify-content:center}
.obrigado .sobrancelha::after{content:""; width:34px; height:1px; background:currentColor; opacity:.6; flex:none}
.obrigado__nota{margin:26px 0 0; max-width:56ch; font-size:.83rem; line-height:1.65; color:var(--texto-mudo)}
.obrigado__acoes{display:flex; flex-wrap:wrap; justify-content:center; gap:13px; margin-top:36px}
@media (max-width:520px){ .obrigado__acoes .btn{width:100%} }