@font-face{font-family:Jakarta;src:url('../landing/fonts/PlusJakartaSans-VariableFont_wght.ttf') format('truetype');font-weight:200 800;font-display:swap}
:root{font-family:Jakarta,system-ui,sans-serif;color:#182f3d;background:#f5f5ef;font-synthesis:none;--green:#437d69;--navy:#183b51}
*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #60a68a;outline-offset:4px}button:disabled{cursor:wait;opacity:.55}.masthead{max-width:1480px;margin:auto;padding:25px 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dce2da}.brand{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;font-size:11px;line-height:1.5;font-weight:700}.brand-mark{font-size:37px;letter-spacing:-3px;line-height:1}.brand-mark span{color:#5c9178}.tour-label{font-size:12px;color:#53675f;display:flex;gap:8px;align-items:center}.tour-label i,.footer-dot{display:inline-block;width:6px;height:6px;background:#588972;border-radius:50%}.quiet{border:0;background:transparent;color:#5a6b71;padding:7px 10px;font-size:12px;font-weight:600}.quiet:hover{color:#172d3b;background:#e8ede6;border-radius:6px}main{max-width:1410px;margin:auto;padding:0 48px}.intro{display:flex;align-items:flex-end;justify-content:space-between;padding:38px 0 28px;gap:25px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:#5b7a69;margin:0 0 14px}h1{font-size:clamp(27px,3.1vw,44px);line-height:1.22;letter-spacing:-1.9px;margin:0;font-weight:650}h1 span{color:#718374}.intro-copy{font-size:12px;line-height:1.85;color:#6a7777;margin:0 0 4px}.experience{border:1px solid #d2dbd2;border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 18px 65px -35px #1e3a4c70}.chapters{display:flex;padding:0 25px;border-bottom:1px solid #e5e9e5;gap:20px;background:#fcfdfb}.chapters button{border:0;border-bottom:3px solid transparent;padding:17px 8px 14px;background:transparent;color:#788480;font-size:12px;font-weight:650;white-space:nowrap}.chapters button span{font-size:10px;color:#98a89e;margin-right:8px;font-variant-numeric:tabular-nums}.chapters button[aria-current="step"]{border-color:#52856e;color:#284c3e}.chapters button[aria-current="step"] span{color:#52856e}.chapters button:hover{color:#284c3e}.browser-bar{height:35px;background:#eef2f2;display:flex;align-items:center;justify-content:space-between;padding:0 17px;color:#77878e;font-size:10px;border-bottom:1px solid #dce3e7}.window-dots{display:flex;gap:5px}.window-dots i{width:6px;height:6px;border-radius:50%;background:#c7d1d5}.demo-label{font-size:8px;font-weight:750;letter-spacing:1px;color:#7d8f89}.stage{position:relative;overflow:hidden;background:#f1f5f9;isolation:isolate}.viewport{width:1280px;height:630px;position:relative;transform-origin:top left}iframe{border:0;width:1280px;height:630px;display:block;pointer-events:none}#spotlight{position:absolute;pointer-events:none;border:2px solid #599f89;border-radius:9px;box-shadow:0 0 0 4px #599f8915;opacity:0;transition:all .7s cubic-bezier(.2,.8,.2,1)}#cursor{position:absolute;width:27px;height:33px;left:850px;top:390px;filter:drop-shadow(0 3px 3px #16324740);transition:left 1s cubic-bezier(.2,.8,.2,1),top 1s cubic-bezier(.2,.8,.2,1),opacity .3s;pointer-events:none;z-index:3}#cursor svg{width:100%;height:100%}#cursor.click:after{content:'';position:absolute;left:-10px;top:-10px;width:28px;height:28px;border:2px solid #417d65;border-radius:50%;animation:ripple .7s ease-out forwards}@keyframes ripple{to{transform:scale(2.4);opacity:0}}.loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;color:#597185;background:#f1f5f9;font-size:13px;z-index:5}.loading[hidden]{display:none}.loader{width:20px;height:20px;border:2px solid #cedbd6;border-top-color:#437d69;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.narration{padding:22px 28px;display:flex;align-items:center;gap:19px;min-height:125px;border-top:1px solid #dce4e5;background:#fcfdfb}.narration-number{height:41px;width:41px;flex-shrink:0;border:1px solid #d3e0d4;color:#5b846c;border-radius:50%;display:grid;place-items:center;font-size:12px;font-weight:600}.narration-copy{flex:1}.narration-copy>p:first-child{font-size:8px;font-weight:800;letter-spacing:1.8px;color:#669379;margin:0 0 7px}h2{font-size:19px;letter-spacing:-.6px;line-height:1.3;margin:0 0 5px;font-weight:650}#description{margin:0;font-size:11px;color:#6d7b7f;line-height:1.65}.role-pill{font-size:9px;color:#5d7b69;border:1px solid #dbe6db;background:#f1f6ed;border-radius:20px;padding:9px 13px;white-space:nowrap}.playback{display:flex;align-items:center;gap:11px;border-top:1px solid #e7ece6;padding:11px 23px;background:#fff}.play-button{border:0;border-radius:50%;background:#193b4f;color:white;width:32px;height:32px;font-size:13px;font-weight:800;display:grid;place-items:center}.play-button:hover{background:#386455}.time{font-size:9px;color:#86928e;font-variant-numeric:tabular-nums}input[type=range]{flex:1;min-width:40px;height:4px;appearance:none;background:linear-gradient(to right,#638b70 0%,#e7ece5 0%);border-radius:10px;cursor:pointer}input[type=range]::-webkit-slider-thumb{appearance:none;width:11px;height:11px;border-radius:50%;background:#638b70;border:2px solid white;box-shadow:0 0 0 1px #638b70}footer{display:flex;justify-content:space-between;gap:20px;padding:17px 3px 24px;font-size:9px;color:#849087}footer span:first-child{display:flex;align-items:center;gap:7px}body:fullscreen{overflow:auto;background:#f5f5ef}body:fullscreen .masthead,body:fullscreen .intro,body:fullscreen footer{display:none}body:fullscreen main{max-width:1500px;padding:20px 30px}.paused #cursor{transition:none}.paused .loader{animation-play-state:paused}
@media(min-width:1500px){main{max-width:1480px}.intro{padding-top:42px;padding-bottom:34px}}
@media(max-width:850px){.masthead{padding:19px 24px}main{padding:0 24px}.intro-copy{display:none}.intro{padding-top:28px}.chapters{gap:4px;justify-content:space-between;padding:0 10px}.chapters button{font-size:10px;padding:15px 4px}.chapters button span{margin-right:4px}.role-pill{display:none}.narration{padding:19px;min-height:124px}h2{font-size:17px}}
@media(max-width:520px){main{padding:0 12px}.masthead{padding:17px 16px}.brand-mark{font-size:30px}.tour-label{display:none}h1{font-size:28px;letter-spacing:-1.2px}.eyebrow{font-size:8px;letter-spacing:1.3px}.intro{padding:25px 3px}.chapters{overflow-x:auto;justify-content:flex-start;gap:10px;padding:0 12px}.chapters button{font-size:11px}.chapters button span{display:none}.browser-bar{font-size:8px;padding:0 10px}.demo-label{font-size:6px;letter-spacing:.5px}.narration{gap:11px;padding:17px 14px;min-height:150px}.narration-number{width:29px;height:29px;font-size:10px;align-self:flex-start;margin-top:3px}h2{font-size:16px}#description{font-size:11px}.playback{padding:12px;gap:8px}footer{font-size:8px;flex-direction:column;gap:8px;padding-left:3px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

/* Die Hauptseite liefert Überschrift und Rahmen für die eingebettete Tour. */
html.embedded { background:#fff; }
.embedded .masthead,.embedded .intro,.embedded footer { display:none; }
.embedded main { max-width:none; padding:0; }
.embedded .experience { border:0; border-radius:0; box-shadow:none; }
.embedded .chapters button { min-height:48px; }
.embedded .play-button { width:44px; height:44px; }
.embedded .narration-copy>p:first-child { font-size:10px; }
.embedded #description { font-size:13px; }
.embedded .time { font-size:11px; }




/* Die äußere Seite stellt die vollständige Höhe bereit; keine verschachtelten Scrollflächen. */
html.embedded, .embedded body { overflow:hidden; }
@media (max-width:600px) {
  .embedded .chapters { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; padding:0 8px; overflow:visible; }
  .embedded .chapters button { min-width:0; white-space:normal; padding:12px 4px; }
}
