:root{
  --white:#ffffff;
  --surface:#f2f5fb;
  --surface-2:#eef2f8;
  --text:#101827;
  --muted:#6a7687;
  --nav-dark:#09121d;
  --nav-panel:#101824;
  --card-dark:#071525;
  --row-dark:#0e102a;
  --header-blue:#20205d;
  --header-blue-2:#181946;
  --line:#dfe7f1;
  --display-font:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif;
  --body-font:Inter, "Segoe UI", Arial, sans-serif;
  --cyan:#13d9e4;
  --yellow:#f0d716;
  --pink:#ff49b1;
  --blue:#2b9ff5;
  --orange:#ff7a32;
  --purple:#8c5cf5;
  --shadow-soft:0 18px 40px rgba(17,24,39,.08);
  --shadow-card:0 16px 34px rgba(15,23,42,.08);
}
*{box-sizing:border-box}
html,body{
  margin:0;
  min-height:100%;
  background:#eef3f8;
  color:var(--text);
  font-family:var(--body-font);
}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
.wrap{width:min(1560px, calc(100% - 56px)); margin:auto}

/* display typography */
.display-title,
.card-title,
.ranking-title,
.rank-name,
.news-label,
.hero-copy .season-badge,
.rank-tab,
.theme-button,
.mini-accent-link{
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  letter-spacing:.6px;
  text-transform:uppercase;
}
.display-title{
  margin:0 0 8px;
  color:#142039;
  font-size:clamp(42px, 5vw, 64px);
  line-height:.96;
}
.card-title{
  margin:0 0 12px;
  font-size:clamp(28px, 3vw, 40px);
}

