/* Scroll-Story: ein fester Videobereich innerhalb der Startseite, den das Scrollen vor- und zurückspult. */
.cc-story{position:relative;background:var(--black,#050505);color:var(--white,#f1f1ec)}
.cc-story[hidden]{display:none}
.cc-story__sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;background:var(--black,#050505)}
.cc-story__stage{position:absolute;inset:0;overflow:hidden}
.cc-story__shot{position:absolute;inset:0;opacity:0;will-change:opacity}
.cc-story__shot img,.cc-story__shot video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.cc-story__shot img{transform:scale(1.02);transition:opacity .2s}
.cc-story__shot{transform-origin:50% 50%}
.cc-story__shot video{z-index:1;opacity:0}
.cc-story__shot.has-video video{opacity:1}
.cc-story__shot.has-video img{opacity:0}
.cc-story__shot img.cc-story__next{opacity:0;transform:none;transition:none}
.cc-story__stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:radial-gradient(ellipse at center,transparent 52%,rgba(0,0,0,.55) 100%),linear-gradient(180deg,rgba(5,5,5,.55) 0,transparent 16%,transparent 84%,rgba(5,5,5,.75) 100%)}
.cc-story__copies{position:absolute;inset:0;z-index:5;pointer-events:none}
.cc-story__copy{position:absolute;top:50%;width:min(500px,calc(100vw - 48px));padding:34px 32px;opacity:0;transform:translateY(-50%);isolation:isolate;pointer-events:none}
.cc-story__copy::before{content:"";position:absolute;z-index:-1;inset:-70px -90px;background:radial-gradient(ellipse at center,rgba(5,5,5,.9) 0 26%,rgba(5,5,5,.66) 46%,transparent 72%);filter:blur(10px)}
.cc-story__copy[data-position="left"]{left:max(24px,6vw)}
.cc-story__copy[data-position="right"]{right:max(64px,8vw)}
.cc-story__index{display:flex;align-items:center;gap:12px;margin:0 0 18px;color:var(--muted,#aaa9a1);font:700 11px/1 var(--sans,Arial,sans-serif);letter-spacing:.16em}
.cc-story__index::after{content:"";width:44px;height:1px;background:var(--gold,#d1b161)}
.cc-story__eyebrow{margin:0;color:var(--gold,#d1b161);font:700 12px/1.2 var(--sans,Arial,sans-serif);letter-spacing:.18em;text-transform:uppercase}
.cc-story__copy h2{margin:12px 0 0;font-family:var(--display,'Arial Narrow',Arial,sans-serif);font-size:clamp(38px,4.2vw,64px);line-height:.98;letter-spacing:-.01em;text-transform:uppercase;text-shadow:0 2px 24px #000;text-wrap:balance}
.cc-story__copy h2 span{color:var(--gold,#d1b161)}
.cc-story__body{margin-top:18px;max-width:44ch;font-size:clamp(15px,1.05vw,17px);line-height:1.6;color:var(--white,#f1f1ec);text-shadow:0 1px 12px #000}
.cc-story__body p{margin:0 0 .6em}
.cc-story__tags{display:flex;flex-wrap:wrap;gap:8px 18px;margin:20px 0 0;padding:0;list-style:none}
.cc-story__tags li{padding-top:7px;border-top:1px solid var(--gold,#d1b161);color:var(--muted,#aaa9a1);font:700 10px/1 var(--sans,Arial,sans-serif);letter-spacing:.12em;text-transform:uppercase}
.cc-story__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:24px}
.cc-story__progress{position:absolute;z-index:6;left:0;right:0;bottom:0;height:2px;background:rgba(255,255,255,.08)}
.cc-story__progress i{display:block;height:100%;background:var(--gold,#d1b161);transform:scaleX(0);transform-origin:left}
.cc-story__route{position:absolute;z-index:6;right:max(18px,env(safe-area-inset-right,0px));top:50%;display:flex;flex-direction:column;gap:16px;transform:translateY(-50%)}
.cc-story__route button{display:flex;align-items:center;justify-content:flex-end;gap:9px;padding:0;border:0;background:none;color:var(--white,#f1f1ec);cursor:pointer;font:inherit}
.cc-story__route span{font:700 10px/1 var(--sans,Arial,sans-serif);opacity:.45}
.cc-story__route i{width:0;overflow:hidden;font-size:11px;font-style:normal;white-space:nowrap;opacity:0;transition:width .2s,opacity .2s}
.cc-story__route button::after{content:"";width:8px;height:1px;background:rgba(255,255,255,.45);transition:width .2s,background .2s}
.cc-story__route button:hover i,.cc-story__route button:focus-visible i,.cc-story__route button.is-active i{width:96px;opacity:1}
.cc-story__route button.is-active span{color:var(--gold,#d1b161);opacity:1}
.cc-story__route button.is-active::after{width:24px;background:var(--gold,#d1b161)}
.cc-story__route button:focus-visible,.cc-story__skip:focus-visible{outline:2px solid var(--gold,#d1b161);outline-offset:3px}
.cc-story__hint{position:absolute;z-index:6;left:50%;bottom:calc(28px + env(safe-area-inset-bottom,0px));display:grid;justify-items:center;gap:10px;transform:translateX(-50%);color:var(--muted,#aaa9a1);transition:opacity .3s;pointer-events:none}
.cc-story__hint span{font:700 10px/1 var(--sans,Arial,sans-serif);letter-spacing:.22em;text-transform:uppercase}
.cc-story__hint i{width:1px;height:34px;background:linear-gradient(var(--gold,#d1b161),transparent);animation:cc-story-drip 1.8s ease-in-out infinite}
.cc-story__hint.is-hidden{opacity:0}
@keyframes cc-story-drip{0%{transform:scaleY(.2);transform-origin:top}50%{transform:scaleY(1)}100%{transform:scaleY(.2);transform-origin:bottom}}
.cc-story__skip{position:absolute;z-index:6;right:max(24px,env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));padding:8px 0 5px;border:0;border-bottom:1px solid rgba(209,177,97,.5);background:none;color:var(--white,#f1f1ec);font:700 12px/1 var(--sans,Arial,sans-serif);letter-spacing:.04em;cursor:pointer}
.cc-story__skip:hover{color:var(--gold-light,#e4cd8d)}
@media (max-width:760px){
.cc-story__route,.cc-story__hint span{display:none}
.cc-story__copy,.cc-story__copy[data-position]{top:auto;left:12px;right:12px;bottom:calc(64px + env(safe-area-inset-bottom,0px));width:auto;padding:22px 20px;transform:none}
.cc-story__copy::before{inset:-40px -30px -70px}
.cc-story__copy h2{font-size:clamp(32px,9vw,44px)}
.cc-story__body{font-size:15px;line-height:1.5}
.cc-story__shot img,.cc-story__shot video{object-position:var(--fx,50%) 42%}
.cc-story__hint{bottom:calc(66px + env(safe-area-inset-bottom,0px))}
}
@media (prefers-reduced-motion:reduce){.cc-story__hint{display:none}.cc-story__shot img{transform:none!important}}
.cc-header-pinned{position:fixed;top:0;left:0;right:0;z-index:60;background:rgba(5,5,5,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);animation:cc-header-in .22s ease-out}
.cc-header-spacer[hidden]{display:none}
@keyframes cc-header-in{from{transform:translateY(-100%)}to{transform:none}}
.cc-totop{position:fixed;z-index:55;right:max(20px,env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));width:48px;height:48px;display:grid;place-items:center;border:1px solid var(--gold,#d1b161);border-radius:50%;background:rgba(5,5,5,.88);color:var(--gold,#d1b161);font:700 20px/1 var(--sans,Arial,sans-serif);cursor:pointer;opacity:0;pointer-events:none;transform:translateY(10px);transition:opacity .25s,transform .25s}
.cc-totop.is-visible{opacity:1;pointer-events:auto;transform:none}
.cc-totop:hover{background:var(--gold,#d1b161);color:#050505}
.cc-totop:focus-visible{outline:2px solid var(--gold,#d1b161);outline-offset:3px}
@media (prefers-reduced-motion:reduce){.cc-header-pinned{animation:none}.cc-totop{transition:none}}
@media (max-height:520px) and (orientation:landscape){
.cc-story__copy,.cc-story__copy[data-position]{top:50%;bottom:auto;left:max(16px,env(safe-area-inset-left,0px));right:auto;width:min(46vw,420px);max-height:calc(100% - 24px);padding:14px 16px;transform:translateY(-50%);overflow:hidden}
.cc-story__copy::before{inset:-40px -60px}
.cc-story__index{margin-bottom:8px}
.cc-story__copy h2{margin-top:6px;font-size:clamp(22px,4.2vw,30px)}
.cc-story__body{margin-top:10px;font-size:13px;line-height:1.4}
.cc-story__tags{display:none}
.cc-story__actions{margin-top:12px;gap:10px 16px}
.cc-story__hint{display:none}
}
