/* XYR HUB 4.0 · Identità ufficiale: indaco, viola, blu e ciano. */
:root {
  --bg: #06091d;
  --surface: #10132e;
  --surface-light: #191c40;
  --violet: #a779ff;
  --violet-light: #c7acff;
  --cyan: #58e5ee;
  --electric: #738cff;
  --text: #f6f5ff;
  --muted: #b5b9d4;
  --line: #9395e62e;
  --cyan-rgb: 88, 229, 238;
  --violet-rgb: 167, 121, 255;
}

body.cyber-theme { background: var(--bg); }
.cyber-theme .site-header {
  background: linear-gradient(105deg,#0b0c22f5,#060b1ded);
  border-bottom-color: #a779ff30;
  box-shadow: 0 8px 30px #02041155;
}
.brand, .footer-wordmark { display: inline-flex; align-items: center; gap: 14px; }
.cyber-theme .brand .brand-logo, .site-footer .footer-wordmark .brand-logo {
  width: 72px; height: 72px; max-height: none; object-fit: contain;
  border-radius: 23%; mix-blend-mode: normal;
  box-shadow: 0 0 22px #8f50ec18;
}
.brand .brand-wordmark, .footer-wordmark .brand-wordmark {
  display: inline-flex; gap: .27em; font-size: 27px; font-weight: 800;
  line-height: 1.1; letter-spacing: .025em; white-space: nowrap; color: #f6f5ff;
}
.brand-wordmark > span, .footer-wordmark .brand-wordmark > span {
  display: inline; font-size: inherit; letter-spacing: inherit; font-weight: inherit;
  color: var(--cyan);
}
.site-footer .footer-wordmark .brand-logo { width: 60px; height: 60px; }
.footer-wordmark .brand-wordmark { font-size: 22px; }
.brand:hover .brand-wordmark { text-shadow: 0 0 23px #a779ff36; }
.reading-line { background: linear-gradient(90deg,#a779ff,#738cff 50%,#58e5ee); }
.desktop-nav a::after { background: linear-gradient(90deg,var(--violet),var(--cyan)); }
.desktop-nav a:hover, .desktop-nav a.active { color: #fff; text-shadow: 0 0 16px #a779ff44; }
.mobile-nav { background: linear-gradient(130deg,#15132d,#070d24); }

/* Glass and light from the supplied emblem, with dark readable surfaces. */
.cyber-theme .button {
  color: #080b20; border-color: #c1b2ff; border-radius: 13px;
  background: linear-gradient(115deg,#bd91ff,#90aaff 55%,#6fe6ec);
  box-shadow: inset 0 1px 0 #f5f3ff77,0 6px 28px #8e5bf527;
}
.cyber-theme .button:hover {
  background: linear-gradient(115deg,#cba8ff,#a6b8ff 55%,#94f0f4);
  box-shadow: inset 0 1px 0 #fff9,0 7px 32px #a779ff3b;
}
.cyber-theme .button::before { background: linear-gradient(110deg,transparent,#ffffff29,transparent); }
.button > span[aria-hidden="true"], .text-link > span[aria-hidden="true"],
.card-arrow, .card-link > span[aria-hidden="true"], .strip-arrow,
.related-links a > span[aria-hidden="true"] { display: none; }
.text-link { color: #d1d9fa; text-underline-offset: 7px; }
.text-link:hover { color: var(--cyan); text-decoration: underline; }
.hero h1 > span, .page-hero h1 > span, .network-story h2 > span {
  color: #b4b0ff;
  background: linear-gradient(105deg,#bc90ff 2%,#919fff 44%,#58e5ee 96%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  text-shadow: none; padding-bottom: .04em;
}
.text-violet { color: #bb98ff; }
.text-cyan { color: #72e4ef; }
.hero-content .eyebrow { background: #11132b8c; border-color: #9d81ff42; border-left-color: var(--violet); }
.hero-hud { opacity: .19; }
.hero::after {
  background: linear-gradient(90deg,#06091deb,#06091dc4 31%,#06091d25 66%,transparent),
              linear-gradient(0deg,#06091d,transparent 25%);
}
.hero-backdrop { background-color: #06091d; }
.page-hero { background: #06091d; border-bottom-color: #9c7cf43b; }
.page-hero::before, .page-progetti .page-hero::before, .page-contatti .page-hero::before {
  background: linear-gradient(90deg,#06091ded,#06091db5 33%,#06091d16 66%,transparent),
              linear-gradient(0deg,#06091d,transparent 24%);
}
.page-kicker, .breadcrumbs, .eyebrow { color: #b9b9da; }
.hero-message p, .page-hero-content > p { color: #c2c7de; }
.intro-strip { background: linear-gradient(100deg,#11112b,#0b1429 65%,#11132e); }
.intro-strip-inner > a { border-color: #a779ff25; }
.intro-strip-inner > a:hover { background: #a779ff0d; }

/* Each section has its own depth within the same brand palette. */
.cyber-section { background-color: #090d24; }
.cyber-section::before { opacity: .1; }
.ecosystem-section { background: radial-gradient(ellipse at 78% 48%,#32308742,transparent 67%); }
.advantages-section { background: radial-gradient(ellipse at 10% 35%,#622e842c,transparent 60%),linear-gradient(145deg,#14112f,#0b142a); }
.plans-section { background: radial-gradient(ellipse at 50% 65%,#284a7340,transparent 65%),#070b20; }
.collaboration-section, .brief-section, .synergy-section {
  background: radial-gradient(ellipse at 18% 55%,#52309632,transparent 60%),radial-gradient(ellipse at 86% 45%,#154b6930,transparent 60%),#0b102b;
}
.areas-section, .contact-paths-section { background: radial-gradient(ellipse at 75% 35%,#37226e35,transparent 65%),#090d23; }
.contact-section { background: radial-gradient(ellipse at 80% 45%,#214e7542,transparent 65%),linear-gradient(125deg,#15112f,#090d23); }
.together-section { background: radial-gradient(ellipse at 15% 30%,#5b2c8930,transparent 58%),radial-gradient(ellipse at 90% 75%,#17435c40,transparent 60%),#0a0d26; }
.page-related { background: linear-gradient(115deg,#10112d,#080d22); }
.footer-pages, .site-footer { border-color: #a779ff26; }
.network-story { background-color: #090d24; }
.network-story::before { background: linear-gradient(90deg,#080b25f2,#080b25bb 42%,#080b2536),linear-gradient(0deg,#080b25,transparent 30%); }
.network-story h2 { position: relative; }
.cyber-panel {
  background: radial-gradient(ellipse at 50% 0%,rgba(var(--accent-rgb),.075),transparent 65%),linear-gradient(140deg,#12152df7,#090d21fa);
  border-radius: 24px 10px; border-color: rgba(var(--accent-rgb),.4);
}
.cyber-panel::after { border-radius: 18px 5px; }
.cyber-panel::before, .benefit.cyber-panel::before, .network-page .cyber-panel::before {
  background: radial-gradient(320px circle at var(--mx) var(--my),rgba(var(--accent-rgb),.105),transparent 78%);
}
.cyber-panel:is(.is-hovered,:focus-visible,:focus-within) { box-shadow: inset 0 0 18px #a779ff0a,0 0 28px rgba(var(--accent-rgb),.15),0 24px 40px #0005; }
.network-page .cyber-panel p, .benefit.cyber-panel p { color: #c0c4da; }
.network-page .cyber-panel .card-lead { color: #edf0ff; }
.benefit.cyber-panel .benefit-label { color: #b2b6d6; }
.skill-tags li { color: #c8c6ef; border-color: #a779ff36; background: #a779ff09; }
.contribution-list li { color: #d1d5e9; }
.skill-connection { border-color: #8d8dda36; }
.skill-connection strong { color: #b8eaf0; }
.network-node { background: linear-gradient(135deg,#181a3c,#0b112b); border-radius: 15px 5px; }
.network-core { background: radial-gradient(ellipse at 50% 25%,#29205a,#080d25 75%); }
.network-core .core-brand-image { width: 90px; height: 90px; max-width: 75%; object-fit: contain; border-radius: 22%; mix-blend-mode: normal; }
.network-core .core-brand-name { font-size: 18px; line-height: 1.2; margin-top: 3px; }
.network-core small { font-size: 8px; letter-spacing: .7px; margin-top: 5px; }
.synergy-orbit { background: radial-gradient(ellipse,#332b6f51,transparent 68%); }
.synergy-core { background: radial-gradient(ellipse,#22234b,#0b112a 85%); }
.synergy-label { background: linear-gradient(140deg,#1a1c40,#0c122b); border-radius: 11px 4px; }
.carousel-arrow { background: linear-gradient(135deg,#25204c,#0c1831); border-radius: 12px; color: #bcf4f7; }
.plan-dialog { background: radial-gradient(ellipse at 15% 0%,#34255580,transparent 65%),#0d122b; }
.presentation-dialog.cyber-panel { background: #090c23; }
dialog::backdrop { background: #030519e8; }
.channel-status > span { background: var(--violet); box-shadow: 0 0 10px #a779ff66; }

@media (max-width: 1180px) {
  .cyber-theme .brand .brand-logo { width: 64px; height: 64px; }
  .brand .brand-wordmark { font-size: 24px; }
  .brand { gap: 11px; }
}
@media (max-width: 700px) {
  .cyber-theme .brand .brand-logo { width: 54px; height: 54px; }
  .brand .brand-wordmark { font-size: 24px; }
  .brand { gap: 10px; }
  .hero::after { background: linear-gradient(180deg,#06091df2,#06091dde 30%,#06091d55 70%,#06091d); }
  .page-hero::before, .page-progetti .page-hero::before, .page-contatti .page-hero::before {
    background: linear-gradient(90deg,#06091ded,#06091dc7 45%,#06091d74),linear-gradient(0deg,#06091d,transparent 35%);
  }
  .network-core .core-brand-image { width: 58px; height: 58px; }
  .network-core .core-brand-name { font-size: 13px; margin-top: 2px; }
  .network-core small { font-size: 7px; letter-spacing: .2px; margin-top: 3px; }
  .site-footer .footer-wordmark .brand-logo { width: 52px; height: 52px; }
  .footer-wordmark .brand-wordmark { font-size: 23px; }
  .hero-content .eyebrow { font-size: 11px; letter-spacing: 1px; }
}
@media (prefers-reduced-motion: reduce) {
  .brand:hover .brand-wordmark { text-shadow: none; }
}
@media (forced-colors: active) {
  .hero h1 > span, .page-hero h1 > span, .network-story h2 > span {
    background: none; -webkit-text-fill-color: CanvasText;
  }
}
