/* VOKUDO v2: tema oscuro de marca. Redefine las variables que ya usan todas las paginas. */
:root{
  color-scheme: dark;
  --bg:#070b0f; --surface:#0d141b; --border:#1d2b37;
  --text:#f3f7f8; --text-dim:#9fb2ba;
  --accent:#19c6d8; --accent-hover:#5ee0ee; --accent-soft:rgba(25,198,216,.12); --amber:#ffc857;
  --shadow:0 4px 24px rgba(0,0,0,.45); --shadow-lg:0 12px 40px rgba(0,0,0,.55);
}
body{ font-family:'Red Hat Display','Albert Sans',system-ui,sans-serif; background:var(--bg); color:var(--text); }
header.site{ background:rgba(7,11,15,.9) !important; border-bottom:1px solid var(--border); }
.logo-mark{ height:22px; }
.cta-btn, .btn-primary{ color:#04222a !important; font-weight:800; }
.cta-btn:hover{ color:#04222a !important; }
.menu-bar{ background:var(--surface); }
article.body strong{ color:var(--text); }
.inline-cta{ background:var(--accent-soft); }
.facts, .cta-box{ border:1px solid var(--border); }
img{ border-radius:inherit; }
.mono{ font-family:'IBM Plex Mono',ui-monospace,monospace; }
/* piezas nuevas */
.hero2{ position:relative; overflow:hidden; padding:84px 0 70px; background:var(--bg); border-bottom:1px solid var(--border); }
.hero2::before{ content:""; position:absolute; inset:0; opacity:.18; background-image:linear-gradient(var(--accent) 1px,transparent 1px),linear-gradient(90deg,var(--accent) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:radial-gradient(ellipse 80% 90% at 30% 40%,#000 5%,transparent 70%); mask-image:radial-gradient(ellipse 80% 90% at 30% 40%,#000 5%,transparent 70%); }
.hero2::after{ content:""; position:absolute; left:-10%; top:-30%; width:70%; height:140%; background:radial-gradient(ellipse at center,rgba(25,198,216,.22),rgba(25,198,216,0) 62%); }
.hero2 .shell{ position:relative; z-index:1; }
.hero2 .kicker{ font-family:'IBM Plex Mono',monospace; font-size:.78rem; letter-spacing:.22em; color:var(--accent); font-weight:600; }
.hero2 h1{ font-size:clamp(2.2rem,6vw,4rem); line-height:1.04; font-weight:800; letter-spacing:-.025em; max-width:16em; margin:14px 0 18px; text-wrap:balance; }
.hero2 h1 em{ color:var(--amber); font-style:normal; }
.hero2 p.lead{ font-size:1.15rem; color:var(--text-dim); max-width:36em; margin:0 0 28px; line-height:1.55; }
.btn-row{ display:flex; gap:12px; flex-wrap:wrap; }
.btn{ display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:999px; font-weight:800; font-size:1rem; text-decoration:none; border:1px solid var(--accent); }
.btn-primary{ background:var(--accent); color:#04222a; }
.btn-ghost{ color:var(--text); background:transparent; }
.btn-ghost:hover{ background:var(--accent-soft); }
.sec{ padding:56px 0 8px; }
.sec h2{ font-size:clamp(1.5rem,3.4vw,2rem); font-weight:800; letter-spacing:-.015em; margin:0 0 6px; }
.sec .sub{ color:var(--text-dim); margin:0 0 22px; max-width:46em; }
.tag{ font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.14em; text-transform:uppercase; color:var(--accent); }
.cards{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:16px; }
.card2{ display:flex; flex-direction:column; background:var(--surface); border:1px solid var(--border); border-radius:16px; overflow:hidden; text-decoration:none; color:var(--text); transition:border-color .2s, transform .2s; }
.card2:hover{ border-color:var(--accent); transform:translateY(-2px); }
.card2 .im{ aspect-ratio:16/9; background:#0a1218 center/cover no-repeat; border-bottom:1px solid var(--border); }
.card2 .tx{ padding:16px 18px 20px; display:flex; flex-direction:column; gap:6px; }
.card2 h3{ font-size:1.15rem; line-height:1.25; font-weight:800; margin:0; }
.card2 p{ color:var(--text-dim); font-size:.93rem; line-height:1.5; margin:0; }
.card2 .meta{ font-size:.78rem; color:var(--text-dim); }
.embed{ position:relative; aspect-ratio:16/9; border-radius:16px; overflow:hidden; border:1px solid var(--border); background:#000; margin:1.4em 0; }
.embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }
.embed.short{ aspect-ratio:9/16; max-width:300px; }
.src-box{ border:1px solid var(--border); border-left:4px solid var(--accent); background:var(--surface); border-radius:10px; padding:14px 18px; margin:1.4em 0; font-size:.95rem; color:var(--text-dim); }
.src-box strong{ color:var(--text); }
figure.shot{ margin:1.6em 0; }
figure.shot img{ width:100%; border-radius:14px; border:1px solid var(--border); }
figure.shot figcaption{ font-size:.8rem; color:var(--text-dim); margin-top:8px; }
.note-box{ background:var(--accent-soft); border-radius:12px; padding:14px 18px; margin:1.4em 0; font-size:.95rem; }
.aff-banner{ border:1px solid #4a3d1a; background:#17130a; color:#e9d9a8; border-radius:12px; padding:14px 18px; margin:0 0 24px; font-size:.92rem; line-height:1.55; }
.aff-banner a{ color:var(--amber); }
.pill{ display:inline-block; font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.08em; padding:3px 9px; border-radius:999px; border:1px solid var(--accent); color:var(--accent); }
.pill.soon{ border-color:var(--text-dim); color:var(--text-dim); }
.soc{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px; }
.soc a{ font-family:'IBM Plex Mono',monospace; font-size:.78rem; letter-spacing:.06em; color:var(--text); text-decoration:none; padding:9px 14px; border:1px solid var(--border); border-radius:999px; }
.soc a:hover{ border-color:var(--accent); color:var(--accent); }
.grid2{ display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:center; }
@media (max-width:860px){ .grid2{ grid-template-columns:1fr; gap:30px; } }
.hv{ position:relative; border:1px solid var(--accent); border-radius:6px; overflow:hidden; box-shadow:0 0 60px rgba(25,198,216,.18); aspect-ratio:16/9; background:#000; }
.hv video{ width:100%; height:100%; object-fit:cover; display:block; }
.hv::before,.hv::after{ content:""; position:absolute; width:26px; height:26px; border:3px solid var(--accent); z-index:2; }
.hv::before{ left:8px; top:8px; border-right:none; border-bottom:none; }
.hv::after{ right:8px; bottom:8px; border-left:none; border-top:none; }
.hv-tag{ position:absolute; left:14px; bottom:12px; z-index:2; font-family:'IBM Plex Mono',monospace; font-size:.68rem; letter-spacing:.12em; background:rgba(7,11,15,.78); padding:5px 10px; color:var(--text); }
.art-hero{ position:relative; overflow:hidden; border-bottom:1px solid var(--border); }
.art-hero .bg{ position:absolute; inset:-60px; background-size:cover; background-position:center; filter:blur(24px) brightness(.36) saturate(1.25); transform:scale(1.1); }
.art-hero::before{ content:""; position:absolute; inset:0; z-index:1; opacity:.16; background-image:linear-gradient(var(--accent) 1px,transparent 1px),linear-gradient(90deg,var(--accent) 1px,transparent 1px); background-size:64px 64px; -webkit-mask-image:linear-gradient(180deg,#000,transparent 92%); mask-image:linear-gradient(180deg,#000,transparent 92%); }
.art-hero::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:70px; z-index:1; background:linear-gradient(transparent,var(--bg)); }
.art-hero .in{ position:relative; z-index:2; padding-bottom:30px; }
.kb{ overflow:hidden; border-radius:14px; border:1px solid var(--border); }
.kb img,.kb video{ width:100%; display:block; border:0 !important; border-radius:0 !important; animation:kenb 16s ease-in-out infinite alternate; transform-origin:60% 40%; }
@keyframes kenb{ from{ transform:scale(1); } to{ transform:scale(1.09); } }
.moving{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; margin:1.4em 0; }
.moving figure{ margin:0; }
.moving video{ width:100%; display:block; border-radius:12px; border:1px solid var(--border); background:#000; }
.moving figcaption{ font-size:.78rem; color:var(--text-dim); margin-top:6px; }
html.js .rv{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
html.js .rv.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .kb img,.kb video{ animation:none; } html.js .rv{ opacity:1; transform:none; transition:none; } }
/* HERO-V3 */
.hero2{ min-height:min(74vh,600px); display:flex; align-items:center; padding:84px 0 70px; }
.hero2 .hbg{ position:absolute; top:0; bottom:0; right:0; width:58%; z-index:0; -webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 75%); mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.35) 30%,#000 75%); }
.hero2 .hbg video{ width:100%; height:100%; object-fit:cover; display:block; filter:blur(1.5px); opacity:.85; }
.hero2 .hshade{ position:absolute; inset:0; z-index:0; background:linear-gradient(180deg,transparent 80%,var(--bg) 100%); pointer-events:none; }
.hero2::before{ z-index:1; }
.hero2::after{ z-index:1; }
.hero2 .shell{ position:relative; z-index:2; }
.hero2 .hcopy{ max-width:34em; text-align:left; }
.hero2 .hv-tag{ left:auto; right:18px; bottom:16px; z-index:2; }
@media (max-width:860px){ .hero2{ min-height:520px; align-items:flex-end; } .hero2 .hbg{ left:0; width:100%; -webkit-mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.25) 60%,transparent 100%); mask-image:linear-gradient(180deg,#000 0%,rgba(0,0,0,.25) 60%,transparent 100%); } .hero2 .hv-tag{ top:14px; bottom:auto; } }
/* NEWS-V3 */
.pagebg{ position:fixed; inset:0; z-index:-1; background-size:cover; background-position:center; filter:blur(18px) brightness(.46) saturate(1.25); transform:scale(1.12); }
.pagebgg{ position:fixed; inset:0; z-index:-1; pointer-events:none; opacity:.14; background-image:linear-gradient(var(--accent) 1px,transparent 1px),linear-gradient(90deg,var(--accent) 1px,transparent 1px); background-size:64px 64px; }
.art-hero{ border-bottom:0; } .art-hero .bg,.art-hero::before,.art-hero::after{ display:none; }
.kb img,.kb video{ animation:none !important; }
.pz{ overflow:hidden; border-radius:14px; border:1px solid var(--border); background:#000; }
.pz img,.pz video{ display:block; width:100%; border:0 !important; border-radius:0 !important; will-change:transform; transition:transform .12s linear; transform:scale(1.06); }
.moving video{ border:0; border-radius:0; }
.esencial{ background:rgba(7,11,15,.62); border:1px solid var(--accent); border-radius:14px; padding:18px 22px; margin:0 0 28px; backdrop-filter:blur(6px); }
.esencial h2{ margin:0 0 8px !important; font-size:1.05rem !important; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); }
.esencial ul{ margin:0; padding-left:1.1em; } .esencial li{ margin:5px 0; }
article.body{ background:rgba(7,11,15,.52); border-radius:16px; padding:6px 26px 26px; backdrop-filter:blur(5px); }
/* NEWS-V4 */
.pagebg{ inset:-8%; filter:blur(10px) brightness(.62) saturate(1.2); transform:scale(var(--bgz,1.15)); transition:transform .25s linear; background-position:calc(50% + var(--bgx,0px)) calc(50% + var(--bgy,0px)); }
.pagebgg{ opacity:.1; }
.pagevig{ position:fixed; inset:0; z-index:-1; pointer-events:none; background:linear-gradient(90deg,rgba(7,11,15,0) 0%,rgba(7,11,15,.45) 22%,rgba(7,11,15,.86) 38%,rgba(7,11,15,.92) 50%,rgba(7,11,15,.86) 62%,rgba(7,11,15,.45) 78%,rgba(7,11,15,0) 100%); }
article.body{ background:rgba(7,11,15,.34); }
