/* K Solares V3.15.1 — sistema global de portadas fotográficas. */
.ks-page-hero,
.hero.ks-page-hero,
.policy-hero.ks-page-hero,
.about-hero.ks-page-hero,
.hero-video.ks-page-hero {
  position: relative !important;
  isolation: isolate !important;
  display: flex !important;
  align-items: center !important;
  min-height: clamp(340px, 48vh, 540px) !important;
  height: auto !important;
  max-height: none !important;
  overflow: hidden !important;
  border-bottom: 1px solid rgba(103, 232, 249, .18) !important;
  background: #02060a !important;
}

.ks-page-hero--home,
.hero-video.ks-page-hero--home {
  min-height: clamp(520px, 70vh, 760px) !important;
}

/* Inicio: unión continua entre la fotografía y la primera sección.
   El borde global de las portadas producía una línea cian de 1 px. */
.ks-page-hero--home,
.hero-video.ks-page-hero--home {
  margin-bottom: -1px !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-color: #020b12 !important;
}

.ks-page-hero--home > .hero-background-photo {
  inset: 0 0 -1px !important;
  height: calc(100% + 1px) !important;
}

html body .ks-page-hero--home::after {
  inset: 0 0 -1px !important;
  background:
    linear-gradient(90deg, rgba(0, 10, 18, .86) 0%, rgba(0, 10, 18, .66) 42%, rgba(0, 10, 18, .27) 100%),
    linear-gradient(180deg, rgba(0, 8, 14, .04) 0%, rgba(0, 8, 14, .08) 68%, rgba(2, 11, 18, .76) 88%, #020b12 100%) !important;
}

.ks-page-hero--home + .popular-kits-section {
  margin-top: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  background-image: linear-gradient(180deg, #020b12 0, rgba(2, 11, 18, .94) 28px, transparent 96px);
}

.ks-page-hero--compact,
.policy-hero.ks-page-hero--compact {
  min-height: clamp(320px, 40vh, 460px) !important;
}

.ks-page-hero > .hero-background-photo {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center center !important;
  opacity: 1 !important;
  visibility: visible !important;
  filter: saturate(1.03) contrast(1.02) brightness(.98) !important;
  transform: none !important;
  pointer-events: none !important;
}

.ks-page-hero::before {
  display: none !important;
  content: none !important;
  background: none !important;
}

.ks-page-hero::after {
  display: block !important;
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(90deg, rgba(0, 10, 18, .86) 0%, rgba(0, 10, 18, .68) 42%, rgba(0, 10, 18, .28) 100%),
    linear-gradient(0deg, rgba(0, 8, 14, .38) 0%, rgba(0, 8, 14, .04) 66%, rgba(0, 8, 14, .05) 100%) !important;
}

.ks-page-hero > .hero-content,
.ks-page-hero > .hero-video-content {
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: center !important;
  width: min(var(--max), calc(100% - 48px)) !important;
  max-width: none !important;
  min-height: inherit !important;
  margin: 0 auto !important;
  padding: 64px 0 58px !important;
  text-align: left !important;
}

.ks-page-hero > .hero-content > *,
.ks-page-hero > .hero-video-content > * {
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}

.ks-page-hero .eyebrow {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin: 0 0 12px !important;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
}

.ks-page-hero h1,
.ks-page-hero .hero-title-v240 {
  width: 100% !important;
  max-width: 820px !important;
  margin: 0 !important;
  font-family: "Montserrat", Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(40px, 4.6vw, 68px) !important;
  font-weight: 700 !important;
  font-style: normal !important;
  line-height: 1.03 !important;
  letter-spacing: -.035em !important;
  text-wrap: balance !important;
  text-shadow: 0 8px 28px rgba(0, 0, 0, .5) !important;
}

.ks-page-hero .hero-title-v240 span {
  white-space: normal !important;
}

.ks-page-hero .lead,
.ks-page-hero > .hero-content > p,
.ks-page-hero > .hero-video-content > p {
  max-width: 680px !important;
  margin-top: 16px !important;
  margin-bottom: 0 !important;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(15px, 1.3vw, 18px) !important;
  font-weight: 400 !important;
  line-height: 1.55 !important;
  color: #d7e3ec !important;
  text-shadow: 0 6px 20px rgba(0, 0, 0, .5) !important;
}

.ks-page-hero .hero-actions,
.ks-page-hero .hero-video-actions,
.ks-page-hero .button-row {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
  width: auto !important;
  margin-top: 22px !important;
  font-family: Inter, ui-sans-serif, system-ui, sans-serif !important;
}

.ks-page-hero.hero-contact-v231 > .hero-background-photo { object-position: center 52% !important; }
.ks-page-hero.hero-shop-v231 > .hero-background-photo { object-position: center 55% !important; }
.ks-page-hero.hero-about-v231 > .hero-background-photo { object-position: center 44% !important; }
.ks-page-hero.policy-hero.hero-portada-v236 > .hero-background-photo { object-position: center 42% !important; }

@media (max-width: 768px) {
  .ks-page-hero,
  .hero.ks-page-hero,
  .policy-hero.ks-page-hero,
  .about-hero.ks-page-hero {
    min-height: 300px !important;
  }

  .ks-page-hero--home,
  .hero-video.ks-page-hero--home {
    min-height: 430px !important;
  }

  html body .ks-page-hero.hero-photo-active::after {
    background:
      linear-gradient(90deg, rgba(0, 10, 18, .48) 0%, rgba(0, 10, 18, .38) 72%, rgba(0, 10, 18, .26) 100%),
      linear-gradient(0deg, rgba(0, 8, 14, .18) 0%, rgba(0, 8, 14, .02) 70%, rgba(0, 8, 14, .03) 100%) !important;
  }

  .ks-page-hero > .hero-content,
  .ks-page-hero > .hero-video-content {
    width: min(100% - 40px, var(--max)) !important;
    min-height: inherit !important;
    padding: 56px 0 !important;
  }

  .ks-page-hero h1,
  .ks-page-hero .hero-title-v240 {
    max-width: 100% !important;
    font-size: clamp(32px, 9vw, 46px) !important;
    line-height: 1.05 !important;
  }

  .ks-page-hero .lead,
  .ks-page-hero > .hero-content > p,
  .ks-page-hero > .hero-video-content > p {
    max-width: 100% !important;
    font-size: 15px !important;
  }
}

@media (max-width: 480px) {
  .ks-page-hero > .hero-content,
  .ks-page-hero > .hero-video-content {
    width: min(100% - 40px, var(--max)) !important;
  }

  .ks-page-hero h1,
  .ks-page-hero .hero-title-v240 {
    font-size: clamp(30px, 9vw, 40px) !important;
  }

  .ks-page-hero .hero-actions,
  .ks-page-hero .hero-video-actions,
  .ks-page-hero .button-row {
    width: 100% !important;
    flex-direction: column !important;
    align-items: stretch !important;
  }

  .ks-page-hero .hero-actions a,
  .ks-page-hero .hero-actions button,
  .ks-page-hero .hero-video-actions a,
  .ks-page-hero .hero-video-actions button,
  .ks-page-hero .button-row a,
  .ks-page-hero .button-row button {
    width: 100% !important;
    justify-content: center !important;
  }
}

/* La portada principal tenía selectores históricos de mayor especificidad. */
html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content {
  width: min(var(--max), calc(100% - 48px)) !important;
  margin: 0 auto !important;
  align-items: flex-start !important;
  justify-content: center !important;
  text-align: left !important;
}

html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content > *,
html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content h1,
html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content p,
html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content .eyebrow {
  align-self: flex-start !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  text-align: left !important;
}

html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content h1 {
  max-width: 820px !important;
  font-family: "Montserrat", Inter, ui-sans-serif, system-ui, sans-serif !important;
  font-size: clamp(40px, 4.6vw, 68px) !important;
  font-weight: 700 !important;
  line-height: 1.03 !important;
}

html body .hero-video.hero-static.hero-home-v231.ks-page-hero .hero-video-actions {
  justify-content: flex-start !important;
  align-items: center !important;
}

@media (max-width: 768px) {
  html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content {
    width: min(100% - 40px, var(--max)) !important;
  }

  html body .hero-video.hero-static.hero-home-v231.ks-page-hero > .hero-video-content h1 {
    max-width: 100% !important;
    font-size: clamp(32px, 9vw, 46px) !important;
  }
}