/* Visual foundation: Solid Dataspace Manager (Manrope, navy, blue, pale surfaces). */
@font-face { font-family: Manrope; src: url('assets/manrope.woff2') format('woff2'); font-weight: 400 800; font-display: swap; }
:root { --paper:#f8fafc; --ink:#0f172a; --navy:#142642; --accent:#1d4ed8; --muted:#64748b; --line:#e2e8f0; --orange:#ed8b35; --pad:max(28px,calc((100vw - 1260px)/2)); font-family:Manrope,'Segoe UI',Arial,sans-serif; background:var(--paper); color:var(--ink); font-synthesis:none; color-scheme:light; scroll-behavior:smooth; }
* { box-sizing:border-box; }
body { margin:0; }
h1,h2,h3,h4,p,figure { margin:0; }
h1,h2,h3,h4 { font-weight:800; }
p { line-height:1.8; }
a { color:inherit; text-decoration:none; }
button { font:inherit; color:inherit; cursor:pointer; }
svg { display:block; }
em { font-style:normal; color:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,[tabindex]:focus-visible,summary:focus-visible { outline:3px solid #5089d7; outline-offset:5px; }
#main:focus { outline:0; }
::selection { background:#1d4ed8; color:white; }
.icon { width:22px; height:22px; flex-shrink:0; }
.skip { position:fixed; top:-100px; left:20px; z-index:100; padding:15px; color:white; background:var(--navy); }
.skip:focus { top:10px; }
.masthead { min-height:112px; margin:0 var(--pad); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; border-bottom:1px solid var(--line); position:relative; z-index:5; }
.menu-toggle { display:none; }
.wordmark { display:flex; align-items:center; justify-self:start; gap:12px; border-radius:8px; }
.smart-city-logo { display:block; width:60px; height:60px; flex-shrink:0; }
.wordmark-text { font-size:18px; line-height:1.2; font-weight:800; letter-spacing:-.4px; white-space:nowrap; }
.wordmark-text>span { display:block; margin-top:4px; font-size:14px; font-weight:500; letter-spacing:.1px; color:#536277; }
.masthead nav { display:flex; align-items:center; gap:29px; font-size:12px; font-weight:600; color:#536277; }
.masthead nav a { position:relative; padding:12px 0; }
.masthead nav a:hover,.masthead nav a[aria-current] { color:var(--accent); }
.masthead nav a[aria-current]:after { content:''; position:absolute; height:2px; background:var(--accent); bottom:2px; left:0; right:0; }
.institution-logos { display:flex; align-items:center; justify-self:end; gap:20px; }
.institute,.university { display:block; flex-shrink:0; }
.institute-logo { display:block; width:58px; height:58px; object-fit:contain; }
.university { padding-left:16px; border-left:1px solid var(--line); }
.university-logo { display:block; width:170px; height:auto; object-fit:contain; }
.eyebrow { display:flex; align-items:center; gap:9px; font-size:10px; font-weight:700; letter-spacing:1px; color:var(--muted); line-height:1.6; }
.tiny-dot,.orange-dot { width:6px; height:6px; display:inline-block; flex-shrink:0; border-radius:50%; background:var(--accent); }
.orange-dot { background:var(--orange); }
.back { display:inline-block; font-size:11px; color:var(--muted); }
.back:hover { color:var(--accent); }
.health-hero { position:relative; padding:33px var(--pad) 0; overflow:clip; background:radial-gradient(ellipse 760px 320px at 50% 64%,#e9f0fa88,transparent 100%); }
.health-heading { text-align:center; position:relative; }
.health-heading .back { position:absolute; top:0; left:0; }
.health-heading .eyebrow { justify-content:center; padding-top:22px; font-size:9px; letter-spacing:1.2px; }
.health-heading h1 { font-size:76px; line-height:1.09; letter-spacing:-3.7px; margin-top:20px; }
.hero-subtitle { display:block; font-size:27px; letter-spacing:-.7px; line-height:1.4; font-weight:600; margin-top:12px; color:#415775; }
.hero-intro { max-width:610px; margin:20px auto 0; color:var(--muted); font-size:14px; line-height:1.8; text-wrap:pretty; }
.hero-actions { display:flex; justify-content:center; align-items:center; gap:27px; margin-top:25px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:20px; min-height:46px; padding:14px 19px; border:1px solid var(--navy); border-radius:12px; background:var(--navy); color:#f8fafc; font-size:11px; font-weight:700; box-shadow:0 7px 18px #14264215; transition:background .2s,transform .2s,box-shadow .2s; }
.button .icon { width:16px; height:16px; }
.button:hover { transform:translateY(-2px); background:#1d355a; box-shadow:0 12px 25px #14264222; }
.button.outline { border-color:#c7d4e5; color:var(--navy); background:white; box-shadow:none; }
.text-link { display:inline-flex; align-items:center; gap:14px; font-size:11px; font-weight:600; padding:7px 0; }
.text-link:hover { color:var(--accent); }
.text-link .icon { width:16px; height:16px; }
.scene-composition { height:440px; position:relative; margin-top:24px; isolation:isolate; }
.scene-caption { position:absolute; top:8px; left:0; right:0; display:flex; align-items:center; gap:8px; font-size:8px; letter-spacing:1.3px; color:#62748d; }
.scene-caption>span:last-child { margin-left:auto; font-size:7px; letter-spacing:1px; }
.cloud-host { position:absolute; inset:20px 0 43px; cursor:grab; touch-action:pan-y; outline-offset:-6px!important; }
.cloud-host.dragging { cursor:grabbing; }
.cloud-host canvas { display:block; width:100%; height:100%; }
.cloud-fallback { margin:90px auto; max-width:380px; text-align:center; color:var(--muted); }
.scene-core { pointer-events:none; position:absolute; left:50%; top:49%; transform:translate(-50%,-50%); text-align:center; z-index:1; width:235px; padding:30px 0; background:radial-gradient(ellipse,#f5f8fbe8 36%,#f5f8fb80 56%,transparent 71%); }
.scene-core>span { display:block; font-size:26px; letter-spacing:-1px; font-weight:500; line-height:1.15; }
.scene-core>strong { display:block; font-size:31px; letter-spacing:-1.2px; line-height:1.1; color:var(--navy); font-weight:800; }
.scene-core>small { display:block; margin-top:12px; font-size:7px; color:#6d7e96; }
.cloud-label { display:flex; align-items:center; gap:12px; position:absolute; z-index:2; padding:12px 14px; text-align:left; border:1px solid transparent; border-radius:12px; background:linear-gradient(110deg,#f8fafcf2,#f8fafcba); transition:transform .2s,border-color .2s,background .2s; }
.cloud-label:hover,.cloud-label.selected { background:#fff; border-color:#c5d5ec; transform:translateY(-3px); }
.cloud-label>.icon { color:#345f94; width:23px; height:23px; }
.cloud-label>span { font-size:12px; font-weight:800; }
.cloud-label small { display:block; color:var(--muted); font-size:9px; font-weight:500; margin-top:4px; }
.cloud-label>i { align-self:flex-start; font-size:8px; font-style:normal; color:#7f91aa; margin-left:10px; }
.cloud-label-pod { top:17%; left:8%; }
.cloud-label-catalog { top:19%; right:8%; }
.cloud-label-apps { bottom:20%; left:12%; }
.cloud-label-consent { bottom:22%; right:12%; }
.cloud-label-consent .icon { color:#d67a27; }
.scene-bottom { position:absolute; left:0; right:0; bottom:17px; display:flex; gap:8px; align-items:center; font-size:9px; color:var(--muted); }
.rotate-hint { margin-left:auto; font-size:7px; letter-spacing:1px; }
.hero-principles { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); padding:25px 0 29px; gap:45px; }
.hero-principles>div { display:flex; align-items:flex-start; gap:14px; }
.hero-principles>div>span { font-size:9px; font-weight:800; margin-top:4px; color:var(--accent); }
.hero-principles p { font-size:11px; color:var(--muted); }
.hero-principles strong { display:block; font-size:12px; font-weight:700; margin-bottom:3px; color:var(--navy); }
.chapter-nav { display:flex; align-items:center; gap:35px; background:white; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:21px var(--pad); font-size:10px; color:var(--muted); }
.chapter-nav>span { color:var(--navy); font-size:9px; font-weight:800; letter-spacing:1px; margin-right:auto; }
.chapter-nav a:hover { color:var(--accent); }
.section { padding:90px var(--pad); scroll-margin-top:24px; }
.section,.home-hero,.twin,.legal-page,.funding-footer { position:relative; isolation:isolate; }
.section:before,.home-hero:before,.twin:before,.legal-page:before,.funding-footer:before { content:''; position:absolute; z-index:-1; inset:0; background:url('assets/point-field.svg') center top / max(100%,1100px) 820px repeat-y; opacity:.55; pointer-events:none; }
.section:nth-of-type(even):before { transform:scaleX(-1); }
.home-hero:before { top:clamp(520px,47vw,680px); opacity:.65; }
.funding-footer:before { background-position:center; opacity:.35; }
.section-heading { display:flex; justify-content:space-between; align-items:flex-end; gap:65px; margin-bottom:40px; }
.section-heading h2 { font-size:38px; line-height:1.2; letter-spacing:-1.5px; margin-top:16px; }
.section-heading>p { font-size:13px; color:var(--muted); max-width:380px; }
.explorer { background:white; }
.explorer-layout { display:grid; grid-template-columns:235px 1fr; border:1px solid #d9e2ef; border-radius:18px; overflow:hidden; background:white; box-shadow:0 24px 60px #1426420b; }
.explorer-toolbar { grid-column:1/-1; display:flex; align-items:center; gap:12px; padding:17px 23px; border-bottom:1px solid var(--line); color:var(--navy); font-size:12px; }
.workspace-mark { display:grid; place-items:center; width:29px; height:29px; border-radius:8px; background:var(--navy); color:white; font-size:15px; font-weight:800; }
.explorer-toolbar>span:nth-of-type(2) { font-size:10px; color:var(--muted); border-left:1px solid var(--line); padding-left:13px; margin-left:3px; }
.explorer-toolbar>i { margin-left:auto; font-style:normal; color:#62748d; font-size:9px; }
.lens-tabs { display:flex; flex-direction:column; gap:7px; padding:22px 13px; background:#f8fafc; border-right:1px solid var(--line); }
.lens-tabs>button { display:flex; gap:9px; align-items:center; text-align:left; padding:16px 11px; border:0; border-radius:8px; background:transparent; color:#52657e; }
.lens-tabs>button>span:first-child { display:none; }
.lens-tabs>button>span:last-child { margin-left:auto; font-size:12px; }
.lens-tabs .icon { width:18px; height:18px; }
.lens-tabs strong { font-size:10px; font-weight:600; }
.lens-tabs>button[aria-selected=true] { background:#eaf2ff; color:#1d4ed8; }
.lens-tabs>button:hover { background:#edf3fd; }
#lens-panel { display:grid; grid-template-columns:1.1fr 1fr; gap:35px; padding:38px 34px; min-height:395px; align-items:center; }
.lens-copy h3 { font-size:25px; letter-spacing:-.8px; line-height:1.25; margin:12px 0 16px; }
.lens-copy>p { font-size:12px; color:var(--muted); line-height:1.85; }
.lens-copy .eyebrow { font-size:8px; }
.lens-copy ul { list-style:none; padding:0; margin:20px 0 0; display:grid; gap:9px; }
.lens-copy li { display:flex; gap:9px; align-items:flex-start; font-size:10px; color:#3e526b; line-height:1.7; }
.lens-copy li>.icon { color:#345e96; width:13px; height:13px; margin-top:2px; }
.workspace-preview { border:1px solid #dae3ef; border-radius:12px; background:#fbfcff; overflow:hidden; min-width:0; box-shadow:0 12px 25px #14264208; }
.preview-head { display:flex; align-items:center; gap:9px; background:var(--navy); color:white; padding:16px 17px; font-size:10px; font-weight:700; }
.preview-head .icon { width:16px; height:16px; }
.preview-head small { display:none; }
.preview-path { padding:15px 16px; color:#687b94; font-size:9px; border-bottom:1px solid var(--line); }
.preview-path>span { padding:0 7px; }
.preview-row { display:flex; align-items:center; gap:9px; padding:16px; border-bottom:1px solid #e9eef5; }
.preview-row .icon { width:16px; height:16px; color:#3e6c9f; }
.preview-row strong { font-size:9px; font-weight:600; }
.preview-row>span { margin-left:auto; font-size:8px; color:var(--muted); }
.preview-note { display:flex; gap:8px; align-items:center; font-size:8px; padding:16px; color:#677c99; }
.preview-note .icon { width:13px; height:13px; }
.workspace-preview figcaption { border-top:1px solid var(--line); background:white; font-size:7px; padding:10px 16px; color:#7a8ca5; }
.request-preview { padding:20px 17px; }
.request-preview>span { font-size:8px; color:var(--muted); }
.request-preview h4 { font-size:14px; margin:12px 0; }
.request-preview p { font-size:10px; color:var(--muted); }
.request-preview .button { padding:10px 12px; min-height:36px; font-size:8px; margin-top:18px; gap:7px; }
.results { background:#f4f7fb; }
.result-list { border-top:1px solid #d8e2ef; }
.result-list>article { display:grid; grid-template-columns:30px 1.05fr 1fr auto; gap:28px; align-items:center; padding:29px 0; border-bottom:1px solid #d8e2ef; }
.result-list>article>span:first-child { color:var(--accent); font-size:10px; font-weight:700; }
.result-list>article>div { display:flex; align-items:center; gap:18px; }
.result-list h3 { font-size:18px; line-height:1.35; letter-spacing:-.4px; }
.result-list .icon { color:#3d6193; }
.result-list p { font-size:12px; color:var(--muted); }
.result-badge { border:1px solid #cbd9eb; color:#557297; padding:6px 9px; border-radius:5px; font-size:7px; font-weight:700; white-space:nowrap; }
.story { background:#142642; color:#f8fafc; position:relative; }
.story .eyebrow { color:#91abca; }
.story .section-heading>p { color:#b9c6d9; }
.story-layout { display:grid; grid-template-columns:.85fr 1.5fr; gap:65px; align-items:start; }
.story-steps { display:flex; flex-direction:column; gap:4px; }
.story-steps>button { display:flex; align-items:center; gap:17px; padding:24px 17px; border:1px solid transparent; border-bottom-color:#ffffff13; background:transparent; color:white; text-align:left; border-radius:8px; }
.story-steps>button>span:first-child { display:grid; place-items:center; width:31px; height:31px; border:1px solid #7b9abf66; border-radius:9px; font-size:10px; flex-shrink:0; }
.story-steps strong { font-size:15px; font-weight:700; }
.story-steps small { display:block; color:#9fb4d1; font-size:10px; margin-top:5px; }
.story-steps>button>span:last-child { margin-left:auto; color:#91abca; }
.story-steps>button[aria-selected=true] { background:#203b5f; border-color:#3b5c88; }
.story-steps>button[aria-selected=true]>span:first-child { background:#c7dcfa; border-color:#c7dcfa; color:#142642; }
.story-panel { background:white; color:var(--ink); border:1px solid #547295; border-radius:14px; overflow:hidden; box-shadow:0 22px 55px #08152530; }
.story-map-head { display:flex; align-items:center; justify-content:space-between; padding:15px 20px; color:#4f6b8a; font-size:8px; gap:12px; border-bottom:1px solid var(--line); }
.story-map-head>span:first-child { display:flex; align-items:center; gap:8px; }
.story-map-head .icon { width:14px; height:14px; }
.story-map-head>span:last-child { color:#8292a6; font-size:6px; }
.story-map { width:100%; height:auto; display:block; background:#eff3ec; }
.story-text { padding:26px 30px 30px; border-top:1px solid var(--line); }
.story-text .eyebrow { color:#6880a0; font-size:8px; }
.story-text h3 { font-size:23px; line-height:1.3; letter-spacing:-.7px; margin:13px 0; }
.story-text>p { color:var(--muted); font-size:12px; min-height:64px; }
.story-text .button { margin-top:20px; font-size:10px; min-height:42px; padding:12px 17px; }
.applications { background:white; }
.app-grid { display:grid; grid-template-columns:1fr 1fr; gap:0 60px; border-top:1px solid var(--line); }
.app-grid>article { position:relative; padding:33px 0; border-bottom:1px solid var(--line); min-width:0; }
.app-symbol { position:absolute; top:29px; right:0; width:38px; height:38px; border-radius:10px; background:#eef4fc; display:grid; place-items:center; color:#315c93; }
.app-symbol .icon { width:20px; height:20px; }
.app-grid .eyebrow { font-size:8px; margin-right:50px; }
.app-grid h3 { font-size:26px; letter-spacing:-.7px; margin:18px 0 14px; }
.app-grid p { font-size:13px; color:var(--muted); max-width:510px; }
.app-tags { display:flex; flex-wrap:wrap; gap:15px; margin:19px 0 10px; }
.app-tags span { color:#486996; font-size:9px; border-bottom:1px solid #cbd9eb; padding-bottom:4px; }
.app-grid .text-link { font-size:10px; }
.app-note { font-size:10px; color:var(--muted); display:block; margin-top:15px; }
.context { border-top:1px solid var(--line); background:#f0f5fb; }
.context>div { display:grid; grid-template-columns:1fr 1fr; gap:90px; margin-top:20px; }
.context h2 { font-size:36px; line-height:1.25; letter-spacing:-1.2px; }
.context p:not(.eyebrow) { font-size:13px; color:var(--muted); }
.context .button { margin-top:23px; }
.funding-footer { display:grid; grid-template-columns:1fr auto; align-items:end; gap:36px; padding:32px var(--pad) 36px; background:white; border-top:1px solid var(--line); }
.funding-footer img { display:block; height:auto; object-fit:contain; }
.legal-links { display:flex; flex-wrap:wrap; gap:22px; font-size:11px; color:var(--muted); }
.legal-links a { padding:8px 0; }
.legal-links a:hover,.legal-links a[aria-current] { color:var(--accent); }
.funding-block { justify-self:end; text-align:right; }
.funding-logos { display:flex; align-items:center; justify-content:flex-end; gap:36px; }
.funding-number { margin-top:16px; font-size:10px; letter-spacing:.15px; color:var(--muted); }
.funding-number strong { color:var(--navy); font-weight:600; }
.funding-bmwsb { width:200px; }
.funding-kfw { width:110px; }
.home-hero { padding:0 var(--pad) 60px; overflow:clip; background:radial-gradient(ellipse at 50% 30%,#e5eefb55,transparent 65%); }
.home-stage { position:relative; margin:0 calc(-1 * var(--pad)); height:clamp(520px,47vw,680px); isolation:isolate; }
.home-heading { position:absolute; z-index:2; top:46%; left:50%; transform:translate(-50%,-50%); width:min(630px,90%); text-align:center; pointer-events:none; }
.home-heading:before { content:''; position:absolute; z-index:-1; inset:-75px -80px; background:radial-gradient(ellipse,#f8fafc 10%,#f8fafcf0 33%,#f8fafc99 50%,transparent 72%); }
.home-heading h1 { margin:22px 0; font-size:70px; line-height:1.05; letter-spacing:-3px; }
.home-heading .hero-subtitle { font-size:41px; margin-top:5px; }
.home-heading>p:last-child { font-size:14px; color:var(--muted); }
.home-hero .scene-composition { position:absolute; inset:0; width:100%; max-width:none; margin:0; height:100%; }
.home-hero .cloud-host { inset:0; }
.home-hero .scene-caption,.home-hero .scene-bottom { display:none; }
.project-gates { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.project-gate { display:block; min-width:0; border:1px solid #d7e1ef; border-radius:16px; background:#fff; box-shadow:0 12px 30px #14264206; transition:transform .2s,border-color .2s,box-shadow .2s; }
.project-gate:hover { transform:translateY(-4px); border-color:#7d9fc7; box-shadow:0 18px 35px #1426420d; }
.project-visual { position:relative; border-radius:15px 15px 0 0; }
.project-visual>img { display:block; width:100%; height:auto; aspect-ratio:16/9; object-fit:cover; border-radius:inherit; }
.project-badge { position:absolute; left:28px; bottom:-32px; width:78px; height:78px; display:grid; place-items:center; padding:6px; border:1px solid #dce4ed; border-radius:50%; background:white; box-shadow:0 5px 14px #14264212; }
.project-badge img { display:block; width:100%; height:100%; object-fit:contain; border-radius:50%; }
.project-copy { padding:50px 30px 27px; }
.project-gate h2 { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 0 12px; font-size:30px; letter-spacing:-1px; }
.project-gate h2>span { color:#4776b0; font-size:20px; }
.project-gate p { color:var(--muted); font-size:12px; }
.gate-link { display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--line); margin-top:22px; padding-top:17px; font-size:11px; font-weight:600; }
.gate-link .icon { width:17px; height:17px; }
.twin { padding:35px var(--pad) 90px; min-height:740px; text-align:center; }
.twin>.back { display:block; text-align:left; }
.twin .scene-composition { width:min(550px,100%); height:245px; margin:10px auto; }
.twin .scene-caption,.twin .scene-bottom { display:none; }
.twin-copy>.eyebrow { justify-content:center; }
.twin-copy h1 { font-size:55px; letter-spacing:-2px; margin:22px 0; }
.twin-copy h2 { font-size:22px; margin-bottom:15px; }
.twin-copy>p:not(.eyebrow) { color:var(--muted); font-size:13px; }
.twin-copy .button { margin-top:25px; }
.legal-page { min-height:calc(100vh - 320px); padding:38px var(--pad) 80px; }
.legal-heading,.legal-content,.legal-page>.text-link { max-width:820px; margin-left:auto; margin-right:auto; }
.legal-heading { padding-top:50px; }
.legal-heading h1 { font-size:54px; letter-spacing:-2px; line-height:1.2; margin:18px 0 24px; }
.template-notice { padding:18px 22px; background:#eef4fc; border-left:3px solid #79a2cb; border-radius:0 8px 8px 0; color:#48617e; font-size:13px; }
.legal-content { margin-top:42px; }
.legal-content>section { padding:24px 0; border-bottom:1px solid var(--line); }
.legal-content h2 { font-size:19px; letter-spacing:-.4px; margin-bottom:12px; }
.legal-placeholder { color:var(--muted); font-size:13px; }
.legal-page>.text-link { display:flex; width:fit-content; margin-top:35px; }
.no-script { max-width:700px; padding:70px 25px; margin:auto; }
@media(max-width:1100px) {
  :root { --pad:35px; }
  .masthead nav { gap:22px; font-size:11px; }
  .health-heading h1 { font-size:64px; }
  .hero-subtitle { font-size:24px; }
  .health-heading .eyebrow { padding-top:33px; }
  .scene-composition { height:420px; }
  .cloud-label-pod { left:0; }.cloud-label-catalog { right:0; }
  .cloud-label-apps { left:2%; }.cloud-label-consent { right:2%; }
  .cloud-label>i { display:none; }
  .rotate-hint { display:none; }
  .hero-principles { gap:22px; }
  .hero-principles strong { font-size:11px; }
  .hero-principles p { font-size:10px; }
  .section { padding-top:70px; padding-bottom:70px; }
  .section-heading { gap:35px; }
  .section-heading h2 { font-size:32px; }
  .section-heading>p { max-width:320px; font-size:12px; }
  .explorer-layout { grid-template-columns:190px 1fr; }
  .lens-tabs { padding:18px 8px; }
  .lens-tabs>button { padding:15px 8px; gap:7px; }
  .lens-tabs strong { font-size:9px; }
  #lens-panel { grid-template-columns:1fr; gap:25px; padding:28px; }
  .workspace-preview { width:100%; max-width:410px; }
  .lens-copy h3 { font-size:27px; }
  .result-list>article { grid-template-columns:22px 1fr 1.1fr; gap:22px; }
  .result-list h3 { font-size:17px; }
  .result-badge { display:none; }
  .story-layout { gap:32px; grid-template-columns:.85fr 1.25fr; }
  .story-steps>button { padding:23px 10px; gap:12px; }
  .story-steps strong { font-size:13px; }
  .story-steps small { font-size:9px; }
  .story-map-head>span:last-child { display:none; }
  .story-text { padding:24px; }
  .story-text h3 { font-size:21px; }
  .app-grid { gap:0 35px; }
  .app-grid h3 { font-size:23px; }
  .context>div { gap:50px; }
  .context h2 { font-size:32px; }
}
@media(max-width:760px) {
  :root { --pad:22px; }
  .section:before,.home-hero:before,.twin:before,.legal-page:before,.funding-footer:before { background-position:left top; opacity:.3; }
  .health-hero { padding-top:23px; }
  .health-heading .back { position:static; display:block; text-align:left; font-size:10px; }
  .health-heading .eyebrow { padding-top:28px; font-size:6px; letter-spacing:.7px; gap:6px; }
  .health-heading h1 { font-size:clamp(43px,12.6vw,69px); letter-spacing:-2.1px; margin-top:18px; }
  .hero-subtitle { font-size:19px; line-height:1.4; letter-spacing:-.5px; margin:12px auto 0; max-width:300px; }
  .hero-intro { font-size:12px; line-height:1.8; margin-top:17px; }
  .hero-actions { flex-wrap:wrap; gap:10px 17px; margin-top:22px; }
  .hero-actions .button { font-size:10px; padding:13px 15px; gap:12px; min-height:43px; }
  .hero-actions .text-link { font-size:10px; }
  .scene-composition { height:375px; margin-top:25px; }
  .scene-caption { font-size:6px; letter-spacing:1px; }
  .scene-caption>span:last-child { display:none; }
  .cloud-host { inset:24px -16px 66px; }
  .scene-core { top:47%; width:170px; padding:25px 0; }
  .scene-core>span { font-size:18px; }
  .scene-core>strong { font-size:22px; }
  .scene-core>small { font-size:5px; margin-top:9px; }
  .cloud-label { padding:9px 6px; gap:7px; background:#f8fafce6; }
  .cloud-label>span { font-size:9px; }
  .cloud-label small { font-size:6px; }
  .cloud-label>.icon { width:17px; height:17px; }
  .cloud-label-pod { top:12%; left:0; }.cloud-label-catalog { top:16%; right:0; }
  .cloud-label-apps { bottom:25%; left:0; }.cloud-label-consent { bottom:23%; right:0; }
  .scene-bottom { bottom:40px; right:0; font-size:7px; }
  .hero-principles { grid-template-columns:1fr; gap:16px; padding:23px 0; }
  .hero-principles strong { display:inline; font-size:10px; }
  .hero-principles p { font-size:10px; }
  .hero-principles>div { align-items:baseline; gap:12px; }
  .chapter-nav { padding-top:16px; padding-bottom:16px; white-space:nowrap; gap:24px; overflow-x:auto; font-size:9px; }
  .chapter-nav>span { display:none; }
  .section { padding-top:55px; padding-bottom:55px; }
  .section-heading { flex-direction:column; align-items:stretch; gap:20px; margin-bottom:28px; }
  .section-heading .eyebrow { font-size:7px; letter-spacing:.6px; }
  .section-heading h2 { font-size:30px; letter-spacing:-1px; margin-top:15px; }
  .section-heading>p { max-width:none; font-size:12px; }
  .explorer-layout { grid-template-columns:1fr; border-radius:12px; }
  .explorer-toolbar { padding:15px; gap:9px; font-size:11px; }
  .explorer-toolbar>span:nth-of-type(2) { display:none; }
  .explorer-toolbar>i { font-size:7px; }
  .lens-tabs { display:grid; grid-template-columns:1fr 1fr; gap:4px; border:0; border-bottom:1px solid var(--line); padding:12px 8px; }
  .lens-tabs>button { padding:13px 6px; gap:6px; }
  .lens-tabs>button>span:last-child { display:none; }
  .lens-tabs .icon { width:16px; height:16px; }
  .lens-tabs strong { font-size:8px; }
  #lens-panel { padding:25px 19px; gap:25px; }
  .lens-copy h3 { font-size:25px; }
  .lens-copy>p { font-size:11px; }
  .lens-copy li { font-size:9px; }
  .preview-row { padding:14px 12px; gap:7px; }
  .preview-row strong { font-size:8px; }
  .preview-row>span { font-size:7px; }
  .result-list>article { grid-template-columns:18px 1fr; gap:12px 13px; padding:24px 0; }
  .result-list>article>p { grid-column:2; font-size:11px; }
  .result-list>article>div { gap:10px; }
  .result-list h3 { font-size:16px; }
  .result-list .icon { width:20px; height:20px; }
  .story-layout { grid-template-columns:1fr; gap:28px; }
  .story-steps>button { padding:16px 12px; }
  .story-steps strong { font-size:14px; }
  .story-text { padding:23px 20px; }
  .story-text>p { min-height:0; font-size:11px; }
  .story-text h3 { font-size:21px; }
  .app-grid { grid-template-columns:1fr; }
  .app-grid>article { padding:28px 0; }
  .app-grid h3 { font-size:25px; }
  .app-grid p { font-size:12px; }
  .context>div { grid-template-columns:1fr; gap:22px; }
  .context h2 { font-size:30px; }
  .context p:not(.eyebrow) { font-size:12px; }
  .context .button { font-size:9px; padding:13px 14px; }
  .funding-footer { grid-template-columns:1fr; gap:28px; padding-top:24px; padding-bottom:30px; }
  .funding-logos { gap:25px; }
  .funding-bmwsb { width:160px; }
  .funding-kfw { width:90px; }
  .home-hero { padding-top:0; padding-bottom:36px; }
  .home-stage { height:480px; }
  .home-hero:before { top:480px; }
  .home-heading { width:calc(100% - 44px); }
  .home-heading:before { inset:-60px -12px; }
  .home-heading h1 { font-size:48px; letter-spacing:-2px; }
  .home-heading .hero-subtitle { font-size:30px; }
  .home-heading>p:last-child { font-size:12px; max-width:280px; margin:auto; }
  .home-hero .scene-composition { height:100%; }
  .project-gates { grid-template-columns:1fr; gap:18px; }
  .project-copy { padding:45px 22px 22px; }
  .project-badge { width:68px; height:68px; left:20px; bottom:-29px; }
  .project-gate h2 { font-size:clamp(22px,6vw,27px); }
  .project-gate p { font-size:11px; }
  .twin { min-height:720px; padding-top:23px; padding-bottom:60px; }
  .twin .scene-composition { height:230px; }
  .twin-copy>.eyebrow { font-size:7px; }
  .twin-copy h1 { font-size:36px; letter-spacing:-1.5px; }
  .twin-copy h2 { font-size:18px; }
  .twin-copy>p:not(.eyebrow) { font-size:12px; }
  .legal-page { padding-top:24px; padding-bottom:50px; }
  .legal-heading { padding-top:35px; }
  .legal-heading h1 { font-size:40px; letter-spacing:-1.5px; }
  .template-notice { padding:16px; font-size:12px; }
  .legal-content { margin-top:25px; }
  .legal-content h2 { font-size:18px; }
  .legal-placeholder { font-size:12px; }
}
@media(max-width:900px) {
  .masthead { grid-template-columns:1fr auto auto; gap:18px; min-height:96px; }
  .masthead nav { display:none; }
  .smart-city-logo { width:52px; height:52px; }
  .institution-logos { gap:12px; }
  .institute-logo { width:48px; height:48px; }
  .university { padding-left:12px; }
  .university-logo { width:145px; }
  .menu-toggle { display:grid; place-items:center; grid-column:3; grid-row:1; width:42px; height:42px; border:1px solid var(--line); border-radius:10px; background:white; color:var(--navy); }
  .menu-toggle svg { width:22px; height:22px; }
  .menu-toggle[aria-expanded=true] { color:var(--accent); border-color:#b3c9ed; }
  .masthead.menu-open nav { display:flex; flex-direction:column; align-items:stretch; gap:0; position:absolute; top:calc(100% + 8px); left:0; right:0; padding:12px 20px; border:1px solid var(--line); border-radius:12px; background:white; box-shadow:0 16px 40px #14264218; }
  .masthead.menu-open nav a { padding:16px 0; font-size:13px; }
}
@media(max-width:600px) {
  .masthead { grid-template-columns:1fr auto; row-gap:12px; padding:17px 0 12px; }
  .wordmark { grid-column:1; grid-row:1; gap:10px; }
  .smart-city-logo { width:48px; height:48px; }
  .wordmark-text { font-size:17px; }
  .wordmark-text>span { font-size:13px; }
  .menu-toggle { grid-column:2; }
  .institution-logos { grid-column:1 / -1; grid-row:2; }
  .institute-logo { width:40px; height:40px; }
  .university-logo { width:140px; }
}
@media(prefers-reduced-motion:reduce) { *,*:before,*:after { scroll-behavior:auto!important; transition:none!important; } }