/* ============================================================
   NextArc — Base: reset, elements, layout primitives, reveals
   ============================================================ */

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

html { -webkit-text-size-adjust: 100%; }  /* Lenis owns smooth scroll — CSS smooth-scroll conflicts and causes jank */

body {
  background: var(--bg);
  color: var(--fg);
  font-family: var(--display);
  font-size: var(--fs-body);
  line-height: var(--lh-body);
  font-weight: 340;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
  font-feature-settings: "onum" 1, "pnum" 1, "liga" 1, "kern" 1;
  overflow-x: hidden;
  transition: background-color 600ms var(--ease), color 600ms var(--ease);
}

img, svg, video { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
/* Form controls keep the clean sans even though body copy is now the serif. */
input, textarea, select { font-family: var(--sans); font-size: 1rem; line-height: 1.45; color: inherit; }
[data-contact-form], [data-contact-form] label, [data-contact-form] button { font-family: var(--sans); }
::selection { background: var(--gold); color: var(--ink); }

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

/* —— Headings & text —— */
h1, h2, h3, h4 { font-family: var(--display); font-weight: 340; font-optical-sizing: auto; font-feature-settings: "liga" 1, "dlig" 1, "kern" 1; }
h1 { font-size: var(--fs-hero); line-height: 1.05; letter-spacing: -0.022em; font-weight: 330; }
h2 { font-size: var(--fs-h2); line-height: var(--lh-snug); letter-spacing: -0.02em; font-weight: 360; }
h3 { font-size: var(--fs-h3); line-height: 1.25; font-weight: 500; }
p  { font-size: var(--fs-body); line-height: var(--lh-body); }
strong { font-weight: 600; color: var(--fg); }

/* —— Layout primitives —— */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.measure { max-width: var(--measure); }
.measure-wide { max-width: var(--measure-wide); }
.stack > * + * { margin-top: 1.4em; }

.eyebrow {
  font-family: var(--sans);
  font-size: var(--fs-eyebrow);
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--gold);
}

.lead { font-size: var(--fs-lead); line-height: 1.45; color: var(--fg); }
.muted { color: var(--muted); }

/* Hairline rule */
.rule { height: 1px; background: var(--hairline); border: 0; width: 100%; }

/* —— Scroll-reveal lives in transitions.css (js-reveal / is-in, CSS-transition based) —— */

/* Section vertical rhythm — each block reads as its own "room" */
.section { padding-block: clamp(var(--space-6), 12vh, var(--space-8)); }
.section--tight { padding-block: clamp(var(--space-5), 8vh, var(--space-6)); }