/* ═══════════════════════════════════════════════════════════
   Gabriela Passone Kieling — Advocacia e Consultoria Jurídica
   Paleta extraída da identidade visual (logo + escritório)
   ═══════════════════════════════════════════════════════════ */

:root{
  /* superfícies */
  --cream:      #F5F0EB;
  --cream-2:    #ECE4DB;
  --cream-3:    #E2D8CD;
  --white:      #FBF9F7;

  /* tinta */
  --ink:        #2F1B12;
  --ink-2:      #4A3226;
  --ink-soft:   #6B5546;
  --espresso:   #1A0F0A;

  /* acento (luz âmbar do escritório) */
  --gold:       #B98A4B;
  --gold-2:     #D9AE72;
  --gold-soft:  rgba(185,138,75,.16);

  --wa:         #25D366;
  --ig:         #C13584;

  /* tipografia */
  --serif: "Cormorant Garamond", "Times New Roman", Georgia, serif;
  --sans:  "Jost", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* métrica */
  --wrap: 1200px;
  --gut: clamp(20px, 5vw, 48px);
  --sec-y: clamp(72px, 11vw, 148px);
  --r: 2px;

  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ── reset ── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--cream);
  color:var(--ink-2);
  font-family:var(--sans);
  font-weight:300;
  font-size:clamp(15.5px,.35vw + 15px,17px);
  line-height:1.75;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; }
ul,ol{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ margin:0; font-family:var(--serif); font-weight:400; color:var(--ink); line-height:1.08; letter-spacing:-.01em; }
h1 em,h2 em{ font-style:italic; color:var(--gold); }
p{ margin:0 0 1.05em; }
address{ font-style:normal; }
blockquote{ margin:0; }
button{ font:inherit; }
::selection{ background:var(--ink); color:var(--cream); }

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

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:999;
  background:var(--ink); color:var(--cream); padding:12px 20px; font-size:.85rem;
}
.skip-link:focus{ left:0; }

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

/* ── barra de progresso de leitura ── */
.progress{
  position:fixed; inset:0 0 auto; height:2px; z-index:120;
  background:linear-gradient(90deg,var(--gold),var(--gold-2));
  transform:scaleX(0); transform-origin:0 50%;
  will-change:transform;
}

/* ── tipografia utilitária ── */
.eyebrow{
  font-size:.68rem; font-weight:400; letter-spacing:.26em; text-transform:uppercase;
  color:var(--ink-soft); margin:0 0 1.5rem;
}
.eyebrow--gold{ color:var(--gold); }
.eyebrow--gold::before,
.sec-head--center .eyebrow--gold::after,
.contact .eyebrow--gold::after{
  content:""; display:inline-block; width:0; height:1px;
  background:var(--gold); vertical-align:middle;
  transition:width .9s var(--ease) .2s;
}
.eyebrow--gold::before{ margin-right:14px; }
.sec-head--center .eyebrow--gold::after,
.contact .eyebrow--gold::after{ margin-left:14px; }
.is-in.eyebrow--gold::before,
.is-in .eyebrow--gold::before,
.sec-head--center .is-in.eyebrow--gold::after,
.contact .is-in.eyebrow--gold::after{ width:28px; }

.lead{
  font-size:clamp(1rem,.4vw + .95rem,1.14rem);
  color:var(--ink-soft); max-width:46ch;
}

.num{
  display:block; font-family:var(--serif); font-size:.95rem; font-style:italic;
  color:var(--gold); letter-spacing:.08em; margin-bottom:1rem;
  transition:transform .5s var(--ease);
}

/* ── títulos com revelação linha a linha ── */
.wipe{ }
.wipe .ln{ display:block; overflow:hidden; padding-bottom:.08em; margin-bottom:-.08em; }
.wipe .ln > span{
  display:block; transform:translateY(115%);
  transition:transform 1.05s var(--ease);
}
.wipe.is-in .ln > span{ transform:none; }
.wipe .ln:nth-child(2) > span{ transition-delay:.10s; }
.wipe .ln:nth-child(3) > span{ transition-delay:.20s; }
/* o wipe substitui o fade padrão do .reveal */
.reveal.wipe{ opacity:1; transform:none; }

/* ── botões ── */
.btn{
  position:relative; isolation:isolate;
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  padding:1.05em 2.1em;
  font-family:var(--sans); font-size:.78rem; font-weight:400;
  letter-spacing:.16em; text-transform:uppercase; text-decoration:none;
  border:1px solid transparent; border-radius:var(--r); cursor:pointer;
  overflow:hidden;
  transition:color .35s var(--ease), border-color .45s var(--ease), transform .45s var(--ease);
}
.btn .ic{ width:1.15em; height:1.15em; fill:currentColor; flex:none; }
.btn::before{
  content:""; position:absolute; inset:0; z-index:-1;
  transform:translateY(101%);
  transition:transform .55s var(--ease);
}
.btn:hover::before,
.btn:focus-visible::before{ transform:none; }
.btn:hover{ transform:translateY(-2px); }

