/* ═══════════════════════════════════════════════════════
   MVP SPORT STUDIO — custom.css v5
   Tema hijo de Divi
   ═══════════════════════════════════════════════════════ */

/* ── VARIABLES ── */
:root {
  --orange: #FF6B35;
  --orange-dark: #E65100;
  --orange-light: #FF8C42;
  --silver: #C0C0C0;
  --silver-light: #D3D3D3;
  --black: #000;
  --dark: #080808;
  --dark2: #0f0f0f;
  --dark3: #181818;
  --dark4: #242424;
  --gray: #8A8A8A;
  --gray-light: #bbb;
  --white: #fff;
  --gold: #D4AF37;
}

/* ── RESET GLOBAL ── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body.mvpss-page {
  background: var(--dark) !important;
  color: var(--white) !important;
  font-family: 'Inter', sans-serif !important;
  overflow-x: hidden;
}

/* Scrollbar */
::-webkit-scrollbar { width: 3px; }
::-webkit-scrollbar-thumb { background: var(--orange); }

/* ── DIVI OVERRIDES ── */
body.mvpss-page #page-container { background: var(--dark) !important; }
body.mvpss-page .et_pb_section { padding: 0 !important; background-color: transparent !important; }
body.mvpss-page #main-header,
body.mvpss-page #top-header { display: none !important; }
body.mvpss-page #et-main-area { margin: 0; padding: 0; }
body.mvpss-page .et_pb_fullwidth_header { padding: 0 !important; }

/* ── PAGE LOADER ── */
.page-loader {
  position: fixed; inset: 0;
  background: var(--black);
  z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  flex-direction: column; gap: 1.5rem;
  transition: opacity .6s ease, visibility .6s ease;
}
.page-loader.done { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-logo {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2.8rem; font-weight: 900;
  letter-spacing: 6px; color: var(--silver);
}
.loader-bar { width: 220px; height: 2px; background: rgba(255,255,255,.08); overflow: hidden; }
.loader-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--orange), var(--orange-light));
  animation: lFill 1.6s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes lFill { from { width: 0; } to { width: 100%; } }
.loader-sub { font-size: .6rem; letter-spacing: 5px; color: var(--gray); text-transform: uppercase; }

/* ── CURSOR ── */
.cursor {
  position: fixed; width: 10px; height: 10px;
  background: var(--orange); border-radius: 50%;
  pointer-events: none; z-index: 9999;
  transform: translate(-50%, -50%);
  mix-blend-mode: difference;
}
.cursor-ring {
  position: fixed; width: 36px; height: 36px;
  border: 1px solid rgba(255,107,53,.5); border-radius: 50%;
  pointer-events: none; z-index: 9998;
  transform: translate(-50%, -50%);
  transition: all .15s ease;
}
.cursor-ring.big { width: 56px; height: 56px; border-color: var(--orange); background: rgba(255,107,53,.04); }

/* ── SCROLL PROGRESS ── */
.scroll-prog {
  position: fixed; top: 0; left: 0; height: 2px;
  background: var(--orange); z-index: 2000; width: 0;
  box-shadow: 0 0 8px rgba(255,107,53,.7);
  transition: width .1s linear;
}

/* ── NAV ── */
nav.mvpss-nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  padding: 1.2rem 3rem; transition: all .3s;
}
nav.mvpss-nav.scrolled {
  background: rgba(0,0,0,.96);
  border-bottom: 1px solid rgba(255,107,53,.2);
  padding: .8rem 3rem;
  backdrop-filter: blur(20px);
}
.nav-logo { display: flex; align-items: center; gap: .8rem; text-decoration: none; }
.nav-logo img { height: 48px; filter: drop-shadow(0 0 10px rgba(255,107,53,.5)); }
.nav-logo-text span { display: block; font-family: 'Bebas Neue'; font-size: 1.3rem; letter-spacing: 3px; color: var(--silver); line-height: 1; }
.nav-logo-text small { font-size: .58rem; letter-spacing: 4px; color: var(--orange); text-transform: uppercase; }
.nav-links { display: flex; gap: 2rem; list-style: none; margin: 0; padding: 0; }
.nav-links a { color: var(--gray-light); text-decoration: none; font-size: .72rem; letter-spacing: 2px; text-transform: uppercase; font-weight: 500; transition: color .3s; position: relative; }
.nav-links a::after { content: ''; position: absolute; bottom: -3px; left: 0; right: 0; height: 1px; background: var(--orange); transform: scaleX(0); transition: transform .3s; transform-origin: center; }
.nav-links a:hover { color: #fff; }
.nav-links a:hover::after { transform: scaleX(1); }
.nav-cta { background: var(--orange) !important; color: #fff !important; padding: .55rem 1.3rem; font-weight: 600 !important; letter-spacing: 1.5px !important; border-radius: 0 !important; }
.nav-cta::after { display: none !important; }
.nav-cta:hover { background: var(--orange-dark) !important; color: #fff !important; }

/* ── HERO FULLSCREEN ── */
.mvpss-hero {
  position: relative; height: 100vh; min-height: 640px;
  overflow: hidden; display: flex; align-items: center;
}
.hero-slides { position: absolute; inset: 0; }
.hero-slide {
  position: absolute; inset: 0; opacity: 0;
  transition: opacity 1.5s ease;
  background-size: cover; background-position: center;
}
.hero-slide.active { opacity: 1; }

/* HERO PLACEHOLDER OSCURO (sin imagen) */
.hero-slide.slide-dark-1 {
  background: radial-gradient(ellipse at 60% 50%, rgba(255,107,53,.08) 0%, transparent 70%),
              radial-gradient(ellipse at 20% 80%, rgba(192,192,192,.05) 0%, transparent 60%),
              var(--dark);
}
.hero-slide.slide-dark-2 {
  background: radial-gradient(ellipse at 30% 40%, rgba(255,107,53,.06) 0%, transparent 65%),
              radial-gradient(ellipse at 80% 70%, rgba(192,192,192,.04) 0%, transparent 55%),
              var(--dark2);
}
.hero-slide.slide-dark-3 {
  background: radial-gradient(ellipse at 70% 30%, rgba(255,140,66,.07) 0%, transparent 60%),
              var(--dark);
}

/* Cuando hay imagen real, añade estas clases en su lugar: */
/* .slide-img-1 { background-image: url('TU-IMAGEN.jpg'); } */

.hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.5) 50%, rgba(0,0,0,.2) 100%);
}
.hero-overlay-bottom {
  position: absolute; bottom: 0; left: 0; right: 0; height: 200px;
  background: linear-gradient(0deg, var(--dark) 0%, transparent 100%);
}

