/* [Claude/Kin] 2026-07-19 — Kedai Emas tokens · ISTANA DIRAJA (royal opulent Malay premium).
   Deep marun/emerald jewel base + heavy gold, per Ming. Spacing/type/rhythm kept from WEB-BUILD-GUIDE.
   Motifs (songket, awan larat, pucuk rebung) live in styles.css as self-contained SVG/CSS. */
:root {
  /* ---- STYLE HOOK: which Leaflet basemap this style wants (read by app.js).
     Style 1/3 = dark ground → dark tiles. Style 2 (light) overrides to `light`. */
  --map-tiles: dark;

  /* ---- GOLD (brighter, for pop on dark jewel) -------------------------- */
  --gold:        #E4BE6E;  /* PRIMARY accent */
  --gold-soft:   #F6E3AE;  /* highlight / foil light */
  --gold-mid:    #D4A64C;
  --gold-strong: #B9852B;  /* foil mid / pressed */
  --gold-deep:   #8C611A;  /* foil dark */
  --grad-gold:   linear-gradient(180deg, var(--gold-soft) 0%, var(--gold) 52%, var(--gold-strong) 100%);
  --grad-foil:   linear-gradient(100deg, var(--gold-strong) 0%, var(--gold-soft) 26%, #FFF6DF 42%, var(--gold-soft) 58%, var(--gold-strong) 82%, var(--gold-soft) 100%); /* shimmer text */

  /* ---- JEWEL BACKGROUNDS (marun royal + emerald accent) --------------- */
  --marun-900: #24070C;  /* page base — deepest maroon */
  --marun-800: #310A12;  /* section */
  --marun-700: #43101B;  /* raised panel / card on dark */
  --emerald:   #0E3B2D;  /* secondary jewel band */
  --emerald-2: #14503B;
  --ink-band:  #1B0509;  /* deepest — footer / price hook */

  /* ---- IVORY / CREAM (product cards + light accents on jewel) ---------- */
  --cream:   #FBF3E1;  /* product-card ivory */
  --cream-2: #F3E7CC;
  --ink:     #2C1A12;  /* text on cream (deep maroon-brown) */
  --ink-soft:#6E5238;
  --ink-dim: #9A8060;

  /* ---- TEXT on jewel --------------------------------------------------- */
  --on-dark:     #F7ECD3;  /* warm ivory heading/body on jewel */
  --on-dark-mut: #CBA976;  /* muted gold-ivory */
  --on-dark-dim: #9A7C52;
  --on-gold:     #2A1206;  /* text on gold fills */

  /* ---- BORDERS / LINES ------------------------------------------------- */
  --line-gold:   rgba(228,190,110,0.34);
  --line-gold-s: rgba(228,190,110,0.16);
  --line-dark:   rgba(255,240,210,0.10);
  --line-cream:  rgba(44,26,18,0.12);

  /* ---- STATUS ---------------------------------------------------------- */
  --wa: #25D366; --up: #6FCf97; --down: #E8998A;

  /* ---- TYPOGRAPHY (scale kept; serif display) ------------------------- */
  --font-display: "Playfair Display", Georgia, "Times New Roman", serif;
  --font-ui:      "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --font-jawi:    "Scheherazade New", "Traditional Arabic", "Noto Naskh Arabic", serif;
  --num-tabular:  "tnum" 1, "lnum" 1;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700;

  --fs-hero:    clamp(40px, 6vw, 66px);  --lh-hero: 1.06;
  --fs-section: clamp(29px, 4vw, 40px);  --lh-section: 1.12;
  --fs-eyebrow: 14px;   --ls-wide: 0.18em;
  --fs-lead:    clamp(17px, 2.2vw, 20px); --lh-lead: 1.6;
  --fs-h3:      22px;
  --fs-price:   clamp(32px, 4vw, 44px);
  --fs-body:    16px;   --lh-body: 1.6;
  --fs-meta:    14px;
  --fs-legal:   13px;

  /* ---- SPACING (4px base) --------------------------------------------- */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px;
  --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px;
  --space-20:80px; --space-24:96px; --space-30:120px;

  --container-max: 1200px;
  --gutter:     var(--space-6);
  --chrome-pad: clamp(20px, 4vw, 40px);
  --section-pad-y: 72px;
  --section-pad-y-lg: 120px;

  /* ---- RADII (rounded but a touch more classic) ----------------------- */
  --r-btn:10px; --r-card:20px; --r-lg:26px; --r-pill:999px; --r-chip:12px;

  /* ---- EFFECTS / MOTION ------------------------------------------------ */
  --shadow-card: 0 26px 60px -22px rgba(0,0,0,0.6);
  --shadow-soft: 0 16px 40px -18px rgba(0,0,0,0.45);
  --glow-gold:   0 24px 60px -20px rgba(228,190,110,0.5);
  --ring-focus:  0 0 0 3px rgba(228,190,110,0.5);
  --dur-fast:140ms; --dur-base:280ms; --dur-slow:680ms;
  --ease: cubic-bezier(0.22,1,0.36,1);
}
