.elementor-21421 .elementor-element.elementor-element-4ac43b13 > .elementor-element-populated{margin:0px 0px 0px 0px;--e-column-margin-right:0px;--e-column-margin-left:0px;padding:0px 0px 0px 0px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-21421 .elementor-element.elementor-element-4ac43b13{width:100%;}}/* Start custom CSS for html, class: .elementor-element-1ca22b29 *//* Ticker container */
.elementor-21421 .elementor-element.elementor-element-1ca22b29 .news-ticker-horizontal {
  position: relative;
  overflow: hidden;
background: linear-gradient(90deg, #111827, #1e3a8a, #111827);
  height: 60px;
  display: flex;
  align-items: center;
}

/* Scrolling track */
.elementor-21421 .elementor-element.elementor-element-1ca22b29 .ticker-track {
  display: inline-block;
  white-space: nowrap;
  animation: ticker-scroll 90deg0s linear infinite; /* Slower speed, still starts immediately */
}

/* Ticker items */
.elementor-21421 .elementor-element.elementor-element-1ca22b29 .ticker-track span {
  display: inline-block;
  padding: 0 30px; /* More space between items */
  font-size: 24px;
  font-weight: 700;
   color: #e0f2fe; /* light blue text */
  text-shadow: 0 0 6px #0ea5e9;
}

/* Animation: continuous right-to-left scroll */
@keyframes ticker-scroll {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}

/* Extend ticker for seamless loop */
.news-ticker {
  width: 100%;
  overflow: hidden;
  background: linear-gradient(90deg, #111827, #1e3a8a, #111827);
}

.ticker-row {
  display: flex;
  width: max-content;
  will-change: transform;
  animation: ticker-marquee 40s linear infinite;
}

.ticker-track {
  display: inline-flex;
  align-items: center;
  gap: 32px;   /* tighten spacing */
  padding-right: 32px;
  white-space: nowrap;
}

.ticker-track span {
  font-size: 20px;
  font-weight: 700;
  color: #e0f2fe;
  text-shadow: 0 0 6px #0ea5e9;
}

@keyframes ticker-marquee {
  0%   { transform: translate3d(0, 0, 0); }
  100% { transform: translate3d(-50%, 0, 0); }
}/* End custom CSS */
/* Start custom CSS */@import url('https://fonts.googleapis.com/css2?family=Lato:wght@700;800;900&display=swap');

/* =========================================================
   VGN DESIGN SYSTEM v2.3 (MASTER)
   - One source of truth for: Cards, Buttons, Pricing, Lists, Swatches, Orbit, Pillars
   - Removes conflicts by making: ONE shimmer, ONE pulse
   - Includes: Adjustable knobs (speed + intensity)
   ========================================================= */

/* ---------------------------------------------------------
   0) TOKENS + GLOBAL KNOBS
   Adjust these first.
   --------------------------------------------------------- */
:root{
  --vgn-ink:#020617;
  --vgn-ink-2:#0b1220;
  --vgn-white:#f8fafc;
  --vgn-soft:#e0f2fe;
  --vgn-gray:#94a3b8;

  --vgn-border:rgba(56,189,248,.22);
  --vgn-shadow:rgba(15,23,42,.78);

  --vgn-radius-lg:22px;
  --vgn-radius-md:14px;
  --vgn-radius-sm:12px;

  /* Global glow flavor (fallback when no colorway) */
  --vgn-glow-a:rgba(56,189,248,.35);
  --vgn-glow-b:rgba(168,85,247,.25);

  /* ---------------------------
     FX KNOBS (YOUR ADJUSTMENTS)
     ---------------------------
     Pulse speed: increase = slower
     Shimmer speed: increase = slower
     Shimmer peak opacity: higher = more visible
     --------------------------- */
  --vgn-pulse-speed: 3.6s;      /* was ~1.8s -> HALF SPEED (slower) */
  --vgn-pulse-scale: 1.05;      /* pulse size expansion */
  --vgn-pulse-boost: 1.10;      /* brightness/saturation peak */

  --vgn-shimmer-speed: 6.5s;    /* shimmer cycle duration */
  --vgn-shimmer-width: 60%;     /* wider = more visible */
  --vgn-shimmer-peak: .40;      /* peak opacity during pass (0.25-0.55 range) */
  --vgn-shimmer-center: .38;    /* center highlight intensity (0.22-0.55 range) */
}

/* box sizing */
.vgn-card, .vgn-card *{ box-sizing:border-box; }
.vgn-card{ font-family:'Lato',sans-serif; }

/* ---------------------------------------------------------
   1) COLORWAYS (FOUNDATION)
   Apply: class="vgn-cw vgn-cw--NAME"
   --------------------------------------------------------- */
.vgn-cw{
  --cw-a:#06B6D4;
  --cw-b:#7C3AED;
  --cw-glow-a:rgba(6,182,212,.55);
  --cw-glow-b:rgba(124,58,237,.45);
}

/* Alias for your HTML: vgn-cw--afterschool */
.vgn-cw--afterschool{
  --cw-a:#38BDF8;
  --cw-b:#A855F7;
  --cw-glow-a:rgba(56,189,248,.50);
  --cw-glow-b:rgba(168,85,247,.40);
}
/* Alias for vgn-cw--inperson (if used anywhere) */
.vgn-cw--inperson{
  --cw-a:#FBBF24;
  --cw-b:#22C55E;
  --cw-glow-a:rgba(251,191,36,.26);
  --cw-glow-b:rgba(34,197,94,.26);
}

/* ---------------------------------------------------------
   2) CARD SHELL
   --------------------------------------------------------- */
.vgn-card{
  margin:24px 0 32px;
  position:relative;
}

.vgn-card-inner{
  max-width:1100px;
  margin:0 auto;
  border-radius:var(--vgn-radius-lg);
  border:1px solid var(--vgn-border);
  padding:32px 24px 26px;
  color:var(--vgn-soft);
  text-align:left;
  position:relative;
  overflow:hidden;

  background:
    radial-gradient(circle at 0% 0%, rgba(56,189,248,.16) 0, transparent 55%),
    radial-gradient(circle at 100% 0%, rgba(168,85,247,.14) 0, transparent 60%),
    linear-gradient(135deg, rgba(2,6,23,.98), rgba(2,6,23,.98));

  box-shadow:
    0 0 26px rgba(56,189,248,.24),
    0 0 48px rgba(109,40,217,.18);
}

.vgn-card-content{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  position:relative;
  z-index:1;
}

.vgn-card.vgn-card--tight .vgn-card-inner{ padding:24px 18px 20px; }
.vgn-card.vgn-card--wide  .vgn-card-inner{ max-width:1240px; }

/* Ambient Orb */
.vgn-card-orb{
  position:absolute;
  right:-220px;
  bottom:-220px;
  width:420px;
  height:420px;
  border-radius:50%;
  background:radial-gradient(circle at 40% 40%, rgba(56,189,248,.18) 0%, transparent 70%);
  opacity:.24;
  filter:blur(60px);
  pointer-events:none;
  z-index:0;
}

/* Subtle card sheen (slow, calm) */
.vgn-card-inner::before{
  content:"";
  position:absolute;
  inset:-40px;
  background:conic-gradient(
    from 210deg,
    transparent 0 18%,
    rgba(56,189,248,.26) 24%,
    rgba(168,85,247,.18) 30%,
    transparent 62%
  );
  filter:blur(22px);
  opacity:.32;
  pointer-events:none;
  animation:vgn-card-sheen 16s linear infinite; /* slowed */
  z-index:0;
}
@keyframes vgn-card-sheen{ to{ transform:rotate(1turn); } }

/* Card-wide colorway tint */
.vgn-card.vgn-cw .vgn-card-inner{
  border-color: rgba(255,255,255,.08);
  box-shadow:
    0 0 28px color-mix(in srgb, var(--cw-a) 22%, transparent),
    0 0 52px color-mix(in srgb, var(--cw-b) 14%, transparent);

  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--cw-a) 18%, transparent) 0, transparent 55%),
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--cw-b) 14%, transparent) 0, transparent 60%),
    linear-gradient(135deg, rgba(2,6,23,.98), rgba(2,6,23,.98));
}
.vgn-card.vgn-cw .vgn-card-orb{
  background:radial-gradient(circle at 40% 40%, color-mix(in srgb, var(--cw-a) 18%, transparent) 0%, transparent 70%);
}

