/* =============================================================
   LA ROJA RP v1.22 — PORTADA CALCADA AL MOCKUP APORTADO
   SOLO PORTADA. El resto de la v1.21 queda intacto.
   ============================================================= */

/* Hero exact proportions from the reference screenshot */
.lr121-hero{
  height:552px!important;
  min-height:552px!important;
  max-height:552px!important;
  grid-template-columns:minmax(0,1.53fr) minmax(350px,.47fr)!important;
  gap:20px!important;
  padding:24px 48px 76px!important;
  align-items:center!important;
  background:
    linear-gradient(90deg,rgba(0,0,0,.68) 0%,rgba(4,1,1,.28) 42%,rgba(3,1,1,.07) 69%,rgba(2,1,1,.22) 100%),
    url("visuals-v121/hero-exact-clean.jpg") center center/cover no-repeat!important;
  box-shadow:inset 0 -74px 94px rgba(0,0,0,.46)!important;
}

/* left content */
.lr114-home-copy{
  max-width:670px!important;
  align-self:center!important;
  margin-top:0!important;
}
.lr114-home-copy .lr19-kicker{
  font-size:9px!important;
  margin-bottom:2px!important;
}
.lr114-home-copy h1{
  font-size:74px!important;
  line-height:.86!important;
  letter-spacing:-.06em!important;
  margin:4px 0 0!important;
  white-space:nowrap!important;
}
.lr114-home-copy h1:after{
  width:47%!important;
  margin-top:8px!important;
}
.lr114-home-copy h2{
  font-size:19px!important;
  margin:12px 0 8px!important;
  line-height:1.1!important;
}
.lr114-home-copy p{
  max-width:600px!important;
  font-size:12px!important;
  line-height:1.6!important;
  margin:0!important;
}
.lr19-home-actions{
  margin-top:18px!important;
  gap:11px!important;
}
.lr19-home-actions a{
  min-width:173px!important;
  min-height:42px!important;
  font-size:9px!important;
  border-radius:6px!important;
}
.lr19-home-meta{
  margin-top:15px!important;
  gap:15px!important;
  font-size:8px!important;
}

/* Right column */
.lr116-hero-side{
  width:335px!important;
  justify-self:end!important;
  align-self:center!important;
  gap:9px!important;
}

/* Promo box */
.lr116-promo-card{
  width:100%!important;
  padding:14px 15px 13px!important;
  border-radius:7px!important;
}
.lr116-promo-kicker{
  font-size:8px!important;
}
.lr116-promo-value{
  font-size:42px!important;
  line-height:.92!important;
  margin:4px 0 0!important;
}
.lr116-promo-sub{
  font-size:9px!important;
}
.lr116-promo-code{
  min-height:38px!important;
  margin:9px 0 7px!important;
  font-size:8px!important;
}
.lr116-promo-code b{
  font-size:11px!important;
}
.lr116-promo-timer-wrap{
  padding-top:6px!important;
}
.lr116-promo-timer{
  gap:4px!important;
  margin-top:4px!important;
}
.lr116-promo-timer>span{
  min-width:47px!important;
  min-height:38px!important;
  padding:4px!important;
  font-size:12px!important;
}
.lr116-promo-cta{
  min-height:38px!important;
  margin-top:8px!important;
  font-size:8px!important;
}

/* Discord panel */
.lr116-discord-panel{
  width:100%!important;
  min-height:104px!important;
  max-height:104px!important;
  padding:11px 12px!important;
  border-radius:7px!important;
  display:grid!important;
  grid-template-columns:1fr 58px!important;
  grid-template-areas:
    "title icon"
    "copy icon"
    "button button"!important;
  align-items:center!important;
  column-gap:10px!important;
}
.lr116-discord-panel>span{
  grid-area:title!important;
  font-size:8px!important;
  margin:0!important;
}
.lr116-discord-panel>p{
  grid-area:copy!important;
  font-size:7px!important;
  line-height:1.35!important;
  margin:0!important;
}
.lr116-discord-panel>.lr19-discord-big{
  grid-area:icon!important;
  width:58px!important;
  height:58px!important;
  margin:0!important;
}
.lr116-discord-panel>.lr19-discord-big svg{
  width:54px!important;
  height:42px!important;
}
.lr116-discord-panel>.lr19-discord-login-main{
  grid-area:button!important;
  min-height:34px!important;
  margin:3px 0 0!important;
  font-size:8px!important;
}

