/* Slovra V6 — PART 1.12 Simple Hero
   Removes the interactive/slider hero in favour of one short, stable banner. */

#screen-home .hero-banner-container{
  overflow:visible!important;
}
#screen-home.slovra-home-simple .hero-banner{
  position:relative!important;
  min-height:154px!important;
  height:154px!important;
  padding:0!important;
  overflow:hidden!important;
  isolation:isolate!important;
  border:0!important;
  outline:0!important;
  border-radius:26px!important;
  background:
    radial-gradient(340px 180px at 88% 8%,rgba(87,219,255,.34),transparent 66%),
    radial-gradient(300px 190px at 14% 110%,rgba(255,89,177,.30),transparent 68%),
    linear-gradient(108deg,#6f35ef 0%,#a43ed8 46%,#168cac 100%)!important;
  box-shadow:0 20px 54px rgba(0,0,0,.20)!important;
}
#screen-home.slovra-home-simple .hero-banner::before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  background:
    linear-gradient(118deg,rgba(255,255,255,.10),transparent 25% 72%,rgba(255,255,255,.06)),
    radial-gradient(circle at 75% 45%,rgba(255,255,255,.08) 0 1px,transparent 2px)!important;
  background-size:auto,32px 32px!important;
  mix-blend-mode:screen!important;
  opacity:.72!important;
}
#screen-home.slovra-home-simple .hero-banner::after{
  display:none!important;
  content:none!important;
}

#screen-home .slovra-static-hero{
  position:relative!important;
  z-index:2!important;
  width:100%!important;
  height:154px!important;
  min-height:154px!important;
  display:flex!important;
  align-items:center!important;
  padding:18px 94px 18px 24px!important;
  box-sizing:border-box!important;
}
#screen-home .slovra-static-hero-copy{
  width:min(720px,100%)!important;
  min-width:0!important;
  display:grid!important;
  gap:8px!important;
  align-content:center!important;
}
#screen-home .slovra-static-hero-kicker{
  width:max-content!important;
  display:inline-flex!important;
  align-items:center!important;
  min-height:22px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.13)!important;
  border:1px solid rgba(255,255,255,.18)!important;
  color:rgba(255,255,255,.92)!important;
  font:800 8px/1 'Nunito',system-ui,sans-serif!important;
  letter-spacing:.13em!important;
}
#screen-home .slovra-static-hero #welcome-msg{
  margin:0!important;
  max-width:620px!important;
  color:#fff!important;
  font-family:'Nunito',system-ui,sans-serif!important;
  font-size:30px!important;
  line-height:1!important;
  font-weight:800!important;
  letter-spacing:-.035em!important;
  text-align:left!important;
  text-shadow:0 2px 15px rgba(32,18,54,.14)!important;
}
#screen-home .slovra-static-hero-action-row{
  width:min(600px,100%)!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:end!important;
  gap:12px!important;
}
#screen-home .slovra-static-hero-progress{
  min-width:0!important;
}
#screen-home .slovra-static-hero .overall-progress{
  width:100%!important;
  height:5px!important;
  margin:0!important;
  border-radius:99px!important;
  background:rgba(255,255,255,.23)!important;
  overflow:hidden!important;
}
#screen-home .slovra-static-hero .overall-progress-fill{
  height:100%!important;
  border-radius:inherit!important;
  background:linear-gradient(90deg,#fff,#b9ffe6)!important;
  box-shadow:0 0 12px rgba(255,255,255,.28)!important;
}
#screen-home .slovra-static-hero .progress-label{
  margin-top:5px!important;
  color:rgba(255,255,255,.82)!important;
  font:800 9px/1.15 'Nunito',system-ui,sans-serif!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
#screen-home .slovra-static-hero-cta{
  min-height:32px!important;
  padding:0 12px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:6px!important;
  border:0!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.94)!important;
  color:#25212c!important;
  box-shadow:0 8px 22px rgba(24,16,40,.16)!important;
  font:800 10px/1 'Nunito',system-ui,sans-serif!important;
  cursor:pointer!important;
  transition:transform .18s ease,filter .18s ease!important;
}
#screen-home .slovra-static-hero-cta:hover{transform:translateY(-1px)!important;filter:brightness(1.02)!important}
#screen-home .slovra-static-hero-cta .slovra-icon{
  width:12px!important;height:12px!important;flex:0 0 12px!important;
  --icon-main:currentColor;--icon-accent:currentColor;
}

