/* A warm cinematic layer: motion follows the visitor, content stays readable. */
.cinema-progress { position: fixed; inset: 0 auto auto 0; width: 100%; height: 3px; z-index: 1100; background: linear-gradient(90deg, #0096d2, #66dfe4 55%, #faaa00); transform: scaleX(var(--reading-progress, 0)); transform-origin: left; pointer-events: none; }
.cinema-sparks { position: absolute; inset: 0; overflow: hidden; z-index: 1; pointer-events: none; }
.cinema-sparks i { position: absolute; left: var(--spark-x); top: var(--spark-y); width: 4px; height: 4px; border-radius: 50%; background: #ffe8a0; box-shadow: 0 0 14px 3px #ffc45a66; opacity: 0; }
.landing-page .brand-hero .hero-photo { transform: translateY(var(--cinema-pan, 0px)) scale(1.08); }
.landing-page .brand-hero::after { background: linear-gradient(100deg, #00141edb 0%, #00141e88 55%, #00141e35); }
.landing-page .hero-title-accent { text-shadow: 0 2px 30px #faaa0033; }
.cinema-heading { position: relative; }
.cinema-heading::after { content: ''; display: block; position: absolute; left: 0; bottom: -14px; width: 64px; height: 3px; border-radius: 4px; background: linear-gradient(90deg, #0096d2, #faaa00); transform-origin: left; }
.cinema-card { --tilt-x: 0deg; --tilt-y: 0deg; }
.location-photo { overflow: hidden; border-radius: 8px; }
.cinema-scroll-cue { display: flex; align-items: center; gap: 12px; width: fit-content; margin-top: 28px; color: #fff; font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.cinema-scroll-cue span { display: grid; place-items: center; width: 26px; height: 38px; border: 1px solid #ffffff70; border-radius: 18px; }
.cinema-scroll-cue span::after { content: ''; width: 3px; height: 8px; border-radius: 4px; background: #faaa00; }
@media (prefers-reduced-motion: no-preference) {
    .cinema-sparks i { animation: cinema-spark 4.5s ease-out var(--spark-delay) both; }
    .landing-page .brand-hero .hero-photo { animation: cinema-camera 1.8s cubic-bezier(.16,1,.3,1) both; }
    .cinema-scroll-cue span::after { animation: cinema-scroll 1.4s ease-in-out 3; }
    .cinema-heading.is-entered::after { animation: cinema-line .95s cubic-bezier(.16,1,.3,1) both; }
    .cinema-card { transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s ease; }
    .service-item img, .operation-gallery-grid img, .about-original-feature img, .location-photo img, .fleet-portrait img { transition: transform .8s cubic-bezier(.16,1,.3,1); }
    .hero-actions .btn { position: relative; overflow: hidden; }
    .hero-actions .btn::after { content: ''; position: absolute; inset: -70% auto -70% -60%; width: 30%; background: linear-gradient(90deg, transparent, #ffffff66, transparent); transform: rotate(25deg); pointer-events: none; }
    .hero-actions .btn:hover::after { animation: cinema-shine .85s ease-out; }
}
@media (hover: hover) and (pointer: fine) and (prefers-reduced-motion: no-preference) {
    .cinema-card:hover { transform: perspective(1000px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) translateY(-7px); box-shadow: 0 20px 46px #092f421c; }
    .service-item:hover img, .operation-gallery-grid a:hover img, .location-photo:hover img { transform: scale(1.045); }
}
@keyframes cinema-camera { from { transform: scale(1.16);  } to { transform: translateY(var(--cinema-pan, 0px)) scale(1.08); } }
@keyframes cinema-spark { 0%, 100% { opacity: 0; transform: translate3d(0,20px,0) scale(.3); } 22%, 65% { opacity: .65; } 90% { transform: translate3d(26px,-80px,0) scale(1); } }
@keyframes cinema-line { from { transform: scaleX(0); opacity: 0; } to { transform: scaleX(1); opacity: 1; } }
@keyframes cinema-scroll { 0%,100% { transform: translateY(-4px); opacity: .4; } 50% { transform: translateY(5px); opacity: 1; } }
@keyframes cinema-shine { to { left: 150%; } }
@media (prefers-reduced-motion: reduce) {
    .cinema-sparks, .cinema-progress { display: none; }
    .landing-page .brand-hero .hero-photo { transform: none; }
    .cinema-scroll-cue span::after { animation: none; }
}

#servicios .cinema-heading::after { left: calc(50% - 32px); }

/* Visible entrances without fading a decoded photograph out and back in. */
@media (prefers-reduced-motion: no-preference) {
    .operation-gallery-grid a, .about-original-feature, .fleet-portrait { overflow: hidden; border-radius: 8px; }
    .cinema-heading.is-entered::after { animation-duration: 1.2s; }
    .hero-title-accent { animation-duration: 1.2s !important; }
}

/* Scroll scenes: each chapter has its own light, depth and moving route. */
.cinema-scene { position: relative; isolation: isolate; }
.cinema-scene-art { position: absolute; inset: 0; overflow: hidden; z-index: -1; pointer-events: none; }
.cinema-scene-number { position: absolute; top: 8px; right: 4%; font-size: clamp(120px, 19vw, 260px); line-height: 1; font-weight: 700; letter-spacing: -.08em; color: #0096d20b; }
.cinema-scene-light { position: absolute; top: 12%; right: -140px; width: min(650px, 85vw); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, #faaa001a, #0096d20d 42%, transparent 70%); }
.cinema-route { position: absolute; top: 20px; right: 2%; width: min(480px, 70%); height: auto; overflow: visible; color: #0096d2; opacity: .35; }
.cinema-route-base { fill: none; stroke: currentColor; stroke-width: 1; stroke-dasharray: 3 7; opacity: .3; }
.cinema-route-line { fill: none; stroke: url(#cinema-route-gradient); stroke-width: 2; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: calc(1 - var(--scene-progress, 0)); }
.cinema-route-point { fill: #faaa00; stroke: #fff; stroke-width: 2; }
.cinema-chapters { position: fixed; left: 15px; top: 50%; transform: translateY(-50%); z-index: 1020; display: flex; flex-direction: column; gap: 18px; }
.cinema-chapters a { display: flex; align-items: center; gap: 9px; width: fit-content; min-height: 24px; color: #446270; font-size: 10px; text-decoration: none; }
.cinema-chapters a::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #7295a7; transition: transform .35s, background-color .35s; }
.cinema-chapters a[aria-current="location"]::before { transform: scale(1.7); background: #faaa00; box-shadow: 0 0 0 5px #faaa001c; }
.cinema-chapters span { opacity: 0; transform: translateX(-5px); transition: opacity .25s, transform .25s; padding: 3px 7px; border-radius: 5px; background: #fffffff2; }
.cinema-chapters a:is(:hover,:focus-visible) span { opacity: 1; transform: none; }
.cinema-chapters a:focus-visible { outline: 2px solid #0096d2; outline-offset: 5px; }
.cinema-chapters.is-over-hero { opacity: 0; pointer-events: none; }
.cinema-depth { overflow: hidden; }
.cinema-hero-orbit { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.cinema-hero-orbit svg { position: absolute; right: -2%; top: 12%; width: 54%; height: 80%; opacity: .6; }
.cinema-hero-orbit path { fill: none; stroke: #fbd889; stroke-width: 1; stroke-dasharray: 900; stroke-dashoffset: 900; }
.cinema-hero-orbit circle { fill: #fff1b5; opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
    .cinema-scene-number { translate: 0 var(--chapter-drift, 0px); }
    .cinema-scene-light { translate: 0 var(--light-drift, 0px); }
    .cinema-depth > img, .cinema-depth > a > img { scale: 1.045; translate: 0 var(--photo-drift, 0px); }
    .cinema-hero-orbit path { animation: cinema-orbit-draw 2.6s .3s cubic-bezier(.22,1,.36,1) both; }
    .cinema-hero-orbit circle { offset-path: path('M 15 410 C 360 410 455 80 220 38 C 110 18 42 130 150 172'); animation: cinema-comet 3s .3s cubic-bezier(.22,1,.36,1) both; }
    .cinema-scene.is-scene-entered .cinema-route { animation: cinema-route-arrive 1.1s ease-out both; }
    .security-features article { transition: translate .35s, background-color .35s, box-shadow .35s; }
    .security-features article:hover { translate: 0 -6px; box-shadow: 0 16px 40px #092f4215; }
}
@keyframes cinema-orbit-draw { 0% { stroke-dashoffset: 900; opacity: 0; } 18% { opacity: .7; } 100% { stroke-dashoffset: 0; opacity: .28; } }
@keyframes cinema-comet { 0% { offset-distance: 0%; opacity: 0; } 12%, 85% { opacity: 1; } 100% { offset-distance: 100%; opacity: 0; } }
@keyframes cinema-route-arrive { from { opacity: 0; } to { opacity: .35; } }
@media (max-width: 1399.98px) { .cinema-chapters { display: none; } }
@media (max-width: 767.98px) {
    .cinema-scene-number { font-size: 130px; top: 10px; right: 12px; }
    .cinema-route { width: 70%; top: 0; opacity: .22; }
    .cinema-hero-orbit svg { width: 90%; right: -25%; top: 5%; }
}
@media (prefers-reduced-motion: reduce) {
    .cinema-hero-orbit, .cinema-scene-art { display: none; }
    .cinema-depth > img, .cinema-depth > a > img { scale: 1; translate: none; }
    .cinema-chapters a::before, .cinema-chapters span { transition: none; }
}

/* The fleet chapter changes the lighting like a new scene in the story. */
.landing-page .fleet-band { background: #071f30; color: #c9dce7; }
.landing-page .fleet-band h2, .landing-page .fleet-band h3 { color: #fff; }
.landing-page .fleet-band .section-kicker { color: #75d9ef; }
.landing-page .fleet-band .fleet-stats strong { color: #ffd074; text-shadow: 0 0 32px #faaa0022; }
.landing-page .fleet-band .fleet-stats article { border-color: #ffffff26; }
.landing-page .fleet-band .cinema-scene-number { color: #ffffff09; }
.landing-page .fleet-band .cinema-scene-light { background: radial-gradient(circle, #0096d233, #faaa0010 45%, transparent 70%); }
.landing-page .fleet-band .fleet-portrait { border: 1px solid #ffffff26; box-shadow: 0 24px 70px #00000038; }
.landing-page .fleet-band .environmental-note { color: #c9dce7; border-color: #ffffff26; }
.landing-page .fleet-band .environmental-note a { color: #89d8ef; }
@media (min-width: 1400px) { .cinema-chapters { left: 10px; } }

/* An entry begins off-screen, never by moving an already visible final frame. */
@media (prefers-reduced-motion: no-preference) {
    .motion-wait { opacity: 0; transform: translate3d(0, 30px, 0); transition: none; }
}
@media (prefers-reduced-motion: reduce) {
    .motion-wait { opacity: 1; transform: none; }
}