/* Spin Haus — Colour palette
   Seven brand colours from the brand guidelines (p.14).
   Text/background pairings that pass legibility are encoded as semantic aliases. */

:root {
  /* ---- Brand palette (raw) ---- */
  --alice-blue: #DAEBF2;   /* soft, cool tint */
  --white:      #FFFFFF;
  --old-lace:   #F7EEDF;   /* warm paper cream */
  --yale-blue:  #1B4D66;   /* primary deep teal-blue */
  --evergreen:  #1C3323;   /* deepest, near-black green */
  --dry-sage:   #B6C491;   /* muted sage green */
  --deep-mocha: #4D3E37;   /* warm dark brown */

  /* ---- Neutral / surface aliases ---- */
  --surface-page:    var(--old-lace);   /* default warm paper backdrop */
  --surface-page-cool: var(--alice-blue);
  --surface-card:    var(--white);
  --surface-ink:     var(--yale-blue);  /* dark section on brand blue */
  --surface-forest:  var(--evergreen);

  /* ---- Text aliases ---- */
  --text-primary:   var(--evergreen);   /* body on light */
  --text-heading:   var(--yale-blue);   /* headings on light */
  --text-muted:     var(--deep-mocha);
  --text-on-dark:   var(--old-lace);    /* body on dark */
  --text-on-dark-strong: var(--white);

  /* ---- Accent / interactive ---- */
  --accent:         var(--yale-blue);
  --accent-soft:    var(--dry-sage);
  --accent-warm:    var(--deep-mocha);

  /* ---- Lines / borders ---- */
  --line:           color-mix(in srgb, var(--yale-blue) 18%, transparent);
  --line-strong:    color-mix(in srgb, var(--yale-blue) 40%, transparent);
  --line-on-dark:   color-mix(in srgb, var(--old-lace) 24%, transparent);

  /* ---- Atmospheric gradients ----
     A soft, desaturated radial "mist" — darker pool toward upper-centre,
     lightening to the edges. From the guidelines' Mission spread. Used LARGE
     and quiet, behind editorial type; never as small fills or button colour.
     Retinted per section but always low-chroma and slow. */
  --gradient-mist:    radial-gradient(90% 80% at 50% 40%, #2c4a59 0%, #3f5e6c 38%, #74909b 78%, #93a6ac 100%); /* @kind other */
  --gradient-forest:  radial-gradient(90% 80% at 50% 40%, #16281c 0%, #24402d 40%, #55735c 80%, #7d9079 100%); /* @kind other */
  --gradient-mocha:   radial-gradient(90% 80% at 50% 40%, #2e211c 0%, #43332c 40%, #7c6a60 82%, #9a8a7f 100%); /* @kind other */
  /* Duotone wash for grading photography into the palette (multiply over image). */
  --gradient-photo-grade: linear-gradient(150deg, color-mix(in srgb, var(--yale-blue) 55%, transparent), color-mix(in srgb, var(--evergreen) 40%, transparent));
}