/* The level badge is the only secondary object in the banner. */
#screen-home .hero-banner #slovra-home-level{
  position:absolute!important;
  z-index:5!important;
  right:14px!important;
  top:14px!important;
  width:62px!important;
  height:62px!important;
  padding:7px!important;
  border-radius:18px!important;
  border:1px solid rgba(255,255,255,.17)!important;
  outline:0!important;
  background:rgba(24,20,34,.20)!important;
  color:#fff!important;
  backdrop-filter:blur(10px)!important;
  box-shadow:none!important;
}
#screen-home .hero-banner #slovra-home-level small{color:rgba(255,255,255,.76)!important;font-size:6px!important}
#screen-home .hero-banner #slovra-home-level strong{color:#fff!important;font-size:16px!important}
#screen-home .hero-banner #slovra-home-level em{color:rgba(255,255,255,.72)!important;font-size:6px!important}
#screen-home .hero-banner #slovra-home-level .slovra-home-level-track{height:4px!important;background:rgba(255,255,255,.24)!important}

/* Any legacy interactive/slideshow leftovers are not part of the simple hero. */
#screen-home .slovra-hero-slider,
#screen-home .slovra-hero-nav,
#screen-home .slovra-hero-interactive,
#screen-home .slovra-hero-motion-stage,
#screen-home .slovra-hero-drag-hint{display:none!important}

/* Light mode deliberately keeps a coloured banner: no black copy and no contour frame. */
body.light-mode #screen-home.slovra-home-simple .hero-banner,
body.light #screen-home.slovra-home-simple .hero-banner{
  border:0!important;
  outline:0!important;
  background:
    radial-gradient(340px 180px at 88% 8%,rgba(87,219,255,.38),transparent 66%),
    radial-gradient(300px 190px at 14% 110%,rgba(255,101,190,.32),transparent 68%),
    linear-gradient(108deg,#7540ee 0%,#ac46d7 47%,#1f91b0 100%)!important;
  box-shadow:0 18px 48px rgba(72,49,114,.18)!important;
}
body.light-mode #screen-home .slovra-static-hero #welcome-msg,
body.light #screen-home .slovra-static-hero #welcome-msg{color:#fff!important}

@media(max-width:720px){
  #screen-home .hero-banner-container{
    width:calc(100% - 20px)!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  #screen-home.slovra-home-simple .hero-banner{
    min-height:128px!important;
    height:128px!important;
    border-radius:19px!important;
    box-shadow:0 12px 30px rgba(0,0,0,.15)!important;
  }
  #screen-home .slovra-static-hero{
    height:128px!important;
    min-height:128px!important;
    padding:11px 56px 11px 13px!important;
  }
  #screen-home .slovra-static-hero-copy{gap:6px!important}
  #screen-home .slovra-static-hero-kicker{
    min-height:18px!important;
    padding:0 7px!important;
    font-size:6.3px!important;
    letter-spacing:.11em!important;
  }
  #screen-home .slovra-static-hero #welcome-msg{
    max-width:100%!important;
    font-size:20px!important;
    line-height:1.02!important;
    letter-spacing:-.025em!important;
    padding:0!important;
  }
  #screen-home .slovra-static-hero-action-row{
    width:100%!important;
    gap:8px!important;
  }
  #screen-home .slovra-static-hero .overall-progress{height:4px!important}
  #screen-home .slovra-static-hero .progress-label{
    margin-top:4px!important;
    font-size:7.4px!important;
  }
  #screen-home .slovra-static-hero-cta{
    min-height:28px!important;
    padding:0 9px!important;
    gap:4px!important;
    font-size:8.2px!important;
  }
  #screen-home .slovra-static-hero-cta .slovra-icon{width:9px!important;height:9px!important;flex-basis:9px!important}
  #screen-home .hero-banner #slovra-home-level{
    width:42px!important;
    height:42px!important;
    right:8px!important;
    top:8px!important;
    padding:5px!important;
    border-radius:12px!important;
  }
  #screen-home .hero-banner #slovra-home-level small{font-size:4.8px!important}
  #screen-home .hero-banner #slovra-home-level strong{font-size:11.5px!important}
  #screen-home .hero-banner #slovra-home-level em{display:none!important}
  #screen-home .hero-banner #slovra-home-level .slovra-home-level-track{height:3px!important;margin-top:2px!important}
}

@media(max-width:390px){
  #screen-home.slovra-home-simple .hero-banner,
  #screen-home .slovra-static-hero{height:120px!important;min-height:120px!important}
  #screen-home .slovra-static-hero{padding:10px 52px 10px 12px!important}
  #screen-home .slovra-static-hero #welcome-msg{font-size:18.5px!important}
  #screen-home .slovra-static-hero-kicker{font-size:5.9px!important}
  #screen-home .slovra-static-hero-cta span{display:none!important}
  #screen-home .slovra-static-hero-cta{width:28px!important;padding:0!important}
}

@media(prefers-reduced-motion:reduce){
  #screen-home .slovra-static-hero-cta{transition:none!important}
}
body.slovra-reduce-motion #screen-home .slovra-static-hero-cta{transition:none!important}
