@import url("https://fonts.googleapis.com/css2?family=Oxanium:wght@400;500;600;700;800&family=Pixelify+Sans:wght@400..700&display=swap");


:root{
  --bg:#09060f;
  --bg-2:#11081f;
  --panel:rgba(20,12,33,.72);
  --panel-2:rgba(28,16,47,.85);
  --line:rgba(201,143,255,.25);
  --primary:#b26bff;
  --primary-2:#7d42ff;
  --primary-3:#e2b8ff;
  --text:#f7f2ff;
  --muted:#cdbfdf;
  --shadow:0 14px 48px rgba(93, 41, 171, .28);
  --radius:24px;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:"Oxanium","Segoe UI",system-ui,sans-serif;
  color:var(--text);
  background:var(--bg);
  min-height:100vh;
  overflow-x:hidden;
}

.site-bg,
.site-overlay{
  position:fixed; inset:0; pointer-events:none; z-index:-2;
}
.site-bg{
  background:
    linear-gradient(rgba(9,6,15,.45), rgba(9,6,15,.75)),
    url("../assets/checkpoint-bg.webp?v=127") center/cover no-repeat;
  transform:scale(1.02);
  filter:saturate(1.08);
}
.site-overlay{
  z-index:-1;
  background:
    radial-gradient(circle at 20% 20%, rgba(190, 97, 255, .22), transparent 24%),
    radial-gradient(circle at 80% 22%, rgba(84, 85, 255, .16), transparent 18%),
    radial-gradient(circle at 50% 80%, rgba(190, 97, 255, .12), transparent 28%);
}

a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
button,input,select{font:inherit;color:inherit}

.page{
  width:min(1360px, calc(100% - 34px));
  margin:34px auto 0;
  padding-bottom:44px;
}

.glass{
  background:linear-gradient(180deg, rgba(28,16,47,.82), rgba(14,8,25,.72));
  border:1px solid var(--line);
  border-radius:var(--radius);
  backdrop-filter:blur(18px);
  box-shadow:var(--shadow);
}

.padded{padding:28px}
.muted{color:var(--muted)}
.status-dot{
  width:10px;height:10px;border-radius:50%;
  display:inline-block;background:var(--primary);
  box-shadow:0 0 18px var(--primary);
}

.site-header{
  width:min(1450px, calc(100% - 34px));
  margin:18px auto 0;
  height:96px;
  padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  position:sticky; top:16px; z-index:40;
  background:rgba(12,8,19,.78);
  border:1px solid var(--line);
  border-radius:22px;
  backdrop-filter:blur(20px);
  box-shadow:var(--shadow);
}
.brand img{height:66px;width:auto;object-fit:contain}
.nav-links{
  display:flex;align-items:center;gap:36px;
  font-weight:800;
}
.nav-links a{
  position:relative;
  color:rgba(255,255,255,.92);
  transition:.25s ease;
}
.nav-links a:hover,
.nav-links a.active{color:var(--primary-3)}
.nav-links a.active::after{
  content:"";
  width:40px;height:3px;border-radius:999px;
  background:linear-gradient(90deg, var(--primary), var(--primary-3));
  position:absolute;left:50%;transform:translateX(-50%);
  bottom:-16px;
  box-shadow:0 0 18px var(--primary);
}

.menu-toggle{display:none;background:transparent;border:0}
.menu-toggle span{
  display:block;width:28px;height:3px;margin:5px 0;border-radius:999px;
  background:white;
}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:0 24px;border:1px solid transparent;border-radius:14px;
  font-weight:900;text-transform:uppercase;letter-spacing:.02em;
  transition:.25s ease;cursor:pointer;
}
.btn-primary{
  background:linear-gradient(135deg, var(--primary), var(--primary-2));
  color:white;
  box-shadow:0 10px 30px rgba(125,66,255,.4);
}
.btn-primary:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn-secondary{
  background:rgba(255,255,255,.04);
  border-color:rgba(196,134,255,.35);
}
.btn-secondary:hover{
  background:rgba(178,107,255,.1);
  border-color:rgba(196,134,255,.55);
}

.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 16px;border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid var(--line);
  text-transform:uppercase;font-weight:800;font-size:.82rem;letter-spacing:.04em;
}

h1{
  font-size:clamp(3rem, 6.5vw, 6rem);
  line-height:.95;
  margin:22px 0 18px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:-.05em;
}
h1 span, h2 span{color:var(--primary-3)}
p{line-height:1.7;color:var(--muted)}

.hero{
  min-height:670px;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:28px;
  align-items:center;
}
.hero-copy{padding:34px}
.hero-side{padding:28px; align-self:stretch; display:flex; flex-direction:column; justify-content:space-between}
.hero-side-logo{max-width:280px; margin:0 auto 20px}
.mini-panel{
  padding:20px;border-radius:18px;
  border:1px solid rgba(201,143,255,.16);
  background:rgba(255,255,255,.03);
}
.mini-panel h3{margin-bottom:8px}
.stats-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:20px;
}
.stats-grid div{
  padding:18px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(201,143,255,.14);
}
.stats-grid span{display:block;font-size:1.6rem;font-weight:900;color:var(--primary-3)}
.stats-grid small{color:var(--muted)}

.feature-row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:14px;
  margin:32px 0;
}
.feature-row article,
.mini-feature-grid article{
  padding:18px;border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
}
.feature-row strong,.mini-feature-grid strong{display:block;margin-top:10px;font-size:.94rem;text-transform:uppercase}
.feature-row small,.mini-feature-grid small{color:var(--muted)}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px}

.icon-badge{
  width:42px;height:42px;border-radius:14px;
  display:inline-flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg, rgba(178,107,255,.2), rgba(125,66,255,.18));
  border:1px solid rgba(201,143,255,.2);
  color:var(--primary-3);
  font-weight:900;
  box-shadow:inset 0 0 20px rgba(178,107,255,.06);
}

.status-bar{
  margin-top:24px;
  display:grid;grid-template-columns:repeat(4,1fr);
  overflow:hidden;
  background:linear-gradient(180deg, rgba(26,15,43,.9), rgba(13,8,23,.85));
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:var(--shadow);
}
.status-bar > div{
  padding:22px 24px;
  border-right:1px solid rgba(201,143,255,.16);
  display:grid;gap:6px;
}
.status-bar > div:last-child{border-right:0}
.status-bar small{text-transform:uppercase;font-weight:800;color:#eadcff}
.status-bar strong,.status-bar a{
  color:var(--primary-3);
  font-size:1.35rem;
  font-weight:900;
  text-transform:uppercase;
}
.status-bar p{font-size:.92rem;line-height:1.4}

.page-hero.split,
.content-grid,
.rules-layout{
  display:grid;gap:24px;
}
.page-hero.split{grid-template-columns:1.2fr .8fr; align-items:stretch}
.content-grid{grid-template-columns:1fr 340px}
.rules-layout{grid-template-columns:280px 1fr}
.map-card h3,.side-panel h3,.sidebar-rules h3{margin-bottom:14px;text-transform:uppercase}

.mini-feature-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:24px;
}

.filter-panel{
  margin:24px 0;
  display:grid;grid-template-columns:1.4fr repeat(3,1fr) auto;
  gap:14px;align-items:end;
}
.filter-panel label{display:grid;gap:8px;font-size:.92rem;font-weight:700}
.filter-panel input,
.filter-panel select{
  min-height:52px;
  border-radius:14px;
  border:1px solid rgba(201,143,255,.18);
  background:rgba(255,255,255,.04);
  padding:0 16px;
  outline:none;
}
.search-box{position:relative}
.search-box .icon-badge{
  position:absolute; left:10px; bottom:5px;
}
.search-box input{padding-left:62px}

.section-title{
  display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;
}
.section-title h2{
  text-transform:uppercase;font-size:1.1rem;letter-spacing:.05em;
}
.section-title a{font-weight:800;color:var(--primary-3)}