.btn--gold{ background:var(--ink); color:var(--cream); border-color:var(--ink); }
.btn--gold::before{ background:var(--gold); }
.btn--gold:hover{ color:var(--espresso); border-color:var(--gold); }

.btn--ghost{ color:var(--ink); border-color:rgba(47,27,18,.28); }
.btn--ghost::before{ background:var(--ink); }
.btn--ghost:hover{ color:var(--cream); border-color:var(--ink); }

.btn--outline{ color:var(--ink); border-color:var(--gold); }
.btn--outline::before{ background:var(--gold); }
.btn--outline:hover{ color:var(--espresso); }

/* botão claro sobre fundo escuro */
.btn--onDark{ color:var(--cream); border-color:rgba(245,240,235,.3); }
.btn--onDark::before{ background:var(--cream); }
.btn--onDark:hover{ color:var(--ink); border-color:var(--cream); }

.btn--sm{ padding:.85em 1.5em; font-size:.7rem; }
.btn--lg{ padding:1.25em 2.8em; font-size:.82rem; }

/* ── link só com ícone ── */
.icon-link{
  display:grid; place-items:center; width:38px; height:38px; flex:none;
  border:1px solid rgba(47,27,18,.2); border-radius:50%;
  color:var(--ink-2);
  transition:color .4s var(--ease), border-color .4s var(--ease),
             background .4s var(--ease), transform .4s var(--ease);
}
.icon-link .ic{ width:16px; height:16px; fill:currentColor; }
.icon-link:hover{
  color:var(--cream); background:var(--ink); border-color:var(--ink);
  transform:translateY(-2px) rotate(-6deg);
}

/* ═══ HEADER ═══ */
.site-header{
  position:fixed; inset:0 0 auto; z-index:100;
  transition:background .45s var(--ease), box-shadow .45s var(--ease), padding .45s var(--ease);
  padding-block:22px;
}
.site-header.is-stuck{
  background:rgba(245,240,235,.92);
  backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(47,27,18,.09);
  padding-block:12px;
}
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }

.brand{
  display:flex; align-items:center; gap:clamp(12px,1.4vw,18px);
  flex:none; text-decoration:none;
}
.brand__mark{ position:relative; display:block; flex:none; }
.brand__mark img{
  display:block; width:auto; height:clamp(44px,4.4vw,58px);
  transition:height .45s var(--ease), opacity .45s var(--ease);
}
.brand__dark{ position:absolute; inset:0; opacity:0; }
.site-header.is-stuck .brand__light{ opacity:0; }
.site-header.is-stuck .brand__dark{ opacity:1; }
.site-header.is-stuck .brand__mark img{ height:clamp(38px,3.7vw,48px); }

.brand__words{ display:block; }
.brand__name,
.brand__tag{
  display:block; white-space:nowrap;
  font-family:var(--sans); font-weight:300; text-transform:uppercase;
  color:var(--cream);
  transition:color .45s var(--ease), font-size .45s var(--ease);
}
.brand__name{
  font-size:clamp(.72rem,.9vw,.88rem); letter-spacing:.19em; line-height:1.35;
}
.brand__tag{
  margin-top:.32em;
  font-size:clamp(.44rem,.53vw,.53rem); letter-spacing:.24em;
  color:rgba(245,240,235,.62);
}
.site-header.is-stuck .brand__name{ color:var(--ink); }
.site-header.is-stuck .brand__tag{ color:var(--ink-soft); }

/* ── cabeçalho sobre o topo escuro: tudo em claro ──
   sem isto o menu fica tinta-escura sobre a foto e some */
.site-header:not(.is-stuck) .burger span{ background:var(--cream); }
/* com a gaveta aberta o fundo atrás do botão é creme — precisa voltar a escuro.
   Preso ao aria-expanded para ganhar de `:not(.is-stuck)` na especificidade. */
.site-header .burger[aria-expanded="true"] span{ background:var(--ink); }

