/* v6 — Gemini-inspired: bright gradients, fluid background, freeform cards */
:root{
  --v6-bg: #05060b;
  --v6-ink: #f6f7ff;
  --v6-muted: rgba(246,247,255,.74);
  --v6-line: rgba(255,255,255,.12);
  --v6-surface: rgba(255,255,255,.06);
  --v6-surface2: rgba(255,255,255,.10);
  --v6-shadow: 0 26px 90px rgba(0,0,0,.50);
  --v6-radius: 22px;
  --v6-radius2: 34px;
  --v6-container: 1320px;
  --v6-a:#7c5cff;
  --v6-b:#22d3ee;
  --v6-c:#ff4fd8;
  --v6-d:#34d399;
}

body.v6{
  color: var(--v6-ink);
  background: radial-gradient(1200px 700px at 10% -20%, rgba(124,92,255,.22), transparent 60%),
              radial-gradient(980px 640px at 90% 0%, rgba(34,211,238,.16), transparent 60%),
              radial-gradient(1000px 700px at 50% 120%, rgba(255,79,216,.12), transparent 60%),
              linear-gradient(180deg, #05060b, #070a14);
}
body.v6::before{display:none}
.v6 .container{width:min(var(--v6-container), calc(100% - 40px))}
@media (min-width:1280px){.v6 .container{width:min(var(--v6-container), calc(100% - 72px))}}
@media (min-width:1440px){.v6 .container{width:min(var(--v6-container), calc(100% - 96px))}}
@media (min-width:1680px){:root{--v6-container: 1520px} .v6 .container{width:min(var(--v6-container), calc(100% - 120px))}}

@media (min-width: 1440px){
  .gemBanner{padding: 100px 0 58px}
  .gemBanner__title{font-size: 66px}
  .gemBanner__lead{font-size: 19px; max-width: 82ch}
  .gemSection{padding: 96px 0}
  .gemCards{gap: 14px}
  .gemCard{padding: 18px}
  .gemH2{font-size: 40px}
  .gemNewsGrid{gap: 14px}
  .teachLayout{grid-template-columns: 380px 1fr}
  .teachGrid{gap: 14px}
}

@media (min-width: 1680px){
  .gemBanner__title{font-size: 72px}
  .gemBanner__lead{max-width: 90ch}
  .gemCards{gap: 16px}
  .gemCard{padding: 20px}
  .gemH2{font-size: 44px}
  .teachLayout{grid-template-columns: 420px 1fr}
}

/* reveal */
.v6 [data-reveal]{opacity:0; transform: translateY(14px); transition: opacity .55s ease, transform .55s ease}
.v6 [data-reveal].is-in{opacity:1; transform: translateY(0)}

/* header (more gemini-like) */
.v6 .header{
  background: rgba(5,6,11,.42);
  border-bottom: 1px solid rgba(255,255,255,.10);
  backdrop-filter: blur(14px);
}
.v6 .header.is-scrolled{background: rgba(5,6,11,.68)}
.v6 .nav__panel{background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.12)}
.v6 .brand__mark{
  background: conic-gradient(from 210deg, rgba(124,92,255,1), rgba(34,211,238,1), rgba(255,79,216,1), rgba(52,211,153,1), rgba(124,92,255,1));
  box-shadow: 0 18px 42px rgba(124,92,255,.22);
}
.v6 .brand__mark.brand__mark--image{
  /* Wordmark logo should blend into the header background. */
  background: inherit;
  border-radius: 0;
  box-shadow: none;
}

/* buttons */
.v6 .btn--primary{
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(34,211,238,1), rgba(255,79,216,.95));
  border-color: rgba(124,92,255,.38);
  box-shadow: 0 24px 70px rgba(124,92,255,.18);
}
.v6 .btn--primary:hover{
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(34,211,238,.95), rgba(255,79,216,.92));
}
.v6 .btn--ghost{
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.12);
}

/* header button overflow fixes */
.v6 .header__actions{flex-wrap: wrap}
.v6 .header__actions .btn{white-space: nowrap}

/* gemini background layer */
.gemBg{
  position:absolute;
  inset:-200px -120px auto -120px;
  height: 820px;
  pointer-events:none;
  opacity:.95;
  filter: blur(0px);
}
.gemBg::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(520px 360px at var(--mx, 30%) var(--my, 18%), rgba(124,92,255,.30), transparent 60%),
    radial-gradient(520px 360px at calc(var(--mx, 30%) + 28%) calc(var(--my, 18%) + 18%), rgba(34,211,238,.22), transparent 62%),
    radial-gradient(520px 360px at calc(var(--mx, 30%) + 46%) calc(var(--my, 18%) + 34%), rgba(255,79,216,.18), transparent 62%),
    radial-gradient(580px 380px at 24% 40%, rgba(52,211,153,.10), transparent 62%),
    radial-gradient(900px 420px at 50% 80%, rgba(255,255,255,.06), transparent 62%);
  mask-image: radial-gradient(circle at 50% 35%, rgba(0,0,0,1), rgba(0,0,0,.62) 46%, rgba(0,0,0,0) 72%);
  opacity: .92;
}

/* new hero */
.gemHero{
  position:relative;
  padding: 92px 0 46px;
  overflow:hidden;
}
.gemHero__grid{
  display:grid;
  grid-template-columns: 1.06fr .94fr;
  gap: 18px;
  align-items: start;
}

/* banner v2 (stronger, reusable) */
.gemBanner{
  position:relative;
  padding: 96px 0 52px;
  overflow:hidden;
}
.gemBanner__grid{
  display:grid;
  grid-template-columns: 1.06fr .94fr;
  gap: 18px;
  align-items: start;
}
.gemBanner__meta{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.gemPill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding: 9px 12px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: rgba(246,247,255,.86);
  font-size: 12px;
  letter-spacing:.35px;
}
.gemPill--hot{
  border-color: rgba(124,92,255,.38);
  background: linear-gradient(135deg, rgba(124,92,255,.20), rgba(34,211,238,.10), rgba(255,79,216,.10));
}
.gemSpark{
  width:10px;height:10px;border-radius:999px;
  background: rgba(255,79,216,1);
  box-shadow: 0 0 0 10px rgba(255,79,216,.10), 0 0 34px rgba(255,79,216,.35);
}
.gemBanner__title{
  margin: 10px 0 12px;
  font-size: 72px;
  letter-spacing: -1.7px;
  line-height: .96;
}
.gemBanner__title span{
  display:block;
  margin-top: 12px;
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(34,211,238,1), rgba(255,79,216,1));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.gemBanner__lead{
  margin: 0 0 22px;
  color: var(--v6-muted);
  line-height: 1.85;
  font-size: 18px;
  max-width: 74ch;
}
.gemBanner__cta{display:flex; gap:12px; flex-wrap:wrap; margin-bottom: 12px}

