/* ── Scaffold ── */
.w { max-width:var(--max); margin:0 auto; padding:0 var(--pad) }
.s    { padding:clamp(72px,9vw,120px) 0 }
.s-sm { padding:clamp(40px,5vw,68px) 0 }
.s-dark { background:#0D0D0C; color:#fff; position:relative; overflow:hidden }
.s-off  { background:#F0EDE6 }

hr.hr { border:none; border-top:1px solid var(--rule) }

/* Δ section divider */
.s-divider {
  text-align:center; padding:clamp(20px,3vw,32px) 0;
  position:relative;
}
.s-divider::before, .s-divider::after {
  content:''; position:absolute; top:50%;
  width:calc(50% - 28px); height:1px; background:var(--rule);
}
.s-divider::before { left:0 }
.s-divider::after  { right:0 }
.s-divider span {
  font-family:var(--fm); font-size:10px; letter-spacing:.22em;
  color:var(--rule2); display:inline-block;
}

/* ── Eyebrow ── */
.eyebrow {
  font-family:var(--fm); font-size:9.5px; letter-spacing:.28em; text-transform:uppercase;
  color:var(--gray2); margin-bottom:24px;
  display:inline-flex; align-items:center; gap:12px;
}
.eyebrow::before { content:''; width:14px; height:1px; background:currentColor; flex-shrink:0 }
.s-dark .eyebrow { color:rgba(255,255,255,.35) }

/* ── Headings ── */
.h2 {
  font-family:var(--fd); font-optical-sizing:auto;
  font-size:clamp(30px,4.4vw,60px); font-weight:300;
  line-height:1.06; letter-spacing:-.03em; color:var(--ink);
}
.h2 em { font-style:italic; font-weight:200; color:var(--gray2) }
.s-dark .h2 { color:#fff }
.s-dark .h2 em { color:rgba(255,255,255,.42) }

/* ── Body copy ── */
.lede { font-size:clamp(15px,1.6vw,17px); font-weight:400; line-height:1.8; color:var(--gray) }
.body { font-size:15px; font-weight:400; line-height:1.85; color:var(--gray) }
.body strong { color:var(--ink); font-weight:600 }
.body p + p { margin-top:18px }

/* ── Reveal (bloco) ── */
.rv { opacity:0; transform:translateY(20px); transition:opacity .75s var(--ease), transform .75s var(--ease) }
.rv.in { opacity:1; transform:none }

/* ── Word-by-word animation (conceito Anthropic) ── */
.aw {
  display:inline-block;
  opacity:0; transform:translateY(18px);
  transition:opacity 700ms var(--ease), transform 700ms var(--ease);
  will-change:opacity, transform;
}
.aw.aw-in { opacity:1; transform:none }

@media (prefers-reduced-motion: reduce) {
  .aw { opacity:1 !important; transform:none !important; transition:none !important }
  .rv { opacity:1 !important; transform:none !important; transition:none !important }
}