/* No idle pulse. Button feedback is triggered only by interaction. */
body :is(.calculator-btn-primary,.offer-card-btn,.cta-banner-btn,.sticky-cta-btn){animation:none!important;filter:none!important;}
.hero .hero-bg-city{animation:none!important;transform:scale(1) translate3d(0,0,0);transform-origin:50% 50%;object-position:center center;}


.hero.hero-out-of-view .hero-bg-city,html.cm-motion-hidden .hero .hero-bg-city{animation-play-state:paused!important;}

/* Match the reference CTA motion and depth in the site's blue palette. */
body :is(#calculatorCta,.offer-card-btn){
 --cm-cta:#2675f5;
 --cm-cta-hover:#1766e8;
 background:linear-gradient(180deg,color-mix(in srgb,var(--cm-cta) 86%,white) 0%,var(--cm-cta) 58%,color-mix(in srgb,var(--cm-cta) 93%,black) 100%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.16),0 2px 8px -2px rgba(38,117,245,.35);
 transform:scale(1);
 transform-origin:center;
 transition:background .45s ease,transform .22s cubic-bezier(.22,1,.36,1),box-shadow .45s ease!important;
 -webkit-tap-highlight-color:transparent;
 touch-action:manipulation;
}
body :is(#calculatorCta,.offer-card-btn) .lucide-arrow-right{transform:none!important;transition:none!important;}
@media(prefers-reduced-motion:no-preference){
 body #calculatorCta{animation:cm-reference-invite 2.1s ease-in-out infinite!important;}
}
@keyframes cm-reference-invite{0%,100%{transform:scale(1);}50%{transform:scale(1.025);}}
body :is(#calculatorCta,.offer-card-btn):hover,
body :is(#calculatorCta,.offer-card-btn):focus-visible{
 animation:none!important;
 background:linear-gradient(180deg,color-mix(in srgb,var(--cm-cta-hover) 86%,white) 0%,var(--cm-cta-hover) 58%,color-mix(in srgb,var(--cm-cta-hover) 93%,black) 100%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 3px 12px -2px rgba(23,102,232,.45);
}
body :is(#calculatorCta,.offer-card-btn):focus-visible{outline:2px solid #2675f5;outline-offset:3px;}
@media(hover:hover) and (pointer:fine){
 body :is(#calculatorCta,.offer-card-btn):hover,
 body :is(#calculatorCta,.offer-card-btn):focus-visible{transform:scale(1.025);z-index:2;}
}
body :is(#calculatorCta,.offer-card-btn):active{animation:none!important;transform:scale(.97);}
html.cm-motion-hidden body :is(#calculatorCta,.offer-card-btn){animation-play-state:paused!important;}
@media(prefers-reduced-motion:reduce){
 body :is(#calculatorCta,.offer-card-btn){animation:none!important;transform:none!important;transition:none!important;}
}

@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
 body #offers .offer-card:hover .offer-card-btn{animation:cm-reference-invite 2.1s ease-in-out infinite!important;}
 body #offers .offer-card:hover .offer-card-btn:active{animation:none!important;transform:scale(.97);}
}

.hero .hero-bg,.hero .hero-bg::before,.hero .hero-bg::after,.hero .hero-bg-parallax{animation:none!important;}
body #stickyCtaLink{
 color:#fff!important;
 background:linear-gradient(180deg,#20a965 0%,#128249 58%,#0d713d 100%)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 8px -2px rgba(18,130,73,.35);
 transform:scale(1);transform-origin:center;
 transition:transform .22s cubic-bezier(.22,1,.36,1),box-shadow .45s ease!important;
}
body #stickyCtaLink:hover,body #stickyCtaLink:focus-visible{
 animation:none!important;
 background:linear-gradient(180deg,#1a9d5c 0%,#0b733d 58%,#086534 100%)!important;
 box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 3px 12px -2px rgba(11,115,61,.45);
}
@media(min-width:768px) and (prefers-reduced-motion:no-preference){
 body #stickyCta.visible #stickyCtaLink{animation:cm-reference-invite 2.1s ease-in-out infinite!important;}
 body #stickyCta.visible #stickyCtaLink:hover,body #stickyCta.visible #stickyCtaLink:focus-visible{animation:none!important;transform:scale(1.025);}
}
body #stickyCta.visible #stickyCtaLink:active{animation:none!important;transform:scale(.97);}
@media(prefers-reduced-motion:reduce){body #stickyCtaLink{animation:none!important;transform:none!important;transition:none!important;}}

/* Keep the mobile sticky CTA at a fixed size in every interaction state. */
@media(max-width:767px), (hover:none), (pointer:coarse){
 body #stickyCta #stickyCtaLink,
 body #stickyCta #stickyCtaLink:hover,
 body #stickyCta #stickyCtaLink:focus-visible,
 body #stickyCta #stickyCtaLink:active{
  animation:none!important;
  transform:none!important;
  scale:none!important;
 }
}

/* Banner CTA uses the same gentle breathing as the calculator CTA. */
body #cta-banner .cta-banner-btn{
 transform-origin:center;
 transition:transform .22s cubic-bezier(.22,1,.36,1)!important;
}
@media(prefers-reduced-motion:no-preference){
 body #cta-banner .cta-banner-btn{animation:cm-reference-invite 2.1s ease-in-out infinite!important;}
 body #cta-banner .cta-banner-btn:hover,
 body #cta-banner .cta-banner-btn:focus-visible{animation:none!important;transform:scale(1.025);}
 body #cta-banner .cta-banner-btn:active{animation:none!important;transform:scale(.97);}
}
@media(prefers-reduced-motion:reduce){
 body #cta-banner .cta-banner-btn{animation:none!important;transform:none!important;transition:none!important;}
}

/* Match the sticky panel to the lower CTA banner. */
body #stickyCta,body #stickyCta .sticky-cta-inner{background:linear-gradient(100deg,#0D9488 0%,#16A34A 100%)!important;}
body #stickyCta #stickyCtaLink,
body #stickyCta #stickyCtaLink:hover,
body #stickyCta #stickyCtaLink:focus-visible{
 background:#F8FFFC!important;color:#0F766E!important;
 border-radius:16px;box-shadow:0 8px 20px rgba(15,118,110,.12)!important;
}
@media(max-width:767px){
 body #stickyCta .sticky-cta-inner{padding:8px 12px 8px 56px;padding-bottom:calc(8px + env(safe-area-inset-bottom,0px));}
 body #stickyCta #stickyCtaLink{min-height:44px;padding:12px 14px;border-radius:12px;}
}
@media(min-width:1024px){body #offers .offers-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important;}}

/* Mobile sticky CTA is the panel itself, without a separate button surface. */
@media(max-width:767px){
 body #stickyCta .sticky-cta-inner{padding:0;padding-bottom:env(safe-area-inset-bottom,0px);}
 body #stickyCta #stickyCtaLink,
 body #stickyCta #stickyCtaLink:hover,
 body #stickyCta #stickyCtaLink:focus-visible,
 body #stickyCta #stickyCtaLink:active{
  background:transparent!important;color:#fff!important;box-shadow:none!important;
  border:0;border-radius:0;min-height:56px;padding:16px 20px 16px 52px;
 }
}

/* Show all four mobile offer filters without horizontal scrolling. */
@media(max-width:767px){
 body #offers .offers-filters{
  display:flex;flex-wrap:wrap;justify-content:flex-start;gap:8px;
  overflow:visible;margin-inline:0;padding-inline:0;width:100%;
 }
 body #offers .offers-filters .filter-btn{
  width:auto;flex:0 0 auto;min-width:0;max-width:100%;white-space:normal;padding:10px 14px;
 }
}

/* Compact mobile layout; desktop stays unchanged. */
@media(max-width:767px){
 body .hero{padding:20px 0 18px;min-height:0;}
 body .hero-content,body .hero-text{gap:14px;}
 body .hero-visual{display:none;}
 body .hero-intro{margin:0;}
 body .hero-text h1{font-size:clamp(26px,7vw,32px);line-height:1.12;margin:0 0 10px;}
 body .hero-lead{font-size:14px;line-height:1.45;margin:0;}
 body .calc-card{margin:0;padding:14px;border-radius:20px;}
 body .calc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-bottom:10px;}
 body .calc-field{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:0;min-width:0;}
 body .calc-field + .calc-field{border:0;padding:0;margin:0;}
 body .calc-label{flex:none;min-height:30px;font-size:12px;line-height:1.25;margin:0;}
 body .calc-value{flex:none;font-size:21px;line-height:40px;margin:0;}
 body .calc-term-row{flex:none;gap:2px;height:40px;margin:0;justify-content:space-between;}
 body .calc-term-row .calc-value{font-size:20px;min-width:0;line-height:40px;}
 body .calc-term-row .calc-value > span:not(#termDays){font-size:12px;}
 body .calc-step{width:36px;height:40px;flex:0 0 36px;border-radius:10px;font-size:20px;}
 body .calc-card .calculator-slider-simple{flex:none;height:36px;margin:4px 0;}
 body .calc-card .calculator-labels{flex:none;font-size:10px;}
 body .calc-status{padding:8px;gap:6px;margin:0 0 12px;}
 body .calc-status-item{flex-direction:row;gap:6px;text-align:left;}
 body .calc-status-icon{width:24px;height:24px;flex:0 0 24px;}
 body .calc-status-label{font-size:10px;}
 body .calc-status-value{font-size:11px;line-height:1.3;}
 body .calc-actions{margin:0;}
 body #calculatorCta{min-height:48px;padding:12px 10px;font-size:14px;}
 body .hero-features-bar{margin-top:14px;padding:10px 6px;gap:6px;border-radius:16px;}
 body .hero-feature{gap:5px;}
 body .hero-feature-icon{width:28px;height:28px;min-width:28px;}
 body .hero-feature-icon svg{width:16px;height:16px;}
 body .hero-feature strong{font-size:11px;line-height:1.3;}

}

/* Mobile header scrolls with the page. */
@media(max-width:767px){body .header{position:relative!important;top:auto!important;transform:none!important;}}

/* Full first-screen mobile hero with the illustration restored. */
@media(max-width:767px){
 body .hero{min-height:0;padding:40px 0 40px;display:flex;align-items:center;}
 body .hero-visual{display:flex;height:230px;max-height:230px;margin:0 0 -22px;justify-content:center;align-items:flex-start;overflow:visible;}
 body .hero-visual > picture{display:flex;justify-content:center;width:100%;height:100%;align-items:flex-start;}
 body .hero-woman{height:260px;max-height:none;width:auto;max-width:none;object-fit:contain;object-position:top center;flex:none;}
 
 body .hero-text h1{font-size:clamp(28px,7.3vw,32px);}
 body .hero-lead{font-size:15px;color:#556274;}
 body .hero-features-bar{margin-top:2px;padding:12px 8px;}
 body .hero-feature strong{font-size:12px;}
}

@media(max-width:767px){body #offers .section-subtitle{margin-bottom:20px;}body #offers .offers-filters{margin-top:0;}}

@media(max-width:767px){body .hero-woman{transform:translateY(-10px);}}

/* Keep the action row above the iPhone home-indicator safe area. */
@media(max-width:767px){
 body #stickyCta{padding-bottom:env(safe-area-inset-bottom,0px);}
 body #stickyCta .sticky-cta-inner{padding:0;min-height:56px;}
 body #stickyCta #stickyCtaLink{min-height:56px;padding:16px 52px;}
 body #stickyCta #stickyCtaClose{top:8px;transform:none;left:max(8px,env(safe-area-inset-left,0px));width:40px;height:40px;}
}

/* Static hero layers on mobile, including the ambient depth overlay. */
@media(max-width:767px){
 body .hero .hero-bg-depth{animation:none!important;transition:none!important;}
 body .hero .hero-bg-city,body .hero .hero-bg-parallax{animation:none!important;transform:none!important;transition:none!important;will-change:auto;}
}