/* ===================================================
   Rafael Boreli Advogados Associados — Design System
   Teal + gold + serif identity, derived from client's
   provided brand asset (post template).
=================================================== */

:root{
  --ink:#0B0F10;
  --teal-900:#06393E;
  --teal-800:#0B4B52;
  --teal-950:#042628;
  --teal-panel:#082F33;
  --gold:#C3A868;
  --gold-soft:#E4D3A0;
  --gold-dim:#8C784C;
  --paper:#F4F2EC;
  --mist:#C7D3D2;
  --mist-dim:#93A3A2;
  --line:rgba(244,242,236,0.12);
  --line-gold:rgba(195,168,104,0.35);
  --radius-s:6px;
  --radius-m:12px;
  --radius-l:22px;
  --wrap:1180px;
  --ease:cubic-bezier(.19,1,.22,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0;
  background:var(--ink);
  color:var(--mist);
  font-family:'Manrope',sans-serif;
  font-weight:400;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

h1,h2,h3{
  font-family:'Bitter',serif;
  color:var(--paper);
  margin:0;
  line-height:1.12;
  font-weight:600;
  letter-spacing:-0.01em;
}

p{margin:0;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
button{font-family:inherit;}

a:focus-visible, button:focus-visible{
  outline:2px solid var(--gold-soft);
  outline-offset:3px;
  border-radius:4px;
}

.wrap{
  max-width:var(--wrap);
  margin:0 auto;
  padding:0 32px;
}

.eyebrow{
  display:flex;
  align-items:center;
  gap:10px;
  font-family:'Manrope',sans-serif;
  font-weight:700;
  font-size:12.5px;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--gold-soft);
  margin-bottom:18px;
}
.eyebrow svg{flex:none;}

.btn{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:15px 26px;
  border-radius:var(--radius-s);
  font-weight:700;
  font-size:15px;
  letter-spacing:0.01em;
  border:1px solid transparent;
  cursor:pointer;
  transition:transform .35s var(--ease), background .35s var(--ease), border-color .35s var(--ease), color .35s var(--ease);
  white-space:nowrap;
}
.btn-gold{background:var(--gold); color:var(--teal-950);}
.btn-gold:hover{background:var(--gold-soft); transform:translateY(-2px);}
.btn-ghost{background:transparent; color:var(--paper); border-color:var(--line);}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold-soft); transform:translateY(-2px);}
.btn svg{flex:none;}

/* ---------- NAV ---------- */
header.site-nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(11,15,16,0.0);
  backdrop-filter:blur(0px);
  transition:background .4s var(--ease), backdrop-filter .4s var(--ease), border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
header.site-nav.scrolled{
  background:rgba(8,14,15,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 32px; max-width:var(--wrap); margin:0 auto;
}
.brand{display:flex; align-items:center; gap:12px;}
.brand svg{width:34px; height:27px; flex:none;}
.brand-word{font-family:'Bitter',serif; line-height:1.05;}
.brand-word b{display:block; font-size:15.5px; font-weight:700; color:var(--paper); letter-spacing:0.01em;}
.brand-word span{display:block; font-family:'Manrope',sans-serif; font-size:9.5px; font-weight:600; letter-spacing:0.14em; color:var(--mist-dim); text-transform:uppercase; margin-top:2px;}

nav.nav-links{display:flex; align-items:center; gap:34px;}
nav.nav-links a{font-size:14px; font-weight:600; color:var(--mist); position:relative; padding:4px 0; transition:color .3s;}
nav.nav-links a:hover{color:var(--paper);}
nav.nav-links a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--gold); transition:width .3s var(--ease);}
nav.nav-links a:hover::after{width:100%;}
nav.nav-links a.active{color:var(--paper);}
nav.nav-links a.active::after{width:100%;}

.nav-cta{display:flex; align-items:center; gap:18px;}
.nav-cta .btn{padding:11px 20px; font-size:13.5px;}

.hamburger{display:none; flex-direction:column; gap:5px; background:none; border:none; padding:8px; cursor:pointer;}
.hamburger span{width:22px; height:2px; background:var(--paper); display:block; transition:transform .3s, opacity .3s;}
.mobile-panel{display:none; position:fixed; inset:0; z-index:99; background:var(--teal-950); padding:100px 32px 40px; flex-direction:column; gap:26px; overflow-y:auto;}
.mobile-panel a{font-family:'Bitter',serif; font-size:24px; color:var(--paper); font-weight:600;}
.mobile-panel a.active{color:var(--gold-soft);}
body.menu-open .mobile-panel{display:flex;}
body.menu-open{overflow:hidden;}