/* banner: customer count panel */
.gemCust{
  margin-top: 96px;
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.16);
  overflow:hidden;
  position:relative;
}
.gemCust::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(420px 220px at 20% 30%, rgba(34,211,238,.10), transparent 62%),
    radial-gradient(420px 220px at 78% 26%, rgba(124,92,255,.10), transparent 62%),
    radial-gradient(420px 220px at 52% 86%, rgba(255,79,216,.08), transparent 62%);
  opacity:.9;
  pointer-events:none;
}
.gemCust__head{
  position:relative;
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap: 12px;
  padding: 12px 14px 10px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.gemCust__k{font-weight: 900; color: rgba(246,247,255,.92); letter-spacing:.2px}
.gemCust__sub{font-size: 12px; color: rgba(167,176,200,.92)}
.gemCust__grid{
  position:relative;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  padding: 12px 14px 14px;
}
.gemCustCard{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 18px;
  padding: 12px;
  overflow:hidden;
  position:relative;
}
.gemCustCard::after{
  content:"";
  position:absolute; inset:auto -30px -30px auto;
  width: 160px; height: 160px;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.10), transparent 62%);
  opacity:.9;
  pointer-events:none;
}
.gemCustCard--gov::after{background: radial-gradient(circle at 30% 30%, rgba(34,211,238,.16), transparent 62%)}
.gemCustCard--biz::after{background: radial-gradient(circle at 30% 30%, rgba(124,92,255,.16), transparent 62%)}
.gemCustCard__k{font-size: 12px; color: rgba(167,176,200,.92); letter-spacing:.25px}
.gemCustCard__v{
  margin-top: 8px;
  font-size: 28px;
  font-weight: 950;
  letter-spacing: -.6px;
  color: rgba(246,247,255,.96);
}
.gemArt{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  overflow:hidden;
  padding: 14px;
  position:relative;
}
.gemArt::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(124,92,255,.18), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.14), transparent 60%),
    radial-gradient(520px 260px at 60% 70%, rgba(255,79,216,.12), transparent 60%),
    linear-gradient(to right, rgba(255,255,255,.10) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: auto, auto, auto, 92px 92px, 92px 92px;
  opacity:.55;
  pointer-events:none;
}
.gemArt__row{position:relative; display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.gemPrompt{
  position:relative;
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.38);
  padding: 12px;
  display:flex;
  align-items:center;
  gap: 10px;
}
.gemPrompt__dot{
  width:10px;height:10px;border-radius:999px;
  background: rgba(34,211,238,1);
  box-shadow: 0 0 0 10px rgba(34,211,238,.10), 0 0 30px rgba(34,211,238,.40);
}
.gemPrompt__text{color: rgba(246,247,255,.88); font-size:13px; letter-spacing:.2px}
.gemPrompt__hint{margin-left:auto; color: rgba(167,176,200,.92); font-size:12px}

/* teaching center: youtube-like hero */
.gemBanner--tube .gemBanner__grid{align-items: start}
.gemTube{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 12px;
  align-items: start;
}
.gemTube::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 18% 22%, rgba(124,92,255,.20), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.16), transparent 60%),
    radial-gradient(520px 260px at 56% 80%, rgba(255,79,216,.12), transparent 62%);
  opacity:.70;
  pointer-events:none;
}
.gemTubeMain{
  position:relative;
  display:block;
  width:100%;
  text-align:left;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 22px;
  overflow:hidden;
  padding: 0;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.gemTubeMain:hover{transform: translateY(-2px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.gemTubeMain__thumb{
  position:relative;
  aspect-ratio: 16 / 9;
  overflow:hidden;
  background: rgba(255,255,255,.03);
}
.gemTubeMain__thumb img{width:100%; height:100%; object-fit:cover; display:block; opacity:.95}
.gemTubeMain__play{
  position:absolute;
  left: 14px;
  bottom: 14px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  background: rgba(5,6,11,.55);
  color: rgba(246,247,255,.92);
  box-shadow: 0 10px 30px rgba(0,0,0,.30), 0 0 0 8px rgba(34,211,238,.10);
  backdrop-filter: blur(10px);
}
.gemTubeMain__dur{
  position:absolute;
  right: 12px;
  bottom: 12px;
  padding: 6px 8px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.62);
  color: rgba(246,247,255,.88);
  font-size: 12px;
}
.gemTubeMain__meta{padding: 12px 14px 14px; position:relative}
.gemTubeMain__title{font-weight:950; letter-spacing:-.25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.gemTubeMain__sub{margin-top:6px; color: rgba(167,176,200,.96); font-size:12.5px; line-height:1.5}

.gemTubeList{position:relative; display:grid; gap:10px}
.gemTubeItem{
  display:grid;
  grid-template-columns: 120px 1fr;
  gap: 10px;
  align-items:center;
  text-align:left;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 10px;
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
}
.gemTubeItem:hover{transform: translateY(-2px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.gemTubeItem__thumb{
  position:relative;
  border-radius: 14px;
  overflow:hidden;
  aspect-ratio: 16 / 10;
  background: rgba(255,255,255,.03);
}
.gemTubeItem__thumb img{width:100%; height:100%; object-fit:cover; display:block; opacity:.95}
.gemTubeItem__dur{
  position:absolute;
  right: 8px;
  bottom: 8px;
  padding: 5px 7px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.62);
  color: rgba(246,247,255,.88);
  font-size: 11px;
}
.gemTubeItem__meta{min-width:0}
.gemTubeItem__t{font-weight:900; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.gemTubeItem__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.45; display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow:hidden}

/* unique banner right-side components */
.gemRail{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  gap: 10px;
}
.gemRail::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(34,211,238,.16), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(124,92,255,.14), transparent 60%),
    radial-gradient(520px 260px at 60% 70%, rgba(255,79,216,.10), transparent 62%);
  opacity:.65;
  pointer-events:none;
}
.gemRail__row{
  position:relative;
  display:grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items:center;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 12px;
}
.gemRail__k{
  width:44px;height:44px;border-radius: 16px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  font-weight:950;
}
.gemRail__t{font-weight:950; letter-spacing:-.2px}
.gemRail__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.5}

.gemFlow{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  gap: 10px;
}
.gemFlow::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 16% 18%, rgba(124,92,255,.18), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.12), transparent 60%);
  opacity:.65;
  pointer-events:none;
}
.gemFlow__node{
  position:relative;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 12px;
}
.gemFlow__k{color: rgba(167,176,200,.92); font-size:12px}
.gemFlow__t{margin-top:8px; font-weight:950; letter-spacing:-.2px}
.gemFlow__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.5}
.gemFlow__node--a{box-shadow: 0 0 0 6px rgba(34,211,238,.08) inset}
.gemFlow__node--b{box-shadow: 0 0 0 6px rgba(124,92,255,.08) inset}
.gemFlow__node--c{box-shadow: 0 0 0 6px rgba(255,79,216,.07) inset}
.gemFlow__node--d{box-shadow: 0 0 0 6px rgba(52,211,153,.07) inset}

.gemQuoteStack{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  gap: 10px;
}
.gemQuoteStack::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(52,211,153,.14), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.12), transparent 60%),
    radial-gradient(520px 260px at 60% 70%, rgba(124,92,255,.10), transparent 62%);
  opacity:.65;
  pointer-events:none;
}
.gemQuoteStack__kpi{position:relative; display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:10px}
.gemKpi{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 12px;
}
.gemKpi__v{font-weight:1000; letter-spacing:-.3px; font-size: 20px}
.gemKpi__k{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px}
.gemKpi--a{box-shadow: 0 0 0 6px rgba(34,211,238,.08) inset}
.gemKpi--b{box-shadow: 0 0 0 6px rgba(124,92,255,.08) inset}
.gemKpi--c{box-shadow: 0 0 0 6px rgba(255,79,216,.07) inset}
.gemKpi--d{box-shadow: 0 0 0 6px rgba(52,211,153,.07) inset}
.gemQuote{
  position:relative;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 12px;
}
.gemQuote__t{font-weight:900; letter-spacing:-.2px; line-height:1.45}
.gemQuote__s{margin-top:8px; color: rgba(167,176,200,.92); font-size:12px}

