/* TDO Media: echte Inhalte in einer räumlichen, metallischen Gestaltung. */
:root{--bg:#07090d;--surface:#11141a;--text:#f1f2f5;--muted:#b3b8c3;--gold:#d9b77a;--line:#79818e33;--paper:#11141a;--ink:#f1f2f5;--blue:#4d90ed;color-scheme:dark}
body{background:var(--bg);font-size:17px;line-height:1.7}
.wrap{max-width:1360px;width:calc(100% - 112px)}
h1,h2,h3{font-weight:560;letter-spacing:-.045em;hyphens:none;overflow-wrap:normal}
h1{font-size:clamp(45px,5.3vw,86px);line-height:1.03}
h2{font-size:clamp(34px,3.5vw,58px);line-height:1.1}
h3{font-size:28px;line-height:1.2}
.metal-title,.hero h1,.intro h1{color:#ebedf1;background:linear-gradient(112deg,#fff 5%,#d2d7e1 42%,#f5ecd9 68%,#caa35c 95%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.eyebrow{color:#d9b77a;letter-spacing:.17em;font-size:11px;font-weight:650}
.site-header{background:#07090ded;border-bottom:1px solid #b69b6536;backdrop-filter:blur(24px);height:94px}
.header-inner{justify-content:space-between}.brand .brand-image{width:149px}.nav-button{margin-left:8px}
#main-nav{gap:28px}#main-nav>a:not(.button),.nav-group>a{font-size:14px}
.website-nav,.section-nav{background:#0c0f14;border-color:var(--line)}
.website-submenu{background:#131720;border-color:#ac966355;z-index:40}
.button{border:1px solid #b89b60;background:linear-gradient(130deg,#131820,#0b0f14);color:#f3eee4;border-radius:40px;padding:13px 25px;transition:box-shadow .25s,background .25s,transform .25s,border-color .25s}
.button:hover,.button:focus-visible{color:#fff;border-color:#90baff;background:linear-gradient(130deg,#173e78,#0a1e40);box-shadow:0 0 20px #3d83ee70,inset 0 0 20px #386bc738;transform:translateY(-2px)}
.button.secondary{background:transparent;color:#e6e9ef}.text-link{color:#dce0e7;border-color:#89909b50}.text-link:hover{color:#e8c78b;border-color:#d9b77a}
.hero,.intro.architectural{display:block;position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 47%,#16406a40,transparent 38%),radial-gradient(ellipse at 60% 91%,#a7782530,transparent 40%),#05080d;min-height:740px;height:auto;max-height:none;border-bottom:1px solid #a48a4a35}
.hero-image{display:none}.hero:after{display:none}.hero-content{position:relative;z-index:3;padding-block:135px 115px;pointer-events:none}.hero-content>*{pointer-events:auto;max-width:660px}
.hero h1{font-size:clamp(52px,5.7vw,92px)}.hero .lead{font-size:20px;line-height:1.65;max-width:550px}.hero .actions{margin-top:38px;gap:28px}.hero-footnote{margin-top:66px;color:#b2a183;font-size:10px;letter-spacing:.23em}
.hero .eyebrow{margin-bottom:32px}
.intro{position:relative;padding:100px 0 110px;border-bottom:1px solid var(--line);background:radial-gradient(ellipse at 95% 0,#24385938,transparent 52%),#090c11}
.intro h1{max-width:1000px}.intro .lead{max-width:900px;font-size:20px}.intro.architectural{padding:110px 0 100px;min-height:670px}.intro.architectural>.wrap{position:relative;z-index:3}.intro.architectural h1{max-width:710px;font-size:clamp(42px,4.2vw,67px)}.intro.architectural .lead{max-width:580px}.intro.architectural .actions{max-width:650px}
.digital-scene{position:absolute;z-index:1;right:max(-60px,calc((100vw - 1500px)/2));top:80px;width:710px;height:590px;perspective:1400px;pointer-events:none}
.scene-desk{position:absolute;bottom:-70px;left:-110px;width:1020px;height:340px;background:linear-gradient(155deg,#12202d99,#18232922 50%,#a57e3344);transform:rotateX(70deg) rotateZ(-9deg);border-top:1px solid #c4ad7899;border-bottom:1px solid #36639b77;border-radius:60%;box-shadow:0 -18px 70px #d8a84c24,0 30px 95px #296ec62e}
.scene-orbit{position:absolute;width:640px;height:420px;top:80px;left:30px;border:1px solid #9caecc22;border-radius:50%;transform:rotateZ(-28deg);box-shadow:0 0 95px #639ff013,inset 0 0 45px #639ff013}
.scene-screen{position:absolute;border:1px solid #c2d2e89c;border-radius:14px;background:#121921;box-shadow:0 36px 65px #000b,0 0 23px #5299f43c;overflow:hidden;padding:6px;transform-style:preserve-3d}.scene-screen img{width:100%;aspect-ratio:1.62;object-fit:contain;background:#f0f3f7;border-radius:5px}.screen-bar{height:15px;display:flex;gap:4px;align-items:center;padding-left:6px}.screen-bar i{width:4px;height:4px;background:#748398;border-radius:50%}
.screen-0{width:470px;top:145px;left:75px;transform:rotateY(-15deg) rotateZ(-4deg);z-index:3;border-color:#cfb773;box-shadow:0 44px 70px #000b,0 0 32px #bd964436}
.screen-1{width:350px;top:25px;right:0;transform:rotateY(-20deg) rotateZ(6deg);opacity:.86;z-index:2}
.screen-2{width:310px;bottom:28px;right:-18px;transform:rotateY(-18deg) rotateZ(7deg);opacity:.9;z-index:4}
.section{padding:112px 0}.section.surface{background:#0d1015}.section.light{background:#0d1015;color:var(--text)}.light p,.light li,.light small{color:var(--muted)}.light .eyebrow,.light .text-link{color:var(--gold)}.section-heading{max-width:930px;margin-bottom:50px}
.intro-strip{gap:100px}.intro-strip>p:first-child{color:#e7eaf0;font-size:34px;line-height:1.25;letter-spacing:-.03em}.intro-strip>p:last-child{font-size:18px}
.path-grid{gap:42px}.path{padding:15px 0;background:none;border:0}.path+.path{border-left:0}.path .number{font-size:10px;color:#b49a65;letter-spacing:.2em}.path h3{font-size:34px;font-weight:550;margin-top:22px}.path p{min-height:105px;font-size:16px}.path:hover{background:none;transform:none}.path .text-link{font-size:14px}
.project-theatre{position:relative;overflow:hidden;background:radial-gradient(ellipse at 75% 60%,#1d549d33,transparent 50%),radial-gradient(ellipse at 18% 85%,#b8853330,transparent 43%),#070b11;border-block:1px solid #a88d4e36;padding-bottom:86px}
.project-theatre::before{content:"";position:absolute;left:-10%;right:-10%;height:300px;bottom:35px;transform:perspective(800px) rotateX(72deg);border:1px solid #b5986150;border-radius:50%;box-shadow:0 0 60px #c99e3422,inset 0 0 100px #27558c38;pointer-events:none}
.project-carousel{position:relative;height:580px;margin:20px -45px 0;perspective:1700px}
.project-slide{position:absolute;inset:25px 75px 35px;display:grid;grid-template-columns:minmax(0,1.65fr) minmax(230px,1fr);gap:32px;align-items:center;padding:35px;border:1px solid #c7d2e175;border-radius:22px;background:linear-gradient(135deg,#1a2230eb,#080d14f5 75%);box-shadow:0 40px 80px #000c,0 0 28px #579de321;transform:translateX(130%) rotateY(-30deg) scale(.75);opacity:0;transition:transform .8s cubic-bezier(.22,.68,.22,1),opacity .65s,filter .65s;pointer-events:none;filter:brightness(.5)}
.project-slide.is-active{transform:translateX(0) rotateY(-4deg);opacity:1;z-index:3;pointer-events:auto;filter:none;border-color:#cab3798c}
.project-slide.is-next{transform:translateX(86%) rotateY(-27deg) scale(.8);opacity:.45;z-index:2}.project-slide.is-previous{transform:translateX(-88%) rotateY(25deg) scale(.76);opacity:.28;z-index:1}
.slide-visual{min-width:0;align-self:center;position:relative}.slide-visual .logo-stage,.slide-visual .image-open{display:block;background:transparent;aspect-ratio:auto;height:auto;min-height:0;max-width:none;padding:0;margin:0;border-radius:12px;border:1px solid #afbed775;box-shadow:0 20px 40px #0006;overflow:hidden}
.slide-visual img,.slide-visual .logo-stage img,.slide-visual .image-open img{width:100%;max-width:100%;height:auto;max-height:420px;aspect-ratio:auto;object-fit:contain;background:#e9edf2;border-radius:10px}
.slide-copy{min-width:0}.slide-copy h2,.slide-copy h3{font-size:clamp(26px,2.3vw,39px);margin-bottom:22px;color:#edf0f5;min-height:0}.slide-copy p{font-size:16px;line-height:1.7;margin-bottom:24px}.slide-copy .eyebrow{font-size:10px}.slide-copy .text-link{font-size:14px}.slide-copy .actions{gap:12px}
.carousel-controls{position:relative;z-index:5;display:flex;gap:18px;align-items:center;justify-content:center;flex-wrap:wrap;margin:0 0 5px}
.round-control{width:46px;height:46px;border:1px solid #baa16b70;border-radius:50%;background:#0b111ce8;color:#e9edf5;font-size:23px;line-height:1;padding:0;transition:box-shadow .2s,background .2s}
.round-control:hover{background:#183d6b;box-shadow:0 0 18px #568ad64a}.carousel-dots{display:flex;gap:12px}.carousel-dot{height:6px;width:35px;border:0;border-radius:10px;background:#6e7580;padding:0}.carousel-dot[aria-pressed=true]{background:#d9b77a;box-shadow:0 0 12px #c9ad6255}.carousel-count{font-size:12px;color:#d4d9e2;min-width:45px;text-align:center;margin:0}
.carousel-hint{position:relative;text-align:center;margin:19px 0 0;font-size:12px;color:#8b97aa}
.package-grid{gap:30px;perspective:1500px;align-items:stretch}.package{position:relative;background:linear-gradient(155deg,#1b2029,#0a0e14 74%);border:1px solid #87878770;border-radius:20px;padding:38px 30px;color:var(--text);box-shadow:0 35px 60px #0005,0 0 30px #9b824414;overflow:hidden}
.package::before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,transparent,#acb7c9,#d0b06f,transparent)}
.package.featured{background:linear-gradient(150deg,#26221a,#0b1018 68%);border-color:#d2b77a94;box-shadow:0 35px 60px #0008,0 0 35px #d6aa3b20}
.package h3{font-size:32px;min-height:78px;font-weight:550}.package .eyebrow{font-size:9px;letter-spacing:.13em;color:#bcb7a9;min-height:35px}.package>p:not(.price):not(.eyebrow){color:var(--muted);font-size:15px;min-height:105px}.package .price{color:#edd4a4;font-size:clamp(36px,3.5vw,55px);font-weight:500;letter-spacing:-.035em;text-align:center;padding:22px 0 30px;margin:10px -10px 25px;border-block:1px solid #af976331}
.package .price span{color:#a8afbc;letter-spacing:.04em;font-size:11px;font-weight:400}.package .checklist li{font-size:14px;color:#b8c0ce}.package .checklist li:before{color:#d0b074}.package .button{width:100%;font-size:14px;justify-content:space-between}.package .text-link{font-size:13px;color:#e2c991}.package:hover{transform:translateY(-5px);box-shadow:0 38px 70px #0008,0 0 42px #b68a3828}
.package-note{color:#9aa5b6;font-size:12px;margin-top:38px}
.detail-offer,.estimate,.contact-aside{background:linear-gradient(140deg,#1a202a,#0e131b);border:1px solid #bfa46750;border-radius:18px;box-shadow:0 25px 65px #0004}.estimate-price,.inline-prices strong{color:#e3c692}.addon-list strong{color:#dbbd87}.boundary{border-color:#c8a666}.editorial-grid article,.process-steps li{border-top-color:#8190a436}.editorial-grid h3{font-size:24px}.process-steps .number{color:#d3b577}
.reference-cases{display:block}.reference-case{position:relative;overflow:clip;padding:85px 0 110px;margin:0;border-bottom:1px solid #bca77535;background:radial-gradient(ellipse at 50% 55%,var(--case-glow,#593e29) 0,transparent 69%)}
.reference-case:first-child{padding-top:15px}.case-geschenkideen{--case-glow:#511b252a}.case-gruen{--case-glow:#234c2d2a}.case-innovation{--case-glow:#1d427c2f}.reference-case h3{font-size:46px;min-height:0;margin:17px 0 30px}.reference-case>.case-caption .eyebrow{margin-bottom:8px}.case-caption{position:relative;z-index:2;margin-bottom:30px}.case-caption>.actions{margin-top:26px}
.twin-screens{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:35px;perspective:1400px;isolation:isolate;padding:20px 8px 30px}.twin-screens::after{content:"";position:absolute;z-index:-1;bottom:-30px;left:-3%;width:106%;height:150px;transform:perspective(700px) rotateX(70deg);border:1px solid #b19b6950;border-radius:50%;box-shadow:0 0 45px #c4a7611c,inset 0 0 45px #6287b230;pointer-events:none}
.twin-screen{position:relative;min-width:0;transform:rotateY(5deg);transition:transform .35s}.twin-screen.after{transform:rotateY(-5deg)}.twin-screen:hover{transform:translateY(-8px) rotateY(0)}.twin-label{font-size:12px;color:#c3cddd;letter-spacing:.17em;text-transform:uppercase;margin:0 0 14px}.after .twin-label{color:#e0c58d}.twin-screen .image-open{background:linear-gradient(135deg,#253349,#0b1017);border:1px solid #a9bfd786;border-radius:13px;box-shadow:0 34px 55px #000b,0 0 23px #6f9ccb20;padding:7px}.twin-screen.after .image-open{border-color:#d2b87893;box-shadow:0 34px 55px #000b,0 0 23px #bf99442b}
.twin-screen .image-open img{width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:7px;background:#edf0f6}.twin-screen .image-open>span{display:block;background:none;color:#bbc6d5;font-size:10px;padding:12px 8px}.reference-case .actions{gap:28px}
.comparison{display:block;overflow:clip;padding-block:75px;position:relative}.comparison-copy{max-width:890px;margin-bottom:24px}.comparison h2{font-size:42px}.comparison-view .segmented{display:none}.comparison .twin-screens{margin-top:25px}
.app-references{margin-bottom:65px}.app-references .image-open{border:1px solid #a6b5cc7a;background:#101824;border-radius:14px;padding:7px;box-shadow:0 30px 55px #0007}.app-references .reference-card img{background:#edf1f7;aspect-ratio:auto}.app-references h3{font-size:31px}.app-grid{gap:38px}
.project-screenshot{background:radial-gradient(ellipse at 50% 50%,#23427040,transparent 70%),#080c13;border-block:1px solid #71839b33}.project-screenshot .image-open{padding:9px;background:#101827;border:1px solid #b2c0d77a;border-radius:16px;box-shadow:0 35px 70px #0008,0 0 50px #5b90da25}
.logo-stage{background:radial-gradient(ellipse at 50% 50%,#b8c5e518,transparent 73%),#10151d;border:1px solid #66758b40;box-shadow:0 20px 45px #0004}.project-feature .logo-stage{border-color:#66758b40}.logo-stage .wide-logo{background:#f7f6f2;border-radius:10px;padding:14px}.logo-stage .icon-logo{border-radius:16px}
.music-list .music-row{position:relative;padding:45px;border:1px solid #717d9044;border-radius:24px;background:radial-gradient(ellipse at 10% 50%,#31707327,transparent 62%),#0d1219;box-shadow:0 25px 55px #0003;gap:65px}.music-list .music-row+.music-row{margin-top:65px;padding-top:45px;background:radial-gradient(ellipse at 10% 50%,#95401e2a,transparent 60%),#100e17;border-top:1px solid #80514466}.music-art,.light .music-art{background:radial-gradient(ellipse at center,#626d9524,transparent 73%);border-color:#9ba9bc44;padding:34px;box-shadow:0 20px 45px #0004}.album-grid article{background:#10151f;border-color:#81869d44}.album-grid img{box-shadow:0 20px 35px #0006}.music-art img{filter:drop-shadow(0 15px 30px #0006)}
.cta-section{padding-top:35px;background:radial-gradient(ellipse at 10% 75%,#b8984015,transparent 60%)}.cta{border-top-color:#bba06c50}.cta h2{font-size:clamp(35px,3.8vw,62px)}.cta .button{padding:16px 30px}
footer{background:#06080c;border-color:#b8a27430;padding-top:80px}.footer-grid p,.footer-grid a{color:#acb4c2}.footer-grid h2{color:#d7b77a}.footer-bottom{border-color:#75829933}.footer-bottom a{color:#bec6d2}

.legal-copy h2{font-size:26px;letter-spacing:-.02em}.legal-copy h3{font-size:22px}.legal-note{background:#141b25}.legal-toc{background:#0f151f;border-color:#8390a344}.light .text-link:hover{color:#fff}
@media(min-width:1600px){.digital-scene{right:calc((100vw - 1600px)/2);width:780px}.hero-content>*{max-width:690px}}
@media(max-width:1250px){.wrap{width:calc(100% - 72px)}#main-nav{gap:17px}.digital-scene{width:590px;right:-170px;opacity:.8;top:95px}.hero-content>*{max-width:620px}.hero-content .lead{max-width:490px}.intro.architectural .digital-scene{opacity:.45}.package{padding:30px 23px}.package h3{font-size:29px}.project-slide{inset:25px 45px 35px;gap:25px;padding:28px}.slide-copy h2,.slide-copy h3{font-size:29px}}
@media(max-width:950px){.site-header{height:auto;min-height:78px}.header-inner{padding-block:13px;min-height:78px}.menu-toggle{border-radius:30px;border-color:#b79e6866}.digital-scene{position:relative;top:auto;right:auto;margin:-20px auto 20px;width:680px;max-width:90%;height:480px;opacity:1}.hero-content{padding:75px 0 25px}.hero-content>*{max-width:760px}.hero .lead{max-width:650px}.hero-footnote{margin-top:40px}.hero{min-height:0}.intro.architectural{padding:80px 0 20px;min-height:0}.intro.architectural .digital-scene{opacity:1;margin:0 auto 35px}.scene-screen.screen-0{width:70%;left:4%;top:120px}.scene-screen.screen-1{width:52%;right:0;top:20px}.scene-screen.screen-2{width:46%;right:0;bottom:0}.scene-desk{left:-20%;width:140%;bottom:-70px}.project-carousel{height:590px;margin-inline:-20px}.project-slide{grid-template-columns:minmax(0,1.5fr) minmax(220px,1fr);inset:25px 24px 35px;padding:25px;gap:25px}.slide-copy p{font-size:14px}.section{padding:90px 0}.package-grid{gap:17px}.package{padding:27px 20px}.package h3{font-size:27px}.package>p:not(.price):not(.eyebrow){font-size:14px;min-height:140px}.music-list .music-row{padding:30px;gap:40px}.intro-strip{gap:45px}.reference-case h3{font-size:39px}.twin-screens{gap:22px}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}h1,.hero h1{font-size:clamp(40px,10vw,65px)}h2{font-size:36px}.hero-content{padding:58px 0 15px}.hero .eyebrow{font-size:9px;letter-spacing:.11em;margin-bottom:25px}.hero .lead{font-size:17px}.hero .actions{gap:21px}.hero .actions .button{font-size:13px}.hero-footnote{font-size:8px;margin-top:32px}.digital-scene{height:340px;max-width:95%;margin:0 auto 35px;perspective:900px}.scene-screen{border-radius:9px;padding:4px}.screen-bar{height:11px}.scene-screen.screen-0{top:85px}.scene-screen.screen-1{top:20px}.scene-screen.screen-2{bottom:15px}.scene-desk{bottom:-38px;height:190px}.scene-orbit{max-width:100%;height:260px;top:15px;left:0}.intro{padding:65px 0 75px}.intro h1{font-size:42px}.intro .lead{font-size:17px}.intro.architectural{padding:55px 0 10px}.intro.architectural h1{font-size:39px}.intro.architectural .digital-scene{margin-top:25px}.section{padding:70px 0}.section-heading{margin-bottom:35px}.path-grid{gap:20px}.path{padding:16px 0 28px;border-bottom:1px solid var(--line)}.path+.path{border-top:0}.path h3{font-size:32px}.path p{min-height:0}.intro-strip{gap:24px}.intro-strip>p:first-child{font-size:30px}.intro-strip>p:last-child{font-size:16px}.project-theatre{padding-bottom:60px}.project-carousel{height:710px;margin:0 -12px}.project-slide{display:flex;flex-direction:column;justify-content:center;inset:20px 12px 30px;padding:22px;gap:28px;border-radius:17px}.slide-visual{width:100%}.slide-visual img,.slide-visual .logo-stage img,.slide-visual .image-open img{max-height:340px}.slide-copy{width:100%;padding:0 2px}.slide-copy h2,.slide-copy h3{font-size:29px;margin-bottom:15px}.slide-copy p{font-size:15px;margin-bottom:18px}.project-slide.is-active{transform:rotateY(-2deg)}.project-slide.is-next{transform:translateX(103%) rotateY(-25deg) scale(.8)}.project-slide.is-previous{transform:translateX(-103%) rotateY(25deg) scale(.8)}.carousel-controls{gap:13px}.carousel-dot{width:23px}.round-control{width:42px;height:42px}.carousel-hint{font-size:11px}.package-grid{grid-template-columns:1fr;gap:28px}.package{padding:31px 27px}.package h3{font-size:33px;min-height:0}.package>p:not(.price):not(.eyebrow){min-height:0;font-size:16px}.package .eyebrow{min-height:0;font-size:9px}.package .price{font-size:52px;margin-top:28px}.package .checklist li{font-size:15px}.twin-screens{grid-template-columns:1fr;gap:33px;padding:0}.twin-screen,.twin-screen.after{transform:none}.twin-screens::after{display:none}.reference-case{padding:60px 0 70px}.reference-case h3{font-size:34px}.case-caption{margin-bottom:30px}.twin-label{font-size:11px}.reference-case .actions{gap:18px}.comparison h2{font-size:34px}.project-screenshot .image-open{padding:5px;border-radius:10px}.music-list .music-row{padding:25px;grid-template-columns:1fr;gap:28px}.music-list .music-row+.music-row{padding-top:25px;margin-top:42px}.music-art{min-height:240px;padding:25px}.app-grid{gap:38px}.cta-section{padding-bottom:70px}.cta{gap:23px}.legal-copy{overflow-wrap:anywhere}.legal-copy h2{font-size:25px}.editorial-grid h3{font-size:22px}.brand .brand-image{width:117px}.footer-grid .brand .brand-image{width:145px}}
@media(max-width:390px){.wrap{width:calc(100% - 32px)}.hero h1{font-size:42px}.intro.architectural h1{font-size:35px}.digital-scene{height:290px}.hero .actions{flex-direction:column;align-items:flex-start;gap:15px}.project-carousel{height:730px}.project-slide{padding:19px}.carousel-controls{gap:10px}.carousel-dot{width:19px}.package{padding:28px 23px}}
@media(prefers-reduced-motion:reduce){.project-slide,.twin-screen,.button,.package{transition:none!important;animation:none!important}.project-slide.is-active{transform:none}.twin-screen,.twin-screen.after{transform:none}}
html:not(.js) .project-carousel{height:auto;margin:0}html:not(.js) .project-slide{position:relative;inset:auto;transform:none;opacity:1;filter:none;pointer-events:auto;margin-bottom:32px}html:not(.js) .carousel-controls,html:not(.js) .carousel-hint{display:none}

.design-style-1{--reveal:50%}