/* Zwei Tage auf Mallorca — Filmkapitel und Einladung. */
.korn{display:none}
.kopf{background:transparent;color:#fff;box-shadow:none;text-shadow:0 1px 12px #0008}
.kopf a{color:#fff}
body.gescrollt .kopf{background:#d7dec4;color:var(--oliv-tief);text-shadow:none;box-shadow:0 1px 0 #4c573026}
body.gescrollt .kopf a{color:var(--oliv-tief)}
.ein{transition-duration:1.3s}
.ein__blatt{transition:transform 1.2s cubic-bezier(.28,.9,.24,1) .7s,filter 1.2s ease .7s}
.ein__klappe{transition-duration:1.15s}
.lade.nah .ein{transition:transform 1.3s cubic-bezier(.24,1,.3,1)}
.sog.zieht{transition:top 1.8s cubic-bezier(.65,0,.25,1),left 1.8s cubic-bezier(.65,0,.25,1),width 1.8s cubic-bezier(.65,0,.25,1),height 1.8s cubic-bezier(.65,0,.25,1),border-radius 1.8s,box-shadow 1.8s}
.geschichte>span{display:block;margin-bottom:1em}
.geschichte>span:last-child{margin-bottom:0}
.vorfreude{background:#242c24;color:#f9f7ed;padding:clamp(60px,8vw,120px) var(--rand)}
.kino-intro,.kino{max-width:1280px;margin:auto}
.kino-intro{display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:20px 50px;margin-bottom:42px}
.kino-intro .mini{grid-column:1/-1;color:#bac7a3}
.kino-intro h2{font-family:Fraunces,serif;font-weight:300;font-size:clamp(46px,6.5vw,90px);line-height:1.06;letter-spacing:-.04em}
.kino-intro h2 em{color:#c7d0b2}
.kino-intro p{max-width:420px;color:#e0e2d8}
.kino-leinwand{position:relative;aspect-ratio:16/9;background:#151d18;overflow:hidden}
.kino-szene{position:absolute;inset:0;opacity:0;transition:opacity 1s ease;pointer-events:none}
.kino-szene.an{opacity:1}
.kino-szene video,.kino-szene img{width:100%;height:100%;display:block;object-fit:contain}
.kino-kirche{background:radial-gradient(ellipse at center,#526552,#1b261e)}
.kino-kirche img{object-fit:contain}
.kino-nummer{position:absolute;top:20px;left:22px;color:#fff;font-size:13px;letter-spacing:.18em;background:#172319a6;padding:8px 12px}
.kino-fortschritt{position:absolute;bottom:0;left:0;right:0;height:3px;background:#ffffff30}
.kino-fortschritt i{display:block;height:100%;width:0;background:#d2ddbd}
.kino-unten{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:30px 0}
.kino-beschreibung{max-width:780px}.kino-beschreibung .mini{color:#bccaab}
.kino-beschreibung h3{font:300 clamp(27px,3vw,40px)/1.15 Fraunces,serif;margin:10px 0}
.kino-beschreibung p{color:#d9ddd1;font-size:16px;min-height:3em}
.kino-bedienung{display:flex;gap:8px;flex-shrink:0}
.kino button{cursor:pointer;color:inherit;font:inherit}
.kino-bedienung button{background:transparent;border:1px solid #d7e0c765;min-height:48px;min-width:48px;padding:8px 14px}
#kino-play{min-width:116px}.kino button:hover{background:#ffffff14}
.kino button:focus-visible{outline:2px solid #e3ebd1;outline-offset:4px}
.kino-kapitel{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.kino-kapitel button{text-align:left;padding:20px 13px;background:transparent;border:0;border-top:1px solid #d1dbbf50}
.kino-kapitel button.an{border-top:3px solid #d1dbbf;background:#d1dbbf12;padding-top:18px}
.kino-kapitel span{display:block;font-size:11px;letter-spacing:.1em;color:#bbc8ab;margin-bottom:10px}
.kino-kapitel b{font-size:14px;line-height:1.3;font-weight:400;display:block}
.kino-hinweis{font-size:13px;color:#bcc5b4;margin-top:24px;max-width:760px}
.kino-zum-ablauf{display:inline-block;margin-top:14px;color:#f3f4e9;text-underline-offset:5px;font-size:14px}
.halt figure.kirchenfoto{aspect-ratio:3/4;height:auto;max-width:540px}
.halt figure.kirchenfoto img{transform:none!important;width:100%;height:100%;object-fit:contain}
.inselnotiz{max-width:720px;margin:60px auto 0;padding:30px 0;border-top:1px solid var(--linie);border-bottom:1px solid var(--linie)}
.inselnotiz h3{font:300 30px/1.25 Fraunces,serif;margin:12px 0;color:var(--oliv)}
.inselnotiz p{font-size:16px}.inselnotiz a{font-size:12px;color:var(--oliv);text-underline-offset:4px}
.zaehler h2{font:300 clamp(32px,4.5vw,60px)/1.15 Fraunces,serif;color:var(--oliv);margin:20px 0 42px}
.countdown{display:flex;align-items:center;justify-content:center;gap:clamp(8px,2vw,28px);margin:0 auto 30px}
.countdown>div{min-width:clamp(55px,12vw,150px)}
.countdown strong{font:300 clamp(42px,9vw,112px)/1 Fraunces,serif;letter-spacing:-.04em;color:var(--oliv-tief);font-variant-numeric:tabular-nums}
.countdown span{display:block;text-transform:uppercase;letter-spacing:.16em;font-size:11px;margin-top:16px}
.countdown i{font:300 clamp(25px,4vw,45px) Fraunces,serif;color:#a0a787;transform:translateY(-18px)}
.countdown-ziel{font-size:18px}.countdown-ziel span{display:block;margin:9px 0 26px;font-size:13px;letter-spacing:.06em}
.preparty-kopf{margin-top:12px}.preparty-kopf h3{font:300 42px/1.1 Fraunces,serif;color:var(--oliv)}
.album-kopf{display:flex;justify-content:space-between;align-items:center;gap:18px;margin:38px 0 18px;font-size:15px}
.album-demo{border:1px solid #ffffff45;padding:7px 12px;font-size:11px;letter-spacing:.08em}
.album figure{clip-path:none;aspect-ratio:auto;background:#f5f2e8;padding:10px 10px 0;color:#3e4931}
.album img{display:block;aspect-ratio:4/5;height:auto;object-fit:cover}
.album figcaption{font:400 19px/1.2 Fraunces,serif;padding:16px 6px 18px}
.album figcaption span{display:block;font:400 10px Karla,sans-serif;text-transform:uppercase;letter-spacing:.12em;margin-top:9px;color:#737a66}
.foto-test{display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:35px;padding-top:30px;border-top:1px solid #ffffff30}
.foto-test>div{max-width:570px}.foto-test h3{font:300 28px Fraunces,serif;margin-bottom:10px}.foto-test p{font-size:14px}.foto-test label{flex-shrink:0}
.zwei:has(>.feld:only-child){grid-template-columns:1fr}
.fuss{padding:100px var(--rand) 65px}.fuss h2{font:300 clamp(36px,5vw,68px)/1.1 Fraunces,serif;color:#d9e1c8;margin:22px 0}
.fuss p{max-width:600px;margin:0 auto 26px;color:#e3e4dc}.fuss .fuss-namen{font:300 27px/1.4 Fraunces,serif;color:#d9e1c8}.fuss a{color:#d9e1c8;text-underline-offset:6px}
@media(max-width:800px){.kino-intro{grid-template-columns:1fr}.kino-intro p{max-width:560px}.kino-unten{align-items:flex-start;flex-direction:column}.kino-kapitel{grid-template-columns:repeat(3,1fr)}.foto-test{align-items:flex-start;flex-direction:column}.album{grid-template-columns:repeat(3,1fr)}.album .g4{grid-column:span 1}}
@media(max-width:540px){.kino-kapitel{grid-template-columns:repeat(2,1fr)}.kino-kapitel button{padding:15px 10px}.kino-kapitel button.an{padding-top:13px}.kino-leinwand{aspect-ratio:4/3}.kino-nummer{top:10px;left:10px}.kino-beschreibung p{min-height:4.5em}.album{grid-template-columns:1fr}.album .g4{max-width:360px;width:100%;margin:auto}.album-kopf{align-items:flex-start;flex-direction:column}.countdown span{font-size:9px;letter-spacing:.06em}.countdown{gap:6px}.countdown>div{min-width:55px}.zaehler{padding-left:18px;padding-right:18px}.fuss{padding-top:70px}}
@media(prefers-reduced-motion:reduce){.ein,.ein__blatt,.ein__klappe,.sog.zieht,.kino-szene{transition:none}}
@media(min-width:801px){.kino-leinwand{max-height:52svh}.kino-unten{padding:22px 0}.kino-beschreibung p{min-height:0}.kino-kapitel button{padding-bottom:16px}}
.inselnotiz{width:calc(100% - 2 * var(--rand))}
.ein__lasche{transition:transform 1.15s cubic-bezier(.5,0,.2,1),z-index 0s linear .575s}

/* Durchgehend geschlossene Papier-Rückwand, auch unter der ausgezogenen Karte. */
.ein__innen{background:linear-gradient(180deg,#d3cdbf 0%,#c5bdad 48%,#b9af9c 100%);opacity:1}
.halt figure.kirchenfoto{aspect-ratio:800/536;max-width:none}

/* Kompaktes Album: drei Bilder am Desktop, ein Bild auf dem Handy. */
.album{grid-template-columns:repeat(3,minmax(0,1fr));align-items:start}
.album figure[hidden]{display:none!important}
.album .g4{grid-column:auto;width:100%;max-width:none}
.album img{aspect-ratio:4/3;object-fit:cover}
.album-steuerung{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:26px}
.album-steuerung button{font:inherit;color:var(--creme);background:transparent;border:1px solid #ffffff60;padding:12px 20px;min-height:46px;cursor:pointer}
.album-steuerung button:disabled{opacity:.35;cursor:default}
.album-steuerung button:focus-visible{outline:2px solid var(--salbei);outline-offset:4px}
#album-stand{font-size:13px;color:var(--creme);font-variant-numeric:tabular-nums}
@media(max-width:760px){.album{grid-template-columns:1fr}.album .g4{max-width:520px;margin:auto}.album-steuerung{gap:12px}.album-steuerung button{padding:12px}.album figcaption{min-height:78px}}
