/**
 * Link Mahal — mobile landing audit (iPhone-first).
 * Fixes safe areas, nav clearance, overflow, spacing, and mock containment.
 * Does not change brand or section design — implementation quality only.
 */

:root {
  --landing-header-offset: calc(var(--landing-nav-float-gap) + var(--landing-nav-pill-h) + 0.75rem);
  --landing-safe-bottom: env(safe-area-inset-bottom, 0px);
  --landing-safe-top: env(safe-area-inset-top, 0px);
  --landing-safe-left: env(safe-area-inset-left, 0px);
  --landing-safe-right: env(safe-area-inset-right, 0px);
  --lm-mobile-section-y: clamp(2.5rem, 6.5vw, 3.25rem);
  --lm-mobile-section-gap: clamp(1rem, 3vw, 1.5rem);
  --lm-mobile-head-gap: clamp(1.25rem, 3.5vw, 1.75rem);
}

/* ── Document + overflow guard ─────────────────────────────── */
html {
  -webkit-text-size-adjust: 100%;
  scroll-padding-top: var(--landing-header-offset);
}

html.lm-scroll-ready:has(body.landing-page--snap) {
  scroll-padding-bottom: max(1rem, env(safe-area-inset-bottom, 0px));
}

html:has(body.landing-page),
html:has(body.landing-marketing) {
  overflow-x: clip;
  max-width: 100%;
}

body.landing-page,
body.landing-marketing {
  overflow-x: clip;
  max-width: 100%;
  min-height: 100%;
  min-height: 100dvh;
  padding-bottom: var(--landing-safe-bottom);
}

.landing-main {
  overflow-x: clip;
  max-width: 100%;
}

/* Anchor targets — never hide under fixed nav */
.landing-hero,
.landing-section,
.landing-flow-strip,
.landing-order-live,
.landing-trust-band,
.section-profit-cta,
.section-cta-final,
.section-setup-concierge,
.section-ai-home,
.section-capabilities,
.section-problem,
.section-steps,
.section-pricing,
.section-demo,
.section-features,
.features-ala,
.section-live-stores,
.section-testimonials,
.lm-faq-section,
.lm-cta-block,
[id].landing-panel {
  scroll-margin-top: var(--landing-header-offset);
}

/* ── Hero — content always below nav (mobile tightening) ───── */
@media (max-width: 768px) {
  .landing-hero--split.landing-hero--light.landing-hero--animated {
    padding-top: calc(var(--landing-header-offset) + clamp(0.85rem, 2.5vw, 1.35rem));
  }
}

.landing-hero-split__grid {
  gap: clamp(1.5rem, 4vw, 2rem);
}

.landing-hero-title--split {
  text-wrap: balance;
}

.landing-hero-lead--split,
.landing-hero-definition,
.landing-section-sub,
.demo-lead {
  text-wrap: wrap;
}

.landing-hero-title-rotate .landing-hero-title-prefix {
  display: block;
}

.landing-hero-words-wrap {
  max-width: 100%;
}

.landing-hero-words {
  max-width: min(var(--lm-rotate-width, var(--hero-word-width, 8ch)), 100%);
}