@media (min-width:861px){
  .site-header:not(.is-stuck) .nav ul a{ color:rgba(245,240,235,.8); }
  .site-header:not(.is-stuck) .nav ul a:hover,
  .site-header:not(.is-stuck) .nav ul a.is-active{ color:var(--cream); }

  .site-header:not(.is-stuck) .icon-link{
    color:rgba(245,240,235,.85); border-color:rgba(245,240,235,.32);
  }
  .site-header:not(.is-stuck) .icon-link:hover{
    background:var(--cream); color:var(--ink); border-color:var(--cream);
  }

  .site-header:not(.is-stuck) .nav__cta{
    background:var(--gold); border-color:var(--gold); color:var(--espresso);
  }
  .site-header:not(.is-stuck) .nav__cta::before{ background:var(--cream); }
  .site-header:not(.is-stuck) .nav__cta:hover{ color:var(--ink); border-color:var(--cream); }
}

.nav{ display:flex; align-items:center; gap:clamp(20px,3vw,40px); }
.nav ul{ display:flex; align-items:center; gap:clamp(16px,2.2vw,30px); }
.nav__actions{ display:flex; align-items:center; gap:12px; }
.nav a{
  position:relative; text-decoration:none; font-size:.79rem; letter-spacing:.1em;
  color:var(--ink-2); transition:color .3s var(--ease);
}
.nav ul a{ display:inline-block; padding-block:6px; }
.nav ul a::after{
  content:""; position:absolute; left:0; bottom:0; width:100%; height:1px;
  background:var(--gold); transform:scaleX(0); transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav ul a:hover{ color:var(--ink); }
.nav ul a:hover::after,
.nav ul a.is-active::after{ transform:scaleX(1); transform-origin:left; }
.nav ul a.is-active{ color:var(--ink); }

.burger{
  display:none; width:44px; height:44px; padding:11px; margin-right:-11px;
  background:none; border:0; cursor:pointer;
}
.burger span{
  display:block; height:1.5px; background:var(--ink); border-radius:2px;
  transition:transform .4s var(--ease), opacity .3s var(--ease);
}
.burger span + span{ margin-top:5px; }
.burger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.burger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* ═══ HERO — fotos passando ao fundo ═══ */
.hero{
  position:relative; isolation:isolate;
  display:grid; align-items:center;
  min-height:min(94vh,880px);
  padding-top:clamp(120px,14vw,170px);
  padding-bottom:clamp(78px,10vw,120px);
  background:var(--espresso);
  overflow:hidden;
}

.hero__slides{
  position:absolute; inset:0; z-index:-2;
  transform:translate3d(0,var(--slideY,0px),0);
}
.hero__slide{
  position:absolute; inset:0;
  opacity:0; transition:opacity 1.6s var(--ease);
}
.hero__slide.is-active{ opacity:1; }
.hero__slide img{
  width:100%; height:100%; object-fit:cover; object-position:var(--pos,50% 35%);
  /* cada foto tem sua própria origem de zoom (--ox/--oy), para o movimento
     não se repetir igual a cada volta do carrossel */
  transform-origin:var(--ox,50%) var(--oy,50%);
  transform:scale(1.12);
  transition:transform 1.6s var(--ease);
}
.hero__slide.is-active img{
  transform:scale(1.02);
  transition:transform 8.5s cubic-bezier(.16,.5,.3,1);
}

.hero__veil{
  position:absolute; inset:0; z-index:-1;
  background:
    /* vinheta: fecha os cantos e concentra a luz no centro-direita */
    radial-gradient(120% 108% at 68% 44%, transparent 8%, rgba(16,9,5,.44) 62%, rgba(12,7,4,.82) 100%),
    linear-gradient(96deg, rgba(20,11,7,.93) 0%, rgba(20,11,7,.78) 36%, rgba(24,14,8,.34) 68%, rgba(20,11,7,.5) 100%),
    linear-gradient(180deg, rgba(20,11,7,.7) 0%, transparent 24%, transparent 58%, rgba(26,15,10,.95) 100%);
}

/* granulado sutil — tira o bandeado dos degradês e dá textura de impresso */
.hero__grain{
  position:absolute; inset:0; z-index:-1; pointer-events:none;
  opacity:.055; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:160px 160px;
}

.hero__content{
  position:relative;
  transform:translate3d(0,var(--sy,0px),0);
  opacity:var(--so,1);
}
.hero__copy{ max-width:56ch; }

/* fio dourado que cresce entre a tarja e o título */
.hero__rule{
  display:block; height:1px; width:0; margin:0 0 1.7rem;
  background:linear-gradient(90deg,var(--gold),rgba(185,138,75,0));
  transition:width 1.1s var(--ease) .3s;
}
html.is-ready .hero__rule{ width:clamp(120px,20vw,260px); }

/* entrada encadeada ao carregar (não depende de rolagem) */
.hs{
  opacity:0; transform:translateY(24px);
  transition:opacity .95s var(--ease) var(--d,0s), transform .95s var(--ease) var(--d,0s);
}
html.is-ready .hs{ opacity:1; transform:none; }

html.is-ready .hero .wipe .ln > span{ transform:none; }
.hero .wipe .ln:nth-child(1) > span{ transition-delay:.46s; }
.hero .wipe .ln:nth-child(2) > span{ transition-delay:.60s; }
.hero .wipe .ln:nth-child(3) > span{ transition-delay:.74s; }

/* fio de tempo da foto atual */
.hero__timer{
  position:absolute; inset:auto 0 0 0; height:1px; z-index:2;
  background:rgba(245,240,235,.12);
}
.hero__timer i{
  display:block; height:100%; width:0;
  background:linear-gradient(90deg,rgba(185,138,75,.5),var(--gold-2));
}
.hero__timer.is-running i{ animation:heroTime var(--slide-ms,6000ms) linear forwards; }
@keyframes heroTime{ from{ width:0 } to{ width:100% } }
.hero .eyebrow{ color:var(--gold-2); }
.hero h1{
  font-size:clamp(2.9rem,7.2vw,5.4rem);
  margin:0 0 1.6rem; letter-spacing:-.02em; color:var(--cream);
}
.hero .lead{ color:rgba(245,240,235,.78); }
.hero__actions{
  display:flex; flex-wrap:wrap; gap:14px; margin-top:2.4rem;
}
.hero__note{
  margin-top:1.8rem; font-size:.82rem; letter-spacing:.06em; color:rgba(245,240,235,.6);
}
.hero__note::before{
  content:""; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:var(--gold); margin-right:10px; vertical-align:middle;
}

/* moldura com abertura em cortina + parallax na foto */
.frame{
  position:relative; overflow:hidden; border-radius:220px 220px var(--r) var(--r);
  box-shadow:0 34px 70px -32px rgba(47,27,18,.5);
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.15s var(--ease);
}
.reveal.is-in .frame,
.is-in .frame{ clip-path:inset(0 0 0 0); }
.frame img{
  width:100%; aspect-ratio:3/4; object-fit:cover; object-position:50% 18%;
  transform:translate3d(0,var(--py,0px),0) scale(var(--sc,1.07));
  transition:transform 1.1s var(--ease);
}
.frame:hover img{ --sc:1.14; }
.frame--tall{ border-radius:var(--r) 220px var(--r) 220px; }
.frame--tall img{ aspect-ratio:4/5; object-position:50% 22%; }

.scroll-cue{
  position:absolute; left:50%; bottom:26px; translate:-50% 0; z-index:2;
  width:24px; height:38px; border:1px solid rgba(245,240,235,.35); border-radius:14px;
  display:grid; place-items:start center; padding-top:8px;
}
.scroll-cue span{
  width:2px; height:7px; border-radius:2px; background:var(--gold);
  animation:cue 1.9s var(--ease) infinite;
}
@keyframes cue{ 0%,100%{ transform:translateY(0); opacity:1 } 55%{ transform:translateY(12px); opacity:0 } }

/* ═══ PILARES ═══ */
.pillars{
  position:relative;
  background:var(--ink);
  padding-block:clamp(48px,6.5vw,76px);
}
/* sem a faixa que existia antes, o topo escuro encostava direto nesta seção —
   este fio dá a separação */
.pillars::before{
  content:""; position:absolute; inset:0 0 auto 0; height:1px;
  background:linear-gradient(90deg,transparent,rgba(185,138,75,.45),transparent);
}
.pillars__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(28px,4vw,58px);
}
.pillar{ position:relative; padding-left:clamp(20px,2.4vw,30px); }
.pillar::before{
  content:""; position:absolute; left:0; top:6px; bottom:6px; width:1px;
  background:linear-gradient(180deg,var(--gold),rgba(185,138,75,.08));
  transform:scaleY(0); transform-origin:top;
  transition:transform .95s var(--ease) .15s;
}
.pillar.is-in::before{ transform:scaleY(1); }
.pillar .num{ margin-bottom:.7rem; }
.pillar h3{
  color:var(--cream); font-size:clamp(1.28rem,1.5vw,1.55rem); margin-bottom:.7rem;
}
.pillar p{ color:rgba(245,240,235,.62); font-size:.93rem; margin:0; }

