/* ===== from main.css lines 156-185 ===== */
    /* overflow-x: clip prevents the .hero full-bleed trick (width: 100vw +
       negative inline margin canceling .shell's gutter) from causing a
       horizontal scrollbar when the native vertical scrollbar eats viewport
       width. Clip is safer than hidden here — it doesn't establish a
       scroll container or a containing block for fixed descendants. */
    html { margin: 0; padding: 0; overflow-x: clip; overflow-clip-margin: 100px; }
    body {
      margin: 0;
      /* Bottom inset reserves space for the floating .bottom-nav (≈50 px pill
         + 16 px breathing room + iOS home indicator) so the last carrousel
         remains scrollable above the nav. */
      padding: 0 0 calc(env(safe-area-inset-bottom, 0px) + 100px) 0;
      overflow-x: clip;
      overflow-clip-margin: 100px;
      min-height: 100vh;
      min-height: 100dvh;
      background: var(--bg);
      color: var(--text);
      font-family: var(--font);
      -webkit-font-smoothing: antialiased;
      text-rendering: optimizeLegibility;
      position: relative;
      display: flow-root;
    }
    html.app-surface-scroll-locked,
    body.app-surface-scroll-locked {
      overscroll-behavior: none;
    }

    button, input { font: inherit; }
    button,
    [role="button"],
    .icon-button,
    .brand-logo,
    .brand-back,
    .bottom-nav-item {
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      user-select: none;
    }

    h1, h2, h3, h4 {
      margin: 0;
      font-weight: 700;
      line-height: var(--lh-tight);
      color: var(--text);
    }