/* ============================================================
   Gislene Ströher Advocacia
   Identidade: Origem (floresta, papel, barro · Lora + Source Sans 3)
   ============================================================ */

/* Fontes: Lora + Source Sans 3, carregadas por <link> no <head> de cada página (mais cedo que @import). */

:root{
  color-scheme: light;

  /* Cor */
  --paper:        #F4EDE1;
  --paper-deep:   #EBE2D2;
  --card:         #FBF7F0;
  --ink:          #30342F;
  --ink-soft:     #55574F;
  --green:        #1E3A32;
  --green-deep:   #162B25;
  --green-tint:   #E3E3D5;
  /* Barro: destaques sobre papel. Nunca texto barro sobre verde: lá vai o barro claro. */
  --bronze:       #A34B32;
  --bronze-lite:  #E0A68F;
  --rule:         #DCD1BE;
  --rule-soft:    #E7DECE;

  /* Tipografia */
  --serif: 'Lora', Georgia, 'Times New Roman', serif;
  --sans:  'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

  --t-xs:   0.875rem;    /* 14 */
  --t-sm:   1rem;        /* 16 */
  --t-base: 1.125rem;    /* 18: Source Sans desenha menor que a Inter */
  --t-md:   1.25rem;     /* 20 */
  --t-lg:   clamp(1.5rem, 1.2rem + 1.1vw, 1.875rem);
  --t-xl:   clamp(1.875rem, 1.4rem + 2.1vw, 2.75rem);
  --t-2xl:  clamp(2.375rem, 1.5rem + 3.6vw, 4rem);

  /* Espaço (escala espaçosa) */
  --s-1: 0.5rem;  --s-2: 1rem;   --s-3: 1.5rem;  --s-4: 2rem;
  --s-5: 3rem;    --s-6: 4rem;   --s-7: 6rem;    --s-8: 8rem;

  --wrap: 1200px;
  --gut: clamp(1.25rem, 5vw, 4rem);
  --ease: cubic-bezier(.22,.61,.36,1);
}

*,*::before,*::after{ box-sizing:border-box; }

html{ -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:var(--t-base);
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

h1,h2,h3,h4{
  font-family:var(--serif);
  font-weight:500;
  line-height:1.16;
  letter-spacing:-0.01em;
  margin:0;
  text-wrap:balance;
}
/* Títulos em floresta (marca); em blocos coloridos, papel */
h1,h2,h3,h4{ color:var(--green); }
.section--ink :is(h1,h2,h3,h4), .section--clay :is(h1,h2,h3,h4){ color:var(--paper); }
p{ margin:0; }
a{ color:inherit; }
img{ max-width:100%; height:auto; display:block; }

::selection{ background:var(--green); color:var(--paper); }

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

.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gut); }

.eyebrow{
  font-family:var(--sans);
  font-size:var(--t-xs);
  font-weight:500;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--bronze);
  margin:0;
}

.lead{ font-size:var(--t-md); line-height:1.6; color:var(--ink-soft); max-width:34ch; }

.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--green); color:var(--paper);
  padding:.75rem 1.25rem; font-size:var(--t-sm);
}
.skip:focus{ left:1rem; top:1rem; }

/* ---------- Cabeçalho ---------- */

.site-head{
  position:sticky; top:0; z-index:50;
  background:color-mix(in srgb, var(--paper) 88%, transparent);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid var(--rule-soft);
}
.site-head__in{
  display:flex; align-items:center; justify-content:space-between;
  gap:var(--s-3); min-height:76px;
}

.wordmark{
  text-decoration:none; display:flex; align-items:center; gap:.7rem;
  line-height:1.05; flex:none; white-space:nowrap; color:var(--green);
}
/* Símbolo com a altura do bloco de texto, como na assinatura aprovada */
.wordmark__mark{ width:auto; height:2.75rem; flex:none; fill:currentColor; overflow:visible; }
.wordmark__text{ display:block; }
.wordmark__name{
  font-family:var(--serif); font-size:1.5rem; font-weight:500;
  letter-spacing:-.005em; color:currentColor; display:block;
}
.wordmark__oab{
  font-family:var(--sans); font-size:.8125rem; font-weight:400;
  letter-spacing:.01em; color:currentColor;
  display:block; margin-top:.3rem;
}

.nav{ display:flex; align-items:center; gap:var(--s-3); }
.nav__list{ display:flex; gap:var(--s-3); list-style:none; margin:0; padding:0; }
.nav__link{
  font-size:var(--t-sm); font-weight:500; text-decoration:none; color:var(--ink-soft);
  padding:.5rem 0; position:relative; transition:color .2s var(--ease);
}
.nav__link::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1.5px;
  background:var(--bronze); transform:scaleX(0); transform-origin:left;
  transition:transform .25s var(--ease);
}
.nav__link:hover{ color:var(--ink); }
.nav__link:hover::after{ transform:scaleX(1); }
.nav__link[aria-current="page"]{ color:var(--green); }
.nav__link[aria-current="page"]::after{ transform:scaleX(1); }

.nav__toggle{
  display:none; background:none; border:1px solid var(--rule);
  width:44px; height:44px; border-radius:2px; cursor:pointer;
  align-items:center; justify-content:center; color:var(--green);
}

/* ---------- Botões ---------- */

