.landing-page {
    background:
        radial-gradient(circle at 50% 0%, rgba(255, 31, 61, 0.14), transparent 34rem),
        linear-gradient(160deg, #120a0c 0%, var(--bg) 48%, #080405 100%);
}

.landing-page .hero {
    isolation: isolate;
}

.landing-page .hero-desc {
    max-width: 680px;
    margin-bottom: 0;
}

.landing-page .features.landing-intro,
.landing-page .landing-panel,
.landing-page .landing-slider,
.landing-page .landing-lilith,
.landing-page .landing-mystery,
.landing-page .landing-final {
    position: relative;
    z-index: 1;
}

.landing-page .features.landing-intro {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 8rem 1.5rem;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 35%, rgba(255, 31, 61, 0.18), transparent 24rem),
        linear-gradient(180deg, rgba(10, 6, 8, 0.2), rgba(10, 6, 8, 0.95) 24%, #0a0608 100%);
}

.landing-page .landing-veil {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(10, 6, 8, 0.94), transparent 42%, rgba(10, 6, 8, 0.94)),
        repeating-linear-gradient(115deg, transparent 0 120px, rgba(212, 160, 23, 0.025) 121px 123px);
    pointer-events: none;
}

.landing-page .landing-copy,
.landing-page .landing-panel-inner,
.landing-page .landing-slider-copy,
.landing-page .landing-mystery-copy,
.landing-page .landing-final-copy {
    position: relative;
    width: min(980px, calc(100% - 2rem));
    margin: 0 auto;
}

.landing-page .landing-line {
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(2.3rem, 7vw, 6rem);
    line-height: 1.02;
    color: var(--text);
    text-align: center;
    text-shadow: 0 0 34px rgba(255, 31, 61, 0.18);
}

.landing-page .landing-line + .landing-line {
    margin-top: clamp(1.5rem, 5vw, 4rem);
}

.landing-page .landing-line-gold {
    color: var(--gold);
    text-shadow: 0 0 34px rgba(212, 160, 23, 0.2);
}

.landing-page .landing-panel {
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    padding: 8rem 1.5rem;
}

.landing-page .landing-panel-dark {
    background:
        radial-gradient(circle at 20% 60%, rgba(139, 0, 0, 0.35), transparent 28rem),
        linear-gradient(180deg, #0a0608, #12070a 52%, #050304);
}

.landing-page .landing-fog,
.landing-page .landing-panel::after,
.landing-page .landing-mystery::after {
    content: '';
    position: absolute;
    inset: -20%;
    background:
        radial-gradient(ellipse at 20% 40%, rgba(245, 238, 238, 0.045), transparent 24rem),
        radial-gradient(ellipse at 78% 58%, rgba(212, 160, 23, 0.035), transparent 28rem);
    filter: blur(18px);
    opacity: 0.9;
    animation: landing-fog-drift 18s ease-in-out infinite alternate;
    pointer-events: none;
}

.landing-page .landing-kicker {
    color: var(--gold);
    font-size: clamp(1.1rem, 2vw, 1.45rem);
    line-height: 1.5;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.landing-page .landing-panel-title {
    max-width: 780px;
    margin-top: 1rem;
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(3rem, 8vw, 7rem);
    font-weight: 400;
    line-height: 0.95;
    color: var(--text);
    text-shadow: 0 0 44px rgba(255, 31, 61, 0.26);
}

.landing-page .landing-panel-inner-right {
    margin-left: auto;
    text-align: right;
}

.landing-page .landing-panel-inner-right .landing-panel-title {
    margin-left: auto;
}

.landing-page .landing-slider {
    min-height: 100vh;
    background: #050304;
    overflow: hidden;
}

.landing-page .landing-slider-stage {
    position: sticky;
    top: 0;
    min-height: 100vh;
    overflow: hidden;
}

.landing-page .landing-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 1.6s ease;
}

.landing-page .landing-slide.is-active {
    opacity: 1;
}

.landing-page .landing-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transform: scale(1.04);
    filter: saturate(0.92) contrast(1.08) brightness(0.58);
}

.landing-page .landing-slide.is-active img {
    animation: landing-ken-burns 7s ease forwards;
}

.landing-page .landing-slider-shade {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 70% 44%, transparent 0%, rgba(5, 3, 4, 0.32) 38%, rgba(5, 3, 4, 0.82) 75%),
        linear-gradient(90deg, rgba(5, 3, 4, 0.9), rgba(5, 3, 4, 0.28) 46%, rgba(5, 3, 4, 0.86));
}

