/* XYR HUB / CYBER 2.0
   Geometrie CSS + SVG locali. Nessuna dipendenza o immagine remota.
   Questo foglio estende styles.css, mantenendo struttura e contenuti. */

@property --rim-angle {
  syntax: '<angle>';
  initial-value: 25deg;
  inherits: false;
}

:root {
  --cyan-rgb: 88, 229, 238;
  --violet-rgb: 167, 121, 255;
  --page-progress: 0;
}

.cyber-theme {
  background: #06091c;
  overflow-x: clip;
}

/* Navigazione / binario luminoso */
.cyber-theme .site-header {
  background: linear-gradient(110deg, #070a22ed, #050614f2);
  border-bottom-color: #58e5ee2b;
  box-shadow: 0 8px 35px #00000055;
}
.reading-line {
  position: absolute;
  bottom: -1px;
  left: 0;
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, var(--violet), #d5b2ff, var(--cyan));
  box-shadow: 0 0 12px #58e5ee70;
  transform: scaleX(var(--page-progress));
  transform-origin: left;
  pointer-events: none;
}
.brand-mark {
  filter: drop-shadow(0 0 9px #58e5ee28);
  transition: filter .3s, transform .3s;
}
.brand:hover .brand-mark {
  filter: drop-shadow(0 0 9px #a779ff80);
  transform: rotate(-7deg);
}
.desktop-nav a::after {
  box-shadow: 0 0 10px #a779ff90;
}
.desktop-nav a:hover, .desktop-nav a.active {
  color: #effeff;
  text-shadow: 0 0 18px #58e5ee50;
}
.mobile-nav {
  background: linear-gradient(130deg, #0c0f2e, #060819);
  border-bottom-color: #58e5ee5c;
  box-shadow: 0 16px 45px #00000099;
}

/* Apertura: riflessi e reticolo sopra lo sfondo originale */
.hero {
  --parallax-x: 0px;
  --parallax-y: 0px;
}
.hero-backdrop {
  transform: translate3d(var(--parallax-x), var(--parallax-y), 0) scale(1.035);
  transition: transform .45s cubic-bezier(.2,.65,.3,1);
}
.hero-content, .hero-bottom {
  position: relative;
  z-index: 2;
}
.hero-bottom { position: absolute; }
.hero-content .eyebrow {
  width: fit-content;
  max-width: 100%;
  padding: 8px 12px;
  border: 1px solid #58e5ee3b;
  border-left-color: #a779ff;
  background: linear-gradient(100deg, #0d1138b3, #0b0d2177);
  box-shadow: inset 0 0 18px #58e5ee05;
  color: #b7e8ec;
  font-size: 12px;
  letter-spacing: 1.7px;
}
.hero h1 > span {
  text-shadow: 0 0 34px #a779ff24;
}
.hero-hud {
  position: absolute;
  z-index: 0;
  width: min(39vw, 570px);
  aspect-ratio: 1;
  right: 1.5%;
  top: 13%;
  opacity: .47;
  transform: translate3d(calc(var(--parallax-x) * -1), calc(var(--parallax-y) * -1), 0);
  transition: transform .6s ease;
  pointer-events: none;
}
.hero .hero-hud svg.hud-reticle {
  width: 100%;
  height: 100%;
  stroke: #58e5ee;
  stroke-width: .65;
  filter: drop-shadow(0 0 5px #58e5ee88);
}
.hud-reticle .hud-violet { stroke: #a154ff; stroke-width: 2; }
.hud-orbit { transform-origin: center; }
.hero.fx-visible .hud-orbit { animation: hud-orbit-in 4s ease-out both; }

/* Boutons: il bordo resta leggibile anche senza hover. */
.cyber-theme .button {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: linear-gradient(115deg, #9b49ff, #8826ff 65%, #a358ff);
  border-color: #b77cff;
  border-radius: 4px 13px 4px 13px;
  box-shadow: inset 0 1px 0 #d8b9ff80, 0 0 22px #a779ff12;
}
.cyber-theme .button::before {
  content: '';
  position: absolute;
  inset: -40% -35%;
  z-index: -1;
  background: linear-gradient(110deg, transparent 35%, #ffffff88 49%, transparent 62%);
  transform: translateX(-100%);
  pointer-events: none;
}
.cyber-theme .button:hover {
  box-shadow: inset 0 1px 0 #ffffff99, 0 0 22px #a779ff50, 0 7px 28px #00000077;
}
.cyber-theme .button:hover::before { animation: button-sweep .7s ease-out both; }
.text-link { transition: color .25s, text-shadow .25s; }
.text-link:hover { text-shadow: 0 0 17px #58e5ee70; }
.text-link > span { transition: transform .25s; }
.text-link:hover > span { transform: translateX(5px); }
.intro-strip {
  background: linear-gradient(90deg, #0b0e2a, #070919 45%, #101332);
  border-top-color: #58e5ee42;
  border-bottom-color: #a779ff2b;
  box-shadow: 0 -1px 18px #58e5ee0a;
}
.intro-strip-inner > span {
  position: relative;
  padding-block: 9px;
  transition: color .3s, text-shadow .3s;
}
.intro-strip-inner > span:hover { color: var(--cyan); text-shadow: 0 0 18px #58e5ee60; }

/* Sezioni: piste geometriche, griglia e cornici da interfaccia. */
.cyber-section {
  position: relative;
  isolation: isolate;
}
.cyber-section::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url('assets/circuit-field.svg') right top / 560px 400px repeat;
  mask-image: linear-gradient(90deg, #00000099, transparent 45%, #000000);
  opacity: .32;
  pointer-events: none;
}
.cyber-section::after {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, #58e5ee77 22%, #58e5ee12 50%, #a779ff66 80%, transparent);
  pointer-events: none;
}
.section-heading > .eyebrow {
  font-size: 12px;
  color: #9097c8;
  letter-spacing: 2px;
}
.section-heading > .eyebrow::before {
  content: '';
  width: 24px;
  height: 7px;
  flex: 0 0 auto;
  background: repeating-linear-gradient(110deg, var(--cyan) 0 3px, transparent 3px 6px);
  filter: drop-shadow(0 0 6px #58e5ee66);
}
.advantages-section .section-heading > .eyebrow::before,
.together-section .section-heading > .eyebrow::before {
  background: repeating-linear-gradient(110deg, var(--violet) 0 3px, transparent 3px 6px);
}
.text-cyan { text-shadow: 0 0 28px #58e5ee1e; }
.text-violet { text-shadow: 0 0 28px #a779ff1e; }
.heading-row > p { font-size: 16px; }
.advantages-section {
  background: radial-gradient(ellipse at 20% 100%, #171c4c65, transparent 65%), #07091d;
}
.plans-section {
  background: radial-gradient(ellipse at 50% 55%, #12195450, transparent 75%), #050717;
}
.together-section {
  background: radial-gradient(ellipse at 80% 50%, #14194755, transparent 70%), #07091a;
}

/* Cornice a quattro strati: vetro, doppio bordo, luce orbitante, scan. */
.cyber-panel {
  --accent: var(--cyan);
  --accent-rgb: var(--cyan-rgb);
  --mx: 50%;
  --my: 0%;
  --tilt-x: 0deg;
  --tilt-y: 0deg;
  position: relative;
  isolation: isolate;
  border: 1px solid rgba(var(--accent-rgb), .72);
  border-radius: 22px 8px 22px 8px;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(var(--accent-rgb), .085), transparent 66%),
    linear-gradient(135deg, #0c0e25f7, #050614f7);
  box-shadow:
    inset 0 0 0 3px #05071599,
    inset 0 0 22px rgba(var(--accent-rgb), .035),
    0 0 0 4px rgba(var(--accent-rgb), .035),
    0 0 9px rgba(var(--accent-rgb), .16),
    0 0 27px rgba(var(--accent-rgb), .09),
    0 16px 40px #00000044;
  transition: transform .35s cubic-bezier(.18,.7,.3,1), border-color .3s, box-shadow .3s;
}
.cyber-panel > :not(.panel-fx) { position: relative; z-index: 2; }
.cyber-panel::before {
  content: '';
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  z-index: 0;
  border-radius: inherit;
  background: radial-gradient(340px circle at var(--mx) var(--my), rgba(var(--accent-rgb), .2), transparent 75%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s;
}
.cyber-panel::after {
  content: '';
  position: absolute;
  inset: 7px;
  z-index: 1;
  width: auto;
  height: auto;
  border: 1px solid rgba(var(--accent-rgb), .28);
  border-radius: 16px 4px 16px 4px;
  background: none;
  pointer-events: none;
}
.cyber-panel:focus-visible {
  outline: 2px solid #e8fdff;
  outline-offset: 6px;
}
.cyber-panel:is(.is-hovered, :focus-visible, :focus-within),
.plan-card.cyber-panel:is(.is-hovered, :focus-visible, :focus-within) {
  border-color: var(--accent);
  box-shadow:
    inset 0 0 0 3px #05071588,
    inset 0 0 34px rgba(var(--accent-rgb), .07),
    0 0 0 4px rgba(var(--accent-rgb), .06),
    0 0 12px rgba(var(--accent-rgb), .42),
    0 0 34px rgba(var(--accent-rgb), .25),
    0 24px 42px #00000077;
}
.cyber-panel:is(.is-hovered, :focus-visible, :focus-within)::before { opacity: 1; }
.panel-fx {
  position: absolute;
  inset: -1px;
  z-index: 3;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
}
.panel-fx > span { position: absolute; pointer-events: none; }
.panel-rim {
  inset: 0;
  border-radius: inherit;
  padding: 1.5px;
  background: conic-gradient(from var(--rim-angle), transparent 0% 28%, var(--accent) 33%, #e5fdff 36%, var(--accent) 39%, transparent 45% 76%, var(--accent) 81%, transparent 86%);
  -webkit-mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#ffffff 0 0) content-box, linear-gradient(#ffffff 0 0);
  mask-composite: exclude;
  opacity: .7;
}
.panel-brackets {
  inset: 13px;
  border-radius: 9px 0 9px 0;
  background:
    linear-gradient(var(--accent), var(--accent)) left top / 15px 1px,
    linear-gradient(var(--accent), var(--accent)) left top / 1px 15px,
    linear-gradient(var(--accent), var(--accent)) right bottom / 15px 1px,
    linear-gradient(var(--accent), var(--accent)) right bottom / 1px 15px;
  background-repeat: no-repeat;
  opacity: .55;
  filter: drop-shadow(0 0 4px var(--accent));
  transition: opacity .3s;
}
.panel-scan {
  inset: 0;
  opacity: 0;
  background: linear-gradient(180deg, transparent 38%, rgba(var(--accent-rgb), .08) 49%, rgba(var(--accent-rgb), .45) 50%, transparent 51%);
  transform: translateY(-100%);
}
.panel-brackets::before, .panel-brackets::after {
  content: '';
  position: absolute;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: #e9feff;
  box-shadow: 0 0 5px var(--accent), 0 0 12px var(--accent);
}
.panel-brackets::before { left: 27px; top: -12px; }
.panel-brackets::after { right: 27px; bottom: -12px; }
.is-hovered > .panel-fx .panel-brackets { opacity: 1; }
.is-hovered > .panel-fx .panel-rim { animation: rim-orbit 3s linear infinite; opacity: 1; }
.is-hovered > .panel-fx .panel-scan { animation: panel-scan 1.4s ease-out both; }

/* Le otto schede riprendono la tavola I NOSTRI PIANI dello ZIP. */
.plans-grid { gap: 26px; }
.plan-card.cyber-panel {
  min-height: 275px;
  padding: 31px 25px 29px;
  text-align: center;
  overflow: visible;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  border-color: rgba(var(--accent-rgb), .72);
}
.plan-card:nth-child(4n+1), .plan-card:nth-child(4n+3),
.benefit:nth-child(2n+1), .plan-dialog {
  --accent: var(--violet);
  --accent-rgb: var(--violet-rgb);
}
.cyber-theme .plan-card::after { background: none; }
.plan-card .plan-number {
  position: absolute;
  top: 25px;
  left: 27px;
  color: #9ba1c7;
  font-size: 12px;
}
.plan-card > .plan-arrow {
  position: absolute;
  right: 25px;
  top: 16px;
  color: var(--accent);
  opacity: .7;
}
.plan-card > svg {
  width: 60px !important;
  height: 60px !important;
  margin: 26px 0 24px;
  color: var(--accent) !important;
  stroke-width: 1.3 !important;
  filter: drop-shadow(0 0 8px rgba(var(--accent-rgb), .45)) !important;
  transition: transform .45s cubic-bezier(.2,.7,.3,1), filter .35s;
}
.plan-title {
  display: block;
  font-size: 21px;
  line-height: 1.3;
  letter-spacing: .4px;
  text-transform: uppercase;
  font-weight: 700;
}
.plan-summary {
  display: block;
  color: #a9aecf;
  font-size: 14px;
  line-height: 1.5;
  max-width: 210px;
  margin-top: 10px;
}
.plan-card.is-hovered > svg {
  transform: translateY(-5px) scale(1.08);
  filter: drop-shadow(0 0 14px rgba(var(--accent-rgb), .8)) !important;
}
.plan-card.is-hovered .plan-title { text-shadow: 0 0 16px rgba(var(--accent-rgb), .45); }

/* Vantaggi e invito alla presentazione */
.benefit { padding: 36px 30px 32px; }
.benefit-top { align-items: flex-start; margin-bottom: 27px; }
.benefit-top > svg {
  width: 46px !important;
  height: 46px !important;
  padding: 3px;
  color: var(--accent) !important;
  filter: drop-shadow(0 0 8px rgba(var(--accent-rgb), .4));
  transition: transform .35s;
}
.benefit.is-hovered .benefit-top > svg { transform: translateY(-4px); }
.benefit-top > span { font-size: 13px; color: #969cc5; }
.benefit h3 { font-size: 23px; min-height: 60px; }
.benefit p { font-size: 16px; color: #a9aed1; }
.benefit-label {
  font-size: 12px;
  letter-spacing: .8px;
  line-height: 1.65;
  color: #949ac4;
  border-color: rgba(var(--accent-rgb), .27);
}
.presentation-callout { padding: 38px; }
.presentation-caption { flex-wrap: wrap; gap: 10px; font-size: 12px; }
.presentation-caption small { font-size: 12px; color: #9aa0c7; }
.presentation-callout > p { font-size: 16px; }
.presentation-callout .button, .pdf-link { font-size: 14px; }
.presentation-callout h3 { font-size: 38px; }
.pdf-link { min-height: 44px; }

/* Diagramma: consolle traslucida e circuiti animati. */
.cyber-console {
  border: 1px solid #58e5ee30;
  border-radius: 30px 8px 30px 8px;
  background:
    linear-gradient(#58e5ee06 1px, transparent 1px) center / 30px 30px,
    linear-gradient(90deg, #58e5ee06 1px, transparent 1px) center / 30px 30px,
    radial-gradient(ellipse at center, #1a5b6059, #080a1b 73%);
  box-shadow: inset 0 0 70px #02040f, 0 0 40px #58e5ee08;
}
.cyber-console::before, .cyber-console::after {
  content: '';
  position: absolute;
  width: 60px;
  height: 40px;
  pointer-events: none;
}
.cyber-console::before { inset: 11px auto auto 11px; border-top: 1px solid #58e5ee; border-left: 1px solid #58e5ee; border-radius: 20px 0 0; }
.cyber-console::after { inset: auto 11px 11px auto; border-bottom: 1px solid #a779ff; border-right: 1px solid #a779ff; border-radius: 0 0 20px; }
.network-core {
  border-color: #ab67ff;
  background: radial-gradient(ellipse at 50% 20%, #175b60, #080a1d 70%);
  box-shadow: 0 0 0 6px #a779ff0d, 0 0 0 7px #a779ff48, 0 0 22px #a779ff33, inset 0 0 25px #58e5ee10;
}
.network-core::before {
  inset: -23px;
  border: 2px dashed #58e5ee66;
  border-top-color: #b4faff;
  border-bottom-color: #a55cff;
  box-shadow: 0 0 15px #58e5ee18;
  animation: core-orbit 45s linear infinite paused;
}
.network-core::after {
  content: '';
  position: absolute;
  inset: -15px;
  border: 1px solid #58e5ee45;
  border-left: 3px solid #58e5ee;
  border-right: 3px solid #a779ff;
  border-radius: 50%;
  animation: core-orbit 24s linear reverse infinite paused;
  pointer-events: none;
}
.fx-visible .network-core::before, .fx-visible .network-core::after { animation-play-state: running; }
.network-core > span { text-shadow: 0 0 16px #58e5ee33; }
.network-core small { font-size: 10px; letter-spacing: .3px; }
.network-node {
  border-radius: 14px 4px 14px 4px;
  border-color: #58e5ee66;
  background: linear-gradient(145deg, #141840, #080a21 75%);
  box-shadow: inset 0 0 0 4px #58e5ee05, 0 0 18px #58e5ee10;
  transition: border-color .3s, box-shadow .3s, background .3s;
}
.network-node span { font-size: 14px; }
.network-node svg { filter: drop-shadow(0 0 6px #58e5ee70); }
.node-consult, .node-dev { border-color: #a779ff66; }
.node-consult svg, .node-dev svg { filter: drop-shadow(0 0 6px #a779ff60); }
.network-node:hover { border-color: #b3faff; box-shadow: 0 0 27px #58e5ee4a; }
.node-consult:hover, .node-dev:hover { border-color: #c89bff; box-shadow: 0 0 27px #a779ff4a; }
.network-trace { stroke-opacity: .35; stroke-width: 1; transition: stroke-opacity .3s, stroke-width .3s; }
.network-pulse {
  stroke: #aefaff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-dasharray: 3 97;
  stroke-dashoffset: 100;
  filter: drop-shadow(0 0 3px #58e5ee);
  opacity: .75;
  animation: trace-flow 5s linear infinite paused;
  animation-delay: var(--trace-delay, 0s);
}
.network-pulse[data-channel="consult"], .network-pulse[data-channel="dev"] { stroke: #ac69ff; filter: drop-shadow(0 0 3px #a779ff); }
.fx-visible .network-pulse { animation-play-state: running; }
.network-trace.channel-active { stroke-opacity: 1; stroke-width: 2; }
.network-pulse.channel-active { animation-duration: 2s; opacity: 1; }
.ecosystem-caption { font-size: 12px; letter-spacing: .6px; }

/* Bandeau et fenêtres: même langage visuel, sans obscurcir les images. */
.network-story { border-color: #58e5ee42; }
.network-story-content { position: relative; }
.network-story-content::after {
  content: '';
  position: absolute;
  inset: 55px 0;
  border-right: 1px solid #58e5ee55;
  background: linear-gradient(#58e5ee,#58e5ee) right top / 54px 1px no-repeat,
    linear-gradient(#a779ff,#a779ff) right bottom / 54px 1px no-repeat;
  pointer-events: none;
}
.network-story p { font-size: 16px; }
dialog.cyber-panel { position: fixed; }
dialog.cyber-panel > .dialog-close { position: absolute; z-index: 5; }
dialog.cyber-panel > .panel-fx { position: absolute; inset: 0; }
dialog::backdrop { background: #030513e5; }
dialog[open] { animation: dialog-activate .32s ease-out both; }
.plan-dialog.cyber-panel { padding: 42px; }
.dialog-note { font-size: 12px; letter-spacing: .3px; }
.plan-tags span { font-size: 14px; }
.plan-dialog .eyebrow { font-size: 12px; }
.plan-dialog .button { font-size: 14px; }
.presentation-dialog.cyber-panel { background: #06091c; overflow-x: hidden; }
.presentation-dialog::after { display: none; }
.presentation-toolbar b, #presentation-count, .presentation-download { font-size: 12px; }
.presentation-controls { position: relative; z-index: 4; }
.site-footer { border-color: #58e5ee35; }
.footer-wordmark { text-shadow: 0 0 15px #58e5ee30; }

/* L'inclinazione è riservata al mouse. I riflessi non bloccano mai i click. */
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
  .cyber-panel.tilt-ready:is(.is-hovered, :hover) {
    transform: perspective(900px) translateY(-7px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y));
    transition-duration: .18s;
  }
  .cyber-panel.tilt-ready:active { transform: perspective(900px) translateY(-2px) scale(.995); }
}

@keyframes rim-orbit { to { --rim-angle: 385deg; } }
@keyframes panel-scan {
  0% { opacity: 0; transform: translateY(-85%); }
  18% { opacity: .85; }
  78% { opacity: .7; }
  100% { opacity: 0; transform: translateY(95%); }
}
@keyframes button-sweep { to { transform: translateX(100%); } }
@keyframes trace-flow { to { stroke-dashoffset: 0; } }
@keyframes core-orbit { to { transform: rotate(360deg); } }
@keyframes hud-orbit-in { from { opacity: 0; transform: rotate(-55deg); } to { opacity: 1; transform: rotate(0); } }
@keyframes dialog-activate { from { opacity: 0; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }

@media (max-width: 1100px) {
  .plans-grid { gap: 21px; }
  .plan-card.cyber-panel { padding-inline: 20px; min-height: 260px; }
  .plan-title { font-size: 18px; }
  .benefit { padding: 31px 25px; }
  .benefit h3 { font-size: 21px; }
  .benefit p { font-size: 16px; }
  .benefit-label { font-size: 12px; }
  .network-core small { font-size: 9px; max-width: 100px; text-align: center; }
  .presentation-callout { padding: 32px; }
}
@media (max-width: 900px) {
  .hero-hud { width: 54vw; right: -12%; top: 16%; opacity: .25; }
  .plan-title { font-size: 21px; }
  .plans-grid { gap: 23px; }
  .benefit h3 { min-height: 79px; }
  .network-core small { max-width: 120px; }
}
@media (max-width: 700px) {
  .hero-content .eyebrow { font-size: 10px; letter-spacing: 1px; padding: 7px 9px; }
  .hero-content .eyebrow .tiny-line { width: 12px; }
  .hero-hud { display: none; }
  .hero-backdrop { transform: none; }
  .cyber-section::before { background-size: 420px 300px; opacity: .19; }
  .section-heading > .eyebrow { font-size: 12px; letter-spacing: 1px; }
  .section-heading > .eyebrow::before { width: 17px; }
  .cyber-panel { border-radius: 19px 6px 19px 6px; }
  .plans-grid { gap: 18px 15px; }
  .plan-card.cyber-panel { min-height: 247px; padding: 25px 15px; }
  .plan-card > svg { width: 46px !important; height: 46px !important; margin: 27px 0 23px; }
  .plan-title { font-size: clamp(15px, 4.3vw, 20px); letter-spacing: .1px; }
  .plan-summary { font-size: 14px; margin-top: 9px; }
  .plan-card .plan-number { left: 21px; top: 20px; }
  .plan-card > .plan-arrow { right: 19px; top: 12px; }
  .benefit { padding: 32px 28px; }
  .benefit h3 { min-height: 0; font-size: 23px; }
  .benefit-label { font-size: 12px; }
  .network-node { width: 108px; min-height: 82px; }
  .network-node span { font-size: 12px; }
  .network-core::before { inset: -18px; border-width: 1px; }
  .network-core::after { inset: -11px; border-width: 1px; }
  .network-core small { font-size: 8px; max-width: 75px; line-height: 1.5; }
  .ecosystem-map { height: 355px; }
  .node-data { left: 19%; top: 19%; }
  .node-consult { left: 80%; top: 19%; }
  .node-marketing { left: 82%; top: 58%; }
  .node-dev { left: 64%; top: 84%; }
  .node-design { left: 18%; top: 77%; }
  .ecosystem-caption { font-size: 12px; letter-spacing: .3px; }
  .presentation-callout { padding: 30px 25px; }
  .presentation-callout h3 { font-size: 35px; }
  .presentation-caption { font-size: 12px; letter-spacing: .5px; }
  .presentation-caption small { display: none; }
  .presentation-callout .button { font-size: 14px; }
  .network-story-content::after { display: none; }
  .plan-dialog.cyber-panel { padding: 32px 25px; }
  .dialog-note { font-size: 12px; letter-spacing: 0; line-height: 1.6; }
  .plan-dialog > p { font-size: 16px; }
  .presentation-toolbar b { font-size: 10px; }
  .presentation-download { font-size: 12px; }
  .presentation-controls { gap: 8px; }
}
@media (max-width: 359px) {
  .plans-grid { gap: 14px 12px; }
  .plan-card.cyber-panel { padding-inline: 11px; min-height: 243px; }
  .plan-title { font-size: 14px; }
  .plan-summary { font-size: 13px; }
  .network-node { width: 89px; min-height: 75px; }
  .network-node span { font-size: 11px; }
  .hero-content .eyebrow { letter-spacing: .6px; }
}
@media (hover: none), (pointer: coarse) {
  .cyber-panel { box-shadow: inset 0 0 0 3px #05071599, 0 0 17px rgba(var(--accent-rgb), .075); }
  .cyber-panel:hover { transform: none; }
  .network-pulse { display: none; }
  .network-core::before, .network-core::after { animation: none; }
}
@media (prefers-reduced-motion: reduce) {
  .cyber-theme *, .cyber-theme *::before, .cyber-theme *::after {
    animation: none !important;
    transition: none !important;
  }
  .cyber-panel.tilt-ready:is(.is-hovered, :hover), .hero-backdrop { transform: none !important; }
  .network-pulse, .panel-scan { display: none; }
  .hero-hud { transform: none; }
}