/* =====================================================
   MetaCore Astral Dome · Crystal Edition
   crystal.metacore.lt
   Rebuild CSS v2026-05
===================================================== */

:root {
  --bg: #030712;
  --bg2: #07111f;
  --panel: rgba(8, 16, 31, 0.74);
  --panel2: rgba(255, 255, 255, 0.055);
  --line: rgba(255,255,255,0.11);
  --line2: rgba(0, 240, 255, 0.24);
  --text: #f8fafc;
  --muted: #a9b4c7;
  --soft: #d6e2f4;
  --cyan: #00f0ff;
  --blue: #38bdf8;
  --purple: #a855f7;
  --pink: #ec4899;
  --green: #34d399;
  --gold: #fbbf24;
  --danger: #fb7185;
  --radius: 28px;
  --shadow: 0 30px 90px rgba(0,0,0,.44);
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  background: var(--bg);
}

body {
  margin: 0;
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background:
    radial-gradient(circle at 20% 10%, rgba(0,240,255,.18), transparent 32%),
    radial-gradient(circle at 80% 20%, rgba(168,85,247,.16), transparent 32%),
    radial-gradient(circle at 50% 100%, rgba(56,189,248,.10), transparent 34%),
    linear-gradient(180deg, #020617 0%, #030712 45%, #000 100%);
  color: var(--text);
  overflow-x: hidden;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    linear-gradient(rgba(0,240,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(0,240,255,.035) 1px, transparent 1px);
  background-size: 54px 54px;
  mask-image: linear-gradient(to bottom, rgba(0,0,0,.85), transparent 90%);
  z-index: -1;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

.container {
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
}

/* =====================================================
   NAV
===================================================== */

.topbar {
  position: sticky;
  top: 0;
  z-index: 50;
  backdrop-filter: blur(18px);
  background: rgba(2, 6, 23, 0.82);
  border-bottom: 1px solid rgba(255,255,255,.08);
  --topbar-h: 74px;
}

.topbar-inner {
  height: var(--topbar-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
}

.brand {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
}

.brand-mark {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  background:
    radial-gradient(circle at 35% 30%, #fff, transparent 20%),
    linear-gradient(135deg, var(--cyan), var(--purple));
  box-shadow: 0 0 30px rgba(0,240,255,.24);
  position: relative;
  flex: 0 0 auto;
}

.brand-mark::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 50%;
}

.brand-title {
  font-family: Orbitron, sans-serif;
  font-weight: 900;
  letter-spacing: -0.04em;
  font-size: 1.18rem;
  line-height: 1;
}

.brand-sub {
  margin-top: 4px;
  color: var(--muted);
  font-size: .68rem;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.topbar-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
  flex-shrink: 0;
}

.nav {
  display: flex;
  align-items: center;
  gap: 8px;
  color: #b8c1d2;
  font-size: .78rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.nav a {
  padding: 10px 12px;
  border-radius: 12px;
  transition: .2s ease;
}

.nav a:hover,
.nav a.is-active {
  background: rgba(255,255,255,.07);
  color: white;
}

.nav-cta {
  border: 1px solid rgba(0,240,255,.28);
  color: var(--cyan) !important;
  background: rgba(0,240,255,.07);
}

.nav-lang {
  margin-left: 10px;
  align-self: center;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #9df7ff;
  border: 1px solid rgba(255,255,255,.14);
  padding: 8px 12px;
  border-radius: 999px;
}

.nav-lang:hover {
  border-color: rgba(0,240,255,.45);
  color: #fff;
}

/* details mobile nav */
.mobile-menu {
  display: none;
  position: relative;
  z-index: 10020;
}

.mobile-menu-summary {
  list-style: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 54px;
  height: 54px;
  border-radius: 18px;
  border: 1px solid rgba(125,211,252,.45);
  background: rgba(15,23,42,.76);
  box-shadow: 0 12px 35px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.06);
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(103,232,249,.25);
  user-select: none;
}

.mobile-menu-summary::-webkit-details-marker {
  display: none;
}

.mobile-menu-icon,
.mobile-menu-icon::before,
.mobile-menu-icon::after {
  display: block;
  width: 26px;
  height: 3px;
  border-radius: 99px;
  background: #fff;
  box-shadow: 0 0 14px rgba(103,232,249,.55);
  content: "";
  position: relative;
  transition: transform .22s ease, opacity .22s ease;
}

.mobile-menu-icon::before {
  position: absolute;
  top: -8px;
  left: 0;
}

.mobile-menu-icon::after {
  position: absolute;
  top: 8px;
  left: 0;
}

.mobile-menu[open] .mobile-menu-icon {
  background: transparent;
  box-shadow: none;
}

.mobile-menu[open] .mobile-menu-icon::before {
  transform: translateY(8px) rotate(45deg);
}

.mobile-menu[open] .mobile-menu-icon::after {
  transform: translateY(-8px) rotate(-45deg);
}

.mobile-menu-panel {
  position: fixed;
  top: var(--topbar-h);
  left: 0;
  right: 0;
  z-index: 10010;
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 14px 20px 22px;
  background: rgba(2,6,23,.98);
  border-bottom: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 28px 60px rgba(0,0,0,.48);
}

.mobile-menu-panel a {
  display: block;
  padding: 15px 16px;
  border-radius: 16px;
  color: rgba(226,232,240,.92);
  font-weight: 900;
  letter-spacing: .04em;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.035);
}

.mobile-menu-panel a.nav-cta {
  color: #020617 !important;
  background: linear-gradient(135deg,#22d3ee,#60a5fa,#a78bfa);
  border-color: transparent;
}

/* =====================================================
   BASE LAYOUT
===================================================== */

section {
  padding: 82px 0;
  position: relative;
}

.hero {
  position: relative;
  padding: 88px 0 70px;
}

.hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(300px, .92fr);
  gap: clamp(32px, 4.5vw, 64px);
  align-items: center;
}

.hero-grid > div:first-child {
  min-width: 0;
}

.eyebrow,
.install-kicker,
.tech-kicker,
.crystal-hero-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(0,240,255,.22);
  border-radius: 999px;
  background: rgba(0,240,255,.07);
  color: var(--cyan);
  font-weight: 900;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 26px;
  box-shadow: 0 0 32px rgba(0,240,255,.08);
}

.eyebrow-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 16px var(--cyan);
}

h1, h2, h3 {
  margin: 0;
}

h1 {
  font-family: Orbitron, sans-serif;
  font-size: clamp(2.45rem, 4.2vw + 1rem, 6.15rem);
  line-height: .94;
  letter-spacing: -0.065em;
  font-weight: 900;
  text-transform: uppercase;
  max-width: 100%;
  overflow-wrap: break-word;
}

h2 {
  font-family: Orbitron, sans-serif;
  font-size: clamp(2rem, 4.5vw, 4.5rem);
  line-height: 1;
  letter-spacing: -0.055em;
  text-transform: uppercase;
  font-weight: 900;
}

h3 {
  font-size: 1.22rem;
  font-weight: 900;
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.gradient {
  background: linear-gradient(90deg, #fff, var(--cyan), var(--purple), var(--pink));
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

.lead {
  margin: 28px 0 0;
  color: var(--soft);
  font-size: clamp(1.08rem, 2vw, 1.38rem);
  line-height: 1.6;
  max-width: 760px;
}

.lead strong {
  color: #fff;
}

.session-tagline,
.install-tagline,
.tech-tagline,
.crystal-tagline {
  max-width: 720px;
  margin: 20px 0 0;
  padding: 16px 20px;
  border-radius: 22px;
  border: 1px solid rgba(32,232,255,.22);
  background:
    radial-gradient(circle at 20% 0%, rgba(32,232,255,.14), transparent 48%),
    rgba(32,232,255,.055);
  color: #e8fbff;
  font-weight: 900;
  letter-spacing: .04em;
  line-height: 1.45;
}

.model-badge {
  display: inline-flex;
  margin-top: 18px;
  padding: 9px 13px;
  border-radius: 999px;
  border: 1px solid rgba(168,85,247,.28);
  background: rgba(168,85,247,.08);
  color: #d8b4fe;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 34px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 22px;
  border-radius: 16px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  font-size: .78rem;
  transition: .22s ease;
  border: 1px solid transparent;
}

.btn-primary {
  color: #001018;
  background: linear-gradient(90deg, var(--cyan), #60a5fa);
  box-shadow: 0 0 38px rgba(0,240,255,.28);
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 0 50px rgba(0,240,255,.38);
}

.btn-secondary {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.06);
  color: #fff;
}

.btn-secondary:hover {
  border-color: rgba(0,240,255,.34);
  background: rgba(0,240,255,.08);
}

.hero-note,
.note-line,
.source-note,
.price-note,
.technology-note,
.sources-mini {
  margin-top: 20px;
  color: #8ea0b8;
  font-size: .93rem;
  line-height: 1.6;
  max-width: 760px;
}

.hero-media {
  position: relative;
  min-width: 0;
}

.hero-card,
.panel {
  position: relative;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.05);
  box-shadow: var(--shadow);
}

.hero-card img {
  width: 100%;
  display: block;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

.panel img {
  width: 100%;
  display: block;
  object-fit: cover;
  aspect-ratio: 4 / 3;
}

.hero-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, transparent 54%, rgba(0,0,0,.56)),
    radial-gradient(circle at 50% 15%, rgba(0,240,255,.16), transparent 36%);
  pointer-events: none;
}

.floating-status {
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 18px;
  z-index: 3;
  padding: 16px;
  border-radius: 22px;
  border: 1px solid rgba(0,240,255,.24);
  background: rgba(2,8,23,.72);
  backdrop-filter: blur(18px);
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}

.status-item {
  padding: 10px;
  border-radius: 16px;
  background: rgba(255,255,255,.055);
  text-align: center;
}

.status-k {
  color: var(--muted);
  font-size: .64rem;
  text-transform: uppercase;
  letter-spacing: .14em;
  font-weight: 800;
}

.status-v {
  margin-top: 5px;
  color: #fff;
  font-family: Orbitron, sans-serif;
  font-size: .9rem;
  font-weight: 900;
}

.section-head {
  max-width: 900px;
  margin: 0 auto 38px;
  text-align: center;
}

.section-kicker {
  color: var(--cyan);
  font-weight: 900;
  letter-spacing: .18em;
  text-transform: uppercase;
  font-size: .72rem;
  margin-bottom: 14px;
}

.section-desc {
  color: var(--muted);
  font-size: 1.08rem;
  line-height: 1.7;
  margin: 22px auto 0;
  max-width: 830px;
}

.grid-3,
.subgrid,
.program-grid,
.edition-grid,
.node-tech-grid,
.architecture-grid,
.data-grid,
.package-grid,
.process-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.grid-4 {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
}

.split {
  display: grid;
  grid-template-columns: .92fr 1.08fr;
  gap: 34px;
  align-items: center;
}

.card,
.protocol-card,
.difference-card,
.node-intro-card,
.tech-spec-card,
.package-card,
.process-step,
.flow-step,
.control-item,
.crystal-mini,
.field-card {
  border: 1px solid rgba(255,255,255,.11);
  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.035));
  border-radius: var(--radius);
  padding: 26px;
  box-shadow: 0 16px 56px rgba(0,0,0,.22);
  position: relative;
  overflow: hidden;
}

.card::before,
.protocol-card::before,
.node-intro-card::before,
.package-card::before,
.flow-step::before,
.field-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 0%, rgba(0,240,255,.08), transparent 42%);
  pointer-events: none;
}