.gemTimelineMini{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  gap: 10px;
}
.gemTimelineMini::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 16% 18%, rgba(124,92,255,.16), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.12), transparent 60%);
  opacity:.65;
  pointer-events:none;
}
.gemMilestone{
  position:relative;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 12px;
}
.gemMilestone__k{color: rgba(167,176,200,.92); font-size:12px}
.gemMilestone__t{margin-top:8px; font-weight:950; letter-spacing:-.2px}
.gemMilestone__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.5}
.gemMilestone--a{box-shadow: 0 0 0 6px rgba(34,211,238,.08) inset}
.gemMilestone--b{box-shadow: 0 0 0 6px rgba(124,92,255,.08) inset}
.gemMilestone--c{box-shadow: 0 0 0 6px rgba(255,79,216,.07) inset}
.gemMilestone--d{box-shadow: 0 0 0 6px rgba(52,211,153,.07) inset}

.gemShelf{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  align-content:start;
}
.gemShelf::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(255,79,216,.12), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(124,92,255,.12), transparent 60%),
    radial-gradient(520px 260px at 56% 80%, rgba(34,211,238,.10), transparent 62%);
  opacity:.65;
  pointer-events:none;
}
.gemShelf__cover{
  position:relative;
  border-radius: 18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  aspect-ratio: 16 / 11;
}
.gemShelf__cover img{width:100%; height:100%; object-fit:cover; display:block; opacity:.96}
.gemShelf__tags{
  position:relative;
  grid-column: 1 / -1;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* youtube-like teaching list (below banner) */
.teachLayout{
  display:grid;
  grid-template-columns: 340px 1fr;
  gap: 14px;
  align-items:start;
}
.teachSide{
  border-radius: 24px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  padding: 12px;
  position:relative;
  overflow:hidden;
  max-height: 920px;
}
.teachSide::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(124,92,255,.12), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.10), transparent 60%);
  opacity:.75;
  pointer-events:none;
}
.teachSide__section{position:relative}
.teachSide__section + .teachSide__section{margin-top: 12px; padding-top: 12px; border-top:1px solid rgba(255,255,255,.08)}
.teachSide__h{font-weight:950; letter-spacing:-.2px; margin: 2px 0 10px}
.teachCats{
  display:block;
  max-height: 380px;
  overflow:auto;
  padding-right: 6px;
  scrollbar-gutter: stable;
}
.teachNav{display:grid; gap: 8px}
.teachCat{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 16px;
  padding: 10px 12px;
  color: rgba(246,247,255,.92);
  cursor:pointer;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.teachCat:hover{transform: translateY(-1px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.teachCat.is-active{
  border-color: rgba(34,211,238,.24);
  background: linear-gradient(135deg, rgba(124,92,255,.14), rgba(34,211,238,.10), rgba(255,79,216,.08));
}
.teachCat__t{font-weight:900; letter-spacing:-.2px}
.teachCat__n{
  flex: 0 0 auto;
  min-width: 34px;
  height: 26px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color: rgba(167,176,200,.98);
  font-size: 12px;
}

.teachGroup{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.18);
  border-radius: 18px;
  overflow:hidden;
}
.teachGroup__head{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  border:0;
  background: transparent;
  color: rgba(246,247,255,.92);
  padding: 10px 12px;
  cursor:pointer;
}
.teachGroup__t{font-weight:950; letter-spacing:-.2px}
.teachGroup__n{
  margin-left:auto;
  min-width: 34px;
  height: 26px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color: rgba(167,176,200,.98);
  font-size: 12px;
}
.teachGroup__chev{
  width: 10px;
  height: 10px;
  border-right: 2px solid rgba(246,247,255,.70);
  border-bottom: 2px solid rgba(246,247,255,.70);
  transform: rotate(45deg);
  opacity:.8;
  transition: transform .12s ease;
}
.teachGroup.is-open .teachGroup__chev{transform: rotate(225deg)}
.teachGroup__list{
  display:none;
  padding: 0 8px 10px;
  gap: 8px;
}
.teachGroup.is-open .teachGroup__list{display:grid}
.teachSubCat{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 14px;
  padding: 9px 10px;
  color: rgba(246,247,255,.90);
  cursor:pointer;
  transition: background .12s ease, border-color .12s ease, transform .12s ease;
}
.teachSubCat:hover{transform: translateY(-1px); background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.14)}
.teachSubCat.is-active{
  border-color: rgba(34,211,238,.24);
  background: linear-gradient(135deg, rgba(124,92,255,.12), rgba(34,211,238,.10), rgba(255,79,216,.08));
}
.teachSubCat__t{font-weight:900; letter-spacing:-.2px}
.teachSubCat__n{
  min-width: 34px;
  height: 24px;
  border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  color: rgba(167,176,200,.98);
  font-size: 12px;
}

.teachCourses{display:grid; gap:10px; max-height: 520px; overflow:auto; padding-right: 6px; scrollbar-gutter: stable}
.teachCourse{
  display:grid;
  grid-template-columns: 90px 1fr;
  gap: 10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 10px;
  text-decoration:none;
  color: rgba(246,247,255,.92);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.teachCourse:hover{transform: translateY(-2px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.teachCourse__thumb{border-radius: 14px; overflow:hidden; aspect-ratio: 16 / 10; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03)}
.teachCourse__thumb img{width:100%; height:100%; object-fit:cover; display:block; opacity:.96}
.teachCourse__meta{min-width:0}
.teachCourse__t{font-weight:950; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.teachCourse__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.45; display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow:hidden}

.teachMain{
  border-radius: 24px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  padding: 14px;
  position:relative;
  overflow:hidden;
}
.teachMain::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(620px 280px at 18% 20%, rgba(34,211,238,.08), transparent 62%),
    radial-gradient(620px 280px at 78% 30%, rgba(124,92,255,.08), transparent 62%),
    radial-gradient(620px 280px at 52% 70%, rgba(255,79,216,.06), transparent 62%);
  opacity:.9;
  pointer-events:none;
}
.teachMain__head{position:relative; display:flex; justify-content:space-between; gap:12px; align-items:baseline; margin-bottom: 12px}
.teachMain__k{color: rgba(167,176,200,.92); font-size:12px}
.teachMain__t{font-weight:1000; letter-spacing:-.35px; font-size: 20px}
.teachGrid{
  position:relative;
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 12px;
}
.teachVideo{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 20px;
  padding: 10px;
  text-decoration:none;
  color: rgba(246,247,255,.92);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  overflow:hidden;
}
.teachVideo:hover{transform: translateY(-2px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.teachVideo__thumb{position:relative; border-radius: 16px; overflow:hidden; aspect-ratio: 16 / 9; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03)}
.teachVideo__thumb img{width:100%; height:100%; object-fit:cover; display:block; opacity:.96}
.teachVideo__dur{
  position:absolute; right: 10px; bottom: 10px;
  padding: 6px 8px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.62);
  color: rgba(246,247,255,.88);
  font-size: 12px;
}
.teachVideo__meta{margin-top:10px; min-width:0}
.teachVideo__t{font-weight:950; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.teachVideo__s{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px}

/* watch layout (course / single video page) */
.watchHead{margin-bottom: 14px}
.watchHead__k{color: rgba(167,176,200,.92); font-size:12px}
.watchHead__t{margin:8px 0 6px; font-size: 34px; letter-spacing:-.6px}
.watchHead__d{color: rgba(167,176,200,.96); line-height:1.7}
.watchLayout{
  display:grid;
  grid-template-columns: 1.55fr .95fr;
  gap: 14px;
  align-items:start;
}
.watchPlayer{
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  overflow:hidden;
}
.watchVideo{width:100%; height:auto; display:block; background: rgba(0,0,0,.35)}
.watchMeta{margin-top: 12px}
.watchTitle{font-weight:1000; letter-spacing:-.25px}
.watchMini{margin-top:8px; color: rgba(167,176,200,.92); font-size:12px}
.watchDesc{margin-top:10px; border:1px solid rgba(255,255,255,.10); background: rgba(5,6,11,.20); border-radius: 20px; padding: 12px; color: rgba(246,247,255,.90); line-height:1.85}
.watchSide{
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.02);
  padding: 12px;
  position:relative;
  overflow:hidden;
}
.watchSide::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(124,92,255,.12), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.10), transparent 60%);
  opacity:.75;
  pointer-events:none;
}
.watchSide__h{position:relative; font-weight:950; letter-spacing:-.2px; margin-bottom:10px}
.watchList{position:relative; display:grid; gap:10px}
.watchItem{
  display:grid;
  grid-template-columns: 140px 1fr;
  gap: 10px;
  align-items:center;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 18px;
  padding: 10px;
  cursor:pointer;
  text-decoration:none;
  color: rgba(246,247,255,.92);
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
}
.watchItem:hover{transform: translateY(-2px); background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.16)}
.watchItem.is-active{border-color: rgba(34,211,238,.28); box-shadow: 0 0 0 6px rgba(34,211,238,.08) inset}
.watchItem__thumb{position:relative; border-radius: 14px; overflow:hidden; aspect-ratio: 16 / 10; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.03)}
.watchItem__thumb img{width:100%; height:100%; object-fit:cover; display:block; opacity:.96}
.watchItem__dur{
  position:absolute; right: 8px; bottom: 8px;
  padding: 5px 7px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.62);
  color: rgba(246,247,255,.88);
  font-size: 11px;
}
.watchItem__meta{min-width:0}
.watchItem__t{font-weight:900; letter-spacing:-.2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.watchItem__d{margin-top:6px; color: rgba(167,176,200,.96); font-size:12px; line-height:1.45; display:-webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow:hidden}

@media (max-width: 1024px){
  .teachLayout{grid-template-columns: 1fr}
  .teachSide{max-height: none}
  .teachCats{max-height:none}
  .teachCourses{max-height:none}
  .teachGrid{grid-template-columns: 1fr}
  .watchLayout{grid-template-columns: 1fr}
}
.gemKicker{
  display:inline-flex; align-items:center; gap:10px;
  padding: 9px 12px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: rgba(246,247,255,.86);
  font-size: 12px;
  letter-spacing:.35px;
}
.gemTitle{
  margin: 16px 0 12px;
  font-size: 70px;
  letter-spacing: -1.6px;
  line-height: .98;
}
.gemTitle span{
  display:block;
  margin-top: 12px;
  background: linear-gradient(135deg, rgba(124,92,255,1), rgba(34,211,238,1), rgba(255,79,216,1));
  -webkit-background-clip:text;
  background-clip:text;
  color: transparent;
}
.gemLead{
  margin: 0 0 22px;
  color: var(--v6-muted);
  line-height: 1.85;
  font-size: 18px;
  max-width: 72ch;
}
.gemHero__cta{display:flex; gap:12px; flex-wrap:wrap}

/* prompt card */
.promptCard{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: var(--v6-shadow);
  overflow:hidden;
  padding: 14px;
  position:relative;
}
.promptCard::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(124,92,255,.16), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.12), transparent 60%),
    radial-gradient(520px 260px at 60% 70%, rgba(255,79,216,.10), transparent 60%),
    linear-gradient(to right, rgba(255,255,255,.10) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.08) 1px, transparent 1px);
  background-size: auto, auto, auto, 84px 84px, 84px 84px;
  opacity:.55;
  pointer-events:none;
}
.promptCard__row{position:relative; display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.chip{
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  color: rgba(246,247,255,.90);
  padding:8px 12px;
  border-radius:999px;
  font-size:12px;
}
.promptBar{
  position:relative;
  border-radius: 22px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.38);
  padding: 12px;
  display:flex;
  align-items:center;
  gap: 10px;
}
.promptDot{
  width:10px;height:10px;border-radius:999px;
  background: rgba(34,211,238,1);
  box-shadow: 0 0 0 10px rgba(34,211,238,.10), 0 0 30px rgba(34,211,238,.40);
}
.promptText{color: rgba(246,247,255,.88); font-size:13px; letter-spacing:.2px}
.promptHint{margin-left:auto; color: rgba(167,176,200,.92); font-size:12px}