@media (max-width: 768px) {
  .landing-hero-title--split {
    align-items: center;
    width: 100%;
    margin-inline: auto;
    font-size: clamp(2.85rem, 11.8vw, 3.65rem);
    line-height: 1.02;
    letter-spacing: -0.045em;
  }

  .landing-hero-lead--compact,
  .landing-hero-lead--ala {
    font-size: clamp(0.9375rem, 3.6vw, 1.0625rem);
    line-height: 1.58;
    max-width: 24rem;
    margin-inline: auto;
    color: #44403c;
  }

  .landing-hero-cta-row--split .lm-claim-bar-wrap {
    max-width: min(100%, 26rem);
    margin-inline: auto;
    width: 100%;
  }

  .lm-claim-bar__submit {
    font-size: 0.875rem;
    padding: 0.85rem 1.15rem;
  }

  .lm-claim-cta__title,
  .lm-claim-cta__title--ala {
    font-size: clamp(2.35rem, 10.5vw, 3.15rem);
    line-height: 1.02;
    letter-spacing: -0.04em;
    margin-bottom: 1rem;
  }

  .lm-claim-cta__lead {
    font-size: clamp(0.9375rem, 3.8vw, 1.0625rem);
    margin-bottom: 1.35rem;
    max-width: 22rem;
  }

  .lm-cta-block--claim .lm-claim-bar-wrap,
  .lm-claim-bar-wrap--final {
    max-width: min(100%, 26rem);
  }

  .landing-hero-title-rotate {
    align-items: center;
    width: 100%;
    margin-inline: auto;
    row-gap: 0.06em;
  }

  .landing-hero-title-prefix {
    text-align: center;
    width: 100%;
    font-size: 1em;
    font-weight: 800;
  }

  .landing-hero-words-wrap {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-inline: auto;
    min-height: 1.38em;
    padding-bottom: 0.16em;
  }

  .landing-hero-words {
    margin-inline: auto;
    text-align: center;
    height: 1.38em;
    line-height: 1.38;
  }

  .landing-hero-word {
    font-size: 1.08em;
    font-weight: 800;
    left: 50%;
    right: auto;
    transform: translateX(-50%) translateY(108%) scale(0.96);
  }

  .landing-hero-word.is-active {
    transform: translateX(-50%) translateY(0) scale(1);
  }

  .landing-hero-word.is-leaving-up {
    transform: translateX(-50%) translateY(-92%) scale(0.98);
  }

  .landing-hero-word.is-leaving-down {
    transform: translateX(-50%) translateY(92%) scale(0.98);
  }
}

/* ── Section rhythm (mobile) ───────────────────────────────── */
@media (max-width: 768px) {
  .landing-page {
    --lm-space-section-y: var(--lm-mobile-section-y);
    --lm-space-section-margin-y: var(--lm-mobile-section-gap);
    --lm-space-head-bottom: var(--lm-mobile-head-gap);
    --lm-space-hero-bottom: clamp(1.5rem, 4vw, 2rem);
  }

  .landing-main > .landing-section,
  .landing-main > .landing-trust-band,
  .landing-main > .section-profit-cta,
  .landing-main > .section-cta-final,
  .landing-main > .landing-flow-strip.landing-section,
  .landing-main > .landing-order-live {
    padding-top: var(--lm-mobile-section-y);
    padding-bottom: var(--lm-mobile-section-y);
  }

  .landing-section-head {
    margin-bottom: var(--lm-mobile-head-gap);
  }

  .landing-section-title {
    font-size: clamp(1.5rem, 6.2vw, 1.875rem);
    line-height: 1.15;
    text-wrap: wrap;
  }

  .landing-section-sub {
    font-size: clamp(0.9375rem, 3.6vw, 1.02rem);
    line-height: 1.55;
    max-width: 36rem;
  }

  .landing-section-eyebrow {
    font-size: 0.6875rem;
    margin-bottom: 0.55rem;
  }

  /* Remove generic override that undercuts safe nav offset */
  .landing-hero,
  .landing-hero--split.landing-hero--light.landing-hero--animated,
  .landing-page--snap .landing-hero.landing-panel.landing-hero--split.landing-hero--light.landing-hero--animated {
    padding-top: calc(var(--landing-header-offset) + clamp(0.85rem, 2.5vw, 1.35rem));
  }
}

.section-demo .demo-section-head,
.section-demo .demo-copy,
.section-demo .demo-caption__panel.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
}

.section-demo .demo-bullets li {
  opacity: 1;
  visibility: visible;
}
@media (max-width: 768px), (pointer: coarse) {
  .landing-page.landing-anim-ready [data-animate]:not(.is-revealed),
  .landing-page.landing-anim-ready [data-stagger-group]:not(.is-revealed) [data-stagger-item] {
    opacity: 1;
    transform: none;
    pointer-events: auto;
    transition: none;
  }
}

@media (max-width: 768px) {
  .features-ala__head .landing-section-title,
  .features-ala__lead,
  .features-ala__card-title,
  .features-ala__card-text,
  .demo-lead,
  .demo-section-head .landing-section-title {
    text-wrap: wrap;
  }
}

@media (max-width: 768px) {
  .lm-safari-float-layer {
    display: none !important;
  }
}