.landing-page .landing-slider-copy {
    position: absolute;
    left: max(1.5rem, 8vw);
    bottom: clamp(6rem, 14vh, 10rem);
    width: min(760px, calc(100% - 3rem));
    margin: 0;
}

.landing-page .landing-slider-progress {
    position: absolute;
    left: max(1.5rem, 8vw);
    right: max(1.5rem, 8vw);
    bottom: 3rem;
    height: 2px;
    background: rgba(245, 238, 238, 0.16);
    overflow: hidden;
}

.landing-page .landing-slider-progress span {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, var(--accent), var(--gold));
    transform: scaleX(0);
    transform-origin: left;
}

.landing-page .landing-slider-progress.is-running span {
    animation: landing-progress 6s linear forwards;
}

.landing-page .landing-panel-crimson {
    justify-content: flex-end;
    background:
        radial-gradient(circle at 76% 40%, rgba(255, 31, 61, 0.22), transparent 22rem),
        radial-gradient(circle at 20% 80%, rgba(212, 160, 23, 0.08), transparent 26rem),
        linear-gradient(180deg, #050304, #13070a 48%, #080405);
}

.landing-page .landing-rune-orbit,
.landing-page .landing-mystery-runes,
.landing-page .landing-final-mark {
    position: absolute;
    width: clamp(18rem, 42vw, 36rem);
    aspect-ratio: 1;
    border: 1px solid rgba(255, 31, 61, 0.18);
    border-radius: 50%;
    box-shadow:
        inset 0 0 52px rgba(255, 31, 61, 0.06),
        0 0 70px rgba(139, 0, 0, 0.18);
    pointer-events: none;
}

.landing-page .landing-rune-orbit {
    left: 8vw;
    top: 50%;
    transform: translateY(-50%);
    animation: landing-spin 90s linear infinite;
}

.landing-page .landing-rune-orbit::before,
.landing-page .landing-mystery-runes::before,
.landing-page .landing-final-mark::before {
    content: '';
    position: absolute;
    inset: 18%;
    border: 1px dashed rgba(212, 160, 23, 0.17);
    border-radius: 50%;
}

.landing-page .landing-lilith {
    min-height: 100vh;
    display: grid;
    grid-template-columns: minmax(16rem, 0.82fr) minmax(20rem, 1.18fr);
    align-items: center;
    gap: clamp(2rem, 5vw, 5rem);
    padding: 8rem max(1.5rem, 8vw);
    overflow: hidden;
    background:
        radial-gradient(circle at 30% 50%, rgba(255, 31, 61, 0.22), transparent 26rem),
        linear-gradient(180deg, #080405, #12080b 55%, #050304);
}

.landing-page .landing-lilith-media {
    position: relative;
    aspect-ratio: 3 / 4;
    width: min(100%, 34rem);
    justify-self: center;
    min-height: 0;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 32px 90px rgba(0, 0, 0, 0.58), 0 0 60px rgba(255, 31, 61, 0.12);
}

.landing-page .landing-lilith-media::after {
    content: '';
    position: absolute;
    inset: 0;
    background:
        linear-gradient(180deg, rgba(5, 3, 4, 0.08), rgba(5, 3, 4, 0.72)),
        radial-gradient(circle at 54% 42%, transparent, rgba(5, 3, 4, 0.45) 72%);
}

.landing-page .landing-lilith-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 50%;
    filter: contrast(1.05) saturate(0.96) brightness(0.78);
}

.landing-page .landing-lilith-copy {
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(2.5rem, 6.4vw, 6rem);
    line-height: 1.02;
    color: var(--text);
    text-shadow: 0 0 42px rgba(255, 31, 61, 0.24);
}

.landing-page .landing-lilith-copy p + p {
    margin-top: 1.2rem;
    color: var(--gold);
}

.landing-page .landing-mystery {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 8rem 1.5rem;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 52%, rgba(255, 31, 61, 0.16), transparent 24rem),
        linear-gradient(180deg, #050304, #090506 42%, #020202);
}

.landing-page .landing-mystery::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, transparent 12%, rgba(0, 0, 0, 0.88) 78%);
    pointer-events: none;
}

.landing-page .landing-mystery-runes {
    left: 50%;
    top: 50%;
    opacity: 0.72;
    transform: translate(-50%, -50%);
    animation: landing-spin 110s linear infinite reverse;
}

