.hero{border-radius:0 0 80px 80px;overflow:hidden}.mix-intro{text-align:center;padding:88px 24px;color:#171a18;background:white}.mix-intro>span{font-size:11px;letter-spacing:.12em}.landing .mix-intro h2{font-family:var(--font-display);font-size:clamp(40px,4.5vw,68px);font-weight:800;letter-spacing:-.06em;line-height:1.02;margin:32px 0}.mix-intro p{font-size:18px;line-height:1.5;max-width:58ch;margin:0 auto}.mix-link{display:inline-block;padding:14px 24px;border:1px solid #171a1830;border-radius:99px;margin-top:32px;font-size:14px}.jm-work{margin:0 24px 24px;border-radius:80px;background:#dba7b2}.jm-stage{position:relative;isolation:isolate}.jm-intro{z-index:3}.jm-word{font-size:clamp(200px,42vw,620px);gap:12vw;font-weight:800;opacity:.8;z-index:1}.jm-deck{z-index:4}.mix-flow{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:-1;opacity:.3}.landing .about-preview{margin:0 24px 24px;background:#eeeae5;border:0;border-radius:80px;padding:80px 5vw;position:relative;isolation:isolate;overflow:hidden}.landing .about-preview h2{font-size:clamp(36px,3.5vw,56px);line-height:1.03}.mix-banner{margin:0 24px 24px;border-radius:80px;background:#171a18;color:#dba7b2;padding:64px 0;overflow:hidden}.mix-banner>div{font-family:var(--font-display);font-size:clamp(48px,7vw,104px);font-weight:800;line-height:1;letter-spacing:-.05em;white-space:nowrap;width:max-content}.landing .landing-footer{margin:0 24px 24px;border-radius:80px;background:#171a18;color:white;padding:64px 5vw}.landing .landing-footer a{color:white}.landing .footer-details{border-color:#ffffff30}.landing .landing-footer .kicker{color:#c9cac4}
@media(max-width:800px){.hero{border-radius:0 0 40px 40px}.mix-intro{padding:64px 24px}.landing .mix-intro h2{font-size:42px}.mix-intro p{font-size:16px}.jm-work,.landing .about-preview,.mix-banner,.landing .landing-footer{margin:0 12px 16px;border-radius:40px}.landing .about-preview,.landing .landing-footer{padding:56px 24px}.mix-banner{padding:40px 0}.landing .about-preview h2{font-size:36px}}
.mix-intro{padding:88px 24px 96px}.landing .mix-intro h2{margin:0 0 28px}.mix-intro p{max-width:62ch;font-size:18px}.jm-word{justify-content:space-between;gap:0;padding:0 8vw;inset:0;opacity:1}.jm-word span{flex:0 0 auto}.landing .about-preview{margin-top:48px;padding:72px 5vw;border-radius:64px;background:#f1f1ec}.landing .about-preview .kicker{color:#656a65}.landing .about-copy>p{max-width:48ch;font-size:17px;line-height:1.5}.mix-banner{margin-top:32px;margin-bottom:48px;border-radius:64px;padding:48px 0}.mix-banner>div{font-size:clamp(48px,6vw,88px)}.landing .landing-footer{position:relative;isolation:isolate;overflow:hidden;border-radius:64px;padding:72px 5vw;background:#dba7b2;color:#171a18}.landing .landing-footer a{color:#171a18}.landing .landing-footer .kicker{color:#3e3035}.landing .landing-footer .talk{font-size:clamp(64px,8vw,120px);line-height:1.05}.mix-contact-copy{font-size:17px;line-height:1.5;margin:24px 0 32px}.landing .footer-details{border-color:#171a1840}.landing-footer::before,.landing-footer::after{content:'';position:absolute;border:1px solid #171a1820;border-radius:50%;width:360px;height:360px;right:-120px;top:-160px;z-index:-1;pointer-events:none}.landing-footer::after{width:460px;height:460px;right:-170px;top:-210px}.mix-banner{position:relative}.mix-banner::before{content:'↗';position:absolute;right:40px;top:8px;font-size:24px;color:#dba7b2}
@media(max-width:800px){.mix-intro{padding:64px 24px}.mix-intro p{font-size:16px}.landing .about-preview{margin-top:24px;padding:48px 24px}.landing .about-preview,.mix-banner,.landing .landing-footer{border-radius:40px}.mix-banner{margin-top:24px;margin-bottom:24px;padding:32px 0}.landing .landing-footer{padding:48px 24px}.landing .about-copy>p,.mix-contact-copy{font-size:16px}}

/* Match the saved Jemini lettering choreography; only substitute initials. */
.jm-word{justify-content:center;padding:0;gap:0;font-size:clamp(160px,26vw,440px);letter-spacing:-.1em;font-weight:800;line-height:1;opacity:.68;z-index:1;color:#ffffff}
.jm-word>span{flex:0 0 auto;display:block;position:relative}
.jm-word i{visibility:hidden;font:inherit}
.jm-word b{position:absolute;left:-6.5vw;top:0;font:inherit}
.jm-word>span:last-child b{left:auto;right:1.5vw}

/* Open editorial about, rounded white close, and one continuous rose footer. */
.landing .about-preview{display:block;margin:0;background:#fff;border:0;border-radius:0;padding:clamp(80px,9vw,144px) 24px;text-align:center;overflow:visible;isolation:auto}
.landing .about-preview .kicker{margin:0 0 24px;font-size:11px;letter-spacing:.12em}
.landing .about-copy{max-width:760px;margin:auto}
.landing .about-preview h2{font-size:clamp(40px,4.5vw,68px);font-weight:800;letter-spacing:-.06em;margin:0 0 32px}
.landing .about-copy>p{max-width:58ch;margin:auto;font-size:18px;line-height:1.6}
.landing .about-preview .page-link{margin-top:32px;display:inline-flex;border:1px solid #171a1830;border-radius:99px;padding:16px 24px;gap:24px}
.mix-banner{margin:0;z-index:2;position:relative;border-radius:0 0 104px 104px;background:#fff;color:#171a18;padding:24px 0 80px}
.mix-banner>div{font-size:clamp(56px,7.5vw,112px);color:#171a18}
.mix-banner::before{display:none}
.landing .landing-footer{margin:-104px 0 0;padding:184px 6vw 0;border-radius:0;background:#dba7b2;display:grid;grid-template-columns:1fr 1.3fr 1.2fr;gap:32px;min-height:600px;position:relative;overflow:hidden;align-items:start;isolation:isolate}
.landing-footer::before,.landing-footer::after{display:none}
.mix-signature{font-family:var(--font-display);font-weight:800;font-size:clamp(24px,2.8vw,40px);letter-spacing:-.06em;display:flex;align-items:center;gap:16px;white-space:nowrap}
.mix-footer-brand>p{font-size:17px;line-height:1.5;margin:24px 0}
.mix-social{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#171a18;font-weight:700;font-size:20px}
.landing .mix-social{color:#fff}
.mix-footer-portrait{position:absolute;width:clamp(300px,39vw,620px);height:auto;left:29%;bottom:-96px;pointer-events:none;transform:rotate(-9deg);z-index:-1}
.mix-footer-contact{grid-column:3;position:relative;padding-bottom:112px}
.mix-footer-contact h2{font-family:var(--font-display);font-size:clamp(28px,3vw,44px);line-height:1.05;font-weight:800;letter-spacing:-.045em;margin:24px 0}
.mix-footer-contact>p:not(.kicker){font-size:16px;line-height:1.5}
.mix-email{display:inline-flex;justify-content:space-between;gap:56px;background:#171a18;border-radius:16px;padding:20px 24px;margin-top:24px;font-size:17px}
.landing .mix-email{color:#fff}
.landing .footer-details{grid-column:1/-1;position:relative;z-index:2;background:#171a18;color:#fff;margin:0 -6vw;padding:24px 6vw;display:flex;justify-content:space-between;gap:24px;border:0}
.landing .footer-details a{color:#fff}
@media(max-width:800px){.landing .about-preview{padding:80px 24px}.landing .about-copy>p{font-size:16px}.mix-banner{border-radius:0 0 48px 48px;padding-bottom:48px}.landing .landing-footer{margin-top:-48px;padding:112px 24px 0;grid-template-columns:1fr;gap:40px;min-height:0}.mix-footer-contact{grid-column:1;padding-bottom:280px}.mix-footer-contact h2{font-size:36px}.mix-footer-portrait{left:auto;right:-32px;width:300px;bottom:16px}.landing .footer-details{margin:0 -24px;padding:24px;flex-wrap:wrap;font-size:11px}.mix-footer-brand>p{margin:16px 0}.mix-social{position:absolute;right:24px;top:112px}}
.landing .about-preview>.kicker{max-width:none;width:100%;text-align:center}
.landing .landing-footer .mix-email,.landing .landing-footer .mix-social{color:#fff}

/* Simplified footer identity and direct contact. */
.landing .landing-footer{grid-template-columns:1fr auto;min-height:0;gap:64px 32px;padding:168px 6vw 0;align-items:center}
.mix-footer-email{display:inline-block;font-size:clamp(16px,1.5vw,20px);margin-top:16px;line-height:1.5}
.landing .landing-footer>.mix-social{position:static;background:transparent;border-radius:0;width:48px;height:48px;color:#171a18}
.mix-social svg{display:block}
.landing .landing-footer .footer-details{margin-top:0}
@media(max-width:800px){.landing .landing-footer{padding:104px 24px 0;grid-template-columns:1fr auto;gap:48px 16px}.mix-signature{font-size:28px}.mix-footer-email{font-size:15px}.landing .landing-footer>.mix-social{width:40px;height:40px}.mix-social svg{width:28px;height:28px}}

.landing .about-preview{position:relative;z-index:2;border-radius:0 0 104px 104px;padding-bottom:104px}
@media(max-width:800px){.landing .about-preview{border-radius:0 0 48px 48px;padding-bottom:80px}}

.jm-carousel-controls{display:none}
@media(max-width:800px){
.jm-stage{padding:48px 0 32px;display:block;height:auto;min-height:0}
.jm-intro{padding:0 24px}
.landing .jm-intro h2{font-size:28px;margin:0 0 32px}
.jm-deck{display:flex;gap:16px;max-width:none;width:100%;margin:0;padding:0 24px 8px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:24px;overscroll-behavior-x:contain;scrollbar-width:none;transform:none}
.jm-deck::-webkit-scrollbar{display:none}
.jm-card{flex:0 0 88%;width:88%;height:auto;aspect-ratio:4/5;scroll-snap-align:start;transform:none}
.jm-art{bottom:120px}
.jm-label{bottom:16px;left:16px;right:16px;min-height:104px}
.jm-carousel-controls{display:flex;justify-content:space-between;align-items:center;margin:24px 24px 0;font-size:12px;letter-spacing:.08em}
.jm-carousel-controls>div{display:flex;gap:8px}
.jm-carousel-controls button{border:1px solid #171a1840;background:transparent;color:#171a18;width:44px;height:44px;border-radius:50%;font:inherit;font-size:20px;cursor:pointer}
.jm-carousel-controls button:disabled{opacity:.3;cursor:default}
.jm-carousel-controls button:focus-visible{outline:2px solid #171a18;outline-offset:3px}
}

.hero-handoff{position:absolute;inset:0;pointer-events:none;transform-origin:75% 100%}
@media(prefers-reduced-motion:no-preference){.hero-handoff,.hero .content,.hero .background-art{will-change:transform,opacity}}
/* Cover art: fewer screens, larger product moments, original project colours. */
.cover-art{overflow:hidden;justify-content:center;isolation:isolate}
.cover-art>video{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.cover-podimo{background:#e8e1fa}.cover-podimo>img{width:100%;height:100%;object-fit:contain;transform:scale(1.04)}
.cover-spaces{background:#ece6fc}.cover-spaces>video{transform:scale(1.45)}
.cover-library{background:#e8e8df}
.cover-type{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:clamp(48px,8vw,120px);font-weight:800;line-height:.85;letter-spacing:-.07em;color:#c8cbc0}
.cover-device{height:88%;aspect-ratio:1080/2340;background:#062d39;border:8px solid #171a18;border-radius:32px;overflow:hidden;transform:rotate(-7deg);box-shadow:16px 24px 32px #171a1826;position:relative}
.cover-device video{width:100%;height:100%;display:block;object-fit:cover}
.cover-home{background:#fff8ee}.cover-home>video{object-fit:contain;transform:scale(1.2)}
.cover-public{background:#fff8ee}.cover-public>video{transform:scale(1.45)}
.cover-player{background:#e8e1fa}.cover-player>img{object-fit:contain;transform:scale(1.13)}
.jm-card:hover .cover-art img{transform:scale(1.04)}
@media(max-width:800px){.cover-spaces>video,.cover-public>video{transform:scale(1.18)}.cover-home>video{transform:scale(1.05)}.cover-device{border-width:6px;border-radius:24px}.cover-type{font-size:64px}}
.cover-spaces>video{transform:none;object-fit:cover}
.cover-home>img{object-fit:contain;transform:scale(1.08)}
@media(prefers-reduced-motion:reduce){.cover-device{display:none}.cover-library{background:#e8e8df url('../assets/fb999df6b429eb-Library_cover.png') center/contain no-repeat}.cover-type{display:none}}
.motion-paused .cover-device{display:none}.motion-paused .cover-library{background:#e8e8df url('../assets/fb999df6b429eb-Library_cover.png') center/contain no-repeat}.motion-paused .cover-type{display:none}

.cover-home{display:flex;gap:5%;align-items:center;background:#edf1e5}.home-screen{height:87%;aspect-ratio:.485;background-image:url(../assets/d786469199c3a0-For_You_-_Solution.png);background-size:320% auto;background-repeat:no-repeat;border-radius:28px;box-shadow:12px 16px 24px #062d391c}.home-preferences{background-position:50% 67%;transform:rotate(-6deg) translateY(5%)}.home-discovery{background-position:100% 67%;transform:rotate(6deg) translateY(-3%)}

.cover-library>img{width:100%;height:100%;object-fit:contain;transform:scale(1.08)}.cover-public>video{transform:scale(1.1)}

.cover-art>.cover-video-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none}.cover-art>video{position:relative;opacity:0}.cover-art>video.is-ready{opacity:1}
/* Compact labels overlay the cover, revealing on pointer hover or keyboard focus. */
.landing .jm-card .jm-art{bottom:0}
.landing .jm-label{min-height:0;padding:18px 72px 18px 22px;bottom:16px;left:16px;right:16px;opacity:0;transform:translateY(12px);transition:opacity .22s ease,transform .3s cubic-bezier(.22,1,.36,1);pointer-events:none}
.landing .jm-label h3{font-size:clamp(18px,2.1vw,28px);line-height:1.15;margin:0 0 6px;white-space:nowrap}
.landing .jm-label p{font-size:clamp(12px,1.2vw,15px);line-height:1.4;max-width:none;white-space:nowrap}
.landing .jm-label>span{top:50%;transform:translateY(-50%);right:20px;width:36px;height:36px}
.landing .jm-card:hover .jm-label,.landing .jm-card:focus-visible .jm-label{opacity:1;transform:none}
@media(hover:none),(pointer:coarse){.landing .jm-label{opacity:1;transform:none}}
@media(max-width:800px){.landing .jm-label{padding:14px 48px 14px 14px;left:12px;right:12px;bottom:12px}.landing .jm-label h3{font-size:17px;letter-spacing:-.055em}.landing .jm-label p{font-size:11px}.landing .jm-label>span{width:28px;height:28px;right:12px}}
@media(prefers-reduced-motion:reduce){.landing .jm-label{transition:none}}
/* Editorial headline and covers selected from the final product experiences. */
body #headline{line-height:.94}
body #headline>span{line-height:inherit}
.cover-library{background:#fff7ed!important}
.cover-library>img{width:100%;height:100%;object-fit:contain;transform:scale(1.08)}
.cover-player{display:flex;align-items:center;justify-content:center;gap:7%;padding:7% 8%;background:#eee7f8}
.landing-player-phone{position:relative;width:37%;height:auto;aspect-ratio:1948/3940;flex:none}
.landing-player-phone:last-child{transform:translateY(5%)}
.cover-player .landing-player-phone img{position:absolute;display:block;max-width:none;margin:0;transform:none;object-fit:fill}
.cover-player .landing-player-screen{left:5.35%;top:2%;width:89.3%;height:96%;border-radius:13%/6%;background:#111}
.cover-player .landing-player-frame{inset:0;width:100%;height:100%;object-fit:contain;z-index:2}
@media(max-width:767px){body #headline{line-height:1.02}}
/* Clean, centered product compositions and borderless cards. */
.landing .jm-card,.landing .jm-art,.landing .jm-label{border:0;outline:none;box-shadow:none}
.landing .jm-card:focus-visible{outline:2px solid #3c5141;outline-offset:6px}
.cover-player .landing-player-phone:last-child{transform:none}
.cover-player{gap:6%;padding:6% 8%;align-items:center;justify-content:center}
.cover-home{display:flex;align-items:center;justify-content:center;gap:6%;padding:6% 8%}
.cover-home .home-cover-phone{display:block;position:relative;inset:auto;width:37%;height:auto;aspect-ratio:770/1578;flex:none;max-width:none;transform:none;clip-path:inset(1% 1.5% round 15% / 7%)}
/* Optical leading for the three-line display headline. */
body #headline,body #headline>span{line-height:.88}
@media(max-width:767px){body #headline,body #headline>span{line-height:.94}}
/* Give the work more of the viewport, with a closer introduction. */
@media(min-width:801px) and (prefers-reduced-motion:no-preference){
 .landing .jm-deck{margin-top:64px}
 .landing .jm-card{width:min(58vw,94svh);height:72svh}
 .landing .jm-intro{top:24px}
 .landing .jm-intro h2{margin:16px 0 0}
}
@media(max-width:800px){.landing .jm-intro h2{margin-bottom:20px}.landing .jm-card{flex-basis:92%;width:92%}}

/* Mobile cards name each project without relying on hover. */
@media(max-width:800px){
 .landing .jm-label{opacity:1;transform:none;min-height:88px}
 .landing .jm-label h3,.landing .jm-label p{white-space:normal}
 .landing .jm-label p{font-size:12px;line-height:1.4}
 .landing .jm-card .jm-art{bottom:112px}
}

/* Mobile portrait meets the section edge; the reveal stays registered to it. */
@media(max-width:700px){
 .hero{padding-bottom:510px;min-height:1000px}
 .hero .portrait-entry{bottom:-24px;height:490px}
 .hero .portrait-stage{transform-origin:50% 100%}
 .hero .hero-handoff{transform-origin:50% 100%}
 .hero .scene img{bottom:-10px}
}
.landing .footer-details{flex-wrap:nowrap;align-items:center;justify-content:space-between}
.landing .footer-details>span{width:auto;margin:0}
/* Touch devices use the native horizontal project carousel. */
@media(max-width:800px){.landing .landing-footer .footer-details{opacity:1!important;transform:none!important}}

/* Keep mobile portrait and cyborg layers centered and perfectly registered. */
@media(max-width:700px){
 .hero{min-height:900px;padding-bottom:450px}
 .hero .content{margin-top:24px}
 .hero h1{font-size:50px;margin-bottom:20px}
 .hero .hero-description{font-size:16px;line-height:1.45;margin-bottom:20px}
 .hero .scene img{right:0;transform:none}
}
/* Match the optical device scale of the Community cover on phones. */
@media(max-width:800px){
 .landing .cover-library>img,.landing .jm-card:hover .cover-library>img{transform:scale(1.35)}
 .landing .cover-home,.landing .cover-player{padding:4%;gap:6%}
 .landing .cover-home .home-cover-phone,.landing .cover-player .landing-player-phone{width:43%}
}

/* The animation and its poster share one composition; hide its baked-in bottom hairline. */
.landing .cover-podimo{background:#e8e1fa}
.landing .cover-podimo>img{height:auto;flex:none;clip-path:inset(0 0 3px 0);object-fit:fill}

/* Carry each project's cover colour through its full card. */
.landing .jm-podimo{background:#e8e1fa}
.landing .jm-spaces{background:#ece6fc}
.landing .jm-library{background:#fff7ed}
.landing .jm-home{background:#edf1e5}
.landing .jm-public{background:#fff8ee}
.landing .jm-player{background:#eee7f8}

/* Centre every cover in the artwork area, and let ready prototypes take over. */
.landing .cover-art{align-items:center;justify-content:center}
.landing .cover-art>img,.landing .cover-art>video{object-position:50% 50%;transform-origin:50% 50%}
.landing .cover-art:has(video.is-ready)>.cover-video-fallback{visibility:hidden}
.landing .cover-art>video{z-index:1}
.landing .cover-public>video{object-fit:cover;transform:none}
.landing .cover-public>.cover-video-fallback{object-fit:cover}
/* Keep the Community pair within the same canvas as the other device covers. */
@media(max-width:800px){
 .landing .cover-podimo>img,.landing .jm-card:hover .cover-podimo>img{width:100%;height:100%;object-fit:contain;transform:scale(.88);flex:none}
}

/* The GIF and its poster must fit the artwork area at desktop sizes too. */
.landing .cover-podimo>img,.landing .jm-card:hover .cover-podimo>img{width:100%;height:100%;object-fit:contain;transform:scale(.88);flex:none}

/* Keep the desktop introduction compact beneath the oversized headline. */
@media(min-width:801px){
 .hero .hero-description{max-width:34ch;text-wrap:balance}
}

@media (prefers-reduced-motion:reduce) {
  .landing .jm-label { opacity:1; transform:none; }
}