/* ═══ SOBRE ═══ */
.about{ padding-block:var(--sec-y); background:var(--cream); }
.about__grid{
  display:grid; grid-template-columns:.86fr 1.14fr;
  gap:clamp(38px,6vw,92px); align-items:center;
}
.about__figure{ margin:0; }
.about__copy h2{
  font-size:clamp(2rem,3.9vw,3.15rem); margin-bottom:1.9rem;
}
.about__copy p{ max-width:56ch; }
.about__copy strong{ font-weight:500; color:var(--ink); }

.quote{
  position:relative;
  margin:2.3rem 0; padding:1.1rem 0 1.1rem 1.7rem;
  font-family:var(--serif); font-style:italic;
  font-size:clamp(1.2rem,1.9vw,1.55rem); line-height:1.4; color:var(--ink);
}
.quote::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:1px;
  background:var(--gold);
  transform:scaleY(0); transform-origin:top;
  transition:transform .9s var(--ease) .2s;
}
.quote.is-in::before{ transform:scaleY(1); }

.facts{
  display:flex; flex-wrap:wrap; gap:0;
  border-top:1px solid rgba(47,27,18,.14);
}
.facts li{
  flex:1 1 160px; padding:1.15rem 1.4rem 1.15rem 0;
  border-bottom:1px solid rgba(47,27,18,.14);
  font-size:.92rem; color:var(--ink);
}
.facts span{
  display:block; font-size:.63rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold); margin-bottom:.4rem;
}