.card > *,
.protocol-card > *,
.node-intro-card > *,
.package-card > *,
.flow-step > *,
.field-card > * {
  position: relative;
  z-index: 1;
}

.card p,
.protocol-card p,
.node-intro-card p,
.package-card p {
  color: var(--muted);
  line-height: 1.65;
  margin: 13px 0 0;
  font-size: .98rem;
}

.icon,
.layer-num,
.flow-num,
.process-num,
.field-num,
.mini-icon {
  width: 48px;
  height: 48px;
  border-radius: 17px;
  background: linear-gradient(135deg, rgba(0,240,255,.22), rgba(168,85,247,.18));
  border: 1px solid rgba(0,240,255,.18);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  font-weight: 900;
  margin-bottom: 18px;
  color: #e9feff;
}

.tag,
.program-tag,
.diff-label {
  display: inline-flex;
  width: fit-content;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.22);
  color: var(--cyan);
  background: rgba(0,240,255,.06);
  font-size: .67rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
  margin-bottom: 16px;
}

/* =====================================================
   FEATURE LISTS
===================================================== */

.feature-list,
.install-list,
.engine-flow {
  display: grid;
  gap: 14px;
  margin-top: 24px;
}

.feature,
.install-item,
.engine-step,
.ring {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  background: rgba(255,255,255,.045);
}

.check,
.install-dot,
.ring-dot {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(52,211,153,.14);
  color: var(--green);
  flex: 0 0 auto;
  font-weight: 900;
}

.feature b,
.install-item b,
.engine-step b,
.ring b {
  display: block;
  color: white;
  margin-bottom: 4px;
}

.feature span,
.install-item span,
.engine-step,
.ring span {
  color: var(--muted);
  line-height: 1.55;
  font-size: .96rem;
}

/* =====================================================
   TABLES — modern wrappers
===================================================== */

table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  overflow: hidden;
}

.protocol-table,
.field-table,
.session-map,
.hardware-table,
.stone-table,
.matrix,
.matrix-table,
.business-matrix {
  margin-top: 34px;
  border: 1px solid rgba(0,240,255,.16);
  border-radius: 28px;
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.10), transparent 40%),
    rgba(255,255,255,.04);
  box-shadow: 0 24px 80px rgba(0,0,0,.26);
}

.protocol-table th,
.field-table th,
.session-map th,
.hardware-table th,
.stone-table th,
.matrix th,
.matrix-table th,
.business-matrix th {
  padding: 18px 18px;
  text-align: left;
  color: var(--cyan);
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-bottom: 1px solid rgba(255,255,255,.10);
  background: rgba(0,240,255,.055);
}

.protocol-table td,
.field-table td,
.session-map td,
.hardware-table td,
.stone-table td,
.matrix td,
.matrix-table td,
.business-matrix td {
  padding: 18px 18px;
  color: #dbeafe;
  line-height: 1.55;
  border-bottom: 1px solid rgba(255,255,255,.075);
  vertical-align: top;
}

.protocol-table tr:last-child td,
.field-table tr:last-child td,
.session-map tr:last-child td,
.hardware-table tr:last-child td,
.stone-table tr:last-child td,
.matrix tr:last-child td,
.matrix-table tr:last-child td,
.business-matrix tr:last-child td {
  border-bottom: 0;
}

.protocol-table td:first-child,
.field-table td:first-child,
.session-map td:first-child,
.hardware-table td:first-child,
.stone-table td:first-child,
.matrix td:first-child,
.matrix-table td:first-child,
.business-matrix td:first-child {
  color: #fff;
  font-weight: 900;
}

/* =====================================================
   KRISTALAI PAGE
===================================================== */

.crystal-v2-section {
  position: relative;
}

.crystal-protocol-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.crystal-core-line,
.node-punch,
.difference-punch,
.package-note {
  max-width: 980px;
  margin: 32px auto 0;
  padding: 22px 24px;
  border-radius: 26px;
  border: 1px solid rgba(32,232,255,.2);
  background:
    radial-gradient(circle at 50% 0%, rgba(32,232,255,.12), transparent 45%),
    rgba(32,232,255,.055);
  color: #dbeafe;
  text-align: center;
  line-height: 1.65;
  font-size: 1.04rem;
}

.crystal-core-line strong,
.node-punch strong,
.difference-punch strong {
  color: #fff;
}

.catalog-human-card {
  border: 1px solid rgba(0,240,255,.20);
  border-radius: 30px;
  padding: 26px;
  background:
    radial-gradient(circle at 0% 0%, rgba(0,240,255,.12), transparent 42%),
    linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.03));
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
}

.catalog-human-card h3 {
  margin: 8px 0 12px;
  color: #fff;
}

.catalog-human-card p {
  margin: 0;
  color: #cbd8f2;
  line-height: 1.65;
}

.catalog-human-card figure {
  margin: 22px 0 0;
  border-radius: 24px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
}

.catalog-human-card img {
  display: block;
  width: 100%;
  height: auto;
}

.language-split {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 20px;
}

.language-card.safe {
  border-color: rgba(52,211,153,.25);
  background: linear-gradient(145deg,rgba(52,211,153,.075),rgba(255,255,255,.025));
}

.language-card.caution {
  border-color: rgba(251,191,36,.25);
  background: linear-gradient(145deg,rgba(251,191,36,.075),rgba(255,255,255,.025));
}

.language-card.no {
  border-color: rgba(251,113,133,.25);
  background: linear-gradient(145deg,rgba(251,113,133,.075),rgba(255,255,255,.025));
}

.crystal-dashboard-grid,
.dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 12px;
}

.crystal-dashboard-grid div,
.dashboard-grid div {
  padding: 16px 15px;
  border-radius: 18px;
  border: 1px solid rgba(32,232,255,.16);
  background: rgba(32,232,255,.055);
  color: #e7efff;
  font-weight: 900;
  line-height: 1.35;
}

.what-modern {
  padding-top: 92px;
}

.node-intro-grid {
  display: grid;
  grid-template-columns: minmax(0,.92fr) minmax(420px,1.08fr);
  gap: 44px;
  align-items: start;
  margin-top: 34px;
}

.node-intro-grid.is-fullwidth {
  grid-template-columns: 1fr;
  max-width: 1320px;
  margin-left: auto;
  margin-right: auto;
}

.node-intro-copy {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 18px;
}

.node-intro-card h3 {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.08rem;
  margin: 0 0 14px;
}

.node-visual-card {
  overflow: hidden;
  border-radius: 30px;
  border: 1px solid rgba(32,232,255,.24);
  background: rgba(255,255,255,.045);
  box-shadow: 0 0 70px rgba(32,232,255,.12);
  margin: 10px auto 0;
}

.node-visual-card.is-wide {
  width: min(100%,1280px);
}

.node-visual-card img {
  width: 100%;
  aspect-ratio: 16 / 8.4;
  object-fit: cover;
  display: block;
}

.node-visual-caption {
  padding: 18px 24px;
  color: #dbeafe;
  background: linear-gradient(90deg,rgba(0,240,255,.08),rgba(168,85,247,.14));
  line-height: 1.55;
  font-weight: 700;
}

.node-layer-formula {
  margin: 34px auto 0;
  max-width: 1100px;
  padding: 26px;
  border-radius: 30px;
  border: 1px solid rgba(32,232,255,.20);
  background:
    radial-gradient(circle at 50% 0%,rgba(32,232,255,.10),transparent 45%),
    rgba(255,255,255,.045);
}

.node-layer-formula p {
  color: #dbeafe;
  line-height: 1.65;
  text-align: center;
  font-size: 1.03rem;
  margin: 0 0 18px;
}

.node-layer-formula span {
  display: block;
  color: var(--cyan);
  font-weight: 900;
  margin-top: 8px;
}

.node-mini-stack {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

.node-mini-stack div {
  padding: 10px 12px;
  border-radius: 999px;
  border: 1px solid rgba(32,232,255,.18);
  background: rgba(32,232,255,.06);
  color: #dbeafe;
  font-weight: 900;
  font-size: .82rem;
}

/* Crystal map cards */
.crystal-map-section .section-head {
  margin-bottom: 0;
}

.crystal-fields-grid {
  display: grid;
  grid-template-columns: repeat(7,minmax(0,1fr));
  gap: 14px;
  width: 100%;
  margin: 44px auto 0;
}

.field-card {
  min-height: 210px;
  padding: 22px 18px 20px;
}

.field-card::after {
  content: "";
  position: absolute;
  inset: auto 18px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg,#20e8ff,#7c6cff,#ec4899);
  opacity: .65;
}

.field-num {
  width: 34px;
  height: 34px;
  border-radius: 14px;
  margin-bottom: 14px;
  color: #06111b;
  background: linear-gradient(135deg,#20e8ff,#9df7ff);
  box-shadow: 0 0 28px rgba(32,232,255,.24);
}

.field-card h3 {
  margin: 0 0 10px;
  color: #fff;
  font-size: 1rem;
}

.field-card p {
  margin: 0;
  color: #b9c8e5;
  line-height: 1.55;
  font-size: .92rem;
}

.crystal-final-quote {
  padding: 38px 34px;
  border-radius: 34px;
  border: 1px solid rgba(32,232,255,.22);
  background:
    radial-gradient(circle at 50% 0%,rgba(168,85,247,.16),transparent 48%),
    rgba(255,255,255,.055);
  box-shadow: 0 0 80px rgba(32,232,255,.10);
  text-align: center;
  color: #dbeafe;
  font-size: clamp(1.2rem,2vw,1.65rem);
  line-height: 1.55;
}

.crystal-final-quote strong {
  display: block;
  color: #fff;
  font-family: Orbitron,sans-serif;
  text-transform: uppercase;
  letter-spacing: -.035em;
  margin-bottom: 10px;
}

/* Intention engine */
.intent-shell {
  max-width: 980px;
  margin: 34px auto 0;
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: 18px;
  align-items: stretch;
}

.intent-buttons {
  display: grid;
  gap: 10px;
}

.intent-buttons button {
  border: 1px solid rgba(0,240,255,.18);
  background: rgba(255,255,255,.055);
  color: #e8f8ff;
  border-radius: 18px;
  padding: 15px 16px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  cursor: pointer;
}

.intent-buttons button:hover,
.intent-buttons button.is-active {
  background: rgba(0,240,255,.10);
  border-color: rgba(0,240,255,.42);
}

.intent-output {
  border: 1px solid rgba(0,240,255,.20);
  border-radius: 26px;
  padding: 26px;
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.12), transparent 42%),
    rgba(255,255,255,.055);
}

.intent-output h3 {
  color: #fff;
}

.intent-output p {
  color: var(--muted);
  line-height: 1.65;
}

.crystal-cards {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
  margin-top: 34px;
}

.crystal-mini {
  padding: 20px;
  min-height: 118px;
}

.crystal-mini b {
  display: block;
  color: #fff;
  margin-bottom: 8px;
}

.crystal-mini span {
  color: var(--muted);
  line-height: 1.55;
  font-size: .94rem;
}

/* =====================================================
   SESIJOS PAGE
===================================================== */

.flow-grid {
  display: grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap: 14px;
  margin-top: 38px;
}

.flow-step {
  min-height: 250px;
}

.flow-step b {
  display: block;
  color: #fff;
  font-size: 1.05rem;
  margin-bottom: 10px;
}

.flow-step span {
  color: var(--muted);
  line-height: 1.6;
  font-size: .95rem;
}

.flow-num {
  width: 42px;
  height: 42px;
  margin-bottom: 16px;
}

.control-panel,
.engine-panel,
.install-panel {
  margin-top: 26px;
  padding: 24px;
  border-radius: 28px;
  border: 1px solid rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.10), transparent 42%),
    rgba(255,255,255,.05);
}

