/* ── Shelly Kelly · Color tokens ────────────────────────────────────────
   "Sunny Shores" palette — bright, beachy, boutique. */

:root {
  /* — Brand core (raw) — */
  --sk-coral:        #FF7A59;   /* primary accent — CTAs, highlights */
  --sk-coral-deep:   #E85F3D;   /* hover/pressed coral */
  --sk-yellow:       #FFC94D;   /* sunshine — secondary accent, gold echo */
  --sk-yellow-deep:  #F0B22E;   /* hover yellow */
  --sk-teal:         #19B3A6;   /* teal — links, tags, accents */
  --sk-teal-deep:    #12928A;   /* hover teal */
  --sk-turquoise:    #7AD0E6;   /* sky turquoise — soft fills, washes */
  --sk-turquoise-deep:#54B8D2;

  /* — Signature gilding — */
  --sk-gold:         #C9A24B;   /* hand-gilded gold edge */
  --sk-gold-light:   #E7C877;
  --sk-gold-sheen:   linear-gradient(100deg,#E7C877 0%,#C9A24B 42%,#F2DFA0 62%,#B98E33 100%); /* @kind other */

  /* — Neutrals / surfaces — */
  --sk-cream:        #FFF6E6;   /* warm page background */
  --sk-cream-deep:   #FBEED4;   /* alt section band */
  --sk-white:        #FFFFFF;
  --sk-shell:        #FDF9F1;   /* card surface, slightly warm */
  --sk-ink:          #0E6B6B;   /* deep teal — primary text */
  --sk-ink-soft:     #3C7E7C;   /* muted teal text */
  --sk-line:         #EADFC9;   /* hairline borders on cream */
  --sk-line-soft:    #F1E7D4;

  /* — Semantic aliases — */
  --color-bg:            var(--sk-cream);
  --color-bg-alt:        var(--sk-cream-deep);
  --surface-card:        var(--sk-shell);
  --surface-raised:      var(--sk-white);
  --text-heading:        var(--sk-ink);
  --text-body:           var(--sk-ink);
  --text-muted:          var(--sk-ink-soft);
  --text-on-accent:      #FFFFFF;
  --border-default:      var(--sk-line);
  --border-soft:         var(--sk-line-soft);

  --accent-primary:      var(--sk-coral);
  --accent-primary-hover:var(--sk-coral-deep);
  --accent-secondary:    var(--sk-teal);
  --accent-secondary-hover:var(--sk-teal-deep);
  --accent-sunshine:     var(--sk-yellow);
  --accent-sky:          var(--sk-turquoise);

  --link-color:          var(--sk-teal-deep);
  --link-color-hover:    var(--sk-coral);

  /* focus ring */
  --focus-ring:          0 0 0 3px rgba(122,208,230,.55);
}