/* Grid decorativo de fondo en hero placeholder */
.hero-grid-bg {
  position: absolute; inset: 0; z-index: 0;
  background-image:
    linear-gradient(rgba(255,107,53,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,107,53,.03) 1px, transparent 1px);
  background-size: 60px 60px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 80%);
}

.hero-content {
  position: relative; z-index: 2;
  max-width: 680px; padding: 0 3rem;
}
.hero-eyebrow {
  display: flex; align-items: center; gap: .8rem; margin-bottom: 1.2rem;
  animation: slideR .8s cubic-bezier(.16,1,.3,1) .3s both;
}
@keyframes slideR { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
.hero-eyebrow span { font-size: .65rem; letter-spacing: 5px; text-transform: uppercase; color: var(--orange); font-weight: 600; }
.hero-eyebrow::before { content: ''; display: block; width: 28px; height: 1px; background: var(--orange); }

.mvpss-hero h1 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: clamp(3.5rem, 8vw, 7rem) !important;
  font-weight: 900 !important; line-height: .92 !important;
  letter-spacing: -1px !important; margin-bottom: 1.5rem !important;
  text-transform: uppercase !important;
}
.mvpss-hero h1 em { color: var(--orange); font-style: normal; display: block; }
.mvpss-hero h1 .silver {
  background: linear-gradient(135deg, #fff 0%, var(--silver) 50%, #fff 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text; display: block;
}
.h1-l1 { animation: hWord .7s cubic-bezier(.16,1,.3,1) .5s both; }
.h1-l2 { animation: hWord .7s cubic-bezier(.16,1,.3,1) .7s both; }
.h1-l3 { animation: hWord .7s cubic-bezier(.16,1,.3,1) .9s both; }
@keyframes hWord { from { opacity: 0; transform: translateY(24px) skewX(-4deg); } to { opacity: 1; transform: none; } }

.hero-sub {
  font-size: 1.05rem; color: var(--gray-light); line-height: 1.75;
  max-width: 480px; margin-bottom: 2.5rem; font-weight: 300;
  animation: fUp .7s ease 1.1s both;
}
.hero-sub strong { color: #fff; font-weight: 600; }
.hero-btns { display: flex; gap: 1rem; flex-wrap: wrap; animation: fUp .7s ease 1.3s both; }
@keyframes fUp { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

.hero-indicators { position: absolute; bottom: 2rem; left: 3rem; display: flex; gap: .5rem; z-index: 3; }
.indicator { width: 24px; height: 2px; background: rgba(255,255,255,.3); cursor: pointer; transition: all .3s; border: none; padding: 0; }
.indicator.active { width: 48px; background: var(--orange); }

.hero-scroll {
  position: absolute; bottom: 2rem; right: 3rem; z-index: 3;
  display: flex; flex-direction: column; align-items: center; gap: .4rem;
  color: var(--gray); font-size: .6rem; letter-spacing: 3px; text-transform: uppercase;
  animation: bounce 2s ease-in-out infinite;
}
@keyframes bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(6px); } }
.hero-scroll::after { content: '↓'; font-size: 1rem; color: var(--orange); }

/* ── GLITCH ── */
.glitch { position: relative; display: inline-block; }
.glitch::before, .glitch::after { content: attr(data-text); position: absolute; inset: 0; opacity: .7; }
.glitch::before { color: var(--orange); animation: g1 4s infinite; clip-path: polygon(0 0, 100% 0, 100% 33%, 0 33%); }
.glitch::after { color: #4ef; animation: g2 4s infinite; clip-path: polygon(0 66%, 100% 66%, 100% 100%, 0 100%); }
@keyframes g1 { 0%, 88%, 100% { transform: none; } 90% { transform: translate(-2px, 1px); } 94% { transform: translate(2px, -1px); } }
@keyframes g2 { 0%, 88%, 100% { transform: none; } 90% { transform: translate(2px, -1px); } 94% { transform: translate(-2px, 1px); } }

/* ── PARTICLES ── */
.particle {
  position: absolute; border-radius: 50%; pointer-events: none; opacity: 0;
  animation: pFly var(--d, 5s) var(--dl, 0s) ease-in infinite;
}
@keyframes pFly {
  0% { opacity: 0; transform: translate(0,0) scale(0); }
  15% { opacity: .8; }
  85% { opacity: .2; }
  100% { opacity: 0; transform: translate(var(--tx, 30px), var(--ty, -100px)) scale(0); }
}

/* ── BOTONES ── */
.btn-fire {
  background: var(--orange); color: #fff;
  padding: 1rem 2.2rem;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.15rem; font-weight: 800;
  letter-spacing: 3px; text-transform: uppercase;
  text-decoration: none; border: none; cursor: pointer;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  transition: all .3s; display: inline-block; position: relative; overflow: hidden;
}
.btn-fire::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, transparent, rgba(255,255,255,.12), transparent);
  transform: translateX(-100%) skewX(-15deg); transition: transform .5s ease;
}
.btn-fire:hover { background: var(--orange-dark); transform: translateY(-2px); color: #fff; }
.btn-fire:hover::before { transform: translateX(200%) skewX(-15deg); }

.btn-ghost {
  background: transparent; color: var(--silver);
  padding: 1rem 2.2rem;
  border: 1px solid rgba(192,192,192,.3);
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1.15rem; font-weight: 700;
  letter-spacing: 3px; text-transform: uppercase; text-decoration: none;
  clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
  transition: all .3s; display: inline-block;
}
.btn-ghost:hover { border-color: var(--silver); color: #fff; transform: translateY(-2px); }

/* ── TICKER ── */
.mvpss-ticker { background: var(--orange); padding: .65rem 0; overflow: hidden; }
.ticker-track { display: flex; width: max-content; animation: ticker 30s linear infinite; }
@keyframes ticker { to { transform: translateX(-50%); } }
.ticker-item {
  white-space: nowrap; padding: 0 2rem;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 1rem; font-weight: 700; letter-spacing: 3px;
  color: rgba(0,0,0,.8); display: flex; align-items: center; gap: 1rem;
}
.ticker-dot { color: rgba(0,0,0,.4); font-size: .5rem; }

/* ── SECCIÓN BASE ── */
.mvpss-section { padding: 6rem 0; }
.mvpss-container { max-width: 1280px; margin: 0 auto; padding: 0 3rem; }
.s-label {
  font-size: .65rem; letter-spacing: 5px; text-transform: uppercase;
  color: var(--orange); font-weight: 600;
  display: flex; align-items: center; gap: .8rem; margin-bottom: .8rem;
}
.s-label::before { content: ''; width: 28px; height: 1px; background: var(--orange); }
.mvpss-h2 {
  font-family: 'Barlow Condensed', sans-serif !important;
  font-size: clamp(2.5rem, 5vw, 4rem) !important;
  font-weight: 900 !important; line-height: .95 !important;
  text-transform: uppercase !important; letter-spacing: -1px !important;
  color: var(--white) !important;
}
.h2-orange { color: var(--orange) !important; }
.h2-silver { color: var(--silver) !important; }
.intro-text { font-size: .95rem; color: var(--gray); line-height: 1.8; font-weight: 300; }

/* ── COUNTERS ── */
.mvpss-counters {
  background: rgba(255,107,53,.04);
  border-top: 1px solid rgba(255,107,53,.12);
  border-bottom: 1px solid rgba(255,107,53,.12);
  padding: 2.5rem 0;
}
.counters-inner { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; }
.counter-item { padding: 1rem; position: relative; }
.counter-item:not(:last-child)::after { content: ''; position: absolute; right: 0; top: 20%; height: 60%; width: 1px; background: rgba(255,255,255,.06); }
.counter-num { font-family: 'Barlow Condensed', sans-serif; font-size: 3.5rem; font-weight: 900; color: var(--orange); line-height: 1; display: block; }
.counter-suffix { color: var(--silver); }
.counter-label { font-size: .62rem; letter-spacing: 3px; text-transform: uppercase; color: var(--gray); display: block; margin-top: .3rem; }

/* ── WOW SECTION ── */
.mvpss-wow { background: var(--dark2); padding: 6rem 0; }
.wow-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.wow-products-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; position: relative; z-index: 2; }
.wow-product-img { aspect-ratio: 3/4; overflow: hidden; position: relative; background: var(--dark3); }
.wow-product-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.wow-product-img:hover img { transform: scale(1.05); }
.wow-product-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.6) 0%, transparent 50%); }
.wow-product-img { transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.wow-product-img:hover { transform: translateY(-8px) scale(1.02); box-shadow: 0 20px 50px rgba(0,0,0,.5); }
.wow-accent {
  position: absolute; top: -20px; right: -20px;
  width: 120px; height: 120px;
  background: var(--orange); border-radius: 50%;
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  z-index: 3; box-shadow: 0 0 40px rgba(255,107,53,.5);
  animation: floatWow 4s ease-in-out infinite;
}
@keyframes floatWow { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-10px) rotate(2deg); } }
.wow-accent span { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; color: #fff; font-size: 1rem; letter-spacing: 1px; text-align: center; line-height: 1.1; text-transform: uppercase; }
.wow-feat { display: flex; align-items: flex-start; gap: 1rem; padding: 1rem; background: var(--dark3); border-left: 2px solid var(--orange); margin-bottom: .8rem; transition: all .3s ease; }
.wow-feat:hover { background: rgba(255,107,53,.06); transform: translateX(5px); }
.wow-feat-icon { font-size: 1.4rem; flex-shrink: 0; }
.wow-feat h4 { font-family: 'Barlow Condensed', sans-serif; font-size: 1rem; font-weight: 700; letter-spacing: 1px; color: var(--silver); text-transform: uppercase; margin-bottom: .2rem; }
.wow-feat p { font-size: .78rem; color: var(--gray); line-height: 1.5; margin: 0; }

/* ── HOW IT WORKS ── */
.mvpss-how { background: var(--dark); padding: 6rem 0; }
.how-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; margin-top: 4rem; position: relative; }
.how-steps::before { content: ''; position: absolute; top: 40px; left: 12.5%; right: 12.5%; height: 1px; background: linear-gradient(90deg, transparent, var(--orange), var(--orange), var(--orange), transparent); z-index: 0; }
.step { text-align: center; padding: 0 1.5rem; position: relative; z-index: 1; transition: transform .3s ease; }
.step:hover { transform: translateY(-4px); }
.step-num { width: 80px; height: 80px; background: var(--dark2); border: 2px solid var(--orange); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 1.5rem; font-family: 'Barlow Condensed', sans-serif; font-size: 2rem; font-weight: 900; color: var(--orange); position: relative; transition: all .4s cubic-bezier(.16,1,.3,1); }
.step-num::after { content: ''; position: absolute; inset: -6px; border-radius: 50%; border: 1px solid rgba(255,107,53,.2); }
.step:hover .step-num { background: var(--orange); color: #fff; box-shadow: 0 0 30px rgba(255,107,53,.5); transform: scale(1.12) rotate(5deg); }
.step h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.2rem; font-weight: 800; letter-spacing: 2px; color: var(--silver); text-transform: uppercase; margin-bottom: .5rem; }
.step p { font-size: .78rem; color: var(--gray); line-height: 1.6; margin: 0; }

