/* =========================================================
   Rishita Beauty Lab — design tokens
   Single source of truth for every font, color and radius used on the site.
   Load this file BEFORE style.css.

   To restyle the site, change values HERE — style.css only ever references
   var(--token-name), never a literal brand color or font-family.

   Look: warm ivory canvas + dark-rose accent, Cormorant Garamond headings
   with Jost body text. To move back to the logo's copper/rose-gold, swap
   --rose / --rose-deep / --rose-soft / --blush for the values in the
   comments next to them.
   ========================================================= */

:root {
  /* ---------- Typography ---------- */
  --f-display: "Cormorant Garamond", Georgia, serif;
  --f-body: "Jost", "Poppins", system-ui, sans-serif;

  /* ---------- Accent (rose) ---------- */
  --rose: #c9647f; /* copper option: #ad8069 */
  --rose-deep: #8f2b47; /* copper option: #6b4530 */
  --rose-soft: #d98a9f; /* copper option: #cdb3a2 */
  --blush: #f9d0da; /* copper option: #f1e1d6 */
  --gold: #d9b382; /* champagne — star ratings */
  --rose-rgb: 178, 58, 91; /* used for translucent glows/focus rings */

  /* ---------- Neutrals (warm ivory, no pink tint) ---------- */
  --paper: #fffdf7; /* cards */
  --cream: #faf6ee; /* main background */
  --blush-bg: #f2ede2; /* alternate section background */
  --blush-bg2: #eae2d4; /* placeholder panels */
  --ink: #2a2420; /* primary text */
  --ink-soft: #6a6157;
  --ink-mute: #9e9384;
  --line: rgba(110, 92, 70, 0.16);
  --line-2: rgba(110, 92, 70, 0.25);

  /* ---------- Dark hero / overlays ---------- */
  --night: #1c1418;
  --night-rgb: 28, 20, 24;

  /* ---------- Layout ---------- */
  --maxw: 540px; /* mobile "canvas" width; widened to 100% at >=1024px */
  --pad: 22px;
  --r: 18px;
  --r-lg: 26px;

  /* ---------- Depth ---------- */
  --shadow: 0 24px 60px -26px rgba(90, 70, 50, 0.3);
  --shadow-sm: 0 14px 34px -18px rgba(90, 70, 50, 0.26);
  --glow: 0 14px 34px -12px rgba(var(--rose-rgb), 0.4);

  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  /* ---------- Status ---------- */
  --status-live: #4fae72;
  --status-error: #c0392b;
}
