/* ABC Oldies Radio – Theme v2 (white / blue → purple)
   Fonts: Manrope (body), Sora (headings). Radius: 4–5px everywhere. */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&family=Sora:wght@500;600;700;800&display=swap');

:root{
  /* Surfaces */
  --bg:#FFFFFF;
  --surface:#FFFFFF;
  --surface-alt:#F6F5FF;      /* soft lavender tint for alternate sections */
  --border:#E3E1F5;
  --border-strong:#CFCBEB;

  /* Brand: blue → purple */
  --blue-500:#2F6BFF;
  --blue-600:#2457E6;
  --indigo-600:#4F46E5;
  --purple-500:#8B5CF6;
  --purple-600:#7C3AED;
  --purple-700:#6D28D9;
  --grad:linear-gradient(135deg,#2F6BFF 0%,#5B4DF0 50%,#8B3FE8 100%);
  --grad-soft:linear-gradient(135deg,#EAF0FF 0%,#F1EBFF 100%);

  /* Text */
  --ink:#171540;              /* headings */
  --text:#3B3A5C;             /* body */
  --muted:#6E6C92;
  --on-brand:#FFFFFF;

  /* Status */
  --live:#E11D48;             /* LIVE tag / donate accent */
  --success:#12A150;
  --danger:#D92D20;
  --warning:#B54708;

  /* Shape & depth */
  --radius:5px;               /* boxes, cards, sections, inputs, buttons */
  --radius-sm:4px;            /* chips, tags, small controls */
  --shadow-sm:0 1px 2px rgba(23,21,64,.06),0 1px 3px rgba(23,21,64,.05);
  --shadow-md:0 6px 20px rgba(79,70,229,.12);
  --shadow-player:0 -4px 20px rgba(79,70,229,.15);

  /* Type */
  --font-body:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-head:'Sora','Manrope',system-ui,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.6}
h1,h2,h3,h4,h5,h6{font-family:var(--font-head);color:var(--ink);line-height:1.2;margin:0 0 .5em;letter-spacing:-.01em}
h1{font-size:clamp(2rem,4.5vw,3.25rem);font-weight:800}
h2{font-size:clamp(1.5rem,3vw,2.1rem);font-weight:700}
h3{font-size:1.25rem;font-weight:600}
a{color:var(--indigo-600)}
.text-grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* Boxes & sections */
.card,.section-box,.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:1.5rem}
.section{padding:4rem 1rem}
.section--alt{background:var(--surface-alt)}
.container{max-width:1100px;margin:0 auto}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;font:600 .95rem var(--font-body);padding:.7rem 1.2rem;border-radius:var(--radius);border:1px solid transparent;cursor:pointer;text-decoration:none;transition:.15s}
.btn-primary{background:var(--grad);color:var(--on-brand)}
.btn-primary:hover{filter:brightness(1.08);box-shadow:var(--shadow-md)}
.btn-outline{background:#fff;color:var(--indigo-600);border-color:var(--border-strong)}
.btn-outline:hover{background:var(--surface-alt)}
.btn-donate{background:var(--live);color:#fff}

/* Forms */
input,select,textarea{font:inherit;color:var(--ink);background:#fff;border:1px solid var(--border-strong);border-radius:var(--radius);padding:.65rem .8rem;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--purple-500);outline-offset:1px;border-color:transparent}
label{font-weight:600;color:var(--ink);font-size:.9rem}

/* Chips / tags */
.chip{display:inline-block;font:700 .7rem var(--font-body);letter-spacing:.08em;text-transform:uppercase;padding:.25rem .55rem;border-radius:var(--radius-sm);background:var(--grad-soft);color:var(--indigo-600)}
.chip--live{background:var(--live);color:#fff}