.btn{
  display:inline-flex; align-items:center; gap:.6rem;
  font-family:var(--sans); font-size:var(--t-sm); font-weight:500;
  padding:.875rem 1.5rem; min-height:48px;
  border-radius:2px; text-decoration:none; cursor:pointer;
  border:1px solid transparent;
  transition:background-color .22s var(--ease), color .22s var(--ease), border-color .22s var(--ease);
}
.btn svg{ flex:none; }
.btn--solid{ background:var(--green); color:var(--paper); }
.btn--solid:hover{ background:var(--green-deep); }
.btn--ghost{ border-color:var(--rule); color:var(--ink); background:transparent; }
.btn--ghost:hover{ border-color:var(--green); color:var(--green); }
.btn--quiet{
  padding:0; min-height:0; border:0; background:none; color:var(--green);
  font-weight:500; border-bottom:1px solid var(--bronze-lite); border-radius:0;
}
.btn--quiet:hover{ border-bottom-color:var(--green); }

/* ---------- Abertura ---------- */

.hero{ padding-block:clamp(3rem, 7vw, 6rem) clamp(3.5rem, 8vw, 7rem); }
.hero__grid{
  display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem, 6vw, 5rem); align-items:center;
}
.hero__title{ font-size:var(--t-2xl); margin-block:1.25rem 1.5rem; max-width:15ch; }
.hero__lead{ font-size:var(--t-md); line-height:1.6; color:var(--ink-soft); max-width:40ch; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:var(--s-2); margin-top:var(--s-4); }

.portrait{ position:relative; }
.portrait__frame{
  aspect-ratio:4/5; background:var(--paper-deep);
  border:1px solid var(--rule); overflow:hidden; position:relative;
}
.portrait__frame img{ width:100%; height:100%; object-fit:cover; object-position:50% 22%; }
.portrait__frame picture{ display:block; width:100%; height:100%; }
.portrait__placeholder{
  position:absolute; inset:0; display:flex; flex-direction:column;
  align-items:center; justify-content:center; gap:.75rem; text-align:center;
  padding:var(--s-3); color:var(--bronze);
}
.portrait__placeholder span{
  font-family:var(--sans); font-size:var(--t-xs); letter-spacing:.12em;
  text-transform:uppercase; color:var(--ink-soft); max-width:22ch; line-height:1.6;
}
.portrait__frame::after{
  content:''; position:absolute; right:16px; bottom:16px;
  width:74px; height:74px; pointer-events:none;
  border-right:1px solid var(--bronze-lite);
  border-bottom:1px solid var(--bronze-lite);
}
.portrait__caption{
  margin-top:var(--s-2); font-size:var(--t-xs); color:var(--ink-soft);
  letter-spacing:.02em;
}

/* ---------- Seções ---------- */

.section{ padding-block:clamp(3.5rem, 8vw, 7rem); }
.section--tint{ background:var(--paper-deep); }
.section--ink{ background:var(--green); color:var(--paper); }
.section--ink .eyebrow{ color:var(--bronze-lite); }
.section--ink .lead{ color:color-mix(in srgb, var(--paper) 78%, transparent); }

.section__head{ max-width:46ch; margin-bottom:clamp(2rem, 4vw, 3.25rem); }
.section__title{ font-size:var(--t-xl); margin-top:1rem; }
.section__intro{ margin-top:1rem; color:var(--ink-soft); font-size:var(--t-md); line-height:1.6; }

/* ---------- Áreas ---------- */

.areas{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border-block:1px solid var(--rule); }
.area{
  background:var(--paper); padding:clamp(1.75rem,3vw,2.5rem);
  display:flex; flex-direction:column; gap:1rem; text-decoration:none;
  transition:background-color .25s var(--ease);
}
.area:hover{ background:var(--card); }
.area__num{
  font-family:var(--serif); font-size:var(--t-sm); font-style:italic;
  color:var(--bronze); letter-spacing:.02em;
}
.area__title{ font-size:var(--t-lg); color:var(--green); }
.area__text{ color:var(--ink-soft); font-size:var(--t-sm); line-height:1.7; flex:1; }
.area__more{
  font-size:var(--t-sm); font-weight:500; color:var(--green);
  display:inline-flex; align-items:center; gap:.5rem;
}
.area:hover .area__more svg{ transform:translateX(4px); }
.area__more svg{ transition:transform .25s var(--ease); }

/* ---------- Compromisso ---------- */

.pledge{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(1.5rem,3vw,2.5rem); }
.pledge__item{ display:flex; flex-direction:column; gap:.85rem; }
.pledge__icon{ color:var(--bronze-lite); }
.section--ink .pledge__title{ font-family:var(--serif); font-size:var(--t-md); font-weight:500; }
.pledge__text{ font-size:var(--t-sm); line-height:1.7; color:color-mix(in srgb, var(--paper) 72%, transparent); }

/* ---------- Citação ---------- */

.quote{ max-width:52ch; margin-inline:auto; text-align:center; }
.quote__mark{ color:var(--bronze-lite); margin-inline:auto; margin-bottom:var(--s-2); }
.quote__text{
  font-family:var(--serif); font-size:var(--t-lg); font-style:italic;
  line-height:1.45; color:var(--green); margin:0;
}
.quote__by{ margin-top:var(--s-3); font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--bronze); }

/* ---------- Split (sobre resumo) ---------- */

.split{ display:grid; grid-template-columns:1fr 1.15fr; gap:clamp(2rem,6vw,5rem); align-items:center; }
.split__body p + p{ margin-top:1.15rem; }
.split__body p{ color:var(--ink-soft); }

.facts{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule); }
.fact{ background:var(--paper); padding:clamp(1.25rem,2.5vw,1.75rem); }
.fact__n{ font-family:var(--serif); font-size:var(--t-xl); color:var(--green); line-height:1; display:block; }
.fact__l{ margin-top:.6rem; font-size:var(--t-xs); line-height:1.6; color:var(--ink-soft); letter-spacing:.02em; }

