.hero-web-offer { max-width: 430px; margin: 24px 0 0; }
.hero-web-offer .hero-web-signup {
  display: flex; align-items: center; gap: 10px;
  min-height: 60px; padding: 12px 18px; border: 1px solid #38bd83; border-radius: 15px;
  background: linear-gradient(110deg, #087f50, #086d46); color: #fff;
  font-size: 16px; font-weight: 700; line-height: 1.3;
  text-decoration: none; box-shadow: 0 10px 30px #20c77b38, inset 0 1px 0 #ffffff18;
  transition: background .15s, box-shadow .15s;
}
.hero-web-signup #hero-web-signup-label { flex: 1; min-width: 0; }
.hero-web-offer .hero-web-signup:hover { background: #078251; box-shadow: 0 12px 34px #20c77b55; }
.hero-web-offer :is(.hero-web-signup, summary):focus-visible { outline: 2px solid #fff; outline-offset: 4px; }
.hero-web-icon, .hero-web-arrow { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; }
.hero-web-icon { background: #ffffff20; }
.hero-web-arrow { background: #fff; color: #087b4f; }
.hero-web-signup svg { width: 17px; height: 17px; }
.hero-web-savings { padding: 5px 7px; border-radius: 6px; background: #ffffff24; font-size: 10px; font-weight: 800; letter-spacing: .04em; text-align: center; flex-shrink: 0; }
.hero-web-offer p { margin: 0; line-height: 1.5; }
.hero-web-offer .hero-web-note { display: flex; gap: 8px; align-items: baseline; margin-top: 10px; color: #bdc1ca; font-size: 13px; font-weight: 500; }
.hero-web-check { display: inline-grid; place-items: center; width: 16px; height: 16px; border-radius: 50%; background: #153e30; color: #79deb0; flex-shrink: 0; font-size: 11px; }
.hero-web-details { margin: 5px 0 0 24px; color: #a9adb7; font-size: 12px; }
.hero-web-details summary { width: fit-content; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }
.hero-web-details summary:hover { color: #fff; }
.hero-web-details .hero-web-comparison { margin-top: 8px; color: #e1e3e8; }
.hero-web-details .hero-web-terms { margin-top: 4px; }
.hero-web-divider { display: flex; align-items: center; gap: 12px; margin: 22px 0 16px; color: #999eaa; font-size: 9px; letter-spacing: .18em; text-align: center; }
.hero-web-divider::before, .hero-web-divider::after { content: ""; flex: 1; height: 1px; background: #ffffff20; }
.hero-web-offer + .store-row { margin-top: 0 !important; }
@media (max-width: 380px) {
  .hero-web-offer .hero-web-signup { padding: 12px; gap: 8px; font-size: 14px; }
  .hero-web-icon { display: none; }
}
@media (prefers-reduced-motion: reduce) { .hero-web-offer .hero-web-signup { transition: none; } }
