/* Option 2 / one continuous scene. No external typefaces or animation libraries. */
:root{--paper:#f5f2ec;--ink:#181b1c;--accent:#865333}body{background:var(--paper)}h1,h2,h3,em{font-family:Arial,Helvetica,sans-serif}em{font-style:normal}h1,h2{letter-spacing:-.055em}.site-header{padding-block:18px;border-bottom:0;min-height:96px}.brand{display:flex;align-items:center;gap:15px;text-decoration:none}.as-mark{width:48px;height:48px;object-fit:contain}.brand-name{font-size:18px;letter-spacing:.18em;font-weight:500;white-space:nowrap}.site-header nav{gap:21px}.site-header nav a{font-size:13px}.review-bar{background:#e8e2d8}.experience{position:relative}.experience-stage{position:relative;background:#181b1d}.scene-panel{background:var(--paper);position:relative;color:var(--ink)}.opening-panel{padding:62px 0 36px}.opening-panel h1{font-size:clamp(64px,8.4vw,126px);line-height:.98;font-weight:500;max-width:1200px}.opening-panel .eyebrow{font-size:10px;margin-bottom:28px}.opening-sub{font-size:clamp(20px,2.1vw,29px);line-height:1.35;margin:26px 0}.opening-panel .button{background:#171a1b;font-size:16px;padding:16px 24px}.scene-hint{font-size:12px;margin-top:25px!important;letter-spacing:.03em;color:#64615d}.scene-hint span{margin-left:20px}.form-fallback{height:460px;text-align:center;background:#191d1e}.form-fallback svg{height:100%;max-width:100%}#studio-form{display:none;width:100%;height:100%}.form-caption{display:none}.services-panel{padding:38px 0}.services-panel>.wrap{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.services-panel h2{font-size:clamp(40px,4.8vw,72px)}.services-panel p:not(.eyebrow){margin-top:18px;line-height:1.4}.services-panel .eyebrow{margin-bottom:15px}.reveal-services a{display:flex;gap:20px;justify-content:space-between;padding:16px 0;border-bottom:1px solid #b6b1a8;text-decoration:none;font-size:clamp(17px,1.7vw,25px);line-height:1.2}.reveal-services a:first-child{border-top:1px solid #b6b1a8}.handover-panel{padding:55px 0}.handover-panel h2{font-size:clamp(48px,6.5vw,96px);line-height:1.02}.handover-panel p:not(.eyebrow){margin:25px 0;font-size:22px;line-height:1.4}.scene-controls{display:none}.experience:is(.enhanced,.scene-pending){height:370svh}:is(.enhanced,.scene-pending) .experience-stage{position:sticky;top:0;height:100svh;min-height:0;overflow:hidden}:is(.enhanced,.scene-pending) #studio-form{position:absolute;inset:0;display:block}:is(.enhanced,.scene-pending) .form-fallback{display:none}:is(.enhanced,.scene-pending) .scene-panel{position:absolute;left:0;right:0;will-change:transform}:is(.enhanced,.scene-pending) .opening-panel{top:0;min-height:74%;padding-top:48px}:is(.enhanced,.scene-pending) .services-panel{bottom:0;padding-bottom:85px;transform:translateY(105%)}:is(.enhanced,.scene-pending) .handover-panel{top:0;bottom:0;background:transparent;display:flex;align-items:center;transform:translateX(-105%)}:is(.enhanced,.scene-pending) .handover-panel>.wrap{pointer-events:none}:is(.enhanced,.scene-pending) .handover-panel a{pointer-events:auto}:is(.enhanced,.scene-pending) .handover-panel h2{max-width:50%}:is(.enhanced,.scene-pending) .form-caption{display:block;position:absolute;left:56px;bottom:95px;color:#f5f2ec;opacity:0}.form-caption span{font-size:10px;letter-spacing:.12em}.form-caption p{font-size:24px;line-height:1.2;margin-top:18px;letter-spacing:.02em}:is(.enhanced,.scene-pending) .scene-controls{position:absolute;display:flex;gap:8px;bottom:20px;left:50%;transform:translateX(-50%);padding:6px;background:#f5f2ec;border:1px solid #aba49a}.scene-controls button{border:0;background:transparent;color:#3f3b36;font-size:11px;min-height:38px;padding:7px 12px;cursor:pointer;white-space:nowrap}.scene-controls button span{margin-left:8px}.scene-controls button[aria-pressed=true]{background:#232728;color:white}.scene-controls button:focus-visible{outline:2px solid #865333;outline-offset:2px}.service-editorial h3,.industry-row h3{font-weight:500}.web-feature{background:#e7e0d5}.browser-concept{box-shadow:none;transform:none}.building-band{background:#e7e0d5;padding:90px 0}.building-band h2{font-size:clamp(38px,5vw,70px);line-height:1.04}.building-band .wrap>p:not(.eyebrow){font-size:20px;max-width:690px;margin-block:25px}.building-band .article-grid{margin-top:40px}.agency-intro h1{font-size:clamp(54px,6.5vw,92px)}.agency-footer{background:#e7e0d5}.agency-cta{background:#191e20;color:#f5f2ec}.agency-cta .eyebrow{color:#dfaf86}.agency-cta .button{border-color:#f5f2ec;color:#181b1c;background:#f5f2ec}
@media(max-width:1100px){.site-header{flex-wrap:wrap}.menu-toggle{display:block;border:1px solid #aaa;background:transparent;padding:10px 14px;min-height:44px;margin-left:auto}.site-header nav{flex-basis:100%;flex-wrap:wrap;padding-top:18px}.js .site-header nav{display:none}.js .site-header nav.open{display:flex}.site-header .brand-name{font-size:16px}html:not(.js) .menu-toggle{display:none}}
@media(max-width:760px){.site-header{min-height:80px;padding-block:14px}.as-mark{width:35px;height:35px}.brand{gap:10px}.brand-name,.site-header .brand-name{font-size:13px;letter-spacing:.13em}.opening-panel{padding-top:32px}.opening-panel h1{font-size:clamp(42px,11.8vw,78px);letter-spacing:-.06em}.opening-panel .eyebrow{font-size:9px;margin-bottom:24px}.opening-sub{font-size:19px;margin-block:24px}.opening-panel .button{font-size:14px}.scene-hint{font-size:11px}.experience:is(.enhanced,.scene-pending){height:320svh}:is(.enhanced,.scene-pending) .experience-stage{min-height:0}:is(.enhanced,.scene-pending) .opening-panel{padding-top:28px;min-height:70%;padding-bottom:20px}:is(.enhanced,.scene-pending) .services-panel{padding:25px 0 85px}.services-panel>.wrap{grid-template-columns:1fr;gap:25px}.services-panel h2{font-size:40px}.services-panel p:not(.eyebrow){font-size:16px;margin-top:12px}.reveal-services a{font-size:18px;padding:13px 0}:is(.enhanced,.scene-pending) .form-caption{left:20px;bottom:95px}.form-caption p{font-size:21px}:is(.enhanced,.scene-pending) .handover-panel{top:auto;bottom:0;padding:25px 0 90px;display:block;background:linear-gradient(transparent,#f5f2ec 12%)}:is(.enhanced,.scene-pending) .handover-panel h2{font-size:47px;max-width:100%;line-height:1}.handover-panel .eyebrow{margin-bottom:15px}.handover-panel p:not(.eyebrow){font-size:17px;margin:18px 0}.handover-panel .button{padding:12px 18px;min-height:48px}.scene-controls button{padding:6px 8px;font-size:10px}.scene-controls button span{margin-left:4px}:is(.enhanced,.scene-pending) .scene-controls{bottom:15px;width:max-content;max-width:calc(100% - 32px)}.building-band{padding:60px 0}.form-fallback{height:340px}.agency-intro h1{font-size:50px}.services-panel .eyebrow{font-size:10px}.handover-panel{padding:40px 0}}
@media(prefers-reduced-motion:reduce){.experience:is(.enhanced,.scene-pending){height:auto}:is(.enhanced,.scene-pending) .experience-stage{position:relative;height:auto;min-height:0;overflow:visible}:is(.enhanced,.scene-pending) .scene-panel{position:relative;transform:none!important;opacity:1!important;inset:auto;will-change:auto}:is(.enhanced,.scene-pending) .form-fallback{display:block}:is(.enhanced,.scene-pending) #studio-form,:is(.enhanced,.scene-pending) .form-caption,:is(.enhanced,.scene-pending) .scene-controls{display:none}:is(.enhanced,.scene-pending) .handover-panel{background:var(--paper);padding:45px 0}:is(.enhanced,.scene-pending) .handover-panel h2{max-width:100%}:is(.enhanced,.scene-pending) .services-panel{padding:40px 0}:is(.enhanced,.scene-pending) .opening-panel{padding:35px 0}}

/* Stable small-viewport sizing avoids toolbar resize jumps. Short landscape screens use natural flow. */
:is(.enhanced,.scene-pending) .experience-stage{height:100vh;height:100svh;isolation:isolate}
.article-art.art-0 span{font-size:clamp(25px,3.1vw,38px);letter-spacing:-.055em}
.link-arrow{display:inline-block;width:1em;height:1em;flex-shrink:0;vertical-align:-.12em;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:360px){.article-art.art-0{padding:22px}.article-art.art-0 span{font-size:25px}:is(.enhanced,.scene-pending) .services-panel h2{font-size:34px}:is(.enhanced,.scene-pending) .services-panel>.wrap{gap:14px}:is(.enhanced,.scene-pending) .reveal-services a{font-size:16px;padding:10px 0}}
@media(prefers-reduced-motion:reduce){:is(.enhanced,.scene-pending) .experience-stage{height:auto}}

.offering-summary{font-size:clamp(19px,2.1vw,27px);line-height:1.4;margin-block:24px;max-width:42ch}.confidentiality-note{border-top:1px solid var(--line);padding-top:28px;margin-block:32px}.confidentiality-note h2{font-size:28px;margin-bottom:16px}.confidentiality-note p{font-size:16px}.row-arrow .link-arrow{width:22px;height:22px}

.form-fallback img{display:block;width:100%;height:100%;object-fit:contain}
/* V3.22: the form is visible from the opening frame; copy never acts as a curtain. */
:is(.enhanced,.scene-pending) .scene-panel{background:transparent;top:0;bottom:0;min-height:0;display:flex;align-items:center;padding:0 0 80px;pointer-events:none;will-change:opacity,transform}
:is(.enhanced,.scene-pending) .scene-panel>.wrap{pointer-events:none}:is(.enhanced,.scene-pending) .scene-panel a{pointer-events:auto}
:is(.enhanced,.scene-pending) .opening-panel,:is(.enhanced,.scene-pending) .services-panel{color:#f5f2ec}:is(.enhanced,.scene-pending) .opening-panel .eyebrow,:is(.enhanced,.scene-pending) .services-panel .eyebrow{color:#dfb18a}
:is(.enhanced,.scene-pending) .opening-panel h1{font-size:clamp(48px,5.4vw,83px);max-width:49%;line-height:1.02}
:is(.enhanced,.scene-pending) .opening-sub{font-size:clamp(17px,1.6vw,23px);max-width:43%;line-height:1.45;margin-block:24px}
:is(.enhanced,.scene-pending) .opening-panel .button{background:#f5f2ec;color:#191f21;border-color:#f5f2ec}:is(.enhanced,.scene-pending) .scene-hint{color:#d2c7bb}
:is(.enhanced,.scene-pending) .services-panel>.wrap{display:block}:is(.enhanced,.scene-pending) .services-panel>.wrap>div{max-width:43%}:is(.enhanced,.scene-pending) .services-panel h2{font-size:clamp(40px,4.6vw,66px)}:is(.enhanced,.scene-pending) .reveal-services{margin-top:25px}:is(.enhanced,.scene-pending) .reveal-services a{color:#f5f2ec;border-color:#81776b;font-size:20px}
:is(.enhanced,.scene-pending) .handover-panel{background:transparent}:is(.enhanced,.scene-pending) .handover-panel h2{font-size:clamp(48px,5.6vw,81px);max-width:44%}:is(.enhanced,.scene-pending) .handover-panel p:not(.eyebrow){font-size:20px}
:is(.enhanced,.scene-pending) .form-caption{left:auto;right:56px;bottom:90px;text-align:right;pointer-events:none}.form-caption p{font-size:18px;margin-top:10px}
:is(.enhanced,.scene-pending) #studio-form{touch-action:pan-y pinch-zoom}.experience:is(.enhanced,.scene-pending){height:330svh}
@media(max-width:760px){.experience:is(.enhanced,.scene-pending){height:320svh}:is(.enhanced,.scene-pending) .scene-panel{top:auto;bottom:65px;padding:0;display:block}:is(.enhanced,.scene-pending) .scene-panel>.wrap{width:calc(100% - 40px)}:is(.enhanced,.scene-pending) .opening-panel h1{font-size:clamp(35px,9.4vw,49px);max-width:100%;line-height:1.02}:is(.enhanced,.scene-pending) .opening-sub{font-size:16px;line-height:1.35;max-width:100%;margin-block:14px}:is(.enhanced,.scene-pending) .opening-panel .eyebrow{font-size:8px;margin-bottom:15px}:is(.enhanced,.scene-pending) .opening-panel .button{font-size:14px;padding:12px 18px;min-height:44px}:is(.enhanced,.scene-pending) .scene-hint{font-size:10px;margin-top:14px!important}:is(.enhanced,.scene-pending) .services-panel>.wrap>div{max-width:100%}:is(.enhanced,.scene-pending) .services-panel h2{font-size:34px}:is(.enhanced,.scene-pending) .services-panel p:not(.eyebrow){font-size:15px;margin-top:10px}:is(.enhanced,.scene-pending) .reveal-services{margin-top:14px}:is(.enhanced,.scene-pending) .reveal-services a{font-size:17px;padding:10px 0}:is(.enhanced,.scene-pending) .handover-panel h2{font-size:39px;max-width:100%}:is(.enhanced,.scene-pending) .handover-panel p:not(.eyebrow){font-size:16px;margin-block:14px}:is(.enhanced,.scene-pending) .handover-panel .eyebrow{font-size:9px;margin-bottom:12px}:is(.enhanced,.scene-pending) .form-caption{display:none}}
@media(prefers-reduced-motion:reduce){.experience:is(.enhanced,.scene-pending){height:auto}:is(.enhanced,.scene-pending) .scene-panel{position:relative;inset:auto;display:block;padding:35px 0;background:var(--paper);color:var(--ink)}:is(.enhanced,.scene-pending) .opening-panel h1,:is(.enhanced,.scene-pending) .opening-sub,:is(.enhanced,.scene-pending) .services-panel>.wrap>div,:is(.enhanced,.scene-pending) .handover-panel h2{max-width:100%}}

:is(.enhanced,.scene-pending) .scene-panel{transition:opacity .2s ease,transform .2s ease}:is(.enhanced,.scene-pending) .form-caption{display:none}
@media(prefers-reduced-motion:reduce){:is(.enhanced,.scene-pending) .scene-panel{transition:none}}

/* Compact landscape retains the same scroll morph, with copy beside the form. */
@media (max-height:559px) and (orientation:landscape) and (prefers-reduced-motion:no-preference){
 .experience:is(.enhanced,.scene-pending){height:340svh}
 :is(.enhanced,.scene-pending) .scene-panel{top:0;bottom:0;display:flex;align-items:center;padding:12px 0 60px}
 :is(.enhanced,.scene-pending) .scene-panel>.wrap{width:calc(100% - 48px)}
 :is(.enhanced,.scene-pending) .opening-panel h1,:is(.enhanced,.scene-pending) .handover-panel h2{font-size:clamp(26px,4.5vw,40px);max-width:46%;line-height:1.02}
 :is(.enhanced,.scene-pending) .opening-sub{font-size:13px;max-width:45%;margin-block:10px;line-height:1.3}
 :is(.enhanced,.scene-pending) .scene-panel .eyebrow{font-size:8px;margin-bottom:8px}
 :is(.enhanced,.scene-pending) .scene-panel .button{font-size:12px;padding:8px 12px;min-height:44px}
 :is(.enhanced,.scene-pending) .scene-hint{font-size:9px;margin-top:8px!important}
 :is(.enhanced,.scene-pending) .services-panel>.wrap>div{max-width:45%}
 :is(.enhanced,.scene-pending) .services-panel h2{font-size:28px}
 :is(.enhanced,.scene-pending) .services-panel p:not(.eyebrow){font-size:12px;margin-top:6px}
 :is(.enhanced,.scene-pending) .reveal-services{margin-top:8px}
 :is(.enhanced,.scene-pending) .reveal-services a{font-size:13px;padding:7px 0;min-height:32px}
 :is(.enhanced,.scene-pending) .handover-panel p:not(.eyebrow){font-size:13px;max-width:43%;margin-block:10px}
 :is(.enhanced,.scene-pending) .scene-controls{bottom:7px;padding:3px}
 .scene-controls button{min-height:38px}
}

/* Static opening uses the final stage footprint until the first rendered frame. */
.scene-pending .scene-panel:not(.opening-panel),.scene-pending .scene-controls{visibility:hidden;pointer-events:none}
.scene-pending .form-fallback{display:block;position:absolute;right:2%;top:8%;width:52%;height:78%;background:transparent}
.scene-pending #studio-form{visibility:hidden}
@media(max-width:760px) and (orientation:portrait){.scene-pending .form-fallback{top:0;right:10%;width:80%;height:42%}}
/* Reserve a separate 70px control row plus 24px gap; no CTA can enter it. */
@media(max-width:760px) and (orientation:portrait){
 :is(.enhanced,.scene-pending) .scene-panel{bottom:100px}
 :is(.enhanced,.scene-pending) .scene-controls{bottom:16px;box-sizing:border-box;max-width:calc(100% - 24px)}
 :is(.enhanced,.scene-pending) .scene-controls button{min-height:44px}
 :is(.enhanced,.scene-pending) .handover-panel>.wrap{display:flow-root}
 :is(.enhanced,.scene-pending) .handover-panel .button{display:inline-flex;align-items:center}
}
@media(max-height:559px) and (orientation:landscape){
 :is(.enhanced,.scene-pending) .scene-panel{padding-bottom:84px}
 :is(.enhanced,.scene-pending) .scene-controls button{min-height:44px}
 :is(.enhanced,.scene-pending) .handover-panel .button{display:inline-flex;align-items:center}
}
.scene-pending .experience-stage{background:#0e1213}

/* Matching opening render dissolves over the first live frame without moving copy. */
.scene-poster{display:none;pointer-events:none}
:is(.enhanced,.scene-pending) .scene-poster{display:block;position:absolute;inset:0;width:100%;height:100%;opacity:0;transition:opacity .24s ease-out}
:is(.enhanced,.scene-pending) .scene-poster img{display:block;width:100%;height:100%;object-fit:fill}
.scene-pending .scene-poster{opacity:1}
.scene-pending .form-fallback{display:none}
@media(prefers-reduced-motion:reduce){.scene-poster{display:none!important;transition:none!important}}