/* ---------- Conteúdo longo (páginas de área) ---------- */

.page-hero{ padding-block:clamp(2.5rem,6vw,4.5rem) clamp(2rem,5vw,3.5rem); border-bottom:1px solid var(--rule); }
.page-hero__title{ font-size:var(--t-2xl); margin-block:1.25rem 1.5rem; max-width:16ch; }
.page-hero__lead{ font-size:var(--t-md); line-height:1.6; color:var(--ink-soft); max-width:52ch; }

.crumb{ font-size:var(--t-xs); color:var(--ink-soft); }
.crumb a{ color:var(--ink-soft); text-decoration:none; border-bottom:1px solid var(--rule); }
.crumb a:hover{ color:var(--green); border-bottom-color:var(--bronze); }
.crumb span{ color:var(--bronze); margin-inline:.5rem; }

.prose{ max-width:64ch; }
.prose h3{ font-size:var(--t-lg); color:var(--green); margin-top:var(--s-5); }
.prose h3:first-child{ margin-top:0; }
.prose p{ margin-top:1.15rem; color:var(--ink-soft); }
.prose ul{ margin:1.15rem 0 0; padding:0; list-style:none; }
.prose li{ position:relative; padding-left:1.75rem; margin-top:.75rem; color:var(--ink-soft); }
.prose li::before{
  content:''; position:absolute; left:.35rem; top:.66em;
  width:5px; height:5px; background:var(--bronze);
  transform:rotate(45deg);
}

.doc-grid{ display:grid; grid-template-columns:minmax(0,64ch) minmax(0,1fr); gap:clamp(2rem,6vw,5rem); align-items:start; }

.aside-card{
  background:var(--card); border:1px solid var(--rule);
  padding:clamp(1.5rem,3vw,2rem); position:sticky; top:104px;
}
.aside-card__title{ font-family:var(--serif); font-size:var(--t-md); color:var(--green); }
.aside-card p{ margin-top:.85rem; font-size:var(--t-sm); line-height:1.7; color:var(--ink-soft); }
.aside-card .btn{ margin-top:1.25rem; width:100%; justify-content:center; }

/* ---------- Etapas ---------- */

.steps{ list-style:none; margin:0; padding:0; counter-reset:step; }
.steps li{
  counter-increment:step; position:relative;
  padding:0 0 var(--s-4) var(--s-5);
  border-left:1px solid var(--rule);
}
.steps li:last-child{ border-left-color:transparent; padding-bottom:0; }
.steps li::before{
  content:counter(step,decimal-leading-zero);
  position:absolute; left:0; top:-.2em; transform:translateX(-50%);
  background:var(--paper); color:var(--bronze);
  font-family:var(--serif); font-size:var(--t-sm); font-style:italic;
  padding-block:.15rem; width:2.25rem; text-align:center;
}
.section--tint .steps li::before{ background:var(--paper-deep); }
.steps h4{ font-size:var(--t-md); color:var(--green); }
.steps p{ margin-top:.55rem; font-size:var(--t-sm); line-height:1.7; color:var(--ink-soft); }

/* ---------- Perguntas ---------- */

.faq{ border-top:1px solid var(--rule); }
.faq details{ border-bottom:1px solid var(--rule); }
.faq summary{
  list-style:none; cursor:pointer; padding:1.4rem 2.5rem 1.4rem 0;
  font-family:var(--serif); font-size:var(--t-md); color:var(--green);
  position:relative; line-height:1.35;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{
  content:''; position:absolute; right:.35rem; top:50%; width:11px; height:11px;
  border-right:1.5px solid var(--bronze); border-bottom:1.5px solid var(--bronze);
  transform:translateY(-70%) rotate(45deg); transition:transform .25s var(--ease);
}
.faq details[open] summary::after{ transform:translateY(-20%) rotate(-135deg); }
.faq details p{ padding-bottom:1.4rem; margin:0; color:var(--ink-soft); font-size:var(--t-sm); line-height:1.75; max-width:62ch; }
.faq details p + p{ padding-top:0; margin-top:-.4rem; }

/* ---------- Timeline (sobre) ---------- */

.tl{ list-style:none; margin:0; padding:0; }
.tl li{ display:grid; grid-template-columns:7.5rem 1fr; gap:var(--s-3); padding-block:var(--s-3); border-top:1px solid var(--rule); }
.tl li:last-child{ border-bottom:1px solid var(--rule); }
.tl__when{ font-family:var(--serif); font-style:italic; color:var(--bronze); font-size:var(--t-sm); padding-top:.15rem; }
.tl__what h4{ font-size:var(--t-md); color:var(--green); }
.tl__what p{ margin-top:.5rem; font-size:var(--t-sm); line-height:1.7; color:var(--ink-soft); max-width:58ch; }

/* ---------- Contato ---------- */

.contact{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,6vw,5rem); align-items:start; }
.contact__list{ list-style:none; margin:var(--s-3) 0 0; padding:0; }
.contact__list li{ padding-block:1.1rem; border-top:1px solid color-mix(in srgb, var(--paper) 22%, transparent); }
.contact__list li:last-child{ border-bottom:1px solid color-mix(in srgb, var(--paper) 22%, transparent); }
.contact__k{ font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--bronze-lite); display:block; }
.contact__v{ font-family:var(--serif); font-size:var(--t-md); color:var(--paper); text-decoration:none; display:inline-block; margin-top:.35rem; }
a.contact__v{ border-bottom:1px solid color-mix(in srgb, var(--bronze-lite) 60%, transparent); }
a.contact__v:hover{ border-bottom-color:var(--bronze-lite); }
.section--ink .btn--solid{ background:var(--paper); color:var(--green); }
.section--ink .btn--solid:hover{ background:var(--bronze-lite); color:var(--green-deep); }