/* ═══ SEÇÃO — cabeçalho ═══ */
.sec-head{ max-width:60ch; margin-bottom:clamp(40px,5.5vw,74px); }
.sec-head--center{ margin-inline:auto; text-align:center; }
.sec-head h2{ font-size:clamp(2rem,4vw,3.15rem); margin-bottom:1.1rem; }
.sec-head__lead{ color:var(--ink-soft); margin:0; }

/* ═══ ÁREAS ═══ */
.areas{
  padding-block:var(--sec-y);
  background:linear-gradient(180deg,var(--cream-2),var(--cream));
}
.areas__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.2vw,28px);
}
.area{
  position:relative; isolation:isolate; padding:clamp(30px,3.4vw,44px);
  background:var(--white); border:1px solid rgba(47,27,18,.09); border-radius:var(--r);
  transition:transform .5s var(--ease), box-shadow .5s var(--ease),
             border-color .5s var(--ease), opacity .9s var(--ease);
}
/* leve banho dourado subindo no hover */
.area::before{
  content:""; position:absolute; inset:0; z-index:-1; border-radius:inherit;
  background:linear-gradient(180deg, rgba(185,138,75,0) 40%, rgba(185,138,75,.09) 100%);
  opacity:0; transition:opacity .55s var(--ease);
}
.area:hover::before{ opacity:1; }
.area::after{
  content:""; position:absolute; inset:auto 0 0 0; height:2px;
  background:var(--gold); transform:scaleX(0); transform-origin:left;
  transition:transform .55s var(--ease);
}
.area:hover{
  transform:translateY(-9px);
  box-shadow:0 30px 60px -30px rgba(47,27,18,.45);
  border-color:rgba(47,27,18,.02);
}
.area:hover::after{ transform:scaleX(1); }
.area:hover .num{ transform:translateX(5px); }
.area h3{ font-size:clamp(1.5rem,2.1vw,1.9rem); margin-bottom:.9rem; }
.area > p{ color:var(--ink-soft); font-size:.94rem; }
.area ul{
  margin-top:1.5rem; padding-top:1.4rem; border-top:1px solid rgba(47,27,18,.1);
}
.area li{
  position:relative; padding-left:20px; font-size:.87rem; color:var(--ink-soft);
  line-height:1.6; margin-bottom:.65rem;
  transition:color .35s var(--ease), padding-left .35s var(--ease);
}
.area li::before{
  content:""; position:absolute; left:0; top:.62em; width:8px; height:1px;
  background:var(--gold); transition:width .35s var(--ease);
}
.area li:hover{ color:var(--ink); padding-left:26px; }
.area li:hover::before{ width:14px; }

.areas__foot{
  margin:clamp(38px,5vw,58px) auto 0; max-width:62ch; text-align:center;
  font-size:.94rem; color:var(--ink-soft);
}
.areas__foot a{
  position:relative; color:var(--ink); text-decoration:none;
  transition:color .3s var(--ease);
}
.areas__foot a::after{
  content:""; position:absolute; left:0; right:0; bottom:-2px; height:1px;
  background:var(--gold); transform-origin:right;
  transition:transform .45s var(--ease);
}
.areas__foot a:hover{ color:var(--gold); }
.areas__foot a:hover::after{ transform:scaleX(0); }

/* ═══ FAIXA FOTOGRÁFICA ═══ */
/* metade texto, metade foto — a foto aparece limpa, sem véu por cima */
.statement{
  display:grid; grid-template-columns:1fr 1fr;
  background:var(--espresso);
  overflow:hidden;
}
.statement__copy{
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(56px,7vw,104px) clamp(28px,5vw,80px);
}
.statement__text{
  margin:0; max-width:16ch;
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.85rem,3.6vw,3.1rem); line-height:1.14; color:var(--cream);
}
.statement__text em{ font-style:italic; color:var(--gold-2); }
.statement__sub{
  position:relative; margin:2rem 0 0; padding-top:1.6rem; max-width:38ch;
  font-size:.78rem; letter-spacing:.14em; text-transform:uppercase;
  color:rgba(245,240,235,.55); line-height:1.7;
}
.statement__sub::before{
  content:""; position:absolute; inset:0 auto auto 0; width:0; height:1px;
  background:var(--gold); transition:width .9s var(--ease) .3s;
}
.statement__sub.is-in::before{ width:56px; }

