/* Satghor Mobile CTA v15.4 — loaded as a NEW asset after the existing landing styles.
   Only the landing page; no global button, checkout logic, JS or tracking changes. */
@media screen and (max-width:767.98px) {
  body.sat-landing.sat-final-experience :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {
    box-sizing:border-box!important;
    display:inline-flex!important;
    flex:0 1 auto!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
    font-size:clamp(13px,calc(var(--sat-v4-button-size,18px) * .70),15px)!important;
    line-height:1.35!important;
    font-weight:700;
    padding:9px 16px!important;
    min-height:42px!important;
    min-width:0!important;
    width:auto!important;
    max-width:min(280px,calc(100% - 24px))!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
    text-align:center!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body.sat-landing.sat-final-experience :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) > i {
    flex-shrink:0!important;
    font-size:.92em!important;
  }
  body.sat-landing.sat-final-experience #order-form button.sat-lp-order-submit {
    box-sizing:border-box!important;
    font-size:15px!important;
    line-height:1.35!important;
    padding:11px 14px!important;
    min-height:45px!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
  }
  body.sat-landing.sat-final-experience #landing-footer :is(
    a[href^="tel:"],
    a[href^="https://wa.me/"],
    button.satghor-order-track-footer-btn,
    button.bg-red-600
  ) {
    box-sizing:border-box!important;
    font-size:13px!important;
    line-height:1.35!important;
    padding:8px 12px!important;
    min-height:40px!important;
    min-width:0!important;
    max-width:100%!important;
    white-space:normal!important;
  }
}
@media screen and (max-width:359.98px) {
  body.sat-landing.sat-final-experience :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) { max-width:min(250px,calc(100% - 20px))!important; font-size:13px!important; padding:9px 12px!important; }
}

/* V15.5: Restore the selected animation TYPE on mobile; do not replace every
   effect with one generic pulse. These five compact variants only soften large
   scale peaks. The other 15 original V4 animations remain untouched. */
@media screen and (max-width:767.98px) {
  body.sat-landing.sat-final-experience.sat-animate-pulse :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation-name:sat-mobile-pulse-compact!important;}
  body.sat-landing.sat-final-experience.sat-animate-zoom :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation-name:sat-mobile-zoom-compact!important;}
  body.sat-landing.sat-final-experience.sat-animate-pop :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation-name:sat-mobile-pop-compact!important;}
  body.sat-landing.sat-final-experience.sat-animate-heartbeat :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation-name:sat-mobile-heartbeat-compact!important;}
  body.sat-landing.sat-final-experience.sat-animate-rubber :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation-name:sat-mobile-rubber-compact!important;}
}
@keyframes sat-mobile-pulse-compact {
  0%,100%{transform:scale(1)} 50%{transform:scale(1.055)}
}
@keyframes sat-mobile-zoom-compact {
  0%,100%{transform:scale(.985)} 50%{transform:scale(1.065)}
}
@keyframes sat-mobile-pop-compact {
  0%,100%{transform:scale(1)} 18%{transform:scale(.96)} 35%{transform:scale(1.065)} 52%{transform:scale(.985)}
}
@keyframes sat-mobile-heartbeat-compact {
  0%,100%{transform:scale(1)} 25%,65%{transform:scale(1.065)} 40%,80%{transform:scale(.985)}
}
@keyframes sat-mobile-rubber-compact {
  0%,100%{transform:scale(1,1)} 30%{transform:scale(1.065,.955)}
  50%{transform:scale(.955,1.055)} 70%{transform:scale(1.025,.985)}
}
@media screen and (max-width:767.98px) and (prefers-reduced-motion:reduce) {
  body.sat-landing.sat-final-experience:is(.sat-animate-pulse,.sat-animate-zoom,.sat-animate-pop,.sat-animate-heartbeat,.sat-animate-rubber) :is(
    .satghor-section-action > a.bg-yellow-btn,
    .sat-content-cta > a.sat-content-order-btn,
    #landing-why a.bg-yellow-btn,
    #landing-footer a.satghor-consistent-cta,
    .sat-offer-timer a.sat-timer-cta
  ) {animation:none!important;transition:none!important;}
}


/* V20: compact vertical seams between landing-page sections only.
   The template applies --sat-section-pad to BOTH the end of one section and
   the beginning of the next.  Cap those duplicated outer paddings without
   changing CTA sizes/animations, inner cards, FAQ content, or order behavior.
   The existing admin setting still works within the compact range. */
body.sat-landing.sat-final-experience > section:is(
    #landing-features,
    #landing-gallery,
    #landing-why,
    #landing-benefits,
    #landing-reviews,
    #landing-details
) {
    padding-top: min(var(--sat-section-pad, 44px), 28px) !important;
    padding-bottom: min(var(--sat-section-pad, 44px), 28px) !important;
}
/* Checkout contents and form remain untouched; compact its opening seam only. */
body.sat-landing.sat-final-experience > section#order-form {
    padding-top: min(var(--sat-section-pad, 44px), 28px) !important;
}
/* Keep the banner CTA near the following section without touching the button. */
body.sat-landing.sat-final-experience .landing-banner-section > .satghor-section-action {
    padding-bottom: 18px !important;
}
@media screen and (max-width: 767.98px) {
    body.sat-landing.sat-final-experience > section:is(
        #landing-features,
        #landing-gallery,
        #landing-why,
        #landing-benefits,
        #landing-reviews,
        #landing-details
    ) {
        padding-top: min(calc(var(--sat-section-pad, 44px) * .68), 18px) !important;
        padding-bottom: min(calc(var(--sat-section-pad, 44px) * .68), 18px) !important;
    }
    body.sat-landing.sat-final-experience > section#order-form {
        padding-top: min(calc(var(--sat-section-pad, 44px) * .68), 18px) !important;
    }
    body.sat-landing.sat-final-experience .landing-banner-section > .satghor-section-action {
        padding-bottom: 14px !important;
    }
}