/* ---------- Rodapé ---------- */

.site-foot{ background:var(--green-deep); color:color-mix(in srgb, var(--paper) 70%, transparent); padding-block:var(--s-5) var(--s-4); font-size:var(--t-sm); }
.site-foot__top{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--s-4); padding-bottom:var(--s-4); border-bottom:1px solid color-mix(in srgb, var(--paper) 16%, transparent); }
.site-foot .wordmark{ color:var(--paper); }
.site-foot .wordmark__mark{ height:3.25rem; }
.site-foot .wordmark__name{ font-size:1.75rem; }
.site-foot h5{ font-family:var(--sans); font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; color:var(--bronze-lite); margin:0 0 1rem; font-weight:500; }
.site-foot ul{ list-style:none; margin:0; padding:0; }
.site-foot li{ margin-bottom:.6rem; }
.site-foot a{ color:inherit; text-decoration:none; }
.site-foot a:hover{ color:var(--paper); }
.site-foot__bar{ padding-top:var(--s-3); display:flex; flex-wrap:wrap; gap:var(--s-2) var(--s-4); justify-content:space-between; font-size:var(--t-xs); line-height:1.7; }
.site-foot__legal{ max-width:62ch; color:color-mix(in srgb, var(--paper) 52%, transparent); }

/* ---------- Botão flutuante WhatsApp ---------- */

.wa-float{
  position:fixed; right:clamp(1rem,3vw,1.75rem); bottom:clamp(1rem,3vw,1.75rem); z-index:60;
  width:54px; height:54px; border-radius:50%; background:var(--green);
  color:var(--paper); display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 22px rgba(26,25,23,.22); transition:transform .25s var(--ease), background-color .25s var(--ease);
}
.wa-float:hover{ transform:translateY(-3px); background:var(--green-deep); }

/* ---------- Revelação (só liga com JS) ---------- */

.js-reveal{ opacity:0; transform:translateY(16px); }
.js-reveal.is-in{ opacity:1; transform:none; transition:opacity .6s var(--ease), transform .6s var(--ease); }
@media (prefers-reduced-motion: reduce){
  .js-reveal, .js-reveal.is-in{ opacity:1; transform:none; transition:none; }
}

/* ---------- Responsivo ---------- */