/* ── Hero mock + notifications (contain inside visual column) ── */
@media (max-width: 768px) {
  .landing-hero-visual,
  .landing-hero-split .landing-hero-visual,
  .hero-mock,
  .hero-mock__canvas,
  .hero-mock__orbit,
  .hero-mock__stage,
  .hero-mock__device,
  .hero-mock__phone-wrap {
    overflow: visible;
    max-width: 100%;
  }

  .hero-mock {
    width: min(100%, calc(var(--lm-ala-phone-w, 280px) * var(--hero-mock-scale, 0.92) + calc(3.5rem * var(--hero-mock-scale, 0.92))));
    max-width: 100%;
  }

  .hero-mock__canvas {
    padding-top: calc(0.85rem * var(--hero-mock-scale, 0.92));
    padding-bottom: calc(0.75rem * var(--hero-mock-scale, 0.92));
    padding-inline: calc(clamp(0.65rem, 3.5vw, 1rem) * var(--hero-mock-scale, 0.92));
  }

  .lm-mock-notify {
    overflow: visible;
  }

  .hero-mock__orbit {
    padding-inline: clamp(1.25rem, 4.5vw, 2rem);
  }

  .hero-mock__orbit .lm-mock-notify--hero-menu .lm-mock-notify__slot {
    max-width: min(13rem, 74vw);
  }
}

@media (max-width: 480px) {
  .lm-mock-notify--hero:not(.lm-mock-notify--hero-menu) {
    display: none;
  }

  .hero-mock__orbit .lm-mock-notify--hero-menu .lm-mock-notify__slot {
    max-width: min(12rem, 70vw);
  }

  .hero-mock__orbit .lm-mock-notify--hero-menu .lm-mock-notify__slot--orbit-1 {
    bottom: 10%;
  }
}

@media (max-width: 380px) {
  .landing-hero-title--split {
    font-size: clamp(2.55rem, 12.5vw, 3.15rem);
  }

  .landing-hero-title-rotate {
    row-gap: 0.05em;
  }

  .lm-claim-cta__title,
  .lm-claim-cta__title--ala {
    font-size: clamp(2.1rem, 11vw, 2.75rem);
  }
}

/* ── Flow strip + order-live — stop negative seam overlap on small screens ── */
@media (max-width: 768px) {
  .landing-main > .landing-flow-strip.landing-section + .landing-section,
  .landing-main > .landing-flow-strip.landing-section + .landing-order-live {
    margin-top: clamp(1.25rem, 4vw, 2rem);
  }

  .landing-flow-strip .landing-section-head {
    margin-bottom: var(--lm-mobile-head-gap);
  }

  .landing-flow-layout {
    gap: clamp(1.25rem, 4vw, 1.75rem);
  }

  .landing-flow-strip__cta {
    margin-top: clamp(1.25rem, 4vw, 1.75rem);
    margin-bottom: 0.25rem;
  }

  .landing-page--snap .landing-flow-strip.landing-panel {
    min-height: auto;
    padding-bottom: clamp(2rem, 5vw, 2.75rem);
  }

  .landing-page--snap .landing-order-live.landing-panel {
    min-height: auto;
    justify-content: flex-start;
    padding-top: clamp(2.25rem, 6vw, 3rem);
  }

  .landing-order-straight .lm-ost-head .landing-section-title,
  .landing-order-straight .lm-ost-caption__title {
    text-wrap: balance;
  }

  .landing-order-straight .lm-ost-caption__text {
    text-wrap: pretty;
  }

  .landing-order-straight .lm-ost-layout {
    gap: clamp(1.15rem, 4vw, 1.65rem);
  }
}