@media (max-width:900px){
  nav.nav-links{display:none;}
  .nav-cta .btn-ghost{display:none;}
  .hamburger{display:flex;}
}

/* ---------- SECTION SCAFFOLD ---------- */
section{position:relative;}
.panel-dark{background:var(--ink);}
.panel-teal{background:linear-gradient(180deg, var(--teal-950) 0%, var(--teal-panel) 100%);}
.sec-pad{padding:120px 0;}
@media (max-width:700px){ .sec-pad{padding:80px 0;} }

.reveal{opacity:0; transform:translateY(22px); transition:opacity .8s var(--ease), transform .8s var(--ease);}
.reveal.is-visible{opacity:1; transform:translateY(0);}

.tri-pattern-bg{position:absolute; inset:0; opacity:0.14; pointer-events:none;}
.hero-glow{position:absolute; top:-10%; right:-8%; width:640px; height:640px; background:radial-gradient(circle, rgba(195,168,104,0.14), transparent 70%); pointer-events:none;}

/* ---------- HERO (home) ---------- */
.hero{
  position:relative; min-height:100svh; display:flex; align-items:center;
  background:
    radial-gradient(ellipse 900px 700px at 78% 20%, rgba(11,75,82,0.55), transparent 60%),
    linear-gradient(150deg, #081416 0%, var(--teal-950) 46%, #05282b 100%);
  padding:150px 0 90px; overflow:hidden;
}
.hero-grid{position:relative; z-index:2; display:grid; grid-template-columns:1.05fr 0.85fr; gap:40px; align-items:center;}
.hero h1{font-size:clamp(38px, 5.2vw, 66px); max-width:12ch;}
.hero-sub{margin-top:26px; font-size:18px; color:var(--mist); max-width:44ch; line-height:1.65;}
.hero-actions{margin-top:38px; display:flex; align-items:center; gap:18px; flex-wrap:wrap;}
.hero-hours{margin-top:26px; font-size:13.5px; color:var(--mist-dim); display:flex; align-items:center; gap:9px;}
.hero-visual{position:relative; display:flex; align-items:center; justify-content:center;}
.hero-visual svg{width:100%; max-width:420px; height:auto;}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; text-align:left;}
  .hero-visual{order:-1; margin-bottom:10px;}
  .hero-visual svg{max-width:230px;}
  .hero{padding-top:130px;}
}

/* ---------- PAGE HEADER (interior pages) ---------- */
.page-header{
  position:relative;
  padding:168px 0 76px;
  background:
    radial-gradient(ellipse 700px 500px at 85% 0%, rgba(11,75,82,0.5), transparent 60%),
    linear-gradient(150deg, #081416 0%, var(--teal-950) 55%, #05282b 100%);
  overflow:hidden;
}
.breadcrumb{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--mist-dim); margin-bottom:26px; position:relative; z-index:2;}
.breadcrumb a:hover{color:var(--gold-soft);}
.page-header h1{font-size:clamp(32px,4.4vw,50px); max-width:16ch; position:relative; z-index:2;}
.page-header .lead{margin-top:18px; font-size:16.5px; color:var(--mist); max-width:60ch; line-height:1.65; position:relative; z-index:2;}

/* ---------- SOBRE ---------- */
.sobre-grid{display:grid; grid-template-columns:0.9fr 1.1fr; gap:80px; align-items:start;}
.sobre-grid h2{font-size:clamp(28px,3.4vw,40px); max-width:11ch;}
.sobre-copy p{font-size:16.5px; color:var(--mist); margin-bottom:20px; max-width:60ch;}
.sobre-copy p:last-child{margin-bottom:0;}
.sobre-copy strong{color:var(--paper); font-weight:700;}
.sobre-marks{margin-top:36px; display:flex; gap:34px; flex-wrap:wrap;}
.sobre-mark{max-width:220px;}
.sobre-mark .tri-mini{margin-bottom:10px;}
.sobre-mark b{display:block; font-family:'Bitter',serif; color:var(--paper); font-size:15.5px; margin-bottom:4px;}
.sobre-mark span{font-size:13.5px; color:var(--mist-dim); line-height:1.5;}

@media (max-width:900px){ .sobre-grid{grid-template-columns:1fr; gap:36px;} }

