:root {
  --color-gris-fondo: #deebe6;
  --color-verde: #56e5c9;
  --color-celeste: #0068ff;
  --color-azul: #111a61;
  --color-negro: #000e1f;
  --txt-general: 1.2rem;
  --txt-link: 1.4rem;
}


/* =====================
   FUENTES ARBORIA
   ===================== */

/* Black */
@font-face {
  font-family: 'Arboria';
  src: url('../fonts/arboria/eot/Arboria-Black.eot');
  src: url('../fonts/arboria/eot/Arboria-Black.eot?#iefix') format('embedded-opentype'),
       url('../fonts/arboria/woff2/Arboria-Black.woff2') format('woff2'),
       url('../fonts/arboria/woff/Arboria-Black.woff') format('woff'),
       url('../fonts/arboria/ttf/Arboria-Black.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}

/* Bold */
@font-face {
  font-family: 'Arboria';
  src: url('../fonts/arboria/eot/Arboria-Bold.eot');
  src: url('../fonts/arboria/eot/Arboria-Bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/arboria/woff2/Arboria-Bold.woff2') format('woff2'),
       url('../fonts/arboria/woff/Arboria-Bold.woff') format('woff'),
       url('../fonts/arboria/ttf/Arboria-Bold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Book (regular) */
@font-face {
  font-family: 'Arboria';
  src: url('../fonts/arboria/eot/Arboria-Book.eot');
  src: url('../fonts/arboria/eot/Arboria-Book.eot?#iefix') format('embedded-opentype'),
       url('../fonts/arboria/woff2/Arboria-Book.woff2') format('woff2'),
       url('../fonts/arboria/woff/Arboria-Book.woff') format('woff'),
       url('../fonts/arboria/ttf/Arboria-Book.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Light */
@font-face {
  font-family: 'Arboria';
  src: url('../fonts/arboria/eot/Arboria-Light.eot');
  src: url('../fonts/arboria/eot/Arboria-Light.eot?#iefix') format('embedded-opentype'),
       url('../fonts/arboria/woff2/Arboria-Light.woff2') format('woff2'),
       url('../fonts/arboria/woff/Arboria-Light.woff') format('woff'),
       url('../fonts/arboria/ttf/Arboria-Light.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

.font-arboria-black {
  font-family: 'Arboria', sans-serif;
  font-weight: 900;
}

.font-arboria-bold {
  font-family: 'Arboria', sans-serif;
  font-weight: 700;
}

.font-arboria-book {
  font-family: 'Arboria', sans-serif;
  font-weight: 400;
}

.font-arboria-light {
  font-family: 'Arboria', sans-serif;
  font-weight: 300;
}

/* =====================
   FUENTES CENTURY GOTHIC
   ===================== */

/* Regular */
@font-face {
  font-family: 'CenturyGothic';
  src: url('../fonts/century/Century-Gothic-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Italic */
@font-face {
  font-family: 'CenturyGothic';
  src: url('../fonts/century/Century-Gothic-Italic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

/* Bold */
@font-face {
  font-family: 'CenturyGothic';
  src: url('../fonts/century/Century-Gothic-Black.ttf') format('truetype'); /* ⚠️ si tenés "Bold.ttf", usalo acá */
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Bold Italic */
@font-face {
  font-family: 'CenturyGothic';
  src: url('../fonts/century/Century-Gothic-Black-Italic.ttf') format('truetype'); /* ⚠️ si tenés "Bold-Italic.ttf", usalo acá */
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}

.font-century-regular {
  font-family: 'CenturyGothic', sans-serif;
  font-weight: 400;
}

.font-century-italic {
  font-family: 'CenturyGothic', sans-serif;
  font-weight: 400;
  font-style: italic;
}

.font-century-bold {
  font-family: 'CenturyGothic', sans-serif;
  font-weight: 700;
}

.font-century-bold-italic {
  font-family: 'CenturyGothic', sans-serif;
  font-weight: 700;
  font-style: italic;
}


.wheel-svg {
  width: 100%;
  height: auto;
  display: block;
}

.hotspot {
  cursor: pointer;
  outline: none;
  transform-box: fill-box;
  transform-origin: 50% 50%;
  --tx: 0px;
  --ty: 0px;
  --active-scale: 1.02; /* ajustá 1.02–1.04 */
  transform: translate(var(--tx), var(--ty)) scale(1);
  transition: transform 180ms cubic-bezier(0.2, 0.8, 0.2, 1), filter 180ms ease;
  will-change: transform, filter;
}

.hotspot:focus-visible {
  filter: drop-shadow(0 0 0.5rem rgba(209, 209, 209, 0.25));
}

.hotspot.active {
  transform: translate(var(--tx), var(--ty)) scale(var(--active-scale));
  filter: drop-shadow(0 4px 12px rgba(63, 107, 228, 0.18));
}

.hotspot.active > * {
  stroke: #3f6be4;
  stroke-width: 3;
  stroke-linejoin: round;
}

.sspv-carousel {
  position: relative;
  padding: 10px;
}
.viewport {
  overflow: hidden;
  border-radius: 12px;
}
.track {
  display: flex;
  transition: transform 0.45s ease;
}
.slide {
  min-width: 100%;
  padding: 2px;
}
.slide img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 12px;
}
.caption {
  margin-top: 0.5rem;
  font-size: 1.2rem;
}

.carousel-controls {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-top: 0.5rem;
}
.ctrl {
  background: #0b82ff;
  border: 0;
  border-radius: 999px;
  padding: 0.35rem 0.7rem;
  color: #fff;
  font-size: 1.25rem;
  line-height: 1;
  cursor: pointer;
}
.ctrl:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}
.dots {
  display: flex;
  gap: 0.35rem;
}
.dots button {
  width: 19px;
  height: 19px;
  border-radius: 50%;
  border: 0;
  background: #d7dee6;
  cursor: pointer;
}
.dots button.active {
  background: #0b82ff;
}

.site_header {
  position: relative;
  overflow: visible;
  z-index: 10;
}

.header_wrapper {
  gap: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 2.25rem;
}

.brand {
  position: relative;
  width: clamp(140px, 12vw, 200px);
}

.brand::before {
  content: "";
  position: absolute;
  aspect-ratio: 1 / 1;
  width: 160%;
  left: -30%;
  top: -160%;
  background: url("../images/index/sspv_evp_curva-b.png") center/contain
    no-repeat;
  z-index: 0;
  pointer-events: none;
}

.brand__logo {
  display: block;
  width: 100%;
  height: auto;
  position: relative;
  z-index: 1;
}

@media (max-width: 1400px) {
  .brand::before {
    width: 200%;
    left: -45%;
    top: -225%;
  }
}
@media (max-width: 1200px) {
  .brand::before {
    width: 190%;
    left: -45%;
    top: -225%;
  }
}
@media (max-width: 992px) {
  .header_wrapper {
    padding-bottom: 1.75rem;
  }
  .brand::before {
    width: 180%;
    left: -40%;
    top: -235%;
  }
}
@media (max-width: 576px) {
  .header_wrapper {
    padding-bottom: 1.5rem;
  }
  .brand::before {
    width: 170%;
    left: -38%;
    top: -230%;
  }
 
.section_heading {
    margin-bottom: 20px !important;
}
.posicion-play-personales {
    
    top: 150px !important;
   
}
}

.bg-busquedas {
  background-image: url("../images/index/sspv_evp-web_bg_2.png");
  min-height: 600px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position-y: 50%;
}

