/* Surin Sports homepage, October 2026. Only: +20% banner frame and clean purple background.
   The former desktop maximum was 1200x365; this version is 1440x438 (exactly 120%).
   Smaller viewports are width-capped to prevent horizontal overflow. */

html body.public-site.hybrid-navigation.page-index {
  background-color:#2c1048!important;
  background-image:linear-gradient(to bottom,
    #2c1048 0px,
    #321451 220px,
    #3b1a5b 410px,
    #623f7c 560px,
    #e5dbed 710px,
    #f8f9fb 870px,
    #f8f9fb 100%)!important;
  background-attachment:scroll!important;
}
/* The previously installed stadium/track/photo pseudo-elements are removed.
   No extra photographic or radial pattern sits behind the header or banner. */
html body.public-site.hybrid-navigation.page-index::before,
html body.public-site.hybrid-navigation.page-index::after,
html body.public-site.hybrid-navigation.page-index .page-content::before,
html body.public-site.hybrid-navigation.page-index .page-content::after,
html body.public-site.hybrid-navigation.page-index section.premium-home-hero.home-image-hero::before,
html body.public-site.hybrid-navigation.page-index section.premium-home-hero.home-image-hero::after {
  content:none!important;
  display:none!important;
  background:none!important;
  background-image:none!important;
  filter:none!important;
}
html body.public-site.hybrid-navigation.page-index .page-content {
  background:transparent!important;
  background-image:none!important;
}
/* 1200 -> 1440; 365 -> 438. No stretching or modification to image assets. */
html body.public-site.hybrid-navigation.page-index section.premium-home-hero.home-image-hero {
  width:min(1440px,calc(100% - 24px))!important;
  max-width:1440px!important;
  height:clamp(336px,31.68vw,438px)!important;
  min-height:0!important;
  max-height:438px!important;
  aspect-ratio:auto!important;
  margin:18px auto 0!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:transparent!important;
}
html body.public-site.hybrid-navigation.page-index .premium-home-hero.home-image-hero .hero-slides {
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  max-height:none!important;
  aspect-ratio:auto!important;
  overflow:hidden!important;
  background:transparent!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html body.public-site.hybrid-navigation.page-index .premium-home-hero.home-image-hero .hero-slide img,
html body.public-site.hybrid-navigation.page-index .premium-home-hero.home-image-hero picture img {
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center 58%!important;
  filter:none!important;
  transform:none!important;
}
@media(max-width:1100px){
  html body.public-site.hybrid-navigation.page-index section.premium-home-hero.home-image-hero {
    width:calc(100% - 16px)!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:1916 / 821!important;
    margin:14px auto 0!important;
    border-radius:18px!important;
  }
}
@media(max-width:600px){
  html body.public-site.hybrid-navigation.page-index {
    background-image:linear-gradient(to bottom,
      #2c1048 0px,
      #361754 120px,
      #4c2b68 235px,
      #f4f0f8 380px,
      #f8f9fb 520px,
      #f8f9fb 100%)!important;
  }
  html body.public-site.hybrid-navigation.page-index section.premium-home-hero.home-image-hero {
    width:calc(100% - 12px)!important;
    max-width:none!important;
    height:auto!important;
    max-height:none!important;
    aspect-ratio:1130 / 581!important;
    margin:10px auto 0!important;
    border-radius:15px!important;
  }
}
