/* Progressive enhancement: the complete consumer page stays vertical without
   JavaScript and on phones/tablets. Desktop uses the company site's chapters. */
.chapter-content { display:contents; }
.consumer-chapters { display:none; }

@media (min-width:1100px) and (min-height:600px) {
  html.consumer-horizontal {
    --chapter-header:88px;
    --chapter-footer:64px;
    --chapter-height:calc(100dvh - var(--chapter-header) - var(--chapter-footer));
    overflow:hidden;
    scroll-padding:0;
  }
  .consumer-horizontal body { height:100dvh; overflow:hidden; }
  .consumer-horizontal body::before {
    position:fixed; height:var(--chapter-header); z-index:30;
    background:var(--butter);
  }
  .consumer-horizontal .logo-pill {
    position:fixed; top:8px; left:50%; transform:translateX(-50%);
    height:72px; z-index:31;
  }
  .consumer-horizontal .nav-cluster { display:none; }
  .consumer-horizontal #consumer-track {
    position:fixed; inset:var(--chapter-header) 0 var(--chapter-footer);
    display:flex; overflow-x:auto; overflow-y:hidden;
    scroll-snap-type:x mandatory; scrollbar-width:none;
    overscroll-behavior-x:contain; scroll-behavior:smooth;
  }
  .consumer-horizontal #consumer-track::-webkit-scrollbar { display:none; }
  .consumer-horizontal #consumer-track > [data-chapter] {
    flex:0 0 100%; width:100%; max-width:none; height:100%; min-height:0;
    display:flex; flex-direction:column; align-items:stretch;
    margin:0; padding:32px clamp(32px,4vw,80px);
    scroll-snap-align:start; scroll-snap-stop:always; scroll-margin:0;
    overflow-x:hidden; overflow-y:auto; border:0; border-radius:0;
    position:relative; gap:0;
  }
  .consumer-horizontal .chapter-content {
    display:block; flex:none; width:100%; max-width:1280px;
    margin:auto; min-width:0;
  }
  .consumer-horizontal .consumer-chapters {
    position:fixed; inset:auto 0 0; z-index:30;
    display:flex; align-items:center; justify-content:space-between; gap:20px;
    height:var(--chapter-footer); padding:8px clamp(24px,4vw,80px);
    background:var(--butter); border-top:1px solid var(--ink);
  }
  .consumer-chapter-links { display:flex; align-items:center; gap:clamp(8px,1.5vw,24px); min-width:0; }
  .consumer-chapter-links a {
    display:flex; align-items:center; gap:6px; min-height:44px;
    color:var(--ink); font:400 14px/1.2 var(--sans); white-space:nowrap;
    text-decoration:none; border-bottom:2px solid transparent;
  }
  .consumer-chapter-links a span { font-size:11px; color:var(--ink-2); }
  .consumer-chapter-links a[aria-current] { border-color:var(--terra); font-weight:700; }
  .consumer-chapter-links a:hover { text-decoration:underline; text-underline-offset:5px; }
  .consumer-chapter-controls { display:flex; gap:8px; flex:none; }
  .consumer-chapter-controls button {
    display:grid; place-items:center; width:44px; height:44px; min-height:44px;
    background:transparent; border:1px solid var(--ink); border-radius:6px;
    color:var(--ink); font:400 22px/1 var(--sans); cursor:pointer;
  }
  .consumer-chapter-controls button:hover:not(:disabled) { background:var(--paper); }
  .consumer-chapter-controls button:disabled { opacity:.3; cursor:default; }

  /* Keep the existing brand artwork, signup and copy, scaled to the chapter. */
  .consumer-horizontal .hero-copy { max-width:900px; }
  .consumer-horizontal .hero-topRow { margin-bottom:20px; }
  .consumer-horizontal .friendship-frame {
    width:min(100%,calc((var(--chapter-height) - 320px) * 1.9));
    min-width:450px; padding:16px; margin-inline:auto;
  }
  .consumer-horizontal .hero-signup { margin-top:24px; }
  .consumer-horizontal .signup-label { font-size:24px; margin-bottom:12px; }
  .consumer-horizontal .hero .platform-pills { margin-top:12px; }
  .consumer-horizontal .hero .invite-feedback { margin-top:12px; }

  .consumer-horizontal .sec-head { margin-bottom:28px; padding-bottom:24px; flex-wrap:nowrap; gap:40px; }
  .consumer-horizontal .sec-h2 { font-size:clamp(38px,3.5vw,56px); }
  .consumer-horizontal .sec-lead { flex:0 0 32%; }
  .consumer-horizontal .blueprint-grid { grid-template-columns:minmax(0,1.4fr) minmax(300px,.8fr); gap:40px; }
  .consumer-horizontal .figure-card { padding:24px; }
  .consumer-horizontal .receipt { padding:24px; }

  .consumer-horizontal .theater-sticky { grid-template-columns:minmax(0,1fr) minmax(320px,1fr); gap:64px; }
  .consumer-horizontal .theater-stage { width:100%; max-width:560px; margin-left:auto; --stage-padding-y:20px; }
  .consumer-horizontal .iphone-shell {
    width:min(350px,100%,calc((var(--chapter-height) - 64px - 2 * var(--stage-padding-y) - 66px) * 490 / 1000));
  }
  .consumer-horizontal .theater-tabs { margin-top:24px; }
  .consumer-horizontal .theater-description { min-height:140px; padding-top:24px; }
  .consumer-horizontal .scrub-sec .chapter-content { max-width:1000px; text-align:center; }
  .consumer-horizontal .scrub-p { font-size:clamp(38px,4.2vw,62px); }
  .consumer-horizontal .scrub-word.is-accent { text-decoration:underline; text-decoration-color:var(--terra); text-underline-offset:8px; text-decoration-thickness:2px; }
  .consumer-horizontal .scrub-doodle { opacity:.45; }
  .consumer-horizontal .bento-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
  .consumer-horizontal .bento-card { padding:24px; }
  .consumer-horizontal .bento-title { font-size:26px; }

  .consumer-horizontal .faq-sec .chapter-content {
    display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); column-gap:72px;
    align-items:start;
  }
  .consumer-horizontal .faq-sec .kicker { grid-column:1; }
  .consumer-horizontal .faq-sec .sec-h2 { grid-column:1; grid-row:2; align-self:start; }
  .consumer-horizontal .faq-list { grid-column:2; grid-row:1 / 4; margin-top:0; width:100%; }
  .consumer-horizontal .faq-item summary { font-size:16px; padding-block:20px; }
  .consumer-horizontal .faq-body { font-size:16px; }

  .consumer-horizontal .consumer-team-grid { grid-template-columns:repeat(4,minmax(0,1fr)); margin-top:32px; gap:32px; }
  .consumer-horizontal .consumer-team-heading { padding-bottom:24px; }
  .consumer-horizontal .consumer-headshot { width:112px; height:112px; margin-bottom:20px; }
  .consumer-horizontal .consumer-role { min-height:48px; }
  .consumer-horizontal .consumer-person h3 { font-size:28px; min-height:64px; }
  .consumer-horizontal .consumer-bio { margin-block:12px 16px; }
  .consumer-horizontal .close-pod .chapter-content { max-width:1000px; text-align:center; }
  .consumer-horizontal .close-formWrap { margin-inline:auto; }
  .consumer-horizontal .site-footer .footer-wordmarkWrap { max-width:200px; margin-block:28px; }
  .consumer-horizontal .site-footer .footer-top { margin:0; }
  .consumer-horizontal .footer-fine { gap:24px; }
}
@media (min-width:1100px) and (min-height:600px) and (max-height:800px) {
  html.consumer-horizontal { --chapter-header:72px; --chapter-footer:56px; }
  .consumer-horizontal .logo-pill { top:4px; height:64px; }
  .consumer-horizontal .logo-lockupSvg { height:56px; width:100px; }
  .consumer-horizontal #consumer-track > [data-chapter] { padding-block:20px; }
  .consumer-horizontal .hero-topRow { margin-bottom:16px; }
  .consumer-horizontal .friendship-frame { padding:12px; }
  .consumer-horizontal .hero-signup { margin-top:18px; }
  .consumer-horizontal .sec-head { padding-bottom:20px; margin-bottom:20px; }
  .consumer-horizontal .sec-h2 { font-size:40px; }
  .consumer-horizontal .figure-card { padding:16px; }
  .consumer-horizontal .figure-topMeta { font-size:10px; letter-spacing:.04em; }
  .consumer-horizontal .receipt { padding:16px; }
  .consumer-horizontal .blueprint-sec .sec-head { margin-bottom:12px; padding-bottom:16px; }
  .consumer-horizontal .theater-stage { --stage-padding-y:12px; gap:12px; }
  .consumer-horizontal .iphone-shell {
    width:min(350px,100%,calc((var(--chapter-height) - 40px - 2 * var(--stage-padding-y) - 58px) * 490 / 1000));
  }
  .consumer-horizontal .theater-tabs { margin-top:20px; }
  .consumer-horizontal .theater-description { min-height:128px; }
  .consumer-horizontal .bento-card { padding:20px; }
  .consumer-horizontal .consumer-team-heading { padding-bottom:20px; }
  .consumer-horizontal .consumer-team h2 { font-size:44px; margin-top:12px; }
  .consumer-horizontal .consumer-team-grid { margin-top:24px; }
  .consumer-horizontal .consumer-headshot { width:88px; height:88px; margin-bottom:16px; }
  .consumer-horizontal .consumer-person h3 { min-height:62px; }
  .consumer-horizontal .consumer-role { margin-top:6px; min-height:46px; }
  .consumer-horizontal .consumer-bio { margin-block:8px 12px; line-height:1.5; }
}
@media (prefers-reduced-motion:reduce) {
  .consumer-horizontal #consumer-track { scroll-behavior:auto; }
}
@media print {
  html.consumer-horizontal, .consumer-horizontal body { height:auto; overflow:visible; }
  .consumer-horizontal #consumer-track { position:static; display:block; overflow:visible; }
  .consumer-horizontal #consumer-track > [data-chapter] { height:auto; overflow:visible; break-before:page; }
  .consumer-horizontal .consumer-chapters { display:none; }
}