.statement__figure{
  position:relative; margin:0; overflow:hidden;
  min-height:clamp(420px,46vw,620px);
}
.statement__figure img{
  position:absolute; inset:0;
  width:100%; height:100%; object-fit:cover; object-position:50% 18%;
  transform:translate3d(0,var(--py,0px),0) scale(1.06);
}
/* só o suficiente para casar com o tom da seção, sem esconder a foto */
.statement__figure::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(90deg, rgba(26,15,10,.55) 0%, rgba(26,15,10,.12) 26%, transparent 55%);
}

/* ═══ ATENDIMENTO ═══ */
.steps{
  padding-block:var(--sec-y);
  background:var(--espresso);
  background-image:radial-gradient(90% 60% at 50% 0%, rgba(185,138,75,.14), transparent 70%);
}
.steps .sec-head h2{ color:var(--cream); }
.steps__list{
  display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(24px,3vw,40px);
}
.step{ position:relative; padding-top:2.4rem; }
.step::before{
  content:""; position:absolute; inset:0 0 auto 0; height:1px;
  background:linear-gradient(90deg,var(--gold),rgba(185,138,75,.12));
  transform:scaleX(0); transform-origin:left;
  transition:transform 1s var(--ease) .1s;
}
.step.is-in::before{ transform:scaleX(1); }
.step__n{
  display:block; font-family:var(--serif); font-style:italic; font-size:1.75rem;
  color:var(--gold); line-height:1; margin-bottom:1rem;
  transition:transform .5s var(--ease);
}
/* ponto na linha, marcando o início de cada etapa */
.step::after{
  content:""; position:absolute; left:0; top:-3px; width:7px; height:7px;
  border-radius:50%; background:var(--gold);
  transform:scale(0); transition:transform .5s var(--ease) .5s;
}
.step.is-in::after{ transform:scale(1); }
.step:hover .step__n{ transform:translateX(5px); }
.step h3{ color:var(--cream); font-size:1.22rem; margin-bottom:.7rem; }
.step p{ color:rgba(245,240,235,.55); font-size:.9rem; margin:0; }

/* ═══ ESCRITÓRIO ═══ */
.office{ padding-block:var(--sec-y); background:var(--cream); }
.office__grid{
  display:grid; grid-template-columns:1fr .82fr;
  gap:clamp(38px,6vw,88px); align-items:center;
}
.office__copy h2{ font-size:clamp(1.95rem,3.7vw,3rem); margin-bottom:1.5rem; }
.office__copy p{ color:var(--ink-soft); max-width:48ch; }
.office__addr{
  position:relative;
  margin:2rem 0; padding-left:1.4rem;
  font-family:var(--serif); font-size:1.32rem; line-height:1.45; color:var(--ink);
}
.office__addr::before{
  content:""; position:absolute; left:0; top:0; bottom:0; width:1px;
  background:var(--gold);
  transform:scaleY(0); transform-origin:top;
  transition:transform .9s var(--ease) .2s;
}
.office__addr.is-in::before{ transform:scaleY(1); }
.office__figure{
  margin:0; overflow:hidden; border-radius:var(--r);
  box-shadow:0 34px 70px -34px rgba(47,27,18,.6);
  clip-path:inset(0 0 100% 0);
  transition:clip-path 1.15s var(--ease);
}
.office__figure.is-in{ clip-path:inset(0 0 0 0); }
.office__figure img{
  width:100%; aspect-ratio:4/5; object-fit:cover; object-position:50% 42%;
  transform:translate3d(0,var(--py,0px),0) scale(var(--sc,1.07));
  transition:transform 1.1s var(--ease);
}
.office__figure:hover img{ --sc:1.14; }

/* ═══ MAPA — faixa de largura total acima do rodapé ═══ */
.map-band{
  display:block; background:var(--cream-2);
  border-top:1px solid rgba(245,240,235,.1);
}
.map-band iframe{
  display:block; width:100%; height:clamp(300px,32vw,440px); border:0;
  /* aproxima o mapa da paleta quente do site */
  filter:grayscale(.35) sepia(.16) contrast(1.02);
  transition:filter .6s var(--ease);
}
.map-band:hover iframe{ filter:none; }

