/* =========================================================================
   BASE — reset leve, tipografia, layout, componentes globais
   ========================================================================= */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body{
  margin:0; font-family:var(--body); font-size:var(--step-0);
  line-height:1.65; color:var(--text); background:var(--paper);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; }
h1,h2,h3,h4{ font-family:var(--display); font-weight:600; line-height:1.05; margin:0; letter-spacing:-.01em; }
h1{ font-size:var(--step-4); font-weight:600; }
h2{ font-size:var(--step-3); }
h3{ font-size:var(--step-1); }
p{ margin:0 0 1rem; }
::selection{ background:var(--accent); color:var(--brand-ink); }

/* --- layout --- */
.container{ width:min(100% - var(--gutter)*2, var(--container)); margin-inline:auto; }
.sess{ padding-block:var(--sess-pad); position:relative; }
/* âncoras não somem sob o cabeçalho fixo */
[id]{ scroll-margin-top:96px; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-family:var(--body); font-weight:600; font-size:var(--step--1);
  letter-spacing:.14em; text-transform:uppercase; color:var(--brand);
}
.eyebrow::before{ content:""; width:26px; height:2px; background:var(--accent); border-radius:2px; }
.sess__head{ max-width:56ch; margin-bottom:clamp(2rem,4vw,3.5rem); }
.sess__head h2{ margin:.6rem 0 .8rem; }
.sess__head p{ color:var(--muted); font-size:var(--step-1); line-height:1.5; }
.lead{ font-size:var(--step-1); color:var(--muted); }

/* --- botões --- */
.btn{
  --_bg:var(--brand); --_fg:var(--on-brand);
  display:inline-flex; align-items:center; gap:.6rem; justify-content:center;
  padding:.95rem 1.6rem; border-radius:var(--radius-pill); border:1px solid transparent;
  background:var(--_bg); color:var(--_fg); font-weight:600; font-size:var(--step-0);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease), background .25s var(--ease);
  box-shadow:var(--shadow-sm); will-change:transform;
}
.btn:hover{ transform:translateY(-3px); box-shadow:var(--shadow); }
.btn:active{ transform:translateY(-1px); }
.btn svg{ width:1.15em; height:1.15em; }
.btn--wpp{ --_bg:#128C4B; }
.btn--wpp:hover{ --_bg:#0f7a41; }
.btn--gold{ --_bg:var(--accent); --_fg:var(--brand-ink); }
.btn--ghost{ --_bg:transparent; --_fg:var(--text); border-color:var(--line); box-shadow:none; }
.btn--ghost:hover{ --_bg:var(--surface); }
.btn--on-dark{ --_bg:transparent; --_fg:var(--on-brand); border-color:rgba(255,255,255,.35); box-shadow:none; }
.btn--on-dark:hover{ --_bg:rgba(255,255,255,.12); }
.btn--lg{ padding:1.1rem 2rem; font-size:var(--step-1); }

/* --- scroll reveal (2026: nativo com fallback JS) --- */
[data-reveal]{ opacity:0; transform:translateY(26px); }
[data-reveal].is-in{ opacity:1; transform:none; transition:opacity .7s var(--ease), transform .7s var(--ease); }
[data-reveal-delay="1"].is-in{ transition-delay:.08s; }
[data-reveal-delay="2"].is-in{ transition-delay:.16s; }
[data-reveal-delay="3"].is-in{ transition-delay:.24s; }
[data-reveal-delay="4"].is-in{ transition-delay:.32s; }

@supports (animation-timeline: view()){
  @media (prefers-reduced-motion: no-preference){
    /* onde o JS observer não pegar, o CSS puro cobre */
    .anim-scroll[data-reveal]{
      animation:reveal-up linear both; animation-timeline:view();
      animation-range:entry 5% cover 26%;
    }
  }
}
@keyframes reveal-up{ from{ opacity:0; transform:translateY(26px);} to{ opacity:1; transform:none;} }

/* --- transição entre páginas satélite (2026: View Transitions) --- */
@view-transition{ navigation:auto; }

/* --- utilidades --- */
.grain{ position:absolute; inset:0; pointer-events:none; opacity:.5; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.25'/%3E%3C/svg%3E"); }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); border:0; }
/* skip-link: fora da tela, mas visível ao receber foco pelo teclado (WCAG 2.4.1) */
.skip-link{ position:fixed; left:.5rem; top:-4rem; z-index:100; background:var(--surface); color:var(--brand);
  font-weight:600; padding:.6rem 1rem; border-radius:8px; box-shadow:var(--shadow); transition:top .2s var(--ease); }
.skip-link:focus{ top:.5rem; outline:2px solid var(--brand); outline-offset:2px; }