:root{--ink:#24352f;--muted:#66736e;--green:#607d6b;--green-dark:#385849;--sage:#dce6de;--sand:#eee7d8;--cream:#f7f5ef;--white:#fff;--line:#d9dfda;--shadow:0 18px 55px rgba(32,53,45,.1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:var(--cream);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.6}.wrap{width:min(1180px,calc(100% - 40px));margin-inline:auto}a{color:inherit}.site-header{position:sticky;top:0;z-index:20;background:rgba(247,245,239,.94);border-bottom:1px solid rgba(36,53,47,.1);backdrop-filter:blur(12px)}.topbar{min-height:92px;display:flex;align-items:center;justify-content:space-between;gap:28px}.brand{text-decoration:none;display:flex;flex-direction:column}.brand-name{font-family:Georgia,serif;font-size:1.75rem;line-height:1;color:var(--green-dark)}.brand-year{margin-top:8px;font-size:.68rem;font-weight:750;letter-spacing:.19em;color:var(--muted)}nav{display:flex;align-items:center;gap:8px}nav a{text-decoration:none;padding:10px 12px;border-radius:3px;font-size:.94rem;font-weight:650;color:#53615b}nav a:hover,nav a.active{color:var(--green-dark);background:var(--sage)}.menu-button{display:none;border:1px solid var(--line);background:var(--white);padding:9px 13px;color:var(--ink);font:inherit;font-weight:700}.hero{min-height:650px;display:grid;align-items:center;background:radial-gradient(circle at 12% 22%,rgba(96,125,107,.18),transparent 34rem),radial-gradient(circle at 84% 80%,rgba(203,183,139,.23),transparent 29rem)}.hero-grid{display:grid;grid-template-columns:minmax(0,1.28fr) minmax(360px,.72fr);gap:clamp(40px,6vw,80px);align-items:center;padding-block:45px 78px}.scene-stage{grid-column:1/-1;position:relative;width:100%;aspect-ratio:3/1;overflow:hidden;background:#fff;box-shadow:0 14px 45px rgba(32,53,45,.06);clip-path:inset(0 100% 0 0);opacity:.2;animation:scene-reveal 3.2s cubic-bezier(.22,.72,.2,1) .2s forwards}.scene-stage::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 83%,rgba(255,255,255,.8) 97%,#fff);transform:translateX(-100%);animation:scene-glow 3.2s ease .2s forwards}.scene-stage img{display:block;width:100%;height:auto;transform:translateY(-1%)}@keyframes scene-reveal{0%{clip-path:inset(0 100% 0 0);opacity:.2}18%{opacity:1}100%{clip-path:inset(0 0 0 0);opacity:1}}@keyframes scene-glow{from{transform:translateX(-100%)}to{transform:translateX(105%)}}.hero-copy{opacity:0;transform:translateY(16px);animation:content-arrive .8s ease 2.55s forwards}.upcoming{opacity:0;transform:translateY(16px);animation:content-arrive .8s ease 2.75s forwards;background:rgba(255,255,255,.86);padding:34px;box-shadow:var(--shadow);border-top:5px solid var(--green)}@keyframes content-arrive{to{opacity:1;transform:translateY(0)}}.eyebrow,.section-kicker{margin:0 0 16px;color:var(--green);font-size:.74rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}.hero h1,.page-head h1{font-family:Georgia,"Times New Roman",serif;font-weight:400;letter-spacing:-.04em;line-height:1.03;margin:0}.hero h1{font-size:clamp(3.2rem,6.8vw,6.5rem)}.hero h1 span{color:var(--green)}.lead{max-width:700px;margin:30px 0;color:var(--muted);font-size:clamp(1.05rem,1.8vw,1.28rem)}.actions{display:flex;flex-wrap:wrap;gap:12px}.button{display:inline-block;padding:14px 20px;text-decoration:none;font-weight:750;border:1px solid var(--green-dark)}.primary{background:var(--green-dark);color:#fff}.primary:hover{background:#29483a}.secondary{background:transparent;color:var(--green-dark)}.secondary:hover{background:#fff}.preview-note{margin:22px 0 0;color:#8a948f;font-size:.82rem}.upcoming h2,.intro h2,.page-head h1,.tile h2,.prose h2,.gallery-empty h2{font-family:Georgia,serif;font-weight:400}.upcoming h2{font-size:2rem;margin:0 0 24px}.event-stack{display:grid;gap:12px}.event-card{display:grid;grid-template-columns:64px 1fr 24px;gap:15px;align-items:center;padding:11px 0;text-decoration:none;border-bottom:1px solid var(--line)}.event-card:hover .event-info strong{color:var(--green)}.date-sheet{display:grid;text-align:center;background:#fff;border:1px solid #ccd6cf;box-shadow:0 4px 12px rgba(36,53,47,.08);line-height:1}.date-sheet span{padding:6px 3px;background:var(--green);color:#fff;font-size:.65rem;font-weight:800;letter-spacing:.1em}.date-sheet strong{padding:7px 2px 2px;font-family:Georgia,serif;font-size:1.65rem;font-weight:400}.date-sheet small{padding:2px 2px 7px;color:var(--muted);font-size:.65rem}.event-info{display:grid;gap:5px}.event-info strong{font-size:.93rem;line-height:1.25}.event-info small{color:var(--muted);font-size:.78rem}.arrow{color:var(--green);font-size:1.3rem}.text-link{display:inline-block;margin-top:22px;color:var(--green-dark);font-weight:750;text-underline-offset:4px}.intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-block:82px}.intro h2{font-size:clamp(2rem,4vw,3.5rem);line-height:1.12;margin:0}.intro>p{margin:34px 0 0;color:var(--muted);font-size:1.12rem}.page-head{padding-top:90px;padding-bottom:52px;max-width:900px;margin-left:max(20px,calc((100% - 1180px)/2))}.page-head h1{font-size:clamp(3rem,7vw,5.7rem)}.page-head>p:last-child{max-width:700px;color:var(--muted);font-size:1.15rem}.event-list{display:grid;gap:16px;padding-bottom:90px}.event-row{display:grid;grid-template-columns:92px 1fr;gap:28px;align-items:center;background:#fff;border:1px solid var(--line);padding:24px 28px}.date-sheet.large{width:80px}.date-sheet.large strong{font-size:2.2rem}.event-row h2{margin:2px 0 6px;font-family:Georgia,serif;font-weight:400;font-size:1.7rem}.event-row p{margin:0;color:var(--muted)}.event-row .meta{color:var(--green);font-size:.82rem;font-weight:750;text-transform:uppercase;letter-spacing:.08em}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;padding-bottom:100px}.tile{min-height:285px;padding:32px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column}.tile-icon{align-self:flex-start;padding:6px 9px;background:var(--sage);color:var(--green-dark);font-size:.68rem;font-weight:850;letter-spacing:.12em}.tile h2{font-size:1.75rem;margin:22px 0 8px}.tile p{color:var(--muted);margin:0}.status{margin-top:auto;padding-top:22px;color:#8b948f;font-size:.78rem;font-weight:700}.gallery-empty{min-height:360px;margin-bottom:100px;border:1px solid var(--line);background:linear-gradient(135deg,#fff,var(--sand));display:grid;place-items:center;align-content:center;text-align:center;padding:50px}.frame-mark{width:88px;height:88px;display:grid;place-items:center;border:1px solid var(--green);border-radius:50%;color:var(--green);font-family:Georgia,serif;font-size:1.35rem}.gallery-empty h2{font-size:2rem;margin:22px 0 5px}.gallery-empty p{color:var(--muted);margin:0}.prose{max-width:800px;margin-bottom:100px}.prose h2{font-size:2rem;margin:34px 0 8px}.prose p{color:var(--muted);font-size:1.08rem}.contact-box{margin-bottom:100px;padding:48px;background:#fff;border-left:5px solid var(--green);box-shadow:var(--shadow)}.contact-box a{font-family:Georgia,serif;font-size:clamp(1.8rem,5vw,3.8rem);text-decoration-thickness:1px;text-underline-offset:8px}.site-footer{background:var(--ink);color:#eef2ef;padding:45px 0}.footer-grid{display:flex;justify-content:space-between;gap:30px}.footer-grid>div{display:grid;gap:5px}.footer-grid span{color:#aeb9b4;font-size:.83rem}.footer-grid a{color:#fff}
.submit-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:34px;align-items:start;padding-bottom:100px}.event-form{padding:36px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow)}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.form-grid label{display:grid;gap:7px}.form-grid label.wide{grid-column:1/-1}.form-grid label span{font-size:.82rem;font-weight:750;color:var(--green-dark)}.form-grid input,.form-grid textarea{width:100%;border:1px solid #cbd4ce;background:#fbfcfb;padding:12px 13px;color:var(--ink);font:inherit;border-radius:0}.form-grid input:focus,.form-grid textarea:focus{outline:3px solid rgba(96,125,107,.16);border-color:var(--green)}.check{display:flex;gap:10px;align-items:flex-start;margin:24px 0 18px;color:var(--muted);font-size:.85rem}.check input{margin-top:4px}.submit-button{cursor:pointer;font:inherit}.form-help{margin:15px 0 0;color:var(--muted);font-size:.8rem}.form-aside{padding:30px;background:var(--sand);border-top:5px solid var(--green)}.form-aside ol{padding-left:21px;margin:18px 0 28px}.form-aside li{padding:5px 0}.form-aside a{font-weight:750;color:var(--green-dark);word-break:break-word}
@media(max-width:880px){.topbar{min-height:76px}.menu-button{display:block}nav{display:none;position:absolute;top:76px;left:0;right:0;padding:14px 20px 22px;background:var(--cream);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch}nav.open{display:flex}nav a{padding:11px 13px}.hero-grid{grid-template-columns:1fr;padding-block:55px}.hero{min-height:auto}.upcoming{max-width:620px}.intro{grid-template-columns:1fr;gap:15px}.intro>p{margin-top:0}.tiles{grid-template-columns:1fr}.submit-layout{grid-template-columns:1fr}.footer-grid{flex-direction:column}}
@media(max-width:520px){.wrap{width:min(100% - 26px,1180px)}.brand-name{font-size:1.5rem}.hero h1{font-size:3rem}.hero-grid{gap:38px}.upcoming{padding:24px 18px}.actions{display:grid}.button{text-align:center}.page-head{padding-top:58px}.event-row{grid-template-columns:70px 1fr;padding:18px 14px;gap:16px}.date-sheet.large{width:66px}.event-row h2{font-size:1.35rem}.contact-box{padding:30px 20px}.event-form{padding:24px 18px}.form-grid{grid-template-columns:1fr}.form-grid label.wide{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.scene-stage,.scene-stage::after,.hero-copy,.upcoming{animation:none;clip-path:none;opacity:1;transform:none}}
.scene-stage{aspect-ratio:1223/428;overflow:visible;background:transparent;box-shadow:none;clip-path:none;opacity:1;animation:none}.scene-stage::after{display:none}.scene-fallback,.scene-piece{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.scene-fallback{opacity:0;transform:none!important}.scene-piece{background:url('kio-silhouette.png') center/contain no-repeat;opacity:0;animation:piece-arrive 1.25s cubic-bezier(.2,.72,.25,1) forwards}.scene-piece-1{clip-path:polygon(0 0,31% 0,35% 100%,0 100%);--move:-90px;animation-delay:.05s}.scene-piece-2{clip-path:polygon(27% 0,55% 0,59% 100%,31% 100%);--move:-55px;animation-delay:.38s}.scene-piece-3{clip-path:polygon(51% 0,78% 0,82% 100%,55% 100%);--move:55px;animation-delay:.72s}.scene-piece-4{clip-path:polygon(74% 0,100% 0,100% 100%,78% 100%);--move:90px;animation-delay:1.05s}@keyframes piece-arrive{0%{opacity:0;transform:translateX(var(--move)) scale(.985)}65%{opacity:1}100%{opacity:1;transform:translateX(0) scale(1)}}.hero-copy{animation-delay:2.15s}.upcoming{animation-delay:2.35s}@media(prefers-reduced-motion:reduce){.scene-piece{display:none}.scene-fallback{opacity:1}.hero-copy,.upcoming{animation:none;opacity:1;transform:none}}
.scene-piece,.scene-object{display:none}.scene-fallback,.scene-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none}.scene-fallback{z-index:30;opacity:0;animation:scene-finish .25s linear 3.55s forwards}.scene-layer{opacity:0;animation:layer-arrive .95s cubic-bezier(.18,.7,.2,1) forwards;will-change:transform,opacity}.scene-landscape{--x:0;--y:24px;animation-delay:.05s}.scene-left-village{--x:-70px;--y:0;animation-delay:.45s}.scene-center-village{--x:65px;--y:0;animation-delay:.65s}.scene-trees{--x:-35px;--y:10px;animation-delay:.85s}.scene-left-church{--x:-105px;--y:0;animation-delay:1.05s}.scene-center-church{--x:0;--y:-55px;animation-delay:1.28s}.scene-right-church{--x:105px;--y:0;animation-delay:1.5s}.scene-fachwerk{--x:75px;--y:8px;animation-delay:1.72s}.scene-person-left{--x:-60px;--y:0;animation-delay:2.02s}.scene-people-middle{--x:45px;--y:0;animation-delay:2.22s}.scene-family-right{--x:70px;--y:0;animation-delay:2.42s}.scene-people-front{--x:-45px;--y:18px;animation-delay:2.62s}@keyframes layer-arrive{0%{opacity:0;transform:translate(var(--x),var(--y)) scale(.985)}55%{opacity:1}100%{opacity:1;transform:translate(0,0) scale(1)}}@keyframes scene-finish{to{opacity:1}}.hero-copy{animation-delay:3.35s}.upcoming{animation-delay:3.5s}.scene-seen .scene-layer{display:none}.scene-seen .scene-fallback{opacity:1;animation:none}.scene-already-seen .hero-copy,.scene-already-seen .upcoming{opacity:1;transform:none;animation:none}@media(prefers-reduced-motion:reduce){.scene-layer{display:none}.scene-fallback{opacity:1;animation:none}}
