/* Kyleness Wind Farm. Design tokens.
   Portfolio concept site. Static HTML, CSS and JS. No framework. */

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('../fonts/ibm-plex-sans-700.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Palette. North Sea slate plus turbine yellow. Light theme, locked. */
  --sea-paper: #F5F7F8;
  --slate-ink: #1C2830;
  --slate-mid: #4E6472;
  --slate-line: #D9E0E4;
  --deep: #12212B;
  --tp-yellow: #F2B705;

  /* Derived surfaces. No new hues. */
  --slot-fill: #E3E9EC;
  --slot-fill-dark: #56707F;
  --deep-soft: rgba(245, 247, 248, 0.76);
  --deep-rule: rgba(245, 247, 248, 0.20);

  /* The window scrim. Bottom weighted, structural, not decorative.
     Strengthened 2026-07-30: the original stops left the construction window
     headline at 4.10:1 once a bright image landed behind it, under the 4.5:1
     floor. The mid stops now carry more weight and the fade reaches higher, so
     a bright photograph cannot drag the text under the limit. */
  --scrim: linear-gradient(
    to top,
    rgba(18, 33, 43, 0.90) 0%,
    rgba(18, 33, 43, 0.84) 22%,
    rgba(18, 33, 43, 0.52) 42%,
    rgba(18, 33, 43, 0.18) 56%,
    rgba(18, 33, 43, 0) 68%
  );

  /* Type. One family. */
  --font: 'IBM Plex Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;

  --step-hero: clamp(2.375rem, 5.4vw, 4.25rem);
  --step-h1: clamp(2rem, 4.2vw, 3.25rem);
  --step-h2: clamp(1.5rem, 2.9vw, 2.25rem);
  --step-h3: clamp(1.0625rem, 1.4vw, 1.3125rem);
  --step-window: clamp(1.75rem, 3.6vw, 3rem);
  --step-lead: clamp(1.0625rem, 1.4vw, 1.1875rem);
  --step-body: 1rem;
  --step-small: 0.875rem;
  --step-micro: 0.75rem;
  --step-nav: 0.875rem;
  --step-stat: clamp(2.25rem, 4.6vw, 3.5rem);

  /* Layout. */
  --shell: 1240px;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --band: clamp(3.25rem, 6.5vw, 5.75rem);
  --measure: 65ch;
  --nav-h: 66px;

  /* Engineered. Sharp corners everywhere, hairlines instead of shadows. */
  --radius: 0;
}