@font-face{font-family:Nunito;src:url('assets/nunito-500.ttf') format('truetype');font-weight:400 600;font-display:swap}
@font-face{font-family:Nunito;src:url('assets/nunito-900.ttf') format('truetype');font-weight:700 900;font-display:swap}
:root{--ink:#102323;--muted:#73807c;--teal:#4b8581;--light:#eef2ef;--gutter:clamp(24px,4vw,80px)}
*{box-sizing:border-box}html{background:#fff;scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;color:var(--ink);font-family:Nunito,ui-rounded,Arial,sans-serif;-webkit-font-smoothing:antialiased}body:has(dialog[open]){overflow:hidden}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #1d1d1f;outline-offset:6px}button:disabled{opacity:.3;cursor:default}::selection{background:#cbded6}.skip-link{position:fixed;top:-100px;left:24px;z-index:20;background:var(--ink);color:#fff;padding:14px 24px;border-radius:30px}.skip-link:focus{top:20px}.page{background:#fff}.header{display:flex;align-items:center;justify-content:space-between;padding:27px var(--gutter);height:105px;position:relative;z-index:4}.brand{font-size:33px;font-weight:800;letter-spacing:-2.1px;line-height:1;display:inline-flex;gap:4px;align-items:flex-start}.brand span{font-size:9px;letter-spacing:0;margin-top:3px}.status{font-size:12px;font-weight:600;display:inline-flex;align-items:center;gap:9px;padding:11px 17px;border-radius:30px;background:var(--teal);color:#fff}.status-dot{height:6px;width:6px;border-radius:50%;background:#d7eee5;box-shadow:0 0 0 4px #ffffff13;animation:breathe 3s ease-in-out infinite}.eyebrow{font-size:10px;letter-spacing:.13em;font-weight:600}.hero{position:relative;min-height:620px;height:calc(100svh - 105px);max-height:1000px;isolation:isolate;overflow:clip}.intro{position:absolute;left:var(--gutter);top:7%;z-index:3}.intro p{font-size:clamp(32px,3.5vw,56px);letter-spacing:-.055em;line-height:1.12;margin:18px 0 0}.hero-film-wrap{position:absolute;left:32%;right:var(--gutter);top:1%;height:72%;border-radius:22px;overflow:hidden;background:#fff}.hero-film-wrap video{display:block;width:100%;height:100%;object-fit:cover;object-position:49% 50%}.hero h1{font-weight:900;position:absolute;left:2%;bottom:14%;margin:0;font-size:27.4vw;line-height:.82;letter-spacing:-.065em;z-index:2;white-space:nowrap;pointer-events:none}.cross{line-height:1;color:var(--teal);font-size:34px;font-weight:500}.hero-cross{position:absolute;left:19%;top:43%;transform:rotate(45deg)}.hero-caption{position:absolute;left:var(--gutter);right:var(--gutter);bottom:3%;z-index:3;display:flex;align-items:center;justify-content:space-between}.film-trigger,.scroll-link{display:flex;gap:12px;align-items:center;border:0;background:transparent;padding:8px 0;font-size:12px;font-weight:600}.round-icon{display:grid;place-items:center;font-size:24px;width:44px;height:44px;border-radius:50%;background:var(--light);transition:background .25s,transform .35s}.film-trigger:hover .round-icon{background:#d9e8e1;transform:rotate(45deg)}.scroll-link:hover .round-icon{background:#d9e8e1;transform:translateY(3px)}
.reveal{position:relative;height:100svh;min-height:650px;margin-top:40px}.sequence-ready .reveal{height:270svh}.reveal-sticky{height:100svh;min-height:650px;position:sticky;top:0;overflow:clip;background:white}.reveal-heading{position:absolute;left:var(--gutter);top:8%;z-index:2}.reveal h2{font-weight:500;font-size:clamp(44px,5.2vw,84px);letter-spacing:-.06em;line-height:1.02;margin:16px 0 0}.reveal-stage{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:min(95vw,100svh,1000px);height:min(95vw,100svh,1000px)}.reveal-stage img,.reveal-stage canvas{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.reveal-stage canvas{visibility:hidden}.sequence-drawn .reveal-stage canvas{visibility:visible}.sequence-drawn .reveal-poster{visibility:hidden}.reveal-bottom{position:absolute;bottom:6%;left:var(--gutter);right:var(--gutter);display:flex;justify-content:space-between;align-items:flex-end;z-index:2}.reveal-bottom p{font-size:14px;line-height:1.6;margin:0}.reveal-bottom p span{color:var(--muted)}.reveal-progress{display:flex;gap:14px;align-items:center;font-size:11px}.progress-track{display:block;width:90px;height:3px;border-radius:4px;background:#e6ece8;overflow:hidden}.progress-track>span{display:block;width:100%;height:100%;background:var(--teal);transform:scaleX(var(--progress,0));transform-origin:left}.reveal-progress>span:last-child{font-size:21px}
.details{padding:110px 0 75px;overflow:clip;scroll-margin-top:20px}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin:0 var(--gutter) 48px}.section-heading h2{font-size:clamp(32px,4.2vw,64px);line-height:1.08;font-weight:500;letter-spacing:-.055em;margin:16px 0 0}.gallery-controls,.viewer-controls{display:flex;align-items:center;gap:10px}.circle-button{flex-shrink:0;width:44px;height:44px;border:0;border-radius:50%;background:var(--light);font-size:22px;display:grid;place-items:center;transition:background .2s}.circle-button:hover:not(:disabled){background:#dbe6df}.gallery{display:flex;gap:20px;padding:8px var(--gutter) 18px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none}.gallery::-webkit-scrollbar{display:none}.feature-card{flex:0 0 calc((100vw - var(--gutter)*2 - 40px)/3);min-width:300px;max-width:560px;text-align:left;padding:0;border:0;background:#f3f5f3;border-radius:26px;overflow:hidden;scroll-snap-align:start;position:relative;transition:transform .35s cubic-bezier(.2,.8,.2,1)}.feature-card:hover{transform:translateY(-5px)}.card-image{aspect-ratio:1.1;overflow:hidden;background:#eff1ee}.card-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1)}.feature-card:hover img{transform:scale(1.035)}.card-image.front{background:#c7c7c7}.card-image.side{background:#e9ece9}.card-image.case{background:#212121}.card-image.rear{background:#dce4df}.card-caption{padding:28px 30px 34px;position:relative;min-height:215px}.card-caption .eyebrow{font-size:9px;color:#52645d}.card-caption h3{font-size:clamp(27px,2.5vw,40px);font-weight:500;letter-spacing:-.05em;line-height:1.06;margin:13px 0 14px}.card-caption p{font-size:12px;line-height:1.5;color:#5d6b65;margin:0;padding-right:25px;max-width:270px}.expand{position:absolute;right:22px;bottom:27px;display:grid;place-items:center;border-radius:50%;width:29px;height:29px;background:#dce5de;font-size:23px;font-weight:500}.gallery-foot{display:flex;align-items:center;justify-content:space-between;margin:19px var(--gutter) 0;color:var(--muted);font-size:11px;font-variant-numeric:tabular-nums}.text-button{padding:10px 0;border:0;background:none;font-size:12px}.text-button span{display:inline-block;margin-left:8px;font-size:20px;transition:transform .2s}.text-button:hover span{transform:translate(2px,-2px)}
.footer{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;padding:105px var(--gutter) 45px;min-height:420px;background:#f6f8f5}.footer .eyebrow{color:var(--muted)}.footer p{font-size:clamp(38px,5.5vw,80px);line-height:1.05;letter-spacing:-.055em;margin:22px 0}.stay-tuned{font-size:16px;color:var(--teal)}.footer-right{display:flex;align-items:flex-end;flex-direction:column;gap:18px}.footer small{font-size:9px;letter-spacing:.09em;color:var(--muted);white-space:nowrap}.motion-toggle{display:flex;align-items:center;gap:5px;border:0;background:none;padding:8px 0;color:var(--muted);font-size:11px}.motion-toggle svg,.floating-motion svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.motion-toggle:hover{color:var(--ink)}.back-top{font-size:11px}.floating-motion{position:fixed;right:22px;bottom:22px;z-index:5;width:38px;height:38px;display:grid;place-items:center;border:0;border-radius:50%;color:var(--ink);background:#eff3f0dc;backdrop-filter:blur(12px);box-shadow:0 2px 12px #10232308}.motion-paused .status-dot{animation-play-state:paused}
dialog{width:min(1100px,calc(100vw - 32px));max-height:calc(100svh - 32px);padding:0;border:0;background:#fff;color:var(--ink);border-radius:24px;box-shadow:0 30px 100px #0002}dialog::backdrop{background:#0008;backdrop-filter:blur(10px)}.film-shell,.viewer-shell{padding:24px 28px 18px}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.dialog-header h2{font-size:22px;font-weight:500;letter-spacing:-.05em;margin:0}.close-dialog{border:0;border-radius:25px;padding:10px 15px;background:var(--light);display:flex;gap:16px;align-items:center;font-size:12px}.close-dialog span{font-size:22px;line-height:1}#product-film{display:block;width:100%;max-height:70svh;aspect-ratio:16/9;object-fit:contain;margin:20px auto 8px;border-radius:20px;background:#000}.film-shell>p{font-size:11px;color:var(--muted);text-align:center}.viewer-stage{height:min(64svh,650px);margin:20px 0 16px;border-radius:14px;background:#f0f2f0;overflow:hidden;position:relative}.viewer-stage img{width:100%;height:100%;object-fit:contain;display:block}.viewer-loading{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:#fff;border-radius:30px;padding:8px 14px;font-size:12px;display:none}.viewer-stage.loading .viewer-loading{display:block}.viewer-footer{display:flex;align-items:center;justify-content:space-between;gap:18px}.viewer-footer p{font-size:13px;line-height:1.4;margin:0}.viewer-controls{gap:16px;white-space:nowrap}.viewer-controls>span{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}
@keyframes breathe{0%,100%{opacity:.6}50%{opacity:1}}
@media(min-width:1800px){.page{max-width:2100px;margin:auto}.hero h1{font-size:min(27.4vw,575px)}}
@media(max-width:1000px){.hero{height:calc(100svh - 90px);min-height:630px}.header{height:90px}.hero-film-wrap{left:30%;height:70%;top:4%}.hero h1{bottom:16%}.intro p{font-size:35px}.hero-cross{top:40%}.feature-card{flex-basis:44vw;min-width:300px}.reveal-stage{top:54%;width:min(105vw,100svh,900px);height:min(105vw,100svh,900px)}.reveal-heading{top:8%}.details{padding-top:80px}.card-caption{padding:25px 26px 30px}}
@media(max-width:600px){:root{--gutter:24px}.header{height:84px;padding-top:24px;padding-bottom:24px}.brand{font-size:28px}.status{font-size:10px;padding:10px 14px}.hero{height:calc(100svh - 84px);min-height:650px;max-height:880px}.intro{top:3%;}.intro p{font-size:38px;line-height:1.07;margin-top:14px}.eyebrow{font-size:9px}.hero-film-wrap{left:24px;right:24px;top:31%;height:49%;border-radius:20px}.hero-film-wrap video{object-position:43% 50%}.hero-cross{left:auto;right:37px;top:14%;font-size:30px}.hero h1{bottom:16%;font-size:27.3vw;left:2%;color:var(--ink)}.hero-caption{bottom:2.4%;}.film-trigger,.scroll-link{font-size:10px;gap:8px}.round-icon{width:36px;height:36px;font-size:21px}.reveal{min-height:650px;margin-top:20px}.sequence-ready .reveal{height:230svh}.reveal-sticky{min-height:650px}.reveal-heading{top:9%}.reveal h2{font-size:49px;margin-top:16px}.reveal-stage{top:53%;width:130vw;height:130vw;max-width:720px;max-height:720px}.reveal-bottom{bottom:6%;gap:24px}.reveal-bottom p{font-size:11px}.reveal-progress{gap:10px;font-size:10px}.progress-track{width:48px}.details{padding:70px 0 60px}.section-heading{margin-bottom:28px;align-items:flex-end;gap:12px}.section-heading h2{font-size:36px;max-width:270px}.gallery-controls{gap:7px}.gallery-controls .circle-button{width:34px;height:34px;font-size:19px}.gallery{gap:14px}.feature-card{flex-basis:84vw;min-width:0;border-radius:22px}.card-image{aspect-ratio:1.04}.card-caption{min-height:215px}.card-caption h3{font-size:36px}.gallery-foot{margin-top:9px}.footer{min-height:400px;padding:70px var(--gutter) 44px;gap:20px}.footer p{font-size:40px}.footer-right{gap:16px}.motion-toggle{font-size:10px}.stay-tuned{font-size:14px}.floating-motion{right:14px;bottom:14px;width:34px;height:34px}.film-shell,.viewer-shell{padding:20px 16px 14px}.dialog-header h2{font-size:20px}.viewer-stage{height:52svh}.viewer-footer{align-items:flex-start;flex-direction:column;gap:15px}.viewer-controls{width:100%;justify-content:space-between}.viewer-footer p{font-size:12px}#product-film{margin-top:18px}}
@media(max-height:600px) and (min-width:601px){.hero{min-height:530px}.reveal,.reveal-sticky{min-height:520px}.reveal-stage{width:100svh;height:100svh}.reveal h2{font-size:44px}.reveal-heading{top:8%}.reveal-bottom{bottom:5%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.sequence-ready .reveal{height:100svh}.reveal-stage canvas{visibility:hidden!important}.reveal-poster{visibility:visible!important}.progress-track{display:none}.motion-toggle,.floating-motion{display:none}.feature-card:hover{transform:none}}
/* Full-viewport film, framed by the white page. */
.header{position:absolute;left:20px;right:20px;top:20px;height:90px;padding:25px 28px;z-index:4}.hero{height:100svh;min-height:680px;max-height:none}.hero-film-wrap{inset:20px;height:auto;border-radius:30px;background:#fff}.hero-film-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,#07151235 69%,#0715129c 100%);pointer-events:none}.hero-film-wrap video{border-radius:30px;object-position:50% 45%}.intro{left:48px;top:155px;color:#102323}.intro p{font-size:clamp(34px,3.5vw,56px)}.hero-cross{display:none}.hero h1{color:#fff;left:3%;bottom:14%;font-size:20vw}.hero-caption{left:48px;right:48px;bottom:48px;color:#fff;padding-right:42px}.hero-caption .round-icon{background:#ffffff26;backdrop-filter:blur(12px);color:#fff}.hero-caption a:hover .round-icon,.hero-caption button:hover .round-icon{background:#ffffff45}.hero-caption .film-trigger{color:#fff}.reveal-heading{left:0;right:0;top:19%;text-align:center;opacity:var(--title-opacity,1);transform:translateY(var(--title-y,0));pointer-events:none}.reveal-heading h2{font-size:clamp(100px,16vw,230px);font-weight:900;letter-spacing:-.065em;color:#000;line-height:.9;margin:0}.reveal-heading p{font-size:clamp(19px,2.2vw,30px);letter-spacing:-.04em;margin:20px 0 0;color:#000}.reveal-stage{top:49%}.reveal-heading h2,.reveal-heading p{animation:word-arrive 1.2s cubic-bezier(.2,.8,.2,1) both}.reveal-heading p{animation-delay:.14s}.viewer-stage{touch-action:pan-y pinch-zoom}
.wear{position:relative;margin:30px var(--gutter) 110px;background:#000;border-radius:30px;overflow:hidden;isolation:isolate}.wear-film-wrap{height:min(77vw,780px);min-height:420px;max-height:90svh;border-radius:30px;overflow:hidden;background:#000}.wear-film-wrap video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;border-radius:30px}.wear-film-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#031c2680,transparent 65%);pointer-events:none}.wear-heading{position:absolute;left:5%;top:10%;z-index:2;color:#fff;max-width:46%}.wear h2{font-size:clamp(32px,5vw,76px);font-weight:500;letter-spacing:-.055em;line-height:1.05;margin:20px 0 0}
@keyframes word-arrive{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.header{top:12px;left:12px;right:12px;padding:22px 18px;height:78px}.hero{height:100svh;min-height:680px;max-height:none}.hero-film-wrap{inset:12px;border-radius:24px;height:auto}.hero-film-wrap video{border-radius:24px;object-position:46% 50%}.hero-film-wrap::after{background:linear-gradient(180deg,#ffffff26,transparent 45%,#071512b0 100%)}.intro{top:123px;left:30px;max-width:210px}.intro p{font-size:36px}.hero h1{bottom:17%;font-size:27.3vw;left:2%}.hero-caption{left:30px;right:30px;bottom:56px;padding-right:26px;gap:8px}.hero-caption .scroll-link,.hero-caption .film-trigger{font-size:10px}.hero-caption .round-icon{width:32px;height:32px}.reveal-heading{top:24%;left:0;right:0}.reveal-heading h2{font-size:112px}.reveal-heading p{font-size:22px;margin-top:15px}.reveal-stage{top:53%}.wear{margin:10px 16px 65px;border-radius:24px}.wear-film-wrap{height:110vw;min-height:480px;max-height:90svh;border-radius:24px}.wear-film-wrap video{border-radius:24px;object-position:59% 50%}.wear-film-wrap::after{background:linear-gradient(180deg,#031c2685,transparent 75%)}.wear-heading{left:26px;top:30px;max-width:90%}.wear h2{font-size:38px}}
@media(prefers-reduced-motion:reduce){.reveal-heading{top:6%;opacity:1;transform:none}.reveal-heading h2{font-size:64px}.reveal-heading p{font-size:18px;margin-top:10px}.reveal-stage{top:57%}}
/* A restrained black, white, blue and light-grey product palette. */
:root{--ink:#1d1d1f;--muted:#6e6e73;--teal:#0071e3;--light:#f5f5f7}::selection{background:#c7e3ff}.intro{color:#fff;text-shadow:0 1px 20px #0002}.header .brand{color:#fff}.status{background:#0071e3}.status-dot{background:#fff;box-shadow:none}.hero-film-wrap::after{background:linear-gradient(180deg,#00000045,transparent 42%,#00000025 65%,#00000090)}.circle-button:hover:not(:disabled){background:#e6e6eb}.expand{background:#e8e8ed;color:#1d1d1f}.floating-motion{background:#f5f5f7e8;color:#1d1d1f}.progress-track{background:#e8e8ed}.footer{background:#f5f5f7}.viewer-stage{background:#f5f5f7}.wear-film-wrap::after{background:linear-gradient(90deg,#0009,transparent 70%)}.bento-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:22px;margin:0 var(--gutter);max-width:1500px}.feature-card{display:block;min-width:0;max-width:none;width:100%;border-radius:28px;background:#f5f5f7;scroll-snap-align:unset;text-align:left;isolation:isolate;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.bento-voice{grid-column:span 7;grid-row:span 2;min-height:650px;background:#d3d3d3}.bento-screen{grid-column:span 5;min-height:314px}.bento-touch{grid-column:span 5;min-height:314px}.bento-case{grid-column:span 12;min-height:460px;color:#fff;background:#212121}.bento-photo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.8,.2,1);z-index:-1}.feature-card:hover .bento-photo{transform:scale(1.025)}.bento-copy{position:absolute;left:34px;top:34px;right:34px;z-index:1}.bento-copy .eyebrow{display:block;font-size:9px;letter-spacing:.12em;margin-top:14px;color:#525258}.bento-copy h3{font-size:clamp(30px,3.1vw,48px);font-weight:700;letter-spacing:-.045em;line-height:1.02;margin:14px 0}.bento-copy p{font-size:13px;color:#515154;line-height:1.5;margin:0;max-width:220px}.feature-icon{display:block;width:32px;height:32px;color:#0071e3}.feature-icon svg{display:block;width:100%;height:100%}.bento-voice .bento-photo{height:89%;top:11%;object-position:center bottom}.bento-voice .bento-copy{max-width:300px}.bento-voice::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,#d5d5d5 0%,#d5d5d5e0 16%,transparent 45%)}.bento-screen .bento-copy{right:45%;top:34px}.bento-screen h3{font-size:clamp(26px,2.8vw,42px)}.bento-stat{position:absolute;right:35px;top:22px;min-width:40%;text-align:center;font-size:clamp(140px,13.5vw,210px);font-weight:700;line-height:1;letter-spacing:-.075em;background:linear-gradient(145deg,#002b70,#0071e3 45%,#79beff);background-clip:text;-webkit-background-clip:text;color:transparent}.bento-stat>span{display:block;font-size:11px;font-weight:500;line-height:1.4;letter-spacing:0;color:var(--muted);margin-top:8px}.bento-touch .bento-copy{max-width:50%}.bento-touch .bento-photo{left:27%;width:73%;object-position:50% 50%}.bento-case .bento-copy{top:50%;transform:translateY(-50%);max-width:38%}.bento-case .bento-photo{left:30%;width:70%;object-fit:cover;object-position:center 55%}.bento-case .eyebrow,.bento-case p{color:#c6c6c8}.bento-case .expand{background:#424245;color:#fff}.bento-case::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;background:linear-gradient(90deg,#212121 26%,#21212100 50%)}.bento-case h3{font-size:clamp(38px,4.5vw,68px)}.feature-card .expand{right:22px;bottom:22px;z-index:2}.gallery-foot{max-width:1500px}.viewer-footer .circle-button{background:#f5f5f7}
@media(min-width:1700px){.bento-grid{margin-inline:auto}.gallery-foot{margin-inline:auto}.section-heading{max-width:1500px;margin-inline:auto}}
@media(max-width:1000px){.bento-grid{gap:18px}.bento-voice{grid-column:span 6;min-height:620px}.bento-screen,.bento-touch{grid-column:span 6;min-height:301px}.bento-copy{left:26px;top:26px;right:26px}.bento-copy h3{font-size:33px}.bento-screen .bento-copy{left:26px;top:26px;right:45%}.bento-screen h3{font-size:28px}.bento-stat{right:24px;top:54px;font-size:140px}.bento-case{min-height:400px}.bento-case h3{font-size:48px}}
@media(max-width:600px){.hero-film-wrap::after{background:linear-gradient(180deg,#00000066,transparent 50%,#000000ad)}.bento-grid{grid-template-columns:1fr;gap:16px;margin-inline:16px}.bento-voice,.bento-screen,.bento-touch,.bento-case{grid-column:1;grid-row:auto;border-radius:24px}.bento-voice{min-height:550px}.bento-screen{min-height:280px}.bento-touch{min-height:330px}.bento-case{min-height:550px}.bento-copy{left:28px;top:28px;right:28px}.bento-copy h3{font-size:36px}.bento-voice .bento-copy{max-width:270px}.bento-voice .bento-photo{height:78%;top:22%}.bento-screen .bento-copy{left:28px;top:28px}.bento-screen h3{font-size:29px}.bento-stat{right:20px;top:34px;font-size:155px}.bento-touch .bento-copy{max-width:50%}.bento-case .bento-copy{top:30px;transform:none;max-width:85%}.bento-case h3{font-size:40px}.bento-case .bento-photo{left:0;top:33%;height:67%;width:100%;object-position:center}.bento-case::after{background:linear-gradient(180deg,#212121 22%,#21212100 55%)}.wear-film-wrap::after{background:linear-gradient(180deg,#0008,transparent 70%)}.section-heading h2{max-width:none}}
.section-description{max-width:560px;font-size:17px;line-height:1.6;color:var(--muted);margin:24px 0 0;letter-spacing:-.02em}.bento-copy h3{font-weight:600;font-size:clamp(30px,3vw,45px)}.bento-voice .bento-copy{max-width:360px}.bento-touch .bento-copy{max-width:55%}.bento-touch .bento-copy h3{font-size:clamp(26px,2.5vw,38px)}.bento-touch .bento-copy p{max-width:190px;font-size:12px}.bento-screen h3{font-size:clamp(27px,2.5vw,40px)}.bento-case h3{font-size:clamp(38px,4.4vw,66px)}.connections{padding:100px var(--gutter) 125px;text-align:center}.connections h2{font-size:clamp(38px,5.5vw,80px);font-weight:500;letter-spacing:-.055em;line-height:1.04;margin:22px 0}.connections-heading>p{color:var(--muted);font-size:16px;line-height:1.6;letter-spacing:-.015em;margin:0}.app-connections{max-width:1040px;display:grid;grid-template-columns:repeat(6,1fr);gap:24px;margin:65px auto 45px}.app-connection{display:flex;align-items:center;flex-direction:column;gap:18px;font-size:12px;color:var(--muted)}.app-icon{width:112px;height:112px;display:grid;place-items:center;border-radius:30px;background:#f5f5f7;box-shadow:0 9px 25px #00000004;animation:app-float 6s ease-in-out infinite;animation-delay:calc(var(--i,0)*-.7s)}.app-icon img{display:block;width:42px;height:42px;object-fit:contain}.app-connection:nth-child(2){--i:1}.app-connection:nth-child(3){--i:2}.app-connection:nth-child(4){--i:3}.app-connection:nth-child(5){--i:4}.app-connection:nth-child(6){--i:5}.connection-note{display:inline-flex;gap:8px;align-items:center;color:var(--muted);font-size:11px}.connection-dot{width:5px;height:5px;border-radius:50%;background:#0071e3}.motion-paused .app-icon{animation-play-state:paused}@keyframes app-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@media(max-width:1000px){.app-connections{gap:18px}.app-icon{width:96px;height:96px;border-radius:26px}.bento-touch .bento-copy h3{font-size:28px}.bento-voice .bento-copy{max-width:300px}.bento-case h3{font-size:48px}}
@media(max-width:600px){.section-description{font-size:14px;margin-top:20px}.bento-copy h3{font-size:36px}.bento-touch .bento-copy h3{font-size:30px}.bento-voice .bento-copy{max-width:290px}.bento-screen h3{font-size:29px}.bento-case h3{font-size:40px}.connections{padding:55px var(--gutter) 75px}.connections h2{font-size:43px}.connections-heading>p{font-size:13px}.app-connections{grid-template-columns:repeat(3,1fr);gap:30px 18px;margin:45px auto 32px}.app-icon{width:82px;height:82px;border-radius:23px}.app-icon img{width:34px;height:34px}.app-connection{font-size:11px;gap:13px}}

.teams-wordmark{font-size:21px;font-weight:700;letter-spacing:-.04em;color:#1d1d1f}

@media(max-width:600px){.bento-voice .bento-photo{top:36%;height:64%}}

/* Compact feature grid: six equal tiles, with images separate from copy. */
.bento-grid{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:320px;gap:18px;padding:20px;background:#f5f5f7;border-radius:36px}
.bento-grid>.feature-card{grid-column:auto;grid-row:auto;width:100%;height:320px;min-width:0;min-height:0;max-width:none;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff;color:var(--ink);border-radius:22px;text-align:center}
.bento-grid .bento-copy{position:relative;inset:auto;max-width:none;width:100%;padding:24px 30px;transform:none}
.bento-grid .bento-copy .eyebrow{margin:14px 0 0;font-size:8px;letter-spacing:.1em;color:var(--muted)}
.bento-grid .bento-copy h3{margin:12px 0 10px;font-size:clamp(25px,2.15vw,34px);font-weight:600;line-height:1.03;letter-spacing:-.045em}
.bento-grid .bento-copy p{font-size:12px;line-height:1.45;max-width:230px;margin:0 auto;color:var(--muted)}
.bento-grid .feature-icon{width:54px;height:54px;margin:0 auto 18px}
.bento-grid .bento-photo{position:absolute;inset:auto 0 0;width:100%;height:172px;object-fit:contain;object-position:center;z-index:0;transform:none;border-radius:0 0 22px 22px}
.bento-grid .feature-card::after{display:none}
.bento-grid .feature-card:hover{transform:translateY(-3px)}
.bento-grid .feature-card:hover .bento-photo{transform:none}
.bento-grid .bento-case,.bento-grid .bento-design{justify-content:flex-start}
.bento-grid .bento-case .bento-copy,.bento-grid .bento-design .bento-copy{padding:22px 24px 0}
.bento-grid .bento-case .feature-icon{display:none}
.bento-grid .bento-case .bento-copy h3{font-size:28px;margin:10px 0 8px}
.bento-grid .bento-case .bento-copy h3 br{display:none}
.bento-grid .bento-case .bento-copy p{font-size:11px}
.bento-grid .bento-design .bento-copy h3{font-size:28px}
.bento-grid .bento-design .bento-photo{height:190px}
.bento-grid .bento-screen{justify-content:flex-start}
.bento-grid .bento-screen .bento-copy{padding:22px 24px 0}
.bento-grid .bento-screen .feature-icon{display:none}
.bento-grid .bento-screen .bento-copy h3{font-size:27px;margin:12px 0 0}
.bento-grid .bento-stat{position:absolute;inset:auto 0 23px;min-width:0;font-size:112px;line-height:1;letter-spacing:-.06em}
.bento-grid .bento-stat>span{font-size:10px;margin-top:4px;letter-spacing:0}
.bento-grid .feature-card .expand{right:16px;bottom:16px;width:26px;height:26px;font-size:20px;background:#e8e8ed;color:var(--ink)}
.mini-app-glyph{--glyph-cell:24px;--glyph-gap:5px;--glyph-size:calc(var(--glyph-cell)*2 + var(--glyph-gap));display:grid;grid-template-columns:repeat(2,var(--glyph-cell));gap:var(--glyph-gap);width:max-content;margin:20px auto}
/* Each square is a window into one gradient spanning the complete glyph. */
.mini-app-glyph>span{width:var(--glyph-cell);height:var(--glyph-cell);border-radius:7px;background-image:linear-gradient(135deg,#f28c65 0%,#d77cc6 38%,#9c82dd 60%,#68b9d2 100%);background-size:var(--glyph-size) var(--glyph-size);background-repeat:no-repeat;background-position:0 0}
.mini-app-glyph>span:nth-child(2){background-position:100% 0}.mini-app-glyph>span:nth-child(3){background-position:0 100%}.mini-app-glyph>span:nth-child(4){background-position:100% 100%}
/* The preview is the current app renderer with read-only sample content. */
.app-section{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,130px);align-items:center;max-width:1240px;margin:80px auto 40px;padding:50px var(--gutter) 70px;scroll-margin-top:30px}
.app-story{max-width:460px}.app-story h2{font-size:clamp(42px,5.8vw,78px);font-weight:500;line-height:1.04;letter-spacing:-.055em;margin:23px 0}.app-story>p{font-size:17px;line-height:1.65;letter-spacing:-.015em;color:var(--muted);max-width:410px;margin:0}
.app-preview-tabs{display:flex;flex-wrap:wrap;gap:7px;margin:30px 0 18px}.app-preview-tabs button{padding:12px 17px;border:0;border-radius:24px;background:#f5f5f7;color:var(--muted);font-size:12px;font-weight:600;transition:background .2s,color .2s}.app-preview-tabs button[aria-pressed="true"]{background:var(--ink);color:#fff}.app-preview-tabs button:hover:not([aria-pressed="true"]){background:#e8e8ed}.preview-note{font-size:10px;color:var(--muted)}
.phone-shell{position:relative;width:min(100%,350px);aspect-ratio:390/844;justify-self:center;background:#1d1d1f;border-radius:52px;padding:9px;box-shadow:inset 0 0 0 2px #56565a,0 28px 65px #00000012;overflow:hidden}.phone-screen{height:100%;width:100%;overflow:hidden;border-radius:44px;background:#f5f5f7;position:relative}.phone-island{position:absolute;top:18px;left:50%;transform:translateX(-50%);width:84px;height:23px;border-radius:20px;background:#111;pointer-events:none}.phone-shell::after{content:"";position:absolute;width:105px;height:4px;background:#111;border-radius:4px;bottom:16px;left:50%;transform:translateX(-50%);pointer-events:none}
.watch-wear{position:absolute;left:5%;bottom:8%;z-index:2;display:inline-flex;gap:12px;align-items:center;padding:13px 18px;border:0;border-radius:30px;color:#fff;background:#ffffff26;backdrop-filter:blur(16px);font-size:12px;font-weight:600;transition:background .2s}.watch-wear:hover{background:#ffffff40}.watch-wear>span{font-size:11px}.film-trigger:hover .play-triangle{transform:scale(1.05)}
@media(min-width:1800px){.hero h1{font-size:min(20vw,420px)}}
@media(max-width:1000px){.bento-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:310px;gap:16px;padding:16px;border-radius:30px}.bento-grid>.feature-card{height:310px}.bento-grid .bento-copy h3{font-size:28px}.app-section{gap:45px}.app-story>p{font-size:15px}.phone-shell{width:min(100%,320px)}}
@media(max-width:600px){.hero h1{font-size:27.3vw}.bento-grid{grid-template-columns:1fr;grid-auto-rows:300px;gap:14px;padding:14px;margin-inline:16px;border-radius:30px}.bento-grid>.feature-card{height:300px}.bento-grid .bento-copy{padding:24px}.bento-grid .bento-copy h3{font-size:29px}.bento-grid .bento-copy p{font-size:12px}.bento-grid .bento-photo{height:158px}.bento-grid .bento-design .bento-photo{height:180px}.bento-grid .bento-case .bento-copy h3{font-size:27px}.bento-grid .bento-stat{font-size:107px;bottom:24px}.app-section{grid-template-columns:1fr;gap:45px;padding:25px 30px 60px;margin-top:45px}.app-story{max-width:420px}.app-story h2{font-size:48px}.app-story>p{font-size:15px}.app-preview-tabs{margin-top:26px}.phone-shell{width:min(100%,335px);border-radius:48px}.phone-screen{border-radius:40px}.watch-wear{left:26px;bottom:30px}}
@media(prefers-reduced-motion:reduce){.bento-grid .feature-card:hover{transform:none}}

/* A rounded, optically centred play mark shared by both films. */
.play-triangle{padding:0;flex:none;line-height:0}.play-triangle svg{display:block;width:20px;height:20px;overflow:visible;fill:currentColor;stroke:currentColor;stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round;transform:translateX(.4px)}.watch-wear{padding:0 16px 0 0;gap:9px}.watch-wear .round-icon{width:40px;height:40px;background:transparent}.watch-wear .play-triangle svg{width:17px;height:17px}@media(max-width:600px){.play-triangle svg{width:17px;height:17px}}

/* Product-first bento: the visual is the focal point within each compact tile. */
.bento-grid .bento-copy{padding:20px 24px}
.bento-grid .bento-copy .eyebrow{margin:0;font-size:8px;line-height:1.3}
.bento-grid .bento-copy h3{font-size:27px;margin:10px 0 8px;line-height:1.04}
.bento-grid .bento-copy p{font-size:11px;line-height:1.45;max-width:225px}
.bento-grid .feature-icon{width:120px;height:120px;margin:0 auto 13px}
.bento-grid .bento-voice .bento-copy,.bento-grid .bento-touch .bento-copy{max-width:none}
.bento-grid .bento-voice .bento-copy h3,.bento-grid .bento-touch .bento-copy h3{font-size:27px}
.bento-grid .bento-screen .bento-copy{padding:22px 20px 0}
.bento-grid .bento-screen .bento-copy h3{font-size:25px;margin:10px 0 0}
.bento-grid .bento-stat{inset:auto 0 15px;font-size:166px;line-height:.92;letter-spacing:-.055em;background-image:linear-gradient(150deg,#5433a8 12%,#a445dc 52%,#ef81b8 88%)}
.bento-grid .bento-stat>span{font-size:10px;line-height:1.4;margin-top:7px}
.bento-grid .bento-case .bento-copy,.bento-grid .bento-design .bento-copy{padding:21px 20px 0;z-index:1}
.bento-grid .bento-case .bento-copy h3,.bento-grid .bento-design .bento-copy h3{font-size:25px;margin:10px 0 7px}
.bento-grid .bento-case .bento-copy p{font-size:10px;line-height:1.4}
.bento-grid .bento-case .bento-photo{inset:auto 0 -14px;width:100%;height:290px;object-fit:contain;object-position:center;transform:none}
.bento-grid .bento-design .bento-photo{inset:108px 24px 48px;width:calc(100% - 48px);height:calc(100% - 156px);object-fit:contain;object-position:center;transform:none;border-radius:0}
.bento-grid .mini-app-glyph{--glyph-cell:50px;--glyph-gap:8px;margin:16px auto 15px}
.bento-grid .mini-app-glyph>span{border-radius:15px;opacity:1}
.bento-grid .bento-companion .bento-copy h3{font-size:27px}
@media(max-width:1000px){.bento-grid .feature-icon{width:112px;height:112px}.bento-grid .bento-stat{font-size:156px}.bento-grid .bento-case .bento-photo{height:280px}.bento-grid .bento-design .bento-photo{height:calc(100% - 156px)}.bento-grid .mini-app-glyph{--glyph-cell:47px}}
@media(max-width:600px){.bento-grid .bento-copy{padding:17px 24px}.bento-grid .feature-icon{width:108px;height:108px;margin-bottom:11px}.bento-grid .bento-copy h3,.bento-grid .bento-voice .bento-copy h3,.bento-grid .bento-touch .bento-copy h3,.bento-grid .bento-companion .bento-copy h3{font-size:26px}.bento-grid .bento-stat{font-size:150px;bottom:15px}.bento-grid .bento-case .bento-photo{height:268px;bottom:-13px}.bento-grid .bento-design .bento-photo{inset:104px 24px 44px;height:calc(100% - 148px)}.bento-grid .mini-app-glyph{margin-top:14px;margin-bottom:13px}}

/* A phone-shaped bezel around one complete, uniformly scaled app viewport.
   Native iPhone 17 Pro captures retain their exact 1206 × 2622 screen ratio. */
.phone-shell{width:min(100%,390px);aspect-ratio:auto;padding:9px;border-radius:54px;background:#101011;overflow:visible;box-shadow:inset 0 0 0 1px #76767a,inset 0 0 0 3px #343437,0 2px 3px #00000018,0 28px 65px #00000015}
.phone-screen{width:100%;height:auto;aspect-ratio:1206/2622;border-radius:45px;overflow:hidden;background:#f5f5f7;isolation:isolate}
.phone-screen img{display:block;width:100%;height:auto;aspect-ratio:1206/2622;object-fit:contain;background:#f5f5f7}
.phone-island{top:20px;width:98px;height:28px;border-radius:20px;background:#080809;z-index:2}
.phone-shell::before{content:"";position:absolute;right:-2px;top:26%;width:3px;height:64px;border-radius:0 2px 2px 0;background:linear-gradient(#636368,#303034 12%,#303034 88%,#636368);pointer-events:none}
.phone-shell::after{width:108px;height:4px;bottom:18px;background:#161617;z-index:2}
@media(max-width:1000px){.phone-shell{width:min(100%,365px)}}
@media(max-width:600px){.phone-shell{width:min(100%,365px);padding:9px;border-radius:49px}.phone-screen{border-radius:40px}.phone-island{top:18px;width:89px;height:25px}.phone-shell::after{bottom:16px}}