/* MYKE — homepage campaign image. No changes to editorial/layout content. */
.hero.hero-rio{isolation:isolate;min-height:810px;background:radial-gradient(ellipse at 87% 60%,#293038 0%,#17191b 47%,#111214 85%)}
.hero.hero-rio .hero-rio-art{position:absolute;inset:0;overflow:hidden;z-index:0;pointer-events:none}
.hero.hero-rio .hero-rio-art img{position:absolute;right:-2%;top:-3%;height:123%;width:auto;max-width:none;object-fit:contain;object-position:center;filter:brightness(.77) saturate(.76) contrast(1.05);clip-path:none;-webkit-mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.75) 18%,#000 55%);mask-image:linear-gradient(90deg,transparent 0%,rgba(0,0,0,.75) 18%,#000 55%)}
.hero.hero-rio .hero-rio-art::after{display:none;content:"";position:absolute;inset:0;background:linear-gradient(90deg,#111214 0%,rgba(17,18,20,.90) 22%,rgba(17,18,20,.58) 44%,rgba(17,18,20,.05) 100%),linear-gradient(0deg,#111214 0%,rgba(17,18,20,.25) 15%,transparent 39%);pointer-events:none}
.hero.hero-rio::before{z-index:2;border-color:rgba(233,238,242,.2)}
.hero.hero-rio::after{z-index:1;opacity:.38}
.hero.hero-rio .container{z-index:3}
.hero.hero-rio .hero-bottom{z-index:4}
.hero.hero-rio .eyebrow,.hero.hero-rio h1,.hero.hero-rio .hero-lede,.hero.hero-rio .cta{position:relative;z-index:1}
@media(min-width:801px){
 .hero.hero-rio{
  background-image:
   linear-gradient(90deg,#111214 0%,rgba(17,18,20,.97) 25%,rgba(17,18,20,.76) 49%,rgba(17,18,20,.18) 77%,rgba(17,18,20,.06) 100%),
   url("assets/myke-rio-hero.webp");
  background-repeat:no-repeat,no-repeat;
  background-size:cover,auto 122%;
  background-position:center center,right -2vw top -18px
 }
 .hero.hero-rio .hero-rio-art{display:none}
}
@media(max-width:800px){
 .hero.hero-rio{min-height:800px;align-items:flex-start}
 .hero.hero-rio .hero-rio-art{z-index:1}
 .hero.hero-rio .hero-rio-art img{
   width:min(calc(100vw - 20px),500px);
   height:auto;top:220px;right:10px;max-width:none;
   object-fit:contain;object-position:center;clip-path:none;
   -webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 9%,#000 89%,transparent 100%);
   mask-image:linear-gradient(to bottom,transparent 0%,#000 9%,#000 89%,transparent 100%);
   filter:brightness(.84) saturate(.88) contrast(1.04)
 }
 .hero.hero-rio .hero-rio-art::after{
   display:block;
   background:linear-gradient(90deg,rgba(17,18,20,.72) 0%,rgba(17,18,20,.50) 32%,rgba(17,18,20,.08) 93%),linear-gradient(180deg,#111214 4%,transparent 23%,transparent 84%,#111214 100%)
 }
 .hero.hero-rio::before{width:760px;height:760px;right:-480px;top:20px;box-shadow:0 0 0 95px rgba(190,204,223,.013),0 0 0 210px rgba(190,204,223,.008)}
 .hero.hero-rio .container{padding-top:104px;padding-bottom:148px}
 .hero.hero-rio h1{font-size:clamp(58px,13.9vw,100px)}
}
@media(max-width:450px){
 .hero.hero-rio{min-height:780px}
 .hero.hero-rio .container{padding-top:83px;padding-bottom:147px}
 .hero.hero-rio h1{font-size:clamp(51px,14.8vw,64px);line-height:.99;letter-spacing:-.089em;margin-top:35px;margin-bottom:27px}
 .hero.hero-rio .hero-lede{font-size:15px;max-width:330px;line-height:1.65;margin-bottom:39px;color:#e0ddda}
 .hero.hero-rio .eyebrow{font-size:9px;letter-spacing:.20em}
 .hero.hero-rio .cta{min-width:235px;min-height:54px}
 .hero.hero-rio .hero-rio-art img{width:calc(100vw - 16px);right:8px;top:250px;height:auto;object-fit:contain;object-position:center}
 .hero.hero-rio::before{width:660px;height:660px;right:-446px;top:90px}
}
@media(max-width:390px){
 .hero.hero-rio .hero-rio-art img{width:calc(100vw - 16px);right:8px;top:267px;height:auto}
}
@media(max-width:360px){
 .hero.hero-rio h1{font-size:clamp(47px,14vw,56px)}
 .hero.hero-rio .eyebrow{font-size:8px;letter-spacing:.16em}
}