/* Homepage workflow and preview studies: conceptual landscapes. */
.motion-poc { min-width:0; color:#e8edf3; }
.motion-stage { position:relative; height:clamp(390px,51vh,610px); overflow:hidden; isolation:isolate; }
.motion-stage svg { width:100%; height:100%; overflow:visible; }
.motion-terrain .motion-stage { background:radial-gradient(ellipse at 70% 60%,#163b4055,transparent 65%); }
.motion-island .motion-stage { background:radial-gradient(ellipse at 50% 54%,#1a464044,transparent 63%); }
.motion-choreography .motion-stage { background:radial-gradient(ellipse at center,#123b3b55,transparent 65%); }
.motion-eyebrow { display:flex; align-items:center; gap:10px; font-size:10px; color:#f0b630; letter-spacing:2px; text-transform:uppercase; }
.motion-eyebrow:before { content:''; width:6px; height:6px; border-radius:50%; background:#f0b630; box-shadow:0 0 15px #f0a500aa; }
.motion-copy { position:absolute; left:28px; top:30px; z-index:2; pointer-events:none; }
.motion-copy h2 { font-size:clamp(27px,3vw,43px); line-height:1.12; letter-spacing:-1.4px; margin:12px 0 10px; max-width:420px; font-weight:650; }
.motion-copy p { font-size:13px; color:#a1b1bc; margin:0; }
.motion-island .motion-copy { top:auto; bottom:20px; left:28px; }
.motion-island .motion-copy h2 { font-size:30px; }
.motion-choreography .motion-copy { top:25px; left:50%; transform:translateX(-50%); width:95%; text-align:center; }
.motion-choreography .motion-eyebrow { justify-content:center; }
.motion-choreography .motion-copy h2 { max-width:none; font-size:30px; }
.motion-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:14px 22px; border-top:1px solid #ffffff17; }
.motion-chapters { display:flex; gap:18px; }
.motion-chapters button { position:relative; background:none; border:0; padding:8px 0; color:#8495a4; font:inherit; font-size:11px; cursor:pointer; }
.motion-chapters button[aria-pressed=true] { color:#f2ba38; }
.motion-chapters button:after { content:''; position:absolute; bottom:0; left:0; height:2px; width:100%; background:currentColor; transform:scaleX(0); transform-origin:left; }
.motion-chapters button[aria-pressed=true]:after { transform:scaleX(1); }
.motion-pause { color:#9eacb9; border:1px solid #ffffff28; border-radius:20px; background:#111922; padding:7px 13px; font-size:11px; cursor:pointer; }
.motion-poc button:focus-visible { outline:2px solid #f0b630; outline-offset:4px; }
.motion-note { text-align:right; color:#75818e; font-size:9px; margin:8px 22px 0; letter-spacing:.3px; }
.study-patterns .motion-stage { height:clamp(340px,42vh,490px); }
.study-patterns .motion-copy { top:10px; bottom:auto; left:20px; }
.study-patterns .motion-copy h2 { font-size:29px; }
.study-patterns .motion-stage svg { transform:translateY(45px) scale(.88); }
.survey-choices { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; padding:0 16px 12px; }
.survey-choices button { display:grid; grid-template-columns:24px 1fr; text-align:left; padding:12px; border:1px solid #ffffff1f; border-radius:9px; background:#152029; color:#c3ced7; cursor:pointer; }
.survey-choices button[aria-pressed=true] { border-color:#c99832; background:#362c19; color:#ffce69; }
.survey-choices span { grid-row:span 2; font-size:9px; opacity:.65; padding-top:3px; }
.survey-choices strong { font-size:12px; font-weight:600; }
.survey-choices small { font-size:9px; color:#93a5b0; margin-top:5px; }
.study-patterns .motion-toolbar { justify-content:flex-end; padding:5px 20px; border:0; }
.study-patterns .motion-chapters[hidden] { display:none; }
.benefit-badge { position:absolute; top:22px; left:50%; transform:translateX(-50%); white-space:nowrap; padding:10px 18px; border:1px solid #f0b63055; border-radius:30px; background:#1c2427; color:#ffd06a; font-size:11px; }
.study-patterns .terrain-label,.study-terrainflow .terrain-label { display:none; }
.mission-export-card { position:absolute; left:50%; top:47%; width:78%; display:flex; align-items:center; gap:20px; padding:24px; background:#131f27f5; border:1px solid #d3a54799; border-radius:15px; box-shadow:0 20px 70px #0008; pointer-events:none; opacity:0; }
.export-file { border:1px solid #edb83e; border-radius:7px; padding:15px 10px; color:#ffd470; font-size:19px; }
.export-file span { display:block; text-align:right; font-size:22px; margin-top:7px; }
.mission-export-card small { color:#b8944c; font-size:8px; letter-spacing:1.2px; }
.mission-export-card h3 { font-size:21px; line-height:1.2; margin:8px 0; }
.mission-export-card p { font-size:10px; color:#9aaeb8; margin:0; }
@media(max-width:540px) {
    .study-patterns .motion-stage { height:320px!important; }
    .study-patterns .motion-copy h2 { font-size:23px; }
    .study-patterns .motion-copy { left:5px; }
    .survey-choices { padding:0; gap:6px; }
    .survey-choices button { padding:10px 8px; grid-template-columns:18px 1fr; }
    .survey-choices strong { font-size:11px; }
    .survey-choices small { font-size:9px; line-height:1.4; }
    .mission-export-card { width:90%; padding:16px; gap:12px; }
    .mission-export-card h3 { font-size:17px; }
    .benefit-badge { font-size:9px; top:12px; padding:8px 12px; }
}
.motion-route { fill:none; stroke:#ffc247; stroke-width:3; stroke-linecap:round; stroke-linejoin:round; filter:url(#motionGlow); }
.motion-drone { filter:url(#motionGlow); }
.terrain-label { font:10px sans-serif; fill:#93a6ad; letter-spacing:1px; }
.motion-halo { fill:none; stroke:#f7bb39; stroke-width:1; opacity:.22; }
.motion-ground { fill:#10282d; stroke:#38616a; stroke-width:1; }
.motion-grid { fill:none; stroke:#527c7b; stroke-width:.65; opacity:.45; }
.motion-scan { fill:#f6bd3120; stroke:#f6bd31; stroke-width:1; }
.study-atelier { background:#eee8d9; color:#3c463c; padding:12px 14px 8px; border-radius:2px; box-shadow:8px 12px 0 #a79b7910,0 20px 60px #0003; transform:rotate(-.6deg); }
.study-atelier .motion-stage { height:clamp(380px,48vh,560px); background:radial-gradient(ellipse at 20% 15%,#fffdf366,transparent 70%); }
.study-atelier .motion-copy { top:20px; left:25px; right:20px; }
.study-atelier .motion-eyebrow { color:#847154; font-size:9px; letter-spacing:2.1px; }
.study-atelier .motion-eyebrow:before { display:none; }
.study-atelier .motion-copy h2 { color:#3c463c; font-family:Georgia,'Times New Roman',serif; font-weight:400; font-style:italic; font-size:clamp(28px,3vw,39px); letter-spacing:-1.1px; margin:14px 0 9px; }
.study-atelier .motion-copy p { color:#73786a; font-size:11px; }
.study-atelier .motion-route { stroke:#b87336; stroke-width:2.4; filter:none; }
.study-atelier .motion-drone { filter:none; }
.study-atelier .motion-toolbar { border-top:1px solid #bcb3a1; padding:9px 22px; }
.study-atelier .motion-chapters { gap:20px; }
.study-atelier .motion-chapters button { color:#7d806f; font-family:Georgia,serif; font-size:12px; }
.study-atelier .motion-chapters button[aria-pressed=true] { color:#9e5c2d; }
.study-atelier .motion-pause { background:transparent; color:#727564; border-color:#b8b3a2; border-radius:2px; }
.study-atelier .motion-note { color:#8a887b; font-size:9px; font-family:Georgia,serif; font-style:italic; }
@media(max-width:540px) {
    .study-atelier { padding:7px; transform:none; }
    .study-atelier .motion-copy { left:12px; top:18px; }
    .study-atelier .motion-copy h2 { font-size:26px; }
    .study-atelier .motion-copy p { font-size:10px; }
    .study-atelier .motion-toolbar { padding:8px 5px; }
    .study-atelier .motion-chapters { gap:14px; }
    .study-atelier .motion-chapters button { font-size:11px; }
}

@media(max-width:1000px) { .motion-stage { height:500px; }.motion-poc { width:100%; } }
@media(max-width:540px) { .motion-stage { height:340px; }.motion-copy { left:10px; top:18px; }.motion-copy h2 { font-size:28px; max-width:290px; }.motion-copy p { font-size:11px; }.motion-eyebrow { font-size:8px; letter-spacing:1.5px; }.motion-toolbar { padding:10px 0; gap:8px; }.motion-chapters { gap:13px; }.motion-chapters button { font-size:10px; }.motion-island .motion-copy { left:10px; bottom:9px; }.motion-island .motion-copy h2,.motion-choreography .motion-copy h2 { font-size:25px; }.motion-note { margin-right:0; }.motion-choreography .motion-stage { height:340px; } }
/* H: one continuous planning, flight splitting and export story. */
.pattern-motion { position:relative; display:block; width:100%; height:190px; padding:0; overflow:hidden; border:1px solid #ffffff15; border-radius:10px; background:var(--wash); cursor:pointer; }
.pattern-motion svg { display:block; width:100%; height:100%; }
.pattern-motion:hover,.pattern-motion:focus-visible { border-color:#b89548; }
.pattern-motion:focus-visible { outline:2px solid #ffc247; outline-offset:4px; }
.pattern-replay { position:absolute; bottom:10px; right:12px; color:#a8b8bd; font-size:10px; }
.workflow-hero .story-hero { grid-template-columns: .9fr 1.3fr; gap:30px; }
.workflow-hero .story-hero-copy h1 { font-size:clamp(34px,3.4vw,58px); line-height:1.12; letter-spacing:-1.7px; }
.workflow-hero .story-first-mission { border:0!important; background:none!important; padding:10px 0!important; font-size:13px!important; box-shadow:none!important; }
.workflow-hero .story-hero-actions { gap:12px 20px; }
.study-workflow .motion-stage { height:clamp(430px,55vh,650px); overflow:hidden; }
.study-workflow .motion-copy { top:20px; bottom:auto; left:25px; }
.study-workflow .motion-copy h2 { font-size:27px; }
.study-workflow .motion-stage > svg { padding-top:90px; box-sizing:border-box; }
.study-workflow .motion-route,.study-workflow .motion-drone { filter:none; }
.study-workflow .motion-grid { opacity:.35; }
.study-workflow .motion-toolbar { padding:12px 25px; }
.study-workflow .motion-chapters { flex:1; gap:0; }
.study-workflow .motion-chapters button { flex:1; display:flex; align-items:center; gap:8px; min-height:44px; text-align:left; font-size:13px; color:#758590; }
.study-workflow .motion-chapters button:not(:last-child) { padding-right:20px; }
.study-workflow .motion-chapters button:after { position:static; flex:1; margin-left:8px; height:1px; background:linear-gradient(to right,#d7ad58 calc(var(--step-progress,0)*100%),#ffffff20 0); transform:none; }
.study-workflow .motion-chapters button:last-child:after { display:none; }
.study-workflow .motion-chapters button.is-complete { color:#b9c6c6; }
.study-workflow .motion-chapters button[aria-pressed=true] { color:#ffc247; }
.workflow-step-number { font-size:10px; opacity:.75; }
.study-workflow .motion-pause { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:0; border:0; background:transparent; border-radius:50%; }
.study-workflow .motion-pause:hover { background:#ffffff0a; color:#ffc247; }
.study-workflow .motion-pause svg { width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linejoin:round; }
.study-workflow .motion-note { position:absolute; bottom:8px; left:25px; margin:0; font-size:9px; pointer-events:none; }
.workflow-files { position:absolute; right:5px; top:48%; width:220px; opacity:0; pointer-events:none; }
.workflow-files > div { display:flex; align-items:center; gap:12px; padding:16px 13px; background:#17232b; border:1px solid #ffffff24; border-left:2px solid var(--file-color); margin:0 0 9px; box-shadow:0 12px 30px #0003; }
.workflow-files span { color:var(--file-color); font-size:11px; }
.workflow-files strong { color:#e8edf3; font-size:13px; font-weight:500; }
.workflow-files small { display:block; color:#90a4af; font-size:9px; margin-top:5px; }
.workflow-files b { margin-left:auto; color:var(--file-color); font-size:10px; font-weight:500; }
@media(max-width:1000px) { .workflow-hero .story-hero { grid-template-columns:1fr; }.study-workflow .motion-stage { height:470px; } }
@media(max-width:540px) { .workflow-hero .story-hero-copy h1 { font-size:36px; }.study-workflow .motion-stage { height:380px; }.study-workflow .motion-copy { left:0; top:15px; }.study-workflow .motion-copy h2 { font-size:23px; }.study-workflow .motion-copy p { max-width:270px; line-height:1.5; }.study-workflow .motion-eyebrow { font-size:7px; }.study-workflow .motion-toolbar { padding:10px 0; }.study-workflow .motion-chapters { gap:17px; }.study-workflow .motion-chapters button { font-size:11px; }.workflow-files { width:160px; top:48%; }.workflow-files > div { padding:10px 8px; gap:8px; }.workflow-files strong { font-size:11px; }.workflow-files b { font-size:8px; } }
@media(max-width:540px) {
    .study-workflow .motion-chapters { gap:0; }
    .study-workflow .motion-chapters button { gap:5px; }
    .study-workflow .motion-chapters button:not(:last-child) { padding-right:10px; }
    .study-workflow .motion-chapters button:after { margin-left:3px; }
    .study-workflow .motion-note { left:0; }
}
/* Keep small captions readable alongside the rest of the homepage. */
.study-workflow .motion-copy h2 { font-weight:700; letter-spacing:-.8px; }
.study-workflow .motion-copy p { font-size:14px; line-height:1.5; }
.study-workflow .motion-note,.pattern-replay,.workflow-files small { font-size:11px; }
.study-workflow .motion-chapters button { color:#a1b1bc; }
.study-workflow .motion-chapters button[aria-pressed=true] { color:#ffc247; }
.study-workflow .motion-chapters button:focus-visible,.study-workflow .motion-pause:focus-visible { outline:2px solid #ffc247; outline-offset:3px; }
@media(max-width:540px) {
    .study-workflow .motion-eyebrow { font-size:9px; letter-spacing:1.2px; }
    .study-workflow .motion-copy p { font-size:13px; }
    .study-workflow .motion-chapters button { font-size:12px; }
    .workflow-files b { font-size:10px; }
}
