/* AFC production responsive hardening — shared across public pages. */
html {
  scroll-padding-top: 96px !important;
}

body {
  min-width: 320px !important;
}

img,
svg,
video,
canvas {
  max-width: 100%;
}

/* Keep the primary navigation visible while scrolling on desktop, tablet and mobile. */
.site-nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: rgba(255, 254, 248, .96) !important;
  -webkit-backdrop-filter: blur(14px) saturate(1.05) !important;
  backdrop-filter: blur(14px) saturate(1.05) !important;
  box-shadow: 0 1px 0 #11110f, 0 8px 24px rgba(17, 17, 15, .06) !important;
}

.intake-nav {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: rgba(255, 254, 248, .97) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}

.wi-site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
}

@media (max-width: 900px) {
  .site-nav {
    position: sticky !important;
    top: 0 !important;
  }

  .mobile-nav-panel,
  .wi-site-header .wi-header-mobile nav {
    max-height: calc(100vh - 96px) !important;
    max-height: calc(100dvh - 96px) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }
}

@media (max-width: 600px) {
  .site-nav {
    min-height: 70px !important;
    padding: 8px 14px !important;
    gap: 10px !important;
  }

  .site-nav .nav-brand {
    width: auto !important;
    max-width: calc(100% - 72px) !important;
    min-width: 0 !important;
    height: auto !important;
    flex: 1 1 auto !important;
    gap: 10px !important;
  }

  .site-nav .afc-logo {
    width: 58px !important;
    height: 48px !important;
    flex: 0 0 58px !important;
    transform: none !important;
  }

  .site-nav .nav-logo-text {
    min-width: 0 !important;
    font-size: 12px !important;
    line-height: 1.05 !important;
  }

  .mobile-nav {
    right: 14px !important;
  }

  .mobile-nav summary {
    min-width: 58px !important;
    min-height: 42px !important;
    padding: 9px 11px !important;
    font-size: 12px !important;
  }

  .mobile-nav-panel {
    right: 0 !important;
    width: min(300px, calc(100vw - 28px)) !important;
  }

  .intake-nav {
    min-height: 70px !important;
    padding: 9px 16px !important;
    gap: 12px !important;
  }

  .intake-nav > a:last-child {
    flex: 0 0 auto !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
}

@media (max-width: 420px) {
  html {
    scroll-padding-top: 78px !important;
  }

  .site-nav {
    min-height: 66px !important;
    padding: 7px 12px !important;
  }

  .site-nav .nav-brand {
    max-width: calc(100% - 64px) !important;
    gap: 8px !important;
  }

  .site-nav .afc-logo {
    width: 52px !important;
    height: 44px !important;
    flex-basis: 52px !important;
  }

  .site-nav .nav-logo-text {
    font-size: 11px !important;
  }

  .mobile-nav {
    right: 12px !important;
  }

  .mobile-nav summary {
    min-width: 54px !important;
    min-height: 40px !important;
    padding-inline: 9px !important;
  }

  .mobile-nav-panel {
    width: calc(100vw - 24px) !important;
  }

  .intake-nav {
    min-height: 66px !important;
    padding: 8px 12px !important;
  }

  .intake-brand img {
    width: 50px !important;
    height: 50px !important;
  }
}

/* Editorial footer: resilient at laptop, tablet and 360px mobile widths. */
@media (max-width: 1100px) {
  .site-footer .footer-reference-shell {
    width: min(100% - 36px, 900px) !important;
  }
}

@media (max-width: 980px) {
  .site-footer .footer-reference-shell {
    width: min(100% - 32px, 860px) !important;
    padding: 52px 0 48px !important;
    grid-template-columns: 1fr 1fr !important;
  }

  .site-footer .footer-reference-shell > *,
  .site-footer .footer-reference-shell > *:first-child,
  .site-footer .footer-reference-shell > *:last-child {
    min-width: 0 !important;
    padding: 28px !important;
  }

  .site-footer .footer-brand-link {
    grid-template-columns: 64px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding-left: 12px !important;
    border-left-width: 4px !important;
    font-size: clamp(25px, 3.4vw, 30px) !important;
    line-height: .9 !important;
  }

  .site-footer .footer-brand-logo {
    width: 64px !important;
    height: 58px !important;
  }

  .site-footer .footer-brand-copy {
    max-width: 100% !important;
    margin: 20px 0 18px !important;
  }

  .site-footer .footer-compact-form {
    width: 100% !important;
  }

  .site-footer .footer-reference-shell > *:nth-child(even) {
    border-right: 0 !important;
  }
}

@media (max-width: 760px) {
  .site-footer .footer-reference-shell {
    width: 100% !important;
    max-width: 680px !important;
    padding: 0 !important;
    grid-template-columns: 1fr !important;
  }

  .site-footer .footer-reference-shell > *,
  .site-footer .footer-reference-shell > *:first-child,
  .site-footer .footer-reference-shell > *:last-child,
  .site-footer .footer-reference-shell > *:nth-child(even) {
    padding: 30px 24px !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, .18) !important;
  }

  .site-footer .footer-reference-shell > *:last-child {
    border-bottom: 0 !important;
  }

  .site-footer .footer-connect-block p {
    max-width: 560px !important;
  }

  .site-footer .footer-meta {
    padding: 20px 24px !important;
    grid-template-columns: 1fr auto !important;
    gap: 14px 22px !important;
  }

  .site-footer .footer-meta > span {
    min-width: 0 !important;
  }

  .site-footer .footer-legal-links {
    grid-column: 1 / -1 !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 12px 18px !important;
  }
}