/* usada só na versão de arquivo único, onde o mapa não pode ser embutido */
.map-band--static{
  display:grid; place-items:center; gap:1rem; text-align:center;
  padding:clamp(48px,7vw,80px) var(--gut);
  background:var(--cream); color:var(--ink-soft); font-size:.9rem;
}
.map-band--static p{ margin:0; }
.map-band--static strong{ font-family:var(--serif); font-size:1.3rem; color:var(--ink); font-weight:400; }

/* ═══ CONTATO ═══ */
.contact{
  padding-block:var(--sec-y);
  background:var(--espresso);
  background-image:radial-gradient(80% 70% at 50% 0%, rgba(185,138,75,.17), transparent 65%);
}
.contact__inner{ max-width:800px; margin-inline:auto; text-align:center; }
.contact h2{ color:var(--cream); font-size:clamp(2rem,4.2vw,3.3rem); margin-bottom:1.2rem; }
.contact__lead{
  color:rgba(245,240,235,.62); max-width:50ch; margin-inline:auto; margin-bottom:2.6rem;
}
.contact__actions{
  display:flex; flex-wrap:wrap; justify-content:center; gap:14px;
}
.contact .btn--gold{ background:var(--gold); border-color:var(--gold); color:var(--espresso); }
.contact .btn--gold::before{ background:var(--cream); }
.contact .btn--gold:hover{ color:var(--ink); border-color:var(--cream); }

/* ═══ FOOTER ═══ */
.site-footer{ background:var(--espresso); padding-top:clamp(56px,7vw,86px); }
.footer__grid{
  display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:clamp(32px,5vw,64px);
  padding-bottom:clamp(40px,5vw,60px);
}
.footer__brand img{ width:auto; height:clamp(74px,9vw,104px); margin-bottom:1.7rem; }
.footer__brand p{
  font-family:var(--serif); font-style:italic; font-size:1.12rem;
  color:rgba(245,240,235,.55); max-width:34ch; margin:0;
}
.site-footer h4{
  font-family:var(--sans); font-size:.64rem; font-weight:400;
  letter-spacing:.24em; text-transform:uppercase; color:var(--gold);
  margin-bottom:1.3rem;
}
.site-footer li{ margin-bottom:.75rem; font-size:.9rem; color:rgba(245,240,235,.55); line-height:1.6; }
.site-footer a{
  display:inline-block; color:rgba(245,240,235,.72); text-decoration:none;
  transition:color .3s var(--ease), transform .3s var(--ease);
}
.site-footer a:hover{ color:var(--gold-2); transform:translateX(4px); }

.footer__base{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 32px;
  padding-block:1.7rem;
  border-top:1px solid rgba(245,240,235,.11);
}
.footer__base p{ margin:0; font-size:.76rem; color:rgba(245,240,235,.42); letter-spacing:.03em; }
.footer__disclaimer{ max-width:52ch; }

/* ═══ BOTÃO FLUTUANTE ═══ */
.floats{
  position:fixed; right:clamp(16px,2.5vw,28px); bottom:clamp(16px,2.5vw,28px); z-index:90;
  display:flex; flex-direction:column; align-items:flex-end; gap:12px;
}
.float{
  position:relative;
  display:inline-flex; align-items:center; gap:0;
  border-radius:999px; color:#fff; text-decoration:none;
  transform:translateY(90px) scale(.85); opacity:0; pointer-events:none;
  transition:transform .55s var(--ease), opacity .55s var(--ease),
             gap .4s var(--ease), padding .4s var(--ease), filter .4s var(--ease);
}
.floats.is-visible .float{ transform:none; opacity:1; pointer-events:auto; }

.float svg{ fill:currentColor; flex:none; }
.float__label{
  max-width:0; overflow:hidden; white-space:nowrap;
  font-size:.76rem; letter-spacing:.1em; text-transform:uppercase;
  transition:max-width .45s var(--ease);
}
.float:hover .float__label{ max-width:170px; }

.float--wa{
  height:58px; padding:0 17px; background:var(--wa);
  box-shadow:0 12px 30px -8px rgba(37,211,102,.6);
}
.float--wa svg{ width:26px; height:26px; }
.float--wa:hover{ gap:11px; padding-right:23px; }
.float--wa::before{
  content:""; position:absolute; inset:0; border-radius:inherit;
  border:2px solid var(--wa); animation:pulse 2.6s var(--ease) infinite;
}
@keyframes pulse{
  0%{ transform:scale(1); opacity:.65 }
  70%,100%{ transform:scale(1.35); opacity:0 }
}