/* ── PRODUCTS ── */
.mvpss-products { background: var(--dark2); padding: 6rem 0; }
.products-header { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: end; margin-bottom: 3rem; }
.products-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.product-card { background: var(--dark3); border: 1px solid rgba(255,255,255,.04); overflow: hidden; position: relative; transition: transform .4s cubic-bezier(.16,1,.3,1), border-color .3s, box-shadow .4s; }
.product-card:hover { transform: translateY(-6px); border-color: rgba(255,107,53,.3); box-shadow: 0 24px 60px rgba(255,107,53,.12); }
.product-img { aspect-ratio: 3/4; overflow: hidden; position: relative; background: var(--dark4); }
.product-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s; }
.product-card:hover .product-img img { transform: scale(1.06); }
.product-img-placeholder { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; background: linear-gradient(135deg, var(--dark3), var(--dark4)); }
.product-img-placeholder span { font-size: 2rem; opacity: .4; }
.product-img-placeholder p { font-family: 'Bebas Neue'; font-size: .9rem; letter-spacing: 2px; color: rgba(192,192,192,.3); margin: 0; }
.product-tag { position: absolute; top: 0; left: 0; background: var(--orange); color: #fff; font-size: .58rem; letter-spacing: 2px; font-weight: 700; padding: .3rem .6rem; text-transform: uppercase; }
.product-info { padding: 1.2rem; }
.product-info h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.1rem; font-weight: 800; letter-spacing: 1px; color: var(--silver); text-transform: uppercase; margin-bottom: .3rem; }
.product-info p { font-size: .75rem; color: var(--gray); line-height: 1.5; margin: 0; }
.product-card.featured { grid-column: span 2; }
.product-card.featured .product-img { aspect-ratio: 2/1.5; }