/* ---------- STEPS (processo) ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-l); overflow:hidden;}
.step{background:var(--teal-950); padding:38px 34px;}
.step .num{font-family:'Bitter',serif; font-size:14px; color:var(--gold); font-weight:700; letter-spacing:0.04em; margin-bottom:16px; display:block;}
.step h3{font-family:'Bitter',serif; font-size:18.5px; color:var(--paper); font-weight:600; margin-bottom:10px;}
.step p{font-size:14.5px; color:var(--mist-dim); line-height:1.6;}
@media (max-width:800px){ .steps{grid-template-columns:1fr;} }

/* ---------- AREAS ---------- */
.areas-head{display:flex; justify-content:space-between; align-items:flex-end; gap:40px; margin-bottom:60px; flex-wrap:wrap;}
.areas-head h2{font-size:clamp(28px,3.4vw,40px); max-width:14ch;}
.areas-head p{max-width:38ch; font-size:15.5px; color:var(--mist-dim);}
.areas-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-l); overflow:hidden;}
.area-card{background:var(--teal-950); padding:38px 32px; transition:background .35s var(--ease);}
.area-card:hover{background:#0A3238;}
.area-card .tri-mini{margin-bottom:22px;}
.area-card h3{font-family:'Bitter',serif; font-size:19px; color:var(--paper); font-weight:600; margin-bottom:12px;}
.area-card p{font-size:14.5px; color:var(--mist-dim); line-height:1.6;}
.area-card.detailed{padding:42px 36px;}
.area-card .also{margin-top:16px; padding-top:16px; border-top:1px solid var(--line); font-size:13px; color:var(--mist-dim);}
.area-card .also b{color:var(--gold-soft); display:block; font-size:11px; text-transform:uppercase; letter-spacing:.08em; margin-bottom:6px; font-weight:700;}

@media (max-width:900px){ .areas-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:600px){ .areas-grid{grid-template-columns:1fr;} }

/* ---------- EQUIPE ---------- */
.equipe-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:32px;}
.equipe-card{display:flex; gap:22px; align-items:flex-start; padding:34px; border:1px solid var(--line); border-radius:var(--radius-l); background:linear-gradient(160deg, rgba(195,168,104,0.05), transparent 60%);}
.equipe-card.full{flex-direction:column; padding:44px;}
.equipe-card.full .avatar{width:84px; height:84px; font-size:24px; margin-bottom:20px;}
.avatar{flex:none; width:64px; height:64px; border-radius:50%; border:1.5px solid var(--line-gold); display:flex; align-items:center; justify-content:center; font-family:'Bitter',serif; font-weight:700; font-size:19px; color:var(--gold-soft); background:var(--teal-panel);}
.equipe-card h3{font-family:'Bitter',serif; font-size:19px; color:var(--paper); font-weight:600; margin-bottom:4px;}
.equipe-card .role{font-size:12.5px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--gold-soft); margin-bottom:12px; display:block;}
.equipe-card p.desc{font-size:14.5px; color:var(--mist-dim); line-height:1.6;}

@media (max-width:700px){ .equipe-grid{grid-template-columns:1fr;} }

/* ---------- CONTATO ---------- */
.contato-grid{display:grid; grid-template-columns:0.95fr 1.05fr; gap:0; border:1px solid var(--line); border-radius:var(--radius-l); overflow:hidden;}
.contato-info{background:var(--teal-950); padding:56px 48px;}
.contato-info h2{font-size:clamp(26px,3vw,34px); max-width:12ch; margin-bottom:18px;}
.contato-info > p{color:var(--mist); font-size:15.5px; margin-bottom:34px; max-width:40ch;}
.contato-list{display:flex; flex-direction:column; gap:22px; margin-bottom:36px;}
.contato-item{display:flex; gap:14px; align-items:flex-start;}
.contato-item svg{flex:none; margin-top:2px;}
.contato-item b{display:block; font-size:11.5px; letter-spacing:0.1em; text-transform:uppercase; color:var(--mist-dim); font-weight:700; margin-bottom:4px;}
.contato-item span, .contato-item a{font-size:15px; color:var(--paper); font-weight:500;}
.contato-item a:hover{color:var(--gold-soft);}
.map-embed{min-height:420px; height:100%; filter:grayscale(0.35) contrast(1.05) invert(0.92) brightness(0.95);}
.map-embed iframe{width:100%; height:100%; min-height:420px; border:0; display:block;}

@media (max-width:900px){ .contato-grid{grid-template-columns:1fr;} .contato-info{padding:44px 28px;} }