.control-row {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 12px;
  margin-top: 18px;
}

.control-item {
  padding: 18px;
  border-radius: 20px;
}

.control-item small {
  display: block;
  color: var(--cyan);
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: .12em;
  margin-bottom: 7px;
}

.control-item strong {
  color: #fff;
  line-height: 1.4;
}

.program-grid {
  grid-template-columns: repeat(3,minmax(0,1fr));
}

.program-card {
  min-height: 250px;
  display: flex;
  flex-direction: column;
}

.program-card p {
  margin-bottom: auto;
}

/* =====================================================
   TECHNOLOGIJA PAGE
===================================================== */

.tech-intro-card {
  max-width: 1080px;
  margin: 56px auto 34px;
  padding: 28px 30px;
  border-radius: 30px;
  border: 1px solid rgba(0,240,255,.18);
  background: linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
}

.tech-intro-card p {
  margin: 0;
  color: #d8e7ff;
  font-size: clamp(1.02rem,2.1vw,1.28rem);
  line-height: 1.58;
  letter-spacing: -.015em;
}

.shielded-section {
  padding-top: 92px;
}

.shielded-quote {
  max-width: 1080px;
  margin: 0 auto 54px;
  padding: 28px 32px;
  border-radius: 30px;
  border: 1px solid rgba(0,240,255,.20);
  background:
    radial-gradient(circle at 0% 0%, rgba(0,240,255,.10), transparent 38%),
    linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.028));
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  color: #d9e8ff;
  font-size: clamp(1.02rem,2vw,1.24rem);
  line-height: 1.58;
  letter-spacing: -.015em;
}

.shielded-quote strong {
  color: #fff;
  font-weight: 900;
}

.tech-formula,
.technical-formula {
  margin: 34px auto 0;
  max-width: 1080px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 12px;
  padding: 22px 24px;
  border-radius: 28px;
  border: 1px solid rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 50% 0%,rgba(0,240,255,.10),transparent 42%),
    rgba(255,255,255,.045);
  color: #dbeafe;
  font-size: .92rem;
  line-height: 1.6;
  text-align: center;
}

.tech-formula span,
.technical-formula span {
  color: var(--cyan);
  opacity: .85;
  font-weight: 900;
}

.tech-formula strong,
.technical-formula strong {
  color: #f8fbff;
}

.topology {
  display: grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  margin-top: 34px;
}

.rings {
  display: grid;
  gap: 12px;
  margin-top: 18px;
}

/* =====================================================
   INSTALIACIJA PAGE
===================================================== */

.package-grid {
  grid-template-columns: repeat(4,minmax(0,1fr));
}

.installation-structure img {
  display: block;
  margin-top: 34px;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: var(--shadow);
}

.process-grid {
  grid-template-columns: repeat(6,minmax(0,1fr));
}

.process-step {
  min-height: 190px;
}

.process-step b {
  display: block;
  color: #fff;
  margin-bottom: 8px;
}

.process-step span {
  color: var(--muted);
  line-height: 1.55;
  font-size: .92rem;
}

.process-num {
  width: 38px;
  height: 38px;
}

/* =====================================================
   ORIGINS
===================================================== */

.origins-section {
  padding: 86px 0;
}

.origins-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 28px;
  align-items: stretch;
}

.origins-card {
  border: 1px solid rgba(0,240,255,.18);
  border-radius: 30px;
  padding: 28px;
  background:
    radial-gradient(circle at 15% 0%, rgba(0,240,255,.12), transparent 38%),
    rgba(255,255,255,.055);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
}

.origins-label {
  display: inline-flex;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.24);
  color: var(--cyan);
  background: rgba(0,240,255,.07);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
  margin-bottom: 16px;
}

.origins-card ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
  color: var(--muted);
  line-height: 1.55;
}

.origins-card li {
  position: relative;
  padding-left: 24px;
}

.origins-card li::before {
  content: "✦";
  position: absolute;
  left: 0;
  top: 0;
  color: var(--cyan);
}

.origin-signature {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.origin-signature span {
  display: inline-flex;
  padding: 10px 13px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.055);
  color: #d6e2f4;
  font-size: .73rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.origins-gallery {
  margin-top: 30px;
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  gap: 14px;
}

.origins-gallery figure {
  margin: 0;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.045);
}

.origins-gallery img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.origins-gallery figcaption {
  padding: 10px 12px;
  color: #a9b4c7;
  font-size: .78rem;
  line-height: 1.35;
}

/* =====================================================
   SAFETY / CTA
===================================================== */

.safety {
  border: 1px solid rgba(251,191,36,.24);
  background:
    radial-gradient(circle at 10% 0%, rgba(251,191,36,.12), transparent 38%),
    rgba(255,255,255,.045);
}

.safety h3 {
  color: #fde68a;
}

.bad-good {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 28px;
}

.mini-list {
  list-style: none;
  padding: 0;
  margin: 18px 0 0;
  display: grid;
  gap: 10px;
  color: var(--muted);
  line-height: 1.5;
}

.mini-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.mini-list .no {
  color: var(--danger);
  font-weight: 900;
}

.mini-list .yes {
  color: var(--green);
  font-weight: 900;
}

.cta {
  padding: 72px 0 96px;
}

.cta-box {
  border-radius: 38px;
  border: 1px solid rgba(0,240,255,.22);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.18), transparent 38%),
    radial-gradient(circle at 80% 30%, rgba(168,85,247,.14), transparent 38%),
    rgba(255,255,255,.055);
  box-shadow: var(--shadow);
  padding: clamp(28px, 6vw, 58px);
  text-align: center;
}

/* =====================================================
   FOOTER
===================================================== */

.eco-footer {
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 48px 0 64px;
  color: var(--muted);
  background: linear-gradient(180deg, rgba(0,0,0,.4), rgba(2,6,23,.92));
}

.eco-shell {
  border: 1px solid rgba(0,240,255,.16);
  border-radius: 30px;
  background: linear-gradient(180deg, rgba(0,240,255,.06), rgba(255,255,255,.03));
  box-shadow: var(--shadow);
  overflow: hidden;
}

.eco-inner {
  padding: 28px 30px 32px;
}

.eco-kicker {
  display: inline-flex;
  align-items: center;
  margin-bottom: 12px;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.35);
  background: rgba(0,240,255,.1);
  color: var(--cyan);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.eco-title {
  margin: 0 0 14px;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: var(--text);
  font-weight: 850;
  font-family: Orbitron, sans-serif;
  text-transform: uppercase;
}

.eco-subline {
  margin: 10px 0 16px;
  color: #9df7ff;
  font-weight: 900;
  letter-spacing: .12em;
  text-transform: uppercase;
  font-size: .78rem;
}

.eco-text {
  margin: 0 0 12px;
  max-width: 980px;
  line-height: 1.7;
  font-size: 15px;
}

.eco-text--dim {
  margin-top: 16px;
  font-size: 14px;
  opacity: .95;
}

.eco-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(200px,1fr));
  gap: 14px;
  margin: 24px 0 14px;
}

.eco-card {
  display: block;
  min-height: 118px;
  padding: 16px 17px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.045);
  color: inherit;
  transition: .18s ease;
}

.eco-card:hover {
  transform: translateY(-3px);
  border-color: rgba(0,240,255,.4);
  background: rgba(0,240,255,.06);
  box-shadow: 0 18px 50px rgba(0,0,0,.28);
}

.eco-card.is-here {
  border-color: rgba(236,72,153,.45);
  background: linear-gradient(135deg, rgba(0,240,255,.12), rgba(168,85,247,.12));
}

.eco-card--core {
  border-color: rgba(168,85,247,.3);
  background: linear-gradient(180deg, rgba(168,85,247,.1), rgba(255,255,255,.03));
}

.eco-card--activate {
  border-color: rgba(0,240,255,.28);
  background: linear-gradient(180deg, rgba(0,240,255,.08), rgba(255,255,255,.03));
}

.eco-card-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}

.eco-card-title {
  font-weight: 900;
  font-size: 15px;
  color: var(--text);
  line-height: 1.25;
  font-family: Orbitron, sans-serif;
  letter-spacing: -0.02em;
}

.eco-badge {
  flex-shrink: 0;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  color: var(--cyan);
}

.eco-note {
  font-size: 13px;
  line-height: 1.55;
  color: var(--muted);
}

.eco-mid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 12px;
  align-items: center;
  padding: 16px 0 10px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.eco-mid a {
  font-size: 13px;
  font-weight: 800;
  padding: 8px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.05);
  color: var(--text);
  text-transform: uppercase;
  letter-spacing: .06em;
}

.eco-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  padding: 14px 0 0;
  border-top: 1px solid rgba(255,255,255,.06);
}

.eco-tags span {
  font-size: 11px;
  color: var(--muted);
  padding: 5px 9px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(0,0,0,.2);
}

.eco-legal {
  margin: 14px 0 0;
  font-size: 10px;
  line-height: 1.55;
  color: rgba(148,163,184,.55);
}

.eco-bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 16px;
  align-items: center;
  padding-top: 18px;
  margin-top: 10px;
  border-top: 1px solid rgba(255,255,255,.08);
}

.eco-copy {
  font-size: 13px;
  line-height: 1.6;
  color: var(--muted);
  max-width: 540px;
}

.eco-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: flex-end;
}

.eco-links a {
  font-size: 13px;
  font-weight: 800;
  color: var(--soft);
}

.eco-links a:hover {
  color: var(--cyan);
}

/* =====================================================
   RESPONSIVE
===================================================== */

@media (max-width: 1180px) {
  .crystal-protocol-grid,
  .flow-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }

  .crystal-fields-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }

  .process-grid {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }

  .node-intro-copy {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .crystal-cards {
    grid-template-columns: repeat(3,minmax(0,1fr));
  }
}

@media (max-width: 980px) {
  .hero-grid,
  .split,
  .topology,
  .origins-grid,
  .node-intro-grid,
  .intent-shell {
    grid-template-columns: 1fr;
  }

  .grid-4,
  .package-grid,
  .architecture-grid,
  .data-grid,
  .program-grid,
  .edition-grid,
  .node-tech-grid,
  .subgrid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .grid-3,
  .language-split,
  .crystal-dashboard-grid,
  .dashboard-grid {
    grid-template-columns: 1fr;
  }

  .mobile-menu {
    display: block !important;
  }

  .topbar .nav {
    display: none !important;
  }

  .brand {
    flex: 1 1 0;
    min-width: 0;
    overflow: hidden;
  }

  .brand > div:last-of-type {
    min-width: 0;
  }

  .brand-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  h1 {
    font-size: clamp(2.65rem, 10vw, 4.85rem);
  }

  table,
  thead,
  tbody,
  tr,
  th,
  td {
    display: block;
  }

  thead {
    display: none;
  }

  .protocol-table,
  .field-table,
  .session-map,
  .hardware-table,
  .stone-table,
  .matrix,
  .matrix-table,
  .business-matrix {
    border-radius: 24px;
  }

  .protocol-table tr,
  .field-table tr,
  .session-map tr,
  .hardware-table tr,
  .stone-table tr,
  .matrix tr,
  .matrix-table tr,
  .business-matrix tr {
    border-bottom: 1px solid rgba(255,255,255,.10);
    padding: 12px;
  }

  .protocol-table td,
  .field-table td,
  .session-map td,
  .hardware-table td,
  .stone-table td,
  .matrix td,
  .matrix-table td,
  .business-matrix td {
    border-bottom: 0;
    padding: 10px 12px;
  }
}

