/* ============================================================
   Pastel Bloom Home — Design Tokens
   The single source of truth for colors, type, spacing,
   radii, shadows and motion. Everything else references these.
   ============================================================ */

:root {
  /* ---- Brand palette ---- */
  --cream:          #fdf6f0;   /* primary page background (warm cream) */
  --cream-2:        #fbf0e7;   /* slightly deeper cream band */
  --blush-bg:       #fdf3ee;   /* shop-by-space / soft sections */
  --white:          #fffdfb;   /* cards on cream */

  --rose:           #e78a89;   /* primary coral-rose */
  --rose-deep:      #dd7b7f;
  --rose-light:     #f2a7a4;
  --rose-100:       #fbe3e1;   /* soft pink pill background */
  --rose-50:        #fdeeec;

  --lavender:       #b9a2c6;   /* secondary */
  --lavender-deep:  #a389b6;
  --lavender-bg:    #e7d9ec;   /* portfolio band */
  --lavender-soft:  #efe7f4;   /* soft lavender chips */
  --lavender-100:   #ded0e6;

  --peach:          #f6d2c3;   /* testimonial card */
  --peach-2:        #fbe2d6;
  --mauve:          #cda9ad;

  /* ---- Ink / text ---- */
  --ink:            #4b3a3a;   /* headings (deep warm brown) */
  --ink-2:          #5f4d4b;
  --text:           #8b7d78;   /* body copy (mauve-gray) */
  --text-light:     #a99c97;
  --text-on-dark:   #fff7f4;

  /* ---- Gradients ---- */
  --grad-coral:  linear-gradient(135deg, #f1a8a3 0%, #e58185 55%, #dd7a80 100%);
  --grad-coral-soft: linear-gradient(135deg, #f6bdb8, #ee9a99);
  --grad-lav:    linear-gradient(135deg, #c3accf, #a98cbb);
  --grad-cta:    linear-gradient(120deg, #f3b0a8 0%, #eea7a3 45%, #e79aa0 100%);
  --grad-cream:  linear-gradient(180deg, #fdf6f0 0%, #fbeee6 100%);

  /* ---- Typography ---- */
  --font-serif:  "Playfair Display", Georgia, "Times New Roman", serif;
  --font-sans:   "Poppins", "Helvetica Neue", Arial, sans-serif;
  --font-script: "Dancing Script", "Segoe Script", cursive;
  --font-hand:   "Caveat", "Segoe Script", cursive;

  /* fluid type scale */
  --fs-eyebrow: 0.72rem;
  --fs-body:    1rem;
  --fs-h4:      clamp(1.05rem, 1.4vw, 1.2rem);
  --fs-h3:      clamp(1.4rem, 2.4vw, 1.9rem);
  --fs-h2:      clamp(1.9rem, 3.6vw, 2.9rem);
  --fs-hero:    clamp(2.6rem, 6vw, 4.4rem);

  /* ---- Spacing scale ---- */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.5rem;
  --sp-6: 2rem;
  --sp-7: 3rem;
  --sp-8: 4rem;
  --sp-9: 6rem;

  /* section vertical rhythm */
  --section-y: clamp(3.5rem, 7vw, 6.5rem);

  /* ---- Layout ---- */
  --container: 1240px;
  --container-wide: 1400px;
  --gutter: clamp(1.1rem, 4vw, 2.5rem);

  /* ---- Radii ---- */
  --r-sm:   10px;
  --r:      16px;
  --r-md:   20px;
  --r-lg:   26px;
  --r-xl:   34px;
  --r-2xl:  44px;
  --r-pill: 999px;

  /* ---- Shadows ---- */
  --shadow-xs: 0 2px 8px rgba(190, 138, 138, 0.10);
  --shadow-sm: 0 6px 18px rgba(196, 140, 142, 0.12);
  --shadow:    0 14px 34px rgba(190, 132, 140, 0.16);
  --shadow-lg: 0 26px 60px rgba(170, 118, 132, 0.20);
  --shadow-rose: 0 14px 30px rgba(226, 128, 128, 0.35);
  --shadow-lav: 0 14px 30px rgba(150, 118, 176, 0.30);

  /* ---- Motion ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --dur: 0.35s;
}