/* ==========================================================================
   Alisa Torrent Closures — Design tokens, reset and self-hosted type
   Palette derived from the brand mark (#00a5d2) sampled from the logo SVG.
   ========================================================================== */

/* ---------- Self-hosted variable fonts (latin subset, no CDN) ---------- */
@font-face {
  font-family: 'Bodoni Moda';
  src: url('../fonts/bodoni-moda-latin.woff2') format('woff2-variations'),
       url('../fonts/bodoni-moda-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122;
}
@font-face {
  font-family: 'Bodoni Moda';
  src: url('../fonts/bodoni-moda-italic-latin.woff2') format('woff2-variations'),
       url('../fonts/bodoni-moda-italic-latin.woff2') format('woff2');
  font-weight: 400 700;
  font-style: italic;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122;
}
@font-face {
  font-family: 'Archivo';
  src: url('../fonts/archivo-latin.woff2') format('woff2-variations'),
       url('../fonts/archivo-latin.woff2') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+2000-206F, U+2122;
}

:root {
  /* ---------- Brand ---------- */
  --c-brand:        #00a5d2;
  --c-brand-deep:   #0079a0;
  --c-brand-bright: #4ad2f0;
  --c-brand-glow:   rgba(0, 165, 210, .32);

  /* ---------- Depth / dark ground ---------- */
  --c-ink:    #04141a;
  --c-ink-2:  #08222b;
  --c-ink-3:  #0d2f3a;
  --c-ink-4:  #12414f;

  /* ---------- Metallics ---------- */
  --c-brass:      #d9b978;
  --c-brass-soft: #f0dcae;
  --c-alu:        #a9bcc3;
  --c-alu-bright: #e8f1f4;

  /* ---------- Light ground ---------- */
  --c-bone:    #f3f6f7;
  --c-bone-2:  #e7edef;
  --c-surface: #ffffff;
  --c-text:    #0a1a20;
  --c-muted:   #56707a;

  /* ---------- Lines ---------- */
  --c-line:       rgba(169, 188, 195, .24);
  --c-line-dark:  rgba(232, 241, 244, .13);
  --c-line-brass: rgba(217, 185, 120, .42);

  /* ---------- Glass ---------- */
  /* Opaque enough that white nav text keeps AA contrast when the header
     floats over a light band. */
  --glass-bg:     rgba(5, 24, 31, .86);
  --glass-bg-lt:  rgba(255, 255, 255, .62);
  --glass-border: rgba(232, 241, 244, .16);
  --glass-blur:   blur(20px) saturate(165%);

  /* ---------- Layered shadows (never single-layer) ---------- */
  --sh-1: 0 1px 2px rgba(4, 20, 26, .10),
          0 2px 6px rgba(4, 20, 26, .07);
  --sh-2: 0 2px 4px rgba(4, 20, 26, .10),
          0 8px 20px rgba(4, 20, 26, .11),
          0 18px 48px rgba(4, 20, 26, .13);
  --sh-3: 0 4px 8px rgba(4, 20, 26, .12),
          0 16px 36px rgba(4, 20, 26, .16),
          0 40px 90px rgba(4, 20, 26, .26),
          inset 0 1px 0 rgba(255, 255, 255, .06);
  --sh-brand: 0 0 0 1px rgba(0, 165, 210, .30),
              0 10px 34px rgba(0, 165, 210, .22),
              0 2px 8px rgba(4, 20, 26, .18);
  --sh-brass: 0 0 0 1px rgba(217, 185, 120, .34),
              0 12px 40px rgba(217, 185, 120, .18);

  /* ---------- Type ---------- */
  --f-display: 'Bodoni Moda', 'Didot', 'Bodoni MT', Georgia, 'Times New Roman', serif;
  --f-sans: 'Archivo', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto,
            'Helvetica Neue', Arial, sans-serif;

  --fs-display: clamp(2.6rem, 5.8vw, 5.4rem);
  --fs-h1:      clamp(2.4rem, 5.4vw, 4.6rem);
  --fs-h2:      clamp(2rem, 4.1vw, 3.5rem);
  --fs-h3:      clamp(1.35rem, 2.1vw, 1.9rem);
  --fs-body:    clamp(1rem, .42vw + .92rem, 1.125rem);
  --fs-sm:      .9375rem;
  --fs-xs:      .8125rem;
  --fs-eyebrow: .6875rem;

  /* ---------- Motion ---------- */
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-io:  cubic-bezier(.65, 0, .35, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur-fast: .18s;
  --dur-base: .42s;
  --dur-slow: .9s;

  /* ---------- Rhythm ---------- */
  --r-sm: 6px;
  --r-md: 14px;
  --r-lg: 24px;
  --r-xl: 34px;
  --r-pill: 999px;

  --maxw: 1280px;
  --maxw-narrow: 900px;
  --gut: clamp(1.15rem, 4.2vw, 4rem);
  --sec-y: clamp(4rem, 7.4vw, 7.75rem);

  --topbar-h: 40px;
  --header-h: 78px;

  /* Knurled cap-ridge texture used behind section headers */
  --knurl: repeating-linear-gradient(
      90deg,
      rgba(232, 241, 244, .10) 0 1px,
      transparent 1px 7px);
}

/* ==========================  Reset  ========================== */
*, *::before, *::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
  /* header + a little breathing room when jumping to an anchor */
  scroll-padding-top: calc(var(--header-h) + 24px);
}

body, h1, h2, h3, h4, h5, h6, p, figure, blockquote, dl, dd, ul, ol {
  margin: 0;
}
ul[class], ol[class] { list-style: none; padding: 0; }

body {
  min-height: 100vh;
  font-family: var(--f-sans);
  font-size: var(--fs-body);
  line-height: 1.7;
  color: var(--c-text);
  background: var(--c-bone);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

img, picture, video, canvas, svg { display: block; max-width: 100%; }
img, video { height: auto; }

input, button, textarea, select { font: inherit; color: inherit; }

button { background: none; border: 0; cursor: pointer; }

a { color: inherit; text-decoration: none; }

table { border-collapse: collapse; width: 100%; }

/* Visible, high-contrast focus for keyboard users only */
:focus-visible {
  outline: 2px solid var(--c-brand-bright);
  outline-offset: 3px;
  border-radius: 3px;
}
:focus:not(:focus-visible) { outline: none; }

::selection { background: var(--c-brand); color: #fff; }

/* Scrollbar — subtle, matches the metallic theme */
@supports selector(::-webkit-scrollbar) {
  ::-webkit-scrollbar { width: 11px; height: 11px; }
  ::-webkit-scrollbar-track { background: var(--c-ink); }
  ::-webkit-scrollbar-thumb {
    background: var(--c-ink-4);
    border-radius: var(--r-pill);
    border: 3px solid var(--c-ink);
  }
  ::-webkit-scrollbar-thumb:hover { background: var(--c-brand-deep); }
}
