/* Cancro Core Elements — Design Tokens (single source of truth).
   Loaded before all other CSS on frontend, Elementor preview, and admin.
   Font URLs are relative to THIS file (assets/), so they also resolve from preview/. */

/* ---------- Fonts: Gilroy (display/body) ---------- */
@font-face{font-family:'Gilroy';font-weight:300;font-style:normal;font-display:swap;src:url('fonts/Gilroy-Light.woff2') format('woff2'),url('fonts/Gilroy-Light.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:400;font-style:normal;font-display:swap;src:url('fonts/Gilroy-Regular.woff2') format('woff2'),url('fonts/Gilroy-Regular.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:500;font-style:normal;font-display:swap;src:url('fonts/Gilroy-Medium.woff2') format('woff2'),url('fonts/Gilroy-Medium.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:600;font-style:normal;font-display:swap;src:url('fonts/Gilroy-SemiBold.woff2') format('woff2'),url('fonts/Gilroy-SemiBold.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:700;font-style:normal;font-display:swap;src:url('fonts/Gilroy-Bold.woff2') format('woff2'),url('fonts/Gilroy-Bold.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:800;font-style:normal;font-display:swap;src:url('fonts/Gilroy-ExtraBold.woff2') format('woff2'),url('fonts/Gilroy-ExtraBold.woff') format('woff');}
@font-face{font-family:'Gilroy';font-weight:900;font-style:normal;font-display:swap;src:url('fonts/Gilroy-Black.woff2') format('woff2'),url('fonts/Gilroy-Black.woff') format('woff');}

/* ---------- Fonts: IBM Plex Mono (data) ---------- */
@font-face{font-family:'IBM Plex Mono';font-weight:400;font-style:normal;font-display:swap;src:url('fonts/IBMPlexMono-400.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-weight:500;font-style:normal;font-display:swap;src:url('fonts/IBMPlexMono-500.woff2') format('woff2');}
@font-face{font-family:'IBM Plex Mono';font-weight:600;font-style:normal;font-display:swap;src:url('fonts/IBMPlexMono-600.woff2') format('woff2');}

:root{
  /* Wine */
  --wine-900:#3f0e24; --wine-800:#5a1a32; --wine-700:#8b1d41; --wine-600:#c41e4a; --wine-500:#e84872;
  /* Blush */
  --blush-400:#f299ae; --blush-300:#f7b4c4; --blush-200:#fcd5df; --blush-100:#fde8ec; --blush-50:#fef4f6;
  /* Text */
  --text-primary:#1a0a10; --text-secondary:#5a3d47; --text-muted:#77606a; --text-light:#fef4f6;
  /* Functional */
  --success:#22c55e; --error:#ef4444; --white:#ffffff; --border:#fcd5df;
  /* Back-compat aliases for legacy var names still referenced by widgets */
  --wine-400:var(--wine-500); --wine-100:var(--blush-100); --wine-50:var(--blush-50);
  --wine-200:var(--blush-200); --text-tertiary:var(--text-muted); --status-verified:var(--success);

  /* Fonts */
  --font-display:'Gilroy',Manrope,system-ui,sans-serif;
  --font-body:'Gilroy',Manrope,system-ui,sans-serif;
  --font-mono:'IBM Plex Mono',SFMono-Regular,Consolas,monospace;

  /* Font weights — body baseline is Medium (500) for a substantial, premium read.
     Reserve 400 for large display/secondary only; headings use 700-900. */
  --fw-body:500; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-extrabold:800; --fw-black:900;

  /* Fluid type scale */
  --fs-display-hero:clamp(3rem,6vw + 1rem,5rem);
  --fs-display-lg:clamp(2.25rem,4vw + .5rem,3.5rem);
  --fs-display-md:clamp(1.75rem,2.5vw + .5rem,2.75rem);
  --fs-h1:clamp(1.5rem,2vw + .5rem,2.25rem);
  --fs-h2:clamp(1.25rem,1.2vw + .5rem,1.75rem);
  --fs-h3:clamp(1.125rem,.6vw + .6rem,1.375rem);
  --fs-body-lg:1.125rem; --fs-body:1rem; --fs-body-sm:.875rem; --fs-caption:.8125rem; --fs-overline:.75rem;
  /* Legacy --text-* scale aliases (widgets/styles.css reference these names) */
  --text-display-lg:var(--fs-display-lg); --text-display-md:var(--fs-display-md); --text-h2:var(--fs-h2);

  /* Radius */
  --radius-sm:8px; --radius-md:16px; --radius-lg:24px; --radius-pill:100px; --radius-full:9999px;

  /* Shadow (wine-tinted) */
  --shadow-sm:0 4px 20px rgba(63,14,36,.06);
  --shadow-md:0 10px 30px rgba(63,14,36,.08);
  --shadow-lg:0 30px 60px rgba(63,14,36,.10);
  --shadow-cta:0 8px 24px rgba(196,30,74,.28);

  /* Motion */
  --dur-fast:150ms; --dur-base:250ms; --dur-slow:400ms;
  --ease-out:cubic-bezier(.16,1,.3,1); --ease-standard:cubic-bezier(.4,0,.2,1);

  /* Spacing (8px grid) */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px;
  --space-8:32px; --space-12:48px; --space-16:64px; --space-24:96px;

  /* Z-index */
  --z-base:1; --z-dropdown:10; --z-nav:1000; --z-overlay:1100; --z-modal:1200; --z-toast:1300;

  /* Layout */
  --container-max:1440px; --container-padding:4vw;

  /* Focus ring */
  --focus-ring:0 0 0 2px #fff,0 0 0 4px var(--wine-600);
}

/* ---------- Body weight baseline ---------- */
/* Gilroy body copy reads thin at 400; Medium (500) is the plugin baseline.
   Weight is inherited, so headings/CTAs that set 600-900 still override. */
[class*="cancro"],[class*="immersive"],[class*="science-v2"]{font-weight:var(--fw-body);}

/* ---------- Box-sizing baseline (plugin-owned; themes usually set this globally) ---------- */
[class*="cancro"], [class*="cancro"] *, [class*="cancro"] *::before, [class*="cancro"] *::after,
[class*="immersive"], [class*="immersive"] *,
[class*="science-v2"], [class*="science-v2"] *,
.container, .container *{box-sizing:border-box;}

/* ---------- Data utility: tabular mono ---------- */
.cancro-data,.is-data{font-family:var(--font-mono);font-feature-settings:"tnum" 1;font-variant-numeric:tabular-nums;}

/* ---------- Global a11y: focus-visible (scoped to plugin wrappers) ---------- */
[class*="cancro"] a:focus-visible,[class*="cancro"] button:focus-visible,
[class*="cancro"] input:focus-visible,[class*="cancro"] select:focus-visible,
[class*="cancro"] textarea:focus-visible,[class*="cancro"] [role="button"]:focus-visible,
[class*="cancro"] [tabindex]:focus-visible,
[class*="immersive"] a:focus-visible,[class*="immersive"] button:focus-visible,
[class*="science-v2"] a:focus-visible,[class*="science-v2"] button:focus-visible{
  outline:none;box-shadow:var(--focus-ring);border-radius:var(--radius-sm);
}

/* ---------- Global a11y: reduced motion ---------- */
@media (prefers-reduced-motion: reduce){
  [class*="cancro"] *,[class*="immersive"] *,[class*="science-v2"] *,[class*="cp-"] *,[class*="pdp-"] *{
    animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important;
  }
}
