/* Estil compartit per a les pàgines legals de Mítiks */
:root {
    --bg-dark: #010a13;
    --text-primary: #f0e6d2;
    --text-secondary: #c8aa6e;
    --accent: #0ac8b9;
    --gold: #c89b3c;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
    font-family: 'Outfit', sans-serif;
    background: var(--bg-dark);
    color: var(--text-primary);
    line-height: 1.7;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background-image:
        radial-gradient(circle at 10% 10%, rgba(10, 200, 185, 0.05), transparent 40%),
        radial-gradient(circle at 90% 90%, rgba(155, 89, 182, 0.05), transparent 45%);
}

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ===== Nav ===== */
.legal-nav {
    display: flex; align-items: center; justify-content: space-between;
    padding: 14px 28px; position: sticky; top: 0; z-index: 10;
    background: rgba(3, 7, 14, 0.92); backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(200, 155, 60, 0.15);
}
.legal-nav img { height: 40px; display: block; }
.legal-nav .back {
    font-size: 0.82rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px;
    color: var(--text-secondary);
}
.legal-nav .back:hover { color: var(--accent); text-decoration: none; }

/* ===== Contingut ===== */
.legal-wrap { max-width: 780px; width: 100%; margin: 0 auto; padding: 54px 24px 80px; flex: 1; }

.legal-wrap h1 {
    font-family: 'Outfit', sans-serif;
    font-size: clamp(1.8rem, 4vw, 2.4rem); font-weight: 800;
    letter-spacing: 1.5px; text-transform: uppercase;
    background: linear-gradient(135deg, #c89b3c, #f0e6d2);
    -webkit-background-clip: text; -webkit-text-fill-color: transparent;
    margin-bottom: 8px;
}
.legal-updated { color: var(--text-secondary); opacity: 0.6; font-size: 0.82rem; margin-bottom: 30px; }

.legal-wrap h2 {
    font-size: 1.22rem; font-weight: 800; color: var(--text-primary);
    margin: 34px 0 12px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, 0.06);
}
.legal-wrap h2:first-of-type { border-top: none; padding-top: 0; }
.legal-wrap h3 { font-size: 1rem; font-weight: 700; color: var(--gold); margin: 20px 0 8px; }

.legal-wrap p { margin: 0 0 14px; color: #d8d2c4; font-size: 0.95rem; }
.legal-wrap ul { margin: 0 0 16px 22px; color: #d8d2c4; font-size: 0.95rem; }
.legal-wrap li { margin-bottom: 7px; }
.legal-wrap strong { color: var(--text-primary); }

.legal-note {
    background: rgba(200, 155, 60, 0.08); border: 1px solid rgba(200, 155, 60, 0.25);
    border-radius: 12px; padding: 14px 18px; font-size: 0.88rem;
    color: var(--text-secondary); margin: 0 0 30px;
}

/* ===== Footer ===== */
.site-footer {
    padding: 40px 24px 30px; border-top: 1px solid rgba(255, 255, 255, 0.05);
    background: linear-gradient(180deg, transparent, rgba(3, 7, 14, 0.9));
}
.footer-inner { max-width: 760px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 16px; text-align: center; }
.footer-logo { height: 34px; width: auto; display: block; opacity: 0.95; }
.footer-nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 22px; }
.footer-nav a { font-size: 0.8rem; color: var(--text-secondary); opacity: 0.72; }
.footer-nav a:hover { color: var(--accent); opacity: 1; text-decoration: none; }
.footer-legal { font-size: 0.72rem; color: var(--text-secondary); opacity: 0.45; max-width: 560px; line-height: 1.6; }