/* top */
.publisher-bar{
  min-height:38px; display:flex; align-items:center;
  background:#060d15; border-bottom:1px solid rgba(255,255,255,.06);
}
.publisher-inner{display:flex;justify-content:space-between;align-items:center}
.publisher-inner span{font-size:12px;color:#6e7782}
.publisher-inner b{color:#fff}
.publisher-actions{display:flex;align-items:center;gap:18px}
.publisher-actions a{font-size:12px;color:#8a94a0}
.mini-accent-link{
  padding:5px 12px; color:#fff !important;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
  border:1px solid rgba(255,255,255,.14);
}
.site-header{
  position:sticky; top:0; z-index:30;
  background:var(--nav-dark); border-bottom:1px solid rgba(255,255,255,.06);
}
.nav-shell{
  min-height:88px;
  display:grid;
  grid-template-columns:auto 170px 1fr auto 255px;
  gap:18px; align-items:center;
}
.brand{display:flex;align-items:center;gap:12px}
.brand-mark{
  width:54px;height:54px; display:grid;place-items:center;
  font-size:36px;font-weight:900;font-family:Georgia,serif;font-style:italic;
  color:#e6b962;background:#0d1722;
  border:1px solid rgba(240,215,22,.2);
  clip-path:polygon(18% 0,100% 0,82% 100%,0 100%);
}
.brand-copy{display:flex;flex-direction:column;line-height:1.15}
.brand-copy b{font-size:14px;letter-spacing:.08em;color:#fff}
.brand-copy small{font-size:9px;color:#8c96a3;letter-spacing:.12em}
.online-box{padding:0 16px;border-left:1px solid rgba(255,255,255,.08);border-right:1px solid rgba(255,255,255,.08)}
.online-box span,.online-box small{display:block;color:#8c96a3;font-size:11px}
.online-box strong{display:block;margin:4px 0 2px;font-size:26px;line-height:1;color:#fff}
.main-nav{display:flex;justify-content:center;gap:30px}
.main-nav a{position:relative;color:#8b96a4;font-size:13px;padding:8px 0}
.main-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--cyan);opacity:0}
.main-nav a:hover,.main-nav a.active{color:#fff}
.main-nav a:hover::after,.main-nav a.active::after{opacity:1}

/* unified button system */
.theme-button{
  --btn-bg:transparent;
  --btn-color:#ffffff;
  --btn-border:rgba(255,255,255,.18);
  --btn-accent:var(--cyan);
  min-height:46px;
  min-width:142px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:0 18px;
  border:1px solid var(--btn-border);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)),
    var(--btn-bg);
  color:var(--btn-color);
  cursor:pointer;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:inset 0 -2px 0 var(--btn-accent), 0 0 0 rgba(0,0,0,0);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, filter .16s ease;
}
.theme-button:hover{
  transform:translateY(-2px);
  box-shadow:inset 0 -2px 0 var(--btn-accent), 0 10px 22px rgba(17,24,39,.14);
  border-color:color-mix(in srgb, var(--btn-accent) 50%, #cfd8e3);
  filter:brightness(1.02);
}
.theme-button--solid{
  --btn-bg:var(--cyan);
  --btn-color:#07111b;
  --btn-border:rgba(19,217,228,.45);
  --btn-accent:var(--pink);
}
.theme-button--outline{
  --btn-bg:rgba(9,18,29,.32);
  --btn-color:#ffffff;
  --btn-border:rgba(255,255,255,.14);
  --btn-accent:var(--cyan);
}
.theme-button--outline-sm{
  min-height:40px;
  min-width:126px;
  --btn-bg:#ffffff;
  --btn-color:#0f172a;
  --btn-border:#d7dde5;
  --btn-accent:var(--cyan);
}
.theme-button--light{
  min-width:146px;
  --btn-bg:#ffffff;
  --btn-color:#07111b;
  --btn-border:#d7dde5;
  --btn-accent:var(--cyan);
}
.theme-button--nav{
  min-width:182px;
  min-height:42px;
  --btn-bg:var(--nav-panel);
  --btn-color:#ffffff;
  --btn-border:rgba(255,255,255,.08);
  --btn-accent:var(--pink);
}
.cyan-outline{--btn-accent:var(--cyan)}
.yellow-outline{--btn-accent:var(--yellow)}

.language-switcher{position:relative}
.lang-trigger{justify-content:space-between}
.lang-chip{display:flex;align-items:center;gap:10px}
.flag{font-size:18px;line-height:1}
.code{font-weight:900;letter-spacing:.08em}
.lang-arrow{color:#8c96a3;font-size:14px}
.lang-menu{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  width:240px;
  padding:10px;
  background:#0d1825;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 40px rgba(0,0,0,.35);
  display:none;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
.language-switcher.open .lang-menu{display:grid}
.lang-option{
  min-height:40px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.08);
  background:#101824;
  color:#dbe3ef;
  cursor:pointer;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
}
.lang-option.active,
.lang-option:hover{
  color:#07111b;
  background:var(--cyan);
}

/* login */
.login-box{display:grid;gap:8px}
.login-row{display:grid;grid-template-columns:1fr 82px;gap:8px}
.point-field{
  height:34px; display:flex;align-items:center;gap:10px;padding:0 12px;
  color:#c8d0da;background:#0c141f;border:1px solid rgba(255,255,255,.07);
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
}
.point-field span{color:var(--pink);font-size:11px}
.point-field input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:#fff}
.login-row .theme-button{
  min-width:auto;
  padding-inline:10px;
}

/* hero */
.hero{position:relative; min-height:560px; overflow:hidden; background:#07111b}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg, rgba(7,17,27,.38), rgba(7,17,27,.58))}
.hero-content{position:relative;z-index:2;min-height:560px;display:grid;align-items:center}
.hero-copy{padding-left:8vw;max-width:720px}
.season-badge{
  display:inline-block;padding:8px 12px;font-size:13px;color:#fff;background:var(--orange);
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
}
.hero-logo{margin:10px 0 2px;display:flex;align-items:flex-end;gap:10px;flex-wrap:wrap}
.hero-logo span{
  font-family:Georgia,serif;font-size:92px;line-height:.92;font-style:italic;
  background:linear-gradient(#fef8da 5%, #e9cc87 25%, #b7772f 48%, #ffe287 63%, #7b4015 92%);
  -webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 4px 14px rgba(0,0,0,.35);
}
.hero-logo small{font-family:Georgia,serif;font-size:34px;font-style:italic;color:#f0b139;margin-left:-16px;margin-bottom:2px}
.hero-copy p{margin:0 0 16px;color:#eef4fb;font-size:18px}
.hero-actions{display:flex;gap:10px}

/* feature slider */
.feature-slider-wrap{
  position:relative;
  z-index:5;
  width:100%;
  margin:0;
  padding:0;
  background:#11132e;
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.feature-slider-shell{
  position:relative;
  width:100%;
  padding:0;
  margin:0;
}
.feature-viewport{
  width:100%;
  overflow:hidden;
  border:0;
  box-shadow:none;
}
.feature-track{
  display:flex;
  transition:transform .35s ease;
}
.feature-slide{
  position:relative;
  min-width:25%;
  height:212px;
  overflow:hidden;
  background:#161d37;
  clip-path:polygon(22px 0,100% 0,calc(100% - 22px) 100%,0 100%);
}
.feature-slide + .feature-slide{
  margin-left:-10px;
}
.feature-media{
  position:absolute;
  inset:0;
  background:var(--bg) center/cover no-repeat;
  filter:saturate(.72) contrast(.88) brightness(.63);
  transform:scale(1.02);
}
.feature-overlay{
  position:absolute;
  inset:0;
  background:rgba(22,14,55,.34);
}
.feature-content{
  position:relative;
  z-index:2;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  padding:20px 34px;
  text-align:center;
}
.feature-content h3{
  margin:0 0 9px;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  font-size:clamp(23px, 2vw, 34px);
  line-height:1.02;
}
.feature-content p{
  margin:0;
  max-width:360px;
  color:#edf2f8;
  line-height:1.45;
  font-size:14px;
}
.slider-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:44px;
  height:58px;
  border:1px solid rgba(255,255,255,.14);
  color:#fff;
  background:#0c1421;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  cursor:pointer;
  z-index:10;
  font-size:26px;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease;
}
.slider-arrow:hover{
  background:var(--cyan);
  color:#07111b;
  box-shadow:0 0 20px rgba(19,217,228,.28);
}
.slider-arrow.left{left:14px}
.slider-arrow.right{right:14px}
.feature-dots{
  position:absolute;
  left:50%;
  bottom:10px;
  transform:translateX(-50%);
  z-index:12;
  display:flex;
  justify-content:center;
  gap:8px;
  margin:0;
}
.feature-dot{
  width:9px;height:9px;border-radius:50%;
  border:1px solid rgba(255,255,255,.52);
  background:rgba(255,255,255,.18);
  cursor:pointer;
}
.feature-dot.active{background:var(--cyan);border-color:var(--cyan)}

/* section shells */
.news-section,.ranking-section{padding:74px 0 96px}
.section-shell{
  background:#f8fafc;
  border:1px solid #dfe7f1;
  box-shadow:var(--shadow-soft);
  padding:42px 42px 54px;
}
.section-shell--light{
  background:#f8fafc;
}
.section-kicker{
  margin-bottom:8px;color:#8b93a0;font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase
}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:28px}
.section-head p{margin:0;color:var(--muted);max-width:760px}

/* news */
.news-list{margin-top:42px;display:grid;gap:28px}
.news-item{
  display:grid;grid-template-columns:320px 1fr;gap:34px;align-items:center;padding:24px;
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
}
.light-card{
  background:#ffffff;
  border:1px solid #e6ebf2;
  box-shadow:var(--shadow-card);
}
.news-image{
  position:relative;height:174px;overflow:hidden;border:1px solid rgba(255,255,255,.06);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
}
.news-image::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(145deg, rgba(255,255,255,.08), transparent 30%),
             repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 2px, transparent 2px 12px);
}
.news-image::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg, transparent, rgba(5,10,17,.68))}
.image-a{background:#122534;box-shadow:inset 0 0 0 2px rgba(19,217,228,.18)}
.image-b{background:#1b2032;box-shadow:inset 0 0 0 2px rgba(240,215,22,.13)}
.news-label{position:absolute;left:18px;bottom:16px;z-index:2;font-size:26px;color:#fff}
.label-cyan{color:#dffcff}.label-yellow{color:#fff3a1}
.dark-copy p{margin:0 0 18px;line-height:1.7;color:#334155;max-width:980px}
.dark-meta{color:#7c8795}
.dark-title{color:#0f172a}

/* ranking */
.rank-tabs{display:flex;gap:8px}
.rank-tab{
  min-width:118px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border:1px solid #d7dde5;
  cursor:pointer;
  color:#39465b;
  background:#ffffff;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:inset 0 -2px 0 var(--cyan);
  transition:transform .16s ease, box-shadow .16s ease;
}
.rank-tab:hover{transform:translateY(-2px)}
.rank-tab.active{
  color:#07111b;
  background:var(--cyan);
  box-shadow:inset 0 -2px 0 var(--pink), 0 10px 22px rgba(17,24,39,.12);
}
.rank-panel{display:none}
.rank-panel.active{display:grid}
.ranking-grid{
  margin-top:36px;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:20px;
  align-items:start;
}
.ranking-card{
  overflow:hidden;
  background:#11132e;
  box-shadow:0 16px 32px rgba(8,15,26,.18);
}
.ranking-header{
  position:relative;
  min-height:88px;
  padding:15px 18px 12px;
  overflow:hidden;
  background:
    linear-gradient(160deg, rgba(255,255,255,.05) 0 35%, transparent 35%),
    linear-gradient(135deg, var(--header-blue) 0 53%, var(--header-blue-2) 53% 100%);
}
.ranking-header::after{
  content:"";
  position:absolute;
  right:-38px;
  top:-28px;
  width:185px;
  height:150px;
  transform:rotate(13deg);
  background:repeating-linear-gradient(-45deg, rgba(255,255,255,.08) 0 5px, rgba(255,255,255,0) 5px 12px);
  opacity:.65;
}
.ranking-title{
  position:relative;
  z-index:1;
  color:#fff;
  font-size:clamp(28px, 3.2vw, 38px);
  line-height:.95;
  text-shadow:2px 3px 0 rgba(0,0,0,.24);
}
.ranking-subtitle{
  position:relative;
  z-index:1;
  display:inline-block;
  margin-top:7px;
  color:#ff3a7f;
  font-family:var(--display-font);
  font-style:italic;
  font-size:10px;
  line-height:1;
  font-weight:900;
  letter-spacing:.9px;
  text-transform:uppercase;
}
.rank-row{
  position:relative;
  display:grid;
  height:49px;
  overflow:hidden;
  background:var(--row-dark);
}
.rank-row + .rank-row{border-top:1px solid rgba(255,255,255,.035)}
.rank-num{
  position:relative;
  z-index:3;
  display:grid;
  place-items:center;
  height:100%;
  background:var(--accent);
  color:white;
  font-size:22px;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-shadow:1px 2px 0 rgba(0,0,0,.22);
}
.rank-num::after{
  content:"";
  position:absolute;
  top:0;
  right:-18px;
  width:32px;
  height:100%;
  background:var(--accent);
  transform:skewX(-18deg);
  transform-origin:top;
  z-index:-1;
}
.rank-main{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:center;
  flex-direction:column;
  padding-left:23px;
  color:#fff;
  background:linear-gradient(90deg, #101129 0%, #101129 74%, rgba(16,17,41,.42) 100%);
}
.rank-name{font-size:18px;color:#fff;text-shadow:1px 2px 0 rgba(0,0,0,.32)}
.rank-meta{
  margin-top:3px;
  color:var(--accent);
  font-family:var(--display-font);
  font-style:italic;
  font-size:12px;
  font-weight:900;
  letter-spacing:.4px;
  text-transform:uppercase;
}
.visual-row{grid-template-columns:58px minmax(130px, 1fr) minmax(130px, .95fr)}
.rank-pic{
  position:relative;
  z-index:1;
  margin-left:-30px;
  background:
    linear-gradient(90deg, var(--accent) 0 13%, transparent 42%),
    var(--pic) center / cover no-repeat;
  clip-path:polygon(15% 0, 100% 0, 100% 100%, 0 100%);
  filter:saturate(1.15) contrast(1.05);
}
.rank-pic::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, var(--accent) 0%, transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.07));
  mix-blend-mode:screen;
}
.text-row{grid-template-columns:58px 1fr}
.text-row .rank-main{background:linear-gradient(90deg, #11203a 0%, #11203a 100%)}

footer{padding:26px 0 30px}
.footer-inner{display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(182,193,208,.6);padding-top:22px;color:#7b8794}
.footer-inner b{color:#111827}

@media (max-width:1360px){
  .feature-slide{min-width:33.333333%}
  .ranking-grid{grid-template-columns:1fr 1fr}
  .ranking-card:first-child{grid-column:1 / -1}
}
@media (max-width:1280px){
  .nav-shell{grid-template-columns:auto 160px 1fr auto}
  .login-box{display:none}
  .main-nav{gap:18px}
}
@media (max-width:980px){
  .publisher-bar{display:none}
  .nav-shell{grid-template-columns:auto 1fr auto; min-height:80px}
  .online-box{display:none}
  .main-nav{justify-content:flex-end; gap:14px}
  .hero-copy{padding-left:0}
  .hero-logo span{font-size:74px}
  .hero-logo small{font-size:29px}
  .feature-slide{min-width:50%}
  .news-item{grid-template-columns:1fr}
  .ranking-grid{grid-template-columns:1fr}
  .ranking-card:first-child{grid-column:auto}
}
@media (max-width:720px){
  .wrap{width:min(100% - 24px, 1560px)}
  .nav-shell{grid-template-columns:auto auto}
  .main-nav{display:none}
  .section-head{flex-direction:column; align-items:flex-start}
  .section-shell{padding:28px 18px 30px}
  .hero{min-height:480px}
  .hero-content{min-height:480px}
  .hero-copy{padding:58px 0}
  .hero-logo{display:block}
  .hero-logo span{font-size:56px}
  .hero-logo small{display:block;margin:4px 0 0;font-size:24px}
  .hero-actions{flex-direction:column; align-items:flex-start}
  .feature-slider-shell{padding:0}
  .feature-slide{min-width:100%; height:190px}
  .feature-content h3{font-size:28px}
  .news-item{padding:18px}
  .news-image{height:160px}
  .news-label{font-size:22px}
  .ranking-title{font-size:30px}
  .visual-row{grid-template-columns:46px minmax(120px, 1fr) minmax(110px, .75fr)}
  .text-row{grid-template-columns:46px 1fr}
  .rank-row{height:43px}
  .rank-num{font-size:18px}
  .rank-name{font-size:15px}
  .rank-main{padding-left:18px}
  .lang-trigger{min-width:146px}
  .lang-menu{width:220px}
}


/* v0.9 — ONE button geometry + ONE hover effect across the theme */
.theme-button,
.rank-tab,
.lang-option,
.mini-accent-link,
.slider-arrow{
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
}

.theme-button{
  background:#ffffff;
  color:#111827;
  border:1px solid #ced8e5;
  box-shadow:inset 0 -3px 0 var(--cyan);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, background .16s ease, color .16s ease;
}
.theme-button:hover{
  transform:translateY(-3px);
  background:#0f1928;
  color:#ffffff;
  border-color:#0f1928;
  box-shadow:inset 0 -3px 0 var(--cyan), 0 10px 22px rgba(15,25,40,.20);
  filter:none;
}
.theme-button--solid,
.theme-button--outline,
.theme-button--outline-sm,
.theme-button--light,
.theme-button--nav,
.theme-button--unified{
  --btn-bg:unset;
  --btn-color:unset;
  --btn-border:unset;
  --btn-accent:unset;
  background:#ffffff;
  color:#111827;
  border:1px solid #ced8e5;
  box-shadow:inset 0 -3px 0 var(--cyan);
}
.site-header .theme-button,
.hero .theme-button{
  background:#0f1928;
  color:#ffffff;
  border-color:rgba(255,255,255,.14);
  box-shadow:inset 0 -3px 0 var(--cyan);
}
.site-header .theme-button:hover,
.hero .theme-button:hover{
  background:var(--cyan);
  color:#07111b;
  border-color:var(--cyan);
  box-shadow:inset 0 -3px 0 var(--pink), 0 10px 22px rgba(0,0,0,.24);
}
.theme-button--unified{
  min-width:146px;
  min-height:46px;
}
.news-copy .theme-button--unified,
.section-head .theme-button--unified{
  min-width:146px;
  min-height:46px;
}

/* Keep news cards clean and fully visible */
.news-section{
  padding-top:72px;
}
.news-list{
  overflow:visible;
}
.news-item{
  min-height:230px;
  overflow:visible;
}
.ranking-section,
.ranking-section .section-shell,
.ranking-grid,
.rank-panel.active{
  overflow:visible;
}
.ranking-section{
  padding-bottom:120px;
}
.ranking-card{
  height:auto;
  min-height:0;
}

/* Full-width slider remains attached to the hero with no gap/overlap */
.hero + .feature-slider-wrap{
  margin-top:0 !important;
}


/* ==========================================================
   v1.0 — Slider limpio, botones Split Fill, hero Neon Pulse
   ========================================================== */

/* Slider: directamente bajo el hero, ancho completo, sin flechas,
   sin dots y sin separación visible entre imágenes. */
.feature-slider-wrap{
  margin:0 !important;
  padding:0 !important;
  width:100%;
  background:#11132e;
}
.feature-slider-shell,
.feature-viewport,
.feature-track{
  width:100%;
  margin:0;
  padding:0;
}
.feature-viewport{
  border:0;
  box-shadow:none;
}
.feature-track{
  gap:0 !important;
}
.feature-slide{
  min-width:25%;
  height:212px;
  margin:0 !important;
  clip-path:none !important;
  border:0 !important;
}
.feature-slide + .feature-slide{
  margin-left:0 !important;
}
.feature-slide::after{
  display:none !important;
}
.feature-media{
  inset:0;
  transform:none;
}
.slider-arrow,
.feature-dots{
  display:none !important;
}

/* -----------------------------
   SPLIT FILL — botón global
   excepto botones del hero.
   ----------------------------- */
.theme-button,
.rank-tab,
.lang-option,
.mini-accent-link{
  --split-accent:var(--cyan);
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:46px;
  min-width:142px;
  padding:0 18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  border:1px solid #cfd9e6;
  background:#ffffff;
  color:#0f172a;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:none;
  transition:color .22s ease, border-color .22s ease, transform .18s ease, box-shadow .18s ease;
}
.theme-button::before,
.rank-tab::before,
.lang-option::before,
.mini-accent-link::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:50%;
  top:50%;
  width:0;
  height:0;
  transform:translate(-50%,-50%) rotate(8deg);
  background:var(--split-accent);
  transition:width .26s ease, height .26s ease;
}
.theme-button:hover::before,
.rank-tab:hover::before,
.lang-option:hover::before,
.mini-accent-link:hover::before{
  width:145%;
  height:210%;
}
.theme-button:hover,
.rank-tab:hover,
.lang-option:hover,
.mini-accent-link:hover{
  color:#07111b;
  border-color:var(--split-accent);
  transform:translateY(-2px);
  box-shadow:0 9px 20px rgba(15,23,42,.12);
  filter:none;
}

/* Header buttons retain dark resting state, but use same Split Fill. */
.site-header .theme-button,
.site-header .lang-option,
.publisher-bar .mini-accent-link{
  background:#101824;
  color:#ffffff;
  border-color:rgba(255,255,255,.10);
}
.site-header .theme-button:hover,
.site-header .lang-option:hover,
.publisher-bar .mini-accent-link:hover{
  color:#07111b;
  background:#101824;
}

/* Login is also Split Fill */
.login-row .theme-button{
  min-width:auto;
  --split-accent:var(--cyan);
}

/* Language selector and tabs: same effect */
.lang-trigger{--split-accent:var(--cyan)}
.lang-option{--split-accent:var(--cyan)}
.rank-tab{--split-accent:var(--cyan)}
.rank-tab.active{
  background:#101824;
  color:#ffffff;
  border-color:var(--cyan);
  box-shadow:inset 0 -3px 0 var(--pink);
}
.rank-tab.active::before{
  width:145%;
  height:210%;
}
.rank-tab.active{
  color:#07111b;
}

/* News buttons: EXACT same geometry/effect */
.news-copy .theme-button,
.section-head .theme-button{
  --split-accent:var(--cyan);
  min-width:146px;
  min-height:46px;
  background:#ffffff;
  color:#0f172a;
  border-color:#cfd9e6;
}

/* -----------------------------
   HERO — NEON PULSE only
   ----------------------------- */
.hero .hero-neon-btn{
  --neon:var(--cyan);
  position:relative;
  overflow:hidden;
  background:#0d1724;
  color:#ffffff;
  border:1px solid var(--neon);
  box-shadow:
    inset 0 0 12px rgba(19,217,228,.15),
    0 0 0 rgba(19,217,228,0);
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
}
.hero .hero-neon-btn:nth-child(2){
  --neon:var(--pink);
}
.hero .hero-neon-btn::before{
  display:none !important;
}
.hero .hero-neon-btn:hover{
  color:#ffffff;
  background:#0d1724;
  border-color:var(--neon);
  animation:heroNeonPulse .85s ease-in-out infinite alternate;
  transform:translateY(-2px);
}
@keyframes heroNeonPulse{
  from{
    box-shadow:
      inset 0 0 10px color-mix(in srgb,var(--neon) 20%,transparent),
      0 0 8px color-mix(in srgb,var(--neon) 35%,transparent);
  }
  to{
    box-shadow:
      inset 0 0 18px color-mix(in srgb,var(--neon) 35%,transparent),
      0 0 14px color-mix(in srgb,var(--neon) 65%,transparent),
      0 0 34px color-mix(in srgb,var(--neon) 35%,transparent);
  }
}

/* Prevent last ranking rows from looking clipped */
.ranking-card,
.rank-panel,
.ranking-grid{
  overflow:visible;
}
.ranking-card{
  overflow:hidden;
  padding-bottom:0;
}
.rank-row:last-child{
  border-bottom:0;
}
.ranking-section{
  padding-bottom:130px;
}

/* Mobile slider remains gapless */
@media(max-width:1360px){
  .feature-slide{min-width:33.333333%}
}
@media(max-width:980px){
  .feature-slide{min-width:50%}
}
@media(max-width:720px){
  .feature-slide{min-width:100%;height:190px}
}


/* ==========================================================
   v1.1 — Botones oscuros + slider angular + efectos ranking
   ========================================================== */

/* BOTONES: nunca blancos en reposo.
   Mantienen Split Fill al hover excepto Hero (Neon Pulse). */
.theme-button,
.rank-tab,
.lang-option,
.mini-accent-link{
  background:#101824 !important;
  color:#f4f7fb !important;
  border-color:#273448 !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}
.theme-button:hover,
.rank-tab:hover,
.lang-option:hover,
.mini-accent-link:hover{
  color:#07111b !important;
  border-color:var(--cyan) !important;
  background:#101824 !important;
  box-shadow:0 10px 22px rgba(15,23,42,.16) !important;
}
.rank-tab.active{
  background:#101824 !important;
  color:#07111b !important;
}
.rank-tab.active::before{
  width:145% !important;
  height:210% !important;
}

/* Hero Neon Pulse sigue independiente */
.hero .hero-neon-btn{
  background:#0d1724 !important;
  color:#ffffff !important;
}

/* Nombre del estilo angular:
   CHAMFERED / BEVELED / CORTE ANGULAR.
   En el slider usamos CHEVRON ANGULAR superpuesto. */

/* Slider sin gaps, pero recupera cortes puntiagudos/angulares.
   Cada tarjeta se superpone para que no aparezca separación. */
.feature-track{
  gap:0 !important;
  overflow:visible;
}
.feature-slide{
  position:relative;
  min-width:25%;
  margin:0 -14px 0 0 !important;
  clip-path:polygon(
    0 0,
    calc(100% - 28px) 0,
    100% 50%,
    calc(100% - 28px) 100%,
    0 100%,
    28px 50%
  ) !important;
  transform-origin:center;
  transition:transform .28s ease, filter .28s ease, box-shadow .28s ease;
  z-index:1;
}
.feature-slide:first-child{
  clip-path:polygon(
    0 0,
    calc(100% - 28px) 0,
    100% 50%,
    calc(100% - 28px) 100%,
    0 100%
  ) !important;
}
.feature-slide:last-child{
  clip-path:polygon(
    0 0,
    100% 0,
    100% 100%,
    0 100%,
    28px 50%
  ) !important;
}

/* Effect 17 — 3D Card Tilt aplicado a las imágenes del slider */
.feature-slide:hover{
  transform:perspective(900px) rotateX(3deg) rotateY(-4deg) translateY(-5px) scale(1.018);
  filter:brightness(1.06);
  box-shadow:18px 18px 34px rgba(8,15,28,.28);
  z-index:8;
}

/* Reforzar lenguaje angular en tarjetas de ranking */
.ranking-card{
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
}
.ranking-header{
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
}
.rank-row{
  clip-path:polygon(0 0,100% 0,calc(100% - 7px) 100%,0 100%);
}

/* Effect 20 — Name Glitch para TODOS los rankings */
.rank-row:hover .rank-name{
  animation:rankNameGlitch .42s steps(2,end) infinite;
}
@keyframes rankNameGlitch{
  0%{
    transform:translate(0);
    text-shadow:0 0 0 transparent;
  }
  20%{
    transform:translate(-2px,1px);
    text-shadow:2px 0 var(--pink), -2px 0 var(--cyan);
  }
  40%{
    transform:translate(2px,-1px);
    text-shadow:-2px 0 var(--cyan), 2px 0 var(--pink);
  }
  60%{
    transform:translate(-1px,-1px);
    text-shadow:1px 0 var(--yellow);
  }
  80%{
    transform:translate(1px,1px);
    text-shadow:-1px 0 var(--purple);
  }
  100%{
    transform:translate(0);
    text-shadow:0 0 0 transparent;
  }
}

/* En móvil el chevron conserva la forma sin crear espacios */
@media(max-width:1360px){
  .feature-slide{min-width:33.333333%}
}
@media(max-width:980px){
  .feature-slide{min-width:50%}
}
@media(max-width:720px){
  .feature-slide{
    min-width:100%;
    margin-right:0 !important;
    clip-path:polygon(0 0,calc(100% - 22px) 0,100% 50%,calc(100% - 22px) 100%,0 100%) !important;
  }
}


/* ==========================================================
   v1.2 — Menú principal: 20 · DIAGONAL FILL
   ========================================================== */

/* Quita el subrayado anterior del menú */
.main-nav a::after{
  display:none !important;
}

/* Estado base */
.main-nav a{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:44px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  color:#8b96a4;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
  transition:color .22s ease, transform .18s ease;
}

/* Efecto 20 · Diagonal Fill */
.main-nav a::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-125%;
  top:-26%;
  width:125%;
  height:152%;
  background:var(--purple);
  transform:skewX(-22deg);
  transition:left .28s ease;
}

.main-nav a:hover::before{
  left:-5%;
}

.main-nav a:hover{
  color:#ffffff;
  transform:translateY(-1px);
}

/* Estado activo: mismo lenguaje visual del efecto,
   pero visible permanentemente */
.main-nav a.active{
  color:#ffffff;
}

.main-nav a.active::before{
  left:-5%;
}

/* Preparado para futuros submenús del CMS */
.main-nav .nav-item{
  position:relative;
}

.main-nav .submenu{
  position:absolute;
  left:0;
  top:calc(100% + 8px);
  min-width:220px;
  padding:8px;
  background:#0d1825;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 38px rgba(0,0,0,.32);
  opacity:0;
  visibility:hidden;
  transform:translateY(8px);
  transition:.2s ease;
  z-index:60;
}

.main-nav .nav-item:hover .submenu{
  opacity:1;
  visibility:visible;
  transform:translateY(0);
}

.main-nav .submenu a{
  width:100%;
  justify-content:flex-start;
  min-height:40px;
  padding:0 14px;
  color:#c6cfdb;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
}

.main-nav .submenu a::before{
  left:-125%;
  top:-22%;
  width:125%;
  height:145%;
  background:var(--purple);
  transform:skewX(-22deg);
}

.main-nav .submenu a:hover::before{
  left:-5%;
}

.main-nav .submenu a:hover{
  color:#ffffff;
}


/* ==========================================================
   v1.3 — Corrección del menú para que coincida con la
   referencia "20 · Diagonal Fill" de la galería (imagen 1)
   ========================================================== */

/* barra del menú */
.main-nav{
  display:flex;
  align-items:center;
  gap:16px;
  background:transparent;
}

/* item base: SIN bloque morado de fondo */
.main-nav a{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:44px;
  padding:0 10px 0 22px;
  background:transparent !important;
  color:#d8e0eb !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  overflow:visible !important;
  text-transform:none;
  transition:color .2s ease, transform .18s ease, text-shadow .18s ease;
}

/* cuña/diagonal morada a la izquierda, como la imagen 1 */
.main-nav a::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:8px;
  height:18px;
  transform:translateY(-50%) skewX(-22deg);
  background:linear-gradient(180deg, #9a63ff 0%, #7e4df4 100%);
  z-index:1;
  transition:transform .18s ease, filter .18s ease;
}

/* quitamos cualquier pseudo-elemento viejo del menú */
.main-nav a::after{
  display:none !important;
}

/* texto por encima de la cuña */
.main-nav a > span,
.main-nav a{
  z-index:2;
}

/* hover: sigue siendo "diagonal fill", pero sutil.
   No deja el bloque rectangular como en la imagen 2. */
.main-nav a:hover{
  color:#ffffff !important;
  transform:translateY(-1px);
  text-shadow:0 0 8px rgba(154,99,255,.16);
}
.main-nav a:hover::before{
  transform:translateY(-50%) skewX(-22deg) scale(1.18);
  filter:drop-shadow(0 0 8px rgba(154,99,255,.4));
}

/* activo: también sin bloque lleno; se ve como la referencia */
.main-nav a.active{
  color:#ffffff !important;
  background:transparent !important;
  box-shadow:none !important;
}
.main-nav a.active::before{
  transform:translateY(-50%) skewX(-22deg) scale(1.1);
  filter:drop-shadow(0 0 8px rgba(154,99,255,.28));
}

/* compatibilidad con estructura actual del header */
.site-header .main-nav a{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.site-header .main-nav a:hover,
.site-header .main-nav a.active{
  background:transparent !important;
  color:#ffffff !important;
}

/* submenú preparado con el mismo lenguaje visual */
.main-nav .submenu{
  background:#08111d;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 38px rgba(0,0,0,.32);
  padding:8px;
}
.main-nav .submenu a{
  justify-content:flex-start;
  width:100%;
  min-height:40px;
  padding:0 12px 0 22px;
  color:#c9d2de !important;
}
.main-nav .submenu a::before{
  width:7px;
  height:16px;
}
.main-nav .submenu a:hover,
.main-nav .submenu a.active{
  color:#ffffff !important;
  background:transparent !important;
}

/* responsive */
@media(max-width: 960px){
  .main-nav{
    gap:10px;
    flex-wrap:wrap;
  }
  .main-nav a{
    min-height:40px;
    padding-left:20px;
  }
  .main-nav a::before{
    width:7px;
    height:16px;
  }
}


/* ==========================================================
   v1.5 — MENÚ EXACTO "20 · DIAGONAL FILL"
   Copiado al lenguaje visual del demo en vivo aprobado.
   ========================================================== */

.main-nav{
  display:flex !important;
  gap:8px !important;
  align-items:center !important;
  justify-content:center !important;
  position:relative !important;
  z-index:3 !important;
  background:transparent !important;
}

/* Cada opción del menú */
.main-nav > a,
.main-nav > .nav-item > a{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:46px !important;
  padding:0 20px !important;

  color:#d7dfeb !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  overflow:hidden !important;
  isolation:isolate !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:16px !important;
  line-height:1 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;

  transition:color .2s ease !important;
}

/* El relleno diagonal entra desde la izquierda */
.main-nav > a::before,
.main-nav > .nav-item > a::before{
  content:"" !important;
  position:absolute !important;
  z-index:-1 !important;
  left:-120% !important;
  top:-20% !important;
  width:120% !important;
  height:140% !important;
  background:var(--purple) !important;
  transform:skewX(-22deg) !important;
  transition:left .28s ease !important;
}

/* eliminar efectos viejos */
.main-nav > a::after,
.main-nav > .nav-item > a::after{
  display:none !important;
}

/* Hover y activo = el mismo Diagonal Fill del demo */
.main-nav > a:hover::before,
.main-nav > a.active::before,
.main-nav > .nav-item > a:hover::before,
.main-nav > .nav-item > a.active::before{
  left:-5% !important;
}

.main-nav > a:hover,
.main-nav > a.active,
.main-nav > .nav-item > a:hover,
.main-nav > .nav-item > a.active{
  color:#ffffff !important;
  background:transparent !important;
  transform:none !important;
  text-shadow:none !important;
}

/* -------- SUBMENÚ con el mismo estilo aprobado -------- */
.main-nav .nav-item{
  position:relative !important;
}

.main-nav .submenu{
  position:absolute !important;
  left:0 !important;
  top:calc(100% + 8px) !important;
  min-width:210px !important;
  padding:8px !important;

  background:#0d1825 !important;
  border:1px solid rgba(255,255,255,.08) !important;
  box-shadow:0 18px 35px rgba(0,0,0,.28) !important;

  opacity:0 !important;
  visibility:hidden !important;
  transform:translateY(8px) !important;
  transition:.2s ease !important;
  z-index:80 !important;
}

.main-nav .nav-item:hover .submenu,
.main-nav .nav-item.open .submenu{
  opacity:1 !important;
  visibility:visible !important;
  transform:translateY(0) !important;
}

.main-nav .submenu a{
  position:relative !important;
  display:flex !important;
  justify-content:flex-start !important;
  align-items:center !important;
  min-height:40px !important;
  padding:0 12px !important;

  color:#bdc7d6 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:13px !important;
  letter-spacing:.25px !important;
  text-transform:uppercase !important;

  transition:.2s ease !important;
}

/* En submenú no entra el bloque grande; usa barra diagonal/lineal */
.main-nav .submenu a::before{
  content:none !important;
  display:none !important;
}

.main-nav .submenu a:hover{
  color:#ffffff !important;
  background:linear-gradient(90deg,var(--purple),#101824) !important;
  transform:none !important;
}

/* Ajuste de espacio del header para este menú */
.nav-shell{
  column-gap:14px !important;
}

@media(max-width:1400px){
  .main-nav{
    gap:5px !important;
  }
  .main-nav > a,
  .main-nav > .nav-item > a{
    min-height:44px !important;
    padding:0 15px !important;
    font-size:15px !important;
  }
}

@media(max-width:1100px){
  .main-nav{
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
}


/* ==========================================================
   v1.6 — Header cleanup + footer redesign
   ========================================================== */

/* remove old top mini bar entirely */
.publisher-bar{
  display:none !important;
}

/* header layout: only language selector + login + registro at right side */
.site-header{
  border-top:0 !important;
}
.nav-shell{
  grid-template-columns:auto 150px 1fr 120px 230px 126px !important;
  gap:14px !important;
  min-height:84px !important;
}

.header-register{
  --split-accent: var(--cyan);
  min-width:126px !important;
  min-height:40px !important;
  height:40px !important;
  justify-self:end !important;
  align-self:center !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
  background:#101824 !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}

/* make the right tools area tighter */
.language-switcher{
  width:120px !important;
  justify-self:end !important;
}
.lang-trigger{
  min-width:120px !important;
  width:120px !important;
  min-height:36px !important;
  height:36px !important;
}
.login-box{
  width:230px !important;
  gap:7px !important;
}
.point-field{
  height:34px !important;
}
.point-field input{
  font-size:13px !important;
}
.login-row{
  grid-template-columns:1fr 90px !important;
  gap:8px !important;
}
.login-row .theme-button{
  min-height:34px !important;
  height:34px !important;
  min-width:90px !important;
  font-size:12px !important;
  padding:0 12px !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
}
.main-nav{
  justify-content:center !important;
}

/* footer redesign */
footer{
  padding:0 !important;
}
.site-footer{
  position:relative;
  margin-top:46px;
  background:linear-gradient(90deg,#202020 0%, #2a2a2a 45%, #1f1f1f 100%);
  color:#fff;
  overflow:hidden;
}
.footer-top-angle{
  position:absolute;
  inset:0 0 auto 0;
  height:74px;
  background:linear-gradient(90deg,#242424 0%,#2b2b2b 50%,#212121 100%);
  clip-path:polygon(0 48%,100% 0,100% 100%,0 100%);
  opacity:.95;
}
.footer-main{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:40px;
  padding:74px 0 44px;
}
.footer-columns{
  display:grid;
  grid-template-columns:repeat(2, minmax(150px, 1fr));
  gap:60px;
}
.footer-col{
  display:grid;
  gap:10px;
}
.footer-col a{
  color:#ffffff;
  font-size:14px;
  text-decoration:none;
  transition:color .2s ease;
}
.footer-col a:hover{
  color:var(--purple);
}
.footer-socials{
  display:flex;
  align-items:center;
  gap:18px;
  padding-top:8px;
}
.footer-socials a{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  color:#ffffff;
  text-decoration:none;
  font-size:17px;
  font-weight:900;
  transition:transform .2s ease, color .2s ease;
}
.footer-socials a:hover{
  color:var(--purple);
  transform:translateY(-2px);
}

.site-footer-bottom{
  position:relative;
  z-index:2;
  background:rgba(0,0,0,.12);
  border-top:1px solid rgba(255,255,255,.04);
}
.footer-bottom-inner{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:24px;
  padding:0 0 16px;
}
.footer-theme-btn{
  margin-top:-11px;
  min-width:178px;
  min-height:44px;
  padding:0 20px;
  border-radius:22px;
  border:1px solid rgba(0,0,0,.85);
  background:linear-gradient(180deg,#3a475d 0%, #1a2330 100%);
  color:#ffffff;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif;
  font-size:14px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.14);
}
.footer-bottom-links{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:40px;
  flex:1;
  font-size:14px;
}
.footer-bottom-links span{
  color:#ffffff;
}
.footer-bottom-links b{
  color:var(--purple);
}

@media(max-width:1500px){
  .nav-shell{
    grid-template-columns:auto 140px 1fr 120px 210px 118px !important;
  }
  .main-nav > a,
  .main-nav > .nav-item > a{
    padding:0 16px !important;
    font-size:15px !important;
  }
}
@media(max-width:1240px){
  .nav-shell{
    grid-template-columns:auto 1fr 120px 210px 118px !important;
  }
  .online-box{
    display:none !important;
  }
}
@media(max-width:980px){
  .nav-shell{
    grid-template-columns:1fr !important;
    gap:10px !important;
    padding-top:12px !important;
    padding-bottom:12px !important;
  }
  .brand,
  .main-nav,
  .language-switcher,
  .login-box,
  .header-register{
    justify-self:stretch !important;
  }
  .main-nav{
    justify-content:flex-start !important;
    flex-wrap:wrap !important;
  }
  .header-register{
    width:140px !important;
  }
  .footer-main{
    flex-direction:column;
    gap:24px;
    padding-top:56px;
  }
  .footer-columns{
    gap:28px;
  }
  .footer-bottom-inner{
    flex-direction:column;
    align-items:flex-start;
  }
  .footer-bottom-links{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
}


/* ==========================================================
   v1.7 — Header minimal + footer más fiel a la referencia
   ========================================================== */

/* HEADER: solo selector idioma + Login + Registro a la derecha */
.nav-shell{
  grid-template-columns:auto 150px 1fr 120px auto !important;
  gap:14px !important;
}

.header-actions{
  display:flex;
  align-items:center;
  gap:8px;
  justify-self:end;
}

.header-login,
.header-register{
  min-width:108px !important;
  min-height:36px !important;
  height:36px !important;
  padding:0 16px !important;

  background:#101824 !important;
  color:#ffffff !important;
  border-color:rgba(255,255,255,.08) !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

.header-login{
  --split-accent:var(--cyan);
}
.header-register{
  --split-accent:var(--purple);
}

.login-box,
.login-row,
.point-field{
  display:none !important;
}

/* FOOTER — closer to the exact screenshot structure */
.site-footer{
  position:relative;
  margin-top:52px;
  background:#242424 !important;
  color:#ffffff;
  overflow:hidden;
  padding:0 !important;
}

/* the big slanted top edge */
.footer-slant{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:70px;
  background:#242424;
  clip-path:polygon(0 55%, 100% 0, 100% 100%, 0 100%);
  z-index:0;
}

.footer-content{
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:40px;
  padding-top:82px;
  padding-bottom:34px;
}

.footer-links-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(180px, 1fr));
  gap:150px;
  min-width:650px;
}

.footer-links-col{
  display:grid;
  gap:10px;
}

.footer-links-col a{
  color:#ffffff;
  font-size:14px;
  line-height:1.2;
  text-decoration:none;
  font-weight:600;
}

.footer-links-col a:hover{
  color:var(--purple);
}

.footer-socials{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:24px;
  padding-top:6px;
  padding-right:26px;
}

.footer-socials a{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  color:#ffffff;
  text-decoration:none;
  font-size:20px;
  font-weight:900;
  line-height:1;
  transition:transform .18s ease, color .18s ease;
}

.footer-socials a:hover{
  color:var(--purple);
  transform:translateY(-2px);
}

/* bottom darker strip */
.footer-bottom-band{
  position:relative;
  z-index:2;
  background:#202020;
  min-height:78px;
}

.footer-bottom-row{
  position:relative;
  min-height:78px;
  display:flex;
  align-items:flex-start;
}

/* select theme pill hanging on top-left exactly like reference */
.footer-theme-switch{
  position:absolute;
  left:-84px;
  top:-14px;

  min-width:168px;
  height:44px;
  padding:0 18px;

  border-radius:24px;
  border:1px solid #050505;
  background:linear-gradient(180deg,#46536a 0%,#232a35 58%,#1c222b 100%);
  color:#ffffff;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif;
  font-size:13px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.03em;

  cursor:pointer;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.15),
    0 2px 0 rgba(255,255,255,.05),
    0 6px 16px rgba(0,0,0,.28);
}

/* credits line */
.footer-credits{
  width:100%;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  padding:32px 14px 0 0;
  font-size:13px;
  color:#ffffff;
}

.footer-credits b{
  color:var(--purple);
}

/* remove old footer artifacts */
.footer-main,
.site-footer-bottom,
.footer-bottom-inner,
.footer-bottom-links,
.footer-theme-btn,
.footer-top-angle{
  display:none !important;
}

@media(max-width:1450px){
  .nav-shell{
    grid-template-columns:auto 140px 1fr 118px auto !important;
  }

  .footer-links-grid{
    gap:90px;
    min-width:560px;
  }
}

@media(max-width:1180px){
  .nav-shell{
    grid-template-columns:auto 1fr 118px auto !important;
  }
  .online-box{
    display:none !important;
  }

  .footer-content{
    flex-direction:column;
  }
  .footer-links-grid{
    min-width:0;
    width:100%;
    gap:60px;
  }
  .footer-socials{
    padding-right:0;
  }
}

@media(max-width:860px){
  .nav-shell{
    grid-template-columns:1fr !important;
  }

  .language-switcher,
  .header-actions{
    justify-self:start !important;
  }

  .header-actions{
    flex-wrap:wrap;
  }

  .footer-links-grid{
    grid-template-columns:1fr 1fr;
    gap:24px;
  }

  .footer-credits{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
    padding-top:34px;
  }

  .footer-theme-switch{
    left:0;
  }
}


/* ==========================================================
   v1.8 — footer basado mucho más fielmente en SMF Tricks theme 107
   + Registro usa el mismo celeste que Login/Idioma
   ========================================================== */

/* Header actions: mismo color celeste para Login y Registro */
.header-login,
.header-register{
  --split-accent:var(--cyan) !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}
.header-register::before,
.header-login::before{
  background:var(--cyan) !important;
}

/* eliminar el footer anterior por completo */
.site-footer,
.footer-slant,
.footer-content,
.footer-links-grid,
.footer-links-col,
.footer-socials,
.footer-bottom-band,
.footer-bottom-row,
.footer-theme-switch,
.footer-credits,
.footer-main,
.site-footer-bottom,
.footer-bottom-inner,
.footer-bottom-links,
.footer-theme-btn,
.footer-top-angle{
  display:none !important;
}

/* FOOTER SMF-style */
.smf-footer{
  position:relative;
  margin-top:72px;
  padding:0 !important;
  overflow:visible;
  background:#252525 !important;
  color:#fff;
}

/* gran corte diagonal superior: oscuro sube hacia la derecha */
.smf-footer::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:-68px;
  height:70px;
  background:#252525;
  clip-path:polygon(0 100%,100% 0,100% 100%,0 100%);
  z-index:0;
}

.smf-footer-main{
  position:relative;
  z-index:1;
  background:#252525;
  min-height:104px;
}

.smf-footer-main-inner{
  min-height:104px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:48px;
  padding-top:16px;
  padding-bottom:18px;
}

.smf-footer-links{
  display:grid;
  grid-template-columns:190px 190px;
  column-gap:245px;
}

.smf-footer-col{
  display:grid;
  align-content:start;
  gap:8px;
}

.smf-footer-col a{
  color:#fff;
  text-decoration:none;
  font-family:Arial,Helvetica,sans-serif;
  font-size:13px;
  font-weight:600;
  line-height:1.15;
  transition:color .16s ease;
}
.smf-footer-col a:hover{ color:#954bf2; }

.smf-footer-socials{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:18px;
  padding-top:3px;
  padding-right:24px;
}

.smf-footer-socials .soc{
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  color:#fff;
  text-decoration:none;
  font-family:Arial,Helvetica,sans-serif;
  font-weight:900;
  font-size:22px;
  line-height:1;
  transition:color .16s ease, transform .16s ease;
}
.smf-footer-socials .soc:hover{
  color:#954bf2;
  transform:translateY(-1px);
}
.smf-footer-socials .youtube{font-size:17px}
.smf-footer-socials .twitch{font-size:19px}
.smf-footer-socials .instagram{font-size:25px}

.smf-footer-lower{
  position:relative;
  z-index:2;
  min-height:78px;
  background:#202020;
}

.smf-footer-lower-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding-top:14px;
}

/* píldora Select Theme superpuesta exactamente en el borde */
.smf-theme-select{
  position:absolute;
  left:10px;
  top:-13px;
  z-index:4;
  min-width:144px;
  height:43px;
  padding:0 15px 0 12px;
  border-radius:24px;
  border:1px solid #050505;
  background:linear-gradient(180deg,#3b4657 0%,#2a3340 55%,#1c222b 100%);
  color:#fff;
  font-family:Arial,Helvetica,sans-serif;
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.01em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 1px 0 rgba(255,255,255,.05);
  cursor:pointer;
}
.smf-theme-select .dots{
  display:inline-block;
  margin-right:7px;
  font-size:19px;
  line-height:0;
  vertical-align:-2px;
}

.smf-theme-credit,
.smf-version{
  color:#fff;
  font-family:Arial,Helvetica,sans-serif;
  font-size:12px;
  font-weight:600;
}
.smf-theme-credit{ padding-left:84px; }
.smf-theme-credit b{ color:#954bf2; font-weight:500; }
.smf-version{ margin-left:auto; padding-right:14px; }

@media(max-width:1200px){
  .smf-footer-links{column-gap:120px}
}
@media(max-width:900px){
  .smf-footer-main-inner{flex-direction:column;gap:20px;padding-top:18px}
  .smf-footer-links{width:100%;grid-template-columns:1fr 1fr;column-gap:30px}
  .smf-footer-socials{padding-right:0}
  .smf-footer-lower-inner{flex-direction:column;align-items:flex-start;justify-content:center;gap:6px;padding:26px 0 12px}
  .smf-theme-credit{padding-left:0}
  .smf-version{margin-left:0;padding-right:0}
}


/* v1.9 — Footer cleanup */
.footer-theme-switch,
.footer-theme-btn{
  display:none !important;
}

.footer-credits{
  justify-content:flex-start !important;
}

.footer-bottom-row{
  min-height:54px !important;
}

.site-footer-bottom,
.footer-bottom-band{
  min-height:auto !important;
}


/* ==========================================================
   v2.0 — Footer cleanup + gallery
   ========================================================== */

.footer-theme-switch,
.footer-theme-btn{
  display:none !important;
}

.footer-bottom-row{
  justify-content:flex-end !important;
}

.footer-credits{
  width:100% !important;
  padding-left:0 !important;
}

/* space correction after removing select theme */
.footer-bottom-band{
  padding-top:0 !important;
}


/* ==========================================================
   v2.2 — Footer rediseñado según la referencia del usuario
   ========================================================== */

/* Hide all legacy footer controls/artifacts */
.footer-theme-switch,
.footer-theme-btn,
.footer-top-angle,
.footer-slant,
.footer-content,
.footer-bottom-band,
.footer-bottom-row,
.footer-credits,
.site-footer-bottom,
.footer-main{
  display:none !important;
}

/* New footer */
.site-footer-v22{
  position:relative;
  margin-top:56px;
  padding:0 !important;
  background:#252525 !important;
  color:#ffffff;
  overflow:hidden;
  min-height:250px;
}

/* Big single diagonal top edge, like the user's current footer */
.footer-v22-slope{
  position:absolute;
  inset:0 0 auto 0;
  height:72px;
  background:#252525;
  clip-path:polygon(0 62%,100% 0,100% 100%,0 100%);
  z-index:1;
}

.footer-v22-main{
  position:relative;
  z-index:2;
  min-height:176px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:48px;
  padding-top:84px;
  padding-bottom:28px;
}

/* two sparse columns just like the reference */
.footer-v22-links{
  display:grid;
  grid-template-columns:170px 170px;
  gap:265px;
}

.footer-v22-col{
  display:grid;
  gap:10px;
}

.footer-v22-col a{
  color:#ffffff;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  line-height:1.1;
  transition:color .16s ease;
}

.footer-v22-col a:hover{
  color:var(--purple);
}

/* social icons on the right */
.footer-v22-socials{
  display:flex;
  align-items:center;
  gap:22px;
  padding-top:4px;
  padding-right:42px;
}

.footer-v22-socials a{
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  color:#ffffff;
  transition:transform .16s ease, color .16s ease;
}

.footer-v22-socials a:hover{
  color:var(--purple);
  transform:translateY(-2px);
}

.footer-v22-socials svg{
  width:22px;
  height:22px;
  fill:currentColor;
}

/* bottom strip */
.footer-v22-bottom{
  position:relative;
  z-index:2;
  min-height:78px;
  background:#202020;
}

.footer-v22-bottom-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  padding-left:86px;
  font-size:14px;
}

.footer-v22-bottom-inner span{
  color:#ffffff;
}

.footer-v22-bottom-inner b{
  color:var(--purple);
}

/* Absolutely remove any SELECT THEME artifact */
.site-footer-v22 button{
  display:none !important;
}

@media(max-width:1300px){
  .footer-v22-links{
    gap:150px;
  }
}

@media(max-width:980px){
  .footer-v22-main{
    flex-direction:column;
    gap:24px;
    padding-top:72px;
  }

  .footer-v22-links{
    width:100%;
    gap:50px;
  }

  .footer-v22-socials{
    padding-right:0;
  }

  .footer-v22-bottom-inner{
    padding-left:0;
  }
}

@media(max-width:620px){
  .footer-v22-links{
    grid-template-columns:1fr 1fr;
    gap:24px;
  }
  .footer-v22-socials{
    gap:14px;
  }
}


/* ==========================================================
   v2.3 — footer aplicado + sin SELECT THEME
   ========================================================== */

/* kill any legacy footer switch/button forever */
.footer-theme-switch,
.footer-theme-btn,
.footer-theme-button,
.theme-select,
.site-footer .footer-theme-switch,
.site-footer .footer-theme-btn{
  display:none !important;
  visibility:hidden !important;
  opacity:0 !important;
  pointer-events:none !important;
}

/* applied footer */
.site-footer-v23{
  position:relative;
  margin-top:56px;
  background:#252525 !important;
  color:#fff;
  overflow:hidden;
  min-height:242px;
  isolation:isolate;
}

.site-footer-v23 .footer-v23-roof{
  position:absolute;
  inset:0 0 auto 0;
  height:78px;
  background:#2a2a2a;
  clip-path:polygon(0 74%,100% 0,100% 100%,0 100%);
  z-index:0;
}

.site-footer-v23 .footer-v23-main{
  position:relative;
  z-index:1;
  min-height:170px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:40px;
  padding-top:92px;
  padding-bottom:24px;
}

.site-footer-v23 .footer-v23-links{
  display:grid;
  grid-template-columns:160px 160px;
  gap:280px;
}

.site-footer-v23 .footer-v23-col{
  display:grid;
  gap:10px;
}

.site-footer-v23 .footer-v23-col a{
  color:#fff;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  transition:color .18s ease;
}
.site-footer-v23 .footer-v23-col a:hover{color:var(--purple)}

.site-footer-v23 .footer-v23-socials{
  display:flex;
  align-items:center;
  gap:32px;
  padding-top:4px;
  padding-right:46px;
}
.site-footer-v23 .footer-v23-socials a{
  color:#fff;
  text-decoration:none;
  font-size:18px;
  font-weight:900;
  line-height:1;
  transition:transform .18s ease, color .18s ease;
}
.site-footer-v23 .footer-v23-socials a:hover{
  transform:translateY(-2px);
  color:var(--purple);
}

.site-footer-v23 .footer-v23-bottom{
  position:relative;
  z-index:1;
  background:#202020;
  min-height:78px;
}
.site-footer-v23 .footer-v23-bottom-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:84px;
  font-size:14px;
}
.site-footer-v23 .footer-v23-bottom-inner b{color:var(--purple)}

@media(max-width:1200px){
  .site-footer-v23 .footer-v23-links{gap:120px}
}
@media(max-width:900px){
  .site-footer-v23 .footer-v23-main{
    flex-direction:column;
    gap:24px;
    padding-top:76px;
  }
  .site-footer-v23 .footer-v23-links{gap:48px}
  .site-footer-v23 .footer-v23-socials{padding-right:0}
  .site-footer-v23 .footer-v23-bottom-inner{padding-left:0}
}
@media(max-width:640px){
  .site-footer-v23 .footer-v23-links{
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  .site-footer-v23 .footer-v23-socials{gap:18px}
}


/* ==========================================================
   v2.4 — FOOTER 07 · RIGHT CREST
   ========================================================== */

/* Completely suppress any legacy footer controls */
.footer-theme-switch,
.footer-theme-btn,
.footer-theme-button,
.theme-select,
.site-footer button{
  display:none !important;
}

/* Hide older applied footer variants */
.site-footer-v22,
.site-footer-v23{
  display:none !important;
}

/* Main footer */
.site-footer-v24{
  position:relative;
  display:block !important;
  margin-top:56px;
  min-height:248px;
  padding:0 !important;
  background:linear-gradient(90deg,#1d1d1d 0%,#292929 58%,#202020 100%) !important;
  color:#ffffff;
  overflow:hidden;
  isolation:isolate;
}

/* Gallery #7 base top slope */
.footer-v24-topshape{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:78px;
  background:#292929;
  clip-path:polygon(0 70%,84% 20%,100% 0,100% 100%,0 100%);
  z-index:0;
}

/* Gallery #7 right crest */
.footer-v24-side{
  position:absolute;
  right:0;
  top:0;
  width:24%;
  height:78px;
  background:#323232;
  clip-path:polygon(8% 10%,100% 0,100% 100%,0 100%);
  z-index:1;
}

.footer-v24-main{
  position:relative;
  z-index:2;
  min-height:170px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:40px;
  padding-top:90px;
  padding-bottom:24px;
}

.footer-v24-links{
  display:grid;
  grid-template-columns:160px 160px;
  gap:270px;
}

.footer-v24-col{
  display:grid;
  gap:10px;
}

.footer-v24-col a{
  color:#ffffff;
  text-decoration:none;
  font-size:14px;
  font-weight:600;
  line-height:1.1;
  transition:color .18s ease, transform .18s ease;
}

.footer-v24-col a:hover{
  color:var(--purple);
  transform:translateX(3px);
}

.footer-v24-socials{
  display:flex;
  align-items:center;
  gap:28px;
  padding-top:4px;
  padding-right:44px;
}

.footer-v24-socials a{
  color:#ffffff;
  text-decoration:none;
  font-size:18px;
  font-weight:900;
  line-height:1;
  transition:color .18s ease, transform .18s ease;
}

.footer-v24-socials a:hover{
  color:var(--purple);
  transform:translateY(-2px);
}

.footer-v24-bottom{
  position:relative;
  z-index:3;
  min-height:78px;
  background:#202020;
}

.footer-v24-bottom-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:84px;
  font-size:14px;
}

.footer-v24-bottom-inner span{
  color:#ffffff;
}

.footer-v24-bottom-inner b{
  color:var(--purple);
}

@media(max-width:1200px){
  .footer-v24-links{
    gap:120px;
  }
  .footer-v24-socials{
    padding-right:18px;
  }
}

@media(max-width:900px){
  .footer-v24-main{
    flex-direction:column;
    gap:24px;
    padding-top:76px;
  }

  .footer-v24-links{
    gap:48px;
  }

  .footer-v24-socials{
    padding-right:0;
  }

  .footer-v24-bottom-inner{
    padding-left:0;
  }
}

@media(max-width:640px){
  .footer-v24-links{
    grid-template-columns:1fr 1fr;
    gap:22px;
  }

  .footer-v24-socials{
    gap:18px;
  }

  .footer-v24-side{
    width:34%;
  }
}


/* ==========================================================
   v2.5 — FOOTER sin franja superior + efectos
   ========================================================== */

/* Kill every old footer variant and SELECT THEME remnants */
.footer-theme-switch,
.footer-theme-btn,
.footer-theme-button,
.theme-select,
.site-footer-v22,
.site-footer-v23,
.site-footer-v24,
.site-footer button{
  display:none !important;
}

/* Main footer shape:
   the footer itself is cut diagonally, so there is NO separate gray strip */
.site-footer-v25{
  position:relative;
  display:block !important;
  margin-top:56px;
  min-height:252px;
  padding:0 !important;
  background:#222222 !important;
  color:#ffffff;
  overflow:hidden;
  isolation:isolate;
  clip-path:polygon(0 42px,100% 0,100% 100%,0 100%);
}

/* Thin accent line following the diagonal top edge */
.footer-v25-edge{
  position:absolute;
  left:-1%;
  top:24px;
  width:102%;
  height:3px;
  background:#16d7e8;
  transform:rotate(-1.25deg);
  transform-origin:left center;
  z-index:2;
  box-shadow:
    0 0 8px rgba(22,215,232,.45),
    0 0 18px rgba(22,215,232,.18);
  animation:footerEdgePulse 2.4s ease-in-out infinite alternate;
}

@keyframes footerEdgePulse{
  from{
    opacity:.45;
    box-shadow:
      0 0 6px rgba(22,215,232,.28),
      0 0 12px rgba(22,215,232,.10);
  }
  to{
    opacity:1;
    box-shadow:
      0 0 10px rgba(22,215,232,.58),
      0 0 22px rgba(22,215,232,.22);
  }
}

/* Main content */
.footer-v25-main{
  position:relative;
  z-index:3;
  min-height:174px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:44px;
  padding-top:92px;
  padding-bottom:26px;
}

/* Links */
.footer-v25-links{
  display:grid;
  grid-template-columns:160px 160px;
  gap:270px;
}

.footer-v25-col{
  display:grid;
  gap:10px;
}

.footer-v25-col a{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  width:max-content;
  min-width:122px;
  min-height:26px;
  display:flex;
  align-items:center;
  padding:0 10px 0 12px;

  color:#ffffff;
  text-decoration:none;
  font-size:14px;
  font-weight:600;

  clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);
  transition:color .2s ease, transform .18s ease;
}

/* Diagonal Fill effect on footer links */
.footer-v25-col a::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-125%;
  top:-30%;
  width:125%;
  height:165%;
  background:#8c5cf5;
  transform:skewX(-22deg);
  transition:left .25s ease;
}

.footer-v25-col a:hover::before{
  left:-5%;
}

.footer-v25-col a:hover{
  color:#ffffff;
  transform:translateX(4px);
}

.footer-v25-col a span{
  position:relative;
  z-index:1;
}

/* Social icons */
.footer-v25-socials{
  display:flex;
  align-items:center;
  gap:26px;
  padding-top:4px;
  padding-right:44px;
}

.footer-v25-socials a{
  --social:#16d7e8;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;

  color:#ffffff;
  text-decoration:none;
  font-size:18px;
  font-weight:900;
  line-height:1;

  border:1px solid transparent;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  transition:transform .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.footer-v25-socials .social-cyan{--social:#16d7e8}
.footer-v25-socials .social-pink{--social:#ff4fb1}
.footer-v25-socials .social-yellow{--social:#f0d716}
.footer-v25-socials .social-purple{--social:#8c5cf5}

.footer-v25-socials a:hover{
  color:#ffffff;
  border-color:var(--social);
  transform:translateY(-3px) scale(1.06);
  animation:footerSocialPulse .8s ease-in-out infinite alternate;
}

@keyframes footerSocialPulse{
  from{
    box-shadow:
      inset 0 0 8px rgba(255,255,255,.02),
      0 0 7px color-mix(in srgb,var(--social) 35%,transparent);
  }
  to{
    box-shadow:
      inset 0 0 13px color-mix(in srgb,var(--social) 14%,transparent),
      0 0 15px color-mix(in srgb,var(--social) 72%,transparent),
      0 0 30px color-mix(in srgb,var(--social) 26%,transparent);
  }
}

/* Bottom strip */
.footer-v25-bottom{
  position:relative;
  z-index:3;
  min-height:78px;
  background:#1d1d1d;
  border-top:1px solid rgba(255,255,255,.035);
}

.footer-v25-bottom::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:2px;
  background:#8c5cf5;
  animation:footerBottomLine 5s ease-in-out infinite;
}

@keyframes footerBottomLine{
  0%{width:0;left:0;opacity:0}
  12%{opacity:1}
  50%{width:100%;left:0;opacity:.8}
  88%{opacity:1}
  100%{width:0;left:100%;opacity:0}
}

.footer-v25-bottom-inner{
  min-height:78px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  padding-left:84px;
  font-size:14px;
}

.footer-v25-bottom-inner span{
  color:#ffffff;
}

.footer-v25-bottom-inner b{
  position:relative;
  display:inline-block;
  color:#8c5cf5;
  transition:text-shadow .18s ease;
}

.footer-v25-bottom-inner b:hover{
  text-shadow:
    2px 0 #ff4fb1,
    -2px 0 #16d7e8;
  animation:footerCreditGlitch .42s steps(2,end) infinite;
}

@keyframes footerCreditGlitch{
  0%,100%{transform:translate(0)}
  25%{transform:translate(-1px,1px)}
  50%{transform:translate(1px,-1px)}
  75%{transform:translate(-1px,-1px)}
}

/* Responsive */
@media(max-width:1200px){
  .footer-v25-links{
    gap:120px;
  }
  .footer-v25-socials{
    padding-right:18px;
  }
}

@media(max-width:900px){
  .site-footer-v25{
    clip-path:polygon(0 28px,100% 0,100% 100%,0 100%);
  }

  .footer-v25-edge{
    top:16px;
    transform:rotate(-1.7deg);
  }

  .footer-v25-main{
    flex-direction:column;
    gap:24px;
    padding-top:74px;
  }

  .footer-v25-links{
    gap:48px;
  }

  .footer-v25-socials{
    padding-right:0;
  }

  .footer-v25-bottom-inner{
    padding-left:0;
  }
}

@media(max-width:640px){
  .footer-v25-links{
    grid-template-columns:1fr 1fr;
    gap:22px;
  }

  .footer-v25-socials{
    gap:14px;
    flex-wrap:wrap;
  }
}


/* ==========================================================
   v2.7 — FOOTER EFFECT 12 · PREMIUM MIX
   Aplicado al footer real
   ========================================================== */

/* base footer stays the same; only effects are changed/applied */

/* 1) RGB / multi-accent edge moving over the diagonal top */
.site-footer-v25::before{
  content:"";
  position:absolute;
  left:-1%;
  top:22px;
  width:102%;
  height:3px;
  z-index:6;

  background:linear-gradient(
    90deg,
    var(--cyan),
    var(--purple),
    var(--pink),
    var(--cyan)
  );
  background-size:180% 100%;

  transform:rotate(-1.2deg);
  transform-origin:left center;

  box-shadow:
    0 0 8px rgba(22,215,232,.32),
    0 0 18px rgba(140,92,245,.18);

  animation:footerPremiumEdge 3s linear infinite;
}

@keyframes footerPremiumEdge{
  from{background-position:0 0}
  to{background-position:180% 0}
}

/* remove previous single-color edge so only Premium Mix edge remains */
.footer-v25-edge{
  display:none !important;
}

/* 2) Diagonal Fill on footer links */
.site-footer-v25 .footer-v25-col a{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  width:max-content;
  min-width:120px;
  padding:5px 10px 5px 12px;

  clip-path:polygon(
    7px 0,
    100% 0,
    calc(100% - 7px) 100%,
    0 100%
  );

  transition:transform .18s ease,color .18s ease;
}

.site-footer-v25 .footer-v25-col a::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-125%;
  top:-30%;
  width:125%;
  height:165%;

  background:var(--purple);
  transform:skewX(-22deg);
  transition:left .25s ease;
}

.site-footer-v25 .footer-v25-col a:hover::before{
  left:-5%;
}

.site-footer-v25 .footer-v25-col a:hover{
  color:#ffffff;
  transform:translateX(4px);
}

/* 3) Social glow / lift */
.site-footer-v25 .footer-v25-socials a{
  transition:
    transform .18s ease,
    color .18s ease,
    text-shadow .18s ease,
    filter .18s ease;
}

.site-footer-v25 .footer-v25-socials a:hover{
  transform:translateY(-4px) scale(1.06);
  color:var(--cyan);
  text-shadow:
    0 0 8px rgba(22,215,232,.72),
    0 0 18px rgba(22,215,232,.42);
  filter:brightness(1.12);
}

/* keep per-social accent variation subtly */
.site-footer-v25 .footer-v25-socials .social-pink:hover{
  color:var(--pink);
  text-shadow:0 0 8px rgba(255,79,177,.72),0 0 18px rgba(255,79,177,.42);
}
.site-footer-v25 .footer-v25-socials .social-yellow:hover{
  color:var(--yellow);
  text-shadow:0 0 8px rgba(240,215,22,.72),0 0 18px rgba(240,215,22,.42);
}
.site-footer-v25 .footer-v25-socials .social-purple:hover{
  color:var(--purple);
  text-shadow:0 0 8px rgba(140,92,245,.72),0 0 18px rgba(140,92,245,.42);
}

/* 4) Animated pink energy line on bottom band */
.site-footer-v25 .footer-v25-bottom::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:2px;

  background:var(--pink);
  box-shadow:0 0 10px rgba(255,79,177,.44);

  animation:footerPremiumBottom 4.5s ease-in-out infinite;
}

@keyframes footerPremiumBottom{
  0%{
    width:0;
    left:0;
    opacity:0;
  }
  12%{opacity:1}
  50%{
    width:100%;
    left:0;
    opacity:.92;
  }
  88%{opacity:1}
  100%{
    width:0;
    left:100%;
    opacity:0;
  }
}

/* 5) NYXCMS subtle premium glow on hover */
.site-footer-v25 .footer-v25-bottom-inner b{
  transition:
    color .18s ease,
    text-shadow .18s ease,
    transform .18s ease;
}

.site-footer-v25 .footer-v25-bottom-inner b:hover{
  color:#ffffff;
  transform:translateY(-1px);
  text-shadow:
    2px 0 var(--pink),
    -2px 0 var(--cyan),
    0 0 12px rgba(140,92,245,.48);
}


/* ==========================================================
   v2.8 — FIX FOOTER EFFECT 12
   Ahora sí con DOS líneas visibles:
   1) línea superior cian sobre la diagonal
   2) línea inferior rosa en la franja baja
   ========================================================== */

/* Top line: clear visible cyan line across the diagonal */
.site-footer-v25::before{
  content:"";
  position:absolute;
  left:56%;
  right:-1%;
  top:16px;
  height:3px;
  z-index:8;

  background:#16d7e8;
  transform:rotate(-1.25deg);
  transform-origin:right center;

  box-shadow:
    0 0 8px rgba(22,215,232,.45),
    0 0 16px rgba(22,215,232,.20);

  animation:footerTopCyanPulse 2.2s ease-in-out infinite alternate;
}

/* Small pink accent segment on the upper line, like the gallery sample */
.site-footer-v25::after{
  content:"";
  position:absolute;
  left:26%;
  width:80px;
  top:17px;
  height:3px;
  z-index:9;

  background:#ff4fb1;
  transform:rotate(-1.25deg);
  transform-origin:left center;

  box-shadow:
    0 0 8px rgba(255,79,177,.42),
    0 0 14px rgba(255,79,177,.18);

  animation:footerTopPinkPulse 2s ease-in-out infinite alternate;
}

@keyframes footerTopCyanPulse{
  from{
    opacity:.55;
    box-shadow:
      0 0 6px rgba(22,215,232,.28),
      0 0 12px rgba(22,215,232,.10);
  }
  to{
    opacity:1;
    box-shadow:
      0 0 10px rgba(22,215,232,.58),
      0 0 20px rgba(22,215,232,.24);
  }
}

@keyframes footerTopPinkPulse{
  from{
    opacity:.45;
    box-shadow:
      0 0 6px rgba(255,79,177,.24),
      0 0 10px rgba(255,79,177,.08);
  }
  to{
    opacity:1;
    box-shadow:
      0 0 10px rgba(255,79,177,.52),
      0 0 18px rgba(255,79,177,.20);
  }
}

/* Bottom line kept clearly visible */
.site-footer-v25 .footer-v25-bottom::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:2px;
  background:#ff4fb1;
  box-shadow:0 0 10px rgba(255,79,177,.42);
  animation:footerPremiumBottomGlow 2.3s ease-in-out infinite alternate;
}

@keyframes footerPremiumBottomGlow{
  from{
    opacity:.55;
    box-shadow:0 0 8px rgba(255,79,177,.28);
  }
  to{
    opacity:1;
    box-shadow:0 0 14px rgba(255,79,177,.48), 0 0 24px rgba(255,79,177,.14);
  }
}

/* Keep Premium Mix interactions */
.site-footer-v25 .footer-v25-col a{
  position:relative;
  overflow:hidden;
  isolation:isolate;
  width:max-content;
  min-width:120px;
  padding:5px 10px 5px 12px;
  clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);
  transition:transform .18s ease,color .18s ease;
}

.site-footer-v25 .footer-v25-col a::before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-125%;
  top:-30%;
  width:125%;
  height:165%;
  background:var(--purple);
  transform:skewX(-22deg);
  transition:left .25s ease;
}

.site-footer-v25 .footer-v25-col a:hover::before{
  left:-5%;
}

.site-footer-v25 .footer-v25-col a:hover{
  color:#ffffff;
  transform:translateX(4px);
}

.site-footer-v25 .footer-v25-socials a{
  transition:
    transform .18s ease,
    color .18s ease,
    text-shadow .18s ease,
    filter .18s ease;
}

.site-footer-v25 .footer-v25-socials a:hover{
  transform:translateY(-4px) scale(1.06);
  color:var(--cyan);
  text-shadow:
    0 0 8px rgba(22,215,232,.72),
    0 0 18px rgba(22,215,232,.42);
  filter:brightness(1.12);
}

.site-footer-v25 .footer-v25-socials .social-pink:hover{
  color:var(--pink);
  text-shadow:0 0 8px rgba(255,79,177,.72),0 0 18px rgba(255,79,177,.42);
}
.site-footer-v25 .footer-v25-socials .social-yellow:hover{
  color:var(--yellow);
  text-shadow:0 0 8px rgba(240,215,22,.72),0 0 18px rgba(240,215,22,.42);
}
.site-footer-v25 .footer-v25-socials .social-purple:hover{
  color:var(--purple);
  text-shadow:0 0 8px rgba(140,92,245,.72),0 0 18px rgba(140,92,245,.42);
}

.site-footer-v25 .footer-v25-bottom-inner b{
  transition:color .18s ease, text-shadow .18s ease, transform .18s ease;
}
.site-footer-v25 .footer-v25-bottom-inner b:hover{
  color:#ffffff;
  transform:translateY(-1px);
  text-shadow:
    2px 0 var(--pink),
    -2px 0 var(--cyan),
    0 0 12px rgba(140,92,245,.48);
}


/* ==========================================================
   v2.9 — FOOTER 12 · PREMIUM MIX
   Copiado fielmente del footer_effects_gallery subido por el usuario.
   ========================================================== */

/* Remove/hide every previous footer version/effect to avoid interference. */
.site-footer-v22,
.site-footer-v23,
.site-footer-v24,
.site-footer-v25,
.footer-theme-switch,
.footer-theme-btn,
.footer-theme-button,
.theme-select{
  display:none !important;
}

/* Reset the outer footer wrapper. */
.site-footer-v29{
  display:block !important;
  margin-top:56px !important;
  padding:0 !important;
  background:transparent !important;
  overflow:visible !important;
}

/* === Exact base .ft from the gallery === */
.site-footer-v29 .ft{
  --accent:var(--cyan);
  position:relative;
  min-height:250px;
  background:#232323;
  color:#fff;
  overflow:hidden;
  clip-path:polygon(0 40px,100% 0,100% 100%,0 100%);
}

.site-footer-v29 .ft .inner{
  position:relative;
  z-index:4;
  padding:88px 34px 0;
}

.site-footer-v29 .ft .top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:40px;
}

.site-footer-v29 .ft .links{
  display:grid;
  grid-template-columns:160px 160px;
  gap:240px;
}

.site-footer-v29 .ft .col{
  display:grid;
  gap:10px;
}

.site-footer-v29 .ft a{
  color:#fff;
  text-decoration:none;
}

.site-footer-v29 .ft .col a{
  font-size:14px;
  font-weight:600;
  position:relative;
}

.site-footer-v29 .ft .socials{
  display:flex;
  gap:24px;
  padding-right:24px;
}

.site-footer-v29 .ft .socials a{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  font-weight:900;
  font-size:18px;
  position:relative;
}

.site-footer-v29 .ft .bottom{
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  min-height:72px;
  display:flex;
  align-items:center;
  padding:0 34px;
  background:#1d1d1d;
}

.site-footer-v29 .ft .bottom b{
  color:var(--purple);
}

/* === Exact FX12 · Premium Mix === */
.site-footer-v29.fx12 .ft:before{
  content:"";
  position:absolute;
  left:-1%;
  top:22px;
  width:102%;
  height:3px;
  transform:rotate(-1.2deg);
  transform-origin:left;
  background:linear-gradient(90deg,var(--cyan),var(--purple),var(--pink));
  background-size:180% 100%;
  animation:v29RgbMove 3s linear infinite;
  box-shadow:0 0 12px rgba(22,215,232,.4);
}

@keyframes v29RgbMove{
  to{background-position:180% 0}
}

.site-footer-v29.fx12 .col a{
  overflow:hidden;
  isolation:isolate;
  width:max-content;
  min-width:120px;
  padding:5px 10px 5px 12px;
  clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);
}

.site-footer-v29.fx12 .col a:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-125%;
  top:-30%;
  width:125%;
  height:165%;
  background:var(--purple);
  transform:skewX(-22deg);
  transition:.25s;
}

.site-footer-v29.fx12 .col a:hover:before{
  left:-5%;
}

.site-footer-v29.fx12 .socials a{
  transition:.18s;
}

.site-footer-v29.fx12 .socials a:hover{
  transform:translateY(-4px);
  color:var(--cyan);
  text-shadow:0 0 12px rgba(22,215,232,.7);
}

.site-footer-v29.fx12 .bottom:before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:0;
  height:2px;
  background:var(--pink);
  animation:v29BottomPulse 4.5s ease-in-out infinite;
}

@keyframes v29BottomPulse{
  0%{width:0;left:0}
  50%{width:100%;left:0}
  100%{width:0;left:100%}
}

/* Responsive behaviour adapted from the gallery without changing the visual idea. */
@media(max-width:1150px){
  .site-footer-v29 .ft .top{
    flex-direction:column;
  }

  .site-footer-v29 .ft .links{
    gap:40px;
  }

  .site-footer-v29 .ft .socials{
    padding-right:0;
  }
}

@media(max-width:640px){
  .site-footer-v29 .ft .links{
    grid-template-columns:1fr 1fr;
    gap:20px;
  }

  .site-footer-v29 .ft .inner{
    padding-left:22px;
    padding-right:22px;
  }
}


/* ==========================================================
   v3.0 — NEW FOOTER CONCEPT
   Diseño nuevo a criterio del asistente:
   mismo lenguaje del menú, colorimetría cian/rosa/navy,
   cortes angulares, glow sutil y hover coherente.
   ========================================================== */

.site-footer-v30{
  position:relative;
  margin-top:72px;
  color:#fff;
  overflow:hidden;
}

.footer30-shell{
  position:relative;
  background:
    radial-gradient(1200px 220px at 70% -20%, rgba(19,217,228,.10), transparent 55%),
    radial-gradient(700px 180px at 15% 0%, rgba(255,73,177,.08), transparent 55%),
    linear-gradient(180deg, #0a121d 0%, #09121d 58%, #081018 100%);
  border-top:1px solid rgba(255,255,255,.06);
}

.footer30-shell::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.02), rgba(255,255,255,0) 26%, rgba(255,255,255,.02) 52%, rgba(255,255,255,0) 78%);
  pointer-events:none;
}

.footer30-topline{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:linear-gradient(90deg, var(--cyan) 0 52%, var(--pink) 52% 76%, transparent 76% 100%);
  box-shadow:0 0 14px rgba(19,217,228,.28);
}

.footer30-topline::after{
  content:"";
  position:absolute;
  top:0;
  left:-18%;
  width:22%;
  height:100%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.85), transparent);
  opacity:.55;
  animation:footer30Scan 5.2s linear infinite;
}

@keyframes footer30Scan{
  to{ left:104%; }
}

.footer30-main{
  position:relative;
  display:grid;
  grid-template-columns:1.25fr .8fr .8fr .9fr;
  gap:42px;
  padding:48px 0 34px;
}

.footer30-brand{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:18px;
  padding:18px 20px 18px 18px;
  background:linear-gradient(180deg, rgba(16,24,36,.82), rgba(9,18,29,.88));
  border:1px solid rgba(255,255,255,.06);
  clip-path:polygon(16px 0,100% 0,calc(100% - 22px) 100%,0 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.footer30-brand::after{
  content:"";
  position:absolute;
  left:0;
  right:22px;
  bottom:0;
  height:2px;
  background:linear-gradient(90deg, var(--cyan), var(--pink));
  opacity:.92;
}

.footer30-mark{
  flex:0 0 58px;
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg, #101824, #0a121d);
  border:1px solid rgba(19,217,228,.24);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
  font-family:Georgia,serif;
  font-style:italic;
  font-weight:900;
  font-size:34px;
  color:#e7ba65;
  text-shadow:0 0 16px rgba(231,186,101,.18);
}

.footer30-copy strong{
  display:block;
  font-family:var(--display-font);
  font-style:italic;
  font-size:30px;
  line-height:1;
  letter-spacing:.6px;
  color:#fff;
}

.footer30-copy small{
  display:block;
  margin-top:3px;
  color:#8e99a8;
  letter-spacing:.18em;
  font-size:11px;
}

.footer30-copy p{
  margin:12px 0 0;
  max-width:430px;
  color:#a5afbc;
  line-height:1.55;
  font-size:14px;
}

.footer30-col h4{
  margin:2px 0 14px;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-size:22px;
  line-height:1;
  letter-spacing:.5px;
  text-transform:uppercase;
}

.footer30-col{
  display:grid;
  align-content:start;
  gap:10px;
}

.footer30-col a{
  position:relative;
  width:max-content;
  padding:7px 14px 7px 14px;
  color:#d8e1ed;
  font-size:14px;
  font-weight:600;
  background:rgba(255,255,255,.02);
  border:1px solid rgba(255,255,255,.05);
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
  transition:transform .16s ease, color .16s ease, border-color .16s ease, background .16s ease;
}

.footer30-col a::before{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:2px;
  background:linear-gradient(90deg, var(--cyan), var(--pink));
  opacity:.88;
  transform:scaleX(.28);
  transform-origin:left center;
  transition:transform .18s ease;
}

.footer30-col a:hover{
  transform:translateX(3px);
  color:#fff;
  border-color:rgba(19,217,228,.26);
  background:rgba(19,217,228,.05);
}

.footer30-col a:hover::before{
  transform:scaleX(1);
}

.footer30-side{
  display:grid;
  align-content:start;
  justify-items:end;
  gap:18px;
}

.footer30-socials{
  display:flex;
  gap:12px;
}

.footer30-socials a{
  width:48px;
  height:42px;
  display:grid;
  place-items:center;
  background:linear-gradient(180deg, #111b28, #0a121d);
  border:1px solid rgba(255,255,255,.06);
  color:#fff;
  font-size:18px;
  font-weight:900;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
  box-shadow:inset 0 -2px 0 rgba(19,217,228,.70);
  transition:transform .16s ease, box-shadow .16s ease, color .16s ease, border-color .16s ease;
}

.footer30-socials a:hover{
  transform:translateY(-3px);
  color:var(--cyan);
  border-color:rgba(19,217,228,.34);
  box-shadow:inset 0 -2px 0 rgba(255,73,177,.88), 0 0 18px rgba(19,217,228,.22);
}

.footer30-cta{
  min-width:200px;
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 20px;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-size:20px;
  font-weight:1000;
  letter-spacing:.5px;
  text-transform:uppercase;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,0)), #101824;
  border:1px solid rgba(255,255,255,.08);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
  box-shadow:inset 0 -3px 0 var(--cyan);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.footer30-cta:hover{
  transform:translateY(-3px);
  border-color:rgba(255,73,177,.32);
  box-shadow:inset 0 -3px 0 var(--pink), 0 12px 28px rgba(7,17,27,.22);
}

.footer30-bottom{
  position:relative;
  margin-top:6px;
  background:rgba(6,11,18,.58);
  border-top:1px solid rgba(255,255,255,.05);
}

.footer30-bottom::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg, var(--pink), rgba(255,73,177,0) 38%, rgba(19,217,228,0) 62%, var(--cyan));
  opacity:.75;
}

.footer30-bottom-inner{
  min-height:62px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.footer30-bottom span{
  color:#c7d0dc;
  font-size:14px;
}

.footer30-bottom b{
  color:var(--purple);
}

.footer30-mini-links{
  color:#91a0b2 !important;
  letter-spacing:.08em;
  font-size:12px !important;
  text-transform:uppercase;
}

@media (max-width: 1180px){
  .footer30-main{
    grid-template-columns:1fr 1fr;
  }
  .footer30-side{
    justify-items:start;
  }
}

@media (max-width: 760px){
  .footer30-main{
    grid-template-columns:1fr;
    gap:24px;
    padding:34px 0 22px;
  }
  .footer30-brand{
    padding:16px;
  }
  .footer30-bottom-inner{
    flex-direction:column;
    justify-content:center;
    align-items:flex-start;
    padding:14px 0;
  }
  .footer30-socials{
    flex-wrap:wrap;
  }
}


/* ==========================================================
   v3.1 — CRITICAL FOOTER VISIBILITY FIX
   Una regla vieja ocultaba cualquier elemento .site-footer.
   ========================================================== */

.site-footer.site-footer-v30{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  position:relative !important;
  margin-top:72px !important;
  padding:0 !important;
  color:#fff !important;
  overflow:hidden !important;
}

.site-footer-v30 .footer30-shell{
  display:block !important;
  min-height:300px;
}

.site-footer-v30 .footer30-main{
  display:grid !important;
}

.site-footer-v30 .footer30-bottom{
  display:block !important;
}

/* Ensure no old footer helper selectors can hide v3.0 children */
.site-footer-v30 .footer30-brand,
.site-footer-v30 .footer30-col,
.site-footer-v30 .footer30-side,
.site-footer-v30 .footer30-socials,
.site-footer-v30 .footer30-bottom-inner{
  visibility:visible !important;
  opacity:1 !important;
}


/* ==========================================================
   v3.2 — FOOTER REDESIGN per feedback
   - remove old brand box
   - footer links use same menu effect
   - animated multicolor ranking line
   - socials + CTA use login/register language
   ========================================================== */

:root{
  --rank-c1:#28d5ea;
  --rank-c2:#f0dc11;
  --rank-c3:#f145af;
  --rank-c4:#38a4f2;
  --rank-c5:#ff7e34;
  --rank-c6:#8c63ff;
}

.site-footer.site-footer-v32{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  position:relative;
  margin-top:68px !important;
  padding:0 !important;
  background:linear-gradient(90deg,#07111b 0%, #091522 44%, #08131f 100%) !important;
  color:#fff;
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,.04);
}

.site-footer-v32::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 8% 20%, rgba(140,99,255,.14), transparent 30%),
    radial-gradient(circle at 78% 18%, rgba(40,213,234,.10), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.015), rgba(255,255,255,0));
  pointer-events:none;
}

.footer32-shell{position:relative;z-index:1;}

.footer32-shell::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height:76px;
  background:linear-gradient(90deg,#091522 0%, #0a1623 100%);
  clip-path:polygon(0 72%, 100% 0, 100% 100%, 0 100%);
  opacity:.98;
}

.footer32-topline{
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:linear-gradient(90deg,
    var(--rank-c1) 0%,
    var(--rank-c2) 16%,
    var(--rank-c3) 32%,
    var(--rank-c4) 48%,
    var(--rank-c5) 64%,
    var(--rank-c6) 80%,
    var(--rank-c1) 100%);
  background-size:240% 100%;
  box-shadow:0 0 12px rgba(40,213,234,.20), 0 0 16px rgba(241,69,175,.16);
  animation:footerRankFlow 7s linear infinite;
}

.footer32-topline::after{
  content:"";
  position:absolute;
  inset:auto 0 -1px 0;
  height:1px;
  background:linear-gradient(90deg,
    rgba(40,213,234,.0) 0%,
    rgba(40,213,234,.55) 10%,
    rgba(240,220,17,.75) 26%,
    rgba(241,69,175,.75) 42%,
    rgba(56,164,242,.75) 58%,
    rgba(255,126,52,.75) 74%,
    rgba(140,99,255,.55) 90%,
    rgba(140,99,255,0) 100%);
  filter:blur(.2px);
  opacity:.95;
}

@keyframes footerRankFlow{
  0%{background-position:0% 0}
  100%{background-position:240% 0}
}

.footer32-main{
  position:relative;
  display:grid;
  grid-template-columns:minmax(420px, 1fr) auto;
  align-items:start;
  gap:72px;
  padding:110px 0 34px;
}

.footer32-links{
  display:grid;
  grid-template-columns:repeat(2, minmax(180px, 220px));
  gap:28px 72px;
}

.footer32-col{
  display:grid;
  align-content:start;
  gap:12px;
}

.footer32-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:42px;
  width:max-content;
  max-width:100%;
  padding:0 18px 0 26px;
  background:rgba(16,24,36,.70);
  border:1px solid rgba(255,255,255,.06);
  color:#ffffff;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif;
  font-style:italic;
  font-weight:1000;
  font-size:15px;
  letter-spacing:.03em;
  text-transform:capitalize;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:inset 0 -2px 0 rgba(19,217,228,.95);
  overflow:hidden;
  transition:transform .18s ease, color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

.footer32-link::before{
  content:"";
  position:absolute;
  z-index:0;
  left:-135%;
  top:-26%;
  width:125%;
  height:158%;
  background:var(--purple);
  transform:skewX(-22deg);
  transition:left .28s ease;
}

.footer32-link::after{
  content:"";
  position:absolute;
  left:12px;
  bottom:7px;
  width:24px;
  height:2px;
  background:linear-gradient(90deg,var(--cyan), var(--pink));
  box-shadow:0 0 8px rgba(19,217,228,.20);
  z-index:1;
}

.footer32-link span,
.footer32-link{z-index:1;}

.footer32-link:hover{
  color:#ffffff;
  transform:translateY(-2px);
  border-color:rgba(163,121,255,.36);
  box-shadow:inset 0 -2px 0 rgba(255,73,177,.92), 0 10px 18px rgba(0,0,0,.24);
}

.footer32-link:hover::before{left:-6%;}

.footer32-side{
  display:grid;
  justify-items:end;
  align-content:start;
  gap:16px;
  min-width:360px;
}

.footer32-socials{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.footer32-auth,
.footer32-cta{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#101824 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.08) !important;
  clip-path:polygon(12px 0,100% 0,calc(100% - 12px) 100%,0 100%);
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
  overflow:hidden;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
}

.footer32-auth::before,
.footer32-cta::before{
  content:"";
  position:absolute;
  z-index:0;
  left:-135%;
  top:-24%;
  width:125%;
  height:160%;
  background:var(--cyan);
  transform:skewX(-22deg);
  transition:left .28s ease;
}

.footer32-auth > *, .footer32-cta > * {position:relative;z-index:1;}

.footer32-auth:hover,
.footer32-cta:hover{
  color:#07111b !important;
  transform:translateY(-2px);
  border-color:rgba(19,217,228,.35) !important;
  box-shadow:inset 0 -3px 0 var(--pink) !important, 0 10px 22px rgba(7,17,27,.26) !important;
}

.footer32-auth:hover::before,
.footer32-cta:hover::before{left:-5%;}

.footer32-auth{
  width:52px;
  height:40px;
  font-size:18px;
  text-decoration:none;
}

.footer32-auth:nth-child(2)::before{background:var(--purple);}
.footer32-auth:nth-child(3)::before{background:var(--cyan);}
.footer32-auth:nth-child(4)::before{background:var(--purple);}

.footer32-cta{
  min-width:240px !important;
  min-height:46px !important;
  padding:0 18px !important;
  text-decoration:none;
  font-size:18px !important;
}

.footer32-bottom{
  position:relative;
  margin-top:6px;
  background:rgba(6,11,18,.62);
  border-top:1px solid rgba(255,255,255,.04);
}

.footer32-bottom::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:2px;
  background:linear-gradient(90deg,
    var(--rank-c1) 0%,
    var(--rank-c2) 20%,
    var(--rank-c3) 40%,
    var(--rank-c4) 60%,
    var(--rank-c5) 80%,
    var(--rank-c6) 100%);
  background-size:220% 100%;
  animation:footerRankFlow 8s linear infinite reverse;
  opacity:.95;
}

.footer32-bottom-inner{
  min-height:66px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.footer32-bottom span{
  color:#ced6e2;
  font-size:14px;
}
.footer32-bottom b{color:var(--purple);}
.footer32-mini{
  color:#8fa0b3 !important;
  font-size:12px !important;
  letter-spacing:.12em;
  text-transform:uppercase;
}

@media (max-width: 980px){
  .footer32-main{grid-template-columns:1fr;gap:28px;padding-top:96px;}
  .footer32-side{justify-items:start;min-width:0;}
  .footer32-socials{justify-content:flex-start;}
}

@media (max-width: 640px){
  .footer32-links{grid-template-columns:1fr;gap:16px;}
  .footer32-link{width:100%;}
  .footer32-bottom-inner{flex-direction:column;align-items:flex-start;justify-content:center;padding:12px 0;}
  .footer32-cta{min-width:200px !important;}
}


/* ==========================================================
   v3.3 — FOOTER = MISMO DISEÑO / EFECTO DEL MENÚ
   Sin efectos adicionales.
   ========================================================== */

/* Ocultar versiones anteriores */
.site-footer-v22,
.site-footer-v23,
.site-footer-v24,
.site-footer-v25,
.site-footer-v29,
.site-footer-v30,
.site-footer-v32{
  display:none !important;
}

.site-footer.site-footer-v33{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  position:relative !important;
  margin-top:64px !important;
  padding:0 !important;
  overflow:visible !important;
  background:var(--nav-dark) !important;
  color:#fff !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
}

/* Estructura simple */
.footer33-main{
  min-height:190px;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:48px;
  padding-top:40px;
  padding-bottom:30px;
}

.footer33-nav{
  display:grid;
  grid-template-columns:repeat(2, minmax(170px, 220px));
  gap:18px 70px;
}

.footer33-col{
  display:grid;
  align-content:start;
  gap:6px;
}

/* EXACTO lenguaje del menú 20 · Diagonal Fill */
.footer33-col > a,
.footer33-socials > a{
  position:relative !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:46px !important;
  padding:0 20px !important;

  color:#d7dfeb !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  overflow:hidden !important;
  isolation:isolate !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:16px !important;
  line-height:1 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;

  transition:color .2s ease !important;
}

.footer33-col > a{
  justify-content:flex-start !important;
  min-width:150px;
}

/* Mismo relleno diagonal morado del menú */
.footer33-col > a::before,
.footer33-socials > a::before{
  content:"" !important;
  position:absolute !important;
  z-index:-1 !important;
  left:-120% !important;
  top:-20% !important;
  width:120% !important;
  height:140% !important;
  background:var(--purple) !important;
  transform:skewX(-22deg) !important;
  transition:left .28s ease !important;
}

.footer33-col > a::after,
.footer33-socials > a::after{
  display:none !important;
}

.footer33-col > a:hover::before,
.footer33-socials > a:hover::before{
  left:-5% !important;
}

.footer33-col > a:hover,
.footer33-socials > a:hover{
  color:#ffffff !important;
  background:transparent !important;
  transform:none !important;
  text-shadow:none !important;
}

/* Redes: mismas piezas del menú, sin glow ni efectos extra */
.footer33-socials{
  display:flex;
  align-items:flex-start;
  gap:8px;
}

.footer33-socials > a{
  min-width:58px;
  padding:0 14px !important;
}

/* Bottom simple, misma barra oscura del header/menu */
.footer33-bottom{
  background:#060d15;
  border-top:1px solid rgba(255,255,255,.06);
}

.footer33-bottom-inner{
  min-height:58px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
}

.footer33-bottom span{
  color:#8c96a3;
  font-size:13px;
}

.footer33-bottom b{
  color:#ffffff;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif;
  font-style:italic;
  font-weight:1000;
  letter-spacing:.35px;
}

@media(max-width:900px){
  .footer33-main{
    flex-direction:column;
    gap:24px;
  }

  .footer33-socials{
    flex-wrap:wrap;
  }
}

@media(max-width:620px){
  .footer33-nav{
    grid-template-columns:1fr;
    gap:8px;
    width:100%;
  }

  .footer33-col > a{
    width:100%;
  }
}



/* =========================================================
   v3.5 — Footer inspirado en la referencia del usuario
   Mantiene colores/efectos del theme actual
========================================================= */
.site-footer-ref{
  position:relative;
  margin-top:54px;
  background:
    radial-gradient(circle at 6% 8%, rgba(140,92,245,.08), transparent 23%),
    radial-gradient(circle at 92% 4%, rgba(255,73,177,.06), transparent 18%),
    linear-gradient(180deg, #030a13 0%, #020912 100%);
  border-top:1px solid rgba(255,255,255,.04);
  overflow:hidden;
}
.footer-ref-bg{display:none!important}
.footer-ref-wrap{
  position:relative;
  z-index:2;
  padding:44px 0 34px;
}
.footer-ref-search{
  background:rgba(1,5,10,.92);
  border:1px solid rgba(255,255,255,.05);
  box-shadow:0 14px 38px rgba(0,0,0,.28);
  padding:28px 34px;
  display:grid;
  grid-template-columns: 1.15fr 1fr;
  gap:34px;
  align-items:center;
  margin-bottom:44px;
}
.footer-ref-chip{
  display:inline-flex;
  min-height:30px;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  background:linear-gradient(90deg, rgba(140,92,245,.92), rgba(255,73,177,.92));
  color:#fff;
  text-transform:uppercase;
  letter-spacing:.12em;
  font-size:12px;
  font-weight:800;
  margin-bottom:12px;
  clip-path:polygon(0 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
}
.footer-ref-search-copy h3{
  margin:0;
  color:#fff;
  font-size:34px;
  line-height:1.1;
  font-weight:500;
  text-transform:none;
}
.footer-ref-search-form{
  display:grid;
  grid-template-columns: 1fr 198px;
  gap:0;
  align-items:stretch;
}
.footer-ref-search-form input{
  width:100%;
  min-height:48px;
  border:0;
  outline:none;
  background:#09111f;
  color:#dbe7ff;
  padding:0 28px;
  font-size:16px;
  clip-path:polygon(0 0, 100% 0, calc(100% - 18px) 100%, 0 100%);
}
.footer-ref-search-form input::placeholder{color:#7f8aa0}
.footer-ref-submit{
  border:0;
  cursor:pointer;
  color:#fff;
  font-size:18px;
  font-weight:700;
  background:linear-gradient(90deg, rgba(140,92,245,.98), rgba(255,73,177,.98));
  clip-path:polygon(14px 0, 100% 0, 100% 100%, 0 100%);
  transition:filter .2s ease, transform .2s ease;
}
.footer-ref-submit:hover{filter:brightness(1.08); transform:translateY(-1px)}
.footer-ref-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:50px;
  margin-bottom:40px;
}
.footer-ref-col h4{
  margin:0 0 22px;
  color:#fff;
  font-size:20px;
  font-weight:700;
  position:relative;
}
.footer-ref-col h4::after{
  content:"";
  display:block;
  width:44px;
  height:2px;
  margin-top:10px;
  background:linear-gradient(90deg, var(--accent-cyan), var(--accent-pink));
}
.footer-ref-col a{
  position:relative;
  display:block;
  width:max-content;
  max-width:100%;
  margin:0 0 16px;
  padding:0 0 0 16px;
  color:#d7dfeb;
  text-decoration:none;
  font-size:17px;
  transition:color .2s ease, transform .2s ease;
}
.footer-ref-col a::before{
  content:"›";
  position:absolute;
  left:0;
  top:0;
  color:var(--accent-cyan);
  font-size:20px;
  line-height:1;
}
.footer-ref-col a:hover{
  color:#fff;
  transform:translateX(4px);
}
.footer-ref-time{
  display:flex;
  align-items:center;
  gap:12px;
  color:#d7dfeb;
  margin:0 0 16px;
  font-size:17px;
}
.footer-ref-time .dot{
  width:14px;
  height:14px;
  flex:0 0 14px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, #fff 0 25%, transparent 26% 100%),
    linear-gradient(135deg, var(--accent-cyan), var(--accent-pink));
  box-shadow:0 0 12px rgba(19,217,228,.25);
}
.footer-ref-socials{
  display:flex;
  gap:10px;
  margin-top:18px;
}
.footer-ref-socials a{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:48px;
  height:42px;
  color:#fff;
  text-decoration:none;
  font-family:var(--font-display);
  font-style:italic;
  font-weight:900;
  font-size:20px;
  background:#09111f;
  box-shadow:inset 0 -2px 0 var(--accent-cyan);
  clip-path:polygon(12px 0, 100% 0, calc(100% - 12px) 100%, 0 100%);
  overflow:hidden;
}
.footer-ref-socials a::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(140,92,245,.95), rgba(255,73,177,.95));
  transform:translateX(-110%);
  transition:transform .24s ease;
  z-index:0;
}
.footer-ref-socials a:hover::before{transform:translateX(0)}
.footer-ref-socials a span,
.footer-ref-socials a{z-index:1}
.footer-ref-disclaimer{
  padding:28px 0 24px;
  border-top:1px solid rgba(255,255,255,.05);
  color:#7d8aa1;
  line-height:1.7;
  font-size:15px;
}
.footer-ref-bottom{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  padding-top:14px;
  border-top:1px solid rgba(255,255,255,.05);
}
.footer-ref-bottom-links{
  display:flex;
  flex-wrap:wrap;
  gap:34px;
}
.footer-ref-bottom-links a{
  color:#d7dfeb;
  text-decoration:none;
  font-size:17px;
  transition:color .2s ease;
}
.footer-ref-bottom-links a:hover{color:#fff}
.footer-ref-copy{
  color:#d7dfeb;
  font-size:18px;
}
.footer-ref-copy b{color:#fff}
.sr-only{
  position:absolute !important;
  width:1px; height:1px;
  margin:-1px; border:0; padding:0;
  clip:rect(0 0 0 0); overflow:hidden;
}
@media (max-width: 1180px){
  .footer-ref-search{
    grid-template-columns:1fr;
  }
  .footer-ref-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:34px;
  }
  .footer-ref-bottom{
    flex-direction:column;
    align-items:flex-start;
  }
}
@media (max-width: 760px){
  .footer-ref-wrap{padding:28px 0 26px}
  .footer-ref-search{
    padding:22px 18px;
    margin-bottom:28px;
  }
  .footer-ref-search-copy h3{
    font-size:26px;
  }
  .footer-ref-search-form{
    grid-template-columns:1fr;
    gap:10px;
  }
  .footer-ref-search-form input,
  .footer-ref-submit{
    clip-path:polygon(10px 0, 100% 0, calc(100% - 10px) 100%, 0 100%);
    min-height:46px;
  }
  .footer-ref-grid{
    grid-template-columns:1fr;
    gap:24px;
    margin-bottom:22px;
  }
  .footer-ref-bottom-links{
    gap:16px 24px;
  }
  .footer-ref-copy{
    font-size:16px;
  }
}


/* ==========================================================
   v3.6 — FOOTER CORREGIDO
   MISMA FUENTE + MISMO DIAGONAL FILL DEL MENÚ
   SIN DEGRADADOS · SIN IMAGEN · SIN SEGUNDO ESTILO
   ========================================================== */

.site-footer-ref-v36{
  position:relative !important;
  display:block !important;
  margin-top:54px !important;
  padding:0 !important;
  background:#09121d !important;
  color:#ffffff !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
  overflow:hidden !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
}

/* remove the old decorative/image layer completely */
.site-footer-ref-v36 .footer-ref-bg,
.site-footer-ref-v36::before,
.site-footer-ref-v36::after{
  display:none !important;
  content:none !important;
  background:none !important;
}

.site-footer-ref-v36 .footer-ref-wrap{
  position:relative !important;
  z-index:1 !important;
  padding:42px 0 30px !important;
}

/* SEARCH BLOCK — same solid menu colors */
.site-footer-ref-v36 .footer-ref-search{
  background:#060d15 !important;
  border:1px solid rgba(255,255,255,.06) !important;
  box-shadow:none !important;
  padding:26px 30px !important;
  display:grid !important;
  grid-template-columns:1.05fr 1fr !important;
  gap:32px !important;
  align-items:center !important;
  margin-bottom:42px !important;
  clip-path:polygon(16px 0,100% 0,calc(100% - 16px) 100%,0 100%) !important;
}

.site-footer-ref-v36 .footer-ref-search-copy h3{
  margin:0 !important;
  color:#ffffff !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:34px !important;
  line-height:1 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
}

/* exact menu piece behavior */
.site-footer-ref-v36 .footer-menu-piece,
.site-footer-ref-v36 .footer-ref-col a,
.site-footer-ref-v36 .footer-ref-bottom-links a{
  position:relative !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:42px !important;
  padding:0 18px !important;

  color:#d7dfeb !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  clip-path:none !important;
  overflow:hidden !important;
  isolation:isolate !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:15px !important;
  line-height:1 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
  text-decoration:none !important;

  transition:color .2s ease !important;
}

.site-footer-ref-v36 .footer-menu-piece::before,
.site-footer-ref-v36 .footer-ref-col a::before,
.site-footer-ref-v36 .footer-ref-bottom-links a::before{
  content:"" !important;
  position:absolute !important;
  z-index:-1 !important;
  left:-120% !important;
  top:-20% !important;
  width:120% !important;
  height:140% !important;
  background:var(--purple) !important;
  transform:skewX(-22deg) !important;
  transition:left .28s ease !important;
}

.site-footer-ref-v36 .footer-menu-piece::after,
.site-footer-ref-v36 .footer-ref-col a::after,
.site-footer-ref-v36 .footer-ref-bottom-links a::after{
  display:none !important;
}

.site-footer-ref-v36 .footer-menu-piece:hover::before,
.site-footer-ref-v36 .footer-ref-col a:hover::before,
.site-footer-ref-v36 .footer-ref-bottom-links a:hover::before{
  left:-5% !important;
}

.site-footer-ref-v36 .footer-menu-piece:hover,
.site-footer-ref-v36 .footer-ref-col a:hover,
.site-footer-ref-v36 .footer-ref-bottom-links a:hover{
  color:#ffffff !important;
  background:transparent !important;
  transform:none !important;
  text-shadow:none !important;
}

/* Small BUSCAR label */
.site-footer-ref-v36 .footer-ref-chip{
  min-width:104px !important;
  min-height:36px !important;
  width:max-content !important;
  margin:0 0 14px !important;
  padding:0 18px !important;
}

/* Search field — solid, no gradient */
.site-footer-ref-v36 .footer-ref-search-form{
  display:grid !important;
  grid-template-columns:1fr 160px !important;
  gap:8px !important;
  align-items:center !important;
}

.site-footer-ref-v36 .footer-ref-search-form input{
  min-height:42px !important;
  width:100% !important;
  padding:0 18px !important;
  background:#101824 !important;
  color:#ffffff !important;
  border:1px solid rgba(255,255,255,.08) !important;
  outline:none !important;
  border-radius:0 !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%) !important;

  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:14px !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
}

.site-footer-ref-v36 .footer-ref-search-form input::placeholder{
  color:#778394 !important;
  opacity:1 !important;
}

.site-footer-ref-v36 .footer-ref-submit{
  min-width:160px !important;
  min-height:42px !important;
  padding:0 18px !important;
  cursor:pointer !important;
}

/* 4 columns like reference */
.site-footer-ref-v36 .footer-ref-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:44px !important;
  margin-bottom:34px !important;
}

.site-footer-ref-v36 .footer-ref-col h4{
  margin:0 0 14px !important;
  color:#ffffff !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:19px !important;
  line-height:1 !important;
  letter-spacing:.35px !important;
  text-transform:uppercase !important;
}

.site-footer-ref-v36 .footer-ref-col h4::after{
  content:"" !important;
  display:block !important;
  width:30px !important;
  height:2px !important;
  margin-top:9px !important;
  background:var(--cyan) !important;
}

.site-footer-ref-v36 .footer-ref-col a{
  justify-content:flex-start !important;
  width:max-content !important;
  max-width:100% !important;
  min-height:38px !important;
  margin:0 0 3px !important;
  padding:0 12px !important;
  font-size:14px !important;
}

/* server text uses same font; no decorative gradients */
.site-footer-ref-v36 .footer-ref-time{
  display:flex !important;
  align-items:center !important;
  gap:9px !important;
  min-height:38px !important;
  margin:0 0 3px !important;
  color:#d7dfeb !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:14px !important;
  letter-spacing:.25px !important;
  text-transform:uppercase !important;
}

.site-footer-ref-v36 .footer-time-icon{
  color:var(--cyan) !important;
  font-size:10px !important;
  text-shadow:none !important;
}

/* socials = exact same menu fill */
.site-footer-ref-v36 .footer-ref-socials{
  display:flex !important;
  gap:6px !important;
  margin-top:12px !important;
}

.site-footer-ref-v36 .footer-ref-socials a{
  min-width:48px !important;
  width:48px !important;
  min-height:42px !important;
  height:42px !important;
  padding:0 !important;
  font-size:17px !important;
}

/* disclaimer, solid and simple */
.site-footer-ref-v36 .footer-ref-disclaimer{
  padding:22px 0 !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
  color:#7f8b99 !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:700 !important;
  font-size:12px !important;
  line-height:1.6 !important;
  letter-spacing:.2px !important;
  text-transform:uppercase !important;
}

/* bottom */
.site-footer-ref-v36 .footer-ref-bottom{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:20px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(255,255,255,.06) !important;
}

.site-footer-ref-v36 .footer-ref-bottom-links{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:6px !important;
}

.site-footer-ref-v36 .footer-ref-bottom-links a{
  min-height:36px !important;
  padding:0 12px !important;
  font-size:13px !important;
}

.site-footer-ref-v36 .footer-ref-copy{
  color:#d7dfeb !important;
  font-family:"Arial Narrow", Impact, Haettenschweiler, "Segoe UI", sans-serif !important;
  font-style:italic !important;
  font-weight:1000 !important;
  font-size:13px !important;
  letter-spacing:.3px !important;
  text-transform:uppercase !important;
}

.site-footer-ref-v36 .footer-ref-copy b{
  color:#ffffff !important;
}

/* absolutely no gradient backgrounds inside this footer */
.site-footer-ref-v36,
.site-footer-ref-v36 *,
.site-footer-ref-v36 *::before,
.site-footer-ref-v36 *::after{
  background-image:none !important;
}

/* restore the purple diagonal fill after global no-gradient rule */
.site-footer-ref-v36 .footer-menu-piece::before,
.site-footer-ref-v36 .footer-ref-col a::before,
.site-footer-ref-v36 .footer-ref-bottom-links a::before{
  background:var(--purple) !important;
}

/* preserve cyan underline/title accent */
.site-footer-ref-v36 .footer-ref-col h4::after{
  background:var(--cyan) !important;
}

@media(max-width:1180px){
  .site-footer-ref-v36 .footer-ref-search{
    grid-template-columns:1fr !important;
  }
  .site-footer-ref-v36 .footer-ref-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .site-footer-ref-v36 .footer-ref-bottom{
    flex-direction:column !important;
    align-items:flex-start !important;
  }
}

@media(max-width:760px){
  .site-footer-ref-v36 .footer-ref-wrap{
    padding:28px 0 24px !important;
  }
  .site-footer-ref-v36 .footer-ref-search{
    padding:20px 18px !important;
  }
  .site-footer-ref-v36 .footer-ref-search-copy h3{
    font-size:27px !important;
  }
  .site-footer-ref-v36 .footer-ref-search-form{
    grid-template-columns:1fr !important;
  }
  .site-footer-ref-v36 .footer-ref-submit{
    width:150px !important;
  }
  .site-footer-ref-v36 .footer-ref-grid{
    grid-template-columns:1fr !important;
    gap:22px !important;
  }
}



/* ==========================================================
   v3.7 — ajustes pedidos por el usuario
   1) links del footer uno debajo del otro
   2) bloque de búsqueda más compacto
   ========================================================== */

.site-footer-ref-v36 .footer-ref-search{
  padding:18px 22px !important;
  gap:18px !important;
  grid-template-columns:1.1fr .95fr !important;
  margin-bottom:28px !important;
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%) !important;
}

.site-footer-ref-v36 .footer-ref-search-copy h3{
  font-size:22px !important;
  line-height:1.05 !important;
  letter-spacing:.28px !important;
}

.site-footer-ref-v36 .footer-ref-chip{
  min-width:86px !important;
  min-height:30px !important;
  margin:0 0 10px !important;
  padding:0 14px !important;
  font-size:13px !important;
}

.site-footer-ref-v36 .footer-ref-search-form{
  grid-template-columns:1fr 118px !important;
  gap:8px !important;
}

.site-footer-ref-v36 .footer-ref-search-form input{
  min-height:36px !important;
  padding:0 14px !important;
  font-size:12px !important;
  letter-spacing:.25px !important;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%) !important;
}

.site-footer-ref-v36 .footer-ref-submit{
  min-width:118px !important;
  min-height:36px !important;
  padding:0 14px !important;
  font-size:13px !important;
}

.site-footer-ref-v36 .footer-ref-grid{
  gap:34px !important;
  margin-bottom:26px !important;
}

.site-footer-ref-v36 .footer-ref-col h4{
  margin:0 0 10px !important;
  font-size:17px !important;
}

.site-footer-ref-v36 .footer-ref-col a{
  display:flex !important;
  width:100% !important;
  max-width:100% !important;
  justify-content:flex-start !important;
  min-height:34px !important;
  margin:0 0 4px !important;
  padding:0 10px !important;
  font-size:13px !important;
}

.site-footer-ref-v36 .footer-ref-time{
  min-height:34px !important;
  margin:0 0 4px !important;
  font-size:13px !important;
}

.site-footer-ref-v36 .footer-ref-socials a{
  min-width:42px !important;
  width:42px !important;
  min-height:36px !important;
  height:36px !important;
  font-size:15px !important;
}

.site-footer-ref-v36 .footer-ref-disclaimer{
  padding:18px 0 !important;
  font-size:11px !important;
}

.site-footer-ref-v36 .footer-ref-bottom-links a{
  min-height:32px !important;
  font-size:12px !important;
}

.site-footer-ref-v36 .footer-ref-copy{
  font-size:12px !important;
}

@media(max-width:980px){
  .site-footer-ref-v36 .footer-ref-search{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:760px){
  .site-footer-ref-v36 .footer-ref-search-copy h3{
    font-size:18px !important;
  }
  .site-footer-ref-v36 .footer-ref-search-form{
    grid-template-columns:1fr !important;
  }
  .site-footer-ref-v36 .footer-ref-submit{
    width:118px !important;
  }
}


/* ==========================================================
   v3.8 — FIX: los botones del footer NO llenan toda la columna
   ========================================================== */

/* Cada columna apila verticalmente, pero alinea los botones a la izquierda */
.site-footer-ref-v36 .footer-ref-col{
  display:grid !important;
  align-content:start !important;
  justify-items:start !important;
}

/* El botón ocupa solo lo que mida su texto */
.site-footer-ref-v36 .footer-ref-col a{
  display:inline-flex !important;
  width:max-content !important;
  max-width:100% !important;
  min-width:0 !important;
  justify-content:flex-start !important;
  align-self:start !important;

  min-height:34px !important;
  margin:0 0 4px !important;
  padding:0 12px !important;
  font-size:13px !important;
}

/* Evitar que cualquier regla previa vuelva a estirarlos */
.site-footer-ref-v36 .footer-ref-col > a{
  flex:0 0 auto !important;
}


/* ==========================================================
   v3.9 — RANKING 05 · COLOR EDGE
   IMPORTANTE: NO se cambia estructura, imágenes, fuente ni efectos.
   Solo superficies / colores para integrarlo con el theme blanco.
   ========================================================== */

/* Contenedor general permanece claro */
.ranking-section .section-shell{
  background:#f8fafc !important;
  border-color:#dfe7f1 !important;
}

/* Cards: blanco + borde suave. Se mantiene la geometría angular existente. */
.ranking-card{
  position:relative !important;
  background:#ffffff !important;
  border:1px solid #dfe7ef !important;
  box-shadow:0 12px 28px rgba(15,23,42,.07) !important;
}

/* Color Edge lateral por ranking */
.ranking-card:nth-child(1)::before,
.ranking-card:nth-child(2)::before,
.ranking-card:nth-child(3)::before{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  bottom:0 !important;
  width:4px !important;
  z-index:10 !important;
  pointer-events:none !important;
}
.ranking-card:nth-child(1)::before{background:#13d9e4 !important;}
.ranking-card:nth-child(2)::before{background:#ff49b1 !important;}
.ranking-card:nth-child(3)::before{background:#f0d716 !important;}

/* Header claro, sin fondo oscuro ni degradados */
.ranking-header{
  background:#ffffff !important;
  border-bottom:1px solid #dfe7ef !important;
  box-shadow:inset 0 -3px 0 #172235 !important;
}

/* La decoración del header pasa a gris muy suave */
.ranking-header::after{
  background:repeating-linear-gradient(
    -45deg,
    rgba(23,34,53,.045) 0 5px,
    rgba(23,34,53,0) 5px 12px
  ) !important;
  opacity:.75 !important;
}

.ranking-title{
  color:#17233c !important;
  text-shadow:1px 1px 0 rgba(255,255,255,.9) !important;
}

.ranking-subtitle{
  color:#ff49b1 !important;
}

/* Filas claras */
.rank-row{
  background:#ffffff !important;
}
.rank-row:nth-child(even){
  background:#f8fafc !important;
}
.rank-row + .rank-row{
  border-top:1px solid #e8eef5 !important;
}

/* Mantener número y acento de cada posición exactamente como estaban */
.rank-num{
  color:#ffffff !important;
}

/* Zona de nombre ahora clara */
.rank-main{
  color:#14233d !important;
  background:#ffffff !important;
}
.rank-row:nth-child(even) .rank-main{
  background:#f8fafc !important;
}
.text-row .rank-main{
  background:#ffffff !important;
}
.text-row:nth-child(even) .rank-main{
  background:#f8fafc !important;
}

.rank-name{
  color:#14233d !important;
  text-shadow:none !important;
}

/* Mantener meta con el color individual --accent */
.rank-meta{
  color:var(--accent) !important;
}

/* Imágenes del Top Reset se conservan.
   Solo quitamos la capa oscura para integrarlas con el fondo claro. */
.rank-pic{
  filter:saturate(1.12) contrast(1.03) !important;
}
.rank-pic::before{
  background:
    linear-gradient(90deg, var(--accent) 0%, transparent 22%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,0)) !important;
}

/* Hover: mantiene 3D + Name Glitch; solo cambia el borde inferior al color de fila */
.rank-row::after{
  content:"";
  position:absolute;
  left:58px;
  right:0;
  bottom:0;
  height:2px;
  background:transparent;
  transition:background .18s ease;
  pointer-events:none;
}
.rank-row:hover::after{
  background:var(--accent);
}

/* Guild panel usa la misma superficie clara */
.rank-panel[data-rank-panel="guilds"] .ranking-card{
  background:#ffffff !important;
}
.rank-panel[data-rank-panel="guilds"] .rank-row,
.rank-panel[data-rank-panel="guilds"] .rank-main{
  background:#ffffff !important;
  color:#14233d !important;
}
.rank-panel[data-rank-panel="guilds"] .rank-row:nth-child(even),
.rank-panel[data-rank-panel="guilds"] .rank-row:nth-child(even) .rank-main{
  background:#f8fafc !important;
}

/* ==========================================================
   v4.0 — Fix ranking 05 Color Edge
   Restaurar la punta / corte angular de las imágenes del Top Reset
   en la versión clara, sin cambiar layout, fuente ni imágenes.
   ========================================================== */

/* Mantener las filas visuales con el mismo lenguaje angular del ranking original */
.rank-row.visual-row .rank-main{
  position:relative !important;
  overflow:visible !important;
  background:linear-gradient(90deg,#f4f7fb 0%, #f4f7fb 76%, rgba(244,247,251,.18) 100%) !important;
}
.rank-row.visual-row:nth-child(even) .rank-main{
  background:linear-gradient(90deg,#eef3f8 0%, #eef3f8 76%, rgba(238,243,248,.18) 100%) !important;
}

/* Crear de nuevo el corte diagonal entre texto e imagen */
.rank-row.visual-row .rank-main::after{
  content:"";
  position:absolute;
  top:0;
  right:-30px;
  width:58px;
  height:100%;
  background:inherit;
  transform:skewX(-28deg);
  transform-origin:left top;
  z-index:3;
  pointer-events:none;
}

/* La imagen vuelve a entrar debajo con la misma sensación de punta */
.rank-row.visual-row .rank-pic{
  position:relative !important;
  z-index:1 !important;
  margin-left:-36px !important;
  clip-path:polygon(17% 0,100% 0,100% 100%,0 100%) !important;
  filter:saturate(1.12) contrast(1.03) !important;
}

/* Reforzar visualmente el borde angular de entrada de la imagen */
.rank-row.visual-row .rank-pic::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(20,35,61,.18) 0 8%, rgba(20,35,61,.06) 12%, rgba(20,35,61,0) 20%);
  pointer-events:none;
}

/* Las filas sin imagen siguen planas */
.text-row .rank-main::after{
  display:none !important;
}


/* ==========================================================
   v4.5 — CALENDARIO / EVENTOS
   Integrado al theme blanco, usando imágenes WEBP del usuario.
   ========================================================== */
.events-section{
  padding:0 0 96px;
}
.events-shell{
  background:#f8fafc;
  border:1px solid #dfe7f1;
  box-shadow:var(--shadow-soft);
  padding:42px 42px 48px;
}
.events-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:28px;
}
.events-title{
  margin-bottom:0;
}
.events-all-btn{
  min-width:138px;
  --split-accent:var(--cyan);
  background:#101824;
  color:#fff;
  border-color:#101824;
}
.events-all-btn:hover{
  color:#07111b;
}
.events-days{
  display:grid;
  grid-template-columns:repeat(7,minmax(0,1fr));
  border:1px solid #d8e2ed;
  background:#fff;
  margin-bottom:18px;
}
.events-day{
  position:relative;
  min-height:52px;
  border:0;
  border-right:1px solid #d8e2ed;
  background:#fff;
  color:#77859a;
  cursor:pointer;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:18px;
  text-transform:uppercase;
  transition:color .18s ease,background .18s ease,transform .18s ease;
}
.events-day:last-child{border-right:0}
.events-day:hover{
  color:#142039;
  transform:translateY(-1px);
}
.events-day.active{
  background:#101824;
  color:#fff;
  box-shadow:inset 0 -3px 0 var(--cyan);
}
.events-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}
.event-card{
  --event-accent:var(--cyan);
  display:grid;
  grid-template-columns:96px minmax(190px,1fr) minmax(245px,.95fr);
  min-height:146px;
  background:#fff;
  border:1px solid #dce5ef;
  overflow:hidden;
  box-shadow:0 8px 22px rgba(15,23,42,.035);
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.event-card:hover{
  transform:translateY(-3px);
  border-color:color-mix(in srgb,var(--event-accent) 42%,#dce5ef);
  box-shadow:0 14px 28px rgba(15,23,42,.09);
}
.event-time{
  position:relative;
  z-index:3;
  min-height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px 12px 10px;
  margin-right:-18px;
  background:var(--event-accent);
  color:#fff;
  clip-path:polygon(0 0,100% 0,82% 100%,0 100%);
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:25px;
  letter-spacing:.02em;
  text-transform:uppercase;
}
.event-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:20px 24px 20px 34px;
  background:#fff;
  min-width:0;
}
.event-copy::after{
  content:"";
  position:absolute;
  z-index:4;
  top:0;
  right:-36px;
  width:74px;
  height:100%;
  background:#fff;
  transform:skewX(-26deg);
  transform-origin:left top;
  pointer-events:none;
}
.event-name{
  position:relative;
  z-index:5;
  margin:0 0 5px;
  color:#17243c;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  font-size:clamp(20px,1.65vw,28px);
  line-height:.96;
  letter-spacing:.02em;
}
.event-subtitle{
  position:relative;
  z-index:5;
  color:#738196;
  font-size:13px;
  line-height:1.35;
}
.event-media{
  position:relative;
  z-index:1;
  min-width:0;
  overflow:hidden;
  background:#0d1724;
  clip-path:polygon(14% 0,100% 0,100% 100%,0 100%);
}
.event-media img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(1.08) contrast(1.04);
  transition:transform .38s ease,filter .38s ease;
}
.event-card:hover .event-media img{
  transform:scale(1.045);
  filter:saturate(1.14) contrast(1.06);
}
.event-media::before{
  content:"";
  position:absolute;
  z-index:2;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  background:var(--event-accent);
}
.event-countdown{
  position:absolute;
  z-index:5;
  right:0;
  bottom:0;
  min-width:132px;
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 13px 0 19px;
  background:#101824;
  color:#fff;
  clip-path:polygon(14px 0,100% 0,100% 100%,0 100%);
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:15px;
  letter-spacing:.04em;
}
.event-countdown::before{
  content:"";
  width:13px;
  height:13px;
  border:2px solid var(--event-accent);
  border-radius:50%;
  box-shadow:inset 0 0 0 2px #101824;
}
.event-countdown::after{
  content:"";
  position:absolute;
  left:26px;
  top:10px;
  width:2px;
  height:6px;
  background:var(--event-accent);
  transform-origin:bottom center;
  transform:rotate(-25deg);
}
.event-card[data-accent="cyan"]{--event-accent:var(--cyan)}
.event-card[data-accent="yellow"]{--event-accent:var(--yellow)}
.event-card[data-accent="pink"]{--event-accent:var(--pink)}
.event-card[data-accent="blue"]{--event-accent:var(--blue)}
.event-card[data-accent="orange"]{--event-accent:var(--orange)}
.event-card[data-accent="purple"]{--event-accent:var(--purple)}
.event-card[data-accent="green"]{--event-accent:#37c977}
.event-card[data-accent="navy"]{--event-accent:#3268d8}

@media(max-width:1180px){
  .event-card{grid-template-columns:86px minmax(180px,1fr) minmax(210px,.85fr)}
  .event-time{font-size:22px}
  .event-copy{padding-left:30px;padding-right:18px}
}
@media(max-width:980px){
  .events-grid{grid-template-columns:1fr}
  .event-card{grid-template-columns:96px 1fr minmax(260px,.9fr)}
}
@media(max-width:760px){
  .events-section{padding-bottom:70px}
  .events-shell{padding:28px 18px 34px}
  .events-head{align-items:flex-start;flex-direction:column}
  .events-days{grid-template-columns:repeat(4,1fr)}
  .events-day{border-bottom:1px solid #d8e2ed}
  .event-card{grid-template-columns:78px 1fr;min-height:126px}
  .event-media{grid-column:1 / -1;min-height:135px;clip-path:polygon(0 14%,100% 0,100% 100%,0 100%)}
  .event-copy::after{display:none}
  .event-time{margin-right:-12px;font-size:20px}
}
@media(max-width:520px){
  .events-days{grid-template-columns:repeat(2,1fr)}
  .event-card{grid-template-columns:72px 1fr}
  .event-copy{padding-left:24px}
  .event-name{font-size:21px}
}

/* ==========================================================
   v4.6 — DESCARGA Y JUEGA CTA
   ========================================================== */
.download-cta-section{
  padding:54px 0 8px;
}
.download-cta-shell{
  min-height:245px;
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(360px,.95fr) 250px;
  align-items:stretch;
  background:#ffffff;
  border:1px solid #dfe7f1;
  box-shadow:var(--shadow-soft);
  overflow:hidden;
  position:relative;
}
.download-cta-copy{
  padding:38px 18px 38px 42px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  position:relative;
  z-index:3;
}
.download-cta-title{
  font-size:clamp(38px,4vw,58px);
  margin-bottom:10px;
}
.download-cta-copy p{
  margin:0;
  max-width:660px;
  color:#5f6f85;
  line-height:1.65;
  font-size:14px;
}
.download-cta-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:22px;
}
.download-cta-actions .theme-button{
  min-width:190px;
  min-height:44px;
}
.download-primary{
  background:#ffffff !important;
  color:#111827 !important;
  border-color:#ccd8e6 !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}
.download-secondary{
  background:#101824 !important;
  color:#ffffff !important;
  border-color:#101824 !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}
.download-primary:hover,
.download-secondary:hover{
  background:#101824 !important;
  color:#ffffff !important;
  box-shadow:inset 0 -3px 0 var(--pink),0 10px 22px rgba(15,25,40,.16) !important;
}
.download-cta-art{
  position:relative;
  min-height:245px;
  overflow:hidden;
  clip-path:polygon(12% 0,100% 0,88% 100%,0 100%);
  margin-left:-28px;
  z-index:2;
  background:#f5f8fb;
}
.download-cta-art img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
.download-cta-status{
  padding:34px 28px 28px 20px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:19px;
  background:#ffffff;
  position:relative;
  z-index:4;
}
.download-status-title{
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:#75849a;
  font-size:12px;
  margin-bottom:1px;
}
.download-status-item{
  display:grid;
  grid-template-columns:34px 1fr;
  align-items:center;
  gap:12px;
  color:#142039;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.5px;
  font-size:14px;
}
.download-status-item svg{
  width:27px;
  height:27px;
  fill:#142039;
}
@media(max-width:1120px){
  .download-cta-shell{
    grid-template-columns:1fr 390px;
  }
  .download-cta-status{
    grid-column:1 / -1;
    display:grid;
    grid-template-columns:auto repeat(3,1fr);
    align-items:center;
    padding:18px 32px;
    border-top:1px solid #e5ebf2;
  }
  .download-status-title{margin:0}
}
@media(max-width:820px){
  .download-cta-section{padding-top:34px}
  .download-cta-shell{grid-template-columns:1fr}
  .download-cta-copy{padding:30px 24px}
  .download-cta-art{
    min-height:220px;
    margin-left:0;
    clip-path:polygon(0 0,100% 0,92% 100%,0 100%);
  }
  .download-cta-status{
    grid-template-columns:1fr;
    gap:14px;
    padding:24px;
  }
  .download-status-title{margin-bottom:4px}
  .download-cta-actions .theme-button{min-width:170px}
}

/* ==========================================================
   v4.7 — CTA color + espaciado vertical uniforme
   ========================================================== */

/* CTA principal: color visible en reposo, sin degradados.
   Conserva la geometría angular y el Split Fill del theme. */
.download-cta-actions .download-primary{
  --split-accent:var(--pink) !important;
  background:var(--cyan) !important;
  color:#07111b !important;
  border-color:var(--cyan) !important;
  box-shadow:inset 0 -3px 0 var(--pink) !important;
}
.download-cta-actions .download-primary:hover{
  background:#101824 !important;
  color:#07111b !important;
  border-color:var(--pink) !important;
  box-shadow:0 10px 22px rgba(15,25,40,.16) !important;
}

/*
  Antes las separaciones no eran iguales:
  CTA, Noticias, Eventos y Rankings usaban paddings distintos.
  Desde aquí todos los bloques principales comienzan a la misma
  distancia del bloque anterior.
*/
:root{
  --home-section-gap:64px;
}
.download-cta-section{
  padding:var(--home-section-gap) 0 0 !important;
}
.news-section{
  padding:var(--home-section-gap) 0 0 !important;
}
.events-section{
  padding:var(--home-section-gap) 0 0 !important;
}
.ranking-section{
  padding:var(--home-section-gap) 0 96px !important;
}

@media(max-width:760px){
  :root{
    --home-section-gap:44px;
  }
  .ranking-section{
    padding-bottom:70px !important;
  }
}


/* ==========================================================
   v4.8 — Noticias variante 01 aplicada al theme
   ========================================================== */
.news-section--variant01 .news-shell-fx{
  position:relative;
  overflow:hidden;
  background:linear-gradient(180deg,#fbfdff 0%,#f8fbff 100%) !important;
}
.news-section--variant01 .news-shell-fx::before{
  content:"";
  position:absolute;
  inset:0 auto auto 0;
  width:100%;
  height:1px;
  background:linear-gradient(90deg,rgba(19,217,228,.06),rgba(19,217,228,.82),rgba(255,73,177,.82),rgba(255,73,177,.06));
}
.news-section--variant01 .news-shell-fx::after{
  content:"";
  position:absolute;
  top:-120px;
  right:-120px;
  width:300px;
  height:300px;
  background:radial-gradient(circle at center, rgba(19,217,228,.12), rgba(19,217,228,0) 62%);
  pointer-events:none;
}
.news-section--variant01 .section-head--newsfx{
  margin-bottom:22px;
}
.news-prism-grid{
  display:grid;
  grid-template-columns:minmax(0,1.38fr) minmax(320px,.92fr);
  gap:18px;
  align-items:stretch;
}
.news-prism-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(260px,42%);
  gap:0;
  padding:0;
  overflow:hidden;
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
}
.news-prism-copy{
  padding:34px 30px 34px 30px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.news-prism-tag{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  width:max-content;
  padding:0 12px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:#0a1624;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
}
.news-prism-tag--cyan{background:var(--cyan)}
.news-prism-tag--yellow{background:var(--yellow)}
.news-prism-tag--pink{background:var(--pink);color:#fff}
.news-prism-tag--blue{background:var(--blue);color:#fff}
.news-prism-title,
.news-prism-quick-copy h4{
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  letter-spacing:.6px;
  text-transform:uppercase;
  color:#10203a;
}
.news-prism-title{
  margin:14px 0 12px;
  font-size:clamp(36px,4vw,60px);
  line-height:.92;
}
.news-prism-copy p{
  margin:0 0 20px;
  color:#42536c;
  line-height:1.72;
  max-width:560px;
}
.news-prism-media{
  position:relative;
  min-height:320px;
  overflow:hidden;
  background:linear-gradient(135deg,#11273a 0%,#17243d 55%,#211a2a 100%);
  clip-path:polygon(14px 0,100% 0,100% 100%,0 100%);
}
.news-prism-media::before,
.news-prism-thumb::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(126deg,transparent 0 54%,rgba(255,255,255,.07) 54% 58%,transparent 58%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.028) 0 2px,transparent 2px 14px);
}
.news-prism-media::after{
  content:"";
  position:absolute;
  inset:auto 0 0 0;
  height:55%;
  background:linear-gradient(180deg,transparent,rgba(5,10,17,.62));
}
.news-prism-caption{
  position:absolute;
  left:24px;
  bottom:16px;
  z-index:2;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.6px;
  font-size:26px;
}
.news-prism-feed{
  display:grid;
  gap:12px;
}
.news-prism-quick{
  display:grid;
  grid-template-columns:128px 1fr;
  min-height:108px;
  padding:0;
  overflow:hidden;
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
}
.news-prism-thumb{
  position:relative;
  margin-right:-18px;
  clip-path:polygon(0 0,100% 0,84% 100%,0 100%);
  overflow:hidden;
  background:linear-gradient(135deg,#10283c,#223245);
}
.news-prism-thumb--blue{background:linear-gradient(135deg,#10283c,#24314b)}
.news-prism-thumb--purple{background:linear-gradient(135deg,#1a2140,#312040)}
.news-prism-thumb--navy{background:linear-gradient(135deg,#10263a,#162d40)}
.news-prism-quick-copy{
  padding:18px 18px 16px 28px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.news-prism-quick-copy h4{
  margin:8px 0 6px;
  font-size:clamp(22px,2vw,30px);
  line-height:.94;
}
.news-prism-date{
  color:#7f8ea3;
  font-size:13px;
  letter-spacing:.02em;
}
@media(max-width:1180px){
  .news-prism-grid{grid-template-columns:1fr}
}
@media(max-width:840px){
  .news-prism-hero{grid-template-columns:1fr}
  .news-prism-media{min-height:210px}
}
@media(max-width:680px){
  .news-prism-quick{grid-template-columns:1fr}
  .news-prism-thumb{display:none}
  .news-prism-copy{padding:26px 22px}
  .news-prism-quick-copy{padding:20px 20px 18px}
}


/* ==========================================================
   v4.9 — Métricas visibles en noticias
   ========================================================== */
.news-prism-metrics{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px 22px;
  margin:0 0 20px;
}
.news-prism-metric{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:28px;
  color:#78879c;
  font-size:12px;
  white-space:nowrap;
}
.news-prism-metric svg{
  width:17px;
  height:17px;
  fill:#6f7f95;
  flex:0 0 auto;
}
.news-prism-metric strong{
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:15px;
  color:#17243c;
}
.news-prism-metric span{
  color:#8290a5;
}

.news-prism-mini-metrics{
  display:flex;
  align-items:center;
  gap:14px;
  margin-top:8px;
  color:#7d8ba0;
  font-size:12px;
}
.news-prism-mini-metrics > span{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.news-prism-mini-metrics svg{
  width:14px;
  height:14px;
  fill:#7d8ba0;
}

@media(max-width:680px){
  .news-prism-metric span{
    display:none;
  }
}


/* ==========================================================
   NyxCMS Prism CMS integration layer
   Theme-only module shell. No module source files are modified.
   ========================================================== */
body.nyxprism-cms-theme{
  min-height:100vh;
}
.nyxprism-module-main{
  padding:64px 0 96px;
  background:#eef3f8;
}
.nyxprism-module-shell{
  position:relative;
  min-height:420px;
  background:#f8fafc;
  border:1px solid #dfe7f1;
  box-shadow:var(--shadow-soft);
  padding:30px;
  overflow:hidden;
}
.nyxprism-module-shell::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:2px;
  background:linear-gradient(90deg,var(--cyan),var(--blue),var(--purple),var(--pink),var(--yellow));
  background-size:220% 100%;
  animation:nyxprismModulePrism 8s linear infinite;
  opacity:.9;
}
@keyframes nyxprismModulePrism{
  from{background-position:0 0}
  to{background-position:220% 0}
}
.nyxprism-module-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
  margin:4px 0 26px;
  padding:0 4px 18px;
  border-bottom:1px solid #e3eaf2;
}
.nyxprism-module-head h1{
  margin:0;
  color:#142039;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.6px;
  font-size:clamp(34px,4.5vw,58px);
  line-height:.95;
}
.nyxprism-module-head p{
  margin:8px 0 0;
  color:#738096;
}
.nyxprism-module-content,
.nyxprism-module-content > .wm-module-content{
  width:100%;
  max-width:none;
}
.nyxprism-module-content .wm-module-content{
  color:#1b2a42;
}
.nyxprism-module-content .wm-module-content img{
  max-width:100%;
}
.nyxprism-module-content .wm-module-content table{
  max-width:100%;
}
.nyxprism-module-content .wm-module-content input,
.nyxprism-module-content .wm-module-content select,
.nyxprism-module-content .wm-module-content textarea{
  max-width:100%;
}
.nyxprism-empty-state{
  padding:42px 24px;
  text-align:center;
  color:#75849a;
}

/* Dynamic home news image support */
.news-prism-media.has-cover,
.news-prism-thumb.has-cover{
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}
.news-prism-media.has-cover::before,
.news-prism-thumb.has-cover::before{
  background:linear-gradient(125deg,transparent 0 56%,rgba(255,255,255,.08) 56% 59%,transparent 59%);
}
.news-prism-engagement{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:12px 18px;
  margin:0 0 18px;
  color:#7b899e;
  font-size:12px;
}
.news-prism-engagement span,
.news-prism-mini-engagement span{
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.news-prism-engagement i,
.news-prism-mini-engagement i{
  color:#65768e;
}
.news-prism-mini-engagement{
  display:flex;
  gap:13px;
  margin-top:7px;
  color:#7d8ba0;
  font-size:12px;
}

/* CMS-driven event images */
.event-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.event-card[data-status="active"] .event-countdown::before{
  content:"●";
  color:#34c97b;
  margin-right:6px;
}
.event-card[data-status="active"]{
  box-shadow:0 0 0 1px rgba(52,201,123,.16), 0 10px 24px rgba(15,23,42,.06);
}

/* Language dropdown uses real CMS URLs */
.language-switcher .lang-option{
  text-decoration:none;
}

/* Footer social links */
.footer-ref-socials a{
  text-transform:uppercase;
}

/* Preserve theme-only boundary while allowing modules to remain functional. */
@media(max-width:760px){
  .nyxprism-module-main{padding:44px 0 70px}
  .nyxprism-module-shell{padding:18px}
  .nyxprism-module-head{align-items:flex-start;flex-direction:column}
}

/* ==========================================================
   NyxCMS Prism — Preloader de inicio
   Pantalla completa blanca, sin tarjeta envolvente.
   ========================================================== */
.nyxprism-preloader{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:#ffffff;
  transition:opacity .55s ease,visibility .55s ease;
}
.nyxprism-preloader.is-hidden{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
.nyxprism-preloader-panel{
  width:min(680px,calc(100vw - 42px));
  padding:0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  position:relative;
  background:transparent;
  border:0;
  box-shadow:none;
}
.nyxprism-preloader-title{
  margin:0;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:34px;
  line-height:1;
  color:#17243c;
  text-align:center;
}
.nyxprism-preloader-text{
  margin:0;
  font-size:12px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:#7687a0;
  text-align:center;
}
.nyxprism-prism-wrap{
  width:min(560px,86vw);
  display:grid;
  gap:13px;
  justify-items:center;
}
.nyxprism-prism-bar{
  width:100%;
  height:18px;
  padding:2px;
  background:#eef3f8;
  border:1px solid #dce7f3;
  clip-path:polygon(18px 0,100% 0,calc(100% - 18px) 100%,0 100%);
  overflow:hidden;
}
.nyxprism-prism-fill{
  height:100%;
  width:0%;
  clip-path:polygon(13px 0,100% 0,calc(100% - 13px) 100%,0 100%);
  background:linear-gradient(90deg,#24d7e8 0%,#2f9cff 23%,#8c5cf5 48%,#ff49b1 72%,#f1d61a 100%);
  background-size:220% 100%;
  animation:nyxprismPrismShift 2.8s linear infinite;
  transition:width .14s linear;
}
.nyxprism-prism-chips{display:flex;gap:9px}
.nyxprism-prism-chips span{width:18px;height:4px;border-radius:999px}
.nyxprism-prism-chips span:nth-child(1){background:#24d7e8}
.nyxprism-prism-chips span:nth-child(2){background:#ff49b1}
.nyxprism-prism-chips span:nth-child(3){background:#8c5cf5}
.nyxprism-prism-chips span:nth-child(4){background:#f1d61a}
.nyxprism-preloader-percent{
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:46px;
  line-height:1;
  color:#1a2842;
}
@keyframes nyxprismPrismShift{
  0%{background-position:0 0}
  100%{background-position:220% 0}
}
@media(max-width:700px){
  .nyxprism-preloader{padding:18px}
  .nyxprism-preloader-panel{width:min(100%,620px)}
  .nyxprism-preloader-title{font-size:25px}
  .nyxprism-preloader-percent{font-size:38px}
  .nyxprism-prism-bar{height:16px}
}


/* ==========================================================
   NyxCMS Prism 1.1.0 — integración CMS corregida
   ========================================================== */

/* Font Awesome en este CMS se renderiza por SVG/JS; no usar cuadrados de fuente. */
.svg-inline--fa{display:inline-block;vertical-align:-.125em;overflow:visible}
.download-status-item .svg-inline--fa{width:27px;height:27px;color:#142039}
.news-prism-engagement .svg-inline--fa,
.news-prism-mini-engagement .svg-inline--fa{width:14px;height:14px;color:#7f8ea3}
.footer-ref-socials .svg-inline--fa{width:16px;height:16px}

/* Jugadores conectados: sin las líneas laterales del prototipo. */
.online-box{
  border-left:0 !important;
  border-right:0 !important;
  padding-left:10px !important;
  padding-right:10px !important;
}

/* Navegación: mismas rutas/grupos usados por Blue Legacy, pero conserva el efecto del Prism. */
.main-nav .nav-item{position:relative !important;display:flex;align-items:center}
.main-nav .nav-caret{font-size:10px;margin-left:7px;opacity:.7;transition:transform .18s ease}
.main-nav .nav-item.open .nav-caret{transform:rotate(180deg)}
.main-nav .nav-item.open > .submenu{opacity:1 !important;visibility:visible !important;transform:translateY(0) !important;pointer-events:auto !important}
.main-nav .submenu{pointer-events:none !important}
.main-nav .nav-item:hover > .submenu{pointer-events:auto !important}

/* Efectos de títulos del módulo Noticias, disponibles también en Home. */
.news-section .wm-news-titlefx{--wm-news-title-c1:#17253f;--wm-news-title-c2:#21d8e5;--wm-news-title-c3:#8c5cf5;--wm-news-title-speed:6s}
.news-section .wm-news-titlefx--shadow{text-shadow:0 5px 18px rgba(0,0,0,.18)}
.news-section .wm-news-titlefx--glow{color:var(--wm-news-title-c1);text-shadow:0 0 8px color-mix(in srgb,var(--wm-news-title-c1) 75%,transparent),0 0 20px color-mix(in srgb,var(--wm-news-title-c1) 38%,transparent)}
.news-section .wm-news-titlefx--outline{color:transparent!important;-webkit-text-stroke:1px var(--wm-news-title-c1);text-shadow:none}
.news-section .wm-news-titlefx--gradient,
.news-section .wm-news-titlefx--gold,
.news-section .wm-news-titlefx--fire,
.news-section .wm-news-titlefx--ice,
.news-section .wm-news-titlefx--energy,
.news-section .wm-news-titlefx--metal{color:transparent!important;-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(100deg,var(--wm-news-title-c1),var(--wm-news-title-c2),var(--wm-news-title-c1))}
.news-section .wm-news-titlefx--gold{--wm-news-title-c1:#b7791f;--wm-news-title-c2:#f8d96a}
.news-section .wm-news-titlefx--fire{--wm-news-title-c1:#ff3c20;--wm-news-title-c2:#ffb13b}
.news-section .wm-news-titlefx--ice{--wm-news-title-c1:#2b9ff5;--wm-news-title-c2:#b8f5ff}
.news-section .wm-news-titlefx--energy{--wm-news-title-c1:#8c5cf5;--wm-news-title-c2:#13d9e4}
.news-section .wm-news-titlefx--metal{--wm-news-title-c1:#64748b;--wm-news-title-c2:#d7e0eb}
.news-section .wm-news-titlefx--gradient-animated,
.news-section .wm-news-titlefx--gold-shimmer,
.news-section .wm-news-titlefx--fire-animated,
.news-section .wm-news-titlefx--energy-animated,
.news-section .wm-news-titlefx--shimmer{color:transparent!important;-webkit-background-clip:text;background-clip:text;background-size:300% 100%;animation:nyxprismNewsGradientShift var(--wm-news-title-speed) linear infinite}
.news-section .wm-news-titlefx--gradient-animated{background-image:linear-gradient(100deg,var(--wm-news-title-c1),var(--wm-news-title-c2),var(--wm-news-title-c3),var(--wm-news-title-c1))}
.news-section .wm-news-titlefx--gold-shimmer{--wm-news-title-c1:#b7791f;--wm-news-title-c2:#fff2a8;--wm-news-title-c3:#e3a53a;background-image:linear-gradient(100deg,var(--wm-news-title-c1),var(--wm-news-title-c2) 38%,#fff 50%,var(--wm-news-title-c2) 62%,var(--wm-news-title-c3))}
.news-section .wm-news-titlefx--fire-animated{--wm-news-title-c1:#ff321e;--wm-news-title-c2:#ffd36b;--wm-news-title-c3:#ff6a00;background-image:linear-gradient(100deg,var(--wm-news-title-c1),var(--wm-news-title-c2),var(--wm-news-title-c3),var(--wm-news-title-c1))}
.news-section .wm-news-titlefx--energy-animated{--wm-news-title-c1:#8b5cf6;--wm-news-title-c2:#4fffe1;--wm-news-title-c3:#67a9ff;background-image:linear-gradient(100deg,var(--wm-news-title-c1),var(--wm-news-title-c2),var(--wm-news-title-c3),var(--wm-news-title-c1))}
.news-section .wm-news-titlefx--shimmer{background-image:linear-gradient(110deg,var(--wm-news-title-c1) 15%,var(--wm-news-title-c2) 38%,#fff 50%,var(--wm-news-title-c2) 62%,var(--wm-news-title-c1) 85%)}
.news-section .wm-news-titlefx--glow-pulse{color:var(--wm-news-title-c1);animation:nyxprismNewsGlowPulse var(--wm-news-title-speed) ease-in-out infinite}
.news-section .wm-news-titlefx--neon,
.news-section .wm-news-titlefx--neon-pulse{color:var(--wm-news-title-c1);text-shadow:0 0 2px #fff,0 0 8px var(--wm-news-title-c1),0 0 18px var(--wm-news-title-c2)}
.news-section .wm-news-titlefx--neon-pulse{animation:nyxprismNewsGlowPulse var(--wm-news-title-speed) ease-in-out infinite}
@keyframes nyxprismNewsGradientShift{0%{background-position:0 50%}100%{background-position:300% 50%}}
@keyframes nyxprismNewsGlowPulse{0%,100%{filter:brightness(.9);text-shadow:0 0 5px color-mix(in srgb,var(--wm-news-title-c1) 45%,transparent)}50%{filter:brightness(1.25);text-shadow:0 0 10px var(--wm-news-title-c1),0 0 24px color-mix(in srgb,var(--wm-news-title-c2) 60%,transparent)}}

/* Noticias reales: más compactas, sin agrandar portada/títulos. */
.news-prism-grid{grid-template-columns:minmax(0,1.46fr) minmax(330px,.82fr) !important;gap:16px !important}
.news-prism-grid.is-single{grid-template-columns:1fr !important}
.news-prism-hero{grid-template-columns:minmax(0,1fr) minmax(220px,34%) !important;min-height:274px !important}
.news-prism-copy{padding:26px 28px !important}
.news-prism-title{font-size:clamp(30px,3vw,44px) !important;line-height:.94 !important;overflow-wrap:anywhere}
.news-prism-copy p{font-size:14px !important;line-height:1.62 !important;margin-bottom:14px !important}
.news-prism-media{min-height:274px !important;background-position:center !important;background-size:cover !important}
.news-prism-caption{font-size:20px !important;max-width:86%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.news-prism-quick{grid-template-columns:108px 1fr !important;min-height:96px !important}
.news-prism-quick.no-cover{grid-template-columns:1fr !important}
.news-prism-quick-copy{padding:14px 15px 13px 23px !important}
.news-prism-quick.no-cover .news-prism-quick-copy{padding-left:18px !important}
.news-prism-quick-copy h4{font-size:clamp(18px,1.45vw,24px) !important;line-height:.96 !important;margin:6px 0 4px !important;overflow-wrap:anywhere}
.news-prism-date{font-size:11px !important}
.news-prism-mini-engagement{margin-top:6px !important;gap:12px !important;font-size:11px !important}
.news-prism-engagement{margin-bottom:14px !important}
.news-prism-empty{min-height:150px;display:grid;place-items:center;border:1px dashed #cfdae6;background:#fff;color:#7d8ba0;font-weight:700;text-align:center;padding:24px}
@media(max-width:1180px){.news-prism-grid{grid-template-columns:1fr !important}.news-prism-hero{grid-template-columns:minmax(0,1fr) 32% !important}}
@media(max-width:760px){.news-prism-hero{grid-template-columns:1fr !important}.news-prism-media{min-height:190px !important}.news-prism-quick{grid-template-columns:92px 1fr !important}}

/* Ranking Home: usar avatares originales del módulo (76x73), no artes wide. */
.rank-row.visual-row{grid-template-columns:58px minmax(130px,1fr) 92px !important}
.rank-row.visual-row .rank-pic{
  margin-left:-20px !important;
  background-color:#eef3f8 !important;
  background-image:var(--pic) !important;
  background-position:center !important;
  background-size:76px 73px !important;
  background-repeat:no-repeat !important;
  clip-path:polygon(20% 0,100% 0,100% 100%,0 100%) !important;
  filter:none !important;
}
.rank-row.visual-row .rank-pic::before{display:none !important}
.rank-row.visual-row .rank-pic::after{background:linear-gradient(90deg,rgba(20,35,61,.10),rgba(20,35,61,0) 26%) !important}
.rank-panel[hidden]{display:none !important}
.guild-home-panel{margin-top:36px}
.ranking-card--guild{max-width:100%;overflow:hidden}
.guild-rank-list{display:grid}
.guild-rank-row{display:grid;grid-template-columns:58px 76px minmax(0,1fr) 120px;min-height:68px;align-items:center;background:#fff;border-top:1px solid #e8eef5}
.guild-rank-row:nth-child(even){background:#f8fafc}
.guild-rank-mark{display:grid;place-items:center;height:100%}
.guild-rank-mark img{width:48px;height:48px;image-rendering:pixelated;object-fit:contain}
.guild-rank-mark .svg-inline--fa{width:28px;height:28px;color:#8896a9}
.guild-rank-copy{display:flex;flex-direction:column;gap:3px;padding:0 16px}
.guild-rank-copy strong{font-family:var(--display-font);font-style:italic;font-weight:1000;text-transform:uppercase;color:#14233d;font-size:19px}
.guild-rank-copy span{font-size:11px;color:#7f8ea3}
.guild-rank-score{display:flex;flex-direction:column;align-items:flex-end;padding-right:20px}
.guild-rank-score strong{font-family:var(--display-font);font-style:italic;font-weight:1000;color:#14233d;font-size:20px}
.guild-rank-score span{font-size:10px;text-transform:uppercase;color:var(--accent);font-weight:800}
.ranking-empty{padding:28px;color:#7f8ea3;text-align:center}
@media(max-width:680px){.guild-rank-row{grid-template-columns:52px 62px 1fr}.guild-rank-score{display:none}}

/* Evitar que el menú con rutas reales se desborde en resoluciones intermedias. */
@media(max-width:1500px){
  .main-nav{gap:2px !important}
  .main-nav > a,.main-nav > .nav-item > a{padding:0 11px !important;font-size:13px !important}
  .nav-shell{grid-template-columns:auto 132px minmax(0,1fr) 112px auto !important}
}

/* Iconos críticos en SVG inline: no dependen de webfonts. */
.nyxprism-ui-icon{display:inline-block;width:1em;height:1em;fill:currentColor;flex:0 0 auto}
.download-status-item .nyxprism-ui-icon{width:27px;height:27px;color:#142039}
.nyxprism-engagement-icon{display:inline-block;width:14px;height:14px;fill:currentColor;flex:0 0 auto;color:#7f8ea3;vertical-align:-2px}
.news-prism-engagement > span,.news-prism-mini-engagement > span{display:inline-flex;align-items:center;gap:5px}
.guild-rank-mark .nyxprism-ui-icon{width:28px;height:28px;color:#8896a9}


/* ==========================================================
   NyxCMS Prism 1.2.0 — correcciones Home CMS
   ========================================================== */
.header-actions{display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important}
.header-actions .theme-button{white-space:nowrap!important;min-width:max-content!important;padding-left:17px!important;padding-right:17px!important}
.online-box{min-width:126px!important;text-align:left!important}
.online-box strong{min-height:26px!important;white-space:nowrap!important}

.news-prism-feed{display:grid!important;grid-auto-rows:104px!important;align-content:start!important;align-items:start!important;gap:12px!important}
.news-prism-quick{height:104px!important;min-height:104px!important;max-height:104px!important;align-self:start!important;overflow:hidden!important}
.news-prism-thumb{height:104px!important;min-height:104px!important;background-position:center!important;background-size:cover!important}
.news-prism-quick-copy{height:104px!important;min-width:0!important;overflow:hidden!important}
.news-prism-quick-copy h4{display:block!important;max-height:48px!important;overflow:hidden!important}
.news-prism-grid{align-items:start!important}
.news-prism-hero{align-self:start!important}

.rank-row.visual-row{grid-template-columns:58px minmax(130px,1fr) 132px!important;overflow:hidden!important}
.rank-row.visual-row .rank-pic{width:152px!important;height:100%!important;margin-left:-22px!important;background-image:var(--pic)!important;background-size:cover!important;background-position:center!important;background-repeat:no-repeat!important;clip-path:polygon(18% 0,100% 0,100% 100%,0 100%)!important}
.rank-row.visual-row .rank-pic::before{display:none!important}
.guild-home-panel{margin-top:36px!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:26px!important;align-items:start!important}
.guild-home-panel .ranking-card--guild{grid-column:1!important;max-width:none!important;width:auto!important}
.guild-visual-row .rank-main{min-width:0!important}
.guild-visual-row .rank-meta{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.guild-visual-row .guild-mark-pic{display:grid!important;place-items:center!important;background-image:none!important;background-color:#eef3f8!important}
.guild-visual-row .guild-mark-pic img{width:48px!important;height:48px!important;object-fit:contain!important;image-rendering:pixelated}
.guild-visual-row .guild-mark-pic .nyxprism-ui-icon{width:30px!important;height:30px!important;color:#8896a9}

.events-empty{grid-column:1/-1;min-height:120px;display:grid;place-items:center;background:#fff;border:1px dashed #d3deea;color:#7f8da1;font-weight:700;text-align:center;padding:24px}
.event-card[hidden]{display:none!important}
.event-time{white-space:nowrap!important}

@media(max-width:1500px){.nav-shell{grid-template-columns:auto 126px minmax(0,1fr) 104px auto!important}.header-actions .theme-button{padding-left:13px!important;padding-right:13px!important}}
@media(max-width:1080px){.guild-home-panel{grid-template-columns:1fr!important}.guild-home-panel .ranking-card--guild{grid-column:auto!important}}
@media(max-width:760px){.news-prism-feed{grid-auto-rows:auto!important}.news-prism-quick,.news-prism-quick-copy{height:auto!important;max-height:none!important;min-height:96px!important}.news-prism-thumb{height:auto!important;min-height:96px!important}}


/* ==========================================================
   NyxCMS Prism 1.3.0 — Noticias + Ranking exacto del mockup
   ========================================================== */

/* NOTICIAS: las tarjetas rápidas no comparten una altura forzada.
   Cada noticia conserva su caja, sus efectos de título y su propio alto. */
.news-prism-feed{
  display:grid!important;
  grid-auto-rows:auto!important;
  align-content:start!important;
  align-items:start!important;
  gap:12px!important;
}
.news-prism-quick{
  display:grid!important;
  grid-template-columns:118px minmax(0,1fr)!important;
  height:auto!important;
  min-height:118px!important;
  max-height:none!important;
  align-self:start!important;
  overflow:hidden!important;
}
.news-prism-quick.no-cover{grid-template-columns:1fr!important}
.news-prism-thumb{
  height:100%!important;
  min-height:118px!important;
  background-position:center!important;
  background-size:cover!important;
}
.news-prism-quick-copy{
  height:auto!important;
  min-height:118px!important;
  min-width:0!important;
  overflow:visible!important;
  padding:14px 16px 13px 24px!important;
  justify-content:center!important;
}
.news-prism-quick.no-cover .news-prism-quick-copy{padding-left:18px!important}
.news-prism-quick-copy h4{
  display:block!important;
  width:100%!important;
  max-height:none!important;
  overflow:visible!important;
  margin:7px 0 5px!important;
  font-size:clamp(17px,1.28vw,22px)!important;
  line-height:1.02!important;
  overflow-wrap:break-word!important;
  word-break:normal!important;
}
.news-prism-quick-copy h4 a{
  display:inline!important;
  color:inherit!important;
  font:inherit!important;
  text-decoration:none!important;
}
.news-prism-date{display:block!important}
.news-prism-mini-engagement{display:flex!important;flex-wrap:wrap!important}

/* RANKING: restaurar literalmente la geometría del HTML aprobado.
   Las tres tablas Player usan la misma fila visual con arte de clase. */
.ranking-grid{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
  align-items:start!important;
}
.ranking-card{
  overflow:hidden!important;
  background:#fff!important;
  border:1px solid #dfe7ef!important;
  box-shadow:0 12px 28px rgba(15,23,42,.07)!important;
}
.ranking-header{
  min-height:88px!important;
  padding:15px 18px 12px!important;
  background:#fff!important;
  border-bottom:1px solid #dfe7ef!important;
  box-shadow:inset 0 -3px 0 #172235!important;
}
.rank-row.visual-row{
  position:relative!important;
  display:grid!important;
  grid-template-columns:58px minmax(132px,1fr) minmax(128px,.95fr)!important;
  height:49px!important;
  min-height:49px!important;
  max-height:49px!important;
  overflow:hidden!important;
  background:#fff!important;
}
.rank-row.visual-row:nth-child(even){background:#f8fafc!important}
.rank-row.visual-row .rank-num{
  width:auto!important;
  height:49px!important;
  background:var(--accent)!important;
}
.rank-row.visual-row .rank-main{
  position:relative!important;
  z-index:2!important;
  min-width:0!important;
  height:49px!important;
  padding:0 8px 0 23px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:center!important;
  overflow:visible!important;
  background:linear-gradient(90deg,#f4f7fb 0%,#f4f7fb 76%,rgba(244,247,251,.18) 100%)!important;
}
.rank-row.visual-row:nth-child(even) .rank-main{
  background:linear-gradient(90deg,#eef3f8 0%,#eef3f8 76%,rgba(238,243,248,.18) 100%)!important;
}
.rank-row.visual-row .rank-main::after{
  content:""!important;
  position:absolute!important;
  top:0!important;
  right:-30px!important;
  width:58px!important;
  height:100%!important;
  background:inherit!important;
  transform:skewX(-28deg)!important;
  transform-origin:left top!important;
  z-index:3!important;
  pointer-events:none!important;
}
.rank-row.visual-row .rank-name{
  position:relative!important;
  z-index:4!important;
  font-size:18px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:#14233d!important;
}
.rank-row.visual-row .rank-meta{
  position:relative!important;
  z-index:4!important;
  margin-top:3px!important;
  font-size:12px!important;
  line-height:1!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  color:var(--accent)!important;
}
.rank-row.visual-row .rank-pic{
  position:relative!important;
  z-index:1!important;
  width:auto!important;
  min-width:0!important;
  height:49px!important;
  margin-left:-30px!important;
  background-color:#eaf0f6!important;
  background-image:var(--pic)!important;
  background-size:cover!important;
  background-position:center!important;
  background-repeat:no-repeat!important;
  clip-path:polygon(17% 0,100% 0,100% 100%,0 100%)!important;
  filter:saturate(1.12) contrast(1.03)!important;
}
.rank-row.visual-row .rank-pic::before{display:none!important}
.rank-row.visual-row .rank-pic::after{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  display:block!important;
  background:linear-gradient(90deg,rgba(20,35,61,.18) 0 8%,rgba(20,35,61,.06) 12%,rgba(20,35,61,0) 20%)!important;
  pointer-events:none!important;
}

/* Guild conserva exactamente el ancho de una tarjeta del ranking Player. */
.guild-home-panel{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:20px!important;
  align-items:start!important;
}
.guild-home-panel .ranking-card--guild{
  grid-column:1!important;
  width:auto!important;
  max-width:none!important;
}
.guild-visual-row .guild-mark-pic{
  display:grid!important;
  place-items:center!important;
  background-image:none!important;
  background-color:#eef3f8!important;
}
.guild-visual-row .guild-mark-pic img{
  position:relative!important;
  z-index:4!important;
  width:38px!important;
  height:38px!important;
  object-fit:contain!important;
  image-rendering:pixelated!important;
}
.guild-visual-row .rank-main::after{display:block!important}

@media(max-width:1180px){
  .ranking-grid,.guild-home-panel{grid-template-columns:1fr!important}
  .guild-home-panel .ranking-card--guild{grid-column:auto!important}
}
@media(max-width:760px){
  .news-prism-quick{grid-template-columns:92px minmax(0,1fr)!important;min-height:106px!important}
  .news-prism-thumb,.news-prism-quick-copy{min-height:106px!important}
  .rank-row.visual-row{grid-template-columns:54px minmax(115px,1fr) 112px!important}
  .rank-row.visual-row .rank-name{font-size:16px!important}
}


/* ==========================================================
   NyxCMS Prism 1.4.0 — ranking artwork by real race/class
   ========================================================== */
.rank-row.visual-row.rank-row--no-art .rank-pic{
  background-image:none!important;
  background-color:#eef3f8!important;
}


/* ==========================================================
   v1.5.0 — HERO 05 · YELLOW STRIKE
   Diseño aprobado: tipografía angular, amarillo/cyan, sin
   degradados nuevos y con hover sutil en los CTA.
   ========================================================== */
.hero .hero-copy--yellow-strike{
  /* Más cerca del borde izquierdo del contenedor, como en el mockup aprobado. */
  padding-left:clamp(10px,2vw,32px);
  max-width:820px;
}
.hero .hero-strike-badge{
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 14px;
  background:var(--yellow) !important;
  color:#09121d !important;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:uppercase;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  animation:heroStrikeRise .45s ease both;
}
.hero .hero-strike-title{
  margin:18px 0 0;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.01em;
  font-size:clamp(54px,5.1vw,84px);
  line-height:.83;
  color:#fff;
  animation:heroStrikeRise .52s .05s ease both;
}
.hero .hero-strike-title > span{
  display:block;
}
.hero .hero-strike-line1{
  color:#ffffff;
}
.hero .hero-strike-line2{
  color:var(--yellow);
}
.hero .hero-strike-accent{
  display:block;
  width:180px;
  max-width:42%;
  height:4px;
  margin:18px 0 14px;
  background:var(--cyan);
  clip-path:polygon(0 0,100% 0,94% 100%,0 100%);
  animation:heroStrikeBar .62s .12s ease both;
}
.hero .hero-strike-copy{
  margin:0 0 18px !important;
  color:#eef4fb !important;
  font-size:15px !important;
  line-height:1.55;
  animation:heroStrikeRise .5s .12s ease both;
}
.hero .hero-strike-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  animation:heroStrikeRise .5s .18s ease both;
}
.hero .hero-strike-btn{
  position:relative;
  min-width:150px;
  min-height:48px;
  padding:0 22px;
  border:0 !important;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.04em;
  clip-path:polygon(11px 0,100% 0,calc(100% - 11px) 100%,0 100%);
  transition:transform .18s ease,letter-spacing .18s ease,box-shadow .18s ease !important;
}
.hero .hero-strike-btn::before{
  display:none !important;
}
.hero .hero-strike-btn--primary{
  background:var(--yellow) !important;
  color:#09121d !important;
  box-shadow:inset 0 -3px 0 var(--pink) !important;
}
.hero .hero-strike-btn--secondary{
  background:#0f1928 !important;
  color:#ffffff !important;
  box-shadow:inset 0 -3px 0 var(--cyan) !important;
}
.hero .hero-strike-btn:hover{
  transform:translateY(-2px) !important;
  letter-spacing:.085em;
}
.hero .hero-strike-btn--primary:hover{
  background:var(--yellow) !important;
  color:#09121d !important;
  border-color:transparent !important;
  box-shadow:inset 0 -3px 0 var(--pink),0 12px 24px rgba(0,0,0,.22) !important;
}
.hero .hero-strike-btn--secondary:hover{
  background:#0f1928 !important;
  color:#ffffff !important;
  border-color:transparent !important;
  box-shadow:inset 0 -3px 0 var(--cyan),0 12px 24px rgba(0,0,0,.22) !important;
}
@keyframes heroStrikeRise{
  from{opacity:0;transform:translateY(12px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes heroStrikeBar{
  from{opacity:0;transform:scaleX(.12);transform-origin:left}
  to{opacity:1;transform:scaleX(1);transform-origin:left}
}
@media(max-width:900px){
  .hero .hero-copy--yellow-strike{padding-left:0;max-width:700px}
  .hero .hero-strike-title{font-size:clamp(48px,9vw,68px)}
}
@media(max-width:620px){
  .hero .hero-strike-title{font-size:clamp(42px,12vw,58px);line-height:.88}
  .hero .hero-strike-accent{width:140px}
  .hero .hero-strike-actions{flex-direction:column;align-items:flex-start}
  .hero .hero-strike-btn{min-width:190px}
}
@media(prefers-reduced-motion:reduce){
  .hero .hero-strike-badge,
  .hero .hero-strike-title,
  .hero .hero-strike-accent,
  .hero .hero-strike-copy,
  .hero .hero-strike-actions{animation:none !important}
}


/* ==========================================================
   v1.5.1 — Ajuste de posición del Hero Yellow Strike
   ========================================================== */
@media(min-width:901px){
  .hero .hero-copy--yellow-strike{
    padding-left:clamp(10px,2vw,32px) !important;
  }
}


/* ==========================================================
   v1.5.2 — Responsive real para móvil/tablet
   Corrige el header comprimido y evita que la Home se vea
   como una versión de escritorio reducida.
   ========================================================== */
.mobile-menu-toggle{
  display:none;
  width:46px;
  height:40px;
  padding:0 11px;
  border:1px solid rgba(255,255,255,.10);
  background:#101824;
  box-shadow:inset 0 -3px 0 var(--cyan);
  clip-path:polygon(10px 0,100% 0,calc(100% - 10px) 100%,0 100%);
  cursor:pointer;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:5px;
}
.mobile-menu-toggle span{
  display:block;
  width:21px;
  height:2px;
  background:#fff;
  transition:transform .2s ease,opacity .2s ease;
}
.site-header.mobile-open .mobile-menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.site-header.mobile-open .mobile-menu-toggle span:nth-child(2){opacity:0}
.site-header.mobile-open .mobile-menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:900px){
  html,body{overflow-x:hidden}
  .wrap{width:calc(100% - 28px)!important;max-width:none!important}

  .site-header{position:sticky;top:0}
  .nav-shell{
    grid-template-columns:minmax(0,1fr) auto!important;
    grid-template-areas:
      "brand toggle"
      "online online"
      "nav nav"
      "lang lang"
      "actions actions"!important;
    gap:8px 12px!important;
    min-height:64px!important;
    padding-top:8px!important;
    padding-bottom:8px!important;
  }
  .brand{grid-area:brand!important;justify-self:start!important;min-width:0}
  .brand-mark{width:42px!important;height:42px!important;font-size:29px!important}
  .brand-copy b{font-size:12px!important}
  .brand-copy small{font-size:8px!important}

  .mobile-menu-toggle{display:flex;grid-area:toggle;justify-self:end}

  .online-box{
    grid-area:online!important;
    display:none!important;
    width:100%!important;
    min-width:0!important;
    padding:10px 0 2px!important;
    border:0!important;
    grid-template-columns:1fr auto!important;
    align-items:center!important;
  }
  .site-header.mobile-open .online-box{display:grid!important}
  .online-box span{font-size:10px!important}
  .online-box strong{font-size:20px!important;margin:0!important;text-align:right}
  .online-box small{grid-column:1/-1;font-size:9px!important;margin-top:2px}

  .main-nav{
    grid-area:nav!important;
    display:none!important;
    width:100%!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    gap:5px!important;
    padding-top:5px!important;
  }
  .site-header.mobile-open .main-nav{display:flex!important}
  .main-nav > a,
  .main-nav > .nav-item,
  .main-nav > .nav-item > a{
    width:100%!important;
  }
  .main-nav > a,
  .main-nav > .nav-item > a{
    min-height:42px!important;
    justify-content:flex-start!important;
    padding:0 14px!important;
    font-size:15px!important;
  }
  .main-nav .nav-item{display:block!important}
  .main-nav .submenu{
    position:static!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 0 0 14px!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    box-shadow:none!important;
    background:transparent!important;
    border:0!important;
    display:none!important;
    pointer-events:auto!important;
  }
  .main-nav .nav-item.open > .submenu{display:grid!important}
  .main-nav .submenu a{
    min-height:38px!important;
    width:100%!important;
    font-size:13px!important;
    padding:0 12px!important;
  }

  .language-switcher{
    grid-area:lang!important;
    display:none!important;
    width:100%!important;
    justify-self:stretch!important;
  }
  .site-header.mobile-open .language-switcher{display:block!important}
  .lang-trigger{width:100%!important;min-width:0!important;justify-content:space-between!important}
  .lang-menu{
    position:static!important;
    width:100%!important;
    margin-top:7px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .header-actions{
    grid-area:actions!important;
    display:none!important;
    width:100%!important;
    justify-self:stretch!important;
    gap:8px!important;
  }
  .site-header.mobile-open .header-actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .header-actions .theme-button{
    width:100%!important;
    min-width:0!important;
    min-height:40px!important;
    padding:0 12px!important;
  }

  /* Hero */
  .hero{min-height:430px!important}
  .hero-content{min-height:430px!important;padding:0!important}
  .hero .hero-copy--yellow-strike{
    width:100%!important;
    max-width:620px!important;
    padding:52px 0 44px!important;
  }
  .hero .hero-strike-badge{font-size:11px!important;min-height:30px!important;padding:0 11px!important}
  .hero .hero-strike-title{font-size:clamp(44px,11vw,64px)!important;line-height:.86!important}
  .hero .hero-strike-copy{font-size:14px!important;max-width:520px}
  .hero .hero-strike-actions{flex-direction:row!important;align-items:center!important;gap:10px!important}
  .hero .hero-strike-btn{min-width:150px!important;min-height:44px!important;padding:0 16px!important}

  /* Feature slider */
  .feature-slider-wrap{overflow:hidden!important}
  .feature-slide{min-width:100%!important;height:170px!important}
  .feature-content{padding:16px 18px!important}
  .feature-content h3{font-size:26px!important;line-height:1!important}
  .feature-content p{font-size:12px!important;line-height:1.35!important}

  /* CTA download */
  .download-cta-shell{grid-template-columns:1fr!important}
  .download-cta-copy{padding:26px 22px!important}
  .download-cta-title{font-size:clamp(34px,9vw,46px)!important}
  .download-cta-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important}
  .download-cta-actions .theme-button{min-width:0!important;width:100%!important;padding:0 11px!important;font-size:13px!important}
  .download-cta-art{min-height:180px!important;margin-left:0!important;clip-path:none!important}
  .download-cta-status{grid-template-columns:1fr 1fr!important;padding:20px 22px!important;gap:12px!important}
  .download-status-title{grid-column:1/-1!important}

  /* News */
  .news-section--variant01 .news-shell-fx{padding:26px 18px 30px!important}
  .news-prism-grid{grid-template-columns:1fr!important;gap:14px!important}
  .news-prism-hero{grid-template-columns:1fr!important;min-height:0!important}
  .news-prism-copy{padding:24px 20px!important}
  .news-prism-title{font-size:clamp(30px,9vw,42px)!important;line-height:.96!important}
  .news-prism-media{min-height:190px!important;clip-path:none!important}
  .news-prism-feed{grid-auto-rows:auto!important;gap:10px!important}
  .news-prism-quick{grid-template-columns:96px minmax(0,1fr)!important;height:auto!important;max-height:none!important;min-height:102px!important}
  .news-prism-thumb{height:auto!important;min-height:102px!important;margin-right:-10px!important}
  .news-prism-quick-copy{height:auto!important;min-height:102px!important;padding:13px 14px 12px 20px!important}
  .news-prism-quick-copy h4{font-size:19px!important;line-height:1!important;margin:6px 0 4px!important}

  /* Events */
  .events-shell{padding:26px 18px 30px!important}
  .events-head{margin-bottom:18px!important;gap:12px!important}
  .events-days{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .events-day{min-height:44px!important;font-size:15px!important}
  .events-grid{grid-template-columns:1fr!important;gap:11px!important}
  .event-card{grid-template-columns:74px minmax(0,1fr)!important;min-height:116px!important}
  .event-time{font-size:19px!important;padding:10px 12px 10px 7px!important}
  .event-copy{padding:16px 14px 16px 22px!important}
  .event-name{font-size:22px!important}
  .event-subtitle{font-size:12px!important}
  .event-media{grid-column:1/-1!important;min-height:122px!important;clip-path:none!important}
  .event-countdown{min-width:120px!important;min-height:32px!important;font-size:13px!important}

  /* Ranking */
  .ranking-section .section-shell{padding:26px 14px 30px!important}
  .ranking-grid,.guild-home-panel{grid-template-columns:1fr!important;gap:16px!important}
  .ranking-header{min-height:72px!important;padding:12px 14px 10px!important}
  .ranking-title{font-size:28px!important}
  .rank-row.visual-row{
    grid-template-columns:48px minmax(0,1fr) 104px!important;
    height:45px!important;min-height:45px!important;max-height:45px!important;
  }
  .rank-row.visual-row .rank-num{height:45px!important;font-size:17px!important}
  .rank-row.visual-row .rank-main{height:45px!important;padding-left:18px!important}
  .rank-row.visual-row .rank-name{font-size:15px!important}
  .rank-row.visual-row .rank-meta{font-size:10px!important}
  .rank-row.visual-row .rank-pic{height:45px!important}

  /* Footer */
  .site-footer-ref-v36 .footer-ref-wrap{padding-left:0!important;padding-right:0!important}
  .site-footer-ref-v36 .footer-ref-search{grid-template-columns:1fr!important;gap:14px!important}
  .site-footer-ref-v36 .footer-ref-search-form{grid-template-columns:1fr auto!important}
  .site-footer-ref-v36 .footer-ref-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:26px 18px!important}
  .site-footer-ref-v36 .footer-ref-bottom{grid-template-columns:1fr!important;gap:12px!important}
  .site-footer-ref-v36 .footer-ref-bottom-links{flex-wrap:wrap!important;gap:8px 14px!important}
}

@media(max-width:520px){
  .wrap{width:calc(100% - 20px)!important}
  .hero{min-height:400px!important}
  .hero-content{min-height:400px!important}
  .hero .hero-copy--yellow-strike{padding:42px 0 36px!important}
  .hero .hero-strike-title{font-size:clamp(38px,12.8vw,52px)!important}
  .hero .hero-strike-actions{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important}
  .hero .hero-strike-btn{min-width:0!important;width:100%!important;padding:0 10px!important;font-size:13px!important}

  .download-cta-actions{grid-template-columns:1fr!important}
  .download-cta-status{grid-template-columns:1fr!important}
  .download-status-title{grid-column:auto!important}

  .section-head .display-title{font-size:clamp(36px,12vw,48px)!important}
  .section-shell{padding-left:14px!important;padding-right:14px!important}

  .news-prism-quick{grid-template-columns:86px minmax(0,1fr)!important}
  .news-prism-thumb{min-height:96px!important}
  .news-prism-quick-copy{min-height:96px!important;padding-left:18px!important}

  .events-days{grid-template-columns:repeat(4,minmax(0,1fr))!important}
  .events-day{font-size:14px!important}
  .event-card{grid-template-columns:68px minmax(0,1fr)!important}
  .event-time{font-size:18px!important}

  .rank-row.visual-row{grid-template-columns:46px minmax(0,1fr) 88px!important}
  .rank-row.visual-row .rank-name{font-size:14px!important}
  .rank-row.visual-row .rank-meta{font-size:9px!important}

  .site-footer-ref-v36 .footer-ref-grid{grid-template-columns:1fr!important}
  .site-footer-ref-v36 .footer-ref-search-form{grid-template-columns:1fr!important}
  .site-footer-ref-v36 .footer-ref-submit{width:100%!important}
}


/* ==========================================================
   v1.5.3 — Responsive polish: Noticias / CTA / Footer / Header
   ========================================================== */

/* Banderas reales compartidas del CMS. */
.lang-flag{
  display:block;
  width:20px;
  height:14px;
  object-fit:cover;
  border:1px solid rgba(255,255,255,.16);
  box-shadow:0 1px 4px rgba(0,0,0,.16);
  flex:0 0 auto;
}
.lang-chip,.lang-option{align-items:center!important}
.lang-option .lang-flag{width:22px;height:15px}

@media(max-width:900px){
  /* Header: logo realmente centrado; idioma visible junto al hamburguesa. */
  .site-header .nav-shell{
    position:relative!important;
    grid-template-columns:1fr!important;
    grid-template-areas:
      "online"
      "nav"
      "actions"!important;
    min-height:72px!important;
    padding-top:72px!important;
    padding-bottom:8px!important;
    gap:8px!important;
  }
  .site-header .brand{
    position:absolute!important;
    top:11px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
    z-index:42!important;
    justify-self:auto!important;
    width:max-content!important;
    max-width:46vw!important;
  }
  .site-header .mobile-menu-toggle{
    position:absolute!important;
    top:16px!important;
    right:0!important;
    z-index:44!important;
    display:flex!important;
  }
  .site-header .language-switcher{
    position:absolute!important;
    top:16px!important;
    right:54px!important;
    z-index:46!important;
    display:block!important;
    width:auto!important;
    min-width:0!important;
    justify-self:auto!important;
  }
  .site-header.mobile-open .language-switcher{display:block!important}
  .site-header .lang-trigger{
    width:auto!important;
    min-width:68px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 10px!important;
    gap:7px!important;
    justify-content:center!important;
  }
  .site-header .lang-chip{gap:7px!important}
  .site-header .lang-arrow{font-size:10px!important}
  .site-header .lang-menu{
    position:absolute!important;
    top:calc(100% + 7px)!important;
    right:0!important;
    left:auto!important;
    width:min(286px,calc(100vw - 28px))!important;
    margin:0!important;
    padding:10px!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    background:#0d1725!important;
    border:1px solid rgba(255,255,255,.10)!important;
    box-shadow:0 16px 34px rgba(0,0,0,.30)!important;
  }
  .site-header .lang-option{
    min-height:40px!important;
    padding:0 10px!important;
    justify-content:flex-start!important;
    gap:9px!important;
  }

  /* El selector ya no ocupa una fila dentro del drawer. */
  .main-nav{grid-area:nav!important}
  .online-box{grid-area:online!important}
  .header-actions{grid-area:actions!important}

  /* Descarga/Juega móvil: solo texto + botones, sin arte ni bloque status. */
  .download-cta-shell{
    display:block!important;
    grid-template-columns:none!important;
  }
  .download-cta-art,
  .download-cta-status{
    display:none!important;
  }
  .download-cta-copy{
    width:100%!important;
    padding:28px 22px 30px!important;
  }
  .download-cta-actions{
    grid-template-columns:1fr 1fr!important;
    margin-top:18px!important;
  }

  /* Noticias secundarias: imagen arriba y texto debajo. Nunca comprimir el título. */
  .news-prism-feed{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .news-prism-quick,
  .news-prism-quick.no-cover{
    grid-template-columns:1fr!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }
  .news-prism-thumb{
    width:100%!important;
    height:160px!important;
    min-height:160px!important;
    margin:0!important;
    clip-path:none!important;
    background-position:center!important;
    background-size:cover!important;
  }
  .news-prism-quick-copy,
  .news-prism-quick.no-cover .news-prism-quick-copy{
    width:100%!important;
    min-width:0!important;
    min-height:0!important;
    height:auto!important;
    padding:18px 18px 17px!important;
    overflow:visible!important;
    justify-content:flex-start!important;
  }
  .news-prism-quick-copy h4,
  .news-prism-quick-copy h4 a,
  .news-prism-quick-copy .wm-news-titlefx{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    max-height:none!important;
    margin:8px 0 7px!important;
    font-size:22px!important;
    line-height:1.02!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:normal!important;
    hyphens:none!important;
    overflow:visible!important;
  }

  /* Footer móvil: contenido centrado y visualmente equilibrado. */
  .site-footer-ref-v36 .footer-ref-wrap,
  .site-footer-ref-v36 .footer-ref-search-copy,
  .site-footer-ref-v36 .footer-ref-col,
  .site-footer-ref-v36 .footer-ref-col--server,
  .site-footer-ref-v36 .footer-ref-disclaimer,
  .site-footer-ref-v36 .footer-ref-bottom{
    text-align:center!important;
  }
  .site-footer-ref-v36 .footer-ref-search{
    justify-items:center!important;
  }
  .site-footer-ref-v36 .footer-ref-search-copy{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
  }
  .site-footer-ref-v36 .footer-ref-search-form{
    width:min(100%,520px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .site-footer-ref-v36 .footer-ref-grid{
    justify-items:center!important;
  }
  .site-footer-ref-v36 .footer-ref-col{
    width:100%!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
  }
  .site-footer-ref-v36 .footer-ref-col h4::after{
    margin-left:auto!important;
    margin-right:auto!important;
  }
  .site-footer-ref-v36 .footer-ref-col a{
    width:max-content!important;
    max-width:100%!important;
  }
  .site-footer-ref-v36 .footer-ref-time{
    justify-content:center!important;
  }
  .site-footer-ref-v36 .footer-ref-socials,
  .site-footer-ref-v36 .footer-ref-bottom-links{
    justify-content:center!important;
  }
  .site-footer-ref-v36 .footer-ref-bottom{
    justify-items:center!important;
  }
}

@media(max-width:520px){
  .site-header .brand{max-width:44vw!important}
  .site-header .brand-copy b{font-size:11px!important}
  .site-header .brand-copy small{font-size:7px!important}
  .site-header .lang-trigger{min-width:64px!important;padding:0 8px!important}
  .site-header .lang-flag{width:18px;height:13px}

  .download-cta-actions{grid-template-columns:1fr!important}

  .news-prism-thumb{height:145px!important;min-height:145px!important}
  .news-prism-quick-copy h4,
  .news-prism-quick-copy h4 a,
  .news-prism-quick-copy .wm-news-titlefx{font-size:21px!important}

  .site-footer-ref-v36 .footer-ref-grid{grid-template-columns:1fr!important}
  .site-footer-ref-v36 .footer-ref-search-form{grid-template-columns:1fr!important}
}

@media(max-width:360px){
  .site-header .brand-copy{display:none!important}
  .site-header .brand{max-width:none!important}
}


/* ==========================================================
   v1.5.4 — Mobile footer centrado + selector solo banderas
   ========================================================== */
@media(max-width:900px){
  /* Header móvil: IDIOMA ----- LOGO ----- MENÚ */
  .site-header .language-switcher{
    left:0 !important;
    right:auto !important;
    top:16px !important;
  }
  .site-header .brand{
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
  }
  .site-header .mobile-menu-toggle{
    left:auto !important;
    right:0 !important;
    top:16px !important;
  }

  /* El selector móvil muestra exclusivamente las banderas. */
  .site-header .lang-trigger{
    width:46px !important;
    min-width:46px !important;
    height:40px !important;
    min-height:40px !important;
    padding:0 !important;
    justify-content:center !important;
    gap:0 !important;
  }
  .site-header .lang-trigger .code,
  .site-header .lang-trigger .lang-arrow,
  .site-header .lang-option .code{
    display:none !important;
  }
  .site-header .lang-trigger .lang-chip{
    display:flex !important;
    width:100% !important;
    height:100% !important;
    align-items:center !important;
    justify-content:center !important;
    gap:0 !important;
  }
  .site-header .lang-trigger .lang-flag{
    width:27px !important;
    height:18px !important;
  }
  .site-header .lang-menu{
    left:0 !important;
    right:auto !important;
    top:calc(100% + 7px) !important;
    width:min(250px,calc(100vw - 20px)) !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:8px !important;
    padding:10px !important;
  }
  .site-header .lang-option{
    min-width:0 !important;
    min-height:44px !important;
    width:100% !important;
    padding:0 !important;
    justify-content:center !important;
    align-items:center !important;
    gap:0 !important;
  }
  .site-header .lang-option .lang-flag{
    width:29px !important;
    height:19px !important;
  }

  /* Footer móvil: forzar centro real incluso sobre reglas legacy. */
  .site-footer-ref-v36 .footer-ref-wrap{
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-footer-ref-v36 .footer-ref-search{
    width:100% !important;
    justify-items:center !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-search-copy,
  .site-footer-ref-v36 .footer-ref-search-copy h3{
    width:100% !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-chip{
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-footer-ref-v36 .footer-ref-search-form{
    margin-left:auto !important;
    margin-right:auto !important;
    justify-items:center !important;
  }
  .site-footer-ref-v36 .footer-ref-search-form input{
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-submit{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .site-footer-ref-v36 .footer-ref-grid{
    width:100% !important;
    justify-items:center !important;
    align-items:start !important;
  }
  .site-footer-ref-v36 .footer-ref-grid > .footer-ref-col{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-items:center !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-grid > .footer-ref-col > h4{
    width:100% !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-grid > .footer-ref-col > h4::after{
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-footer-ref-v36 .footer-ref-grid > .footer-ref-col > a{
    display:inline-flex !important;
    width:max-content !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    align-self:center !important;
    justify-content:center !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-col--server .footer-ref-time{
    width:100% !important;
    justify-content:center !important;
    text-align:center !important;
    flex-wrap:wrap !important;
  }
  .site-footer-ref-v36 .footer-ref-socials{
    width:100% !important;
    justify-content:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-footer-ref-v36 .footer-ref-disclaimer{
    width:100% !important;
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }
  .site-footer-ref-v36 .footer-ref-bottom{
    width:100% !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-bottom-links{
    width:100% !important;
    justify-content:center !important;
    align-items:center !important;
  }
  .site-footer-ref-v36 .footer-ref-bottom-links a{
    margin-left:auto !important;
    margin-right:auto !important;
    justify-content:center !important;
    text-align:center !important;
  }
  .site-footer-ref-v36 .footer-ref-copy{
    width:100% !important;
    text-align:center !important;
  }
}

@media(max-width:520px){
  .site-header .lang-trigger{
    width:42px !important;
    min-width:42px !important;
    padding:0 !important;
  }
  .site-header .lang-trigger .lang-flag{
    width:25px !important;
    height:17px !important;
  }
  .site-header .lang-menu{
    width:min(238px,calc(100vw - 16px)) !important;
  }
}


/* ==========================================================
   v1.5.5 — Selector de idioma solo con banderas en desktop
   ========================================================== */

/* Trigger: únicamente la bandera actual, también en escritorio. */
.site-header .lang-trigger{
  min-width:48px !important;
  width:48px !important;
  padding:0 !important;
  gap:0 !important;
  justify-content:center !important;
}
.site-header .lang-trigger .lang-chip{
  width:100% !important;
  height:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:0 !important;
}
.site-header .lang-trigger .code,
.site-header .lang-trigger .lang-arrow{
  display:none !important;
}
.site-header .lang-trigger .lang-flag{
  width:27px !important;
  height:18px !important;
  object-fit:cover !important;
}

/* Dropdown: únicamente banderas; el nombre del idioma queda en aria-label/title. */
.site-header .lang-menu{
  width:224px !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:8px !important;
  padding:10px !important;
}
.site-header .lang-option{
  min-width:0 !important;
  min-height:44px !important;
  width:100% !important;
  padding:0 !important;
  gap:0 !important;
  justify-content:center !important;
  align-items:center !important;
}
.site-header .lang-option .code{
  display:none !important;
}
.site-header .lang-option .lang-flag{
  width:29px !important;
  height:19px !important;
  object-fit:cover !important;
}

@media(max-width:900px){
  .site-header .lang-menu{
    width:min(250px,calc(100vw - 20px)) !important;
  }
}


/* ==========================================================
   v1.6.3 — Hero global para páginas de módulos
   Mismo Yellow Strike aprobado; SIN feature slider.
   ========================================================== */
.nyxprism-module-page .hero--module{
  min-height:430px;
  border-bottom:1px solid rgba(19,217,228,.16);
}
.nyxprism-module-page .hero--module .hero-content{
  min-height:430px;
}
.nyxprism-module-page .hero--module .hero-overlay{
  background:rgba(7,17,27,.52);
}
.nyxprism-module-page .hero--module + .nyxprism-module-main{
  padding-top:54px;
}

/* En módulos mantenemos el hero más compacto que en Home
   para dar contexto visual sin empujar demasiado el contenido. */
@media(min-width:901px){
  .nyxprism-module-page .hero--module .hero-strike-title{
    font-size:clamp(50px,4.6vw,72px);
  }
  .nyxprism-module-page .hero--module .hero-copy--yellow-strike{
    max-width:760px;
  }
}

@media(max-width:900px){
  .nyxprism-module-page .hero--module,
  .nyxprism-module-page .hero--module .hero-content{
    min-height:400px !important;
  }
  .nyxprism-module-page .hero--module + .nyxprism-module-main{
    padding-top:38px !important;
  }
}

@media(max-width:520px){
  .nyxprism-module-page .hero--module,
  .nyxprism-module-page .hero--module .hero-content{
    min-height:370px !important;
  }
  .nyxprism-module-page .hero--module .hero-copy--yellow-strike{
    padding-top:36px !important;
    padding-bottom:30px !important;
  }
  .nyxprism-module-page .hero--module + .nyxprism-module-main{
    padding-top:30px !important;
  }
}


/* ==========================================================
   v1.6.4 — Module Hero / Page Title
   Compact title hero inspired by the approved reference.
   Home keeps Yellow Strike + slider; modules use this header only.
   ========================================================== */
.nyxprism-module-page .module-hero{
  position:relative;
  min-height:320px;
  overflow:hidden;
  background:#07111b;
  border-bottom:1px solid rgba(19,217,228,.30);
  isolation:isolate;
}
.nyxprism-module-page .module-hero-media{
  position:absolute;
  inset:0;
  z-index:-4;
  width:100%;
  height:100%;
  object-fit:cover;
  background-position:center;
  background-size:cover;
  filter:saturate(.72) contrast(1.06) brightness(.48);
}
.nyxprism-module-page .module-hero-shade{
  position:absolute;
  inset:0;
  z-index:-3;
  background:rgba(5,11,18,.72);
}
.nyxprism-module-page .module-hero::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:var(--cyan);
  z-index:3;
}
.nyxprism-module-page .module-hero::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  width:min(260px,32vw);
  height:3px;
  transform:translateX(-50%);
  background:var(--pink);
  z-index:3;
}
.nyxprism-module-page .module-hero-outline{
  position:absolute;
  z-index:-2;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  width:94%;
  color:transparent;
  -webkit-text-stroke:2px rgba(255,255,255,.13);
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:clamp(110px,14vw,230px);
  line-height:.82;
  letter-spacing:-.035em;
  text-align:center;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  user-select:none;
  pointer-events:none;
}
.nyxprism-module-page .module-hero-inner{
  min-height:320px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  position:relative;
  z-index:2;
  text-align:center;
  padding-top:32px;
  padding-bottom:32px;
}
.nyxprism-module-page .module-hero-kicker{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  margin-bottom:10px;
  padding:0 12px;
  background:var(--cyan);
  color:#07111b;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:11px;
  letter-spacing:.11em;
  text-transform:uppercase;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
}
.nyxprism-module-page .module-hero-title{
  margin:0;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:clamp(46px,5vw,78px);
  line-height:.9;
  letter-spacing:.02em;
  text-transform:uppercase;
  text-shadow:0 4px 24px rgba(0,0,0,.42);
}
.nyxprism-module-page .module-hero-title::after{
  content:"";
  display:block;
  width:86px;
  height:4px;
  margin:15px auto 0;
  background:var(--yellow);
  clip-path:polygon(0 0,100% 0,92% 100%,0 100%);
}
.nyxprism-module-page .module-hero-breadcrumb{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
  color:rgba(255,255,255,.72);
  font-size:13px;
}
.nyxprism-module-page .module-hero-breadcrumb a{
  display:inline-flex;
  align-items:center;
  gap:6px;
  color:#fff;
  text-decoration:none;
  transition:color .18s ease;
}
.nyxprism-module-page .module-hero-breadcrumb a:hover{color:var(--cyan)}
.nyxprism-module-page .module-hero-breadcrumb svg{
  width:15px;
  height:15px;
  fill:currentColor;
}
.nyxprism-module-page .module-hero-separator{
  color:var(--cyan);
  font-weight:900;
}

/* The page hero is now the title; do not repeat a generic title inside the shell. */
.nyxprism-module-page .nyxprism-module-main{
  padding-top:54px !important;
}
.nyxprism-module-page .nyxprism-module-shell{
  padding-top:30px;
}

/* Retire the v1.6.3 Yellow Strike module hero if stale markup is cached. */
.nyxprism-module-page .hero--module{display:none !important}

@media(max-width:900px){
  .nyxprism-module-page .module-hero,
  .nyxprism-module-page .module-hero-inner{min-height:270px}
  .nyxprism-module-page .module-hero-outline{
    font-size:clamp(86px,19vw,150px);
    -webkit-text-stroke:1.5px rgba(255,255,255,.12);
  }
  .nyxprism-module-page .module-hero-title{font-size:clamp(40px,9vw,64px)}
  .nyxprism-module-page .nyxprism-module-main{padding-top:38px !important}
}
@media(max-width:520px){
  .nyxprism-module-page .module-hero,
  .nyxprism-module-page .module-hero-inner{min-height:230px}
  .nyxprism-module-page .module-hero-inner{padding:26px 16px}
  .nyxprism-module-page .module-hero-kicker{font-size:9px;min-height:25px}
  .nyxprism-module-page .module-hero-title{font-size:clamp(34px,11vw,48px)}
  .nyxprism-module-page .module-hero-outline{font-size:clamp(72px,24vw,112px)}
  .nyxprism-module-page .module-hero-breadcrumb{font-size:12px;margin-top:13px}
  .nyxprism-module-page .nyxprism-module-main{padding-top:28px !important}
}


/* v1.9.57 · footer search visibility hard fix */
.site-footer-ref-v36 .footer-ref-search-form input{
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
}
.site-footer-ref-v36 .footer-ref-search-form input::placeholder{
  color:#7f8aa0!important;
  -webkit-text-fill-color:#7f8aa0!important;
  opacity:1!important;
}

/* ==========================================================
   v1.9.105 — Home extras
   Castle Siege spotlight + gallery + final CTA + floating actions
   Native Prism palette / sharp angular language.
   ========================================================== */
.home-castle-section,
.home-gallery-section{
  position:relative;
  padding:0 0 34px;
  background:var(--surface);
}
.home-castle-shell,
.home-gallery-shell{
  position:relative;
  background:#fff;
  box-shadow:var(--shadow-card);
  overflow:hidden;
}
.home-castle-shell::before,
.home-gallery-shell::before{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:2px;
  z-index:5;
  background:linear-gradient(90deg,var(--cyan),var(--purple) 52%,var(--pink));
  opacity:.9;
}
.home-castle-shell{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr);
  min-height:285px;
}
.home-castle-copy{
  position:relative;
  z-index:2;
  padding:34px 34px 30px;
}
.home-extra-title{
  margin:2px 0 5px;
  color:#111b2d;
  font-size:clamp(38px,4vw,58px);
  line-height:.9;
}
.home-extra-lead{
  margin:0;
  color:var(--muted);
  font-size:13px;
}
.home-guild-profile{
  display:grid;
  grid-template-columns:112px 1fr;
  gap:22px;
  align-items:center;
  margin-top:24px;
}
.home-guild-mark{
  position:relative;
  width:112px;
  aspect-ratio:1;
  display:grid;
  place-items:center;
  background:
    linear-gradient(145deg,rgba(19,217,228,.18),transparent 42%),
    linear-gradient(180deg,#111c2c,#07121d);
  border:1px solid rgba(19,217,228,.28);
  clip-path:polygon(13px 0,100% 0,100% calc(100% - 13px),calc(100% - 13px) 100%,0 100%,0 13px);
  box-shadow:inset 0 0 28px rgba(19,217,228,.08),0 12px 25px rgba(7,18,29,.16);
}
.home-guild-mark::before,
.home-guild-mark::after{
  content:"";
  position:absolute;
  pointer-events:none;
}
.home-guild-mark::before{inset:7px;border:1px solid rgba(255,255,255,.09)}
.home-guild-mark::after{left:10px;right:10px;bottom:7px;height:2px;background:var(--cyan);box-shadow:0 0 12px rgba(19,217,228,.65)}
.home-guild-mark img{width:76%;height:76%;object-fit:contain;image-rendering:auto}
.home-guild-mark svg{width:64%;height:64%;fill:#fff;filter:drop-shadow(0 0 12px rgba(19,217,228,.38))}
.home-guild-main{min-width:0}
.home-angle-badge{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:0 12px;
  background:var(--yellow);
  color:#101827;
  font-family:var(--display-font);
  font-style:italic;
  font-size:10px;
  font-weight:1000;
  letter-spacing:.06em;
  text-transform:uppercase;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  box-shadow:0 0 0 rgba(240,215,22,0);
  animation:nyxprismHomeBadgePulse 3.2s ease-in-out infinite;
}
@keyframes nyxprismHomeBadgePulse{0%,100%{box-shadow:0 0 0 rgba(240,215,22,0)}50%{box-shadow:0 0 22px rgba(240,215,22,.26)}}
.home-guild-main h3{
  margin:6px 0 10px;
  color:#101827;
  font-family:var(--display-font);
  font-style:italic;
  font-weight:1000;
  font-size:clamp(33px,3vw,48px);
  line-height:.9;
  text-transform:uppercase;
  letter-spacing:.015em;
}
.home-guild-stats{
  display:flex;
  flex-wrap:wrap;
  gap:8px 22px;
  margin:0 0 10px;
}
.home-guild-stats span{
  position:relative;
  display:flex;
  flex-direction:column;
  min-width:100px;
  padding-left:10px;
  color:#2c3748;
  font-size:12px;
  line-height:1.25;
}
.home-guild-stats span::before{
  content:"";
  position:absolute;
  left:0;top:2px;bottom:2px;
  width:3px;
  background:var(--cyan);
  clip-path:polygon(0 0,100% 0,100% 82%,0 100%);
}
.home-guild-stats b{
  color:#778397;
  font-size:8px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.home-guild-main p{max-width:620px;margin:0;color:#7a8595;font-size:11px;line-height:1.55}
.home-castle-media{
  position:relative;
  min-height:285px;
  overflow:hidden;
  clip-path:polygon(14% 0,100% 0,100% 100%,0 100%);
  background:#07121d;
}
.home-castle-media img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.92) contrast(1.04) brightness(.82);
  transition:transform .8s cubic-bezier(.2,.75,.2,1),filter .35s ease;
}
.home-castle-shell:hover .home-castle-media img{transform:scale(1.045);filter:saturate(1.08) contrast(1.06) brightness(.88)}
.home-castle-vignette{
  position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(7,18,29,.82) 0,rgba(7,18,29,.18) 36%,rgba(7,18,29,.18) 100%),linear-gradient(0deg,rgba(7,18,29,.62),transparent 55%);
}
.home-castle-winner{
  position:absolute;
  right:24px;bottom:24px;
  display:grid;
  justify-items:center;
  min-width:180px;
  padding:14px 22px 13px;
  color:#fff;
  text-align:center;
  background:rgba(7,18,29,.82);
  border:1px solid rgba(240,215,22,.38);
  clip-path:polygon(14px 0,100% 0,calc(100% - 14px) 100%,0 100%);
  box-shadow:0 12px 34px rgba(0,0,0,.32),inset 0 -2px 0 var(--yellow);
  backdrop-filter:blur(5px);
}
.home-castle-winner small{font-size:9px;font-weight:900;letter-spacing:.16em;color:#d6dcea}
.home-castle-winner strong{font-family:var(--display-font);font-style:italic;font-size:31px;line-height:1;color:#fff}
.home-castle-winner span{margin-top:4px;color:var(--yellow);text-shadow:0 0 14px rgba(240,215,22,.7)}

.home-gallery-shell{padding:30px 28px 28px}
.home-extra-head{align-items:flex-end;margin-bottom:18px}
.home-gallery-view{
  --btn-bg:#071525;
  --btn-color:#fff;
  --btn-border:rgba(7,21,37,.15);
  --btn-accent:var(--cyan);
  min-width:135px;
}
.home-gallery-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px;
}
.home-gallery-card{
  position:relative;
  min-width:0;
  aspect-ratio:1.65;
  padding:0;
  border:0;
  overflow:hidden;
  cursor:pointer;
  background:#071525;
  clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%);
  isolation:isolate;
  box-shadow:0 8px 18px rgba(15,23,42,.12);
}
.home-gallery-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:4;
  border-top:2px solid transparent;
  border-bottom:2px solid transparent;
  transition:border-color .25s ease,box-shadow .25s ease;
  pointer-events:none;
}
.home-gallery-card img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(.88) contrast(1.03);
  transform:scale(1.015);
  transition:transform .45s cubic-bezier(.2,.75,.2,1),filter .3s ease;
}
.home-gallery-shine{
  position:absolute;
  inset:-40% auto -40% -70%;
  z-index:3;
  width:38%;
  transform:skewX(-18deg);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent);
  transition:left .55s ease;
  pointer-events:none;
}
.home-gallery-label{
  position:absolute;
  left:8px;bottom:7px;z-index:5;
  max-width:calc(100% - 16px);
  padding:4px 7px;
  color:#fff;
  background:rgba(7,18,29,.78);
  font-family:var(--display-font);
  font-style:italic;
  font-weight:900;
  font-size:9px;
  text-transform:uppercase;
  letter-spacing:.04em;
  clip-path:polygon(5px 0,100% 0,calc(100% - 5px) 100%,0 100%);
  opacity:.92;
}
.home-gallery-card:hover img,.home-gallery-card:focus-visible img{transform:scale(1.09);filter:saturate(1.12) contrast(1.06)}
.home-gallery-card:hover .home-gallery-shine,.home-gallery-card:focus-visible .home-gallery-shine{left:145%}
.home-gallery-card:hover::after,.home-gallery-card:focus-visible::after{border-color:var(--cyan);box-shadow:inset 0 0 20px rgba(19,217,228,.16)}
.home-gallery-card:focus-visible{outline:2px solid var(--purple);outline-offset:3px}

.home-final-cta{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  min-height:150px;
  background:#07121d;
  border-top:1px solid rgba(19,217,228,.24);
  border-bottom:1px solid rgba(140,92,245,.18);
}
.home-final-cta-bg{
  position:absolute;inset:0;z-index:-2;
  background-image:
    linear-gradient(90deg,rgba(7,18,29,.96) 0%,rgba(7,18,29,.76) 45%,rgba(7,18,29,.60) 100%),
    url('../images/slider/slide-1.webp');
  background-size:cover;
  background-position:center 44%;
  transform:scale(1.03);
  animation:nyxprismHomeCtaDrift 12s ease-in-out infinite alternate;
}
.home-final-cta::before{
  content:"";
  position:absolute;inset:0;z-index:-1;
  background:linear-gradient(110deg,transparent 28%,rgba(19,217,228,.10) 45%,transparent 58%),linear-gradient(90deg,transparent 65%,rgba(140,92,245,.10));
  background-size:220% 100%,100% 100%;
  animation:nyxprismHomeCtaSweep 5.8s linear infinite;
}
@keyframes nyxprismHomeCtaDrift{to{transform:scale(1.065) translateX(-.7%)}}
@keyframes nyxprismHomeCtaSweep{to{background-position:-220% 0,0 0}}
.home-final-cta-inner{
  min-height:150px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:30px;
  padding-top:25px;
  padding-bottom:25px;
}
.home-final-cta-copy{max-width:690px}
.home-final-kicker{color:var(--cyan)}
.home-final-cta h2{
  margin:2px 0 5px;
  color:#fff;
  font-family:var(--display-font);
  font-style:italic;
  font-size:clamp(34px,3.5vw,56px);
  font-weight:1000;
  line-height:.9;
  text-transform:uppercase;
  letter-spacing:.005em;
}
.home-final-cta h2::after{
  content:"";
  display:inline-block;
  width:62px;height:5px;
  margin-left:12px;
  background:var(--yellow);
  clip-path:polygon(0 0,100% 0,90% 100%,0 100%);
  vertical-align:middle;
}
.home-final-cta p{margin:0;color:#c0c8d5;font-size:12px}
.home-final-cta-actions{display:flex;align-items:center;gap:9px;flex-shrink:0}
.home-final-btn{min-width:150px;justify-content:center;font-weight:1000;gap:8px}
.home-final-btn--primary{--btn-bg:var(--yellow);--btn-color:#0a1320;--btn-border:rgba(240,215,22,.55);--btn-accent:var(--cyan)}
.home-final-btn--windows{--btn-bg:#071525;--btn-color:#fff;--btn-border:rgba(19,217,228,.52);--btn-accent:var(--cyan);min-width:185px}
.home-final-btn--android{--btn-bg:#071525;--btn-color:#fff;--btn-border:rgba(140,92,245,.58);--btn-accent:var(--purple);min-width:205px}
.home-final-platform-icon{width:20px;height:20px;flex:0 0 20px;fill:currentColor}
.home-final-btn--windows .home-final-platform-icon{color:var(--cyan)}
.home-final-btn--android .home-final-platform-icon{color:#a7d719}
.home-final-btn:hover{transform:translateY(-3px) skewX(-1deg);filter:brightness(1.03)}

.home-floating-actions{
  position:fixed;
  z-index:140;
  right:22px;
  bottom:22px;
  display:grid;
  gap:9px;
  pointer-events:none;
}
.home-float-btn{
  --float-color:var(--cyan);
  position:relative;
  width:64px;height:64px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  color:#fff;
  text-decoration:none;
  background:linear-gradient(145deg,color-mix(in srgb,var(--float-color) 88%,#fff 12%),color-mix(in srgb,var(--float-color) 58%,#071525 42%));
  border:1px solid color-mix(in srgb,var(--float-color) 74%,#fff 26%);
  border-radius:50%;
  box-shadow:0 8px 26px color-mix(in srgb,var(--float-color) 28%,transparent),inset 0 1px 0 rgba(255,255,255,.34);
  transition:transform .22s ease,box-shadow .22s ease,filter .22s ease;
  pointer-events:auto;
}
.home-float-btn::before{
  content:"";
  position:absolute;inset:-5px;
  border:1px solid color-mix(in srgb,var(--float-color) 44%,transparent);
  border-radius:50%;
  animation:nyxprismFloatRing 2.6s ease-out infinite;
}
.home-float-btn svg{width:24px;height:24px;fill:currentColor}
.home-float-btn span{font-family:var(--display-font);font-style:italic;font-size:8px;font-weight:1000;text-transform:uppercase;letter-spacing:.03em}
.home-float-btn--discord{--float-color:var(--purple)}
.home-float-btn:hover{transform:translateY(-4px) scale(1.055);filter:brightness(1.08);box-shadow:0 12px 34px color-mix(in srgb,var(--float-color) 38%,transparent),inset 0 1px 0 rgba(255,255,255,.38)}
@keyframes nyxprismFloatRing{0%{transform:scale(.88);opacity:.75}70%,100%{transform:scale(1.25);opacity:0}}

.home-gallery-lightbox[hidden]{display:none!important}
.home-gallery-lightbox{
  position:fixed;inset:0;z-index:300;
  display:grid;place-items:center;
  padding:28px;
}
.home-gallery-backdrop{position:absolute;inset:0;border:0;background:rgba(3,9,15,.89);backdrop-filter:blur(7px);cursor:zoom-out}
.home-gallery-dialog{
  position:relative;
  z-index:2;
  width:min(1120px,92vw);
  max-height:88vh;
  display:grid;
  place-items:center;
  background:#07121d;
  border:1px solid rgba(19,217,228,.35);
  clip-path:polygon(18px 0,100% 0,100% calc(100% - 18px),calc(100% - 18px) 100%,0 100%,0 18px);
  box-shadow:0 30px 80px rgba(0,0,0,.55),inset 0 -2px 0 var(--cyan);
  overflow:hidden;
}
.home-gallery-dialog img{display:block;max-width:100%;max-height:80vh;object-fit:contain}
.home-gallery-close,
.home-gallery-nav{
  position:absolute;z-index:4;
  display:grid;place-items:center;
  border:0;
  color:#fff;
  background:rgba(7,18,29,.78);
  box-shadow:inset 0 -2px 0 var(--cyan);
  cursor:pointer;
  transition:background .2s ease,transform .2s ease;
}
.home-gallery-close{top:12px;right:12px;width:44px;height:40px;font-size:30px;clip-path:polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%)}
.home-gallery-nav{top:50%;width:48px;height:70px;transform:translateY(-50%);font-size:42px}
.home-gallery-prev{left:10px;clip-path:polygon(10px 0,100% 0,100% 100%,0 100%,0 10px)}
.home-gallery-next{right:10px;clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.home-gallery-close:hover{background:var(--purple);transform:translateY(-2px)}
.home-gallery-nav:hover{background:var(--cyan);color:#07111b}
.home-gallery-prev:hover{transform:translateY(-50%) translateX(-2px)}
.home-gallery-next:hover{transform:translateY(-50%) translateX(2px)}
.home-gallery-caption{
  position:absolute;left:50%;bottom:12px;transform:translateX(-50%);
  padding:7px 14px;
  color:#fff;
  background:rgba(7,18,29,.82);
  font-family:var(--display-font);
  font-style:italic;font-weight:900;font-size:11px;text-transform:uppercase;
  clip-path:polygon(7px 0,100% 0,calc(100% - 7px) 100%,0 100%);
}

.home-reveal{opacity:0;transform:translateY(22px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.75,.2,1)}
.home-reveal.is-visible{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  .home-angle-badge,.home-final-cta-bg,.home-final-cta::before,.home-float-btn::before{animation:none!important}
  .home-reveal{opacity:1!important;transform:none!important;transition:none!important}
  .home-gallery-card img,.home-castle-media img,.home-float-btn,.home-final-btn{transition:none!important}
}

@media(max-width:1100px){
  .home-castle-shell{grid-template-columns:1.15fr .85fr}
  .home-gallery-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
  .home-final-cta-inner{align-items:flex-start;flex-direction:column}
}
@media(max-width:760px){
  .home-castle-section,.home-gallery-section{padding-bottom:22px}
  .home-castle-shell{grid-template-columns:1fr}
  .home-castle-copy{padding:25px 18px 22px}
  .home-guild-profile{grid-template-columns:84px 1fr;gap:14px}
  .home-guild-mark{width:84px}
  .home-castle-media{min-height:210px;clip-path:polygon(0 12%,100% 0,100% 100%,0 100%)}
  .home-castle-winner{right:14px;bottom:14px;min-width:150px}
  .home-gallery-shell{padding:24px 16px 18px}
  .home-extra-head{align-items:flex-start;gap:14px;flex-direction:column}
  .home-gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .home-gallery-view{width:100%}
  .home-final-cta-inner{padding:28px 18px}
  .home-final-cta-actions{width:100%;display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
  .home-final-btn,.home-final-btn--windows,.home-final-btn--android{min-width:0}
  .home-floating-actions{right:12px;bottom:12px;gap:7px}
  .home-float-btn{width:54px;height:54px}
  .home-float-btn svg{width:21px;height:21px}
}
@media(max-width:620px){
  .home-final-cta-actions{grid-template-columns:1fr}
}
@media(max-width:480px){
  .home-guild-profile{grid-template-columns:1fr}
  .home-guild-mark{width:92px}
  .home-guild-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .home-gallery-grid{grid-template-columns:1fr 1fr}
  .home-gallery-card{aspect-ratio:1.45}
  .home-final-cta-actions{grid-template-columns:1fr}
  .home-final-cta h2::after{display:none}
  .home-gallery-lightbox{padding:10px}
  .home-gallery-nav{width:40px;height:58px}
}

/* ==========================================================
   v1.9.106 — Home spacing + compact final CTA
   - Castle/Gallery use the exact same vertical rhythm as Home.
   - Final CTA is more compact and sits flush against footer.
   ========================================================== */
.nyxprism-home .ranking-section{
  padding-bottom:0 !important;
}
.nyxprism-home .home-castle-section,
.nyxprism-home .home-gallery-section{
  padding:var(--home-section-gap) 0 0 !important;
  background:var(--surface) !important;
}
.nyxprism-home .home-final-cta{
  margin-top:var(--home-section-gap) !important;
  min-height:112px !important;
}
.nyxprism-home .home-final-cta-inner{
  min-height:112px !important;
  padding-top:16px !important;
  padding-bottom:16px !important;
  gap:24px !important;
}
.nyxprism-home .home-final-cta-copy{
  max-width:620px !important;
}
.nyxprism-home .home-final-cta h2{
  margin:1px 0 4px !important;
  font-size:clamp(30px,2.55vw,43px) !important;
  line-height:.91 !important;
}
.nyxprism-home .home-final-cta h2::after{
  width:48px !important;
  height:4px !important;
  margin-left:10px !important;
}
.nyxprism-home .home-final-cta p{
  font-size:11px !important;
}
.nyxprism-home .home-final-btn{
  min-width:142px !important;
  min-height:42px !important;
}
/* The old footer intentionally had a 54px top gap. On Home the CTA
   is the footer lead-in, so that gap must disappear completely. */
.nyxprism-home .site-footer-ref,
.nyxprism-home .site-footer-ref-v36{
  margin-top:0 !important;
}

@media(max-width:760px){
  .nyxprism-home .home-final-cta{
    min-height:0 !important;
  }
  .nyxprism-home .home-final-cta-inner{
    min-height:0 !important;
    padding-top:22px !important;
    padding-bottom:22px !important;
  }
  .nyxprism-home .home-final-cta h2{
    font-size:clamp(28px,9vw,38px) !important;
  }
}

/* ==========================================================
   v1.9.112 — desktop header overflow fix + logo left alignment
   ========================================================== */

/* Desktop header: use exactly five tracks for the five real header items.
   The previous six-track layout left an unused column and could force the
   navigation past the viewport when the larger logo was enabled. */
@media(min-width:901px){
  .site-header .nav-shell{
    grid-template-columns:290px 126px minmax(0,1fr) 120px auto !important;
    column-gap:12px !important;
    gap:12px !important;
  }

  .site-header .brand{
    min-width:0;
    width:290px !important;
    max-width:290px !important;
    justify-self:start !important;
    position:static !important;
    left:auto !important;
    margin:0 !important;
    overflow:visible;
  }
  .site-header .brand-picture{
    display:block;
    width:100% !important;
    line-height:0;
  }
  .site-header .brand-logo{
    display:block;
    width:290px !important;
    max-width:none !important;
    height:auto !important;
    object-fit:contain;
    transform:translateX(-24px);
    filter:drop-shadow(0 0 12px rgba(19,217,228,.18));
  }

  .site-header .online-box{
    min-width:0 !important;
  }
  .site-header .main-nav{
    min-width:0 !important;
  }
  .site-header .header-actions{
    min-width:0 !important;
  }
}

/* Online player number: animated theme-color rainbow. */
.online-box strong[data-online-count]{
  display:inline-block !important;
  position:relative;
  min-width:1.1ch;
  color:transparent !important;
  -webkit-text-fill-color:transparent !important;
  background-image:linear-gradient(
    100deg,
    var(--cyan) 0%,
    #8b5cf6 24%,
    var(--pink) 46%,
    var(--yellow) 68%,
    #00f0ff 84%,
    var(--cyan) 100%
  );
  background-size:320% 100%;
  background-position:0% 50%;
  -webkit-background-clip:text;
  background-clip:text;
  font-weight:1000 !important;
  letter-spacing:.02em;
  transform-origin:center;
  filter:drop-shadow(0 0 5px rgba(19,217,228,.58));
  animation:
    nyxprismOnlineRainbow 3.2s linear infinite,
    nyxprismOnlinePulse 1.65s ease-in-out infinite;
}

@keyframes nyxprismOnlineRainbow{
  0%{background-position:0% 50%}
  100%{background-position:320% 50%}
}
@keyframes nyxprismOnlinePulse{
  0%,100%{
    transform:translateZ(0) scale(1);
    filter:drop-shadow(0 0 4px rgba(19,217,228,.50));
  }
  50%{
    transform:translateZ(0) scale(1.10);
    filter:
      drop-shadow(0 0 7px rgba(139,92,246,.68))
      drop-shadow(0 0 11px rgba(255,73,177,.24));
  }
}

@media(max-width:1500px) and (min-width:1201px){
  .site-header .nav-shell{
    grid-template-columns:255px 126px minmax(0,1fr) 112px auto !important;
    gap:10px !important;
  }
  .site-header .brand{
    width:255px !important;
    max-width:255px !important;
  }
  .site-header .brand-logo{
    width:255px !important;
    transform:translateX(-18px);
  }
  .site-header .language-switcher,
  .site-header .lang-trigger{
    width:112px !important;
    min-width:112px !important;
  }
}

@media(max-width:1200px) and (min-width:901px){
  .site-header .nav-shell{
    grid-template-columns:220px 116px minmax(0,1fr) 104px auto !important;
    gap:8px !important;
  }
  .site-header .brand{
    width:220px !important;
    max-width:220px !important;
  }
  .site-header .brand-logo{
    width:220px !important;
    transform:translateX(-12px);
  }
  .site-header .language-switcher,
  .site-header .lang-trigger{
    width:104px !important;
    min-width:104px !important;
  }
}

@media(max-width:900px){
  .site-header .brand{
    width:185px !important;
    max-width:48vw !important;
  }
  .site-header .brand-picture{width:100% !important}
  .site-header .brand-logo{
    width:185px !important;
    max-width:100% !important;
    height:auto !important;
    transform:none !important;
  }
}

@media(max-width:520px){
  .site-header .brand{width:165px !important}
  .site-header .brand-logo{width:165px !important}
}

@media(max-width:360px){
  .site-header .brand{width:146px !important}
  .site-header .brand-logo{width:146px !important}
}

@media(prefers-reduced-motion:reduce){
  .online-box strong[data-online-count]{
    animation:none !important;
    background-position:42% 50%;
    transform:none !important;
  }
}

/* ==========================================================
   v1.9.113 — AdminCP configurable NyxCMS Prism
   ========================================================== */
html,body{overflow-x:clip}

/* Keep the approved v1.9.112 grid when every header element is enabled.
   Only the track list changes when an AdminCP toggle hides an element. */
@media(min-width:901px){
  .site-header .nav-shell{
    --nyxprism-brand-track:var(--nyxprism-logo-width,290px);
    --nyxprism-online-track:126px;
    --nyxprism-lang-track:120px;
    display:grid !important;
    grid-template-columns:var(--nyxprism-brand-track) var(--nyxprism-online-track) minmax(0,1fr) var(--nyxprism-lang-track) auto !important;
    gap:12px !important;
    column-gap:12px !important;
  }
  .site-header .brand{
    width:var(--nyxprism-brand-track) !important;
    max-width:var(--nyxprism-brand-track) !important;
  }
  .site-header .brand-logo{
    width:var(--nyxprism-brand-track) !important;
    transform:translateX(var(--nyxprism-logo-shift,-24px)) !important;
  }
  .nyxprism-header-no-online .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) minmax(0,1fr) var(--nyxprism-lang-track) auto !important;
  }
  .nyxprism-header-no-lang .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) var(--nyxprism-online-track) minmax(0,1fr) auto !important;
  }
  .nyxprism-header-no-auth .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) var(--nyxprism-online-track) minmax(0,1fr) var(--nyxprism-lang-track) !important;
  }
  .nyxprism-header-no-online.nyxprism-header-no-lang .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) minmax(0,1fr) auto !important;
  }
  .nyxprism-header-no-online.nyxprism-header-no-auth .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) minmax(0,1fr) var(--nyxprism-lang-track) !important;
  }
  .nyxprism-header-no-lang.nyxprism-header-no-auth .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) var(--nyxprism-online-track) minmax(0,1fr) !important;
  }
  .nyxprism-header-no-online.nyxprism-header-no-lang.nyxprism-header-no-auth .site-header .nav-shell{
    grid-template-columns:var(--nyxprism-brand-track) minmax(0,1fr) !important;
  }
}

@media(max-width:1500px) and (min-width:1201px){
  .site-header .nav-shell{
    --nyxprism-brand-track:min(var(--nyxprism-logo-width,290px),255px);
    --nyxprism-online-track:126px;
    --nyxprism-lang-track:112px;
    gap:10px !important;
  }
  .site-header .brand-logo{transform:translateX(var(--nyxprism-logo-shift,-24px)) !important}
}

@media(max-width:1200px) and (min-width:901px){
  .site-header .nav-shell{
    --nyxprism-brand-track:min(var(--nyxprism-logo-width,290px),220px);
    --nyxprism-online-track:116px;
    --nyxprism-lang-track:104px;
    gap:8px !important;
  }
  .site-header .brand-logo{transform:translateX(var(--nyxprism-logo-shift,-24px)) !important}
}

@media(max-width:900px){
  .site-header .brand{
    width:var(--nyxprism-logo-mobile-width,185px) !important;
    max-width:min(48vw,var(--nyxprism-logo-mobile-width,185px)) !important;
  }
  .site-header .brand-logo{
    width:var(--nyxprism-logo-mobile-width,185px) !important;
    max-width:100% !important;
  }
  /* Missing optional rows collapse naturally in the mobile drawer. */
  .nyxprism-header-no-lang .site-header .brand{max-width:min(58vw,var(--nyxprism-logo-mobile-width,185px)) !important}
}

.nyxprism-header-not-sticky .site-header{
  position:relative !important;
  top:auto !important;
}

.nyxprism-online-static .online-box strong[data-online-count]{
  animation:none !important;
  background-position:42% 50% !important;
  transform:none !important;
}

/* The configurable palette also drives the online-number rainbow. */
.online-box strong[data-online-count]{
  background-image:linear-gradient(
    100deg,
    var(--cyan) 0%,
    var(--purple) 24%,
    var(--pink) 46%,
    var(--yellow) 68%,
    var(--blue) 84%,
    var(--cyan) 100%
  ) !important;
}


/* ==========================================================
   v1.9.115 — compact desktop/tablet header
   Prevents menu labels from being squeezed/cropped on narrow windows
   without changing the rest of the page to the mobile layout.
   ========================================================== */
@media (min-width:901px) and (max-width:1240px){
  .site-header .nav-shell{
    display:grid !important;
    grid-template-columns:auto auto minmax(0,1fr) auto auto !important;
    grid-template-areas:
      "brand online . lang toggle"
      "nav nav nav nav nav"
      "actions actions actions actions actions" !important;
    align-items:center !important;
    gap:8px 10px !important;
    min-height:78px !important;
    padding-top:7px !important;
    padding-bottom:7px !important;
  }

  .site-header .brand{
    grid-area:brand !important;
    position:static !important;
    width:min(var(--nyxprism-logo-width,290px),220px) !important;
    max-width:220px !important;
    margin:0 !important;
    transform:none !important;
    overflow:visible !important;
  }
  .site-header .brand-picture{
    width:100% !important;
  }
  .site-header .brand-logo{
    width:min(var(--nyxprism-logo-width,290px),220px) !important;
    max-width:220px !important;
    height:auto !important;
    transform:translateX(clamp(-18px,var(--nyxprism-logo-shift,-12px),0px)) !important;
  }

  .site-header .online-box{
    grid-area:online !important;
    display:block !important;
    width:116px !important;
    min-width:116px !important;
    padding:0 10px !important;
  }

  .site-header .mobile-menu-toggle{
    grid-area:toggle !important;
    display:flex !important;
    position:static !important;
    justify-self:end !important;
    width:44px !important;
    height:42px !important;
    min-width:44px !important;
    z-index:44 !important;
  }

  .site-header .language-switcher{
    grid-area:lang !important;
    position:relative !important;
    display:block !important;
    width:auto !important;
    min-width:0 !important;
    justify-self:end !important;
  }
  .site-header .lang-trigger{
    width:68px !important;
    min-width:68px !important;
    height:42px !important;
    min-height:42px !important;
    padding:0 9px !important;
    gap:6px !important;
    justify-content:center !important;
  }
  .site-header .lang-trigger .code,
  .site-header .lang-trigger .lang-arrow{
    display:none !important;
  }
  .site-header .lang-menu{
    right:0 !important;
    left:auto !important;
    top:calc(100% + 8px) !important;
  }

  .site-header .main-nav{
    grid-area:nav !important;
    display:none !important;
    width:100% !important;
    min-width:0 !important;
    flex-direction:column !important;
    align-items:stretch !important;
    justify-content:flex-start !important;
    flex-wrap:nowrap !important;
    gap:5px !important;
    padding:8px 0 4px !important;
  }
  .site-header.mobile-open .main-nav{
    display:flex !important;
  }
  .site-header .main-nav > a,
  .site-header .main-nav > .nav-item,
  .site-header .main-nav > .nav-item > a{
    width:100% !important;
    min-width:0 !important;
    flex:0 0 auto !important;
  }
  .site-header .main-nav > a,
  .site-header .main-nav > .nav-item > a{
    min-height:42px !important;
    padding:0 16px !important;
    justify-content:flex-start !important;
    overflow:visible !important;
    white-space:nowrap !important;
    font-size:14px !important;
  }
  .site-header .main-nav .nav-item{
    display:block !important;
  }
  .site-header .main-nav .submenu{
    position:static !important;
    width:100% !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 0 0 16px !important;
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
    box-shadow:none !important;
    background:transparent !important;
    border:0 !important;
    display:none !important;
    pointer-events:auto !important;
  }
  .site-header .main-nav .nav-item.open > .submenu{
    display:grid !important;
  }
  .site-header .main-nav .submenu a{
    width:100% !important;
    min-height:38px !important;
    padding:0 12px !important;
    white-space:nowrap !important;
  }

  .site-header .header-actions{
    grid-area:actions !important;
    display:none !important;
    width:100% !important;
    min-width:0 !important;
    justify-content:flex-end !important;
    gap:8px !important;
    padding-top:2px !important;
  }
  .site-header.mobile-open .header-actions{
    display:flex !important;
  }
  .site-header .header-actions .theme-button{
    min-width:140px !important;
    min-height:40px !important;
  }

  .nyxprism-header-no-online .site-header .online-box,
  .nyxprism-header-no-lang .site-header .language-switcher,
  .nyxprism-header-no-auth .site-header .header-actions{
    display:none !important;
  }
}