/* =========================================================
   ROLL UP · Premium theme — negro + azul
   Pégalo AL FINAL de tu <style> (o como último CSS cargado)
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --bg:#05070c; --bg2:#090d16; --surface:#0d121d; --surface2:#111827;
  --line:rgba(148,180,255,.10); --line2:rgba(148,180,255,.22);
  --blue:#3b82f6; --blue2:#1d4ed8; --ice:#9cc3ff; --glow:rgba(59,130,246,.35);
  --text:#eef2fa; --muted:#8b97ad;
  /* remapeo de tus variables viejas */
  --navy:var(--bg); --navy2:var(--bg2); --card:var(--surface);
  --orange:#3b82f6; --orange2:#1d4ed8; --purple:#3b82f6; --purple2:#1e40af;
  --ink:var(--text); --ink-muted:var(--muted);
}
html{background:var(--bg)}
body{background:var(--bg)!important;color:var(--text);font-family:Inter,system-ui,sans-serif;letter-spacing:-.005em}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
::selection{background:var(--blue);color:#fff}

/* Tipografía */
h1,h2,.form-card h2,.hire h2,.artist-top h3,.event-hero h3{font-family:Fraunces,Georgia,serif!important;font-weight:500!important;letter-spacing:-.025em!important}
h1{font-size:clamp(44px,7.5vw,88px)!important;line-height:1!important;
  background:linear-gradient(180deg,#fff 30%,#9cc3ff 120%);-webkit-background-clip:text;background-clip:text;color:transparent!important}
h2{font-size:clamp(32px,4.6vw,54px)!important;color:#fff!important}
h3,h4{color:#fff!important;font-weight:600;letter-spacing:-.01em}
.lead,.sub,p{color:var(--muted)!important}
section{padding:120px 0!important;position:relative}

/* Pills → etiqueta fina tipo "eyebrow" */
.pill,.pill-orange,.pill-purple{background:rgba(59,130,246,.08)!important;color:var(--ice)!important;
  border:1px solid var(--line2);font-size:12px!important;font-weight:600!important;letter-spacing:.14em;text-transform:uppercase;padding:8px 16px!important}
.pill svg{width:14px;height:14px}

/* Botones */
.btn{border-radius:999px!important;font-weight:600!important;font-size:15px!important;padding:14px 26px!important;transition:all .25s ease!important}
.btn-purple,.btn-orange,.btn-blue{background:linear-gradient(180deg,#4b8dff,#1d4ed8)!important;color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 30px -8px var(--glow)!important;border:1px solid rgba(156,195,255,.35)!important}
.btn-purple:hover,.btn-orange:hover,.btn-blue:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 40px -6px rgba(59,130,246,.6)!important}
.btn-ghost{background:transparent!important;border:1px solid var(--line2)!important;color:var(--text)!important}
.btn-ghost:hover{border-color:var(--ice)!important;background:rgba(156,195,255,.06)!important}

/* Header */
header{background:rgba(5,7,12,.72)!important;backdrop-filter:saturate(160%) blur(18px);-webkit-backdrop-filter:saturate(160%) blur(18px);
  border-bottom:1px solid var(--line)!important;box-shadow:none!important}
.brand b{color:#fff!important;font-family:Fraunces,serif;font-weight:600;font-size:19px}
.brand small{color:var(--muted)!important;letter-spacing:.12em;text-transform:uppercase;font-size:10px}
.logo{background:linear-gradient(145deg,#4b8dff,#1d4ed8)!important;box-shadow:0 0 0 1px rgba(156,195,255,.3),0 8px 24px -6px var(--glow)!important}
.links{background:rgba(255,255,255,.03)!important;border:1px solid var(--line)!important;box-shadow:none!important}
.links a{color:#c9d3e6!important;font-weight:500}
.links a:hover{color:#fff!important;background:rgba(59,130,246,.12)!important}

/* Hero */
.hero{background:radial-gradient(900px 520px at 50% -10%,rgba(37,99,235,.28),transparent 70%),
  radial-gradient(600px 400px at 85% 30%,rgba(29,78,216,.12),transparent 70%),var(--bg)!important}
.hero-media{border-radius:24px!important;overflow:hidden;border:1px solid var(--line2);box-shadow:0 40px 120px -30px rgba(37,99,235,.45)!important}
.hero-media img{filter:saturate(.85) contrast(1.05)}
.stat{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))!important;border:1px solid var(--line)!important;border-radius:20px!important}
.stat strong{font-family:Fraunces,serif;font-weight:500;color:#fff!important;font-size:42px!important}
.stat h4,.stat h4 svg{color:var(--ice)!important}

/* Secciones: fondos negros con un glow azul sutil */
.capture,.mapsec,.diag{background:radial-gradient(800px 400px at 50% 0%,rgba(37,99,235,.13),transparent 70%),var(--bg)!important;border-top:1px solid var(--line)}
#artists{background:var(--bg2)!important;border-top:1px solid var(--line)}
.hire{background:radial-gradient(900px 500px at 50% 0%,rgba(37,99,235,.15),transparent 70%),var(--bg2)!important;color:var(--text)!important;border-top:1px solid var(--line)}
.hire .lead,.hire p{color:var(--muted)!important}

/* Tarjetas */
.cap-card,.story,.perform,.map-box,.form-card,.hire .form-card,.occ div,.artist{
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012))!important;
  border:1px solid var(--line)!important;border-radius:24px!important;box-shadow:0 1px 0 rgba(255,255,255,.04) inset,0 30px 60px -30px rgba(0,0,0,.8)!important;color:var(--text)!important}
.artist{background:var(--surface)!important}
.cap-card,.occ div{transition:border-color .3s,transform .3s}
.cap-card:hover,.occ div:hover{border-color:var(--line2)!important;transform:translateY(-3px)}
.cap-card .ic,.story .ic,.occ .ic{background:rgba(59,130,246,.12)!important;color:var(--ice)!important;border:1px solid var(--line2)}
.verified{background:rgba(59,130,246,.18)!important;color:var(--ice)!important;border:1px solid var(--line2)}
.artist-top::after{background:linear-gradient(180deg,transparent 30%,var(--surface) 100%)!important}
.astats b{font-family:Fraunces,serif;color:#fff!important}
.work .tag{background:rgba(5,7,12,.7)!important;color:var(--ice)!important;backdrop-filter:blur(6px);border:1px solid var(--line2)}
.work figure{border-radius:16px!important;border:1px solid var(--line)}
.nav-arrow{background:rgba(5,7,12,.8)!important;color:#fff!important;border:1px solid var(--line2)!important}
.dots button{background:rgba(255,255,255,.08)!important;color:var(--muted)!important;border:1px solid var(--line)!important}
.dots button.on{background:var(--blue)!important;color:#fff!important;border-color:var(--blue)!important}
.event-hero{border-radius:24px!important;overflow:hidden;border:1px solid var(--line2)}
.event-hero div{background:linear-gradient(90deg,rgba(5,7,12,.92),rgba(5,7,12,.35))!important}
.questions{background:linear-gradient(135deg,#0b1a3a,#1d4ed8)!important;border:1px solid rgba(156,195,255,.3);border-radius:24px!important}
.questions p,.questions h3{color:#fff!important}
.map-title{background:rgba(59,130,246,.08)!important;color:#fff!important;border:1px solid var(--line2)!important;box-shadow:none!important;font-family:Fraunces,serif}
.map-title svg{color:var(--ice)!important}

/* Formularios */
label{color:#c9d3e6!important;font-size:13px!important;font-weight:500!important;letter-spacing:.02em}
input,select,textarea,.hire input,.hire select,.hire textarea{background:rgba(255,255,255,.03)!important;color:var(--text)!important;
  border:1px solid var(--line2)!important;border-radius:12px!important}
input::placeholder,textarea::placeholder{color:#5f6b82!important}
input:focus,select:focus,textarea:focus{outline:none!important;border-color:var(--blue)!important;box-shadow:0 0 0 4px rgba(59,130,246,.18)!important}
select option{background:var(--surface);color:var(--text)}

/* Mapa */
.filters button{background:transparent!important;color:#c9d3e6!important;border:1px solid var(--line2)!important;border-radius:999px!important}
.filters button:hover{border-color:var(--ice)!important}
.filters button.on{background:var(--blue)!important;color:#fff!important;border-color:var(--blue)!important;box-shadow:0 6px 20px -6px var(--glow)}
#cmap{background:#05070c!important;border-radius:20px!important;border:1px solid var(--line)}
#cmap .leaflet-tile-pane{filter:grayscale(1) invert(1) brightness(.7) contrast(1.2) sepia(.3) hue-rotate(180deg) saturate(1.6)!important}
#cmap .leaflet-popup-content-wrapper,#cmap .leaflet-popup-tip,.cm-legend,#cmap .leaflet-bar a{background:rgba(9,13,22,.92)!important;border-color:var(--line2)!important;color:var(--text)!important}
#cmap .leaflet-bar a:hover{background:var(--blue)!important}
#cmap .leaflet-control-attribution{background:rgba(5,7,12,.7)!important;color:var(--muted)!important}

/* Footer */
footer{background:#030408!important;color:var(--muted)!important;border-top:1px solid var(--line)}
footer h5{color:#fff!important;letter-spacing:.14em;text-transform:uppercase;font-size:12px!important}
footer li,footer li a{color:var(--muted)!important}
footer li a:hover{color:var(--ice)!important}
.copy{border-top:1px solid var(--line)!important;color:#5f6b82!important}
.copy nav a{color:var(--muted)!important}

/* Animación de entrada sutil */
@media (prefers-reduced-motion:no-preference){
  .cap-card,.story,.stat,.artist,.form-card,.occ div,.map-box{animation:ru-in .8s cubic-bezier(.2,.7,.2,1) both}
  @keyframes ru-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}

/* =========================================================
   HEADER PREMIUM (v2)
   ========================================================= */
header.ru-h{position:sticky;top:0;z-index:1000;background:transparent!important;border-bottom:1px solid transparent!important;
  backdrop-filter:none;transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease}
header.ru-h.scrolled{background:rgba(5,7,12,.78)!important;border-bottom-color:var(--line)!important;
  backdrop-filter:saturate(160%) blur(20px);-webkit-backdrop-filter:saturate(160%) blur(20px)}
header.ru-h .nav{max-width:1200px;margin:0 auto;height:76px;padding:0 28px;display:flex;align-items:center;gap:28px;transition:height .35s ease}
header.ru-h.scrolled .nav{height:64px}

/* Marca */
header.ru-h .brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.ru-mark{width:42px;height:42px;display:block;filter:drop-shadow(0 6px 18px rgba(59,130,246,.35));transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.ru-mark svg{width:100%;height:100%;display:block}
header.ru-h .brand:hover .ru-mark{transform:rotate(-8deg) scale(1.04)}
.ru-word{display:flex;flex-direction:column;line-height:1}
.ru-word b{font-family:Fraunces,Georgia,serif;font-weight:500;font-size:21px;letter-spacing:-.02em;color:#fff}
.ru-word small{margin-top:5px;font:600 9.5px/1 Inter,system-ui,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* Links: texto limpio con indicador */
header.ru-h .links{display:flex;align-items:center;gap:2px;margin:0 auto;padding:0!important;background:none!important;border:0!important;box-shadow:none!important}
header.ru-h .links a{position:relative;padding:10px 14px!important;border-radius:999px;background:none!important;
  font:500 14px/1 Inter,system-ui,sans-serif;letter-spacing:.005em;color:#aeb9cc!important;text-decoration:none;transition:color .2s}
header.ru-h .links a svg{display:none}
header.ru-h .links a::after{content:"";position:absolute;left:50%;bottom:2px;width:4px;height:4px;border-radius:50%;background:var(--blue);
  transform:translateX(-50%) scale(0);transition:transform .25s ease}
header.ru-h .links a:hover{color:#fff!important}
header.ru-h .links a.active{color:#fff!important}
header.ru-h .links a.active::after{transform:translateX(-50%) scale(1);box-shadow:0 0 10px var(--blue)}
header.ru-h .links .ru-cta-m{display:none}

/* Acciones */
.ru-actions{display:flex;align-items:center;gap:10px;flex:none}
.ru-cta{display:inline-flex;align-items:center;gap:8px;height:42px;padding:0 20px;border-radius:999px;text-decoration:none;
  font:600 14px/1 Inter,system-ui,sans-serif;color:#fff;background:linear-gradient(180deg,#4b8dff,#1d4ed8);
  border:1px solid rgba(156,195,255,.4);box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 10px 28px -10px rgba(59,130,246,.8);transition:all .25s}
.ru-cta span{transition:transform .25s}
.ru-cta:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 14px 36px -8px rgba(59,130,246,.9)}
.ru-cta:hover span{transform:translateX(3px)}
.ru-actions #ru-auth{margin:0!important}
.ru-actions #ru-login{height:42px;padding:0 18px!important;font-size:14px!important;border-color:var(--line2)!important;color:#dfe7f5!important}
.ru-actions #ru-login:hover{border-color:var(--ice)!important;color:#fff!important}
.ru-actions .ru-av{width:40px!important;height:40px!important;box-shadow:0 0 0 2px var(--bg),0 0 0 3px rgba(156,195,255,.35)}

/* Botón de menú (móvil) */
header.ru-h .menu-btn{display:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line2);background:rgba(255,255,255,.03);
  cursor:pointer;position:relative;flex:none}
header.ru-h .menu-btn span{position:absolute;left:13px;right:13px;height:1.5px;background:#fff;border-radius:2px;transition:transform .3s,top .3s}
header.ru-h .menu-btn span:first-child{top:17px}header.ru-h .menu-btn span:last-child{top:25px}
header.ru-h.open .menu-btn span:first-child{top:21px;transform:rotate(45deg)}
header.ru-h.open .menu-btn span:last-child{top:21px;transform:rotate(-45deg)}

@media (max-width:1020px){
  header.ru-h .nav{gap:14px;padding:0 18px}
  header.ru-h .menu-btn{display:block}
  header.ru-h .ru-cta{display:none}
  header.ru-h .links{position:fixed;left:12px;right:12px;top:72px;margin:0;flex-direction:column;align-items:stretch;gap:2px;
    padding:10px!important;border-radius:22px!important;background:rgba(9,13,22,.97)!important;border:1px solid var(--line2)!important;
    box-shadow:0 30px 60px rgba(0,0,0,.6)!important;backdrop-filter:blur(20px);
    opacity:0;transform:translateY(-8px);pointer-events:none;transition:opacity .25s,transform .25s}
  header.ru-h.open .links{opacity:1;transform:none;pointer-events:auto}
  header.ru-h .links a{padding:16px 18px!important;font-size:16px;border-radius:14px}
  header.ru-h .links a.active{background:rgba(59,130,246,.12)!important}
  header.ru-h .links a::after{left:auto;right:18px;top:50%;bottom:auto;transform:translateY(-50%) scale(0)}
  header.ru-h .links a.active::after{transform:translateY(-50%) scale(1)}
  header.ru-h .links .ru-cta-m{display:block;margin-top:8px;text-align:center;color:#fff!important;font-weight:600;
    background:linear-gradient(180deg,#4b8dff,#1d4ed8)!important;border:1px solid rgba(156,195,255,.4)}
  header.ru-h .links .ru-cta-m::after{display:none}
  .ru-actions{margin-left:auto}
}
@media (max-width:420px){.ru-word small{display:none}.ru-mark{width:38px;height:38px}}

/* ---------- Logo: van con botón de play interactivo ---------- */
.ru-mark.ru-van{width:64px;height:40px;filter:drop-shadow(0 6px 16px rgba(59,130,246,.35));transform:none!important;overflow:visible}
.ru-van svg{overflow:visible}
.ru-van .wheel{transform-box:fill-box;transform-origin:center}
.ru-van .body{transform-box:fill-box;transform-origin:center bottom}
.ru-van .glow{filter:blur(4px);animation:ru-van-glow 2.6s ease-in-out infinite}
@keyframes ru-van-glow{50%{opacity:.8}}
.ru-van .screen,.ru-van .tri,.ru-van .glow{transform-box:fill-box;transform-origin:center;transition:transform .3s cubic-bezier(.2,.7,.2,1),filter .3s}
.ru-van .speed line{stroke-dasharray:7;stroke-dashoffset:7;opacity:0;transition:opacity .25s}
.ru-van .shadow{transform-box:fill-box;transform-origin:center;transition:transform .3s}
header.ru-h .brand:hover .ru-van .wheel{animation:ru-van-spin .55s linear infinite}
header.ru-h .brand:hover .ru-van .body{animation:ru-van-bob .28s ease-in-out infinite alternate}
header.ru-h .brand:hover .ru-van .speed line{opacity:1;animation:ru-van-speed .5s linear infinite}
header.ru-h .brand:hover .ru-van .speed line:nth-child(2){animation-delay:.15s}
header.ru-h .brand:hover .ru-van .speed line:nth-child(3){animation-delay:.3s}
header.ru-h .brand:hover .ru-van .screen{filter:brightness(1.25)}
header.ru-h .brand:hover .ru-van .glow{opacity:.9!important}
header.ru-h .brand:hover .ru-van .tri{transform:scale(1.2) translateX(.4px)}
header.ru-h .brand:hover .ru-van .shadow{transform:scaleX(.9)}
.ru-van.go svg{animation:ru-van-drive 1.1s cubic-bezier(.6,0,.3,1)}
.ru-van.go .wheel{animation:ru-van-spin .35s linear infinite!important}
@keyframes ru-van-spin{to{transform:rotate(360deg)}}
@keyframes ru-van-bob{from{transform:translateY(0)}to{transform:translateY(-1.2px)}}
@keyframes ru-van-speed{from{stroke-dashoffset:7}to{stroke-dashoffset:-7}}
@keyframes ru-van-pulse{0%{transform:scale(1);opacity:.8}80%,100%{transform:scale(1.7);opacity:0}}
@keyframes ru-van-drive{0%{transform:none}35%{transform:translateX(70px);opacity:0}36%{transform:translateX(-70px);opacity:0}70%{opacity:1}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.ru-van *{animation:none!important}}
@media (max-width:420px){.ru-mark.ru-van{width:54px;height:35px}}

/* ---------- Hero con la foto de la van ---------- */
.hero-media img{width:100%;aspect-ratio:16/9;object-fit:cover;object-position:center 40%}

/* ---------- Hero: mosaico rotativo ---------- */
.hero-media.ru-mosaic{display:grid;grid-template-columns:1.9fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:10px;height:clamp(360px,46vw,540px);
  padding:10px;border-radius:28px!important;background:rgba(255,255,255,.02);border:1px solid var(--line2);overflow:hidden;
  box-shadow:0 40px 120px -30px rgba(37,99,235,.45)!important}
.ru-tile{position:relative;overflow:hidden;border-radius:18px;background:#0b1020;isolation:isolate;cursor:zoom-in}
.ru-tile:first-child{grid-row:span 2}
.ru-tile img{--z:1;position:absolute;inset:0;width:100%;height:100%!important;object-fit:cover;opacity:0;transform:scale(calc(var(--z) * 1.08));
  transition:opacity 1.2s ease,transform 6s ease-out;filter:saturate(.95) contrast(1.05)!important;aspect-ratio:auto!important}
.ru-tile img.on{opacity:1;transform:scale(var(--z))}
.ru-tile:first-child img.on{animation:ru-kb 14s ease-in-out infinite alternate}
@keyframes ru-kb{from{transform:scale(var(--z))}to{transform:scale(calc(var(--z) * 1.12)) translate(-1.5%,-1%)}}
.ru-tile::after{content:"";position:absolute;inset:0;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(156,195,255,.12);
  background:linear-gradient(180deg,transparent 60%,rgba(5,7,12,.55));pointer-events:none;z-index:2}
.ru-tile:hover img.on{filter:saturate(1.1) contrast(1.08)!important}
.ru-live{position:absolute;left:16px;bottom:16px;z-index:3;display:flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;
  background:rgba(5,7,12,.6);backdrop-filter:blur(8px);border:1px solid var(--line2);font:600 11px/1 Inter,sans-serif;letter-spacing:.14em;color:#fff;text-transform:uppercase}
.ru-live i{width:7px;height:7px;border-radius:50%;background:#ef4444;box-shadow:0 0 0 0 rgba(239,68,68,.6);animation:ru-live 1.6s infinite}
@keyframes ru-live{70%{box-shadow:0 0 0 8px rgba(239,68,68,0)}100%{box-shadow:0 0 0 0 rgba(239,68,68,0)}}
.ru-dots{position:absolute;right:16px;bottom:18px;z-index:3;display:flex;gap:6px}
.ru-dots b{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);transition:all .4s}
.ru-dots b.on{width:18px;border-radius:6px;background:#fff}
/* Lightbox */
.ru-lb{position:fixed;inset:0;z-index:4000;background:rgba(2,4,8,.92);backdrop-filter:blur(10px);display:grid;place-items:center;opacity:0;transition:opacity .3s;cursor:zoom-out}
.ru-lb.in{opacity:1}.ru-lb img{max-width:94vw;max-height:88vh;border-radius:18px;box-shadow:0 30px 80px rgba(0,0,0,.6)}
@media (max-width:760px){
  .hero-media.ru-mosaic{grid-template-columns:1fr 1fr;grid-template-rows:2fr 1fr;height:clamp(360px,110vw,520px);gap:8px;padding:8px;border-radius:22px!important}
  .ru-tile:first-child{grid-column:span 2;grid-row:auto}
  .ru-tile:nth-child(n+4){display:none}
}
@media (prefers-reduced-motion:reduce){.ru-tile img{transition:opacity .4s!important;animation:none!important;transform:none!important}}

/* ---------- Hero: texto legible + propósito ---------- */
.ru-hero-copy{max-width:860px;margin:0 auto 36px;text-align:center}
.ru-eyebrow{display:inline-flex;align-items:center;gap:10px;padding:8px 16px;border-radius:999px;border:1px solid var(--line2);
  background:rgba(59,130,246,.08);font:600 12px/1 Inter,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:var(--ice)}
.ru-eyebrow i{width:7px;height:7px;border-radius:50%;background:#3b82f6;box-shadow:0 0 10px #3b82f6}
h1.ru-hero-title{margin:22px 0 20px!important;font-size:clamp(42px,6.6vw,84px)!important;line-height:1.02!important;
  color:#fff!important;background:none!important;-webkit-background-clip:initial!important;background-clip:initial!important;
  text-shadow:0 2px 30px rgba(59,130,246,.25)}
.ru-hero-lead{font-size:clamp(16px,1.7vw,19.5px)!important;line-height:1.65!important;color:#c9d3e6!important;max-width:720px;margin:0 auto}
.ru-hero-lead strong{color:#fff;font-weight:600}
.ru-hero-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.ru-hero-cta .ru-cta{height:52px;padding:0 28px;font-size:15.5px;cursor:pointer}
.ru-ghost{display:inline-flex;align-items:center;height:52px;padding:0 26px;border-radius:999px;border:1px solid var(--line2);
  color:#fff;font:600 15.5px/1 Inter,sans-serif;transition:all .25s}
.ru-ghost:hover{border-color:var(--ice);background:rgba(156,195,255,.06)}
.ru-pillars{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:18px 0 0;padding:0;text-align:left}
.ru-pillars li{display:flex;gap:14px;align-items:flex-start;padding:20px;border-radius:20px;border:1px solid var(--line);
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.012))}
.ru-pillars b{font:500 22px/1 Fraunces,serif;color:var(--ice)}
.ru-pillars span{font-size:14px;line-height:1.5;color:var(--muted)}
.ru-pillars strong{display:block;color:#fff;font-size:15.5px;margin-bottom:3px}
@media (max-width:760px){.ru-pillars{grid-template-columns:1fr}.ru-hero-copy{margin-bottom:26px}}
/* Indicador de rotación del mosaico */
.ru-tile .ru-prog{position:absolute;left:0;bottom:0;height:2px;width:0;background:linear-gradient(90deg,#3b82f6,#9cc3ff);z-index:3}
.ru-tile.tick .ru-prog{animation:ru-prog 1.2s ease-out}
@keyframes ru-prog{from{width:0;opacity:1}to{width:100%;opacity:0}}

/* ---------- Bloque de captura entre mosaico y mapa ---------- */
.ru-band{padding:8px 0 24px!important;border:0!important;background:none!important}
.ru-band-card{display:flex;align-items:center;gap:28px;padding:26px 30px;border-radius:28px;border:1px solid var(--line2);
  background:radial-gradient(600px 200px at 0% 50%,rgba(59,130,246,.22),transparent 70%),linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.012));
  box-shadow:0 30px 80px -30px rgba(37,99,235,.5)}
.ru-shutter{position:relative;flex:none;width:92px;height:92px;border-radius:50%;cursor:pointer;color:#fff;display:grid;place-items:center;
  background:linear-gradient(180deg,#4b8dff,#1d4ed8);border:1px solid rgba(156,195,255,.5);
  box-shadow:0 0 0 7px rgba(59,130,246,.14),0 18px 40px -10px rgba(59,130,246,.85);transition:transform .2s}
.ru-shutter svg{width:38px;height:38px}
.ru-shutter::after{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px solid rgba(59,130,246,.45);animation:ru-p 2.4s infinite}
.ru-shutter:hover{transform:scale(1.05)}.ru-shutter:active{transform:scale(.96)}
.ru-band-txt{flex:1;text-align:left}
.ru-band-txt h2{font-size:clamp(24px,2.6vw,32px)!important;margin:0 0 6px!important}
.ru-band-txt p{font-size:15px;color:#aeb9cc!important;max-width:520px}
.ru-band-btns{display:flex;flex-direction:column;gap:10px;flex:none}
.ru-band-btns .ru-cta,.ru-band-btns .ru-ghost{height:48px;justify-content:center;cursor:pointer;background-color:transparent;font-size:15px}
@media (max-width:820px){
  .ru-band-card{flex-direction:column;text-align:center;gap:18px;padding:28px 20px}
  .ru-band-txt{text-align:center}.ru-band-txt p{margin:0 auto}
  .ru-band-btns{flex-direction:row;width:100%}.ru-band-btns>*{flex:1}
}
.ru-band-btns .ru-cta,.ru-band-btns .ru-ghost{white-space:nowrap}
@media (max-width:420px){.ru-band-btns .ru-cta,.ru-band-btns .ru-ghost{font-size:14px;padding:0 14px}}

/* ---------- Footer: contacto + copyright ---------- */
.ru-footer{background:#030408!important;border-top:1px solid var(--line);padding:80px 0 32px}
.ru-contact{display:grid;grid-template-columns:1.1fr 1fr;gap:48px;align-items:start}
.ru-contact-intro h2{font-size:clamp(30px,3.8vw,46px)!important;margin:18px 0 12px!important}
.ru-contact-intro p{font-size:16.5px;line-height:1.6;color:#aeb9cc!important;max-width:460px}
.ru-contact-list{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.ru-contact-list a,.ru-contact-list li>div{display:flex;align-items:center;gap:14px;padding:14px 16px;border-radius:16px;border:1px solid var(--line);
  background:rgba(255,255,255,.02);color:#fff;font:500 15.5px/1.3 Inter,sans-serif;transition:border-color .2s,background .2s}
.ru-contact-list a:hover{border-color:var(--line2);background:rgba(59,130,246,.08)}
.ru-contact-list small{display:block;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:3px}
.ru-contact-list .ic{flex:none;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(59,130,246,.12);border:1px solid var(--line2);color:var(--ice)}
.ru-contact-list svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.ru-copy{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:56px;padding-top:24px;border-top:1px solid var(--line);
  font-size:12.5px;line-height:1.6;color:#5f6b82}
.ru-copy span:last-child{max-width:560px;text-align:right}
@media (max-width:820px){.ru-contact{grid-template-columns:1fr;gap:28px}.ru-copy{flex-direction:column}.ru-copy span:last-child{text-align:left}}
footer.ru-footer .ru-contact-list li,footer.ru-footer .ru-contact-list a{color:#fff!important}
footer.ru-footer .ru-contact-list a:hover{color:#fff!important}
footer.ru-footer .ru-contact-list small{color:var(--muted)!important}

/* ---------- Observatorio cultural: clusters + ICC ---------- */
.ru-cl-lbl{transform:translate(-50%,-50%);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;padding:5px 12px 5px 5px;border-radius:999px;
  background:rgba(5,7,12,.82);backdrop-filter:blur(6px);border:1px solid var(--c);color:#fff;font:600 12px/1 Inter,sans-serif;
  box-shadow:0 6px 18px rgba(0,0,0,.5),0 0 18px color-mix(in srgb,var(--c) 40%,transparent);cursor:pointer}
.ru-cl-lbl b{display:grid;place-items:center;min-width:26px;height:26px;border-radius:50%;background:var(--c);font:700 11.5px/1 Inter,sans-serif}
.ru-cl-pop{min-width:250px}
.ru-cl-pop h4{margin:8px 0 2px;font:500 19px/1.2 Fraunces,serif;color:#fff}
.ru-cl-cats{font-size:12px;color:#9cc3ff!important;margin:0 0 12px}
.ru-icc{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:12px;background:rgba(59,130,246,.12);border:1px solid rgba(148,180,255,.25);margin-bottom:12px}
.ru-icc strong{font:500 34px/1 Fraunces,serif;color:#fff}.ru-icc span{font-size:11px;line-height:1.3;color:#c9d3e6;letter-spacing:.04em;text-transform:uppercase}
.ru-ib{display:grid;grid-template-columns:78px 1fr 52px;align-items:center;gap:8px;font-size:12px;color:#c9d3e6;margin-bottom:6px}
.ru-ib i{height:6px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}.ru-ib i b{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,#1d4ed8,#9cc3ff)}
.ru-ib em{font-style:normal;text-align:right;color:#fff;font-weight:600}
.ru-ih{display:block;font-size:10.5px;color:#8b97ad;margin:-2px 0 8px 86px;line-height:1.3}
.ru-cl-meta{margin-top:10px;font-size:11.5px;color:#8b97ad;line-height:1.5}.ru-cl-meta .up{color:#22c55e}.ru-cl-meta .down{color:#ef4444}
#ru-obs{margin-top:22px;text-align:left;padding:26px;border-radius:26px;border:1px solid var(--line);background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.01))}
.ru-obs-head{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;margin-bottom:18px}
.ru-obs-head h3{font:500 clamp(22px,2.6vw,30px)/1.15 Fraunces,serif;color:#fff;margin:14px 0 6px}
.ru-obs-head p{font-size:14.5px;color:#aeb9cc!important;max-width:640px}
.ru-obs-head .ru-cta{flex:none;cursor:pointer;height:48px}
.ru-obs-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}
.ru-obs-row{display:grid;grid-template-columns:34px 1fr auto auto;gap:14px;align-items:center;text-align:left;padding:14px 16px;border-radius:16px;
  border:1px solid var(--line);background:rgba(255,255,255,.02);color:#fff;cursor:pointer;font-family:Inter,sans-serif;transition:all .2s}
.ru-obs-row:hover{border-color:var(--line2);background:rgba(59,130,246,.08)}
.ru-obs-row .n{font:500 20px Fraunces,serif;color:var(--ice)}
.ru-obs-row .t b{display:block;font-size:15px}.ru-obs-row .t small{font-size:12px;color:var(--muted)}
.ru-obs-row .mini{display:flex;gap:3px;align-items:flex-end;height:30px}
.ru-obs-row .mini i{width:7px;height:100%;border-radius:3px;background:rgba(255,255,255,.07);display:flex;align-items:flex-end;overflow:hidden}
.ru-obs-row .mini b{display:block;width:100%;background:linear-gradient(0deg,#1d4ed8,#9cc3ff);border-radius:3px}
.ru-obs-row .v{text-align:right}.ru-obs-row .v strong{display:block;font:500 26px/1 Fraunces,serif}.ru-obs-row .v small{font-size:10px;letter-spacing:.14em;color:var(--muted)}
.ru-obs-note{margin-top:16px;font-size:12px;line-height:1.55;color:#6b7891!important}
.ru-chk{display:flex;gap:10px;align-items:flex-start;font-size:13px;line-height:1.45;color:#c9d3e6;margin:10px 0}
.ru-chk input{margin-top:3px;accent-color:#3b82f6;width:16px;height:16px;flex:none}.ru-chk a{color:var(--ice);text-decoration:underline}
@media (max-width:820px){.ru-obs-head{flex-direction:column;align-items:stretch}.ru-obs-list{grid-template-columns:1fr}#ru-obs{padding:20px}}

/* ---------- Hero: explicación compacta debajo del mosaico ---------- */
.ru-hero-copy.ru-below{max-width:720px;margin:30px auto 0}
.ru-below .ru-eyebrow{font-size:10.5px;padding:6px 13px}
.ru-below h1.ru-hero-title{font-size:clamp(28px,3.6vw,44px)!important;margin:14px 0 10px!important;text-shadow:none}
.ru-below .ru-hero-lead{font-size:clamp(14.5px,1.35vw,16.5px)!important;line-height:1.6!important;max-width:600px}
.ru-below .ru-hero-cta{margin-top:20px}
.ru-below .ru-hero-cta .ru-cta,.ru-below .ru-ghost{height:46px;font-size:14.5px;padding:0 22px}
.ru-hero-copy.ru-below + .ru-pillars{margin-top:28px}