@media (max-width: 600px) {
  .site-footer .footer-reference-shell > *,
  .site-footer .footer-reference-shell > *:first-child,
  .site-footer .footer-reference-shell > *:last-child {
    padding: 28px 20px !important;
  }

  .site-footer .footer-brand-link {
    grid-template-columns: 58px minmax(0, 1fr) !important;
    gap: 12px !important;
    padding-left: 10px !important;
    font-size: clamp(24px, 7.3vw, 28px) !important;
    letter-spacing: -.045em !important;
    line-height: .92 !important;
  }

  .site-footer .footer-brand-logo {
    width: 58px !important;
    height: 52px !important;
    padding: 4px !important;
  }

  .site-footer .footer-compact-form {
    width: 100% !important;
    padding: 0 !important;
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }

  .site-footer .footer-compact-form input {
    height: 48px !important;
    border-right: 1px solid rgba(255, 255, 255, .7) !important;
  }

  .site-footer .footer-compact-form button {
    width: 100% !important;
    height: 46px !important;
  }

  .site-footer .footer-signup-status {
    position: static !important;
    min-height: 18px !important;
    margin-top: 2px !important;
  }

  .site-footer .footer-contact-link {
    width: 100% !important;
  }

  .site-footer .footer-meta {
    padding: 20px !important;
    grid-template-columns: 1fr !important;
    justify-items: start !important;
    gap: 12px !important;
  }

  .site-footer .footer-legal-links {
    grid-column: auto !important;
  }
}

@media (max-width: 420px) {
  .site-footer .footer-reference-shell > *,
  .site-footer .footer-reference-shell > *:first-child,
  .site-footer .footer-reference-shell > *:last-child {
    padding: 25px 16px !important;
  }

  .site-footer .footer-brand-link {
    grid-template-columns: 52px minmax(0, 1fr) !important;
    gap: 10px !important;
    padding-left: 9px !important;
    font-size: clamp(22px, 6.5vw, 25px) !important;
  }

  .site-footer .footer-brand-logo {
    width: 52px !important;
    height: 48px !important;
  }

  .site-footer .footer-brand-copy {
    margin: 18px 0 16px !important;
    font-size: 13px !important;
  }

  .site-footer .footer-nav-block {
    gap: 11px !important;
  }

  .site-footer .footer-nav-block strong {
    margin-bottom: 10px !important;
  }

  .site-footer .footer-nav-block a {
    font-size: 11px !important;
  }

  .site-footer .footer-meta {
    padding: 18px 16px !important;
    font-size: 10px !important;
  }
}

/* Product pages: prevent cramped cards, giant type and overflowing media at small widths. */
@media (max-width: 980px) {
  body.product-page .product-hero-copy {
    padding: 56px 24px !important;
  }

  body.product-page .product-proof {
    flex-wrap: wrap !important;
  }

  body.product-page .product-expert {
    grid-template-columns: 1fr !important;
  }

  body.product-page .product-expert img {
    min-height: 300px !important;
    max-height: 430px !important;
  }
}

@media (max-width: 720px) {
  body.product-page .product-shell,
  body.product-page .product-buy-rail-inner {
    width: min(calc(100% - 32px), var(--product-shell)) !important;
  }

  body.product-page .product-hero-copy {
    padding: 48px 18px !important;
  }

  body.product-page .product-title {
    font-size: clamp(42px, 13vw, 58px) !important;
  }

  body.product-page .product-section-title {
    font-size: clamp(31px, 9vw, 42px) !important;
  }

  body.product-page .product-hero-media {
    min-height: 380px !important;
  }

  body.product-page .product-final h2 {
    font-size: clamp(36px, 10vw, 50px) !important;
  }
}

