/* ============================================================
   BoLOVEgna — Design Tokens
   Palette ispirata a Bologna: terracotta, avorio, blu notte
   ============================================================ */

:root {
  /* Brand colours */
  --color-terracotta:   #C1440E;
  --color-terracotta-dk:#8B2F08;
  --color-terracotta-lt:#F2C4AF;
  --color-avorio:       #FAF6F0;
  --color-avorio-dk:    #F0E8DC;
  --color-travertino:   #D4B896;
  --color-travertino-lt:#EAE0D4;
  --color-notte:        #1A2340;
  --color-notte-lt:     #2E3F5C;
  --color-ink:          #1A1410;
  --color-ink-mid:      #5A4030;
  --color-ink-soft:     #8B6A4A;
  --color-cream-card:   #FFF9F4;
  --text-primary:       #1A1410;
  --text-secondary:     #5A4030;
  --text-muted:         #765b43;

  /* Explicit foregrounds and surfaces that must not invert with the theme */
  --color-on-media:             #FFFAF5;
  --color-on-media-accent:      #FFE0D2;
  --color-on-banner-muted:      #F8D8C8;
  --color-on-banner-secondary:  #F7DED2;
  --color-on-accent:            #FFFAF5;
  --color-hero-fallback:        #3D1F0A;
  --color-bolovegnam-start:     #3D1F0A;
  --color-bolovegnam-end:       #8B2F08;
  --color-archive-dark:         #2B211B;
  --color-archive-surface-dark: #352920;
  --color-archive-border-dark:  #5D4C3D;
  --color-accent-dark-hover:    #B6491D;

  /* Typography */
  --font-serif:  'Playfair Display', Georgia, serif;
  --font-sans:   'DM Sans', system-ui, sans-serif;

  /* Hero overlay */
  --hero-overlay-strong: rgba(10, 10, 8, 0.90);
  --hero-overlay-soft: rgba(10, 10, 8, 0.20);
  --hero-scrim-bottom: rgba(8, 7, 6, 0.96);
  --hero-scrim-lower:  rgba(8, 7, 6, 0.88);
  --hero-scrim-middle: rgba(8, 7, 6, 0.72);
  --hero-scrim-top:    rgba(8, 7, 6, 0.24);

  /* Spacing scale */
  --space-xs:   4px;
  --space-sm:   8px;
  --space-md:   16px;
  --space-lg:   24px;
  --space-xl:   40px;
  --space-2xl:  64px;

  /* Layout */
  --max-width:       1400px;
  --content-width:   780px;
  --gutter-desktop:  96px;
  --gutter-tablet:   48px;
  --gutter-mobile:   16px;

  /* Borders */
  --border-thin:  0.5px solid var(--color-travertino);
  --border-card:  0.5px solid var(--color-travertino-lt);
  --radius-sm:    4px;
  --radius-md:    8px;
  --radius-pill:  20px;

  /* Transitions */
  --ease-std: 0.2s ease;
}