/* Bottom four tiles exactly anchored */
.lr115-roleplay-stats{
  left:48px!important;
  bottom:14px!important;
  width:806px!important;
  height:66px!important;
  grid-template-columns:repeat(4,1fr)!important;
}
.lr115-roleplay-stats>div{
  min-height:64px!important;
  padding:9px 10px!important;
}
.lr115-roleplay-stats b{
  font-size:11px!important;
}
.lr115-roleplay-stats span{
  font-size:7px!important;
}

/* remove anything else from home hero bottom */
.lr113-payments-card{
  display:none!important;
}

/* preserve composition without pointer background movement */
.lr121-hero{
  background-position:center center!important;
}

/* Stronger attention animations while keeping geometry fixed */
.lr114-home-copy h1{
  animation:lr122TitleGlow 2.8s ease-in-out infinite!important;
}
.lr114-home-copy h1 strong{
  animation:lr122RPGlow 1.45s ease-in-out infinite!important;
}
.lr19-home-actions a{
  animation:lr122ButtonPulse 3s ease-in-out infinite!important;
}
.lr19-home-actions a:nth-child(2){
  animation-delay:.35s!important;
}
.lr116-promo-card{
  animation:lr122PromoFloat 2.4s ease-in-out infinite!important;
}
.lr116-promo-value{
  animation:lr122DiscountPulse 1.7s ease-in-out infinite!important;
}
.lr116-promo-code{
  animation:lr122CodeGlow 2s ease-in-out infinite!important;
}
.lr116-discord-panel{
  animation:lr122DiscordGlow 3s ease-in-out infinite!important;
}
.lr115-roleplay-stats>div{
  animation:lr122StatFloat 3.8s ease-in-out infinite!important;
}
.lr115-roleplay-stats>div:nth-child(2){animation-delay:.3s!important}
.lr115-roleplay-stats>div:nth-child(3){animation-delay:.6s!important}
.lr115-roleplay-stats>div:nth-child(4){animation-delay:.9s!important}

/* Hover sparkle */
.lr19-home-actions a:hover,
.lr116-promo-cta:hover,
.lr116-discord-panel>.lr19-discord-login-main:hover{
  transform:translateY(-3px) scale(1.025)!important;
  box-shadow:0 14px 35px rgba(0,0,0,.42),0 0 24px rgba(238,32,37,.22)!important;
  filter:brightness(1.14)!important;
}

@keyframes lr122TitleGlow{
  0%,100%{filter:brightness(1);text-shadow:0 14px 36px rgba(0,0,0,.75)}
  50%{filter:brightness(1.08);text-shadow:0 14px 36px rgba(0,0,0,.75),0 0 16px rgba(255,255,255,.08)}
}
@keyframes lr122RPGlow{
  0%,100%{filter:brightness(1);text-shadow:0 0 8px rgba(238,32,37,.22)}
  50%{filter:brightness(1.35);text-shadow:0 0 17px rgba(238,32,37,.58),0 0 30px rgba(238,32,37,.28)}
}
@keyframes lr122ButtonPulse{
  0%,100%{box-shadow:0 8px 24px rgba(0,0,0,.30)}
  50%{box-shadow:0 12px 32px rgba(0,0,0,.42),0 0 18px rgba(238,32,37,.18)}
}
@keyframes lr122PromoFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-3px)}
}
@keyframes lr122DiscountPulse{
  0%,100%{transform:scale(1);filter:brightness(1)}
  50%{transform:scale(1.04);filter:brightness(1.28)}
}
@keyframes lr122CodeGlow{
  0%,100%{box-shadow:0 0 0 rgba(255,193,58,0)}
  50%{box-shadow:0 0 17px rgba(255,193,58,.13)}
}
@keyframes lr122DiscordGlow{
  0%,100%{box-shadow:0 14px 34px rgba(0,0,0,.35)}
  50%{box-shadow:0 17px 40px rgba(0,0,0,.44),0 0 18px rgba(88,101,242,.10)}
}
@keyframes lr122StatFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-2px)}
}

/* responsive: preserve v1.21 behavior below desktop */
@media(max-width:1100px){
  .lr121-hero{
    height:auto!important;
    min-height:780px!important;
    max-height:none!important;
    grid-template-columns:1fr!important;
    padding:40px 24px 190px!important;
  }
  .lr116-hero-side{
    width:min(420px,100%)!important;
    justify-self:start!important;
    margin-top:18px!important;
  }
  .lr115-roleplay-stats{
    left:24px!important;
    width:calc(100% - 48px)!important;
    bottom:18px!important;
    height:auto!important;
  }
}
@media(max-width:700px){
  .lr114-home-copy h1{
    white-space:normal!important;
    font-size:58px!important;
  }
  .lr121-hero{
    min-height:830px!important;
  }
  .lr115-roleplay-stats{
    grid-template-columns:repeat(2,1fr)!important;
  }
}