/* Hero A (V4): portrait right, stacked name, full-screen hero, warm halo behind the person, no next-gathering card.
   Fonts and violet palette are unchanged; the warm tone is only used for the halo. Desktop rules apply to wide screens. */

/* ---- title: hidden only until the split script has run (3s safety net so it can never stay hidden) ---- */
@keyframes wcVis{to{visibility:visible}}
.artist-hero-v2 .wc-name>div{visibility:hidden;animation:wcVis 0s 3s forwards!important}
html.wc-split .artist-hero-v2 .wc-name>div{visibility:visible!important;animation:none!important;background:none!important}
.artist-hero-v2 .wc-line{display:block;overflow:hidden;padding:.08em .04em .16em;margin:-.08em -.04em -.16em}
.artist-hero-v2 .wc-ch{display:inline-block;will-change:transform;
  background:linear-gradient(180deg,#fff 8%,#e3d2ff 55%,#b995f2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* ---- bright blob in the middle of the old hero is gone ---- */
.artist-hero-v2 .wc-glow{display:none!important}

/* Remove the legacy white intro ball layered over the portrait during page load. */
#home.artist-hero-v2 [data-story-circle="intro"]{display:none!important}

/* ---- warm halo behind the person ---- */
.wc-warm{position:absolute;left:50%;top:46%;width:150%;height:0;padding-bottom:150%;margin-left:-75%;margin-top:-75%;z-index:0;pointer-events:none;opacity:0;transform:scale(.8)}
.wc-warm i{position:absolute;border-radius:50%;filter:blur(46px);will-change:transform,opacity}
.wc-warm i:nth-child(1){inset:24% 22%;background:radial-gradient(closest-side,rgba(206,112,58,.42),rgba(176,84,60,.2) 55%,transparent 100%)}
.wc-warm i:nth-child(2){left:44%;top:10%;width:40%;height:40%;background:radial-gradient(closest-side,rgba(232,150,86,.22),transparent 100%)}
.wc-warm i:nth-child(3){left:10%;top:48%;width:46%;height:46%;background:radial-gradient(closest-side,rgba(138,64,118,.26),transparent 100%)}
/* no drop-shadow on the photo: the picture mask would clip it into a visible box */
.artist-hero-v2 [data-main-image] img{filter:contrast(1.04)!important}

@media (min-width:1200px) and (min-aspect-ratio:3/2){
 /* one full screen */
 #home.artist-hero-v2 .intro-section-block{height:100vh!important;max-height:none!important;min-height:620px}
 #home.artist-hero-v2 .wc-stage{height:calc(100vh + 130px)!important}

 /* name: two big stacked lines on the left */
 #home.artist-hero-v2 .wc-name{
  display:block!important;width:fit-content!important;max-width:none!important;margin:0 0 clamp(18px,2.4vh,34px)!important;padding:0!important;gap:0!important;
  font-size:clamp(76px,10.2vw,200px)!important;line-height:.86!important;text-align:left!important;position:relative;z-index:6}
 #home.artist-hero-v2 .wc-name:before{display:none!important}
 #home.artist-hero-v2 .wc-name>div{display:block;grid-column:auto!important;grid-row:auto!important;justify-self:auto!important;min-width:0!important;left:0!important;font-size:1em!important;white-space:nowrap}

 /* portrait: right, bigger, sitting on the bottom of the screen */
 #home.artist-hero-v2 .wc-portrait-wrap{justify-content:flex-end!important;align-items:flex-end!important;padding:76px clamp(20px,3.4vw,84px) 0 0!important}
 #home.artist-hero-v2 .wc-portrait-wrap>div{left:0!important;max-width:none!important;width:min(50vw,calc((100vh - 76px)*.758))!important}
 .artist-hero-v2 [data-main-image] picture{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 68%,rgba(0,0,0,.55) 84%,transparent 98%);mask-image:linear-gradient(180deg,#000 0%,#000 68%,rgba(0,0,0,.55) 84%,transparent 98%)}

 /* buttons side by side */
 #home.artist-hero-v2 .wc-cta{flex-direction:row!important;flex-wrap:wrap!important;align-items:center!important;max-width:none!important;gap:1.2rem 1.6rem!important}

 /* scroll cue: middle of the hero, at the bottom */
 #home.artist-hero-v2 .wc-hint--hero{position:absolute!important;left:50%!important;right:auto!important;bottom:clamp(16px,3.4vh,40px)!important;transform:translateX(-50%)!important;margin:0!important;width:auto!important;z-index:9}
}
@media (min-width:1200px) and (max-width:1399.98px) and (min-aspect-ratio:3/2){
 #home.artist-hero-v2 .wc-name{font-size:9vw!important}
 #home.artist-hero-v2 .wc-portrait-wrap>div{width:min(45vw,calc((100vh - 76px)*.758))!important}
}

.artist-hero-v2 .wc-name{perspective:700px}

/* ---- tablets and phones: one screen. Portrait fills the space above, the title sits directly BELOW it (never over his hands or the guitar). ---- */
@media (max-width:1199.98px), (max-aspect-ratio:3/2){
 html{--wc-hh:max(100svh,560px)}
 #home.artist-hero-v2 .wc-stage{height:calc(var(--wc-hh) + 130px)!important}
 #home.artist-hero-v2 .intro-section-block{position:relative!important;display:flex!important;flex-direction:column;justify-content:flex-start;
  height:var(--wc-hh)!important;min-height:0!important;max-height:none!important;
  padding:clamp(52px,7svh,76px) 0 calc(clamp(14px,2.6svh,28px) + 84px)!important}
 #home.artist-hero-v2 .intro-section-block>.w-full{display:flex;flex-direction:column;align-items:center;position:static;width:100%;flex:1 1 auto;min-height:0}

 /* portrait: use one shared phone-sized portrait block on every non-desktop screen */
 #home.artist-hero-v2 .wc-portrait-wrap{position:relative!important;left:auto!important;top:auto!important;width:100%!important;height:min(46svh,452px)!important;flex:0 1 min(46svh,452px);min-height:0;
  margin:0!important;padding:0!important;display:flex!important;justify-content:center!important;align-items:flex-start!important}
 #home.artist-hero-v2 .wc-portrait-wrap:after{display:none!important}
 #home.artist-hero-v2 .wc-portrait-wrap>div{left:0!important;max-width:min(76vw,342px)!important;height:100%!important;width:auto!important;aspect-ratio:1365/1800}
 #home.artist-hero-v2 [data-main-image],#home.artist-hero-v2 [data-main-image] picture{height:100%}
 .artist-hero-v2 [data-main-image] picture{-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 72%,rgba(0,0,0,.45) 88%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 72%,rgba(0,0,0,.45) 88%,transparent 100%)}

 /* title: right under the portrait */
 #home.artist-hero-v2 .wc-name,#home.artist-hero-v2 .hero-line-wrap,#home.artist-hero-v2 .wc-cta{position:relative;z-index:6;flex:none}
 #home.artist-hero-v2 .hero-line-wrap{text-align:center!important}
 #home.artist-hero-v2 .wc-name{display:block!important;width:auto!important;max-width:none!important;margin:clamp(2px,.6svh,8px) 0 clamp(8px,1.4svh,16px)!important;padding:0!important;gap:0!important;
  text-align:center!important;font-size:clamp(52px,15vw,60px)!important;line-height:.88!important}
 #home.artist-hero-v2 .wc-name:before{display:none!important}
 #home.artist-hero-v2 .wc-name>div{display:block;grid-column:auto!important;grid-row:auto!important;justify-self:auto!important;min-width:0!important;left:0!important;font-size:1em!important;white-space:nowrap}
 #home.artist-hero-v2 .wc-cta{width:auto!important;max-width:calc(100vw - 28px)!important;flex-direction:row!important;flex-wrap:wrap!important;justify-content:center!important;gap:12px 8px!important;margin-top:clamp(12px,2svh,24px)!important}
 #home.artist-hero-v2 .wc-cta .btn{width:auto!important;min-width:0!important;padding-left:2.2rem!important;padding-right:2.2rem!important}
 #home.artist-hero-v2 .wc-hint--hero{position:absolute!important;left:50%!important;right:auto!important;bottom:clamp(14px,2.6svh,28px)!important;transform:translateX(-50%)!important;margin:0!important;width:auto!important;z-index:9}
}