@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-400-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/jost-400-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-500-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/jost-500-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/jost-600-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/jost-600-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{--navy:#0A1E2B;--navy-2:#0E2634;--navy-3:#13303F;--bege:#D9D2C5;--bege-2:#EFE9DE;--texto:#E9E4DA;--suave:#A3ABB2;--borda:rgba(217,210,197,.30);--borda-2:rgba(217,210,197,.16)}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:'Jost',Arial,sans-serif;background:var(--navy);color:var(--texto);-webkit-font-smoothing:antialiased;line-height:1.5;font-size:16px;min-height:100vh}
img{display:block;max-width:100%}
a{color:inherit}
button{font-family:inherit;color:inherit;background:none;border:0;cursor:pointer}

.pagina{display:grid;grid-template-columns:1fr;min-height:100vh}
.conteudo{width:100%;max-width:520px;margin:0 auto;padding:0 22px 28px}

/* topo: logo */
.topo{padding:26px 0 0;text-align:center;position:relative;z-index:2}
.topo img{width:168px;height:auto;margin:0 auto}

/* retrato que se funde no azul */
.retrato{position:relative;margin:-88px -22px 0;aspect-ratio:1000/1219;overflow:hidden;background:var(--navy)}
.retrato img{width:100%;height:100%;object-fit:cover;object-position:center top}
.retrato:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--navy) 0%,rgba(10,30,43,.45) 6%,rgba(10,30,43,.18) 14%,rgba(10,30,43,.18) 100%)}
.retrato:after{content:'';position:absolute;left:0;right:0;bottom:0;height:50%;background:linear-gradient(180deg,rgba(10,30,43,0) 0%,rgba(10,30,43,.55) 45%,var(--navy) 100%)}

/* nome */
.nome{text-align:center;margin-top:-34px;position:relative;z-index:2}
.nome h1{font-weight:500;font-size:24px;letter-spacing:.32em;text-transform:uppercase;color:var(--bege-2);padding-left:.32em}
.nome .oab{font-size:14.5px;color:var(--bege);margin-top:6px;letter-spacing:.04em}

/* botão principal */
.wa{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-top:20px;background:var(--bege);color:var(--navy);border-radius:10px;padding:15px 18px;font-size:16px;font-weight:500;text-decoration:none;transition:background .15s ease}
.wa:hover{background:var(--bege-2)}
.wa svg{width:21px;height:21px}

/* cartões das áreas */
.areas{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.area{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;min-height:118px;padding:16px 12px;border:1px solid var(--borda);border-radius:10px;background:rgba(217,210,197,.04);text-decoration:none;color:var(--texto);font-size:14px;line-height:1.3;font-weight:500;transition:background .15s ease,border-color .15s ease}
.area:hover{background:rgba(217,210,197,.09);border-color:var(--bege)}
.area svg{width:34px;height:34px;color:var(--bege)}

/* linhas: sobre, como chegar, instagram */
.linhas{margin-top:16px;border-top:1px solid var(--borda-2)}
.linha{display:flex;align-items:center;gap:14px;width:100%;padding:15px 4px;border-bottom:1px solid var(--borda-2);text-decoration:none;color:var(--texto);font-size:15.5px;text-align:left}
.linha>svg:first-child{width:21px;height:21px;color:var(--bege);flex:none}
.linha .txt{flex:1}
.linha .txt small{display:block;font-size:12.5px;color:var(--suave);margin-top:1px}
.linha svg.seta{width:18px;height:18px;color:var(--suave);flex:none;transition:transform .2s ease}
.linha.aberta svg.seta{transform:rotate(90deg)}
.sobre{display:none;padding:6px 4px 18px;border-bottom:1px solid var(--borda-2);font-size:15px;line-height:1.65;color:var(--texto)}
.sobre.on{display:block}
.sobre p+p{margin-top:10px}
.sobre .dado{font-size:13px;color:var(--suave);margin-top:12px;line-height:1.6}

/* endereço */
.endereco{display:flex;align-items:flex-start;gap:12px;padding:16px 4px 0;font-size:14px;line-height:1.5;color:var(--texto);text-decoration:none}
.endereco>svg{width:20px;height:20px;color:var(--bege);flex:none;margin-top:2px}

/* rodapé */
.rodape{text-align:center;font-size:12px;color:var(--suave);padding:26px 0 0;line-height:1.8}
.rodape .legal a{text-decoration:none;color:var(--suave)}
.rodape .legal span{opacity:.5;margin:0 6px}
.rodape .click{display:inline-flex;align-items:center;gap:8px;margin-top:8px;text-decoration:none;color:var(--suave);font-size:12px}
.rodape .click img{height:13px;width:auto}

/* coluna do retrato no computador */
.lado-foto{display:none}
@media (min-width:960px){
  .pagina{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .conteudo{max-width:560px;margin:0 0 0 auto;padding:0 56px 40px 40px;align-self:center}
  .topo{text-align:left;padding-top:40px}.topo img{margin:0}
  .retrato{display:none}
  .nome{text-align:left;margin-top:34px}.nome h1{font-size:30px;padding-left:0}
  .lado-foto{display:block;position:sticky;top:0;height:100vh;overflow:hidden}
  .lado-foto img{width:100%;height:100%;object-fit:cover;object-position:center top}
  .lado-foto:before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,var(--navy) 0%,rgba(10,30,43,.35) 6%,rgba(10,30,43,.16) 14%,rgba(10,30,43,.16) 100%)}
  .lado-foto:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 0%,rgba(10,30,43,.55) 18%,rgba(10,30,43,0) 45%),linear-gradient(180deg,rgba(10,30,43,0) 55%,var(--navy) 100%)}
  .rodape{text-align:left}
}

/* caixinhas (área do WhatsApp e mapa) */
.caixa{position:fixed;inset:0;z-index:60;background:rgba(3,12,18,.7);display:flex;align-items:flex-end;justify-content:center;padding:14px}
.caixa[hidden]{display:none}
.caixa-in{width:100%;max-width:460px;background:var(--navy-2);border:1px solid var(--borda);border-radius:16px;padding:22px 18px 12px}
.caixa-in h2{font-weight:500;font-size:19px;color:var(--bege-2);text-align:center;letter-spacing:.02em}
.caixa-in p{font-size:13.5px;color:var(--suave);text-align:center;margin-top:4px}
.caixa-in .opcoes{margin-top:14px;display:grid;gap:9px}
.caixa-in .opcoes a{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--texto);border:1px solid var(--borda);border-radius:10px;padding:13px 14px;font-size:15px;transition:background .15s ease}
.caixa-in .opcoes a:hover{background:rgba(217,210,197,.08)}
.caixa-in .opcoes a svg{width:22px;height:22px;color:var(--bege);flex:none}
.caixa-in .opcoes a.destaque{background:var(--bege);color:var(--navy);border-color:var(--bege);justify-content:center;font-weight:500}
.caixa-in .fechar{display:block;width:100%;text-align:center;color:var(--suave);font-size:13.5px;padding:12px 0 4px}
@media (min-width:700px){.caixa{align-items:center}}