/* Iron Verity — base: reset, typography, global atmosphere */

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

html {
  -webkit-text-size-adjust: 100%;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html {
  background: var(--background-deep);
}

html, body {
  color: var(--foreground);
  font-family: var(--font-sans);
  font-weight: 400;
  font-size: 16px;
  line-height: 1.6;
  min-height: 100%;
  overscroll-behavior: none;
}

body {
  /* offset for fixed .site-header (68px tall) so content doesn't slide under it */
  padding-top: 68px;
  /* lit-from-above radial: warm copper-tinted lift around upper-center,
     fading to the deep base around the edges. Gives photography and the
     wordmark room to breathe without flattening the dark identity. */
  background:
    radial-gradient(ellipse 50% 42% at 50% 35%,
      color-mix(in srgb, var(--background-lift) 55%, var(--background)) 0%,
      color-mix(in srgb, var(--background-lift) 28%, var(--background)) 12%,
      var(--background) 28%,
      color-mix(in srgb, var(--background) 40%, var(--background-deep)) 50%,
      color-mix(in srgb, var(--background) 12%, var(--background-deep)) 75%,
      var(--background-deep) 100%);
  background-attachment: fixed;
  /* grain overlay — the detail that separates this from generic dark-mode */
  position: relative;
  isolation: isolate;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 9998;
  opacity: 0.028;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix type='matrix' values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 0.5 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

img, svg, video { display: block; max-width: 100%; }

a { color: inherit; text-decoration: none; transition: color var(--dur-hover) var(--ease-out); }
a:hover { color: var(--accent); }

button {
  background: none;
  border: 0;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

/* disable focus-ring user-agent styles, but keep focus-visible accessible */
:focus { outline: none; }
:focus-visible {
  outline: 1px solid var(--accent);
  outline-offset: 2px;
}

/* selection */
::selection { background: var(--accent); color: var(--background); }

/* reusable type roles */
.eyebrow {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--accent);
}
.eyebrow--silver { color: var(--muted-foreground); }
.eyebrow--stone { color: var(--foreground); }

.nav-label, .mono-nav {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}

.mono-meta {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 400;
  letter-spacing: 0.1em;
  color: var(--muted-foreground);
}

.mono-chip {
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--muted-foreground);
}

.display-mono {
  font-family: var(--font-sans);
  font-weight: 900;
  letter-spacing: -0.04em;
  line-height: 0.88;
  text-transform: uppercase;
}

.h-section {
  font-family: var(--font-sans);
  font-weight: 700;
  font-size: var(--section-heading);
  letter-spacing: -0.02em;
  line-height: 1.05;
  color: var(--foreground);
}

.h-sub {
  font-family: var(--font-sans);
  font-weight: 600;
  font-size: var(--sub-heading);
  letter-spacing: -0.01em;
  line-height: 1.2;
}

.body-copy {
  font-size: 15px;
  line-height: 1.8;
  color: var(--muted-foreground);
}
.body-copy--stone { color: var(--foreground); }

/* container */
.container {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-pad-x);
}
@media (min-width: 1024px) {
  .container { padding-inline: var(--container-pad-x-lg); }
}

/* hairlines */
.rule, .hairline { border: 0; border-top: 1px solid var(--border); }

/* section rhythm */
.section { padding-block: clamp(4rem, 8vw, 6rem); }
.section--hero { padding-block: clamp(5rem, 10vw, 8rem); }

/* a11y: reduced motion — kill the stagger */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0ms !important;
    animation-delay: 0ms !important;
    transition-duration: 0ms !important;
  }
}

/* utility */
.visually-hidden {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}