@media (max-width: 420px) {
  body.product-page .product-shell,
  body.product-page .product-buy-rail-inner {
    width: calc(100% - 28px) !important;
  }

  body.product-page .product-hero-copy {
    padding: 42px 14px !important;
  }

  body.product-page .product-breadcrumbs {
    margin-bottom: 20px !important;
  }

  body.product-page .product-title {
    font-size: clamp(38px, 12.5vw, 50px) !important;
    line-height: .98 !important;
  }

  body.product-page .product-promise {
    font-size: 15px !important;
  }

  body.product-page .product-timer {
    gap: 10px !important;
    justify-content: space-between !important;
  }

  body.product-page .product-timer-part {
    min-width: 46px !important;
  }

  body.product-page .product-timer-part strong {
    font-size: 25px !important;
  }

  body.product-page .product-hero-media {
    min-height: 330px !important;
  }

  body.product-page .product-media-note {
    right: 14px !important;
    bottom: 14px !important;
    width: calc(100% - 28px) !important;
    padding: 15px !important;
  }

  body.product-page .product-buy-name {
    gap: 12px !important;
  }

  body.product-page .product-buy-name img {
    width: 64px !important;
    height: 52px !important;
  }

  body.product-page .product-section {
    padding: 44px 0 !important;
  }

  body.product-page .product-expert-copy,
  body.product-page .product-trust-card {
    padding: 22px !important;
  }

  body.product-page .product-final {
    padding: 44px 0 !important;
  }
}

/* Contact page: keep the form and content comfortable at 360px. */
@media (max-width: 420px) {
  .contact-announcement {
    padding-inline: 14px !important;
  }

  .contact-image-header {
    height: 210px !important;
  }

  .contact-image-label {
    left: 16px !important;
    right: 16px !important;
    bottom: 14px !important;
    padding: 9px 11px !important;
  }

  .contact-form-section,
  .contact-next-section {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  .contact-form-intro h1 {
    font-size: clamp(40px, 12vw, 50px) !important;
  }

  .contact-form {
    padding: 22px 16px !important;
    box-shadow: 5px 5px 0 #11110f !important;
  }

  .contact-step {
    padding: 24px 20px !important;
  }
}

/* Intake flow: compact enough for 360px while preserving tap targets. */
@media (max-width: 420px) {
  .intake-shell {
    width: calc(100% - 24px) !important;
    margin: 34px auto 54px !important;
  }

  .intake-header {
    margin-bottom: 24px !important;
  }

  .intake-header h1,
  .payment-panel h1,
  .success-panel h1 {
    font-size: clamp(34px, 10.5vw, 44px) !important;
  }

  .intake-header p {
    font-size: 16px !important;
  }

  .intake-card {
    padding: 22px 16px !important;
    border-radius: 12px !important;
    box-shadow: 5px 5px 0 var(--yellow) !important;
  }

  .intake-card h2 {
    font-size: clamp(29px, 9vw, 38px) !important;
  }

  .intake-progress {
    grid-template-columns: auto minmax(0, 1fr) auto !important;
    gap: 9px !important;
    font-size: 11px !important;
  }

  .intake-fields {
    gap: 20px !important;
  }
}

/* Workplace initiative: sticky header already exists; harden its mobile menu and 360px layout. */
@media (max-width: 640px) {
  .wi-site-header .wi-header-mobile nav {
    max-height: calc(100dvh - 92px) !important;
    overflow-y: auto !important;
  }
}

@media (max-width: 420px) {
  .wi-header-shell {
    width: calc(100% - 28px) !important;
    min-height: 70px !important;
    gap: 10px !important;
  }

  .wi-header-brand,
  .wi-header-logo-frame {
    width: 160px !important;
    height: 50px !important;
  }

  .wi-header-logo-frame img {
    width: 166px !important;
  }

  .wi-header-mobile summary {
    min-width: 58px !important;
    padding: 9px 10px !important;
  }

  .wi-shell {
    width: calc(100% - 28px) !important;
  }

  .wi-hero h1 {
    font-size: clamp(36px, 11vw, 46px) !important;
  }

  .wi-partner-panel {
    margin-inline: -14px !important;
    padding: 30px 14px 36px !important;
  }

  .wi-story,
  .wi-goals,
  .wi-interest {
    padding-block: 50px !important;
  }

  .wi-interest-form {
    padding: 18px !important;
    box-shadow: 4px 4px 0 var(--wi-ink) !important;
  }
}
