/* ==========================================================================
   PerformApp — tema condiviso delle pagine interne
   Allinea privacy, termini, eliminazione account, changelog, 404 e la
   sezione Strumenti al linguaggio della home (cemento, ferro, arancione del
   logo, PerformFont, raggi 12/20/32). Si carica per ultimo su ogni pagina:
   cambia solo l'aspetto, non i contenuti.
   ========================================================================== */

@font-face { font-family: 'PerformFont6'; src: url('/strumenti/calcolatore-massimale/fonts/PerformFont6-Regular.woff2') format('woff2'); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: 'PerformFont6'; src: url('/strumenti/calcolatore-massimale/fonts/PerformFont6-Medium.woff2') format('woff2'); font-weight: 500; font-style: normal; font-display: swap; }
@font-face { font-family: 'PerformFont6'; src: url('/strumenti/calcolatore-massimale/fonts/PerformFont6-SemiBold.woff2') format('woff2'); font-weight: 600; font-style: normal; font-display: swap; }
@font-face { font-family: 'PerformFont6'; src: url('/strumenti/calcolatore-massimale/fonts/PerformFont6-Bold.woff2') format('woff2'); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'PerformFont6'; src: url('/strumenti/calcolatore-massimale/fonts/PerformFont6-ExtraBold.woff2') format('woff2'); font-weight: 800; font-style: normal; font-display: swap; }

:root {
    --concrete: #EDEFF2;
    --chalk: #FBFBFC;
    --iron: #1B1E24;
    --iron-2: #262A32;
    --iron-3: #353A44;
    --steel: #5A6270;
    --steel-light: #9AA1AD;
    --line: rgba(27, 30, 36, 0.10);
    --line-dark: rgba(255, 255, 255, 0.10);
    --brand: #FA7402;
    --brand-ink: #B45309;
    --r-md: 20px;
    --r-lg: 32px;
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --font: 'PerformFont6', system-ui, sans-serif;

    /* token di styles.css (pagine legali e changelog) */
    --primary-color: var(--brand);
    --primary-dark: #E06A00;
    --secondary-color: #FF9A3D;
    --accent-color: var(--iron);
    --text-dark: var(--iron);
    --text-gray: var(--steel);
    --text-light: #7A818D;
    --bg-light: var(--concrete);
    --bg-white: var(--chalk);
    --border-color: var(--line);
    --shadow: 0 30px 60px -44px rgba(27, 30, 36, 0.35);
    --shadow-lg: 0 40px 80px -48px rgba(27, 30, 36, 0.45);

    /* token di strumenti.css */
    --tools-bg: var(--concrete);
    --tools-surface: var(--chalk);
    --tools-surface-2: var(--concrete);
    --tools-text: var(--iron);
    --tools-muted: var(--steel);
    --tools-faint: #6B7280;
    --tools-line: var(--line);
    --tools-line-strong: rgba(27, 30, 36, 0.18);
    --tools-brand: var(--brand);
    --tools-brand-deep: var(--brand-ink);

    /* token del calcolatore massimale */
    --bg: var(--concrete);
    --surface: var(--chalk);
    --ink: var(--iron);
    --muted: var(--steel);
    --brand-dark: var(--brand-ink);
    --night: var(--iron);
    --container: 1240px;
}

html body {
    background: var(--concrete);
    color: var(--iron);
    font-family: var(--font);
    -webkit-font-smoothing: antialiased;
}

body ::selection { background: var(--brand); color: var(--iron); }
body :focus-visible { outline: 2px solid var(--brand); outline-offset: 3px; }

/* ---------- Pulsanti e link ---------- */
body .btn,
body .back-to-home .btn {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border: 0;
    border-radius: 999px;
    background: var(--iron);
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    box-shadow: none;
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.4s var(--ease-out);
}
body .btn:hover,
body .back-to-home .btn:hover { background: var(--brand); color: var(--iron); transform: translateY(-2px); }

body :is(.privacy-content, .terms-content, .delete-account-content, .changelog-container) a:not(.btn):not(.back-to-home) {
    color: var(--iron);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-color: var(--brand);
    text-decoration-thickness: 1.5px;
    text-underline-offset: 3px;
}

