:root {
  /* Content widths */
  --max-width: 72rem;
  --max-width-narrow: 48rem;
  --max-width-wide: 90rem;
  --text-measure: 36rem;
  --container-padding: clamp(var(--space-4), 5vw, var(--space-8));
  /* Site chrome — keep hero/header math in one place */
  --header-height: 4.25rem;
  --header-blur: 8px;
  --header-sheet-pad-top: calc(var(--header-height) + var(--space-4));
  --header-nav-clearance: var(--space-3);
  --header-glass-blur: 28px;
  --header-glass-saturate: 160%;
  --header-sheet-radius: 1.35rem;
  /* Hero type measure + bento (x.ai sell-from-land; no video) */
  --hero-title-size: clamp(var(--text-3xl), 8vw, var(--text-4xl));
  --hero-title-size-lg: clamp(var(--text-4xl), 4.5vw, var(--text-5xl));
  --hero-subtitle-max: var(--text-measure);
  --hero-claim-max: 42rem;
  /* Open board: even air around claim + tiles. Images never drive layout. */
  --hero-inline-pad: clamp(var(--space-6), 6vw, var(--space-12));
  --hero-block-start: var(--space-10);
  --hero-block-start-lg: var(--space-12);
  --hero-block-end: var(--space-12);
  --hero-block-end-lg: var(--space-16);
  --hero-claim-stack-gap: var(--space-6);
  --hero-claim-stack-gap-lg: var(--space-8);
  --hero-bento-card-height: 13.5rem;
  --hero-bento-card-height-md: 15.5rem;
  --hero-bento-card-height-lg: 17rem;
  --hero-bento-label-pad: var(--space-4);
  --hero-bento-label-pad-lg: var(--space-5);
  --hero-bento-gap: var(--space-4);
  --hero-bento-gap-lg: var(--space-6);
  --hero-claim-bento-gap: var(--space-12);
  --hero-claim-bento-gap-lg: var(--space-16);
  --hero-screen-min: 100svh;
  /* Card system */
  --card-padding: var(--space-6);
  --card-padding-lg: var(--space-8);
  --card-radius: var(--radius-xl);
  --card-border: 1px solid var(--color-border);
  --card-bg: var(--color-canvas-elevated);
  --card-hover-translate: -4px;
  --card-hover-shadow: var(--shadow-lift);
  --card-hover-border: var(--color-border-emphasis);
  /* Grid rhythm */
  --grid-gap: var(--space-6);
  --grid-gap-compact: var(--space-4);
  --grid-gap-spacious: var(--space-8);
  /* Focus ring */
  --focus-ring-width: 2px;
  --focus-ring-offset: 2px;
  --focus-ring-color: var(--color-link);
}