/* ---------------------------------------------------------
   3) PILLS / EYEBROWS
   --------------------------------------------------------- */
.vgn-card-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:7px 12px;
  border-radius:999px;
  font-size:13px;
  font-weight:900;
  letter-spacing:.3px;
  color:#fff;

  background:linear-gradient(90deg,#0b1220,#1e3a8a,#0b1220);
  border:1px solid rgba(56,189,248,.55);
  box-shadow:0 0 12px rgba(56,189,248,.26) inset;
  text-shadow:0 0 10px rgba(56,189,248,.35);
}
.vgn-card-pill.is-center{ margin-left:auto; margin-right:auto; }
.vgn-card-pill.is-right{ margin-left:auto; }

.vgn-card-pill.vgn-cw{
  background:linear-gradient(
    90deg,
    #0b1220,
    color-mix(in srgb, var(--cw-a) 62%, #1e3a8a 38%),
    #0b1220
  );
  border-color: color-mix(in srgb, var(--cw-a) 65%, rgba(56,189,248,.40));
  box-shadow:0 0 16px color-mix(in srgb, var(--cw-a) 25%, transparent) inset;
  text-shadow:0 0 12px color-mix(in srgb, var(--cw-a) 35%, transparent);
}
.vgn-emoji{ text-shadow:0 0 10px rgba(56,189,248,.35); }

/* ---------------------------------------------------------
   4) HEADINGS + TEXT
   --------------------------------------------------------- */
.vgn-card h3{
  margin:0;
  font-size:24px;
  line-height:1.2;
  font-weight:900;
  color:#7dd3fc;
  text-shadow:0 0 12px rgba(56,189,248,.40);
}
.vgn-card.vgn-cw h3{
  color: color-mix(in srgb, var(--cw-a) 70%, #7dd3fc 30%);
  text-shadow:0 0 14px color-mix(in srgb, var(--cw-a) 30%, transparent);
}
.vgn-sub{
  margin:2px 0 6px;
  font-size:16px;
  font-weight:800;
  color:var(--vgn-white);
  opacity:.95;
  max-width:760px;
}
.vgn-card.vgn-cw .vgn-sub{
  color: color-mix(in srgb, var(--vgn-white) 90%, var(--cw-a) 10%);
}
.vgn-body{
  font-size:14px;
  font-weight:800;
  color:var(--vgn-white);
  opacity:.92;
}

/* ---------------------------------------------------------
   5) DIVIDER
   --------------------------------------------------------- */
.vgn-divider{
  display:block;
  width:100%;
  height:2px;
  margin:8px 0 10px;
  background:linear-gradient(90deg, rgba(15,23,42,0), rgba(56,189,248,.85), rgba(15,23,42,0));
  box-shadow:0 0 12px rgba(56,189,248,.18);
}
.vgn-card.vgn-cw .vgn-divider{
  background:linear-gradient(90deg, rgba(15,23,42,0), color-mix(in srgb, var(--cw-a) 90%, rgba(56,189,248,.85) 10%), rgba(15,23,42,0));
  box-shadow:0 0 14px color-mix(in srgb, var(--cw-a) 22%, transparent);
}

/* ---------------------------------------------------------
   6) LISTS
   --------------------------------------------------------- */
.vgn-list{
  display:grid;
  gap:6px;
  margin:4px 0 10px;
  font-size:14px;
  font-weight:800;
  color:var(--vgn-white);
  opacity:.94;
}
.vgn-bullet{
  display:flex;
  align-items:flex-start;
  gap:10px;
  position:relative;
  padding-left:14px;
}
.vgn-bullet::before{
  content:"";
  width:7px;
  height:7px;
  border-radius:999px;
  position:absolute;
  left:0;
  top:.55em;
  background:rgba(56,189,248,.95);
  box-shadow:0 0 10px rgba(56,189,248,.55), 0 0 18px rgba(124,58,237,.30);
}
.vgn-card.vgn-cw .vgn-bullet::before{
  background: color-mix(in srgb, var(--cw-a) 85%, #ffffff 15%);
  box-shadow:
    0 0 10px color-mix(in srgb, var(--cw-a) 45%, transparent),
    0 0 18px color-mix(in srgb, var(--cw-b) 25%, transparent);
}

/* Icon list */
.vgn-list--icons .vgn-bullet{ padding-left:0; }
.vgn-list--icons .vgn-bullet::before{ display:none; }
.vgn-bullet-icon{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:28px;
  height:28px;
  border-radius:10px;
  margin-top:1px;
  background:rgba(15,23,42,.65);
  border:1px solid rgba(148,163,184,.35);
  box-shadow:0 0 12px rgba(15,23,42,.75);
  text-shadow:0 0 10px rgba(56,189,248,.45);
}
.vgn-bullet-icon.vgn-cw{
  background:linear-gradient(135deg,
    color-mix(in srgb, var(--cw-a) 20%, rgba(15,23,42,.74)),
    color-mix(in srgb, var(--cw-b) 16%, rgba(15,23,42,.74))
  );
  border-color:color-mix(in srgb, var(--cw-a) 45%, rgba(148,163,184,.35));
  box-shadow:0 0 12px color-mix(in srgb, var(--cw-a) 22%, transparent);
}

/* Tier list */
.vgn-list--tiers .vgn-bullet{ padding-left:0; align-items:center; }
.vgn-list--tiers .vgn-bullet::before{ display:none; }
.vgn-tier-pill{
  display:inline-flex;
  align-items:center;
  padding:4px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  color:#fff;
  white-space:nowrap;
  border:1px solid rgba(56,189,248,.45);
  background:linear-gradient(90deg,#06b6d4,#7c3aed);
  box-shadow:0 0 10px rgba(56,189,248,.20) inset;
}
.vgn-tier-pill.vgn-cw{
  background:linear-gradient(90deg,var(--cw-a),var(--cw-b));
  border-color:color-mix(in srgb, var(--cw-a) 65%, rgba(56,189,248,.35));
  box-shadow:0 0 10px color-mix(in srgb, var(--cw-a) 22%, transparent) inset;
}

/* Normal UL/OL */
.vgn-ul, .vgn-ol{
  margin:6px 0 12px;
  padding-left:20px;
  color:var(--vgn-white);
  font-size:14px;
  font-weight:800;
  opacity:.94;
}
.vgn-ul li, .vgn-ol li{ margin:6px 0; }
.vgn-ul li::marker{
  color:rgba(56,189,248,.95);
  text-shadow:0 0 12px rgba(56,189,248,.45);
}
.vgn-card.vgn-cw .vgn-ul li::marker{
  color: color-mix(in srgb, var(--cw-a) 90%, #ffffff 10%);
}

/* ---------------------------------------------------------
   7) PRICE / SESSION BOXES
   --------------------------------------------------------- */
.vgn-price{
  width:100%;
  border-radius:var(--vgn-radius-sm);
  padding:14px 16px;
  margin:10px 0;
  position:relative;
  background:rgba(148,163,184,.14);
  border:1px solid rgba(148,163,184,.50);
  box-shadow:0 0 18px rgba(15,23,42,.70);
}
.vgn-price.vgn-price--tight{ padding:12px 14px; margin:8px 0; }

.vgn-price .line{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:12px;
  font-weight:800;
  color:var(--vgn-white);
}
.vgn-price .left{ flex:1; min-width:0; align-self:flex-start; }
.vgn-price .right{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:2px;
  flex:0 0 auto;
  align-self:flex-start;
}
.vgn-price .plan{ font-size:18px; font-weight:900; color:#fff; }
.vgn-price .subline{ margin-top:2px; font-size:13px; font-weight:700; color:#e5e7eb; opacity:.92; }
.vgn-price .amount{ font-size:20px; font-weight:900; color:var(--vgn-soft); text-shadow:0 0 10px rgba(56,189,248,.35); white-space:nowrap; }
.vgn-price .save{ font-size:12px; font-weight:900; color:#4ade80; opacity:.95; white-space:nowrap; }
.vgn-price .note{ margin-top:6px; font-size:13px; font-weight:700; opacity:.92; color:#e5e7eb; }

.vgn-tag{
  position:absolute;
  top:-10px;
  right:12px;
  font-size:11px;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
  color:#fff;
  letter-spacing:.3px;
  background:linear-gradient(90deg,#06b6d4,#7c3aed);
  box-shadow:0 0 10px rgba(14,165,233,.5);
}
.vgn-tag.vgn-cw{
  background:linear-gradient(90deg,var(--cw-a),var(--cw-b));
  box-shadow:0 0 12px var(--cw-glow-a);
}

.vgn-price.vgn-cw{
  background:linear-gradient(
    135deg,
    color-mix(in srgb, var(--cw-a) 26%, rgba(148,163,184,.14)),
    color-mix(in srgb, var(--cw-b) 20%, rgba(148,163,184,.14))
  );
  border-color:color-mix(in srgb, var(--cw-a) 42%, rgba(148,163,184,.50));
}

.vgn-price.vgn-price-link{
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}
.vgn-price.vgn-price-link > a{
  text-decoration:none;
  color:inherit;
  display:block;
}
.vgn-price.vgn-price-link:hover,
.vgn-price.vgn-price-link:focus-within{
  transform:translateY(-2px);
  border-color:rgba(56,189,248,.82);
  box-shadow:0 0 22px rgba(56,189,248,.18), 0 0 28px rgba(124,58,237,.14);
  filter:saturate(1.05);
}
.vgn-price.vgn-price-link.vgn-cw:hover,
.vgn-price.vgn-price-link.vgn-cw:focus-within{
  border-color:color-mix(in srgb, var(--cw-a) 70%, rgba(56,189,248,.82));
  box-shadow:
    0 0 22px color-mix(in srgb, var(--cw-a) 28%, transparent),
    0 0 28px color-mix(in srgb, var(--cw-b) 18%, transparent);
}

/* ---------------------------------------------------------
   8) BUTTONS + CTA ROWS
   --------------------------------------------------------- */
.vgn-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  padding:10px 18px;
  border-radius:999px;
  font-size:15px;
  font-weight:900;
  letter-spacing:.3px;
  text-decoration:none;
  color:var(--vgn-soft);

  background:linear-gradient(90deg,#06b6d4,#7c3aed);
  border:1px solid rgba(56,189,248,.7);
  box-shadow:0 0 14px rgba(56,189,248,.55), 0 0 24px rgba(124,58,237,.45);
  text-shadow:0 0 8px rgba(15,23,42,.92);

  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease;
  white-space:nowrap;
  min-width:200px;
  min-height:44px;

  position:relative; /* required for shimmer/pulse */
  isolation:isolate; /* Elementor stacking sanity */
  overflow:hidden;   /* required for shimmer */
}
.vgn-btn:hover,
.vgn-btn:focus-visible{
  transform:translateY(-1px) scale(1.02);
  filter:saturate(1.08) brightness(1.03);
  box-shadow:0 0 18px rgba(56,189,248,.90), 0 0 30px rgba(124,58,237,.78);
}

/* Sizes */
.vgn-btn.vgn-btn-sm{ padding:8px 14px; font-size:13px; min-width:160px; min-height:40px; }
.vgn-btn.vgn-btn-lg{ padding:12px 22px; font-size:16px; min-width:240px; min-height:48px; }
.vgn-btn.vgn-btn-full{ width:100%; max-width:520px; }

/* Secondary */
.vgn-btn.vgn-btn-secondary{
  background:transparent;
  border-color:rgba(148,163,184,.78);
  box-shadow:0 0 10px rgba(15,23,42,.9);
  color:#e5e7eb;
}
.vgn-btn.vgn-btn-secondary:hover,
.vgn-btn.vgn-btn-secondary:focus-visible{
  border-color:rgba(56,189,248,.78);
  box-shadow:0 0 14px rgba(56,189,248,.55);
}

/* Colorways on button */
.vgn-btn.vgn-cw{
  background:linear-gradient(90deg,var(--cw-a),var(--cw-b));
  box-shadow:0 0 16px var(--cw-glow-a), 0 0 28px var(--cw-glow-b);
  border-color:color-mix(in srgb, var(--cw-a) 65%, rgba(56,189,248,.45));
}

/* CTA rows */
.vgn-cta{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
  width:100%;
  justify-content:center;
  align-items:flex-start;
}
.vgn-cta.vgn-cta--left{ justify-content:flex-start; }
.vgn-cta.vgn-cta--full .vgn-btn{ width:100%; max-width:520px; }
.vgn-cta.vgn-cta--two .vgn-btn{ flex:1 1 240px; min-width:240px; }
.vgn-cta.vgn-cta--three .vgn-btn{ flex:1 1 200px; min-width:200px; }
.vgn-cta.vgn-cta--four .vgn-btn{ flex:1 1 180px; min-width:180px; }

/* ---------------------------------------------------------
   9) FX: PULSE (SLOWED) + SHIMMER (VISIBLE, SINGLE SOURCE)
   --------------------------------------------------------- */

/* PULSE (slow breathing glow) */
.vgn-btn.vgn-btn-pulse{
  animation:vgn-pulse-glow var(--vgn-pulse-speed) ease-in-out infinite;
  will-change:filter, box-shadow, transform;
}

/* If button has a colorway, we pulse using cw glows */
.vgn-btn.vgn-cw.vgn-btn-pulse{
  animation:vgn-pulse-glow-cw var(--vgn-pulse-speed) ease-in-out infinite;
}

/* Adjust intensity here:
   - change --vgn-pulse-scale and --vgn-pulse-boost in :root
*/
@keyframes vgn-pulse-glow{
  0%,100%{
    transform:scale(1);
    filter:saturate(1.02) brightness(1.00);
    box-shadow:
      0 0 14px rgba(56,189,248,.50),
      0 0 26px rgba(124,58,237,.34);
  }
  50%{
    transform:scale(var(--vgn-pulse-scale));
    filter:saturate(var(--vgn-pulse-boost)) brightness(1.05);
    box-shadow:
      0 0 22px rgba(56,189,248,.80),
      0 0 44px rgba(124,58,237,.55);
  }
}

@keyframes vgn-pulse-glow-cw{
  0%,100%{
    transform:scale(1);
    filter:saturate(1.02) brightness(1.00);
    box-shadow:
      0 0 16px var(--cw-glow-a),
      0 0 28px var(--cw-glow-b);
  }
  50%{
    transform:scale(var(--vgn-pulse-scale));
    filter:saturate(var(--vgn-pulse-boost)) brightness(1.05);
    box-shadow:
      0 0 26px var(--cw-glow-a),
      0 0 52px var(--cw-glow-b);
  }
}

/* SHIMMER (single pass, visible)
   If you want MORE shimmer:
   - increase --vgn-shimmer-center and --vgn-shimmer-peak
   If you want FASTER shimmer:
   - decrease --vgn-shimmer-speed
*/
.vgn-btn.vgn-btn-shimmer::before{
  content:"";
  position:absolute;
  top:-80%;
  left:-120%;
  width:var(--vgn-shimmer-width);
  height:300%;
  transform:rotate(22deg);
  pointer-events:none;
  z-index:1; /* above button fill */

  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,.10) 35%,
    rgba(255,255,255,var(--vgn-shimmer-center)) 50%,
    rgba(255,255,255,.10) 65%,
    transparent 100%
  );

  opacity:0;
  animation:vgn-shimmer-slow var(--vgn-shimmer-speed) ease-in-out infinite;
}

/* NOTE: We intentionally do NOT use mix-blend-mode here.
   It can mute shimmer on gradients in some browsers/Elementor contexts.
*/
@keyframes vgn-shimmer-slow{
  0%   { left:-120%; opacity:0; }
  12%  { opacity:var(--vgn-shimmer-peak); }
  55%  { opacity:calc(var(--vgn-shimmer-peak) * .45); }
  100% { left:180%; opacity:0; }
}

/* OPTIONAL DEBUG (uncomment to verify shimmer is truly running)
.vgn-btn.vgn-btn-shimmer::before{
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.35) 40%, rgba(255,255,255,.85) 50%, rgba(255,255,255,.35) 60%, transparent 100%);
  opacity:.9;
}
*/

/* ---------------------------------------------------------
   10) TRUST / BADGES / CALLOUT
   --------------------------------------------------------- */
.vgn-trust{
  font-size:12px;
  font-weight:800;
  opacity:.90;
  margin-top:10px;
  color:#cbd5f5;
}
.vgn-trust.vgn-trust--strong{ opacity:1; color:var(--vgn-soft); }

.vgn-card-badges{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:10px;
  margin-top:12px;
  width:100%;
  font-size:11px;
  opacity:.98;
}
.vgn-card-badge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:5px 10px;
  border-radius:999px;
  background:linear-gradient(90deg,#0b1220,#1e3a8a,#0b1220);
  border:1px solid rgba(56,189,248,.45);
  box-shadow:0 0 10px rgba(56,189,248,.16) inset, 0 0 10px rgba(15,23,42,.9);
  color:#fff;
  font-weight:900;
}

.vgn-callout{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:var(--vgn-radius-md);
  background:rgba(15,23,42,.52);
  border:1px solid rgba(56,189,248,.26);
  box-shadow:0 0 16px rgba(15,23,42,.75);
}
.vgn-callout-text{
  font-size:13px;
  font-weight:900;
  color:var(--vgn-white);
  opacity:.96;
}

/* ---------------------------------------------------------
   11) CARD STRIP (2 COL) + ALIGNMENT FIXES
   --------------------------------------------------------- */
.vgn-card.vgn-card-strip{ margin:14px 0; }
.vgn-card.vgn-card-strip .vgn-card-inner{ padding:18px 18px; }

.vgn-card-strip-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:stretch;
  position:relative;
  z-index:1;
}
.vgn-card-strip-left{
  display:flex;
  flex-direction:column;
  gap:6px;
  justify-content:flex-start;
  align-items:flex-start;
}
.vgn-card-strip-right{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
}
.vgn-card-strip-right.is-top{ align-items:flex-start; }
.vgn-card-strip-right.is-bottom{ align-items:flex-end; }
.vgn-card-strip-right .vgn-cta{ justify-content:flex-end; margin-top:0; }

/* ---------------------------------------------------------
   12) ORBIT (ring spins, photo inside)
   --------------------------------------------------------- */
.vgn-orbit{
  position:relative;
  width:min(420px, 100%);
  aspect-ratio:1 / 1;
  margin:10px auto;
  isolation:isolate;
  background:transparent !important;
  overflow:visible;
}
.vgn-orbit-ring{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  z-index:1;
  pointer-events:none;
  border:0 !important;
  background:none !important;
  box-shadow:none !important;
  filter:none !important;
  transform-origin:50% 50%;
  will-change:transform;
  animation:vgn-orbit-spin-cw 18s linear infinite;
}
@keyframes vgn-orbit-spin-cw{
  from{ transform:rotate(0deg) translateZ(0); }
  to  { transform:rotate(360deg) translateZ(0); }
}
.vgn-orbit-photo{
  --grow: 40px; /* adjust until it kisses the inner ring */
  position:absolute;
  inset:0;
  z-index:2;
  display:grid;
  place-items:center;
  pointer-events:none;
}
.vgn-framed img{
  border:2px solid rgba(56,189,248,.92);
  border-radius:14px;
  box-shadow:0 0 22px rgba(56,189,248,.55), 0 0 34px rgba(124,58,237,.22);
  display:block;
}
.vgn-orbit-photo img{
  width:calc(60% + var(--grow));
  max-width:calc(72% + var(--grow));
  height:auto;
}
@media(max-width:700px){
  .vgn-orbit{ width:min(360px, 100%); }
  .vgn-orbit-photo{ --grow: 26px; }
}

/* ---------------------------------------------------------
   13) PILLARS GRID (2x2 on desktop)
   --------------------------------------------------------- */
.vgn-pillars-grid.vgn-pillars-4up{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  width:100%;
}
@media(min-width:768px){
  .vgn-pillars-grid.vgn-pillars-4up{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}
@media(min-width:1100px){
  .vgn-pillars-grid.vgn-pillars-4up{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:14px;
  }
}

/* Clean “space blocks” for bricks/pillars (no studs) */
.vgn-brick,
.vgn-pillars-grid .vgn-pillar,
.vgn-pillars-grid .vgn-pillar.vgn-brick{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  color:var(--vgn-white);
  text-decoration:none;

  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.10), transparent 48%),
    radial-gradient(circle at 82% 78%, rgba(255,255,255,.06), transparent 52%),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--cw-a) 78%, rgba(2,6,23,.96)),
      color-mix(in srgb, var(--cw-b) 66%, rgba(2,6,23,.96))
    );

  box-shadow:
    0 0 18px color-mix(in srgb, var(--cw-a) 18%, transparent),
    0 0 28px color-mix(in srgb, var(--cw-b) 14%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 28px rgba(0,0,0,.28);

  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.vgn-brick:hover,
.vgn-pillars-grid .vgn-pillar:hover,
.vgn-pillars-grid .vgn-pillar:focus-within{
  transform:translateY(-2px);
  filter:saturate(1.06) brightness(1.03);
  border-color:rgba(255,255,255,.20);
}

/* pillar text helpers */
.vgn-pillar-icon{
  font-size:22px;
  line-height:1;
  margin-bottom:8px;
  text-shadow:0 0 10px rgba(56,189,248,.45);
}
.vgn-pillar-title{
  font-weight:900;
  font-size:15px;
  color:var(--vgn-white);
  margin:0 0 6px;
}
.vgn-pillar-text{
  font-weight:800;
  font-size:13px;
  line-height:1.45;
  color:#e5e7eb;
  opacity:.92;
}

/* ---------------------------------------------------------
   14) COLORWAY SWATCH WALL
   --------------------------------------------------------- */
.vgn-swatch-grid{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  margin-top:10px;
  width:100%;
}
@media(min-width:760px){
  .vgn-swatch-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media(min-width:1100px){
  .vgn-swatch-grid{ grid-template-columns:repeat(3, minmax(0, 1fr)); gap:14px; }
}

.vgn-swatch{
  border-radius:18px;
  padding:14px 14px 12px;
  border:1px solid rgba(255,255,255,.10);
  position:relative;
  overflow:hidden;

  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.10), transparent 50%),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--cw-a) 78%, rgba(2,6,23,.96)),
      color-mix(in srgb, var(--cw-b) 66%, rgba(2,6,23,.96))
    );

  box-shadow:
    0 0 18px color-mix(in srgb, var(--cw-a) 18%, transparent),
    0 0 28px color-mix(in srgb, var(--cw-b) 14%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 28px rgba(0,0,0,.28);
}
.vgn-swatch-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  font-weight:900;
  color:var(--vgn-white);
  margin-bottom:8px;
}
.vgn-swatch-chip{
  font-size:11px;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
  background:rgba(2,6,23,.55);
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  white-space:nowrap;
}
.vgn-swatch-meta{
  font-size:13px;
  font-weight:800;
  color:#e5e7eb;
  opacity:.95;
  line-height:1.35;
}
.vgn-swatch::before{
  content:"";
  position:absolute;
  inset:-50px;
  background:conic-gradient(
    from 210deg,
    transparent 0 22%,
    rgba(255,255,255,.08) 28%,
    rgba(255,255,255,.04) 34%,
    transparent 62%
  );
  filter:blur(22px);
  opacity:.22;
  pointer-events:none;
  animation:vgn-swatch-flow 22s linear infinite;
}
@keyframes vgn-swatch-flow{ to{ transform:rotate(1turn); } }

/* ---------------------------------------------------------
   15) CHAOS MODE (kept, calmer flow)
   --------------------------------------------------------- */
.vgn-card.vgn-mode-chaos .vgn-card-inner{
  border-color:rgba(255,255,255,.10);
  box-shadow:
    0 0 30px color-mix(in srgb, var(--cw-a) 24%, transparent),
    0 0 70px color-mix(in srgb, var(--cw-b) 18%, transparent);

  background:
    radial-gradient(circle at 20% 10%, color-mix(in srgb, var(--cw-a) 22%, transparent) 0, transparent 45%),
    radial-gradient(circle at 90% 20%, color-mix(in srgb, var(--cw-b) 18%, transparent) 0, transparent 50%),
    radial-gradient(circle at 40% 120%, rgba(56,189,248,.12) 0, transparent 55%),
    linear-gradient(135deg, rgba(2,6,23,.98), rgba(2,6,23,.98));
}
.vgn-card.vgn-mode-chaos .vgn-card-inner::after{
  content:"";
  position:absolute;
  inset:-60px;
  background:
    conic-gradient(from 180deg,
      transparent 0 8%,
      color-mix(in srgb, var(--cw-a) 24%, transparent) 12%,
      transparent 18%,
      color-mix(in srgb, var(--cw-b) 20%, transparent) 26%,
      transparent 38%,
      color-mix(in srgb, var(--cw-a) 18%, transparent) 48%,
      transparent 60%,
      color-mix(in srgb, var(--cw-b) 16%, transparent) 72%,
      transparent 100%);
  filter:blur(26px);
  opacity:.55;
  animation:vgn-aurora-drift 18s ease-in-out infinite; /* slowed */
  pointer-events:none;
  z-index:0;
}
@keyframes vgn-aurora-drift{
  0%,100%{ transform:translate3d(0,0,0) rotate(0deg) scale(1.02); }
  50%{ transform:translate3d(10px,-6px,0) rotate(7deg) scale(1.06); }
}

/* ---------------------------------------------------------
   16) RESPONSIVE
   --------------------------------------------------------- */
@media(max-width:700px){
  .vgn-card-inner{ padding:24px 18px 20px; }
  .vgn-sub{ font-size:15px; }

  .vgn-price .line{ flex-direction:column; align-items:flex-start; }
  .vgn-price .right{ align-items:flex-start; }

  .vgn-cta{ justify-content:center; }
  .vgn-cta .vgn-btn{ width:100%; max-width:420px; }

  .vgn-callout{ flex-direction:column; align-items:stretch; }
  .vgn-callout .vgn-btn{ width:100%; }

  .vgn-card-strip-grid{ grid-template-columns:1fr; }
  .vgn-card-strip-right{ justify-content:flex-start; }
  .vgn-card-strip-right .vgn-cta{ justify-content:flex-start; }
}

/* ---------------------------------------------------------
   17) COLORWAY PRESETS (core)
   Keep adding as needed; these are the ones in your swatch HTML.
   --------------------------------------------------------- */
.vgn-cw--nebula{ --cw-a:#06B6D4; --cw-b:#7C3AED; --cw-glow-a:rgba(6,182,212,.55); --cw-glow-b:rgba(124,58,237,.45); }
.vgn-cw--summer{ --cw-a:#14B8A6; --cw-b:#A3E635; --cw-glow-a:rgba(20,184,166,.34); --cw-glow-b:rgba(163,230,53,.28); }
.vgn-cw--minecraft{ --cw-a:#22C55E; --cw-b:#A3E635; --cw-glow-a:rgba(34,197,94,.30); --cw-glow-b:rgba(163,230,53,.26); }
.vgn-cw--roblox{ --cw-a:#38BDF8; --cw-b:#F472B6; --cw-glow-a:rgba(56,189,248,.34); --cw-glow-b:rgba(244,114,182,.28); }
.vgn-cw--urgent{ --cw-a:#F97316; --cw-b:#EF4444; --cw-glow-a:rgba(249,115,22,.34); --cw-glow-b:rgba(239,68,68,.30); }

/* Optional named ones you already had */
.vgn-cw--ai{ --cw-a:#22D3EE; --cw-b:#A855F7; --cw-glow-a:rgba(34,211,238,.36); --cw-glow-b:rgba(168,85,247,.34); }
.vgn-cw--trust{ --cw-a:#22C55E; --cw-b:#06B6D4; --cw-glow-a:rgba(34,197,94,.30); --cw-glow-b:rgba(6,182,212,.30); }
.vgn-cw--partners{ --cw-a:#94A3B8; --cw-b:#38BDF8; --cw-glow-a:rgba(148,163,184,.26); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--in-person{ --cw-a:#FBBF24; --cw-b:#22C55E; --cw-glow-a:rgba(251,191,36,.26); --cw-glow-b:rgba(34,197,94,.26); }




/* =========================================================
   VGN COLORWAYS: Complete chart coverage + aliases
   Paste BELOW existing presets
   ========================================================= */

/* --- Aliases for naming mismatches --- */
.vgn-cw--afterschool{ --cw-a:#38BDF8; --cw-b:#A855F7; --cw-glow-a:rgba(56,189,248,.50); --cw-glow-b:rgba(168,85,247,.40); }
.vgn-cw--inperson{ --cw-a:#FBBF24; --cw-b:#22C55E; --cw-glow-a:rgba(251,191,36,.26); --cw-glow-b:rgba(34,197,94,.26); }

/* --- PRIMARY / core chart items you are missing --- */
.vgn-cw--camps{ --cw-a:#22D3EE; --cw-b:#6366F1; --cw-glow-a:rgba(34,211,238,.36); --cw-glow-b:rgba(99,102,241,.30); }

/* If you ever truly offer this, keep it. Otherwise don’t use it in UI. */
.vgn-cw--scholarship{ --cw-a:#22C55E; --cw-b:#FACC15; --cw-glow-a:rgba(34,197,94,.30); --cw-glow-b:rgba(250,204,21,.28); }

/* --- EXTRA chart items --- */
.vgn-cw--newdrop{ --cw-a:#FACC15; --cw-b:#38BDF8; --cw-glow-a:rgba(250,204,21,.30); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--esports{ --cw-a:#EF4444; --cw-b:#7C3AED; --cw-glow-a:rgba(239,68,68,.32); --cw-glow-b:rgba(124,58,237,.30); }

.vgn-cw--coding{ --cw-a:#38BDF8; --cw-b:#22D3EE; --cw-glow-a:rgba(56,189,248,.34); --cw-glow-b:rgba(34,211,238,.30); }
.vgn-cw--creative{ --cw-a:#F472B6; --cw-b:#A855F7; --cw-glow-a:rgba(244,114,182,.30); --cw-glow-b:rgba(168,85,247,.30); }
.vgn-cw--design{ --cw-a:#FB7185; --cw-b:#F59E0B; --cw-glow-a:rgba(251,113,133,.30); --cw-glow-b:rgba(245,158,11,.28); }

.vgn-cw--family{ --cw-a:#FB7185; --cw-b:#60A5FA; --cw-glow-a:rgba(251,113,133,.30); --cw-glow-b:rgba(96,165,250,.28); }

.vgn-cw--value{ --cw-a:#06B6D4; --cw-b:#7C3AED; --cw-glow-a:rgba(6,182,212,.55); --cw-glow-b:rgba(124,58,237,.45); }
.vgn-cw--popular{ --cw-a:#38BDF8; --cw-b:#A855F7; --cw-glow-a:rgba(56,189,248,.50); --cw-glow-b:rgba(168,85,247,.40); }
.vgn-cw--limited{ --cw-a:#F97316; --cw-b:#EF4444; --cw-glow-a:rgba(249,115,22,.34); --cw-glow-b:rgba(239,68,68,.30); }

.vgn-cw--black-ops{ --cw-a:#111827; --cw-b:#7C3AED; --cw-glow-a:rgba(17,24,39,.40); --cw-glow-b:rgba(124,58,237,.30); }
.vgn-cw--frost{ --cw-a:#60A5FA; --cw-b:#E0F2FE; --cw-glow-a:rgba(96,165,250,.28); --cw-glow-b:rgba(224,242,254,.18); }
.vgn-cw--void{ --cw-a:#0B1220; --cw-b:#38BDF8; --cw-glow-a:rgba(11,18,32,.40); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--graphite{ --cw-a:#334155; --cw-b:#94A3B8; --cw-glow-a:rgba(51,65,85,.34); --cw-glow-b:rgba(148,163,184,.22); }

.vgn-cw--ocean{ --cw-a:#06B6D4; --cw-b:#60A5FA; --cw-glow-a:rgba(6,182,212,.30); --cw-glow-b:rgba(96,165,250,.26); }
.vgn-cw--cosmic{ --cw-a:#7C3AED; --cw-b:#22D3EE; --cw-glow-a:rgba(124,58,237,.34); --cw-glow-b:rgba(34,211,238,.30); }
.vgn-cw--neon-lime{ --cw-a:#A3E635; --cw-b:#22D3EE; --cw-glow-a:rgba(163,230,53,.28); --cw-glow-b:rgba(34,211,238,.28); }
.vgn-cw--sunburst{ --cw-a:#FACC15; --cw-b:#F97316; --cw-glow-a:rgba(250,204,21,.30); --cw-glow-b:rgba(249,115,22,.28); }
.vgn-cw--magenta-pop{ --cw-a:#EC4899; --cw-b:#38BDF8; --cw-glow-a:rgba(236,72,153,.30); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--coral-reef{ --cw-a:#FB7185; --cw-b:#22D3EE; --cw-glow-a:rgba(251,113,133,.28); --cw-glow-b:rgba(34,211,238,.26); }

.vgn-cw--cyber-green{ --cw-a:#22C55E; --cw-b:#A3E635; --cw-glow-a:rgba(34,197,94,.30); --cw-glow-b:rgba(163,230,53,.26); }
.vgn-cw--pixel-purple{ --cw-a:#A855F7; --cw-b:#38BDF8; --cw-glow-a:rgba(168,85,247,.34); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--indigo-beam{ --cw-a:#6366F1; --cw-b:#38BDF8; --cw-glow-a:rgba(99,102,241,.30); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--teal-punch{ --cw-a:#14B8A6; --cw-b:#38BDF8; --cw-glow-a:rgba(20,184,166,.28); --cw-glow-b:rgba(56,189,248,.26); }
.vgn-cw--mint-ice{ --cw-a:#34D399; --cw-b:#E0F2FE; --cw-glow-a:rgba(52,211,153,.28); --cw-glow-b:rgba(224,242,254,.18); }

.vgn-cw--ruby-alarm{ --cw-a:#EF4444; --cw-b:#FB7185; --cw-glow-a:rgba(239,68,68,.32); --cw-glow-b:rgba(251,113,133,.28); }
.vgn-cw--lava-core{ --cw-a:#F97316; --cw-b:#EF4444; --cw-glow-a:rgba(249,115,22,.30); --cw-glow-b:rgba(239,68,68,.28); }

.vgn-cw--skyline{ --cw-a:#38BDF8; --cw-b:#EC4899; --cw-glow-a:rgba(56,189,248,.30); --cw-glow-b:rgba(236,72,153,.30); }
.vgn-cw--blueprint{ --cw-a:#38BDF8; --cw-b:#94A3B8; --cw-glow-a:rgba(56,189,248,.26); --cw-glow-b:rgba(148,163,184,.22); }
.vgn-cw--amber-trust{ --cw-a:#F59E0B; --cw-b:#22C55E; --cw-glow-a:rgba(245,158,11,.28); --cw-glow-b:rgba(34,197,94,.26); }
.vgn-cw--steel-partner{ --cw-a:#64748B; --cw-b:#38BDF8; --cw-glow-a:rgba(100,116,139,.26); --cw-glow-b:rgba(56,189,248,.24); }
.vgn-cw--night-runner{ --cw-a:#22D3EE; --cw-b:#111827; --cw-glow-a:rgba(34,211,238,.26); --cw-glow-b:rgba(17,24,39,.34); }

.vgn-cw--aurora{ --cw-a:#34D399; --cw-b:#60A5FA; --cw-glow-a:rgba(52,211,153,.28); --cw-glow-b:rgba(96,165,250,.26); }
.vgn-cw--galaxy-rose{ --cw-a:#A855F7; --cw-b:#FB7185; --cw-glow-a:rgba(168,85,247,.30); --cw-glow-b:rgba(251,113,133,.28); }

/* Rose Gold (fix chart typo: pgn -> vgn) */
.vgn-cw--rose-gold{ --cw-a:#FDA4AF; --cw-b:#F59E0B; --cw-glow-a:rgba(253,164,175,.28); --cw-glow-b:rgba(245,158,11,.26); }

/* LEGO-ish brick bar */
.vgn-brickbar{
  width:100%;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:8px 0 10px;
}
.vgn-brick{
  flex:1 1 160px;
  min-width:160px;
  padding:10px 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 24% 30%, rgba(255,255,255,.22) 0 18%, transparent 20%),
    radial-gradient(circle at 56% 30%, rgba(255,255,255,.18) 0 18%, transparent 20%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--cw-a) 30%, rgba(2,6,23,.92)),
      color-mix(in srgb, var(--cw-b) 22%, rgba(2,6,23,.92))
    );
  box-shadow:
    0 0 16px color-mix(in srgb, var(--cw-a) 16%, transparent),
    inset 0 0 18px rgba(255,255,255,.06);
  color:var(--vgn-white);
  font-weight:900;
  text-decoration:none;
  text-align:center;
  transition:transform .18s ease, filter .18s ease;
}
.vgn-brick:hover{
  transform:translateY(-2px) scale(1.02);
  filter:saturate(1.08) brightness(1.04);
}

/* -----------------------------------------
   U
   Updated LEGO “brick” look (newer studs + bevel)
   Applies to both .vgn-brick and pillar tiles using .vgn-brick
   ----------------------------------------- */
.vgn-brick,
.vgn-pillars-grid .vgn-pillar.vgn-brick{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.14);

  background:
    /* studs (4) */
    radial-gradient(circle at 28% 28%, rgba(255,255,255,.26) 0 18%, rgba(255,255,255,0) 19% 100%),
    radial-gradient(circle at 72% 28%, rgba(255,255,255,.22) 0 18%, rgba(255,255,255,0) 19% 100%),
    radial-gradient(circle at 28% 58%, rgba(255,255,255,.18) 0 16%, rgba(255,255,255,0) 17% 100%),
    radial-gradient(circle at 72% 58%, rgba(255,255,255,.16) 0 16%, rgba(255,255,255,0) 17% 100%),

    /* bevel / sheen */
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,0) 35%),
    linear-gradient(135deg,
      color-mix(in srgb, var(--cw-a) 34%, rgba(2,6,23,.92)),
      color-mix(in srgb, var(--cw-b) 26%, rgba(2,6,23,.92))
    );

  box-shadow:
    0 0 18px color-mix(in srgb, var(--cw-a) 18%, transparent),
    0 0 26px color-mix(in srgb, var(--cw-b) 12%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 26px rgba(0,0,0,.22);
}

/* keep hover, but slightly calmer */
.vgn-brick:hover{
  transform:translateY(-2px) scale(1.015);
  filter:saturate(1.06) brightness(1.03);
}

/* ---------------------------------------------------------
   1) “LEGO” tiles: make them clean space-gradient blocks
   (NO studs/pegs, NO camo - just colorway-driven bricks)
   --------------------------------------------------------- */
.vgn-brick,
.vgn-pillars-grid .vgn-pillar,
.vgn-pillars-grid .vgn-pillar.vgn-brick{
  border-radius:18px;
  border:1px solid rgba(255,255,255,.12);
  color:var(--vgn-white);
  text-decoration:none;

  /* Pure colorway gradient + gentle space sheen */
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.10), transparent 48%),
    radial-gradient(circle at 82% 78%, rgba(255,255,255,.06), transparent 52%),
    linear-gradient(
      135deg,
      color-mix(in srgb, var(--cw-a) 78%, rgba(2,6,23,.96)),
      color-mix(in srgb, var(--cw-b) 66%, rgba(2,6,23,.96))
    );

  box-shadow:
    0 0 18px color-mix(in srgb, var(--cw-a) 18%, transparent),
    0 0 28px color-mix(in srgb, var(--cw-b) 14%, transparent),
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -18px 28px rgba(0,0,0,.28);

  transition:transform .18s ease, filter .18s ease, box-shadow .18s ease, border-color .18s ease;
}

/* Hover: cleaner, less “gamey” */
.vgn-brick:hover,
.vgn-pillars-grid .vgn-pillar:hover,
.vgn-pillars-grid .vgn-pillar:focus-within{
  transform:translateY(-2px);
  filter:saturate(1.06) brightness(1.03);
  border-color:rgba(255,255,255,.20);
  box-shadow:
    0 0 22px color-mix(in srgb, var(--cw-a) 22%, transparent),
    0 0 36px color-mix(in srgb, var(--cw-b) 18%, transparent),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -18px 28px rgba(0,0,0,.26);
}

.vgn a,
.vgn-card a,
.vgn-btn,
.vgn-brickbar a,
.vgn-price a {
  text-decoration: none;
}

/* Ticker: force true full-bleed even inside boxed Elementor wrappers */
.news-ticker.vgn-ticker-bleed{
  position: relative;
  left: 50%;
  right: 50%;
  width: 100vw;
  max-width: 100vw;
  margin-left: -50vw;
  margin-right: -50vw;
  padding-left: 0;
  padding-right: 0;
}/* End custom CSS */