.mosaic{
  position:relative;
  margin-top: 12px;
  display:grid;
  grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 10px;
}
.tile{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius: 20px;
  padding: 14px;
  position:relative;
  overflow:hidden;
  min-height: 110px;
}
.tile--lg{grid-column: span 4; min-height: 220px}
.tile--md{grid-column: span 3}
.tile--sm{grid-column: span 2}
.tile__k{color: rgba(167,176,200,.92); font-size:12px; letter-spacing:.3px}
.tile__t{margin-top: 8px; font-weight: 900; letter-spacing:-.2px}
.tile__d{margin-top: 8px; color: rgba(167,176,200,.96); line-height:1.7}
.tile::after{
  content:"";
  position:absolute; inset:auto -40px -40px auto;
  width: 220px; height: 220px;
  background: radial-gradient(circle at 30% 30%, rgba(124,92,255,.20), transparent 62%);
  filter: blur(1px);
  opacity:.9;
}
.tile--c::after{background: radial-gradient(circle at 30% 30%, rgba(255,79,216,.18), transparent 62%)}
.tile--b::after{background: radial-gradient(circle at 30% 30%, rgba(34,211,238,.18), transparent 62%)}
.tile--d::after{background: radial-gradient(circle at 30% 30%, rgba(52,211,153,.16), transparent 62%)}

/* hero stat tiles (Data/AI/Media/Creators) */
.tileStat__body{margin-top: 10px; position:relative}
.tileStat__row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap: 10px;
  margin-top: 6px;
}
.tileStat__k{color: rgba(167,176,200,.92); font-size: 12px}
.tileStat__v{color: rgba(246,247,255,.92); font-weight: 900; letter-spacing: .1px}
.tileStat__grid3{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 10px;
  margin-top: 10px;
}
.tileStat__grid2{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 10px;
  margin-top: 10px;
}
.tileStat--ai .tileStat__mini .tileStat__v{font-size: 15px}
.tileStat--ai .tileStat__body{margin-top: 8px}
.tileStat--ai .tileStat__grid2{gap: 8px; margin-top: 8px}
.tileStat--ai .tileStat__mini{padding: 0}
.tileStat__mini .tileStat__k{font-size:12px}
.tileStat__mini .tileStat__v{margin-top:6px; font-size: 16px}

.tileStat__tag{
  margin-top: 10px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size: 12px;
  color: rgba(246,247,255,.72);
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  padding: 6px 10px;
  border-radius: 999px;
}

/* Data: tag marquee (left -> right) */
.tileStat__tag--marquee{
  overflow:hidden;
  white-space: nowrap;
}
.tileTagMarquee{
  display:block;
  width: 100%;
  overflow:hidden;
}
.tileTagMarquee__rail{
  display:inline-flex;
  align-items:center;
  gap: 10px;
  width: max-content;
  animation: tileTagMarquee 8s linear infinite;
}
.tileTagMarquee__item{color: rgba(246,247,255,.78)}
.tileTagMarquee__sep{color: rgba(167,176,200,.70)}
@keyframes tileTagMarquee{
  from{transform: translateX(-40%)}
  to{transform: translateX(40%)}
}
@media (prefers-reduced-motion: reduce){
  .tileTagMarquee__rail{animation:none}
}

/* Data: realtime progress bar / ripple */
.tileStat__bar{
  margin-top: 10px;
  height: 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  overflow:hidden;
}
.tileStat__barFill{
  height:100%;
  width: 46%;
  border-radius: 999px;
  background: linear-gradient(90deg, rgba(34,211,238,.20), rgba(124,92,255,.42), rgba(255,79,216,.20));
  position:relative;
  animation: tileBarGrow 2.6s ease-in-out infinite;
}
.tileStat__barFill::after{
  content:"";
  position:absolute; inset:-12px -40px -12px -40px;
  background: radial-gradient(26px 16px at var(--x, 20%) 50%, rgba(255,255,255,.18), transparent 62%);
  animation: tileBarRipple 1.8s linear infinite;
  opacity:.9;
}
@keyframes tileBarGrow{0%{width: 34%}50%{width: 86%}100%{width: 46%}}
@keyframes tileBarRipple{0%{transform: translateX(-20%)}100%{transform: translateX(20%)}}