/* ── Flow strip — ala.menu phone (landing-flow-ala.css owns layout) ── */
@media (max-width: 640px) {
  .landing-flow-float.lm-notify-pill-slot .lm-mock-notify-card__headline,
  .landing-flow-float.lm-notify-pill-slot .lm-mock-notify-card__subline {
    white-space: normal;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}

/* ── Orders straight to you demo ─────────────────────────────── */
@media (max-width: 899px) {
  .landing-order-straight .lm-ost-lead {
    margin-bottom: 0;
  }

  .landing-order-straight .lm-ost-stage {
    max-width: min(100%, var(--lm-ost-stage-w, 20rem));
    height: clamp(20rem, 66vw, 26rem);
  }

  .landing-order-straight .lm-ost-visual,
  .landing-order-straight .lm-ost-stage,
  .landing-order-straight .lm-ost-visual-col {
    overflow: visible;
  }
}

@media (max-width: 599px) {
  .landing-order-straight .lm-ost-visual {
    margin-inline: calc(-1 * var(--lm-space-container-x));
    max-width: calc(100% + var(--lm-space-container-x) * 2);
  }

  .landing-order-straight .lm-ost-stage {
    max-width: min(100%, 19rem);
    height: clamp(21rem, 72vw, 26rem);
  }
}

/* ── Zero-effort setup (WhatsApp mock) ───────────────────────── */
@media (max-width: 768px) {
  .lm-setup-concierge__shell {
    padding: 1rem;
  }

  .lm-setup-concierge__visual-wrap {
    max-width: min(100%, 20rem);
    overflow: visible;
  }

  .lm-setup-concierge__visual-badge {
    top: -0.45rem;
    right: 0.5rem;
    font-size: 0.58rem;
  }
}

/* ── Demo / product showcase (mobile) ──────────────────────── */
@media (max-width: 1023px) {
  .section-demo .demo-section-head {
    margin-bottom: 0.15rem;
  }

  .section-demo .demo-stage-col,
  .section-demo .demo-layout,
  .demo-visual {
    overflow: visible;
    width: 100%;
    max-width: 100%;
  }

  .section-demo .demo-grid {
    gap: clamp(1rem, 3vw, 1.35rem);
  }

  .section-demo .demo-copy {
    text-align: start;
    max-width: 100%;
  }

  .section-demo .demo-bullets {
    gap: 0.25rem;
    margin-top: 0;
  }
}

/* ── Features stack ──────────────────────────────────────────── */
@media (max-width: 768px) {
  .features-display__stack-wrap,
  .features-display__stack {
    overflow: hidden;
    max-width: 100%;
  }

  .features-display-card--stack {
    max-width: calc(100% - 0.5rem);
  }

  .ai-home-visual,
  .ai-home-mock-wrap,
  .ai-ala-visual,
  .ai-ala-mock {
    overflow: visible;
    max-width: min(100%, 19.5rem);
    margin-inline: auto;
  }

  .ai-home-mock-wrap__notify.lm-notify-pill-slot {
    top: 4%;
    right: 0;
    max-width: calc(100% - 0.5rem);
  }

  .ai-home-mock-wrap__notify .lm-mock-notify-card {
    max-width: 100%;
  }

  .ai-home-benefit {
    padding: 0.48rem 0.62rem;
    font-size: 0.75rem;
  }

  .ai-home-card {
    border-radius: calc(var(--lm-radius) + 2px);
  }
}

/* ── Pricing + testimonials ──────────────────────────────────── */
@media (max-width: 768px) {
  .pricing-grid,
  .testimonials-columns {
    max-width: 100%;
    overflow: hidden;
  }
}

@media (max-width: 480px) {
  .section-profit-cta__visual {
    overflow: hidden;
  }

  .section-profit-cta__chip {
    max-width: calc(100% - 1.5rem);
    white-space: normal;
    font-size: 0.625rem;
  }
}

/* ── Nav drawer + iOS Safari ─────────────────────────────────── */
@media (max-width: 1023px) {
  .landing-nav-drawer {
    padding-bottom: var(--landing-safe-bottom);
  }

  .landing-nav-drawer__panel {
    padding-bottom: calc(0.5rem + var(--landing-safe-bottom));
  }

  body.landing-nav-open {
    overflow: hidden;
    touch-action: none;
  }
}

.lm-footer-body,
.lm-site-footer {
  padding-bottom: calc(clamp(1.25rem, 3vw, 1.75rem) + var(--landing-safe-bottom));
}

/* ── Breadcrumb / flash under nav ────────────────────────────── */
.marketing-breadcrumb-wrap,
.landing-container[style*='padding-top'] {
  padding-top: calc(var(--landing-header-offset) + 0.5rem) !important;
}

@media (min-width: 769px) {
  .marketing-breadcrumb-wrap {
    padding-top: calc(var(--landing-header-offset) + 0.25rem) !important;
  }
}