@media (max-width: 760px) {
  .crystal-fields-grid {
    grid-template-columns: 1fr;
    width: 100%;
    margin-top: 34px;
    gap: 14px;
  }

  .field-card {
    min-height: auto;
    padding: 20px 20px 22px;
    border-radius: 24px;
    display: grid;
    grid-template-columns: 44px 1fr;
    column-gap: 14px;
    align-items: start;
  }

  .field-num {
    grid-row: 1 / span 2;
    margin-bottom: 0;
  }

  .field-card h3 {
    font-size: 1.08rem;
    margin-top: 2px;
    margin-bottom: 6px;
  }

  .field-card p {
    font-size: 1rem;
    line-height: 1.5;
  }
}

@media (max-width: 680px) {
  .container {
    width: min(100% - 28px, 1180px);
  }

  .topbar {
    --topbar-h: 66px;
  }

  .brand-sub {
    display: none;
  }

  .hero {
    padding-top: 56px;
  }

  .actions {
    flex-direction: column;
  }

  .btn {
    width: 100%;
  }

  .grid-3,
  .grid-4,
  .bad-good,
  .package-grid,
  .architecture-grid,
  .data-grid,
  .program-grid,
  .edition-grid,
  .node-tech-grid,
  .subgrid,
  .node-intro-copy,
  .control-row,
  .flow-grid,
  .process-grid,
  .crystal-cards {
    grid-template-columns: 1fr;
  }

  .floating-status {
    position: static;
    grid-template-columns: 1fr;
    margin: 0;
    border-radius: 0;
  }

  .hero-card {
    border-radius: 24px;
  }

  .node-visual-card img {
    aspect-ratio: 1.1 / 1;
  }

  .node-layer-formula p,
  .package-note,
  .node-punch,
  .crystal-core-line,
  .difference-punch {
    text-align: left;
  }

  .node-mini-stack {
    justify-content: flex-start;
  }

  .eco-inner {
    padding: 22px 18px;
  }

  .eco-bottom {
    flex-direction: column;
    align-items: flex-start;
  }

  .eco-links {
    justify-content: flex-start;
  }

  .eco-card-head {
    flex-direction: column;
    align-items: flex-start;
  }
}

/* ===================================================== */
/* SESIJOS.HTML · rebuild polish */
/* ===================================================== */

.session-tagline,
.tech-tagline,
.install-tagline,
.crystal-tagline {
  margin: 22px 0 0;
  max-width: 760px;
  padding: 16px 20px;
  border-radius: 22px;
  border: 1px solid rgba(0,240,255,.2);
  background:
    radial-gradient(circle at 15% 0%, rgba(0,240,255,.12), transparent 42%),
    rgba(0,240,255,.055);
  color: #dffbff;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: .015em;
}

.flow-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  margin-top: 38px;
}

.flow-step {
  position: relative;
  min-height: 230px;
  padding: 24px 20px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.12), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
  box-shadow: 0 18px 58px rgba(0,0,0,.22);
  overflow: hidden;
}

.flow-step::after {
  content: "";
  position: absolute;
  inset: auto 18px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .7;
}

.flow-num {
  width: 40px;
  height: 40px;
  margin-bottom: 16px;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #03131b;
  font-weight: 1000;
  background: linear-gradient(135deg, var(--cyan), #93c5fd);
  box-shadow: 0 0 28px rgba(0,240,255,.25);
}

.flow-step b {
  display: block;
  color: #fff;
  font-size: 1.06rem;
  margin-bottom: 10px;
}

.flow-step span {
  display: block;
  color: var(--muted);
  line-height: 1.55;
  font-size: .94rem;
}

.control-panel {
  margin-top: 28px;
  padding: 26px;
  border-radius: 30px;
  border: 1px solid rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 10% 0%, rgba(0,240,255,.13), transparent 42%),
    rgba(255,255,255,.055);
  box-shadow: 0 24px 80px rgba(0,0,0,.2);
}

.control-panel h3 {
  margin-bottom: 20px;
}

.control-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

.control-item {
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.11);
  background: rgba(255,255,255,.045);
}

.control-item small {
  display: block;
  margin-bottom: 7px;
  color: var(--cyan);
  font-size: .68rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.control-item strong {
  color: #fff;
  line-height: 1.35;
  font-size: .95rem;
}

.program-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 36px;
}

.session-detail-section {
  padding: 92px 0;
}

.session-mode-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 36px;
}

.session-mode-card {
  position: relative;
  padding: 26px;
  min-height: 260px;
  border-radius: 30px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 20% 0%, rgba(168,85,247,.14), transparent 45%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
  box-shadow: 0 20px 70px rgba(0,0,0,.22);
  overflow: hidden;
}

.session-mode-card::after {
  content: "";
  position: absolute;
  inset: auto 20px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .7;
}

.mode-num {
  display: inline-flex;
  width: 44px;
  height: 44px;
  margin-bottom: 18px;
  border-radius: 16px;
  align-items: center;
  justify-content: center;
  color: #03131b;
  font-weight: 1000;
  background: linear-gradient(135deg, #22d3ee, #a78bfa);
}

.session-mode-card h3 {
  margin-bottom: 12px;
  font-size: 1.18rem;
}

.session-mode-card p {
  color: var(--muted);
  line-height: 1.62;
  margin: 0 0 18px;
}

.session-mode-card span {
  display: inline-flex;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.18);
  background: rgba(0,240,255,.06);
  color: #dffbff;
  font-size: .74rem;
  font-weight: 900;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.table-shell {
  width: 100%;
  overflow-x: auto;
  margin-top: 36px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  box-shadow: 0 20px 70px rgba(0,0,0,.22);
}

.matrix {
  width: 100%;
  border-collapse: collapse;
  min-width: 820px;
}

.matrix th,
.matrix td {
  padding: 18px 20px;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,.09);
  vertical-align: top;
  line-height: 1.55;
}

.matrix th {
  color: var(--cyan);
  font-size: .72rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  background: rgba(0,240,255,.065);
}

.matrix td {
  color: var(--muted);
}

.matrix td:first-child {
  color: #fff;
  font-weight: 900;
}

.source-note {
  margin: 20px auto 0;
  max-width: 940px;
  color: #8ea0b8;
  line-height: 1.65;
  font-size: .94rem;
  text-align: center;
}

@media (max-width: 1180px) {
  .flow-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .program-grid,
  .session-mode-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .flow-grid,
  .program-grid,
  .session-mode-grid,
  .control-row {
    grid-template-columns: 1fr;
  }

  .flow-step,
  .session-mode-card {
    min-height: auto;
  }

  .session-tagline,
  .tech-tagline,
  .install-tagline,
  .crystal-tagline {
    padding: 14px 16px;
    border-radius: 18px;
    font-size: .96rem;
  }

  .source-note {
    text-align: left;
  }
}
/* ===================================================== */
/* INSTALIACIJA.HTML · rebuild polish */
/* ===================================================== */

.install-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 14px;
  border: 1px solid rgba(0,240,255,.22);
  border-radius: 999px;
  background: rgba(0,240,255,.07);
  color: var(--cyan);
  font-weight: 900;
  font-size: .72rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  margin-bottom: 26px;
  box-shadow: 0 0 32px rgba(0,240,255,.08);
}

.install-tagline {
  margin: 22px 0 0;
  max-width: 760px;
  padding: 16px 20px;
  border-radius: 22px;
  border: 1px solid rgba(0,240,255,.2);
  background:
    radial-gradient(circle at 15% 0%, rgba(0,240,255,.12), transparent 42%),
    rgba(0,240,255,.055);
  color: #dffbff;
  font-weight: 900;
  line-height: 1.5;
  letter-spacing: .015em;
}

.install-package-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 36px;
}

.install-panel {
  margin-top: 28px;
  padding: clamp(24px, 4vw, 36px);
  border-radius: 34px;
  border: 1px solid rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 10% 0%, rgba(0,240,255,.13), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.03));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
}

.install-panel h3 {
  margin-bottom: 22px;
  font-size: 1.35rem;
}

.install-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

.install-item {
  display: flex;
  gap: 13px;
  align-items: flex-start;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.1);
  background: rgba(255,255,255,.045);
  color: var(--muted);
  line-height: 1.55;
}

.install-item b {
  color: #fff;
}

.install-dot {
  width: 26px;
  height: 26px;
  flex: 0 0 auto;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(52,211,153,.14);
  color: var(--green);
  font-weight: 900;
}

.installation-image-wrap {
  margin: 34px 0 0;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(255,255,255,.13);
  background: rgba(255,255,255,.045);
  box-shadow: var(--shadow);
}

.installation-image-wrap img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7;
  object-fit: cover;
}

.edition-grid,
.package-grid,
.process-grid {
  display: grid;
  gap: 18px;
  margin-top: 36px;
}

.edition-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.process-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.process-step {
  position: relative;
  min-height: 210px;
  padding: 24px 20px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.12), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
  box-shadow: 0 18px 58px rgba(0,0,0,.22);
  overflow: hidden;
}

.process-step::after {
  content: "";
  position: absolute;
  inset: auto 18px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .7;
}

.process-num {
  width: 40px;
  height: 40px;
  margin-bottom: 16px;
  border-radius: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #03131b;
  font-weight: 1000;
  background: linear-gradient(135deg, var(--cyan), #93c5fd);
  box-shadow: 0 0 28px rgba(0,240,255,.25);
}

.process-step b {
  display: block;
  color: #fff;
  font-size: 1.06rem;
  margin-bottom: 10px;
}

.process-step span {
  display: block;
  color: var(--muted);
  line-height: 1.55;
  font-size: .94rem;
}

.table-shell {
  width: 100%;
  overflow-x: auto;
  margin-top: 36px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.04);
  box-shadow: 0 20px 70px rgba(0,0,0,.22);
}

.business-matrix {
  width: 100%;
  min-width: 860px;
  border-collapse: collapse;
}

.business-matrix th,
.business-matrix td {
  padding: 18px 20px;
  text-align: left;
  border-bottom: 1px solid rgba(255,255,255,.09);
  vertical-align: top;
  line-height: 1.55;
}

.business-matrix th {
  color: var(--cyan);
  font-size: .72rem;
  letter-spacing: .13em;
  text-transform: uppercase;
  background: rgba(0,240,255,.065);
}

.business-matrix td {
  color: var(--muted);
}

.business-matrix td:first-child {
  color: #fff;
  font-weight: 900;
}

.install-image-stack {
  display: grid;
  gap: 0;
}

.install-image-stack img {
  width: 100%;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.price-note {
  margin: 22px 0 0;
  color: #8ea0b8;
  line-height: 1.65;
  font-size: .94rem;
}

@media (max-width: 1180px) {
  .install-package-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .edition-grid,
  .process-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .install-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 760px) {
  .install-package-grid,
  .edition-grid,
  .process-grid {
    grid-template-columns: 1fr;
  }

  .process-step {
    min-height: auto;
  }

  .installation-image-wrap img {
    aspect-ratio: 1.15 / 1;
  }

  .install-tagline {
    padding: 14px 16px;
    border-radius: 18px;
    font-size: .96rem;
  }
}

/* ===================================================== */
/* INDEX · WHY DIFFERENT + HOW polish */
/* ===================================================== */

.difference-section {
  padding: 92px 0;
}

.difference-section .section-head {
  max-width: 980px;
}

.difference-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-top: 38px;
}

.difference-card {
  position: relative;
  min-height: 245px;
  padding: 26px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 18% 0%, rgba(0,240,255,.10), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.03));
  box-shadow: 0 20px 70px rgba(0,0,0,.22);
  overflow: hidden;
}

