.website-showcase{position:relative;isolation:isolate;overflow:hidden;padding:49px 0 40px;background:#0b0b0c url('/assets/showcase-atmosphere.jpg') center/cover}.website-showcase::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#08090ae8 0%,#08090a55 30%,#08090a16 80%,#08090a80)}.website-showcase::after{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,#cba44d40,#e5c27c99,#cba44d40);box-shadow:0 0 5px #c9973214,0 0 11px #a974230b}.showcase-heading{text-align:center;max-width:1120px;margin:0 auto 16px}.showcase-heading .eyebrow{font-size:11px;letter-spacing:.24em;margin-bottom:17px}.showcase-heading h2{font-size:clamp(31px,3.3vw,48px);line-height:1.15;letter-spacing:-.04em}.showcase-heading>p:not(.eyebrow){font-size:14px;color:#c8c3b8;line-height:1.7;margin-top:19px}.laptop-stage{position:relative;width:100%;max-width:1140px;aspect-ratio:1672/941;margin:0 auto;isolation:isolate}.laptop-photo-scene{display:block;width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}.nomad-screen-viewport{position:absolute;left:12.56%;top:8.29%;width:74.94%;height:72.9%;overflow:hidden;border-radius:3px;background:#030404}.nomad-screen-content{width:100%;height:100%;position:relative;overflow:hidden}.nomad-screen-content img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;filter:brightness(.94) contrast(1.025)}.showcase-action{position:relative;z-index:1;text-align:center;margin-top:1px}.showcase-action .btn{font-size:12px;padding:13px 23px;min-height:46px}
@media(max-width:1000px){.website-showcase{padding:45px 0 38px}.showcase-heading h2{font-size:36px}.showcase-heading{margin-bottom:14px}.laptop-stage{aspect-ratio:1672/941}}
@media(max-width:600px){.website-showcase{padding:41px 0 36px;background-position:62% center}.showcase-heading .eyebrow{font-size:8px;letter-spacing:.17em;margin-bottom:17px}.showcase-heading h2{font-size:32px;max-width:18ch;margin:auto}.showcase-heading>p:not(.eyebrow){font-size:12px;max-width:33ch;margin:17px auto 0}.showcase-heading{margin-bottom:20px}.laptop-stage{aspect-ratio:1672/941;width:110%;margin-left:-5%}.showcase-action{margin-top:15px}.showcase-action .btn{font-size:11px;min-height:44px}}


/* Static photographic frame: screen remains an independent clipped element. */
.photo-laptop{max-height:none}.showcase-heading{margin-bottom:12px}.showcase-action{margin-top:12px}@media(max-width:600px){.nomad-screen-viewport{border-radius:1px}.showcase-action{margin-top:20px}}
/* Blend the photographed tabletop and mountains into the surrounding dark stage. */
.website-showcase{background:radial-gradient(ellipse at 96% 52%,#88521c28,transparent 62%),#0b0b0c}.laptop-photo-scene{mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent),linear-gradient(180deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-composite:source-in}
/* Continuous scenic environment; original laptop pixels are retained in the foreground. */
.website-showcase{background:#0b0b0c url('/assets/showcase-continuous.jpg') center bottom/cover}.website-showcase::before{background:linear-gradient(180deg,#08090ad4, #08090a30 33%,transparent 72%,#08090a26)}.laptop-photo-scene{mask-image:url('/assets/laptop-silhouette.svg');mask-size:100% 100%;mask-repeat:no-repeat;mask-composite:add;-webkit-mask-image:url('/assets/laptop-silhouette.svg');-webkit-mask-size:100% 100%;-webkit-mask-repeat:no-repeat;-webkit-mask-composite:source-over}
@media(min-width:1001px){.website-showcase{padding-top:16px;padding-bottom:14px}.showcase-heading{margin-bottom:4px}.showcase-heading>p:not(.eyebrow){margin-top:15px}.laptop-stage{margin-top:-20px;margin-bottom:-43px}.showcase-action{margin-top:8px}}
@media(min-width:601px) and (max-width:1000px){.website-showcase{padding-top:28px;padding-bottom:27px}.showcase-heading{margin-bottom:5px}.laptop-stage{margin-top:-12px;margin-bottom:-22px}.showcase-action{margin-top:7px}}
@media(max-width:600px){.website-showcase{padding-top:35px;padding-bottom:32px;background-position:60% bottom}.laptop-stage{margin-top:-4px;margin-bottom:-10px}.showcase-action{margin-top:12px}}

/* Static photographic perspective: display and its independent screen share one plane. */
.laptop-display-plane{position:absolute;inset:0;transform-origin:50% 82.9%;transform:perspective(1100px) rotateX(8deg);clip-path:inset(0 0 17.05%);backface-visibility:hidden}
.laptop-base-photo{position:absolute;inset:0;clip-path:inset(82.8% 0 0);pointer-events:none}
.laptop-stage::before{content:"";position:absolute;left:8%;right:8%;top:90.4%;height:2.2%;border-radius:50%;background:#020202b8;filter:blur(5px);z-index:-1}
@media(max-width:600px){.laptop-display-plane{transform:perspective(650px) rotateX(8deg)}.laptop-stage::before{filter:blur(2px)}}

/* Extend the existing stone foreground behind the base without moving the laptop. */
.showcase-ground-plane{position:absolute;inset:auto 0 0;height:27%;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#09090918,transparent 30%),url('/assets/showcase-continuous.jpg') center bottom/100% 500%;mask-image:linear-gradient(180deg,transparent,#000 2.5%);-webkit-mask-image:linear-gradient(180deg,transparent,#000 2.5%)}
.laptop-stage::before{top:90.5%;height:2.4%;background:#020202cf;filter:blur(4px)}
@media(max-width:600px){.showcase-ground-plane{height:28%;background-position:center bottom,60% bottom}.laptop-stage::before{filter:blur(2px)}}

/* Scale the complete device around its contact point without changing layout height. */
.photo-laptop{transform:scale(1.1);transform-origin:50% 91%}


/* Refined heading hierarchy and breathing room above the enlarged device. */
@media(min-width:1001px){
 .showcase-heading h2{font-size:clamp(28px,3vw,43.2px);max-width:1000px;margin-left:auto;margin-right:auto}
 .showcase-heading{margin-bottom:44px}
 .showcase-heading>p:not(.eyebrow){margin-top:18px}
}
@media(min-width:601px) and (max-width:1000px){.showcase-heading{margin-bottom:29px}}
@media(max-width:600px){.showcase-heading{margin-bottom:34px}}

/* Native page-scroll track; device and scenery geometry remain untouched. */
.showcase-scroll-track{position:relative}
.showcase-pin-surface{position:sticky;display:flow-root}
.nomad-live-frame{position:absolute;left:0;top:0;width:1440px;border:0;transform-origin:0 0;pointer-events:none;max-width:none;color-scheme:dark}

/* The real contact section stays directly below the pinned scene, never after an exposed spacer. */
.showcase-pin-surface > .rock-contact::before{content:"";display:block;position:absolute;top:0;left:0;right:0;height:1px;pointer-events:none;z-index:3;background:linear-gradient(90deg,#cba44d40,#d9b46285 28%,#e5c27c99 50%,#d9b46285 72%,#cba44d40);box-shadow:0 0 5px #c9973214,0 0 11px #a974230b}
