:root {
  /* Quero1 — Candy Pink (rosa dominante) */
  --brand-pink: #f5b6d4;
  --brand-pink-deep: #e889ab;
  --brand-pink-dark: #c95687;
  --brand-rose: #d4568a;
  --brand-lavender: #e8a4c4;
  --brand-cream: #fffafb;
  --brand-purple: #c95687;
  --brand-blue: #ffd6e8;
  --brand-pink-light: #fde8f2;
  --brand-lavender-light: #fff0f6;
  --brand-plum: var(--brand-rose);
  --brand-plum-dark: #b84872;
  --brand-purple-light: #e889ab;

  /* Candy Pink surfaces */
  --pink-hero: #fce4ef;
  --pink-block: #f5b6d4;
  --pink-blush: #fff0f6;
  --pink-hot: #e878a8;
  --cta-gold: #e8a87c;
  --cta-gold-dark: #d4895a;
  --sparkle: #fff8e7;

  --bg: var(--brand-cream);
  --primary: var(--brand-rose);
  --coral: #f0a8b8;
  --honey: #f5e6d0;
  --mint: #ffd6e8;
  --lavender: var(--brand-lavender);
  --text: #6b3d52;
  --text-soft: #9a6078;
  --white: #fffefc;

  /* Koala — secundário */
  --koala-gray: #b8909e;
  --koala-gray-dark: #9a6078;
  --koala-belly: #fde8f2;
  --koala-ear: var(--brand-rose);
  --koala-blush: var(--brand-pink);
  --koala-guide-bg: linear-gradient(145deg, rgba(253, 232, 242, 0.98), rgba(255, 240, 246, 0.92));

  /* Category accents — tons de rosa */
  --cat-dolls: var(--brand-pink);
  --cat-planners: #f8c4d8;
  --cat-biblical: #f0b8d0;
  --cat-educational: #ffd6e8;
  --cat-stationery: #f5b6d4;
  --cat-custom: #fce0ec;
  --cat-kids: var(--brand-pink);
  --cat-christian: #f0b8d0;

  /* Legacy aliases */
  --rose: var(--brand-pink);
  --peach: #fce8f0;
  --sage: var(--cat-planners);
  --color-text: var(--text);
  --color-muted: var(--text-soft);
  --color-white: var(--white);
  --color-rosa: var(--brand-pink);
  --color-peach: var(--peach);
  --color-sage: var(--cat-planners);
  --color-lavender: var(--brand-lavender);
  --color-mint: var(--cat-planners);
  --color-azul: var(--brand-blue);

  /* Surfaces */
  --surface: rgba(255, 251, 253, 0.92);
  --surface-soft: rgba(255, 245, 249, 0.9);
  --border-soft: rgba(212, 86, 138, 0.16);
  --pattern-brand: url("/assets/icons/pattern-sparkle.svg");
  --gradient-bg: linear-gradient(180deg, #fffbfd 0%, #fff0f6 45%, #fce8f0 100%);
  --gradient-hero: radial-gradient(ellipse 85% 65% at 10% 5%, rgba(245, 182, 212, 0.55), transparent 55%),
    radial-gradient(ellipse 70% 55% at 92% 15%, rgba(232, 137, 171, 0.4), transparent 50%),
    radial-gradient(ellipse 60% 45% at 50% 95%, rgba(255, 214, 232, 0.45), transparent 55%);

  /* Typography */
  --font-display: "DM Serif Display", Georgia, "Times New Roman", serif;
  --font-body: "Nunito", system-ui, -apple-system, sans-serif;
  --font-script: "Sacramento", "Parisienne", cursive;
  --font-accent: "Fredoka", var(--font-body);
  --font: var(--font-body);

  /* Radii */
  --radius-sm: 14px;
  --radius-md: 18px;
  --radius-card: 28px;
  --radius-pill: 999px;

  /* Shadows */
  --shadow-soft: 0 4px 28px rgba(180, 72, 114, 0.08);
  --shadow-hover: 0 18px 52px rgba(180, 72, 114, 0.12);
  --shadow-sm: var(--shadow-soft);
  --shadow-md: var(--shadow-hover);
  --shadow-primary: 0 10px 32px rgba(212, 86, 138, 0.28);
  --shadow-glow-lavender: 0 0 48px rgba(245, 182, 212, 0.45);
  --shadow-glow-pink: var(--shadow-glow-lavender);
  --shadow-gold: 0 8px 28px rgba(232, 168, 124, 0.35);

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-8: 3rem;
  --space-9: 4rem;
  --space-10: 6rem;
  --space-section: clamp(4rem, 10vw, 7rem);

  --space-xs: var(--space-2);
  --space-sm: var(--space-4);
  --space-md: var(--space-5);
  --space-lg: var(--space-7);
  --space-xl: var(--space-9);

  /* Layout */
  --header-h: 5.75rem;
  --header-top-h: 2.25rem;
  --container-max: 76rem;
  --transition-base: 0.45s cubic-bezier(0.25, 0.1, 0.25, 1);
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --transition-base: 0.01ms;
  }
}
