/* =========================================================
   Sekuła Design — design tokens
   Oranienbaum display serif + Montserrat body
   Warm cream + dark brown palette
   ========================================================= */

/* Oranienbaum is loaded from Google Fonts via a <link> in each HTML
   head — that guarantees the latin-ext subset with proper Polish
   diacritics (ą ę ł ń ś ź ż ć ó). The local .woff2 files were subset
   to basic Latin only. */

@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin-ext.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB,
                 U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Montserrat";
  src: url("../fonts/montserrat-latin.woff2") format("woff2");
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6,
                 U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191,
                 U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* Color — primary */
  --color-bg:         #F3EFE6;
  --color-bg-white:   #FFFFFF;
  --color-bg-deep:    #EBE5D7;
  --color-dark:       #343230;
  --color-dark-soft:  #3A3938;
  --color-text:       #5D5850;
  --color-text-soft:  #7A7469;
  --color-white:      #FFFFFF;
  --color-white-50:   rgba(255, 255, 255, 0.5);
  --color-white-70:   rgba(255, 255, 255, 0.72);
  --color-divider:    rgba(94, 88, 80, 0.16);
  --color-divider-strong: rgba(52, 50, 48, 0.28);
  --color-accent:     #343230;

  /* Type */
  --font-display: "Oranienbaum", "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-sans:    "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Fluid type scale — display
     clamp(min, preferred, max)
     Home hero headline is the largest step. */
  --fs-display-xl: clamp(3.25rem, 2rem + 6.5vw, 9.75rem);   /* 52 → 156px */
  --fs-display-lg: clamp(2.5rem, 1.6rem + 4.5vw, 7rem);     /* 40 → 112px */
  --fs-display-md: clamp(2rem, 1.3rem + 3vw, 4.5rem);       /* 32 → 72px */
  --fs-display-sm: clamp(1.75rem, 1.2rem + 1.8vw, 3rem);    /* 28 → 48px */
  --fs-h1: clamp(2.5rem, 1.6rem + 4.5vw, 6rem);
  --fs-h2: clamp(2rem, 1.3rem + 3vw, 4rem);
  --fs-h3: clamp(1.5rem, 1.15rem + 1.4vw, 2.25rem);
  --fs-h4: clamp(1.25rem, 1rem + 0.8vw, 1.625rem);

  --fs-lead:  clamp(1.0625rem, 0.95rem + 0.4vw, 1.25rem);
  --fs-body:  1rem;       /* 16 */
  --fs-small: 0.875rem;   /* 14 */
  --fs-meta:  0.75rem;    /* 12 */

  --lh-display: 0.98;
  --lh-heading: 1.08;
  --lh-body:    1.55;
  --lh-meta:    1.4;

  --tracking-display: -0.018em;
  --tracking-heading: -0.012em;
  --tracking-body:    -0.002em;
  --tracking-meta:    0.12em;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --space-9: 96px;
  --space-10: 128px;
  --space-11: 160px;
  --space-12: 200px;

  /* Layout */
  --max-width: 1440px;
  --content-width: 1200px;
  --prose-width: 68ch;

  --gutter-desktop: clamp(2rem, 1rem + 3vw, 6.25rem); /* 32 → 100 */
  --gutter-tablet: 48px;
  --gutter-mobile: 24px;

  --section-py: clamp(5rem, 3rem + 6vw, 9.375rem); /* 80 → 150 */
  --section-py-tight: clamp(4rem, 2.5rem + 4vw, 7rem);

  /* Border + radius */
  --radius-image: 4px;
  --radius-card: 6px;
  --radius-pill: 999px;

  --border-hair: 1px solid var(--color-divider);
  --border-strong: 1px solid var(--color-divider-strong);

  /* Motion */
  --ease-out: cubic-bezier(0.2, 0.7, 0.2, 1);
  --ease-in-out: cubic-bezier(0.6, 0, 0.2, 1);
  --dur-fast: 200ms;
  --dur-base: 400ms;
  --dur-slow: 700ms;
  --dur-cinematic: 1100ms;

  /* Layering */
  --z-nav: 100;
  --z-overlay: 200;
  --z-modal: 300;
}

/* Light-touch dark preference — retain the warm mood on OLED screens. */
@media (prefers-color-scheme: dark) {
  :root {
    /* Intentionally do NOT flip to dark mode.
       The brand is cream-first. We only slightly soften the whites
       to reduce OLED glare on inner white cards. */
    --color-bg-white: #FAF7EF;
  }
}