/* =================================================================
   DishFlow — termini.css
   Documento legale elegante · Sidebar sommario sticky
   Typography ottimizzata per lunga lettura · Zero font esterni
   ================================================================= */

:root {
    --bg:     #07090f;
    --bg2:    #0b0e18;
    --card:   #0d1120;
    --gold:   #c9a84c;
    --goldh:  #e8c96a;
    --white:  #ffffff;
    --gray:   #8892a4;
    --gray2:  #4a5568;
    --green:  #22c55e;
    --border: rgba(201,168,76,.15);
    --brd2:   rgba(255,255,255,.07);
    --serif:  'Georgia','Times New Roman',serif;
    --sans:   -apple-system,BlinkMacSystemFont,'Segoe UI',system-ui,sans-serif;
    --ease:   cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body {
    font-family:var(--sans);
    background:var(--bg); color:var(--white);
    overflow-x:hidden; line-height:1.7;
}
a { text-decoration:none; color:inherit; }
button { cursor:pointer; font-family:inherit; border:none; background:none; }
img { display:block; }

/* ── NOISE ───────────────────────────────────────────────────── */
.noise {
    position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.018;
    background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size:160px;
}

/* ── NAVBAR ──────────────────────────────────────────────────── */
.nav {
    position:sticky; top:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:0 48px; height:66px;
    background:rgba(7,9,15,.92); border-bottom:1px solid var(--brd2);
    backdrop-filter:blur(20px);
}
.nav-logo { display:flex; align-items:center; }
.nav-logo img { height:30px; object-fit:contain; }
.nav-logo-txt { font-family:var(--serif); font-size:1.3rem; font-weight:700; }
.nav-logo-txt em { font-style:italic; color:var(--gold); }
.nav-back { font-size:.82rem; color:var(--gray); transition:color .2s; }
.nav-back:hover { color:var(--gold); }

/* ── LAYOUT ──────────────────────────────────────────────────── */
.page-layout {
    display:grid;
    grid-template-columns:260px 1fr;
    max-width:1180px; margin:0 auto;
    padding:0 48px;
    gap:60px; position:relative; z-index:2;
}

/* ── SIDEBAR ─────────────────────────────────────────────────── */
.sidebar {
    padding-top:48px;
}
.sidebar-inner {
    position:sticky; top:90px;
    background:var(--card); border:1px solid var(--brd2);
    border-radius:16px; padding:24px;
    max-height:calc(100vh - 120px); overflow-y:auto;
}

.sb-label {
    font-size:.64rem; font-weight:800; text-transform:uppercase;
    letter-spacing:1.5px; color:var(--gray2); margin-bottom:14px;
}

.sb-nav { display:flex; flex-direction:column; gap:2px; margin-bottom:20px; }
.sb-link {
    display:block; padding:8px 12px; border-radius:8px;
    font-size:.78rem; color:var(--gray); font-weight:500;
    transition:all .2s ease; border-left:2px solid transparent;
}
.sb-link:hover { color:var(--white); background:rgba(255,255,255,.04); }
.sb-link.active {
    color:var(--gold); background:rgba(201,168,76,.08);
    border-left-color:var(--gold);
}

.sb-update {
    border-top:1px solid var(--brd2); padding-top:16px;
    font-size:.72rem; color:var(--gray);
}
.sb-update p { margin-bottom:3px; }
.sb-update strong { color:var(--white); font-size:.76rem; }

/* ── CONTENT ─────────────────────────────────────────────────── */
.content {
    padding:48px 0 80px;
    max-width:760px;
}

/* Doc header */
.doc-header { margin-bottom:56px; }
.doc-tag {
    display:inline-flex; align-items:center;
    background:rgba(201,168,76,.08); border:1px solid rgba(201,168,76,.22);
    border-radius:50px; padding:5px 14px;
    font-size:.66rem; font-weight:700; color:var(--gold);
    text-transform:uppercase; letter-spacing:2px; margin-bottom:18px;
}
.doc-title {
    font-family:var(--serif);
    font-size:clamp(2.4rem,4vw,3.4rem);
    font-weight:400; line-height:1.1;
    letter-spacing:-.02em; margin-bottom:24px;
}
.doc-title em { font-style:italic; color:var(--gold); }

.doc-meta {
    display:flex; gap:24px; flex-wrap:wrap;
    margin-bottom:24px;
}
.meta-item {
    display:flex; align-items:center; gap:7px;
    font-size:.78rem; color:var(--gray);
}
.meta-item svg { width:14px; height:14px; stroke:var(--gold); flex-shrink:0; }

.doc-notice {
    display:flex; gap:14px; align-items:flex-start;
    background:rgba(59,130,246,.08); border:1px solid rgba(59,130,246,.2);
    border-radius:12px; padding:16px 20px;
}
.doc-notice svg { width:18px; height:18px; stroke:#60a5fa; flex-shrink:0; margin-top:1px; }
.doc-notice p { font-size:.84rem; color:rgba(255,255,255,.65); line-height:1.7; }

/* Sezioni documento */
.doc-section {
    padding:40px 0;
    border-top:1px solid var(--brd2);
    position:relative;
    scroll-margin-top:90px;
}

.section-num {
    font-family:var(--serif);
    font-size:4.5rem; font-weight:700;
    color:rgba(255,255,255,.04);
    position:absolute; top:28px; right:0;
    line-height:1; user-select:none; pointer-events:none;
    letter-spacing:-2px;
}

.doc-section h2 {
    font-family:var(--serif);
    font-size:1.45rem; font-weight:600;
    color:var(--white); margin-bottom:18px;
    padding-left:14px;
    border-left:3px solid var(--gold);
}

.doc-section h3 {
    font-size:.92rem; font-weight:700;
    color:rgba(255,255,255,.75);
    margin:22px 0 10px; text-transform:uppercase;
    letter-spacing:.5px; font-size:.78rem;
}

.doc-section p {
    font-size:.88rem; color:rgba(255,255,255,.62);
    line-height:1.9; margin-bottom:14px;
}
.doc-section p:last-child { margin-bottom:0; }

.doc-section p strong { color:var(--white); font-weight:600; }

.doc-section ul {
    list-style:none; display:flex; flex-direction:column; gap:9px;
    margin:14px 0; padding-left:0;
}
.doc-section ul li {
    display:flex; gap:10px; align-items:flex-start;
    font-size:.87rem; color:rgba(255,255,255,.60); line-height:1.75;
}
.doc-section ul li::before {
    content:'—'; color:var(--gold); flex-shrink:0; margin-top:1px;
    font-weight:700;
}
.doc-section ul li strong { color:var(--white); font-weight:600; }

/* Grid contatti sezione 12 */
.contact-grid {
    display:flex; flex-direction:column; gap:14px; margin-top:20px;
}
.contact-item {
    display:flex; gap:14px; align-items:flex-start;
    background:var(--card); border:1px solid var(--brd2);
    border-radius:12px; padding:16px 20px;
}
.contact-item svg { width:18px; height:18px; stroke:var(--gold); flex-shrink:0; margin-top:2px; }
.contact-item div { display:flex; flex-direction:column; gap:3px; }
.contact-item span { font-size:.70rem; text-transform:uppercase; letter-spacing:1px; color:var(--gray2); font-weight:700; }
.contact-item a { color:var(--gold); font-size:.88rem; transition:opacity .2s; }
.contact-item a:hover { opacity:.7; }
.contact-item strong { color:var(--white); font-size:.88rem; }

/* Footer documento */
.doc-footer {
    margin-top:48px; padding-top:28px;
    border-top:1px solid var(--brd2);
    display:flex; flex-direction:column; gap:6px;
    font-size:.76rem; color:var(--gray2);
}
.doc-footer strong { color:var(--gray); }
.doc-footer-links { display:flex; gap:12px; align-items:center; margin-top:6px; }
.doc-footer-links a { color:var(--gray); transition:color .2s; }
.doc-footer-links a:hover { color:var(--gold); }
.doc-footer-links span { opacity:.4; }

/* ── RESPONSIVE ──────────────────────────────────────────────── */
@media(max-width:960px) {
    .page-layout { grid-template-columns:1fr; gap:0; padding:0 24px; }
    .sidebar { padding-top:24px; }
    .sidebar-inner { position:static; max-height:none; }
    .section-num { display:none; }
}
@media(max-width:600px) {
    .nav { padding:0 20px; }
    .doc-meta { flex-direction:column; gap:10px; }
    .content { padding:32px 0 60px; }
}