/* =====================================================================
   Calima 360 · Motor «Motion» (assets/js/motion.js)
   Logo vivo, salpicaduras, firmas por sección, capa reel e inicio de sesión.
   ===================================================================== */

/* ---------- Logo vivo ---------- */
.c360-logo{display:block;width:100%;height:100%;overflow:visible}
.c360-logo .lg-ink{fill:var(--lg-ink,#1a2c22)}
.c360-logo .lg-c-arc{fill:var(--lg-arc,#5e8133)}
.c360-logo .lg-c-sun{fill:var(--lg-sun,#e4a026)}
.c360-logo .lg-rays line{stroke:var(--lg-sun,#e4a026);stroke-width:16;stroke-linecap:round;stroke-dasharray:40 30}
.c360-logo .lg-rays,.c360-logo .lg-comet,.c360-logo .lg-drop,.c360-logo .lg-ring{opacity:0}
.c360-logo .lg-glow{opacity:0}
.c360-logo .lg-comet{fill:#fff8de;filter:drop-shadow(0 0 30px #fff2b0)}
.c360-logo .lg-drop{fill:var(--lg-drop,#2b8cc4)}
.c360-logo .lg-ring{fill:none;stroke:var(--lg-drop,#2b8cc4)}
.c360-logo--mono{--lg-arc:var(--lg-ink);--lg-sun:var(--lg-ink)}
.c360-logo--mono .lg-glow{display:none}

/* Cabecera: el logo real en lugar del icono */
.logo-mark[data-c360-logo]{display:inline-block!important;background:none!important;border-radius:0!important;width:66px!important;height:44px!important;flex:0 0 auto}
.logo-mark[data-c360-logo] img{width:100%;height:100%;object-fit:contain;display:block}
.v2-footer .logo-mark[data-c360-logo]{--lg-ink:#e9f2ec;width:78px!important;height:50px!important}
.v2-footer .logo-mark[data-c360-logo] img{filter:brightness(0) invert(1)}
.v2-auth-logo .logo-mark[data-c360-logo]{width:120px!important;height:78px!important}
.v2-auth-logo{flex-direction:column;align-items:flex-start!important}
@media (max-width:560px){.logo-mark[data-c360-logo]{width:56px!important;height:38px!important}}

/* Intro: logo grande sobre fondo oscuro */
.c360-intro-logo.has-live-logo{width:min(320px,62vw)!important;height:auto!important;aspect-ratio:1960/1265;--lg-ink:#f4efe2;--lg-arc:#8fbf4a;--lg-drop:#7fd0f5}
.c360-intro.is-short .c360-intro-logo.has-live-logo{width:min(220px,50vw)!important}

/* ---------- Salpicaduras ---------- */
.mo-splash{position:fixed;inset:0;width:100%;height:100%;z-index:3990;pointer-events:none}
.mo-rel{position:relative}
.mo-ink{position:absolute;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(160,225,255,.55) 0,rgba(160,225,255,.25) 40%,rgba(160,225,255,0) 70%);transform:scale(0);animation:mo-ink .85s cubic-bezier(.2,.8,.2,1) forwards;z-index:0;mix-blend-mode:screen}
@keyframes mo-ink{to{transform:scale(1);opacity:0}}

/* ---------- Firmas por sección ---------- */
.js-mo .mo-wait{opacity:0}
.mo-amb-host{position:relative;isolation:isolate}
.mo-amb{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0;display:block}
.mo-amb-host>.container,.mo-amb-host>.c4-container,.mo-amb-host>.v2-story-sticky,.mo-amb-host>.v2-podband-inner{position:relative;z-index:1}
.v2-hero .mo-amb{z-index:1}
.v2-hero.mo-amb-host>.container,.v2-hero.mo-amb-host>.c4-container{z-index:2}
.v2-footer .mo-amb{z-index:0}
.mo-text-wait .mo-l{opacity:0}
.mo-typing::after{content:'';display:inline-block;width:.08em;height:.9em;margin-left:.08em;background:currentColor;vertical-align:-.08em;animation:mo-caret .5s steps(1) infinite}
@keyframes mo-caret{50%{opacity:0}}
.mo-w,.mo-l{display:inline-block}
.mo-w{white-space:nowrap}

/* Inclinación por velocidad de scroll (efecto reel) */
.js-mo [data-mo] :is(.v2-place-grid,.v2-cat-grid,.v2-traveler-grid,.v2-plan-grid,.v2-route-grid,.v2-episode-grid,.editorial-cards,.partner-grid,.c360-card-grid,.location-grid,.v2-stats-grid){transition:transform .3s ease-out}

/* Héroes: barras de cine y persianas */
.mo-hero-fx{position:absolute;inset:0;z-index:5;pointer-events:none}
.mo-hero-fx--letterbox i{position:absolute;left:0;right:0;height:50%;background:#061d1e;animation:mo-lb 1.3s cubic-bezier(.77,0,.18,1) .15s forwards}
.mo-hero-fx--letterbox i:first-child{top:0;transform-origin:50% 0}
.mo-hero-fx--letterbox i:nth-child(2){bottom:0;transform-origin:50% 100%}
.mo-hero-fx--letterbox b{position:absolute;top:0;bottom:0;width:30%;left:-30%;background:linear-gradient(100deg,transparent,rgba(255,236,190,.35),transparent);animation:mo-sweep 1.4s cubic-bezier(.6,0,.3,1) .9s forwards}
@keyframes mo-lb{0%{transform:scaleY(1)}60%{transform:scaleY(.12)}100%{transform:scaleY(0)}}
@keyframes mo-sweep{to{left:120%}}
.mo-hero-fx--slats{display:flex}
.mo-hero-fx--slats i{flex:1;background:linear-gradient(180deg,#0f3a3a,#125c8c);transform-origin:50% 0;animation:mo-slat .9s cubic-bezier(.77,0,.18,1) forwards}
.mo-hero-fx--slats i:nth-child(2n){transform-origin:50% 100%}
.mo-hero-fx--slats i:nth-child(1){animation-delay:.05s}.mo-hero-fx--slats i:nth-child(2){animation-delay:.12s}.mo-hero-fx--slats i:nth-child(3){animation-delay:.19s}.mo-hero-fx--slats i:nth-child(4){animation-delay:.26s}.mo-hero-fx--slats i:nth-child(5){animation-delay:.33s}.mo-hero-fx--slats i:nth-child(6){animation-delay:.4s}.mo-hero-fx--slats i:nth-child(7){animation-delay:.47s}
@keyframes mo-slat{to{transform:scaleY(0)}}

/* Cinta cinética (portada) */
.mo-reelband{position:relative;z-index:3;overflow:hidden;background:var(--forest-3,#0a2b2b);color:#fff;padding:14px 0;border-block:1px solid rgba(255,255,255,.08)}
.mo-reelband-track{display:flex;gap:28px;align-items:center;white-space:nowrap;width:max-content;font:800 clamp(22px,3.4vw,42px)/1.1 var(--font-display);letter-spacing:-.01em;text-transform:uppercase}
.mo-reelband-track.is-back{position:absolute;top:50%;left:0;opacity:.08;font-size:clamp(46px,8vw,110px);transform:translateY(-50%)}
.mo-reelband-track span.o{color:transparent;-webkit-text-stroke:1.5px var(--lime,#c9e265)}
.mo-reelband-track svg{width:30px;height:30px;fill:none;stroke:var(--sunset,#e4a026);stroke-width:2.5;stroke-linecap:round;flex:0 0 auto;animation:mo-spin 4s linear infinite}
@keyframes mo-spin{to{rotate:360deg}}

/* Cinta de la revista */
.mo-ticker{position:relative;z-index:1;overflow:hidden;margin:-8px 0 26px;border-block:2px solid currentColor;opacity:.75;font:800 14px/1 var(--font-body);letter-spacing:.24em;text-transform:uppercase}
.mo-ticker-track{display:flex;width:max-content;animation:mo-tick 26s linear infinite}
.mo-ticker-track span{padding:10px 0;white-space:pre}
@keyframes mo-tick{to{transform:translateX(-50%)}}

/* ---------- Inicio de sesión ---------- */
.mo-auth-scene{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;display:block}
.v2-auth .auth-shell{position:relative;perspective:1400px}
.mo-auth-card{position:relative;background:rgba(255,255,255,.95)!important;overflow:visible}
.mo-auth-card::before{content:'';position:absolute;inset:-2px;border-radius:28px;padding:2px;background:conic-gradient(from var(--mo-a,0deg),#5e8133,#e4a026,#2b8cc4,#c9e265,#5e8133);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:mo-ring 6s linear infinite;pointer-events:none}
.mo-auth-card::after{content:'';position:absolute;inset:0;border-radius:26px;pointer-events:none;background:radial-gradient(500px circle at var(--mx,50%) var(--my,0%),rgba(255,255,255,.55),transparent 45%);mix-blend-mode:soft-light}
@property --mo-a{syntax:'<angle>';inherits:false;initial-value:0deg}
@keyframes mo-ring{to{--mo-a:360deg}}
.auth-tabs{position:relative}
.auth-tabs button.active{border-bottom-color:transparent!important}
.mo-tab-ind{position:absolute;bottom:-1px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--sunset,#e4a026),#2b8cc4);pointer-events:none}
.mo-field{position:relative}
.mo-field-wave{position:absolute;left:12px;right:12px;bottom:-4px;width:calc(100% - 24px);height:10px;overflow:hidden;pointer-events:none}
.mo-field-wave path{fill:none;stroke:#2b8cc4;stroke-width:2.4;stroke-linecap:round;stroke-dasharray:260;stroke-dashoffset:260;transition:stroke-dashoffset .6s cubic-bezier(.2,.8,.2,1);animation:mo-wavex 1.4s linear infinite}
.mo-field:focus-within .mo-field-wave path{stroke-dashoffset:0}
@keyframes mo-wavex{to{transform:translateX(-50px)}}
.auth-card input{transition:border-color .25s,box-shadow .25s}
.auth-card input:focus{border-color:#2b8cc4;box-shadow:0 0 0 4px rgba(43,140,196,.16)}
.mo-orbit{position:absolute;left:50%;top:50%;width:0;height:0;z-index:0;pointer-events:none}
.mo-orbit span{position:absolute;left:-22px;top:-22px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:rgba(10,43,43,.35);border:1px solid rgba(255,255,255,.35);animation:mo-orbit 22s linear infinite;animation-delay:calc(var(--i) * -3.66s)}
.mo-orbit svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;animation:mo-orbit-counter 22s linear infinite;animation-delay:calc(var(--i) * -3.66s)}
@keyframes mo-orbit{from{transform:rotate(0) translateX(min(360px,46vw)) rotate(0) scale(1)}50%{transform:rotate(180deg) translateX(min(330px,44vw)) rotate(0) scale(.8)}to{transform:rotate(360deg) translateX(min(360px,46vw)) rotate(0) scale(1)}}
@keyframes mo-orbit-counter{to{transform:rotate(-360deg)}}
.v2-auth .auth-card{z-index:1}
@media (max-width:640px){.mo-orbit{display:none}}

@media (prefers-reduced-motion:reduce){
  .mo-splash,.mo-amb,.mo-hero-fx,.mo-reelband-track.is-back,.mo-auth-scene,.mo-orbit{display:none!important}
  .mo-wait{opacity:1!important}
  .mo-ticker-track,.mo-reelband-track svg,.mo-auth-card::before{animation:none!important}
}