.landing-page .landing-final {
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 8rem 1.5rem;
    overflow: hidden;
    background:
        radial-gradient(circle at 50% 48%, rgba(212, 160, 23, 0.08), transparent 20rem),
        radial-gradient(circle at 50% 52%, rgba(255, 31, 61, 0.12), transparent 28rem),
        #020202;
}

.landing-page .landing-final-mark {
    left: 50%;
    top: 48%;
    opacity: 0.45;
    transform: translate(-50%, -50%);
    animation: landing-spin 120s linear infinite;
}

.landing-page .landing-final-copy {
    text-align: center;
}

.landing-page .landing-final-copy .landing-panel-title {
    margin-left: auto;
    margin-right: auto;
}

.landing-page .landing-final-actions {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: clamp(2rem, 5vw, 3.5rem);
}

.landing-page .landing-reveal {
    opacity: 0;
    transform: translateY(46px);
    filter: blur(12px);
    transition:
        opacity 1s ease,
        transform 1s cubic-bezier(0.22, 1, 0.36, 1),
        filter 1s ease;
}

.landing-page .landing-reveal.is-visible {
    opacity: 1;
    transform: translateY(0);
    filter: blur(0);
}

@keyframes landing-fog-drift {
    from { transform: translate3d(-2%, -1%, 0) scale(1); }
    to { transform: translate3d(2%, 1.5%, 0) scale(1.05); }
}

@keyframes landing-ken-burns {
    from { transform: scale(1.04) translate3d(0, 0, 0); }
    to { transform: scale(1.12) translate3d(-1.5%, -1%, 0); }
}

@keyframes landing-progress {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
}

@keyframes landing-spin {
    to { rotate: 360deg; }
}

@media (max-width: 820px) {
    .landing-page .landing-panel,
    .landing-page .features.landing-intro,
    .landing-page .landing-mystery,
    .landing-page .landing-final {
        min-height: auto;
        padding-top: 7rem;
        padding-bottom: 7rem;
    }

    .landing-page .landing-slider-stage {
        min-height: 88vh;
    }

    .landing-page .landing-panel-inner-right {
        text-align: left;
    }

    .landing-page .landing-panel-inner-right .landing-panel-title {
        margin-left: 0;
    }

    .landing-page .landing-lilith {
        min-height: auto;
        grid-template-columns: 1fr;
        padding-top: 6rem;
        padding-bottom: 7rem;
    }

    .landing-page .landing-lilith-media {
        aspect-ratio: 3 / 4;
        width: min(100%, 25rem);
    }
}

@media (max-width: 560px) {
    .landing-page .landing-line,
    .landing-page .landing-panel-title,
    .landing-page .landing-lilith-copy {
        overflow-wrap: break-word;
    }

    .landing-page .landing-slider-copy {
        bottom: 5.5rem;
    }

    .landing-page .landing-final-actions .btn {
        width: min(100%, 20rem);
        justify-content: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    .landing-page .landing-reveal {
        opacity: 1;
        transform: none;
        filter: none;
    }

    .landing-page .landing-slide,
    .landing-page .landing-slide img,
    .landing-page .landing-fog,
    .landing-page .landing-panel::after,
    .landing-page .landing-mystery::after,
    .landing-page .landing-rune-orbit,
    .landing-page .landing-mystery-runes,
    .landing-page .landing-final-mark,
    .landing-page .landing-slider-progress span {
        animation: none !important;
        transition: none !important;
    }
}

/* =========================================================
   Aggiunte per la pagina pubblica di Lilith.
   Tutto il resto del foglio resta invariato: qui ci sono solo
   il marchio nella navbar, il monologo e la firma finale.
   ========================================================= */

.landing-page .brand-logo {
    width: 2.1rem;
    height: 2.1rem;
    object-fit: contain;
    filter: drop-shadow(0 0 10px rgba(255, 31, 61, 0.35));
}

/* Il monologo riusa la griglia di .landing-lilith: ritratto a sinistra, voce a destra. */
.landing-page .landing-voice-copy {
    max-width: 46rem;
    color: var(--text);
    font-size: clamp(1.05rem, 1.55vw, 1.3rem);
    line-height: 1.85;
}

.landing-page .landing-voice-copy p + p {
    margin-top: 1.15em;
}

.landing-page .landing-voice-open {
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(2.4rem, 5.4vw, 4.4rem);
    line-height: 1.02;
    color: var(--text);
    text-shadow: 0 0 42px rgba(255, 31, 61, 0.24);
}

.landing-page .landing-voice-copy .landing-voice-em {
    color: var(--gold);
}

.landing-page .landing-voice-sign {
    margin-top: 1.8em;
    padding-top: 1.4em;
    border-top: 1px solid rgba(212, 160, 23, 0.22);
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(1.6rem, 3.2vw, 2.6rem);
    line-height: 1.15;
    color: var(--gold);
    text-shadow: 0 0 34px rgba(212, 160, 23, 0.2);
}

/* Firma nella schermata finale */
.landing-page .landing-signature {
    margin-top: clamp(1.5rem, 4vw, 2.5rem);
    font-family: 'Almendra Display', 'Pirata One', cursive;
    font-size: clamp(1.4rem, 3vw, 2.2rem);
    color: var(--gold);
    letter-spacing: 0.04em;
    text-shadow: 0 0 30px rgba(212, 160, 23, 0.22);
}

@media (max-width: 820px) {
    .landing-page .landing-voice-copy {
        max-width: none;
    }
}

/* Velatura extra dietro al testo dell'intestazione: l'immagine resta protagonista,
   ma titolo e frasi restano leggibili anche sopra il tramonto. */
.landing-page .hero-vignette {
    background:
        radial-gradient(ellipse at 50% 52%, rgba(5, 3, 4, 0.66) 0%, rgba(5, 3, 4, 0.34) 36%, transparent 60%),
        radial-gradient(ellipse at center, transparent 34%, rgba(5, 3, 4, 0.92) 100%);
}

.landing-page .hero-hook {
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.85);
}