/* AI: ring + pulse */
.tileAI__top{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top: 8px}
.tileAI__ring{
  width: 44px; height: 44px;
  border-radius: 999px;
  background:
    conic-gradient(from 210deg, rgba(124,92,255,1) calc(var(--p, 0) * 1%), rgba(255,255,255,.10) 0),
    radial-gradient(circle at 50% 50%, rgba(0,0,0,.20) 58%, transparent 60%);
  border:1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 50px rgba(124,92,255,.14);
  position:relative;
}
.tileAI__ring::after{
  content:"";
  position:absolute; inset:-8px;
  border-radius:999px;
  background: radial-gradient(circle at 50% 50%, rgba(124,92,255,.18), transparent 58%);
  animation: aiRingPulse 1.9s ease-in-out infinite;
}
@keyframes aiRingPulse{0%{transform: scale(.92); opacity:.25}50%{transform: scale(1.05); opacity:.70}100%{transform: scale(.92); opacity:.25}}
.tileAI__accK{color: rgba(167,176,200,.92); font-size: 12px}
.tileAI__accV{margin-top:6px; font-size: 18px; font-weight: 950; color: rgba(246,247,255,.94)}
.tileAI__pulse{
  position:absolute;
  right: 10px;
  bottom: 46px;
  width: 10px; height: 10px;
  border-radius: 999px;
  background: rgba(255,79,216,1);
  box-shadow: 0 0 0 0 rgba(255,79,216,.35);
  animation: aiPulse 1.4s ease-out infinite;
}
@keyframes aiPulse{0%{box-shadow: 0 0 0 0 rgba(255,79,216,.35)}100%{box-shadow: 0 0 0 18px rgba(255,79,216,0)}}

/* Marquee chips (media/platforms) */
.tileMarquee{
  margin-top: 10px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.14);
  overflow:hidden;
  mask-image: linear-gradient(to right, transparent, #000 14px, #000 calc(100% - 14px), transparent);
}
.tileMarquee__rail{
  display:flex;
  gap: 10px;
  padding: 8px 10px;
  width: max-content;
  animation: tileMarquee 18s linear infinite;
}
.tileMarquee:hover .tileMarquee__rail{animation-play-state: paused}
.tileChip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 6px 10px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  color: rgba(246,247,255,.86);
  font-size: 12px;
  white-space: nowrap;
}
.tileChip--icon{padding: 6px 12px}
@keyframes tileMarquee{to{transform: translateX(-50%)}}

@media (prefers-reduced-motion: reduce){
  .tileStat__barFill,
  .tileStat__barFill::after,
  .tileAI__ring::after,
  .tileAI__pulse,
  .tileMarquee__rail{animation:none}
}

/* hero hot news ticker */
.tileHot{display:flex; flex-direction:column}
.tileHot__head{display:flex; align-items:center; justify-content:space-between; gap:10px}
.tileHot__tag{
  font-size: 12px;
  color: rgba(246,247,255,.72);
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.04);
  padding: 6px 10px;
  border-radius: 999px;
}
.tileHot__viewport{
  margin-top: 12px;
  --hot-line-h: 34px;
  --hot-visible: 6;
  height: calc(var(--hot-line-h) * var(--hot-visible)); /* show 6 lines */
  overflow:hidden;
  position:relative;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(0,0,0,.16);
  mask-image: linear-gradient(to bottom, transparent, #000 12px, #000 calc(100% - 12px), transparent);
}
.tileHot__rail{
  display:flex;
  flex-direction:column;
  animation: tileHotScroll var(--hot-dur, 14s) linear infinite;
  will-change: transform;
}
.tileHot__viewport:hover .tileHot__rail{animation-play-state: paused}
.tileHot__item{
  height: var(--hot-line-h);
  display:flex;
  align-items:center;
  gap:10px;
  padding: 0 12px;
  color: rgba(246,247,255,.92);
  font-weight: 650;
  letter-spacing: .1px;
  font-size: 13px;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;
}
.tileHot__src{
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .2px;
  color: rgba(246,247,255,.86);
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  flex: 0 0 auto;
}
.tileHot__item:hover{background: rgba(255,255,255,.06)}
.tileHot__dot{
  width: 8px; height: 8px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 30%, rgba(255,79,216,1), rgba(124,92,255,1));
  box-shadow: 0 10px 22px rgba(255,79,216,.14);
  flex: 0 0 auto;
}
.tileHot__text{min-width:0; overflow:hidden; text-overflow:ellipsis}
.tileHot__empty{
  height: 34px;
  display:flex;
  align-items:center;
  padding: 0 12px;
  color: rgba(167,176,200,.92);
}
@keyframes tileHotScroll{
  to{transform: translateY(-50%)}
}
@media (prefers-reduced-motion: reduce){
  .tileHot__rail{animation:none}
}

/* sections */
.gemSection{
  padding: 84px 0;
  position: relative;
  overflow: hidden;
}
.gemSection::before{
  content:"";
  position:absolute;
  inset:-140px -120px auto -120px;
  height: 420px;
  pointer-events:none;
  background:
    radial-gradient(520px 240px at 14% 20%, rgba(124,92,255,.10), transparent 62%),
    radial-gradient(520px 240px at 78% 30%, rgba(34,211,238,.08), transparent 62%),
    radial-gradient(520px 240px at 48% 70%, rgba(255,79,216,.06), transparent 62%);
  opacity:.9;
}
.gemSection--alt{
  background: rgba(255,255,255,.02);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.gemSection--alt::before{
  opacity: 1;
  background:
    radial-gradient(620px 280px at 18% 20%, rgba(34,211,238,.08), transparent 62%),
    radial-gradient(620px 280px at 78% 30%, rgba(124,92,255,.08), transparent 62%),
    radial-gradient(620px 280px at 52% 70%, rgba(52,211,153,.06), transparent 62%);
}
.gemHead{
  margin-bottom: 16px;
  position: relative;
  padding-left: 14px;
}
.gemHead::before{
  content:"";
  position:absolute;
  left:0;
  top: 6px;
  bottom: 6px;
  width: 3px;
  border-radius: 999px;
  background: linear-gradient(180deg, rgba(124,92,255,1), rgba(34,211,238,1), rgba(255,79,216,1));
  opacity:.9;
}
.gemH2{margin:0 0 8px; font-size: 36px; letter-spacing:-.6px}
.gemP{margin:0; color: rgba(167,176,200,.96); line-height:1.75; max-width: 78ch}

.gemCards{display:grid; grid-template-columns: repeat(12, minmax(0,1fr)); gap: 12px}
.gemCard{
  grid-column: span 4;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  border-radius: 24px;
  padding: 16px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  position:relative;
  overflow:hidden;
}
.gemCards--pricing .gemCard{grid-column: span 4}
.gemCard--pricing{padding: 18px}
.gemCard__price{
  margin-top: 10px;
  display:flex;
  flex-direction:column;
  gap:4px;
}
.gemCard__price-main{font-size: 20px; font-weight: 950; letter-spacing:-.2px}
.gemCard__price-sub{font-size: 12px; color: rgba(167,176,200,.96)}
.gemCard__list{
  margin: 10px 0 0;
  padding: 0;
  list-style:none;
  color: rgba(167,176,200,.96);
  font-size: 13px;
  line-height:1.7;
}
.gemCard__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  margin-top: 12px;
  padding: 7px 14px;
  border-radius: 999px;
  border:1px solid rgba(255,255,255,.32);
  font-size: 13px;
}
.gemCard--highlight{
  border-color: rgba(124,92,255,.45);
  box-shadow: 0 18px 44px rgba(124,92,255,.20);
}
.gemCard__badge{
  position:absolute;
  right: 14px;
  top: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  border:1px solid rgba(124,92,255,.55);
  background: rgba(124,92,255,.16);
  font-size: 11px;
}
.gemCard--span6{grid-column: span 6}
.gemCard--span4{grid-column: span 4}
.gemCard--span12{grid-column: span 12}
.gemCards--cap{gap: 12px}