/* ═══ REVEAL ═══ */
.reveal{
  opacity:0; transform:translateY(28px);
  transition:opacity .9s var(--ease), transform .9s var(--ease);
}
.reveal.is-in{ opacity:1; transform:none; }

/* ═══ RESPONSIVO ═══ */
@media (max-width:1024px){
  .about__grid,
  .office__grid{ grid-template-columns:1fr; }
  .about__figure,
  .office__figure{ max-width:460px; margin-inline:auto; width:100%; }
  .about__grid .about__figure{ order:-1; }
  .hero__veil{
    background:
      linear-gradient(180deg, rgba(20,11,7,.86) 0%, rgba(20,11,7,.62) 40%, rgba(20,11,7,.78) 100%);
  }
  /* abaixo disto o nome escrito não cabe ao lado do menu — fica só o monograma */
  .brand__words{ display:none; }
  .statement{ grid-template-columns:1fr; }
  .statement__figure{ order:-1; min-height:clamp(380px,62vw,520px); }
  .pillars__grid{ grid-template-columns:1fr 1fr; row-gap:34px; }
  .areas__grid{ grid-template-columns:1fr; max-width:620px; margin-inline:auto; }
  .steps__list{ grid-template-columns:1fr 1fr; row-gap:38px; }
  .footer__grid{ grid-template-columns:1fr 1fr; }
  .footer__brand{ grid-column:1/-1; }
  .scroll-cue{ display:none; }
}

@media (max-width:860px){
  .burger{ display:block; }
  .nav{
    position:fixed; inset:0 0 0 auto; width:min(84vw,340px);
    flex-direction:column; align-items:stretch; justify-content:center;
    gap:0; padding:clamp(24px,7vw,44px);
    background:var(--cream);
    box-shadow:-20px 0 60px -20px rgba(47,27,18,.35);
    transform:translateX(102%);
    transition:transform .5s var(--ease);
    overflow-y:auto;
  }
  .nav.is-open{ transform:none; }
  .nav ul{ flex-direction:column; align-items:stretch; gap:0; }
  .nav ul li + li{ border-top:1px solid rgba(47,27,18,.12); }
  .nav ul a{
    display:block; padding:1.05rem 0;
    font-family:var(--serif); font-size:1.42rem; letter-spacing:0;
  }
  .nav ul a::after{ display:none; }
  .nav__actions{ margin-top:2rem; }
  .nav__cta{ flex:1; }

  body.nav-open{ overflow:hidden; }
  body.nav-open::after{
    content:""; position:fixed; inset:0; z-index:99;
    background:rgba(26,15,10,.45); backdrop-filter:blur(2px);
  }
  .site-header{ z-index:100; }
  .nav{ z-index:101; }
  .burger{ z-index:102; position:relative; }
}

@media (max-width:640px){
  .pillars__grid,
  .steps__list{ grid-template-columns:1fr; }
  .pillars__grid{ row-gap:30px; }
  .footer__grid{ grid-template-columns:1fr; gap:38px; }
  .hero__actions .btn,
  .contact__actions .btn{ width:100%; }
  .facts li{ flex:1 1 100%; }
  .frame--tall{ border-radius:var(--r) 160px var(--r) 160px; }
  .footer__base{ flex-direction:column; }
  .hero{ min-height:min(88vh,760px); }
  .float--wa{ height:54px; }
}

@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{
    animation-duration:.01ms !important; animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .reveal{ opacity:1; transform:none; }
  .wipe .ln > span{ transform:none; }
  .frame,.office__figure{ clip-path:none; }
  .frame img,.office__figure img{ transform:none; }
  /* topo sem zoom nem parallax — mas as fotos continuam trocando,
     com um crossfade suave, que não é o tipo de movimento em questão */
  .hs{ opacity:1; transform:none; }
  .hero__rule{ width:clamp(120px,20vw,260px); }
  .hero__slide{ transition:opacity .7s linear !important; }
  .hero__slide img,
  .hero__slide.is-active img{ transform:none; }
  .hero__slides{ transform:none; }
  .hero__content{ transform:none; opacity:1; }
  .hero__timer{ display:none; }
  .statement__figure img{ transform:none; }
}

@media print{
  .site-header,.floats,.scroll-cue,.hero__actions,.progress,
  .hero__timer,.hero__grain{ display:none !important; }
  body{ background:#fff; color:#000; }
  .reveal,.hs{ opacity:1; transform:none; }
  .frame,.office__figure{ clip-path:none; }
  .wipe .ln > span{ transform:none; }
  .hero{ min-height:0; }
  .hero__veil,.hero__slides{ display:none; }
  .hero h1,.hero .lead,.hero .eyebrow,.hero__note{ color:#000; }
  .hero__content{ transform:none; opacity:1; }
  .map-band{ display:none; }
}