/* November 12: subtle motion is confined to the hero copy, never the video. */
[hidden]{display:none!important}
.hero-copy{position:relative;isolation:isolate}
.hero-copy>:not(.hero-atmosphere){position:relative;z-index:1}
.hero-atmosphere{position:absolute;inset:0;overflow:visible;z-index:0;pointer-events:none}
.ambient-shape{position:absolute;width:64%;height:22%;border-radius:50%;filter:blur(22px);opacity:.28;animation:ambient-drift 52s ease-in-out infinite alternate;animation-play-state:paused}
.ambient-shape.purple{background:#9b7fc1;left:-15%;top:-5%}
.ambient-shape.aqua{background:#56b6a9;left:18%;top:44%;animation-delay:-18s;animation-duration:60s}
.ambient-shape.lavender{background:#b5a3cb;left:40%;top:12%;animation-delay:-30s;animation-duration:45s}
.hero-atmosphere i{position:absolute;width:16px;height:16px;border-radius:50%;background:radial-gradient(circle at 30% 25%,#f9c79b,#cb8252);box-shadow:3px 6px 8px #58361d16;opacity:.65;left:8%;top:64%;animation:ambient-float 5s ease-in-out infinite alternate;animation-play-state:paused}
.hero-atmosphere i:nth-of-type(2){left:67%;top:12%;width:12px;height:12px;animation-delay:-14s}
.hero-atmosphere i:nth-of-type(3){left:64%;top:85%;width:21px;height:21px;animation-delay:-26s}
.hero[data-motion-active] .hero-atmosphere>*{animation-play-state:running}
@keyframes ambient-drift{to{transform:translate(36%,28%) scale(1.15)}}
@keyframes ambient-float{to{transform:translate(58px,-46px) rotate(90deg)}}
.questionnaire-preview fieldset{border:1px solid #cbd7df;border-radius:8px;padding:16px;min-width:0}
.questionnaire-preview legend{font-weight:700;font-size:14px}
.questionnaire-preview .choice{display:flex;align-items:center;gap:10px}
.questionnaire-preview .choice input{width:auto}
@media(prefers-reduced-motion:reduce){.hero-atmosphere>*{animation:none!important}}
@media(max-width:760px){.ambient-shape{width:42%;height:20%;filter:blur(16px)}.ambient-shape.lavender{left:36%}.hero-atmosphere i:nth-of-type(2){left:57%}.hero-atmosphere i:nth-of-type(3){left:52%}}

/* Eight gentle rolling accents; new paths stay inside narrow hero bounds. */
.hero-atmosphere i:nth-of-type(4){left:18%;top:20%;width:10px;height:10px;animation-delay:-2s}
.hero-atmosphere i:nth-of-type(5){left:36%;top:72%;width:14px;height:14px;animation-delay:-5s}
.hero-atmosphere i:nth-of-type(6){left:3%;top:90%;width:12px;height:12px;animation-delay:-9s}

.hero-atmosphere i:nth-of-type(7){left:44%;top:34%;width:11px;height:11px;animation-delay:-3s}
.hero-atmosphere i:nth-of-type(8){left:24%;top:94%;width:15px;height:15px;animation-delay:-7s}

/* Reversible v36 experiment: motion continues beside the phone, without moving it. */
.hero{position:relative;isolation:isolate}
.hero-copy,.hero-opening{z-index:1}
.hero-opening{position:relative}
.hero-atmosphere-right{inset:0 0 0 61%;z-index:0}
.hero-atmosphere-right .purple{left:12%;top:5%;width:60%}
.hero-atmosphere-right .aqua{left:30%;top:42%;width:55%}
.hero-atmosphere-right .lavender{left:20%;top:72%;width:60%}
.hero-atmosphere-right i:nth-of-type(1){left:84%;top:16%}
.hero-atmosphere-right i:nth-of-type(2){left:88%;top:55%}
.hero-atmosphere-right i:nth-of-type(3){left:72%;top:80%}
.hero-atmosphere-right i:nth-of-type(4){left:18%;top:58%}
.hero-atmosphere-right i{animation-name:ambient-right-float}
@keyframes ambient-right-float{to{transform:translate(-35px,-46px) rotate(90deg)}}
/* More perceptible cloud drift, with gentle staggered phases rather than static washes. */
.ambient-shape{animation-name:ambient-cloud;animation-duration:18s;animation-timing-function:linear}
.ambient-shape.aqua{animation-duration:22s;animation-delay:-7s}
.ambient-shape.lavender{animation-duration:26s;animation-delay:-13s}
@keyframes ambient-cloud{from{transform:translate(-30px,-15px) scale(.94)}to{transform:translate(48px,30px) scale(1.12)}}
@media(max-width:760px){
.hero-atmosphere-right{inset:52% 0 8% 0}
.hero-atmosphere-right .purple{left:10%;width:45%}
.hero-atmosphere-right .aqua{left:40%;width:38%}
.hero-atmosphere-right .lavender{left:20%;width:45%}
.hero-atmosphere-right i:nth-of-type(2){left:88%}
.hero-atmosphere-right i:nth-of-type(3){left:78%}
}

.header-subline .assistant-coming-soon{display:block;font-size:10px;line-height:1.3;margin-top:2px}
.hero-caption a{color:inherit;text-decoration:underline;text-decoration-color:#77718466;text-underline-offset:3px}
.hero-caption a:hover{color:#493960;text-decoration-color:currentColor}
.hero-caption a:focus-visible{outline:2px solid #7a62b4;outline-offset:4px;border-radius:2px}

/* Ana requested plainly visible cloud travel, not a nearly static colour wash. */
.ambient-shape{animation-duration:9s;opacity:.32}
.ambient-shape.aqua{animation-duration:11s}
.ambient-shape.lavender{animation-duration:13s}
@keyframes ambient-cloud{from{transform:translate(-25px,-20px) scale(.9)}to{transform:translate(65px,45px) scale(1.12)}}
@media(max-width:760px){@keyframes ambient-cloud{from{transform:translate(-12px,-14px) scale(.94)}to{transform:translate(25px,28px) scale(1.08)}}}

/* v39 experiment: move only right-hand colour washes into the outer margin. */
.hero-atmosphere-right .ambient-shape{left:85%;width:20%;filter:blur(12px);animation-name:ambient-margin-cloud}
.hero-atmosphere-right .purple{top:8%}
.hero-atmosphere-right .aqua{top:44%}
.hero-atmosphere-right .lavender{top:74%}
@keyframes ambient-margin-cloud{from{transform:translate(0,-20px) scale(.94)}to{transform:translate(5px,45px) scale(1.08)}}
@media(max-width:760px){.hero-atmosphere-right .ambient-shape{left:88%;width:10%;filter:blur(9px)}}
/* Latest direction: purple higher/angled right, green lower/right; balls unchanged. */
.hero-atmosphere-right .purple{top:0;--margin-angle:-24deg}
.hero-atmosphere-right .aqua{top:64%;--margin-angle:20deg}
.hero-atmosphere-right .lavender{top:35%;--margin-angle:-12deg;opacity:.16}
@keyframes ambient-margin-cloud{from{transform:translate(0,-20px) rotate(var(--margin-angle,0deg)) scale(.94)}to{transform:translate(min(8vw,100px),45px) rotate(var(--margin-angle,0deg)) scale(1.08)}}

/* v42: softer horizontal, irregular right-margin washes. */
.hero-atmosphere-right .ambient-shape{left:72%;width:26%;height:8%;border-radius:62% 38% 55% 45% / 42% 63% 37% 58%;filter:blur(13px)}
.hero-atmosphere-right .purple{--margin-angle:-10deg}
.hero-atmosphere-right .aqua{--margin-angle:8deg;border-radius:43% 57% 34% 66% / 56% 39% 61% 44%}
.hero-atmosphere-right .lavender{--margin-angle:-5deg;border-radius:38% 62% 59% 41% / 63% 44% 56% 37%}
@media(max-width:760px){.hero-atmosphere-right .ambient-shape{left:84%;width:14%;height:7%;filter:blur(9px)}}
/* Decorative drift may reach the viewport edge; do not create a sideways scrollbar. */
html,body{overflow-x:clip}
/* Ana requests clearly visible drift: wider left travel, faster on both sides. */
.ambient-shape{animation-duration:4.5s}
.ambient-shape.aqua{animation-duration:5.5s}
.ambient-shape.lavender{animation-duration:6.5s}
@keyframes ambient-cloud{from{transform:translate(-65px,-20px) scale(.9)}to{transform:translate(95px,45px) scale(1.12)}}
@media(max-width:760px){@keyframes ambient-cloud{from{transform:translate(-22px,-14px) scale(.94)}to{transform:translate(40px,28px) scale(1.08)}}}

/* Working inquiry: keep focus/errors readable and controls phone-friendly. */
#inquiry{scroll-margin-top:100px}#inquiry form{min-width:0}#inquiry input,#inquiry textarea,#inquiry select{max-width:100%;box-sizing:border-box}#inquiry [role=status]{min-height:1.6em;margin-top:12px}#inquiry [role=status]:focus{outline:2px solid #6555a6;outline-offset:4px}#inquiry button:disabled{cursor:default;opacity:.65}
