/* V0.4 extends the retained V0.2 design system. */
:root { --violet-action:#b029ff; }
button, input, select, textarea { font:inherit; }
select, textarea { max-width:100%; }
.button-violet { background:var(--violet-action); color:#fff; border-color:#9f1ce9; box-shadow:0 8px 22px #8426bd26; }
.button-violet:hover { background:#9420db; }
.main-nav a[aria-current=page]:not(.button) { color:#7730b0; }
.hero { background:radial-gradient(ellipse at 12% 15%,#f7f9ffef,transparent 62%),linear-gradient(115deg,#c5d9ff 0%,#c6c1fa 55%,#d6a2fa 100%); padding-block:52px; }
.hero-copy h1 span { color:var(--night); }
.hero-description { color:#283856; }
.hero-status, .hero-status strong { color:#35415c; }
.hero .button-secondary { background:#ffffffb8; border-color:#8b90bc; }
.hero .mobility-map { border-color:#ffffffb0; box-shadow:0 22px 60px #28195126; }
.hero figcaption { color:#42476b; }
.proof-section { background:var(--night); color:#fff; }
.proof-intro .eyebrow, .proof-intro > p:not(.eyebrow) { color:#a8c6ff; }
.proof-intro > span, .stats dt { color:#c4d0e9; }
.stats > div { border-color:#3a4769; }
.stats dd { color:#80afff; }
.stats > div:nth-child(even) dd { color:#d59bff; }
.faq-final { padding-top:26px; }
.faq-final .button { font-size:12px; }
.reprise-panel { text-align:left; }
.breadcrumb { display:flex; gap:10px; flex-wrap:wrap; align-items:center; font-size:11px; margin-bottom:24px; color:#5f6d88; }
.breadcrumb a { text-decoration:underline; text-underline-offset:4px; min-height:32px; display:flex; align-items:center; }
.page-hero { padding:36px 0 54px; background:radial-gradient(ellipse at 90% 0,#dec4ff70,transparent 65%),linear-gradient(120deg,#edf3ff,#f7f9ff); border-bottom:1px solid #e1e7f6; }
.page-hero h1 { font-size:clamp(2.2rem,5vw,3.8rem); line-height:1.14; max-width:900px; letter-spacing:-.045em; }
.page-hero-grid { display:grid; align-items:center; gap:40px; }
.page-lead { font-size:15px; line-height:1.9; color:#526079; max-width:740px; margin-top:24px; }
.page-status { display:flex; align-items:flex-start; gap:9px; font-size:12px; color:#4f5c79; margin-top:24px; }
.page-status .icon { width:18px; height:18px; margin-top:3px; color:var(--action); }
.soft-section { background:var(--paper); }
.benefit-grid,.team-grid { display:grid; gap:20px; }
.content-card { padding:28px; border:1px solid #dfe5f0; border-radius:14px; background:#fff; }
.content-card h3 { font-size:19px; margin-bottom:13px; }
.content-card p { font-size:13px; color:var(--muted); line-height:1.9; }
.content-card:nth-child(even) .partner-icon { color:#8531ba; background:#f7edff; }
.illustration-note { font-size:11px; color:#59647c; line-height:1.8; margin-top:24px; }
.split-callout { display:flex; flex-direction:column; gap:28px; align-items:flex-start; }
.split-callout p:not(.eyebrow) { color:var(--muted); font-size:14px; line-height:1.9; max-width:620px; margin-top:18px; }
.signup-section .reprise-panel { margin-top:0; }
.signup-section > .container > .button { margin-bottom:30px; }
.signup-section .section-intro { margin-bottom:20px; }
.partner-card .button { margin-top:auto; font-size:11px; width:100%; }
.form-layout { display:grid; gap:32px; }
.form-intro > p:not(.eyebrow) { font-size:14px; color:var(--muted); margin-top:20px; max-width:380px; line-height:1.9; }
.form-aside { display:flex; gap:12px; background:#eaf0fe; padding:20px; border-radius:12px; margin-top:28px; }
.form-aside p { font-size:12px; line-height:1.9; }
.form-aside a { font-weight:600; color:var(--action); overflow-wrap:anywhere; }
.demo-form { background:#fff; padding:24px; border:1px solid #dfe5f0; border-radius:18px; min-width:0; }
.demo-notice { display:flex; gap:12px; background:#edf3ff; color:#344c7f; border:1px solid #d4e0fb; padding:16px; border-radius:10px; margin-bottom:24px; }
.demo-notice p { font-size:12px; line-height:1.85; margin:0; }
.demo-notice .icon { width:19px; height:19px; margin-top:3px; }
.required-note,.field-hint { font-size:12px; color:var(--muted); line-height:1.8; }
.required-note { margin-bottom:22px; }
.field { margin-bottom:20px; min-width:0; }
.field label,.group-label { display:block; font-size:13px; font-weight:600; margin-bottom:8px; }
.field label > span { color:#7950aa; }
.field input,.field select,.field textarea { width:100%; display:block; border:1px solid #aebbd1; border-radius:7px; padding:13px 12px; font-size:16px; background:#fff; color:var(--night); min-height:50px; }
.field textarea { resize:vertical; }
.field input[aria-invalid=true],.field select[aria-invalid=true],.field textarea[aria-invalid=true] { border:2px solid #a7293e; }
.field-error { color:#9f2337; font-size:12px; margin-top:7px; }
.field-hint { margin-block:8px 20px; }
.form-feedback { border:1px solid #98afdd; border-radius:10px; padding:16px; margin-top:20px; background:#edf3ff; font-size:13px; line-height:1.85; }
.editorial-grid { display:grid; gap:28px; }
.editorial-grid > div > p { font-size:14px; line-height:1.95; color:var(--muted); margin-top:20px; }
.editorial-grid .editorial-lead { margin-top:0; font-size:18px; color:#384763; line-height:1.9; }
.mission-section { background:#ebf1ff; }
.mission-section .editorial-lead { margin-top:24px; }
.timeline { list-style:none; padding:0; margin:0; display:grid; gap:30px; }
.timeline li { border-top:3px solid #c9dafa; padding-top:24px; }
.timeline li:nth-child(2) { border-color:#d5acf0; }
.timeline span { color:var(--action); font-size:12px; font-weight:600; }
.timeline h3 { font-size:19px; margin:15px 0; }
.timeline p { color:var(--muted); font-size:13px; line-height:1.9; }
.team-card { border:1px solid #e1e5f0; background:white; border-radius:14px; overflow:hidden; }
.portrait-slot { aspect-ratio:1.3; background:radial-gradient(ellipse at 80% 0,#ecd8fc,#e8f0fc 70%); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px; }
.portrait-slot > span { border:1px solid #acbee2; width:85px; height:85px; display:grid; place-items:center; border-radius:50%; font-size:28px; color:#526a97; }
.portrait-slot small { font-size:10px; color:#5b6c8a; }
.team-card > div:last-child { padding:24px; }
.team-card h3 { font-size:18px; margin-bottom:12px; }
.team-card p { font-size:12px; color:var(--muted); line-height:1.8; }
.team-card .team-role { color:#7931aa; font-size:11px; margin-bottom:12px; font-weight:600; }
.photo-slot { border-radius:20px; border:1px dashed #9aadd0; aspect-ratio:1.2; background:linear-gradient(130deg,#dfebfc,#efe2fb); display:flex; flex-direction:column; justify-content:flex-end; padding:28px; overflow:hidden; position:relative; }
.photo-slot > .icon { position:absolute; top:15%; left:11%; width:60px; height:60px; stroke-width:.8; color:#7e94ba; }
.photo-slot figcaption { z-index:1; }
.photo-slot strong { font-size:20px; display:block; max-width:260px; line-height:1.5; }
.photo-slot figcaption span { display:block; font-size:11px; line-height:1.9; color:#5a6780; margin-top:12px; }
.photo-lines { position:absolute; inset:20% -10% 20% 40%; border:1px solid #bdc9e4; border-radius:45%; transform:rotate(-30deg); }
.photo-lines::after { content:''; position:absolute; inset:20px; border:1px solid #c7b5e3; border-radius:45%; }
.pending-content { padding:26px; border:1px dashed #b4c1d9; border-radius:14px; background:#f7f9ff; }
.shortcut { display:flex; flex-direction:column; align-items:flex-start; transition:border-color .15s; }
.shortcut:hover { border-color:var(--action); }
.shortcut p { flex:1; }
.shortcut-action { display:flex; gap:10px; align-items:center; font-size:12px; font-weight:600; color:var(--action); margin-top:22px; min-height:44px; }
.shortcut-action .icon { width:18px; }
.contact-card { border:1px solid #dfe5f0; border-radius:16px; padding:28px; }
.contact-address { display:flex; align-items:center; gap:12px; font-size:clamp(14px,2vw,20px); color:var(--action); font-weight:600; min-height:50px; overflow-wrap:anywhere; }
.contact-card h3 { margin:30px 0 16px; font-size:17px; }
.contact-card .social-links { max-width:100%; }
.contact-card .social-links a { color:var(--action); font-size:12px; min-height:44px; }
.legal-contact { border-top:1px solid #e2e7f1; padding-top:24px; margin-top:24px; }
.legal-contact p { font-size:12px; color:var(--muted); margin-top:12px; line-height:1.9; }
/* Journey wizard, no network and no persistence. */
.journey-section { background:var(--paper); padding-top:32px; }
.journey-notice { max-width:960px; }
.wizard-progress { list-style:none; margin:28px 0; padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; }
.wizard-progress li { display:flex; align-items:center; gap:10px; border-bottom:2px solid #dce3f2; padding:12px 0; font-size:12px; font-weight:600; color:#65728a; }
.wizard-progress span { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; border:1px solid #b6c4e0; flex-shrink:0; }
.wizard-progress [aria-current=step] { color:var(--action); border-color:var(--action); }
.wizard-progress [aria-current=step] span { background:var(--action); color:#fff; border-color:var(--action); }
.wizard-layout { display:grid; gap:24px; align-items:start; }
.wizard-panel { padding:24px; border:1px solid #dae2f1; background:#fff; border-radius:16px; min-width:0; }
.wizard-panel h2 { font-size:25px; margin-bottom:14px; }
.wizard-panel > p { font-size:13px; color:var(--muted); margin-bottom:24px; line-height:1.85; }
.wizard-panel fieldset { border:0; margin:0 0 22px; padding:0; min-width:0; }
.wizard-panel legend { font-size:13px; font-weight:600; margin-bottom:12px; }
.choice-row { display:flex; gap:8px; flex-wrap:wrap; }
.choice-row label { display:flex; gap:8px; align-items:center; min-height:44px; padding:8px 12px; border:1px solid #c8d3e8; border-radius:8px; font-size:12px; cursor:pointer; }
.choice-row label:has(input:checked) { background:#edf3ff; border-color:#3779ff; color:#194cba; }
.choice-row input { accent-color:var(--action); width:16px; height:16px; }
.field-pair { display:grid; grid-template-columns:1fr; gap:0 16px; }
.wizard-actions { display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; margin-top:24px; }
.wizard-actions .button { font-size:12px; }
.wizard-error { background:#fff1f2; color:#9c253a; border:1px solid #e3acb5; border-radius:8px; padding:12px; margin-block:20px; font-size:12px; }
.place-field { position:relative; }
.place-results { list-style:none; padding:0; margin:8px 0; border:1px solid #c3cfe5; border-radius:8px; overflow:hidden; }
.place-results button { display:block; border:0; border-bottom:1px solid #edf0f6; background:white; padding:11px 12px; min-height:44px; text-align:left; width:100%; font-size:13px; color:#284d8c; }
.place-results button:hover,.place-results button:focus-visible { background:#eef4ff; }
.zone-caption { display:block; font-size:11px; color:#5f6c84; margin-top:7px; line-height:1.7; }
.geo-button { font-size:11px; padding:10px 12px; width:100%; }
.geo-help { font-size:11px; color:#5d6880; line-height:1.8; margin-top:10px; }
.map-panel { border:1px solid #cbd8ee; border-radius:16px; background:#fff; overflow:hidden; min-width:0; }
.map-toolbar { display:flex; gap:12px; flex-wrap:wrap; justify-content:space-between; padding:18px; border-bottom:1px solid #dbe4f1; }
.map-toolbar strong { font-size:13px; display:block; }
.map-toolbar p { font-size:11px; color:var(--muted); margin:5px 0 0; }
.map-mode { display:flex; gap:6px; }
.map-mode button { min-height:44px; border:1px solid #b8c7e2; padding:8px 12px; background:#fff; border-radius:7px; font-size:11px; font-weight:600; }
.map-mode button[aria-pressed=true] { background:var(--action); border-color:var(--action); color:white; }
.geo-map { position:relative; height:340px; background:#daebfa; overflow:hidden; touch-action:pan-y; }
.geo-map svg { width:100%; height:100%; }
.geo-map .map-place { cursor:pointer; }
.geo-map .map-place circle { fill:#fff; stroke:#55759d; stroke-width:2; }
.geo-map .map-place:focus { outline:none; }
.geo-map .map-place:focus circle,.geo-map .map-place:hover circle { stroke:#285dd1; stroke-width:4; }
.geo-map text { font-family:Montserrat,Arial,sans-serif; font-size:13px; fill:#40536f; paint-order:stroke; stroke:#f7f9ff; stroke-width:3px; stroke-linejoin:round; }
.geo-map .selected-point text { fill:#fff; stroke:none; font-size:13px; font-weight:700; }
.geo-map .selected-point circle { stroke:#fff; stroke-width:3px; }
.map-bottom { padding:14px 18px; }
.map-bottom p { font-size:10px; color:#5e6a81; line-height:1.9; }
.map-bottom a { text-decoration:underline; }
.map-expand { border:1px solid #b5c7e6; border-radius:7px; padding:8px 12px; min-height:44px; background:white; font-size:11px; color:var(--action); font-weight:600; margin-top:12px; }
.map-panel.fullscreen { position:fixed; inset:10px; z-index:300; display:flex; flex-direction:column; box-shadow:0 0 0 20px #0c1330cc; }
.map-panel.fullscreen .geo-map { flex:1; min-height:160px; }
.map-panel.fullscreen .map-bottom { padding-block:10px; }
.map-panel.fullscreen .map-bottom p { font-size:10px; }
.map-panel.fullscreen .map-expand { margin-top:4px; }
.map-live { font-size:12px; padding:12px 18px; color:#2d548e; background:#eef4ff; min-height:44px; }
.wizard-recap { margin:20px 0; }
.wizard-recap > div { display:grid; grid-template-columns:1fr; gap:5px; padding:14px 0; border-bottom:1px solid #e1e7f1; }
.wizard-recap dt { font-size:11px; color:var(--muted); }
.wizard-recap dd { font-size:13px; font-weight:600; overflow-wrap:anywhere; }
.future-submit { margin-top:24px; padding:20px; background:#edf3ff; border:1px dashed #9fb5de; border-radius:10px; }
.future-submit h3 { font-size:16px; margin-bottom:12px; }
.future-submit p { font-size:12px; line-height:1.85; color:#435878; }
.future-submit button { background:#d4def2; color:#475d85; margin-top:18px; width:100%; }
@media(min-width:540px) { .benefit-grid,.team-grid { grid-template-columns:1fr 1fr; } .field-pair { grid-template-columns:1fr 1fr; } .wizard-recap > div { grid-template-columns:1fr 1.3fr; } }
@media(min-width:800px) { .hero { padding-block:70px; } .page-hero { padding:42px 0 64px; } .page-hero-grid { grid-template-columns:1.1fr 1fr; gap:60px; } .page-hero-grid h1 { font-size:clamp(2.3rem,4.3vw,3.8rem); } .page-lead { font-size:16px; } .split-callout { flex-direction:row; justify-content:space-between; align-items:center; gap:45px; } .split-callout .button { flex-shrink:0; } .form-layout { grid-template-columns:.85fr 1.15fr; gap:60px; } .demo-form { padding:32px; } .editorial-grid { grid-template-columns:.8fr 1.2fr; gap:70px; } .timeline { grid-template-columns:repeat(3,1fr); gap:36px; } .wizard-layout { grid-template-columns:minmax(300px,1fr) minmax(0,1.3fr); gap:28px; } .map-panel { position:sticky; top:calc(var(--header-height) + 20px); } .geo-map { height:430px; } .wizard-progress { max-width:650px; } }
@media(min-width:1080px) { .benefit-grid,.team-grid { grid-template-columns:repeat(4,1fr); } .content-card { padding:28px; } .wizard-panel { padding:30px; } .hero { padding-block:76px; } }
@media(max-width:359px) { .page-hero h1 { font-size:32px; } .page-hero { padding-top:24px; } .demo-form,.wizard-panel { padding:20px 16px; } .wizard-progress { gap:8px; } .wizard-progress li { font-size:10px; gap:5px; } .wizard-progress span { width:23px; height:23px; } .wizard-actions { flex-direction:column-reverse; } .wizard-actions .button { width:100%; } .contact-card { padding:20px; } .geo-map { height:270px; } }
@media(prefers-reduced-motion:reduce) { .button-violet:hover { transform:none; } }
@media(forced-colors:active) { .hero,.page-hero,.proof-section,.mission-section,.photo-slot,.portrait-slot { background:Canvas; color:CanvasText; } .button-violet { background:ButtonFace; color:ButtonText; border:1px solid ButtonText; } }
.map-zoom { position:absolute; top:12px; right:12px; display:flex; gap:5px; }
.map-zoom button { min-width:44px; min-height:44px; background:#fff; color:#285dd1; border:1px solid #b3c5e2; border-radius:7px; font-size:16px; box-shadow:0 2px 8px #0c133009; }
.map-zoom button:last-child { padding-inline:10px; font-size:10px; }
.map-fallback { font-size:13px; padding:30px; }
.wizard-progress { scroll-margin-top:calc(var(--header-height) + 16px); }
body.map-open .site-header { visibility:hidden; }
.geo-map text { font-size:22px; }
.geo-map .selected-point text { font-size:16px; }
@media(max-width:799px) { .geo-map { height:260px; } .geo-map text { font-size:27px; } }
@media(max-width:539px) { .prototype-note { display:none; } }

/* V0.4.1 - working mobility form embedded without changing navigation shell */
.integrated-map-section{padding-block:52px 72px;background:linear-gradient(180deg,#f7f9ff,#fff)}
.integrated-map-intro{max-width:860px;margin:0 0 22px}
.integrated-map-intro h2{font-size:clamp(1.5rem,3vw,2rem);margin:0 0 10px}
.integrated-map-intro p{font-size:13px;line-height:1.8;color:#526079}
.integrated-frame{display:block;border:1px solid #d8e1f1;border-radius:18px;background:#fff;width:100%;height:1350px;box-shadow:0 18px 45px #0c13300c}
.integrated-map-footer{font-size:11px;line-height:1.8;color:#526079;padding:15px 2px}
.integration-note{border-radius:12px;background:#eaf0ff;border:1px solid #d4ddf6;padding:14px 18px;font-size:12px;color:#304e80;line-height:1.7;margin:12px 0 24px}
@media(max-width:700px){.integrated-map-section{padding-block:30px 48px}.integrated-frame{height:1680px;border-radius:12px}}
