/* ═══════════════════════════════════════════════════════════════
   SCENSORA · DESIGN TOKENS
   ───────────────────────────────────────────────────────────────
   This is the ONE place to change brand colours, fonts and spacing.
   Every page reads from these variables.
═══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,600&family=Montserrat:wght@300;400;500;600;700&family=Dancing+Script:wght@500;600&display=swap');

:root {

  /* ── BRAND COLOURS ────────────────────────────── */
  --color-dark:        #0f0f0f;   /* sidebar background        */
  --color-dark-2:      #1c1c1c;   /* raised dark panels        */
  --color-gold:        #C9A96E;   /* logo / accents            */
  --color-gold-soft:   #E8D5A8;   /* light gold                */
  --color-red:         #C0392B;   /* primary buttons / labels  */
  --color-red-dark:    #a93226;   /* button hover              */
  --color-cream:       #F5F0EA;   /* page background           */
  --color-warm:        #EDE8E0;   /* alt section background    */
  --color-warm-2:      #E8E0D5;   /* cards                     */
  --color-white:       #FFFFFF;
  --color-black:       #1a1a1a;

  /* ── TEXT ─────────────────────────────────────── */
  --text-body:         #2C2C2C;
  --text-muted:        #888888;
  --text-faint:        #AAAAAA;

  /* ── LINES ────────────────────────────────────── */
  --line:              rgba(0,0,0,0.09);
  --line-soft:         rgba(0,0,0,0.06);
  --line-gold:         rgba(201,169,110,0.30);

  /* ── TYPOGRAPHY ───────────────────────────────── */
  --font-display: 'Cormorant Garamond', serif;   /* big headings */
  --font-body:    'Montserrat', sans-serif;        /* everything else */
  --font-script:  'Dancing Script', cursive;       /* signatures */

  /* ── LAYOUT SIZES ─────────────────────────────── */
  --sidebar-width:           230px;
  --sidebar-collapsed-width:  64px;
  --mobile-header-height:     54px;

  /* ── MOTION ───────────────────────────────────── */
  --transition: .28s cubic-bezier(.4, 0, .2, 1);

  /* ── BREAKPOINT (reference only, used in media queries) ── */
  /* mobile  : < 600px
     tablet  : 600–900px
     desktop : > 900px */
}