:root{--paper:#f7f3ea;--ink:#1b1a16;--rule:#1b1a1626;--gold-dark:#7f6119}
body{background:var(--paper)}
.hero-home{background:var(--paper)!important;padding-top:7rem!important}
.hero-deco,#wl-zitat{display:none!important}
.hero-home-center{position:relative;z-index:2;max-width:1180px!important;margin:0 auto!important;text-align:left!important;padding:0 2rem!important}
.hero-eyebrow{font-size:.78rem!important;letter-spacing:.3em!important;text-transform:uppercase;color:var(--gold-dark)!important;border-top:1px solid var(--ink);padding-top:1rem;display:inline-block;min-width:100%}
.hero-home h1{font-size:clamp(3.4rem,9vw,8.4rem)!important;line-height:.95!important;font-weight:400!important;letter-spacing:-.025em;color:var(--ink)!important;text-align:left!important;max-width:11em;margin:1.2rem 0 2rem!important}
.hero-home p{text-align:left!important;font-size:1.25rem;max-width:34em;color:#3b382f}
.hero-home .hero-nav,.hero-home-center .btn,.hero-home-center a.btn{border-radius:0!important}
.hero-home-center a{border-radius:0!important}
.hero-shelf{max-width:1180px;margin:3rem auto 0;border-top:1px solid var(--ink)}
section[style*="gradient"],section#apps,section[style*="background:#0f1e1a"]{background:#14241f!important;border-top:0;padding-top:6rem!important;padding-bottom:6rem!important}
section[style*="gradient"] h2,section#apps h2{font-weight:400!important;font-size:clamp(2.2rem,5vw,4.2rem)!important;line-height:1.02!important;letter-spacing:-.02em}
section[style*="gradient"] a[style*="border"]{border-radius:0!important}
.reveal{transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}
/* ---- Buchrücken-Streifen zurück: Tiefe an den Rändern ---- */
.hero-home{position:relative;overflow:hidden}
.hero-deco{display:block!important;position:absolute;width:clamp(90px,11vw,170px);opacity:.5;z-index:0;pointer-events:none}
.hero-deco-tl,.hero-deco-tr{top:0}.hero-deco-bl,.hero-deco-br{bottom:0}
.hero-deco-bl,.hero-deco-tl{left:0}.hero-deco-br,.hero-deco-tr{right:0}
@media(max-width:820px){.hero-deco{display:none!important}}
/* ---- Bewegung ---- */
@keyframes rise{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
.hero-home-center>*{opacity:0;animation:rise 1.1s cubic-bezier(.2,.7,.2,1) forwards}
.hero-home-center>*:nth-child(2){animation-delay:.05s}.hero-home-center>*:nth-child(3){animation-delay:.15s}
.hero-home-center>*:nth-child(4){animation-delay:.3s}.hero-home-center>*:nth-child(5){animation-delay:.45s}.hero-home-center>*:nth-child(n+6){animation-delay:.6s}
.hero-shelf-row>*{animation:rise 1s cubic-bezier(.2,.7,.2,1) both}
.hero-shelf-row>*:nth-child(1){animation-delay:.5s}.hero-shelf-row>*:nth-child(2){animation-delay:.6s}.hero-shelf-row>*:nth-child(3){animation-delay:.7s}.hero-shelf-row>*:nth-child(4){animation-delay:.8s}.hero-shelf-row>*:nth-child(5){animation-delay:.9s}
@supports (animation-timeline:scroll()){
 @keyframes drift{from{transform:translateY(0)}to{transform:translateY(-140px)}}
 .hero-deco-bl,.hero-deco-br,.hero-deco-tl,.hero-deco-tr{animation:drift linear both;animation-timeline:scroll(root);animation-range:0 900px}
}
a,button{transition:background .3s ease,color .3s ease,transform .3s cubic-bezier(.2,.7,.2,1)}
@media (prefers-reduced-motion:reduce){.hero-home-center>*,.hero-shelf-row>*,.hero-deco{animation:none!important;opacity:1}}
/* Regal: nichts abschneiden, Hover pausiert nicht mehr (Bewegung steuert das Skript) */
.hero-home{overflow-x:clip!important;overflow-y:visible!important;padding-bottom:3.5rem}
.hero-shelf{overflow:hidden;padding-bottom:3rem!important;margin-top:4rem}
.hero-shelf-row{padding-bottom:.9rem!important;user-select:none;-webkit-user-select:none}
.hero-shelf-row img{-webkit-user-drag:none}
.hero-shelf-plank{margin-left:0;margin-right:0;border-radius:0}
/* ---- App-Bereich: fünf gleich große Blöcke ---- */
.app-teasers{background:#14241f}
.app-teasers>section:nth-of-type(1)>div>a{max-width:none!important}
@media (min-width:1000px){
 .app-teasers{grid-template-columns:1fr!important;gap:0!important}
 .app-teasers>section:nth-of-type(1)>div{max-width:1280px!important;margin:0 auto!important;display:flex!important;flex-wrap:nowrap!important;gap:1rem!important}
 .app-teasers>section:nth-of-type(1)>div>a{flex:1 1 0!important}
 .app-teasers>section:nth-of-type(n+2){border-top:1px solid #c4a4562e;padding-top:4.5rem!important;padding-bottom:4.5rem!important;text-align:left!important}
 .app-teasers>section:nth-of-type(n+2)>div{max-width:1040px!important;margin:0 auto!important;display:grid!important;grid-template-columns:260px 1fr;column-gap:4rem;align-items:start;text-align:left}
 .app-teasers>section:nth-of-type(n+2)>div>*{grid-column:2;text-align:left!important;margin-left:0!important;margin-right:0!important}
 .app-teasers>section:nth-of-type(n+2)>div>.app-pic{grid-column:1;grid-row:1/12;margin:.4rem 0 0!important;text-align:left!important}
 .app-teasers>section:nth-of-type(n+2) .app-pic svg{width:240px!important;height:auto!important}
 .app-teasers>section:nth-of-type(n+2) .app-pic img{width:240px!important}
 .app-teasers>section:nth-of-type(n+2) div[style*="justify-content:center"]{justify-content:flex-start!important}
}
@media (min-width:1000px){
 .app-teasers>section:nth-of-type(2) p[style*="1.7rem"]{font-size:2.6rem!important;line-height:1.15!important;margin-bottom:.8rem!important}
 .app-teasers>section:nth-of-type(2) a[href="kompass-en.html"]{justify-self:start;width:fit-content}
 .app-teasers>section:nth-of-type(2) li,.app-teasers>section:nth-of-type(2) p[style*="0.86rem"]{font-size:.98rem!important}
}
/* ---- Lesbarkeit unten auf der Seite ---- */
.sg-optin__hint,.sg-optin__hint a{color:#6a655e!important}
[class*="vr-sonderangebot-banner__ribbon"],[class*="vr-sonderangebot-banner__badge"],a[class*="vr-sonderangebot-banner__btn"],[class*="vr-sonderangebot-banner__discount"]{color:#1b1a16!important}
[class*="vr-sonderangebot-banner"] p,[class*="vr-sonderangebot-banner__old"],[class*="vr-sonderangebot-banner__ship"],[class*="vr-sonderangebot-banner__fine"]{color:#5b574f!important}
p[style*="9a9388"],p[style*="#9a9388"]{color:#6a655e!important}
/* Gold als Schrift auf hellem Grund: dunkleres Gold; auf Gold dunkle Schrift */
.nav-logo-name,.site-switcher__label,.book-format,.btn:not(.btn-filled),.btn-sm,span.btn{color:var(--gold-dark)!important;border-color:var(--gold-dark)!important}
.btn.btn-filled,.btn-filled{color:#1b1a16!important;background:#c9a84c!important;border-color:#c9a84c!important}
.btn.btn-filled:hover{background:#b9973a!important}
.vr-sonderangebot-banner__cta{color:#1b1a16!important}
.vr-sonderangebot-banner__alt{color:#6a655e!important}.vr-sonderangebot-banner__ver{color:#6a655e!important}
.site-footer p,.footer-bottom,.footer-bottom *,footer a,footer p{color:#c9c4bb!important}
p[style*="6b6055"]{color:#b8b0a6!important}
/* ---- Spielerei: Farbwahl im Kopfbereich ---- */
.farbwahl{position:absolute;top:7.6rem;right:210px;z-index:5;display:flex;gap:.55rem;align-items:center;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#6a655e}
.farbwahl button{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #1b1a1655;cursor:pointer;padding:0;transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.farbwahl button:hover{transform:scale(1.18)}
.farbwahl button[aria-pressed="true"]{box-shadow:0 0 0 2px #1b1a16}
.hero-home{transition:background .7s ease,color .7s ease}
.hero-home[data-farbe="sand"]{background:#efe3d0!important}
.hero-home[data-farbe="salbei"]{background:#e3eae0!important}
.hero-home[data-farbe="nacht"]{background:#14241f!important}
.hero-home[data-farbe="nacht"] h1,.hero-home[data-farbe="nacht"] p{color:#f5ead8!important}
.hero-home[data-farbe="nacht"] .hero-eyebrow{color:#e1c88f!important;border-top-color:#f5ead8}
.hero-home[data-farbe="nacht"] .farbwahl{color:#c9c4bb}
.hero-home[data-farbe="nacht"] .btn:not(.btn-filled){color:#e1c88f!important;border-color:#e1c88f!important}
@media(max-width:820px){.farbwahl{top:5.4rem;right:1rem}.farbwahl span{display:none}}
#back-to-top{width:52px!important;height:52px!important;font-size:1.4rem!important;right:1.4rem!important;bottom:1.4rem!important;z-index:900}
.hero-home .hero-sub{max-width:none!important;text-wrap:balance}
@media(min-width:700px){.hero-home .hero-sub{white-space:nowrap}}
.site-nav a.active,.nav-links a.active{color:var(--gold-dark)!important}