:root{color-scheme:light;--ink:#232a2a;--muted:#667071;--accent:#d77b2d;--paper:#f8f7f4}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f8f7f4;color:var(--ink);font-family:'DM Sans',Arial,sans-serif}button,a{ -webkit-tap-highlight-color:transparent}a{color:inherit}.topbar{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,90px);border-bottom:1px solid #e5e4e0;background:#fff}.wordmark{text-decoration:none;font-family:Manrope,Arial,sans-serif;font-weight:800;font-size:19px;letter-spacing:-1px}.wordmark span{font-weight:500;font-size:12px;vertical-align:top;margin-left:3px}.top-label{font-size:10px;letter-spacing:.23em;color:#8d9694}.top-contact{text-decoration:none;font-size:13px;font-weight:700;border-bottom:1px solid #c6cbc7;padding-bottom:6px}.top-contact span{color:var(--accent)}.intro{max-width:1160px;margin:0 auto;padding:76px 28px 47px}.eyebrow,.section-kicker{color:#b66a2e;font-weight:700;letter-spacing:.2em;font-size:11px}.intro h1{font-family:Manrope,Arial,sans-serif;font-size:clamp(36px,5.2vw,68px);letter-spacing:-.065em;line-height:1.13;margin:20px 0 20px;font-weight:700}.intro h1 em{font-style:normal;color:#84918d}.intro>p{max-width:710px;color:#64706e;line-height:1.8;font-size:16px}.facts{display:flex;gap:34px;flex-wrap:wrap;margin-top:30px}.facts span{font-size:12px;color:#75807e;border-left:2px solid #db8a45;padding-left:13px}.facts strong{display:block;color:#293130;font-size:18px;margin-bottom:3px}.viewer-section{background:#252b2a}.desk{position:relative;overflow:hidden;padding:60px 20px 31px;background:radial-gradient(ellipse at 50% 5%,#9b8c7b 0%,transparent 55%),repeating-linear-gradient(94deg,transparent 0,rgba(255,255,255,.018) 2px,transparent 5px,transparent 46px),linear-gradient(110deg,#65584e,#887769 48%,#5b5149);isolation:isolate}.desk:before{content:'';position:absolute;inset:0;box-shadow:inset 0 0 140px #211b19a8;pointer-events:none}.desk-detail{position:absolute;right:-85px;top:20px;width:300px;height:300px;border:1px solid #ffffff18;border-radius:50%;box-shadow:0 0 0 25px #ffffff07,0 0 0 30px #ffffff0a;opacity:.45}.book-area{position:relative;z-index:1;max-width:1110px;margin:auto;display:flex;justify-content:center;perspective:2200px}.book{position:relative;width:min(100%,1050px);aspect-ratio:2.828 / 1;display:flex;filter:drop-shadow(2px 25px 21px #211916a3);transform-style:preserve-3d}.book.single{width:min(100%,525px);aspect-ratio:1.414 / 1}.page{width:50%;height:100%;background:#fff;position:relative;overflow:hidden;box-shadow:inset 0 0 12px #0002}.book.single .page{width:100%}.page img,.face img{width:100%;height:100%;object-fit:fill;display:block;cursor:zoom-in}.page.left{border-radius:3px 0 0 3px}.page.right{border-radius:0 3px 3px 0}.book.single .page.left{display:none}.book.single .page.right{border-radius:3px}.book:not(.single):after{content:'';position:absolute;left:calc(50% - 7px);width:14px;top:0;bottom:0;pointer-events:none;background:linear-gradient(90deg,#0003,transparent 48%,#0003);z-index:5}.flipper{display:none;position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;z-index:6}.flipper.active{display:block;animation:flipForward .76s cubic-bezier(.32,.05,.3,1) forwards}.flipper.reverse{display:block;left:0;transform-origin:right center;animation:flipBackward .76s cubic-bezier(.32,.05,.3,1) forwards}.face{position:absolute;inset:0;backface-visibility:hidden;background:#fff;overflow:hidden}.face.back{transform:rotateY(180deg)}.face:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,#0002,transparent 25%,#0001 85%)}@keyframes flipForward{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}@keyframes flipBackward{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}.controls{z-index:2;position:relative;margin:28px auto 0;display:flex;justify-content:center;align-items:center;gap:15px;color:white}.controls button,.controls a{font:600 13px 'DM Sans',Arial,sans-serif;border:1px solid #ffffff4a;background:#ffffff12;color:white;padding:12px 17px;border-radius:3px;cursor:pointer;text-decoration:none;transition:background .2s}.controls button:hover,.controls a:hover{background:#ffffff30}.controls button:disabled{opacity:.3;cursor:default}.page-indicator{font-variant-numeric:tabular-nums;font-size:12px;letter-spacing:.12em;min-width:96px;text-align:center}.control-sep{height:24px;width:1px;background:#ffffff4a}.viewer-tip{text-align:center;color:#e0d6ca;font-size:11px;letter-spacing:.02em;margin-top:20px}.content{max-width:1160px;margin:auto;padding:96px 28px 100px}.content h2,.cta h2{font-family:Manrope,Arial,sans-serif;font-size:clamp(29px,4vw,49px);letter-spacing:-.055em;line-height:1.2;margin:18px 0}.content>p{max-width:780px;color:#697370;line-height:1.9}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin:45px 0}.feature-grid article{background:white;border:1px solid #e8e8e3;padding:30px 26px;min-height:215px}.feature-grid article span{font-size:10px;letter-spacing:.14em;color:#b9793e;font-weight:700}.feature-grid h3{font-family:Manrope,Arial,sans-serif;font-size:20px;letter-spacing:-.04em;margin:18px 0 12px}.feature-grid p{font-size:14px;line-height:1.75;color:#697370}.content .note{font-size:12px;color:#8a8e8b}.cta{display:flex;justify-content:space-between;gap:30px;align-items:center;background:#273332;color:#fff;padding:75px max(28px,calc((100vw - 1104px)/2))}.cta p{max-width:560px;color:#c1cbca;line-height:1.8}.cta-actions{display:flex;flex-direction:column;gap:16px;min-width:235px}.cta-actions a{text-decoration:none;font-weight:700}.cta-actions .primary{background:#d9853f;color:#fff;padding:17px 22px;border-radius:3px;text-align:center}.cta-actions small{color:#9faeab}.accessible{max-width:1160px;margin:0 auto;padding:35px 28px}.accessible summary{cursor:pointer;font-size:13px;color:#697370}.seo-pages{max-width:850px;margin-top:25px}.seo-page{border-bottom:1px solid #ddd;padding:12px 0}.seo-page h3{font-size:14px}.seo-page p{font-size:12px;line-height:1.7;color:#555}footer{padding:32px 28px;text-align:center;font-size:11px;color:#84908b}footer span{margin:0 10px}dialog{border:0;border-radius:4px;padding:54px 16px 16px;background:#fff;max-width:min(95vw,1500px);max-height:96vh;box-shadow:0 30px 80px #0008}dialog::backdrop{background:#101816e8}dialog img{max-width:100%;max-height:calc(96vh - 90px);object-fit:contain;display:block;margin:auto}dialog button{position:absolute;right:14px;top:12px;border:0;background:none;cursor:pointer;font-size:14px;color:#333}@media(max-width:700px){.topbar{height:64px}.top-label{display:none}.top-contact{font-size:11px}.intro{padding:50px 23px 34px}.intro>p{font-size:14px}.facts{gap:15px}.facts strong{font-size:15px}.desk{padding:40px 12px 25px}.book{aspect-ratio:1.414 / 1;width:min(100%,525px)}.book:not(.single){aspect-ratio:1.414 / 1;width:min(100%,525px)}.book:not(.single) .page.left{display:none}.book:not(.single) .page.right{width:100%}.book:not(.single):after{display:none}.flipper{display:none!important}.controls{gap:6px;flex-wrap:wrap}.controls button,.controls a{padding:10px 9px;font-size:12px}.controls button span,.controls a span{display:none}.page-indicator{min-width:78px;font-size:11px}.viewer-tip{font-size:10px}.content{padding:66px 23px}.feature-grid{grid-template-columns:1fr;gap:12px}.feature-grid article{min-height:0}.cta{padding:58px 23px;flex-direction:column;align-items:stretch}.cta-actions{min-width:0}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}
/* V2: Das Exposé steht im Mittelpunkt */
.topbar{height:60px;padding-inline:clamp(18px,2.5vw,44px)}
.intro{max-width:none;padding:28px clamp(18px,3vw,55px) 24px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px 28px}
.intro .eyebrow{grid-column:1/-1}.intro h1{font-size:clamp(24px,3vw,42px);margin:0;line-height:1.12}.intro>p{display:none}.facts{margin:0;gap:16px}.facts span{font-size:11px}.facts strong{font-size:15px}
.viewer-section{background:#38352f}.desk{padding:clamp(12px,1.5vw,24px) clamp(8px,1.6vw,24px) 18px;background:radial-gradient(ellipse at 50% 30%,#b9aa98 0%,#958577 48%,#655b52 100%)}
.desk:before{box-shadow:inset 0 0 85px #261e174f}.desk-detail{display:none}
.book-area{max-width:none;perspective:3200px}.book{width:min(100%,calc((100vh - 215px)*2.828));max-width:1920px;aspect-ratio:2.828/1;filter:drop-shadow(0 19px 16px #1d15128a)}
.book.single{width:min(100%,calc((100vh - 215px)*1.414));max-width:960px}
.page{box-shadow:inset 0 0 4px #0002}.page img,.face img{image-rendering:auto}
.controls{margin:16px auto 0;gap:11px}.controls button,.controls a{padding:10px 15px;border-radius:5px}.viewer-tip{margin-top:11px}
.flipper.active,.flipper.reverse{animation-duration:1.15s;animation-timing-function:cubic-bezier(.2,.6,.15,1)}
.flipper.active{animation-name:flipForwardV2}.flipper.reverse{animation-name:flipBackwardV2}
@keyframes flipForwardV2{0%{transform:rotateY(0) skewY(0deg) scaleX(1)} 18%{transform:rotateY(-26deg) skewY(-.6deg) scaleX(.98)} 48%{transform:rotateY(-87deg) skewY(-1.5deg) scaleX(.94)} 75%{transform:rotateY(-145deg) skewY(-.6deg) scaleX(.98)} 100%{transform:rotateY(-180deg) skewY(0) scaleX(1)}}
@keyframes flipBackwardV2{0%{transform:rotateY(0) skewY(0deg) scaleX(1)} 18%{transform:rotateY(26deg) skewY(.6deg) scaleX(.98)} 48%{transform:rotateY(87deg) skewY(1.5deg) scaleX(.94)} 75%{transform:rotateY(145deg) skewY(.6deg) scaleX(.98)} 100%{transform:rotateY(180deg) skewY(0) scaleX(1)}}
.flipper .face:after{background:linear-gradient(90deg,#0005,transparent 20%,#fff3 55%,#0003);animation:paperLight 1.15s ease-in-out forwards}
@keyframes paperLight{0%,100%{opacity:.15}40%,60%{opacity:1}}
/* An den Blattkanten sind die Seiten direkt greifbar */
.edge{position:absolute;top:0;bottom:0;width:5.5%;z-index:8;cursor:pointer;opacity:0;transition:opacity .2s;background:linear-gradient(90deg,transparent,#fff8)}
.edge:hover{opacity:.65}.edge.prev{left:0;transform:scaleX(-1)}.edge.next{right:0}
@media(max-width:900px){.intro{display:block;padding:22px 18px 18px}.intro .eyebrow{margin-bottom:10px}.intro h1{font-size:clamp(24px,4vw,36px)}.facts{margin-top:14px}.book{width:100%;max-width:none}.book.single{width:min(100%,800px)}}
@media(max-width:700px){.intro{padding:18px 15px}.intro h1{font-size:25px}.facts{gap:8px}.facts span{font-size:10px}.facts strong{font-size:12px}.desk{padding:15px 7px}.book{width:100%}.controls{gap:6px}.viewer-tip{font-size:10px}}

/* V3: high-resolution canvas paper-curvature engine */
.paper-curl{position:absolute;inset:0;z-index:7;pointer-events:none;display:none;max-width:100%;height:100%}
.book.is-turning .page img{cursor:default}
.book.is-turning .edge{pointer-events:none}
.flipper{display:none!important}

/* V4 – gebundener Magazinruecken statt zweier loser Einzelblaetter */
.book:not(.single):after{display:none}
.book:not(.single) .page{box-shadow:none}
.book:not(.single) .page.left:after,.book:not(.single) .page.right:after{content:"";position:absolute;top:0;bottom:0;width:clamp(13px,2.6%,34px);pointer-events:none;z-index:2}
.book:not(.single) .page.left:after{right:0;background:linear-gradient(90deg,transparent 0%,rgba(50,43,36,.025) 28%,rgba(41,35,29,.10) 70%,rgba(27,22,19,.24) 100%)}
.book:not(.single) .page.right:after{left:0;background:linear-gradient(90deg,rgba(27,22,19,.29) 0%,rgba(41,35,29,.13) 32%,rgba(50,43,36,.025) 76%,transparent 100%)}
.book-spine{display:none;position:absolute;top:0;bottom:0;left:50%;width:clamp(7px,.95%,16px);transform:translateX(-50%);z-index:9;pointer-events:none;background:linear-gradient(90deg,rgba(18,15,13,.10) 0%,rgba(16,13,11,.35) 29%,rgba(14,12,11,.47) 48%,rgba(255,255,255,.13) 68%,rgba(0,0,0,.08) 100%);mix-blend-mode:multiply}
.book:not(.single) .book-spine{display:block}
.book-spine:after{content:"";position:absolute;left:42%;width:1px;top:0;bottom:0;background:rgba(10,9,8,.2)}
.book:not(.single){background:linear-gradient(90deg,transparent 49%,#dedbd4 49.6%,#d6d2cb 50.4%,transparent 51%)}
@media(max-width:700px){.book-spine{display:none!important}}