.gemCapIcon{
  width: 36px;
  height: 36px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  display:grid;
  place-items:center;
  position: relative;
  overflow:hidden;
}
.gemCapIcon::before{
  content:"";
  width: 16px;
  height: 16px;
  border-radius: 6px;
  background: rgba(255,255,255,.88);
  filter: drop-shadow(0 10px 22px rgba(124,92,255,.20));
}
.gemCapIcon::after{
  content:"";
  position:absolute;
  inset:-40px -40px auto auto;
  width: 120px;
  height: 120px;
  background: radial-gradient(circle at 30% 30%, rgba(124,92,255,.22), transparent 62%);
  opacity:.9;
  pointer-events:none;
}
.gemCapIcon--monitor::after{background: radial-gradient(circle at 30% 30%, rgba(34,211,238,.20), transparent 62%)}
.gemCapIcon--respond::after{background: radial-gradient(circle at 30% 30%, rgba(124,92,255,.22), transparent 62%)}
.gemCapIcon--media::after{background: radial-gradient(circle at 30% 30%, rgba(255,79,216,.18), transparent 62%)}
.gemCapIcon--rb::after{background: radial-gradient(circle at 30% 30%, rgba(239,68,68,.20), transparent 62%)}
.gemCapIcon--intel::after{background: radial-gradient(circle at 30% 30%, rgba(52,211,153,.18), transparent 62%)}
.gemCapIcon--workbench::after{background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.10), transparent 62%)}

.gemCards--cap .gemCard__k{margin-top: 12px}
.gemCards--cap .gemCard{padding: 14px}
.gemCards--cap .gemCard__t{font-size: 17px}
.gemCards--cap .gemCard__d{
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.gemCard__k--main{
  margin-top: 10px;
  font-size: 14px;
  letter-spacing: .35px;
  text-transform: none;
  color: rgba(246,247,255,.94);
  font-weight: 900;
}

.gemCapTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 10px;
}
.gemCapViz{
  width: 116px;
  height: 44px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.gemCapSvg{width: 100%; height: 100%; display:block}
.gemCapSvg *{
  vector-effect: non-scaling-stroke;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.gemCapSvg .capBox,
.gemCapSvg .capStep{
  stroke: rgba(255,255,255,.22);
  fill: rgba(255,255,255,.03);
}
.gemCapSvg .capWave{
  stroke: rgba(34,211,238,.90);
  stroke-width: 2.2;
  stroke-dasharray: 80 80;
  animation: capDash 2.8s ease-in-out infinite;
}
.gemCapSvg .capScan{
  stroke: rgba(34,211,238,.45);
  stroke-width: 2;
  stroke-dasharray: 56 56;
  animation: capScan 2.2s ease-in-out infinite;
}
.gemCapSvg .capLens,
.gemCapSvg .capHandle{
  stroke: rgba(255,255,255,.72);
  stroke-width: 2;
}
.gemCapSvg .capShield{
  stroke: rgba(124,92,255,.88);
  stroke-width: 2.2;
  fill: rgba(124,92,255,.08);
}
.gemCapSvg .capCheck{
  stroke: rgba(255,255,255,.86);
  stroke-width: 2.6;
  stroke-dasharray: 28 28;
  animation: capCheck 2.4s ease-in-out infinite;
}
.gemCapSvg .capPulse{
  stroke: rgba(124,92,255,.38);
  stroke-width: 2;
  stroke-dasharray: 6 8;
  animation: capPulse 1.8s ease-in-out infinite;
}
.gemCapSvg .capHorn{stroke: rgba(255,255,255,.72); stroke-width: 2; fill: rgba(255,255,255,.04)}
.gemCapSvg .capSound{stroke: rgba(255,79,216,.62); stroke-width: 2; animation: capSound 2.2s ease-in-out infinite}
.gemCapSvg .capSound2{stroke: rgba(255,79,216,.40); stroke-width: 2; animation: capSound 2.2s ease-in-out infinite .25s}
.gemCapSvg .capArrow{stroke: rgba(255,255,255,.78); stroke-width: 2; stroke-dasharray: 46 46; animation: capArrow 2.4s ease-in-out infinite}
.gemCapSvg .capDot{stroke: rgba(255,255,255,.24); stroke-width: 2}
.gemCapSvg .capNode{fill: rgba(255,255,255,.78)}
.gemCapSvg .capPing{stroke: rgba(52,211,153,.40); stroke-width: 2; opacity:.0; transform-origin: 86px 22px; animation: capPing 2.4s ease-out infinite}
.gemCapSvg .capSide{stroke-width: 2; fill: rgba(255,255,255,.02)}
.gemCapSvg .capRed{stroke: rgba(239,68,68,.80)}
.gemCapSvg .capBlue{stroke: rgba(59,130,246,.80)}
.gemCapSvg .capVs{stroke: rgba(255,255,255,.46); stroke-width: 2.2}
.gemCapSvg .capBolt{stroke-width: 2.2; stroke-dasharray: 16 16; animation: capDash 2.0s ease-in-out infinite}
.gemCapSvg .capLink{stroke: rgba(255,255,255,.38); stroke-width: 2}
.gemCapSvg .capPipe{stroke: rgba(255,255,255,.28); stroke-width: 2}
.gemCapSvg .capDotMove{fill: rgba(34,211,238,.88); animation: capMove 2.6s ease-in-out infinite}

@keyframes capDash{0%{stroke-dashoffset: 80}55%{stroke-dashoffset: 0}100%{stroke-dashoffset: 0}}
@keyframes capScan{0%{stroke-dashoffset: 56; opacity:.2}55%{stroke-dashoffset: 0; opacity:.9}100%{stroke-dashoffset: 0; opacity:.9}}
@keyframes capCheck{0%{stroke-dashoffset: 28; opacity:.2}55%{stroke-dashoffset: 0; opacity:1}100%{stroke-dashoffset: 0; opacity:1}}
@keyframes capPulse{0%{opacity:.35}50%{opacity:.85}100%{opacity:.35}}
@keyframes capSound{0%{opacity:.15}50%{opacity:.75}100%{opacity:.15}}
@keyframes capArrow{0%{stroke-dashoffset: 46; opacity:.25}55%{stroke-dashoffset: 0; opacity:1}100%{stroke-dashoffset: 0; opacity:1}}
@keyframes capPing{0%{transform: scale(.6); opacity:0}35%{opacity:.6}70%{transform: scale(1.25); opacity:0}100%{opacity:0}}
@keyframes capMove{0%{transform: translateX(0)}55%{transform: translateX(74px)}100%{transform: translateX(74px)}}

@media (prefers-reduced-motion: reduce){
  .gemCapSvg .capWave,
  .gemCapSvg .capScan,
  .gemCapSvg .capCheck,
  .gemCapSvg .capPulse,
  .gemCapSvg .capSound,
  .gemCapSvg .capSound2,
  .gemCapSvg .capArrow,
  .gemCapSvg .capPing,
  .gemCapSvg .capBolt,
  .gemCapSvg .capDotMove{animation:none}
}

.gemCard::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(280px 160px at 20% 10%, rgba(124,92,255,.14), transparent 60%),
    radial-gradient(280px 160px at 80% 30%, rgba(34,211,238,.10), transparent 60%),
    radial-gradient(260px 160px at 60% 80%, rgba(255,79,216,.08), transparent 60%);
  opacity:.75;
  pointer-events:none;
}
.gemCard::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(120deg, transparent 10%, rgba(255,255,255,.08) 34%, transparent 58%);
  transform: translateX(-70%);
  transition: transform .55s ease;
  opacity:.55;
  pointer-events:none;
}
.gemCard:hover{
  transform: translateY(-2px);
  background: rgba(255,255,255,.045);
  border-color: rgba(255,255,255,.16);
}
.gemCard:hover::after{transform: translateX(70%)}
.gemCard__k{color: rgba(167,176,200,.92); font-size:12px}
.gemCard__t{margin-top:10px; font-weight:900; letter-spacing:-.2px}
.gemCard__d{margin-top:8px; color: rgba(167,176,200,.96); line-height:1.75}

