
/* =========================================================
   MOBILE FINAL SIZE — user-approved proportions
   PC untouched
   ========================================================= */
@media (max-width:640px){

  html,body{
    width:100% !important;
    overflow-x:hidden !important;
  }

  /* Hero: slightly larger than 100%, but only enough to match approved mockup */
  .pickHero{
    overflow:hidden !important;
  }
  .pickHeroStage{
    width:100% !important;
    overflow:hidden !important;
  }
  .pickHeroImage{
    display:block !important;
    width:106% !important;
    max-width:none !important;
    height:auto !important;
    margin-left:-3% !important;
    transform:none !important;
    object-fit:contain !important;
    object-position:center top !important;
  }

  /* Gift block: same compact scale as approved mockup */
  .gift-promo{
    padding:16px 16px 17px !important;
    grid-template-columns:58px minmax(0,1fr) !important;
    gap:8px 10px !important;
  }
  .gift-icon{
    font-size:40px !important;
    margin:14px 0 0 !important;
  }
  .gift-copy>span{
    font-size:9.5px !important;
    padding:4px 8px !important;
  }
  .gift-copy h2{
    font-size:18px !important;
    line-height:1.36 !important;
    margin:7px 0 5px !important;
    letter-spacing:-.5px !important;
  }
  .gift-copy p{
    font-size:10px !important;
    line-height:1.5 !important;
  }

  /* Ensure voucher footer line never clips */
  .voucher{
    grid-column:1/-1 !important;
    width:100% !important;
    min-height:92px !important;
    height:auto !important;
    margin-top:7px !important;
    padding:13px 15px 12px !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }
  .voucher small{
    display:block !important;
    font-size:10px !important;
    line-height:1.2 !important;
  }
  .voucher strong{
    display:block !important;
    font-size:31px !important;
    line-height:1.05 !important;
    margin:4px 0 5px !important;
  }
  .voucher em{
    display:block !important;
    font-size:9.5px !important;
    line-height:1.3 !important;
    margin-top:1px !important;
    padding-bottom:1px !important;
  }

  /* Benefits strip proportions */
  .quick-benefit-strip{
    padding:7px 6px 9px !important;
  }
  .quick-benefit-strip>div{
    min-height:44px !important;
    font-size:10.5px !important;
  }

  /* Bottom form section compact and clean */
  .big-register{
    margin:10px 8px !important;
    padding:18px 12px 16px !important;
  }
  .gold-form{
    margin-top:10px !important;
    padding:14px 12px 13px !important;
  }
  .gold-form input:not([type="checkbox"]){
    height:44px !important;
  }

  /* Final CTA heading */
  .final h2{
    max-width:360px !important;
    font-size:23px !important;
    line-height:1.3 !important;
    word-break:keep-all !important;
  }

  body{
    padding-bottom:64px !important;
  }
}
