@font-face{font-family:Sarabun;src:url('assets/sarabun-400.woff2') format('woff2');font-weight:400;font-display:swap}@font-face{font-family:Sarabun;src:url('assets/sarabun-500.woff2') format('woff2');font-weight:500;font-display:swap}@font-face{font-family:Sarabun;src:url('assets/sarabun-700.woff2') format('woff2');font-weight:700;font-display:swap}
:root{--navy:#001849;--teal:#008e82;--paper:#f5f1e9;--ink:#172538;--muted:#536276;--header:84px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);font-family:Sarabun,Arial,sans-serif;color:var(--navy)}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:rgba(0,142,130,.22)}button:focus-visible,a:focus-visible{outline:3px solid #24b9a9;outline-offset:5px}button{color:inherit}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2{font-weight:700;letter-spacing:-.048em;line-height:1.04}h2 span{color:var(--teal)}.eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}.skip{position:fixed;top:-100px;left:20px;background:white;color:var(--navy);padding:16px;z-index:100}.skip:focus{top:100px}.experience{height:1320svh;position:relative}.scene-anchor{position:absolute;left:0;pointer-events:none}.story-stage{position:sticky;top:0;height:100svh;overflow:hidden;isolation:isolate;perspective:1600px;background:var(--navy)}.desk-surface{position:absolute;inset:-12%;background-color:#b9a98f;background-image:repeating-linear-gradient(2deg,transparent 0 2px,#4034230a 2px 3px,transparent 3px 7px),repeating-linear-gradient(0deg,#efe4cd18 0 1px,transparent 2px 14px),linear-gradient(105deg,#ad9c83,#d1c3ad 47%,#a9977e);transform:rotate(-3deg) scale(1.05)}.desk-surface:after{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse at 30% 10%,transparent 30%,#291a1350 100%)}.desk-mat{position:absolute;width:91%;height:89%;left:4%;top:7%;border-radius:55px;background-color:var(--navy);background-image:radial-gradient(#d8e6ff12 .65px,transparent .8px),linear-gradient(135deg,#ffffff0c,transparent 42%,#0009278c);background-size:3px 3px,100% 100%;box-shadow:0 22px 48px #25170f55,0 1px 2px #ffffff58 inset,0 -3px 3px #0000007a inset}.desk-mat:after{content:'';position:absolute;inset:14px;border:1px dashed #8190ad4a;border-radius:44px}.postcard{position:absolute;top:50%;left:50%;width:100vw;height:100svh;background:var(--paper);transform:translate(-50%,-50%);z-index:8;will-change:transform,width,height;box-shadow:0 24px 38px #0000;overflow:visible;padding:0;backface-visibility:hidden}.picture-window{position:relative;width:100%;height:100%;overflow:hidden;background:var(--navy)}.picture-window img,.picture-window video{position:absolute;inset:0;height:100%;width:100%;object-fit:cover}.picture-window video{z-index:2}.fragments{position:absolute;inset:0;z-index:6;pointer-events:none}.fragment{position:absolute;left:50%;top:50%;opacity:0;backface-visibility:hidden;will-change:transform,opacity;box-shadow:9px 18px 27px #0005}.scene-copy{position:absolute;z-index:12;opacity:0;pointer-events:none;color:white}.scene-copy .eyebrow{color:#d2e6e4;margin-bottom:24px}.scene-copy h2 span{color:#50c3b7}.scene-copy p:not(.eyebrow){font-size:18px;line-height:1.6;color:#e2e9ec;margin-top:26px}.intro-copy{left:7%;top:37%;width:85%;opacity:0;transition:opacity .25s linear}.intro-copy h1{font-size:clamp(44px,5.2vw,88px);letter-spacing:-.045em}.intro-copy h1 span{color:white}.intro-copy p:not(.eyebrow){font-size:20px;line-height:1.6}.light-link{display:inline-flex;align-items:center;gap:40px;border-bottom:1px solid #bed8d6;padding:0 0 10px;margin-top:30px;font-size:14px;color:white;pointer-events:auto}.mess-copy,.founder-copy{left:50%;top:50%;transform:translate(-50%,-45%);width:560px;text-align:center}.mess-copy h2,.founder-copy h2{font-size:clamp(32px,3.65vw,61px)}.mess-copy p:not(.eyebrow),.founder-copy p:not(.eyebrow){font-size:17px;max-width:510px;margin:26px auto 0}.gather-copy{left:7%;top:25%;width:480px}.gather-copy h2{font-size:clamp(40px,4.1vw,70px)}.tablet-wrap{position:absolute;z-index:10;left:66%;top:54%;width:62vw;max-width:1060px;opacity:0;transform:translate(-50%,-50%) scale(.3);will-change:transform,opacity}.tablet{position:relative;border-radius:39px;padding:22px 30px;background:linear-gradient(110deg,#263643,#050c12 30%,#15242f 95%);box-shadow:0 0 0 2px #66727a,0 0 0 4px #ced4d2,2px 7px 0 5px #53636d,18px 30px 20px #0004,34px 62px 78px #0006}.tablet-glass{overflow:hidden;position:relative;border-radius:16px;background:#ecf3f4;aspect-ratio:1265/712}.tablet-glass img{width:100%;height:100%;object-fit:cover;object-position:top;transition:opacity .2s}.glass-reflection{position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,#ffffff1a,transparent 38%,transparent 75%,#b4d3ff0b)}.tablet-camera{position:absolute;left:12px;top:49%;width:5px;height:5px;border-radius:100%;background:#203550;box-shadow:0 0 0 2px #090c10}.tablet-home{position:absolute;bottom:8px;left:45%;width:10%;height:3px;border-radius:3px;background:#7382897d}.capture-note{font-size:10px;letter-spacing:.025em;color:#b3c6d3;text-align:center;margin-top:27px}.expand-screen{border:0;background:transparent;display:block;margin:8px auto 0;color:white;font-size:12px;padding:7px 13px}.tour-copy{left:5%;top:37%;width:29%;max-width:420px}.tour-copy h2{font-size:clamp(32px,3.6vw,59px)}.tour-copy p:not(.eyebrow){font-size:17px;max-width:330px;line-height:1.6}.tour-nav{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);z-index:20;display:flex;justify-content:center;gap:4px;opacity:0;pointer-events:none;max-width:94%;padding:6px;background:#001437bd;border:1px solid #ffffff25;border-radius:11px;box-shadow:0 12px 28px #0002}.tour-nav button{background:transparent;border:0;color:#bac9d1;border-radius:6px;padding:12px 13px;white-space:nowrap;font-size:12px}.tour-nav button[aria-pressed=true]{background:var(--teal);color:white}.scene-progress{position:absolute;left:5%;right:5%;bottom:25px;z-index:16;display:flex;align-items:center;gap:22px;color:#d8e1e8;font-size:10px;text-transform:uppercase;letter-spacing:.13em}.scene-progress>div{flex:1;height:1px;background:#c1d8e64d}.scene-progress i{display:block;height:2px;transform-origin:left;background:#59caba;width:100%;transform:scaleX(0)}.scroll-hint{white-space:nowrap}.section-pad{padding:110px 6vw}.field-section{position:relative;min-height:630px;background:var(--navy);overflow:hidden}.field-section>img{position:absolute;width:65%;height:100%;object-fit:cover;right:0;object-position:65% center}.field-section>div{position:relative;z-index:2;display:flex;flex-direction:column;justify-content:center;min-height:630px;padding:100px 6vw;width:58%;color:white;transform:translate(-18px,18px)}.field-section h2{font-size:clamp(39px,4vw,65px);margin-top:25px}.field-section h2 span{color:#50c3b7}.field-section p:not(.eyebrow){margin-top:27px;max-width:385px;font-size:17px;line-height:1.65;color:#e0e9eb}.closing{text-align:center;padding-top:130px;padding-bottom:120px}.closing h2{font-size:clamp(42px,5.3vw,85px);margin-top:30px}.button{display:inline-flex;margin-top:38px;gap:55px;padding:19px 28px;background:var(--teal);color:white}footer{background:var(--navy);color:white;padding:48px 6vw 78px;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:25px}footer div{display:flex;gap:23px;font-size:13px}footer>p{width:100%;font-size:10px;letter-spacing:.1em;color:#b8c5d1;text-transform:uppercase}.motion-toggle{position:fixed;left:20px;bottom:18px;z-index:60;background:var(--paper);color:var(--navy);font-size:10px;border:1px solid #00184925;box-shadow:0 3px 10px #0001;padding:8px 12px;border-radius:5px}.experience~.motion-toggle{bottom:10px}dialog{padding:24px;border:0;max-width:95vw;width:1380px;background:var(--paper);color:var(--navy);border-radius:12px}dialog::backdrop{background:#001027e6}.dialog-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px}.dialog-header h2{font-size:24px}.dialog-header button{padding:10px 18px;background:var(--navy);color:white;border:0}dialog>img{max-height:75vh;margin:auto}dialog>p{text-align:center;font-size:12px;margin-top:14px;color:var(--muted)}.simple-story{display:none}.simple-hero{position:relative;padding-top:var(--header);color:white;min-height:700px}.simple-hero>img{position:absolute;inset:var(--header) 0 0;width:100%;height:calc(100% - var(--header));object-fit:cover;filter:brightness(.55)}.simple-hero>div{position:relative;padding:160px 7vw 110px}.simple-hero h1{font-size:clamp(38px,6vw,80px);margin-top:30px}.simple-hero p{margin-top:25px;font-size:18px}.simple-text{padding:80px 7vw;max-width:1300px;margin:auto}.simple-text h2{font-size:clamp(35px,4vw,60px);max-width:800px;margin-top:24px}.simple-text>p:not(.eyebrow){max-width:800px;font-size:18px;line-height:1.7;margin-top:26px}#simple-screens{margin-top:45px}#simple-screens details{border-bottom:1px solid #b9c7c4;padding:20px 0}#simple-screens summary{font-size:23px;font-weight:700;cursor:pointer}#simple-screens p{margin:16px 0;line-height:1.6}#simple-screens img{border:12px solid var(--navy);border-radius:18px;max-width:960px;width:100%}.reduced .experience{display:none}.reduced .simple-story{display:block}.reduced{scroll-behavior:auto}.reduced *{animation:none!important;transition:none!important}
@media(min-width:1700px){.fragment{zoom:1.2}.mess-copy,.founder-copy{width:650px}.scene-copy p:not(.eyebrow){font-size:20px}.tour-nav button{font-size:14px}.intro-copy{top:38%}}@media(max-width:1050px){.tablet-wrap{width:64vw;left:66%}.tour-copy{left:4%;width:29%}.tour-copy h2{font-size:35px}.tour-copy p:not(.eyebrow){font-size:14px}.fragment{zoom:.85}.mess-copy,.founder-copy{width:460px}.tour-nav{gap:1px}.tour-nav button{font-size:11px;padding:12px 9px}}
@media(max-width:720px){:root{--header:70px}.intro-copy{left:6%;top:31%;width:88%}.intro-copy h1{font-size:clamp(34px,9.2vw,58px);line-height:1.06}.intro-copy .eyebrow{font-size:9px;line-height:1.8;max-width:270px}.intro-copy p:not(.eyebrow){font-size:17px;margin-top:23px}.light-link{font-size:12px;margin-top:24px;gap:23px}.desk-mat{width:100%;left:0;border-radius:20px}.desk-mat:after{border-radius:15px;inset:9px}.fragment{zoom:.65}.notebook{width:250px}.small-note,.white-note,.condition-note{display:none}.mess-copy,.founder-copy{width:82%;left:50%;top:49%;transform:translate(-50%,-50%)}.scene-copy .eyebrow{font-size:9px;margin-bottom:16px}.mess-copy h2,.founder-copy h2{font-size:clamp(30px,8vw,42px)}.mess-copy p:not(.eyebrow),.founder-copy p:not(.eyebrow){font-size:14px;line-height:1.6;margin-top:20px}.gather-copy{left:7%;top:20%;width:85%}.gather-copy h2{font-size:39px}.tablet-wrap{left:50%;top:58%;width:90vw;max-width:none}.tablet{padding:12px 17px;border-radius:23px;box-shadow:0 0 0 1px #73818a,0 0 0 2px #c7d0d0,2px 5px 0 2px #596874,7px 15px 19px #0005,13px 25px 38px #0005}.tablet-glass{border-radius:9px}.tablet-camera{left:6px;width:3px;height:3px}.tablet-home{bottom:5px;height:2px}.tour-copy{left:7%;top:16%;width:86%;max-width:none}.tour-copy h2{font-size:34px;max-width:380px}.tour-copy h2 br{display:none}.tour-copy p:not(.eyebrow){font-size:14px;line-height:1.5;max-width:380px;margin-top:13px}.tour-nav{bottom:10%;width:90%;max-width:none;display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:5px}.tour-nav button{white-space:normal;font-size:9px;line-height:1.3;min-height:34px;padding:7px 4px}.capture-note{font-size:8px;margin-top:19px}.expand-screen{font-size:10px;margin-top:3px;padding:4px}.scene-progress{left:6%;right:6%;bottom:63px;font-size:8px;gap:12px}.scroll-hint{display:none}.section-pad{padding:65px 6vw}.field-section{min-height:690px}.field-section>img{width:100%;height:100%;object-position:62% center}.field-section>div{width:100%;padding:280px 7vw 65px;transform:none}.field-section h2{font-size:40px}.field-section p:not(.eyebrow){font-size:15px;max-width:310px}.closing{padding-top:75px;padding-bottom:75px}.closing h2{font-size:42px}.button{font-size:14px;padding:17px 23px;gap:25px}footer{display:block;padding:40px 7vw 80px}footer img{width:205px}footer div{margin:35px 0;font-size:11px;gap:16px}dialog{padding:15px}.dialog-header h2{font-size:18px}.dialog-header button{font-size:12px}.motion-toggle{left:12px;bottom:12px;font-size:9px}.simple-hero{min-height:630px}.simple-hero>div{padding:160px 7vw 70px}.simple-text{padding:60px 7vw}.simple-text h2{font-size:36px}.simple-text>p:not(.eyebrow){font-size:16px}}

/* Refinements from the first rendered scene review. */
.desk-surface{inset:-2%;transform:rotate(-3deg) scale(1.02)}.desk-mat{width:91%;height:87%;left:5%;top:7%}.scene-progress{left:180px}.gather-copy{left:calc(7% + 24px);width:26%;top:18%}.gather-copy h2{font-size:clamp(34px,3.45vw,58px)}@media(max-width:720px){.desk-surface{inset:-4%}.desk-mat{width:96%;left:2%;height:88%}.scene-progress{left:6%}.gather-copy{left:7%;width:86%;top:17%}.gather-copy h2{font-size:37px}}


/* Frame the recorded app-content detail within the tablet. */
.tablet-glass img{width:150%;height:150%;max-width:none;object-fit:cover;object-position:left top}


.fragment{zoom:1!important}@media(max-width:720px){.mess-copy,.founder-copy{width:86%;top:50%}.mess-copy h2,.founder-copy h2{font-size:31px}.mess-copy p:not(.eyebrow),.founder-copy p:not(.eyebrow){font-size:14px}}

/* Keep supporting controls readable at phone widths without changing the approved composition. */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.motion-toggle{font-size:11px}@media(max-width:720px){.intro-copy .eyebrow,.scene-copy .eyebrow,.founder-copy .eyebrow,.capture-note,.tour-nav button,.scene-progress,.replay-aerial,.restart-story{font-size:11px}}


.replay-aerial{position:absolute;z-index:20;right:5%;bottom:64px;border:1px solid #ffffff66;background:#00184955;color:white;font-size:11px;padding:8px 12px;border-radius:4px}@media(max-width:720px){.replay-aerial{bottom:95px;right:7%;font-size:9px}}


/* September 6: a stationary desk, revealed by one shared camera pullback. */
.desk-world{position:absolute;inset:0;transform-origin:50% 50%;will-change:transform}
.desk-world .desk-surface{inset:-10%;transform:none}
.desk-world .desk-mat{left:12%;top:14%;width:75%;height:75%;border-radius:28px}
.postcard{will-change:transform;box-shadow:3px 8px 18px #0006;background:#eeece6}
.picture-window{height:100%;width:100%}
.prop{height:auto;min-height:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none;opacity:1}
.prop img{width:100%;height:auto;max-width:none;filter:drop-shadow(4px 9px 5px #0005)}
.prop-legal-pad,.prop-todo{z-index:1}.prop-phone,.prop-pen{z-index:4}.prop-pen img{filter:drop-shadow(3px 4px 2px #0007)}
.fragments{z-index:6}
@media(max-width:720px){.desk-world .desk-mat{left:12%;top:14%;width:75%;height:75%;border-radius:18px}.prop{display:block}}

/* Photographic desk surface; the photo and props still share its camera. */
.desk-world .desk-surface{inset:-2%;bottom:calc(-2% + 2% * var(--desk-frame,0));background:#001849 url("assets/desk-props/desk-surface.webp") center calc(50% + 50% * var(--desk-frame,0))/cover no-repeat}
.desk-world .desk-surface:after,.desk-world .desk-mat{display:none}
@media(min-width:721px){.tour-copy{left:9%;width:23%}}

/* Story v3: same artwork, tighter editorial hierarchy and a distinct product reveal. */
.intro-copy{top:32%;width:88%}.intro-copy h1{font-size:clamp(48px,5.8vw,98px);line-height:1.02;max-width:1250px;text-wrap:balance}.intro-copy .eyebrow{letter-spacing:.14em;font-size:11px}.intro-copy p:not(.eyebrow){max-width:590px;font-size:19px;line-height:1.55}.intro-copy .light-link{margin-top:27px}
.mess-copy{width:min(610px,44vw)}.mess-copy h2{font-size:clamp(36px,3.3vw,57px);line-height:1.08;text-wrap:balance}.mess-copy p:not(.eyebrow){font-size:16px;max-width:455px;line-height:1.65}
.founder-copy{left:calc(50% + clamp(32px,4vw,54px));width:min(640px,45vw);transform:translate(-50%,-49%)}.experience-mark{font-weight:700;font-size:clamp(80px,8.2vw,138px)!important;line-height:.85!important;letter-spacing:-.07em;color:#fff!important;margin:0 auto 23px!important}.experience-mark span{color:#50c3b7}.founder-copy .eyebrow{margin-bottom:20px}.founder-copy h2{font-size:clamp(30px,2.65vw,45px);line-height:1.1;text-wrap:balance}.founder-copy p:not(.eyebrow):not(.experience-mark){font-size:16px;line-height:1.65;max-width:430px;margin-top:20px}

.tour-copy{left:calc(6% + 1in);width:27%;top:35%}.tour-copy h2{font-size:clamp(34px,3.5vw,59px);line-height:1.05}.tour-copy .eyebrow{color:#66c9bd}.tour-copy p:not(.eyebrow){font-size:17px;line-height:1.6}.tablet{box-shadow:0 0 0 1px #66727a,0 0 0 3px #bccbcf,2px 7px 0 4px #445562,12px 28px 45px #0005,24px 65px 90px #0007}
/* Center the visible, left-aligned copy groups in the desk-pad space without
   changing any typography, wrapping, or tablet geometry. */
@media(min-width:1001px){
 .gather-copy{transform:translateX(118px)}
 /* Keep the product copy in its own column at every desktop width.
    The tablet repositions responsively, so a fixed rightward nudge can make
    the copy cross into its glass on narrower desktop viewports. */
 .tour-copy{transform:none;width:min(22%,calc(30% - 1in))}
}
.tablet-glass img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:top left}
.capture-note{color:#d0dfe3;font-size:11px}.tour-nav{border-radius:28px;padding:7px;background:#001437e8;border-color:#5ba49e66}.tour-nav button{border-radius:21px;padding:12px 15px}.expand-screen{border-bottom:1px solid #ffffff40;border-radius:0;padding:7px 0}
.restart-story{position:absolute;right:5%;top:calc(var(--header) + 22px);z-index:22;opacity:0;pointer-events:none;border:1px solid #ffffff45;color:#fff;background:#001849c9;border-radius:20px;padding:9px 15px;font-size:11px;backdrop-filter:blur(8px)}
.product-deep{background:linear-gradient(145deg,#f5f1e9,#fffdf8)}
@media(max-width:720px){.intro-copy{top:29%;width:88%}.intro-copy h1{font-size:clamp(37px,10vw,60px)}.intro-copy .eyebrow{font-size:9px;max-width:290px}.intro-copy p:not(.eyebrow){font-size:16px;max-width:310px}.mess-copy{width:83%}.mess-copy h2{font-size:30px}.mess-copy p:not(.eyebrow){font-size:13px;line-height:1.55;max-width:280px}.founder-copy{left:50%;width:82%;top:49%}.experience-mark{font-size:72px!important;margin-bottom:18px!important}.founder-copy .eyebrow{font-size:8px;margin-bottom:14px}.founder-copy h2{font-size:27px}.founder-copy p:not(.eyebrow):not(.experience-mark){font-size:12px;line-height:1.55;margin-top:14px;max-width:290px}.tour-copy{left:7%;top:18%;width:86%}.tour-copy h2{font-size:32px}.tour-copy p:not(.eyebrow){font-size:14px;line-height:1.5}.tour-nav{border-radius:15px;padding:6px;bottom:10%}.tour-nav button{font-size:9px;padding:8px 5px;border-radius:8px}.capture-note{font-size:8px}.restart-story{top:calc(var(--header) + 14px);right:6%;font-size:10px;padding:7px 11px}}

/* The same decoded video frame becomes the photograph; no crossfade to another instant. */
/* The owner's borderless print reference: slight paper bow, close shadow and restrained sheen. */
.postcard{--print:0;background:transparent;box-shadow:none;filter:drop-shadow(.2px .9px .5px rgb(0 0 0 / calc(.46 * var(--print)))) drop-shadow(2px 5px 4px rgb(0 0 0 / calc(.27 * var(--print))))}
.postcard .picture-window{clip-path:url(#photo-paper-cut);background:transparent}
.print-sheen{position:absolute;inset:0;z-index:4;opacity:var(--print);pointer-events:none;background:linear-gradient(109deg,#fff6 0%,#ffffff17 11%,#ffffff04 25%,transparent 49%,#ffffff08 82%,#ffffff12 100%);box-shadow:inset 0 .55px .6px #fff7,inset 0 -.8px 1px #0002}
.prop-rfp{z-index:2}
.prop-vendor-quote{filter:drop-shadow(4px 9px 5px #0005)}
.prop-vendor-quote img{filter:none;clip-path:polygon(5.6% 6.2%,94.4% 6.2%,94.4% 84%,94% 89%,92.5% 90.9%,85% 91.4%,5.6% 91.4%)}


/* Show the entire selected app section; never enlarge/crop away its content. */
.tablet-glass img{object-fit:contain;object-position:center;background:#f6fafc}

/* Preserve generated paper pixels; clip opaque extraction backgrounds at their silhouette. */
.prop-todo,.prop-roadwork,.prop-legal-pad{filter:drop-shadow(4px 9px 5px #0005)}
.prop-legal-pad img{filter:none}
.prop-todo img{filter:none;clip-path:polygon(5.1% 4%,94.7% 4%,95.3% 5%,96.2% 94.7%,94.8% 96.3%,5.6% 96.3%,4.1% 94.5%,4.3% 10%)}
.prop-roadwork img{filter:none;clip-path:polygon(9.7% 5%,90.4% 4.5%,91.6% 5.5%,92.1% 8%,92.4% 60%,91.7% 64.5%,77.7% 88.3%,74% 90.3%,67% 91.1%,12% 91.1%,9.4% 89%,9.4% 7%)}
.prop-lifestyle{z-index:3}
@media(min-width:721px) and (max-width:1440px){.mess-copy p:not(.eyebrow){font-size:14px;max-width:340px}}

/* Additional lifestyle inventory ink; preserve its photographed paper contour. */
.prop-lifestyle{filter:drop-shadow(4px 9px 5px #0005)}
.prop-lifestyle img{filter:none;clip-path:polygon(10.5% 3.6%,16% 3.8%,40% 5%,70% 5.7%,92.1% 6.2%,93.5% 44%,94.7% 84%,94.6% 91%,94% 93.5%,92.4% 94.9%,75% 94.6%,39% 94.2%,7.1% 93.3%,6.6% 92.7%,8.5% 50%,9.7% 13%,10% 5%)}

/* Settle the single desk photograph on its real lower edge for the tablet.
   Leave the early shared-camera composition intact; no second crop or overlay. */
.story-stage{--desk-frame:0;--desk-edge-space:max(64px,5vw)}
.scene-progress{bottom:calc(25px + (var(--desk-edge-space) - 25px) * var(--desk-frame))}
.tour-nav{bottom:calc(9% + (max(9svh,var(--desk-edge-space) + 35px) - 9svh) * var(--desk-frame))}
/* Keep the approved wide-screen copy position; reserve separate columns on laptops. */
@media(min-width:721px) and (max-width:1699px){
 .tablet-wrap{width:min(55vw,calc((100svh - var(--header) - 320px) * 1.777))}
 .tour-copy{width:min(27%,calc(35% - 1in));top:max(calc(var(--header) + 36px),25%);transform:translateX(18px)}
 .tour-copy p:not(.eyebrow){font-size:clamp(15px,1.15vw,17px)}
}
@media(min-width:1001px) and (max-width:1279px){.tour-copy{transform:none}}
/* The shared navigation needs the compact menu through portrait-tablet widths. */
@media(min-width:721px) and (max-width:1023px){
 #sales-header nav[aria-label="Primary navigation"]{display:none!important}
 #sales-header details{display:block!important}
 #sales-header .flex.shrink-0.items-center.gap-2>div{display:none!important}
}
/* Portrait tablets need the same clear reading order as the phone layout. */
@media(min-width:721px) and (max-width:1000px) and (orientation:portrait){
 .tablet-wrap{width:78vw}
 .tour-copy{left:8%;width:84%;max-width:none;top:calc(var(--header) + 32px)}
 .tour-copy h2{font-size:38px}
 .tour-copy p:not(.eyebrow){font-size:16px;line-height:1.5;max-width:580px;margin-top:20px}
}
@media(max-width:720px){
 .tour-copy{top:calc(var(--header) + 26px)}
 .tour-copy h2 span:before{content:"\00a0"}
 .scene-progress{bottom:calc(63px + (var(--desk-edge-space) - 63px) * var(--desk-frame))}
 .tour-nav{bottom:calc(10% + (max(10svh,var(--desk-edge-space) + 25px) - 10svh) * var(--desk-frame))}
}
@media(max-width:360px){
 .tablet-wrap{width:76vw}
 .tour-copy{left:6%;width:88%;top:calc(var(--header) + 16px)}
 .tour-copy .eyebrow{margin-bottom:12px}
 .tour-copy h2{font-size:28px}
 .tour-copy p:not(.eyebrow){font-size:13px;line-height:1.4;margin-top:12px}
}
.site-footer{display:block;padding:0;background:#001849;border-top:1px solid #ffffff1a}.site-footer .site-footer-main{max-width:1408px;margin:0 auto;display:grid;grid-template-columns:1.15fr 1fr;gap:48px;padding:80px 6vw}.site-footer .site-footer-intro>a{display:inline-flex;padding:8px}.site-footer .site-footer-intro>a img{width:236px;height:auto}.site-footer .site-footer-line{max-width:420px;margin:32px 0 0;font-family:Georgia,serif;font-size:24px;line-height:1.33;color:#fff}.site-footer .site-footer-description{max-width:520px;margin:16px 0 0;color:#ffffff9e;font-size:14px;line-height:1.7}.site-footer .site-footer-social{display:flex;align-items:center;gap:8px;margin-top:28px}.site-footer .site-footer-social a{display:inline-flex;width:32px;height:32px;overflow:hidden;border-radius:3px}.site-footer .site-footer-social a:last-child{border-radius:50%}.site-footer .site-footer-social img{width:100%;height:100%;object-fit:cover}.site-footer .site-footer-groups{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px}.site-footer nav{display:block}.site-footer nav>p{margin:0;color:#77d8cd;font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase}.site-footer ul{margin:20px 0 0;padding:0;list-style:none}.site-footer li+li{margin-top:12px}.site-footer li a{color:#ffffffb3;font-size:14px;font-weight:600;text-decoration:none}.site-footer li a:hover{color:#fff}.site-footer .site-footer-bottom{display:flex;max-width:1408px;margin:0 auto;padding:20px 6vw;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid #ffffff1a;color:#ffffffa6;font-size:12px}.site-footer .site-footer-bottom p{margin:0}@media(max-width:720px){.site-footer .site-footer-main{display:block;padding:48px 7vw}.site-footer .site-footer-groups{grid-template-columns:1fr;gap:32px;margin-top:40px}.site-footer .site-footer-bottom{display:block;padding:20px 7vw}.site-footer .site-footer-bottom p+p{margin-top:8px}.site-footer .site-footer-intro>a img{width:205px}}
/* Preserve the owner-approved Landscape framing: enlarge the complete capture
   proportionally and anchor it left so both application edges meet the glass. */
#tablet-wrap[data-screen="1"] .tablet-glass img{position:absolute;left:0;top:50%;width:104.7%;height:104.7%;max-width:none;object-fit:cover;object-position:left 48%;transform:translateY(-50%);background:transparent}
.closing .button{min-height:3rem;align-items:center;justify-content:center;gap:0;border-radius:.42rem;padding:.78rem 1.5rem;font-size:.875rem;font-weight:850;box-shadow:0 15px 32px rgba(6,117,111,.22);transition:transform .16s ease,background-color .16s ease,box-shadow .16s ease}.closing .button:hover{background:#055f5b;transform:translateY(-1px);box-shadow:0 18px 38px rgba(6,117,111,.28)}

/* Keep the opening sales message visible before media and story scripts initialize. */
.intro-copy{opacity:1}

/* Sales clarity v2: preserve the approved opening composition while making the
   product boundary and resident follow-through explicit. */
.intro-copy p:not(.eyebrow){max-width:850px;line-height:1.5}
.simple-hero .hero-subhead{max-width:850px;font-size:20px;line-height:1.5;color:#eef4f4}
.resident-section{display:grid;grid-template-columns:.9fr 1.1fr;gap:7vw;align-items:center;background:#e9f0ed}
.resident-section h2{font-size:clamp(42px,4.8vw,76px);margin-top:26px}
.resident-section>div>p:not(.eyebrow){margin-top:28px;max-width:620px;font-size:18px;line-height:1.7;color:#46576b}
.resident-phone-stage{display:flex;justify-content:center;min-width:0;padding:16px}
.resident-phone{width:min(100%,390px);aspect-ratio:887/1774;position:relative;filter:drop-shadow(0 22px 25px #00184928)}
/* Measured from the frame's actual alpha aperture; keep scrolling behind the device. */
.resident-phone-screen{position:absolute;left:11.048%;top:5.186%;width:78.13%;height:89.91%;overflow:auto;border-radius:12% / 5.22%;clip-path:inset(0 round 12% / 5.22%);background:#f6f9f8;scrollbar-width:none}
.resident-phone-screen::-webkit-scrollbar{display:none}
.resident-phone-screen:focus-visible{outline:2px solid #50c3b7;outline-offset:-2px}
.resident-phone-screen img{display:block;width:100%;height:auto;border-top:20px solid #f6f9f8;border-bottom:12px solid #f6f9f8}
.resident-phone-frame{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;z-index:1}
@media(max-width:720px){
 .intro-copy{top:25%}
 .resident-section{grid-template-columns:1fr;gap:38px}
 .resident-section h2{font-size:42px}
 .resident-section>div>p:not(.eyebrow){font-size:16px}
}

/* Hero contrast candidate: the aerial changes underneath the copy, so a local
   brand-navy wash protects the approved white type across every video frame. */
.intro-copy{isolation:isolate}
.intro-copy:before{content:"";position:absolute;z-index:-1;inset:-80px -100px -80px -10vw;background:radial-gradient(ellipse at 20% 50%,rgba(0,24,73,.88) 0%,rgba(0,24,73,.66) 42%,rgba(0,24,73,.28) 63%,rgba(0,24,73,0) 78%);pointer-events:none}
.intro-copy h1,.intro-copy p{text-shadow:0 2px 18px rgba(0,12,38,.72)}
.intro-copy .eyebrow{color:#50c3b7;font-size:12px;letter-spacing:.16em}
.intro-copy h1{color:#fff}
.intro-copy h1 span{color:#b8dbe2}
.intro-copy p:not(.eyebrow){color:#b8dbe2}
.simple-hero .hero-subhead{color:#b8dbe2}
@media(max-width:720px){
 .intro-copy:before{inset:-55px -28px -55px -8vw;background:radial-gradient(ellipse at 22% 50%,rgba(0,24,73,.9) 0%,rgba(0,24,73,.7) 48%,rgba(0,24,73,.3) 72%,rgba(0,24,73,0) 88%)}
 .intro-copy .eyebrow{font-size:10px;line-height:1.65;max-width:310px}
}