.gemLogoWall{display:grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap:10px}
.gemLogoItem{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  border-radius: 22px;
  min-height: 86px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 16px 12px;
}
.gemLogo{width:100%; max-width: 172px; max-height: 38px; object-fit:contain; filter: grayscale(1) contrast(1.05) brightness(1.1); opacity:.90}

/* network map */
.gemNetwork{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  align-items: stretch;
}
.gemMapCard{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  border-radius: 24px;
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height: 560px;
}
.gemMapCard--hero{padding: 16px}
.gemMapCard::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 20% 18%, rgba(124,92,255,.12), transparent 60%),
    radial-gradient(520px 260px at 82% 30%, rgba(34,211,238,.10), transparent 60%),
    radial-gradient(520px 260px at 60% 70%, rgba(255,79,216,.08), transparent 60%);
  opacity:.75;
  pointer-events:none;
}
.gemMapCard__head{position:relative; display:flex; justify-content:space-between; gap:14px; align-items:flex-start; margin-bottom:12px}
.gemMapCard__head{min-height: 96px}
.gemMapCard__t{margin-top:10px; font-weight:1000; letter-spacing:-.35px; font-size:20px}
.gemMapCard__sub{margin-top:8px; color: rgba(167,176,200,.92); font-size:12.5px; line-height:1.5}
.gemMapStats{display:grid; grid-template-columns: 1fr 1fr; gap:10px; min-width: 220px}
.gemStat{
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 16px;
  padding: 10px 12px;
}
.gemStat__k{color: rgba(167,176,200,.92); font-size:12px}
.gemStat__v{margin-top:6px; font-weight:950; letter-spacing:-.2px}
.gemMap{
  position:relative;
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.22);
  overflow:hidden;
  flex: 1;
  min-height: 420px;
}
.gemMap::before{
  content:"";
  position:absolute; inset:0;
  background:
    radial-gradient(820px 420px at 50% 20%, rgba(124,92,255,.10), transparent 55%),
    radial-gradient(820px 420px at 18% 82%, rgba(34,211,238,.10), transparent 55%),
    radial-gradient(820px 420px at 88% 70%, rgba(255,79,216,.08), transparent 58%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.06) 0 1px, transparent 1px 40px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.05) 0 1px, transparent 1px 40px);
  opacity:.35;
  pointer-events:none;
  mix-blend-mode: screen;
}
.gemMap::after{
  content:"";
  position:absolute; inset:-30%;
  background: radial-gradient(closest-side, rgba(34,211,238,.14), transparent 60%);
  filter: blur(18px);
  opacity:.45;
  transform: translate3d(var(--mx,0px), var(--my,0px), 0);
  transition: transform .18s ease;
  pointer-events:none;
}
.gemMapE{
  position:absolute;
  inset: 10px 10px 10px 10px;
  width: calc(100% - 20px);
  height: calc(100% - 20px);
  opacity: .96;
  filter: grayscale(.15) contrast(1.05) brightness(1.05);
  pointer-events:none;
}
.gemPin{
  position:absolute;
  width: 10px;
  height: 10px;
  border-radius: 999px;
  transform: translate(-50%, -50%);
  background: rgba(34,211,238,1);
  box-shadow: 0 0 0 10px rgba(34,211,238,.10), 0 0 34px rgba(34,211,238,.35);
  cursor: pointer;
}
.gemPin::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:999px;
  border:1px solid rgba(34,211,238,.20);
  opacity:.5;
}
.gemPin::before{
  content:"";
  position:absolute;
  inset:-2px;
  border-radius:999px;
  background: rgba(34,211,238,.22);
  filter: blur(6px);
  opacity:.55;
}
.gemTip{
  position:absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, calc(-100% - 10px));
  padding: 8px 10px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.72);
  color: rgba(246,247,255,.94);
  font-size: 12px;
  white-space: nowrap;
  opacity: 0;
  pointer-events:none;
  transition: opacity .12s ease, transform .12s ease;
}
.gemPin:hover .gemTip{opacity:1; transform: translate(-50%, calc(-100% - 12px))}
.gemMapLegend{position:relative; margin-top:10px; color: rgba(167,176,200,.92); font-size:12px; display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.gemMapLegend--overlay{
  position:absolute;
  left: 12px;
  bottom: 12px;
  margin-top:0;
  padding: 8px 10px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.55);
  backdrop-filter: blur(8px);
}
.gemLabel{
  position:absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  padding: 4px 8px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(5,6,11,.62);
  color: rgba(246,247,255,.92);
  font-size: 11px;
  white-space: nowrap;
  opacity: .95;
  pointer-events:none;
}
.gemMap[data-dense="1"] .gemLabel{opacity:0; transform: translateY(-50%) scale(.98)}
.gemPin:hover .gemLabel{opacity:1}
.gemLegendSep{opacity:.7}
.gemLegendHint{opacity:.92}
.gemDot{width:10px;height:10px;border-radius:999px; display:inline-block}
.gemDot--a{background: rgba(34,211,238,1); box-shadow: 0 0 0 8px rgba(34,211,238,.10)}

.gemNetwork__side{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.02);
  border-radius: 24px;
  padding: 14px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  min-height: 560px;
}
.gemNetwork__side::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(520px 260px at 25% 20%, rgba(124,92,255,.10), transparent 60%),
    radial-gradient(520px 260px at 72% 62%, rgba(34,211,238,.08), transparent 60%);
  opacity:.8;
  pointer-events:none;
}
.gemSideHead{position:relative; display:flex; justify-content:space-between; gap:10px; align-items:baseline; margin-bottom:10px; min-height: 96px}
.gemSideHead__t{font-weight:950; letter-spacing:-.2px}
.gemSideHead__sub{color: rgba(167,176,200,.92); font-size:12px}

