/* Landing page: the wide layout and the reduced-motion fallbacks. Loaded after landing.css. */
@media (min-width: 900px) {
  body.lp-page { --gutter: 40px; font-size: 18px; }
  .lp-hero { padding-top: 22px; }
  .lp-hero::before { width: 900px; left: auto; right: -160px; bottom: -420px; translate: none; }
  .lp-bar { padding: 16px 26px; }
  .lp-hero-grid { grid-template-columns: 1.1fr 0.9fr; align-items: end; gap: 40px; padding-top: 72px; }
  .lp-hero-copy { padding-bottom: 96px; }
  :where(.lp-page) h1 { font-size: 6rem; }
  :where(.lp-page):lang(th) h1 { font-size: 5.4rem; }
  .lp-lede { font-size: 1.35rem; max-width: 34ch; }
  .lp-cta-row .lp-btn { width: auto; }
  .lp-hero-phone { width: 360px; height: 520px; justify-self: end; margin-right: 60px; }
  .lp-hero-fox { width: 236px; right: -104px; }
  .lp-feed { padding: 64px 0 104px; }
  .lp-feed-head { margin-top: 96px; }
  .lp-rail { padding-inline: max(var(--gutter), calc((100vw - var(--max)) / 2 + var(--gutter))); gap: 16px; }
  .lp-clip { width: 230px; }
  .lp-stills-row img { width: 96px; }
  .lp-earn, .lp-board, .lp-months, .lp-how, .lp-faq { padding: 112px 0 120px; }
  .lp-earn-grid { grid-template-columns: 0.9fr 1.1fr; gap: 64px; align-items: center; }
  .lp-earn-panel { padding: 36px 36px 38px; }
  .lp-board-grid { grid-template-columns: 0.8fr 1.2fr; gap: 64px; align-items: start; }
  .lp-board-head { position: sticky; top: 40px; }
  .lp-page a.lp-row.is-you { grid-template-columns: 64px minmax(0, 1fr) auto; }
  .lp-row.is-you .lp-row-amt { grid-column: auto; text-align: right; }
  .lp-notif:nth-child(n + 2) { margin-right: 0; }
  .lp-slips { margin-inline: 0; padding-inline: 0; overflow: visible; display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
  .lp-slip { width: auto; }
  .lp-how-grid { grid-template-columns: 1.15fr 0.85fr; gap: 88px; align-items: start; }
  .lp-faq-grid { grid-template-columns: 0.8fr 1.2fr; gap: 64px; }
  .lp-about { padding: 96px 0 100px; }
  .lp-about-grid { grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
  .lp-pay { padding: 32px 32px 34px; }
  .lp-about-body { font-size: 1.35rem; }
  .lp-pay-bar { height: 64px; }
  .lp-last { padding-top: 112px; }
  .lp-last-grid { grid-template-columns: 1.2fr 0.8fr; align-items: end; }
  .lp-last-grid > div { padding-bottom: 112px; }
  .lp-last .lp-btn { width: auto; }
  .lp-last-fox { width: 340px; }
  .lp-foot { padding-bottom: 40px; }
  .lp-stick { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  .lp-tick-track, .lp-stills-row { animation: none; }
  .lp-tick, .lp-stills { overflow-x: auto; }
  .lp-hl::before { animation: none; transform: rotate(-1.6deg); }
  .lp-notif.is-enter, .lp-notif.is-leave, .lp-levels li.is-pop { animation: none; }
  .lp-btn, .lp-stick { transition: none; }
}
