/* Mobile adaptation for standalone VEYFORA site */
@media (max-width: 820px) {
  html, body {
    width: 100% !important;
    overflow-x: hidden !important;
  }

  .site-landing {
    overflow-x: hidden !important;
  }

  .site-header {
    height: 64px !important;
  }

  .site-header-inner {
    width: calc(100% - 28px) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    gap: 10px !important;
  }

  .site-logo {
    font-size: 18px !important;
    height: 36px !important;
    padding: 0 !important;
  }

  .site-header nav {
    display: none !important;
  }

  .site-actions {
    gap: 8px !important;
  }

  .site-action-cabinet {
    display: none !important;
  }

  .site-action-connect {
    min-width: 132px !important;
    height: 40px !important;
    padding: 0 14px !important;
    font-size: 8px !important;
  }

  .site-hero {
    width: calc(100% - 28px) !important;
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 28px !important;
    padding-top: 28px !important;
    margin: 0 auto 24px !important;
  }

  .site-hero-copy {
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 0 !important;
  }

  .site-hero h1 {
    width: 100% !important;
    max-width: 100% !important;
    font-size: clamp(38px, 12vw, 58px) !important;
    line-height: .98 !important;
    letter-spacing: -0.02em !important;
  }

  .site-hero p {
    max-width: 320px !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
  }

  .site-hero-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    max-width: 280px !important;
  }

  .site-hero-primary,
  .site-hero-secondary {
    width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    font-size: 10px !important;
  }

  .site-dashboard-shell,
  .site-real-dashboard {
    width: 100% !important;
    max-width: 100% !important;
    height: 390px !important;
    overflow: hidden !important;
  }

  .site-real-dashboard {
    transform-origin: top left !important;
  }

  .site-payment-methods,
  .site-integration-section,
  .site-audience-section,
  .site-partner-section,
  .site-final-cta,
  .site-footer {
    width: calc(100% - 28px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .site-payment-methods {
    padding-top: 8px !important;
    margin-bottom: 28px !important;
  }

  .site-methods-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .site-method-card {
    min-height: 230px !important;
    padding: 24px 24px 22px !important;
  }

  .site-method-card h3 {
    font-size: 24px !important;
  }

  .site-method-card p {
    font-size: 13px !important;
  }

  .site-method-card p strong {
    font-size: 22px !important;
  }

  .site-method-card span {
    left: 24px !important;
    bottom: 22px !important;
    max-width: 170px !important;
    font-size: 12px !important;
  }

  .method-cards::after { left: 42% !important; right: -14% !important; top: 18% !important; bottom: -8% !important; }
  .method-sbp::after { left: 43% !important; right: -12% !important; top: 24% !important; bottom: -14% !important; }
  .method-crypto::after { left: 42% !important; right: -10% !important; top: 18% !important; bottom: -8% !important; }
  .method-special::after { left: 42% !important; right: -14% !important; top: 24% !important; bottom: 2% !important; }

  .site-integration-section {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding: 28px 20px !important;
    gap: 22px !important;
  }

  .site-integration-copy h2 {
    font-size: 32px !important;
  }

  .site-integration-grid {
    grid-template-columns: 1fr 1fr !important;
    width: 100% !important;
  }

  .site-code-panel {
    min-height: 260px !important;
    overflow: hidden !important;
  }

  .site-code-panel pre {
    font-size: 9px !important;
    line-height: 1.55 !important;
    overflow-x: auto !important;
  }

  .site-audience-heading h2 {
    font-size: 34px !important;
  }

  .site-audience-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .site-audience-grid article {
    grid-template-columns: 64px 1fr !important;
    min-height: 132px !important;
    padding: 22px 18px !important;
  }

  .site-partner-section {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding: 28px 20px 18px !important;
    gap: 20px !important;
  }

  .site-partner-copy h2 {
    font-size: 36px !important;
  }

  .site-partner-benefits {
    grid-template-columns: 1fr !important;
  }

  .site-partner-visual {
    min-height: 300px !important;
  }

  .site-partner-visual::before {
    width: 560px !important;
    height: 300px !important;
    right: 50% !important;
    top: 0 !important;
    transform: translateX(50%) !important;
  }

  .site-final-cta {
    min-height: 280px !important;
    padding: 44px 18px !important;
    margin-bottom: 42px !important;
  }

  .site-final-brand {
    font-size: 19px !important;
  }

  .site-final-cta h2 {
    font-size: 32px !important;
  }

  .site-final-text {
    font-size: 15px !important;
  }

  .site-final-button {
    width: 100% !important;
    min-width: 0 !important;
    height: 54px !important;
    font-size: 15px !important;
  }

  .site-footer-main {
    grid-template-columns: 1fr !important;
    gap: 22px !important;
    padding: 28px 22px !important;
  }

  .site-footer-contact {
    text-align: left !important;
    justify-self: start !important;
  }

  .site-footer-bottom {
    align-items: flex-start !important;
    flex-direction: column !important;
    padding: 16px 22px !important;
  }
}

@media (max-width: 430px) {
  .site-hero h1 {
    font-size: 40px !important;
  }

  .site-dashboard-shell,
  .site-real-dashboard {
    height: 330px !important;
  }

  .site-method-card {
    min-height: 218px !important;
  }

  .site-method-card span {
    max-width: 150px !important;
  }
}
/* Mobile hotfix: no overflow hero */
@media (max-width: 820px) {
  *, *::before, *::after {
    max-width: 100vw;
  }

  body {
    overflow-x: hidden !important;
  }

  .site-header-inner {
    grid-template-columns: 1fr auto !important;
    width: calc(100vw - 24px) !important;
  }

  .site-menu-toggle {
    display: none !important;
  }

  .site-action-connect {
    min-width: 132px !important;
    width: 132px !important;
    height: 38px !important;
  }

  .site-hero {
    width: calc(100vw - 28px) !important;
    max-width: calc(100vw - 28px) !important;
    display: block !important;
    padding-top: 24px !important;
    min-height: auto !important;
  }

  .site-hero-copy {
    width: 100% !important;
    max-width: 100% !important;
    text-align: left !important;
  }

  .site-hero-eyebrow {
    font-size: 9px !important;
    margin-left: 0 !important;
  }

  .site-hero h1 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    font-size: 36px !important;
    line-height: 1.05 !important;
    letter-spacing: 0 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
    text-wrap: balance !important;
  }

  .site-hero h1 br {
    display: none !important;
  }

  .site-hero p {
    max-width: 300px !important;
    margin-top: 18px !important;
    text-align: left !important;
  }

  .site-hero-actions {
    max-width: 100% !important;
    width: 100% !important;
    grid-template-columns: 1fr !important;
    margin-top: 20px !important;
  }

  .site-hero-primary,
  .site-hero-secondary {
    width: 100% !important;
    max-width: 100% !important;
  }

  .site-dashboard-shell,
  .site-real-dashboard {
    margin-top: 26px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 300px !important;
  }
}

@media (max-width: 430px) {
  .site-hero h1 {
    font-size: 32px !important;
    line-height: 1.08 !important;
  }

  .site-hero p {
    font-size: 13px !important;
  }
}