/* MEMGO: a clear sequence from the idea to the product and everyday use. */
:root, body.home-page {
  --paper:#edece6;
  --ink:#161719;
  --muted:#626568;
  --line:#d4d6d5;
  --blue:#161719;
  --white:#fff;
  --sans:"Helvetica Neue",Helvetica,Arial,sans-serif;
  --serif:var(--sans);
  --page-pad:clamp(24px,5vw,80px);
  --header-height:64px;
  --max-width:1440px;
  background:var(--paper);
  color:var(--ink)
}
body:is(.home-page,.story-page,.purchase-page) {
  --content-gutter:clamp(20px,4vw,80px);
  --page-pad:var(--content-gutter);
  --layout-gap:clamp(28px,4vw,80px);
  --section-space:clamp(60px,7vw,132px)
}
:is(.home-page,.story-page,.purchase-page) .page-shell,
:is(.home-page,.story-page,.purchase-page) .header-inner { width:100%; max-width:none; padding-inline:var(--page-pad) }
html { scroll-padding-top:80px }
html:has(> body.home-page) { scroll-padding-top:0 }
body { background:var(--paper); color:var(--ink) }
body h1, body h2, .home-page h1, .home-page h2 { font-family:var(--sans); font-weight:500; letter-spacing:-.055em; line-height:1.06; text-wrap:balance }
h3 { font-weight:500 }
.zen-section-label { color:var(--muted); font-size:11px; line-height:1.6; letter-spacing:.1em; text-transform:uppercase }
.site-header { background:rgba(245,245,242,.9); border-bottom:0; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px) }
.header-inner, .home-page .header-inner { min-height:var(--header-height); padding-block:10px; gap:32px }
.brand, .home-page .brand { width:104px }
.desktop-nav, .home-page .desktop-nav { gap:34px; font-size:12px; letter-spacing:0 }
.desktop-nav a, .header-story { color:var(--ink) }
.desktop-nav a:hover { color:var(--muted) }
.header-cta, .home-page .header-cta { display:flex; justify-content:center; align-items:center; min-height:34px; padding:7px 16px; gap:20px; border:1px solid #8a8c8b; border-radius:0; background:transparent; color:var(--ink); font-size:11px; font-weight:400; letter-spacing:0; transition:background .2s,color .2s }
.header-cta:hover, .home-page .header-cta:hover { background:var(--ink); border-color:var(--ink); color:var(--white) }
.button-primary, .home-page .button-primary { display:inline-flex; align-items:center; justify-content:space-between; gap:40px; min-height:48px; padding:14px 22px; background:var(--ink); border:1px solid var(--ink); border-radius:0; color:var(--white); font-size:13px; font-weight:400; box-shadow:none }
.button-primary:hover, .home-page .button-primary:hover { background:#343639; border-color:#343639; transform:none }
.quiet-link { display:inline-flex; align-items:center; justify-content:space-between; gap:42px; min-height:44px; padding:10px 0; border-bottom:1px solid #909391; color:var(--ink); font-size:13px; font-weight:400 }
.quiet-link:hover { text-decoration:none; border-color:currentColor }
.quiet-link span { transition:transform .2s }
.quiet-link:hover span { transform:translate(2px,-2px) }

/* The first image reaches the top edge; navigation has no separate panel. */
.home-page .site-header { position:absolute; inset:0 0 auto; color:var(--white); background:transparent; border:0; -webkit-backdrop-filter:none; backdrop-filter:none }
.home-page .brand img { filter:brightness(0) invert(1) }
.home-page .desktop-nav a, .home-page .header-story { color:var(--white) }
.home-page .desktop-nav a:hover, .home-page .header-story:hover { color:rgba(255,255,255,.7) }
.home-page .header-cta { color:var(--white); border-color:rgba(255,255,255,.5) }
.home-page .header-cta:hover { background:rgba(255,255,255,.12); border-color:var(--white); color:var(--white) }
.home-page .site-header :focus-visible, .home-page .hero :focus-visible { outline-color:var(--white) }
.home-page .hero { position:relative; isolation:isolate; display:flex; align-items:center; width:100%; max-width:none; height:auto; min-height:100svh; padding:128px var(--page-pad) 120px; color:var(--white); background:#22282a; text-align:left }
.hero-copy { position:relative; z-index:2; width:min(55%,740px); margin-left:0 }
.home-page .hero h1 { max-width:8.5em; width:100%; font-size:clamp(76px,7.6vw,124px); line-height:1; font-weight:500; letter-spacing:-.065em; text-wrap:balance }
.home-page .hero-lead { max-width:370px; margin:34px 0 25px; font-size:16px; line-height:1.65; color:rgba(255,255,255,.9); text-wrap:pretty }
.home-page .hero .quiet-link { color:var(--white); border-color:rgba(255,255,255,.65); font-size:12px }
.home-page .hero-visual { position:absolute; inset:0; z-index:0; width:100%; height:100%; margin:0; overflow:hidden }
.home-page .hero-visual::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(0,0,0,.27),rgba(0,0,0,.03) 62%,transparent),linear-gradient(180deg,rgba(0,0,0,.62),rgba(0,0,0,.22) 120px,transparent 300px,transparent 75%,rgba(0,0,0,.12)) }
.home-page .hero-visual picture { display:block; width:100%; height:100% }
.home-page .hero-product { width:100%; height:100%; max-width:none; object-fit:cover; object-position:center bottom; mix-blend-mode:normal; mask-image:none }
.hero-visual figcaption { position:absolute; z-index:1; left:var(--page-pad); right:var(--page-pad); bottom:28px; display:flex; justify-content:space-between; gap:20px; margin:0; color:rgba(255,255,255,.75); font-size:10px; letter-spacing:.015em }
.hero-visual figcaption span { color:rgba(255,255,255,.6); font-size:10px }

.product-introduction { position:relative; padding-block:120px }
.product-overview { display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:clamp(48px,6vw,88px); align-items:center }
.product-copy .zen-section-label { margin-bottom:26px }
.product-copy h2 { font-size:clamp(54px,5.2vw,78px) }
.product-copy .product-lead { margin:27px 0 20px; color:var(--ink); font-size:24px; line-height:1.35; letter-spacing:-.025em }
.product-copy>p:not(.zen-section-label):not(.product-lead) { max-width:460px; color:var(--muted); font-size:15px; line-height:1.65 }
.product-capabilities { padding:0; margin:32px 0 23px }
.product-capabilities>div { display:grid; grid-template-columns:112px 1fr; gap:16px; border-top:1px solid var(--line); padding:18px 0 }
.product-capabilities dt { font-size:13px; font-weight:500; line-height:1.6 }
.product-capabilities dd { margin:0; color:var(--muted); font-size:13px; line-height:1.6 }
.product-visual { min-width:0; align-self:center }
.product-visual img { width:100%; height:auto; aspect-ratio:1; object-fit:contain; mix-blend-mode:multiply }
.product-visual figcaption { display:flex; justify-content:space-between; gap:20px; margin-top:20px; color:var(--muted); font-size:10px; line-height:1.5 }
.section-heading { display:grid; grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr); gap:40px; align-items:start; margin-bottom:60px }
.section-heading>.zen-section-label { padding-top:10px }
.section-heading h2 { max-width:800px; font-size:clamp(44px,4.8vw,72px) }
.practice-section { position:relative; padding-block:100px; background:#fff; border-top:1px solid var(--line) }
.practice-layout { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:clamp(48px,6vw,88px); align-items:center }
.practice-scene picture { display:block; overflow:hidden }
.practice-scene img { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover }
.practice-scene figcaption { margin-top:16px; color:var(--muted); font-size:10px; line-height:1.5 }
.practice-context>p { max-width:340px; margin-bottom:26px; font-size:22px; letter-spacing:-.025em; line-height:1.4 }
.practice-situations article { border-top:1px solid var(--line); padding:24px 0 }
.practice-situations article:last-child { padding-bottom:0 }
.practice-situations h3 { margin:0 0 9px; font-size:21px; letter-spacing:-.025em }
.practice-situations p { max-width:360px; color:var(--muted); font-size:14px; line-height:1.65 }
.home-page .home-films { position:relative; margin:0; padding:100px 0; background:var(--paper); color:var(--ink) }
.film-collection { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:36px }
.home-page .motion-film { width:100%; margin:0; min-width:0; background:transparent; border:0; border-radius:0; overflow:visible }
.film-player { position:relative }
.home-page .motion-film video { display:block; width:100%; height:auto; aspect-ratio:800/343; object-fit:contain; border-radius:0; background:#111; filter:none }
.home-page .motion-caption { display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; padding:18px 0 0; background:transparent; color:var(--muted); font-size:10px }
.home-page .motion-caption .film-title { color:var(--ink); font-size:13px; font-weight:500 }
.film-play { position:absolute; right:18px; bottom:18px; width:50px; height:50px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.65); border-radius:50%; background:rgba(20,21,23,.45); color:#fff; -webkit-backdrop-filter:none; backdrop-filter:none }
.film-play:hover { background:rgba(20,21,23,.7) }
.home-films>.page-shell>.quiet-link { margin-top:38px }
.home-page .home-invitation { position:relative; display:flex; align-items:center; justify-content:space-between; gap:48px; padding-block:92px; text-align:left; border-top:1px solid var(--line); background:var(--paper) }
.home-invitation .zen-section-label { margin-bottom:22px }
.home-page .home-invitation h2 { max-width:750px; margin:0; font-size:clamp(46px,4.8vw,70px) }
.invitation-action { flex-shrink:0 }
.home-page .home-invitation .button { margin:0 }
.availability-note { display:block; color:var(--muted); font-size:11px; margin:0 0 17px }

.site-footer { padding:44px 0 max(24px,env(safe-area-inset-bottom)); background:var(--paper); color:var(--ink); border-top:1px solid var(--line) }
.site-footer>.page-shell { display:grid; grid-template-columns:1fr auto; align-items:center; gap:32px }
.footer-signature { margin:0; display:flex; align-items:center; justify-content:flex-start; gap:0 }
.footer-logo { width:112px; filter:brightness(0) }
.footer-nav { display:flex; justify-content:flex-end; gap:30px; margin:0; font-size:12px }
.site-footer a, .footer-nav a { color:var(--ink) }
.site-footer a:hover { color:var(--muted) }
.footer-bottom { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:28px; width:100%; margin-top:10px; padding-top:24px; border-top:1px solid var(--line); color:var(--muted); font-size:10px }
.footer-bottom a { color:var(--muted) }
.site-footer :focus-visible { outline-color:var(--ink) }

@media(max-width:1100px) {
  .hero-copy { width:58% }
  .home-page .hero h1 { font-size:clamp(72px,8vw,100px) }
  .product-overview { gap:40px }
  .product-capabilities>div { grid-template-columns:92px 1fr; gap:12px }
  .product-copy .product-lead { font-size:22px }
  .practice-layout { gap:40px }
  .section-heading { grid-template-columns:.5fr 1fr }
}
@media(max-width:900px) {
  :root, body.home-page { --header-height:56px }
  .header-inner, .home-page .header-inner { padding-block:6px; gap:22px }
  .header-story, .home-page .header-story { font-size:12px }
  .menu-open .site-header, .home-page.menu-open .site-header { background:var(--paper); color:var(--ink); -webkit-backdrop-filter:none; backdrop-filter:none }
  .home-page.menu-open .site-header { position:fixed }
  .home-page.menu-open .brand img { filter:brightness(0) }
  .home-page.menu-open .header-story, .home-page.menu-open .header-cta, .home-page.menu-open .mobile-menu nav a { color:var(--ink) }
  .home-page.menu-open .header-cta { border-color:#8a8c8b }
  .home-page.menu-open .header-cta:hover { background:var(--ink); color:var(--white) }
  .home-page .mobile-menu summary span { background:var(--white) }
  .home-page.menu-open .mobile-menu summary span { background:var(--ink) }
  .home-page.menu-open .site-header :focus-visible { outline-color:var(--ink) }
  .mobile-menu nav { padding:24px var(--page-pad); border:0 }
  .mobile-menu nav a { font-family:var(--sans); padding-block:22px; font-size:30px; font-weight:400; letter-spacing:-.04em }
  .home-page .hero { align-items:flex-start; padding:146px var(--page-pad) 90px }
  .hero-copy { width:100%; max-width:540px; margin:0 }
  .home-page .hero h1 { max-width:540px; font-size:clamp(66px,9vw,90px) }
  .home-page .hero-lead { max-width:350px; font-size:15px; margin-block:28px 20px }
  .home-page .hero-visual::after { background:linear-gradient(180deg,rgba(0,0,0,.52),rgba(0,0,0,.32) 44%,rgba(0,0,0,.02) 72%,rgba(0,0,0,.16)) }
  .product-introduction { padding-block:76px }
  .product-overview { grid-template-columns:1fr; gap:0 }
  .product-copy { display:contents }
  .product-copy>.zen-section-label { order:0 }
  .product-copy>h2 { order:1 }
  .product-visual { order:2; width:100%; max-width:580px; margin:32px auto }
  .product-copy .product-lead { order:3; margin:0 0 18px }
  .product-copy>p:not(.zen-section-label):not(.product-lead) { order:4; max-width:620px }
  .product-capabilities { order:5; margin-top:28px }
  .product-capabilities>div { grid-template-columns:150px 1fr; padding-block:18px }
  .product-copy>.quiet-link { order:6; justify-self:start }
  .section-heading { grid-template-columns:1fr; gap:24px; margin-bottom:40px }
  .section-heading>.zen-section-label { padding:0 }
  .section-heading h2 { max-width:680px; font-size:clamp(44px,6.3vw,60px) }
  .practice-section, .home-page .home-films { padding-block:76px }
  .practice-layout { grid-template-columns:1fr; gap:34px }
  .practice-context { display:grid; grid-template-columns:.8fr 1.2fr; gap:40px }
  .practice-context>p { margin:0 }
  .film-collection { gap:26px }
  .home-page .home-invitation { gap:40px; padding-block:72px }
  .home-page .home-invitation h2 { font-size:48px }
}
@media(max-width:600px) {
  .header-inner, .home-page .header-inner { gap:10px }
  .brand, .home-page .brand { width:98px }
  .header-story, .home-page .header-story { display:none }
  .header-cta, .home-page .header-cta { margin-left:auto; padding:6px 12px; min-height:32px; font-size:10px; gap:10px }
  .mobile-menu summary { width:34px; height:42px }
  .home-page .hero { padding-top:130px }
  .home-page .hero h1 { max-width:360px; font-size:clamp(58px,13vw,76px); letter-spacing:-.06em }
  .home-page .hero-lead { max-width:310px; font-size:14px; margin-top:24px }
  .hero-visual figcaption { font-size:9px; bottom:20px }
  .hero-visual figcaption span { font-size:8px }
  .product-introduction { padding-block:60px }
  .product-copy .zen-section-label { margin-bottom:22px }
  .product-copy h2 { font-size:50px }
  .product-copy .product-lead { font-size:22px; margin:0 0 18px }
  .product-copy>p:not(.zen-section-label):not(.product-lead) { font-size:14px }
  .product-capabilities { margin-top:28px }
  .product-capabilities>div { grid-template-columns:92px 1fr; gap:16px }
  .product-capabilities dd { font-size:12px }
  .product-visual figcaption { font-size:9px }
  .section-heading { gap:22px; margin-bottom:32px }
  .section-heading h2 { font-size:40px }
  .practice-section, .home-page .home-films { padding-block:60px }
  .practice-context { display:block }
  .practice-context>p { max-width:310px; margin-bottom:25px; font-size:22px }
  .practice-situations article { padding:20px 0 }
  .practice-situations h3 { font-size:20px }
  .practice-situations p { font-size:13px }
  .film-collection { grid-template-columns:1fr; gap:34px }
  .film-play { right:12px; bottom:12px; width:44px; height:44px }
  .home-page .motion-caption { padding-top:14px }
  .home-page .home-invitation { display:block; padding-block:60px }
  .home-page .home-invitation h2 { font-size:43px }
  .invitation-action { margin-top:32px }
  .site-footer>.page-shell { grid-template-columns:1fr; gap:25px }
  .footer-signature { justify-content:flex-start }
  .footer-nav { justify-content:flex-start; gap:28px }
  .footer-bottom { flex-direction:column; align-items:flex-start; gap:8px; margin-top:0; text-align:left }
  .footer-location { margin-left:0 }
  .footer-bottom nav { gap:24px }
}
@media(max-width:380px) {
  :root, body.home-page { --page-pad:20px }
  .brand, .home-page .brand { width:88px }
  .home-page .hero { padding-top:116px }
  .home-page .hero h1 { font-size:55px }
  .home-page .hero-lead { font-size:13px }
  .section-heading h2 { font-size:36px }
  .product-copy h2 { font-size:46px }
  .product-capabilities>div { grid-template-columns:85px 1fr; gap:12px }
  .home-page .home-invitation h2 { font-size:38px }
}
@media(prefers-reduced-motion:reduce) {
  .quiet-link span, .header-cta { transition:none }
}

/* Motion is enabled by the page controller; the static page stays complete. */
.film-controls button {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.48);
  border-radius:0;
  background:rgba(20,21,23,.62);
  color:#fff;
  font-family:var(--sans);
  font-size:11px;
  font-weight:400;
  line-height:1.2;
  letter-spacing:.01em;
  white-space:nowrap;
  -webkit-backdrop-filter:blur(8px);
  backdrop-filter:blur(8px);
  transition:background .2s,border-color .2s
}
.film-controls button:hover { background:rgba(20,21,23,.82); border-color:rgba(255,255,255,.86) }
.film-controls button:focus-visible { outline:2px solid #fff; outline-offset:3px }
.film-controls { position:absolute; z-index:3; left:14px; bottom:14px; display:flex; align-items:center; gap:8px; max-width:calc(100% - 28px) }
.film-controls button { flex:0 0 auto }
.film-player.is-watching .film-controls { display:none }

@media(prefers-reduced-motion:no-preference) {
  @keyframes memgo-landscape-drift {
    from { transform:scale(1) translate3d(0,0,0) }
    to { transform:scale(1.04) translate3d(-.35%,-.15%,0) }
  }
  @keyframes memgo-copy-arrive {
    from { opacity:0; transform:translate3d(0,14px,0) }
    to { opacity:1; transform:translate3d(0,0,0) }
  }
  body.motion-ready .hero-product {
    transform-origin:74% 84%;
    animation:memgo-landscape-drift 18s ease-in-out infinite alternate both;
    animation-play-state:paused
  }
  body.motion-ready.hero-in-view:not(.motion-paused) .hero-product { animation-play-state:running }
  body.motion-ready .hero-copy { animation:memgo-copy-arrive .7s cubic-bezier(.22,.61,.36,1) both }
  body.motion-ready .reveal-ready { opacity:0; transform:translate3d(0,18px,0); transition:opacity .65s ease,transform .65s cubic-bezier(.22,.61,.36,1) }
  body.motion-ready .reveal-ready.is-revealed { opacity:1; transform:translate3d(0,0,0) }
  body.motion-paused .hero-product,
  body.motion-paused .hero-copy { animation-play-state:paused }
  body.motion-paused .reveal-ready { opacity:1; transform:none; transition:none }
}
@media(max-width:600px) {
  .film-controls {
    position:relative;
    left:auto;
    bottom:auto;
    width:100%;
    max-width:none;
    gap:22px;
    padding:4px 0 0;
    background:var(--paper);
    color:var(--ink)
  }
  .story-film .film-controls { padding-inline:var(--page-pad) }
  .film-controls button {
    justify-content:flex-start;
    min-height:44px;
    padding:10px 0;
    border:0;
    background:transparent;
    color:var(--ink);
    letter-spacing:0;
    -webkit-backdrop-filter:none;
    backdrop-filter:none
  }
  .film-controls button:hover { background:transparent; color:var(--ink); text-decoration:underline; text-underline-offset:4px }
  .film-controls button:focus-visible { outline-color:var(--ink) }
}
@media(prefers-reduced-motion:reduce) {
  .film-controls button { transition:none }
  body.motion-ready .hero-product,
  body.motion-ready .hero-copy { animation:none; transform:none }
  body.motion-ready .reveal-ready { opacity:1; transform:none; transition:none }
}

/* Immersive chapters: human scale, open space, and a physical first step. */
body.immersive-page {
  --header-height:82px;
  --chapter-black:#111314;
  --chapter-white:#edece6;
  --chapter-silver:#a4a6a4
}
body.home-page.immersive-page {
  background:var(--chapter-black);
  color:var(--chapter-white)
}
.home-page.immersive-page h1,
.home-page.immersive-page h2,
.home-page.immersive-page h3 { color:inherit }
.home-page #embodiment .companion-heading,
.home-page #motion { padding-top:max(var(--section-space),calc(var(--header-height) + 26px)) }
.immersive-page :focus-visible { outline-color:var(--chapter-white) }
.immersive-page .site-header {
  position:fixed;
  inset:0 0 auto;
  background:transparent;
  border:0;
  color:var(--chapter-white);
  transition:background .35s,color .35s;
  -webkit-backdrop-filter:none;
  backdrop-filter:none
}
.immersive-page .header-inner { min-height:82px; max-width:none; padding:18px var(--page-pad); gap:38px }
.immersive-page .brand { width:116px }
.immersive-page .brand img { filter:brightness(0) invert(1) }
.immersive-page .desktop-nav { gap:36px; font-size:11px; letter-spacing:.07em }
.immersive-page .desktop-nav a,
.immersive-page .header-story { color:var(--chapter-white) }
.immersive-page .desktop-nav a:hover,
.immersive-page .header-story:hover { color:#fff }
.immersive-page .header-cta { min-height:38px; padding:9px 18px; font-size:10px; letter-spacing:.07em; color:var(--chapter-white); border-color:rgba(237,236,230,.5) }
.immersive-page .header-cta:hover { background:var(--chapter-white); color:var(--chapter-black); border-color:var(--chapter-white) }
.immersive-page.header-scrolled .site-header { background:rgba(17,19,20,.78); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px) }
.immersive-page.header-light .site-header { color:var(--chapter-black) }
.immersive-page.header-light .brand img { filter:brightness(0) }
.immersive-page.header-light .desktop-nav a,
.immersive-page.header-light .header-story,
.immersive-page.header-light .header-cta { color:var(--chapter-black) }
.immersive-page.header-light .header-cta { border-color:rgba(17,19,20,.5) }
.immersive-page.header-light .header-cta:hover { background:var(--chapter-black); color:var(--chapter-white) }
.immersive-page.header-light.header-scrolled .site-header { background:rgba(237,236,230,.88) }
.immersive-page.header-light .site-header :focus-visible { outline-color:var(--chapter-black) }
.immersive-page .chapter-kicker { color:var(--chapter-silver); font-size:10px; font-weight:400; line-height:1.7; letter-spacing:.16em; text-transform:uppercase }
.immersive-page .quiet-link { min-height:46px; border-color:rgba(237,236,230,.52); color:var(--chapter-white); font-size:12px; letter-spacing:.035em }
.immersive-page .hero {
  min-height:100svh;
  height:auto;
  padding:clamp(104px,14svh,156px) var(--page-pad) clamp(144px,17svh,192px);
  align-items:flex-end;
  background:var(--chapter-black);
  color:var(--chapter-white)
}
.immersive-page .hero-copy { width:76%; max-width:none; margin:0 }
.immersive-page .hero-copy .chapter-kicker { margin-bottom:clamp(18px,3svh,30px); color:rgba(237,236,230,.72) }
.immersive-page .hero h1 { max-width:9em; font-size:clamp(64px,min(9.1vw,17svh),156px); line-height:.98; letter-spacing:-.062em; font-weight:500; text-wrap:balance }
.immersive-page .hero-lead { max-width:430px; margin:clamp(18px,3.2svh,32px) 0 clamp(12px,2.3svh,23px); color:rgba(237,236,230,.86); font-size:16px; line-height:1.7 }
.immersive-page .hero-visual::after { background:linear-gradient(90deg,rgba(0,0,0,.33),rgba(0,0,0,.08) 60%,transparent),linear-gradient(180deg,rgba(0,0,0,.58),transparent 30%,transparent 65%,rgba(0,0,0,.38)) }
.immersive-page .hero-footer { position:absolute; z-index:2; left:var(--page-pad); right:var(--page-pad); bottom:30px; display:flex; justify-content:space-between; align-items:center; gap:26px; color:rgba(237,236,230,.63); font-size:9px; line-height:1.6; letter-spacing:.05em }
.immersive-page .scroll-cue { display:inline-flex; align-items:center; min-height:44px; color:var(--chapter-white); font-size:10px; letter-spacing:.05em }
.immersive-page .companion-section { position:relative; background:var(--chapter-white); color:var(--chapter-black) }
.immersive-page .companion-section :focus-visible { outline-color:var(--chapter-black) }
.immersive-page .companion-heading,
.immersive-page .companion-details { width:100%; max-width:none; margin-inline:0; padding-inline:var(--page-pad) }
.immersive-page .companion-heading { padding-top:var(--section-space); padding-bottom:clamp(40px,4vw,68px) }
.immersive-page .companion-heading .chapter-kicker { margin-bottom:35px; color:#666967 }
.immersive-page .companion-heading h2 { max-width:990px; font-size:clamp(64px,6.4vw,108px); line-height:1.02; letter-spacing:-.058em }
.immersive-page .companion-heading>p:last-child { max-width:520px; margin-top:32px; color:#5c615f; font-size:17px; line-height:1.7 }
.immersive-page .companion-portrait { position:relative; width:100%; margin:0 }
.immersive-page .companion-portrait img { display:block; width:100%; max-width:none; height:min(56.25vw,90svh); aspect-ratio:auto; object-fit:cover; object-position:65% 65% }
.immersive-page .companion-portrait figcaption { position:absolute; right:var(--page-pad); bottom:20px; color:rgba(255,255,255,.8); text-shadow:0 1px 4px rgba(0,0,0,.4); font-size:9px; letter-spacing:.025em }
.immersive-page .companion-details { padding-top:clamp(38px,4vw,65px); padding-bottom:var(--section-space) }
.immersive-page .companion-intro { max-width:720px; font-size:26px; line-height:1.45; letter-spacing:-.025em }
.immersive-page .companion-features { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--layout-gap); margin:42px 0 0; border-top:1px solid #c9cbc5 }
.immersive-page .companion-features>div { min-width:0; padding-top:25px }
.immersive-page .companion-features>div>span,
.immersive-page .companion-features .feature-number { display:block; color:#787d78; font-size:10px; letter-spacing:.07em }
.immersive-page .companion-features dt { margin:18px 0 15px; color:var(--chapter-black); font-size:23px; font-weight:500; letter-spacing:-.025em; line-height:1.3 }
.immersive-page .companion-features dd { max-width:325px; margin:0; color:#646965; font-size:14px; line-height:1.8 }
.immersive-page .companion-details .quiet-link { margin-top:46px; color:var(--chapter-black); border-color:#8f9590 }
.immersive-page .everyday-section { position:relative; isolation:isolate; display:flex; align-items:center; min-height:100svh; height:auto; padding:clamp(86px,12svh,140px) var(--page-pad); background:var(--chapter-black); color:var(--chapter-white) }
.immersive-page .everyday-section .practice-scene { position:absolute; inset:0; z-index:0; width:100%; height:100%; overflow:hidden }
.immersive-page .everyday-section .practice-scene img { display:block; width:100%; max-width:none; height:100%; object-fit:cover; object-position:center center }
.immersive-page .everyday-section .practice-scene::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.77),rgba(0,0,0,.48) 36%,rgba(0,0,0,.08) 72%),linear-gradient(180deg,rgba(0,0,0,.15),transparent 40%,rgba(0,0,0,.18)) }
.immersive-page .everyday-section .practice-scene.reveal-ready { opacity:1; transform:none; transition:none }
.immersive-page .everyday-copy { position:relative; z-index:2; width:48%; min-width:0; margin:0 }
.immersive-page .everyday-copy .chapter-kicker { margin-bottom:30px; color:rgba(237,236,230,.63) }
.immersive-page .everyday-copy h2 { max-width:600px; font-size:clamp(64px,5.4vw,92px); line-height:1.03; letter-spacing:-.055em }
.immersive-page .everyday-copy>p:not(.chapter-kicker) { max-width:370px; margin-top:29px; color:rgba(237,236,230,.8); font-size:16px; line-height:1.7 }
.immersive-page .practice-choices { display:flex; flex-wrap:wrap; gap:24px; margin-top:34px }
.immersive-page .practice-choices button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 0; border:0; border-bottom:1px solid transparent; border-radius:0; background:transparent; color:rgba(237,236,230,.6); font-size:11px; letter-spacing:.025em }
.immersive-page .practice-choices button:hover,
.immersive-page .practice-choices button[aria-selected="true"],
.immersive-page .practice-choices button.is-active { border-color:var(--chapter-white); color:var(--chapter-white) }
.immersive-page .practice-panel { min-height:112px; max-width:380px; margin-top:25px }
.immersive-page .practice-panel h3 { margin:0 0 12px; color:var(--chapter-white); font-size:21px; font-weight:400; line-height:1.4; letter-spacing:-.025em }
.immersive-page .practice-panel p { margin:0; color:rgba(237,236,230,.68); font-size:13px; line-height:1.8 }
.immersive-page .scene-disclosure { position:absolute; z-index:2; right:var(--page-pad); bottom:28px; color:rgba(237,236,230,.6); font-size:9px; line-height:1.6; letter-spacing:.025em }
.immersive-page .home-films { padding:var(--section-space) 0; background:var(--chapter-black); color:var(--chapter-white) }
.immersive-page .home-films>.page-shell { padding-inline:0 }
.immersive-page .home-films .section-heading { display:block; margin-bottom:clamp(38px,4vw,62px); padding-inline:var(--page-pad) }
.immersive-page .home-films .section-heading .chapter-kicker { margin-bottom:30px }
.immersive-page .home-films .section-heading h2 { max-width:1050px; color:var(--chapter-white); font-size:clamp(64px,6.7vw,110px); line-height:1.02; letter-spacing:-.055em }
.immersive-page .film-collection { grid-template-columns:minmax(0,1fr); width:100%; margin:0; gap:clamp(38px,5vw,82px) }
.immersive-page .film-collection .motion-caption { margin-inline:var(--page-pad) }
.immersive-page .motion-caption,
.immersive-page .motion-caption p { color:#878c8c }
.immersive-page .motion-caption .film-title { color:var(--chapter-white); font-size:12px; font-weight:400 }
.immersive-page .home-films>.page-shell>.quiet-link { margin-top:44px; margin-left:var(--page-pad) }
.immersive-page .home-invitation { display:block; max-width:none; padding:124px 0 140px; border-top:1px solid rgba(237,236,230,.15); background:var(--chapter-black); color:var(--chapter-white) }
.immersive-page .home-invitation .chapter-kicker { margin-bottom:33px }
.immersive-page .home-invitation h2 { max-width:1080px; margin:0; color:var(--chapter-white); font-size:clamp(40px,4.5vw,64px); line-height:1.08; letter-spacing:-.045em }
.immersive-page .home-invitation p:not(.chapter-kicker) { margin-top:33px; color:var(--chapter-silver); font-size:16px }
.immersive-page .home-invitation .button-primary { margin-top:35px; padding:17px 28px; min-height:54px; gap:50px; border-color:var(--chapter-white); background:var(--chapter-white); color:var(--chapter-black); font-size:12px; letter-spacing:.025em }
.immersive-page .home-invitation .button-primary:hover { background:#fff; border-color:#fff }
.immersive-page .home-invitation .availability-note { display:block; margin-top:20px; color:#7e8585; font-size:10px; letter-spacing:.035em }
.immersive-page .site-footer { padding-top:50px; background:var(--chapter-black); border-color:rgba(237,236,230,.14); color:var(--chapter-white) }
.immersive-page .footer-logo { filter:brightness(0) invert(1); opacity:.9 }
.immersive-page .site-footer a,
.immersive-page .footer-nav a { color:var(--chapter-white) }
.immersive-page .site-footer a:hover { color:#fff }
.immersive-page .footer-bottom { border-color:rgba(237,236,230,.13); color:#757c7d }
.immersive-page .footer-bottom a { color:#979e9e }
.immersive-page .site-footer :focus-visible { outline-color:var(--chapter-white) }

@media(max-width:1200px) {
  .immersive-page .everyday-copy { width:55% }
  .immersive-page .everyday-copy h2 { font-size:70px }
}
@media(max-width:900px) {
  .immersive-page .header-inner { min-height:68px; padding-block:12px; gap:20px }
  .immersive-page .brand { width:106px }
  body.immersive-page { --header-height:68px }
  .immersive-page .header-story { font-size:11px }
  .immersive-page.header-light .mobile-menu summary span { background:var(--chapter-black) }
  .immersive-page.menu-open .site-header,
  .immersive-page.menu-open.header-scrolled .site-header,
  .immersive-page.menu-open.header-light .site-header,
  .immersive-page.menu-open.header-light.header-scrolled .site-header {
    position:fixed;
    background:var(--chapter-black);
    color:var(--chapter-white);
    -webkit-backdrop-filter:none;
    backdrop-filter:none
  }
  .immersive-page.menu-open .brand img { filter:brightness(0) invert(1) }
  .immersive-page.menu-open .header-story,
  .immersive-page.menu-open .header-cta,
  .immersive-page.menu-open .mobile-menu nav a { color:var(--chapter-white) }
  .immersive-page.menu-open .header-cta { border-color:rgba(237,236,230,.5) }
  .immersive-page.menu-open .header-cta:hover { background:var(--chapter-white); color:var(--chapter-black) }
  .immersive-page.menu-open .mobile-menu summary span { background:var(--chapter-white) }
  .immersive-page .mobile-menu nav { background:var(--chapter-black); border:0; padding-top:35px }
  .immersive-page .mobile-menu nav a { padding-block:25px; font-size:36px; border-color:rgba(237,236,230,.15) }
  .immersive-page.menu-open .site-header :focus-visible { outline-color:var(--chapter-white) }
}
@media(max-width:900px), (max-aspect-ratio:1/1) {
  .immersive-page .hero { align-items:flex-end; padding-top:clamp(104px,14svh,130px); padding-bottom:clamp(132px,17svh,165px) }
  .immersive-page .hero-copy { width:88%; max-width:none }
  .immersive-page .hero h1 { font-size:clamp(88px,12vw,112px); max-width:620px }
  .immersive-page .hero-lead { max-width:375px; font-size:15px }
  .immersive-page .hero-footer { bottom:24px; font-size:8px; gap:18px }
  .immersive-page .hero-footer>span:first-child { display:none }
  .immersive-page .hero-visual::after { background:linear-gradient(180deg,rgba(0,0,0,.45),rgba(0,0,0,.18) 33%,rgba(0,0,0,.45) 68%,rgba(0,0,0,.28)) }
  .immersive-page .companion-heading h2 { font-size:clamp(58px,8.7vw,76px) }
  .immersive-page .companion-features dt { font-size:21px }
  .immersive-page .companion-features dd { font-size:13px }
  .immersive-page .everyday-section { display:block; min-height:0; height:auto; padding:0 }
  .immersive-page .everyday-section .practice-scene { position:relative; height:auto; aspect-ratio:3/2 }
  .immersive-page .everyday-section .practice-scene::after { background:linear-gradient(180deg,transparent 65%,rgba(17,19,20,.6)) }
  .immersive-page .everyday-copy { width:100%; max-width:none; margin:0; padding:clamp(48px,6vw,72px) var(--page-pad) var(--section-space) }
  .immersive-page .everyday-copy h2 { max-width:610px; font-size:clamp(58px,8.5vw,76px) }
  .immersive-page .everyday-copy>p:not(.chapter-kicker) { max-width:430px }
  .immersive-page .practice-panel { min-height:100px }
  .immersive-page .home-films .section-heading h2 { font-size:clamp(58px,8.5vw,76px) }
  .immersive-page .home-invitation { padding-block:94px 110px }
}
@media(max-width:600px) {
  .immersive-page .header-inner { min-height:64px; padding-block:11px; gap:12px }
  body.immersive-page { --header-height:64px }
  .immersive-page .brand { width:94px }
  .immersive-page .header-cta { min-height:34px; padding:8px 12px; font-size:9px }
  .immersive-page .hero { padding-top:clamp(100px,14svh,135px); padding-bottom:132px }
  .immersive-page .hero-copy { width:100%; max-width:none }
  .immersive-page .hero-copy .chapter-kicker { margin-bottom:24px }
  .immersive-page .hero h1 { max-width:350px; font-size:clamp(72px,16vw,90px); letter-spacing:-.06em }
  .immersive-page .hero-lead { max-width:300px; margin-block:27px 17px; font-size:14px }
  .immersive-page .hero-footer { bottom:20px; font-size:8px; gap:20px }
  .immersive-page .scroll-cue { font-size:9px }
  .immersive-page .companion-heading .chapter-kicker { margin-bottom:28px }
  .immersive-page .companion-heading h2 { font-size:clamp(46px,10.8vw,60px); line-height:1.06 }
  .immersive-page .companion-heading>p:last-child { margin-top:27px; max-width:310px; font-size:15px }
  .immersive-page .companion-portrait img { height:auto; aspect-ratio:4/3; object-position:85% center }
  .immersive-page .companion-portrait figcaption { bottom:16px; font-size:8px }
  .immersive-page .companion-intro { max-width:310px; font-size:23px; line-height:1.45 }
  .immersive-page .companion-features { grid-template-columns:1fr; gap:0; margin-top:30px; border-top:0 }
  .immersive-page .companion-features>div { display:grid; grid-template-columns:32px 1fr; gap:0 18px; padding-block:24px; border-top:1px solid #c9cbc5 }
  .immersive-page .companion-features>div>span,
.immersive-page .companion-features .feature-number { grid-column:1; padding-top:3px }
  .immersive-page .companion-features dt { grid-column:2; margin:0 0 11px; font-size:22px }
  .immersive-page .companion-features dd { grid-column:2; max-width:330px; font-size:13px }
  .immersive-page .companion-details .quiet-link { margin-top:14px }
  .immersive-page .everyday-copy { padding-top:52px; padding-bottom:83px }
  .immersive-page .everyday-copy .chapter-kicker { margin-bottom:25px }
  .immersive-page .everyday-copy h2 { max-width:350px; font-size:clamp(50px,12.4vw,68px) }
  .immersive-page .everyday-copy>p:not(.chapter-kicker) { margin-top:25px; max-width:310px; font-size:14px }
  .immersive-page .practice-choices { gap:25px; margin-top:25px }
  .immersive-page .practice-choices button { font-size:10px }
  .immersive-page .practice-panel { margin-top:24px; min-height:115px }
  .immersive-page .practice-panel h3 { font-size:21px }
  .immersive-page .scene-disclosure { bottom:21px; font-size:8px }
  .immersive-page .home-films .section-heading { margin-bottom:38px }
  .immersive-page .home-films .section-heading .chapter-kicker { margin-bottom:25px }
  .immersive-page .home-films .section-heading h2 { font-size:clamp(51px,12.4vw,68px) }
  .immersive-page .film-collection { gap:38px }
  .immersive-page .film-controls { background:var(--chapter-black); color:var(--chapter-white) }
  .immersive-page .film-collection .film-controls { padding-inline:var(--page-pad) }
  .immersive-page .film-controls button { color:var(--chapter-white) }
  .immersive-page .film-controls button:hover { color:#fff; background:transparent }
  .immersive-page .film-controls button:focus-visible { outline-color:var(--chapter-white) }
  .immersive-page .home-films>.page-shell>.quiet-link { margin-top:34px }
  .immersive-page .home-invitation { padding-block:78px 90px }
  .immersive-page .home-invitation .chapter-kicker { margin-bottom:28px }
  .immersive-page .home-invitation p:not(.chapter-kicker) { margin-top:28px; font-size:14px }
  .immersive-page .home-invitation .button-primary { margin-top:29px }
  .immersive-page .site-footer { padding-top:39px }
}
@media(max-width:380px) {
  .immersive-page .hero h1 { font-size:66px }
  .immersive-page .hero-lead { max-width:270px; font-size:13px }
  .immersive-page .companion-heading h2 { font-size:44px }
  .immersive-page .everyday-copy h2 { font-size:47px }
  .immersive-page .home-films .section-heading h2 { font-size:48px }
}
@media(max-height:650px) and (min-width:601px) {
  .immersive-page .hero { padding-top:max(88px,calc(var(--header-height) + 20px)); padding-bottom:112px }
  .immersive-page .hero h1 { font-size:clamp(52px,min(7.5vw,14svh),92px) }
  .immersive-page .hero-copy .chapter-kicker { margin-bottom:14px }
  .immersive-page .hero-lead { max-width:430px; margin:16px 0 12px; font-size:14px; line-height:1.5 }
  .immersive-page .everyday-section { padding-top:calc(var(--header-height) + 24px); padding-bottom:56px }
  .immersive-page .everyday-copy h2 { font-size:clamp(44px,min(5.4vw,11svh),70px) }
  .immersive-page .everyday-copy .chapter-kicker { margin-bottom:20px }
  .immersive-page .everyday-copy>p:not(.chapter-kicker) { margin-top:20px; font-size:14px }
  .immersive-page .practice-choices { margin-top:20px }
  .immersive-page .practice-panel { min-height:96px; margin-top:20px }
}
@media(max-height:650px) and (max-width:900px) and (min-width:601px) {
  .immersive-page .everyday-section { padding:0 }
}
@media(min-aspect-ratio:3/1) and (min-width:901px) {
  .immersive-page .companion-portrait img { object-fit:contain; object-position:center; background:#e5e3dd }
}
@media(prefers-reduced-motion:no-preference) {
  @keyframes immersion-landscape { from { transform:scale(1) } to { transform:scale(1.045) } }
  body.motion-ready .immersion-hero .hero-product { transform-origin:70% 75%; animation:immersion-landscape 35s ease-in-out infinite alternate both; animation-play-state:paused }
  body.motion-ready.hero-in-view:not(.motion-paused) .immersion-hero .hero-product { animation-play-state:running }
}
@media(prefers-reduced-motion:reduce) {
  .immersive-page .site-header { transition:none }
  body.motion-ready .immersion-hero .hero-product { animation:none; transform:none }
}