.difference-card::after {
  content: "";
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: 0;
  height: 3px;
  border-radius: 999px 999px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .55;
}

.difference-card.is-featured {
  border-color: rgba(0,240,255,.38);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.20), transparent 42%),
    radial-gradient(circle at 80% 15%, rgba(168,85,247,.16), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.04));
  box-shadow:
    0 24px 90px rgba(0,0,0,.28),
    0 0 45px rgba(0,240,255,.10);
}

.diff-label {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 16px;
  padding: 7px 11px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.24);
  background: rgba(0,240,255,.075);
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.difference-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 1.18rem;
  line-height: 1.2;
  letter-spacing: -.02em;
}

.difference-card p {
  margin: 0;
  color: var(--muted);
  font-size: .96rem;
  line-height: 1.65;
}

.difference-punch {
  max-width: 980px;
  margin: 34px auto 0;
  padding: 22px 26px;
  border-radius: 26px;
  border: 1px solid rgba(0,240,255,.22);
  background:
    radial-gradient(circle at 50% 0%, rgba(0,240,255,.12), transparent 44%),
    rgba(0,240,255,.055);
  color: #dbeafe;
  text-align: center;
  line-height: 1.6;
  font-size: 1.04rem;
  box-shadow: 0 20px 70px rgba(0,0,0,.18);
}

.difference-punch strong {
  color: #fff;
  font-weight: 1000;
}

.how-section {
  padding: 92px 0;
}

.how-split {
  align-items: center;
}

.how-panel {
  border-color: rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 50% 0%, rgba(0,240,255,.14), transparent 42%),
    rgba(255,255,255,.055);
}

.how-panel img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.how-feature-list .feature {
  border-color: rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 0% 0%, rgba(0,240,255,.08), transparent 38%),
    rgba(255,255,255,.045);
}

.how-feature-list .feature b {
  color: #fff;
  font-size: .98rem;
}

@media (max-width: 1180px) {
  .difference-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .difference-card {
    min-height: 220px;
  }
}

@media (max-width: 680px) {
  .difference-section,
  .how-section {
    padding: 68px 0;
  }

  .difference-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  .difference-card {
    min-height: auto;
    padding: 22px 20px;
    border-radius: 24px;
  }

  .difference-punch {
    text-align: left;
    padding: 20px;
    border-radius: 22px;
  }

  .how-panel img {
    aspect-ratio: 1 / 1;
  }
}
/* ===================================================== */
/* Crystal Node Protocol + Catalog Intelligence polish */
/* ===================================================== */

.crystal-protocol-section,
.catalog-intelligence-section {
  position: relative;
  padding: 96px 0;
}

.crystal-protocol-section::before,
.catalog-intelligence-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 0%, rgba(0,240,255,.09), transparent 34%),
    radial-gradient(circle at 86% 18%, rgba(168,85,247,.08), transparent 34%);
  opacity: .9;
}

.crystal-protocol-section > .container,
.catalog-intelligence-section > .container {
  position: relative;
  z-index: 1;
}

.crystal-protocol-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  margin-top: 36px;
}

.protocol-card {
  position: relative;
  min-height: 245px;
  padding: 24px 22px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.12), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.028));
  box-shadow: 0 22px 70px rgba(0,0,0,.22);
  overflow: hidden;
}

.protocol-card::after {
  content: "";
  position: absolute;
  left: 20px;
  right: 20px;
  bottom: 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .68;
}

.protocol-card .tag,
.catalog-human-card .tag {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 16px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(0,240,255,.07);
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.protocol-card h3 {
  color: #fff;
  font-size: 1.08rem;
  line-height: 1.22;
  margin: 0 0 12px;
}

.protocol-card p {
  color: var(--muted);
  line-height: 1.62;
  font-size: .94rem;
  margin: 0;
}

.crystal-core-line {
  max-width: 980px;
  margin: 34px auto 0;
  padding: 22px 24px;
  border-radius: 26px;
  border: 1px solid rgba(0,240,255,.22);
  background:
    radial-gradient(circle at 50% 0%, rgba(0,240,255,.13), transparent 45%),
    rgba(0,240,255,.055);
  color: #dbeafe;
  text-align: center;
  line-height: 1.65;
  font-size: 1.03rem;
}

.crystal-core-line strong {
  color: #fff;
}

.catalog-intelligence-grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(360px, 1.05fr);
  gap: 34px;
  align-items: center;
}

.catalog-copy {
  min-width: 0;
}

.catalog-note {
  margin-top: 24px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid rgba(251,191,36,.22);
  background: rgba(251,191,36,.06);
  color: #fde68a;
  line-height: 1.55;
  font-weight: 800;
}

.catalog-human-card {
  position: relative;
  border: 1px solid rgba(0,240,255,.20);
  border-radius: 32px;
  padding: 28px;
  background:
    radial-gradient(circle at 0% 0%, rgba(0,240,255,.13), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: 0 28px 90px rgba(0,0,0,.24);
  overflow: hidden;
}

.catalog-human-card::after {
  content: "";
  position: absolute;
  inset: auto 26px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .72;
}

.catalog-human-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 1.32rem;
}

.catalog-human-card p {
  margin: 0;
  color: #cbd8f2;
  line-height: 1.65;
}

.catalog-layer-list {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
  display: grid;
  gap: 12px;
}

.catalog-layer-list li {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items: start;
  padding: 15px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.045);
}

.catalog-layer-list span {
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #06111b;
  font-weight: 1000;
  font-size: .76rem;
  box-shadow: 0 0 26px rgba(0,240,255,.22);
}

.catalog-layer-list b {
  display: block;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.25;
}

.catalog-layer-list em {
  display: block;
  color: var(--muted);
  font-style: normal;
  line-height: 1.45;
  font-size: .92rem;
}

@media (max-width: 1180px) {
  .crystal-protocol-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .catalog-intelligence-grid {
    grid-template-columns: 1fr;
  }

  .crystal-protocol-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .crystal-protocol-section,
  .catalog-intelligence-section {
    padding: 68px 0;
  }

  .crystal-protocol-grid {
    grid-template-columns: 1fr;
  }

  .protocol-card {
    min-height: auto;
    padding: 22px 20px;
    border-radius: 24px;
  }

  .crystal-core-line {
    text-align: left;
    padding: 20px;
    border-radius: 22px;
  }

  .catalog-human-card {
    padding: 22px 20px;
    border-radius: 24px;
  }

  .catalog-layer-list li {
    grid-template-columns: 38px 1fr;
    padding: 14px;
  }
}
/* ===================================================== */
/* Crystal Catalog Intelligence · Premium rebuild */
/* ===================================================== */

.catalog-intelligence-section {
  position: relative;
  padding: 96px 0;
}

.catalog-intelligence-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 12% 0%, rgba(0,240,255,.10), transparent 34%),
    radial-gradient(circle at 88% 18%, rgba(168,85,247,.10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.015), transparent 70%);
}

.catalog-intelligence-section > .container {
  position: relative;
  z-index: 1;
}

.catalog-intelligence-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(360px, .97fr);
  gap: 34px;
  align-items: stretch;
  margin-top: 42px;
}

.catalog-copy {
  min-width: 0;
}

.catalog-visual-card {
  height: 100%;
  overflow: hidden;
  border-radius: 34px;
  border: 1px solid rgba(0,240,255,.18);
  background:
    radial-gradient(circle at 50% 0%, rgba(0,240,255,.11), transparent 44%),
    rgba(255,255,255,.045);
  box-shadow: 0 30px 90px rgba(0,0,0,.30);
}

.catalog-visual-card img {
  width: 100%;
  display: block;
  aspect-ratio: 16 / 11;
  object-fit: cover;
}

.catalog-visual-caption {
  padding: 20px 24px;
  color: #cbd8f2;
  line-height: 1.58;
  background:
    linear-gradient(90deg, rgba(0,240,255,.08), rgba(168,85,247,.10));
  border-top: 1px solid rgba(255,255,255,.08);
}

.catalog-visual-caption strong {
  display: block;
  color: #fff;
  margin-bottom: 6px;
  font-family: Orbitron, sans-serif;
  text-transform: uppercase;
  letter-spacing: -.025em;
}

.catalog-human-card {
  position: relative;
  border: 1px solid rgba(0,240,255,.20);
  border-radius: 34px;
  padding: 30px;
  background:
    radial-gradient(circle at 0% 0%, rgba(0,240,255,.13), transparent 42%),
    radial-gradient(circle at 100% 10%, rgba(168,85,247,.12), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.03));
  box-shadow: 0 28px 90px rgba(0,0,0,.24);
  overflow: hidden;
}

.catalog-human-card::after {
  content: "";
  position: absolute;
  inset: auto 28px 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, var(--cyan), var(--purple), var(--pink));
  opacity: .72;
}

.catalog-human-card .tag {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 16px;
  padding: 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(0,240,255,.07);
  color: var(--cyan);
  font-size: .66rem;
  font-weight: 900;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.catalog-human-card h3 {
  margin: 0 0 12px;
  color: #fff;
  font-size: 1.36rem;
}

.catalog-human-card p {
  margin: 0;
  color: #cbd8f2;
  line-height: 1.65;
}

.catalog-layer-list {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
  display: grid;
  gap: 12px;
}

.catalog-layer-list li {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 12px;
  align-items: start;
  padding: 15px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.045);
}

.catalog-layer-list span {
  width: 34px;
  height: 34px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #06111b;
  font-weight: 1000;
  font-size: .76rem;
  box-shadow: 0 0 26px rgba(0,240,255,.22);
}

.catalog-layer-list b {
  display: block;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.25;
}

.catalog-layer-list em {
  display: block;
  color: var(--muted);
  font-style: normal;
  line-height: 1.45;
  font-size: .92rem;
}

.catalog-system-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 32px 0 0;
}

.catalog-system-strip div {
  min-height: 108px;
  padding: 18px 16px;
  border-radius: 22px;
  border: 1px solid rgba(255,255,255,.11);
  background:
    radial-gradient(circle at 18% 0%, rgba(0,240,255,.10), transparent 40%),
    rgba(255,255,255,.045);
}

.catalog-system-strip b {
  display: block;
  color: #fff;
  margin-bottom: 8px;
  font-family: Orbitron, sans-serif;
  font-size: .86rem;
  text-transform: uppercase;
  letter-spacing: -.02em;
}

.catalog-system-strip span {
  display: block;
  color: var(--muted);
  line-height: 1.45;
  font-size: .88rem;
}

.catalog-note {
  margin: 28px auto 0;
  max-width: 1040px;
  padding: 20px 24px;
  border-radius: 24px;
  border: 1px solid rgba(251,191,36,.22);
  background:
    radial-gradient(circle at 0% 0%, rgba(251,191,36,.10), transparent 38%),
    rgba(251,191,36,.055);
  color: #fde68a;
  line-height: 1.6;
  font-weight: 800;
  text-align: center;
}

.catalog-note strong {
  color: #fff7cc;
}

@media (max-width: 1180px) {
  .catalog-system-strip {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .catalog-intelligence-grid {
    grid-template-columns: 1fr;
  }

  .catalog-system-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .catalog-intelligence-section {
    padding: 68px 0;
  }

  .catalog-human-card {
    padding: 22px 20px;
    border-radius: 24px;
  }

  .catalog-visual-card {
    border-radius: 24px;
  }

  .catalog-visual-card img {
    aspect-ratio: 1.12 / 1;
  }

  .catalog-layer-list li {
    grid-template-columns: 38px 1fr;
    padding: 14px;
  }

  .catalog-system-strip {
    grid-template-columns: 1fr;
  }

  .catalog-note {
    text-align: left;
    padding: 18px 20px;
  }
}
/* ===================================================== */
/* Catalog Intelligence readability fix */
/* ===================================================== */

.catalog-intelligence-grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(420px, .92fr);
  align-items: stretch;
}

