/*
  MVLCO design tokens. Values come from the MVLCO-written views the live nop theme actually renders:
  Themes\Venture\Views\Shared\_Header.cshtml, Shared\Components\Footer\Default.cshtml, Home\Index.cshtml
  and Shared\_ProductBox.cshtml (Stage 2A token audit, 18 Oct 2026). mvlco-homepage.css/.js are NOT
  loaded by any nop view and are not a source. The "brand palette" values marked (unverified) appear in
  none of those views; they style storefront-only pages (cart, checkout, buttons) and are reviewed when
  those pages are rebuilt. No licensed Venture value is used. Components use these variables only.
*/
:root {
  /* Brand palette (analysis F15; unverified against the live views — see header note) */
  --mvlco-primary: #0056D6;
  --mvlco-primary-dark: #003FB3;
  --mvlco-deep-blue: #002B80;
  --mvlco-navy: #0A192F;
  --mvlco-yellow: #FFE600;
  --mvlco-yellow-alt: #FFD600;
  --mvlco-yellow-deep: #F2DA00;
  --mvlco-bg-tint: #F8FAFF;
  --mvlco-text: #0A192F;
  --mvlco-text-muted: #4A5568;
  --mvlco-white: #FFFFFF;

  /* Supporting colours used by the MVLCO sections */
  --mvlco-section-navy: #05215C;       /* the one navy of every dark full-width band (home, course, footer) */
  /* The shared background of those bands: one base colour with faint side glows that fade out before the
     top and bottom edges, so neighbouring bands meet without a visible seam. */
  --mvlco-navy-section:
    radial-gradient(ellipse 40% 45% at 100% 50%, rgba(30, 134, 255, 0.16), transparent 70%),
    radial-gradient(ellipse 40% 45% at 0% 50%, rgba(30, 134, 255, 0.14), transparent 70%),
    var(--mvlco-section-navy);
  --mvlco-banner-blue: #0054A6;        /* trainings card and banner headers */
  --mvlco-banner-blue-dark: #003D8F;
  --mvlco-link-blue: #007BFF;          /* menu hover, quiz, card button */
  --mvlco-card-button-from: #4BA3FF;
  --mvlco-topbar-from: #002D8A;
  --mvlco-topbar-to: #005BE0;
  --mvlco-topbar-accent: #FFEB3B;
  --mvlco-counter-accent: #00E5FF;
  --mvlco-gold: #FFCC00;
  --mvlco-star-gold: #F4C721;
  --mvlco-price-pill: #FF9D00;
  --mvlco-price-old: #FF4D4D;
  --mvlco-live-red: #B30000;
  --mvlco-footer-from: #001B33;
  --mvlco-footer-to: #001022;
  --mvlco-footer-text: #CDD7E3;
  --mvlco-footer-accent: #00AAFF;
  --mvlco-footer-follow: #FFD000;
  --mvlco-social-blue: #1677FF;
  --mvlco-surface-hover: #F5F7FF;
  --mvlco-logo-name: #003399;          /* _Header.cshtml:849 */
  --mvlco-logo-tagline: #555555;       /* _Header.cshtml:861 */
  --mvlco-dropdown-hover: #004AAD;     /* _Header.cshtml:556 */
  --mvlco-card-button-hover-from: #2F92FF;   /* _ProductBox.cshtml:182 */
  --mvlco-card-button-hover-to: #006FEE;
  --mvlco-border: #E6EAF2;

  /* Header (approved clean header design, Oct 2026) */
  --mvlco-header-from: #04205C;
  --mvlco-header-mid: #0A3A9E;
  --mvlco-header-to: #0B47C4;
  --mvlco-header-icon: #5CB2FF;
  --mvlco-header-accent: #1677FF;
  --mvlco-header-accent-dark: #0B47C4;
  --mvlco-header-title: #0B2A6F;
  --mvlco-header-text: #0B1F4D;
  --mvlco-header-line: #E6ECF5;
  --mvlco-header-tint: #EEF4FF;

  /* Status colours chosen for this palette */
  --mvlco-success: #1B7F4B;
  --mvlco-error: #C62828;
  --mvlco-warning: #B26A00;

  /* Typography: the header, homepage, footer and product card use Poppins only
     (_Header.cshtml:378, Index.cshtml:65, Footer\Default.cshtml:4,15, _ProductBox.cshtml:102). */
  --mvlco-font-body: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mvlco-font-heading: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* Shape and rhythm */
  --mvlco-radius-sm: 8px;
  --mvlco-radius: 14px;
  --mvlco-radius-lg: 22px;
  --mvlco-radius-pill: 999px;
  --mvlco-shadow-soft: 0 10px 30px rgba(0, 43, 128, 0.06);
  --mvlco-shadow: 0 15px 35px rgba(0, 0, 0, 0.15);
  --mvlco-shadow-lift: 0 20px 40px rgba(0, 0, 0, 0.12);
  --mvlco-content-max: 1400px;
  --mvlco-gutter: 5%;
  --mvlco-transition: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}

/*
  MVLCO breakpoints: header 1279px (compact), 1199px (tablet landscape), 1023px (hamburger menu),
  767px and 639px (phones); footer 1100px and 576px; plus 1024px, 768px, 480px and (hover: none)
  elsewhere. Media queries use these literal values.
*/
