/* LMYC fluid layout — one shared content box for all pages */

:root {
  --lmyc-site-max: 112rem;
  --lmyc-site-wide: 147rem;
  /*
    Side inset for the MAIN content box (Research .lmyc-collab-band outer edge).
    Rem base on this site is ~10px (Shopify scale).
  */
  --lmyc-gutter: clamp(4rem, calc(1.5rem + 2.8vw), 6rem);
  --lmyc-gutter-tight: clamp(2.5rem, calc(0.75rem + 2.2vw), 4rem);
  --lmyc-content-max: min(var(--lmyc-site-max), 100%);
  --lmyc-content-wide: min(var(--lmyc-site-wide), 100%);
  --lmyc-rail-width: clamp(14rem, calc(2rem + 15vw), 32rem);
  --lmyc-rail-gap: clamp(1.5rem, calc(0.5rem + 2.5vw), 5.5rem);
}

/* Narrow Android phones (≈320–400 CSS px) — 4rem gutters crowd content to the right */
@media screen and (max-width: 767px) {
  :root {
    --lmyc-gutter: clamp(1.6rem, 4.5vw, 2.2rem);
    --lmyc-gutter-tight: clamp(1.4rem, 3.8vw, 2rem);
  }
}

/*
  ONE shell only — never pad both a section and its inner container.
  Research reference: .lmyc-collab-hub__container
*/
#main-content .lmyc-collab-hub__container,
#main-content .page-width,
#main-content .lmyc-subpage-wrap,
#main-content .lmyc-founders-origin-padding,
#main-content .lmyc-lineage-tyi-wrap,
#main-content .lmyc-tt-page__container {
  padding-inline: var(--lmyc-gutter);
  box-sizing: border-box;
}

/* TT page shell — no side pad (gutter lives on __container, like Research) */
#main-content .lmyc-tt-page {
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}

/* Our Space intro: gutter on intro shell; its inner .page-width stays flush */
#main-content #lmyc-space-parallax .lmyc-space-parallax-intro {
  padding-inline: var(--lmyc-gutter);
  box-sizing: border-box;
}

#main-content #lmyc-space-parallax .lmyc-space-parallax-intro .page-width {
  padding-inline: 0;
  box-sizing: border-box;
}

/* Our Space gallery reveal uses .page-width as the shell — keep shared gutter */
#main-content #lmyc-space-parallax .lmyc-space-parallax-reveal.page-width {
  padding-inline: var(--lmyc-gutter);
  box-sizing: border-box;
}

/* Never pad the Research/Collab SECTION — only __container */
#main-content .lmyc-collab-hub,
#main-content .lmyc-research-hub {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* About pages — wide max width */
body.lmyc-about-page #main-content .page-width,
body.lmyc-about-page #main-content .lmyc-lineage-tyi-wrap,
body.lmyc-about-page #main-content #lmyc-space-parallax .lmyc-space-parallax-intro .page-width,
body.lmyc-about-page #main-content #lmyc-space-parallax .lmyc-space-parallax-reveal.page-width,
body.lmyc-about-page #main-content .lmyc-founders-origin-padding {
  max-width: var(--lmyc-content-wide);
  margin-inline: auto;
}

/*
  MacBook / laptop widths (≈13–16″ CSS viewports)
  Match Research band outer edge (~115px inset at 1470).
  Was max 1511 — 14″ Macs at 1512 fell out and used a smaller gutter.
*/
@media screen and (min-width: 992px) and (max-width: 1799px) {
  :root {
    /* 7.8vw ≈ 115px @ 1470 — same as Research .lmyc-collab-band left edge */
    --lmyc-gutter: clamp(10rem, 7.8vw, 12rem);
  }

  #main-content .lmyc-collab-hub__container,
  #main-content .page-width,
  #site-footer .page-width,
  .footer__content-top.page-width,
  #main-content .lmyc-subpage-wrap,
  #main-content .lmyc-founders-origin-padding,
  #main-content .lmyc-lineage-tyi-wrap,
  #main-content .lmyc-tt-page__container,
  #main-content #lmyc-space-parallax .lmyc-space-parallax-intro,
  #main-content .lmyc-space-sanctuary-wrap .page-width,
  #main-content .lmyc-space-stack-section .page-width,
  #main-content .lmyc-smile-wrap,
  #main-content .lmyc-resources-main .page-width,
  body.lmyc-category-page #main-content .page-width,
  body.lmyc-pricing-page-body #main-content .page-width,
  body.lmyc-booking-page #main-content .page-width,
  body.lmyc-home-page #main-content .page-width {
    padding-left: var(--lmyc-gutter) !important;
    padding-right: var(--lmyc-gutter) !important;
    box-sizing: border-box;
  }

  /* Flush inners — no second inset */
  #main-content .lmyc-tt-page,
  #main-content #lmyc-space-parallax .lmyc-space-parallax-intro .page-width,
  #main-content .lmyc-collab-hub,
  #main-content .lmyc-research-hub,
  #main-content .lmyc-volunteer-hub {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Reveal gallery is its own shell — same inset as Research band */
  #main-content #lmyc-space-parallax .lmyc-space-parallax-reveal.page-width {
    padding-left: var(--lmyc-gutter) !important;
    padding-right: var(--lmyc-gutter) !important;
  }

  /* Full-width blocks inside the shared box (align with Research band) */
  #main-content .lmyc-space-collage,
  #main-content .lmyc-space-parallax-reveal .lmyc-space-collage {
    max-width: 100%;
    width: 100%;
    margin-inline: 0;
  }

  /* Lineage timeline sometimes hardcodes a smaller pad — force shared gutter */
  #main-content .lmyc-lineage-section .page-width.lmyc-lineage-timeline {
    padding-left: var(--lmyc-gutter) !important;
    padding-right: var(--lmyc-gutter) !important;
  }
}