/* agents list (v6) */
.gemLogoWall[data-home-partners]{
  grid-template-columns: 1fr;
  gap: 10px;
  --agent-card-h: 122px;
  --agent-gap: 10px;
  max-height: calc((var(--agent-card-h) * 3) + (var(--agent-gap) * 2));
  overflow: auto;
  padding-right: 6px;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,1) 0, rgba(0,0,0,1) 86%, rgba(0,0,0,0) 100%);
  position: relative;
}
.gemLogoWall[data-home-partners]::after{
  content:"";
  position:absolute;
  left: 50%;
  bottom: 10px;
  width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.22);
  background:
    radial-gradient(22px 22px at 50% 40%, rgba(34,211,238,.26), rgba(124,92,255,.18) 45%, rgba(5,6,11,.62) 78%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='rgba(246,247,255,0.92)' stroke-width='2.3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 14l6 6 6-6'/%3E%3Cpath d='M10 8l6 6 6-6' opacity='0.62'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position: center;
  box-shadow: 0 14px 34px rgba(0,0,0,.32), 0 0 0 6px rgba(34,211,238,.10);
  opacity: .98;
  pointer-events:none;
  animation: gemScrollHint 1.35s ease-in-out infinite;
}
.gemLogoWall[data-home-partners][data-scrolled="1"]::after{
  opacity: 0;
  transform: translate(-50%, 10px);
  animation: none;
}
@keyframes gemScrollHint{
  0%, 100% { transform: translate(-50%, 0); }
  50% { transform: translate(-50%, 5px); }
}
.gemAgent{
  position:relative;
  display:block;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  border-radius: 20px;
  padding: 12px;
  color: rgba(246,247,255,.94);
  text-decoration:none;
  transition: transform .12s ease, border-color .12s ease, background .12s ease;
  min-height: var(--agent-card-h);
}
.gemAgent:hover{transform: translateY(-2px); border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.04)}
.gemAgent__top{display:flex; gap:12px; align-items:center}
.gemAgent__logo{width:44px; height:44px; border-radius: 14px; border:1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.03); display:flex; align-items:center; justify-content:center; overflow:hidden; flex: 0 0 auto}
.gemAgent__img{width:100%; height:100%; object-fit:contain; padding: 8px; filter: grayscale(1) contrast(1.05) brightness(1.15); opacity:.95}
.gemAgent__img--text{display:flex; align-items:center; justify-content:center; padding:0; font-weight:950; letter-spacing:-.2px; filter:none; opacity:1}
.gemAgent__meta{min-width:0; flex:1}
.gemAgent__name{font-weight:950; letter-spacing:-.25px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.gemAgent__city{margin-top:4px; color: rgba(167,176,200,.92); font-size:12px}
.gemAgent__rows{margin-top:10px; display:grid; gap:8px}
.gemAgent__row{display:flex; gap:10px; align-items:flex-start}
.gemAgent__k{color: rgba(167,176,200,.92); font-size:12px; flex: 0 0 34px}
.gemAgent__v{color: rgba(246,247,255,.92); font-size:12px; line-height:1.45; flex:1; min-width:0}
.gemAgent__v a{color: rgba(34,211,238,.92); text-decoration:none}
.gemAgent__v a:hover{text-decoration:underline}

@media (max-width: 820px){
  .gemLogoWall[data-home-partners]{--agent-card-h: 132px}
}

.gemNewsGrid{display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px}
.gemNews{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.035);
  border-radius: 24px;
  padding: 16px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease;
  display:grid;
  grid-template-columns: 116px 1fr;
  gap: 12px;
  align-items: start;
  overflow:hidden;
}
.gemNews:hover{transform: translateY(-2px); background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.14)}
.gemNews__media{
  border-radius: 18px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(5,6,11,.22);
  overflow:hidden;
  aspect-ratio: 16 / 11;
}
.gemNews__img{
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
  filter: saturate(1.05) contrast(1.02) brightness(1.02);
  opacity:.96;
}
.gemNews__body{
  min-width:0;
  display:flex;
  flex-direction:column;
}
.gemNews__top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:10px;
  order: 3; /* below title/desc so title aligns with image top */
}
.gemBadge{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  color: rgba(167,176,200,.98);
  font-size:12px;
}
.gemDate{color: rgba(167,176,200,.90); font-size:12px}
.gemNews__t{
  font-weight:900;
  letter-spacing:-.2px;
  line-height:1.35;
  order: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gemNews__d{
  margin-top:10px;
  color: rgba(167,176,200,.98);
  line-height:1.7;
  order: 2;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(5,6,11,.28);
  border-radius: 16px;
  padding: 10px 12px;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

/* CTA band */
.gemCta{
  border-radius: var(--v6-radius2);
  border:1px solid rgba(255,255,255,.14);
  background: linear-gradient(135deg, rgba(124,92,255,.14), rgba(34,211,238,.10), rgba(255,79,216,.10));
  box-shadow: var(--v6-shadow);
  padding: 22px;
  position:relative;
  overflow:hidden;
}
.gemCta::before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(820px 320px at 18% 22%, rgba(124,92,255,.22), transparent 60%),
    radial-gradient(820px 320px at 82% 30%, rgba(34,211,238,.18), transparent 60%),
    radial-gradient(820px 320px at 56% 80%, rgba(255,79,216,.14), transparent 62%);
  opacity:.75;
  pointer-events:none;
}
.gemCta__grid{
  position:relative;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 14px;
  align-items:center;
}
.gemCta__t{margin:0 0 8px; font-size: 28px; letter-spacing:-.4px}
.gemCta__d{margin:0; color: rgba(167,176,200,.98); line-height: 1.75}
.gemCta__actions{display:flex; gap:12px; justify-content:flex-end; flex-wrap:wrap}

/* Make existing "contact" section match v6 */
.v6 .section{
  padding: 84px 0;
  position:relative;
  overflow:hidden;
}
.v6 .section::before{
  content:"";
  position:absolute;
  inset:-140px -120px auto -120px;
  height: 420px;
  pointer-events:none;
  background:
    radial-gradient(620px 260px at 18% 20%, rgba(124,92,255,.10), transparent 62%),
    radial-gradient(620px 260px at 78% 30%, rgba(34,211,238,.08), transparent 62%),
    radial-gradient(620px 260px at 52% 70%, rgba(255,79,216,.06), transparent 62%);
  opacity:.9;
}
.v6 .contact{
  border:1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.03);
  border-radius: var(--v6-radius2);
  box-shadow: var(--v6-shadow);
  padding: 18px;
}
.v6 .contact__copy{
  padding: 6px 6px 6px 10px;
}
.v6 .form{border-color: rgba(255,255,255,.10); background: rgba(5,6,11,.22)}
.v6 .field__input{
  border-color: rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
}
.v6 .field__input:focus{
  border-color: rgba(34,211,238,.40);
  box-shadow: 0 0 0 4px rgba(34,211,238,.12);
}

@media (max-width: 1024px){
  .gemHero{padding: 70px 0 36px}
  .gemHero__grid{grid-template-columns: 1fr}
  .gemTitle{font-size: 44px}
  .gemBanner{padding: 70px 0 36px}
  .gemBanner__grid{grid-template-columns: 1fr}
  .gemBanner__title{font-size: 46px}
  .tile--lg{grid-column: span 6}
  .tile--md{grid-column: span 6}
  .tile--sm{grid-column: span 3}
  .gemCard{grid-column: span 12}
  .gemLogoWall{grid-template-columns: repeat(3, minmax(0,1fr))}
  .gemNewsGrid{grid-template-columns: 1fr}
  .gemNews{grid-template-columns: 1fr; gap: 10px}
  .gemNews__media{aspect-ratio: 16 / 9}
  .gemNetwork{grid-template-columns: 1fr}
  .gemCta__grid{grid-template-columns: 1fr}
  .gemCta__actions{justify-content:flex-start}
  .gemMapStats{grid-template-columns: 1fr 1fr; min-width: 0}
  .gemTube{grid-template-columns: 1fr}
  .gemShelf{grid-template-columns: 1fr}
  .gemQuoteStack__kpi{grid-template-columns: 1fr 1fr}
}
@media (max-width: 820px){
  .gemTitle{font-size: 36px}
  .gemBanner__title{font-size: 38px}
  .tile--sm{grid-column: span 6}
  .gemLogoWall{grid-template-columns: repeat(2, minmax(0,1fr))}
  .v6 .header__actions{gap:8px}
  .v6 .header__actions .btn{padding:8px 10px; font-size:13px}
}