/* Satghor V23: single, authoritative checkout payment-card layout.
   V21/V22 duplicate payment styles removed. This section alters presentation
   only. Does not alter existing input, checkout, fee, COD or mobile CTA logic. */
body.sat-landing #order-form #payment-methods-grid {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    align-items:stretch !important;
    gap:10px !important;
    width:100% !important;
    min-width:0 !important;
}
body.sat-landing #order-form #payment-methods-grid > * {
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
}
/* Preserve the existing advance-payment COD hide/show logic. */
body.sat-landing #order-form #payment-methods-grid > .hidden {
    display:none !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice {
    box-sizing:border-box !important;
    position:relative !important;
    display:flex !important;
    flex-direction:row !important;
    justify-content:space-between !important;
    align-items:center !important;
    gap:9px !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:100% !important;
    min-height:62px !important;
    margin:0 !important;
    padding:10px 12px !important;
    overflow:hidden !important;
    text-align:left !important;
    border:1px solid #d9e4ef !important;
    border-radius:13px !important;
    background:#fff !important;
    box-shadow:0 2px 7px rgba(31,65,104,.045) !important;
    cursor:pointer !important;
    transition:background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice:hover {
    border-color:#7daee7 !important;
    box-shadow:0 4px 12px rgba(25,92,175,.09) !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice:has(input[type=radio]:checked) {
    border-color:#166fd2 !important;
    background:#f2f8ff !important;
    box-shadow:inset 0 0 0 1px rgba(22,111,210,.13),0 3px 11px rgba(22,111,210,.07) !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice:focus-within {
    outline:2px solid #6ca7ed !important;
    outline-offset:2px !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice > span:first-child {
    box-sizing:border-box !important;
    display:flex !important;
    flex:1 1 auto !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:9px !important;
    width:auto !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    padding:0 !important;
    overflow-wrap:normal !important;
    text-align:left !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-logo.sp-pay-logo-sm {
    box-sizing:border-box !important;
    display:flex !important;
    flex:0 0 42px !important;
    align-items:center !important;
    justify-content:center !important;
    width:42px !important;
    min-width:42px !important;
    height:40px !important;
    margin:0 !important;
    padding:6px !important;
    overflow:hidden !important;
    border:1px solid #e1eaf3 !important;
    border-radius:11px !important;
    background:#fff !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-logo.sp-pay-logo-sm img {
    display:block !important;
    width:100% !important;
    height:100% !important;
    max-width:100% !important;
    max-height:100% !important;
    object-fit:contain !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice > span:first-child > span:not(.sp-pay-logo) {
    display:block !important;
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    color:#152d4c !important;
    font-size:12.5px !important;
    font-weight:700 !important;
    line-height:1.32 !important;
    text-align:left !important;
    overflow-wrap:normal !important;
    word-break:normal !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice small {
    display:block !important;
    margin-top:3px !important;
    color:#067c46 !important;
    font-size:10px !important;
    line-height:1.18 !important;
    font-weight:650 !important;
}
body.sat-landing #order-form #payment-methods-grid .sp-pay-choice input[type=radio] {
    position:static !important;
    box-sizing:border-box !important;
    display:block !important;
    flex:0 0 17px !important;
    width:17px !important;
    height:17px !important;
    min-width:17px !important;
    min-height:17px !important;
    margin:0 !important;
    padding:0 !important;
    opacity:1 !important;
    border-radius:50% !important;
    accent-color:#166fd2 !important;
    box-shadow:none !important;
    cursor:pointer !important;
}
/* In a narrow checkout column, stack icon/name and put radio in top-right.
   Equal-sized cards avoid squeezed logos, awkward wrapping and overflow. */
@media screen and (min-width:355px) and (max-width:767.98px) {
    body.sat-landing #order-form #payment-methods-grid { gap:8px !important; }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice {
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:3px !important;
        min-height:82px !important;
        padding:7px 6px 6px !important;
        text-align:center !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice > span:first-child {
        flex:0 1 auto !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:5px !important;
        width:100% !important;
        padding:0 6px !important;
        text-align:center !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-logo.sp-pay-logo-sm {
        flex:0 0 28px !important;
        width:34px !important;
        min-width:34px !important;
        height:28px !important;
        margin:0 auto !important;
        padding:4px !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice > span:first-child > span:not(.sp-pay-logo) {
        width:100% !important;
        text-align:center !important;
        font-size:11.25px !important;
        line-height:1.23 !important;
        overflow-wrap:anywhere !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice small {
        margin-top:2px !important;
        font-size:9.5px !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice input[type=radio] {
        position:absolute !important;
        top:8px !important;
        right:8px !important;
        left:auto !important;
        bottom:auto !important;
        flex-basis:16px !important;
        width:16px !important;
        height:16px !important;
        min-width:16px !important;
        min-height:16px !important;
    }
}
/* Phones where the inner form is under 290px wide: two compact rows. */
@media screen and (max-width:354.98px) {
    body.sat-landing #order-form #payment-methods-grid {
        grid-template-columns:minmax(0,1fr) !important;
        gap:7px !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-choice {
        min-height:58px !important;
        padding:8px 11px !important;
    }
    body.sat-landing #order-form #payment-methods-grid .sp-pay-logo.sp-pay-logo-sm {
        flex-basis:34px !important;
        width:34px !important;
        min-width:34px !important;
        height:33px !important;
    }
}