/* Base: reset, tipografia, layout e utilitários. */
*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: var(--header-h); }
body {
  margin: 0;
  background: var(--ink);
  color: var(--text);
  font-family: var(--font-text);
  font-size: var(--fs-body);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
body.is-locked { overflow: hidden; }

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }

img, svg, video, iframe { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd { margin: 0; }
ul[role="list"], ol[role="list"] { list-style: none; padding: 0; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }

:focus-visible { outline: 2px solid var(--focus, var(--glow)); outline-offset: 3px; border-radius: 4px; }
.is-paper { --focus: var(--text-dark); }
::selection { background: var(--glow); color: var(--ink); }

/* Tipografia */
.h1, .h2, .h3, .display {
  font-family: var(--font-display);
  font-weight: 300;
  letter-spacing: -0.035em;
  line-height: 0.95;
}
.h1 { font-size: var(--fs-h1); }
.h2 { font-size: var(--fs-h2); }
.h3 { font-size: var(--fs-h3); line-height: 1.1; letter-spacing: -0.02em; font-weight: 300; }
.h1 em, .h2 em { font-style: normal; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .04em; }
.is-paper .h1 em, .is-paper .h2 em { background: none; color: var(--violet); }
.lead { font-size: var(--fs-body-lg); line-height: 1.5; max-width: var(--measure); color: var(--text-2); }
.is-paper .lead { color: var(--text-dark-2); }
.small { font-size: var(--fs-small); }
.micro { font-size: var(--fs-micro); font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; }
.muted { color: var(--text-2); }
.is-paper .muted { color: var(--text-dark-2); }

/* Layout */
.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.section { position: relative; padding-block: var(--section-y); }
.is-paper { background: var(--paper); color: var(--text-dark); }
.is-ink { background: var(--ink); color: var(--text); }
.stack > * + * { margin-top: var(--stack, var(--s-24)); }

/* Rótulo de seção: /01 · Nome ———— */
.label {
  display: flex;
  align-items: center;
  gap: var(--s-16);
  margin-bottom: var(--s-48);
}
.label__num { color: var(--glow); }
.is-paper .label__num { color: var(--text-dark); }
.label__line {
  flex: 1;
  height: 1px;
  background: currentColor;
  opacity: 0.25;
  transform-origin: left;
  transform: scaleX(var(--p, 1));
}

.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 100; padding: 12px 16px; background: var(--paper); color: var(--ink); border-radius: var(--radius-sm); transform: translateY(-200%); }
.skip-link:focus { transform: none; }
[hidden] { display: none !important; }

/* Placeholder visível (CLAUDE.md: nunca inventar). */
.tbd {
  display: inline;
  padding: 0.05em 0.45em;
  border: 1px dashed currentColor;
  border-radius: 6px;
  font-family: var(--font-text);
  font-size: 0.8em;
  font-weight: 500;
  font-style: normal;
  letter-spacing: 0;
  text-transform: none;
  line-height: 1.6;
  color: inherit;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}