/* ==========================================================================
   PICCADILLY RADIO 261 — BRAND TOKENS
   The single source of truth. Every colour, font and space in the redesign
   resolves back to something in this file.

   Structure and scale follow the Daybreak reference layout; the values are
   ours. Their navy maps to our black, their pink to our orange.
   ========================================================================== */

:root {

  /* --- Core palette -------------------------------------------------------
     Sampled from the logo artwork itself (New logo 2.png): orange #FC5C02,
     black #0E0E0E. Swap a value here and the whole site follows.            */

  --pr-orange:        #FC5C02;
  --pr-orange-bright: #FF7A2E;   /* hover            */
  --pr-orange-deep:   #CF4A00;   /* pressed, shading */
  --pr-orange-tint:   rgba(252, 92, 2, .12);   /* icon chips */

  --pr-black:         #0E0E0E;   /* headings + primary, replaces their navy */
  --pr-ink:           #0B0C0E;   /* deepest: footer accents, overlays       */

  --pr-white:         #FFFFFF;

  /* Neutrals carry a slight warm bias so they sit with the orange rather
     than fighting it — their equivalents are biased cool toward the navy. */
  --pr-paper:         #F7F5F2;   /* page ground        */
  --pr-mist:          #F0ECE6;   /* contact strip band */
  --pr-line:          #E4E0D9;   /* hairlines          */
  --pr-line-dark:     rgba(255, 255, 255, .14);

  --pr-grey-700:      #5F5A54;   /* body copy on light */
  --pr-grey-400:      #A5A099;   /* muted on dark      */

  --pr-live:          #E5342A;   /* on-air dot only    */

  /* --- Type ---------------------------------------------------------------
     Montserrat does the work, matching the reference. Archivo Black is kept
     for the wordmark only — it is the closest match to the merch lettering,
     and the logo should not drift just because the UI face changed.        */

  --pr-font-body: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --pr-font-mark: 'Archivo Black', 'Arial Black', 'Helvetica Neue', sans-serif;

  --pr-track-tight: -.03em;   /* headings, measured off the reference h1 */
  --pr-track-wide:  .1em;     /* small uppercase labels only             */

  /* --- Space — 4px base --------------------------------------------------- */

  --pr-s1:  .25rem;
  --pr-s2:  .5rem;
  --pr-s3:  .75rem;
  --pr-s4:  1rem;
  --pr-s5:  1.5rem;
  --pr-s6:  2rem;
  --pr-s7:  3rem;
  --pr-s8:  4rem;
  --pr-s9:  5rem;

  /* --- Shape --------------------------------------------------------------
     Pills for anything clickable, soft radii for surfaces.                  */

  --pr-pill:      999px;
  --pr-radius-sm: 8px;
  --pr-radius:    12px;
  --pr-radius-lg: 16px;

  --pr-shadow-xs: 0 1px 4px rgba(0, 0, 0, .06);
  --pr-shadow:    0 2px 8px rgba(0, 0, 0, .08);
  --pr-shadow-lg: 0 10px 28px rgba(20, 22, 26, .12);
  --pr-shadow-btn: 0 4px 16px rgba(252, 92, 2, .30);

  --pr-ease: cubic-bezier(.4, 0, .2, 1);

  /* --- Layout ------------------------------------------------------------- */

  --pr-max:      1220px;
  --pr-gutter:   var(--pr-s5);
  --pr-header-h: 80px;
}

/* Wider pages on big monitors, so the site does not sit in a narrow column */
@media (min-width: 1680px) { :root { --pr-max: 1440px; } }
@media (min-width: 2200px) { :root { --pr-max: 1640px; } }