.landing-page .hero-desc {
    text-shadow: 0 2px 14px rgba(0, 0, 0, 0.8);
}

/* =========================================================
   Font delle frasi narrative di Lilith: Almendra Display.
   Pirata One resta solo al logo MAHYKA (.brand in style.css),
   dove la lettura non dava problemi.
   Qui si cambia la sola famiglia: dimensioni, colori, bagliori,
   animazioni e posizioni restano quelle di prima.
   ========================================================= */
.landing-page .hero-title,
.landing-page .hero-subtitle {
    font-family: 'Almendra Display', 'Pirata One', cursive;
}

/* Unico aggiustamento richiesto dal cambio di font.
   Pirata One e' compatto in verticale e reggeva interlinee di 0.95-1.02.
   Almendra Display ha aste e code piu' lunghe: con quei valori i glifi
   venivano tagliati. Si alza solo l'interlinea, dove serviva.
   Corpo, colori, bagliori, animazioni e posizioni restano invariati. */
.landing-page .landing-line,
.landing-page .landing-voice-open,
.landing-page .landing-lilith-copy {
    line-height: 1.15;
}

.landing-page .landing-panel-title {
    line-height: 1.12;
}

/* Home: scenario originale, oro antico e luce di brace. */
.landing-page { --gold:#e4bf7b; background:#080709; }
.landing-page .navbar { background:rgba(10,8,12,.92); border-bottom:1px solid #6b5134; box-shadow:0 8px 40px #0008; }
.landing-page .hero {
    min-height:100svh; padding:8rem 7vw 5rem;
    justify-content:flex-start; text-align:left; background:#09080d;
}
.landing-page .hero::before {
    background-image:var(--hero-image,none);
    background-size:auto 115%; background-repeat:no-repeat;
    background-position:right center; opacity:1; z-index:0;
    animation:lilith-scenery 20s ease-in-out infinite alternate;
}
.landing-page .hero-vignette {
    z-index:1; pointer-events:none;
    background:linear-gradient(90deg,#09080d 0%,#09080df2 22%,#09080d88 48%,transparent 75%),
               linear-gradient(0deg,#09080d,transparent 25%);
}
.landing-page .hero-content { max-width:46%; z-index:3; }
.landing-page .hero-title {
    font-size:clamp(6rem,12vw,12rem); line-height:1.15;
    color:#ffe6b3; letter-spacing:.025em; padding-left:.18em;
    animation:title-emerge 1.2s ease .3s both,lilith-gold-breath 5s ease-in-out 1.5s infinite;
}
.landing-page .hero-subtitle { font-size:clamp(1.65rem,2.8vw,2.8rem); color:#f1d4a3; }
.landing-page .hero-hook { color:#f5e8d7; font-size:1.15rem; }
.landing-page .hero-desc { margin-left:0; margin-right:0; padding-top:1.5rem; border-top:1px solid #c8955355; line-height:1.8; color:#e0d5c8; font-size:1.1rem; }
.landing-page .hero-rune-circle { left:2vw; width:45vw; height:45vw; border-color:#e4bf7b44; box-shadow:0 0 70px #dd742510,inset 0 0 60px #b3651910; }
.landing-page .hero-rune-circle::before { border-color:#d99c5355; }
.landing-page .hero-rune-circle::after { border-color:#d99c5333; }
.landing-page .features.landing-intro {
    min-height:65vh; border-block:1px solid #c8955328;
    background:radial-gradient(ellipse at center,#49241555,transparent 65%),#09080d;
}
.landing-page .landing-line { font-size:clamp(2.2rem,5vw,5rem); text-shadow:0 0 35px #d88d3833; }
.landing-page .landing-line-gold { color:#e4bf7b; }
.landing-page .landing-lilith {
    background:radial-gradient(ellipse at 20% 50%,#6a3c222c,transparent 65%),#09080d;
    gap:clamp(3rem,8vw,8rem); padding-block:7rem;
}
.landing-page .landing-lilith-media {
    border-radius:48% 48% 3px 3px; border:1px solid #c8955399;
    outline:1px solid #c8955338; outline-offset:12px;
    box-shadow:0 0 75px #d88d3820,0 30px 80px #0009;
}
.landing-page .landing-lilith-media img { filter:none; }
.landing-page .landing-lilith-media::after { background:linear-gradient(0deg,#09080d77,transparent 35%); }
.landing-page .landing-voice-copy { line-height:1.9; color:#e0d5c8; }
.landing-page .landing-voice-open { color:#f1d4a3; }
.landing-page .landing-panel { min-height:72vh; padding-inline:8vw; }
.landing-page .landing-panel-title { font-size:clamp(2.8rem,5.5vw,5.8rem); text-shadow:0 0 35px #d88d3822; }
.landing-page .landing-panel-dark { background:radial-gradient(ellipse at 10% 80%,#65402d44,transparent 65%),#09080d; border-top:1px solid #c8955328; }
.landing-page .landing-panel-crimson { background:radial-gradient(ellipse at 20% 60%,#6f211c55,transparent 65%),#09080d; }
.landing-page .landing-slide img { filter:none; }
.landing-page .landing-slider-shade { background:linear-gradient(0deg,#09080df0,transparent 65%),linear-gradient(90deg,#09080d55,transparent); }
.landing-page .landing-slider-copy { text-shadow:0 2px 15px #000; }
.landing-page .landing-mystery,.landing-page .landing-final { min-height:78vh; background:radial-gradient(ellipse at center,#64381933,transparent 65%),#09080d; }
.landing-page .landing-rune-orbit,.landing-page .landing-mystery-runes,.landing-page .landing-final-mark {
    width:clamp(20rem,55vw,46rem); border-color:#d6a45a66;
    box-shadow:0 0 65px #d88d3820,inset 0 0 70px #d88d3815;
}
.landing-page .landing-rune-orbit::before,.landing-page .landing-mystery-runes::before,.landing-page .landing-final-mark::before { border-color:#d6a45a66; }
.landing-page .btn { border-radius:3px; border-color:#c8955388; }
.landing-page .btn-primary { background:linear-gradient(135deg,#783426,#3f1820); box-shadow:0 0 24px #da76202a; }
.landing-page .btn:hover { box-shadow:0 0 35px #e4bf7b44; }
@keyframes lilith-scenery { from { transform:scale(1); } to { transform:scale(1.035); } }
@keyframes lilith-gold-breath { 0%,100% { text-shadow:0 0 24px #d88d3840,0 4px 20px #000; } 50% { text-shadow:0 0 44px #e4bf7b88,0 4px 20px #000; } }
@media(max-width:900px) {
    .landing-page .hero { align-items:flex-end; padding:25rem 1.5rem 4rem; min-height:100svh; }
    .landing-page .hero::before { background-size:auto 100%; background-position:center top; }
    .landing-page .hero-vignette { background:linear-gradient(0deg,#09080dfc 0%,#09080dcb 25%,#09080d33 58%,transparent 80%); }
    .landing-page .hero-content { max-width:100%; width:100%; }
    .landing-page .hero-title { font-size:clamp(5rem,20vw,8rem); }
    .landing-page .hero-subtitle { font-size:1.8rem; }
    .landing-page .hero-desc { max-width:36rem; }
    .landing-page .hero-rune-circle { left:auto; right:-15%; top:12%; width:75vw;height:75vw; }
    .landing-page .landing-lilith { padding-inline:1.5rem; }
}
@media(prefers-reduced-motion:reduce) {
    .landing-page .hero::before,.landing-page .hero-title { animation:none; opacity:1; transform:none; }
}