/* =========================================================================
   Maurizio Lanini — DESIGN TOKENS  (mirrors the immersive home palette)
   These define custom properties + @font-face ONLY. They have no visual effect
   until consumed by the other layers (header-footer / elementor / woocommerce /
   atmosphere) — so activating the child theme is visually a no-op by itself.
   Palette source: maurizio-immersive/src/styles.css :root + fonts.css.
   ========================================================================= */

/* ---- Self-hosted fonts (GDPR-safe, no third-party requests) -------------- */
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-var.woff2') format('woff2');
  font-weight: 300 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Fraunces';
  src: url('../fonts/fraunces-var-italic.woff2') format('woff2');
  font-weight: 300 600;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'General Sans';
  src: url('../fonts/general-sans-400.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'General Sans';
  src: url('../fonts/general-sans-500.woff2') format('woff2');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'General Sans';
  src: url('../fonts/general-sans-600.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Backgrounds / ink (deep abyssal blue-violet → off-white, the immersive base) */
  --ml-bg: #070611;
  --ml-bg-2: #0b1320;          /* slightly lifted panel bg */
  --ml-bg-3: #11182a;          /* cards / inputs */
  --ml-ink: #f4eefb;           /* primary text on dark */
  --ml-ink-soft: #cabfe0;      /* secondary text */
  --ml-ink-dim: #9b90b8;       /* tertiary / captions */

  /* Brand accent — warm light of the ascent ("dalle profondità alla luce") */
  --ml-gold: #f2b65a;
  --ml-gold-strong: #e7a23c;
  --ml-gold-tint: rgba(242, 182, 90, 0.16);
  --ml-gold-tint-2: rgba(242, 182, 90, 0.32);
  --ml-blu: #78aaff;

  /* Glass / hairlines (premium dark surfaces) */
  --ml-glass: rgba(22, 16, 40, 0.42);
  --ml-glass-strong: rgba(6, 14, 24, 0.66);
  --ml-line: rgba(214, 196, 255, 0.16);
  --ml-line-soft: rgba(255, 255, 255, 0.08);

  /* Typography */
  --ml-font-serif: 'Fraunces', Georgia, 'Times New Roman', serif;
  --ml-font-body: 'General Sans', 'Inter', system-ui, -apple-system, sans-serif;
  --ml-heading-weight: 460;

  /* Shape / motion */
  --ml-radius: 14px;
  --ml-radius-pill: 999px;
  --ml-maxw: 1180px;
  --ml-pad: clamp(20px, 5vw, 72px);
  --ml-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

/* ---- Base typography & links — align the whole site to the immersive voice ----
   (Scoped away from the immersive template, which is fully owned by its build CSS.) */
body:not(.ml-immersive-template) {
  font-family: var(--ml-font-body);
}
body:not(.ml-immersive-template) h1,
body:not(.ml-immersive-template) h2,
body:not(.ml-immersive-template) h3,
body:not(.ml-immersive-template) h4,
body:not(.ml-immersive-template) h5,
body:not(.ml-immersive-template) h6,
body:not(.ml-immersive-template) .entry-title,
body:not(.ml-immersive-template) .product_title,
body:not(.ml-immersive-template) .page-title,
body:not(.ml-immersive-template) .widget-title,
body:not(.ml-immersive-template) .portfolio-title,
body:not(.ml-immersive-template) .section-heading,
body:not(.ml-immersive-template) blockquote {
  font-family: var(--ml-font-serif) !important;
  font-weight: var(--ml-heading-weight);
  letter-spacing: 0.004em;
}
body:not(.ml-immersive-template) a {
  transition: color 0.25s var(--ml-ease);
}
body:not(.ml-immersive-template) a:hover,
body:not(.ml-immersive-template) a:focus-visible {
  color: var(--ml-gold);
}
body:not(.ml-immersive-template) ::selection {
  background: var(--ml-gold-tint-2);
  color: var(--ml-ink);
}