/* ============================================================
   Librăria de Acasă — Design tokens
   Paletă extrasă din logo: cocoa / teracotă / miere pe hârtie caldă.
   Modifică AICI culorile, tipografia și spațierea — totul se propagă.
   ============================================================ */

:root {
  /* ---- Culori: primare (carte / căsuță / wordmark) ---- */
  --clr-cocoa:       #6e4329;   /* maro castaniu — brand principal */
  --clr-cocoa-deep:  #45291a;   /* maro închis — titluri */
  --clr-cocoa-700:   #573320;   /* maro mediu */

  /* ---- Secundar (cana) ---- */
  --clr-terracotta:  #b05f3c;   /* teracotă caldă — accente, butoane */
  --clr-terracotta-deep: #91482b;

  /* ---- Accent (crenguța / linia de sub wordmark) ---- */
  --clr-honey:       #ce9b5e;   /* miere / auriu */
  --clr-honey-soft:  #e6c79a;
  --clr-honey-glow:  #f3e0bf;

  /* ---- Neutre calde ---- */
  --clr-cream:       #faf4e9;   /* fundal principal (hârtie) */
  --clr-cream-deep:  #f4ead7;   /* fundal alternativ secțiuni */
  --clr-paper:       #fffdf8;   /* carduri / suprafețe ridicate, fundal logo */
  --clr-sand:        #efe3cf;   /* suprafețe secundare, separatoare */
  --clr-ink:         #33241a;   /* text principal */
  --clr-ink-soft:    #6b5544;   /* text secundar / muted */
  --clr-line:        #e3d4bd;   /* borduri fine */

  /* ---- Complementare (aceeași atmosferă) ---- */
  --clr-sage:        #8e9b6e;   /* verde salvie — prospețime (frunze) */
  --clr-sage-deep:   #6f7c52;
  --clr-blush:       #d8a7a0;   /* roz prăfuit — căldură feminină */
  --clr-blush-soft:  #ecd0cb;

  /* ---- Stare ---- */
  --clr-focus:       #b05f3c;
  --clr-whatsapp:    #25d366;
  --clr-whatsapp-deep:#1da851;

  /* ---- Accent per secțiune (folosit pentru eyebrow / linii) ---- */
  --sec-accent: var(--clr-terracotta);

  /* ---- Tipografie ---- */
  --font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --font-body: 'Mulish', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Scală fluidă (clamp: min, preferat-vw, max) */
  --fs-300: clamp(0.82rem, 0.79rem + 0.15vw, 0.9rem);   /* small / eyebrow */
  --fs-400: clamp(1rem, 0.96rem + 0.2vw, 1.1rem);       /* body */
  --fs-500: clamp(1.13rem, 1.05rem + 0.4vw, 1.35rem);   /* lead */
  --fs-600: clamp(1.4rem, 1.2rem + 1vw, 2rem);          /* h3 */
  --fs-700: clamp(1.9rem, 1.5rem + 2vw, 3rem);          /* h2 */
  --fs-800: clamp(2.6rem, 1.9rem + 3.4vw, 4.6rem);      /* h1 */
  --fs-900: clamp(3.2rem, 2.2rem + 5vw, 6.5rem);        /* hero display */

  --lh-tight: 1.05;
  --lh-snug: 1.2;
  --lh-body: 1.65;

  /* ---- Spațiere (ritm 4px) ---- */
  --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;
  --sp-10: 8rem;
  --section-y: clamp(4rem, 3rem + 6vw, 8.5rem);

  /* ---- Layout ---- */
  --maxw: 1240px;
  --maxw-narrow: 760px;
  --gutter: clamp(1.1rem, 0.6rem + 2.4vw, 2.6rem);
  --header-h: 76px;
  --header-h-scrolled: 62px;

  /* ---- Rază ---- */
  --radius-sm: 8px;
  --radius: 18px;
  --radius-lg: 28px;
  --radius-xl: 40px;
  --radius-pill: 999px;

  /* ---- Umbre calde (tentă cocoa, nu negru pur) ---- */
  --shadow-xs: 0 1px 2px rgba(69, 41, 26, 0.08);
  --shadow-soft: 0 8px 24px -10px rgba(69, 41, 26, 0.22);
  --shadow-card: 0 18px 44px -22px rgba(69, 41, 26, 0.34);
  --shadow-lift: 0 28px 60px -28px rgba(69, 41, 26, 0.42);

  /* ---- Mișcare ---- */
  --ease: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 0.18s;
  --t: 0.34s;
  --t-slow: 0.6s;

  /* ---- z-index ---- */
  --z-header: 100;
  --z-menu: 200;
  --z-lightbox: 300;
}
