/* ===========================================================================
   Studio Purna — design tokens
   ---------------------------------------------------------------------------
   Source: design-system/project/colors_and_type.css (Claude design bundle).
   Deep wine ink, dusty-rose surfaces, gold metal accent, kundan jewel pops
   reserved for collection moments. Sentence-case, calm motion, no gradients
   on surfaces, no center-aligned body copy.
   =========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500&family=Hind:wght@300;400;500;600;700&family=Petit+Formal+Script&display=swap');

:root {
  /* ---- Brand palette ---------------------------------------------------- */
  --blush:        #F4D9D0;
  --blush-deep:   #E8B8AC;
  --blush-soft:   #FAEDE7;
  --cream:        #FBF5EE;
  --cream-warm:   #F5EAD9;
  --bone:         #EBDDD0;

  --ink:          #2B1A1F;
  --ink-soft:     #4A2E36;
  --ink-mute:     #8A6F73;
  --ink-faint:    #C9B0B2;

  --wine:         #6B1E2E;   /* PRIMARY — buttons, wordmark, sale tags */
  --wine-deep:    #4E1320;
  --wine-soft:    #C5818A;

  --rose:         #B25A6A;
  --gold:         #B8884A;
  --gold-leaf:    #D4A85C;

  --emerald:      #2F5D4F;   /* Wedding capsule jewel pop */
  --emerald-deep: #1F3D32;
  --ruby:         #8E2A3C;   /* Festive capsule jewel pop */
  --sapphire:     #2C3E5C;   /* Gifting jewel pop */
  --mint:         #B8D4C5;   /* Daily-wear jewel pop */

  /* ---- Semantic surfaces ----------------------------------------------- */
  --bg:           var(--cream);
  --bg-alt:       var(--blush-soft);
  --bg-card:      #FFFFFF;
  --bg-blush:     var(--blush);
  --bg-inverse:   var(--wine);

  --fg1:          var(--ink);
  --fg2:          var(--ink-soft);
  --fg3:          var(--ink-mute);
  --fg4:          var(--ink-faint);
  --fg-on-dark:   var(--cream);

  --accent:        var(--wine);
  --accent-hover:  var(--wine-deep);
  --accent-soft:   var(--blush-deep);

  --border:        #E2CFC6;
  --border-soft:   #EBDDD0;
  --border-strong: #C9A8A0;

  --success: #4F7350;
  --warning: var(--gold);
  --error:   #A33A2A;

  /* ---- Typography ------------------------------------------------------ */
  --font-display: 'Cormorant Garamond', Georgia, serif;
  --font-serif:   'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-script:  'Petit Formal Script', 'Cormorant Garamond', cursive;
  --font-sans:    'Hind', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-display: clamp(48px, 7vw, 96px);
  --fs-h1:      clamp(36px, 4.5vw, 56px);
  --fs-h2:      clamp(28px, 3vw, 40px);
  --fs-h3:      22px;
  --fs-h4:      18px;
  --fs-body:    16px;
  --fs-body-sm: 14px;
  --fs-caption: 12px;
  --fs-eyebrow: 11px;

  --lh-tight:  1.05;
  --lh-snug:   1.25;
  --lh-normal: 1.55;
  --lh-loose:  1.75;

  --tracking-wide: 0.18em;
  --tracking-mid:  0.08em;
  --tracking-snug: -0.01em;

  /* ---- Spacing (4px grid) --------------------------------------------- */
  --s-1: 4px;  --s-2: 8px;   --s-3: 12px;  --s-4: 16px;  --s-5: 24px;
  --s-6: 32px; --s-7: 48px;  --s-8: 64px;  --s-9: 96px;  --s-10: 128px;

  /* ---- Radii ----------------------------------------------------------- */
  --r-none: 0;
  --r-sm: 2px;
  --r-md: 4px;
  --r-lg: 8px;
  --r-pill: 999px;

  /* ---- Shadows (wine-ink hue) ----------------------------------------- */
  --shadow-xs: 0 1px 2px rgba(42, 33, 24, 0.05);
  --shadow-sm: 0 2px 8px rgba(42, 33, 24, 0.06);
  --shadow-md: 0 8px 24px rgba(42, 33, 24, 0.08);
  --shadow-lg: 0 24px 48px rgba(42, 33, 24, 0.12);
  --shadow-inset: inset 0 1px 2px rgba(42, 33, 24, 0.06);

  /* ---- Motion ---------------------------------------------------------- */
  --ease-out:    cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 150ms;
  --t-base: 240ms;
  --t-slow: 480ms;
}