/* /mixed-reality-fooh: cinematic layout on top of inflatables.css + landing.css. Scoped to body.fooh-page. */
.fooh-page{--fo-ink:#f3f7fa;--fo-mute:#a9bccb;--fo-dim:#7f95a5;--fo-acc:#c5e1f3;--fo-line:#c3e1f324;--fo-bg:#080909}
.fooh-page main{overflow:clip}
.fooh-page .inflate-section{padding-top:120px}
.fooh-page .inflate-section h2{font-size:clamp(36px,4.4vw,64px);letter-spacing:-.05em;line-height:1.02;font-weight:650}
.fooh-page .inflate-section h2 span{color:var(--fo-acc)}
.fooh-page .inflate-section-heading{grid-template-columns:1.4fr 1fr;align-items:end;gap:40px;margin-bottom:38px}
.fooh-page .inflate-section-heading>p:last-child{font-size:16px;color:var(--fo-mute);line-height:1.7;max-width:44ch}
.fooh-page .ld-eye{margin-bottom:22px}

/* ---------- hero ---------- */
.fo-hero{position:relative;isolation:isolate;min-height:min(92svh,980px);display:flex;align-items:flex-end;margin:-1px 0 0;padding:140px 0 48px;color:#fff;overflow:hidden}
.fo-hero-bg{position:absolute;inset:0;z-index:-2}
.fo-hero-bg video,.fo-hero-bg img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.04)}
.fo-hero::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#080909cc 0%,#08090933 28%,#08090922 55%,#080909f2 100%),linear-gradient(90deg,#080909b3 0%,#08090940 50%,#08090900 100%)}
.fo-hero-in{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:40px;align-items:end}
.fo-hero h1{margin:0;font-size:clamp(58px,8.2vw,132px);font-weight:700;letter-spacing:-.065em;line-height:.92}
.fo-hero h1 span{display:block;color:var(--fo-acc)}
.fo-hero .ld-lead{max-width:52ch;color:#dbe6ee;font-size:clamp(17px,1.35vw,21px);margin-top:28px}
.fo-hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.fo-hero-cta .inflate-button{margin:0}
.fo-ghost{display:inline-flex;align-items:center;gap:14px;padding:17px 24px;border-radius:40px;border:1px solid #ffffff3d;background:#ffffff0f;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;font-size:14px;font-weight:600;text-decoration:none;transition:background .25s,border-color .25s}
.fo-ghost:hover{background:#ffffff1f;border-color:#ffffff80}
.fo-stats{display:grid;grid-template-columns:repeat(3,auto);gap:14px;justify-content:end}
.fo-stat{min-width:150px;padding:18px 20px;border-radius:18px;border:1px solid #ffffff22;background:#0b121899;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}
.fo-stat b{display:block;font-size:clamp(30px,2.8vw,42px);font-weight:700;letter-spacing:-.05em;line-height:1;color:#fff}
.fo-stat span{display:block;margin-top:8px;font-size:12px;line-height:1.35;color:#c4d3de}
.fo-now{position:absolute;left:0;right:0;top:0;z-index:1;display:flex;justify-content:flex-end;padding:112px 3.6% 0;pointer-events:none}
.fo-now span{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border-radius:999px;background:#0b1218a6;border:1px solid #ffffff22;font:600 10.5px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:#dbe8f1}
.fo-now i{width:7px;height:7px;border-radius:50%;background:#ff5a5a;box-shadow:0 0 0 3px #ff5a5a33;animation:fo-blink 1.6s infinite}
@keyframes fo-blink{50%{opacity:.35}}

/* ---------- brand marquee ---------- */
.fo-marquee{position:relative;padding:30px 0;border-top:1px solid var(--fo-line);border-bottom:1px solid var(--fo-line);overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.fo-marquee-track{display:flex;gap:0;width:max-content;animation:fo-marquee 48s linear infinite}
.fo-marquee:hover .fo-marquee-track{animation-play-state:paused}
.fo-marquee span{display:inline-flex;align-items:center;gap:34px;padding-right:34px;font-size:clamp(22px,2.2vw,32px);font-weight:600;letter-spacing:-.03em;color:#e8f0f5;white-space:nowrap}
.fo-marquee span::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--fo-acc);opacity:.7}
@keyframes fo-marquee{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.fo-marquee-track{animation:none}}

/* ---------- format: text + mosaic ---------- */
.fo-format{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:60px;align-items:center}
.fo-format h2{font-size:clamp(34px,3.6vw,52px)!important}
.fo-format .fo-copy p{font-size:17px;line-height:1.7;color:var(--fo-mute);margin:22px 0 0;max-width:48ch}
.fo-format .fo-copy p b{color:var(--fo-ink);font-weight:600}
.fo-partner{display:flex;align-items:center;gap:16px;margin:30px 0 0;padding:18px 20px;border-radius:18px;border:1px solid var(--fo-line);background:linear-gradient(125deg,#abcde710,transparent)}
.fo-partner img{width:44px;height:44px;padding:7px;border-radius:12px;flex:none;background:#0b1218;border:1px solid #ffffff22;object-fit:contain}
.fo-partner p{margin:0!important;font-size:14px!important;line-height:1.55!important;color:#b7c8d4!important}
.fo-partner p b{color:#fff}
.fo-mosaic{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;align-items:end}
.fo-mosaic .fo-tile:nth-child(1){transform:translateY(34px)}
.fo-mosaic .fo-tile:nth-child(3){transform:translateY(-34px)}
.fo-tile{position:relative;display:block;width:100%;padding:0;border:1px solid #d2ecff2b;border-radius:18px;overflow:hidden;aspect-ratio:9/16;background:#0d1a24 center/cover no-repeat;color:#fff;cursor:pointer;box-shadow:0 20px 50px -24px #000d;transition:transform .35s,border-color .25s;text-align:left}
.fo-tile:hover{border-color:#dbf0ff80}
.fo-tile video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.fo-tile.is-playing video{opacity:1}
.fo-tile .fo-play{position:absolute;left:50%;top:50%;width:62px;height:62px;margin:-31px 0 0 -31px;border-radius:50%;display:grid;place-items:center;background:#ffffffd9;color:#0b1218;opacity:0;transform:scale(.8);transition:opacity .25s,transform .25s;z-index:3}
.fo-tile:hover .fo-play,.fo-tile:focus-visible .fo-play{opacity:1;transform:scale(1)}
.fo-tile .fo-play svg{width:22px;height:22px;margin-left:3px}
.fo-tile-meta{position:absolute;left:0;right:0;bottom:0;padding:70px 16px 16px;background:linear-gradient(transparent,#000d);display:grid;gap:4px;z-index:2}
.fo-tile-meta b{font-size:16px;font-weight:650;letter-spacing:-.015em;line-height:1.2}
.fo-tile-meta span{font-size:12.5px;color:#c9dbe8;line-height:1.4}
.fo-tile-meta small{display:inline-flex;width:max-content;margin-top:8px;padding:5px 9px;border-radius:999px;background:#c5e1f3;color:#10212d;font:700 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase}
.fo-tile .ld-film-tags{top:14px;left:14px}
.fo-tile:focus-visible{outline:2px solid var(--fo-acc);outline-offset:3px}

/* ---------- four shapes: image cards ---------- */
.fo-shapes{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.fo-shape{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:440px;padding:26px;border-radius:22px;overflow:hidden;border:1px solid #d2ecff24;background:#0d1a24 center/cover no-repeat;color:#fff;transition:transform .35s,border-color .25s}
.fo-shape::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#0809090d 20%,#080909e6 100%)}
.fo-shape>*{position:relative}
.fo-shape .mono{position:absolute;top:22px;left:26px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:#dbe8f1}
.fo-shape h3{margin:0 0 10px;font-size:26px;font-weight:650;letter-spacing:-.035em;line-height:1.1}
.fo-shape p{margin:0;font-size:14px;line-height:1.6;color:#c2d2dd}
.fo-shape:hover{transform:translateY(-6px);border-color:#dbf0ff66}

/* ---------- films mosaic ---------- */
.fo-films{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-flow:dense;gap:14px}
.fo-films .fo-tile{aspect-ratio:9/16;transform:none}
.fo-films .fo-tile.is-feat{grid-column:span 2;grid-row:span 2}
.fo-films .fo-tile.is-feat .fo-tile-meta b{font-size:24px}
.fo-films .fo-tile.is-feat .fo-tile-meta span{font-size:14px}
.fo-films-foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px 30px;margin-top:22px;font-size:13px;color:var(--fo-dim)}
.fo-films-foot a{color:#c9e0ef}

/* ---------- feed to street banner ---------- */
.fo-banner{position:relative;isolation:isolate;overflow:hidden;border-radius:26px;border:1px solid #d2ecff24;min-height:520px;display:grid;grid-template-columns:1.1fr 1fr;align-items:end;gap:30px;padding:48px}
.fo-banner-bg{position:absolute;inset:0;z-index:-1}
.fo-banner-bg video,.fo-banner-bg img{width:100%;height:100%;object-fit:cover;display:block}
.fo-banner::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#08090926,#080909e6 85%),linear-gradient(90deg,#080909b3,transparent 70%)}
.fo-banner h2{font-size:clamp(38px,4.6vw,66px)!important}
.fo-banner p{font-size:17px;line-height:1.7;color:#d3dfe8;margin:0 0 22px}
.fo-banner .inflate-text-link{color:#fff}

/* ---------- process timeline ---------- */
.fo-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #c3e1f33a;margin-top:10px}
.fo-step{position:relative;padding:34px 26px 34px 0;border-right:1px solid var(--fo-line)}
.fo-step:last-child{border-right:0}
.fo-step+.fo-step{padding-left:26px}
.fo-step::before{content:'';position:absolute;top:-1px;left:0;width:46px;height:2px;background:var(--fo-acc)}
.fo-step .mono{font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:#87aec6}
.fo-step h3{margin:70px 0 14px;font-size:24px;font-weight:650;letter-spacing:-.03em;line-height:1.15;color:#fff}
.fo-step p{margin:0;font-size:14.5px;line-height:1.7;color:var(--fo-mute)}
.fo-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:18px}
.fo-chips span{padding:7px 11px;border-radius:999px;border:1px solid var(--fo-line);background:#10233066;font-size:12px;color:#dbe9f3}
.fo-steps-cta{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-top:34px;padding-top:28px;border-top:1px solid var(--fo-line)}
.fo-steps-cta p{margin:0;font-size:15px;color:var(--fo-mute);max-width:52ch;line-height:1.6}
.fo-steps-cta .inflate-button{margin:0}

/* ---------- faq ---------- */
.fooh-page .inflate-faq summary{font-size:19px;font-weight:600;letter-spacing:-.015em}
.fooh-page .inflate-faq summary span{color:var(--fo-acc)}

/* ---------- final ---------- */
.fo-final{position:relative;isolation:isolate;overflow:hidden;margin-top:110px;padding:120px 0 130px;color:#fff;text-align:center}
.fo-final-bg{position:absolute;inset:0;z-index:-2}
.fo-final-bg video,.fo-final-bg img{width:100%;height:100%;object-fit:cover;display:block}
.fo-final::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#080909 0%,#08090980 35%,#08090980 65%,#080909 100%)}
.fo-final .ld-eye{justify-content:center;display:flex}
.fo-final h2{margin:0 auto;max-width:14ch;font-size:clamp(46px,7vw,110px);font-weight:700;letter-spacing:-.065em;line-height:.94}
.fo-final h2 span{color:var(--fo-acc)}
.fo-final p{margin:26px auto 0;max-width:40ch;font-size:17px;line-height:1.6;color:#d5e1ea}
.fo-final .inflate-button{margin-top:30px}
.fooh-page .ld-related-wrap{padding-top:80px}

/* ---------- lightbox ---------- */
.fo-lb{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;background:#050708e6;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.fo-lb[hidden]{display:none}
.fo-lb-box{position:relative;display:grid;grid-template-columns:minmax(0,auto) 300px;gap:0;max-width:min(1100px,100%);max-height:calc(100svh - 48px);border-radius:22px;overflow:hidden;background:#0b1218;border:1px solid #ffffff1f;box-shadow:0 50px 120px -30px #000}
.fo-lb-media{position:relative;background:#000;display:grid;place-items:center;max-height:calc(100svh - 48px)}
.fo-lb-media video{display:block;height:calc(100svh - 48px);max-height:820px;width:auto;max-width:100%;aspect-ratio:9/16;object-fit:contain;background:#000}
.fo-lb-side{display:flex;flex-direction:column;gap:14px;padding:30px 28px;color:#fff;overflow:auto}
.fo-lb-side .ld-eye{margin:0}
.fo-lb-side h3{margin:4px 0 0;font-size:28px;font-weight:650;letter-spacing:-.035em;line-height:1.1}
.fo-lb-side p{margin:0;font-size:14.5px;line-height:1.65;color:#b7c8d4}
.fo-lb-side .fo-lb-by{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:18px;border-top:1px solid var(--fo-line);font-size:12.5px;color:#9fb6c5}
.fo-lb-side .fo-lb-by img{width:30px;height:30px;padding:5px;border-radius:8px;background:#0b1218;border:1px solid #ffffff22;object-fit:contain}
.fo-lb-side .fo-lb-case{display:inline-flex;align-items:center;gap:10px;width:max-content;padding:12px 18px;border-radius:999px;background:var(--fo-acc);color:#10212d;font-size:13px;font-weight:650;text-decoration:none}
.fo-lb-side .fo-lb-case[hidden]{display:none}
.fo-lb-x,.fo-lb-nav{position:absolute;z-index:3;width:46px;height:46px;border-radius:50%;border:1px solid #ffffff2e;background:#0b1218b3;color:#fff;display:grid;place-items:center;font-size:20px;cursor:pointer;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:background .2s}
.fo-lb-x:hover,.fo-lb-nav:hover{background:#ffffff26}
.fo-lb-x{top:14px;right:14px}
.fo-lb-nav{top:50%;transform:translateY(-50%)}
.fo-lb-nav.prev{left:14px}.fo-lb-nav.next{right:314px}
.fo-lb-count{position:absolute;left:16px;bottom:14px;z-index:3;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:#dbe8f1;padding:7px 10px;border-radius:999px;background:#0b1218a6}
body.fo-lb-open{overflow:hidden}

/* ---------- responsive ---------- */
@media(max-width:1100px){.fo-shapes{grid-template-columns:repeat(2,1fr)}.fo-shape{min-height:360px}.fo-steps{grid-template-columns:repeat(2,1fr)}.fo-step:nth-child(2){border-right:0}.fo-step:nth-child(n+3){border-top:1px solid var(--fo-line)}.fo-step:nth-child(3){padding-left:0;border-right:1px solid var(--fo-line)}.fo-step h3{margin-top:44px}.fo-films{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.fo-hero-in{grid-template-columns:1fr}.fo-stats{justify-content:start;grid-template-columns:repeat(3,1fr)}.fo-stat{min-width:0;padding:14px 14px}.fo-format{grid-template-columns:1fr;gap:40px}.fo-banner{grid-template-columns:1fr;min-height:0;padding:34px 26px}.fo-lb-box{grid-template-columns:1fr;max-height:calc(100svh - 24px)}.fo-lb-side{padding:18px 20px;gap:8px}.fo-lb-side h3{font-size:20px}.fo-lb-side p{font-size:13px}.fo-lb-media video{height:min(62svh,560px)}.fo-lb-nav.next{right:14px}.fo-lb{padding:12px}}
@media(max-width:650px){.fo-now{display:none}.fo-hero{min-height:88svh;padding:120px 0 34px}.fo-hero h1{font-size:clamp(50px,15vw,72px)}.fo-now{padding-top:104px}.fo-stats{grid-template-columns:1fr 1fr}.fo-stat:last-child{grid-column:1/-1}.fo-stat b{font-size:28px}.fooh-page .inflate-section{padding-top:80px}.fooh-page .inflate-section-heading{grid-template-columns:1fr;gap:14px;margin-bottom:26px}.fo-mosaic{gap:8px}.fo-mosaic .fo-tile:nth-child(1){transform:translateY(16px)}.fo-mosaic .fo-tile:nth-child(3){transform:translateY(-16px)}.fo-tile-meta{padding:50px 12px 12px}.fo-tile-meta b{font-size:13px}.fo-tile-meta span{display:none}.fo-tile-meta small{display:none}.fo-shapes{grid-template-columns:1fr}.fo-shape{min-height:300px;padding:22px}.fo-films{grid-template-columns:repeat(2,1fr);gap:10px}.fo-films .fo-tile.is-feat .fo-tile-meta b{font-size:17px}.fo-films .fo-tile.is-feat .fo-tile-meta span{display:block;font-size:12px}.fo-steps{grid-template-columns:1fr}.fo-step{padding:28px 0!important;border-right:0!important;border-top:1px solid var(--fo-line)}.fo-step:first-child{border-top:0}.fo-step h3{margin-top:30px}.fo-final{margin-top:70px;padding:90px 0}.fo-marquee{padding:22px 0}.fo-partner{align-items:flex-start}}
