/* Fontovi — varijabilni woff2, latin + latin-ext (šđčćž) */
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-latin.woff2') format('woff2');
  font-weight: 600 700;
  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+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-latin-ext.woff2') format('woff2');
  font-weight: 600 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Manrope';
  src: url('../fonts/manrope-latin.woff2') format('woff2');
  font-weight: 400 700;
  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+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Manrope';
  src: url('../fonts/manrope-latin-ext.woff2') format('woff2');
  font-weight: 400 700;
  font-style: normal;
  font-display: swap;
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Tipografija */
  --ff-head: 'Fraunces', Georgia, 'Times New Roman', serif;
  --ff-body: 'Manrope', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --fs-display: clamp(2.4rem, 1.55rem + 4.2vw, 4.25rem);
  --fs-h1: clamp(2rem, 1.5rem + 2.4vw, 3rem);
  --fs-h2: clamp(1.6rem, 1.28rem + 1.5vw, 2.25rem);
  --fs-h3: clamp(1.25rem, 1.12rem + 0.62vw, 1.5rem);
  --fs-lead: clamp(1.075rem, 1.01rem + 0.34vw, 1.25rem);
  --fs-body: 1.0625rem;
  --fs-small: 0.875rem;
  --lh-tight: 1.12;
  --lh-head: 1.2;
  --lh-body: 1.62;

  /* Razmaci */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 2.5rem;
  --sp-8: 3rem;
  --sp-9: 4rem;
  --sp-10: 5rem;
  --sp-11: 6rem;
  --sp-12: 8rem;

  /* Radiusi i mere */
  --r-xs: 6px;
  --r-sm: 12px;
  --r-md: 16px;
  --r-pill: 999px;
  --container: 1200px;
  --gutter: clamp(1rem, 4vw, 2.5rem);
  --header-h: 72px;

  /* Motion */
  --dur-fast: 140ms;
  --dur: 200ms;
  --dur-slow: 320ms;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
  --ease-in-out: cubic-bezier(0.77, 0, 0.175, 1);

  /* Z skala */
  --z-guide: 0;
  --z-header: 100;
  --z-overlay: 190;
  --z-drawer: 200;
  --z-toast: 300;

  /* Paleta — svetla (podrazumevana i bez JS-a) */
  --bg: #FAFAF8;
  --surface: #FFFFFF;
  --surface-2: #F3F3EE;
  --text: #1A2E2A;
  --muted: #5A6E6A;
  --accent: #0F766E;
  --accent-hover: #115E59;
  --accent-ink: #0F766E;
  --accent-2: #0F766E;
  --accent-soft: #D1E7E2;
  --accent-strong: #0F766E;
  --on-strong: #FFFFFF;
  --line: #E6E4DC;
  --rule: #0F766E;
  --guide: #0F766E;
  --guide-glow: none;
  --focus: #0F766E;
  --shadow-color: 174 45% 12%;
  --hero-scrim: linear-gradient(180deg, transparent 40%, rgba(26, 46, 42, 0.06));
  color-scheme: light;

  --shadow-sm: 0 1px 2px hsl(var(--shadow-color) / 0.06), 0 1px 1px hsl(var(--shadow-color) / 0.04);
  --shadow-md: 0 2px 6px hsl(var(--shadow-color) / 0.06), 0 8px 20px hsl(var(--shadow-color) / 0.05);
  --shadow-lg: 0 6px 16px hsl(var(--shadow-color) / 0.08), 0 22px 44px hsl(var(--shadow-color) / 0.06);
}

:root[data-theme='svetla'] {
  color-scheme: light;
}

:root[data-theme='tamna'] {
  --bg: #0C1514;
  --surface: #132320;
  --surface-2: #18302B;
  --text: #ECE9E2;
  --muted: #A8B5AF;
  --accent: #C9A96A;
  --accent-hover: #D8BC82;
  --accent-ink: #C9A96A;
  --accent-2: #2A6B62;
  --accent-soft: #1C3A34;
  --accent-strong: #C9A96A;
  --on-strong: #0C1514;
  --line: #243B35;
  --rule: #C9A96A;
  --guide: #C9A96A;
  --guide-glow: drop-shadow(0 0 6px rgba(201, 169, 106, 0.45));
  --focus: #D8BC82;
  --shadow-color: 168 40% 2%;
  --hero-scrim: linear-gradient(180deg, transparent 30%, rgba(0, 0, 0, 0.28));
  color-scheme: dark;

  --shadow-sm: 0 1px 2px hsl(var(--shadow-color) / 0.5), 0 1px 1px hsl(var(--shadow-color) / 0.4);
  --shadow-md: 0 4px 10px hsl(var(--shadow-color) / 0.5), 0 12px 28px hsl(var(--shadow-color) / 0.4);
  --shadow-lg: 0 10px 24px hsl(var(--shadow-color) / 0.55), 0 26px 52px hsl(var(--shadow-color) / 0.45);
}

:root[data-theme='blush'] {
  --bg: #FBF3F0;
  --surface: #FFFFFF;
  --surface-2: #FBEAE6;
  --text: #4A2B32;
  --muted: #835E6B;
  --accent: #B76E79;
  --accent-hover: #A05A66;
  --accent-ink: #6D2E46;
  --accent-2: #6D2E46;
  --accent-soft: #F5E1E5;
  --accent-strong: #6D2E46;
  --on-strong: #FFFFFF;
  --line: #ECD9D0;
  --rule: #C9A96A;
  --guide: #B76E79;
  --guide-glow: none;
  --focus: #6D2E46;
  --shadow-color: 340 30% 22%;
  --hero-scrim: linear-gradient(180deg, transparent 40%, rgba(74, 43, 50, 0.07));
  color-scheme: light;

  --shadow-sm: 0 1px 2px hsl(var(--shadow-color) / 0.08), 0 1px 1px hsl(var(--shadow-color) / 0.05);
  --shadow-md: 0 2px 6px hsl(var(--shadow-color) / 0.08), 0 8px 20px hsl(var(--shadow-color) / 0.06);
  --shadow-lg: 0 6px 16px hsl(var(--shadow-color) / 0.1), 0 22px 44px hsl(var(--shadow-color) / 0.07);
}