@layer components{.night-scene{--foreground:#f8fbfc;--muted-foreground:#d0dde1;--ice:#a3d9e9;--primary-text:#ffb198;color:var(--foreground)}.zurich-hero{background:#0a1a2e}.hero-szene-rahmen{position:relative;overflow:hidden}.hero-szene{width:100%;aspect-ratio:var(--szene-verhaeltnis);position:relative}.hero-schatten{pointer-events:none;background:radial-gradient(40% 24% at 50% 30%,#05132a80,#0000 78%),linear-gradient(#05132a99 0%,#05132a40 30%,#0000 50%);position:absolute;inset:0}.hero-baumreihe{pointer-events:none;width:100%;position:absolute;top:100%;left:0}.hero-baumreihe img{-webkit-mask-image:linear-gradient(90deg,#000 0 20%,#0000 32% 68%,#000 80% 100%);mask-image:linear-gradient(90deg,#000 0 20%,#0000 32% 68%,#000 80% 100%)}.hero-bildschirm{border-radius:2px}.hero-bildschirm-inhalt{transform-origin:0 0;transform:scale(var(--skala,.434))}.hero-bildschirm:after{content:"";pointer-events:none;background:linear-gradient(162deg,#ffffff17,#0000 38%);position:absolute;inset:0}.hero-warnlicht{aspect-ratio:1;background:radial-gradient(circle,#ff6b5c 0 26%,#ff3b2f80 42%,#0000 70%);border-radius:50%;width:.5%;animation:2.6s ease-in-out infinite hero-warnlicht;position:absolute;translate:-50% -50%}.hero-fenster{aspect-ratio:1/1.25;mix-blend-mode:screen;opacity:0;filter:blur(.4px);background:#ffdca8;border-radius:1px;width:.3%;animation:9s ease-in-out infinite hero-fenster;position:absolute;translate:-50% -50%}.hero-see{pointer-events:none;mix-blend-mode:screen;opacity:.6;background:repeating-linear-gradient(98deg,#0000 0 22px,#ffecc859 23px 25px,#0000 26px 47px);animation:8s linear infinite hero-see;position:absolute;-webkit-mask-image:repeating-linear-gradient(#000 0 1px,#0000 1px 4px),radial-gradient(closest-side,#000 30%,#0000);mask-image:repeating-linear-gradient(#000 0 1px,#0000 1px 4px),radial-gradient(closest-side,#000 30%,#0000);-webkit-mask-composite:source-in;mask-composite:intersect}@keyframes hero-warnlicht{0%,to{opacity:1}50%{opacity:.2}}@keyframes hero-fenster{0%,to{opacity:0}35%,65%{opacity:.8}}@keyframes hero-see{to{background-position:94px 0}}@media (prefers-reduced-motion:reduce){.hero-warnlicht,.hero-fenster,.hero-see{animation:none}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.hero-szene{scale:1.05}}.zurich-hero .hero-szene{transition:scale .8s}.zurich-hero[data-neigung] .hero-szene{scale:1.05}.hero-copy{z-index:30;text-align:center;flex-direction:column;align-items:center;padding:calc(80px + clamp(4px,1.6vw,36px)) 20px 0;display:flex;position:absolute;inset:0 0 auto}.hero-eyebrow{letter-spacing:.17em;text-transform:uppercase;color:#d5e8f8;margin:0 0 14px;font-size:clamp(10px,.78vw,12px);font-weight:600}.hero-heading{letter-spacing:-.055em;color:#fff;max-width:1100px;margin:0;font-size:clamp(34px,3.8vw,68px);font-weight:600;line-height:1.04}.hero-zeile{display:block}.hero-intro{color:#e8f1f9;max-width:640px;margin:16px auto 0;font-size:clamp(15px,1.05vw,17px);line-height:1.55}.hero-intro,.hero-hint,.hero-eyebrow{text-shadow:0 1px 14px #05132ad9,0 0 2px #05132a99}.hero-actions{flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px;display:flex}.hero-primary{box-shadow:0 10px 30px #06142a59,inset 0 1px #ffffff2e}.hero-hint{color:#c6d6e4;margin:12px 0 0;font-size:12px}.hero-foot{z-index:30;letter-spacing:.12em;text-transform:uppercase;color:#afc3d7;justify-content:space-between;align-items:center;gap:16px;padding:0 max(20px,4%) 8px;font-size:11px;display:flex;position:absolute;inset:auto 0 0}@media (max-width:767px){.zurich-hero{background:#0a1422;flex-direction:column;display:flex}.hero-szene-rahmen{order:-1}.hero-copy{background:linear-gradient(#0a1422,#0d2a50 55%,#123f7d);padding:22px 20px 34px;position:relative;inset:auto}.hero-eyebrow{font-size:9.5px;line-height:1.6}.hero-heading{letter-spacing:-.05em;font-size:clamp(30px,8.4vw,46px);line-height:1.08}.hero-zeile{display:inline}.hero-intro{margin-top:18px;font-size:15px}.hero-actions{width:100%;margin-top:24px}.hero-actions>*{flex:100%}.hero-szene{width:142.857%;margin-left:-21.4285%}.hero-baumreihe img{-webkit-mask-image:linear-gradient(90deg,#000 0 28%,#0000 36% 64%,#000 72% 100%);mask-image:linear-gradient(90deg,#000 0 28%,#0000 36% 64%,#000 72% 100%)}.hero-schatten{background:linear-gradient(#0a1422b3 0%,#0a142200 22% 72%,#0a1422 100%)}.hero-foot{background:#123f7d;flex-wrap:wrap;justify-content:center;gap:0 20px;padding:10px 20px 14px;font-size:9.5px;position:relative;inset:auto}}.zurich-sky{background:radial-gradient(70% 42% at 86% 86%,#d9b8917a,#0000 80%),linear-gradient(#253d4a 0%,#415e6e 44%,#6b8695 64%,#9cb3bb 86%,#dce5e5 100%)}.zurich-closing{isolation:isolate;background:#2d4858;position:relative;overflow:hidden}.zurich-closing .zurich-sky{background:radial-gradient(80% 100% at 90% 110%,#bd98647a,#0000 78%),linear-gradient(125deg,#243e4c,#446b7b)}}.studio-nav[data-ueber-hero=true] nav a{color:#dce8f0}.studio-nav[data-ueber-hero=true] nav a:hover,.studio-nav[data-ueber-hero=true] a[href=\/demo],.studio-nav[data-ueber-hero=true] button[aria-label=Menü\ öffnen]{color:#fff}.studio-nav[data-ueber-hero=true] button[aria-label=Menü\ öffnen]:hover{background:#ffffff1a}.studio-nav[data-ueber-hero=true] .studio-logo,.studio-nav[data-ueber-hero=true] .studio-logo>span:first-child{color:#fff}.studio-nav[data-ueber-hero=true] .studio-logo>span:first-child{background:#ffffff14;border-color:#ffffff38}.studio-nav[data-ueber-hero=true] .studio-logo>span:last-child>span:nth-child(2){color:#c1d9ed}
.studio-home .glass,.studio-home .glass-liquid{-webkit-backdrop-filter:none;background:#fff;border:1px solid #d9e3e5;box-shadow:0 16px 44px -28px #284e6552,inset 0 1px #fff}.studio-home .glass-liquid:before{background:linear-gradient(150deg,#d1e3e8,#dce4e4 55%,#d2bda26e)}.studio-home .hairline{border-color:#d0dce0}.studio-home .pill{color:#446773;background:#ffffff8c;border-color:#b5cbd17a;font-weight:500}.studio-home .pill:before{box-shadow:none}.studio-home .night-scene .pill{color:#e0ebee;background:#ffffff0d;border-color:#c5dce32e}.studio-home .night-scene .glass{box-shadow:none;background:#ffffff0b;border-color:#ffffff21}.studio-home .night-scene .hairline{border-color:#d9ecf229}.studio-home .icelight{opacity:.63}.studio-home .principle-section{background:radial-gradient(75% 24% at 12% 15%,#d4e8ec,#0000),linear-gradient(#edf3f3,#e8f0f3 58%,#f4f6f4);border-top:1px solid #dae5e5;border-bottom:1px solid #dde5e5}.studio-home .principle-card{background:linear-gradient(145deg,#fff,#f7fafb 72%,#edf3f5);box-shadow:0 18px 38px -25px #3b64775c}.studio-home .principle-stage{filter:drop-shadow(0 18px 18px #33536312)}.studio-home #angebot{background:#faf8f4}.studio-home #gespraech{background:linear-gradient(130deg,#eaf3f5,#f4f7f5 65%,#f3ebe1)}.studio-home #beweis{background:#f5f7f6}.studio-home #ueber-mich{background:radial-gradient(at 12% 55%,#eadbc5aa,#0000 65%),#f3ece2}.studio-home #ueber-mich .dusk{background:linear-gradient(#0000,#c5ac8299)}.studio-home #faq{background:#faf8f4}.studio-home :is(#angebot,#gespraech,#beweis,#ueber-mich,#faq){padding-block:clamp(76px,8vw,116px)}.studio-home :is(#angebot,#gespraech,#beweis,#ueber-mich,#faq) [class~=bg-white\/8]{background-color:#dce4e5}.studio-home :is(#angebot,#gespraech,#beweis,#ueber-mich,#faq) [class*=border-white\/]{border-color:#cbd9de}.studio-home #ueber-mich ul,.studio-home #ueber-mich li+li{border-color:#d7cbb8}.studio-home #gespraech input,.studio-home #gespraech textarea{background:#fafcfc}.studio-home #gespraech button[aria-pressed=true]{color:#243d46;background:#e8f3f6;border-color:#36829a}.studio-home #gespraech button[aria-pressed=false]{background:#f8fafb}.studio-home #angebot [data-slot=button][data-variant=ghost]{background:#eaf0f1}.studio-home #beweis a{background:#f4f8f9}.studio-home :is(input,textarea,button,a):focus-visible{outline-color:#317b93}.studio-home #gespraech button[aria-pressed]{-webkit-backdrop-filter:none}.studio-home #gespraech button[aria-pressed]:hover{background:#edf4f6;border-color:#36829a}
@layer components{.porsche-rahmen{aspect-ratio:4/3;isolation:isolate;background:#e8eef1;border-radius:28px;max-width:100%;overflow:hidden;box-shadow:0 24px 70px #12242d24,inset 0 0 0 1px #d5e0e2}.porsche-ansicht{will-change:transform, opacity;position:absolute;inset:0}.porsche-fokus-scheibe{transform-origin:49% 40%}.porsche-drift{transform-origin:50% 55%;will-change:transform;position:absolute;inset:0}.porsche-ebene{position:absolute;inset:0}.porsche-leinwand{object-fit:cover;opacity:0;width:100%;height:100%;position:absolute;inset:0}.porsche-dunkel,.porsche-hell{pointer-events:none;opacity:0;will-change:opacity;position:absolute;inset:0}.porsche-dunkel{background:radial-gradient(circle at 50% 42%,#10161b,#030507 75%)}.porsche-hell{background:radial-gradient(circle at 50% 40%,#fff,#eef5f8 70%)}.porsche-bildschirm{background:#070b10e6;border-radius:3px;justify-content:center;align-items:center;display:flex;position:absolute;overflow:hidden;box-shadow:0 0 22px #6ec3e633;container-type:inline-size}.carplay{color:#f2f5f7;font-family:var(--font-body);background:radial-gradient(120% 140% at 60% 0,#1b2330,#0a0d12 70%);display:flex;position:absolute;inset:0}.carplay svg{stroke-width:2.2px;width:100%;height:100%}.carplay-leiste{background:#00000059;border-right:1px solid #ffffff12;flex-direction:column;align-items:center;gap:1.6cqw;width:9cqw;padding:1.6cqw 0;display:flex}.carplay-uhr{letter-spacing:-.02em;font-size:2.2cqw;font-weight:600}.carplay-empfang{align-items:flex-end;gap:.3cqw;height:1.4cqw;margin-top:-.8cqw;display:flex}.carplay-empfang i{background:#f2f5f7;border-radius:1px;width:.45cqw}.carplay-empfang i:first-child{height:35%}.carplay-empfang i:nth-child(2){height:55%}.carplay-empfang i:nth-child(3){height:78%}.carplay-empfang i:nth-child(4){height:100%}.carplay-app{aspect-ratio:1;color:#fff;border-radius:1.3cqw;place-items:center;width:5.2cqw;padding:1.1cqw;display:grid;box-shadow:inset 0 1px #ffffff40}.carplay-app-telefon{background:linear-gradient(#5ee06d,#27b53d)}.carplay-app-musik{background:linear-gradient(#ff6178,#f2344f)}.carplay-app-karten{background:linear-gradient(#5fb4ff,#2a7cf0)}.carplay-raster{color:#c9d2da;width:3.2cqw;margin-top:auto}.carplay-inhalt{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.6cqw;animation:.45s ease-out both carplay-rein;display:flex}@keyframes carplay-rein{0%{opacity:0;translate:0 1.5cqw}}.carplay-avatar{aspect-ratio:1;background:linear-gradient(#9aa6b4,#6b7685);border-radius:50%;place-items:center;width:7cqw;font-size:2.6cqw;font-weight:600;display:grid}.carplay-name{letter-spacing:-.02em;font-size:3.3cqw;font-weight:600;line-height:1.1}.carplay-status{color:#aab6c1;font-variant-numeric:tabular-nums;font-size:1.9cqw}.carplay[data-zustand=verpasst] .carplay-status{color:#ff6b5f}.carplay-knoepfe{gap:3.2cqw;margin-top:1.4cqw;display:flex}.carplay-knopf{color:#c9d2da;flex-direction:column;align-items:center;gap:.7cqw;font-size:1.5cqw;display:flex}.carplay-knopf i{aspect-ratio:1;color:#fff;background:#ffffff2e;border-radius:50%;place-items:center;width:5.8cqw;padding:1.5cqw;display:grid}.carplay-knopf i.is-rot{background:#f2463a}.carplay-knopf i.is-gruen{background:#34c759}.carplay[data-zustand=rueckruf] .carplay-avatar{animation:1.4s ease-in-out infinite carplay-klingeln;box-shadow:0 0 0 .5cqw #34c75955}@keyframes carplay-klingeln{50%{box-shadow:0 0 0 1.4cqw #34c75900}}.carplay-termin{background:#ffffff14;border:1px solid #ffffff1f;border-radius:2cqw;align-items:center;gap:2.4cqw;padding:2cqw 3cqw;display:flex}.carplay-kalender{color:#111;background:#fff;border-radius:1.4cqw;flex-direction:column;align-items:center;width:7cqw;padding:.6cqw 0 .8cqw;font-size:3.4cqw;font-weight:600;line-height:1;display:flex}.carplay-kalender small{color:#f2463a;margin-bottom:.4cqw;font-size:1.4cqw;font-weight:700}.carplay-text{flex-direction:column;gap:.4cqw;display:flex}.carplay-text strong{letter-spacing:-.02em;font-size:3cqw;font-weight:600}.carplay-text span{color:#aab6c1;font-size:2cqw}.carplay-haken{aspect-ratio:1;color:#fff;background:#34c759;border-radius:50%;width:4.6cqw;padding:1cqw}.porsche-wisch{pointer-events:none;opacity:0;will-change:transform;background:linear-gradient(90deg,#0000 93%,#ffffff40 98%,#fff 99.6%,#0000 100%);position:absolute;inset:0;transform:translate(-100%)}.porsche-motor-neu{clip-path:inset(0 100% 0 0)}.porsche-repariert .porsche-motor-neu{animation:1.8s cubic-bezier(.45,0,.2,1) .5s forwards porsche-reparatur}.porsche-repariert .porsche-wisch{animation:1.8s cubic-bezier(.45,0,.2,1) .5s forwards porsche-wischlinie}@keyframes porsche-reparatur{to{clip-path:inset(0)}}@keyframes porsche-wischlinie{0%{opacity:1;transform:translate(-100%)}92%{opacity:1}to{opacity:0;transform:translate(0)}}.porsche-hebel{background:#ffffffb3;border:1px solid #c9d8dd;border-radius:999px;grid-template-columns:1fr 1fr;width:min(100%,26rem);padding:4px;display:grid;position:relative;box-shadow:0 8px 24px -16px #284e6566}.porsche-hebel-schieber{background:#243d46;border-radius:999px;width:calc(50% - 4px);transition:left .45s cubic-bezier(.3,.7,.2,1),width .45s cubic-bezier(.3,.7,.2,1),background-color .45s;position:absolute;top:4px;bottom:4px;left:4px;box-shadow:0 6px 16px -8px #12242d99}.porsche-hebel[data-stand=innen] .porsche-hebel-schieber{background:#b63418;left:50%}.porsche-hebel[data-stand=beide] .porsche-hebel-schieber{background:linear-gradient(90deg,#243d46,#b63418);width:calc(100% - 8px);left:4px}.porsche-hebel-knopf{z-index:1;color:#446773;cursor:pointer;border-radius:999px;flex-direction:column;justify-content:center;align-items:center;min-height:44px;padding:4px 10px;transition:color .35s;display:flex;position:relative}.porsche-hebel-knopf[aria-pressed=true]{color:#fff}.porsche-hebel-knopf:focus-visible{outline:2px solid var(--primary);outline-offset:2px}.porsche-hebel-wort{font-size:13px;font-weight:600;line-height:1.1}.porsche-hebel-paket{letter-spacing:.06em;text-transform:uppercase;opacity:.8;font-size:10px}@media (prefers-reduced-motion:reduce){.porsche-hebel-schieber{transition-duration:10ms}.porsche-ansicht,.porsche-drift{transform:none!important}.porsche-leinwand,.porsche-dunkel,.porsche-hell,.porsche-wisch{display:none}.porsche-lack{opacity:0}.porsche-motor-neu{clip-path:none;animation:none!important}.porsche-rahmen:not([data-schritt="0"]) .porsche-lack{opacity:1}.carplay-inhalt,.carplay-avatar{animation:none!important}}}