/* ── PORTFOLIO ── */
.mvpss-portfolio { background: var(--dark); padding: 6rem 0; }
.port-header { display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 2.5rem; flex-wrap: wrap; gap: 1.5rem; }
.port-filters { display: flex; gap: .4rem; flex-wrap: wrap; }
.f-btn { background: transparent; border: 1px solid rgba(192,192,192,.15); color: var(--gray); padding: .45rem 1rem; font-size: .68rem; letter-spacing: 2px; text-transform: uppercase; cursor: pointer; transition: all .3s; font-family: 'Inter', sans-serif; }
.f-btn:hover, .f-btn.active { background: var(--orange); border-color: var(--orange); color: #fff; }
.port-grid { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 200px; gap: 6px; }
.port-item { overflow: hidden; position: relative; cursor: pointer; background: var(--dark3); transition: transform .4s cubic-bezier(.16,1,.3,1); z-index: 1; }
.port-item:hover { transform: scale(1.02); z-index: 2; }
.port-item.c2 { grid-column: span 4; }
.port-item.c3 { grid-column: span 3; }
.port-item.c4 { grid-column: span 6; grid-row: span 2; }
.port-item.c5 { grid-column: span 3; grid-row: span 2; }
.port-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.port-item:hover img { transform: scale(1.08); }
.port-img-ph { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; background: linear-gradient(135deg, var(--dark3), var(--dark4)); transition: transform .6s; }
.port-item:hover .port-img-ph { transform: scale(1.05); }
.port-img-ph .emoji { font-size: 2rem; opacity: .5; }
.port-img-ph .label { font-family: 'Bebas Neue'; letter-spacing: 3px; color: rgba(192,192,192,.3); font-size: .9rem; }
.port-overlay { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.9) 0%, transparent 55%); opacity: 0; transition: opacity .3s; display: flex; flex-direction: column; justify-content: flex-end; padding: 1.2rem; }
.port-item:hover .port-overlay { opacity: 1; }
.port-overlay h4 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.1rem; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; margin: 0; }
.port-overlay span { font-size: .65rem; color: var(--orange); letter-spacing: 2px; text-transform: uppercase; }
.port-corner { position: absolute; top: 0; right: 0; width: 0; height: 0; border-left: 32px solid transparent; border-top: 32px solid var(--orange); opacity: 0; transition: opacity .3s; }
.port-item:hover .port-corner { opacity: 1; }
/* Shine sweep */
.port-item::after { content: ''; position: absolute; top: 0; left: -100%; width: 50%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.05), transparent); transform: skewX(-12deg); transition: left .7s ease; pointer-events: none; z-index: 3; }
.port-item:hover::after { left: 160%; }
.port-note { text-align: center; color: var(--gray); font-size: .72rem; margin-top: 1.2rem; letter-spacing: 1px; }

/* ── SERVICES ── */
.mvpss-services { background: var(--dark2); padding: 6rem 0; }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 3rem; }
.svc { background: var(--dark3); padding: 2.5rem 2rem; position: relative; overflow: hidden; transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.svc::before { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, var(--orange), transparent); transform: scaleX(0); transform-origin: left; transition: transform .4s; }
.svc:hover { transform: translateY(-4px); box-shadow: 0 20px 50px rgba(255,107,53,.1); }
.svc:hover::before { transform: scaleX(1); }
.svc-icon { font-size: 2rem; margin-bottom: 1.2rem; display: block; }
.svc h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.3rem; font-weight: 800; letter-spacing: 2px; color: var(--silver); text-transform: uppercase; margin-bottom: .6rem; }
.svc p { font-size: .8rem; color: var(--gray); line-height: 1.7; margin: 0; }
.svc-badge { display: inline-block; margin-top: .8rem; font-size: .6rem; letter-spacing: 2px; color: var(--orange); font-weight: 700; text-transform: uppercase; }
.svc-num { position: absolute; bottom: 1rem; right: 1.5rem; font-family: 'Barlow Condensed', sans-serif; font-size: 4rem; font-weight: 900; color: rgba(255,107,53,.04); line-height: 1; }

