*{box-sizing:border-box}html{scroll-behavior:auto}body{overflow-x:hidden;margin:0;background:#44473e;font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;color:#f4efe4}.page-two{height:100svh;position:sticky;top:0;overflow:hidden}.page-two iframe{width:100%;height:100%;border:0;pointer-events:none}.intro{position:absolute;bottom:22px;left:4%;padding:12px 18px;background:#44473e;color:#f4efe4;border:1px solid #8b8b78;font-size:14px;z-index:2}.page-three{position:relative;background:#f4efe4;color:#1c1b19;min-height:135svh;z-index:3;box-shadow:0 -12px 35px #0002}.stage{overflow:hidden;width:100%;position:sticky;top:0;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:25px 0 50px;background:#f4efe4}.caption{font-size:14px;text-align:center;color:#6b665c;position:absolute;top:20px;margin:0 25px}.laptop{width:min(1350px,100vw);aspect-ratio:1672/941;position:relative;perspective:1600px}.base,.closed{position:absolute;inset:0;background:url('assets/macbook-open-approved.png') center/100% 100%;pointer-events:none}.base{opacity:var(--lid,0);clip-path:inset(54.7% 0 0);mask-image:linear-gradient(to bottom,black 0%,black 90%,transparent 99%),linear-gradient(to right,transparent 12%,black 22%,black 78%,transparent 88%);mask-composite:intersect}.closed{transform:translateY(var(--closed-lift,-38%));background-image:url('assets/macbook-closed-approved.png');z-index:5;opacity:var(--closed,1)}.lid{position:absolute;left:26.45%;top:5%;width:47%;height:50%;transform-origin:center bottom;transform:rotateX(var(--angle,-100deg));transform-style:preserve-3d;z-index:3;opacity:var(--lid,0)}.lid-art{position:absolute;inset:0;background:url('assets/macbook-open-approved.png');background-size:212.77% 200%;background-position:50% 10%;border-radius:12px;backface-visibility:hidden}.back{position:absolute;inset:0;background:#654531;border:1px solid #3b2c21;border-radius:12px;transform:rotateY(180deg);backface-visibility:hidden}.screen{position:absolute;inset:3% 2% 4%;background:#44473e;color:#f4efe4;padding:4% 6%;border-radius:4px;opacity:var(--form,0);pointer-events:var(--events,none);display:flex;flex-direction:column;justify-content:center;backface-visibility:hidden}.screen h1{font-weight:400;font-size:clamp(20px,1.9vw,32px);letter-spacing:-.035em;line-height:1.08;margin:0 0 3%}.screen p{font-size:clamp(11px,1vw,16px);margin:0 0 5%;color:#d6d2c0}.fields{display:grid;grid-template-columns:1fr;gap:10px}label{display:block;font-size:12px;color:#ddd8c4;margin-bottom:5px}input,textarea,button{font:inherit}input,textarea{width:100%;background:transparent;color:#f4efe4;border:1px solid #a9a98c;padding:10px 14px;border-radius:8px;font-size:16px}textarea{resize:none;height:64px}button{border:0;border-radius:24px;padding:11px 24px;background:#b6b789;color:#2d3026;cursor:pointer;font-size:15px}input:focus,textarea:focus,button:focus-visible{outline:2px solid #eee7cb;outline-offset:3px}.status{min-height:16px;font-size:12px;margin-top:8px}.footer{font-size:12px;letter-spacing:.1em;position:absolute;bottom:20px}.fallback{display:none}.trial-control{position:fixed;right:15px;bottom:15px;z-index:9;background:#f4efe4;color:#1c1b19;padding:10px 14px;border:1px solid #aaa594;font-size:12px}
@media(max-width:700px){.laptop{width:200vw;max-width:none;margin-left:0}.stage{overflow:hidden}.screen{padding:4% 5%;justify-content:flex-start;overflow:auto}.screen h1{font-size:20px}.screen h1 br{display:none}.screen p{display:none}.screen input,.screen textarea{padding:8px 10px;font-size:16px}.fields{gap:6px}.screen textarea{height:38px}.screen label{font-size:11px}.screen button{padding:7px}.caption{font-size:12px}.footer{font-size:10px}.laptop{margin-top:70px}.status{font-size:10px}.trial-control{font-size:10px}}
@media(max-height:600px) and (orientation:landscape){.stage{min-height:700px}.laptop{width:min(1150px,130vw)}.caption{font-size:12px}.screen h1{font-size:24px}.screen p{font-size:12px}.fields{gap:6px}.screen input,.screen textarea{padding:7px 10px}.screen textarea{height:48px}}

/* Continuous hinged geometry study; endpoint stills are references only. */
.stage,.page-three{background:#e9dcc6;background-image:radial-gradient(ellipse at 50% 45%,#f7eddd 0%,#e9dcc6 75%)}
.laptop{width:min(650px,88vw);height:390px;aspect-ratio:auto;perspective:1600px;perspective-origin:50% 30%;margin-top:0}
.assembly{position:absolute;inset:0;transform:translateY(var(--pose-lift,-70%)) rotateX(-23deg);transform-style:preserve-3d}
.base{top:100%;height:100%;inset-inline:0;bottom:auto;clip-path:none;mask-image:none;opacity:1;transform-origin:center top;transform:rotateX(90deg);border-radius:12px;background:#593b29;box-shadow:0 6px 0 #292722;transform-style:preserve-3d;background-image:url('assets/macbook-open-approved.png');background-size:168% 280%;background-position:50% 94%}
.lid{left:0;top:0;width:100%;height:100%;opacity:1;transform:rotateX(var(--angle,-90deg));border-radius:12px;transform-style:preserve-3d}
.lid-art{background:#24231f;border:9px solid #24231f;transform:translateZ(2px);border-radius:12px}
.back{background:#634431;background-image:url('assets/macbook-closed-approved.png');background-size:178% 280%;background-position:50% 68%;transform:rotateY(180deg) translateZ(3px);border:3px solid #403329}
.closed{display:none}
.screen{inset:11px;transform:translateZ(3px);opacity:1;background:#f4efe4;color:#1c1b19;padding:18px 42px;justify-content:center;overflow:auto;border-radius:4px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.055' filter='url(%23n)'/%3E%3C/svg%3E")}
.screen h1{font-weight:300;letter-spacing:-.055em;font-size:32px}.screen label{color:#292b27;font-weight:300;font-size:14px}.screen input,.screen textarea{color:#1c1b19;font-weight:400;border-color:#a9a28f}.screen button{background:#4b4e3e;color:#f4efe4}.screen .status{color:#292b27}
@media(max-width:700px){.laptop{width:92vw;height:390px;margin-top:0}.screen{padding:15px;justify-content:flex-start}.screen h1{font-size:25px}.screen label{font-size:13px}.screen textarea{height:48px}.stage{min-height:100svh}}
@media(max-height:600px) and (orientation:landscape){.stage{min-height:650px}.laptop{width:min(630px,80vw);height:390px}.screen{padding:18px 32px}.screen h1{font-size:28px}}

.base,.back{background:#634431;background-image:repeating-radial-gradient(ellipse at 30% 20%,#76543d22 0 1px,transparent 1px 4px);background-size:13px 19px}
.keyboard{position:absolute;left:12%;right:12%;top:9%;height:48%;display:grid;grid-template-columns:repeat(10,1fr);gap:5px;padding:5px;background:#24211f;border-radius:6px}.keyboard span{background:#6e4933;border:1px solid #997158;border-bottom:3px solid #30271f;border-radius:4px;color:#d9c9b7;font-size:11px;display:flex;align-items:center;justify-content:center}.trackpad{position:absolute;left:25%;right:25%;top:63%;height:31%;border:1px solid #332c26;border-radius:7px;background:#664632}.speaker{position:absolute;top:9%;width:8%;height:49%;background:#38342f;background-image:radial-gradient(#151412 1px,transparent 1px);background-size:4px 4px}.speaker.left{left:2%}.speaker.right{right:2%}

/* Reuse approved photography only on the articulated product surfaces.
   The warm environment is one fixed layer, independent of lid movement. */
.stage,.page-three{background:#eee0ca}.stage{isolation:isolate}.stage:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/macbook-closed-approved.png') center top/100% 210% no-repeat}
.base,.back{background:#654631;background-image:none}.base{box-shadow:0 5px 0 #24221e,0 22px 24px #38241248}.back{border:0;box-shadow:0 2px 0 #27231f}.surface{position:absolute;inset:0;overflow:hidden;border-radius:inherit}.surface img{position:absolute;left:0;top:0;width:1672px;height:941px;max-width:none;transform-origin:0 0;pointer-events:none}

/* Rounded body layers follow the photographic silhouette without projecting
   perpendicular strips past the lid or corners. */
.base{box-shadow:none}.base::before,.lid::before,.lid::after{content:none}
.body-layer,.lid-layer{position:absolute;inset:0;border-radius:12px;background:#302e29;pointer-events:none}
.body-layer{background:linear-gradient(#48443c,#2b2924)}
.body-layer:first-child{box-shadow:0 18px 24px #38241240}
.lid-layer{background:#24231f}
.back{box-shadow:none;transform:rotateY(180deg) translateZ(3px)}
.lid-art{border:0;background:none;box-shadow:none}
.screen{inset:3.5% 1.8% 4.8%;clip-path:polygon(0 0,44% 0,44% 3%,56% 3%,56% 0,100% 0,100% 100%,0 100%)}
/* Olive glass Send treatment, echoing the project chips. */
.screen button[type="submit"]{background:linear-gradient(155deg,#ffffff24,transparent 48%),linear-gradient(180deg,#606651eb,#424837f5);border:1px solid #f4efe480;box-shadow:inset 0 1px 0 #ffffff60,inset 0 -1px 0 #20271966,0 3px 9px #292b2726;color:#fffaf0;backdrop-filter:blur(12px) saturate(120%);-webkit-backdrop-filter:blur(12px) saturate(120%);text-shadow:0 1px 1px #18201055}
.screen button[type="submit"]:active{box-shadow:inset 0 2px 5px #20271955,0 1px 3px #292b2726}
.screen button[type="submit"]:focus-visible{outline:2px solid #477ba0;outline-offset:3px}

/* Approved paper reference treatment and stronger sculpted olive glass. */
.screen{background-color:#f1e7d3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.10 .14' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='.14'/%3E%3Cg stroke='%239d8c6d' stroke-opacity='.16' stroke-width='.6'%3E%3Cpath d='M9 20l19 2m44 18l29 -2m76 40l18 1m42 26l27 -3M24 131l21 2m34 27l28 -2m35 42l21 1m81 26l33 -2M20 270l22 2m49 25l19 -3m131 -10l24 2'/%3E%3C/g%3E%3C/svg%3E")}
.screen button[type="submit"]{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 22% 0%,#ffffff58,transparent 56%),linear-gradient(180deg,#a3ab8990 0%,#677152de 43%,#404a36f2 57%,#616d4eea 100%);border:1px solid #f9f5dfb8;box-shadow:inset 0 2px 1px #ffffff85,inset 0 -3px 3px #18211180,inset 2px 0 3px #ffffeb35,inset -2px 0 3px #ffffeb35,0 3px 0 #38402bcc,0 6px 11px #343b2840;color:#fffdf3;text-shadow:0 1px 2px #1a251380;font-weight:400;backdrop-filter:blur(16px) saturate(135%);-webkit-backdrop-filter:blur(16px) saturate(135%)}
.screen button[type="submit"]::before{content:"";position:absolute;top:2px;left:5%;right:5%;height:40%;border-radius:50%;background:linear-gradient(#ffffff30,#ffffff00);pointer-events:none}
.screen button[type="submit"]:active{box-shadow:inset 0 2px 5px #18211180,0 1px 0 #38402b99;transform:translateY(2px)}
.collaboration-note{position:absolute;top:clamp(20px,3.5vh,38px);width:min(720px,88vw);margin:0;color:#3b3831;text-align:center;font-size:clamp(15px,1.25vw,18px);font-weight:300;line-height:1.5;z-index:1}
.collaboration-note .lead-in{display:block;margin-top:8px}
@media(max-width:700px){.collaboration-note{font-size:15px;line-height:1.4;top:18px}}

/* One joined perimeter wall replaces stacked lid slices at grazing angles. */
.lid-rim{position:absolute;inset:0;transform-style:preserve-3d;pointer-events:none}
.lid-rim span{position:absolute;left:0;top:0;height:5px;transform-origin:0 0;background:linear-gradient(#292620,#464037 50%,#25231f);backface-visibility:visible}

/* Contact introduction follows page two's actual paragraph measurements. */
.collaboration-note{text-align:left;max-width:none;margin:0}
.collaboration-note .lead-in{margin-top:0}

.contact-options{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;align-items:end}.contact-or{font-size:13px;padding-bottom:11px;color:#575445}.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}
.confirmation{position:absolute;inset:14% 0 auto;z-index:6;pointer-events:none;text-align:center}.confirmation[hidden]{display:none}.confirmation canvas{display:block;width:100%;height:auto}.confirmation p{font-size:12px;letter-spacing:0;line-height:1.4;margin:0;color:#605749}.confirmation .ink-fallback{font-size:28px;color:#db4d52;font-style:italic;margin:30px 0}.confirmation video{display:none}

/* Decorative 3D planes must not intercept the tilted form. */
.assembly{pointer-events:none}
.screen{pointer-events:var(--events,none)}

/* Ten percent smaller invitation; preserve field typography. */
.screen h1{font-size:28.8px;position:relative;top:4px}
@media(max-width:700px){.screen h1{font-size:22.5px}}
@media(max-height:600px) and (orientation:landscape){.screen h1{font-size:25.2px}}

.contact-footer{position:absolute;left:4%;right:4%;bottom:24px;display:flex;align-items:flex-end;justify-content:space-between;gap:18px;color:#292b27}
.contact-footer .wordmark{font-size:17px;letter-spacing:.14em;text-transform:uppercase;font-weight:400;line-height:1.3;text-decoration:none;color:inherit}
.contact-footer address{margin:0;text-align:right;font-style:normal;font-size:12px;line-height:1.5;font-weight:300}
@media(max-width:700px){.contact-footer{left:5%;right:5%;gap:12px;bottom:22px}.contact-footer .wordmark{font-size:11px;letter-spacing:.1em}.contact-footer address{font-size:10px;max-width:53%}}
.optional-label{font-size:.8em;color:#68604f}
.hero-preview{height:100svh;position:relative;background:#f4efe4;z-index:1}.hero-preview iframe{width:100%;height:100%;border:0;pointer-events:none}.hero-next{position:absolute;right:4%;bottom:5%;color:#f4efe4;font-size:32px;text-decoration:none;padding:12px}.page-two{z-index:2}

/* Extra-wide review: larger device/form and footer, preserving approved smaller desktops. */
@media(min-width:2200px){.laptop{transform:scale(1.3);transform-origin:center center}.contact-footer .wordmark{font-size:22.1px}.contact-footer address{font-size:15.6px}}

@media(min-width:541px) and (max-width:640px) and (orientation:portrait){.laptop{transform:scale(.85);transform-origin:center center}}

@media(min-width:900px) and (max-width:1000px) and (min-height:541px) and (max-height:640px) and (orientation:landscape){.laptop{transform:scale(.75);transform-origin:center center}}
/* Phone portrait: Kevin requested a 25% smaller MacBook. */
@media(max-width:540px) and (orientation:portrait){.laptop{transform:scale(.75);transform-origin:center center}}

.phone-form-open{display:none}.phone-form-dialog{border:1px solid #b5a58b;border-radius:16px;padding:12px;background:#f4efe4;color:#292b27;width:calc(100vw - 24px);max-width:500px;max-height:calc(100dvh - 24px);overflow:auto}@keyframes phone-form-expand{from{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}.phone-form-dialog[open]{animation:phone-form-expand .2s ease-out}@media(prefers-reduced-motion:reduce){.phone-form-dialog[open]{animation:none}}.phone-form-dialog::backdrop{background:#30291f88;backdrop-filter:blur(4px)}.phone-form-dialog .zoom-close{display:block;margin:0 0 12px auto;min-height:44px;background:#44473e;color:#f4efe4}.phone-form-dialog form.screen{position:relative;inset:auto;transform:none!important;clip-path:none!important;width:100%;height:auto;min-height:0;max-height:none;opacity:1;pointer-events:auto;padding:18px!important;overflow:visible}.phone-form-dialog .screen h1{font-size:26px!important;margin:0 0 20px!important}.phone-form-dialog .screen input,.phone-form-dialog .screen textarea{font-size:16px!important;min-height:44px}.phone-form-dialog .screen label{font-size:14px!important}.phone-form-dialog .screen textarea{height:86px}.phone-form-dialog .screen button{min-height:44px}.phone-form-dialog .fields{gap:14px}
@media(max-width:540px) and (orientation:portrait), (min-width:641px) and (max-width:1000px) and (max-height:540px) and (orientation:landscape){.laptop{width:650px;min-width:650px;height:390px;flex-shrink:0;transform:scale(var(--phone-model-scale,.52));transform-origin:center center}.phone-form-open{overflow:visible!important;position:absolute;display:block;inset:4% 3% 6%;z-index:12;transform:translateZ(8px);background:transparent;border-radius:8px;pointer-events:var(--events,none);color:transparent}.phone-form-open span{position:absolute;bottom:calc(100% + 24px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#44473e;color:#fff;padding:10px 18px;border-radius:20px;font-size:30px;opacity:var(--phone-prompt,0)}.laptop .screen{padding:18px 42px;justify-content:center}.laptop .screen h1{font-size:28px}.laptop .screen label{font-size:14px}}
.phone-form-label{display:none}@media(max-width:540px) and (orientation:portrait), (min-width:641px) and (max-width:1000px) and (max-height:540px) and (orientation:landscape){.phone-form-open span{display:none}.phone-form-label{display:block;position:absolute;left:50%;transform:translateX(-50%);z-index:20;white-space:nowrap;font-size:14px;padding:10px 16px;background:#44473e;color:#fff;opacity:0;pointer-events:none}}
@media (min-width:641px) and (max-width:1000px) and (max-height:540px) and (orientation:landscape){.stage{height:100svh;min-height:100svh!important;padding:0}.laptop{position:absolute;left:50%;top:calc(58% - 42px);transform:translate(-50%,-50%) scale(var(--phone-model-scale,.34))}.phone-form-label{left:50%;font-size:12px;padding:7px 12px}.contact-footer{bottom:10px}.contact-footer .wordmark{font-size:11px}.contact-footer address{font-size:9px}.phone-form-dialog{max-width:620px}.phone-form-dialog .screen textarea{height:60px}}

:host{display:block;position:relative;z-index:3;color:#1c1b19;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif}.trial-control{display:none}
[hidden]{display:none!important}.screen button:disabled{cursor:wait}.phone-form-dialog{overscroll-behavior:contain}.confirmation:focus{outline:none}

/* Safari-stable photographic deck: bake the existing homography once rather
   than project a large image through another nested matrix3d during scrolling.
   A small separation keeps the photo ahead of the base's thickness layers. */
.base>.surface{background:url('assets/macbook-deck-texture.png') center/100% 100% no-repeat;transform:translateZ(.5px)}
.base>.surface img{display:none}

/* Combine the fixed -23deg camera rotation into each hinged face. This is
   algebraically the same 390px-high model: hinge offsets are
   195*(cos(23deg)-1) and -195*sin(23deg). Avoid an edge-on 90deg base
   inside a second rotating container, which WebKit can cull while scrolling. */
.assembly{transform:translateY(var(--pose-lift,-70%))}
.base{transform:translate3d(0,-15.501553px,-76.19257px) rotateX(67deg)}
.lid{transform:translate3d(0,-15.501553px,-76.19257px) rotateX(calc(var(--angle,-90deg) - 23deg))}

/* 13-inch iPad landscape review: 8% smaller, 60px higher. The height floor
   excludes the approved 1280x800 Galaxy and the 1440px desktop baseline. */
@media(min-width:1300px) and (max-width:1376px) and (min-height:850px) and (orientation:landscape){.laptop{transform:translateY(-60px) scale(.92);transform-origin:center center}}

/* Apply the same approved phone rules to a zoom-expanded touch viewport. */
:host([data-phone-landscape]) .laptop{width:650px;min-width:650px;height:390px;flex-shrink:0;transform:scale(var(--phone-model-scale,.52));transform-origin:center center}:host([data-phone-landscape]) .phone-form-open{overflow:visible!important;position:absolute;display:block;inset:4% 3% 6%;z-index:12;transform:translateZ(8px);background:transparent;border-radius:8px;pointer-events:var(--events,none);color:transparent}:host([data-phone-landscape]) .phone-form-open span{position:absolute;bottom:calc(100% + 24px);left:50%;transform:translateX(-50%);white-space:nowrap;background:#44473e;color:#fff;padding:10px 18px;border-radius:20px;font-size:30px;opacity:var(--phone-prompt,0)}:host([data-phone-landscape]) .laptop .screen{padding:18px 42px;justify-content:center}:host([data-phone-landscape]) .laptop .screen h1{font-size:28px}:host([data-phone-landscape]) .laptop .screen label{font-size:14px}
:host([data-phone-landscape]) .stage{height:100svh;min-height:100svh!important;padding:0}:host([data-phone-landscape]) .laptop{position:absolute;left:50%;top:calc(58% - 42px);transform:translate(-50%,-50%) scale(var(--phone-model-scale,.34))}:host([data-phone-landscape]) .phone-form-label{left:50%;font-size:12px;padding:7px 12px}:host([data-phone-landscape]) .contact-footer{bottom:10px}:host([data-phone-landscape]) .contact-footer .wordmark{font-size:11px}:host([data-phone-landscape]) .contact-footer address{font-size:9px}:host([data-phone-landscape]) .phone-form-dialog{max-width:620px}:host([data-phone-landscape]) .phone-form-dialog .screen textarea{height:60px}
:host([data-phone-landscape]) .phone-form-open span{display:none}
:host([data-phone-landscape]) .phone-form-label{display:block;position:absolute;left:50%;transform:translateX(-50%);z-index:20;white-space:nowrap;font-size:12px;padding:7px 12px;background:#44473e;color:#fff;opacity:0;pointer-events:none}

/* Safari's small viewport remains shorter after its toolbar collapses.
   Use the same current viewport height as the phone model sizing. */
:host{-webkit-text-size-adjust:100%;text-size-adjust:100%}
:host([data-phone-landscape]) .stage{height:var(--contact-viewport-height,100dvh);min-height:var(--contact-viewport-height,100dvh)!important}
:host([data-phone-landscape]) .page-three{min-height:calc(var(--contact-viewport-height,100dvh)*1.35)}