/* navigazione: comune a tutto il sito, vedi header.css */

/* pagine di testo (privacy, termini, eliminazione account): blocco "PAGINE LEGALI — impaginazione" in fondo al file */

/* ==========================================================================
   CHANGELOG
   ========================================================================== */
/* il changelog ha il suo blocco in fondo al file ("CHANGELOG — impaginazione") */

/* footer: comune a tutto il sito, vedi footer.css */

/* ==========================================================================
   SEZIONE STRUMENTI — navigazione, hub e footer (strumenti.css)
   ========================================================================== */


/* hub /strumenti/ */
body .tools-page { background: var(--concrete); }
body .tools-main { padding-top: 76px; }
body .tools-hero::before { display: none; }
body .tools-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--steel);
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.95rem;
    font-weight: 600;
}
body .tools-kicker::before { content: ''; width: 16px; height: 3px; border-radius: 2px; background: var(--brand); }
body .tools-hero h1 { font-weight: 800; letter-spacing: -0.03em; line-height: 0.95; }
body .tools-hero h1 em { color: var(--steel); }
body .tool-card {
    border: 0;
    border-radius: var(--r-lg);
    background: var(--iron);
    box-shadow: 0 40px 80px -48px rgba(27, 30, 36, 0.6);
}
body .tool-card::after { color: rgba(255, 255, 255, 0.04); font-weight: 800; }
body .tool-number { color: var(--brand); letter-spacing: 0; font-size: 0.95rem; }
body .tool-card h2 { font-weight: 800; letter-spacing: -0.02em; }
body .tool-card p { color: var(--steel-light); }
body .tool-link {
    border-radius: 999px;
    background: var(--brand);
    color: var(--iron);
    box-shadow: none;
}
body .tool-link:hover { background: #FF8A24; box-shadow: none; }

/* ==========================================================================
   CALCOLATORE MASSIMALE (calcolatore-massimale/styles.css)
   ========================================================================== */
body .hero::before,
body .hero-glow,
body .cta-glow,
body .cta-orbit { display: none; }
body .hero { background: var(--concrete); }
body .eyebrow {
    color: var(--steel);
    text-transform: none;
    letter-spacing: 0;
    font-size: 0.95rem;
    font-weight: 600;
}
body .eyebrow > span { width: 16px; height: 3px; border-radius: 2px; background: var(--brand); }
body .hero h1 {
    text-transform: none;
    letter-spacing: -0.03em;
    line-height: 0.95;
    font-size: clamp(3rem, 5.6vw, 5.4rem);
    text-wrap: balance;
}
body .hero h1 em { color: var(--iron); }
body .hero-lead { color: var(--steel); }

body .calculator-card {
    border: 0;
    border-radius: var(--r-lg);
    background: var(--chalk);
    box-shadow: inset 0 0 0 1px var(--line), 0 40px 80px -56px rgba(27, 30, 36, 0.4);
}
body .field { text-transform: none; font-size: 0.95rem; color: var(--steel); }
body .input-wrap {
    border: 0;
    border-radius: 16px;
    background: var(--concrete);
    box-shadow: inset 0 0 0 1px var(--line);
}
body .input-wrap:focus-within { box-shadow: inset 0 0 0 2px var(--brand); transform: none; }
body .input-wrap b { color: var(--steel); }
body .unit-switch { border-radius: 999px; background: var(--concrete); }
body .unit-btn { border-radius: 999px; }
body .calculate-btn {
    min-height: 72px;
    border-radius: 999px;
    background: var(--brand);
    color: var(--iron);
    text-transform: none;
    font-size: 1.35rem;
    box-shadow: none;
}
body .calculate-btn:hover { background: #FF8A24; box-shadow: none; }
body :is(.result-label, .result-value .result-unit, .section-disclosure > summary small, .formula-card .badge, th, .cta-kicker, .store-button small, .footer-grid h3) {
    text-transform: none;
    letter-spacing: 0;
}
body .result-value { color: var(--brand); }
body :is(.table-card, .formula-card) { border: 0; border-radius: var(--r-md); background: var(--chalk); box-shadow: inset 0 0 0 1px var(--line); }
body :is(.comparison, .faq) { background: var(--concrete); }
body .faq-list details { border-color: rgba(27, 30, 36, 0.14); }
body .disclaimer p { border-left-color: var(--brand); border-radius: 0 12px 12px 0; background: var(--chalk); }

/* invito finale: piastra arancione piena come nella home */
body .cta-panel {
    border-radius: var(--r-lg);
    background: var(--brand);
    color: var(--iron);
    box-shadow: none;
}
body .cta-panel::before { display: none; }
body .app-cta h2 { text-transform: none; text-shadow: none; letter-spacing: -0.02em; line-height: 0.95; color: var(--iron); }
body .cta-panel :is(p, .cta-kicker, .cta-note) { color: rgba(27, 30, 36, 0.78); }
body .store-button {
    border: 0;
    border-radius: 16px;
    background: var(--iron);
    box-shadow: none;
}
body .store-button:hover { background: #000; transform: translateY(-2px); box-shadow: 0 16px 30px -16px rgba(27, 30, 36, 0.6); }

/* ==========================================================================
   PAGINA 404
   ========================================================================== */
html:has(meta[name="robots"][content^="noindex"]) body { background: var(--concrete); font-family: var(--font); }
html:has(meta[name="robots"][content^="noindex"]) body > main strong { color: var(--brand); font-family: var(--font); font-weight: 800; letter-spacing: -0.03em; }
html:has(meta[name="robots"][content^="noindex"]) body > main h1 { font-family: var(--font); font-weight: 800; letter-spacing: -0.02em; color: var(--iron); }
html:has(meta[name="robots"][content^="noindex"]) body > main p { color: var(--steel); font-family: var(--font); }
html:has(meta[name="robots"][content^="noindex"]) body > main a { border-radius: 999px; background: var(--iron); color: #fff; font-family: var(--font); font-weight: 600; transition: background-color 0.25s ease, color 0.25s ease; }
html:has(meta[name="robots"][content^="noindex"]) body > main a:hover { background: var(--brand); color: var(--iron); }

/* ==========================================================================
   COMPONENTI CONDIVISI — banner cookie e selettore lingua (come nella home)
   ========================================================================== */
body .pa-choice-panel {
    border: 0;
    border-radius: var(--r-md);
    background: rgba(251, 251, 252, 0.96);
    box-shadow: 0 0 0 1px var(--line), 0 30px 70px -30px rgba(27, 30, 36, 0.5);
    color: var(--iron);
    font-family: var(--font);
}
body .pa-choice-panel h2 { font-weight: 800; font-size: 1.3rem; }
body .pa-choice-panel p { color: var(--steel); }
body .pa-choice-panel a { color: var(--iron); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
body .pa-choice-panel a:hover { text-decoration-thickness: 2px; }
body .pa-choice-panel button { border-radius: 999px; font-weight: 600; }
body .pa-choice-panel__accept { border-color: var(--iron); background: var(--iron); color: #fff; }
body .pa-choice-panel__reject { border-color: rgba(27, 30, 36, 0.22); color: var(--iron); }
body .pa-choice-preferences {
    border: 0;
    border-radius: 999px;
    background: rgba(251, 251, 252, 0.92);
    box-shadow: 0 0 0 1px var(--line), 0 8px 20px -10px rgba(27, 30, 36, 0.35);
    color: var(--steel);
    font-family: var(--font);
    font-weight: 600;
}
body .language-switcher { color: var(--iron); }
body .language-switcher summary { border: 0; background: var(--chalk); box-shadow: inset 0 0 0 1px var(--line); font-family: var(--font); }
body .language-switcher summary:hover,
body .language-switcher[open] summary { color: var(--iron); background: #fff; box-shadow: inset 0 0 0 1px rgba(27, 30, 36, 0.2); }
body .language-switcher__menu { border: 0; border-radius: 16px; box-shadow: 0 0 0 1px var(--line), 0 24px 50px -24px rgba(27, 30, 36, 0.45); }
body .language-switcher__menu a,
body .language-switcher__menu > span { border-radius: 10px; color: var(--steel); font-family: var(--font); }
body .language-switcher__menu a:hover,
body .language-switcher__menu [aria-current="language"] { color: var(--iron); background: var(--concrete); }
body .language-switcher__menu [aria-current="language"] { box-shadow: inset 3px 0 0 var(--brand); }

/* titoli di sezione a una sola voce, come nella home */
body :is(.section-head, .prose-grid, .faq, .faq-grid) h2 em { color: inherit; font-style: normal; }


/* parole lunghe (es. "Datenschutzerklärung") sillabate invece di uscire dallo schermo */
body h1, body h2, body h3 { overflow-wrap: break-word; }
@media (max-width: 600px) {
    body h1, body h2, body h3 { hyphens: auto; hyphenate-limit-chars: 14 6 6; }
    /* niente sillabazione nel testo corrente (spezzerebbe anche le email): solo a capo d'emergenza */
    body :is(.changes-list li, .privacy-content, .terms-content, .delete-account-content) { overflow-wrap: break-word; }
    body :is(.privacy-content, .terms-content, .delete-account-content) :is(p, li) { hyphens: manual; }
    body :is(.privacy-header, .terms-header, .delete-account-header) h1 { font-size: clamp(1.9rem, 8.6vw, 2.4rem); }
}



/* ---------- Calcolatore: gerarchia delle etichette ---------- */
body .result-label { font-size: 0.95rem; color: var(--steel); margin-top: 18px; }
body .advanced-options > summary { font-size: 0.9rem; color: var(--iron); padding: 18px 0 14px; }
body .advanced-options > summary span { color: var(--steel); }
body .advanced-options .field { font-size: 0.85rem; }
body .card-head { min-height: 0; margin-bottom: -8px; }
body .result-divider { opacity: 0.6; }
body .hero-lead { font-size: clamp(1.15rem, 1.6vw, 1.5rem); line-height: 1.4; max-width: 24ch; }
body .breadcrumbs { color: var(--steel); }
body .breadcrumbs a { color: var(--iron); text-decoration: underline; text-decoration-color: var(--brand); text-underline-offset: 3px; }
body .input-wrap input { padding-left: 20px; }
body .field small { font-size: 0.75rem; color: var(--steel); }
body .unit-btn.is-active { box-shadow: 0 1px 2px rgba(27, 30, 36, 0.12), inset 0 0 0 1px var(--line); }

/* ---------- Hub Strumenti: proporzioni della scheda ---------- */
body .tool-card { min-height: 360px; align-items: center; }
body .tool-card p { font-size: 1.05rem; line-height: 1.6; }
body .tools-future { border-color: rgba(27, 30, 36, 0.14); }
body .tools-lead { color: var(--steel); }

/* nota "Importante": filetto arancione dritto, niente bordo curvo */


/* PerformFont 6 anche per codice e campi tecnici (niente monospace di sistema) */
body code, body kbd, body pre, body samp { font-family: var(--font); }

/* banner cookie: titolo senza sillabazione (le parole stanno intere su due righe) */
body .pa-choice-panel h2 { hyphens: manual; text-wrap: balance; }

/* niente parole sole in ultima riga nel testo corrente */
body p, body li { text-wrap: pretty; }

/* voci di menu sempre su una riga (PerformFont 6 è un po' più largo) */

/* titoli: righe bilanciate, niente parola sola in fondo ("RIR?"); il titolo dei documenti legali va a capo normalmente
   così il trattino di "Privacy Policy - PerformApp" resta in fondo alla prima riga */
body h2, body h3 { text-wrap: balance; }
body :is(.privacy-header, .terms-header, .delete-account-header) h1 { text-wrap: pretty; }
/* sottotitolo delle pagine legali: mai sillabato */
body :is(.privacy-header, .terms-header, .delete-account-header) h2 { hyphens: manual; }


/* ==========================================================================
   CHANGELOG — pila di card sulla linea del tempo
   Un solo segno orizzontale: la tacca arancione della versione sulla linea.
   Le categorie sono etichette colorate, le voci paragrafi senza trattino.
   ========================================================================== */
body .changelog-section { background: var(--concrete); padding-top: calc(76px + clamp(40px, 6vw, 72px)); }
body .changelog-header { text-align: left; }
body .changelog-header h1,
body .changelog-header .gradient-text {
    font-weight: 800;
    font-size: clamp(2.6rem, 6.2vw, 5.2rem);
    line-height: 1;
    letter-spacing: -0.02em;
    color: var(--iron);
    background: none;
    -webkit-text-fill-color: var(--iron);
}
body .changelog-header p { color: var(--steel); margin-left: 0; }

body .timeline-container::before { background: rgba(27, 30, 36, 0.14); width: 2px; left: 30px; opacity: 1; }
body .version-item:hover .timeline-point { transform: scaleX(1.6); box-shadow: none; }
body .timeline-point {
    left: 23px;   /* tacca centrata sulla linea del tempo (linea a 30px, 2px) */
    top: 48.5px;  /* all'altezza del numero di versione */
    width: 16px;
    height: 3px;
    border-radius: 2px;
    background: var(--brand);
    box-shadow: none;
    border: 0;
}
@media (max-width: 768px) { body .timeline-point { top: 43.5px; } }
@media (max-width: 480px) { body .timeline-point { top: 38.5px; } }

body .version-card {
    border: 0;
    border-radius: var(--r-md);
    background: var(--chalk);
    box-shadow: inset 0 0 0 1px var(--line);
    transition: box-shadow 0.3s ease, transform 0.4s var(--ease-out);
}
body .version-card:hover { transform: none; box-shadow: inset 0 0 0 1px rgba(27, 30, 36, 0.2), 0 24px 48px -32px rgba(27, 30, 36, 0.35); }
body .version-header { padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid var(--line); }
/* data sempre sulla stessa riga del numero, a destra (lo stile della pagina la manda a capo sotto i 768px) */
body .version-card .version-header { flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between; }
body .version-date { flex-shrink: 0; white-space: nowrap; }
body .version-number { font-size: 1.6rem; font-weight: 800; color: var(--iron); letter-spacing: -0.01em; }
body .version-date { border-radius: 999px; background: var(--concrete); color: var(--steel); }

/* categorie: pallino colorato e titoletto come nella versione originale (stile interno della pagina) */
body .version-card .changes-section { gap: 10px; }
body .version-card .changes-section + .changes-section { margin-top: 22px; }

/* voci: niente trattino, paragrafi distanziati con il titolo in grassetto */
body .changes-list { display: grid; gap: 10px; margin: 0; padding: 0; list-style: none; }
body .changes-list li { margin: 0; padding: 0; color: var(--steel); line-height: 1.6; }
body .changes-list li::before { display: none; content: none; }
body .changes-list strong { color: var(--iron); }

/* ==========================================================================
   PAGINE LEGALI — impaginazione (privacy, termini, eliminazione account)
   Stessa grammatica del changelog: niente riquadro esterno, testo sul cemento,
   filetti tra le sezioni. Su schermi larghi un indice laterale resta in vista
   (lo crea script.js dai titoli della pagina). Un solo livello di riquadri:
   solo i box informativi e il modulo sono superfici chiare.
   ========================================================================== */
body :is(.privacy-section, .terms-section, .delete-account-section) {
    padding: clamp(120px, 14vw, 168px) 0 clamp(64px, 8vw, 112px);
    background: var(--concrete);
    min-height: 0;
}
body :is(.legal-page-container, .terms-container, .delete-account-container) {
    max-width: var(--container);
    margin: 0 auto;
    padding: 0 clamp(16px, 4vw, 40px);
}
body :is(.privacy-content, .terms-content, .delete-account-content),
body :is(.privacy-content, .terms-content, .delete-account-content):hover {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

/* intestazione del documento */
body :is(.privacy-header, .terms-header, .delete-account-header) {
    max-width: 880px;
    margin: 0 0 clamp(40px, 6vw, 72px);
    padding: 0;
    border: 0;
    text-align: left;
}
body :is(.privacy-header, .terms-header, .delete-account-header) h1 {
    margin: 0 0 18px;
    color: var(--iron);
    font-family: var(--font);
    font-size: clamp(2.4rem, 6vw, 4.6rem);
    font-weight: 800;
    line-height: 0.98;
    letter-spacing: -0.03em;
}
body .delete-account-header h2 {
    max-width: 40ch;
    margin: 0 0 14px;
    padding: 0;
    border: 0;
    color: var(--steel);
    font-size: clamp(1.1rem, 1.8vw, 1.35rem);
    font-weight: 500;
    line-height: 1.45;
    letter-spacing: 0;
}
body :is(.privacy-header, .terms-header, .delete-account-header) :is(p, .last-updated, .document-date) {
    margin: 0;
    color: var(--steel);
    font-size: 0.95rem;
    font-style: normal;
}
body :is(.privacy-header, .terms-header, .delete-account-header) strong { color: var(--iron); font-weight: 600; }

/* corpo e indice */
body .legal-layout {
    display: grid;
    grid-template-columns: minmax(180px, 230px) minmax(0, 1fr);
    gap: clamp(40px, 6vw, 96px);
    align-items: start;
}
body .legal-body { max-width: 72ch; min-width: 0; }
body .legal-body > :first-child { margin-top: 0; }

body .legal-toc {
    position: sticky;
    top: 104px;
    max-height: calc(100vh - 140px);
    overflow-y: auto;
    padding: 2px 0 2px 2px;
}
body .legal-toc-label { margin: 0 0 12px; color: var(--iron); font-size: 0.85rem; font-weight: 700; }
body .legal-toc ol { margin: 0; padding: 0; list-style: none; }
body .legal-toc li { margin: 0; padding: 0; }
body .legal-toc a,
body .legal-toc a:not(.btn):not(.back-to-home) {
    display: block;
    padding: 6px 0 6px 14px;
    border-left: 2px solid rgba(27, 30, 36, 0.12);
    color: var(--steel);
    font-size: 0.88rem;
    line-height: 1.35;
    text-decoration: none;
    transition: color 0.2s ease, border-color 0.2s ease;
}
body .legal-toc a:hover { color: var(--iron); }
body .legal-toc a[aria-current="true"] { border-left-color: var(--iron); color: var(--iron); font-weight: 600; }

/* sezioni: filetto sopra ogni titolo, niente tacche */
body :is(.privacy-content, .terms-content, .delete-account-content) h2 {
    margin: 56px 0 18px;
    padding: 40px 0 0;
    border-top: 1px solid rgba(27, 30, 36, 0.12);
    color: var(--iron);
    font-size: clamp(1.3rem, 2vw, 1.6rem);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -0.015em;
    scroll-margin-top: 100px;
}
body :is(.privacy-content, .terms-content, .delete-account-content) h2::before { content: none; display: none; }
body :is(.privacy-content, .terms-content, .delete-account-content) h3 {
    margin: 32px 0 10px;
    color: var(--iron);
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1.3;
}
body :is(.privacy-content, .terms-content, .delete-account-content) :is(p, li) {
    color: var(--steel);
    font-size: 1rem;
    line-height: 1.75;
}
body :is(.privacy-content, .terms-content, .delete-account-content) p { margin: 0 0 16px; }
body :is(.privacy-content, .terms-content, .delete-account-content) :is(strong, b) { color: var(--iron); font-weight: 600; }

/* elenchi: pallino discreto, numeri in ferro */
body :is(.privacy-content, .terms-content, .delete-account-content) :is(ul, ol) { margin: 0 0 20px; padding-left: 1.25em; }
body :is(.privacy-content, .terms-content, .delete-account-content) ul { list-style: disc; }
body :is(.privacy-content, .terms-content, .delete-account-content) li { margin: 0 0 8px; padding-left: 4px; }
body :is(.privacy-content, .terms-content, .delete-account-content) li::before { content: none; display: none; }
body :is(.privacy-content, .terms-content, .delete-account-content) ul > li::marker { color: rgba(27, 30, 36, 0.35); }
body :is(.privacy-content, .terms-content, .delete-account-content) ol > li::marker { color: var(--iron); font-weight: 700; }

/* box informativi: unica superficie chiara, mai annidata */
body :is(.privacy-content, .terms-content, .delete-account-content) :is(.highlight-box, .contact-box, .contact-info-box) {
    margin: 32px 0;
    padding: clamp(22px, 3vw, 32px);
    border: 0;
    border-radius: var(--r-md);
    background: var(--chalk);
    box-shadow: inset 0 0 0 1px var(--line);
    color: var(--steel);
}
body :is(.privacy-content, .terms-content, .delete-account-content) :is(.highlight-box, .contact-box, .contact-info-box, .delete-request-box) :is(h2, h3) {
    margin: 0 0 12px;
    padding: 0;
    border: 0;
    color: var(--iron);
    font-size: 1.15rem;
    font-weight: 700;
}
body :is(.privacy-content, .terms-content, .delete-account-content) :is(.highlight-box, .contact-box, .contact-info-box) :is(p, li) { color: var(--steel); }
body :is(.privacy-content, .terms-content, .delete-account-content) :is(.highlight-box, .contact-box, .contact-info-box) > :last-child { margin-bottom: 0; }

/* eliminazione account: il modulo è l'azione principale della pagina */
body .delete-request-box {
    margin: 0 0 40px;
    padding: clamp(24px, 4vw, 40px);
    border: 0;
    border-radius: var(--r-lg);
    background: var(--chalk);
    box-shadow: inset 0 0 0 1px var(--line), 0 30px 60px -40px rgba(27, 30, 36, 0.35);
}
body .delete-account-content .delete-request-box h2 { font-size: clamp(1.3rem, 2.2vw, 1.6rem); font-weight: 800; letter-spacing: -0.015em; }
body .delete-request-form { gap: 10px; margin-top: 24px; }
body .delete-request-form label { color: var(--iron); font-size: 0.95rem; font-weight: 600; }
body .delete-request-form input[type="email"] {
    min-height: 54px;
    padding: 0 16px;
    border: 0;
    border-radius: 14px;
    background: var(--concrete);
    box-shadow: inset 0 0 0 1px rgba(27, 30, 36, 0.14);
    color: var(--iron);
    font-family: var(--font);
    font-size: 1rem;
}
body .delete-request-form input[type="email"]:focus { outline: none; box-shadow: inset 0 0 0 2px var(--iron); background: var(--chalk); }
body .form-help { margin: 0; color: var(--steel); font-size: 0.85rem; }
body .request-consent { gap: 12px; margin-top: 8px; color: var(--steel); font-size: 0.95rem; font-weight: 400; line-height: 1.5; }
body .request-consent input { width: 18px; height: 18px; margin-top: 3px; accent-color: var(--iron); }
body .delete-request-form button {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 52px;
    margin-top: 12px;
    padding: 0 24px;
    border: 0;
    border-radius: 999px;
    background: var(--iron);
    color: #fff;
    font-family: var(--font);
    font-size: 1rem;
    font-weight: 600;
    box-shadow: none;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease, transform 0.4s var(--ease-out);
}
body .delete-request-form button:hover,
body .delete-request-form button:focus-visible { background: var(--brand); color: var(--iron); transform: translateY(-2px); }
body .request-note {
    margin: 24px 0 0;
    padding: 2px 0 2px 16px;
    border: 0;
    border-left: 2px solid var(--brand);
    border-radius: 0;
    background: none;
    box-shadow: none;
}
body .request-note p { margin: 0; color: var(--steel); font-size: 0.95rem; }

body .back-to-home { margin: 64px 0 0; text-align: left; }

/* precisazioni a specificità più alta delle regole generali del testo */
body .legal-layout .legal-toc ol { margin: 0; padding: 0; list-style: none; }
body .legal-layout .legal-toc li { margin: 0; padding: 0; font-size: inherit; line-height: inherit; }
body .delete-account-content .delete-account-header h2 { margin: 0 0 14px; padding: 0; border: 0; color: var(--steel); font-size: clamp(1.1rem, 1.8vw, 1.35rem); font-weight: 500; letter-spacing: 0; }
body .delete-account-content .delete-request-box h3 { margin-top: 36px; }

@media (max-width: 1080px) {
    body .legal-layout { display: block; }
    body .legal-toc { display: none; }
}
@media (max-width: 600px) {
    body :is(.privacy-header, .terms-header, .delete-account-header) h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
    body :is(.privacy-content, .terms-content, .delete-account-content) h2 { margin-top: 40px; padding-top: 32px; }
    body .delete-request-form button { align-self: stretch; justify-content: center; }
}
