/* ==========================================================================
   L'ÉLÉGANCE — THEME / DESIGN TOKENS
   --------------------------------------------------------------------------
   Acesta este SINGURUL fișier care trebuie editat pentru a schimba identitatea
   vizuală a site-ului (culori, fonturi, rotunjimi, umbre, ritm de spațiere).

   Toate celelalte fișiere CSS consumă doar variabilele definite aici.
   Ghid complet: /docs/personalizare.md
   ========================================================================== */

:root {
  /* ---------------------------------------------------------------- CULORI */
  /* Neutre calde — baza „ivory” a întregului site */
  --c-bg:            #FBF8F5;   /* fundal principal */
  --c-bg-alt:        #F5EDE8;   /* fundal secțiuni alternate */
  --c-surface:       #FFFFFF;   /* carduri */
  --c-ink:           #1B1614;   /* text titluri */
  --c-ink-soft:      #3D3532;   /* text curent */
  --c-muted:         #6E625C;   /* text secundar (contrast AA pe --c-bg) */
  --c-line:          #EBE1DA;   /* linii, borduri fine */

  /* Brand — rose clay (folosit pe butoane, accente, linkuri) */
  --c-brand:         #A96257;
  --c-brand-dark:    #8C4C43;
  --c-brand-soft:    #C6887A;   /* decorativ, gradiente, iconițe */
  --c-brand-tint:    #F7EAE6;   /* fundaluri pastelate */
  --c-gold:          #C6A15B;   /* accent metalic, rating, detalii */

  /* Secțiuni închise + stări */
  --c-dark:          #171210;
  --c-dark-2:        #241C19;
  --c-on-dark:       #F6EFEA;
  --c-on-dark-muted: #B9A9A1;
  --c-success:       #3F7A56;
  --c-warning:       #B4761F;
  --c-error:         #B3403A;
  --c-whatsapp:      #25D366;
  --c-whatsapp-dark: #1DA851;

  /* ---------------------------------------------------------------- FONTURI */
  --f-display: "Playfair Display", "Cormorant Garamond", Georgia, serif;
  --f-body:    "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --f-script:  "Italianno", "Segoe Script", cursive;

  /* Scară tipografică fluidă (nu necesită media queries) */
  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: clamp(0.975rem, 0.94rem + 0.18vw, 1.0625rem);
  --fs-lg:   clamp(1.0625rem, 1rem + 0.32vw, 1.25rem);
  --fs-xl:   clamp(1.25rem, 1.15rem + 0.5vw, 1.5rem);
  --fs-h4:   clamp(1.35rem, 1.2rem + 0.7vw, 1.75rem);
  --fs-h3:   clamp(1.6rem, 1.35rem + 1.1vw, 2.25rem);
  --fs-h2:   clamp(2rem, 1.5rem + 2.4vw, 3.4rem);
  --fs-h1:   clamp(2.5rem, 1.6rem + 4.4vw, 5.25rem);
  --fs-mega: clamp(3.5rem, 2rem + 7vw, 7.5rem);

  --lh-tight: 1.06;
  --lh-snug:  1.22;
  --lh-body:  1.7;
  --ls-wide:  0.22em;   /* tracking pentru eyebrow-uri uppercase */

  /* --------------------------------------------------------------- SPATIU */
  --container:      1200px;
  --container-wide: 1400px;
  --container-narrow: 760px;
  --gutter: clamp(1.15rem, 4vw, 2.5rem);

  --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;

  /* Spațierea verticală a secțiunilor.
     Compactă intenționat: pagina trebuie să curgă, fără zone goale mari,
     mai ales pe telefon. Crește valorile dacă vrei un ritm mai aerisit. */
  --section-y:    clamp(3.25rem, 2.15rem + 4.4vw, 6.25rem);
  --section-y-sm: clamp(2.25rem, 1.75rem + 2.4vw, 3.5rem);

  /* ------------------------------------------------------------- FORMĂ */
  --r-xs:   0.5rem;
  --r-sm:   0.75rem;
  --r-md:   1.25rem;
  --r-lg:   2rem;
  --r-xl:   2.75rem;
  --r-pill: 999px;
  --r-circle: 50%;

  /* -------------------------------------------------------------- UMBRE */
  /* Umbre calde (nu gri) ca să rămână în paleta site-ului */
  --shadow-xs: 0 1px 2px rgba(50, 30, 22, 0.05);
  --shadow-sm: 0 4px 14px -6px rgba(50, 30, 22, 0.14);
  --shadow-md: 0 18px 40px -22px rgba(50, 30, 22, 0.28);
  --shadow-lg: 0 40px 80px -40px rgba(50, 30, 22, 0.38);
  --shadow-brand: 0 18px 38px -16px rgba(169, 98, 87, 0.55);

  /* ------------------------------------------------------------ MISCARE */
  --d-fast:  180ms;
  --d-base:  320ms;
  --d-slow:  600ms;
  --d-reveal: 900ms;

  --e-out:    cubic-bezier(0.22, 1, 0.36, 1);       /* expo-out, „premium” */
  --e-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --e-spring: cubic-bezier(0.34, 1.56, 0.64, 1);    /* bounce subtil */
  --e-soft:   cubic-bezier(0.4, 0.14, 0.3, 1);

  /* ------------------------------------------------------------- STRATURI */
  --z-below:   -1;
  --z-base:     1;
  --z-sticky:   50;
  --z-header:  100;
  --z-drawer:  200;
  --z-overlay: 300;
  --z-modal:   400;
  --z-float:   500;
  --z-toast:   600;
  --z-cursor:  700;

  /* Înălțimea header-ului — folosită de scroll-spy și de ancorare */
  --header-h: 76px;
}

/* Header mai compact pe mobil */
@media (max-width: 768px) {
  :root { --header-h: 64px; }
}

/* --------------------------------------------------------------------------
   Toate animațiile sunt dezactivate când utilizatorul cere mai puțină mișcare.
   Componentele din styles.css citesc aceste variabile, deci e suficient
   să le punem la zero într-un singur loc.
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  :root {
    --d-fast: 1ms;
    --d-base: 1ms;
    --d-slow: 1ms;
    --d-reveal: 1ms;
  }
}
