/* =============================================================================
   AEO Fortin — Design Tokens
   =============================================================================
   Variabile CSS la :root. Modifică doar aici pentru a ajusta sistemul.
   Culorile finale (paleta brand) urmează să fie validate. Valorile actuale
   sunt un punct de plecare premium-neutru.
   ========================================================================== */

:root {

	/* ---------- Container & spacing ---------------------------------------- */
	--container-max:        1560px;
	--container-padding-x:  clamp(1rem, 3vw, 2rem);

	/* Reading column pentru long-form content (articole, glosar). */
	--reading-width:        880px;
	--reading-padding-x:    clamp(1rem, 3vw, 1.5rem);

	/* Spacing scale (multipli de 4px). */
	--space-1:   0.25rem;   /*  4px */
	--space-2:   0.5rem;    /*  8px */
	--space-3:   0.75rem;   /* 12px */
	--space-4:   1rem;      /* 16px */
	--space-5:   1.25rem;   /* 20px */
	--space-6:   1.5rem;    /* 24px */
	--space-8:   2rem;      /* 32px */
	--space-10:  2.5rem;    /* 40px */
	--space-12:  3rem;      /* 48px */
	--space-16:  4rem;      /* 64px */
	--space-20:  5rem;      /* 80px */
	--space-24:  6rem;      /* 96px */

	/* ---------- Typography ------------------------------------------------- */
	/* Fonturile reale (Gilroy) sunt declarate în fonts.css.
	   Stack-ul de fallback rulează curat chiar dacă fișierele Gilroy lipsesc. */
	--font-display: 'Gilroy', -apple-system, BlinkMacSystemFont, 'Segoe UI',
	                 'Helvetica Neue', system-ui, sans-serif;
	--font-body:    'Gilroy', -apple-system, BlinkMacSystemFont, 'Segoe UI',
	                 'Helvetica Neue', system-ui, sans-serif;
	--font-mono:    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas,
	                'Liberation Mono', monospace;

	/* Font weights — mapate la fișierele Gilroy disponibile.
	   Când adăugăm Gilroy Regular/Book, schimbăm --fw-body la 400/450. */
	--fw-light:    300;
	--fw-regular:  400;   /* fallback la 300 în CSS-ul curent dacă Regular nu e încărcat */
	--fw-medium:   500;
	--fw-semibold: 600;
	--fw-bold:     700;

	/* Body font weight implicit — Regular (400).
	   Light (300) NU se folosește pe body long-form, doar pe hero/lead/accent.
	   Stack-ul de fallback system (system-ui, -apple-system) are Regular nativ,
	   deci chiar fără Gilroy Regular disponibil, body-ul rămâne la weight 400. */
	--fw-body:     var(--fw-regular);

	/* Font sizes — generoase pentru lizibilitate cu Gilroy Light pe body. */
	--fs-xs:    0.875rem;   /* 14px */
	--fs-sm:    0.9375rem;  /* 15px */
	--fs-base:  1.0625rem;  /* 17px */
	--fs-md:    1.125rem;   /* 18px */
	--fs-lg:    1.25rem;    /* 20px */
	--fs-xl:    1.5rem;     /* 24px */
	--fs-2xl:   1.875rem;   /* 30px */
	--fs-3xl:   2.25rem;    /* 36px */
	--fs-4xl:   2.75rem;    /* 44px */
	--fs-5xl:   3.5rem;     /* 56px */
	--fs-6xl:   4.5rem;     /* 72px */

	/* Line heights. */
	--lh-tight:   1.15;
	--lh-snug:    1.3;
	--lh-normal:  1.5;
	--lh-relaxed: 1.7;     /* body — compensare pentru Light (300) */
	--lh-loose:   1.85;

	/* Letter spacing — tracking pozitiv minor pentru body Light. */
	--ls-tighter: -0.02em;
	--ls-tight:   -0.01em;
	--ls-normal:  0;
	--ls-body:    0.005em;
	--ls-wide:    0.05em;

	/* ---------- Colors ----------------------------------------------------- */
	/* Paleta v0.3.0 — direcție light + glass + lavender + violet + coral.
	   Tokens-urile cu prefix --color-* păstrează numele pentru compatibilitate
	   cu CSS-ul existent (homepage, legal, footer); valorile au fost rafinate
	   spre noua direcție. Tokens noi cu prefix --aeo-* sunt aditive. */

	/* Surfaces (light, warm off-white + glass). */
	--color-bg:           #FBF9F6;   /* off-white cald, fundal global */
	--color-surface:      #FFFFFF;
	--color-surface-alt:  #F7F2FB;   /* lavender subtle pentru variant alt */
	--color-border:       #ECE3F1;   /* border cu nuanță lavender */
	--color-border-soft:  #F4ECF8;

	/* Text — text negru/cărbune (warmer), nu gri prea slab. */
	--color-text:         #17131D;   /* aproape-negru cu nuanță */
	--color-text-soft:    #3A3142;
	--color-text-muted:   #6F6878;
	--color-text-inverse: #FFFFFF;

	/* Brand — paleta nouă lavender/violet/magenta/coral. */
	--color-primary:    #7B2CFF;     /* violet luminos */
	--color-primary-2:  #D73591;     /* magenta */
	--color-accent:     #FF5F7A;     /* coral */

	/* Gradient brand (folosit cu parcimonie). */
	--gradient-brand: linear-gradient(135deg,
		var(--color-primary)   0%,
		var(--color-primary-2) 52%,
		var(--color-accent)   100%);

	/* States. */
	--color-link:        var(--color-primary);
	--color-link-hover:  var(--color-primary-2);
	--color-focus:       #1E66F5;    /* accesibilitate — distinct de brand */

	/* ---------- v0.3.0 — Aliasuri & extensii palettă -------------------------
	   Tokens semantice noi, mai expressive. Le folosim direct în §31+. */
	--aeo-bg:               var(--color-bg);
	--aeo-surface:          var(--color-surface);
	--aeo-surface-soft:     var(--color-surface-alt);
	--aeo-surface-glass:    rgba(255, 255, 255, 0.72);

	--aeo-text:             var(--color-text);
	--aeo-text-muted:       var(--color-text-muted);
	--aeo-text-soft:        #8A8294;

	--aeo-border:           var(--color-border);
	--aeo-border-strong:    #DCCCE8;

	--aeo-violet:           var(--color-primary);
	--aeo-violet-soft:      #F3EDFF;
	--aeo-lavender:         #B9A7FF;
	--aeo-magenta:          #E3358B;
	--aeo-coral:            var(--color-accent);
	--aeo-rose-soft:        #FFF0F5;

	--aeo-gradient-primary: var(--gradient-brand);
	--aeo-shadow-soft:      0 18px 60px rgba(70, 40, 100, 0.10);
	--aeo-shadow-card:      0 12px 36px rgba(70, 40, 100, 0.08);

	/* ---------- Radii ------------------------------------------------------ */
	--radius-xs:  4px;
	--radius-sm:  6px;
	--radius-md:  10px;
	--radius-lg:  16px;
	--radius-xl:  24px;
	--radius-full: 9999px;

	/* ---------- Shadows ---------------------------------------------------- */
	--shadow-xs: 0 1px 2px rgba(70, 40, 100, 0.04);
	--shadow-sm: 0 2px 8px rgba(70, 40, 100, 0.06);
	--shadow-md: 0 8px 24px rgba(70, 40, 100, 0.08);
	--shadow-lg: 0 18px 60px rgba(70, 40, 100, 0.10);

	/* ---------- Z-index ---------------------------------------------------- */
	--z-base:     1;
	--z-sticky:   100;
	--z-overlay:  500;
	--z-modal:    1000;
	--z-toast:    1500;

	/* ---------- Transitions ------------------------------------------------ */
	--transition-fast:   120ms cubic-bezier(0.4, 0, 0.2, 1);
	--transition-base:   200ms cubic-bezier(0.4, 0, 0.2, 1);
	--transition-slow:   320ms cubic-bezier(0.4, 0, 0.2, 1);
}

/* Respect prefers-reduced-motion. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--transition-fast: 0ms;
		--transition-base: 0ms;
		--transition-slow: 0ms;
	}
}
