.approved-build{background:#edf3f8;color:#10263d;padding-block:130px;min-height:850px}
.approved-build .section-heading p,.approved-build .service-item p,.approved-build .service-item li{color:#465f77;font-size:20px!important}
.approved-build{padding-block:55px;min-height:820px;overflow:hidden}.approved-build .build-intro{grid-template-columns:.85fr 1.15fr;gap:30px;margin-bottom:0;min-height:710px}.approved-build .services-list{display:block;margin-top:32px}.approved-build .service-item{padding-top:18px;margin-top:14px;border:0}.approved-build .service-item h3{margin-bottom:8px}.approved-build .service-item p{margin-block:6px}.approved-build .service-item details{margin-top:6px}.approved-build .section-heading{max-width:none}.approved-build .section-heading>p{margin-top:18px}.approved-build .workflow-art{height:760px;aspect-ratio:auto;overflow:hidden;background:#edf3f8;margin-inline-end:var(--art-bleed,-40px);border-radius:0}.approved-build .workflow-caption{bottom:20px}.approved-build .section-heading h2{font-size:clamp(40px,4vw,60px)}
.approved-build .service-item summary{color:#10263d;font-size:18px!important}.approved-build .service-item h3{font-size:28px}.approved-build .service-item{border-color:#a4b8ca}.approved-build .build-intro{gap:60px}.approved-build h2{font-size:clamp(42px,4.3vw,64px)}

.booking-section{background:#091c2f;min-height:720px;display:flex;align-items:center;padding-block:120px}.booking-section>.red-wrap{width:100%}.booking-intro{text-align:center}.booking-intro p{color:#b9ccde;font-size:22px;margin-top:22px}
.booking-form{max-width:780px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:28px}.booking-form-heading{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.booking-form label{display:flex;flex-direction:column;gap:12px;font-size:19px}.booking-form input,.booking-form textarea{width:100%;min-height:58px;border:1px solid #7890a8;border-radius:5px;background:#edf3f8;color:#10263d;padding:14px;font:inherit}.booking-form textarea{resize:vertical}.booking-form input:focus,.booking-form textarea:focus{outline:3px solid #458fff;outline-offset:3px}.booking-form .full{grid-column:1/-1}.booking-notice{font-size:17px!important;color:#b9ccde}.booking-result{font-size:19px;color:#c2e0ff}.booking-close{background:transparent;color:#eaf3fa;border:1px solid #67819a;border-radius:4px;padding:10px 16px;min-height:44px;font-size:17px;cursor:pointer}.booking-section [hidden]{display:none!important}
@media(max-width:720px){.approved-build{padding-block:80px;min-height:0}.approved-build .build-intro{gap:35px}.approved-build .service-item p,.approved-build .service-item li{font-size:18px!important}.booking-section{min-height:540px;padding-block:90px}.booking-form{grid-template-columns:1fr}.booking-form-heading h2{font-size:34px}.booking-intro p{font-size:19px}}

@media(max-width:720px){.approved-build .build-intro{grid-template-columns:1fr;min-height:0;gap:15px}.approved-build .workflow-art{height:430px;margin-inline:-22px;grid-row:2}.approved-build .service-item p{font-size:18px!important}.approved-build{padding-bottom:0}.approved-build .section-heading h2{font-size:40px}}

.approved-build .workflow-word{color:#10263d;text-shadow:none}

/* Concept A: a substantial pale landscape and a separate, stationary action. */
.booking-section{position:relative;isolation:isolate;background:#e8f2f9;color:#10263d;min-height:760px;overflow:hidden;padding-block:150px}
.booking-section:before{content:"";position:absolute;z-index:-1;inset:0;background:url('/images/booking-pale-mountains.webp') center bottom/cover no-repeat;opacity:.4;pointer-events:none}
.booking-intro{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:80px;text-align:start;padding-bottom:95px}
.booking-copy h2{font-size:clamp(58px,6.7vw,100px);line-height:1.06;letter-spacing:-.045em;margin:0;color:#10263d}
html[dir=rtl] .booking-copy h2{letter-spacing:normal}
.booking-intro p{color:#465f77;font-size:22px;max-width:430px;line-height:1.5;margin-top:24px}

.booking-form{background:#e8f2f9e8;padding:35px;border-radius:8px}
.booking-notice,.booking-result{color:#465f77}.booking-close{color:#10263d;border-color:#7890a8}

.approved-build .workflow-word{font-size:clamp(24px,2.4vw,35px);white-space:nowrap;color:#245fc4;line-height:1.2}
.approved-build .workflow-word[data-tone="1"]{color:#566779}
.approved-build .workflow-word[data-tone="2"]{color:#fff;text-shadow:0 1px 4px #163956,0 0 14px #163956}
@media(max-width:720px){.booking-section{min-height:680px;padding-block:100px}.booking-intro{grid-template-columns:1fr;gap:55px;padding-bottom:80px}.booking-copy h2{font-size:60px}.booking-intro p{font-size:20px}.booking-form{padding:18px}.booking-section:before{background-size:auto 65%;background-position:40% bottom}}

.booking-section:before{background-size:100% auto;background-position:center bottom;opacity:.28}@media(max-width:720px){.booking-section:before{background-size:auto 55%}}

/* Reuse the user's exact Concept A mountain pixels, without reinterpreting them. */
.booking-section{background:#e5f2f9;min-height:740px;align-items:flex-start;padding-top:100px;padding-bottom:310px}
.booking-section:before{display:none}
.booking-reference-landscape{position:absolute;z-index:-1;inset-inline-start:0;bottom:0;width:min(850px,72%);aspect-ratio:396/175;overflow:hidden;pointer-events:none;mask-image:linear-gradient(to right,#000 82%,transparent),linear-gradient(to bottom,transparent,#000 14%);mask-composite:intersect}
.booking-reference-landscape img{display:block;width:100%;max-width:none;height:auto;transform:translateY(-36.2%)}
.booking-intro{padding-bottom:0;align-items:center}
.booking-copy h2{font-size:clamp(58px,6.2vw,90px);letter-spacing:-.035em}
.booking-dialog{padding:0;border:1px solid #bdd1df;border-radius:16px;background:#edf5fa;color:#10263d;width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 40px);margin:auto;overflow:auto;box-shadow:0 24px 100px #03182c55}
.booking-dialog::backdrop{background:#071c3599;backdrop-filter:blur(4px)}
.booking-dialog .booking-form{padding:36px;background:transparent;gap:22px}
.booking-dialog .booking-form-heading{margin-bottom:0}.booking-dialog h2{font-size:38px;margin:0;line-height:1.1}
.booking-dialog .booking-form label{font-size:17px;gap:8px}.booking-dialog input,.booking-dialog textarea{background:#fff}
.booking-dialog .booking-notice{margin:0}.booking-dialog .booking-result:empty{display:none}
.booking-dialog [hidden]{display:none!important}
.approved-build .workflow-word{position:relative;z-index:4;text-align:center;max-width:none}
@media(max-width:720px){.booking-section{min-height:720px;padding-top:75px;padding-bottom:250px}.booking-copy h2{font-size:55px}.booking-intro{gap:38px}.booking-reference-landscape{width:100%;bottom:20px;mask-image:linear-gradient(to bottom,transparent,#000 10%)}.booking-dialog .booking-form{padding:24px;gap:16px}.booking-dialog h2{font-size:30px}.booking-dialog .booking-form-heading{gap:12px}.booking-dialog .booking-form input{min-height:48px}.booking-dialog textarea{min-height:80px}}

/* Blender geometry replaces the enlarged reference screenshot. */
.booking-reference-landscape{width:100%;height:57%;aspect-ratio:auto;bottom:0;inset-inline:0;mask-image:linear-gradient(to bottom,transparent 0%,#000 18%);mask-composite:add;opacity:.72}
.booking-reference-landscape img,.booking-reference-landscape canvas{position:absolute;inset:0;width:100%;height:100%;display:block;transform:none;object-fit:cover;object-position:center bottom}
.booking-reference-landscape canvas{opacity:0}.booking-terrain-ready canvas{opacity:1}.booking-terrain-ready img{visibility:hidden}
@media(max-width:720px){.booking-reference-landscape{height:39%;width:180%;inset-inline-start:-40%;bottom:0}}

/* Selected centered horizon concept: native layered Blender terrain. */
.booking-section{height:880px;min-height:880px;display:block!important;padding:128px 0 0;background:#e5f2f9}
.booking-section>.red-wrap{position:relative;z-index:1}
.booking-intro{display:flex;flex-direction:column;align-items:center;gap:30px;margin:0;text-align:center;padding:0}
.booking-copy h2{font-size:clamp(48px,5.4vw,84px);line-height:1.08;letter-spacing:-.04em;max-width:1100px;margin:auto;color:#091d36}
.booking-intro p{font-size:23px;max-width:720px;margin:24px auto 0;line-height:1.5;color:#405d7c}

.booking-reference-landscape{width:100%;height:52%;inset:auto 0 0;opacity:1;mask-image:linear-gradient(to bottom,transparent 0%,#000 22%)}
[dir=rtl] .booking-copy h2{letter-spacing:0}
@media(max-width:720px){.booking-section{height:780px;min-height:780px;padding-top:85px}.booking-copy h2{font-size:48px;max-width:360px}.booking-intro p{font-size:19px;max-width:340px}.booking-intro{gap:22px}.booking-reference-landscape{width:180%;height:47%;inset:auto auto 0 -40%}}

/* Reference-projected Blender layers retain the selected artwork and lighting. */
.booking-section{height:clamp(760px,52.63vw,940px);min-height:760px;padding-top:clamp(130px,11.9vw,200px);background:#e3effd}
.booking-reference-landscape{width:100%;height:auto;aspect-ratio:1672/370;inset:auto 0 0;overflow:visible;mask-image:none;opacity:1}
.booking-reference-landscape .booking-depth-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;transform:translate3d(0,var(--depth-y,0px),0);visibility:visible;will-change:transform}

.booking-intro p{max-width:820px;font-size:24px}
@media(max-width:720px){.booking-section{height:760px;min-height:760px;padding-top:85px}.booking-copy h2{font-size:46px}.booking-intro p{font-size:19px;max-width:340px}.booking-reference-landscape{width:210%;height:auto;aspect-ratio:1672/500;inset:auto auto 0 -55%}.booking-reference-landscape .booking-depth-layer{object-fit:fill}}
@media(prefers-reduced-motion:reduce){.booking-reference-landscape .booking-depth-layer{will-change:auto;transform:none!important}}

/* Actual Blender meshes, rendered live; no artwork planes or image layers. */
.booking-reference-landscape{width:100%;height:49%;aspect-ratio:auto;inset:auto 0 0;overflow:hidden;mask-image:linear-gradient(to bottom,transparent,#000 16%)}
.booking-reference-landscape canvas{width:100%;height:100%;opacity:1}

@media(max-width:720px){.booking-reference-landscape{width:180%;height:40%;inset:auto auto 0 -40%}}

.booking-reference-landscape{height:44%}@media(max-width:720px){.booking-reference-landscape{height:40%}}

/* Approved static artwork restored at the user�s request. */
.booking-reference-landscape{height:auto;aspect-ratio:2508/555;width:100%;inset:auto 0 0;mask-image:none;overflow:hidden}.booking-reference-landscape img{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;transform:none;visibility:visible}@media(max-width:720px){.booking-reference-landscape{width:210%;height:auto;aspect-ratio:2508/555;inset:auto auto 0 -55%}}

/* Finish the page with the booking landscape and a compact coordinated footer. */
.mountop-footer{background:#e3effd!important;border-color:#b8cde0!important;color:#17344f}
.mountop-footer>div{padding-block:24px}
.mountop-footer>div>div:first-child{align-items:center;gap:24px;grid-template-columns:1.4fr 1fr 1.5fr}
.mountop-footer h2,.mountop-footer a,.mountop-footer p{color:#34536f!important;font-size:15px!important}
.mountop-footer img{filter:brightness(.22)}
.mountop-footer .max-w-sm>p,.mountop-footer h2{display:none}
.mountop-footer nav ul{display:flex;gap:20px;margin:0}.mountop-footer nav li{margin:0!important}
.mountop-footer>div>div:last-child{margin-top:20px;padding-top:16px;border-color:#b8cde0}
.mountop-footer ul{margin-top:0}.mountop-footer a{min-height:44px;display:inline-flex;align-items:center}
@media(max-width:720px){
 .booking-section{height:calc(100svh - 225px);min-height:560px;padding-top:64px}
 .booking-copy h2{font-size:42px}.booking-intro{gap:18px}.booking-intro p{margin-top:18px}
 .mountop-footer>div{padding-block:16px}
 .mountop-footer>div>div:first-child{grid-template-columns:1fr;gap:6px}
 .mountop-footer .max-w-sm{display:none}
 .mountop-footer nav ul{justify-content:center}
 .mountop-footer>div>div:first-child>div:last-child{text-align:center}
 .mountop-footer>div>div:last-child{margin-top:8px;padding-top:12px;text-align:center}
}

/* Selected taller alpine artwork, restrained blue net; native text and modal. */
.booking-reference-landscape{inset:0;width:100%;height:100%;aspect-ratio:auto;mask-image:linear-gradient(to bottom,transparent,#000 22%);overflow:hidden}
.booking-reference-landscape img{width:100%;height:100%;object-fit:cover;object-position:center bottom}
.booking-copy h2{font-size:clamp(42px,5.3vw,82px);max-width:1200px;margin-inline:auto}
.booking-intro p{max-width:900px}
@media(max-width:720px){.booking-reference-landscape{inset:auto 0 0;width:100%;height:76%;mask-image:linear-gradient(to bottom,transparent,#000 20%)}.booking-reference-landscape img{object-fit:cover;object-position:58% bottom}.booking-section{min-height:720px;padding-top:64px}.booking-copy h2{font-size:42px}.booking-intro p{max-width:340px;font-size:19px}}

@media(min-width:721px){.booking-reference-landscape img{object-fit:fill}.booking-copy h2{font-size:clamp(42px,4.7vw,76px);max-width:1200px}}

/* Full-height artwork column; retain the authored ribbon and its responsive camera. */
@media(min-width:721px){
 .approved-build{padding-block:0}
 .approved-build .build-intro{align-items:stretch;min-height:870px}
 .approved-build .section-heading{padding-block:55px;margin-block:0;align-self:center}
 .approved-build .workflow-art{height:auto;min-height:870px;align-self:stretch}
}

/* Keep the final heading in view at maximum scroll, including browser chrome. */
.booking-section{height:calc(100svh - var(--ending-nav,65px) - var(--ending-footer,150px));min-height:480px;padding-top:clamp(28px,5svh,56px)}
.mountop-footer>div>div:first-child{grid-template-columns:1fr auto}
@media(max-width:720px){.booking-section{min-height:460px;padding-top:28px}.mountop-footer>div>div:first-child{grid-template-columns:1fr}}

/* Preserve the approved taller framing independently of the compact page ending. */
@media(min-width:721px){.booking-reference-landscape{inset:auto 0 0;height:120%}}
/* Larger brand-blue service headings; retain paragraph and artwork styling. */
.approved-build .service-item h3{font-size:38px;line-height:1.15;color:#2456cf;margin-bottom:12px}
@media(max-width:720px){.approved-build .service-item h3{font-size:32px}}

/* Retain the terrain footer strip without its former copy or link. */
.terrain-hero .hero-baseline{min-height:55px;border:0;padding:0}
/* One-screen desktop ribbon: #systems is exactly the window under the sticky header, and its copy
   scales with the window height so the section never grows. No scroll snap: the reader scrolls
   (design law, Motion); scroll-margin-top only frames an in-page link. */
#systems{scroll-margin-top:var(--ending-nav,65px)}
/* Exactly the window under the header, no band (the owner rejected a taller section). A wheel stop
   lands on its top edge because scroll-fit.js grows the hero's empty bottom strip by --fit-pad, below
   the reader's view, until (section top - header) is a whole number of the reader's measured notches. */
.terrain-hero .hero-baseline{min-height:calc(55px + var(--fit-pad,0px))}
@media(min-width:1000px){
 .approved-build{height:calc(100dvh - var(--ending-nav,65px));min-height:0}
 .approved-build>.red-wrap,.approved-build .build-intro{height:100%;min-height:0}
 .approved-build .workflow-art{min-height:0}
 .approved-build .section-heading{padding-block:clamp(14px,3.1vh,28px)}
 .approved-build h2{font-size:clamp(40px,min(4vw,6.4vh),57.6px)}
 .approved-build .section-heading>p{margin-top:clamp(8px,2vh,18px)}
 .approved-build .section-heading p,.approved-build .service-item p{font-size:clamp(17px,2.25vh,20px)!important}
 .approved-build .services-list{margin-top:clamp(10px,2.7vh,24px)}
 .approved-build .service-item{padding-top:clamp(6px,1.1vh,10px);margin-top:clamp(6px,1.35vh,12px)}
 .approved-build .service-item h3{font-size:clamp(26px,4.2vh,38px);margin-bottom:clamp(4px,1.35vh,12px)}
 .approved-build .service-item p{line-height:1.5}
}

/* Ribbon art bleeds to the window edge: the wrap's own padding plus half the space beside the wrap,
   measured in container units on #systems so the scrollbar is not counted (100vw counts it). */
#systems{container-type:inline-size}
@media(min-width:721px) and (max-width:1000px){.approved-build .workflow-art{--art-bleed:-28px}}
@media(min-width:1001px){.approved-build .workflow-art{--art-bleed:calc(-40px - max(0px,(100cqw - 1240px)/2))}}
@media(min-width:1600px){.approved-build .workflow-art{--art-bleed:calc(-40px - (100cqw - 1420px)/2)}}

/* Call button: one recipe for the hero, the booking section, the nav and the dialog's submit.
   Flat silver-white block, navy text and arrow, 6px corners; emphasis is a static shadow that deepens
   on hover, press feedback an instant slight scale. .red-site lifts it over redesign.css's font-size:inherit. */
.red-site{--call-fill:#e6ebf2;--call-fill-hover:#eef2f7;--call-ink:#081a2f;--call-ease:cubic-bezier(.22,1,.36,1);
 --call-shadow:0 1px 2px #03101f2e,0 3px 8px #03101f1a;--call-shadow-hover:0 2px 4px #03101f33,0 8px 20px #03101f29}
.red-site .button-3d,.red-site .booking-link{display:inline-flex;align-items:center;justify-content:center;gap:28px;box-sizing:border-box;
 width:278px;max-width:100%;min-height:56px;padding:0 24px;border:1px solid #081a2f1f;border-radius:6px;background:var(--call-fill);
 color:var(--call-ink);font-size:17px;font-weight:600;line-height:1.2;letter-spacing:0;text-decoration:none;white-space:nowrap;
 box-shadow:var(--call-shadow);cursor:pointer;touch-action:manipulation;transition:box-shadow .2s var(--call-ease),background-color .2s var(--call-ease)}
.red-site .button-3d>span,.red-site .booking-link>span{color:inherit;letter-spacing:0}
.red-site .booking-large{width:300px;min-height:60px;font-size:20px;gap:32px;align-self:center}
.red-site .booking-link{width:auto;min-height:44px;padding:0 16px;gap:12px;font-size:16px}
/* Hover (owner's pick, "Stripe" sweep): a lighter fill sweeps in from the reading start while the arrow
   leaves up-and-out and a fresh one arrives. CSS only: the arrow span's own glyph turns transparent and just
   sizes the box; ::before is the leaving arrow, ::after the arriving one. The Hebrew span is mirrored below,
   so the same translate values slide the arrows toward the reading direction there with no extra rule. */
.red-site :is(.button-3d,.booking-link){position:relative;overflow:hidden;isolation:isolate;-webkit-tap-highlight-color:transparent}
.red-site :is(.button-3d,.booking-link)::before{content:"";position:absolute;inset:0;z-index:0;background:#f7f9fc;
 scale:0 1;transform-origin:left center;transition:scale .2s var(--call-ease)}
[dir=rtl] .red-site :is(.button-3d,.booking-link)::before{transform-origin:right center}
.red-site :is(.button-3d,.booking-link)>span{position:relative;z-index:1}
.red-site :is(.button-3d,.booking-link)>span[aria-hidden]{display:inline-block;overflow:hidden;line-height:1.3;color:transparent}
.red-site :is(.button-3d,.booking-link)>span[aria-hidden]::before,
.red-site :is(.button-3d,.booking-link)>span[aria-hidden]::after{content:"↗"/"";position:absolute;inset:0;text-align:center;
 color:var(--call-ink);transition:translate .2s var(--call-ease)}
.red-site :is(.button-3d,.booking-link)>span[aria-hidden]::after{translate:-110% 110%}
.red-site :is(.button-3d,.booking-link):active::before{background:var(--call-fill-hover)}
@media(hover:hover){
 .red-site :is(.button-3d,.booking-link):is(:hover,:focus-visible){box-shadow:var(--call-shadow-hover)}
 .red-site :is(.button-3d,.booking-link):is(:hover,:focus-visible)::before{scale:1 1}
 .red-site :is(.button-3d,.booking-link):is(:hover,:focus-visible)>span[aria-hidden]::before{translate:110% -110%}
 .red-site :is(.button-3d,.booking-link):is(:hover,:focus-visible)>span[aria-hidden]::after{translate:0 0}}
.red-site .button-3d:active,.red-site .booking-link:active{transform:scale(.97);box-shadow:var(--call-shadow)}
.red-site .button-3d:focus-visible,.red-site .booking-link:focus-visible{outline:3px solid #69abff;outline-offset:4px}
[dir=rtl] .button-3d>span[aria-hidden],[dir=rtl] .booking-link>span[aria-hidden],[dir=rtl] .red-button>span[aria-hidden]{transform:scaleX(-1)}
/* Reduced motion: no sweep and no arrow travel; the plain colour change, instantly. */
@media(prefers-reduced-motion:reduce){
 .red-site :is(.button-3d,.booking-link),.red-site :is(.button-3d,.booking-link) *,
 .red-site :is(.button-3d,.booking-link)::before,.red-site :is(.button-3d,.booking-link) *::before,
 .red-site :is(.button-3d,.booking-link) *::after{transition:none!important}
 .red-site :is(.button-3d,.booking-link)::before,.red-site :is(.button-3d,.booking-link)>span[aria-hidden]::after{display:none}
 .red-site :is(.button-3d,.booking-link)>span[aria-hidden]::before{translate:none!important}
 .red-site :is(.button-3d,.booking-link):hover{background:var(--call-fill-hover)}
 .red-site :is(.button-3d,.booking-link):active{transform:none}}
/* Header logo link: 44px touch box around the unchanged 26px image; the header row is 64px and centres it, so neither moves. */
.header-bar a:has(>img){display:inline-flex;align-items:center;min-height:44px;min-width:44px}
/* Booking send states. Honeypot: clipped to nothing but not display:none, so form-filling bots still see and fill it. */
.booking-form{position:relative}.booking-form .booking-hp{position:absolute;inset-block-start:0;inset-inline-start:0;width:1px;height:1px;min-height:0;padding:0;border:0;opacity:0;overflow:hidden;clip-path:inset(50%);pointer-events:none}
.booking-form .button-3d:disabled{cursor:progress}
.booking-dialog .booking-form.is-sent .booking-result{font-size:22px;line-height:1.5;color:#10263d;margin:0;outline:none}