:root { --bg:#050816; --surface:#0f172a; --accent:#38bdf8; --accent-strong:#22d3ee; --text:#e5e7eb; --muted:#9ca3af; }
*{box-sizing:border-box;}html,body{margin:0;padding:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,'SF Pro Text','Inter',sans-serif;background:radial-gradient(circle at top left,#020617 0,#020617 40%,#000 100%);color:var(--text);scroll-behavior:smooth;}body.dm-paige-shell{min-height:100vh;}
.gradient-orbit{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 0%,rgba(56,189,248,.18),transparent 55%),radial-gradient(circle at 90% 20%,rgba(45,212,191,.16),transparent 55%),radial-gradient(circle at 50% 100%,rgba(129,140,248,.18),transparent 55%);opacity:.9;mix-blend-mode:screen;z-index:-1;}
.site-header{position:sticky;top:0;z-index:20;backdrop-filter:blur(22px);background:linear-gradient(to bottom,rgba(15,23,42,.96),rgba(15,23,42,.88));border-bottom:1px solid rgba(15,23,42,.9);display:flex;align-items:center;justify-content:space-between;padding:.85rem 4vw;}
.brand{display:flex;align-items:center;gap:.8rem;}.brand-mark{width:36px;height:36px;border-radius:999px;background:radial-gradient(circle at 30% 10%,#e0f2fe 0,#38bdf8 40%,#0ea5e9 70%,#1d4ed8 100%);display:flex;align-items:center;justify-content:center;font-weight:700;color:#0b1120;box-shadow:0 0 40px rgba(56,189,248,.55);} .brand-text{display:flex;flex-direction:column;} .brand-title{font-weight:600;letter-spacing:.06em;text-transform:uppercase;font-size:.78rem;} .brand-subtitle{font-size:.86rem;color:var(--muted);} 
.main-nav{display:flex;gap:1.3rem;font-size:.9rem;} .main-nav a{color:var(--muted);text-decoration:none;position:relative;padding-bottom:.15rem;} .main-nav a::after{content:'';position:absolute;left:0;bottom:-.2rem;width:0;height:2px;background:linear-gradient(90deg,var(--accent),var(--accent-strong));border-radius:999px;transition:width .22s ease-out;} .main-nav a:hover,.main-nav a.active{color:#e5e7eb;} .main-nav a:hover::after,.main-nav a.active::after{width:100%;}
.lang-switcher{display:inline-flex;align-items:center;gap:.35rem;font-size:.78rem;padding:.25rem .6rem;border-radius:999px;background:rgba(15,23,42,.9);border:1px solid rgba(148,163,184,.5);} .lang-pill{padding:.15rem .5rem;border-radius:999px;background:rgba(15,23,42,.9);color:var(--muted);text-decoration:none;}
.page-main{max-width:1120px;margin:0 auto;padding:1.8rem 4vw 4.2rem;}
.hero-panel{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.2fr);gap:2.5rem;align-items:center;padding:2.3rem 2.6rem;border-radius:1.75rem;background:radial-gradient(circle at top left,rgba(15,23,42,.9) 0,rgba(15,23,42,.98) 40%,#020617 100%);border:1px solid rgba(148,163,184,.35);box-shadow:0 32px 120px rgba(15,23,42,.9);overflow:hidden;} .hero-copy{display:flex;flex-direction:column;align-items:center;text-align:center;} .hero-copy h1{font-size:clamp(2.2rem,2.6vw + 1.5rem,2.9rem);margin:0 0 .75rem 0;} .hero-lead{margin:0 0 1.2rem;color:var(--muted);font-size:.98rem;} .hero-tags{display:flex;flex-wrap:wrap;gap:.55rem;justify-content:center;} .tag{font-size:.78rem;padding:.22rem .65rem;border-radius:999px;border:1px solid rgba(148,163,184,.45);background:rgba(15,23,42,.85);} 
.hero-visual{position:relative;min-height:220px;} .orbital-cluster{position:absolute;inset:0;display:grid;place-items:center;} .orb{border-radius:999px;border:1px solid rgba(148,163,184,.35);box-shadow:0 0 40px rgba(59,130,246,.4);} .orbit-1{width:90px;height:90px;background:radial-gradient(circle at 30% 20%,#bae6fd,#38bdf8,#0ea5e9);} .orbit-2{width:150px;height:150px;background:radial-gradient(circle at 70% 0%,#f9a8d4,#a855f7,transparent 70%);opacity:.7;} .orbit-3{width:220px;height:220px;background:radial-gradient(circle at 10% 90%,#bbf7d0,#22c55e,transparent 70%);opacity:.5;} 
.hero-logo-shell{position:absolute;left:50%;bottom:2.4rem;transform:translateX(-50%);display:flex;align-items:center;justify-content:center;} .hero-logo-img{max-width:55%;height:auto;filter:drop-shadow(0 18px 40px rgba(15,23,42,.9));} .hero-caption{position:absolute;bottom:.25rem;left:50%;transform:translateX(-50%);width:100%;text-align:center;font-size:.78rem;color:var(--muted);} 
.content-shell{position:relative;margin-top:2.5rem;padding:2rem 2rem 2.4rem;border-radius:1.7rem;background:linear-gradient(180deg,rgba(15,23,42,.96),rgba(15,23,42,.97)),radial-gradient(circle at top,rgba(15,23,42,.9),transparent 65%);border:1px solid rgba(148,163,184,.4);overflow:hidden;} .content-shell::before{content:'';position:absolute;left:50%;top:-40%;width:1px;height:180%;pointer-events:none;background:linear-gradient(180deg,transparent,rgba(56,189,248,.4),transparent);opacity:.55;} .content-shell::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 0% 0%,rgba(56,189,248,.08),transparent 50%);mix-blend-mode:soft-light;pointer-events:none;} .content-shell h1,.content-shell h2,.content-shell h3,.content-shell h4{scroll-margin-top:96px;} .content-shell h1,.content-shell h2,.content-shell h3{position:relative;padding-left:1.1rem;} .content-shell h1::before,.content-shell h2::before,.content-shell h3::before{content:'';position:absolute;left:0;top:.2rem;bottom:.2rem;width:3px;border-radius:999px;background:linear-gradient(180deg,rgba(56,189,248,0),rgba(56,189,248,.9),rgba(45,212,191,0));opacity:.9;} .content-shell p{font-size:.94rem;color:var(--muted);} .content-shell table{width:100%;border-collapse:collapse;margin:1.1rem 0;font-size:.85rem;} .content-shell th,.content-shell td{border-bottom:1px solid rgba(31,41,55,.9);padding:.55rem .5rem;} .content-shell thead th{background:rgba(15,23,42,.9);} .content-shell figure{margin:1.4rem auto;padding:.8rem;border-radius:.9rem;background:radial-gradient(circle at top left,rgba(15,23,42,.9),rgba(15,23,42,.98));border:1px solid rgba(148,163,184,.3);} .content-shell img{max-width:100%;height:auto;display:block;border-radius:.75rem;} .reveal-block{opacity:0;transform:translateY(26px);transition:opacity 420ms ease-out,transform 420ms ease-out;} .reveal-block.is-visible{opacity:1;transform:translateY(0);} @media (prefers-reduced-motion:reduce){.reveal-block{opacity:1 !important;transform:none !important;transition:none !important;}}
.site-footer-wrap{position:relative;overflow:hidden;margin-top:3rem;background:linear-gradient(180deg,rgba(15,23,42,.95),#020617);border-top:1px solid rgba(15,23,42,.9);} .site-footer-wrap::before{content:"";position:absolute;inset:0;background-image:url("assets/img/footer-bg.png");background-size:cover;background-position:center;opacity:.25;mix-blend-mode:screen;pointer-events:none;} .site-footer-highlight{height:1px;width:100%;background:radial-gradient(circle at 50% 0%,rgba(56,189,248,.7),transparent 60%);opacity:.5;position:relative;z-index:1;} .site-footer{max-width:1120px;margin:0 auto;padding:1.8rem 4vw 2.4rem;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;color:var(--muted);font-size:.82rem;position:relative;z-index:1;} .site-footer h4{font-size:.9rem;margin:0 0 .4rem;} .site-footer a{color:var(--muted);text-decoration:none;} .site-footer a:hover{color:var(--accent);} @media (max-width:860px){.hero-panel{grid-template-columns:minmax(0,1fr);} .main-nav{display:none;} .site-header{justify-content:space-between;} .site-footer{grid-template-columns:minmax(0,1fr);} }


/* Logo hero come badge circolare in alto a destra */
.hero-logo-shell {
  left: auto;
  bottom: 10px;
  transform: none;
  width: 72px;
  height: 72px;
  border-radius: 999px;
  background: radial-gradient(circle at 30% 20%, rgba(30, 64, 175, 0.9), rgba(15, 23, 42, 1));
  border: 1px solid rgba(148, 163, 184, 0.6);
  
  align-items: center;
  justify-content: center;
  box-shadow: 0 12px 35px rgba(15, 23, 42, 0.85);
}
.hero-logo-img {
  max-width: 70%;
  max-height: 70%;
  height: auto;
  filter: none;
}


/* Hero logo inline under title with transparent background */
.hero-logo-shell {
  position: relative;
  margin-top: 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hero-logo-img {
  height: 32px;
  width: auto;
  filter: none;
}

.footer-doc-links {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.footer-github {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--muted);
  text-decoration: none;
}
.footer-github:hover {
  color: var(--accent);
}
.github-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.footer-github-label {
  font-size: 0.82rem;
}

.site-footer-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("assets/img/footer-bg.png");
  background-size: cover;
  background-position: center;
  opacity: 0.25;
  mix-blend-mode: screen;
  pointer-events: none;
}


/* Hero logo inline below title, transparent */
.hero-logo-shell {
  position: relative;
  margin-top: 0.4rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.hero-logo-img {
  height: 32px;
  width: auto;
  filter: none;
}

.footer-doc-links {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
.footer-github {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--muted);
  text-decoration: none;
}
.footer-github:hover {
  color: var(--accent);
}
.github-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.footer-github-label {
  font-size: 0.82rem;
}

.site-footer-wrap::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url("../img/footer-bg.png");
  background-size: cover;
  background-position: center;
  opacity: 0.25;
  mix-blend-mode: screen;
  pointer-events: none;
}