/* Dizajnerski tokeni — spojeni iz _ds/…/tokens/ pri izradi site/.
   Redoslijed je isti kao redoslijed <link> tagova u showroomu i nije proizvoljan:
   base.css na kraju smije pregaziti ranije vrijednosti. fonts.css i typography.css
   nisu ovdje jer ih nijedna stranica nikad nije učitavala. */

/* ── colors.css ─────────────────────────────────────────────── */
:root{
  --pg-plum-950:#2b1314; --pg-plum-900:#3d1c1d; --pg-plum-800:#552728; --pg-plum-700:#6b3839;
  --pg-plum-500:#8f6a6a; --pg-plum-300:#c0a8a8; --pg-plum-100:#eadedd; --pg-plum-50:#f7efee;
  --pg-brick-800:#6a2426; --pg-brick-600:#892f31; --pg-brick-500:#a4413f; --pg-brick-300:#cf8b86; --pg-brick-100:#f3ddd8;
  --pg-leaf-700:#3f5c11; --pg-leaf-600:#5b831c; --pg-leaf-500:#6db620; --pg-leaf-400:#8ecc4b;
  --pg-leaf-200:#cfe8a8; --pg-leaf-100:#e8f3d5; --pg-leaf-50:#f4f9ea;
  --pg-purple-800:#4a1553; --pg-purple-700:#601e6b; --pg-purple-300:#a97fb2; --pg-purple-100:#ebdcee;
  --pg-magenta-600:#b02a8f; --pg-magenta-500:#d436ac; --pg-magenta-300:#e88fd0; --pg-magenta-100:#fbe2f4;
  --pg-paper:#fdfaf6; --pg-sand-50:#f8f4ed; --pg-sand-100:#f1ebe1; --pg-sand-200:#e6ddcf; --pg-sand-300:#d6cab6;
  --pg-stone-400:#b3a695; --pg-stone-500:#8f8272; --pg-stone-600:#6f6455; --pg-ink-800:#332524; --pg-ink-900:#231817; --pg-white:#ffffff;
  --text-strong:var(--pg-plum-800); --text-body:var(--pg-ink-800); --text-muted:var(--pg-stone-600); --text-faint:var(--pg-stone-500);
  --text-on-dark:var(--pg-sand-50); --text-on-brand:var(--pg-white); --text-link:var(--pg-leaf-700); --text-link-hover:var(--pg-plum-800);
  --text-price:var(--pg-plum-800); --text-price-sale:var(--pg-brick-600);
  --surface-page:var(--pg-paper); --surface-card:var(--pg-white); --surface-sunken:var(--pg-sand-100); --surface-raised:var(--pg-white);
  --surface-brand:var(--pg-plum-800); --surface-brand-soft:var(--pg-plum-50); --surface-leaf:var(--pg-leaf-600); --surface-leaf-soft:var(--pg-leaf-50);
  --surface-inverse:var(--pg-plum-950); --surface-overlay:rgb(43 19 20 / 0.62);
  --border-hairline:var(--pg-sand-200); --border-default:var(--pg-sand-300); --border-strong:var(--pg-plum-800); --border-focus:var(--pg-leaf-500);
  --action-primary:var(--pg-leaf-600); --action-primary-hover:var(--pg-leaf-700); --action-primary-active:var(--pg-leaf-700);
  --action-secondary:var(--pg-plum-800); --action-secondary-hover:var(--pg-plum-900); --action-quiet-hover:var(--pg-sand-100);
  --status-ok:var(--pg-leaf-600); --status-ok-soft:var(--pg-leaf-100); --status-warn:#b8791b; --status-warn-soft:#fbeed2;
  --status-danger:var(--pg-brick-600); --status-danger-soft:var(--pg-brick-100); --status-info:var(--pg-purple-700); --status-info-soft:var(--pg-purple-100);
  --season-spring:var(--pg-leaf-500); --season-summer:var(--pg-magenta-500); --season-autumn:var(--pg-brick-600); --season-winter:var(--pg-purple-700);
}

/* ── spacing.css ─────────────────────────────────────────────── */
:root{
  --space-2xs:4px; --space-xs:8px; --space-sm:12px; --space-md:16px; --space-lg:24px; --space-xl:32px; --space-2xl:48px; --space-3xl:64px; --space-4xl:96px; --space-5xl:128px;
  --container-max:1240px; --container-narrow:720px; --gutter:24px; --gutter-lg:40px; --section-y:96px; --section-y-sm:56px; --header-h:76px; --grid-gap:24px;
}

/* ── radii.css ─────────────────────────────────────────────── */
:root{ --radius-xs:3px; --radius-sm:5px; --radius-md:8px; --radius-lg:12px; --radius-xl:20px; --radius-pill:999px; --radius-card:10px; --radius-image:8px; --radius-control:6px; }

/* ── shadows.css ─────────────────────────────────────────────── */
:root{
  --shadow-hairline:0 0 0 1px var(--border-hairline);
  --shadow-xs:0 1px 2px rgb(85 39 40 / 0.07);
  --shadow-sm:0 1px 3px rgb(85 39 40 / 0.08), 0 1px 2px rgb(85 39 40 / 0.04);
  --shadow-md:0 4px 12px rgb(85 39 40 / 0.09), 0 1px 3px rgb(85 39 40 / 0.05);
  --shadow-lg:0 12px 32px rgb(85 39 40 / 0.12), 0 2px 6px rgb(85 39 40 / 0.06);
  --shadow-overlay:0 24px 64px rgb(43 19 20 / 0.24);
  --shadow-inset:inset 0 1px 2px rgb(85 39 40 / 0.08);
  --ring-focus:0 0 0 3px rgb(109 182 32 / 0.35); --ring-focus-inverse:0 0 0 3px rgb(142 204 75 / 0.5);
  --scrim-bottom:linear-gradient(to top, rgb(43 19 20 / 0.78) 0%, rgb(43 19 20 / 0.42) 42%, rgb(43 19 20 / 0) 100%);
  --scrim-full:linear-gradient(to right, rgb(43 19 20 / 0.72) 0%, rgb(43 19 20 / 0.35) 55%, rgb(43 19 20 / 0.05) 100%);
}

/* ── motion.css ─────────────────────────────────────────────── */
:root{
  --dur-instant:90ms; --dur-fast:150ms; --dur-base:220ms; --dur-slow:380ms; --dur-reveal:620ms;
  --ease-out:cubic-bezier(0.22,0.61,0.36,1); --ease-in-out:cubic-bezier(0.4,0,0.2,1); --ease-settle:cubic-bezier(0.16,0.84,0.44,1);
  --transition-control:background-color var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
  --transition-card:transform var(--dur-base) var(--ease-settle), box-shadow var(--dur-base) var(--ease-out);
}

/* ── base.css ─────────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);-webkit-font-smoothing:antialiased;text-wrap:pretty}
h1,h2,h3,h4{margin:0;color:var(--text-strong);font-family:var(--font-display);font-weight:var(--fw-semibold);line-height:var(--lh-heading);letter-spacing:var(--ls-heading)}
h1{font-size:var(--size-h1)}h2{font-size:var(--size-h2)}h3{font-size:var(--size-h3)}
p{margin:0 0 var(--space-md)}
a{color:var(--text-link);text-decoration:none;text-underline-offset:3px;transition:color var(--dur-fast) var(--ease-out)}
a:hover{color:var(--text-link-hover)}
:focus-visible{outline:2px solid var(--border-focus);outline-offset:2px}
img{max-width:100%;display:block}
::selection{background:var(--pg-leaf-200);color:var(--pg-plum-900)}
