/* Native, accessible mini-sites. Their small shared films never load the 4K hero again. */
:root{--andara-blue:#003366}
.approach-sequence{grid-template-areas:'opening opening' 'visual intro' 'visual benefits';grid-template-rows:auto auto 1fr;background:#fff}
.proposal-opening{grid-area:opening;position:relative;text-align:center;padding:92px max(6vw,25px) 86px;background:#fff;isolation:isolate}
.proposal-opening::before{content:'';position:absolute;left:0;right:0;bottom:100%;height:150px;background:linear-gradient(transparent,#fff);pointer-events:none;z-index:-1}
.proposal-opening>.eyebrow{font-size:10px;letter-spacing:.24em;margin:0 0 24px;color:#7c745e}
.proposal-opening h2{font:400 clamp(44px,5.6vw,88px)/1.08 var(--serif);letter-spacing:-.035em;color:var(--andara-blue);margin:0 auto 28px;max-width:1300px}
.proposal-opening-lead{max-width:820px;font:400 clamp(19px,1.85vw,28px)/1.5 var(--serif);letter-spacing:-.02em;margin:0 auto;color:#656d70}
.approach-sequence .approach-visual,.approach-benefit-panel--life,.approach-benefit-panel--control,.approach-benefit-panel--booking{background:#fff}
.approach-site-demo>.eyebrow,.approach-editor-demo>.eyebrow{color:var(--andara-blue);text-align:center;font-size:10px;letter-spacing:.2em}
.quiet-motion-control,.approach-editor-footer .editor-preview-controls button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:8px 2px;margin-top:13px;border:0;background:transparent;color:var(--andara-blue);font:11px/1.5 var(--sans);text-decoration:underline;text-underline-offset:4px;cursor:pointer;border-radius:0}
.quiet-motion-control[hidden]{display:none}.quiet-motion-control:focus-visible{outline:2px solid var(--andara-blue);outline-offset:5px}
.approach-site-demo>.quiet-motion-control{display:flex;margin:13px auto 0}.approach-editor-footer{justify-content:center;margin-top:2px}.approach-editor-footer .editor-preview-controls{justify-content:center}
.native-preview-screen{position:relative;width:100%;aspect-ratio:1152/757;overflow:hidden;isolation:isolate;border-radius:3px;background:#fff}
.native-preview{position:absolute;inset:0;width:1152px;height:757px;max-width:none;transform:scale(var(--native-preview-scale,1));transform-origin:top left;overflow:hidden;text-align:left}
@supports(transform:scale(calc(100cqw / 1152px))){.native-preview-screen{container-type:inline-size}.native-preview{transform:scale(calc(100cqw / 1152px))}}
.film-site{background:#102530;color:#fff}.preview-film{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.film-site-shade{position:absolute;inset:0;background:linear-gradient(#08162055,transparent 36%,#071a294a);pointer-events:none}
.film-site-header,.gallery-preview-header{position:absolute;z-index:2;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:28px;padding:30px 40px;font:14px/1.2 var(--serif);color:#fff}
.film-site-header img,.gallery-preview-header img{width:128px;height:auto;object-fit:contain;flex:none}
.film-site-header>span:first-of-type,.gallery-preview-header>span:first-of-type{margin-left:auto;word-spacing:7px}
.preview-cta{display:inline-flex;align-items:center;justify-content:center;flex:none;background:var(--andara-blue);color:#fff;padding:16px 23px;font:13px/1.2 var(--serif)}
.film-site--current .film-site-header{padding:28px 34px;gap:24px;font-size:12px}.film-site--current .film-site-header>span:first-of-type{word-spacing:0}.film-site--current .preview-cta{background:transparent;border:1px solid #fff8}
.film-site-copy{position:absolute;left:7%;right:7%;bottom:19%;z-index:1}.film-site-copy>p:first-child{font:11px/1.6 var(--sans);letter-spacing:.25em;margin:0 0 24px}.film-site-copy .film-site-title{font:400 78px/1.07 var(--serif);letter-spacing:-.03em;margin:0 0 24px}.film-site-copy>span{font:16px/1.6 var(--sans);max-width:500px;display:block}
/* The exact current invitation is a CSS viewport of the unchanged capture. */
.demo-popup-shade{position:absolute;inset:0;z-index:3;background:#0009;opacity:1;pointer-events:none}
.demo-popup{position:absolute;z-index:4;opacity:1;pointer-events:none}.demo-popup--current{inset:0;width:1152px!important;height:757px!important;object-fit:contain;clip-path:inset(29.9868% 15.2778% 29.8547% 15.2778%)}
.demo-popup--proposed{left:176px;top:127px;width:800px;height:504px;display:grid;grid-template-columns:.94fr 1.06fr;background:#faf8f3;color:#182c37;box-shadow:0 20px 70px #0004}
.demo-offer-photo{min-width:0;overflow:hidden}.demo-offer-photo img{width:100%;height:100%;object-fit:cover}.demo-offer-copy{position:relative;padding:38px 31px 28px}.demo-offer-close{position:absolute;right:16px;top:10px;font:24px var(--sans);color:#8a8270}.demo-offer-copy .eyebrow{font-size:9px;letter-spacing:.18em;margin:0 0 22px;color:#856943}.demo-offer-title{font:400 43px/1.1 var(--serif);letter-spacing:-.035em;margin:0 0 24px}.demo-credits{display:grid;grid-template-columns:1fr 1fr;gap:22px}.demo-credits strong{font:400 23px/1.3 var(--serif);display:block}.demo-credits span{font:8px/1.5 var(--sans);letter-spacing:.14em;display:block;margin-top:4px}.demo-stay-condition{font:8px/1.5 var(--sans);margin:20px 0}.demo-offer-copy dl{margin:0 0 24px}.demo-offer-copy dl>div{display:grid;grid-template-columns:80px 1fr;gap:10px;margin:8px 0;font:10px/1.5 var(--sans)}.demo-offer-copy dt{font-size:8px;letter-spacing:.08em}.demo-offer-copy dd{margin:0}.demo-offer-book{display:flex;justify-content:space-between;width:100%;padding:15px 18px;font-size:10px}
.is-motion-ready[data-loop-demo=offer] .demo-popup,.is-motion-ready[data-loop-demo=offer] .demo-popup-shade{animation:invitation-arrival 12s ease-in-out infinite;animation-play-state:paused}
.is-motion-ready[data-loop-demo=offer].is-playing .demo-popup,.is-motion-ready[data-loop-demo=offer].is-playing .demo-popup-shade{animation-play-state:running}
[data-loop-demo=offer].is-static .demo-popup,[data-loop-demo=offer].is-static .demo-popup-shade{animation:none;opacity:1}
@keyframes invitation-arrival{0%,34%{opacity:0}42%,86%{opacity:1}96%,100%{opacity:0}}
/* The gallery is a real native-text layout, selected by the editorial rows or thumbnails. */
.storytelling{background:#fff;border:0}.storytelling-intro{margin-bottom:46px}.story-workbench{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);align-items:center;gap:clamp(30px,4vw,68px)}
.story-laptop{min-width:0}.andara-gallery{background:#102530;color:#fff}.gallery-scenes,.gallery-scene,.gallery-scene>img{position:absolute;inset:0;width:100%;height:100%}.gallery-scene{opacity:0;visibility:hidden;transition:opacity 360ms ease,visibility 0s 360ms}.gallery-scene>img{object-fit:cover}.gallery-scene::after{content:'';position:absolute;inset:0;background:linear-gradient(#10253036,transparent 35%,#071c32ad);pointer-events:none}
.gallery-scene-copy{position:absolute;z-index:1;left:7%;right:7%;bottom:24%;max-width:780px}.gallery-scene-copy>p:first-child{font:11px/1.5 var(--sans);letter-spacing:.2em;margin:0 0 21px}.gallery-scene-copy .gallery-scene-title{font:400 72px/1.08 var(--serif);letter-spacing:-.035em;margin:0 0 24px}.gallery-scene-copy>span{font:16px/1.7 var(--sans);display:block;max-width:570px}
.gallery-thumbnails{position:absolute;z-index:3;left:7%;right:7%;bottom:29px;display:flex;gap:14px}.gallery-thumbnails label{display:block;cursor:pointer;width:116px;border:1px solid #ffffff70;padding:5px;transition:background 250ms,border-color 250ms}.gallery-thumbnails img{display:block;width:100%;height:63px;object-fit:cover}.gallery-thumbnails span{font:10px/1.4 var(--sans);display:block;padding:7px 3px 2px}
.story-workbench:has(#story-setting:checked) .gallery-scene--setting,.story-workbench:has(#story-spaces:checked) .gallery-scene--spaces,.story-workbench:has(#story-experience:checked) .gallery-scene--experience{opacity:1;visibility:visible;transition-delay:0s}
.story-workbench:has(#story-setting:checked) .gallery-thumbnails [for=story-setting],.story-workbench:has(#story-spaces:checked) .gallery-thumbnails [for=story-spaces],.story-workbench:has(#story-experience:checked) .gallery-thumbnails [for=story-experience]{border-color:#fff;background:#fff2}
.story-choice-input{top:22px;left:0}.story-choice::before{background:var(--andara-blue)}.story-choice-number,.story-choice-arrow{color:var(--andara-blue)}.story-choice-title{color:var(--andara-blue)}.story-choice-description{line-height:1.7}
.story-choice:has(input:checked)::before{transform:scaleX(1)}.story-choice:has(input:checked) .story-choice-arrow{opacity:1;transform:translate(2px,-2px)}.story-choice:has(input:focus-visible){outline:2px solid var(--andara-blue);outline-offset:6px}.story-choice:has(input:checked) .story-choice-title{color:var(--andara-blue)}
.invitation-copy .dark-button{background:var(--andara-blue);color:#fff}.invitation-copy .dark-button:focus-visible{outline-color:var(--andara-blue)}
@media(max-width:1100px){.story-workbench{grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:30px}}
@media(max-width:900px){.approach-sequence{grid-template-areas:'opening' 'intro' 'visual' 'benefits';grid-template-rows:auto auto auto auto}.proposal-opening{padding:66px 25px 50px}.proposal-opening::before{height:110px}.proposal-opening h2{font-size:clamp(40px,7.5vw,66px);max-width:720px}.proposal-opening-lead{font-size:22px;max-width:610px}.story-workbench{grid-template-columns:1fr;gap:30px}.storytelling-intro{margin-bottom:32px}.story-choice-description{font-size:15px}.approach-site-demo>.quiet-motion-control{margin-top:5px;min-height:36px}.approach-editor-footer .editor-preview-controls button{min-height:36px;margin-top:6px}}
@media(max-width:500px){.proposal-opening{padding:59px 25px 42px}.proposal-opening>.eyebrow{font-size:9px;margin-bottom:22px}.proposal-opening h2{font-size:46px;line-height:1.06;margin-bottom:24px}.proposal-opening-lead{font-size:20px;line-height:1.5}.story-choice-description{font-size:14px}}
@media(prefers-reduced-motion:reduce){.gallery-scene,.gallery-thumbnails label{transition:none}}

#proposal{scroll-margin-top:24px}.approach-benefits li::before{background:var(--andara-blue)}
.approach-sequence:has(#approach-choice-life:checked) .approach-benefits [data-benefit=life] h3,.approach-sequence:has(#approach-choice-control:checked) .approach-benefits [data-benefit=control] h3,.approach-sequence:has(#approach-choice-booking:checked) .approach-benefits [data-benefit=booking] h3{color:var(--andara-blue)}
