/* S04-07 / S05-03. Scope: Free Demo, delivery journey, post-unpin S03 handoff. */
.demo-journey{overflow:visible;padding:76px 0 66px;background:linear-gradient(#f1ede4,#efebe2 32%,#f5f1e8 72%,#e8e9df)}
.demo-intro{width:min(1240px,calc(100% - 112px));margin:auto;position:relative;padding-top:27px}
.demo-eyebrow{font-size:11px;font-weight:650;letter-spacing:.17em;color:#5d7565;margin:0 0 21px}
.demo-journey #process-title{text-align:left;font-size:clamp(46px,5.2vw,76px);font-weight:450;letter-spacing:-.06em;line-height:1.09;color:#303e37;margin:0 0 23px}
.demo-journey #process-title em{font-family:Georgia,serif;font-weight:400;color:#4b6b56}
.demo-intro>p:last-child{max-width:600px;font-size:15px;line-height:1.8;color:#607064;margin:0}
.demo-story{position:relative;margin:50px 0 0}.demo-pin{position:relative;width:min(1240px,calc(100% - 112px));margin:auto}
.demo-visual{display:none}.demo-copy-stack{position:relative}.demo-copy{position:relative;max-width:550px}
.demo-copy h3{font-size:38px;line-height:1.14;letter-spacing:-.052em;font-weight:450;margin:0 0 21px;color:#34473b;text-wrap:pretty}
.demo-copy h3 em{color:#58785f;font-style:normal;font-weight:450;white-space:nowrap}
.demo-copy>p{font-size:14px;line-height:1.8;color:#617163;max-width:37ch;margin:0}
.demo-copy .demo-reassurance{margin-top:13px;font-size:11px;color:#6c7e6c}
.demo-copy .demo-payoff{margin-top:22px;font-size:17px;line-height:1.5;color:#3d5844}
.demo-payoff em{font-family:Georgia,serif;font-size:1.1em}
.demo-phase{position:relative;padding-left:23px;margin-bottom:44px}.demo-phase:last-child{margin-bottom:0}
.demo-copy-stack:before{content:'';position:absolute;left:0;top:5px;bottom:130px;width:1px;background:linear-gradient(#829985,#aebcab 78%,transparent)}
.demo-phase:before{content:'';position:absolute;left:-2px;top:10px;width:5px;height:5px;border-radius:50%;background:#77917a;box-shadow:0 0 0 6px #eeebe3}
.demo-mobile-art{margin:23px auto 0;max-width:700px}
.demo-mobile-art .intake-art{width:295px;height:372px;max-width:100%}
.demo-mobile-art .screen-art{width:100%;height:auto;aspect-ratio:1.48}
.demo-mobile-art .screen-scene{inset:4% 1% 8%}.demo-mobile-art .process-art figcaption{font-size:10px}
.demo-journey .process-close{width:calc(100% - 48px);max-width:580px;margin:20px auto 0;padding-top:20px}
.demo-journey .process-close h3{font-size:40px;letter-spacing:-.05em;margin-bottom:24px}
.demo-journey .process-close>p{font-size:12px}.demo-journey .process-cta{min-height:52px;font-size:14px;padding:13px 25px}
/* Progressive enhancement: one scene, one website object, deterministic scroll state. */
.demo-enhanced .demo-story{height:220svh;margin-top:20px}
.demo-enhanced .demo-pin{height:calc(100svh - 90px);position:sticky;top:90px;min-height:0;isolation:isolate}
.demo-enhanced .demo-copy-stack{position:absolute;top:0;bottom:0;left:0;width:33%;z-index:3}
.demo-enhanced .demo-copy-stack:before,.demo-enhanced .demo-phase:before{display:none}
.demo-enhanced .demo-phase{position:absolute;inset:0;display:flex;align-items:center;padding:0;margin:0;pointer-events:none}
.demo-enhanced .demo-phase .demo-copy{opacity:var(--copy-a,1);transform:translateY(calc((1 - var(--copy-a,1))*8px));will-change:auto}
.demo-enhanced .demo-phase[data-phase="create"] .demo-copy{opacity:var(--copy-b,0);transform:translateY(calc((1 - var(--copy-b,0))*8px))}
.demo-enhanced .demo-phase[data-phase="reveal"] .demo-copy{opacity:var(--copy-c,0);transform:translateY(calc((1 - var(--copy-c,0))*8px))}
.demo-enhanced .demo-copy h3{font-size:clamp(30px,2.72vw,40px)}.demo-enhanced .demo-copy>p{font-size:14px}
.demo-enhanced .demo-mobile-art{display:none}
.demo-enhanced .demo-visual{display:block;position:absolute;left:39%;width:61%;height:min(560px,calc(100svh - 130px));top:50%;transform:translateY(-50%);perspective:1600px}
.demo-brief-object{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:var(--brief-alpha,1);transform:translateX(var(--brief-x,0px)) scale(var(--brief-scale,1));z-index:2}
.demo-brief-object .intake-art{width:clamp(270px,23vw,328px);height:clamp(342px,29vw,414px)}
.demo-concept-object{position:absolute;inset:0;display:flex;align-items:center;opacity:var(--screen-alpha,0);transform:translate(var(--screen-x,30px),var(--screen-y,15px)) scale(var(--screen-scale,.83));z-index:3}
.demo-concept-object .screen-art{width:100%;height:auto;aspect-ratio:1.48}
.demo-concept-object .screen-scene{inset:4% 1% 8%}
.demo-concept-object .concept-glass{opacity:var(--glass-alpha,1);transform:translate(var(--glass-x,0%),var(--glass-y,0%)) rotateY(-4deg) rotateZ(var(--glass-rotate,-2deg));visibility:visible;animation:none!important}
.demo-concept-object .process-art figcaption{font-size:10px;opacity:var(--screen-alpha,0)}
.demo-concept-object .temper-description{display:none}
.demo-signal{position:absolute;left:-17%;right:4%;top:6%;height:30px;color:#688976;opacity:var(--signal-alpha,.75);z-index:1;display:flex;align-items:center;gap:20px}
.demo-signal i{height:1px;flex:1;background:linear-gradient(90deg,#96aa9255,#759582);transform:scaleX(var(--signal-length,.16));transform-origin:left}
.demo-signal span{font-size:8px;letter-spacing:.13em;white-space:nowrap;opacity:var(--guide-alpha,0)}
.demo-guides{position:absolute;inset:4% 0 3%;width:100%;height:93%;stroke:#6e9580;stroke-width:1;opacity:var(--guide-alpha,0);z-index:1;stroke-dasharray:1;stroke-dashoffset:var(--guide-offset,1)}
.demo-guides .guide-corners{stroke:#95a590}
.demo-fragments{position:absolute;inset:0;pointer-events:none;opacity:var(--fragment-alpha,0);z-index:4}
.fragment-photo{position:absolute;left:51%;top:58%;width:23%;aspect-ratio:1.35;padding:4px;background:#fffdf5;box-shadow:0 10px 30px #34453516;transform:translate(var(--photo-x,0px),var(--photo-y,0px)) rotate(var(--photo-rotate,2deg)) scale(var(--photo-scale,.5))}
.fragment-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:73% 50%}
.fragment-services{position:absolute;left:19%;top:45%;font-size:11px;line-height:1.9;color:#536d5b;transform:translate(var(--service-x,0px),var(--service-y,0px));display:grid;gap:4px}
.fragment-services span{padding:2px 9px;border-bottom:1px solid #acbba680;background:#f4f1e8dd}
.fragment-message{position:absolute;left:21%;top:24%;width:25%;transform:translate(var(--message-x,0px),var(--message-y,0px))}
.fragment-message i{display:block;height:2px;background:#96aa8e;margin:8px 0;width:100%}.fragment-message i:nth-child(2){width:84%}.fragment-message i:nth-child(3){width:54%}
/* This affects only the departing, already completed S03 composition. */
#range .range-products{transition:none;scale:calc(1 - .12 * var(--studio-recede,0));translate:0 calc(-18px * var(--studio-recede,0));opacity:calc(1 - .52 * var(--studio-recede,0))}
#range .range-products>.showcase{transition:none}
#range .range-products>.showcase:first-child,#range .range-products>.showcase:last-child{filter:opacity(calc(1 - .48 * var(--studio-outer,0)))}
.demo-journey .studio-arrival{height:110px;top:0;z-index:0}.demo-journey .studio-arrival>span{left:max(56px,calc((100% - 1240px)/2));top:-65px;height:160px;transform:none;animation:none;background:linear-gradient(transparent,#839a8299 55%,#839a8200);opacity:calc(.35 + .65 * var(--studio-recede,0))}
/* One delivery timeline; the purchase widget remains the reference beside it. */
.delivery-timeline{position:relative;padding-left:27px;border-left:1px solid #adc0af;margin-left:5px}
.delivery-entry{font-size:12px;color:#496854;margin:0 0 28px;line-height:1.7}.delivery-entry strong{font-size:18px;font-weight:600;letter-spacing:-.04em;margin-right:5px}.delivery-entry>span{float:right;color:#77987d;font-size:23px}
.delivery-stage{position:relative;margin-bottom:34px}.delivery-stage:last-child{margin-bottom:0}
.delivery-stage>header{position:relative}.delivery-node{position:absolute;width:7px;height:7px;left:-31px;top:14px;background:#5a806a;box-shadow:0 0 0 6px #e5eae1;border-radius:50%}
.delivery-stage h3{font-size:37px;line-height:1.2;letter-spacing:-.052em;font-weight:450;color:#294b3e;margin:0 0 15px}
.delivery-copy{font-size:14px;line-height:1.8;color:#53685c;max-width:56ch;margin:0;text-wrap:pretty}
.delivery-art{height:198px;position:relative;margin:23px 0 0;max-width:540px;display:flex;align-items:center;gap:22px;color:#426454}
.artifact-label{font-size:9px;letter-spacing:.11em;font-weight:600}
.setup-input{flex:1;min-width:0}.setup-files{position:relative;margin:13px 0 0;padding-right:6px}.setup-files span{display:block;background:#f7f7ef;border:1px solid #c2cdbd;box-shadow:0 6px 12px #29452e08;font-size:13px;padding:10px 13px;transform:rotate(-2deg)}.setup-files span+span{margin-top:-2px;transform:rotate(1deg);margin-left:10px}.setup-input>p{font-size:10px;margin-top:13px}.artifact-arrow{font-size:24px;font-weight:300;color:#7b9a81}
.blueprint-book{width:46%;background:#faf9ef;border:1px solid #c3cdb9;padding:19px 23px;box-shadow:3px 3px 0 #d2dbc9,4px 4px 0 #aebfa8,0 16px 20px -15px #243e3840;transform:rotate(1deg)}
.book-rule{width:37px;height:1px;background:#8cab96;margin:13px 0 12px}.blueprint-book strong{display:block;font-size:27px;font-weight:450;line-height:1.03;letter-spacing:-.055em}.blueprint-book em{font-family:Georgia,serif;font-weight:400}.blueprint-book>span:last-child{display:block;font-size:9px;margin-top:14px}
.build-delivery-art{gap:0;isolation:isolate}.build-plan{width:22%;padding:14px 10px;border:1px solid #b0c2af;background:#ecf0e5;transform:rotate(-4deg);align-self:center}.build-plan>span{font-size:8px;letter-spacing:.08em;line-height:1.6}.build-plan svg{display:block;width:100%;height:100px;stroke:#829e8b;stroke-width:.8;margin-top:6px}
.build-interface{width:53%;height:161px;background:#213e37;border:1px solid #476a5a;box-shadow:0 15px 23px -17px #1b433564;color:#d5e1d4;padding:12px;transform:translate(-5px,-8px);z-index:1}
.build-chrome{display:flex;gap:3px;align-items:center;border-bottom:1px solid #65857566;padding-bottom:7px}.build-chrome i{width:3px;height:3px;border-radius:50%;background:#89a998}.build-chrome span{font-size:7px;letter-spacing:.12em;margin-left:auto}
.build-layout{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:15px 0 0;height:84px}.build-layout b{display:block;width:100%;height:3px;background:#c3d4bf;margin:7px 0}.build-layout b:nth-child(2){width:73%}.build-layout i{display:block;width:80%;height:1px;background:#9ab49e;margin:15px 0}.build-layout em{display:block;width:55%;height:8px;background:#94b397}.build-image{background:linear-gradient(137deg,#92a793,#657e6a 49%,#b1c0a4 50%,#819980);border:1px solid #b0bea455}
.qa-stamp{display:block;position:absolute;bottom:-13px;left:13px;font-size:8px;letter-spacing:.04em;color:#274e3d;background:#eff4e6;border:1px solid #acbea3;padding:6px 10px;transform:rotate(-2deg)}
.review-slip{width:30%;padding:16px 13px;background:#f8f5e9;border:1px solid #d3d1b8;box-shadow:0 4px 11px #2e483015;transform:translate(-9px,28px) rotate(3deg);z-index:2}.review-slip>span{font-size:8px;letter-spacing:.08em}.review-slip strong{display:block;font:italic 24px/1.05 Georgia,serif;margin:11px 0;color:#506a53}.review-slip i{font-size:8px;font-style:normal;line-height:1.6;display:block}
.delivery-balance{font-size:12px;margin:15px 0 0;color:#496b53}.delivery-balance strong{font-size:18px;font-weight:550;margin-right:5px}
.launch-delivery-art{flex-direction:column;align-items:stretch;gap:15px;height:216px}.launch-sequence{display:flex;gap:12px;align-items:center;justify-content:space-between;font-size:10px;padding:0 3px;color:#62836a}.launch-sequence strong{font-weight:600;color:#2c5540}.launch-sequence i{font-style:normal;color:#78967c}
.handoff-document{max-width:100%;width:100%;padding:17px 23px;background:linear-gradient(135deg,#ecf2e6,#f4f5e9);border:1px solid #b9c8af;box-shadow:0 3px 0 #d6dfcc,0 14px 21px -19px #28483b80}.handoff-document>span{font-size:8px;letter-spacing:.1em}.handoff-document>div{display:flex;align-items:center;justify-content:space-between;margin:12px 0}.handoff-document strong{font-size:25px;letter-spacing:-.05em;line-height:1.03;font-weight:450}.handoff-document em{font-family:Georgia,serif;font-weight:400}.ownership-mark{display:grid;place-items:center;border:1px solid #9eb396;border-radius:50%;width:49px;height:49px;font-size:27px;background:#f3f7ec;box-shadow:inset 0 0 0 4px #e5ecd9}.handoff-document>p{font-size:10px;border-top:1px solid #bdccb3;padding-top:11px}
.delivery-stage.art-arrive .delivery-art{animation:delivery-arrival .85s ease both}@keyframes delivery-arrival{from{opacity:.5;transform:translateY(8px)}to{opacity:1;transform:none}}
body:not(.motion-paused):not(.reduced-scene):not(.offer-document-hidden) .delivery-stage.art-arrive .delivery-art{animation-play-state:running!important}
@media(min-width:1000px) and (max-width:1199px){.demo-intro,.demo-pin{width:calc(100% - 88px)}.demo-enhanced .demo-copy-stack{width:35%}.demo-enhanced .demo-visual{left:41%;width:59%}.demo-copy h3{font-size:32px}.demo-copy>p{font-size:13px}.demo-brief-object .intake-art{width:272px;height:345px}}
@media(max-width:1099px){.delivery-art{max-width:570px;height:220px}.delivery-copy{max-width:65ch}.delivery-timeline{margin-left:5px}.delivery-stage{margin-bottom:39px}.delivery-node{top:16px}.delivery-stage h3{font-size:37px}.launch-delivery-art{height:230px}}
@media(max-width:999px){.demo-journey{padding:68px 0 56px}.demo-intro,.demo-pin{width:min(700px,calc(100% - 80px))}.demo-intro>p:last-child{max-width:590px}.demo-story{margin-top:44px}.demo-copy>p{max-width:53ch}.demo-phase{margin-bottom:39px}.demo-mobile-art{margin:18px auto 0}.demo-journey .process-close{margin-top:30px}.demo-journey .studio-arrival>span{left:40px}.demo-copy h3{font-size:35px;max-width:560px}}
@media(max-width:639px){.demo-journey{padding:52px 0 46px}.demo-intro,.demo-pin{width:calc(100% - 40px)}.demo-intro{padding-top:15px}.demo-eyebrow{font-size:10px;margin-bottom:17px}.demo-journey #process-title{font-size:47px;line-height:1.1;max-width:360px;margin-bottom:21px}.demo-intro>p:last-child{font-size:14px;line-height:1.75}.demo-story{margin-top:36px}.demo-phase{padding-left:16px;margin-bottom:35px}.demo-copy h3{font-size:29px;line-height:1.15;margin-bottom:16px}.demo-copy>p{font-size:13px;line-height:1.75}.demo-copy .demo-payoff{font-size:16px;margin-top:15px}.demo-copy .demo-reassurance{font-size:11px;margin-top:10px}.demo-mobile-art .intake-art{width:245px;height:310px}.demo-mobile-art .screen-art{aspect-ratio:1.31}.demo-mobile-art .screen-scene{inset:4% 0 7%}.demo-mobile-art .process-art figcaption{font-size:8px}.demo-journey .process-close h3{font-size:34px}.demo-journey .process-close>p{font-size:11px}.demo-journey .studio-arrival>span{left:20px;height:122px;top:-45px}.demo-copy-stack:before{bottom:120px}.delivery-timeline{padding-left:18px}.delivery-node{left:-22px;top:12px}.delivery-stage h3{font-size:32px;margin-bottom:14px}.delivery-copy{font-size:13px;line-height:1.75}.delivery-stage{margin-bottom:35px}.delivery-art{height:183px;gap:12px;margin-top:20px}.blueprint-book{padding:15px 13px;width:47%}.blueprint-book strong{font-size:23px}.blueprint-book>span:last-child{font-size:8px;line-height:1.5}.artifact-label{font-size:8px}.setup-files span{font-size:10px;padding:9px}.setup-input>p{font-size:9px}.build-delivery-art{gap:0;height:185px}.build-interface{height:140px;padding:9px}.build-layout{height:68px;gap:9px;margin-top:12px}.review-slip{padding:12px 9px}.review-slip strong{font-size:21px}.qa-stamp{left:5px;font-size:7px;padding:5px}.build-plan{padding:10px 7px}.build-plan svg{height:78px}.build-chrome span{font-size:6px}.launch-delivery-art{height:210px}.launch-sequence{font-size:9px;gap:5px}.handoff-document{padding:16px 18px}.delivery-entry{margin-bottom:25px}.delivery-balance{font-size:11px}}
@media(max-width:359px){.demo-intro,.demo-pin{width:calc(100% - 32px)}.demo-journey #process-title{font-size:41px}.demo-copy h3{font-size:26px}.demo-mobile-art .intake-art{width:221px;height:279px}.demo-copy .demo-payoff{font-size:14px}.demo-journey .process-close h3{font-size:30px}.setup-files span{font-size:9px}.blueprint-book{padding:12px 10px}.blueprint-book strong{font-size:21px}.artifact-arrow{font-size:18px}.delivery-art{gap:9px}.build-delivery-art{gap:0}.review-slip strong{font-size:19px}.review-slip i{font-size:7px}.build-plan>span{font-size:7px}.launch-sequence{font-size:8px}.purchase-principle p{font-size:11px}}
@media(prefers-reduced-motion:reduce){#range .range-products,#range .range-products>.showcase{scale:1;translate:none;opacity:1;filter:none}.demo-journey *{animation:none!important;transition:none!important}}
