/* Cartel rasgado, aislado del header, los proyectos y el simulador. */
.tridente-reveal {
    --tear-paper: #f2f0eb;
    --tear-ink: #ba203b;
    --tear-print: #b91f39;
    --tear-stage: calc(100vh - var(--nav-h));
    --tear-travel: 120vh;
    --tear-edge: clamp(44px, 6vw, 96px);
    --tear-seam: var(--project-quote-seam, #07090d);
    position: relative;
    height: calc(var(--tear-stage) + var(--tear-travel));
    background: var(--tear-paper);
    color: #46252d;
    isolation: isolate;
}
/* El negro de ambas secciones entra en el papel por un borde rasgado compartido. */
.tr-reveal-edge {
    position: absolute;
    inset-inline: 0;
    display: block;
    width: 100%;
    height: var(--tear-edge);
    z-index: 2;
    pointer-events: none;
    fill: var(--tear-seam);
}
.tr-reveal-edge-top { top: -1px; transform: rotate(180deg); }
.tr-reveal-edge-bottom { bottom: -1px; }
@supports (height: 100svh) {
    .tridente-reveal { --tear-stage: calc(100svh - var(--nav-h)); --tear-travel: 120svh; }
}
.tr-reveal-stage {
    position: sticky;
    top: var(--nav-h);
    height: var(--tear-stage);
    overflow: hidden;
    background: var(--tear-paper);
}
/* Capas rasterizadas una vez; el movimiento se compone con transform y opacity. */
.tr-reveal-world {
    position: absolute; left: 50%; top: 50%; width: 2172px; height: 1100px;
    transform: translate3d(-50%, -50%, 0); transform-origin: center;
    pointer-events: none;
}
.tr-reveal-world img { display: block; max-width: none; }
.tr-storm { position: absolute; left: 0; top: 190px; width: 2172px; height: 724px; }
.tr-storm-bleed { position: absolute; inset: 0; transform-origin: 0 0; }
.tr-storm-base { width: 2172px; height: 724px; }
.tr-lightning-reveal { position: absolute; inset: 0; opacity: 0; }
.tr-bolt-window, .tr-lightning-flare { position: absolute; }
.tr-bolt-window { overflow: hidden; }
.tr-bolt-ink {
    position: absolute; inset: 0;
    background-image: var(--bolt-atlas); background-repeat: no-repeat; background-size: 2048px 2495px;
}
.tr-lightning-flare {
    background-image: var(--bolt-atlas); background-repeat: no-repeat; background-size: 2048px 2495px;
}
.tr-bolt-window[data-active="false"], .tr-lightning-flare[data-active="false"] { visibility: hidden; }
.tr-reveal-trident { position: absolute; left: 856px; top: 0; width: 460px; height: 690px; opacity: 0; z-index: 1; }
.tr-reveal-trident img { width: 100%; height: 100%; }
.tr-storm-base, .tr-reveal-trident img, .tr-lightning-reveal { visibility: hidden; }
.tridente-reveal.is-art-ready :is(.tr-storm-base, .tr-reveal-trident img, .tr-lightning-reveal) { visibility: visible; }
.tr-paper-layer, .tr-reveal-crack { position: absolute; display: block; max-width: none; overflow: hidden; }
.tr-paper-half { z-index: 2; }
.tr-paper-whole { z-index: 3; }
.tr-reveal-crack { z-index: 4; }
.tridente-reveal.is-visible .tr-paper-half { will-change: transform; }
.tridente-reveal.is-visible .tr-reveal-trident { will-change: transform, opacity; }

.tr-paper-grain { fill: #643b38; stroke: #643b38; stroke-width: 0.6; opacity: 0.045; }
.tr-paper-print { color: var(--tear-print); pointer-events: none; }
.tr-paper-print-contour { fill: none; stroke: currentColor; stroke-width: 1.5; opacity: 0.14; }
.tr-paper-caption-rules { fill: none; stroke: var(--tear-print); stroke-width: 1.6; opacity: 0.45; }
.tr-reveal-tagline { fill: #62383e; font-family: var(--font-main); font-size: 22px; font-weight: 600; letter-spacing: 5px; }
.tr-reveal-word { font-family: var(--font-main); font-size: 340px; font-weight: 800; letter-spacing: -10px; }
.tr-reveal-crack path { stroke-dasharray: 1; stroke-dashoffset: 1; }

/* Canales independientes del PNG, con entradas rápidas y ramificaciones sucesivas. */
.tr-lightning-flare {
    opacity: 0;
    animation: tr-bolt-afterglow var(--bolt-period) linear var(--bolt-phase) infinite;
    animation-play-state: paused;
}
.tridente-reveal.is-visible .tr-lightning-flare[data-active="true"] { animation-play-state: running; }
@keyframes tr-bolt-afterglow {
    0%, 74%, 84%, 100% { opacity: 0; }
    77% { opacity: 0.28; }
    80% { opacity: 0.05; }
    81% { opacity: 0.16; }
}
@keyframes tr-bolt-afterglow-soft {
    0%, 68%, 100% { opacity: 0; }
    82% { opacity: 0.075; }
}

.tr-reveal-hint {
    position: absolute;
    inset: auto 24px calc(var(--tear-edge) + 24px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    pointer-events: none;
}
.tr-reveal-hint span { font-size: 20px; line-height: 1; }
@media (max-width: 600px) {
    .tr-reveal-tagline { font-size: 24px; letter-spacing: 3px; }
}
@media (max-height: 540px) {
    .tr-reveal-hint { bottom: 20px; gap: 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .tr-lightning-flare {
        animation-name: tr-bolt-afterglow-soft;
        animation-duration: calc(var(--bolt-period) + 4s);
    }
}