.pepes-hero-monthly{
  --phm-red:#E4142D;
  --phm-black:#161513;
  --phm-yellow:#FFC72C;
  display:flex;
  min-height:360px;
  position:relative;
  overflow:hidden;
  text-decoration:none;
  color:#fff;
  border-radius:14px;
  margin:0 0 32px;
  background:
    repeating-linear-gradient(45deg, rgba(0,0,0,.05) 0 36px, transparent 36px 72px),
    repeating-linear-gradient(-45deg, rgba(0,0,0,.05) 0 36px, transparent 36px 72px),
    var(--phm-red);
  box-shadow:0 10px 30px rgba(0,0,0,.15);
  transition:transform .18s ease, box-shadow .18s ease;
}
.pepes-hero-monthly:hover{
  transform:translateY(-3px);
  box-shadow:0 16px 36px rgba(0,0,0,.22);
}
.pepes-hero-monthly .phm-left{
  flex:0 0 46%;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:36px 36px;
  position:relative;
  z-index:2;
}
.pepes-hero-monthly .phm-eyebrow{
  display:block;
  font-weight:800;
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--phm-yellow);
  margin-bottom:8px;
}
.pepes-hero-monthly .phm-title{
  font-size:34px;
  line-height:1.05;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:-.01em;
  margin:0 0 12px;
  color:#fff;
  text-shadow:3px 3px 0 rgba(0,0,0,.25);
}
.pepes-hero-monthly .phm-desc{
  font-size:14px;
  color:#ffdcdf;
  margin:0 0 20px;
  max-width:340px;
}
.pepes-hero-monthly .phm-price-tag{
  display:inline-flex;
  align-items:center;
  gap:12px;
  background:var(--phm-black);
  color:#fff;
  border-radius:6px;
  padding:10px 18px;
  margin-bottom:20px;
  width:fit-content;
}
.pepes-hero-monthly .phm-amount{
  font-size:24px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}
.pepes-hero-monthly .phm-divider{
  width:1px;
  height:28px;
  background:rgba(255,255,255,.25);
}
.pepes-hero-monthly .phm-sub{
  font-size:11px;
  font-weight:700;
  color:#d9d9d9;
  text-transform:uppercase;
  line-height:1.5;
  letter-spacing:.02em;
}
.pepes-hero-monthly .phm-btn{
  display:inline-block;
  width:fit-content;
  background:var(--phm-yellow);
  color:var(--phm-black);
  padding:14px 28px;
  border-radius:4px;
  font-weight:900;
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:.03em;
}
.pepes-hero-monthly .phm-right{
  flex:1;
  position:relative;
  min-height:260px;
}
.pepes-hero-monthly .phm-right::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(90deg, var(--phm-red) 0%, rgba(228,20,45,0) 26%);
}
.pepes-hero-monthly .phm-right img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}

@media (max-width:780px){
  .pepes-hero-monthly{flex-direction:column;min-height:0;}
  .pepes-hero-monthly .phm-left{
    flex:none;
    order:2;
    padding:24px 22px 30px;
  }
  .pepes-hero-monthly .phm-right{
    order:1;
    min-height:220px;
  }
  .pepes-hero-monthly .phm-right::before{
    inset:auto 0 0 0;
    height:40%;
    background:linear-gradient(0deg, var(--phm-red) 0%, rgba(228,20,45,0) 60%);
  }
  .pepes-hero-monthly .phm-title{font-size:28px;}
  .pepes-hero-monthly .phm-desc{max-width:none;}
}