.catalog-human-card {
  min-width: 0;
}

.catalog-layer-list li {
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
}

.catalog-layer-list li > div,
.catalog-layer-list li b,
.catalog-layer-list li em {
  min-width: 0;
  word-break: normal;
  overflow-wrap: normal;
}

.catalog-layer-list b {
  font-size: .95rem;
  line-height: 1.25;
}

.catalog-layer-list em {
  font-size: .9rem;
  line-height: 1.55;
  max-width: 100%;
}

.catalog-visual-card {
  min-height: 100%;
}

.catalog-visual-card img {
  aspect-ratio: 16 / 10;
}

.catalog-system-strip {
  margin-top: 28px;
}

@media (max-width: 980px) {
  .catalog-intelligence-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .catalog-layer-list li {
    grid-template-columns: 38px minmax(0, 1fr);
  }
}
.catalog-system-strip b {
  font-size: .9rem;
}

.catalog-system-strip span {
  font-size: .9rem;
  line-height: 1.5;
}
/* ===================================================== */
/* Catalog Intelligence final layout fix */
/* ===================================================== */

.catalog-intelligence-section {
  padding: 92px 0;
}

.catalog-intelligence-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 0.86fr);
  gap: 28px;
  align-items: stretch;
}

.catalog-visual-card,
.catalog-human-card {
  min-width: 0;
  border-radius: 30px;
}

.catalog-human-card {
  padding: 28px;
}

.catalog-layer-list {
  list-style: none;
  padding: 0;
  margin: 22px 0 0;
  display: grid;
  gap: 12px;
}

.catalog-layer-list li {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  gap: 14px;
  align-items: flex-start;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.045);
}

.catalog-layer-list li > span {
  width: 34px;
  height: 34px;
  border-radius: 13px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #020617;
  font-size: .72rem;
  font-weight: 1000;
  box-shadow: 0 0 22px rgba(0,240,255,.25);
}

.catalog-layer-content {
  min-width: 0;
}

.catalog-layer-content b {
  display: block;
  color: #fff;
  font-size: .95rem;
  line-height: 1.25;
  margin: 0 0 6px;
}

.catalog-layer-content em {
  display: block;
  color: #cbd8f2;
  font-style: normal;
  font-size: .92rem;
  line-height: 1.55;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}

.catalog-system-strip {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin-top: 28px;
}

.catalog-system-strip > div {
  padding: 15px 16px;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.045);
}

.catalog-system-strip b {
  display: block;
  color: #fff;
  font-size: .82rem;
  line-height: 1.2;
  margin-bottom: 6px;
}

.catalog-system-strip span {
  display: block;
  color: #b9c8e5;
  font-size: .86rem;
  line-height: 1.45;
}

@media (max-width: 1080px) {
  .catalog-intelligence-grid {
    grid-template-columns: 1fr;
  }

  .catalog-system-strip {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 620px) {
  .catalog-intelligence-section {
    padding: 64px 0;
  }

  .catalog-human-card {
    padding: 22px 18px;
    border-radius: 24px;
  }

  .catalog-layer-list li {
    grid-template-columns: 38px minmax(0, 1fr);
    padding: 14px;
  }

  .catalog-layer-list li > span {
    width: 32px;
    height: 32px;
  }

  .catalog-system-strip {
    grid-template-columns: 1fr;
  }
}
/* ===================================================== */
/* Operator Dashboard final clean */
/* ===================================================== */

.operator-dashboard-section {
  padding: 96px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,240,255,.10), transparent 34%),
    radial-gradient(circle at 82% 30%, rgba(168,85,247,.10), transparent 36%);
}

.operator-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.88fr) minmax(420px, 1.12fr);
  gap: clamp(34px, 5vw, 72px);
  align-items: center;
}

.operator-dashboard-copy {
  min-width: 0;
  max-width: 600px;
}

.operator-dashboard-copy h2 {
  max-width: 560px;
  font-size: clamp(2.35rem, 4.35vw, 4.85rem);
  line-height: .95;
  letter-spacing: -0.065em;
  overflow-wrap: normal;
  word-break: normal;
}

.operator-dashboard-copy .section-desc {
  max-width: 560px;
}

.operator-note {
  margin-top: 22px;
  max-width: 540px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(0,240,255,.07);
  color: #dbeafe;
  line-height: 1.6;
  font-size: .98rem;
}

.operator-visual-card {
  max-width: 540px;
  margin: 28px 0 0;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(255,255,255,.045);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
}

.operator-visual-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.operator-visual-card figcaption {
  padding: 14px 18px;
  color: #cbd8f2;
  font-size: .86rem;
  line-height: 1.45;
  border-top: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(90deg, rgba(0,240,255,.08), rgba(168,85,247,.08));
}

.operator-dashboard-panel {
  min-width: 0;
  width: 100%;
  padding: 28px;
  border-radius: 32px;
  border: 1px solid rgba(0,240,255,.24);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.14), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.028));
  box-shadow: 0 30px 90px rgba(0,0,0,.32);
}

.operator-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 22px;
}

.operator-panel-head h3 {
  margin-top: 12px;
  font-size: 1.35rem;
}

.operator-status {
  flex-shrink: 0;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(52,211,153,.28);
  background: rgba(52,211,153,.10);
  color: #86efac;
  font-size: .68rem;
  font-weight: 1000;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.operator-dashboard-panel .crystal-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.operator-dashboard-panel .crystal-dashboard-grid > div {
  min-height: 150px;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 10% 0%, rgba(0,240,255,.12), transparent 42%),
    rgba(255,255,255,.045);
  color: #e7efff;
  box-shadow: 0 16px 44px rgba(0,0,0,.16);
}

.operator-dashboard-panel .crystal-dashboard-grid > div span {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #020617;
  font-size: .68rem;
  font-weight: 1000;
}

.operator-dashboard-panel .crystal-dashboard-grid > div b {
  display: block;
  color: #fff;
  font-size: .92rem;
  line-height: 1.22;
  margin-bottom: 8px;
}

.operator-dashboard-panel .crystal-dashboard-grid > div em {
  display: block;
  color: #b9c8e5;
  font-style: normal;
  font-size: .84rem;
  line-height: 1.45;
}

@media (max-width: 1180px) {
  .operator-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .operator-dashboard-copy {
    max-width: 860px;
  }

  .operator-dashboard-copy h2 {
    max-width: 820px;
    font-size: clamp(2.45rem, 7.6vw, 5rem);
  }

  .operator-dashboard-copy .section-desc,
  .operator-note,
  .operator-visual-card {
    max-width: 760px;
  }
}

@media (max-width: 760px) {
  .operator-dashboard-section {
    padding: 68px 0;
  }

  .operator-dashboard-copy h2 {
    font-size: clamp(2.05rem, 10.5vw, 3.65rem);
    line-height: .96;
  }

  .operator-dashboard-panel {
    padding: 22px 18px;
    border-radius: 26px;
  }

  .operator-panel-head {
    flex-direction: column;
  }

  .operator-dashboard-panel .crystal-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .operator-dashboard-panel .crystal-dashboard-grid > div {
    min-height: auto;
  }

  .operator-visual-card img {
    aspect-ratio: 1.12 / 1;
  }
}
/* ===================================================== */
/* Operator Dashboard overlap hard fix */
/* ===================================================== */

.operator-dashboard-section {
  padding: 96px 0;
  overflow: hidden;
  background:
    radial-gradient(circle at 18% 18%, rgba(0,240,255,.10), transparent 34%),
    radial-gradient(circle at 82% 30%, rgba(168,85,247,.10), transparent 36%);
}

.operator-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(440px, 1.18fr);
  gap: clamp(44px, 6vw, 96px);
  align-items: center;
}

.operator-dashboard-copy {
  min-width: 0;
  max-width: 520px;
}

.operator-dashboard-copy h2 {
  max-width: 520px;
  font-size: clamp(2.35rem, 4vw, 4.35rem);
  line-height: .96;
  letter-spacing: -0.06em;
  overflow-wrap: normal;
  word-break: normal;
}

.operator-dashboard-copy .section-desc {
  max-width: 500px;
}

.operator-note {
  margin-top: 22px;
  max-width: 500px;
  padding: 18px 20px;
  border-radius: 22px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(0,240,255,.07);
  color: #dbeafe;
  line-height: 1.6;
  font-size: .98rem;
}

.operator-visual-card {
  max-width: 500px;
  margin: 28px 0 0;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(0,240,255,.22);
  background: rgba(255,255,255,.045);
  box-shadow: 0 24px 80px rgba(0,0,0,.28);
}

.operator-visual-card img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
}

.operator-visual-card figcaption {
  padding: 14px 18px;
  color: #cbd8f2;
  font-size: .86rem;
  line-height: 1.45;
  border-top: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(90deg, rgba(0,240,255,.08), rgba(168,85,247,.08));
}

.operator-dashboard-panel {
  min-width: 0;
  width: 100%;
  padding: 28px;
  border-radius: 32px;
  border: 1px solid rgba(0,240,255,.24);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.14), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.08), rgba(255,255,255,.028));
  box-shadow: 0 30px 90px rgba(0,0,0,.32);
}

.operator-panel-head {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  align-items: flex-start;
  margin-bottom: 22px;
}

.operator-panel-head h3 {
  margin-top: 12px;
  font-size: 1.32rem;
}

.operator-status {
  flex-shrink: 0;
  padding: 8px 11px;
  border-radius: 999px;
  border: 1px solid rgba(52,211,153,.28);
  background: rgba(52,211,153,.10);
  color: #86efac;
  font-size: .68rem;
  font-weight: 1000;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.operator-dashboard-panel .crystal-dashboard-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
}

.operator-dashboard-panel .crystal-dashboard-grid > div {
  min-height: 150px;
  padding: 16px;
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 10% 0%, rgba(0,240,255,.12), transparent 42%),
    rgba(255,255,255,.045);
  color: #e7efff;
  box-shadow: 0 16px 44px rgba(0,0,0,.16);
}

.operator-dashboard-panel .crystal-dashboard-grid > div span {
  width: 30px;
  height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 12px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #020617;
  font-size: .68rem;
  font-weight: 1000;
}

.operator-dashboard-panel .crystal-dashboard-grid > div b {
  display: block;
  color: #fff;
  font-size: .92rem;
  line-height: 1.22;
  margin-bottom: 8px;
}

.operator-dashboard-panel .crystal-dashboard-grid > div em {
  display: block;
  color: #b9c8e5;
  font-style: normal;
  font-size: .84rem;
  line-height: 1.45;
}

/* Laptop / smaller desktop */
@media (max-width: 1280px) {
  .operator-dashboard-grid {
    grid-template-columns: minmax(0, 0.78fr) minmax(430px, 1.22fr);
    gap: 48px;
  }

  .operator-dashboard-copy {
    max-width: 480px;
  }

  .operator-dashboard-copy h2 {
    max-width: 480px;
    font-size: clamp(2.15rem, 3.75vw, 3.95rem);
  }

  .operator-dashboard-copy .section-desc,
  .operator-note,
  .operator-visual-card {
    max-width: 470px;
  }
}