.card-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:16px;
}
.card{
  padding:14px;border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
  transition:.25s ease;
}
.card:hover{transform:translateY(-4px);border-color:rgba(201,143,255,.32)}
.thumb{
  height:160px;border-radius:16px;position:relative;overflow:hidden;
  border:1px solid rgba(201,143,255,.18);
}
.thumb::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg, transparent, rgba(7,4,14,.58));
}
.thumb span,.badge,.offer-chip{
  position:absolute;left:12px;top:12px;
  background:linear-gradient(135deg, var(--primary), var(--primary-2));
  color:white;font-weight:900;text-transform:uppercase;
  font-size:.72rem;padding:7px 10px;border-radius:999px;
}
.thumb-violet-1{background:linear-gradient(135deg, #7044d9, #291245)}
.thumb-violet-2{background:linear-gradient(135deg, #aa6dff, #311452)}
.thumb-violet-3{background:linear-gradient(135deg, #5932d5, #160d29)}
.thumb-violet-4{background:linear-gradient(135deg, #8e44ff, #431b74)}
.property-card small{display:block;margin-top:14px;text-transform:uppercase;color:#e5d5f7;font-weight:700}
.property-card h3{margin:6px 0}
.property-card p{font-size:.96rem}
.property-card ul,.product-card ul{
  list-style:none;margin:14px 0 16px;display:flex;flex-wrap:wrap;gap:10px;font-size:.88rem;color:#eadcff;
}
.property-card strong,.product-card strong{
  color:var(--primary-3);font-size:1.25rem;font-weight:900;
}

.side-panel .stack-list{display:grid;gap:16px}
.side-panel .stack-list p{
  display:grid;grid-template-columns:42px 1fr;gap:0 12px;
}
.side-panel .stack-list b{color:white}
.side-panel .stack-list small{color:var(--muted)}

.fake-map{
  min-height:250px;border-radius:18px;position:relative;overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%, rgba(178,107,255,.22), transparent 26%),
    linear-gradient(135deg, rgba(29,15,49,.9), rgba(12,8,20,.94)),
    url("../assets/grid.svg") center/cover no-repeat;
  border:1px solid rgba(201,143,255,.16);
}
.fake-map span{
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  font-weight:900;text-align:center;text-transform:uppercase;
}
.fake-map small{display:block;font-weight:600;text-transform:none;color:var(--muted)}

.offer-card{display:grid;align-content:center;gap:14px}
.offer-card h3{font-size:2.2rem;text-transform:uppercase}
.offer-card strong{font-size:2rem;color:var(--primary-3)}
.offer-card del{color:var(--muted);font-size:1rem;margin-right:8px}

.tab-row{
  margin:24px 0;
  display:grid;grid-template-columns:repeat(6,1fr);gap:12px;
}
.tab{
  min-height:56px;border-radius:16px;border:1px solid rgba(201,143,255,.14);
  background:rgba(255,255,255,.04);color:white;font-weight:800;cursor:pointer;
}
.tab.active{background:rgba(178,107,255,.14);border-color:rgba(201,143,255,.32)}

.shop-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:16px;
}
.product-card{
  position:relative;text-align:center;
}
.product-card h3{margin:16px 0 10px;text-transform:uppercase}
.product-card.featured{border-color:rgba(201,143,255,.4);box-shadow:0 16px 40px rgba(125,66,255,.18)}
.crate{
  width:120px;height:84px;margin:6px auto 0;border-radius:16px;
  box-shadow:0 20px 40px rgba(0,0,0,.35), inset 0 0 20px rgba(255,255,255,.12);
}
.bronze{background:linear-gradient(135deg,#a46630,#4e2310)}
.silver{background:linear-gradient(135deg,#bec6d9,#4a4f6a)}
.gold{background:linear-gradient(135deg,#ffd86b,#7f4d00)}
.diamond{background:linear-gradient(135deg,#cef5ff,#4970a6)}
.legend{background:linear-gradient(135deg,#e789ff,#5920b0)}

.rules-hero{max-width:980px;margin:0 auto 24px;text-align:center}
.warning-box{
  margin-top:20px;
  padding:18px;border-radius:18px;
  border:1px solid rgba(201,143,255,.18);
  background:rgba(255,255,255,.04);
  display:grid;grid-template-columns:50px 1fr;gap:12px;align-items:start;text-align:left;
}
.sidebar-rules{
  display:grid;align-content:start;gap:10px;
}
.rule-link{
  min-height:54px;text-align:left;padding:0 16px;border-radius:14px;
  background:rgba(255,255,255,.04);border:1px solid rgba(201,143,255,.12);cursor:pointer;
  color:white;font-weight:800;
}
.rule-link.active{background:rgba(178,107,255,.14);border-color:rgba(201,143,255,.34)}
.discord-help{
  margin-top:10px;padding:18px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(201,143,255,.12)
}
.accordion{display:grid;gap:12px}
.rule-panel{
  border-radius:18px;border:1px solid rgba(201,143,255,.14);
  background:rgba(255,255,255,.03);overflow:hidden;
}
.rule-panel > button{
  width:100%;min-height:68px;background:transparent;border:0;color:white;
  display:flex;justify-content:space-between;align-items:center;padding:0 20px;font-weight:800;cursor:pointer;
}
.rule-panel ol{display:none;padding:0 26px 22px 42px;color:#eadcff;line-height:1.8}
.rule-panel.open ol{display:block}
.rule-panel em{font-style:normal;color:var(--primary-3);font-size:1.6rem}

.social-grid{
  display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:24px;
}
.social-card h3{margin:12px 0 8px;text-transform:uppercase}
.social-card strong{display:block;margin-top:4px;font-size:1.7rem;color:var(--primary-3)}
.social-card small{color:var(--muted)}
.social-card .btn{margin-top:12px;width:100%}

.cta-panel{
  margin-top:24px;display:flex;align-items:center;justify-content:space-between;gap:18px;
}
.cta-panel h2{text-transform:uppercase;font-size:2rem}
.cta-panel span{color:var(--primary-3)}

.reveal{
  opacity:0;
  transform:translateY(18px);
  transition:.6s ease;
}
.reveal.visible{
  opacity:1;
  transform:none;
}

@media (max-width: 1180px){
  .hero,.page-hero.split,.content-grid,.rules-layout{grid-template-columns:1fr}
  .card-grid{grid-template-columns:repeat(2,1fr)}
  .shop-grid,.social-grid{grid-template-columns:repeat(2,1fr)}
  .filter-panel{grid-template-columns:1fr 1fr}
  .tab-row{grid-template-columns:repeat(3,1fr)}
  .status-bar{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 780px){
  .site-header{height:auto;padding:16px 18px}
  .brand img{height:50px}
  .menu-toggle{display:block}
  .nav-links{
    display:none;position:absolute;top:calc(100% + 10px);left:0;right:0;
    flex-direction:column;align-items:stretch;gap:0;padding:14px;
    background:rgba(12,8,19,.96);border:1px solid var(--line);border-radius:20px;
  }
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 10px}
  .nav-links a.active::after{display:none}
  .header-cta{display:none}
  .hero,.feature-row,.mini-feature-grid,.stats-grid,.card-grid,.shop-grid,.social-grid,.filter-panel,.status-bar,.tab-row,.cta-panel{
    grid-template-columns:1fr;
  }
  .status-bar > div{border-right:0;border-bottom:1px solid rgba(201,143,255,.16)}
  .status-bar > div:last-child{border-bottom:0}
  .page{width:min(100% - 20px, 1360px)}
  .hero-copy,.hero-side,.padded{padding:20px}
  h1{font-size:3rem}
}


/* ==========================================================
   V2 · Barra vertical izquierda + integración FiveM/CP
   ========================================================== */

body{
  padding-left:300px;
}

.page{
  width:min(1320px, calc(100% - 42px));
  margin:28px auto 0;
}

.site-header{
  display:none !important;
}

.sidebar-nav{
  position:fixed;
  inset:18px auto 18px 18px;
  width:258px;
  z-index:80;
  display:flex;
  flex-direction:column;
  gap:18px;
  padding:18px;
  background:linear-gradient(180deg, rgba(21,12,36,.92), rgba(10,6,18,.88));
  border:1px solid rgba(201,143,255,.26);
  border-radius:26px;
  backdrop-filter:blur(22px);
  box-shadow:0 20px 60px rgba(67,25,122,.38), inset 0 0 40px rgba(178,107,255,.05);
}

.side-brand{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:112px;
  padding:8px;
  border-radius:22px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
}

.side-brand img{
  max-height:104px;
  width:auto;
  object-fit:contain;
  filter:drop-shadow(0 0 16px rgba(178,107,255,.25));
}

.sidebar-nav .nav-links{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:9px;
}

.sidebar-nav .nav-links a{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:58px;
  padding:8px 12px;
  border-radius:18px;
  color:rgba(255,255,255,.86);
  background:rgba(255,255,255,.025);
  border:1px solid transparent;
}

.sidebar-nav .nav-links a:hover,
.sidebar-nav .nav-links a.active{
  color:white;
  background:linear-gradient(135deg, rgba(178,107,255,.18), rgba(125,66,255,.12));
  border-color:rgba(201,143,255,.24);
  box-shadow:inset 0 0 26px rgba(178,107,255,.06);
}

.sidebar-nav .nav-links a.active::after{
  display:none;
}

.sidebar-nav .nav-links a.active .icon-badge{
  background:linear-gradient(135deg, var(--primary), var(--primary-2));
  color:white;
}

.side-server-card{
  margin-top:auto;
  padding:16px;
  border-radius:22px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(201,143,255,.16);
  display:grid;
  gap:7px;
}

.side-server-card small{
  color:#eadcff;
  text-transform:uppercase;
  font-weight:800;
  letter-spacing:.04em;
}

.side-server-card strong{
  color:var(--primary-3);
  font-size:1.18rem;
  text-transform:uppercase;
}

.side-server-card p{
  line-height:1.3;
  color:var(--muted);
}

.btn-small{
  min-height:44px;
  padding:0 16px;
  font-size:.78rem;
  margin-top:8px;
}

.status-bar [data-join-link],
[data-join-link]{
  cursor:pointer;
}

.status-bar strong[data-server-status]{
  font-size:1.1rem;
}

.cp-offer-card{
  position:relative;
  overflow:hidden;
}

.cp-coin-preview{
  position:absolute;
  right:-8px;
  top:-12px;
  width:155px;
  opacity:.85;
  filter:drop-shadow(0 0 22px rgba(255,176,36,.45));
  transform:rotate(6deg);
}

.product-coin{
  width:72px;
  height:72px;
  object-fit:cover;
  border-radius:18px;
  margin:0 auto 12px;
  box-shadow:0 0 26px rgba(255,196,44,.25);
}

.product-card strong,
.offer-card strong{
  color:#ffd66b;
  text-shadow:0 0 16px rgba(255,191,47,.28);
}

.status-bar > div:first-child strong{
  color:var(--primary-3);
}

@media (max-width: 980px){
  body{
    padding-left:0;
    padding-top:92px;
  }

  .sidebar-nav{
    inset:12px 12px auto 12px;
    width:auto;
    min-height:70px;
    flex-direction:row;
    align-items:center;
    padding:10px 12px;
    border-radius:22px;
  }

  .side-brand{
    min-height:54px;
    width:86px;
    padding:4px 8px;
    flex:0 0 auto;
  }

  .side-brand img{
    max-height:48px;
  }

  .sidebar-nav .menu-toggle{
    display:block;
    margin-left:auto;
  }

  .sidebar-nav .nav-links{
    display:none;
    position:absolute;
    left:0;
    right:0;
    top:calc(100% + 10px);
    padding:12px;
    border-radius:22px;
    background:rgba(12,8,19,.97);
    border:1px solid rgba(201,143,255,.24);
  }

  .sidebar-nav .nav-links.open{
    display:flex;
  }

  .side-server-card{
    display:none;
  }

  .page{
    width:min(100% - 22px, 1320px);
    margin-top:16px;
  }
}

@media (max-width: 560px){
  .sidebar-nav{
    gap:10px;
  }

  .side-brand{
    width:72px;
  }

  .btn{
    width:100%;
  }

  .cp-coin-preview{
    width:110px;
    opacity:.45;
  }
}


/* V4 · SVG icon images */
.icon-badge img{
  width:26px;
  height:26px;
  object-fit:contain;
  display:block;
  filter:drop-shadow(0 0 8px rgba(226,184,255,.22));
}

.sidebar-nav .nav-links a.active .icon-badge img{
  filter:drop-shadow(0 0 10px rgba(255,255,255,.45));
}

.product-card .pack-svg{
  width:70px;
  height:70px;
  object-fit:contain;
  margin:0 auto 8px;
}


/* V6 · Tienda CP real */
.page-shop .shop-section{
  margin-top:24px;
}

.page-shop .shop-grid{
  align-items:stretch;
}

.compact-product{
  display:grid;
  align-content:start;
  gap:8px;
}

.compact-product h3{
  font-size:1.35rem;
}

.cp-grid{
  grid-template-columns:repeat(5,1fr);
}

.extra-grid{
  grid-template-columns:repeat(3,1fr);
}

.peds-grid{
  grid-template-columns:repeat(5,1fr);
}

.product-card p{
  min-height:48px;
  color:var(--muted);
  font-size:.94rem;
}

.product-card .btn{
  margin-top:auto;
  width:100%;
}

.large-icon{
  width:76px;
  height:76px;
  margin:4px auto 10px;
  border-radius:24px;
}

.large-icon img{
  width:42px;
  height:42px;
}

.product-card strong small{
  color:var(--muted);
  font-size:.8rem;
}

@media (max-width: 1180px){
  .cp-grid,
  .peds-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .extra-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 780px){
  .cp-grid,
  .peds-grid{
    grid-template-columns:1fr;
  }
}


/* V7 · Redes, Discord y Twitch */
.social-status-card{
  display:grid;
  gap:14px;
  align-content:center;
}

.side-logo{
  max-width:230px;
  margin:0 auto;
  filter:drop-shadow(0 0 20px rgba(178,107,255,.24));
}

.twitch-live-panel{
  margin-top:24px;
}

.twitch-live-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:16px;
}

.stream-card{
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
  display:grid;
  gap:12px;
}

.stream-card img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  border-radius:16px;
  border:1px solid rgba(201,143,255,.16);
}

.stream-card h3{
  text-transform:uppercase;
  color:var(--primary-3);
}

.empty-stream{
  grid-column:1/-1;
  text-align:center;
  justify-items:center;
}

@media (max-width:1180px){
  .twitch-live-grid{
    grid-template-columns:repeat(2,1fr);
  }
}

@media (max-width:780px){
  .twitch-live-grid{
    grid-template-columns:1fr;
  }
}


/* V8 · Panel lateral fijo Servidor FiveM ONLINE */
.static-server-card{
  display:grid !important;
  gap:10px;
  padding:18px;
  border-radius:22px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(201,143,255,.18);
  margin-top:auto;
}

.static-server-card .purple-dot{
  width:10px;
  height:10px;
  background:var(--primary);
  box-shadow:0 0 16px rgba(178,107,255,.7);
}

.static-server-card small{
  color:#eadcff;
  text-transform:uppercase;
  font-weight:900;
  letter-spacing:.04em;
}

.static-server-card strong{
  color:#7dff9c !important;
  font-size:1.28rem;
  font-weight:950;
  text-transform:uppercase;
  text-shadow:0 0 14px rgba(125,255,156,.32);
}

.static-server-card p{
  color:#f7f2ff;
  font-weight:900;
  text-transform:uppercase;
  line-height:1.25;
}

.twitch-live-panel{
  display:none !important;
}

@media (max-width:980px){
  .static-server-card{
    display:none !important;
  }
}


/* V9 · Home cards actualizadas + panel Discord ancho */
.hero-copy .home-cards-grid,
.hero-copy .feature-row.home-cards-grid{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  margin-top:32px !important;
  margin-bottom:0 !important;
}

.hero-copy .home-cards-grid .home-info-card{
  display:grid !important;
  grid-template-rows:46px 42px 1fr !important;
  gap:10px !important;
  min-height:154px !important;
  height:154px !important;
  padding:18px !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  color:inherit !important;
  text-decoration:none !important;
  transition:.25s ease !important;
}

.hero-copy .home-cards-grid .home-info-card:hover{
  transform:translateY(-3px);
  border-color:rgba(201,143,255,.45) !important;
  background:rgba(178,107,255,.11) !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge{
  width:42px !important;
  height:42px !important;
}

.hero-copy .home-cards-grid .home-info-card strong{
  font-size:.92rem !important;
  line-height:1.15 !important;
  font-weight:950 !important;
  text-transform:uppercase !important;
  color:#fff !important;
  align-self:end !important;
}

.hero-copy .home-cards-grid .home-info-card small{
  color:var(--muted) !important;
  font-size:.86rem !important;
  line-height:1.35 !important;
  overflow-wrap:anywhere !important;
}

.discord-wide-panel{
  display:grid !important;
  grid-template-columns:1fr !important;
  margin-top:28px !important;
  overflow:visible !important;
}

.discord-wide-card{
  grid-column:1/-1;
  min-height:132px;
  padding:28px 32px;
  display:grid;
  grid-template-columns:58px 1fr auto;
  align-items:center;
  gap:22px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(178,107,255,.18), rgba(125,66,255,.12));
  border:1px solid rgba(201,143,255,.28);
  color:inherit;
  text-decoration:none;
  box-shadow:var(--shadow);
  transition:.25s ease;
}

.discord-wide-card:hover{
  transform:translateY(-3px);
  border-color:rgba(201,143,255,.48);
  background:linear-gradient(135deg, rgba(178,107,255,.25), rgba(125,66,255,.18));
}

.discord-wide-card .icon-badge{
  width:58px;
  height:58px;
  border-radius:18px;
}

.discord-wide-card small{
  display:block;
  color:var(--primary-3);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:5px;
}

.discord-wide-card strong{
  display:block;
  color:#fff;
  font-size:1.7rem;
  font-weight:950;
  text-transform:uppercase;
  line-height:1.05;
}

.discord-wide-card p{
  margin-top:6px;
  color:var(--muted);
}

.discord-wide-card em{
  min-height:48px;
  padding:0 22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  font-style:normal;
  font-weight:950;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 12px 28px rgba(125,66,255,.34);
}

@media (max-width:1180px){
  .hero-copy .home-cards-grid,
  .hero-copy .feature-row.home-cards-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:780px){
  .hero-copy .home-cards-grid,
  .hero-copy .feature-row.home-cards-grid{
    grid-template-columns:1fr !important;
  }

  .discord-wide-card{
    grid-template-columns:1fr;
    text-align:left;
  }

  .discord-wide-card em{
    width:100%;
  }
}


/* V10 · Ajuste boxes home + background.webp */
body{
  background:
    linear-gradient(90deg, rgba(9,6,15,.72), rgba(9,6,15,.40) 45%, rgba(9,6,15,.76)),
    linear-gradient(180deg, rgba(9,6,15,.18), rgba(9,6,15,.86)),
    url("../assets/background.webp?v=127") center/cover fixed no-repeat,
    #09060f !important;
}

.site-bg{
  background:
    linear-gradient(90deg, rgba(9,6,15,.68), rgba(9,6,15,.35) 45%, rgba(9,6,15,.72)),
    linear-gradient(180deg, rgba(9,6,15,.16), rgba(9,6,15,.82)),
    url("../assets/background.webp?v=127") center/cover no-repeat !important;
  opacity:1 !important;
}

/* Cajas del hero: todo dentro, mismo alto, sin sobresalir */
.hero-copy .home-cards-grid,
.hero-copy .feature-row.home-cards-grid{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:12px !important;
  align-items:stretch !important;
  margin-top:30px !important;
}

.hero-copy .home-cards-grid .home-info-card,
.hero-copy .feature-row.home-cards-grid .home-info-card{
  box-sizing:border-box !important;
  display:grid !important;
  grid-template-rows:40px 34px 1fr !important;
  gap:7px !important;
  width:100% !important;
  height:146px !important;
  min-height:146px !important;
  max-height:146px !important;
  padding:15px !important;
  overflow:hidden !important;
  border-radius:16px !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge{
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
  min-height:36px !important;
  border-radius:12px !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge img{
  width:22px !important;
  height:22px !important;
}

.hero-copy .home-cards-grid .home-info-card strong{
  display:block !important;
  align-self:end !important;
  font-size:.78rem !important;
  line-height:1.05 !important;
  max-height:34px !important;
  overflow:hidden !important;
  text-transform:uppercase !important;
  letter-spacing:.01em !important;
}

.hero-copy .home-cards-grid .home-info-card small{
  display:block !important;
  font-size:.72rem !important;
  line-height:1.18 !important;
  max-height:42px !important;
  overflow:hidden !important;
  overflow-wrap:anywhere !important;
  color:var(--muted) !important;
}

/* Panel derecho limpio, sin boxes inferiores */
.hero-side .stats-grid{
  display:none !important;
}

.hero-side{
  justify-content:center !important;
  gap:22px !important;
}

.hero-side-logo{
  max-width:280px !important;
  margin-bottom:0 !important;
}

.hero-side .mini-panel{
  margin-top:0 !important;
}

/* Discord panel inferior más compacto */
.discord-wide-card{
  min-height:112px !important;
  padding:22px 28px !important;
}

.discord-wide-card strong{
  font-size:1.45rem !important;
}

@media (max-width:1180px){
  .hero-copy .home-cards-grid,
  .hero-copy .feature-row.home-cards-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

@media (max-width:780px){
  .hero-copy .home-cards-grid,
  .hero-copy .feature-row.home-cards-grid{
    grid-template-columns:1fr !important;
  }

  .hero-copy .home-cards-grid .home-info-card,
  .hero-copy .feature-row.home-cards-grid .home-info-card{
    height:auto !important;
    min-height:132px !important;
    max-height:none !important;
  }
}


/* V11 · Panel derecho limpio y SVGs más pequeños en cajas centrales */
.hero-side .stats-grid,
.hero-side .stats-grid *,
.hero-side > span,
.hero-side > small{
  display:none !important;
}

.hero-side{
  justify-content:center !important;
  align-content:center !important;
}

.hero-side .mini-panel + *:not(.static-server-card){
  display:none !important;
}

/* SVG/icons del panel central más pequeños para que quepa el texto */
.hero-copy .home-cards-grid .home-info-card{
  grid-template-rows:32px 32px 1fr !important;
  height:140px !important;
  min-height:140px !important;
  max-height:140px !important;
  padding:14px !important;
  gap:6px !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge,
.hero-copy .feature-row.home-cards-grid .home-info-card .icon-badge{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  border-radius:10px !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge img,
.hero-copy .feature-row.home-cards-grid .home-info-card .icon-badge img{
  width:17px !important;
  height:17px !important;
}

.hero-copy .home-cards-grid .home-info-card strong{
  font-size:.74rem !important;
  line-height:1.05 !important;
  max-height:32px !important;
}

.hero-copy .home-cards-grid .home-info-card small{
  font-size:.68rem !important;
  line-height:1.14 !important;
  max-height:50px !important;
}

/* Reduce el logo del panel derecho para equilibrar el espacio */
.hero-side-logo{
  max-width:240px !important;
}


/* V11.1 · Fondo sin blur */
.site-bg{
  filter:none !important;
  transform:none !important;
  backdrop-filter:none !important;
}

body::before,
.site-overlay{
  backdrop-filter:none !important;
  filter:none !important;
}

/* Menos oscurecimiento para que el background se vea más nítido */
body{
  background:
    linear-gradient(90deg, rgba(9,6,15,.56), rgba(9,6,15,.24) 45%, rgba(9,6,15,.60)),
    linear-gradient(180deg, rgba(9,6,15,.10), rgba(9,6,15,.70)),
    url("../assets/background.webp?v=127") center/cover fixed no-repeat,
    #09060f !important;
}

.site-bg{
  background:
    linear-gradient(90deg, rgba(9,6,15,.50), rgba(9,6,15,.20) 45%, rgba(9,6,15,.56)),
    linear-gradient(180deg, rgba(9,6,15,.08), rgba(9,6,15,.66)),
    url("../assets/background.webp?v=127") center/cover no-repeat !important;
}


/* V12 · Fix definitivo: texto dentro de las cajas del home */
.hero-copy .home-cards-grid,
.hero-copy .feature-row.home-cards-grid{
  align-items:stretch !important;
}

.hero-copy .home-cards-grid .home-info-card,
.hero-copy .feature-row.home-cards-grid .home-info-card{
  height:168px !important;
  min-height:168px !important;
  max-height:168px !important;
  padding:14px 16px !important;
  grid-template-rows:34px 30px minmax(34px, 1fr) !important;
  gap:8px !important;
  overflow:hidden !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge,
.hero-copy .feature-row.home-cards-grid .home-info-card .icon-badge{
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
}

.hero-copy .home-cards-grid .home-info-card .icon-badge img,
.hero-copy .feature-row.home-cards-grid .home-info-card .icon-badge img{
  width:17px !important;
  height:17px !important;
}

.hero-copy .home-cards-grid .home-info-card strong,
.hero-copy .feature-row.home-cards-grid .home-info-card strong{
  display:block !important;
  align-self:end !important;
  height:auto !important;
  min-height:0 !important;
  max-height:30px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:.76rem !important;
  line-height:1.05 !important;
  overflow:hidden !important;
}

.hero-copy .home-cards-grid .home-info-card small,
.hero-copy .feature-row.home-cards-grid .home-info-card small{
  display:block !important;
  align-self:start !important;
  height:auto !important;
  min-height:0 !important;
  max-height:54px !important;
  margin:0 !important;
  padding:0 !important;
  font-size:.66rem !important;
  line-height:1.18 !important;
  overflow:hidden !important;
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

/* Evita que cualquier borde/outline parezca atravesar el texto */
.hero-copy .home-cards-grid .home-info-card{
  position:relative !important;
}

.hero-copy .home-cards-grid .home-info-card::after{
  content:"" !important;
  position:absolute !important;
  inset:0 !important;
  border-radius:inherit !important;
  pointer-events:none !important;
  border:1px solid rgba(201,143,255,.18) !important;
}

.hero-copy .home-cards-grid .home-info-card{
  border-color:transparent !important;
}

@media (max-width:780px){
  .hero-copy .home-cards-grid .home-info-card,
  .hero-copy .feature-row.home-cards-grid .home-info-card{
    height:auto !important;
    min-height:142px !important;
    max-height:none !important;
  }
}


/* V13 · Discord panel en todas las páginas */
.discord-wide-panel{
  display:grid !important;
  grid-template-columns:1fr !important;
  margin-top:28px !important;
  margin-bottom:26px !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.discord-wide-card{
  grid-column:1/-1;
  min-height:112px;
  padding:22px 28px;
  display:grid;
  grid-template-columns:58px 1fr auto;
  align-items:center;
  gap:22px;
  border-radius:22px;
  background:linear-gradient(135deg, rgba(178,107,255,.18), rgba(125,66,255,.12));
  border:1px solid rgba(201,143,255,.28);
  color:inherit;
  text-decoration:none;
  box-shadow:var(--shadow);
  transition:.25s ease;
}

.discord-wide-card:hover{
  transform:translateY(-3px);
  border-color:rgba(201,143,255,.48);
  background:linear-gradient(135deg, rgba(178,107,255,.25), rgba(125,66,255,.18));
}

.discord-wide-card .icon-badge{
  width:58px;
  height:58px;
  border-radius:18px;
}

.discord-wide-card small{
  display:block;
  color:var(--primary-3);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  margin-bottom:5px;
}

.discord-wide-card strong{
  display:block;
  color:#fff;
  font-size:1.45rem;
  font-weight:950;
  text-transform:uppercase;
  line-height:1.05;
}

.discord-wide-card p{
  margin-top:6px;
  color:var(--muted);
}

.discord-wide-card em{
  min-height:48px;
  padding:0 22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:linear-gradient(135deg,var(--primary),var(--primary-2));
  color:#fff;
  font-style:normal;
  font-weight:950;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 12px 28px rgba(125,66,255,.34);
}

@media (max-width:780px){
  .discord-wide-card{
    grid-template-columns:1fr;
    text-align:left;
  }

  .discord-wide-card em{
    width:100%;
  }
}


/* V14 · Inmobiliaria con mapa interactivo */
.page-realestate .realestate-hero{
  align-items:stretch;
}

.zone-summary-card{
  display:grid;
  align-content:center;
  gap:14px;
}

.zone-summary-card h3{
  color:var(--primary-3);
  text-transform:uppercase;
  font-size:1.7rem;
}

.zone-summary-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.zone-summary-tags span{
  padding:8px 10px;
  border-radius:999px;
  background:rgba(178,107,255,.12);
  border:1px solid rgba(201,143,255,.2);
  color:#eadcff;
  font-size:.78rem;
  font-weight:800;
  text-transform:uppercase;
}

.realestate-filter-panel{
  grid-template-columns:1.5fr 330px !important;
  align-items:end;
  margin:24px 0 !important;
}

.custom-select-wrap{
  position:relative;
}

.custom-select-wrap::after{
  content:"⌄";
  position:absolute;
  right:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--primary-3);
  pointer-events:none;
  font-weight:900;
}

.custom-select{
  width:100%;
  min-height:52px;
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
  border-radius:14px;
  border:1px solid rgba(201,143,255,.24);
  background:#170d29;
  color:#f7f2ff;
  padding:0 44px 0 16px;
  outline:none;
  font-weight:800;
}

.custom-select option{
  background:#170d29;
  color:#f7f2ff;
}

.realestate-layout{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 340px;
  gap:24px;
}

.map-shell{
  overflow:hidden;
}

.interactive-map{
  position:relative;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(201,143,255,.2);
  background:rgba(255,255,255,.035);
}

.interactive-map img{
  width:100%;
  display:block;
  filter:saturate(1.04) contrast(1.02);
}

.zone-hotspot{
  position:absolute;
  left:var(--x);
  top:var(--y);
  transform:translate(-50%, -50%);
  min-height:34px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.44);
  border-radius:999px;
  color:#fff;
  font-size:.68rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.02em;
  cursor:pointer;
  backdrop-filter:blur(8px);
  box-shadow:0 8px 24px rgba(0,0,0,.25);
  transition:.2s ease;
}

.zone-hotspot:hover,
.zone-hotspot.active{
  transform:translate(-50%, -50%) scale(1.06);
  border-color:#fff;
  box-shadow:0 0 0 3px rgba(255,255,255,.18), 0 12px 30px rgba(0,0,0,.36);
}

.zone-purple{background:rgba(176,54,240,.72)}
.zone-red{background:rgba(255,55,55,.74)}
.zone-orange{background:rgba(255,130,28,.76)}
.zone-green{background:rgba(21,205,72,.72)}
.zone-cyan{background:rgba(0,205,205,.72)}
.zone-lime{background:rgba(200,230,40,.78);color:#1a1028}
.zone-blue{background:rgba(45,65,255,.72)}
.zone-sky{background:rgba(35,180,255,.72)}
.zone-yellow{background:rgba(245,220,30,.78);color:#1a1028}
.zone-gray{background:rgba(130,130,140,.78)}

.zones-sidebar{
  align-self:start;
}

.zones-sidebar h3{
  text-transform:uppercase;
  margin-bottom:14px;
}

.zones-list{
  display:grid;
  gap:10px;
  max-height:720px;
  overflow:auto;
  padding-right:4px;
}

.zones-list button{
  display:grid;
  grid-template-columns:18px 1fr;
  gap:2px 10px;
  text-align:left;
  min-height:62px;
  padding:11px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
  color:#fff;
  cursor:pointer;
  transition:.2s ease;
}

.zones-list button:hover,
.zones-list button.active{
  background:rgba(178,107,255,.13);
  border-color:rgba(201,143,255,.34);
}

.zones-list button b{
  font-size:.9rem;
  text-transform:uppercase;
}

.zones-list button small{
  grid-column:2;
  color:var(--muted);
  font-size:.78rem;
}

.legend-color{
  width:14px;
  height:14px;
  border-radius:4px;
  display:inline-block;
  margin-top:3px;
  box-shadow:0 0 14px rgba(255,255,255,.13);
}

.legend-color.purple{background:#b036f0}
.legend-color.red{background:#ff3636}
.legend-color.orange{background:#ff8a1f}
.legend-color.green{background:#20d353}
.legend-color.cyan{background:#20d6d6}
.legend-color.lime{background:#d7eb32}
.legend-color.blue{background:#3148ff}
.legend-color.sky{background:#29bfff}
.legend-color.yellow{background:#f4dc25}
.legend-color.gray{background:#8d8d95}
.legend-color.brown{background:#b68438}

.zone-details-section{
  margin-top:24px;
}

.zone-card-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.zone-card{
  padding:18px;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
  display:grid;
  gap:10px;
  transition:.2s ease;
}

.zone-card.active{
  background:rgba(178,107,255,.13);
  border-color:rgba(201,143,255,.38);
  box-shadow:0 12px 28px rgba(125,66,255,.18);
}

.zone-card h3{
  text-transform:uppercase;
  color:#fff;
}

.zone-card p{
  font-size:.92rem;
}

.zone-card ul{
  list-style:none;
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.zone-card li{
  padding:7px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(201,143,255,.12);
  color:#eadcff;
  font-size:.74rem;
  font-weight:800;
}

@media (max-width:1180px){
  .realestate-layout{
    grid-template-columns:1fr;
  }

  .zone-card-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .realestate-filter-panel{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:780px){
  .zone-card-grid{
    grid-template-columns:1fr;
  }

  .zone-hotspot{
    font-size:.55rem;
    min-height:28px;
    padding:0 8px;
  }
}


/* V15 · Nombres reales de zonas inmobiliarias */
.zone-redorange{background:rgba(255,82,35,.76)}
.zone-southblue{background:rgba(75,70,235,.74)}
.zone-centerorange{background:rgba(209,139,45,.78)}
.zone-yellowgreen{background:rgba(185,220,45,.78);color:#1a1028}
.zone-maroon{background:rgba(150,22,34,.78)}
.zone-portyellow{background:rgba(246,222,40,.78);color:#1a1028}

.legend-color.redorange{background:#ff5223}
.legend-color.southblue{background:#4b46eb}
.legend-color.centerorange{background:#d18b2d}
.legend-color.yellowgreen{background:#b9dc2d}
.legend-color.maroon{background:#961622}
.legend-color.portyellow{background:#f6de28}


/* V16 · Inmobiliaria: hero ancho + mapa con zoom/pan */
.page-realestate .realestate-hero{
  display:block !important;
}

.page-realestate .realestate-hero > .glass.padded{
  width:100%;
  min-height:auto !important;
  padding-top:34px !important;
  padding-bottom:28px !important;
}

.page-realestate .realestate-hero h1{
  max-width:980px;
}

.page-realestate .realestate-hero p{
  max-width:980px;
}

.zone-summary-card{
  display:none !important;
}

.zone-inline-summary{
  margin-top:22px;
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
  display:grid;
  gap:10px;
  max-width:980px;
}

.zone-inline-summary h3{
  color:var(--primary-3);
  text-transform:uppercase;
  font-size:1.25rem;
}

.zone-inline-summary p{
  margin:0;
  max-width:none !important;
}

.realestate-layout{
  grid-template-columns:minmax(0, 1fr) 300px !important;
  gap:18px !important;
  align-items:start;
}

.map-shell{
  max-height:none;
}

.map-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:14px;
  padding:12px;
  border-radius:16px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
}

.map-toolbar button{
  min-width:42px;
  min-height:38px;
  border:1px solid rgba(201,143,255,.22);
  border-radius:12px;
  background:rgba(178,107,255,.14);
  color:#fff;
  font-weight:950;
  cursor:pointer;
  transition:.2s ease;
}

.map-toolbar button:hover{
  background:rgba(178,107,255,.26);
  border-color:rgba(201,143,255,.42);
}

.map-toolbar input[type="range"]{
  width:180px;
  accent-color:#a855f7;
}

.map-toolbar span{
  color:var(--muted);
  font-size:.82rem;
  font-weight:700;
}

.interactive-map{
  height:560px !important;
  cursor:grab;
  user-select:none;
}

.interactive-map.is-dragging{
  cursor:grabbing;
}

.map-pan{
  position:absolute;
  inset:0;
  transform-origin:0 0;
  will-change:transform;
}

.map-pan img{
  width:100%;
  height:auto;
  display:block;
}

.map-pan .zone-hotspot{
  will-change:transform;
}

.zones-sidebar{
  max-height:680px;
  overflow:hidden;
}

.zones-list{
  max-height:610px !important;
}

.zone-hotspot{
  font-size:.6rem !important;
  min-height:29px !important;
  padding:0 9px !important;
}

@media (max-width:1180px){
  .realestate-layout{
    grid-template-columns:1fr !important;
  }

  .interactive-map{
    height:500px !important;
  }
}

@media (max-width:780px){
  .interactive-map{
    height:390px !important;
  }

  .map-toolbar input[type="range"]{
    width:130px;
  }
}


/* V17 · Fix mapa inmobiliaria: pan real + puntos mejor colocados */
.map-shell{
  max-width:100%;
}

.map-toolbar{
  position:relative;
  z-index:5;
}

.interactive-map{
  position:relative !important;
  height:520px !important;
  overflow:hidden !important;
  cursor:grab !important;
  touch-action:none !important;
  background:rgba(10,6,18,.62) !important;
}

.interactive-map.is-dragging{
  cursor:grabbing !important;
}

.map-pan{
  position:absolute !important;
  left:0 !important;
  top:0 !important;
  width:100% !important;
  height:100% !important;
  transform-origin:0 0 !important;
  will-change:transform !important;
}

.map-pan img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  display:block !important;
  pointer-events:none !important;
  user-select:none !important;
}

.map-pan .zone-hotspot{
  pointer-events:auto !important;
  z-index:4 !important;
}

/* Los puntos ya no bloquean el arrastre salvo cuando se hace click sobre el botón */
.zone-hotspot{
  font-size:.58rem !important;
  min-height:26px !important;
  padding:0 8px !important;
  white-space:nowrap !important;
}

.zones-sidebar{
  max-height:650px !important;
}

.zones-list{
  max-height:580px !important;
}

@media (max-width:1180px){
  .interactive-map{
    height:500px !important;
  }
}

@media (max-width:780px){
  .interactive-map{
    height:390px !important;
  }
}


/* V18 · Labels del mapa más pequeños y mapa correctamente encajado */
.interactive-map{
  height:500px !important;
  background:rgba(8,5,14,.82) !important;
}

/* El mapa ocupa más ancho útil dentro del panel para que los puntos no parezcan fuera */
.map-pan img{
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
}

/* Popups/labels mucho más pequeños */
.zone-hotspot{
  min-height:20px !important;
  height:20px !important;
  padding:0 6px !important;
  border-radius:7px !important;
  font-size:.48rem !important;
  line-height:20px !important;
  letter-spacing:0 !important;
  max-width:68px !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  box-shadow:0 4px 14px rgba(0,0,0,.25) !important;
  border:1px solid rgba(255,255,255,.38) !important;
}

/* Al hacer hover sí se pueden leer un poco mejor */
.zone-hotspot:hover,
.zone-hotspot.active{
  max-width:120px !important;
  z-index:8 !important;
}

/* Barra de herramientas algo más compacta */
.map-toolbar{
  gap:8px !important;
  padding:9px 10px !important;
}

.map-toolbar button{
  min-width:36px !important;
  min-height:32px !important;
  border-radius:10px !important;
}

.map-toolbar input[type="range"]{
  width:150px !important;
}

.map-toolbar span{
  font-size:.75rem !important;
}

/* Leyenda un poco más limpia */
.zones-list button{
  min-height:54px !important;
  padding:9px 11px !important;
}

.zones-list button b{
  font-size:.8rem !important;
}

.zones-list button small{
  font-size:.68rem !important;
}

/* En pantallas pequeñas, todavía más compacto */
@media (max-width:780px){
  .interactive-map{
    height:360px !important;
  }

  .zone-hotspot{
    font-size:.42rem !important;
    min-height:18px !important;
    height:18px !important;
    line-height:18px !important;
    padding:0 5px !important;
    max-width:54px !important;
  }
}


/* V19 · Mapa inmobiliario estático a tamaño completo */
.map-toolbar{
  display:none !important;
}

.interactive-map,
.interactive-map.static-full-map{
  position:relative !important;
  height:auto !important;
  min-height:0 !important;
  overflow:visible !important;
  cursor:default !important;
  user-select:auto !important;
  touch-action:auto !important;
  background:rgba(8,5,14,.42) !important;
}

.interactive-map img,
.interactive-map.static-full-map img{
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  display:block !important;
  pointer-events:auto !important;
  user-select:auto !important;
}

.map-pan{
  position:static !important;
  width:auto !important;
  height:auto !important;
  transform:none !important;
}

/* Labels estáticos sobre el mapa completo */
.interactive-map .zone-hotspot,
.static-full-map .zone-hotspot{
  position:absolute !important;
  transform:translate(-50%, -50%) !important;
  z-index:4 !important;
  pointer-events:auto !important;
  min-height:20px !important;
  height:20px !important;
  line-height:20px !important;
  padding:0 6px !important;
  border-radius:7px !important;
  font-size:.48rem !important;
  max-width:78px !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.interactive-map .zone-hotspot:hover,
.static-full-map .zone-hotspot:hover,
.interactive-map .zone-hotspot.active,
.static-full-map .zone-hotspot.active{
  transform:translate(-50%, -50%) scale(1.06) !important;
  max-width:130px !important;
}

/* El panel del mapa usa más ancho y no recorta nada */
.map-shell{
  overflow:visible !important;
}

.realestate-layout{
  grid-template-columns:minmax(0, 1fr) 300px !important;
}

@media (max-width:1180px){
  .realestate-layout{
    grid-template-columns:1fr !important;
  }
}


/* V20 · Mapa estático bien delimitado y labels completos */
.map-toolbar,
.map-pan{
  display:none !important;
}

.map-shell{
  overflow:visible !important;
}

.interactive-map,
.interactive-map.static-full-map{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  background:transparent !important;
  border-radius:20px !important;
  border:1px solid rgba(201,143,255,.20) !important;
  cursor:default !important;
}

.interactive-map img,
.static-full-map img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  object-fit:contain !important;
  pointer-events:auto !important;
  user-select:none !important;
}

/* Popups/labels: nombres completos, pequeños y dentro de la imagen */
.static-full-map .zone-hotspot,
.interactive-map .zone-hotspot{
  position:absolute !important;
  left:var(--x) !important;
  top:var(--y) !important;
  transform:translate(-50%, -50%) !important;
  z-index:6 !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:18px !important;
  height:auto !important;
  max-width:92px !important;
  padding:3px 7px !important;
  border-radius:8px !important;
  border:1px solid rgba(255,255,255,.42) !important;
  color:#fff !important;
  font-size:.47rem !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  text-align:center !important;
  white-space:normal !important;
  text-transform:uppercase !important;
  letter-spacing:.01em !important;
  overflow:visible !important;
  text-overflow:clip !important;
  backdrop-filter:none !important;
  box-shadow:0 5px 14px rgba(0,0,0,.28) !important;
  cursor:pointer !important;
}

.static-full-map .zone-hotspot:hover,
.static-full-map .zone-hotspot.active,
.interactive-map .zone-hotspot:hover,
.interactive-map .zone-hotspot.active{
  transform:translate(-50%, -50%) scale(1.08) !important;
  z-index:20 !important;
  border-color:#fff !important;
  box-shadow:0 0 0 3px rgba(255,255,255,.14), 0 8px 22px rgba(0,0,0,.35) !important;
}

/* Ajustes por etiqueta larga */
.zone-hotspot[data-zone="vespucci-beach"],
.zone-hotspot[data-zone="rockford-hills"],
.zone-hotspot[data-zone="barrios-bajos"],
.zone-hotspot[data-zone="sandy-shores"]{
  max-width:105px !important;
}

.zone-hotspot[data-zone="great-ocean"]{
  max-width:94px !important;
}

/* Colores legibles sobre mapa */
.zone-blue{background:rgba(45,65,255,.78) !important}
.zone-sky{background:rgba(35,180,255,.80) !important}
.zone-yellow{background:rgba(245,220,30,.86) !important;color:#1a1028 !important}
.zone-purple{background:rgba(176,54,240,.80) !important}
.zone-orange{background:rgba(255,138,31,.82) !important}
.zone-redorange{background:rgba(255,82,35,.82) !important}
.zone-southblue{background:rgba(75,70,235,.82) !important}
.zone-cyan{background:rgba(32,214,214,.82) !important}
.zone-green{background:rgba(32,211,83,.82) !important}
.zone-lime{background:rgba(215,235,50,.86) !important;color:#1a1028 !important}
.zone-centerorange{background:rgba(209,139,45,.84) !important}
.zone-yellowgreen{background:rgba(185,220,45,.86) !important;color:#1a1028 !important}
.zone-maroon{background:rgba(150,22,34,.84) !important}
.zone-portyellow{background:rgba(246,222,40,.86) !important;color:#1a1028 !important}

@media (max-width:1180px){
  .static-full-map .zone-hotspot,
  .interactive-map .zone-hotspot{
    font-size:.42rem !important;
    max-width:78px !important;
    padding:2px 5px !important;
  }
}

@media (max-width:780px){
  .static-full-map .zone-hotspot,
  .interactive-map .zone-hotspot{
    font-size:.36rem !important;
    max-width:64px !important;
    padding:2px 4px !important;
    border-radius:6px !important;
  }
}


/* V21 · Inmobiliaria: mapa pequeño en panel derecho */
.small-map-layout{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) 390px !important;
  gap:22px !important;
  align-items:start !important;
}

.zone-details-main{
  margin-top:0 !important;
}

.realestate-right-column{
  display:grid;
  gap:18px;
  position:sticky;
  top:28px;
  align-self:start;
}

.map-shell-small{
  padding:18px !important;
}

.map-shell-small .section-title{
  margin-bottom:12px;
}

.map-shell-small .section-title h2{
  font-size:1rem;
}

.map-shell-small .interactive-map{
  border-radius:16px !important;
}

.map-shell-small .zone-hotspot{
  font-size:.34rem !important;
  line-height:1 !important;
  min-height:14px !important;
  padding:2px 4px !important;
  border-radius:5px !important;
  max-width:58px !important;
  border-width:1px !important;
}

.map-shell-small .zone-hotspot[data-zone="vespucci-beach"],
.map-shell-small .zone-hotspot[data-zone="rockford-hills"],
.map-shell-small .zone-hotspot[data-zone="barrios-bajos"],
.map-shell-small .zone-hotspot[data-zone="sandy-shores"]{
  max-width:64px !important;
}

.zones-sidebar-small{
  max-height:520px !important;
  overflow:hidden !important;
}

.zones-sidebar-small .zones-list{
  max-height:430px !important;
}

.zones-sidebar-small h3{
  font-size:1rem !important;
}

.zones-sidebar-small .zones-list button{
  min-height:48px !important;
  padding:8px 10px !important;
  border-radius:14px !important;
}

.zones-sidebar-small .zones-list button b{
  font-size:.74rem !important;
}

.zones-sidebar-small .zones-list button small{
  font-size:.64rem !important;
}

/* Como ahora las tarjetas son el contenido principal, se ven más cómodas */
.small-map-layout .zone-card-grid{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width:1180px){
  .small-map-layout{
    grid-template-columns:1fr !important;
  }

  .realestate-right-column{
    position:static;
    order:-1;
  }

  .small-map-layout .zone-card-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:780px){
  .small-map-layout .zone-card-grid{
    grid-template-columns:1fr !important;
  }
}


/* V22 · Mapa derecho del mismo nivel/tamaño que el panel principal */
.small-map-layout{
  grid-template-columns:minmax(0, 1fr) minmax(470px, 520px) !important;
  gap:24px !important;
  align-items:start !important;
}

.realestate-right-column{
  position:sticky;
  top:24px;
  align-self:start;
}

.map-shell-small{
  padding:24px !important;
  min-height:auto !important;
}

.map-shell-small .section-title{
  margin-bottom:16px !important;
}

.map-shell-small .section-title h2{
  font-size:1.25rem !important;
}

/* Mapa más grande, proporcional al panel principal */
.map-shell-small .interactive-map{
  width:100% !important;
  border-radius:20px !important;
  background:rgba(8,5,14,.42) !important;
}

.map-shell-small .interactive-map img{
  width:100% !important;
  height:auto !important;
  display:block !important;
}

/* Labels más legibles al aumentar el mapa */
.map-shell-small .zone-hotspot{
  font-size:.44rem !important;
  line-height:1.05 !important;
  min-height:18px !important;
  padding:3px 6px !important;
  border-radius:7px !important;
  max-width:86px !important;
}

.map-shell-small .zone-hotspot[data-zone="vespucci-beach"],
.map-shell-small .zone-hotspot[data-zone="rockford-hills"],
.map-shell-small .zone-hotspot[data-zone="barrios-bajos"],
.map-shell-small .zone-hotspot[data-zone="sandy-shores"]{
  max-width:100px !important;
}

/* Leyenda más cómoda, no tan comprimida */
.zones-sidebar-small{
  max-height:none !important;
  overflow:visible !important;
  padding:22px !important;
}

.zones-sidebar-small .zones-list{
  max-height:460px !important;
  overflow:auto !important;
}

.zones-sidebar-small h3{
  font-size:1.15rem !important;
  margin-bottom:14px !important;
}

.zones-sidebar-small .zones-list button{
  min-height:58px !important;
  padding:10px 12px !important;
  border-radius:16px !important;
}

.zones-sidebar-small .zones-list button b{
  font-size:.84rem !important;
}

.zones-sidebar-small .zones-list button small{
  font-size:.72rem !important;
}

/* La zona izquierda mantiene tarjetas limpias */
.small-map-layout .zone-card-grid{
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
}

@media (max-width:1360px){
  .small-map-layout{
    grid-template-columns:minmax(0, 1fr) 460px !important;
  }
}

@media (max-width:1180px){
  .small-map-layout{
    grid-template-columns:1fr !important;
  }

  .realestate-right-column{
    position:static !important;
    order:-1;
  }

  .map-shell-small .interactive-map{
    max-width:720px;
    margin:0 auto;
  }
}

@media (max-width:780px){
  .small-map-layout .zone-card-grid{
    grid-template-columns:1fr !important;
  }

  .map-shell-small .zone-hotspot{
    font-size:.36rem !important;
    max-width:64px !important;
    padding:2px 4px !important;
  }
}


/* V23 · Fix click en botones del mapa inmobiliario */
.static-full-map,
.interactive-map{
  position:relative !important;
  overflow:visible !important;
}

.static-full-map img,
.interactive-map img{
  pointer-events:none !important;
}

.static-full-map .zone-hotspot,
.interactive-map .zone-hotspot{
  pointer-events:auto !important;
  cursor:pointer !important;
  z-index:50 !important;
  isolation:isolate !important;
}

/* Área invisible más cómoda para clicar sin hacer los labels enormes */
.static-full-map .zone-hotspot::before,
.interactive-map .zone-hotspot::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:12px;
  z-index:-1;
}

.zones-list button{
  cursor:pointer !important;
  pointer-events:auto !important;
}

/* Feedback visual al click/active */
.static-full-map .zone-hotspot.active,
.interactive-map .zone-hotspot.active,
.zones-list button.active{
  outline:2px solid rgba(255,255,255,.75) !important;
  outline-offset:2px !important;
}


/* V24 · Mapa REALMENTE interactivo con capa de botones */
.real-click-map{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  overflow:hidden !important;
  border-radius:20px !important;
  border:1px solid rgba(201,143,255,.22) !important;
  background:rgba(8,5,14,.42) !important;
}

.real-click-map > img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  pointer-events:none !important;
  user-select:none !important;
}

.map-zone-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:30 !important;
  pointer-events:none !important;
}

.map-zone-btn{
  position:absolute !important;
  left:var(--x) !important;
  top:var(--y) !important;
  transform:translate(-50%, -50%) !important;
  z-index:40 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:19px !important;
  max-width:108px !important;
  padding:3px 7px !important;
  border-radius:8px !important;
  border:1px solid rgba(255,255,255,.48) !important;
  color:#fff !important;
  font-size:.48rem !important;
  line-height:1.05 !important;
  font-weight:950 !important;
  text-align:center !important;
  white-space:normal !important;
  text-transform:uppercase !important;
  letter-spacing:.01em !important;
  box-shadow:0 6px 16px rgba(0,0,0,.30) !important;
  transition:.16s ease !important;
}

.map-zone-btn::before{
  content:"";
  position:absolute;
  inset:-8px;
  border-radius:14px;
}

.map-zone-btn:hover,
.map-zone-btn.active{
  transform:translate(-50%, -50%) scale(1.08) !important;
  z-index:60 !important;
  border-color:#fff !important;
  box-shadow:0 0 0 3px rgba(255,255,255,.14), 0 10px 26px rgba(0,0,0,.38) !important;
}

/* También mantenemos compatibilidad con antiguos zone-hotspot por si quedara alguno */
.zone-hotspot{
  pointer-events:auto !important;
  cursor:pointer !important;
}

/* Colores mapa */
.map-zone-btn.zone-blue{background:rgba(45,65,255,.78) !important}
.map-zone-btn.zone-sky{background:rgba(35,180,255,.80) !important}
.map-zone-btn.zone-yellow{background:rgba(245,220,30,.86) !important;color:#1a1028 !important}
.map-zone-btn.zone-purple{background:rgba(176,54,240,.80) !important}
.map-zone-btn.zone-orange{background:rgba(255,138,31,.82) !important}
.map-zone-btn.zone-redorange{background:rgba(255,82,35,.82) !important}
.map-zone-btn.zone-southblue{background:rgba(75,70,235,.82) !important}
.map-zone-btn.zone-cyan{background:rgba(32,214,214,.82) !important}
.map-zone-btn.zone-green{background:rgba(32,211,83,.82) !important}
.map-zone-btn.zone-lime{background:rgba(215,235,50,.86) !important;color:#1a1028 !important}
.map-zone-btn.zone-centerorange{background:rgba(209,139,45,.84) !important}
.map-zone-btn.zone-yellowgreen{background:rgba(185,220,45,.86) !important;color:#1a1028 !important}
.map-zone-btn.zone-maroon{background:rgba(150,22,34,.84) !important}
.map-zone-btn.zone-portyellow{background:rgba(246,222,40,.86) !important;color:#1a1028 !important}

@media (max-width:1180px){
  .map-zone-btn{
    font-size:.42rem !important;
    max-width:88px !important;
    padding:2px 5px !important;
  }
}

@media (max-width:780px){
  .map-zone-btn{
    font-size:.34rem !important;
    max-width:66px !important;
    padding:2px 4px !important;
    border-radius:6px !important;
  }
}


/* V25 · Galería de interiores inmobiliaria */
.interiors-section{
  margin-top:24px;
}

.interiors-intro{
  color:var(--muted);
  max-width:920px;
  margin-bottom:18px;
}

.interiors-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:16px;
}

.interior-card{
  overflow:hidden;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.14);
  display:grid;
  transition:.2s ease;
}

.interior-card:hover{
  transform:translateY(-3px);
  border-color:rgba(201,143,255,.38);
  background:rgba(178,107,255,.10);
}

.interior-card img{
  width:100%;
  aspect-ratio:16/9;
  object-fit:cover;
  display:block;
  border-bottom:1px solid rgba(201,143,255,.14);
}

.interior-card div{
  padding:15px;
  display:grid;
  gap:8px;
}

.interior-card h3{
  color:#fff;
  text-transform:uppercase;
  font-size:.95rem;
}

.interior-card p{
  color:var(--muted);
  font-size:.86rem;
}

.interior-card span{
  width:max-content;
  max-width:100%;
  padding:7px 9px;
  border-radius:999px;
  background:rgba(178,107,255,.12);
  border:1px solid rgba(201,143,255,.18);
  color:#eadcff;
  font-size:.72rem;
  font-weight:800;
  text-transform:uppercase;
}

@media (max-width:1180px){
  .interiors-grid{ grid-template-columns:repeat(2, minmax(0, 1fr)); }
}

@media (max-width:780px){
  .interiors-grid{ grid-template-columns:1fr; }
}


/* V26 · Precios por zona inmobiliaria */
.zone-pricing-panel{
  margin:24px 0;
}

.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.pricing-card{
  padding:18px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
  display:grid;
  gap:10px;
}

.pricing-card strong{
  color:#fff;
  text-transform:uppercase;
  font-size:.9rem;
  line-height:1.25;
}

.pricing-card p{
  color:var(--primary-3);
  font-size:1.25rem;
  font-weight:950;
}

.pricing-card p span{
  color:var(--muted);
  font-size:.9rem;
  font-weight:800;
}

.admin-price{
  border-color:rgba(255,255,255,.18);
  background:rgba(255,255,255,.045);
}

.premium-price{
  border-color:rgba(201,143,255,.34);
  background:rgba(178,107,255,.12);
}

.zone-card .zone-price{
  background:linear-gradient(135deg, rgba(178,107,255,.24), rgba(125,66,255,.16));
  border-color:rgba(201,143,255,.28);
  color:#fff;
}

.legend-color.admin{
  background:#f7f2ff;
}

.admin-zone-card{
  border-color:rgba(255,255,255,.2);
}

@media (max-width:1180px){
  .pricing-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:780px){
  .pricing-grid{
    grid-template-columns:1fr;
  }
}


/* V27 · Interiores por zona */
.interiors-controls{
  margin-bottom:18px;
  max-width:360px;
}

.interior-zone-badges{
  display:flex !important;
  flex-wrap:wrap;
  gap:6px;
  padding:0 !important;
}

.interior-zone-badge{
  width:auto !important;
  padding:6px 8px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.12) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  color:#eadcff !important;
  font-size:.68rem !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

.interior-card[data-zones~="any"]{
  border-color:rgba(255,255,255,.20);
}

.interior-card[data-zones~="zona-rica"]{
  box-shadow:inset 0 0 0 1px rgba(176,54,240,.16);
}

#interiorZoneCounter{
  color:var(--primary-3);
  font-weight:900;
}


/* V33 · Reparación real: mapa activo + interiores con formato V27 */
.zone-interiors-preview{
  margin-top:16px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(201,143,255,.14) !important;
  display:grid !important;
  gap:12px !important;
}

.zone-interiors-preview.empty strong{
  color:#fff !important;
  font-size:.82rem !important;
  text-transform:uppercase !important;
}

.zone-interiors-preview.empty p{
  color:var(--muted) !important;
  font-size:.86rem !important;
  margin:0 !important;
}

.zone-interiors-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:12px !important;
}

.zone-interiors-head strong{
  color:#fff !important;
  font-size:.86rem !important;
  text-transform:uppercase !important;
}

.zone-interiors-head small{
  color:var(--primary-3) !important;
  font-size:.74rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.zone-interiors-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:16px !important;
  max-height:720px !important;
  overflow:auto !important;
  padding-right:4px !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card{
  overflow:hidden !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.14) !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  padding:0 !important;
  transition:.2s ease !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(201,143,255,.38) !important;
  background:rgba(178,107,255,.10) !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card > img{
  width:100% !important;
  height:auto !important;
  min-height:unset !important;
  max-height:none !important;
  aspect-ratio:16/9 !important;
  object-fit:cover !important;
  display:block !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card > div{
  padding:15px !important;
  display:grid !important;
  gap:8px !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card h3{
  color:#fff !important;
  text-transform:uppercase !important;
  font-size:.95rem !important;
  line-height:1.15 !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card p{
  color:var(--muted) !important;
  font-size:.86rem !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card.zone-interior-card span{
  width:max-content !important;
  max-width:100% !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.12) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  color:#eadcff !important;
  font-size:.72rem !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

.zone-interiors-list,
.zone-interior-mini,
.zone-card.active .zone-interior-mini{
  display:none !important;
}

.zone-card.active{
  grid-column:1/-1 !important;
}

.zone-card.active .zone-interiors-grid{
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

@media (max-width:780px){
  .zone-interiors-grid,
  .zone-card.active .zone-interiors-grid{
    grid-template-columns:1fr !important;
  }
}


/* V34 · Panel independiente de precios eliminado */
.zone-pricing-panel,
.pricing-grid{
  display:none !important;
}


/* V35 · Reparación final inmobiliaria: mapa visible + interiores formato correcto */
.zone-pricing-panel,
.pricing-grid{
  display:none !important;
}

/* El layout siempre aparece. Mapa a la derecha y tarjetas a la izquierda. */
.realestate-layout.small-map-layout{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) minmax(470px, 520px) !important;
  gap:24px !important;
  align-items:start !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.realestate-layout.small-map-layout .zone-details-main{
  grid-column:1 !important;
  grid-row:1 !important;
  opacity:1 !important;
  visibility:visible !important;
}

.realestate-layout.small-map-layout .realestate-right-column{
  grid-column:2 !important;
  grid-row:1 !important;
  display:grid !important;
  gap:18px !important;
  position:sticky !important;
  top:24px !important;
  align-self:start !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

/* Mapa siempre visible y clicable */
.real-click-map,
.interactive-map.static-full-map{
  display:block !important;
  position:relative !important;
  width:100% !important;
  height:auto !important;
  overflow:hidden !important;
  opacity:1 !important;
  visibility:visible !important;
  border-radius:20px !important;
}

.real-click-map > img,
.interactive-map.static-full-map > img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  pointer-events:none !important;
  user-select:none !important;
}

.map-zone-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:50 !important;
  pointer-events:none !important;
}

.map-zone-btn{
  pointer-events:auto !important;
  cursor:pointer !important;
  z-index:60 !important;
}

/* Tarjetas de zonas */
.zone-card-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:18px !important;
}

.zone-card{
  overflow:hidden !important;
}

/* Interiores: formato tipo V27, NO tiras. */
.zone-interiors-preview{
  margin-top:16px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(201,143,255,.14) !important;
  display:grid !important;
  gap:12px !important;
}

.zone-interiors-head{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  gap:12px !important;
}

.zone-interiors-head strong{
  color:#fff !important;
  font-size:.86rem !important;
  text-transform:uppercase !important;
}

.zone-interiors-head small{
  color:var(--primary-3) !important;
  font-size:.74rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.zone-interiors-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:16px !important;
  max-height:760px !important;
  overflow:auto !important;
  padding-right:4px !important;
}

/* Soporta tanto la clase nueva como cualquier interior-card heredada */
.zone-card .zone-interiors-grid .interior-card,
.zone-card .zone-interiors-grid .zone-interior-card{
  overflow:hidden !important;
  border-radius:20px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.14) !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  padding:0 !important;
  min-height:0 !important;
  height:auto !important;
}

.zone-card .zone-interiors-grid .interior-card > img,
.zone-card .zone-interiors-grid .zone-interior-card > img{
  display:block !important;
  width:100% !important;
  height:150px !important;
  min-height:150px !important;
  max-height:150px !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
}

.zone-card .zone-interiors-grid .interior-card > div,
.zone-card .zone-interiors-grid .zone-interior-card > div{
  padding:15px !important;
  display:grid !important;
  gap:8px !important;
  min-height:110px !important;
}

.zone-card .zone-interiors-grid .interior-card h3,
.zone-card .zone-interiors-grid .zone-interior-card h3{
  color:#fff !important;
  text-transform:uppercase !important;
  font-size:.9rem !important;
  line-height:1.15 !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card p,
.zone-card .zone-interiors-grid .zone-interior-card p{
  color:var(--muted) !important;
  font-size:.82rem !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card span,
.zone-card .zone-interiors-grid .zone-interior-card span{
  width:max-content !important;
  max-width:100% !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.12) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  color:#eadcff !important;
  font-size:.72rem !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

/* Anula formatos rotos anteriores */
.zone-interiors-list,
.zone-interior-mini{
  display:none !important;
}

.zone-card.active{
  grid-column:1/-1 !important;
}

@media (max-width:1360px){
  .realestate-layout.small-map-layout{
    grid-template-columns:minmax(0,1fr) 460px !important;
  }
}

@media (max-width:1180px){
  .realestate-layout.small-map-layout{
    grid-template-columns:1fr !important;
  }

  .realestate-layout.small-map-layout .realestate-right-column{
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
  }

  .realestate-layout.small-map-layout .zone-details-main{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  .map-shell-small .interactive-map{
    max-width:720px !important;
    margin:0 auto !important;
  }
}

@media (max-width:780px){
  .zone-interiors-grid{
    grid-template-columns:1fr !important;
  }

  .zone-card .zone-interiors-grid .interior-card > img,
  .zone-card .zone-interiors-grid .zone-interior-card > img{
    height:170px !important;
    max-height:170px !important;
  }
}


/* V36 · Inmobiliaria en 3 paneles fijos: interiores + mapa + leyenda */
.page-realestate{
  max-width:1360px !important;
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Estructura principal: panel 1 izquierda, panel 2 y 3 derecha */
.realestate-layout.small-map-layout{
  width:100% !important;
  display:grid !important;
  grid-template-columns:minmax(0, 1.65fr) minmax(360px, .85fr) !important;
  gap:22px !important;
  align-items:start !important;
  justify-content:center !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

/* Panel 1: Interiores */
.realestate-layout.small-map-layout .zone-details-main{
  grid-column:1 !important;
  grid-row:1 / span 2 !important;
  width:100% !important;
  min-width:0 !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  margin:0 !important;
}

/* Columna derecha: contiene panel 2 mapa y panel 3 leyenda */
.realestate-layout.small-map-layout .realestate-right-column{
  grid-column:2 !important;
  grid-row:1 !important;
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:18px !important;
  position:sticky !important;
  top:22px !important;
  align-self:start !important;
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

/* Panel 2: mapa */
.map-shell-small{
  width:100% !important;
  padding:22px !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  margin:0 !important;
}

.map-shell-small .section-title h2{
  font-size:1.1rem !important;
}

/* Panel 3: leyenda */
.zones-sidebar-small{
  width:100% !important;
  max-height:none !important;
  overflow:visible !important;
  padding:22px !important;
  display:block !important;
  opacity:1 !important;
  visibility:visible !important;
  margin:0 !important;
}

.zones-sidebar-small h3{
  font-size:1.05rem !important;
}

.zones-sidebar-small .zones-list{
  max-height:390px !important;
  overflow:auto !important;
  padding-right:4px !important;
}

/* Mapa interactivo siempre visible */
.real-click-map,
.interactive-map.static-full-map{
  display:block !important;
  position:relative !important;
  width:100% !important;
  height:auto !important;
  overflow:hidden !important;
  opacity:1 !important;
  visibility:visible !important;
  border-radius:18px !important;
}

.real-click-map > img,
.interactive-map.static-full-map > img{
  width:100% !important;
  height:auto !important;
  display:block !important;
  pointer-events:none !important;
  user-select:none !important;
}

.map-zone-layer{
  position:absolute !important;
  inset:0 !important;
  z-index:50 !important;
  pointer-events:none !important;
}

.map-zone-btn{
  pointer-events:auto !important;
  cursor:pointer !important;
  z-index:60 !important;
}

/* Tarjetas de zonas/interiores: dentro del panel izquierdo */
.zone-card-grid{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:18px !important;
}

.zone-card{
  width:100% !important;
  overflow:hidden !important;
}

/* Interiores con formato tarjeta real, 2 columnas */
.zone-interiors-preview{
  margin-top:16px !important;
  padding-top:14px !important;
  border-top:1px solid rgba(201,143,255,.14) !important;
  display:grid !important;
  gap:12px !important;
}

.zone-interiors-head{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;
}

.zone-interiors-head strong{
  color:#fff !important;
  font-size:.86rem !important;
  text-transform:uppercase !important;
}

.zone-interiors-head small{
  color:var(--primary-3) !important;
  font-size:.74rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.zone-interiors-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:16px !important;
  max-height:720px !important;
  overflow:auto !important;
  padding-right:4px !important;
}

.zone-card .zone-interiors-grid .interior-card,
.zone-card .zone-interiors-grid .zone-interior-card{
  display:grid !important;
  grid-template-columns:1fr !important;
  gap:0 !important;
  padding:0 !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.14) !important;
}

.zone-card .zone-interiors-grid .interior-card > img,
.zone-card .zone-interiors-grid .zone-interior-card > img{
  display:block !important;
  width:100% !important;
  height:150px !important;
  min-height:150px !important;
  max-height:150px !important;
  object-fit:cover !important;
  object-position:center !important;
  aspect-ratio:auto !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
}

.zone-card .zone-interiors-grid .interior-card > div,
.zone-card .zone-interiors-grid .zone-interior-card > div{
  display:grid !important;
  gap:8px !important;
  padding:14px !important;
}

.zone-card .zone-interiors-grid .interior-card h3,
.zone-card .zone-interiors-grid .zone-interior-card h3{
  color:#fff !important;
  text-transform:uppercase !important;
  font-size:.9rem !important;
  line-height:1.15 !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card p,
.zone-card .zone-interiors-grid .zone-interior-card p{
  color:var(--muted) !important;
  font-size:.82rem !important;
  margin:0 !important;
}

.zone-card .zone-interiors-grid .interior-card span,
.zone-card .zone-interiors-grid .zone-interior-card span{
  width:max-content !important;
  max-width:100% !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.12) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  color:#eadcff !important;
  font-size:.72rem !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
}

/* Ocultar formatos antiguos que generaban tiras */
.zone-interiors-list,
.zone-interior-mini{
  display:none !important;
}

/* Responsive */
@media (max-width:1280px){
  .realestate-layout.small-map-layout{
    grid-template-columns:minmax(0,1fr) 420px !important;
  }
}

@media (max-width:1080px){
  .realestate-layout.small-map-layout{
    grid-template-columns:1fr !important;
  }

  .realestate-layout.small-map-layout .realestate-right-column{
    grid-column:1 !important;
    grid-row:1 !important;
    position:static !important;
  }

  .realestate-layout.small-map-layout .zone-details-main{
    grid-column:1 !important;
    grid-row:2 !important;
  }

  .realestate-right-column{
    grid-template-columns:1fr 1fr !important;
  }
}

@media (max-width:780px){
  .realestate-right-column{
    grid-template-columns:1fr !important;
  }

  .zone-interiors-grid{
    grid-template-columns:1fr !important;
  }

  .zone-card .zone-interiors-grid .interior-card > img,
  .zone-card .zone-interiors-grid .zone-interior-card > img{
    height:170px !important;
    max-height:170px !important;
  }
}


/* V37 · Interiores 16:9 reales + scrollbar en el panel de interiores */
.realestate-layout.small-map-layout{
  align-items:start !important;
}

/* El panel de interiores no crece infinito: tiene scroll interno */
.realestate-layout.small-map-layout .zone-details-main{
  max-height:calc(100vh - 125px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:22px !important;
  scrollbar-width:thin;
}

/* La zona activa no debe deformar el grid ni forzar alturas raras */
.zone-card,
.zone-card.active{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
}

/* Contenedor interno de interiores con scroll propio */
.zone-interiors-preview{
  overflow:visible !important;
}

.zone-interiors-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:16px !important;
  max-height:640px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:6px !important;
  align-items:start !important;
}

/* Tarjeta de interior: nada de tiras, nada de alturas heredadas */
.zone-card .zone-interiors-grid .interior-card,
.zone-card .zone-interiors-grid .zone-interior-card{
  display:flex !important;
  flex-direction:column !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:hidden !important;
  border-radius:18px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.14) !important;
  padding:0 !important;
}

/* Imagen 16:9 real usando wrapper visual por si el navegador arrastra reglas antiguas */
.zone-card .zone-interiors-grid .interior-card > img,
.zone-card .zone-interiors-grid .zone-interior-card > img{
  display:block !important;
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
  flex:0 0 auto !important;
}

/* En caso de que alguna regla anterior fuerce height: 20px/150px, esta manda */
.zone-card .zone-interiors-grid .interior-card.zone-interior-card > img{
  height:auto !important;
  max-height:none !important;
}

/* Texto debajo de la imagen */
.zone-card .zone-interiors-grid .interior-card > div,
.zone-card .zone-interiors-grid .zone-interior-card > div{
  flex:1 1 auto !important;
  display:grid !important;
  gap:8px !important;
  padding:14px !important;
  min-height:112px !important;
  height:auto !important;
}

/* Scrollbar visual integrado */
.zone-details-main::-webkit-scrollbar,
.zone-interiors-grid::-webkit-scrollbar,
.zones-list::-webkit-scrollbar{
  width:8px;
}

.zone-details-main::-webkit-scrollbar-track,
.zone-interiors-grid::-webkit-scrollbar-track,
.zones-list::-webkit-scrollbar-track{
  background:rgba(255,255,255,.04);
  border-radius:999px;
}

.zone-details-main::-webkit-scrollbar-thumb,
.zone-interiors-grid::-webkit-scrollbar-thumb,
.zones-list::-webkit-scrollbar-thumb{
  background:rgba(178,107,255,.45);
  border-radius:999px;
}

/* Mapa y leyenda también caben sin empujar el layout */
.realestate-right-column{
  max-height:calc(100vh - 125px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:4px !important;
}

.map-shell-small,
.zones-sidebar-small{
  flex:0 0 auto !important;
}

@media (max-width:1080px){
  .realestate-layout.small-map-layout .zone-details-main,
  .realestate-right-column{
    max-height:none !important;
    overflow:visible !important;
  }
}

@media (max-width:780px){
  .zone-interiors-grid{
    grid-template-columns:1fr !important;
    max-height:none !important;
    overflow:visible !important;
  }
}


/* V38 · Cada interior en su propia box separada */
.zone-interiors-preview{
  overflow:hidden !important;
}

.zone-interiors-grid{
  display:grid !important;
  grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  gap:18px !important;
  max-height:680px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding:4px 8px 4px 2px !important;
  align-items:start !important;
}

/* Reset total para que ningún estilo anterior convierta las cards en tiras */
.zone-card .zone-interiors-grid article.interior-card,
.zone-card .zone-interiors-grid article.zone-interior-card,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:hidden !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:18px !important;
  background:rgba(12,7,24,.78) !important;
  border:1px solid rgba(201,143,255,.22) !important;
  box-shadow:0 10px 24px rgba(0,0,0,.18) !important;
  transform:none !important;
}

/* Imagen: bloque propio 16:9, nunca se solapa con otra card */
.zone-card .zone-interiors-grid article.interior-card > img,
.zone-card .zone-interiors-grid article.zone-interior-card > img,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card > img{
  position:relative !important;
  display:block !important;
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 9 !important;
  min-height:0 !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  border:0 !important;
  border-radius:0 !important;
  border-bottom:1px solid rgba(201,143,255,.18) !important;
  float:none !important;
  transform:none !important;
  opacity:1 !important;
}

/* Cuerpo inferior separado de la imagen */
.zone-card .zone-interiors-grid article.interior-card > div,
.zone-card .zone-interiors-grid article.zone-interior-card > div,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card > div{
  position:relative !important;
  display:grid !important;
  gap:8px !important;
  padding:14px !important;
  min-height:108px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(178,107,255,.055)) !important;
  border-top:0 !important;
}

.zone-card .zone-interiors-grid article.interior-card h3,
.zone-card .zone-interiors-grid article.zone-interior-card h3,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card h3{
  margin:0 !important;
  color:#fff !important;
  font-size:.9rem !important;
  line-height:1.15 !important;
  text-transform:uppercase !important;
}

.zone-card .zone-interiors-grid article.interior-card p,
.zone-card .zone-interiors-grid article.zone-interior-card p,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card p{
  margin:0 !important;
  color:var(--muted) !important;
  font-size:.8rem !important;
  line-height:1.25 !important;
}

.zone-card .zone-interiors-grid article.interior-card span,
.zone-card .zone-interiors-grid article.zone-interior-card span,
.zone-card .zone-interiors-grid article.interior-card.zone-interior-card span{
  width:max-content !important;
  max-width:100% !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.14) !important;
  border:1px solid rgba(201,143,255,.22) !important;
  color:#eadcff !important;
  font-size:.7rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

/* Separación visual al pasar el ratón */
.zone-card .zone-interiors-grid article.interior-card:hover,
.zone-card .zone-interiors-grid article.zone-interior-card:hover{
  border-color:rgba(201,143,255,.42) !important;
  background:rgba(28,15,48,.92) !important;
  transform:translateY(-2px) !important;
}

/* Elimina definitivamente formatos antiguos de lista/tira */
.zone-interiors-list,
.zone-interior-mini,
.zone-card.active .zone-interior-mini{
  display:none !important;
}

/* El panel izquierdo puede scrollear, las cards se mantienen separadas */
.zone-details-main{
  scrollbar-width:thin;
}

@media (max-width:780px){
  .zone-interiors-grid{
    grid-template-columns:1fr !important;
  }
}


/* V39 · Normalización total de interiores y scrollbars morados globales */

/* Scrollbars morados en TODA la página */
html, body, *{
  scrollbar-width: thin;
  scrollbar-color: rgba(178,107,255,.72) rgba(255,255,255,.06);
}

html::-webkit-scrollbar,
body::-webkit-scrollbar,
*::-webkit-scrollbar{
  width: 8px;
  height: 8px;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track,
*::-webkit-scrollbar-track{
  background: rgba(255,255,255,.05);
  border-radius: 999px;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(196,120,255,.9), rgba(126,74,255,.88));
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.06);
}

/* Panel izquierdo con scroll interno */
.zone-details-main{
  max-height: calc(100vh - 120px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding-right: 14px !important;
}

/* Grid real de interiores */
.zone-interiors-grid{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  grid-auto-rows: max-content !important;
  align-items: start !important;
  gap: 18px !important;
  max-height: 700px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  padding: 4px 8px 6px 2px !important;
}

/* Cada interior es SIEMPRE una card independiente */
.zone-card .zone-interiors-grid .interior-card,
.zone-card .zone-interiors-grid .zone-interior-card,
.zone-card .zone-interiors-grid article.interior-card,
.zone-card .zone-interiors-grid article.zone-interior-card{
  display: block !important;
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  border-radius: 18px !important;
  background: rgba(17,10,31,.92) !important;
  border: 1px solid rgba(201,143,255,.20) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.18) !important;
  isolation: isolate !important;
  contain: layout paint !important;
  break-inside: avoid !important;
}

.zone-card .zone-interiors-grid .interior-card:hover,
.zone-card .zone-interiors-grid .zone-interior-card:hover{
  transform: translateY(-2px) !important;
  border-color: rgba(201,143,255,.38) !important;
}

/* Estructura reconstruida por JS: media + body */
.zone-card .zone-interiors-grid .interior-media{
  display:block !important;
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  overflow:hidden !important;
  background: rgba(95,67,170,.22) !important;
  border-bottom:1px solid rgba(201,143,255,.18) !important;
}

.zone-card .zone-interiors-grid .interior-media img{
  display:block !important;
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center center !important;
  transform:none !important;
  position:relative !important;
  float:none !important;
  opacity:1 !important;
  border:0 !important;
  border-radius:0 !important;
}

/* Si alguna card no se reconstruyera, también se fuerza */
.zone-card .zone-interiors-grid > article > img{
  display:block !important;
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  height:auto !important;
  object-fit:cover !important;
  object-position:center !important;
  border-bottom:1px solid rgba(201,143,255,.18) !important;
}

.zone-card .zone-interiors-grid .interior-body{
  display:grid !important;
  gap:8px !important;
  padding:14px !important;
  min-height:106px !important;
  background: linear-gradient(180deg, rgba(255,255,255,.03), rgba(178,107,255,.05)) !important;
}

.zone-card .zone-interiors-grid .interior-body h3{
  margin:0 !important;
  color:#fff !important;
  font-size:.9rem !important;
  line-height:1.15 !important;
  text-transform:uppercase !important;
}

.zone-card .zone-interiors-grid .interior-body p{
  margin:0 !important;
  color:var(--muted) !important;
  font-size:.8rem !important;
  line-height:1.25 !important;
}

.zone-card .zone-interiors-grid .interior-body span{
  width:max-content !important;
  max-width:100% !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:7px 10px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.14) !important;
  border:1px solid rgba(201,143,255,.24) !important;
  color:#eadcff !important;
  font-size:.71rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

/* Cuerpo antiguo se normaliza */
.zone-card .zone-interiors-grid article > div:not(.interior-body){
  display:grid !important;
  gap:8px !important;
  padding:14px !important;
}

/* Ocultar formatos viejos */
.zone-interiors-list,
.zone-interior-mini,
.zone-card.active .zone-interior-mini{
  display:none !important;
}

@media (max-width: 780px){
  .zone-interiors-grid{
    grid-template-columns: 1fr !important;
    max-height: none !important;
  }
}


/* V41 · Sidebar de inmobiliaria igual que el resto de páginas */
body:has(.page-realestate) .sidebar-nav,
.page-realestate ~ .sidebar-nav{
  width:240px !important;
  min-width:240px !important;
  max-width:240px !important;
  transform:none !important;
  scale:1 !important;
}

/* Compatibilidad: el aside está antes del main, así que usamos clase del body por estructura general */
.sidebar-nav{
  width:240px !important;
  min-width:240px !important;
}

/* Evita que la página de inmobiliaria empuje o reduzca visualmente el menú lateral */
.page-realestate{
  margin-left:260px !important;
}

/* Logo y botones del menú con tamaño normal */
.sidebar-nav .brand-card,
.sidebar-nav .nav-link,
.sidebar-nav .server-status-card{
  transform:none !important;
  scale:1 !important;
}

.sidebar-nav .brand-card{
  min-height:118px !important;
}

.sidebar-nav .brand-card img,
.sidebar-nav .sidebar-logo,
.sidebar-nav .brand-logo{
  max-width:145px !important;
  height:auto !important;
}

.sidebar-nav .nav-link{
  min-height:52px !important;
  padding:0 16px !important;
  font-size:.9rem !important;
}

.sidebar-nav .nav-link .icon-badge{
  width:36px !important;
  height:36px !important;
  min-width:36px !important;
}

.sidebar-nav .server-status-card{
  min-height:130px !important;
  padding:18px !important;
}

/* En pantallas pequeñas se mantiene el comportamiento responsive original */
@media (max-width:980px){
  .page-realestate{
    margin-left:0 !important;
  }

  .sidebar-nav{
    width:auto !important;
    min-width:0 !important;
  }
}


/* V42 · Box principal de interiores fijo, sin scrollbar propio */
.realestate-layout.small-map-layout .zone-details-main,
.zone-details-main{
  max-height:none !important;
  overflow:visible !important;
  overflow-y:visible !important;
  overflow-x:visible !important;
  padding-right:22px !important;
}

/* El scroll se queda únicamente en la lista de interiores si hay muchos */
.zone-interiors-grid{
  max-height:700px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

/* Mantiene los tres paneles sin que el box izquierdo genere doble scroll */
.realestate-layout.small-map-layout{
  align-items:start !important;
}

@media (max-width:1080px){
  .zone-details-main{
    max-height:none !important;
    overflow:visible !important;
  }
}


/* V43 · Panel derecho fijo, sin scrollbar general; solo scrollbar en Leyenda de Zonas */
.realestate-layout.small-map-layout .realestate-right-column,
.realestate-right-column{
  position:sticky !important;
  top:22px !important;
  max-height:none !important;
  overflow:visible !important;
  overflow-y:visible !important;
  overflow-x:visible !important;
  padding-right:0 !important;
  align-self:start !important;
}

/* El panel del mapa tampoco tiene scroll propio */
.realestate-right-column .map-shell-small,
.map-shell-small{
  max-height:none !important;
  overflow:visible !important;
  overflow-y:visible !important;
  overflow-x:visible !important;
}

/* El panel de Leyenda no scrollea entero; solo su lista interna */
.realestate-right-column .zones-sidebar-small,
.zones-sidebar-small{
  max-height:none !important;
  overflow:visible !important;
  overflow-y:visible !important;
  overflow-x:visible !important;
}

/* Único scrollbar del panel derecho: la lista de Leyenda de Zonas */
.zones-sidebar-small .zones-list,
.realestate-right-column .zones-list{
  max-height:390px !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-right:6px !important;
}

/* Mantiene el comportamiento responsive sin sticky forzado en móvil/tablet */
@media (max-width:1080px){
  .realestate-layout.small-map-layout .realestate-right-column,
  .realestate-right-column{
    position:static !important;
    max-height:none !important;
    overflow:visible !important;
    padding-right:0 !important;
  }

  .zones-sidebar-small .zones-list,
  .realestate-right-column .zones-list{
    max-height:360px !important;
    overflow-y:auto !important;
  }
}


/* V44 · Centrar Inmobiliaria respecto al espacio útil, no a toda la pantalla */
.page-realestate{
  max-width:none !important;
  width:calc(100vw - 300px) !important;
  margin-left:270px !important;
  margin-right:30px !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Mantiene el contenido más pegado al sidebar y equilibrado en pantalla */
.page-realestate .page-hero,
.page-realestate .filter-panel,
.page-realestate .realestate-layout,
.page-realestate .discord-wide-panel{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* El layout de los 3 paneles ocupa el ancho útil completo */
.realestate-layout.small-map-layout{
  width:100% !important;
  grid-template-columns:minmax(0, 1.55fr) minmax(390px, .9fr) !important;
}

/* En pantallas medianas se ajusta sin abrir tanto hueco */
@media (max-width:1360px){
  .page-realestate{
    width:calc(100vw - 285px) !important;
    margin-left:255px !important;
    margin-right:24px !important;
  }

  .realestate-layout.small-map-layout{
    grid-template-columns:minmax(0, 1fr) 420px !important;
  }
}

@media (max-width:980px){
  .page-realestate{
    width:auto !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }
}


/* V46 · Revert centrado global forzado */
/* Se elimina el comportamiento de la V45 que desplazaba todas las páginas. */

/* Mantener sidebar en su posición/tamaño original */
.sidebar-nav{
  width:240px !important;
  min-width:240px !important;
  max-width:240px !important;
}

/* Las páginas generales vuelven a su flujo original */
.page,
.page-home,
.page-shop,
.page-rules,
.page-social,
.page-housing,
.page-content,
.main-content,
.page-main,
.content,
main{
  max-width:revert-layer;
}

/* Inmobiliaria queda ajustada al espacio útil sin afectar al resto */
.page-realestate{
  max-width:none !important;
  width:calc(100vw - 300px) !important;
  margin-left:270px !important;
  margin-right:30px !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Sus paneles internos quedan compactos dentro de ese espacio */
.page-realestate .page-hero,
.page-realestate .filter-panel,
.page-realestate .realestate-layout,
.page-realestate .discord-wide-panel{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

/* Mantener tres paneles de inmobiliaria sin desplazar el resto de páginas */
.realestate-layout.small-map-layout{
  width:100% !important;
  max-width:100% !important;
  grid-template-columns:minmax(0, 1.55fr) minmax(390px, .9fr) !important;
  gap:22px !important;
}

html,
body{
  overflow-x:hidden !important;
}

@media (max-width:1360px){
  .page-realestate{
    width:calc(100vw - 285px) !important;
    margin-left:255px !important;
    margin-right:24px !important;
  }

  .realestate-layout.small-map-layout{
    grid-template-columns:minmax(0, 1fr) 420px !important;
  }
}

@media (max-width:980px){
  .page-realestate{
    width:auto !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .realestate-layout.small-map-layout{
    grid-template-columns:1fr !important;
  }
}


/* V47 · Inmobiliaria como las demás páginas */
.page.page-realestate{
  width:min(1360px, calc(100% - 34px)) !important;
  margin:34px auto 0 !important;
  padding-bottom:44px !important;
  padding-left:0 !important;
  padding-right:0 !important;
  max-width:none !important;
}

.page-realestate .page-hero,
.page-realestate .filter-panel,
.page-realestate .realestate-layout,
.page-realestate .discord-wide-panel{
  width:100% !important;
  max-width:100% !important;
  margin-left:0 !important;
  margin-right:0 !important;
}

.page-realestate .realestate-layout.small-map-layout{
  width:100% !important;
  max-width:100% !important;
  grid-template-columns:minmax(0, 1.55fr) minmax(360px, .85fr) !important;
  gap:22px !important;
}

body:has(.page-realestate) .sidebar-nav,
.sidebar-nav{
  transform:none !important;
}

@media (max-width:1360px){
  .page.page-realestate{
    width:min(1360px, calc(100% - 34px)) !important;
    margin:34px auto 0 !important;
  }

  .page-realestate .realestate-layout.small-map-layout{
    grid-template-columns:minmax(0, 1fr) 390px !important;
  }
}

@media (max-width:980px){
  .page-realestate .realestate-layout.small-map-layout{
    grid-template-columns:1fr !important;
  }
}


/* V50 · Google Docs incrustado en Normativa General */
.rule-doc-embed{
  display:grid;
  gap:18px;
  padding:24px;
  border-radius:24px;
  background:linear-gradient(180deg, rgba(28,16,47,.82), rgba(14,8,25,.72));
  border:1px solid rgba(201,143,255,.18);
  box-shadow:var(--shadow);
}

.rule-doc-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
}

.rule-doc-head h2{
  margin-top:8px;
  text-transform:uppercase;
  color:#fff;
}

.rule-doc-head p{
  margin-top:8px;
  color:var(--muted);
  max-width:760px;
}

.small-doc-btn{
  white-space:nowrap;
  min-height:44px;
  padding:0 18px;
}

.docs-frame-wrap{
  width:100%;
  height:78vh;
  min-height:720px;
  overflow:hidden;
  border-radius:20px;
  border:1px solid rgba(201,143,255,.20);
  background:rgba(255,255,255,.035);
}

.docs-frame-wrap iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#fff;
}

@media (max-width:900px){
  .rule-doc-head{
    display:grid;
  }

  .small-doc-btn{
    width:max-content;
  }

  .docs-frame-wrap{
    height:72vh;
    min-height:560px;
  }
}


/* V51 · Docs incrustado dentro de Normativa General */
.normativa-general-embed{
  margin-top:16px;
  display:grid;
  gap:16px;
}

.normativa-general-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
}

.normativa-general-head h4{
  color:#fff;
  text-transform:uppercase;
  font-size:1rem;
  margin:0 0 6px;
}

.normativa-general-head p{
  color:var(--muted);
  margin:0;
}

.normativa-general-head a{
  white-space:nowrap;
  color:#eadcff;
  font-weight:900;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(178,107,255,.14);
  border:1px solid rgba(201,143,255,.22);
}

.normativa-doc-frame{
  width:100%;
  height:76vh;
  min-height:680px;
  overflow:hidden;
  border-radius:18px;
  border:1px solid rgba(201,143,255,.22);
  background:#fff;
}

.normativa-doc-frame iframe{
  width:100%;
  height:100%;
  display:block;
  border:0;
  background:#fff;
}

/* Oculta el panel independiente anterior si quedase cacheado */
.rule-doc-embed{
  display:none !important;
}

@media (max-width:900px){
  .normativa-general-head{
    display:grid;
  }

  .normativa-general-head a{
    width:max-content;
  }

  .normativa-doc-frame{
    height:72vh;
    min-height:540px;
  }
}


/* V52 · Abrir/cerrar Normativa General incrustada con botón + / - */
.doc-toggle,
.accordion-toggle.doc-toggle{
  width:34px;
  height:34px;
  min-width:34px;
  border-radius:10px;
  border:1px solid rgba(201,143,255,.24);
  background:rgba(178,107,255,.14);
  color:#eadcff;
  font-size:1.2rem;
  line-height:1;
  font-weight:950;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:.18s ease;
}

.doc-toggle:hover{
  background:rgba(178,107,255,.26);
  border-color:rgba(201,143,255,.46);
  transform:translateY(-1px);
}

.floating-doc-toggle{
  position:absolute;
  right:16px;
  top:16px;
}

.normativa-general-head{
  position:relative;
}

.normativa-general-embed{
  overflow:hidden;
  transition:max-height .26s ease, opacity .2s ease, margin .2s ease;
  max-height:2200px;
  opacity:1;
}

.normativa-general-embed.is-collapsed{
  max-height:0 !important;
  opacity:0;
  margin-top:0 !important;
  pointer-events:none;
}

.normativa-doc-frame{
  transition:height .2s ease;
}


/* V53 · Usar el + / - existente, sin botón adicional */
.doc-toggle,
.floating-doc-toggle,
.accordion-toggle.doc-toggle{
  display:none !important;
}

/* El bloque del documento se pliega al usar el acordeón original */
.normativa-general-embed{
  overflow:hidden;
  transition:max-height .26s ease, opacity .2s ease, margin .2s ease;
  max-height:2200px;
  opacity:1;
}

.normativa-general-embed.is-collapsed{
  max-height:0 !important;
  opacity:0;
  margin-top:0 !important;
  pointer-events:none;
}


/* V54 · Normativa General abre/cierra con el + / - EXISTENTE */
/* El iframe depende directamente del estado open del acordeón original */
.rule-panel:not(.open) .normativa-general-embed{
  display:none !important;
}

.rule-panel.open .normativa-general-embed{
  display:grid !important;
}

/* Evita que scripts anteriores lo dejen colapsado cuando el panel está abierto */
.rule-panel.open .normativa-general-embed.is-collapsed{
  max-height:none !important;
  opacity:1 !important;
  pointer-events:auto !important;
  margin-top:16px !important;
}

/* No mostrar ningún botón extra creado en versiones anteriores */
.doc-toggle,
.floating-doc-toggle,
.accordion-toggle.doc-toggle,
[data-doc-toggle="normativa-general"]{
  display:none !important;
}


/* V55 · Categoría Normativa Crews */
.normativa-crews-embed{
  margin-top:16px;
}

.rule-link[data-rule="crews"]{
  position:relative;
}

.rule-link[data-rule="crews"]::after{
  content:"Pág. 33";
  margin-left:auto;
  font-size:.7rem;
  color:#eadcff;
  opacity:.8;
  font-weight:900;
}

.rule-panel:not(.open) .normativa-crews-embed{
  display:none !important;
}

.rule-panel.open .normativa-crews-embed{
  display:grid !important;
}


/* V56 · Normativas: solo Normativa General centrada */
.rules-single-layout{
  width:100%;
  display:flex;
  justify-content:center;
  margin-top:24px;
}

.rule-single-doc{
  width:min(1120px, 100%);
  display:grid;
  gap:20px;
}

.rule-single-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:20px;
}

.rule-single-head h2{
  margin-top:10px;
  text-transform:uppercase;
  color:#fff;
  font-size:1.7rem;
}

.rule-single-head p{
  margin-top:8px;
  color:var(--muted);
  max-width:760px;
}

.single-doc-frame{
  width:100%;
  height:78vh;
  min-height:720px;
  border-radius:20px;
  overflow:hidden;
  border:1px solid rgba(201,143,255,.22);
  background:#fff;
}

.single-doc-frame iframe{
  width:100%;
  height:100%;
  border:0;
  display:block;
  background:#fff;
}

/* Oculta categorías/acordeones antiguos si quedaran cacheados */
.rules-layout,
.sidebar-rules,
.accordion,
.rule-panel,
.rule-doc-embed,
.normativa-crews-embed{
  display:none !important;
}

@media (max-width:900px){
  .rule-single-head{
    display:grid;
  }

  .single-doc-frame{
    height:72vh;
    min-height:540px;
  }
}


/* V58 · Redes sociales: quitar Discord duplicado y cards 1:1 */
.page-social .mini-feature-grid .mini-feature:has([data-icon="discord"]),
.page-social .social-feature-card:has([data-icon="discord"]),
.page-social .top-social-card:has([data-icon="discord"]){
  display:none !important;
}

/* Grid principal de redes */
.page-social .social-grid,
.page-social .network-grid,
.page-social .social-square-grid{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

/* Cards principales: Discord, YouTube, Instagram, X/Twitter, Twitch en 1:1 */
.page-social .social-grid > *,
.page-social .network-grid > *,
.page-social .social-square-grid > *,
.page-social .social-card,
.page-social .network-card{
  aspect-ratio:1 / 1 !important;
  min-height:0 !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  overflow:hidden !important;
}

/* Ajustes de texto para que quepa dentro del cuadrado */
.page-social .social-card h3,
.page-social .network-card h3,
.page-social .social-grid h3,
.page-social .network-grid h3{
  font-size:1rem !important;
  line-height:1.05 !important;
  margin:0 !important;
}

.page-social .social-card p,
.page-social .network-card p,
.page-social .social-grid p,
.page-social .network-grid p{
  font-size:.82rem !important;
  line-height:1.25 !important;
  margin:0 !important;
}

.page-social .social-card strong,
.page-social .network-card strong,
.page-social .social-grid strong,
.page-social .network-grid strong{
  font-size:1.05rem !important;
  line-height:1.1 !important;
  word-break:break-word !important;
}

.page-social .social-card .btn,
.page-social .network-card .btn,
.page-social .social-grid .btn,
.page-social .network-grid .btn{
  min-height:40px !important;
  padding:0 12px !important;
  font-size:.78rem !important;
  width:100% !important;
}

.page-social .icon-badge{
  width:42px !important;
  height:42px !important;
  min-width:42px !important;
}

/* Botones largos: evitar que rompan el cuadrado */
.page-social a.btn,
.page-social button.btn{
  white-space:normal !important;
}

/* Mantener el Discord inferior/ancho */
.page-social .discord-wide-panel,
.page-social .discord-wide-card{
  aspect-ratio:auto !important;
  height:auto !important;
}

/* Responsive */
@media (max-width:1320px){
  .page-social .social-grid,
  .page-social .network-grid,
  .page-social .social-square-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width:820px){
  .page-social .social-grid,
  .page-social .network-grid,
  .page-social .social-square-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:560px){
  .page-social .social-grid,
  .page-social .network-grid,
  .page-social .social-square-grid{
    grid-template-columns:1fr !important;
  }
}


/* V59 · Redes sociales: quitar CTA extra y marcar menú lateral */
.page-social .community-cta,
.page-social .social-community-cta,
.page-social .status-bar:has(h2),
.page-social .status-bar:has(strong){
  display:none !important;
}

/* Fallback: asegurar que Redes Sociales se vea activo en su página aunque el JS no coincida */
body:has(.page-social) .nav-links a[href="redes.html"],
body:has([data-current-page="redes"]) .nav-links a[href="redes.html"],
body:has([data-current-page="redes"]) .nav-links a[data-page="redes"]{
  color:white !important;
  background:linear-gradient(135deg, rgba(178,107,255,.86), rgba(124,64,255,.42)) !important;
  border-color:rgba(201,143,255,.42) !important;
  box-shadow:0 14px 36px rgba(128,64,255,.22) !important;
}

/* Mantener el Discord inferior principal visible */
.page-social .discord-wide-panel,
.page-social .discord-wide-card{
  display:flex !important;
}


/* V60 · Redes Sociales: nav restaurado, CTA quitado, Discord inferior conservado */
.page-social .cta-panel{
  display:none !important;
}

/* Oculta únicamente el Discord pequeño del bloque superior si quedara cacheado */
.page-social .mini-feature-grid article:has([data-icon="discord"]){
  display:none !important;
}

/* Mantener visible el Discord ancho inferior */
.page-social .discord-wide-panel,
.page-social .discord-wide-card{
  display:flex !important;
  aspect-ratio:auto !important;
  height:auto !important;
}

/* Asegurar que el botón Redes Sociales aparezca activo en el sidebar */
body:has([data-current-page="redes"]) .nav-links a[href="redes.html"],
body:has([data-current-page="redes"]) .nav-links a[data-page="redes"],
.nav-links a.active[href="redes.html"],
.nav-links a.active[data-page="redes"]{
  color:white !important;
  background:linear-gradient(135deg, rgba(178,107,255,.86), rgba(124,64,255,.42)) !important;
  border-color:rgba(201,143,255,.42) !important;
  box-shadow:0 14px 36px rgba(128,64,255,.22) !important;
}

/* Cards principales de redes en cuadrado 1:1 */
.page-social .social-square-grid,
.page-social .social-grid{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

.page-social .social-square-grid > .social-card,
.page-social .social-grid > .social-card{
  aspect-ratio:1 / 1 !important;
  min-height:0 !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  overflow:hidden !important;
}

.page-social .social-card h3{
  font-size:1rem !important;
  line-height:1.05 !important;
}

.page-social .social-card p,
.page-social .social-card small{
  font-size:.78rem !important;
  line-height:1.22 !important;
}

.page-social .social-card strong{
  font-size:1.05rem !important;
  line-height:1.1 !important;
  word-break:break-word !important;
}

.page-social .social-card .btn{
  min-height:38px !important;
  padding:0 10px !important;
  font-size:.74rem !important;
  width:100% !important;
}

@media (max-width:1320px){
  .page-social .social-square-grid,
  .page-social .social-grid{
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width:820px){
  .page-social .social-square-grid,
  .page-social .social-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:560px){
  .page-social .social-square-grid,
  .page-social .social-grid{
    grid-template-columns:1fr !important;
  }
}


/* V61 · Botón Discord inferior global en todas las ventanas */
.discord-wide-panel{
  margin-top:24px !important;
  display:block !important;
}

.discord-wide-card{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  width:100% !important;
  min-height:106px !important;
  padding:24px 28px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg, rgba(178,107,255,.18), rgba(14,8,25,.76)) !important;
  border:1px solid rgba(201,143,255,.28) !important;
  box-shadow:0 18px 48px rgba(128,64,255,.16) !important;
}

.discord-wide-card > div{
  flex:1 1 auto !important;
}

.discord-wide-card small{
  display:block !important;
  color:#dcbcff !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
  letter-spacing:.04em !important;
}

.discord-wide-card strong{
  display:block !important;
  color:#fff !important;
  font-size:1.55rem !important;
  line-height:1 !important;
  text-transform:uppercase !important;
}

.discord-wide-card p{
  margin-top:8px !important;
  color:#eadcff !important;
  font-size:.92rem !important;
  font-weight:700 !important;
  text-transform:uppercase !important;
}

.discord-wide-card em{
  min-width:210px !important;
  min-height:54px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:16px !important;
  background:linear-gradient(135deg, #b26bff, #7d42ff) !important;
  color:#fff !important;
  font-style:normal !important;
  font-size:1.05rem !important;
  font-weight:950 !important;
  text-transform:uppercase !important;
  box-shadow:0 16px 36px rgba(126,66,255,.32) !important;
}

/* Se mantiene visible el mini Discord del panel superior de redes */
.page-social .mini-feature-grid article:has([data-icon="discord"]){
  display:grid !important;
}

/* El CTA viejo sigue eliminado */
.page-social .cta-panel{
  display:none !important;
}

@media (max-width:780px){
  .discord-wide-card{
    display:grid !important;
    text-align:left !important;
  }

  .discord-wide-card em{
    width:100% !important;
    min-width:0 !important;
  }
}


/* V62 · Footer Discord colocado en Redes Sociales */
.page-social .discord-wide-panel{
  margin-top:24px !important;
  display:block !important;
  width:100% !important;
}

.page-social .discord-wide-card{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  width:100% !important;
}

.page-social .discord-wide-card > div{
  display:block !important;
  flex:1 1 auto !important;
}

.page-social .discord-wide-card em{
  display:inline-flex !important;
}


/* V63 · Forzar footer Discord visible abajo del todo en Redes Sociales */
.page-social{
  display:block !important;
}

.page-social .redes-discord-footer,
.page-social footer.redes-discord-footer,
.page-social footer.discord-wide-panel.redes-discord-footer{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  transform:none !important;
  position:relative !important;
  z-index:5 !important;
  width:100% !important;
  margin:28px 0 0 0 !important;
  padding:0 !important;
  clear:both !important;
  min-height:110px !important;
}

/* Anula reglas anteriores que ocultaban status-bar/strong dentro de redes */
.page-social .redes-discord-footer:has(strong),
.page-social .redes-discord-footer.status-bar:has(strong),
.page-social .redes-discord-footer.status-bar{
  display:block !important;
}

.page-social .redes-discord-footer .discord-wide-card{
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:22px !important;
  width:100% !important;
  min-height:106px !important;
  padding:24px 28px !important;
  border-radius:24px !important;
  background:linear-gradient(135deg, rgba(178,107,255,.18), rgba(14,8,25,.76)) !important;
  border:1px solid rgba(201,143,255,.28) !important;
  box-shadow:0 18px 48px rgba(128,64,255,.16) !important;
}

.page-social .redes-discord-footer .discord-wide-card > div{
  display:block !important;
  flex:1 1 auto !important;
}

.page-social .redes-discord-footer .discord-wide-card em{
  display:inline-flex !important;
  visibility:visible !important;
  opacity:1 !important;
}

.page-social .redes-discord-footer .discord-wide-card strong,
.page-social .redes-discord-footer .discord-wide-card small,
.page-social .redes-discord-footer .discord-wide-card p{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
}

/* El CTA viejo sigue oculto, pero no afecta al footer nuevo */
.page-social .cta-panel{
  display:none !important;
}


/* V66 · Concesionario */
.dealership-preview-placeholder{
  min-height:320px;
  display:grid;
  place-items:center;
  align-content:center;
  gap:12px;
  text-align:center;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
}
.dealership-preview-placeholder h3{color:#fff;text-transform:uppercase;margin:0}
.dealership-preview-placeholder p{color:var(--muted);margin:0}

.vehicle-card-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}
.vehicle-card{
  overflow:hidden;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
}
.vehicle-image-placeholder{
  aspect-ratio:16/9;
  display:grid;
  place-items:center;
  background:linear-gradient(135deg,rgba(178,107,255,.12),rgba(255,255,255,.03));
  border-bottom:1px solid rgba(201,143,255,.14);
}
.vehicle-card>div:last-child{padding:16px;display:grid;gap:8px}
.vehicle-card h3{color:#fff;margin:0;text-transform:uppercase}
.vehicle-card p{color:var(--muted);margin:0}
.vehicle-card span{
  width:max-content;padding:7px 9px;border-radius:999px;color:#eadcff;
  background:rgba(178,107,255,.12);border:1px solid rgba(201,143,255,.18);
  font-size:.72rem;font-weight:900;text-transform:uppercase
}
@media(max-width:780px){.vehicle-card-grid{grid-template-columns:1fr}}


/* V67 · Concesionario limpio y centrado */
.page:has([data-current-page="concesionario"]),
.page[data-current-page="concesionario"]{
  width:min(1360px, calc(100% - 34px)) !important;
  margin:34px auto 0 !important;
}

.dealership-main-layout{
  width:100% !important;
  display:block !important;
  margin-top:24px !important;
}

.dealership-main-panel{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
}

.dealership-main-panel .section-title{
  margin-bottom:22px !important;
}

.dealership-main-panel .section-title h2{
  font-size:1.35rem !important;
}

.vehicle-card-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:20px !important;
  width:100% !important;
}

.vehicle-card{
  overflow:hidden !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.16) !important;
}

.vehicle-image-placeholder{
  width:100% !important;
  aspect-ratio:16/9 !important;
  display:grid !important;
  place-items:center !important;
  background:linear-gradient(135deg, rgba(178,107,255,.12), rgba(255,255,255,.03)) !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
}

.vehicle-card > div:last-child{
  padding:18px !important;
  display:grid !important;
  gap:9px !important;
}

.vehicle-card h3{
  color:#fff !important;
  margin:0 !important;
  text-transform:uppercase !important;
  font-size:1rem !important;
}

.vehicle-card p{
  color:var(--muted) !important;
  margin:0 !important;
  font-size:.86rem !important;
}

.vehicle-card span{
  width:max-content !important;
  padding:7px 9px !important;
  border-radius:999px !important;
  color:#eadcff !important;
  background:rgba(178,107,255,.12) !important;
  border:1px solid rgba(201,143,255,.18) !important;
  font-size:.72rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

/* Ocultar restos heredados de inmobiliaria */
.page[data-current-page="concesionario"] .realestate-right-column,
.page[data-current-page="concesionario"] .zones-sidebar,
.page[data-current-page="concesionario"] .interactive-map,
.page[data-current-page="concesionario"] .filter-panel,
.page[data-current-page="concesionario"] .zone-card,
.page[data-current-page="concesionario"] .zone-pricing-panel{
  display:none !important;
}

@media (max-width:1100px){
  .vehicle-card-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:680px){
  .vehicle-card-grid{
    grid-template-columns:1fr !important;
  }
}


/* V69 · Corrección quirúrgica de Compras */
/* Mantiene el formato original. Solo centra los 3 coches restantes. */
.page-shop .centered-vehicle-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 280px)) !important;
  justify-content:center !important;
  gap:18px !important;
}

.page-shop .centered-vehicle-grid > .product-card{
  width:100% !important;
  max-width:280px !important;
}

/* Se conserva el grid y formato original de los packs CP */
.page-shop .cp-grid{
  grid-template-columns:repeat(5, 1fr) !important;
}

@media (max-width:1180px){
  .page-shop .centered-vehicle-grid{
    grid-template-columns:repeat(2, minmax(0, 280px)) !important;
  }

  .page-shop .cp-grid{
    grid-template-columns:repeat(2, 1fr) !important;
  }
}

@media (max-width:780px){
  .page-shop .centered-vehicle-grid,
  .page-shop .cp-grid{
    grid-template-columns:1fr !important;
  }

  .page-shop .centered-vehicle-grid > .product-card{
    max-width:none !important;
  }
}


/* V73 · Concesionario con 3 coches exclusivos */
.vehicle-card-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:22px !important;
}

.exclusive-vehicle-card{
  overflow:hidden !important;
  border-radius:22px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.16) !important;
  box-shadow:0 14px 34px rgba(0,0,0,.16) !important;
  transition:.18s ease !important;
}

.exclusive-vehicle-card:hover{
  transform:translateY(-3px) !important;
  border-color:rgba(201,143,255,.38) !important;
}

.exclusive-vehicle-card > img{
  width:100% !important;
  aspect-ratio:16 / 9 !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
  border-bottom:1px solid rgba(201,143,255,.14) !important;
}

.vehicle-card-body{
  padding:18px !important;
  display:grid !important;
  gap:12px !important;
}

.vehicle-card-body h3{
  color:#fff !important;
  margin:0 !important;
  font-size:1.2rem !important;
  text-transform:none !important;
}

.vehicle-tag{
  width:max-content !important;
  padding:7px 10px !important;
  border-radius:999px !important;
  background:rgba(178,107,255,.14) !important;
  border:1px solid rgba(201,143,255,.20) !important;
  color:#eadcff !important;
  font-size:.72rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.vehicle-card-body dl{
  display:grid !important;
  gap:8px !important;
  margin:0 !important;
}

.vehicle-card-body dl > div{
  display:flex !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:10px 12px !important;
  border-radius:12px !important;
  background:rgba(255,255,255,.025) !important;
  border:1px solid rgba(201,143,255,.10) !important;
}

.vehicle-card-body dt{
  color:var(--muted) !important;
  font-size:.78rem !important;
  font-weight:800 !important;
}

.vehicle-card-body dd{
  color:#fff !important;
  margin:0 !important;
  font-size:.82rem !important;
  font-weight:900 !important;
  text-align:right !important;
  word-break:break-word !important;
}

@media (max-width:1100px){
  .vehicle-card-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width:680px){
  .vehicle-card-grid{
    grid-template-columns:1fr !important;
  }
}


/* V75 · Disponibilidad de vehículos */
.vehicle-status{
  width:max-content !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:7px 11px !important;
  border-radius:999px !important;
  font-size:.72rem !important;
  font-weight:950 !important;
  letter-spacing:.03em !important;
  text-transform:uppercase !important;
}

.vehicle-status.available{
  color:#8effb2 !important;
  background:rgba(44,203,103,.13) !important;
  border:1px solid rgba(74,255,142,.34) !important;
}

.vehicle-status.unavailable{
  color:#ff9b9b !important;
  background:rgba(229,51,67,.13) !important;
  border:1px solid rgba(255,91,103,.34) !important;
}

.vehicle-tag{
  display:none !important;
}


/* V78 · Icono SVG de vehículo */
.vehicle-svg-icon{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.vehicle-svg-icon img{
  width:22px !important;
  height:22px !important;
  object-fit:contain !important;
  display:block !important;
  filter:brightness(0) invert(1) !important;
}

.mini-feature-grid .vehicle-svg-icon img{
  width:24px !important;
  height:24px !important;
}


/* V81 · Catálogo dinámico conectado al bot de Discord */
.dealership-main-panel{
  width:100% !important;
}

.vehicle-loading-card{
  grid-column:1 / -1;
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
  border-radius:22px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
  color:#fff;
}

.vehicle-error-card{
  border-color:rgba(255,91,103,.28);
}

.vehicle-error-card small{
  color:var(--muted);
}


/* V87 · Catálogo completo de vehículos exclusivos */
.vehicle-loading-card{
  grid-column:1 / -1;
  min-height:180px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:22px;
  background:rgba(255,255,255,.035);
  border:1px solid rgba(201,143,255,.16);
  color:#fff;
}

.vehicle-card-body dl > div:last-child dd{
  font-family:monospace;
  letter-spacing:.02em;
}

/* V88 · Buscador y filtros del concesionario */
.vehicle-catalog-controls{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:16px;margin:0 0 22px}.vehicle-search-control,.vehicle-status-control{min-height:52px;display:flex;align-items:center;gap:12px;padding:0 14px;border-radius:16px;background:rgba(255,255,255,.035);border:1px solid rgba(201,143,255,.16)}.vehicle-search-control:focus-within,.vehicle-status-control:focus-within{border-color:rgba(201,143,255,.42);box-shadow:0 0 0 3px rgba(178,107,255,.08)}.vehicle-search-control input{width:100%;border:0;outline:0;background:transparent;color:#fff;font:inherit;font-weight:700}.vehicle-search-control input::placeholder{color:rgba(234,220,255,.52)}.vehicle-status-control{justify-content:space-between}.vehicle-status-control>span{color:var(--muted);font-size:.82rem;font-weight:900;text-transform:uppercase}.vehicle-status-control select{flex:1;border:0;outline:0;background:#1a1028;color:#fff;font:inherit;font-weight:800;padding:8px 10px;border-radius:10px}.vehicle-status-control select option{background:#1a1028;color:#fff}.vehicle-empty-card small{color:var(--muted)}@media(max-width:760px){.vehicle-catalog-controls{grid-template-columns:1fr}}


/* V90 · Buscador estilo inmobiliaria sin romper el catálogo */
.vehicle-filter-panel{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 280px !important;
  gap:16px !important;
  align-items:center !important;
  width:100% !important;
  margin:0 0 22px !important;
  padding:18px !important;
  border-radius:20px !important;
  background:rgba(22,13,36,.68) !important;
  border:1px solid rgba(201,143,255,.16) !important;
  box-shadow:0 16px 34px rgba(0,0,0,.14) !important;
}

.vehicle-search-control,
.vehicle-status-control{
  min-height:52px !important;
  display:flex !important;
  align-items:center !important;
  gap:12px !important;
  padding:0 14px !important;
  border-radius:15px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(201,143,255,.16) !important;
}

.vehicle-search-control:focus-within,
.vehicle-status-control:focus-within{
  border-color:rgba(201,143,255,.42) !important;
  box-shadow:0 0 0 3px rgba(178,107,255,.08) !important;
}

.vehicle-search-control input{
  width:100% !important;
  min-width:0 !important;
  border:0 !important;
  outline:0 !important;
  background:transparent !important;
  color:#fff !important;
  font:inherit !important;
  font-weight:700 !important;
}

.vehicle-status-control{
  justify-content:space-between !important;
}

.vehicle-status-control > span{
  color:var(--muted) !important;
  font-size:.78rem !important;
  font-weight:900 !important;
  text-transform:uppercase !important;
}

.vehicle-status-control select{
  flex:1 !important;
  min-height:38px !important;
  border:0 !important;
  outline:0 !important;
  border-radius:10px !important;
  padding:0 12px !important;
  background:#1a1028 !important;
  color:#fff !important;
  font:inherit !important;
  font-weight:800 !important;
}

.vehicle-status-control select option{
  background:#1a1028 !important;
  color:#fff !important;
}

@media(max-width:820px){
  .vehicle-filter-panel{
    grid-template-columns:1fr !important;
  }
}


/* V91 · Nueva sección Ofertas en Compras */
.offers-grid{
  display:grid !important;
  grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
  gap:18px !important;
  align-items:stretch !important;
}

.offer-placeholder-card{
  min-height:240px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:space-between !important;
  align-items:flex-start !important;
}

.offer-placeholder-card strong{
  color:#e6c2ff !important;
  font-size:1rem !important;
  font-weight:950 !important;
}

@media (max-width:980px){
  .offers-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
  }
}

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


/* V93 · Ofertas de junio */
.offers-banner-card{
  width:100%;
  overflow:hidden;
  border-radius:22px;
  margin:0 0 22px;
  border:1px solid rgba(201,143,255,.22);
  background:rgba(255,255,255,.035);
  box-shadow:0 18px 40px rgba(0,0,0,.20);
}

.offers-banner-card img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;
}

.offers-grid{
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
}

.offer-card{
  min-height:190px !important;
  display:flex !important;
  flex-direction:column !important;
  justify-content:flex-start !important;
  align-items:flex-start !important;
  gap:12px !important;
}

.offer-card h3{
  margin:8px 0 0 !important;
  color:#f0c5ff !important;
  font-size:1.55rem !important;
  line-height:1 !important;
}

.offer-card p{
  margin:0 !important;
  color:var(--muted) !important;
}

.offer-card.featured{
  border-color:rgba(223,107,255,.42) !important;
  box-shadow:0 16px 34px rgba(190,70,255,.10) !important;
}

.offer-bonus-card{
  border-color:rgba(78,220,255,.28) !important;
}

@media(max-width:980px){
  .offers-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

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


/* V94 · Ofertas solo imagen */
.offers-banner-only{
  margin-bottom:0 !important;
}

.offers-banner-only img{
  width:100% !important;
  height:auto !important;
  display:block !important;
  object-fit:contain !important;
}


/* ========================================================================== 
   V105 · TEMA ARCADE / PIXEL GLOBAL
   Mantiene la estructura y funcionalidades existentes, cambiando únicamente
   la identidad visual de CheckPoint RP y Check Zone RP.
   ========================================================================== */

:root{
  --bg:#05030a;
  --bg-2:#0c0615;
  --panel:rgba(14,8,26,.92);
  --panel-2:rgba(24,10,43,.96);
  --line:rgba(212,104,255,.68);
  --primary:#d45cff;
  --primary-2:#7f42ff;
  --primary-3:#62d9ff;
  --text:#fffaff;
  --muted:#cdb8dd;
  --success:#66ff9f;
  --danger:#ff4f75;
  --warning:#ffe45c;
  --arcade-cyan:#5ce1ff;
  --arcade-pink:#ff5cdb;
  --arcade-purple:#a74cff;
  --arcade-dark:#08040f;
  --shadow:8px 8px 0 rgba(0,0,0,.48),0 0 28px rgba(189,70,255,.20);
  --radius:8px;
}

html{
  scrollbar-color:var(--arcade-purple) #09040f;
  scrollbar-width:thin;
}

body{
  font-family:"Oxanium","Segoe UI",system-ui,sans-serif !important;
  letter-spacing:.01em;
  image-rendering:auto;
  background-color:var(--arcade-dark) !important;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:9998;
  pointer-events:none;
  opacity:.075;
  background:repeating-linear-gradient(
    to bottom,
    transparent 0,
    transparent 3px,
    rgba(255,255,255,.23) 4px
  );
  mix-blend-mode:overlay;
}

body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background-image:
    linear-gradient(rgba(164,76,255,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(92,225,255,.04) 1px,transparent 1px);
  background-size:32px 32px;
}

::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:#09040f;border-left:2px solid #1c0c2d}
::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg,var(--arcade-pink),var(--arcade-purple));
  border:2px solid #09040f;
  border-radius:0;
}
::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,var(--arcade-cyan),var(--arcade-purple))}

h1,h2,h3,.hero h1,.hero-copy h1,.section-title h2,.card h2,.card h3,
.side-brand,.sidebar-nav b,.shop-tab,.tab,.eyebrow,.badge,.status-bar strong,
.discord-wide-card strong,.product-card h3,.vehicle-card h3{
  font-family:"Pixelify Sans","Oxanium",sans-serif !important;
  letter-spacing:-.02em !important;
  text-transform:uppercase;
  text-shadow:3px 3px 0 #10051d,0 0 14px rgba(213,89,255,.30);
}

p,small,input,select,button,a,label,strong,span,em{
  font-family:"Oxanium","Segoe UI",system-ui,sans-serif;
}

.glass,
.card,
.hero-copy,
.hero-side,
.status-bar,
.shop-section,
.tab-row,
.sidebar-nav,
.side-brand,
.side-server-card,
.vehicle-card,
.product-card,
.mini-panel,
.feature-row article,
.home-info-card,
.catalog-filter-panel,
.vehicle-filter-panel{
  border-radius:var(--radius) !important;
  border:2px solid rgba(184,74,255,.55) !important;
  background:
    linear-gradient(180deg,rgba(31,13,53,.94),rgba(10,5,20,.95)) !important;
  box-shadow:
    6px 6px 0 rgba(0,0,0,.48),
    0 0 0 1px rgba(98,217,255,.08),
    0 0 22px rgba(176,69,255,.13) !important;
  backdrop-filter:blur(10px) !important;
}

.glass::before,
.card::before,
.product-card::before,
.vehicle-card::before{
  border-radius:inherit !important;
}

.site-bg{
  filter:saturate(1.18) contrast(1.04) brightness(.72) !important;
}

.site-overlay{
  background:
    radial-gradient(circle at 16% 22%,rgba(255,72,218,.18),transparent 22%),
    radial-gradient(circle at 82% 18%,rgba(72,191,255,.15),transparent 20%),
    radial-gradient(circle at 52% 82%,rgba(143,56,255,.19),transparent 28%),
    repeating-linear-gradient(90deg,rgba(255,255,255,.014) 0 1px,transparent 1px 28px) !important;
}

.sidebar-nav{
  background:linear-gradient(180deg,rgba(14,7,27,.98),rgba(7,3,14,.98)) !important;
  border-right:2px solid rgba(211,91,255,.52) !important;
}

.side-brand{
  position:relative;
  overflow:hidden;
  background:linear-gradient(145deg,#170a28,#090410) !important;
}

.side-brand::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;
  height:4px;
  background:linear-gradient(90deg,var(--arcade-pink),var(--arcade-purple),var(--arcade-cyan));
}

.nav-links a{
  border-radius:6px !important;
  border:2px solid transparent !important;
  background:rgba(255,255,255,.025) !important;
  transition:transform .12s ease,background .12s ease,border-color .12s ease !important;
}

.nav-links a:hover{
  transform:translateX(4px);
  border-color:rgba(93,218,255,.42) !important;
  background:rgba(101,51,158,.20) !important;
}

.nav-links a.active,
.nav-links a[aria-current="page"]{
  border-color:var(--arcade-pink) !important;
  background:linear-gradient(90deg,rgba(177,68,255,.35),rgba(79,31,133,.25)) !important;
  box-shadow:4px 4px 0 rgba(0,0,0,.34),inset 0 0 18px rgba(195,74,255,.18) !important;
}

.icon-badge{
  border-radius:4px !important;
  border:2px solid rgba(211,103,255,.58) !important;
  background:linear-gradient(145deg,#39165d,#1b0c31) !important;
  box-shadow:3px 3px 0 rgba(0,0,0,.36),inset 0 0 8px rgba(218,120,255,.12) !important;
}

.eyebrow,.badge,.tag,.pill{
  border-radius:4px !important;
  border:2px solid rgba(211,99,255,.58) !important;
  background:#1b0a2e !important;
  box-shadow:3px 3px 0 rgba(0,0,0,.35) !important;
}

.hero-copy h1,.hero h1{
  line-height:1.18 !important;
  font-size:clamp(2.1rem,4.7vw,4.6rem) !important;
  background:linear-gradient(180deg,#fff 12%,#f4c5ff 50%,#b36dff 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent !important;
  filter:drop-shadow(5px 5px 0 #10051d);
}

.hero-copy h1 span,.hero h1 span{
  color:var(--arcade-cyan) !important;
  -webkit-text-fill-color:var(--arcade-cyan) !important;
}

.section-title h2{
  color:#fff !important;
  font-size:clamp(1.25rem,2.2vw,2rem) !important;
}

button,.btn,.button,.shop-tab,.tab,.discord-wide-card em,
.product-card a,.product-card button,.vehicle-card button,
.cta-button,.primary-button,.secondary-button{
  border-radius:4px !important;
  border:2px solid rgba(234,150,255,.75) !important;
  background:linear-gradient(180deg,#aa50ff,#6e27d9) !important;
  box-shadow:4px 4px 0 #1c092f,0 0 16px rgba(179,75,255,.22) !important;
  text-transform:uppercase;
  font-weight:900 !important;
  transition:transform .1s ease,box-shadow .1s ease,filter .1s ease !important;
}

button:hover,.btn:hover,.button:hover,.shop-tab:hover,.tab:hover,
.discord-wide-card:hover em,.product-card a:hover,.vehicle-card button:hover{
  transform:translate(-2px,-2px) !important;
  box-shadow:6px 6px 0 #170725,0 0 22px rgba(88,218,255,.25) !important;
  filter:saturate(1.15) brightness(1.08);
}

button:active,.btn:active,.button:active,.shop-tab:active,.tab:active{
  transform:translate(2px,2px) !important;
  box-shadow:1px 1px 0 #170725 !important;
}

.shop-tab.active,.tab.active{
  background:linear-gradient(180deg,#f15cdf,#8b35f6) !important;
  border-color:#fff !important;
  color:#fff !important;
}

input,select,textarea,
.vehicle-search-control,.vehicle-status-control,.catalog-search-box{
  border-radius:4px !important;
  border:2px solid rgba(167,76,255,.48) !important;
  background:#0c0614 !important;
  box-shadow:inset 3px 3px 0 rgba(0,0,0,.34) !important;
}

input:focus,select:focus,textarea:focus,
.vehicle-search-control:focus-within,.vehicle-status-control:focus-within,
.catalog-search-box:focus-within{
  outline:none !important;
  border-color:var(--arcade-cyan) !important;
  box-shadow:inset 3px 3px 0 rgba(0,0,0,.34),0 0 0 3px rgba(92,225,255,.10) !important;
}

.vehicle-card,.product-card{
  overflow:hidden;
  position:relative;
}

.vehicle-card::after,.product-card::after{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:4px;
  background:linear-gradient(90deg,var(--arcade-cyan),var(--arcade-purple),var(--arcade-pink));
  opacity:.82;
}

.vehicle-card img,.product-card img,.offers-banner-card img{
  border-radius:4px !important;
  border:2px solid rgba(151,87,225,.45);
  image-rendering:auto;
}

.vehicle-status.available,.status-available,.available-badge{
  color:#07150c !important;
  background:var(--success) !important;
  border-color:#d7ffe3 !important;
  text-shadow:none !important;
  box-shadow:3px 3px 0 #0f3720 !important;
}

.vehicle-status.unavailable,.status-unavailable,.unavailable-badge{
  color:#fff !important;
  background:var(--danger) !important;
  border-color:#ffbdca !important;
  box-shadow:3px 3px 0 #4a1020 !important;
}

.discord-wide-card{
  border-radius:7px !important;
  border:2px solid rgba(194,84,255,.62) !important;
  background:
    linear-gradient(90deg,rgba(80,30,125,.86),rgba(19,8,35,.94)) !important;
  box-shadow:6px 6px 0 rgba(0,0,0,.38),0 0 24px rgba(155,61,255,.12) !important;
}

.discord-wide-card:hover{
  border-color:var(--arcade-cyan) !important;
}

.status-dot{
  border-radius:2px !important;
  animation:arcade-blink 1.05s steps(2,end) infinite;
}

@keyframes arcade-blink{
  0%,48%{opacity:1}
  49%,100%{opacity:.42}
}

.reveal{
  transition:opacity .35s steps(7,end),transform .35s cubic-bezier(.2,.8,.2,1) !important;
}

@media(max-width:900px){
  h1,h2,h3,.hero h1,.hero-copy h1,.section-title h2,.card h2,.card h3{
    letter-spacing:-.035em !important;
  }
  .hero-copy h1,.hero h1{
    font-size:clamp(1.65rem,8vw,3rem) !important;
  }
}

@media(max-width:600px){
  :root{--radius:6px}
  h1,h2,h3,.hero h1,.hero-copy h1,.section-title h2,.card h2,.card h3{
    font-family:"Oxanium","Segoe UI",system-ui,sans-serif !important;
    font-weight:900 !important;
  }
  body::before{opacity:.045}
}


/* V106 · Tipografía arcade compatible con español */
:root{
  --arcade-font:"Pixellari","Oxanium","Segoe UI",sans-serif;
  --ui-font:"Oxanium","Segoe UI",system-ui,sans-serif;
}

body,
p,small,input,select,textarea,label,em{
  font-family:var(--ui-font) !important;
}

h1,h2,h3,h4,
.hero h1,.hero-copy h1,
.section-title h2,
.card h2,.card h3,
.sidebar-nav b,
.shop-tab,.tab,
.eyebrow,.badge,
.status-bar strong,
.discord-wide-card strong,
.product-card h3,
.vehicle-card h3,
button,.btn,.button{
  font-family:var(--arcade-font) !important;
  font-optical-sizing:auto;
  font-style:normal;
  letter-spacing:.015em !important;
  word-spacing:.035em;
}

.hero-copy h1,.hero h1{
  font-size:clamp(2rem,4.15vw,4.05rem) !important;
  line-height:1.02 !important;
  letter-spacing:-.012em !important;
  overflow-wrap:anywhere;
}

.section-title h2{
  font-size:clamp(1.4rem,2.15vw,2.15rem) !important;
  line-height:1.08 !important;
}

.card h2,.card h3,
.product-card h3,.vehicle-card h3{
  font-size:clamp(1.08rem,1.55vw,1.48rem) !important;
  line-height:1.12 !important;
  overflow-wrap:anywhere;
}

.sidebar-nav b,
.shop-tab,.tab,
button,.btn,.button{
  font-size:clamp(.78rem,.9vw,.96rem) !important;
  line-height:1.18 !important;
}

.eyebrow,.badge,.tag,.pill{
  font-size:clamp(.7rem,.78vw,.84rem) !important;
  line-height:1.15 !important;
}

.discord-wide-card strong,.status-bar strong{
  font-size:clamp(.9rem,1.1vw,1.12rem) !important;
  line-height:1.14 !important;
}

@media(max-width:900px){
  .hero-copy h1,.hero h1{
    font-size:clamp(1.75rem,7vw,3.15rem) !important;
  }
  .sidebar-nav b,.shop-tab,.tab,button,.btn,.button{
    font-size:.82rem !important;
  }
}

@media(max-width:600px){
  h1,h2,h3,h4,
  .hero h1,.hero-copy h1,.section-title h2,.card h2,.card h3,
  .sidebar-nav b,.shop-tab,.tab,.eyebrow,.badge,
  .status-bar strong,.discord-wide-card strong,.product-card h3,.vehicle-card h3,
  button,.btn,.button{
    font-family:var(--arcade-font) !important;
  }
  .hero-copy h1,.hero h1{
    font-size:clamp(1.55rem,8.5vw,2.55rem) !important;
    line-height:1.04 !important;
  }
  .section-title h2{
    font-size:clamp(1.2rem,6.6vw,1.65rem) !important;
  }
}

/* V109 · Pixellari en el título principal de Inicio */
.page[data-current-page="inicio"] .hero-copy h1,
.page[data-current-page="inicio"] .hero h1{
  font-family:'Pixellari','Pixelify Sans','Oxanium',sans-serif !important;
  font-weight:400 !important;
  letter-spacing:.015em !important;
  text-transform:none !important;
  line-height:.94 !important;
}

.page[data-current-page="inicio"] .hero-copy h1 span,
.page[data-current-page="inicio"] .hero h1 span{
  font-family:inherit !important;
  font-weight:400 !important;
}


/* V110 · Pixellari global para estilo arcade y corrección del título de inicio */
:root{
  --arcade-font:'Pixellari','Oxanium','Segoe UI',sans-serif;
}

h1,h2,h3,h4,
.hero h1,.hero-copy h1,
.section-title h2,
.card h2,.card h3,
.sidebar-nav b,
.shop-tab,.tab,
.eyebrow,.badge,.tag,.pill,
.status-bar strong,
.discord-wide-card strong,
.product-card h3,
.vehicle-card h3,
button,.btn,.button,
.side-server-card small,
.side-server-card strong{
  font-family:var(--arcade-font) !important;
  font-weight:400 !important;
}

.page[data-current-page="inicio"] .hero-copy h1,
.page[data-current-page="inicio"] .hero h1,
.page[data-current-page="inicio"] .hero-copy h1 span,
.page[data-current-page="inicio"] .hero h1 span{
  color:#ffffff !important;
  -webkit-text-fill-color:#ffffff !important;
  text-shadow:none !important;
  filter:none !important;
  font-family:var(--arcade-font) !important;
  font-weight:400 !important;
  opacity:1 !important;
}

.page[data-current-page="inicio"] .hero-copy h1 span,
.page[data-current-page="inicio"] .hero h1 span{
  color:#66dfff !important;
  -webkit-text-fill-color:#66dfff !important;
}


/* V111 · Pixellari ampliado + botón volver al selector */
/* Fuerza Pixellari también en palabras internas de títulos y etiquetas arcade. */
.page h1,
.page h1 span,
.page h2,
.page h2 span,
.page h3,
.page h3 span,
.page h4,
.page h4 span,
.page-hero h1,
.page-hero h1 span,
.hero-copy h1,
.hero-copy h1 span,
.section-title h2,
.section-title h2 span,
.mini-feature-grid strong,
.realestate-mini-grid strong,
.offer-chip,
.cp-offer-card h3,
.shop-section .section-title h2,
.dealership-main-panel .section-title h2,
.zone-details-section .section-title h2,
.status-bar small,
.discord-wide-card small,
.discord-wide-card em{
  font-family:var(--arcade-font) !important;
  font-weight:400 !important;
  font-style:normal !important;
}

/* Mantiene la palabra destacada con color, pero usando la misma fuente arcade. */
.page-hero h1 span,
.hero-copy h1 span,
.page-shop .page-hero h1 span,
.page-realestate .page-hero h1 span{
  font-family:var(--arcade-font) !important;
  font-weight:400 !important;
  letter-spacing:inherit !important;
}



/* V114 · Optimización responsive, animaciones fluidas e inspiración UIverse */
:root{--motion-fast:180ms;--motion-med:340ms;--motion-slow:640ms}html{scroll-behavior:smooth}body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}img{max-width:100%;height:auto}.reveal,.glass,.card,.product-card,.vehicle-card,.home-info-card,.social-card,.shop-section,.norm-card,.realestate-panel{will-change:transform,opacity;backface-visibility:hidden}.reveal{opacity:0;transform:translateY(18px) scale(.985);transition:opacity var(--motion-slow) cubic-bezier(.2,.8,.2,1),transform var(--motion-slow) cubic-bezier(.2,.8,.2,1)}.reveal.visible,.reveal.is-visible{opacity:1;transform:none}.card,.product-card,.vehicle-card,.home-info-card,.social-card,.discord-wide-card,.nav-links a,.side-brand,button,.btn,.tab,.shop-tab{transition:transform var(--motion-med) cubic-bezier(.2,.8,.2,1),box-shadow var(--motion-med) cubic-bezier(.2,.8,.2,1),border-color var(--motion-med) ease,filter var(--motion-med) ease,opacity var(--motion-med) ease}.card:hover,.product-card:hover,.vehicle-card:hover,.home-info-card:hover,.social-card:hover,.discord-wide-card:hover{transform:translateY(-4px)}.nav-links a:hover,.side-brand:hover,button:hover,.btn:hover,.tab:hover,.shop-tab:hover{transform:translateY(-2px)}.hero-side-logo,.side-brand img{animation:checkpointFloatSoft 4.8s ease-in-out infinite}@keyframes checkpointFloatSoft{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}.card,.product-card,.vehicle-card,.home-info-card,.social-card{position:relative;overflow:hidden}.card::after,.product-card::after,.vehicle-card::after,.home-info-card::after,.social-card::after{content:"";position:absolute;inset:-40% auto auto -70%;width:45%;height:180%;opacity:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.14),transparent);transform:rotate(18deg);transition:opacity .2s ease,left .75s cubic-bezier(.2,.8,.2,1);pointer-events:none}.card:hover::after,.product-card:hover::after,.vehicle-card:hover::after,.home-info-card:hover::after,.social-card:hover::after{left:125%;opacity:1}.vehicle-card-grid,#vehicleCards{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))!important;gap:18px!important;width:100%!important;max-width:100%!important;overflow:visible!important;align-items:stretch!important}.vehicle-card,.exclusive-vehicle-card{min-width:0!important;width:100%!important;max-width:100%!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}.vehicle-card img,.exclusive-vehicle-card img{width:100%!important;aspect-ratio:16/9!important;object-fit:cover!important;display:block!important;min-height:150px}.vehicle-card-body{min-width:0!important;width:100%!important}.vehicle-card-body h3,.vehicle-card-body dd,.vehicle-card-body dt{overflow-wrap:anywhere;word-break:normal}.vehicle-card-body dl{width:100%}@media(max-width:920px){.page{width:100%;max-width:100%;overflow-x:hidden}.vehicle-catalog-controls,.vehicle-filter-panel{grid-template-columns:1fr!important;width:100%!important}.vehicle-card-grid,#vehicleCards{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;gap:14px!important}.vehicle-card,.exclusive-vehicle-card{min-height:auto!important}}@media(max-width:620px){.vehicle-card-grid,#vehicleCards{display:grid!important;grid-template-columns:1fr!important;width:100%!important;max-width:100%!important;overflow:visible!important}.vehicle-card,.exclusive-vehicle-card{width:100%!important;max-width:100%!important;margin:0!important}.vehicle-card img,.exclusive-vehicle-card img{min-height:150px;max-height:240px;object-fit:cover}.vehicle-card-body dl{display:grid;gap:8px}.vehicle-catalog-controls input,.vehicle-catalog-controls select,.vehicle-filter-panel input,.vehicle-filter-panel select{width:100%!important;min-width:0!important}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}


/* V115 · Animaciones arcade inspiradas en componentes UIverse + concesionario móvil real */
:root{
  --uiverse-neon-a:#ff5de8;
  --uiverse-neon-b:#55d9ff;
  --uiverse-neon-c:#ffe66b;
  --uiverse-panel:#11081f;
  --uiverse-border:rgba(201,143,255,.30);
  --uiverse-ease:cubic-bezier(.16,1,.3,1);
}

/* Reaplicar fuente arcade a palabras destacadas sin forzar negro */
.section-title h2,
.section-title h2 span,
.page-hero h1,
.page-hero h1 span,
.eyebrow,
.nav-links a b,
.product-card h3,
.vehicle-card h3,
.discord-wide-card strong,
.status-bar strong,
.mini-panel h3,
.hero-copy h3,
.side-server-card strong,
.vehicle-status,
.vehicle-status-control > span,
.shop-tab,
.tab,
.btn,
button{
  font-family:var(--arcade-font, 'Pixellari', 'Pixelify Sans', 'Oxanium', sans-serif) !important;
  color:#fff !important;
  font-weight:500 !important;
  text-shadow:2px 2px 0 rgba(65,20,96,.85),0 0 12px rgba(174,78,255,.22) !important;
}

/* Hover tipo Uiverse: brillo diagonal + borde animado */
.glass,
.product-card,
.vehicle-card,
.social-card,
.discord-wide-card,
.home-info-card,
.rule-panel,
.shop-section{
  position:relative;
  isolation:isolate;
  overflow:hidden;
}
.glass::before,
.product-card::before,
.vehicle-card::before,
.social-card::before,
.discord-wide-card::before,
.home-info-card::before,
.rule-panel::before,
.shop-section::before{
  content:"";
  position:absolute;
  inset:-2px;
  z-index:-1;
  opacity:0;
  background:conic-gradient(from var(--spin-angle,0deg),transparent 0 22%,var(--uiverse-neon-a),var(--uiverse-neon-b),var(--uiverse-neon-c),transparent 78% 100%);
  filter:blur(10px);
  transition:opacity .32s var(--uiverse-ease);
  animation:uiverseBorderSpin 4.2s linear infinite;
}
.glass:hover::before,
.product-card:hover::before,
.vehicle-card:hover::before,
.social-card:hover::before,
.discord-wide-card:hover::before,
.home-info-card:hover::before,
.rule-panel:hover::before,
.shop-section:hover::before{opacity:.42}

.product-card::after,
.vehicle-card::after,
.social-card::after,
.discord-wide-card::after,
.home-info-card::after{
  content:"";
  position:absolute;
  inset:-60% auto auto -90%;
  width:48%;
  height:220%;
  pointer-events:none;
  opacity:0;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
  transform:rotate(18deg);
  transition:opacity .2s ease,left .85s var(--uiverse-ease);
}
.product-card:hover::after,
.vehicle-card:hover::after,
.social-card:hover::after,
.discord-wide-card:hover::after,
.home-info-card:hover::after{left:128%;opacity:1}

.nav-links a,
.btn,
button,
.shop-tab,
.tab,
.product-card a,
.discord-wide-card em{
  position:relative;
  overflow:hidden;
  transform-style:preserve-3d;
}
.nav-links a::after,
.btn::after,
button::after,
.shop-tab::after,
.tab::after,
.product-card a::after,
.discord-wide-card em::after{
  content:"";
  position:absolute;
  inset:auto 0 0;
  height:3px;
  background:linear-gradient(90deg,var(--uiverse-neon-a),var(--uiverse-neon-b),var(--uiverse-neon-c));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .32s var(--uiverse-ease);
}
.nav-links a:hover::after,
.btn:hover::after,
button:hover::after,
.shop-tab:hover::after,
.tab:hover::after,
.product-card a:hover::after,
.discord-wide-card:hover em::after{transform:scaleX(1)}

.reveal,
.glass,
.product-card,
.vehicle-card,
.social-card,
.home-info-card,
.rule-panel{
  opacity:0;
  transform:translateY(22px) scale(.985);
  transition:opacity .72s var(--uiverse-ease),transform .72s var(--uiverse-ease),box-shadow .32s var(--uiverse-ease),border-color .32s ease,filter .32s ease;
  will-change:opacity,transform;
}
.reveal.visible,
.reveal.is-visible,
.glass.visible,
.glass.is-visible,
.product-card.visible,
.product-card.is-visible,
.vehicle-card.visible,
.vehicle-card.is-visible,
.social-card.visible,
.social-card.is-visible,
.home-info-card.visible,
.home-info-card.is-visible,
.rule-panel.visible,
.rule-panel.is-visible{
  opacity:1;
  transform:none;
}
.product-card:hover,
.vehicle-card:hover,
.social-card:hover,
.home-info-card:hover,
.discord-wide-card:hover{
  transform:translateY(-6px) scale(1.01) !important;
  border-color:rgba(85,217,255,.48) !important;
  filter:saturate(1.08);
}

.hero-side-logo,
.side-brand img{
  animation:arcadeFloat 4.6s ease-in-out infinite;
}
.status-dot,
.purple-dot{
  animation:arcadePulse 1.6s steps(2,end) infinite;
}

/* Reparación fuerte del concesionario en móvil */
.page[data-current-page="concesionario"]{
  width:min(1360px, calc(100% - 34px)) !important;
  max-width:100% !important;
  overflow:visible !important;
}
.dealership-main-layout,
.dealership-main-panel{
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
}
.vehicle-card-grid,
#vehicleCards{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) !important;
  gap:20px !important;
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
  align-items:stretch !important;
}
.vehicle-card,
.exclusive-vehicle-card{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  min-height:0 !important;
  overflow:hidden !important;
}
.vehicle-image-shell{
  width:100% !important;
  background:linear-gradient(135deg,rgba(255,93,232,.12),rgba(85,217,255,.08)) !important;
  border-bottom:1px solid rgba(201,143,255,.18) !important;
}
.vehicle-image-shell img,
.vehicle-card > img,
.exclusive-vehicle-card > img{
  width:100% !important;
  aspect-ratio:16/9 !important;
  min-height:150px !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
}
.vehicle-card-body{
  width:100% !important;
  min-width:0 !important;
  display:grid !important;
  gap:12px !important;
}
.vehicle-card-body dl,
.vehicle-card-body dl > div{
  width:100% !important;
  min-width:0 !important;
}
.vehicle-card-body dd,
.vehicle-card-body dt,
.vehicle-card-body h3{
  overflow-wrap:anywhere !important;
  word-break:normal !important;
}

@media(max-width:860px){
  body{overflow-x:hidden !important;}
  .page[data-current-page="concesionario"]{
    width:100% !important;
    margin:86px auto 0 !important;
    padding:0 12px 26px !important;
  }
  .page[data-current-page="concesionario"] .page-hero,
  .page[data-current-page="concesionario"] .dealership-main-layout{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }
  .dealership-main-panel{
    padding:16px !important;
  }
  .vehicle-catalog-controls,
  .vehicle-filter-panel{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    width:100% !important;
  }
  .vehicle-search-control,
  .vehicle-status-control{
    width:100% !important;
    min-width:0 !important;
  }
  .vehicle-search-control input,
  .vehicle-status-control select{
    width:100% !important;
    min-width:0 !important;
  }
  .vehicle-card-grid,
  #vehicleCards{
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important;
    gap:14px !important;
  }
}
@media(max-width:560px){
  .page[data-current-page="concesionario"]{
    padding:0 10px 24px !important;
  }
  .vehicle-card-grid,
  #vehicleCards{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .vehicle-card-body dl > div{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
  }
  .vehicle-card-body dd{
    text-align:left !important;
  }
  .section-title{
    display:grid !important;
    gap:8px !important;
  }
}

@keyframes uiverseBorderSpin{to{--spin-angle:360deg}}
@keyframes arcadeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes arcadePulse{0%,100%{opacity:1;filter:drop-shadow(0 0 7px rgba(178,107,255,.6))}50%{opacity:.48;filter:none}}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}



/* V116 · Pixellari preparado + hover morado/rosa + concesionario definitivo */
@font-face{
  font-family:'Pixellari';
  src:url('../../selector-assets/fonts/Pixellari.ttf') format('truetype');
  font-display:swap;
}

:root{
  --arcade-font:'Pixellari','Pixelify Sans','Oxanium',system-ui,sans-serif;
  --uiverse-neon-a:#ff5de8;
  --uiverse-neon-b:#b45cff;
  --uiverse-neon-c:#7f42ff;
  --uiverse-neon-d:#ff8df1;
  --uiverse-panel:#12061f;
  --uiverse-border:rgba(224,114,255,.34);
  --uiverse-ease:cubic-bezier(.16,1,.3,1);
}

/* Recupera la estética pixel en textos arcade */
.page-hero h1,
.page-hero h1 span,
.section-title h2,
.section-title h2 span,
.section-title p strong,
.eyebrow,
.nav-links a,
.nav-links a b,
.side-status-card,
.side-status-card strong,
.side-status-card span,
.side-status-card small,
.mini-panel h3,
.hero-copy h3,
.home-info-card strong,
.home-info-card span,
.discord-wide-card,
.discord-wide-card strong,
.discord-wide-card em,
.product-card h3,
.product-card strong,
.product-card .price,
.shop-tab,
.tab,
.btn,
button,
.vehicle-card h3,
.vehicle-status,
.vehicle-card-body dt,
.vehicle-card-body dd,
.vehicle-status-control > span,
.vehicle-search-control > span,
input,
select,
label,
.badge,
.tag{
  font-family:var(--arcade-font) !important;
}

.page-hero h1,
.page-hero h1 span{
  font-weight:400 !important;
  color:#fff !important;
  -webkit-text-fill-color:initial !important;
  background:none !important;
  text-shadow:
    0 0 10px rgba(255,93,232,.20),
    3px 3px 0 rgba(64,19,97,.85) !important;
}

.page-hero h1 .accent,
.page-hero h1 span,
.accent{
  color:#67ddff !important;
  -webkit-text-fill-color:#67ddff !important;
}

/* Quita verdes/amarillos del hover anterior y lo centra en morado/rosa */
.glass::before,
.product-card::before,
.vehicle-card::before,
.social-card::before,
.discord-wide-card::before,
.home-info-card::before,
.rule-panel::before,
.shop-section::before{
  background:
    conic-gradient(
      from var(--spin-angle,0deg),
      transparent 0 18%,
      rgba(255,93,232,.0) 18%,
      var(--uiverse-neon-a) 34%,
      var(--uiverse-neon-b) 52%,
      var(--uiverse-neon-d) 68%,
      transparent 84% 100%
    ) !important;
  filter:blur(11px) saturate(1.12) !important;
}

.nav-links a::after,
.btn::after,
button::after,
.shop-tab::after,
.tab::after,
.product-card a::after,
.discord-wide-card em::after{
  background:linear-gradient(90deg,#ff5de8,#b45cff,#7f42ff,#ff8df1) !important;
}

.product-card:hover,
.vehicle-card:hover,
.social-card:hover,
.home-info-card:hover,
.discord-wide-card:hover,
.glass:hover{
  border-color:rgba(255,93,232,.56) !important;
  box-shadow:
    0 0 0 1px rgba(255,141,241,.22),
    0 0 24px rgba(180,92,255,.20),
    8px 8px 0 rgba(5,2,10,.55) !important;
}

.nav-links a:hover,
.nav-links a.active{
  background:
    linear-gradient(135deg,rgba(255,93,232,.20),rgba(127,66,255,.22)) !important;
  border-color:rgba(255,93,232,.62) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.08),
    0 0 18px rgba(255,93,232,.18) !important;
}

/* Efecto UIverse adaptado al arcade: brillo diagonal rosa/morado */
.product-card::after,
.vehicle-card::after,
.social-card::after,
.discord-wide-card::after,
.home-info-card::after{
  background:linear-gradient(90deg,transparent,rgba(255,141,241,.24),rgba(180,92,255,.16),transparent) !important;
}

/* Concesionario: rutas robustas + móvil */
.page[data-current-page="concesionario"]{
  width:min(1380px, calc(100% - 28px)) !important;
  max-width:100% !important;
  overflow:visible !important;
}

.dealership-main-layout,
.dealership-main-panel,
.vehicle-catalog,
.vehicle-results{
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
}

.vehicle-card-grid,
#vehicleCards{
  display:grid !important;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr)) !important;
  gap:20px !important;
  width:100% !important;
  max-width:100% !important;
  overflow:visible !important;
  align-items:stretch !important;
}

.vehicle-card,
.exclusive-vehicle-card{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  width:100% !important;
  max-width:100% !important;
  height:auto !important;
  overflow:hidden !important;
}

.vehicle-image-shell{
  width:100% !important;
  position:relative !important;
  overflow:hidden !important;
  background:
    radial-gradient(circle at 50% 35%,rgba(255,93,232,.20),transparent 48%),
    linear-gradient(135deg,rgba(255,93,232,.13),rgba(127,66,255,.10)) !important;
  border-bottom:1px solid rgba(224,114,255,.20) !important;
}

.vehicle-image-shell img,
.vehicle-card > img,
.exclusive-vehicle-card > img{
  width:100% !important;
  aspect-ratio:16/9 !important;
  min-height:150px !important;
  object-fit:cover !important;
  object-position:center !important;
  display:block !important;
}

.vehicle-img-missing{
  display:none !important;
}

.vehicle-image-shell:has(.vehicle-img-missing)::after{
  content:'IMAGEN NO DISPONIBLE';
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  color:#f5d9ff;
  font-family:var(--arcade-font) !important;
  font-size:.82rem;
  letter-spacing:.06em;
  text-shadow:0 0 10px rgba(255,93,232,.3);
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.025) 0 2px,transparent 2px 8px),
    linear-gradient(135deg,rgba(255,93,232,.12),rgba(127,66,255,.14));
}

@media(max-width:860px){
  body{overflow-x:hidden !important;}

  .page[data-current-page="concesionario"]{
    width:100% !important;
    max-width:100% !important;
    margin:86px auto 0 !important;
    padding:0 12px 28px !important;
  }

  .page[data-current-page="concesionario"] .page-hero,
  .page[data-current-page="concesionario"] .dealership-main-layout,
  .page[data-current-page="concesionario"] .dealership-main-panel{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .dealership-main-panel{
    padding:14px !important;
  }

  .vehicle-catalog-controls,
  .vehicle-filter-panel{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:12px !important;
    width:100% !important;
  }

  .vehicle-search-control,
  .vehicle-status-control,
  .vehicle-search-control input,
  .vehicle-status-control select{
    width:100% !important;
    min-width:0 !important;
  }

  .vehicle-card-grid,
  #vehicleCards{
    grid-template-columns:repeat(auto-fit,minmax(210px,1fr)) !important;
    gap:14px !important;
  }
}

@media(max-width:560px){
  .page[data-current-page="concesionario"]{
    padding:0 10px 24px !important;
  }

  .vehicle-card-grid,
  #vehicleCards{
    grid-template-columns:1fr !important;
  }

  .vehicle-card-body dl > div{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:5px !important;
  }

  .vehicle-card-body dd{
    text-align:left !important;
  }
}



/* V118 · Rebaja del glow morado interno en paneles/cards */
.glass,
.home-info-card,
.hero-copy,
.mini-panel,
.discord-wide-card,
.product-card,
.vehicle-card,
.social-card,
.rule-panel,
.shop-section,
.dealership-main-panel,
.realestate-panel{
  background:
    radial-gradient(circle at 50% 24%, rgba(255,93,232,.055), transparent 22%),
    linear-gradient(180deg, rgba(35,13,57,.90), rgba(10,4,18,.96)) !important;
}

.home-info-card,
.product-card,
.vehicle-card,
.social-card{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,93,232,.075), transparent 24%),
    linear-gradient(180deg, rgba(31,11,50,.90), rgba(12,5,22,.96)) !important;
}

/* Si alguna card tenía un overlay morado demasiado grande, se limita al borde superior */
.home-info-card::before,
.product-card::before,
.vehicle-card::before,
.social-card::before,
.discord-wide-card::before,
.glass::before{
  opacity:.18 !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,93,232,.24), transparent 18%),
    conic-gradient(
      from var(--spin-angle,0deg),
      transparent 0 24%,
      rgba(255,93,232,.65) 36%,
      rgba(180,92,255,.62) 52%,
      rgba(127,66,255,.58) 66%,
      transparent 82% 100%
    ) !important;
  filter:blur(9px) saturate(1.05) !important;
}

.home-info-card:hover::before,
.product-card:hover::before,
.vehicle-card:hover::before,
.social-card:hover::before,
.discord-wide-card:hover::before,
.glass:hover::before{
  opacity:.28 !important;
}

/* Rebaja específica del degradado grande que salía hasta media card en Inicio */
.hero-stats .home-info-card,
.hero-metrics .home-info-card,
.stat-card,
.info-card{
  background:
    radial-gradient(circle at 50% 0%, rgba(255,93,232,.08), transparent 20%),
    linear-gradient(180deg, rgba(43,15,66,.72), rgba(13,5,24,.96) 42%, rgba(10,4,18,.98)) !important;
}

.hero-stats .home-info-card::after,
.hero-metrics .home-info-card::after,
.stat-card::after,
.info-card::after{
  opacity:.35 !important;
}

/* Mantiene el hover bonito, pero menos invasivo */
.product-card:hover,
.vehicle-card:hover,
.social-card:hover,
.home-info-card:hover,
.discord-wide-card:hover,
.glass:hover{
  box-shadow:
    0 0 0 1px rgba(255,141,241,.16),
    0 0 18px rgba(180,92,255,.14),
    7px 7px 0 rgba(5,2,10,.50) !important;
  filter:saturate(1.03) !important;
}



/* V119 · Fix concesionario: las cards renderizadas por JS no quedan invisibles */
.page[data-current-page="concesionario"] #vehicleCards .vehicle-card,
.page[data-current-page="concesionario"] #vehicleCards .exclusive-vehicle-card,
.page[data-current-page="concesionario"] .vehicle-card-grid .vehicle-card,
.page[data-current-page="concesionario"] .vehicle-card-grid .exclusive-vehicle-card{
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
}

.page[data-current-page="concesionario"] #vehicleCards{
  min-height:260px !important;
}

.page[data-current-page="concesionario"] #vehicleCards .vehicle-card:hover,
.page[data-current-page="concesionario"] #vehicleCards .exclusive-vehicle-card:hover{
  transform:translateY(-5px) scale(1.01) !important;
}



/* V121 · Performance mode: arcade ligero sin petar la GPU */
:root{
  --perf-glow:rgba(255,93,232,.14);
  --perf-border:rgba(214,104,255,.42);
  --perf-panel:rgba(16,7,27,.92);
}

html,
body{
  scroll-behavior:auto !important;
}

body{
  background-attachment:scroll !important;
}

body::after{
  opacity:.045 !important;
  mix-blend-mode:normal !important;
}

body::before{
  opacity:.10 !important;
}

.hero-side-logo,
.side-brand img,
.status-dot,
.purple-dot,
.glass::before,
.product-card::before,
.vehicle-card::before,
.social-card::before,
.discord-wide-card::before,
.home-info-card::before,
.rule-panel::before,
.shop-section::before,
.product-card::after,
.vehicle-card::after,
.social-card::after,
.discord-wide-card::after,
.home-info-card::after{
  animation:none !important;
}

.glass,
.home-info-card,
.hero-copy,
.mini-panel,
.discord-wide-card,
.product-card,
.vehicle-card,
.social-card,
.rule-panel,
.shop-section,
.dealership-main-panel,
.realestate-panel,
.nav-links a,
.side-status-card{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  box-shadow:
    0 0 0 1px rgba(214,104,255,.14),
    4px 4px 0 rgba(0,0,0,.30) !important;
  background:
    linear-gradient(180deg, rgba(29,11,48,.86), rgba(10,4,18,.94)) !important;
}

.glass::before,
.product-card::before,
.vehicle-card::before,
.social-card::before,
.discord-wide-card::before,
.home-info-card::before,
.rule-panel::before,
.shop-section::before,
.product-card::after,
.vehicle-card::after,
.social-card::after,
.discord-wide-card::after,
.home-info-card::after{
  display:none !important;
}

.product-card:hover,
.vehicle-card:hover,
.social-card:hover,
.home-info-card:hover,
.discord-wide-card:hover,
.glass:hover,
.nav-links a:hover,
.nav-links a.active,
.btn:hover,
button:hover,
.shop-tab:hover,
.tab:hover{
  transform:translateY(-2px) !important;
  border-color:rgba(255,93,232,.46) !important;
  box-shadow:
    0 0 0 1px rgba(255,93,232,.16),
    0 0 9px rgba(180,92,255,.10),
    4px 4px 0 rgba(0,0,0,.34) !important;
  filter:none !important;
}

.product-card,
.vehicle-card,
.social-card,
.norm-card,
.rule-panel,
.shop-section,
.realestate-panel,
.interior-card,
.discord-wide-card{
  content-visibility:auto;
  contain-intrinsic-size:320px;
}

.reveal,
.glass,
.product-card,
.vehicle-card,
.social-card,
.home-info-card,
.rule-panel{
  transition:
    opacity .18s ease,
    transform .18s ease,
    border-color .16s ease,
    box-shadow .16s ease !important;
  will-change:auto !important;
  opacity:1 !important;
  transform:none !important;
}

.page[data-current-page="concesionario"] #vehicleCards .vehicle-card,
.page[data-current-page="concesionario"] #vehicleCards .exclusive-vehicle-card{
  opacity:1 !important;
  visibility:visible !important;
  transform:none !important;
  content-visibility:auto;
  contain-intrinsic-size:390px;
}

.vehicle-image-shell{
  background:rgba(255,93,232,.045) !important;
}

.vehicle-image-shell img,
.vehicle-card > img,
.exclusive-vehicle-card > img{
  filter:none !important;
}

.page-hero h1,
.page-hero h1 span,
.section-title h2,
.section-title h2 span,
.card h2,
.server-card h2,
.vehicle-card h3,
.product-card h3{
  text-shadow:
    2px 2px 0 rgba(64,19,97,.65),
    0 0 5px rgba(255,93,232,.10) !important;
}

@media(max-width:860px){
  body::before,
  body::after{
    display:none !important;
  }

  .glass,
  .home-info-card,
  .hero-copy,
  .mini-panel,
  .discord-wide-card,
  .product-card,
  .vehicle-card,
  .social-card,
  .rule-panel,
  .shop-section,
  .dealership-main-panel,
  .realestate-panel,
  .nav-links a,
  .side-status-card{
    box-shadow:3px 3px 0 rgba(0,0,0,.30) !important;
  }

  .product-card:hover,
  .vehicle-card:hover,
  .social-card:hover,
  .home-info-card:hover,
  .discord-wide-card:hover,
  .glass:hover{
    transform:none !important;
  }
}






/* V124 - Performance y buscadores limpios */
:root{
  --v124-panel-bg:rgba(16,7,27,.88);
  --v124-panel-border:rgba(214,104,255,.24);
  --v124-panel-border-active:rgba(255,93,232,.42);
}

html,
body{
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

.site-bg,
.site-overlay,
body::before,
body::after{
  transform:none !important;
  filter:none !important;
  mix-blend-mode:normal !important;
}

.site-overlay{
  opacity:.35 !important;
}

.glass,
.home-info-card,
.hero-copy,
.hero-side,
.mini-panel,
.discord-wide-card,
.product-card,
.vehicle-card,
.social-card,
.rule-panel,
.shop-section,
.dealership-main-panel,
.realestate-panel,
.sidebar-nav,
.side-brand,
.side-server-card,
.status-bar{
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;
  filter:none !important;
  box-shadow:
    0 0 0 1px rgba(214,104,255,.10),
    4px 4px 0 rgba(0,0,0,.28) !important;
}

.hero-side-logo,
.side-brand img,
.status-dot,
.purple-dot{
  animation:none !important;
  filter:none !important;
}

.card,
.product-card,
.vehicle-card,
.home-info-card,
.social-card,
.discord-wide-card,
.nav-links a,
.side-brand,
.btn,
button,
.tab,
.shop-tab{
  transition:
    transform .12s ease,
    border-color .12s ease,
    background-color .12s ease,
    box-shadow .12s ease !important;
}

.card::after,
.product-card::after,
.vehicle-card::after,
.home-info-card::after,
.social-card::after,
.discord-wide-card::after{
  display:none !important;
}

.product-card:hover,
.vehicle-card:hover,
.social-card:hover,
.home-info-card:hover,
.discord-wide-card:hover,
.glass:hover{
  transform:translateY(-1px) !important;
  filter:none !important;
}

.vehicle-search-control,
.vehicle-status-control,
.catalog-search-box,
.search-box input,
.filter-panel input,
.filter-panel select,
.custom-select{
  background:var(--v124-panel-bg) !important;
  border:1px solid var(--v124-panel-border) !important;
  box-shadow:none !important;
  outline:0 !important;
}

.vehicle-search-control:focus-within,
.vehicle-status-control:focus-within,
.catalog-search-box:focus-within,
.search-box:focus-within input,
.filter-panel input:focus,
.filter-panel select:focus,
.custom-select:focus{
  border-color:var(--v124-panel-border-active) !important;
  box-shadow:none !important;
  outline:0 !important;
}

.vehicle-search-control input,
.filter-panel input,
.search-box input{
  color:#fff !important;
  text-shadow:none !important;
  outline:0 !important;
  box-shadow:none !important;
}

.vehicle-search-control input::placeholder,
.filter-panel input::placeholder,
.search-box input::placeholder{
  color:rgba(244,235,255,.58) !important;
  opacity:1 !important;
}

.vehicle-search-control > .icon-badge,
.search-box > .icon-badge{
  display:none !important;
}

.vehicle-search-control{
  padding-left:16px !important;
}

.search-box input{
  padding-left:16px !important;
}

.vehicle-image-shell img,
.vehicle-card > img,
.exclusive-vehicle-card > img,
.product-card img,
.social-card img{
  filter:none !important;
  transform:none !important;
}

@media(max-width:860px){
  .site-overlay{
    display:none !important;
  }

  .card:hover,
  .product-card:hover,
  .vehicle-card:hover,
  .home-info-card:hover,
  .social-card:hover,
  .discord-wide-card:hover,
  .glass:hover{
    transform:none !important;
  }
}


/* V125 - Etiquetas del mapa inmobiliario */
.map-zone-btn{
  position:absolute !important;
  left:var(--x) !important;
  top:var(--y) !important;
  transform:translate(-50%, -50%) !important;
  z-index:4 !important;
  min-height:22px !important;
  width:max-content !important;
  max-width:112px !important;
  padding:5px 9px !important;
  border-radius:999px !important;
  border:2px solid rgba(255,255,255,.82) !important;
  color:#fff !important;
  font-size:.56rem !important;
  line-height:1 !important;
  letter-spacing:.02em !important;
  text-align:center !important;
  white-space:normal !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
  text-shadow:
    1px 1px 0 rgba(0,0,0,.78),
    0 0 4px rgba(0,0,0,.42) !important;
  box-shadow:
    0 1px 0 rgba(255,255,255,.22) inset,
    0 4px 10px rgba(0,0,0,.28) !important;
  filter:none !important;
}

.map-zone-btn:hover,
.map-zone-btn.active{
  transform:translate(-50%, -50%) scale(1.035) !important;
  z-index:8 !important;
  border-color:#fff !important;
  box-shadow:
    0 0 0 2px rgba(255,255,255,.16),
    0 6px 14px rgba(0,0,0,.34) !important;
}

.map-zone-btn.zone-blue{background:rgba(42,67,235,.92) !important}
.map-zone-btn.zone-sky{background:rgba(32,166,226,.92) !important}
.map-zone-btn.zone-yellow{background:rgba(236,205,23,.94) !important}
.map-zone-btn.zone-purple{background:rgba(150,62,216,.94) !important}
.map-zone-btn.zone-orange{background:rgba(235,133,30,.94) !important}
.map-zone-btn.zone-redorange{background:rgba(228,60,37,.94) !important}
.map-zone-btn.zone-southblue{background:rgba(70,88,222,.94) !important}
.map-zone-btn.zone-cyan{background:rgba(38,184,191,.94) !important}
.map-zone-btn.zone-green{background:rgba(35,166,65,.94) !important}
.map-zone-btn.zone-lime{background:rgba(154,198,38,.94) !important}
.map-zone-btn.zone-centerorange{background:rgba(220,140,36,.94) !important}
.map-zone-btn.zone-yellowgreen{background:rgba(126,172,38,.94) !important}
.map-zone-btn.zone-maroon{background:rgba(154,36,48,.94) !important}
.map-zone-btn.zone-portyellow{background:rgba(218,177,28,.95) !important}

.map-zone-btn.zone-yellow,
.map-zone-btn.zone-lime,
.map-zone-btn.zone-yellowgreen,
.map-zone-btn.zone-portyellow{
  color:#fff !important;
}

.map-zone-btn[data-zone="paleto-bay"]{--x:42% !important;--y:12% !important}
.map-zone-btn[data-zone="sandy-shores"]{--x:65% !important;--y:42% !important}
.map-zone-btn[data-zone="grapeseed"]{--x:84% !important;--y:23% !important}
.map-zone-btn[data-zone="zona-rica"]{--x:39% !important;--y:58% !important}
.map-zone-btn[data-zone="great-ocean"]{--x:15% !important;--y:62% !important}
.map-zone-btn[data-zone="vespucci-beach"]{--x:25% !important;--y:77% !important}
.map-zone-btn[data-zone="vespucci"]{--x:34% !important;--y:76% !important}
.map-zone-btn[data-zone="rockford-hills"]{--x:44% !important;--y:64% !important}
.map-zone-btn[data-zone="little-seoul"]{--x:44% !important;--y:70% !important}
.map-zone-btn[data-zone="mirror-park"]{--x:60% !important;--y:67% !important}
.map-zone-btn[data-zone="pillbox"]{--x:49% !important;--y:76% !important}
.map-zone-btn[data-zone="industrias"]{--x:69% !important;--y:74% !important}
.map-zone-btn[data-zone="barrios-bajos"]{--x:44% !important;--y:84% !important}
.map-zone-btn[data-zone="puerto"]{--x:50% !important;--y:92% !important}

@media(max-width:1180px){
  .map-zone-btn{
    max-width:98px !important;
    min-height:20px !important;
    padding:4px 7px !important;
    font-size:.49rem !important;
  }
}

@media(max-width:780px){
  .map-zone-btn{
    max-width:78px !important;
    min-height:18px !important;
    padding:3px 6px !important;
    border-width:1px !important;
    font-size:.40rem !important;
  }

  .map-zone-btn[data-zone="little-seoul"]{--x:43% !important;--y:70% !important}
  .map-zone-btn[data-zone="pillbox"]{--x:50% !important;--y:76% !important}
  .map-zone-btn[data-zone="mirror-park"]{--x:60% !important;--y:67% !important}
  .map-zone-btn[data-zone="industrias"]{--x:70% !important;--y:74% !important}
}


/* V128 - Pixellari con fallback compatible con español */
:root{
  --arcade-font:'Pixellari',"Inter","Oxanium","Segoe UI",Arial,sans-serif;
}

body,
button,
input,
select,
textarea,
.page-hero h1,
.page-hero h1 span,
.section-title h2,
.section-title h2 span,
.eyebrow,
.nav-links a,
.nav-links a b,
.btn,
.tab,
.shop-tab,
.product-card h3,
.vehicle-card h3,
.vehicle-status,
.vehicle-card-body dt,
.vehicle-card-body dd,
.vehicle-status-control > span,
.vehicle-search-control > span,
.map-zone-btn,
.side-status-card,
.home-info-card,
.discord-wide-card,
.rule-panel,
.badge,
.tag{
  font-family:'Pixellari',"Inter","Oxanium","Segoe UI",Arial,sans-serif !important;
}

/* V129 - Sin rejilla/scanlines delante de la web */
body::before,
body::after{
  content:none !important;
  display:none !important;
  background:none !important;
  mix-blend-mode:normal !important;
  opacity:0 !important;
}

.site-overlay{
  background:
    radial-gradient(circle at 16% 22%,rgba(255,72,218,.12),transparent 22%),
    radial-gradient(circle at 82% 18%,rgba(72,191,255,.10),transparent 20%),
    radial-gradient(circle at 52% 82%,rgba(143,56,255,.12),transparent 28%) !important;
  opacity:.22 !important;
}