/*
 * Amas Don Merchant Hub — unified mobile optimization
 * Scope: Merchant landing + every Merchant Hub resource/detail page.
 * IMPORTANT: Sidebar selectors are intentionally not modified here.
 */

@media (max-width: 767px) {
  /* ---------- Global safety ---------- */
  html, body {
    max-width: 100%;
    overflow-x: hidden;
  }

  .merchant-landing,
  .merchant-launch-page,
  .mf-page,
  .pc-page,
  .oc-page,
  .sr-page,
  .bi-page,
  .gh-page,
  .po-page,
  .ci-page,
  .bs-page,
  .cc-page,
  .ss-page,
  .dc-page,
  .sh-page,
  .pp-page,
  .rd-page,
  .ms-page,
  .sa-page,
  .bp-page,
  .ti-page,
  .ssr-page,
  .ssrd-page,
  .merchant-resource-page {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    overflow-x: clip !important;
    box-sizing: border-box !important;
  }

  .merchant-landing *,
  .merchant-launch-page *,
  .mf-page *,
  .pc-page *,
  .oc-page *,
  .sr-page *,
  .bi-page *,
  .gh-page *,
  .po-page *,
  .ci-page *,
  .bs-page *,
  .cc-page *,
  .ss-page *,
  .dc-page *,
  .sh-page *,
  .pp-page *,
  .rd-page *,
  .ms-page *,
  .sa-page *,
  .bp-page *,
  .ti-page *,
  .ssr-page *,
  .ssrd-page *,
  .merchant-resource-page * {
    box-sizing: border-box;
    min-width: 0;
  }

  /* ---------- Unified mobile content width ---------- */
  .merchant-wrap,
  .ml-shell,.mf-shell,.pc-shell,.oc-shell,.sr-shell,.bi-shell,.gh-shell,.po-shell,
  .ci-shell,.bs-shell,.cc-shell,.ss-shell,.dc-shell,.sh-shell,.pp-shell,.rd-shell,
  .ms-shell,.sa-shell,.bp-shell,.ti-shell,.ssr-shell,.ssrd-shell,.merchant-resource-shell {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  /* ---------- Typography that cannot escape viewport ---------- */
  .merchant-landing h1,
  .merchant-launch-page h1,
  .mf-page h1,.pc-page h1,.oc-page h1,.sr-page h1,.bi-page h1,.gh-page h1,.po-page h1,
  .ci-page h1,.bs-page h1,.cc-page h1,.ss-page h1,.dc-page h1,.sh-page h1,.pp-page h1,
  .rd-page h1,.ms-page h1,.sa-page h1,.bp-page h1,.ti-page h1,.ssr-page h1,.ssrd-page h1,
  .merchant-resource-page h1 {
    max-width: 100% !important;
    font-size: clamp(40px, 12vw, 56px) !important;
    line-height: .94 !important;
    letter-spacing: -.055em !important;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .merchant-landing h2,
  .merchant-launch-page h2,
  .mf-page h2,.pc-page h2,.oc-page h2,.sr-page h2,.bi-page h2,.gh-page h2,.po-page h2,
  .ci-page h2,.bs-page h2,.cc-page h2,.ss-page h2,.dc-page h2,.sh-page h2,.pp-page h2,
  .rd-page h2,.ms-page h2,.sa-page h2,.bp-page h2,.ti-page h2,.ssr-page h2,.ssrd-page h2,
  .merchant-resource-page h2 {
    max-width: 100% !important;
    font-size: clamp(32px, 9.5vw, 44px) !important;
    line-height: 1 !important;
    letter-spacing: -.045em !important;
  }

  .merchant-landing h3,
  .merchant-launch-page h3,
  .mf-page h3,.pc-page h3,.oc-page h3,.sr-page h3,.bi-page h3,.gh-page h3,.po-page h3,
  .ci-page h3,.bs-page h3,.cc-page h3,.ss-page h3,.dc-page h3,.sh-page h3,.pp-page h3,
  .rd-page h3,.ms-page h3,.sa-page h3,.bp-page h3,.ti-page h3,.ssr-page h3,.ssrd-page h3 {
    max-width: 100%;
    overflow-wrap: break-word;
  }

  .merchant-landing p,
  .merchant-launch-page p,
  .mf-page p,.pc-page p,.oc-page p,.sr-page p,.bi-page p,.gh-page p,.po-page p,
  .ci-page p,.bs-page p,.cc-page p,.ss-page p,.dc-page p,.sh-page p,.pp-page p,
  .rd-page p,.ms-page p,.sa-page p,.bp-page p,.ti-page p,.ssr-page p,.ssrd-page p,
  .merchant-resource-page p {
    max-width: 100% !important;
    font-size: 15px;
    line-height: 1.65;
    overflow-wrap: break-word;
  }

  /* ---------- All major desktop grids collapse safely ---------- */
  .ml-hero-grid,.ml-checks-grid,.ml-product-board,.ml-ready-grid,
  .mf-hero-grid,.mf-calculator-grid,.mf-control-grid,.mf-flow-grid,.mf-readiness-grid,.mf-faq-grid,
  .pc-hero-grid,.pc-ui-grid,.pc-quality-grid,.pc-flow-grid,.pc-story-grid,.pc-matrix-grid,.pc-health-grid,.pc-rhythm-grid,.pc-faq-grid,.pc-action-grid,
  .oc-hero-grid,.oc-health-grid,.oc-attention-grid,.oc-activity-grid,.oc-ready-grid,.oc-faq-grid,.oc-action-grid,
  .sr-hero-grid,.sr-health-grid,.sr-attention-grid,.sr-return-grid,.sr-recent-grid,.sr-faq-grid,.sr-action-grid,
  .bi-hero-grid,.bi-health-grid,.bi-console-grid,.bi-quality-grid,.bi-attention-grid,.bi-recent-grid,.bi-faq-grid,.bi-action-grid,
  .gh-hero-grid,.gh-movers-grid,.gh-lever-grid,.gh-op-grid,.gh-plan-grid,.gh-exp-grid,.gh-faq-grid,.gh-action-grid,
  .po-hero-grid,.po-queue-grid,.po-audit-grid,.po-risk-grid,.po-discovery-grid,.po-exp-grid,.po-faq-grid,.po-action-grid,
  .ci-hero-grid,.ci-segment-grid,.ci-map-grid,.ci-ret-grid,.ci-voice-grid,.ci-faq-grid,
  .bs-hero-layout,.bs-manifesto-grid,.bs-store-grid,.bs-assets-grid,.bs-check-grid,.bs-faq-grid,
  .cc-hero-grid,.cc-builder-grid,.cc-offer-grid,.cc-channel-grid,.cc-creative-grid,.cc-launch-grid,.cc-measure-grid,.cc-faq-grid,
  .ss-hero-grid,.ss-mobile-grid,.ss-mod-grid,.ss-trust-grid,.ss-publish-grid,.ss-faq-grid,
  .dc-hero-grid,.dc-type-grid,.dc-rules-grid,.dc-guard-grid,.dc-preview-grid,.dc-check-grid,.dc-faq-grid,
  .sh-hero-grid,.sh-path-grid,.sh-journey-grid,.sh-support-grid,.sh-health-grid,.sh-faq-grid,
  .pp-hero-grid,.pp-zone-grid,.pp-scenario-grid,.pp-evidence-grid,.pp-updates-grid,.pp-check-grid,.pp-faq-grid,
  .rd-hero-grid,.rd-triage-grid,.rd-flow-grid,.rd-response-grid,.rd-outcome-grid,.rd-prevent-grid,.rd-check-grid,.rd-faq-grid,
  .ms-hero-grid,.ms-start-grid,.ms-context-grid,.ms-thread-grid,.ms-expect-grid,.ms-prepare-grid,.ms-faq-grid,
  .sa-hero-grid,.sa-track-grid,.sa-lesson-grid,.sa-practice-grid,.sa-skills-grid,.sa-library-grid,.sa-challenge-grid,.sa-faq-grid,
  .bp-hero-grid,.bp-principles-grid,.bp-standard-grid,.bp-rhythm-grid,.bp-mistake-grid,.bp-check-grid,.bp-faq-grid,
  .ti-hero-grid,.ti-signal-grid,.ti-demand-grid,.ti-filter-grid,.ti-faq-grid,
  .ssr-hero-grid,.ssr-turning-grid,.ssr-lessons-grid,.ssr-submit-grid,.ssr-faq-grid,
  .ssrd-hero-grid,.ssrd-journal-grid,.ssrd-next-grid,
  .merchant-resource-story-grid,.merchant-resource-deep-grid,.merchant-resource-workflow-grid,.merchant-resource-metric-grid,.merchant-resource-faq-grid {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 20px !important;
  }

  /* ---------- Hero sections ---------- */
  .ml-hero,.mf-hero,.pc-hero,.oc-hero,.sr-hero,.bi-hero,.gh-hero,.po-hero,.ci-hero,
  .bs-hero,.cc-hero,.ss-hero,.dc-hero,.sh-hero,.pp-hero,.rd-hero,.ms-hero,.sa-hero,
  .bp-hero,.ti-hero,.ssr-hero,.ssrd-hero,.merchant-resource-hero {
    padding-top: 32px !important;
    padding-bottom: 48px !important;
  }

  .ml-hero-grid,.mf-hero-grid,.pc-hero-grid,.oc-hero-grid,.sr-hero-grid,.bi-hero-grid,.gh-hero-grid,
  .po-hero-grid,.ci-hero-grid,.cc-hero-grid,.ss-hero-grid,.dc-hero-grid,.sh-hero-grid,.pp-hero-grid,
  .rd-hero-grid,.ms-hero-grid,.sa-hero-grid,.bp-hero-grid,.ti-hero-grid,.ssr-hero-grid,.ssrd-hero-grid {
    min-height: 0 !important;
    align-items: stretch !important;
  }

  .ml-hero-copy,.mf-hero-copy,.pc-hero-copy,.oc-hero-copy,.ci-hero-copy,.cc-hero-copy {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
  }

  /* The Launch Center had a late desktop centering rule overriding its earlier mobile grid. */
  .merchant-launch-page .ml-hero-grid {
    grid-template-columns: minmax(0,1fr) !important;
    gap: 28px !important;
  }
  .merchant-launch-page .ml-hero-copy,
  .merchant-launch-page .ml-hero-visual {
    width: 100% !important;
    max-width: none !important;
    justify-self: stretch !important;
  }
  .merchant-launch-page .ml-hero-visual {
    min-height: 330px !important;
    margin-top: 6px !important;
  }
  .merchant-launch-page .ml-visual-frame {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 22px !important;
  }
  .merchant-launch-page .ml-visual-frame img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 260px;
    object-fit: cover;
  }
  .merchant-launch-page .ml-float-a,
  .merchant-launch-page .ml-float-b {
    max-width: calc(100% - 20px) !important;
  }

  /* ---------- Actions are thumb-friendly ---------- */
  .merchant-actions,
  .ml-hero-actions,.mf-hero-actions,.pc-hero-actions,.oc-hero-actions,
  .bi-actions,.gh-actions,.po-actions,.ci-actions,.bs-actions,.cc-actions,.ss-actions,.dc-actions,
  .pp-actions,.rd-actions,.ms-actions,.sa-actions,.bp-actions,.ti-actions,.ssr-actions,
  .ssrd-next-actions,.merchant-resource-hero-actions {
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .merchant-actions > a,
  .ml-hero-actions > a,.mf-hero-actions > a,.pc-hero-actions > a,.oc-hero-actions > a,
  .bi-actions > a,.gh-actions > a,.po-actions > a,.ci-actions > a,.bs-actions > a,.cc-actions > a,
  .ss-actions > a,.dc-actions > a,.pp-actions > a,.rd-actions > a,.ms-actions > a,.sa-actions > a,
  .bp-actions > a,.ti-actions > a,.ssr-actions > a,.ssrd-next-actions > a,
  .merchant-resource-hero-actions > a {
    width: 100% !important;
    min-height: 52px;
    justify-content: space-between !important;
    text-align: left;
  }

  /* ---------- Avoid fixed visual widths/heights breaking the viewport ---------- */
  .merchant-launch-page img,
  .mf-page img,.pc-page img,.oc-page img,.sr-page img,.bi-page img,.gh-page img,.po-page img,
  .ci-page img,.bs-page img,.cc-page img,.ss-page img,.dc-page img,.sh-page img,.pp-page img,
  .rd-page img,.ms-page img,.sa-page img,.bp-page img,.ti-page img,.ssr-page img,.ssrd-page img,
  .merchant-resource-page img {
    max-width: 100% !important;
    height: auto;
  }

  .mf-page [class*="visual"],
  .pc-page [class*="visual"],
  .oc-page [class*="visual"],
  .sr-page [class*="visual"],
  .bi-page [class*="visual"],
  .gh-page [class*="visual"],
  .po-page [class*="visual"],
  .ci-page [class*="visual"],
  .bs-page [class*="visual"],
  .cc-page [class*="visual"],
  .ss-page [class*="visual"],
  .dc-page [class*="visual"],
  .sh-page [class*="visual"],
  .pp-page [class*="visual"],
  .rd-page [class*="visual"],
  .ms-page [class*="visual"],
  .sa-page [class*="visual"],
  .bp-page [class*="visual"],
  .ti-page [class*="visual"],
  .ssr-page [class*="visual"] {
    max-width: 100% !important;
  }

  /* ---------- Card rows: keep horizontal swipe where it is useful ---------- */
  .ml-step-grid,
  .ml-week-grid,
  .ssr-chapter-grid,
  .ssr-pattern-grid,
  .ssr-notes,
  .ssrd-lesson-grid {
    display: flex !important;
    gap: 12px !important;
    overflow-x: auto !important;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-padding-left: 16px;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 8px;
    scrollbar-width: none;
  }
  .ml-step-grid::-webkit-scrollbar,
  .ml-week-grid::-webkit-scrollbar,
  .ssr-chapter-grid::-webkit-scrollbar,
  .ssr-pattern-grid::-webkit-scrollbar,
  .ssr-notes::-webkit-scrollbar,
  .ssrd-lesson-grid::-webkit-scrollbar { display:none; }

  .ml-step-grid > *,
  .ml-week-grid > *,
  .ssr-chapter-grid > *,
  .ssr-pattern-grid > *,
  .ssr-notes > *,
  .ssrd-lesson-grid > * {
    flex: 0 0 min(84vw, 360px) !important;
    width: min(84vw, 360px) !important;
    max-width: min(84vw, 360px) !important;
    scroll-snap-align: start;
  }

  /* ---------- Page-specific hardening ---------- */
  .mf-calculator,.mf-control-card,
  .pc-page [class*="card"],
  .oc-page [class*="card"],
  .sr-page [class*="card"],
  .bi-page [class*="card"],
  .gh-page [class*="card"],
  .po-page [class*="card"],
  .ci-page [class*="card"],
  .bs-page [class*="card"],
  .cc-page [class*="card"],
  .ss-page [class*="card"],
  .dc-page [class*="card"],
  .sh-page [class*="card"],
  .pp-page [class*="card"],
  .rd-page [class*="card"],
  .ms-page [class*="card"],
  .sa-page [class*="card"],
  .bp-page [class*="card"],
  .ti-page [class*="card"],
  .ssr-page [class*="card"],
  .ssrd-page [class*="card"] {
    max-width: 100% !important;
  }

  .ssrd-journal-grid > article,
  .ssrd-journal-grid > aside {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .ssrd-opening .ssrd-narrow {
    grid-template-columns: 1fr !important;
  }

  .ssrd-story-block {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }

  .ssr-cover,
  .ssrd-art {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 400px !important;
    box-shadow: 8px 8px 0 var(--ink, #171513);
  }

  /* ---------- Merchant Hub home / page 01 ---------- */
  .merchant-hero {
    min-height: 0 !important;
    padding: 34px 0 60px !important;
  }
  .merchant-hero-inner,
  .merchant-growth-grid,
  .merchant-cockpit-grid,
  .merchant-momentum-grid,
  .merchant-fee-card {
    grid-template-columns: minmax(0,1fr) !important;
    display: grid !important;
    gap: 28px !important;
  }
  .merchant-hero-copy {
    width: 100% !important;
    max-width: none !important;
  }
  .merchant-stage {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 360px !important;
    transform: none !important;
  }
  .merchant-os-shell,
  .merchant-cockpit-screen {
    width: 100% !important;
    max-width: 100% !important;
    transform: none !important;
  }
  .merchant-float,
  .merchant-cockpit-float,
  .merchant-growth-card {
    max-width: 72vw !important;
  }
  .merchant-proof-grid,
  .merchant-launch-grid,
  .merchant-tools-grid,
  .merchant-steps {
    grid-template-columns: 1fr !important;
  }
  .merchant-launch-card,
  .merchant-tool-card,
  .merchant-step {
    min-height: 0 !important;
    width: 100% !important;
  }
  .merchant-phone-stage {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 620px !important;
  }
  .merchant-fee-card {
    padding: 28px 20px !important;
  }

  /* ---------- Tables / pseudo-tables can scroll without widening page ---------- */
  .mf-page table,.pc-page table,.oc-page table,.sr-page table,.bi-page table,.gh-page table,.po-page table,
  .ci-page table,.bs-page table,.cc-page table,.ss-page table,.dc-page table,.sh-page table,.pp-page table,
  .rd-page table,.ms-page table,.sa-page table,.bp-page table,.ti-page table,.ssr-page table,.ssrd-page table {
    width: 100%;
    max-width: 100%;
  }

  /* ---------- Touch targets ---------- */
  .merchant-landing a,
  .merchant-launch-page a,
  .mf-page a,.pc-page a,.oc-page a,.sr-page a,.bi-page a,.gh-page a,.po-page a,.ci-page a,
  .bs-page a,.cc-page a,.ss-page a,.dc-page a,.sh-page a,.pp-page a,.rd-page a,.ms-page a,
  .sa-page a,.bp-page a,.ti-page a,.ssr-page a,.ssrd-page a {
    -webkit-tap-highlight-color: transparent;
  }

  /* No accidental hover transforms that leave cards clipped on touch. */
  .merchant-launch-page article:hover,
  .mf-page article:hover,.pc-page article:hover,.oc-page article:hover,.sr-page article:hover,.bi-page article:hover,
  .gh-page article:hover,.po-page article:hover,.ci-page article:hover,.bs-page article:hover,.cc-page article:hover,
  .ss-page article:hover,.dc-page article:hover,.sh-page article:hover,.pp-page article:hover,.rd-page article:hover,
  .ms-page article:hover,.sa-page article:hover,.bp-page article:hover,.ti-page article:hover,.ssr-page article:hover {
    transform: none;
  }
}

/* Extra-small phones */
@media (max-width: 390px) {
  .merchant-wrap,
  .ml-shell,.mf-shell,.pc-shell,.oc-shell,.sr-shell,.bi-shell,.gh-shell,.po-shell,
  .ci-shell,.bs-shell,.cc-shell,.ss-shell,.dc-shell,.sh-shell,.pp-shell,.rd-shell,
  .ms-shell,.sa-shell,.bp-shell,.ti-shell,.ssr-shell,.ssrd-shell,.merchant-resource-shell {
    padding-left: 13px !important;
    padding-right: 13px !important;
  }

  .merchant-landing h1,
  .merchant-launch-page h1,
  .mf-page h1,.pc-page h1,.oc-page h1,.sr-page h1,.bi-page h1,.gh-page h1,.po-page h1,
  .ci-page h1,.bs-page h1,.cc-page h1,.ss-page h1,.dc-page h1,.sh-page h1,.pp-page h1,
  .rd-page h1,.ms-page h1,.sa-page h1,.bp-page h1,.ti-page h1,.ssr-page h1,.ssrd-page h1 {
    font-size: clamp(36px, 11.5vw, 46px) !important;
  }
}