/* Tablet */
@media (max-width: 1180px) {
  .operator-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .operator-dashboard-copy {
    max-width: 860px;
  }

  .operator-dashboard-copy h2 {
    max-width: 820px;
    font-size: clamp(2.45rem, 7.4vw, 5rem);
  }

  .operator-dashboard-copy .section-desc,
  .operator-note,
  .operator-visual-card {
    max-width: 760px;
  }
}

/* Mobile */
@media (max-width: 760px) {
  .operator-dashboard-section {
    padding: 68px 0;
  }

  .operator-dashboard-copy h2 {
    font-size: clamp(2.05rem, 10.5vw, 3.65rem);
    line-height: .96;
  }

  .operator-dashboard-panel {
    padding: 22px 18px;
    border-radius: 26px;
  }

  .operator-panel-head {
    flex-direction: column;
  }

  .operator-dashboard-panel .crystal-dashboard-grid {
    grid-template-columns: 1fr;
  }

  .operator-dashboard-panel .crystal-dashboard-grid > div {
    min-height: auto;
  }

  .operator-visual-card img {
    aspect-ratio: 1.12 / 1;
  }
}
/* ===================================================== */
/* Crystal Activation / Fields / Session Engine Premium */
/* ===================================================== */

.activation-section,
.fields-section,
.session-engine-section {
  position: relative;
  padding: 96px 0;
  overflow: hidden;
}

.activation-section::before,
.fields-section::before,
.session-engine-section::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 18% 10%, rgba(0,240,255,.10), transparent 34%),
    radial-gradient(circle at 82% 22%, rgba(168,85,247,.10), transparent 36%);
  opacity: .9;
}

.activation-section > .container,
.fields-section > .container,
.session-engine-section > .container {
  position: relative;
  z-index: 1;
}

/* Activation */

.activation-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 14px;
  margin-top: 42px;
}

.activation-card {
  min-height: 260px;
  padding: 22px 18px;
  border-radius: 26px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 18% 0%, rgba(0,240,255,.13), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.026));
  box-shadow: 0 22px 70px rgba(0,0,0,.20);
}

.activation-num {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #020617;
  font-weight: 1000;
  font-size: .72rem;
}

.activation-card h3 {
  color: #fff;
  font-size: 1.05rem;
  margin-bottom: 10px;
}

.activation-card p {
  color: #b9c8e5;
  line-height: 1.58;
  font-size: .94rem;
}

.activation-card em {
  display: block;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(255,255,255,.09);
  color: #9df7ff;
  font-style: normal;
  font-size: .82rem;
  line-height: 1.45;
  font-weight: 800;
}

.activation-punch,
.session-engine-note {
  max-width: 1040px;
  margin: 34px auto 0;
  padding: 22px 26px;
  border-radius: 26px;
  border: 1px solid rgba(0,240,255,.22);
  background:
    radial-gradient(circle at 50% 0%, rgba(0,240,255,.11), transparent 44%),
    rgba(0,240,255,.055);
  color: #dbeafe;
  text-align: center;
  line-height: 1.65;
  font-size: 1rem;
}

.activation-punch strong,
.session-engine-note strong {
  color: #fff;
}

/* 7 Crystal Fields */

.field-map-grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  gap: 14px;
  margin-top: 44px;
}

.field-map-card {
  position: relative;
  min-height: 430px;
  padding: 22px 18px 20px;
  border-radius: 28px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 20% 0%, rgba(0,240,255,.12), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.026));
  box-shadow: 0 24px 76px rgba(0,0,0,.22);
  overflow: hidden;
}

.field-map-card::after {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  bottom: 0;
  height: 3px;
  border-radius: 99px 99px 0 0;
  background: linear-gradient(90deg, #20e8ff, #7c6cff, #ec4899);
  opacity: .72;
}

.field-map-card.is-silence {
  border-color: rgba(255,255,255,.20);
  background:
    radial-gradient(circle at 20% 0%, rgba(255,255,255,.14), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.032));
}

.field-index {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  border-radius: 13px;
  background: linear-gradient(135deg, var(--cyan), #9df7ff);
  color: #06111b;
  font-weight: 1000;
  font-size: .72rem;
}

.field-map-card h3 {
  color: #fff;
  font-size: 1.05rem;
  margin-bottom: 10px;
}

.field-map-card p {
  color: #b9c8e5;
  line-height: 1.55;
  font-size: .91rem;
}

.field-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 18px 0;
}

.field-meta span {
  display: inline-flex;
  padding: 6px 8px;
  border-radius: 999px;
  border: 1px solid rgba(0,240,255,.16);
  background: rgba(0,240,255,.055);
  color: #dbeafe;
  font-size: .69rem;
  font-weight: 800;
}

.field-line {
  padding: 12px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.field-line b {
  display: block;
  color: #fff;
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  margin-bottom: 5px;
}

.field-line em {
  color: #b9c8e5;
  font-style: normal;
  font-size: .84rem;
  line-height: 1.45;
}

.field-quote {
  margin-top: 14px;
  padding: 12px 13px;
  border-radius: 18px;
  border: 1px solid rgba(168,85,247,.22);
  background: rgba(168,85,247,.075);
  color: #f4e8ff;
  font-weight: 900;
  line-height: 1.35;
  font-size: .86rem;
}

/* Session Engine */

.session-engine-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 44px;
}

.session-engine-card {
  padding: 26px;
  border-radius: 30px;
  border: 1px solid rgba(255,255,255,.12);
  background:
    radial-gradient(circle at 15% 0%, rgba(0,240,255,.12), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.026));
  box-shadow: 0 24px 76px rgba(0,0,0,.22);
}

.session-engine-card.is-featured {
  border-color: rgba(0,240,255,.30);
  background:
    radial-gradient(circle at 18% 0%, rgba(0,240,255,.16), transparent 44%),
    radial-gradient(circle at 90% 20%, rgba(168,85,247,.14), transparent 40%),
    linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.03));
}

.session-top {
  display: flex;
  gap: 14px;
  align-items: center;
  margin-bottom: 16px;
}

