@font-face{font-family:SF;src:url('assets/fonts/SF-Pro-Display-Regular.otf')}@font-face{font-family:SF;src:url('assets/fonts/SF-Pro-Display-Semibold.otf');font-weight:600}*{box-sizing:border-box}body{margin:0;font-family:SF,Arial,sans-serif;color:#202024;background:#efefef}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #168bde;outline-offset:4px}.review{background:#151517;color:#fff;padding:18px 28px;display:flex;align-items:center;gap:24px}.review>span{font-size:11px;letter-spacing:1.4px;white-space:nowrap}.review i{color:#fbae17;margin:0 8px}.review nav{display:flex;gap:5px;flex:1;justify-content:center}.review button{border:0;background:transparent;color:#a5a5ab;padding:10px 14px;border-radius:30px;font-size:12px}.review button.active{background:#f3f1ec;color:#171717}.review small{font-size:9px;letter-spacing:1.6px;color:#b7b7bc}.retail{height:68px;background:#fbae17;display:flex;align-items:center;gap:45px;padding:10px 5%}.retail img{width:112px;max-height:47px;object-fit:contain}.retail>span{background:white;border-radius:6px;max-width:590px;flex:1;padding:12px 18px;font-size:13px;color:#777}.retail b{float:right}.retail>div{margin-left:auto;font-size:13px}.apple{height:58px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 5%;font-size:13px}.apple strong{font-size:18px}.apple a{color:#0066cc;text-decoration:none}.view{position:relative;min-height:660px;overflow:hidden}.view[hidden]{display:none}.eyebrow{font-size:11px;letter-spacing:3px;font-weight:600;margin:0 0 25px}h1{font-size:clamp(44px,5.3vw,78px);font-weight:600;line-height:1.02;letter-spacing:-3px;margin:0}em{font-style:normal}.sub{font-size:20px;line-height:1.5;color:#b2adb0;margin:24px 0 32px}.primary{border:0;border-radius:28px;padding:15px 24px;background:#fbae17;color:#171717;font-weight:600;font-size:14px}.primary span{margin-left:22px}.reveal{background:radial-gradient(ellipse at 75% 100%,#3b1724 0, #10090d 40%,#050505 72%);color:white}.hero-copy{position:relative;z-index:2;width:55%;padding:115px 0 120px 7%}.hero-copy em{color:#ccadb7}.hero-phone{position:absolute;right:1%;top:0;width:59%;height:94%;object-fit:contain;filter:drop-shadow(0 30px 45px #0008);animation:reveal 1.6s ease both}.hero-bottom{position:absolute;bottom:25px;left:7%;right:6%;display:flex;justify-content:space-between;align-items:center;font-size:9px;letter-spacing:2px;color:#b5a5ad}.hero-bottom button{background:transparent;border:0;color:#ddd;font-size:12px}.finish{background:radial-gradient(ellipse at 75% 70%,#873f55,#361d28 50%,#190f15);color:#fff;transition:background .5s}.finish-copy{position:relative;padding:95px 0 90px 7%;z-index:2;width:57%}.finish h1{font-size:64px}.finish em{color:#d8b9c3}.swatches{display:flex;gap:13px;margin:25px 0 15px}.swatch{width:37px;height:37px;border-radius:50%;border:4px solid transparent;box-shadow:0 0 0 1px #8888;background-clip:padding-box}.swatch[aria-pressed=true]{box-shadow:0 0 0 2px currentColor}.finish-name{font-size:16px;margin:20px 0 35px}.finish-name span{font-size:11px;color:#cabfc5;margin-left:30px}.finish-word{position:absolute;font-size:180px;letter-spacing:-8px;opacity:.07;bottom:65px;right:0;font-weight:600}#finish-phone{position:absolute;height:83%;width:44%;object-fit:contain;right:4%;top:5%;filter:drop-shadow(0 28px 30px #0005)}.poster{background:#eeece8;display:grid;grid-template-columns:1fr 1fr;padding:45px 9%;gap:80px}.poster-controls{padding:15px 0}.poster h1{font-size:65px}.poster h1 em{color:#845b69}.poster .sub{color:#6e696b;font-size:17px;margin:20px 0 26px}.poster label{display:block;font-size:12px;margin-bottom:9px}.poster input,.poster select{width:100%;max-width:310px;border:1px solid #d2cfca;border-radius:7px;padding:10px 12px;background:#f9f8f5;margin-bottom:19px;font-size:16px}.poster .swatches{margin:12px 0 20px}.poster .primary{display:block;margin:7px 0 14px}.poster small{color:#777;font-size:11px}.poster-stage{display:flex;align-items:center;justify-content:center}#poster-art{width:380px;aspect-ratio:4/5;background:radial-gradient(ellipse at 70% 65%,#763349,#160f18 75%);color:white;position:relative;box-shadow:0 25px 50px #1d09252b;overflow:hidden}.poster-top{display:flex;justify-content:space-between;padding:23px;font-size:8px;letter-spacing:1.5px}.poster-top span{font-size:6px;padding-top:2px}#poster-art h2{font-size:81px;line-height:.9;letter-spacing:-4px;margin:10px 26px;font-weight:600;position:relative;z-index:1}#poster-art h2 em{color:#d9b9c6}#poster-phone{position:absolute;height:72%;width:76%;object-fit:contain;right:-3%;top:20%;transform:rotate(-12deg)}.poster-bottom{position:absolute;bottom:24px;left:25px;right:25px;border-top:1px solid #ffffff40;padding-top:14px;display:flex;flex-direction:column;gap:7px}.poster-bottom strong{font-size:10px;letter-spacing:1.3px;overflow-wrap:anywhere}.poster-bottom span{font-size:9px;color:#d5c9d1}.benefits{background:#f5f5f7;padding:45px 7%}.benefit-intro{text-align:center}.benefit-intro .eyebrow{margin-bottom:15px}.benefits h1{font-size:48px;letter-spacing:-1.7px}.benefits em{color:#858589}.benefits .sub{font-size:16px;color:#747478;margin:15px 0 24px}.benefit-layout{display:grid;grid-template-columns:.8fr 1.2fr;max-width:980px;margin:auto;gap:55px;align-items:center}.benefit-device{text-align:center}.benefit-device>span{font-size:13px;font-weight:600}.benefit-device img{display:block;width:100%;height:290px;object-fit:contain;margin:10px 0}.benefit-device p{font-size:12px;color:#858589}.benefit-panel{background:white;border-radius:22px;padding:22px 28px;box-shadow:0 15px 50px #22222208}.benefit-tabs{display:flex;border-bottom:1px solid #eee;gap:16px}.benefit-tabs button{background:none;border:0;font-size:12px;padding:10px 0 16px;color:#777}.benefit-tabs button.active{color:#202024;border-bottom:2px solid #fbae17}#benefit-content{min-height:235px;padding-top:20px}#benefit-content .symbol{font-size:27px;color:#b78423}#benefit-content h2{font-size:31px;letter-spacing:-1px;margin:12px 0}#benefit-content p{font-size:15px;line-height:1.5;color:#747478;max-width:340px}#benefit-content details{font-size:12px;line-height:1.6;margin-top:20px}#benefit-content summary{cursor:pointer;color:#0066cc}.concept-note{font-size:10px;color:#888;border-top:1px solid #eee;padding-top:13px}footer{padding:15px 28px;font-size:12px;color:#68686e;background:#fff}@keyframes reveal{from{opacity:0;transform:translateY(70px) scale(1.08)}to{opacity:1;transform:none}}@media(min-width:1500px){.view{min-height:740px}}@media(max-width:850px){.review{flex-wrap:wrap;padding:12px}.review small{display:none}.review nav{justify-content:flex-start;overflow:auto}.review button{white-space:nowrap}.retail{gap:20px}.retail>div,.apple>span{display:none}.view{min-height:720px}.hero-copy,.finish-copy{width:100%;padding:45px 7%}.hero-copy h1,.finish h1{font-size:49px}.hero-phone{top:260px;width:90%;height:410px;right:-8%}.hero-copy .sub{margin:15px 0}.hero-bottom{font-size:8px;gap:14px}.hero-bottom>span:last-child{display:none}.finish-copy{padding-top:45px}.finish-copy .sub{margin:14px 0}.finish-copy .primary{position:relative;z-index:3}#finish-phone{height:350px;width:65%;top:340px;right:0}.finish-word{font-size:90px}.poster{grid-template-columns:1fr;padding:35px 7%;gap:25px}.poster-controls h1{font-size:52px}.poster-stage{padding-bottom:20px}.benefits{padding:35px 6%}.benefits h1{font-size:36px}.benefit-layout{grid-template-columns:1fr;gap:15px}.benefit-device img{height:220px}.benefit-panel{padding:20px}.benefit-tabs{gap:12px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}

.swatch{color:inherit}@media(max-width:850px){.review nav{flex-basis:100%;min-width:0}.review{gap:10px}.review nav button{flex-shrink:0}#finish-phone{top:375px;height:310px}}
.reveal{height:calc(100vh + 700px);overflow:visible;background:#080609}
.reveal-scene{position:sticky;top:0;height:100vh;min-height:660px;overflow:hidden;background:radial-gradient(ellipse at 75% 100%,#3b1724 0,#10090d 40%,#050505 72%)}
.reveal-scene::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 80% 70%,#923b58,transparent 65%);opacity:var(--reveal-glow,.2);pointer-events:none}
.reveal-scene .hero-phone{animation:none;transform-origin:70% 55%;will-change:transform}
.reveal-scene .hero-copy{will-change:transform}
.reveal-progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff15}
.reveal-progress span{display:block;height:100%;background:#fbae17;width:0}
@media(max-width:850px){.reveal-scene{min-height:720px}.reveal{height:calc(100vh + 800px)}}
@media(prefers-reduced-motion:reduce){.reveal{height:auto}.reveal-scene{position:relative}.reveal-scene .hero-phone,.reveal-scene .hero-copy{will-change:auto}.reveal-progress{display:none}}
.hero-film{position:absolute;right:9%;top:5%;height:87%;width:38%;object-fit:contain;background:#000}.hero-phone[hidden]{display:none}.reveal-scene,.reveal{background:#000}.reveal-scene::before{display:none}.spin-entry{display:block;margin:0 0 16px;padding:13px 22px;border:1px solid #ffffff70;border-radius:30px;color:white;background:#ffffff0d;font-size:14px}.spin-dialog{padding:0;border:0;border-radius:22px;width:min(1060px,95vw);max-width:95vw;height:90vh;max-height:950px;background:#fff;overflow:hidden}.spin-dialog::backdrop{background:#000b;backdrop-filter:blur(10px)}.spin-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 24px;border-bottom:1px solid #eee;height:75px}.spin-toolbar strong{font-size:20px}.spin-toolbar label{font-size:12px}.spin-toolbar select{padding:8px;border:1px solid #ddd;border-radius:8px;margin-left:8px;background:#fff;font-size:14px}.spin-toolbar button{border:0;background:#eee;border-radius:50%;width:35px;height:35px}.spin-dialog iframe{display:block;width:100%;height:calc(100% - 120px);border:0}.spin-tip{text-align:center;font-size:11px;color:#777;margin:12px}.finish-copy .primary{margin-top:0}@media(max-width:850px){.hero-film{top:300px;height:380px;width:70%;right:0}.spin-toolbar{padding:10px;gap:6px;height:100px;flex-wrap:wrap}.spin-toolbar strong{font-size:16px}.spin-dialog{width:100vw;max-width:100vw;height:95vh;border-radius:10px}.spin-dialog iframe{height:calc(100% - 155px)}.spin-tip{padding:0 12px;line-height:1.5}.finish{min-height:810px}#finish-phone{top:460px}.spin-entry{margin-bottom:12px}}
/* Landing-page review: give the finish name its own unobstructed row. */
.finish{display:grid;grid-template-columns:1.1fr 1fr;grid-template-rows:minmax(0,440px) auto;column-gap:40px;row-gap:14px;padding:55px 7%;min-height:660px;align-content:center}
.finish-copy{grid-column:1;grid-row:1 / 3;width:100%;padding:0;align-self:center}
#finish-phone{position:static;grid-column:2;grid-row:1;width:100%;height:100%;max-height:440px;object-fit:contain}
.finish-word{position:static;grid-column:2;grid-row:2;font-size:clamp(44px,6.5vw,90px);line-height:1.05;letter-spacing:-3px;text-align:center;opacity:.65;align-self:start;overflow-wrap:anywhere}
@media(max-width:850px){.finish{grid-template-columns:1fr;grid-template-rows:auto 310px auto;padding:40px 7%;row-gap:24px;min-height:0}.finish-copy{grid-column:1;grid-row:1}.finish #finish-phone{grid-column:1;grid-row:2;width:100%;height:310px}.finish-word{grid-column:1;grid-row:3;font-size:58px;letter-spacing:-2px}.finish .spin-entry{margin-bottom:0}}

@media(min-width:851px){.finish{grid-template-rows:440px 90px}.finish #finish-phone{height:440px}.finish-copy{align-self:center}}
/* Option 1: static campaign art and full-viewport product exploration. */
.finish{background:#000!important;grid-template-rows:510px auto}
.finish h1{font-size:clamp(32px,3.5vw,62px);letter-spacing:-1.8px;line-height:1.07}
.finish .sub{color:#d2d2d7;font-size:25px}
.finish-art{position:relative;grid-column:2;grid-row:1;height:510px;aspect-ratio:420/760;justify-self:center;overflow:hidden}
.finish .finish-art #finish-phone{position:absolute;max-height:none;max-width:none;width:342.857%;height:122.368%;left:-197.619%;top:-7.895%;object-fit:fill;filter:none}
.spin-dialog{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0;overflow:hidden}
.spin-dialog iframe{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.spin-toolbar{position:absolute;top:18px;left:24px;right:24px;height:auto;border:0;padding:0;z-index:3;justify-content:flex-start;pointer-events:none}
.spin-toolbar>*{pointer-events:auto}.spin-toolbar strong,.spin-toolbar label{background:#fffffff0;border-radius:10px;padding:8px}
.spin-toolbar #spin-close{margin-left:auto}.spin-tip{position:absolute;left:24px;bottom:16px;margin:0;z-index:3;pointer-events:none;background:#fffffff0;padding:6px;border-radius:8px}
@media(max-width:850px){.finish{grid-template-rows:auto 410px auto}.finish-art{grid-column:1;grid-row:2;height:410px}.finish .finish-art #finish-phone{height:122.368%;width:342.857%;top:-7.895%;left:-197.619%}.spin-toolbar{top:6px;left:8px;right:8px;flex-wrap:nowrap}.spin-toolbar strong{display:none}.spin-toolbar label{padding:0;background:none}.spin-toolbar select{padding:5px;margin-left:5px}.spin-tip{display:none}}

@media(min-width:851px){.spin-tip{left:260px}}
.finish{grid-template-rows:510px;min-height:620px}.finish-copy{grid-row:1}.finish-art{aspect-ratio:9/16}.finish-art #finish-video{display:block;width:100%;height:100%;object-fit:contain}.finish-copy .spin-entry{margin-top:30px}@media(max-width:850px){.finish{grid-template-rows:auto 410px;min-height:0}.finish-copy{grid-row:1}.finish-art{grid-row:2}}

@media(max-width:1100px){.spin-toolbar{top:8px}.spin-toolbar strong{display:none}.spin-toolbar label{padding:0}.spin-tip{bottom:0;padding:2px 6px}}

/* Model selection remains visible as two direct buttons. */
.spin-toolbar .spin-model-tabs{display:flex;gap:4px;padding:4px;background:#ededf0;border-radius:30px;pointer-events:auto}
.spin-toolbar .spin-model-tabs button{border:0;border-radius:24px;padding:10px 16px;background:transparent;color:#1d1d1f;font:inherit;font-size:13px;cursor:pointer}
.spin-toolbar .spin-model-tabs button[aria-pressed="true"]{background:#fff;box-shadow:0 1px 5px #0002}
.spin-toolbar .spin-model-tabs button:focus-visible{outline:2px solid #0071e3;outline-offset:2px}
@media(max-width:600px){.spin-toolbar{left:10px;right:10px}.spin-toolbar .spin-model-tabs button{padding:9px 12px;font-size:12px}}

.spin-toolbar .spin-model-tabs button{width:auto;height:auto;flex:none;white-space:nowrap;margin:0}.spin-toolbar .spin-model-tabs{width:auto;height:auto;flex:none}

/* Centre the controls on the product axis. */
.spin-toolbar .spin-model-tabs{position:absolute;left:50%;top:0;transform:translateX(-50%)}
.spin-toolbar strong{display:none}
.spin-dialog .spin-tip{display:flex;align-items:center;gap:6px;width:max-content;left:50%;bottom:14px;transform:translateX(-50%);padding:6px 11px;border-radius:99px;background:#e9e9ed;color:#303034;font-size:11px;line-height:1.2}
.spin-tip svg{flex:none}

.spin-dialog .spin-tip{bottom:102px}
