/* ==========================================================================
   CADOPT V3 — THEME TOKENS
   Re-themes the Thumb360 kit's SECTION 1 tokens for a dark-surface,
   engineering-premium identity. Structural kit rules (kit.css) are untouched;
   only variables are overridden here, loaded after kit.css.

   Continuity: brand hue keeps CADOpt's existing blue→cyan logo gradient
   (was #0f4c81→#3ea1d9 on white in V2) but moves it onto dark navy surfaces.
   Departure: adds a scarce amber signal hue (engineering/precision-instrument
   register, distinct from every other navy-on-white PTC reseller site) and
   drops the surface from white to a near-black blueprint navy throughout.
   ========================================================================== */

:root {
  /* --- Brand ramp: blue → cyan, held from the CADOpt mark, restepped for dark surfaces --- */
  --brand-950: #04070D;
  --brand-900: #071224;
  --brand-800: #0B1E3A;
  --brand-700: #103568;   /* old brand primary, kept for continuity */
  --brand-600: #1A4C8C;
  --brand-500: #2E86D8;   /* primary interactive blue */
  --brand-300: #67C3F0;   /* logo's cyan stripe */
  --brand-200: #9ADCF7;
  --brand-100: #CDEEFB;
  --brand-050: #12233F;   /* "tint" role on dark = a subtle brand-dark chip, not pale */

  /* --- Signal hue: precision-instrument amber. One hue, used scarcely. --- */
  --signal-600: #C97A0A;
  --signal-500: #F5A623;
  --signal-100: #2E2210;  /* dark-mode "light" tint = a warm dark chip */

  /* --- Neutrals: blue-tinted, never pure grey/black/white --- */
  --ink-strong: #F4F7FC;   /* headings: near-white, blue-tinted */
  --ink:        #C6D2E3;   /* body text */
  --ink-mute:   #8A97AC;   /* muted/secondary */
  --ink-faint:  #566180;   /* faint/disabled/placeholders */
  --line:       rgba(206, 222, 245, 0.14);
  --line-soft:  rgba(206, 222, 245, 0.08);
  --surface-0:  #0A1220;   /* page base */
  --surface-1:  #0F1B30;   /* cards, alt sections */
  --surface-2:  #162946;   /* elevated / hover */
  --surface-inverse: #060B16; /* footer / CTA-band base — kit components here assume dark + white text */

  /* --- Semantic roles --- */
  --c-text:        var(--ink);
  --c-heading:     var(--ink-strong);
  --c-muted:       var(--ink-mute);
  --c-action:      var(--brand-500);
  --c-action-hover:var(--brand-300);
  --c-accent:      var(--signal-500);
  --c-focus:       var(--brand-300);
  --c-border:      var(--line);
  --c-bg:          var(--surface-0);
  --c-bg-alt:      var(--surface-1);
  --c-bg-inverse:  var(--surface-inverse);

  /* --- Type: Century Gothic heading (CADOpt's existing brand typeface — not on any
     allowed font CDN, so it renders where installed locally and falls back to
     Poppins, its closest free geometric match, everywhere else), Inter body,
     Roboto Slab for specs/labels/kickers in place of the IBM Plex Mono mono stack --- */
  --font-head: "Century Gothic", "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono: "Roboto Slab", Georgia, "Segoe UI", serif;

  /* --- Shape: slightly larger radius, premium-soft --- */
  --radius-sm: 6px;
  --radius:    10px;
  --radius-lg: 18px;

  /* --- Elevation: near-black, not neutral-grey shadows --- */
  --shadow-sm: 0 1px 2px rgba(2, 6, 14, 0.45);
  --shadow-md: 0 12px 32px rgba(2, 6, 14, 0.55);
  --shadow-lg: 0 30px 70px rgba(2, 6, 14, 0.65);

  /* --- CADOpt-only tokens: glow states, not present in the base kit --- */
  --glow-brand:  0 0 0 1px rgba(46, 134, 216, 0.45), 0 0 44px rgba(46, 134, 216, 0.22);
  --glow-accent: 0 0 0 1px rgba(245, 166, 35, 0.5), 0 0 36px rgba(245, 166, 35, 0.22);
  --grid-line:   rgba(103, 195, 240, 0.08);
}

/* On-dark is the default surface now; the kit's .t3-on-dark helper becomes a no-op override */
.t3-on-dark :focus-visible { outline-color: var(--brand-200); }

/* The kit's hero scrim assumes an inverse (dark) hero on a light-page brand hue.
   Re-tint it to the new brand navy so it still reads as CADOpt. */
.t3-slide-media::after {
  background: linear-gradient(100deg, rgba(4,7,13,0.92) 0%, rgba(7,18,36,0.72) 48%, rgba(10,18,32,0.35) 100%);
}

/* Header gets a translucent blur once scrolled, instead of a flat fill */
.t3-header {
  background: rgba(10, 18, 32, 0.72);
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
}
.t3-header[data-scrolled="true"] {
  background: rgba(10, 18, 32, 0.92);
}

/* Mega panel + drawer pick up a hairline glow edge on dark */
.t3-mega, .t3-drawer {
  box-shadow: var(--shadow-lg), 0 0 0 1px rgba(103,195,240,0.06);
}

/* Marquee logos: dark surfaces need a lighter grayscale treatment so logos don't vanish */
.t3-marquee-item { opacity: 0.55; filter: grayscale(1) brightness(1.6) contrast(0.9); }
.t3-marquee:hover .t3-marquee-item { opacity: 0.8; }
.t3-marquee-item:hover { filter: grayscale(0) brightness(1); opacity: 1; }