.session-top span {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 14px;
  background: linear-gradient(135deg, var(--cyan), #60a5fa);
  color: #020617;
  font-weight: 1000;
  font-size: .76rem;
}

.session-top h3 {
  color: #fff;
  font-size: 1.22rem;
}

.session-engine-card p {
  color: #b9c8e5;
  line-height: 1.62;
  margin-bottom: 18px;
}

.session-spec {
  display: grid;
  grid-template-columns: 110px 1fr;
  gap: 12px;
  padding: 12px 0;
  border-top: 1px solid rgba(255,255,255,.08);
}

.session-spec b {
  color: #9df7ff;
  font-size: .73rem;
  letter-spacing: .1em;
  text-transform: uppercase;
}

.session-spec em {
  color: #dbeafe;
  font-style: normal;
  line-height: 1.45;
  font-size: .9rem;
}

/* Responsive */

@media (max-width: 1280px) {
  .activation-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .field-map-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 980px) {
  .session-engine-grid {
    grid-template-columns: 1fr;
  }

  .field-map-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .activation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .field-map-card,
  .activation-card {
    min-height: auto;
  }
}

@media (max-width: 620px) {
  .activation-section,
  .fields-section,
  .session-engine-section {
    padding: 68px 0;
  }

  .activation-grid,
  .field-map-grid,
  .session-engine-grid {
    grid-template-columns: 1fr;
    margin-top: 32px;
  }

  .activation-punch,
  .session-engine-note {
    text-align: left;
    padding: 20px;
    border-radius: 22px;
  }

  .session-spec {
    grid-template-columns: 1fr;
    gap: 4px;
  }
}

/* ===================================================== */
/* Shared utility helpers — moved from inline styles */
/* ===================================================== */
.desc-left{margin-left:0!important;}
.desc-left-wide{margin-left:0!important;max-width:980px!important;}
.desc-left-920{margin-left:0!important;max-width:920px!important;}
.kicker-gold{color:#fde68a!important;}
.kicker-gold-var{color:var(--gold)!important;}
.h2-compact{font-size:clamp(1.7rem,4vw,3.4rem)!important;}
.card-flat-danger{box-shadow:none!important;background:rgba(251,113,133,.05)!important;border-color:rgba(251,113,133,.18)!important;}
.card-flat-success{box-shadow:none!important;background:rgba(52,211,153,.05)!important;border-color:rgba(52,211,153,.18)!important;}
.card-flat-danger-strong{box-shadow:none!important;background:rgba(251,113,133,.055)!important;border-color:rgba(251,113,133,.22)!important;}
.card-flat-success-strong{box-shadow:none!important;background:rgba(52,211,153,.055)!important;border-color:rgba(52,211,153,.22)!important;}
.card-flat-info-strong{box-shadow:none!important;background:rgba(32,232,255,.055)!important;border-color:rgba(32,232,255,.22)!important;}
.actions-center{justify-content:center!important;}
.hero-note-center{margin-left:auto!important;margin-right:auto!important;}
.hero-note-centered-spaced{text-align:center!important;margin:28px auto 0!important;}
.mt-26{margin-top:26px!important;}


/* ===================================================== */
/* Unified LT / EN / RU language switcher */
/* ===================================================== */
.lang-switch{display:inline-flex;align-items:center;gap:7px;padding:5px;border:1px solid rgba(255,255,255,.13);border-radius:999px;background:rgba(255,255,255,.045);box-shadow:inset 0 0 0 1px rgba(255,255,255,.035)}
.lang-pill{min-width:36px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:999px;border:1px solid rgba(255,255,255,.12);color:#aab8d4;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;background:rgba(255,255,255,.035);transition:.22s ease;text-decoration:none!important}
.lang-pill:hover{color:#fff;border-color:rgba(32,232,255,.45);background:rgba(32,232,255,.10)}
.lang-pill.active{color:#fff;border-color:rgba(32,232,255,.55);background:linear-gradient(135deg,rgba(32,232,255,.20),rgba(168,85,247,.16));box-shadow:0 0 20px rgba(32,232,255,.18)}
@media(max-width:760px){.lang-switch{gap:5px;padding:4px}.lang-pill{min-width:34px;height:30px;font-size:11px}}


/* Visible language switcher fix */
.lang-switch{display:inline-flex!important;align-items:center!important;gap:7px!important;padding:5px!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:999px!important;background:rgba(255,255,255,.045)!important;white-space:nowrap!important;flex:0 0 auto!important;}
.lang-pill{min-width:34px!important;height:30px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:999px!important;border:1px solid rgba(255,255,255,.14)!important;color:#aab8d4!important;font-size:12px!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;background:rgba(255,255,255,.04)!important;text-decoration:none!important;line-height:1!important;}
.lang-pill:hover{color:#fff!important;border-color:rgba(32,232,255,.5)!important;background:rgba(32,232,255,.1)!important;}
.lang-pill.active{color:#fff!important;border-color:rgba(32,232,255,.65)!important;background:linear-gradient(135deg,rgba(32,232,255,.22),rgba(168,85,247,.18))!important;box-shadow:0 0 18px rgba(32,232,255,.18)!important;}
@media(max-width:900px){.lang-switch{order:20!important}.lang-pill{min-width:32px!important;height:28px!important;font-size:11px!important}}


/* ===================================================== */
/* HEADER COMPACT ICON NAV FIX */
/* ===================================================== */
.site-header .container,
.topbar .container,
.header-inner,
.topbar-inner{
  max-width:1180px;
}
.site-nav,
.nav{
  gap:14px!important;
}
.site-nav a,
.nav a{
  white-space:nowrap;
}
.nav-icon{
  width:44px!important;
  min-width:44px!important;
  height:38px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:14px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  background:rgba(255,255,255,.045)!important;
  color:#eaf6ff!important;
  font-size:18px!important;
  line-height:1!important;
  letter-spacing:0!important;
  text-decoration:none!important;
  flex:0 0 44px!important;
}
.nav-icon:hover,
.nav-icon.active{
  border-color:rgba(32,232,255,.55)!important;
  background:rgba(32,232,255,.10)!important;
  color:#fff!important;
  box-shadow:0 0 18px rgba(32,232,255,.16)!important;
}
.nav-contact{
  border-color:rgba(32,232,255,.45)!important;
  color:var(--cyan,#20e8ff)!important;
}
.lang-switch{
  margin-left:2px!important;
  flex:0 0 auto!important;
}
@media(max-width:1180px){
  .site-nav,.nav{gap:10px!important;}
  .site-nav a:not(.nav-icon):not(.lang-pill),
  .nav a:not(.nav-icon):not(.lang-pill){font-size:11px!important;letter-spacing:.08em!important;}
  .brand-sub,.logo-subtitle{max-width:190px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
}
@media(max-width:980px){
  .nav-icon{width:40px!important;min-width:40px!important;height:36px!important;flex-basis:40px!important;}
}


/* ===================================================== */
/* CANONICAL COMPACT HEADER */
/* ===================================================== */
.site-nav.nav{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:12px!important;flex:1 1 auto!important;min-width:0!important;}
.site-nav .nav-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:38px!important;padding:0 10px!important;border-radius:13px!important;color:#b9c7dd!important;font-size:12px!important;font-weight:900!important;letter-spacing:.09em!important;text-transform:uppercase!important;white-space:nowrap!important;text-decoration:none!important;}
.site-nav .nav-link:hover,.site-nav .nav-link.active{color:#fff!important;background:rgba(255,255,255,.075)!important;}
.header-inner,.topbar-inner,.site-header .container,.topbar .container{display:flex!important;align-items:center!important;gap:18px!important;}
.brand,.logo{flex:0 1 300px!important;min-width:190px!important;}
@media(max-width:1180px){.site-nav.nav{gap:8px!important}.site-nav .nav-link{font-size:10.5px!important;padding:0 7px!important;letter-spacing:.07em!important}.brand,.logo{flex-basis:250px!important}.brand-sub,.logo-subtitle{max-width:180px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}}
@media(max-width:980px){.site-nav.nav{gap:6px!important}.site-nav .nav-link{display:none!important}.site-nav .nav-link.active{display:none!important}.brand,.logo{flex:1 1 auto!important;min-width:160px!important}}


/* ===================================================== */
/* REBUILT COMPACT HEADER */
/* ===================================================== */
.header-inner.topbar-inner{min-height:76px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important;}
.header-inner .brand,.header-inner .logo{flex:0 1 300px!important;min-width:190px!important;display:flex!important;align-items:center!important;gap:12px!important;}
.site-nav.nav{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:11px!important;flex:1 1 auto!important;min-width:0!important;}
.site-nav .nav-link{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:38px!important;padding:0 9px!important;border-radius:13px!important;color:#b9c7dd!important;font-size:11.5px!important;font-weight:900!important;letter-spacing:.075em!important;text-transform:uppercase!important;white-space:nowrap!important;text-decoration:none!important;}
.site-nav .nav-link:hover,.site-nav .nav-link.active{color:#fff!important;background:rgba(255,255,255,.075)!important;}
.nav-icon{width:42px!important;min-width:42px!important;height:38px!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border-radius:14px!important;border:1px solid rgba(255,255,255,.13)!important;background:rgba(255,255,255,.045)!important;color:#eaf6ff!important;font-size:18px!important;line-height:1!important;letter-spacing:0!important;text-decoration:none!important;flex:0 0 42px!important;}
.nav-icon:hover,.nav-icon.active{border-color:rgba(32,232,255,.55)!important;background:rgba(32,232,255,.10)!important;color:#fff!important;box-shadow:0 0 18px rgba(32,232,255,.16)!important;}
.nav-contact{border-color:rgba(32,232,255,.45)!important;color:var(--cyan,#20e8ff)!important;}
.lang-switch{margin-left:2px!important;}
@media(max-width:1180px){.site-nav.nav{gap:7px!important}.site-nav .nav-link{font-size:10px!important;padding:0 6px!important;letter-spacing:.055em!important}.header-inner .brand,.header-inner .logo{flex-basis:238px!important}.brand-sub,.logo-subtitle{max-width:170px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}}
@media(max-width:980px){.site-nav .nav-link{display:none!important}.site-nav.nav{gap:6px!important}.header-inner .brand,.header-inner .logo{flex:1 1 auto!important;min-width:150px!important}.nav-icon{width:40px!important;min-width:40px!important;flex-basis:40px!important;height:36px!important}}


/* ===================================================== */
/* MOBILE MENU RESTORE */
/* ===================================================== */
.mobile-menu-toggle{
  display:none;
  width:42px;
  height:38px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.055);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
  cursor:pointer;
  flex:0 0 42px;
  z-index:120;
}
.mobile-menu-toggle span{
  display:block;
  width:18px;
  height:2px;
  border-radius:99px;
  background:#eef8ff;
  box-shadow:0 0 10px rgba(32,232,255,.22);
  transition:transform .22s ease, opacity .22s ease;
}
.mobile-menu-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu-toggle.is-open span:nth-child(2){opacity:0}
.mobile-menu-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-menu{
  display:none;
  position:absolute;
  left:14px;
  right:14px;
  top:calc(100% + 10px);
  padding:14px;
  border-radius:22px;
  border:1px solid rgba(32,232,255,.22);
  background:rgba(5,12,28,.96);
  backdrop-filter:blur(18px);
  box-shadow:0 24px 80px rgba(0,0,0,.42), 0 0 30px rgba(32,232,255,.10);
  z-index:110;
}
.mobile-menu.is-open{display:grid;gap:8px;}
.mobile-nav-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:44px;
  padding:0 14px;
  border-radius:14px;
  color:#dcecff;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.075);
  font-size:12px;
  font-weight:900;
  letter-spacing:.11em;
  text-transform:uppercase;
  text-decoration:none;
}
.mobile-nav-link.active,
.mobile-nav-link:hover{
  color:#fff;
  border-color:rgba(32,232,255,.34);
  background:rgba(32,232,255,.10);
}
.mobile-lang-row{
  display:flex;
  gap:8px;
  justify-content:center;
  padding-top:8px;
}
@media(max-width:980px){
  header,.topbar,.site-header{position:sticky!important;top:0!important;z-index:100!important;}
  .mobile-menu-toggle{display:inline-flex!important;}
  .header-inner .site-nav .nav-link{display:none!important;}
  .header-inner .site-nav .nav-icon,
  .header-inner .site-nav .lang-switch{display:none!important;}
  .site-nav.nav{display:none!important;}
  .header-inner.topbar-inner{position:relative!important;}
}
@media(min-width:981px){.mobile-menu{display:none!important}.mobile-menu-toggle{display:none!important}}


/* ===================================================== */
/* MOBILE MENU CLOSE / TOGGLE FIX */
/* ===================================================== */
.mobile-menu{
  display:none!important;
  opacity:0!important;
  pointer-events:none!important;
  transform:translateY(-8px)!important;
}
html.mobile-menu-open .mobile-menu,
body.mobile-menu-open .mobile-menu,
.mobile-menu.is-open{
  display:grid!important;
  opacity:1!important;
  pointer-events:auto!important;
  transform:translateY(0)!important;
}
.mobile-menu-toggle{touch-action:manipulation!important;}
.mobile-menu-backdrop{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.28);
  z-index:95;
}
html.mobile-menu-open .mobile-menu-backdrop,
body.mobile-menu-open .mobile-menu-backdrop{
  display:block;
}
@media(min-width:981px){
  .mobile-menu,.mobile-menu.is-open{display:none!important;opacity:0!important;pointer-events:none!important;}
  .mobile-menu-backdrop{display:none!important;}
}


/* Index ecosystem punch */
.ecosystem-punch{max-width:980px;margin:34px auto 0;padding:22px 24px;border-radius:24px;border:1px solid rgba(32,232,255,.18);background:rgba(32,232,255,.055);color:#dbeafe;line-height:1.6;text-align:center;font-size:1.02rem;}
.ecosystem-punch strong{color:#fff;}


/* Canonical safety block */
.safety-canonical-grid{margin-top:26px;}
.safety-card ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;color:#cbd8f2;line-height:1.5;}
.safety-card.danger{border-color:rgba(251,113,133,.22);background:rgba(251,113,133,.055);}
.safety-card.success{border-color:rgba(52,211,153,.22);background:rgba(52,211,153,.055);}

/* =====================================================
   MOBILE PREMIUM POLISH 20260714
===================================================== */
@media (max-width: 680px) {
  :root {
    --mobile-surface-radius: 22px;
  }

  html {
    scroll-padding-top: 84px;
  }

  body {
    background-color: #030816;
  }

  .container {
    width: min(100% - 34px, 1180px);
  }

  .topbar {
    background: rgba(3,7,20,.94) !important;
    border-bottom-color: rgba(125,211,252,.14) !important;
    box-shadow: 0 14px 40px rgba(0,0,0,.42) !important;
  }

  .header-inner.topbar-inner {
    height: 82px !important;
    min-height: 82px !important;
    gap: 12px !important;
  }

  .header-inner .brand,
  .header-inner .logo {
    min-width: 0 !important;
    gap: 12px !important;
  }

  .brand-mark {
    width: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
    box-shadow: 0 0 24px rgba(32,232,255,.22), inset 0 0 0 1px rgba(255,255,255,.08) !important;
  }

  .brand-title {
    font-size: clamp(1.2rem, 5.2vw, 1.42rem) !important;
    letter-spacing: 0 !important;
  }

  .mobile-menu-toggle {
    width: 48px !important;
    height: 48px !important;
    border-radius: 17px !important;
    border-color: rgba(180,205,255,.18) !important;
    background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)) !important;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.035), 0 12px 34px rgba(0,0,0,.32) !important;
  }

  .mobile-menu {
    left: 17px !important;
    right: 17px !important;
    top: calc(100% + 8px) !important;
    padding: 10px !important;
    border-radius: 20px !important;
    background: rgba(4,10,24,.97) !important;
  }

  .mobile-nav-link {
    min-height: 42px !important;
    border-radius: 13px !important;
    letter-spacing: 0 !important;
  }

  .hero {
    padding-top: 40px !important;
  }

  section {
    scroll-margin-top: 92px;
  }

  .hero-card,
  .panel,
  .node-visual-card,
  .catalog-visual-card,
  .operator-visual-card,
  .installation-image-wrap,
  .install-image-stack,
  .origins-gallery figure,
  .origins-feature-image,
  .origins-wide-reference {
    border-radius: var(--mobile-surface-radius) !important;
    border-color: rgba(125,211,252,.18) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.028)) !important;
    box-shadow: 0 18px 54px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.025) !important;
  }

  .hero-card img,
  .panel img,
  .node-visual-card img,
  .catalog-visual-card img,
  .operator-visual-card img,
  .installation-image-wrap img,
  .install-image-stack img,
  .how-panel img,
  .origins-gallery img,
  .origins-feature-image img,
  .origins-wide-reference img {
    width: 100% !important;
    height: auto !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    background: #050b18 !important;
  }

  .feature,
  .install-item,
  .engine-step,
  .ring {
    border-radius: 18px !important;
    border-color: rgba(125,211,252,.14) !important;
    background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.028)) !important;
  }

  .check,
  .install-dot,
  .ring-dot {
    box-shadow: 0 0 18px rgba(52,211,153,.16) !important;
  }
}