@media (max-width: 1000px){
  .pledge{ grid-template-columns:repeat(2,1fr); }
  .doc-grid{ grid-template-columns:1fr; }
  .aside-card{ position:static; }
  .site-foot__top{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 980px){
  .hero__grid{ grid-template-columns:1fr; }
  .portrait{ order:-1; max-width:100%; }
  .portrait .portrait__frame{ aspect-ratio:1/1; }
  .portrait::after{ display:none; }
  .areas{ grid-template-columns:1fr; }
  .split{ grid-template-columns:1fr; }
  .contact{ grid-template-columns:1fr; }

  .nav__toggle{ display:inline-flex; }
  .nav__list{
    position:fixed; inset:76px 0 auto; background:var(--paper);
    flex-direction:column; gap:0; padding:var(--gut);
    border-bottom:1px solid var(--rule); display:none;
  }
  .nav.is-open .nav__list{ display:flex; }
  .nav__list li{ border-bottom:1px solid var(--rule-soft); }
  .nav__link{ display:block; padding:1rem 0; font-size:var(--t-md); }
  .nav__link::after{ display:none; }
  .nav > .btn{ display:none; }
}
@media (max-width: 400px){
  .wordmark__name{ font-size:1.3rem; }
  .wordmark__oab{ font-size:.75rem; }
  .wordmark__mark{ height:2.4rem; }
}

@media (max-width: 560px){
  .pledge{ grid-template-columns:1fr; }
  .facts{ grid-template-columns:1fr; }
  .tl li{ grid-template-columns:1fr; gap:.5rem; }
  .site-foot__top{ grid-template-columns:1fr; }
  .hero__actions .btn{ width:100%; justify-content:center; }
}

@media print{
  .site-head,.wa-float,.nav,.hero__actions{ display:none; }
  body{ background:#fff; }
}

/* ---------- Marcador de pendência (remover quando o dado chegar) ---------- */
[data-pendente]{
  background:repeating-linear-gradient(45deg,#FFF4D6,#FFF4D6 6px,#FFEBB3 6px,#FFEBB3 12px);
  color:#7A5A12 !important; border:1px dashed #C99A2E;
  padding:.1em .5em; border-radius:2px;
  font-family:var(--sans) !important; font-size:var(--t-xs) !important;
  font-style:normal !important; letter-spacing:.02em; line-height:1.5;
  display:inline-block;
}

/* ---------- Alvo de toque confortável no rodapé (mobile) ---------- */
@media (max-width: 980px){
  .site-foot li{ margin-bottom:0; }
  .site-foot li a, .site-foot li span{ display:inline-block; padding-block:.65rem; }
  .contact__v{ padding-block:.35rem; }
}

/* ============================================================
   Rodada 2: primeira conversa, artigos, formulário
   ============================================================ */

.split--wide{ grid-template-columns:.9fr 1.1fr; align-items:start; }
.split__pull{
  font-family:var(--serif); font-size:var(--t-lg); color:var(--green);
  line-height:1.4; margin-bottom:1.25rem;
}
.contact__sub{ font-family:var(--sans); font-size:var(--t-sm); opacity:.72; display:block; margin-top:.2rem; }

/* ---------- Como é a primeira conversa (home) ---------- */

.how{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.how__item{
  display:grid; grid-template-columns:auto 1fr; gap:1.25rem; align-items:start;
  padding-block:1.5rem; border-top:1px solid var(--rule);
}
.how__item:last-child{ border-bottom:1px solid var(--rule); }
.how__icon{
  color:var(--bronze); width:48px; height:48px; border:1px solid var(--rule);
  display:flex; align-items:center; justify-content:center; background:var(--card);
}
.how__title{ font-size:var(--t-md); color:var(--green); }
.how__text{ margin-top:.4rem; font-size:var(--t-sm); line-height:1.7; color:var(--ink-soft); max-width:48ch; }

/* ---------- Artigos ---------- */

.posts{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); }
.post{
  background:var(--paper); padding:clamp(1.5rem,3vw,2.25rem);
  display:flex; flex-direction:column; gap:.85rem; text-decoration:none;
  transition:background-color .25s var(--ease);
}
.section--tint .post{ background:var(--paper-deep); }
.post:hover{ background:var(--card); }
.post__meta{ font-size:var(--t-xs); letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft); }
.post__area{ color:var(--bronze); font-weight:500; }
.post__title{ font-size:var(--t-md); color:var(--green); line-height:1.3; }
.post__excerpt{ font-size:var(--t-sm); line-height:1.7; color:var(--ink-soft); flex:1; }
.post:hover .area__more svg{ transform:translateX(4px); }

.prose--article p:first-child{ font-size:var(--t-md); line-height:1.65; color:var(--ink); }
.prose--article h3{ margin-top:var(--s-5); }
.prose--article strong{ color:var(--ink); font-weight:600; }
.post__foot{ margin-top:var(--s-5); padding-top:var(--s-3); border-top:1px solid var(--rule); font-size:var(--t-xs); color:var(--ink-soft); }
.post__by{ font-size:var(--t-sm); color:var(--ink-soft); margin-top:.5rem; }
.post__by a{ color:var(--green); }

/* ---------- Formulário ---------- */

.form__title{ font-family:var(--serif); font-size:var(--t-md); color:var(--paper); margin-bottom:1.25rem; }
.contact__form{ padding-top:.35rem; }
.form{ display:flex; flex-direction:column; gap:1.1rem; }
.form__row{ display:flex; flex-direction:column; gap:.45rem; }
.form__label{ font-size:var(--t-sm); font-weight:500; color:inherit; }
.form__hint{ font-weight:400; opacity:.72; }
.form__input{
  font:inherit; font-size:1rem; color:var(--ink);
  background:var(--paper); border:1px solid var(--rule); border-radius:2px;
  padding:.8rem .95rem; min-height:48px; width:100%;
  transition:border-color .2s var(--ease), box-shadow .2s var(--ease);
}
.form__input:focus{ outline:none; border-color:var(--bronze); box-shadow:0 0 0 3px color-mix(in srgb, var(--bronze) 28%, transparent); }
.form__input[aria-invalid="true"]{ border-color:#B4432F; }
textarea.form__input{ resize:vertical; min-height:8.5rem; line-height:1.55; }
select.form__input{
  appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23A34B32' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat:no-repeat; background-position:right .95rem center; padding-right:2.6rem;
}
.form__error{ font-size:var(--t-sm); color:#F2B8AB; }
.contact__form--light .form__error{ color:#9A3A28; }
.form .btn{ align-self:flex-start; }
.form__note{ font-size:var(--t-xs); line-height:1.6; opacity:.75; max-width:46ch; }

/* Formulário em fundo claro (página de atendimento) */
.contact__form--light .form__title{ color:var(--green); }
.contact__form--light .form__label{ color:var(--ink); }
.contact__form--light .form__input{ background:var(--card); }
.contact__form--light .form__note{ color:var(--ink-soft); opacity:1; }

/* Contato: coluna da lista + coluna do formulário */
.section--ink .contact__list{ margin-top:var(--s-4); }
.section--ink .form__label{ color:var(--paper); }

/* ---------- Responsivo (rodada 2) ---------- */

@media (max-width: 1000px){
  .posts{ grid-template-columns:1fr; }
}
@media (max-width: 980px){
  .split--wide{ grid-template-columns:1fr; }
}

/* ---------- Avatar (foto de perfil, 150px de origem: só em tamanhos pequenos) ---------- */
.avatar{
  border-radius:50%; object-fit:cover; flex:none;
  border:1px solid var(--rule); box-shadow:0 0 0 3px var(--paper);
  filter:grayscale(.15) contrast(1.03);
}
.eyebrow-row{ display:flex; align-items:center; gap:.9rem; margin-bottom:.35rem; }
.eyebrow-row .eyebrow{ margin:0; }
.byline{ display:flex; align-items:center; gap:1rem; margin-top:.75rem; }
.byline .post__by{ margin:0; line-height:1.55; }
.aside-card__who{
  display:flex; align-items:center; gap:.75rem; margin-bottom:1.1rem;
  font-family:var(--serif); font-size:var(--t-sm); color:var(--ink-soft);
}

/* ============================================================
   Rodada 3: ilustração, diagramas, movimento
   Regra: nenhum estado inicial de animação vive aqui.
   Tudo nasce visível; o GSAP em motion.js é quem esconde e revela.
   ============================================================ */

.illus, .ic{ color:var(--bronze); display:block; flex:none; }
.illus path, .ic path{ stroke-dasharray:1; stroke-dashoffset:0; }
.section--ink .illus, .section--ink .ic{ color:var(--bronze-lite); }

/* Cabeçalho que encolhe ao rolar */
.site-head__in{ transition:min-height .3s var(--ease); }
.site-head.is-compact .site-head__in{ min-height:60px; }
.site-head.is-compact .wordmark__oab{ display:none; }
.wordmark__mark{ transition:height .3s var(--ease); }
.site-head.is-compact .wordmark__mark{ height:2rem; }

/* Abertura: título mais curto, lead de 2 linhas */
.hero__lead{ max-width:36ch; }

/* ---------- Áreas com ilustração ---------- */
.area{ gap:.75rem; }
.area__illus{ margin-bottom:.5rem; transition:color .3s var(--ease), transform .4s var(--ease); }
.area__illus .illus{ width:88px; height:88px; }
.area:hover .area__illus{ color:var(--green); transform:translateY(-3px); }
.area__text{ max-width:30ch; }

/* ---------- Compromisso: título + uma linha ---------- */
.pledge__text{ max-width:26ch; }

/* ---------- Grid de casos ("quando me procurar") ---------- */
.cases{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:1.5rem; }
.case{ background:var(--paper); padding:1.35rem 1.35rem 1.45rem; display:flex; flex-direction:column; gap:.7rem; }
.section--tint .case{ background:var(--paper-deep); }
.case__text{ font-size:var(--t-sm); line-height:1.55; color:var(--ink); margin:0; }

/* ---------- Etapas em linha do tempo horizontal ---------- */
.tl-h{ position:relative; list-style:none; margin:2.5rem 0 0; padding:0;
       display:grid; grid-template-columns:repeat(5,1fr); gap:1.25rem; counter-reset:etapa; }
.tl-h::before{ content:''; position:absolute; left:0; right:0; top:27px; height:1px; background:var(--rule); }
.tl-h__line{ position:absolute; left:0; right:0; top:27px; height:1px; background:var(--bronze); transform-origin:left; transform:scaleX(0); }
.tl-h li{ position:relative; counter-increment:etapa; }
.tl-h__dot{
  width:56px; height:56px; border-radius:50%; background:var(--paper);
  border:1px solid var(--rule); display:flex; align-items:center; justify-content:center;
  position:relative; z-index:1;
}
.section--tint .tl-h__dot{ background:var(--paper-deep); }
.tl-h__num{ font-family:var(--serif); font-style:italic; font-size:var(--t-xs); color:var(--bronze); margin:1rem 0 .25rem; display:block; }
.tl-h h4{ font-size:var(--t-base); color:var(--green); }
.tl-h p{ margin-top:.4rem; font-size:var(--t-xs); line-height:1.6; color:var(--ink-soft); }

/* ---------- Diagrama de decisão: cartório ou Justiça ---------- */
.decision{ display:grid; grid-template-columns:1fr; gap:1.5rem; margin-top:1.75rem; }
.prose .decision li{ padding-left:0; margin-top:0; }
.prose .decision li::before{ display:none; }
.decision__qs{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; }
.decision__q{
  display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center;
  padding:1.1rem 0; border-top:1px solid var(--rule);
}
.decision__q:last-child{ border-bottom:1px solid var(--rule); }
.decision__q .ic{ color:var(--bronze); }
.decision__label{ font-family:var(--serif); font-size:var(--t-md); color:var(--green); line-height:1.3; }
.decision__yes{ font-family:var(--sans); font-size:var(--t-xs); letter-spacing:.1em; text-transform:uppercase; color:var(--bronze); white-space:nowrap; }
.decision__out{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.decision__box{
  border:1px solid var(--rule); padding:1.25rem; display:flex; flex-direction:column; gap:.5rem;
  align-items:flex-start; justify-content:center; background:var(--card);
}
.decision__box--yes{ border-color:var(--green); }
.decision__box strong{ font-family:var(--serif); font-weight:500; font-size:var(--t-md); color:var(--green); }
.decision__box span{ font-size:var(--t-xs); color:var(--ink-soft); line-height:1.5; }
.decision__box .illus{ width:44px; height:44px; }

/* ---------- Diagrama da meação ---------- */
.meacao{ margin-top:1.5rem; }
.meacao__bar{ display:grid; grid-template-columns:1fr 1fr; height:96px; border:1px solid var(--green); }
.meacao__half{ display:flex; align-items:center; justify-content:center; font-family:var(--serif); font-size:var(--t-md); color:var(--green); position:relative; }
.meacao__half--m{ background:var(--green-tint); }
.meacao__half--h{ display:grid; grid-template-columns:repeat(3,1fr); border-left:1px solid var(--green); }
.meacao__half--h span{ display:flex; align-items:center; justify-content:center; border-left:1px solid var(--rule); font-size:var(--t-xs); color:var(--ink-soft); font-family:var(--sans); letter-spacing:.06em; text-transform:uppercase; }
.meacao__half--h span:first-child{ border-left:0; }
.meacao__legend{ display:grid; grid-template-columns:1fr 1fr; gap:1.5rem; margin-top:.9rem; }
.meacao__legend p{ font-size:var(--t-sm); line-height:1.55; color:var(--ink-soft); margin:0; }
.meacao__legend strong{ display:block; font-family:var(--serif); font-weight:500; color:var(--green); font-size:var(--t-base); }

/* ---------- Prose enxuta nas áreas ---------- */
.prose--lean h3{ margin-top:var(--s-6); }
.prose--lean h3:first-child{ margin-top:0; }
.prose--lean > p{ max-width:58ch; }

/* ---------- Responsivo ---------- */
@media (max-width: 1000px){
  .tl-h{ grid-template-columns:1fr; gap:0; }
  .tl-h::before, .tl-h__line{ left:27px; right:auto; top:0; bottom:0; width:1px; height:auto; transform-origin:top; transform:scaleY(0); }
  .tl-h::before{ transform:none; }
  .tl-h li{ display:grid; grid-template-columns:56px 1fr; gap:1.25rem; padding-bottom:1.75rem; }
  .tl-h__num{ margin-top:0; }
  .tl-h li > div{ padding-top:.35rem; }
}
@media (max-width: 640px){
  .cases{ grid-template-columns:1fr; }
  .decision__out{ grid-template-columns:1fr; }
  .meacao__legend{ grid-template-columns:1fr; }
}

/* Citação puxada dentro do Sobre (substitui a seção centralizada) */
.pull{ margin:1.5rem 0 0; padding:.25rem 0 .25rem 1.25rem; border-left:2px solid var(--bronze-lite); }
.pull__text{ font-family:var(--serif); font-style:italic; font-size:var(--t-md); line-height:1.45; color:var(--green); margin:0; }
.section--tint .facts{ background:var(--rule); }
.section--tint .fact{ background:var(--paper); }
/* Linha do tempo: texto legível */
.tl-h p{ font-size:var(--t-sm); }
.tl-h h4{ font-size:var(--t-md); }
/* Ícones maiores no bloco verde */
.pledge__icon svg{ width:40px; height:40px; }
@media (max-width: 560px){
  .meacao__half--h span{ font-size:.625rem; letter-spacing:.02em; }
  .meacao__half{ font-size:var(--t-base); }
}

/* ---------- Checklist "o que trazer" ---------- */
.checks{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); }
.check{ background:var(--paper); padding:clamp(1.5rem,3vw,2.25rem); }
.check .illus{ width:72px; height:72px; margin-bottom:1rem; }
.check__title{ font-size:var(--t-md); color:var(--green); margin-bottom:1rem; }
.check__list{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:.7rem; }
.check__list li{ display:flex; align-items:flex-start; gap:.7rem; font-size:var(--t-sm); line-height:1.5; color:var(--ink); }
.check__list .ic{ width:22px; height:22px; margin-top:.1rem; }
.prose .cases{ margin-top:1.25rem; }
.prose .case__text strong{ display:block; font-family:var(--serif); font-weight:500; color:var(--green); font-size:var(--t-base); margin-bottom:.25rem; }
@media (max-width: 900px){ .checks{ grid-template-columns:1fr; } }

/* ============================================================
   Identidade Origem: barro e símbolo
   ============================================================ */

/* Seção em barro (uso pontual, ~12% da página). Texto sempre papel. */
.section--clay{ background:var(--bronze); color:var(--paper); }
.section--clay .eyebrow{ color:color-mix(in srgb, var(--paper) 82%, transparent); }
.section--clay .pledge__icon, .section--clay .illus, .section--clay .ic{ color:var(--paper); }
.section--clay .pledge__title{ font-family:var(--serif); font-size:var(--t-md); font-weight:500; }
.section--clay .pledge__text{ font-size:var(--t-sm); line-height:1.7; color:color-mix(in srgb, var(--paper) 86%, transparent); }

/* Símbolo grande e discreto no bloco de contato */
.section--ink[id="contato"]{ position:relative; overflow:hidden; }
.section--ink[id="contato"] > .wrap{ position:relative; z-index:1; }
.brand-mark{
  position:absolute; right:clamp(-4rem,-3vw,-1rem); bottom:-1px; z-index:0;
  width:clamp(15rem,34vw,30rem); height:auto; fill:var(--paper); opacity:.06; pointer-events:none;
}
@media (max-width: 980px){ .brand-mark{ width:70vw; opacity:.05; } }

/* ---------- Abertura da home: assinatura "Origem" em movimento ----------
   Nasce escondida; o motion.js liga, toca e retira. */
.hero-intro{
  display:none; position:fixed; inset:76px 0 0; z-index:40;
  background:var(--paper); align-items:center; justify-content:center;
  padding-bottom:76px; cursor:pointer;
}
.hero-intro__in{ display:flex; flex-direction:column; align-items:center; text-align:center; color:var(--green); }
.hero-intro__mark{ width:clamp(5.5rem,11vw,8.5rem); height:auto; fill:currentColor; }
.hero-intro__name{
  font-family:var(--serif); font-weight:500; letter-spacing:-.005em;
  font-size:clamp(2.4rem,5.4vw,4.25rem); line-height:1.1; margin-top:clamp(1rem,2vw,1.6rem);
}
.hero-intro__line{ font-family:var(--sans); font-size:clamp(1rem,1.6vw,1.3rem); margin-top:.6rem; letter-spacing:.01em; }
.intro-on .hero-intro{ display:flex; }
.intro-on .hero-intro__in{ visibility:hidden; }
.intro-on .site-head .wordmark{ opacity:0; }
.hero-intro__mark path{ will-change:auto; }

/* ============================================================
   Rodada 4: mais imagem, menos texto
   Fotos editoriais em assets/img/fotos (webp 800/1600).
   ============================================================ */

/* Faixa de confiança na abertura */
.trust{ list-style:none; margin:var(--s-4) 0 0; padding:var(--s-3) 0 0; border-top:1px solid var(--rule);
  display:flex; flex-wrap:wrap; gap:.75rem 2rem; font-size:var(--t-sm); color:var(--ink-soft); }
.trust strong{ font-family:var(--serif); font-weight:500; font-size:var(--t-md); color:var(--green); margin-right:.35rem; }

/* Moldura de foto */
.media{ margin:0; position:relative; overflow:hidden; background:var(--paper-deep); }
.media img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/3; }
.split--media{ grid-template-columns:1fr 1fr; align-items:center; }
.split--media .media img{ aspect-ratio:4/3.4; }
.split--rev .media img{ aspect-ratio:4/4.6; }

/* Áreas com foto: inventário em destaque */
.features{ display:grid; grid-template-columns:1.25fr 1fr; grid-template-rows:auto auto; gap:clamp(1rem,2vw,1.5rem); }
.feature{ position:relative; display:grid; grid-template-columns:1fr 1fr; background:var(--card); text-decoration:none;
  border:1px solid var(--rule); overflow:hidden; transition:border-color .25s var(--ease); }
.feature:hover{ border-color:var(--green); }
.feature__media{ display:block; overflow:hidden; background:var(--paper-deep); }
.feature__media img{ width:100%; height:100%; object-fit:cover; transition:transform .8s var(--ease); }
.feature:hover .feature__media img{ transform:scale(1.04); }
.feature__body{ display:flex; flex-direction:column; gap:.6rem; padding:clamp(1.25rem,2.5vw,2rem); justify-content:flex-end; }
.feature__title{ font-family:var(--serif); font-weight:500; font-size:var(--t-lg); color:var(--green); line-height:1.2; }
.feature__text{ font-size:var(--t-sm); color:var(--ink-soft); line-height:1.6; }
.feature .area__more{ margin-top:.4rem; }
.feature:hover .area__more svg{ transform:translateX(4px); }
.feature--main{ grid-row:span 2; grid-template-columns:1fr; grid-template-rows:1fr auto; }
.feature--main .feature__media img{ aspect-ratio:4/3.6; }
.feature--main .feature__title{ font-size:var(--t-xl); }

/* Faixa de foto inteira com frase */
.band{ position:relative; min-height:clamp(22rem,52vw,38rem); display:flex; align-items:flex-end; overflow:hidden; color:var(--paper); }
.band__img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.band::after{ content:''; position:absolute; inset:0; background:linear-gradient(to top, rgba(22,43,37,.78), rgba(22,43,37,.1) 55%, transparent); }
.band__in{ position:relative; z-index:1; width:100%; padding-block:clamp(2rem,5vw,4rem); }
.band__quote{ font-family:var(--serif); font-weight:500; font-size:var(--t-2xl); line-height:1.12; max-width:16ch; }
.band__by{ margin-top:1rem; font-size:var(--t-xs); letter-spacing:.14em; text-transform:uppercase; opacity:.85; }

/* Números em linha */
.facts--row{ grid-template-columns:repeat(3,minmax(0,1fr)); margin-top:var(--s-4); }

/* Artigos com imagem */
.posts--img{ background:none; border:0; gap:clamp(1rem,2vw,1.5rem); }
.post--img{ border:1px solid var(--rule); background:var(--card); padding:0 0 clamp(1.25rem,2.5vw,1.75rem); gap:.75rem; }
.post--img > :not(.post__media){ padding-inline:clamp(1.25rem,2.5vw,1.75rem); }
.post__media{ display:block; overflow:hidden; margin-bottom:.5rem; background:var(--paper-deep); }
.post__media img{ width:100%; aspect-ratio:3/2; object-fit:cover; transition:transform .8s var(--ease); }
.post--img:hover .post__media img{ transform:scale(1.04); }
.post--img .post__title{ flex:1; }

@media (max-width: 980px){
  .features{ grid-template-columns:1fr; }
  .feature--main{ grid-row:auto; }
  .split--media{ grid-template-columns:1fr; }
  .split--rev .media{ order:-1; }
}
@media (max-width: 640px){
  .feature{ grid-template-columns:1fr; }
  .feature__media img{ aspect-ratio:3/2; }
  .facts--row .fact__n{ font-size:var(--t-lg); }
}

/* Páginas de área: abertura com foto e faixa curta */
.page-hero--media{ padding-bottom:clamp(2.5rem,6vw,4.5rem); }
.page-hero__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(2rem,6vw,5rem); align-items:center; }
.page-hero__media img{ aspect-ratio:4/4.4; }
.band--short{ min-height:clamp(18rem,38vw,28rem); }
.band--short .band__quote{ font-size:var(--t-xl); max-width:20ch; }
.band__note{ margin-top:.75rem; max-width:44ch; font-size:var(--t-sm); opacity:.9; }
.trust{ display:grid; grid-template-columns:repeat(3,auto); justify-content:start; }
@media (max-width: 980px){
  .page-hero__grid{ grid-template-columns:1fr; }
  .page-hero__media{ order:-1; }
  .page-hero__media img{ aspect-ratio:16/10; }
}
@media (max-width: 560px){ .trust{ grid-template-columns:1fr; gap:.4rem; } }
.split--top{ align-items:start; }
.media--tall img{ aspect-ratio:4/5; }
.posts--two{ grid-template-columns:repeat(2,1fr); }
.article-cover{ margin-top:clamp(1.5rem,3vw,2.5rem); }
.article-cover img{ width:100%; aspect-ratio:21/9; object-fit:cover; }
@media (max-width: 640px){ .posts--two{ grid-template-columns:1fr; } .article-cover img{ aspect-ratio:3/2; } }