/* ---------- CONTEUDO BAND ---------- */
.conteudo-band{display:flex; align-items:center; justify-content:space-between; gap:30px; flex-wrap:wrap; padding:52px 56px; background:linear-gradient(120deg, var(--teal-panel), var(--teal-950)); border-radius:var(--radius-l); border:1px solid var(--line);}
.conteudo-band h3{font-family:'Bitter',serif; font-size:24px; color:var(--paper); max-width:20ch; font-weight:600;}
.conteudo-band p{font-size:14.5px; color:var(--mist-dim); margin-top:10px; max-width:42ch;}

/* ---------- ARTIGOS ---------- */
.article-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.article-card{display:flex; flex-direction:column; border:1px solid var(--line); border-radius:var(--radius-l); padding:32px; background:linear-gradient(160deg, rgba(195,168,104,0.04), transparent 55%); transition:border-color .3s var(--ease), transform .3s var(--ease);}
.article-card:hover{border-color:var(--line-gold); transform:translateY(-4px);}
.article-tag{align-self:flex-start; font-size:10.5px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-soft); background:rgba(195,168,104,0.12); padding:6px 11px; border-radius:20px; margin-bottom:18px;}
.article-card h3{font-family:'Bitter',serif; font-size:19px; color:var(--paper); margin-bottom:12px; line-height:1.32; font-weight:600;}
.article-card p{font-size:14px; color:var(--mist-dim); margin-bottom:22px; line-height:1.65; flex:1;}
.article-card .read-more{font-size:13.5px; font-weight:700; color:var(--gold-soft); display:inline-flex; align-items:center; gap:7px; transition:gap .3s;}
.article-card:hover .read-more{gap:11px;}

@media (max-width:900px){ .article-grid{grid-template-columns:repeat(2,1fr);} }
@media (max-width:640px){ .article-grid{grid-template-columns:1fr;} }

/* ---------- ARTICLE SINGLE PAGE ---------- */
.article-meta{display:flex; gap:16px; align-items:center; flex-wrap:wrap; font-size:13px; color:var(--mist-dim); margin-top:22px; position:relative; z-index:2;}
.article-meta .dot{width:3px; height:3px; border-radius:50%; background:var(--mist-dim);}
.prose{max-width:70ch; margin:0 auto; padding:86px 32px 40px;}
.prose p{font-size:17px; color:var(--mist); margin-bottom:24px; line-height:1.85;}
.prose h2{font-size:25px; margin:44px 0 18px; max-width:none;}
.disclaimer{margin-top:52px; padding:24px 28px; border-left:3px solid var(--gold); background:rgba(195,168,104,0.06); font-size:14px; color:var(--mist-dim); border-radius:0 10px 10px 0; line-height:1.65;}
.article-cta{margin-top:52px; padding:40px; border-radius:var(--radius-l); border:1px solid var(--line); background:linear-gradient(120deg, var(--teal-panel), var(--teal-950)); text-align:center;}
.article-cta h3{font-size:22px; margin-bottom:10px;}
.article-cta p{color:var(--mist-dim); font-size:14.5px; margin-bottom:24px;}
.back-link{display:inline-flex; align-items:center; gap:8px; font-size:13.5px; font-weight:700; color:var(--mist-dim); margin:60px 32px 0; max-width:70ch; margin-left:auto; margin-right:auto;}
.back-link:hover{color:var(--gold-soft);}
.back-link-wrap{display:flex; justify-content:center;}

/* ---------- FOOTER ---------- */
footer{padding:56px 0 40px; border-top:1px solid var(--line); background:var(--ink);}
.footer-inner{display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;}
.footer-brand{display:flex; align-items:center; gap:12px;}
.footer-brand svg{width:26px; height:20px;}
.footer-brand span{font-size:13px; color:var(--mist-dim);}
.footer-meta{font-size:13px; color:var(--mist-dim); text-align:right;}
.footer-meta a{color:var(--mist-dim);}
.footer-meta a:hover{color:var(--gold-soft);}
.footer-links{display:flex; gap:22px; flex-wrap:wrap;}
.footer-links a{font-size:13px; color:var(--mist-dim);}
.footer-links a:hover{color:var(--gold-soft);}

/* ---------- FLOATING WHATSAPP ---------- */
.float-wa{
  position:fixed; right:24px; bottom:24px; z-index:90;
  width:58px; height:58px; border-radius:50%;
  background:var(--gold); color:var(--teal-950);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 30px rgba(0,0,0,0.4);
  transition:transform .3s var(--ease), background .3s;
}
.float-wa:hover{background:var(--gold-soft); transform:translateY(-3px) scale(1.04);}

::selection{background:var(--gold); color:var(--teal-950);}