/* ── PACKAGES ── */
.mvpss-packs { background: var(--dark); padding: 6rem 0; }
.packs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 3rem; }
.pack { background: var(--dark2); border: 1px solid rgba(255,255,255,.06); padding: 2.5rem; position: relative; overflow: hidden; transition: transform .4s cubic-bezier(.16,1,.3,1), box-shadow .4s; }
.pack:hover { transform: translateY(-6px); box-shadow: 0 20px 50px rgba(255,107,53,.08); }
.pack.star { background: linear-gradient(135deg, var(--dark2) 0%, rgba(255,107,53,.05) 100%); border-color: rgba(255,107,53,.25); }
.pack-badge { position: absolute; top: 0; right: 2rem; background: var(--orange); color: #fff; font-size: .6rem; letter-spacing: 2px; font-weight: 700; padding: .3rem .8rem; text-transform: uppercase; }
.pack-name { font-family: 'Barlow Condensed', sans-serif; font-size: 2.2rem; font-weight: 900; letter-spacing: 3px; color: var(--silver); text-transform: uppercase; margin-bottom: .2rem; }
.pack-tag { font-size: .75rem; color: var(--orange); letter-spacing: 1px; margin-bottom: 1.5rem; display: block; }
.pack-price { font-family: 'Barlow Condensed', sans-serif; font-size: 3.5rem; font-weight: 900; color: #fff; line-height: 1; letter-spacing: -1px; }
.pack-price sub { font-size: 1rem; color: var(--gray); font-family: 'Inter'; font-weight: 300; }
.pack-divider { height: 1px; background: rgba(255,255,255,.07); margin: 1.5rem 0; }
.pack-list { list-style: none; display: flex; flex-direction: column; gap: .65rem; padding: 0; margin: 0; }
.pack-list li { font-size: .8rem; color: var(--gray-light); display: flex; gap: .6rem; align-items: flex-start; line-height: 1.4; }
.pack-list li::before { content: '▸'; color: var(--orange); flex-shrink: 0; margin-top: .05rem; }
.pack-cta { display: block; text-align: center; margin-top: 2rem; border: 1px solid rgba(192,192,192,.2); color: var(--silver); padding: .9rem; font-family: 'Barlow Condensed', sans-serif; font-size: 1rem; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; text-decoration: none; transition: all .3s; cursor: pointer; background: transparent; }
.pack-cta:hover, .pack.star .pack-cta { background: var(--orange); border-color: var(--orange); color: #fff; }
.pack-note { font-size: .68rem; color: var(--gray); text-align: center; margin-top: .6rem; }

/* ── ABOUT ── */
.mvpss-about { background: var(--dark2); padding: 6rem 0; overflow: hidden; }
.about-inner { display: grid; grid-template-columns: 1.1fr 1fr; gap: 5rem; align-items: center; }
.about-content p { font-size: .88rem; color: var(--gray); line-height: 1.85; margin-bottom: 1rem; }
.about-content p strong { color: var(--silver); }
.about-pills { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; }
.pill { background: var(--dark3); border: 1px solid rgba(255,107,53,.2); padding: .4rem .9rem; font-size: .68rem; letter-spacing: 2px; color: var(--silver); text-transform: uppercase; border-left: 2px solid var(--orange); }
.about-img-ph { width: 100%; aspect-ratio: 4/5; background: linear-gradient(135deg, var(--dark3), var(--dark4)); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1rem; }
.about-logo-display img { width: 180px; filter: drop-shadow(0 0 30px rgba(255,107,53,.4)); }
.about-tags-v { display: flex; flex-direction: column; gap: .5rem; margin-top: .8rem; }
.about-tag-v { background: var(--dark3); border-left: 2px solid var(--orange); padding: .6rem 1rem; font-size: .7rem; letter-spacing: 2px; color: var(--silver); text-transform: uppercase; }

/* ── SPORTS ── */
.mvpss-sports { background: var(--dark); padding: 4rem 0; }
.sports-wrap { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 2rem; }
.s-pill { display: flex; align-items: center; gap: .4rem; background: var(--dark2); border: 1px solid rgba(255,255,255,.06); padding: .55rem 1.1rem; font-size: .75rem; letter-spacing: .5px; color: var(--silver); transition: all .3s cubic-bezier(.16,1,.3,1); cursor: default; }
.s-pill:hover { border-color: var(--orange); color: #fff; background: rgba(255,107,53,.06); transform: translateY(-3px); box-shadow: 0 8px 24px rgba(255,107,53,.2); }
.s-pill-open { border-style: dashed; border-color: rgba(255,107,53,.3); color: var(--orange); }

/* ── CONTACT ── */
.mvpss-contact { background: var(--dark2); padding: 6rem 0; }
.contact-inner { display: grid; grid-template-columns: 1fr 1.3fr; gap: 4rem; align-items: start; }
.contact-left p { font-size: .88rem; color: var(--gray); line-height: 1.8; margin-top: .8rem; margin-bottom: 2rem; }
.contact-methods { display: flex; flex-direction: column; gap: .8rem; }
.c-method { display: flex; align-items: center; gap: .9rem; background: var(--dark3); padding: .9rem 1.1rem; border: 1px solid rgba(255,255,255,.04); text-decoration: none; color: inherit; transition: border-color .3s; }
.c-method:hover { border-color: rgba(255,107,53,.3); }
.c-icon { width: 40px; height: 40px; background: rgba(255,107,53,.1); display: flex; align-items: center; justify-content: center; font-size: 1.1rem; flex-shrink: 0; }
.c-info label { display: block; font-size: .6rem; letter-spacing: 2px; text-transform: uppercase; color: var(--orange); margin-bottom: .1rem; cursor: pointer; }
.c-info span { font-size: .85rem; color: var(--silver); font-weight: 500; }
.form-wrap { background: var(--dark3); padding: 2.5rem; }
.form-wrap h3 { font-family: 'Barlow Condensed', sans-serif; font-size: 1.8rem; font-weight: 800; letter-spacing: 3px; color: var(--silver); text-transform: uppercase; margin-bottom: 1.5rem; }
.fg { margin-bottom: 1rem; }
.frow { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.fg label { display: block; font-size: .62rem; letter-spacing: 2px; text-transform: uppercase; color: var(--gray); margin-bottom: .35rem; }
.fg input, .fg select, .fg textarea { width: 100%; background: var(--dark4); border: 1px solid rgba(255,255,255,.08); color: #fff; padding: .75rem .9rem; font-family: 'Inter'; font-size: .85rem; outline: none; transition: border-color .3s, box-shadow .3s; -webkit-appearance: none; }
.fg input:focus, .fg select:focus, .fg textarea:focus { border-color: var(--orange); box-shadow: 0 0 0 1px var(--orange), 0 4px 20px rgba(255,107,53,.08); }
.fg textarea { resize: vertical; min-height: 100px; }
.fg input::placeholder, .fg textarea::placeholder { color: var(--gray); }
.btn-submit { width: 100%; background: var(--orange); color: #fff; border: none; padding: .95rem; cursor: pointer; font-family: 'Barlow Condensed', sans-serif; font-size: 1.2rem; font-weight: 800; letter-spacing: 4px; text-transform: uppercase; transition: background .3s; margin-top: .5rem; }
.btn-submit:hover { background: var(--orange-dark); }
.form-note { font-size: .68rem; color: var(--gray); text-align: center; margin-top: .6rem; }

/* ── FOOTER ── */
.mvpss-footer { background: #000; border-top: 1px solid rgba(255,255,255,.05); padding: 3rem 0 1.5rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 3rem; margin-bottom: 2rem; }
.footer-brand .fl { display: flex; align-items: center; gap: .7rem; margin-bottom: .8rem; }
.footer-brand .fl img { height: 40px; }
.footer-brand .fl-text span { display: block; font-family: 'Bebas Neue'; font-size: 1.1rem; letter-spacing: 3px; color: var(--silver); }
.footer-brand .fl-text small { font-size: .55rem; letter-spacing: 3px; color: var(--orange); text-transform: uppercase; }
.footer-tagline { font-size: .78rem; color: var(--gray); line-height: 1.7; max-width: 260px; }
.footer-col h4 { font-family: 'Barlow Condensed', sans-serif; font-size: .95rem; font-weight: 700; letter-spacing: 3px; color: var(--silver); text-transform: uppercase; margin-bottom: .9rem; }
.footer-col ul { list-style: none; display: flex; flex-direction: column; gap: .5rem; padding: 0; margin: 0; }
.footer-col ul a { font-size: .75rem; color: var(--gray); text-decoration: none; transition: color .3s; }
.footer-col ul a:hover { color: var(--orange); }
.footer-bottom { border-top: 1px solid rgba(255,255,255,.04); padding-top: 1.5rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; }
.footer-bottom p { font-size: .68rem; color: var(--gray); margin: 0; }
.socials { display: flex; gap: .6rem; }
.soc { width: 34px; height: 34px; background: var(--dark3); border: 1px solid rgba(255,255,255,.07); display: flex; align-items: center; justify-content: center; color: var(--gray); text-decoration: none; font-size: .85rem; transition: all .3s; }
.soc:hover { background: var(--orange); border-color: var(--orange); color: #fff; }

/* ── WhatsApp FLOAT ── */
.wa { position: fixed; bottom: 2rem; right: 2rem; z-index: 999; width: 54px; height: 54px; border-radius: 50%; background: #25D366; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 20px rgba(37,211,102,.4); text-decoration: none; font-size: 1.4rem; transition: transform .2s; animation: waPop 3s ease-in-out infinite; }
.wa:hover { transform: scale(1.12) !important; }
@keyframes waPop { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }

/* ── KEN BURNS ── */
.hero-slide.active { animation: kBurns 9s ease-in-out infinite alternate; }
@keyframes kBurns { 0% { transform: scale(1.0) translate(0,0); } 100% { transform: scale(1.09) translate(-1.5%,-1%); } }

/* ── REVEAL SYSTEM ── */
.reveal { opacity: 0; transform: translateY(32px); transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal.visible { opacity: 1; transform: none; }
.reveal-l { opacity: 0; transform: translateX(-40px); transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-l.visible { opacity: 1; transform: none; }
.reveal-r { opacity: 0; transform: translateX(40px); transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-r.visible { opacity: 1; transform: none; }
.reveal-s { opacity: 0; transform: scale(.92); transition: opacity .8s cubic-bezier(.16,1,.3,1), transform .8s cubic-bezier(.16,1,.3,1); }
.reveal-s.visible { opacity: 1; transform: none; }

/* ── STAGGER ── */
.stagger > * { opacity: 0; transform: translateY(18px); transition: opacity .55s ease, transform .55s ease; }
.stagger.visible > *:nth-child(1) { opacity: 1; transform: none; transition-delay: .05s; }
.stagger.visible > *:nth-child(2) { opacity: 1; transform: none; transition-delay: .15s; }
.stagger.visible > *:nth-child(3) { opacity: 1; transform: none; transition-delay: .25s; }
.stagger.visible > *:nth-child(4) { opacity: 1; transform: none; transition-delay: .35s; }
.stagger.visible > *:nth-child(5) { opacity: 1; transform: none; transition-delay: .45s; }
.stagger.visible > *:nth-child(6) { opacity: 1; transform: none; transition-delay: .55s; }

/* ── MOBILE ── */
@media (max-width: 900px) {
  .cursor, .cursor-ring { display: none; }
  nav.mvpss-nav { padding: 1rem 1.5rem; }
  nav.mvpss-nav.scrolled { padding: .7rem 1.5rem; }
  .nav-links { display: none; }
  .mvpss-container { padding: 0 1.5rem; }
  .hero-content { padding: 0 1.5rem; max-width: 100%; }
  .wow-inner, .about-inner, .contact-inner { grid-template-columns: 1fr; }
  .about-visual { display: none; }
  .services-grid, .packs-grid { grid-template-columns: 1fr; }
  .products-grid { grid-template-columns: 1fr 1fr; }
  .product-card.featured { grid-column: span 2; }
  .how-steps { grid-template-columns: 1fr 1fr; }
  .how-steps::before { display: none; }
  .port-grid { grid-template-columns: 1fr 1fr; grid-auto-rows: 180px; }
  .port-item.c2, .port-item.c3, .port-item.c4, .port-item.c5 { grid-column: span 1; grid-row: span 1; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .frow { grid-template-columns: 1fr; }
  .products-header { grid-template-columns: 1fr; }
  .counters-inner { grid-template-columns: 1fr 1fr; }
  .counter-item:nth-child(2)::after { display: none; }
}

/* ── FIX: Evitar pantalla negra por parallax desbordado ── */
.mvpss-hero {
  overflow: hidden !important;
}
.hero-slides {
  overflow: hidden !important;
}
.hero-slide {
  will-change: transform;
  backface-visibility: hidden;
}
/* Reset scroll al cargar — refuerzo CSS */
html {
  scroll-behavior: auto !important; /* Divi a veces fuerza smooth que causa el bug */
}

/* ── OCULTAR FOOTER DIVI (reemplazado por footer centralizado PHP) ── */
.mvpss-page #main-footer { display: none !important; }

/* ── FOOTER CENTRALIZADO MVP SPORT STUDIO ── */
.mvpss-footer {
  background: #0a0a0a;
  border-top: 1px solid #1e1e1e;
  padding: 3rem 2rem 1.5rem;
  font-family: var(--font-body);
  color: var(--light);
  width: 100%;
  box-sizing: border-box;
}
.footer-inner {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto 2rem;
  align-items: start;
}
.footer-logo-wrap {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.footer-logo {
  height: 50px;
  width: auto;
  object-fit: contain;
}
.footer-brand {
  font-family: var(--font-display);
  font-size: 1.4rem;
  color: var(--orange);
  letter-spacing: 0.05em;
  text-transform: uppercase;
}
.mvpss-footer .footer-nav ul {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.mvpss-footer .footer-nav ul li a {
  color: #aaa;
  text-decoration: none;
  font-size: 0.9rem;
  transition: color 0.2s;
}
.mvpss-footer .footer-nav ul li a:hover {
  color: var(--orange);
}
.footer-contact p {
  margin: 0 0 0.4rem;
  font-size: 0.9rem;
  color: #aaa;
}
.footer-contact strong {
  color: var(--light);
  font-size: 0.95rem;
  display: block;
  margin-bottom: 0.6rem;
}
.footer-contact a {
  color: #aaa;
  text-decoration: none;
  transition: color 0.2s;
}
.footer-contact a:hover {
  color: var(--orange);
}
.footer-copy {
  border-top: 1px solid #1e1e1e;
  padding-top: 1.2rem;
  text-align: center;
  max-width: 1200px;
  margin: 0 auto;
}
.footer-copy p {
  font-size: 0.78rem;
  color: #666;
  margin: 0;
}
.footer-copy a {
  color: var(--orange);
  text-decoration: none;
}
.footer-copy a:hover {
  text-decoration: underline;
}
@media (max-width: 768px) {
  .footer-inner {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}


/* ════════════════════════════════════════════════════
   DIVI MÓDULOS NATIVOS — Ajustes estéticos globales
   ════════════════════════════════════════════════════ */

/* ── Anular fondos blancos y colores de Divi ── */
.mvpss-page .et_pb_section { background-color: transparent !important; }
.mvpss-page .et_pb_row { background-color: transparent !important; }
.mvpss-page .et_pb_column { background-color: transparent !important; }
.mvpss-page .et_pb_text_inner { color: inherit; }

/* ── Contadores nativos Divi ── */
.mvpss-page .et_pb_number_counter .percent { display: none; }
.mvpss-page .et_pb_number_counter .title { color: #aaa !important; font-size: .85rem !important; text-transform: uppercase !important; letter-spacing: .1em !important; }
.mvpss-page .et_pb_counter_amount { background: transparent !important; }
.mvpss-page .et_pb_number_counter { text-align: center; border-right: 1px solid rgba(255,255,255,.08); padding: 30px 20px !important; }
.mvpss-page .et_pb_column:last-child .et_pb_number_counter { border-right: none; }
.mvpss-page .et_pb_number_counter .percent_sign { color: #FF6B35 !important; font-family: 'Bebas Neue', sans-serif !important; font-size: 4.5rem !important; }

/* ── Blurbs (tarjetas de servicios, how, etc.) ── */
.mvpss-page .et_pb_blurb { border-radius: 0 !important; }
.mvpss-page .et_pb_blurb .et_pb_blurb_container { padding: 0 !important; }
.mvpss-page .et_pb_blurb_description { color: #999 !important; font-size: .95rem !important; line-height: 1.6 !important; }
.mvpss-page .et_pb_blurb .et_pb_module_header { font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; }
.mvpss-page .et_pb_blurb .et_pb_main_blurb_image { margin-bottom: 0 !important; }
.mvpss-page .et_pb_blurb.et_pb_border_left_blurb { border-left-style: solid !important; }

/* ── Imágenes portfolio ── */
.mvpss-page .portfolio-img img { width: 100%; height: 260px; object-fit: cover; display: block; }
.mvpss-page .et_pb_image { line-height: 0; }

/* ── Botones Divi ── */
.mvpss-page .et_pb_button { text-transform: uppercase !important; letter-spacing: .1em !important; border-radius: 0 !important; font-family: 'Barlow Condensed', sans-serif !important; font-weight: 700 !important; }
.mvpss-page .et_pb_button:hover { opacity: .85; }

/* ── Texto heredado ── */
.mvpss-page .et_pb_text p { color: inherit; }
.mvpss-page h1, .mvpss-page h2, .mvpss-page h3 { color: #fff; }

/* ── Pricing table anulado (usamos blurb en su lugar) ── */
.mvpss-page .et_pb_pricing_tables { display: block; }

/* ── Sección hero Divi ── */
.mvpss-page .divi-hero-section { min-height: auto; display: flex; flex-direction: column; justify-content: center; }
.mvpss-page .divi-hero-section .et_pb_text_inner { padding-top: 0 !important; }

/* ── Fix margen superior primer sección ── */
.mvpss-page #page-container .et_pb_section:first-child { margin-top: 0 !important; padding-top: 0 !important; }

/* ── Separadores de contadores ── */
.mvpss-page .et_pb_column_1_4 .et_pb_number_counter + .et_pb_number_counter { border-top: 1px solid rgba(255,255,255,.08); }

/* ── Fix ancho completo secciones ── */
.mvpss-page .et_pb_section.et_pb_section_first { padding-top: 0 !important; }


/* ═══════════════════════════════════════════════════════
   DIVI MODULES — VISUAL PARITY FIXES v1.0
   Fixes image sizes, spacing, and proportions to match
   original HTML design
   ═══════════════════════════════════════════════════════ */

/* ── GLOBAL: Constrain content width like original sidebar layout ── */
body.mvpss-page .et_pb_row {
  max-width: 1200px !important;
  width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
body.mvpss-page .et_pb_row.et_pb_row_fullwidth {
  max-width: 100% !important;
  width: 100% !important;
}

/* ── HERO SECTION: fix blank space at top ── */
#inicio.et_pb_section {
  min-height: auto !important;
  height: auto !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
#inicio .et_pb_row {
  padding-top: 30px !important;
  padding-bottom: 30px !important;
  width: 100% !important;
  min-height: auto !important;
}

/* ── WOW SECTION: Image sizing ── */
#wow ~ .et_pb_section:not(#servicios):not(#productos):not(#portfolio) .wow-img img,
.et_pb_section_3 .wow-img img {
  max-height: 420px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}
.et_pb_section_3 .wow-grid-img img,
.wow-grid-img img {
  max-height: 200px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}
.et_pb_section_3 .et_pb_column_1_4 .et_pb_module {
  margin-bottom: 4px !important;
}

/* ── PRODUCTS SECTION: Compact image cards ── */
#productos .et_pb_image_wrap img {
  max-height: 240px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
  display: block !important;
  margin: 0 auto !important;
}
#productos .et_pb_image {
  text-align: center !important;
}
#productos .et_pb_row {
  padding-top: 16px !important;
  padding-bottom: 16px !important;
}

/* ── PORTFOLIO SECTION: Maintain compact grid ── */
#portfolio .et_pb_image_wrap img {
  max-height: 260px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: cover !important;
}

/* ── SECTION ROWS: Fix excessive top/bottom padding ── */
body.mvpss-page .et_pb_row {
  padding-top: 20px !important;
  padding-bottom: 20px !important;
}
body.mvpss-page #inicio .et_pb_row {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

/* ── SECTION HEADINGS: Scale down for full-width layout ── */
body.mvpss-page .et_pb_text_inner h2 {
  line-height: 1.0 !important;
}

/* ── ABOUT SECTION: Constrain image ── */
#nosotros .et_pb_image_wrap img {
  max-height: 350px !important;
  width: auto !important;
  max-width: 100% !important;
  object-fit: contain !important;
}

/* ── COUNTERS SECTION: Compact ── */
#wow .et_pb_section,
.et_pb_section_2 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
.et_pb_number_counter {
  padding: 20px 10px !important;
}

/* Fix Divi number counter display — canvas needs to be visible */
.et_pb_number_counter canvas {
  display: block !important;
  visibility: visible !important;
  margin: 0 auto !important;
}
.et_pb_number_counter .percent {
  display: block !important;
  visibility: visible !important;
}
/* Make counter text readable on dark background */
body.mvpss-page .et_pb_number_counter .title {
  color: var(--gray) !important;
  font-size: 0.62rem !important;
  letter-spacing: 3px !important;
  text-transform: uppercase !important;
  margin-top: 0.5rem !important;
}
/* Counter number color in canvas is set by Divi JS - override section background */
body.mvpss-page #wow {
  background: rgba(255,107,53,.04) !important;
  border-top: 1px solid rgba(255,107,53,.12) !important;
  border-bottom: 1px solid rgba(255,107,53,.12) !important;
}
#wow .et_pb_section,
.et_pb_section_2 {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
.et_pb_number_counter {
  padding: 20px 10px !important;
}

/* ── SERVICES SECTION: Blurb cards ── */
#servicios .et_pb_blurb {
  border: 1px solid rgba(255,255,255,0.06) !important;
  padding: 1.2rem !important;
  border-radius: 4px !important;
  background: rgba(255,255,255,0.02) !important;
}

/* ── PACKS SECTION: Blurb cards ── */
#tarifas .et_pb_blurb {
  border: 1px solid rgba(255,107,53,0.2) !important;
  padding: 1.5rem !important;
  border-radius: 6px !important;
  background: rgba(255,107,53,0.03) !important;
}


/* Remove bottom space after hero section */
#inicio.et_pb_section {
  margin-bottom: 0 !important;
}
/* Fix blank space between sections (Divi default margin) */
body.mvpss-page .et_pb_section + .et_pb_section {
  margin-top: 0 !important;
}

/* === RESERVA SECTION — Hide BR tags injected by wpautop === */
#contacto .et_pb_text div[style*="flex-direction:column"] br {
  display: none !important;
}

/* === NOSOTROS — Logo size constraint === */
#nosotros .et_pb_image_wrap img {
  max-width: 480px !important;
  width: 100% !important;
}


/* =============================================
   WOOCOMMERCE — TEMA OSCURO
   ============================================= */

/* Contenedor general del producto */
.woocommerce div.product,
.woocommerce-page div.product {
    background: var(--dark);
    color: var(--white);
}

/* Área de resumen (precio, botón, descripción corta) */
.woocommerce div.product .summary,
.woocommerce div.product .entry-summary {
    background: var(--dark);
    color: var(--white);
}

/* Descripción corta */
.woocommerce div.product .woocommerce-product-details__short-description,
.woocommerce div.product .woocommerce-product-details__short-description p,
.woocommerce div.product .woocommerce-product-details__short-description li {
    color: var(--silver);
}

/* Pestañas (tabs) */
.woocommerce div.product .woocommerce-tabs ul.tabs {
    background: var(--dark2);
    border-color: var(--dark4);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li {
    background: var(--dark2);
    border-color: var(--dark4);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li a {
    color: var(--gray);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active {
    background: var(--dark);
    border-bottom-color: var(--dark);
}

.woocommerce div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--white);
}

/* Panel de descripción larga */
.woocommerce div.product .woocommerce-Tabs-panel,
.woocommerce div.product #tab-description,
.woocommerce div.product #tab-reviews {
    background: var(--dark);
    color: var(--silver);
    border-color: var(--dark4);
}

.woocommerce div.product .woocommerce-Tabs-panel h2,
.woocommerce div.product .woocommerce-Tabs-panel h3,
.woocommerce div.product .woocommerce-Tabs-panel p,
.woocommerce div.product .woocommerce-Tabs-panel li,
.woocommerce div.product .woocommerce-Tabs-panel span {
    color: var(--silver);
}

/* Metadatos (categoría, etiquetas, marca) */
.woocommerce div.product .product_meta,
.woocommerce div.product .product_meta span,
.woocommerce div.product .product_meta a {
    color: var(--gray);
}

.woocommerce div.product .product_meta a:hover {
    color: var(--orange);
}

/* Precio */
.woocommerce div.product p.price,
.woocommerce div.product span.price {
    color: var(--orange) !important;
}

.woocommerce div.product p.price del,
.woocommerce div.product span.price del {
    color: var(--gray) !important;
}

/* Botón añadir al carrito */
.woocommerce div.product .single_add_to_cart_button {
    background-color: var(--orange) !important;
    border-color: var(--orange) !important;
    color: var(--white) !important;
}

.woocommerce div.product .single_add_to_cart_button:hover {
    background-color: var(--orange-dark) !important;
    border-color: var(--orange-dark) !important;
}

/* Selector de cantidad */
.woocommerce div.product .quantity input {
    background: var(--dark3);
    color: var(--white);
    border-color: var(--dark4);
}

/* Valoraciones */
.woocommerce #reviews #comments ol.commentlist li .comment-text {
    background: var(--dark2);
    border-color: var(--dark4);
    color: var(--silver);
}

.woocommerce #reviews #reply-title,
.woocommerce #reviews #respond p {
    color: var(--silver);
}

/* Productos relacionados */
.woocommerce .related h2,
.woocommerce .upsells h2 {
    color: var(--white);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title {
    color: var(--white);
}

.woocommerce ul.products li.product .price {
    color: var(--orange);
}

/* =============================================
   WOOCOMMERCE — FONDO OSCURO GLOBAL (fix #main-content y tabs)
   ============================================= */

/* Contenedor principal de página - Divi lo pone blanco por defecto */
body.mvpss-page #main-content {
    background: var(--dark) !important;
}

/* Breadcrumb */
body.mvpss-page .woocommerce-breadcrumb,
body.mvpss-page .woocommerce-breadcrumb a {
    color: var(--gray) !important;
}

/* Fondo de pestañas (tabs) que Divi pone en gris claro */
body.woocommerce div.product .woocommerce-tabs ul.tabs,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs {
    background: var(--dark2) !important;
    border-color: var(--dark4) !important;
}

body.woocommerce div.product .woocommerce-tabs ul.tabs li,
body.woocommerce div.product .woocommerce-tabs ul.tabs li.active,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li.active {
    background: var(--dark2) !important;
    border-color: var(--dark4) !important;
}

body.woocommerce div.product .woocommerce-tabs ul.tabs li.active,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li.active {
    background: var(--dark) !important;
    border-bottom-color: var(--dark) !important;
}

body.woocommerce div.product .woocommerce-tabs ul.tabs li a,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li a {
    color: var(--gray) !important;
}

body.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
body.woocommerce #content-area div.product .woocommerce-tabs ul.tabs li.active a {
    color: var(--white) !important;
}

/* Botones +/- de cantidad */
body.mvpss-page .woocommerce .quantity .minus,
body.mvpss-page .woocommerce .quantity .plus,
body.mvpss-page .woocommerce-page .quantity .minus,
body.mvpss-page .woocommerce-page .quantity .plus {
    background: var(--dark3) !important;
    color: var(--white) !important;
    border-color: var(--dark4) !important;
}

/* =============================================
   WOOCOMMERCE — TIENDA SIN SIDEBAR
   ============================================= */

/* Ocultar el sidebar en la página de tienda */
body.woocommerce-page #sidebar {
    display: none !important;
}

/* Expandir el contenido al ancho completo (Divi usa et_right_sidebar en el body) */
body.woocommerce-page.et_right_sidebar #left-area,
body.woocommerce-page.et_left_sidebar #left-area {
    width: 100% !important;
    float: none !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* Eliminar el borde/línea vertical residual del content-area */
body.woocommerce-page #content-area {
    border: none !important;
}