:root {
  color-scheme: dark;
  --bg: #0b0c10;
  --bg-soft: #11141a;
  --panel: #151920;
  --panel-raised: #1b2028;
  --line: #292f39;
  --text: #f0eee8;
  --muted: #a2a6ad;
  --subtle: #727984;
  --gold: #e3b65c;
  --gold-light: #f4d58c;
  --teal: #65c8b5;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --radius: 14px;
  --max: 1160px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 var(--sans); -webkit-font-smoothing: antialiased; }
a { color: var(--gold-light); text-decoration: none; }
a:hover { color: #fff0c7; }
button, a { -webkit-tap-highlight-color: transparent; }
code, pre { font-family: var(--mono); }
code { overflow-wrap: anywhere; }
::selection { background: rgba(227,182,92,.28); color: #fff; }

.skip-link { position: absolute; top: -60px; left: 1rem; z-index: 200; padding: .7rem 1rem; background: var(--gold); color: #17130b; border-radius: 8px; }
.skip-link:focus { top: 1rem; }
.nav { position: sticky; top: 0; z-index: 100; background: rgba(11,12,16,.9); border-bottom: 1px solid rgba(255,255,255,.07); backdrop-filter: blur(16px); }
.nav-inner { width: min(var(--max), 100%); min-height: 68px; margin: auto; padding: 0 28px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.logo { display: inline-flex; align-items: center; gap: 9px; color: var(--text); font: 700 1.12rem var(--mono); letter-spacing: -.06em; }
.logo:hover { color: var(--text); text-decoration: none; }
.logo-mark { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid rgba(227,182,92,.65); border-radius: 50%; color: var(--gold-light); font: 600 .95rem var(--sans); letter-spacing: 0; }
.nav-links { display: flex; align-items: center; gap: clamp(14px, 2.1vw, 28px); }
.nav-links a { color: #b2b5bb; font-size: .86rem; font-weight: 550; white-space: nowrap; }
.nav-links a:hover { color: var(--text); text-decoration: none; }
.nav-links .btn-ghost { padding: .52rem .85rem; border: 1px solid var(--line); border-radius: 8px; color: var(--text); }
.nav-links .btn-ghost:hover { border-color: rgba(227,182,92,.7); }

.hero { position: relative; isolation: isolate; width: min(var(--max), 100%); min-height: 590px; margin: auto; padding: 94px 28px 84px; display: grid; grid-template-columns: 1.03fr .97fr; align-items: center; gap: 58px; }
.hero::before { content: ""; position: absolute; z-index: -2; width: 600px; height: 420px; top: -30px; left: -120px; background: radial-gradient(ellipse, rgba(184,133,49,.13), transparent 68%); pointer-events: none; }
.hero-content { max-width: 610px; }
.eyebrow { margin: 0 0 18px; color: var(--gold); font: 600 .75rem/1.4 var(--mono); letter-spacing: .13em; text-transform: uppercase; }
.pulse { display: inline-block; width: 7px; height: 7px; margin: 0 8px 1px 0; border-radius: 50%; background: var(--teal); box-shadow: 0 0 12px rgba(101,200,181,.7); }
h1, h2, h3, p { margin-top: 0; }
.hero h1 { max-width: 720px; margin-bottom: 23px; font-size: clamp(2.65rem, 5.3vw, 4.4rem); line-height: 1.08; letter-spacing: -.058em; font-weight: 780; }
.hero h1 span, .section-heading h2 span, .mcp-copy h2 span { color: var(--gold-light); }
.hero-sub { max-width: 580px; margin-bottom: 28px; color: #b5b6bb; font-size: 1.08rem; line-height: 1.75; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 27px; }
.btn-primary, .btn-secondary { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 47px; padding: 0 18px; border-radius: 8px; font-size: .91rem; font-weight: 650; transition: transform .18s ease, border-color .18s ease, background .18s ease; }
.btn-primary { background: var(--gold); color: #17130b; }
.btn-primary:hover { background: var(--gold-light); color: #17130b; text-decoration: none; transform: translateY(-1px); }
.btn-secondary { border: 1px solid #343a43; color: var(--text); }
.btn-secondary:hover { border-color: var(--gold); color: var(--text); text-decoration: none; }
.hero-points { display: flex; flex-wrap: wrap; gap: 9px 22px; margin: 0; padding: 0; list-style: none; color: #a9adb4; font-size: .8rem; }
.hero-points li { display: flex; gap: 7px; align-items: center; }
.hero-points li span { color: var(--teal); font-weight: 700; }

.terminal { position: relative; z-index: 1; overflow: hidden; border: 1px solid #30343b; border-radius: var(--radius); background: linear-gradient(145deg, #15181d, #0d0f13 72%); box-shadow: 0 25px 75px rgba(0,0,0,.35); }
.terminal-bar { display: flex; align-items: center; gap: 7px; height: 46px; padding: 0 16px; border-bottom: 1px solid #292d33; background: rgba(255,255,255,.025); }
.terminal-bar > span:not(.terminal-label) { width: 8px; height: 8px; border-radius: 50%; background: #e57f72; }
.terminal-bar > span:nth-child(2) { background: #dfba61; }
.terminal-bar > span:nth-child(3) { background: #7dbd82; }
.terminal-label { margin-left: auto; color: #797f87; font: .68rem var(--mono); }
.terminal pre, .code-card pre, .mcp-setup pre { margin: 0; overflow-x: auto; }
.terminal pre { padding: 24px 22px 28px; }
.terminal code { color: #ddd9d0; font-size: .77rem; line-height: 2; }
.terminal .prompt { color: var(--gold-light); }
.terminal .muted { color: #737984; }
.terminal-foot { padding: 13px 18px; border-top: 1px solid #252a31; color: #8c939a; font-size: .72rem; }
.status-dot { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: var(--teal); }
.hero-orbit { position: absolute; z-index: -1; right: -100px; border: 1px solid rgba(227,182,92,.08); border-radius: 50%; pointer-events: none; }
.orbit-one { top: 48px; width: 330px; height: 330px; }
.orbit-two { top: 96px; right: -52px; width: 235px; height: 235px; }

.trust-strip { display: grid; grid-template-columns: repeat(4, 1fr); width: min(var(--max), calc(100% - 56px)); margin: 0 auto; padding: 20px 0; border-top: 1px solid #22262d; border-bottom: 1px solid #22262d; }
.trust-strip > div { display: flex; justify-content: center; align-items: center; gap: 10px; color: #a6aab0; font-size: .82rem; }
.strip-icon { color: var(--gold); font: .72rem var(--mono); }

.section { width: min(var(--max), 100%); margin: auto; padding: 104px 28px; }
.guide-header { padding-top: 88px; padding-bottom: 60px; }
.guide-header h1 { margin-bottom: 18px; font-size: clamp(2.4rem, 5vw, 4rem); line-height: 1.1; letter-spacing: -.055em; }
.guide-page h3 { margin-bottom: 14px; font-size: 1.05rem; }
.guide-page .guide-heading-followup { margin-top: 56px; }
.guide-page .guide-subheading { margin-top: 34px; }
.section-alt { max-width: none; width: 100%; padding-right: max(28px, calc((100% - var(--max)) / 2 + 28px)); padding-left: max(28px, calc((100% - var(--max)) / 2 + 28px)); background: #101318; border-top: 1px solid #20242b; border-bottom: 1px solid #20242b; }
.section-heading { position: relative; max-width: 710px; margin-bottom: 42px; }
.anchor-alias { position: absolute; top: -90px; }
.section-heading h2, .safety-section h2, .mcp-copy h2 { margin-bottom: 14px; font-size: clamp(2rem, 4vw, 3.05rem); line-height: 1.14; letter-spacing: -.045em; }
.section-sub { max-width: 660px; margin-bottom: 0; color: var(--muted); font-size: 1rem; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
.feature-card { min-height: 226px; padding: 24px 22px 22px; border: 1px solid #282d35; border-radius: 12px; background: linear-gradient(145deg, rgba(255,255,255,.025), rgba(255,255,255,.008)); transition: border-color .2s, transform .2s; }
.feature-card:hover { border-color: rgba(227,182,92,.48); transform: translateY(-2px); }
.feature-icon { display: grid; place-items: center; width: 36px; height: 36px; margin-bottom: 21px; border: 1px solid rgba(227,182,92,.28); border-radius: 10px; background: rgba(227,182,92,.075); color: var(--gold-light); font: 1.15rem var(--mono); }
.feature-card h3 { margin-bottom: 8px; font-size: 1.01rem; letter-spacing: -.01em; }
.feature-card p { margin-bottom: 16px; color: #a3a8af; font-size: .85rem; line-height: 1.65; }
.feature-card code { color: #e7cd98; font-size: .81rem; }
.card-tag { display: inline-block; padding: 4px 8px; border: 1px solid #30363e; border-radius: 100px; color: #8b929a; font: .65rem var(--mono); }

.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.step { display: flex; gap: 15px; padding-top: 18px; border-top: 1px solid #343a43; }
.step-number { flex: 0 0 auto; color: var(--gold); font: .72rem var(--mono); }
.step h3 { margin-bottom: 8px; font-size: 1rem; }
.step p { margin: 0; color: #a4a8ae; font-size: .86rem; }
.code-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 38px; }
.code-card, .mcp-setup { padding: 19px; border: 1px solid #2a3038; border-radius: 11px; background: #0b0d11; }
.code-label { margin-bottom: 11px; color: #8d949c; font: .71rem var(--mono); letter-spacing: .035em; }
.code-card pre, .mcp-setup pre { color: #e2d9c8; font-size: .75rem; line-height: 1.85; }

.section-footnote code, .faq-list code { color: var(--gold-light); font-size: .9em; }

.mcp-section { display: grid; grid-template-columns: .9fr 1.1fr; gap: 60px; align-items: center; max-width: none; padding-right: max(28px, calc((100% - var(--max)) / 2 + 28px)); padding-left: max(28px, calc((100% - var(--max)) / 2 + 28px)); background: linear-gradient(110deg, #171710 0%, #121419 45%, #11141a 100%); border-top: 1px solid rgba(227,182,92,.16); border-bottom: 1px solid #252a30; }
.mcp-copy { max-width: 490px; }
.mcp-copy > p:not(.eyebrow) { color: #a9acb2; font-size: .94rem; }
.mcp-callout { display: grid; gap: 3px; margin-top: 26px; padding-left: 13px; border-left: 2px solid var(--gold); }
.mcp-callout strong { color: #eee4ce; font-size: .82rem; }
.mcp-callout span, .mcp-footnote { color: #9298a0; font-size: .76rem; }
.mcp-setup { padding: 22px; }
.mcp-setup .code-label:not(:first-child) { margin-top: 22px; }
.mcp-footnote { margin: 16px 0 0; line-height: 1.6; }

.command-table-wrap { overflow-x: auto; border: 1px solid #292e36; border-radius: 11px; }
.command-table { width: 100%; border-collapse: collapse; text-align: left; }
.command-table th { padding: 13px 16px; background: #15191f; color: #939aa2; font: 600 .69rem var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.command-table td { padding: 12px 16px; border-top: 1px solid #252a31; color: #a9adb3; font-size: .83rem; }
.command-table tr:hover td { background: rgba(255,255,255,.018); }
.command-table td:first-child { min-width: 320px; }
.command-table code { color: #e8d39f; font-size: .77rem; }
.section-footnote { margin: 17px 0 0; color: #8f959d; font-size: .79rem; }
.install-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; margin-top: 20px; }
.install-option { padding: 22px; border: 1px solid #292e36; border-radius: 11px; background: #12151a; }
.install-option h3 { margin: 0 0 9px; font-size: 1rem; }
.install-option > p:not(.code-label):not(.install-note) { color: #a3a7ad; font-size: .83rem; }
.install-option pre { overflow-x: auto; margin: 14px 0; padding: 14px; border: 1px solid #292f38; border-radius: 8px; background: #0b0d11; color: #e2d9c8; font: .7rem/1.9 var(--mono); }
.install-note { margin: 0; color: #898f97; font-size: .75rem; }
.install-next { margin-top: 17px; padding: 14px 17px; border-left: 2px solid var(--gold); background: rgba(227,182,92,.045); color: #adb0b5; font-size: .83rem; }
.install-next p { margin: 0; }
.install-next a { font-weight: 650; }

.safety-section { display: grid; grid-template-columns: 135px 1fr; gap: 38px; align-items: start; padding-top: 82px; padding-bottom: 82px; border-top: 1px solid #252a31; border-bottom: 1px solid #252a31; }
.safety-mark { display: grid; place-items: center; width: 106px; height: 106px; border: 1px solid rgba(227,182,92,.28); border-radius: 50%; background: radial-gradient(circle, rgba(227,182,92,.1), transparent 70%); color: var(--gold); font-size: 2.9rem; }
.safety-section h2 { font-size: 2.25rem; }
.safety-section p:not(.eyebrow) { max-width: 820px; color: #a4a8af; font-size: .91rem; }
.text-link { display: inline-flex; gap: 8px; margin-top: 4px; font-size: .84rem; font-weight: 600; }

.faq-section { max-width: 900px; }
.faq-list details { border-top: 1px solid #2b3038; }
.faq-list details:last-child { border-bottom: 1px solid #2b3038; }
.faq-list summary { position: relative; padding: 20px 38px 20px 2px; color: #e7e5df; cursor: pointer; font-weight: 600; list-style: none; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; position: absolute; top: 17px; right: 4px; color: var(--gold); font: 1.3rem var(--mono); }
.faq-list details[open] summary::after { content: "−"; }
.faq-list details p { max-width: 760px; margin: -3px 0 20px; color: #a1a6ad; font-size: .89rem; }

.footer { padding: 35px 28px 18px; background: #0e1014; border-top: 1px solid #252a31; }
.footer-inner, .footer-bottom { width: min(var(--max), 100%); margin: 0 auto; }
.footer-inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 28px; padding-bottom: 27px; }
.footer-brand p { margin: 9px 0 0; color: #858b93; font-size: .78rem; }
.footer-links { display: flex; flex-wrap: wrap; gap: 18px; }
.footer-links a, .footer-bottom a { color: #9fa4ab; font-size: .78rem; }
.footer-links a:hover, .footer-bottom a:hover { color: var(--gold-light); }
.footer-bottom { display: flex; justify-content: space-between; gap: 15px; padding-top: 14px; border-top: 1px solid #24282e; color: #777e86; font-size: .72rem; }

@media (max-width: 920px) {
  .nav-inner { align-items: flex-start; flex-direction: column; gap: 10px; padding-top: 13px; padding-bottom: 11px; }
  .nav-links { width: 100%; gap: 19px; overflow-x: auto; padding-bottom: 2px; }
  .nav-links a { font-size: .8rem; }
  .hero { grid-template-columns: 1fr; gap: 35px; padding-top: 74px; }
  .hero-content { max-width: 720px; }
  .terminal { max-width: 670px; }
  .hero-orbit { top: 500px; }
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .mcp-section { grid-template-columns: 1fr; gap: 30px; }
  .mcp-copy { max-width: 680px; }
}

@media (max-width: 620px) {
  html { scroll-padding-top: 132px; }
  .nav-inner { padding-right: 18px; padding-left: 18px; }
  .nav-links { flex-wrap: wrap; gap: 10px 16px; overflow: visible; padding-bottom: 0; }
  .nav-links .btn-ghost { padding: .36rem .6rem; }
  .hero { overflow-x: clip; }
  .hero { min-height: 0; padding: 58px 20px 62px; }
  .hero h1 { font-size: clamp(2.35rem, 11vw, 3.15rem); }
  .hero-sub { font-size: .98rem; }
  .hero-points { display: grid; gap: 8px; }
  .terminal pre { padding: 18px 14px 22px; }
  .terminal code { font-size: .66rem; }
  .trust-strip { width: calc(100% - 40px); grid-template-columns: 1fr 1fr; gap: 16px 10px; padding: 18px 0; }
  .trust-strip > div { justify-content: flex-start; font-size: .7rem; }
  .section { padding: 72px 20px; }
  .guide-header { padding-top: 58px; padding-bottom: 48px; }
  .section-alt, .mcp-section { padding-right: 20px; padding-left: 20px; }
  .section-heading h2, .safety-section h2, .mcp-copy h2 { font-size: 2.1rem; }
  .feature-grid, .steps { grid-template-columns: 1fr; }
  .code-row { grid-template-columns: minmax(0, 1fr); }
  .install-options { grid-template-columns: 1fr; }
  .feature-card { min-height: 0; }
  .code-row > *, .code-card, .mcp-setup, .install-option { min-width: 0; }
  .steps { gap: 22px; }
  .step { padding-top: 14px; }
  .code-row { gap: 10px; margin-top: 28px; }
  .code-card, .mcp-setup { padding: 15px; }
  .code-card pre, .mcp-setup pre { font-size: .66rem; }
  .mcp-section { gap: 23px; }
  .command-table td { padding: 11px 12px; font-size: .77rem; }
  .command-table { width: 100%; table-layout: fixed; }
  .command-table td:first-child { min-width: 0; }
  .command-table code { font-size: .68rem; }
  .install-option pre { white-space: pre-wrap; overflow-wrap: anywhere; }
  .safety-section { grid-template-columns: 1fr; gap: 20px; padding-top: 58px; padding-bottom: 58px; }
  .safety-mark { width: 72px; height: 72px; font-size: 2rem; }
  .footer { padding-right: 20px; padding-left: 20px; }
  .footer-inner { flex-direction: column; }
  .footer-links { gap: 12px 18px; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
  #configurazione .command-table th:first-child,
  #configurazione .command-table td:first-child { width: 30%; }
  #configurazione .command-table th:nth-child(2),
  #configurazione .command-table td:nth-child(2) { width: 16%; }
  #configurazione .command-table th:nth-child(3),
  #configurazione .command-table td:nth-child(3) { width: 54%; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
