/*
 * AKASHA.CAT — Design Tokens
 * Sistema de disseny "Santuari de Llum"
 * Paleta aprovada pel Concili · WCAG AA verificat
 * ================================================
 */

:root {
  /* ── COLORS — Fons ── */
  --color-bg-base:        #FBF8F3;   /* Blanc trencat principal */
  --color-bg-alt:         #F0EAE0;   /* Fons secció alternativa */
  --color-bg-sand:        #EDE3D3;   /* Sorra/beix, targetes */
  --color-bg-arena:       #E3D5C0;   /* Arena fosca, vores suaus */

  /* ── COLORS — Text ── */
  --color-text-primary:   #2E2A24;   /* Tinta principal (12.8:1 sobre #FBF8F3) — AAA */
  --color-text-secondary: #5A4D3F;   /* Marró secundari (6.6:1 sobre bg-base) — AA */
  --color-text-muted:     #7E6E5C;   /* Text lleuger, peus, notes */

  /* ── COLORS — Accent/Acció ── */
  --color-gold-action:    #8A6D3B;   /* Daurat per a text/link/CTA (4.6:1) — AA text */
  --color-gold-deco:      #C9A86A;   /* Daurat DECORATIU — NOMÉS ornaments, mai text/info */
  --color-gold-deep:      #A9844E;   /* Daurat fosc, gradients */

  /* ── COLORS — Natura/Vida ── */
  --color-sage:           #9CAF94;   /* Verd sàlvia decoratiu */
  --color-sage-deep:      #7E9A82;   /* Sàlvia fosc */
  --color-blush:          #E9D6D0;   /* Rosa pal molt subtil */
  --color-marine:         #5B6B73;   /* Blau marí grisós */

  /* ── TIPOGRAFIA ── */
  --font-serif:   'Cormorant Garamond', 'Palatino Linotype', 'Book Antiqua', Georgia, serif;
  --font-sans:    'Mulish', 'Gill Sans MT', 'Gill Sans', system-ui, sans-serif;

  /* Escala tipogràfica fluida (clamp) */
  --text-xs:    clamp(0.75rem, 0.7rem + 0.2vw, 0.875rem);
  --text-sm:    clamp(0.875rem, 0.82rem + 0.25vw, 1rem);
  --text-base:  clamp(1rem, 0.94rem + 0.3vw, 1.125rem);
  --text-lg:    clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  --text-xl:    clamp(1.375rem, 1.2rem + 0.8vw, 1.75rem);
  --text-2xl:   clamp(1.75rem, 1.4rem + 1.5vw, 2.5rem);
  --text-3xl:   clamp(2.25rem, 1.6rem + 2.5vw, 3.5rem);
  --text-4xl:   clamp(2.75rem, 1.8rem + 4vw, 5rem);
  --text-hero:  clamp(3rem, 2rem + 5vw, 6rem);

  /* Alçades de línia */
  --leading-tight:  1.2;
  --leading-snug:   1.4;
  --leading-normal: 1.65;
  --leading-loose:  1.8;

  /* Espaiat de lletres */
  --tracking-tight:  -0.02em;
  --tracking-normal:  0;
  --tracking-wide:    0.08em;
  --tracking-wider:   0.15em;
  --tracking-widest:  0.25em;

  /* ── ESPAI / AIRE ── */
  --space-1:    0.25rem;
  --space-2:    0.5rem;
  --space-3:    0.75rem;
  --space-4:    1rem;
  --space-6:    1.5rem;
  --space-8:    2rem;
  --space-12:   3rem;
  --space-16:   4rem;
  --space-20:   5rem;
  --space-24:   6rem;
  --space-section: clamp(5rem, 4rem + 4vw, 7rem);  /* ~90px generós */

  /* ── FORMES ── */
  --radius-sm:  6px;
  --radius-md:  10px;
  --radius-lg:  14px;
  --radius-xl:  20px;
  --radius-full: 9999px;

  /* ── OMBRES molt subtils ── */
  --shadow-xs:  0 1px 3px rgba(46, 42, 36, 0.04);
  --shadow-sm:  0 2px 8px rgba(46, 42, 36, 0.06);
  --shadow-md:  0 4px 16px rgba(46, 42, 36, 0.08);
  --shadow-lg:  0 8px 32px rgba(46, 42, 36, 0.10);
  --shadow-gold: 0 2px 12px rgba(201, 168, 106, 0.15);

  /* ── TRANSICIONS ── */
  --transition-fast:   150ms ease;
  --transition-base:   250ms ease;
  --transition-slow:   400ms ease;
  --transition-reveal: 600ms cubic-bezier(0.16, 1, 0.3, 1);

  /* ── LAYOUT ── */
  --container-sm:  640px;
  --container-md:  768px;
  --container-lg:  1024px;
  --container-xl:  1280px;
  --container-2xl: 1440px;

  /* ── ASSETS PATHS ── */
  --asset-hero-bg:        url('/assets/svg/hero-bg.svg');
  --asset-emblema:        url('/assets/svg/emblema-fenix-lotus.svg');
  --asset-lotus-deco:     url('/assets/svg/lotus-decoratiu.svg');
  --asset-divisor:        url('/assets/svg/divisor-ondulat.svg');
  --asset-lluna:          url('/assets/svg/lluna-estrelles.svg');
  --asset-composicio-mar: url('/assets/svg/composicio-mar.svg');
  --asset-gra:            url('/assets/svg/textura-gra.svg');
}

/* ── UTILITATS BASE ── */

/* Gra de paper aplicat a seccions */
.grain-overlay::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image: var(--asset-gra);
  background-size: 200px 200px;
  opacity: 0.4;
  pointer-events: none;
  border-radius: inherit;
}

/* Reveal-on-scroll — classe base */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition:
    opacity var(--transition-reveal),
    transform var(--transition-reveal);
}
.reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}
@media (prefers-reduced-motion: reduce) {
  .reveal {
    opacity: 1;
    transform: none;
    transition: none;
  }
}

/* Flotació molt lenta per a motius decoratius */
@keyframes float-gentle {
  0%, 100% { transform: translateY(0px); }
  50%       { transform: translateY(-8px); }
}
.float-gentle {
  animation: float-gentle 8s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .float-gentle {
    animation: none;
  }
}

/* Pols suau per a punts d'accent */
@keyframes pulse-gold {
  0%, 100% { opacity: 0.6; }
  50%       { opacity: 1; }
}
.pulse-gold {
  animation: pulse-gold 4s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce) {
  .pulse-gold { animation: none; }
}