/* variables.css - central design tokens */
:root {
  /* Colors */
    /* Official brand colors */
    --color-bg-main: #0b0d10; /* official black tone */
      --color-bg-soft: #0b0d10;
      --color-bg-card: #0b0d10;
      --color-text-primary: #faf9f6; /* official white tone */
      --color-text-secondary: #c9c2b8;
      --color-accent-gold: #c6a15b; /* official gold tone */
      --color-footer-bg: #0f1113; /* slightly lighter than main */
    --color-accent-gold-soft: rgba(184,146,79,0.35);
    --color-border-soft: rgba(244,239,232,0.08);
    --color-divider-soft: rgba(184,146,79,0.18);
    --color-input-bg: #0A0D12;
    --color-input-border: rgba(244,239,232,0.08);
    --color-overlay-dark: rgba(5,7,10,0.45);
    /* Vignette / atmospheric overlay tokens */
    --vignette-strength: 0.28; /* overall darkness */
    --vignette-edge-softness: 60%;
    --vignette-color: rgba(0,0,0,var(--vignette-strength));
    /* Site background image (replaceable) */
    --site-bg-image: url('../assets/images/background-site.jpg');
    --site-bg-darken: rgba(5,6,8,0.55);

  /* Layout */
  --container-max: 1400px;
  --container-padding-desktop: 64px;
  --container-padding-tablet: 40px;
  --container-padding-mobile: 20px;

  /* Radius */
  --radius-soft: 18px;
  --radius-medium: 28px;

  /* Transitions */
  --transition-fast: 180ms ease;
  --transition-medium: 260ms ease;
  --transition-slow: 400ms ease;

  /* Typography */
  --font-sans: 'Inter', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  --font-serif: 'Cormorant Garamond', 'Georgia', serif;

  /* font weights used across the site */
  --fw-regular: 400;
  --fw-medium: 500;
  --fw-semi: 600;

  /* typographic scale (used by base.css) */
  --type-h1-clamp: clamp(3.4rem, 6vw, 6.2rem);
  --type-h2-clamp: clamp(2.6rem, 4vw, 4.4rem);
  --type-h3-clamp: clamp(2rem, 3vw, 3rem);
  --type-h4: 1.75rem;
  --type-h5: 1.4rem;
  --type-h6: 1.15rem;
  --type-body-large: 1.2rem;
  --type-body: 1rem;
  --type-body-small: 0.92rem;

  --type-hero: 64px;
  --type-h1: 40px;
  --type-h2: 28px;
  --type-body: 18px;
  --type-small: 14px;

  /* refined rhythm */
  --space-xxs: 6px;
  --space-xs: 12px;
  --space-sm: 16px;
  --space-md: 24px;
  --space-lg: 40px;
  --space-xl: 64px;

  /* content widths */
  --hero-max-width: 980px;
  --content-max-width: 920px;

  --line-height-tight: 1.05;
  --line-height-normal: 1.5;

  /* Breakpoints */
  --bp-large: 1440px;
  --bp-desktop: 1200px;
  --bp-laptop: 992px;
  --bp-tablet: 768px;
  --bp-mobile: 480px;
}

/* Utility container */
.container {
  max-width: var(--container-max);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--container-padding-desktop);
  padding-right: var(--container-padding-desktop);
}

@media (max-width: 1200px) {
  .container { padding-left: var(--container-padding-tablet); padding-right: var(--container-padding-tablet); }
}
@media (max-width: 768px) {
  .container { padding-left: var(--container-padding-mobile); padding-right: var(--container-padding-mobile); }
}