/* The second act stays inside the same camera stage. */
html.motion .journey{height:1600svh}
.navigation.is-after{background:#000}
.continuation{position:absolute;inset:0;z-index:7;pointer-events:none;visibility:hidden}
.build-intro{position:absolute;top:13%;left:7%;right:7%;text-align:center}
.build-intro>p{color:#9da9ae;font-size:15px;margin-bottom:16px}
.build-intro h2{font-size:clamp(38px,4.6vw,72px);font-weight:450;letter-spacing:-.065em;line-height:1.02}
.build-visual{position:absolute;inset:0;perspective:1800px}
.build-window{position:absolute;left:50%;top:57%;width:68%;aspect-ratio:1.65;transform:translate(-50%,-50%);border:1px solid #ffffff30;box-shadow:0 24px 90px #0006;background:#101314;border-radius:9px;overflow:hidden;container-type:inline-size}
.window-toolbar{position:relative;height:8%;min-height:23px;padding:0 3%;display:flex;align-items:center;justify-content:space-between;font-size:clamp(8px,1.2cqw,12px);color:#a8b1b6;background:#141718}
.window-dots{font-size:7px;letter-spacing:3px;color:#566166}
.preview-tools{margin-left:auto;display:flex;align-items:center;gap:10px}
.preview-tools[hidden],.preview-reset[hidden]{display:none}
.preview-tools button{padding:5px 0;border:0;background:none;color:#c9d6d0;font:inherit;cursor:pointer}
.preview-tools button:hover{color:#fff}
.preview-tools button:focus-visible{outline:1px solid #c9d6d0;outline-offset:3px}
.preview-reset{font-size:16px!important;line-height:1}
.is-editable .preview-tools,.is-editable [data-preview-edit]{pointer-events:auto}
[data-preview-edit],[data-preview-mirror]{overflow-wrap:anywhere;white-space:pre-line}
.finished-header strong[data-preview-edit]{max-width:49%}
.finished-nav{display:flex;gap:12px;max-width:45%}
.finished-nav [data-preview-edit]{min-width:0}
.finished-footer [data-preview-edit]{max-width:46%}
.window-toolbar [data-preview-edit="url"]{position:absolute;left:50%;transform:translateX(-50%);text-align:center;width:36%;max-width:36%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.sample-cta[data-preview-edit]{max-width:100%}
.finished-copy>[data-preview-edit="eyebrow"]{display:block}
.finished-footer>[data-preview-edit]{max-width:46%}
.is-editable [data-preview-edit]{cursor:text;border-radius:2px;outline:1px dashed transparent;outline-offset:5px}
.is-editable [data-preview-edit]:hover{outline-color:#293f3666}
.is-editable [data-preview-edit]:focus{outline:1px solid #526e60;background:#ffffff38}
.is-editable .window-toolbar [data-preview-edit]:focus{outline-color:#c9d6d0;background:#ffffff12}
.is-editable [data-preview-edit]::selection{background:#b9d1bd;color:#172b22}
.wireframe{position:absolute;inset:8% 0 0;background:#0d1011}
.wireframe svg{display:block;width:100%;height:100%;overflow:hidden}
.wireframe path{fill:none;stroke:#b8c8c4;stroke-width:1.2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:.88}
.wireframe rect{fill:#ffffff05;opacity:0}
.finished-site{position:absolute;inset:8% 0 0;background:#e4eadf;color:#293f36}
.finished-header{height:17%;padding:0 5%;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:clamp(7px,1.3cqw,14px)}
.finished-header strong{font-size:clamp(20px,3.1cqw,36px);letter-spacing:-.06em;font-weight:550}
.finished-copy{position:absolute;left:5%;top:30%;width:43%}
.finished-copy>span:first-child{font-size:clamp(8px,1.35cqw,14px)}
.finished-copy h3{font:400 clamp(30px,6.2cqw,78px)/.98 Georgia,serif;letter-spacing:-.055em;margin:6% 0}
.finished-copy>p{font-size:clamp(8px,1.5cqw,16px);line-height:1.5}
.sample-cta{display:inline-block;background:#293f36;color:#f1f4ed;font-size:clamp(7px,1.2cqw,13px);padding:3% 5%;margin-top:8%}
.finished-site>img{position:absolute;left:52%;top:19%;width:43%;height:69%;object-fit:cover;object-position:60% 50%;border-radius:40% 40% 0 0}
.finished-footer{position:absolute;bottom:3%;left:5%;right:5%;display:flex;justify-content:space-between;gap:15px;font-size:clamp(6px,1cqw,12px);color:#4d6257}
.build-phone{position:absolute;left:77%;top:62%;width:190px;height:370px;transform:translate(-50%,-50%);background:#e4eadf;border:7px solid #202525;outline:1px solid #69716e;border-radius:30px;padding:20px 13px 16px;color:#293f36;box-shadow:0 20px 50px #0008;overflow:hidden}
.phone-camera{position:absolute;top:8px;left:43%;width:14%;height:4px;border-radius:5px;background:#202525}
.build-phone strong{display:block;font-size:17px;letter-spacing:-.05em;margin-bottom:12px}
.build-phone>img{width:100%;height:46%;object-fit:cover;border-radius:40% 40% 0 0}
.build-phone h3{font:400 27px/.98 Georgia,serif;letter-spacing:-.045em;margin:15px 0 12px}
.build-phone>span{font-size:8px;border-bottom:1px solid #293f3655;padding-bottom:3px}
.build-phone [data-preview-mirror="cta"]{display:inline-block;max-width:100%}
.build-caption{position:absolute;bottom:7%;left:10%;right:10%;text-align:center;height:76px}
.build-caption>p{position:absolute;inset:0;margin:0;display:flex;flex-direction:column;gap:10px}
.build-caption strong{font-size:clamp(18px,1.9vw,27px);font-weight:450;letter-spacing:-.03em}
.build-caption span{font-size:14px;color:#9ca7ae;line-height:1.5}
.continuation .offer{position:absolute;left:58%;top:18%;width:35%;min-height:0;padding:0;display:block;background:none;pointer-events:auto}
.offer-eyebrow{font-size:14px;color:#a1adb4;margin-bottom:18px}
.continuation .offer h2{font-size:clamp(33px,3.2vw,51px);line-height:1.06;letter-spacing:-.055em;font-weight:450}
.continuation .price{font-size:clamp(64px,6vw,94px);margin:25px 0 23px}
.continuation .price>span{font-size:13px;margin-bottom:8px}
.offer-included{padding:0;list-style:none;margin:0;display:grid;gap:12px;font-size:14px;line-height:1.4}
.offer-included li{padding-left:20px;position:relative}
.offer-included li:before{content:'✓';position:absolute;left:0;color:#9eb7a8;font-size:12px}
.offer-fineprint{font-size:12px;line-height:1.7;color:#9ca7ae;max-width:43ch;margin:22px 0 0}
.continuation .contact-button{max-width:100%;margin-top:25px}
.practical{padding:120px 7% 145px;display:grid;grid-template-columns:1fr 1.5fr;gap:12%;background:#000;position:relative;z-index:8}
.practical>div>p{font-size:14px;color:#9ca7ae;margin-bottom:22px}
.practical h2{font-size:clamp(34px,4vw,60px);letter-spacing:-.055em;line-height:1.05;font-weight:450}
.questions details{border-bottom:1px solid #ffffff26}
.questions details:first-child{border-top:1px solid #ffffff26}
.questions summary{list-style:none;display:flex;justify-content:space-between;gap:25px;cursor:pointer;padding:24px 0;font-size:17px;line-height:1.4}
.questions summary::-webkit-details-marker{display:none}
.questions summary>span{font-size:22px;font-weight:300;transition:transform .2s}
.questions details[open] summary>span{transform:rotate(45deg)}
.questions details>p{font-size:14px;line-height:1.8;color:#aab3b8;max-width:57ch;padding:0 36px 26px 0}
.questions summary:focus-visible{outline:2px solid #fff;outline-offset:5px}
.hello{background:#eef1ee;color:#151b18;padding:125px 7%;display:grid;grid-template-columns:1fr 1.25fr;gap:14%;scroll-margin-top:75px}
.hello-copy>p:first-child{font-size:14px;margin-bottom:24px;color:#626e66}
.hello h2{font-weight:450;letter-spacing:-.065em;font-size:clamp(43px,4.8vw,74px);line-height:1.02;margin-bottom:28px}
.hello-copy>p{font-size:15px;line-height:1.7;max-width:31ch;color:#626e66}
.hello-copy>a{display:inline-block;font-size:20px;margin-top:28px;border-bottom:1px solid #151b18;padding-bottom:5px}
.hello-copy .hello-person{margin-top:65px;font-size:14px;color:#151b18}
.hello-person span{color:#626e66;font-size:12px}
.hello-form{min-width:0;padding-top:3px;align-self:start}
.flow-progress{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;color:#626e66;font-size:12px;margin-bottom:34px}
.flow-progress>div{width:100%;height:2px;background:#ccd3ce}
.flow-progress i{display:block;background:#253e32;height:100%;width:33.333%;transition:width .25s}
.hello-form fieldset{border:0;padding:0;margin:0 0 28px;min-width:0}
.hello-form legend{padding:0;font-size:clamp(23px,2.5vw,34px);line-height:1.2;letter-spacing:-.045em;margin-bottom:28px}
.hello-form label{display:block;font-size:13px;margin:22px 0 9px;line-height:1.5}
.hello-form label[for]>span{color:#626e66;font-size:11px;margin-left:4px}
.hello-form input:not([type=radio]),.hello-form textarea{display:block;width:100%;min-width:0;max-width:100%;font:400 16px/1.6 Geist,Arial,sans-serif;color:#151b18;background:transparent;border:0;border-bottom:1px solid #a6b2aa;border-radius:0;padding:10px 0 12px;outline-offset:4px}
.hello-form input::placeholder,.hello-form textarea::placeholder{color:#778279;font-size:14px;opacity:1}
.hello-form textarea{resize:vertical;min-height:80px}
.hello-form input:focus-visible,.hello-form textarea:focus-visible{outline:2px solid #284938}
.goal-choices{display:grid;gap:9px}
.goal-choices label{display:flex;align-items:center;gap:13px;padding:14px 16px;margin:0;border:1px solid #bdc7c0;border-radius:4px;cursor:pointer;font-size:14px}
.goal-choices label:has(input:checked){background:#dde6df;border-color:#3b5847}
.goal-choices input{accent-color:#284938;width:16px;height:16px;flex-shrink:0}
.flow-note{font-size:12px;line-height:1.7;color:#626e66;margin-top:22px;max-width:49ch}
.flow-actions{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:32px}
.flow-actions button{border:0;border-radius:0;font-size:14px}
#flow-back{padding:12px 0;background:none;color:#515d55}
#flow-next,#flow-prepare,.mail-open{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:18px 24px;color:#fff;background:#1b2c22;min-width:170px;margin-left:auto;font-size:14px}
#flow-prepare:disabled{opacity:.45;cursor:not-allowed}
.mail-ready>p:not(.ready-label){font-size:14px;line-height:1.7;color:#626e66;max-width:46ch}
.mail-ready .ready-label{font-size:13px;color:#466d53;margin-bottom:18px}
.mail-ready h3{font-weight:450;font-size:40px;letter-spacing:-.055em;line-height:1.04;margin-bottom:22px}
.mail-ready #mail-draft{font-size:13px;line-height:1.7;background:#e4e9e4;padding:16px;border:1px solid #bdc7c0;resize:vertical;min-height:180px}
.mail-open{margin-top:24px;width:100%}
.draft-actions{display:flex;justify-content:space-between;gap:20px;margin-top:18px}
.draft-actions button{background:none;border:0;padding:8px 0;font-size:12px;color:#515d55}
.copy-status{min-height:20px;margin-top:12px;font-size:12px}
.site-footer{display:flex;justify-content:space-between;align-items:center;gap:30px;padding:35px 7%;background:#000;font-size:12px;color:#a0aab1}
.site-footer .brand{color:#f2f5f7}
@media(max-width:700px){
 .build-intro{top:12%}.build-intro h2{font-size:38px}.build-intro>p{font-size:12px}
 .build-window{width:86%;aspect-ratio:1}
 .build-phone{width:125px;height:248px;border-width:5px;border-radius:23px;padding:17px 10px 12px}
 .build-phone strong{font-size:12px;margin-bottom:8px}.build-phone h3{font-size:20px;margin:11px 0}.build-phone>span{font-size:6px}
 .build-caption{bottom:8%;left:8%;right:8%;height:84px}.build-caption span{font-size:12px;max-width:34ch;margin:auto}
 .continuation .offer{left:7%;width:86%;top:15%}.continuation .offer h2{font-size:38px}
 .continuation .price{font-size:74px;margin:22px 0}.offer-eyebrow{font-size:12px;margin-bottom:15px}
 .offer-included{font-size:13px;gap:10px}.offer-fineprint{font-size:11px;margin-top:19px}
 .continuation .contact-button{margin-top:22px;padding:18px 21px}
 .practical{padding:85px 7%;display:block}.practical>div:first-child{margin-bottom:40px}.practical h2{font-size:38px}.questions summary{font-size:15px;padding:21px 0}.questions details>p{font-size:13px;padding-right:12px}
 .hello{display:block;padding:80px 7%}.hello h2{font-size:49px}.hello-copy .hello-person{margin-top:30px}.hello-form{margin-top:55px}.hello-form legend{font-size:27px}.goal-choices label{font-size:13px}
 .site-footer{padding:28px 7%;gap:20px}.site-footer>p{display:none}
}
@container(max-width:420px){
 .finished-header{height:16%}.finished-header>span{font-size:6px}.finished-copy{top:39%;width:44%}.finished-copy h3{font-size:8cqw}.finished-copy>p{font-size:2.3cqw}.finished-copy>span:first-child{font-size:2.2cqw}.sample-cta{font-size:2cqw}
}
@media(max-height:700px) and (min-width:701px){.continuation .offer{top:14%}.continuation .offer h2{font-size:34px}.continuation .price{font-size:64px;margin:16px 0}.offer-included{gap:8px;font-size:12px}.offer-fineprint{margin-top:15px;font-size:11px}.continuation .contact-button{margin-top:15px;padding:15px 20px}}
html:not(.motion) .continuation{position:relative;visibility:visible;pointer-events:auto;padding:85px 7%}
html:not(.motion) .navigation{background:#000}
html:not(.motion) .build-intro{position:static;margin-bottom:45px}
html:not(.motion) .build-visual{position:relative;height:clamp(340px,60vw,650px)}
html:not(.motion) .build-window{top:45%;width:85%;transform:translate(-50%,-50%)}
html:not(.motion) .wireframe{display:none}
html:not(.motion) .build-phone{left:82%;top:60%;transform:translate(-50%,-50%) scale(.8)}
html:not(.motion) .build-caption{position:static;height:auto;text-align:left;display:grid;gap:30px;margin:40px auto 70px;max-width:760px}
html:not(.motion) .build-caption>p{position:static}
html:not(.motion) .continuation .offer{position:static;width:auto;max-width:700px;margin:auto}
@media(prefers-reduced-motion:reduce){.flow-progress i,.questions summary>span{transition:none}}

.contact-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.contact-status:empty{display:none}.contact-status{font-size:13px;line-height:1.7;color:#8b3326;margin-top:20px;max-width:52ch}.flow-note a{text-decoration:underline;text-underline-offset:3px}.contact-reference{font-size:12px!important}.hello-form[aria-busy="true"] .flow-actions button{cursor:wait}
