﻿/* Runde 9: eine gemeinsame Bildlandschaft und ein bedienbarer Programmraum. */
#reise{height:1207.5svh}
.categories{padding:0 5.5%;isolation:isolate}
.categories-heading{position:absolute;left:6%;right:6%;top:13%;display:flex;align-items:end;justify-content:space-between;gap:4vw}
.categories-heading h2{position:static;font-size:clamp(42px,4.7vw,112px);max-width:10em}
.categories-heading>p{max-width:36ch;color:#c7ddec;font-size:clamp(15px,1.2vw,27px)}
.category-landscape{position:absolute;inset:30% 5.5% 16%;display:grid;grid-template-columns:1.24fr .87fr 1.04fr 1.12fr;gap:2.5vw;align-items:start;perspective:1200px;pointer-events:auto}
.category{min-width:0;position:relative;isolation:isolate;transform-style:preserve-3d}
.category:nth-child(2){padding-top:6vh}.category:nth-child(3){padding-top:2.5vh}.category:nth-child(4){padding-top:8vh}
.category-art{height:28vh;position:relative;overflow:hidden;mask-image:linear-gradient(transparent,#000 8%,#000 75%,transparent);transform-origin:50% 60%}
.category:first-child .category-art{height:34vh}.category:nth-child(3) .category-art{height:31vh}
.category-art picture,.category-art img,.category-art canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.category-art canvas{opacity:0}.category-art.ready canvas{opacity:1}.category-art.ready picture{opacity:0}
.category details{position:relative;z-index:2;margin-top:-1vh;padding:0 3%;color:#edf6ff}
.category summary{cursor:pointer;list-style:none;min-height:44px;outline-offset:7px}
.category summary::-webkit-details-marker{display:none}.category summary:focus-visible{outline:2px solid var(--neon)}
.category h3{font-size:clamp(23px,2.1vw,48px);line-height:1.06;letter-spacing:-.04em;text-wrap:balance;margin:0 0 14px}
.category p{font-size:clamp(13px,1.05vw,24px);line-height:1.45;color:#c5d8eb}
.category summary::after{content:'+';position:absolute;right:0;top:-8px;font-size:22px;color:#a7d7f0}
.category details[open] summary::after{content:'−'}
.category-detail{font-size:clamp(13px,.95vw,22px);line-height:1.5;color:#f1f6fc;background:#06162f;padding:14px 16px;margin:12px -3% 0;border-left:2px solid #74c2e6}
.category-foot{position:absolute;left:6%;right:6%;bottom:10%;display:flex;align-items:center;justify-content:space-between;gap:24px;color:#b3cbdf;font-size:clamp(11px,.9vw,20px)}
.category-foot p{max-width:65ch}.category-arrows{display:none}.category-arrows button{width:44px;height:44px;background:#123155}
#office-film{transition:opacity .4s var(--ease-out)}
.light h2{font-size:clamp(54px,6.4vw,150px);max-width:11ch;top:20%;z-index:5;pointer-events:none}
.light #film-copy{display:none}.film-controls{z-index:6;bottom:12%;gap:12px}
.light.pc-active h2{font-size:clamp(30px,3.3vw,76px);max-width:90%;top:12%;transition:opacity .25s var(--ease-out)}
.light.pc-active .film-controls{bottom:8%;left:auto;right:6%}
#monitor-stage{position:absolute;inset:0;perspective:1200px;overflow:hidden;pointer-events:auto}
.monitor-room{position:absolute;inset:0;background:linear-gradient(#03112755,#03112722),url('assets/bilder/licht-warm-2304.webp') center/cover;transform:scale(1.04)}
#monitor-shell{position:absolute;left:11%;top:25%;width:78%;height:60%;padding:8px;border:2px solid #6388a3;border-radius:12px;background:#09111b;box-shadow:0 24px 65px #020814bb;transform:perspective(1200px) rotateY(-8deg) scale(.72);transform-origin:50% 50%;will-change:transform}
#monitor-shell:after{content:'';position:absolute;top:100%;left:43%;width:14%;height:5vh;background:linear-gradient(90deg,#0c1825,#5c7585,#132132);clip-path:polygon(20% 0,80% 0,100% 100%,0 100%)}
#desktop-home,#desktop-fullscreen{height:100%;width:100%}
#monitor-open{position:absolute;inset:0;width:100%;background:transparent;z-index:10;display:flex;justify-content:center;align-items:end;padding-bottom:18px}
#monitor-open>span{background:#ecf5fa;color:#071b30;padding:12px 20px;border-radius:3px;box-shadow:0 4px 30px #0008;font-size:clamp(13px,1vw,22px)}
#pc-dialog{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;border:0;border-radius:0;padding:0;background:#08162d;color:#ecf5ff;overflow:hidden;box-shadow:none}
#pc-dialog::backdrop{background:#031025}#pc-close{position:absolute;z-index:25;right:22px;top:13px;min-height:44px;padding:8px 14px;background:#203c59;color:#fff;font-size:14px}
#pc-close span{margin-left:12px;font-size:23px;vertical-align:middle}
#agent-desktop{height:100%;width:100%;position:relative;display:flex;flex-direction:column;background:radial-gradient(ellipse at 90% 100%,#1257a0,#0b294c 50%,#07172c);color:#edf6ff;overflow:hidden;border-radius:5px;font-size:clamp(12px,1.05vw,25px);container-type:inline-size}
.desktop-top{height:12%;min-height:48px;display:flex;align-items:center;gap:25px;padding:0 3%;background:#091a2b;border-bottom:1px solid #34506a;flex-shrink:0}
.desktop-brand{font-family:'Familjen Grotesk',sans-serif;font-size:1.55em;white-space:nowrap}.demo-badge{font-family:'Instrument Sans',sans-serif;font-size:.55em;margin-left:12px;color:#bed5e7}
#agent-status{margin-left:auto;color:#bddadf;font-size:.9em}#agent-pause{background:transparent;color:#e2f2ff;font-size:.8em;padding:8px 10px;min-height:44px}
#agent-workspace{display:grid;grid-template-columns:18% minmax(0,1fr) 23%;gap:2%;padding:3%;flex:1;min-height:0;position:relative}
.app-dock{display:flex;flex-direction:column;gap:6px;align-self:start}.app-dock button{text-align:left;border-radius:4px;padding:14px 12px;min-height:44px;font-size:1em;background:transparent;color:#adcae3}
.app-dock button[aria-current]{background:#2465ab;color:white}.app-dock button:focus-visible{outline-offset:0}
.desktop-window{background:#f2f6f9;color:#142d45;border-radius:8px;overflow:hidden;box-shadow:0 14px 45px #00102540;position:relative;align-self:start;min-height:90%}
.window-bar{display:flex;align-items:center;justify-content:space-between;background:#dce8f0;padding:16px 22px;gap:12px;color:#23425b;font-size:.9em;border-bottom:1px solid #c5d6e3}
.window-state{font-size:.8em;color:#415f72}
#app-content{padding:5%;min-height:240px}#app-content h3{font-size:1.6em;letter-spacing:-.03em;margin-bottom:20px;line-height:1.15}
#app-content p{font-size:1em;color:#344e63;line-height:1.55;margin:8px 0}#app-content .sample-meta{font-size:.8em;color:#4c677c;margin-bottom:18px}
.demo-paper{padding:16px 18px;border-left:3px solid #4f8fbb;background:#e1ebf3;margin:18px 0;min-height:64px}
.demo-paper p{white-space:pre-line}.typing-text::after{content:'▏';color:#1f5e97}.demo-result{color:#225b3b!important;padding:12px 0;font-weight:600;min-height:42px}
.approval-request{border:1px solid #987337;background:#faf0dc;padding:16px;margin-top:16px;color:#614711;font-size:.9em}.approval-request strong{display:block;margin-bottom:6px}.approval-request p{color:#614711!important;font-size:.9em!important}
#demo-approve{margin-top:12px;background:#173e62;color:white;padding:10px 16px;min-height:44px;border-radius:3px}
.calendar-row{display:flex;gap:16px;align-items:center;padding:14px 12px;border-top:1px solid #cbdce8}.calendar-row span{color:#516d80;min-width:4em}.calendar-row.selected{background:#d4e8dc;color:#28563a}
.ledger{width:100%;border-collapse:collapse;font-size:.9em}.ledger td{border-bottom:1px solid #cedee8;padding:12px 8px}.ledger td:last-child{text-align:right}.ledger .highlight{background:#d9eadf}
.activity-log{padding:10px 0;min-width:0}.activity-log h3{font-size:1.25em;margin-bottom:12px}.activity-log>p{font-size:.78em;color:#a9c9e4;max-width:24ch}
#agent-log{padding:0;list-style:none;margin:24px 0 0}#agent-log li{font-size:.8em;line-height:1.45;padding:10px 0 10px 14px;border-left:1px solid #65b4b5;color:#d5e8f4;overflow-wrap:anywhere}#agent-log li:last-child{color:#c5efb0}
#agent-cursor{position:absolute;left:10%;top:20%;z-index:5;width:25px;pointer-events:none;filter:drop-shadow(0 2px 3px #0004)}#agent-cursor svg{display:block;width:25px;height:29px}#agent-cursor span{position:absolute;top:24px;left:16px;background:#173e62;color:white;border-radius:4px;font-size:12px;padding:4px 8px}
.desktop-actions{display:flex;align-items:center;justify-content:flex-end;gap:16px;padding:14px 3%;background:#081b30;border-top:1px solid #34506a;flex-shrink:0}
.desktop-actions a,.desktop-actions button,.intake-actions button,.finish-actions a,.finish-actions button{font-size:1em;min-height:44px;padding:12px 20px;border-radius:3px;background:#ecf5fa;color:#0c2842;font-weight:500}
.desktop-actions a{color:#deecf7;background:transparent;border:1px solid #6b8fae}.desktop-actions button{background:#c4ebac}
#pc-dialog #agent-desktop{padding-top:62px;border-radius:0}#pc-dialog .desktop-top{height:80px}.desktop-actions.in-intake{display:none}
#agent-desktop #intake{position:relative;inset:auto;width:100%;max-width:none;max-height:none;transform:none;margin:0;padding:3% 7%;overflow:auto;background:transparent;z-index:auto;flex:1;min-height:0;overscroll-behavior:contain;color:#edf6ff}
.intake-heading{margin-bottom:25px}.intake-heading>p{color:#a9c9e4;font-size:.85em;margin-bottom:10px}
#intake h2{position:static;font-size:clamp(30px,3.7vw,80px);max-width:20ch;margin:0;line-height:1.05;letter-spacing:-.04em;color:#f0f7ff}
#intake-form{max-width:1000px}#intake fieldset{margin:0;border:0;padding:0}#intake legend{margin:0 0 20px;color:#c7deef;font-size:1em}
.choice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px}.choice-grid label{display:flex;gap:14px;align-items:center;padding:14px 18px;min-height:56px;border:1px solid #52789b;border-radius:4px;margin:0;font-size:1em;background:#102e4d;cursor:pointer}
.choice-grid label:has(:checked){border-color:#b6e7af;background:#204c54;color:#f3ffef}.choice-grid input{accent-color:#b6e7af;width:18px;height:18px;flex:0 0 auto}.choice-grid label:focus-within{outline:2px solid #c4ebac;outline-offset:2px}
#intake .field-label{display:block;margin:22px 0 8px;font-size:.9em}
#intake input:not([type=checkbox]),#intake select,#intake textarea{display:block;width:100%;padding:12px;border:1px solid #6386a5;border-radius:3px;background:#0a223c;color:#f4f8ff;font-size:1em;min-height:48px;margin-top:7px}
#intake textarea{min-height:70px;max-height:160px;resize:vertical}#intake input::placeholder,#intake textarea::placeholder{color:#9fb8cf}
.company-fields,.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}.company-fields label,.contact-fields label{display:block;min-width:0;font-size:.95em}.contact-fields label:nth-child(2){grid-column:2}.contact-fields label:last-child{grid-column:1/-1}
#intake .data-note,#file-status{color:#bbd0e3;font-size:.82em;margin-top:18px;line-height:1.5}#intake [data-step="3"]>p{margin-top:24px}
#intake-error{color:#ffd0b8;font-size:.9em;min-height:1.5em;margin-top:12px}
.intake-actions{display:flex;justify-content:space-between;gap:20px;margin-top:20px}.intake-actions #intake-back{background:transparent;color:#d3e8f6;border:1px solid #7295b2}
#intake-finish{max-width:1000px}#intake-finish p{font-size:1em;color:#d4e8f5;line-height:1.55;margin:16px 0}.finish-message{font-size:1.5em!important;max-width:28ch}#intake-summary{display:grid;grid-template-columns:130px 1fr;gap:12px 20px;font-size:.9em;margin:30px 0;overflow-wrap:anywhere}#intake-summary dt{color:#a6c8df}#intake-summary dd{margin:0;white-space:pre-wrap}.finish-actions{display:flex;gap:12px;flex-wrap:wrap}.finish-actions a{background:#c4ebac}
@media(hover:hover) and (pointer:fine){.category summary:hover h3{color:#a9e1f2}.app-dock button:hover{background:#194775;color:white}.desktop-actions button:hover,.intake-actions button:hover,.finish-actions button:hover{filter:brightness(1.12)}#monitor-open:hover>span{background:#c4ebac}}
@media(max-width:1000px){#agent-workspace{grid-template-columns:22% minmax(0,1fr)}.activity-log{display:none}.category-landscape{gap:2vw}.categories-heading>p{max-width:24ch}.category-foot>span{display:none}}
@media(max-width:700px){
 .categories-heading{top:13%;left:24px;right:24px;display:block}.categories-heading h2{font-size:40px;max-width:10em}.categories-heading>p{font-size:13px;max-width:36ch;margin-top:14px}
 /* Am Handy steht nur Tims Preisgrundsatz; die Regeln-Zeile wiederholt sich in den Kategorien. */
 .categories-heading .nur-desktop{display:none}
 .category-landscape{display:flex;left:18px;right:0;top:35%;bottom:17%;overflow-x:auto;overflow-y:hidden;gap:26px;padding:0 24px 10px 6px;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none;perspective:none;touch-action:pan-x pan-y}
 .category{flex:0 0 78vw;padding-top:0!important;scroll-snap-align:start;transform:none!important}.category:nth-child(2){flex-basis:74vw}.category:nth-child(3){flex-basis:80vw}.category:nth-child(4){flex-basis:77vw}
 .category-art,.category:first-child .category-art,.category:nth-child(3) .category-art{height:27vh;max-height:245px}.category details{margin-top:0}.category h3{font-size:29px;margin-bottom:10px}.category p{font-size:14px}.category-detail{font-size:13px;padding:10px 12px;margin-top:8px}.category details[open] .category-detail{position:absolute;bottom:0;transform:translateY(8px);z-index:5;box-shadow:0 -25px 30px #041329}
 .category-foot{left:24px;right:24px;bottom:9%;font-size:10px;gap:8px}.category-foot p{max-width:29ch}.category-arrows{display:flex;gap:8px}
 .light h2{left:24px;top:20%;font-size:52px;max-width:10ch}.light.pc-active h2{font-size:34px;left:24px;top:13%;max-width:10ch}.film-controls{bottom:13%;left:24px;right:24px;gap:8px}.film-controls button{font-size:11px;padding:8px 10px}.light.pc-active .film-controls{right:20px;left:20px;bottom:10%}
 #monitor-shell{left:4%;width:92%;top:30%;height:52%;padding:4px;border-radius:7px;transform:scale(.88)}#monitor-open>span{font-size:12px;padding:10px 14px}
 #agent-desktop{font-size:12px}.desktop-top{padding:0 14px;gap:12px;min-height:48px;height:48px}.desktop-brand{font-size:20px}.demo-badge{font-size:10px;margin-left:5px}#agent-status{display:none}#agent-pause{font-size:10px;margin-left:auto;padding:4px}
 #agent-workspace{display:flex;flex-direction:column;gap:12px;padding:12px;overflow:auto}.app-dock{flex-direction:row;overflow-x:auto;width:100%;flex-shrink:0;gap:4px}.app-dock button{padding:8px;white-space:nowrap;font-size:11px;min-height:44px}.desktop-window{width:100%;min-height:240px;flex:1;flex-shrink:0}.window-bar{padding:12px;gap:6px}.window-state{font-size:10px}#app-content{padding:18px;min-height:180px}#app-content h3{font-size:22px;margin-bottom:12px}#app-content p{font-size:13px}.demo-paper{margin:12px 0;padding:12px}.desktop-actions{padding:10px;gap:8px;justify-content:center}.desktop-actions a,.desktop-actions button{font-size:11px;padding:10px 9px}
 #monitor-shell .desktop-actions{display:none}#monitor-shell .desktop-window{min-height:200px}#monitor-shell #app-content{padding:12px}#monitor-shell #agent-workspace{overflow:hidden}#monitor-shell #agent-pause{display:none}
 #pc-close{right:12px;top:8px;font-size:12px;padding:4px 12px;min-height:44px}#pc-dialog #agent-desktop{padding-top:60px}#pc-dialog .desktop-top{height:52px}
 #pc-dialog #agent-workspace{padding:18px 14px}#pc-dialog .desktop-window{min-height:330px;max-height:490px}.activity-log{display:none}
 #agent-desktop #intake{padding:20px 20px 28px}#intake h2{font-size:33px;max-width:15ch}.intake-heading{margin-bottom:22px}.intake-heading>p{font-size:12px}#intake legend{font-size:14px;line-height:1.4;margin-bottom:14px}
 .choice-grid{gap:8px;grid-template-columns:1fr 1fr}.choice-grid label{padding:11px 8px;font-size:12px;gap:8px;min-height:58px}.choice-grid input{width:16px;height:16px}#intake .field-label{font-size:13px;margin-top:18px}#intake input:not([type=checkbox]),#intake select,#intake textarea{font-size:16px;padding:10px}.company-fields,.contact-fields{grid-template-columns:1fr;gap:18px}.company-fields label,.contact-fields label{font-size:14px}.contact-fields label:nth-child(2){grid-column:auto}#intake .data-note,#file-status{font-size:12px}.intake-actions{gap:10px}.intake-actions button{font-size:12px;padding:12px}#intake-finish p{font-size:14px}.finish-message{font-size:24px!important}#intake-summary{grid-template-columns:1fr;gap:6px;font-size:14px;margin:24px 0}#intake-summary dd{margin-bottom:12px}.finish-actions{flex-direction:column}.finish-actions button,.finish-actions a{font-size:13px;text-align:center}
}
@media(prefers-reduced-motion:reduce){#monitor-shell{transform:none!important}.category-art canvas{display:none}.category-art.ready picture{opacity:1}.category-art{transform:none!important}#agent-cursor{display:none}}
.motion-paused .category-art{transform:none!important}
@media(max-height:700px){.category-art,.category:first-child .category-art,.category:nth-child(3) .category-art{height:23vh}.categories-heading{top:15%}.categories-heading h2{font-size:32px}.category h3{font-size:24px}.category p{font-size:12px}.category-landscape{top:32%;bottom:15%}.category-foot{bottom:10%}.category:nth-child(n){padding-top:0}.category-detail{font-size:12px}.desktop-top{min-height:44px}.intake-heading{margin-bottom:14px}}
/* Scoped overrides for the legacy intake typography. */
#intake fieldset label{font-family:'Instrument Sans',sans-serif;font-size:1em;line-height:1.4;min-height:48px;gap:12px}
#intake .choice-grid label{font-size:1em;min-height:56px}
#intake .intake-actions button{margin:0}#intake textarea{margin-top:6px}
.category:not(:first-child) .category-art canvas,.category:not(:first-child) .category-art picture{mix-blend-mode:screen}
.category-detail{position:absolute;bottom:calc(100% + 12px);left:0;right:0;margin:0;box-shadow:0 8px 30px #020b1d80}
.desktop-window{min-height:0;max-height:100%;overflow-y:auto}
#pc-dialog .desktop-window{min-height:72%}
#agent-cursor::before{content:'';position:absolute;width:36px;height:36px;border:2px solid #5caa77;border-radius:50%;left:-14px;top:-14px;opacity:0;transform:scale(.65);transition:opacity .12s,transform .2s var(--ease-out)}
#agent-cursor.clicking::before{opacity:1;transform:scale(1)}
#pc-dialog #intake-form{max-width:min(70vw,1400px)}
@media(max-width:700px){
 #intake fieldset label{font-size:14px;min-height:44px;gap:8px}#intake .choice-grid label{font-size:12px;min-height:54px}#intake .field-label{font-size:12px}
 #intake textarea{min-height:65px;max-height:120px}#pc-dialog #intake-form{max-width:none}
 .category details[open] .category-detail{bottom:calc(100% + 8px);transform:none;box-shadow:0 8px 30px #020b1d80}
 .journey-nav{gap:18px;right:18px;max-width:calc(100% - 40px)}.journey-nav a{font-size:11px}
 #pc-dialog .desktop-window{min-height:330px;max-height:none;flex:none}
}
.finish-review{margin:22px 0;color:#d7eafa}.finish-review summary{padding:12px 0;min-height:44px;cursor:pointer;font-size:1em}.finish-review summary:focus-visible{outline:2px solid #c4ebac;outline-offset:3px}
#intake-finish .finish-actions{margin:18px 0}
@media(min-width:2200px){
 .categories-heading h2{font-size:4.7vw}.categories-heading>p{font-size:1.2vw}.category h3{font-size:2.1vw}.category p{font-size:1.05vw}.category-detail{font-size:.95vw;padding:24px}.category-foot{font-size:.9vw}
 #agent-desktop{font-size:1.05vw}#intake h2{font-size:3.7vw}#pc-dialog #intake-form,#intake-finish{max-width:72vw}.choice-grid{gap:24px 36px}#intake .choice-grid label{padding:22px 28px}#intake textarea{min-height:140px}.intake-actions button,.finish-actions button,.finish-actions a{padding:22px 30px}#intake .intake-actions{margin-top:30px}#intake .field-label{margin-top:32px}#intake-step{font-size:1em}
 #pc-close{font-size:25px;min-height:65px}#pc-dialog #agent-desktop{padding-top:90px}#pc-dialog .desktop-top{height:110px}
}
@media(max-width:700px){
 #intake-finish .finish-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.finish-actions a{grid-column:1/-1;grid-row:1}.finish-actions button{font-size:12px;padding:10px 7px}#intake-finish .finish-message{font-size:21px!important;line-height:1.35}#intake-summary{font-size:13px}.finish-review{margin:10px 0}.finish-review summary{font-size:13px}
}
#intake #intake-back{font-size:1em}
@media(min-width:2200px){.choice-grid input{width:28px;height:28px}}
