/* Solms.Jetzt! – Startseite (Konzept C „Neo-Pop") */

@font-face{font-family:'Fredoka';font-weight:500;font-display:swap;src:url(../fonts/fredoka-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Fredoka';font-weight:600;font-display:swap;src:url(../fonts/fredoka-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Fredoka';font-weight:700;font-display:swap;src:url(../fonts/fredoka-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:400;font-display:swap;src:url(../fonts/manrope-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:500;font-display:swap;src:url(../fonts/manrope-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:600;font-display:swap;src:url(../fonts/manrope-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:700;font-display:swap;src:url(../fonts/manrope-latin-700-normal.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-weight:800;font-display:swap;src:url(../fonts/manrope-latin-800-normal.woff2) format('woff2')}

:root{
  --indigo:#1f4a6c; --berry:#a9124e; --grass:#9cbe46; --ink:#10202e; --night:#0b1520;
  --paper:#f7f4ec; --white:#fff; --muted:#52616e; --soft:#3a4a58; --line:#c9d7e3;
  --head:'Fredoka',system-ui,sans-serif;
  /* General Sans ist die CI-Schrift – sobald die Dateien in assets/fonts liegen, hier voranstellen */
  --body:'General Sans','Manrope',system-ui,sans-serif;
  --gutter:clamp(16px,3vw,32px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
html,body{overflow-x:hidden}@supports (overflow:clip){html,body{overflow-x:clip}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased}
img,video{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--grass);outline-offset:3px}
.wrap{max-width:1360px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;z-index:100;background:var(--white);padding:10px 14px;border:3px solid var(--ink)}
.skip:focus{left:8px}

/* Typo */
.h2{margin:0;font-family:var(--head);font-weight:700;font-size:clamp(40px,6vw,72px);line-height:.95;letter-spacing:-1px}
.tag{display:inline-block;padding:0 12px;transform:rotate(-2deg)}
.tag--berry{background:var(--berry);color:var(--white)}
.tag--indigo{background:var(--indigo);color:var(--white)}
.lead{margin:0;max-width:380px;font-size:16px;line-height:1.5;font-weight:600;color:var(--soft)}
.sec-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:40px}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:8px;cursor:pointer;text-decoration:none;font-family:var(--body);font-weight:800;font-size:16px;text-transform:uppercase;letter-spacing:.3px;padding:14px 20px;min-height:48px;border:3px solid var(--ink);box-shadow:6px 6px 0 var(--ink);transition:transform .12s ease,box-shadow .12s ease;background:var(--white);color:var(--ink)}
.btn:hover{transform:translate(4px,4px);box-shadow:2px 2px 0 var(--ink)}
.btn:active{transform:translate(6px,6px);box-shadow:0 0 0 var(--ink)}
.btn--berry{background:var(--berry);color:var(--white)}
.btn--indigo{background:var(--indigo);color:var(--white)}
.btn--white{background:var(--white);color:var(--indigo)}
.btn--sm{font-size:13px;padding:9px 14px;min-height:42px;box-shadow:4px 4px 0 var(--ink)}
.btn svg{flex:0 0 auto}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:var(--white);border-bottom:4px solid var(--ink)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:10px;padding-bottom:10px}
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-family:var(--head);font-weight:700;font-size:28px;letter-spacing:-.3px;white-space:nowrap}
.logo__s{width:42px;height:42px;border-radius:50%;background:var(--berry);color:var(--white);display:inline-flex;align-items:center;justify-content:center;font-size:21px;animation:roll .8s .1s cubic-bezier(.2,.9,.3,1) both}
.logo__a{color:var(--indigo)}
.logo__b{background:var(--berry);color:var(--white);border-radius:6px;padding:0 8px;margin-left:-4px}
.nav{display:flex;align-items:center;gap:22px;font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.4px}
.nav a{text-decoration:none;position:relative}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-4px;height:3px;background:var(--berry);transition:right .2s ease}
.nav a:hover::after{right:0}
.nav-toggle{display:none;width:48px;height:48px;border:3px solid var(--ink);background:var(--white);box-shadow:4px 4px 0 var(--ink);cursor:pointer;align-items:center;justify-content:center}
@media (max-width:980px){
  .nav-toggle{display:inline-flex}
  .nav{position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;background:var(--white);border-bottom:4px solid var(--ink);display:none}
  .nav.is-open{display:flex}
  .nav a{padding:16px var(--gutter);border-top:2px solid #e6e1d4}
  .nav a::after{display:none}
  .nav .btn{margin:14px var(--gutter) 18px;justify-content:center}
  .logo{font-size:23px}.logo__s{width:36px;height:36px;font-size:18px}
}

/* Hero */
.hero{background:var(--indigo);color:var(--white);border-bottom:4px solid var(--ink);position:relative}
.hero .wrap{display:flex;flex-wrap:wrap;gap:32px;align-items:center;padding-top:28px;padding-bottom:72px}
.hero__text{flex:999 1 600px;min-width:0}
.hero__word{font-family:var(--head);font-weight:700;line-height:.82;letter-spacing:-.03em;margin-left:-.04em}
.hero__solms{display:inline-block;font-size:clamp(84px,14vw,200px);animation:drop .7s cubic-bezier(.3,1.4,.5,1) both}
.hero__jetzt{display:inline-block;font-size:clamp(70px,12vw,170px);background:var(--berry);border:5px solid var(--ink);border-radius:14px;padding:0 .13em .05em;box-shadow:10px 10px 0 var(--ink);margin-top:10px;animation:snap .6s .45s cubic-bezier(.3,1.6,.5,1) both}
.hero h1{margin:44px 0 0;font-family:var(--head);font-weight:700;font-size:clamp(26px,3.4vw,46px);line-height:1.2;text-transform:uppercase}
.hero h1 span{display:inline-block;padding:0 10px;margin-bottom:8px;animation:word .55s cubic-bezier(.2,1.2,.4,1) both}
.hero h1 .w1{background:var(--white);color:var(--indigo);animation-delay:.9s}
.hero h1 .w2{background:var(--white);color:var(--indigo);animation-delay:1.05s}
.hero h1 .w3{background:var(--berry);animation-delay:1.2s}
.hero h1 .w4{border-bottom:6px solid var(--grass);padding:0 4px;animation-delay:1.35s}
.hero__cta{display:flex;flex-wrap:wrap;gap:18px;margin-top:28px}
.hero__media{flex:1 1 400px;display:flex;justify-content:center;align-items:center;min-height:500px}
.disc{position:relative;width:min(530px,84vw);aspect-ratio:1;animation:discIn 1.1s .15s cubic-bezier(.2,.9,.25,1.05) both;--sx:12px;--sy:12px}
.disc__video{position:absolute;inset:0;border-radius:50%;overflow:hidden;background:var(--berry);border:5px solid var(--ink);box-shadow:var(--sx) var(--sy) 0 var(--ink);cursor:pointer;padding:0;transition:box-shadow .15s ease-out}
.disc__video video{width:100%;height:100%;object-fit:cover;animation:fadeIn .6s 1s both}
.disc__play{position:absolute;left:50%;bottom:9%;transform:translateX(-50%);background:var(--white);color:var(--ink);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);padding:8px 14px;font-weight:800;font-size:14px;text-transform:uppercase;white-space:nowrap;display:inline-flex;gap:8px;align-items:center;z-index:2}
.disc__video:hover .disc__play,.disc__video:focus-visible .disc__play{animation:pulse .6s ease}
.sticker{position:absolute;border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:10px 16px;z-index:3}
.sticker--vote{right:-6%;top:4%;background:var(--berry);transform:scale(0) rotate(-30deg);animation:stickerPop .7s 1.3s cubic-bezier(.3,1.7,.5,1) forwards}
.disc:hover .sticker--vote{animation:stickerPop .7s 1.3s cubic-bezier(.3,1.7,.5,1) forwards,wiggle .5s ease}
.sticker__big{font-family:var(--head);font-weight:700;font-size:46px;line-height:1;font-variant-numeric:tabular-nums}
.sticker__small{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;margin-top:2px}
@keyframes discIn{0%{transform:translateX(70vw) rotate(300deg);opacity:0}70%{opacity:1}100%{transform:none}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes stickerPop{0%{transform:scale(0) rotate(-30deg)}60%{transform:scale(1.18) rotate(10deg)}100%{transform:scale(1) rotate(6deg)}}
@keyframes wiggle{0%,100%{rotate:0deg}25%{rotate:-6deg}75%{rotate:5deg}}
@keyframes pulse{0%,100%{transform:translateX(-50%) scale(1)}50%{transform:translateX(-50%) scale(1.12)}}
@media (max-width:700px){.hero__media{min-height:0;padding:30px 0 10px}.sticker__big{font-size:32px}.sticker--vote{right:-2%;top:-2%}.disc__play{font-size:12px}}

/* Marquee */
.marquee{background:var(--berry);color:var(--white);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);transform:rotate(-2deg);margin:-20px -40px 0;position:relative;z-index:3;overflow:hidden;white-space:nowrap;padding:14px 0}
.marquee__track{display:inline-flex;gap:36px;padding-left:36px;font-family:var(--head);font-weight:700;font-size:clamp(24px,3vw,34px);text-transform:uppercase;animation:marquee 26s linear infinite}

/* Anträge */
.antraege{padding:84px 0 56px}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:34px}
.card{position:relative;background:var(--white);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink);display:flex;flex-direction:column;transition:transform .25s cubic-bezier(.3,1.6,.5,1),box-shadow .2s ease}
.card:nth-child(3n+1){transform:rotate(-1.4deg)}
.card:nth-child(3n+2){transform:rotate(1deg);margin-top:18px}
.card:nth-child(3n+3){transform:rotate(-.6deg)}
.card:hover{transform:rotate(0) translateY(-6px)}
.card__img{position:relative}
.card__img img{width:100%;height:220px;object-fit:cover;border-bottom:4px solid var(--ink)}
.stamp{position:absolute;right:14px;bottom:-18px;background:var(--berry);color:var(--white);border:3px solid var(--ink);padding:6px 12px;font-weight:800;font-size:15px;letter-spacing:1.5px;display:inline-flex;align-items:center;gap:6px;transform:rotate(6deg)}
.reveal.is-in .stamp{animation:stamp .55s .25s cubic-bezier(.2,1.4,.4,1) both}
.card__body{padding:28px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.card__meta{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--indigo)}
.card h3{margin:0;font-family:var(--head);font-weight:700;font-size:27px;line-height:1.1}
.card p{margin:0;font-size:15px;line-height:1.5;font-weight:600;color:var(--soft)}
.card__date{font-size:13px;font-weight:700;color:var(--muted)}
.card__foot{margin-top:auto;padding-top:8px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.card__open{cursor:pointer;background:none;border:0;padding:0;font-weight:800;font-size:14px;text-transform:uppercase;color:var(--berry);border-bottom:2px solid var(--berry)}
.card__open::before{content:"";position:absolute;inset:0;z-index:1}
.card__wnz{position:relative;z-index:2;font-size:13px;font-weight:800;color:var(--indigo)}
.contact{position:relative;z-index:2;margin-top:6px;display:flex;align-items:center;gap:12px;border-top:3px dashed var(--ink);padding-top:14px}
.contact img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:top;border:3px solid var(--ink);flex:0 0 auto}
.contact__txt{flex:1;font-size:13px;line-height:1.35;font-weight:700}
.contact__txt span{color:var(--muted)}
.also{margin:44px 0 0;font-size:15px;font-weight:700;color:var(--soft);display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.also b{background:var(--indigo);color:var(--white);padding:4px 10px;font-size:12px;text-transform:uppercase;letter-spacing:.5px}

/* Bilanz */
.bilanz{background:var(--indigo);color:var(--white);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink)}
.bilanz .wrap{display:flex;flex-wrap:wrap;gap:48px;align-items:flex-start;padding-top:76px;padding-bottom:76px}
.bilanz__intro{flex:1 1 340px;min-width:0}
.daybox{margin-top:36px;display:inline-flex;align-items:baseline;gap:14px;background:var(--white);color:var(--indigo);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--berry);padding:14px 20px}
.daybox__n{font-family:var(--head);font-weight:700;font-size:76px;line-height:.9;font-variant-numeric:tabular-nums}
.daybox__l{font-weight:800;font-size:15px;line-height:1.3;text-transform:uppercase}
.daybox__l span{color:var(--berry)}
.bilanz__intro p{margin:26px 0 0;font-size:17px;line-height:1.55;font-weight:600;color:#dbe5ee;max-width:420px}
.areas{flex:2 1 620px;min-width:0;background:var(--white);color:var(--ink);border:4px solid var(--ink);box-shadow:8px 8px 0 var(--ink)}
.areas table{width:100%;border-collapse:collapse}
.areas th{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);text-align:left;padding:14px 12px 10px;border-bottom:3px solid var(--ink);white-space:nowrap}
.areas td{padding:14px 12px;border-bottom:2px solid #e6e1d4;vertical-align:middle}
.areas tr:last-child td{border-bottom:0}
.areas .n{font-family:var(--head);font-weight:700;font-size:28px;color:var(--berry);width:44px;text-align:center}
.areas .t{font-family:var(--head);font-weight:700;font-size:19px;line-height:1.2}
.areas .d{width:150px}
.areas .s{width:160px}
.areas .l{width:120px;text-align:right}
.dash{display:inline-block;width:22px;height:3px;background:#c7c1b2;vertical-align:middle}
.dots{display:inline-flex;gap:8px}
.dot{position:relative;width:26px;height:26px;border-radius:50%;background:var(--berry);border:3px solid var(--ink);padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transform:scale(0);transition:transform .35s cubic-bezier(.3,1.6,.5,1),background-color .2s ease}
.reveal.is-in .dot{transform:scale(1)}
.dot svg{width:14px;height:14px;opacity:0;transform:rotate(-90deg) scale(.4);transition:all .25s ease}
.dot:hover,.dot:focus-visible{transform:scale(1.18) rotate(360deg);transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.dot:hover svg,.dot:focus-visible svg{opacity:1;transform:none}
.dot__tip{position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) rotate(-2deg);background:var(--ink);color:var(--white);font-size:12px;font-weight:700;line-height:1.3;padding:6px 10px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s ease;z-index:5}
.dot:hover .dot__tip,.dot:focus-visible .dot__tip{opacity:1}
.dran{background:var(--berry);color:var(--white);border:2px solid var(--ink);padding:4px 10px;font-size:13px;font-weight:800;transform:rotate(-3deg);display:inline-block;white-space:nowrap}
.dran i{font-style:normal;display:inline-block;animation:dotty 1.2s infinite}
.dran i:nth-child(2){animation-delay:.2s}.dran i:nth-child(3){animation-delay:.4s}
.golink{font-size:14px;font-weight:800;color:var(--indigo);text-decoration:none;white-space:nowrap;border-bottom:2px solid var(--indigo)}
.golink span{display:inline-block;transition:transform .2s ease}
.golink:hover span{transform:translateX(5px)}
@media (max-width:760px){
  .areas thead{display:none}
  .areas tr{display:grid;grid-template-columns:40px 1fr auto;grid-template-areas:"n t l" "n d s";gap:6px 10px;padding:12px;border-bottom:2px solid #e6e1d4}
  .areas tr:last-child{border-bottom:0}
  .areas td{padding:0;border:0;width:auto!important}
  .areas .n{grid-area:n}.areas .t{grid-area:t;font-size:17px}.areas .d{grid-area:d}.areas .s{grid-area:s;text-align:right}.areas .l{grid-area:l}
}

/* Programm / Flipbook */
.programm{padding:76px 0 64px}
.flip{display:flex;flex-direction:column;gap:18px}
.flip__chapters{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chip{cursor:pointer;font-weight:800;font-size:13px;padding:8px 12px;min-height:38px;border:3px solid var(--ink);background:var(--white);box-shadow:3px 3px 0 var(--ink);transition:transform .12s ease}
.chip:hover{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.chip.is-active{background:var(--berry);color:var(--white)}
.book{position:relative;width:100%;max-width:1000px;margin:0 auto;aspect-ratio:1.414/1;perspective:2400px}
.book__spread{position:absolute;inset:0;display:flex;box-shadow:0 24px 50px rgba(16,32,46,.35);border:4px solid var(--ink);background:var(--white)}
.book__page{flex:1 1 50%;position:relative;background:var(--white)}
.book__page img{width:100%;height:100%;object-fit:contain}
.book__page--l::after{content:"";position:absolute;top:0;right:0;bottom:0;width:40px;background:linear-gradient(to left,rgba(0,0,0,.16),transparent)}
.book__page--r::after{content:"";position:absolute;top:0;left:0;bottom:0;width:40px;background:linear-gradient(to right,rgba(0,0,0,.12),transparent)}
.book__page.is-empty{background:transparent}
.book__spread.is-cover{background:transparent;border:0;box-shadow:none}
.book__spread.is-cover .book__page--r{border:4px solid var(--ink);box-shadow:0 24px 50px rgba(16,32,46,.35)}
.leaf{position:absolute;top:4px;bottom:4px;width:calc(50% - 4px);transform-style:preserve-3d;z-index:3}
.leaf img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--white);backface-visibility:hidden}
.leaf img+img{transform:rotateY(180deg)}
.leaf--next{left:50%;transform-origin:left center;animation:flipNext .7s cubic-bezier(.45,.05,.3,1) forwards}
.leaf--prev{left:4px;transform-origin:right center;animation:flipPrev .7s cubic-bezier(.45,.05,.3,1) forwards}
.flip__nav{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px}
.flip__label{font-weight:800;font-size:14px;min-width:170px;text-align:center}
@media (max-width:640px){.book{aspect-ratio:.707/1;max-width:420px}.book__page--l{display:none}.book__spread.is-cover .book__page--r,.book__page--r{flex-basis:100%}.leaf{display:none}}

/* Team */
.team{background:var(--night);color:var(--white);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink)}
.team .wrap{padding-top:76px;padding-bottom:76px}
.filters{display:flex;flex-wrap:wrap;gap:10px}
.filter{cursor:pointer;font-weight:800;font-size:13px;padding:10px 14px;min-height:44px;border:3px solid var(--white);background:transparent;color:var(--white);box-shadow:4px 4px 0 var(--berry);transition:transform .12s ease}
.filter:hover{transform:translate(2px,2px)}
.filter.is-active{background:var(--berry);border-color:var(--berry);box-shadow:4px 4px 0 var(--white)}
.group-title{display:flex;align-items:center;gap:14px;margin:0 0 18px}
.group-title b{padding:6px 14px;font-family:var(--head);font-weight:700;font-size:24px}
.group-title span{font-weight:800;font-size:14px;text-transform:uppercase;color:#9fb3c6}
.people{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:22px;margin-bottom:56px}
.people--big{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}
.person{border:3px solid var(--white);background:var(--night);transition:transform .25s cubic-bezier(.3,1.6,.5,1),opacity .3s ease;box-shadow:6px 6px 0 var(--berry)}
.person:nth-child(odd){transform:rotate(-1deg)}.person:nth-child(even){transform:rotate(.8deg)}
.person:hover{transform:rotate(0) translateY(-6px)}
.person.is-dim{opacity:.22}
.person__img{position:relative;aspect-ratio:4/5;background:#000;overflow:hidden}
.person__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;filter:grayscale(.15)}
.person:hover .person__img img{transform:scale(1.05);filter:none}
.badge{position:absolute;padding:4px 10px;font-weight:800;font-size:12px;text-transform:uppercase}
.badge--first{top:12px;right:-4px;background:var(--berry);border:3px solid var(--white);transform:rotate(5deg);font-size:13px}
.badge--lead{top:10px;left:-4px;background:var(--white);color:var(--berry);border:3px solid var(--berry);transform:rotate(-4deg)}
.person__info{padding:12px 14px 14px}
.person__name{font-family:var(--head);font-weight:700;font-size:20px;line-height:1.15}
.person__role{font-size:12px;font-weight:800;margin-top:4px}
.person__aus{font-size:12px;font-weight:700;color:#9fb3c6;margin-top:2px}
.duo{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:22px;margin-bottom:52px}
.duo__p{display:flex;gap:16px;align-items:center;border:3px solid var(--white);padding:12px;box-shadow:6px 6px 0 var(--berry)}
.duo__p img{width:96px;height:120px;object-fit:cover;flex:0 0 auto}
.schied{border-top:1px solid #2b3d52;padding-top:22px;display:flex;flex-wrap:wrap;align-items:center;gap:18px 28px}
.schied__txt{font-size:13px;line-height:1.5;color:#9fb3c6;max-width:380px}
.schied__txt strong{color:var(--white)}
.schied__p{display:flex;align-items:center;gap:10px;font-size:13px;line-height:1.35;color:#c9d7e3}
.schied__p strong{color:var(--white)}
.schied__p img,.schied__ph{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:top;background:var(--indigo)}
.schied__ph{display:inline-flex;align-items:flex-end;justify-content:center;overflow:hidden}

/* Instagram */
.insta{padding:76px 0 64px;overflow:hidden}
.reel-strip{margin-top:36px;overflow:hidden;padding:20px 0 30px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.reel-track{display:flex;gap:34px;width:max-content;animation:marquee 60s linear infinite;padding-left:34px}
.reel-strip:hover .reel-track,.reel-track.is-paused{animation-play-state:paused}
.reel{margin:0;display:flex;flex-direction:column;align-items:center;gap:18px;flex:0 0 auto}
.phone{position:relative;width:200px;aspect-ratio:9/16;border-radius:28px;background:var(--ink);padding:8px;border:3px solid var(--ink);box-shadow:8px 8px 0 var(--berry);transition:transform .35s cubic-bezier(.3,1.5,.5,1);cursor:pointer}
.reel:nth-child(odd) .phone{transform:rotate(-4deg)}
.reel:nth-child(even) .phone{transform:rotate(3deg) translateY(14px)}
.reel:hover .phone,.reel.is-playing .phone{transform:rotate(0) translateY(-8px) scale(1.04)}
.phone video{width:100%;height:100%;object-fit:cover;border-radius:20px}
.phone__sound{position:absolute;right:14px;top:14px;width:34px;height:34px;border-radius:50%;background:var(--white);border:2px solid var(--ink);display:flex;align-items:center;justify-content:center}
.reel figcaption{background:var(--white);color:var(--indigo);border:3px solid var(--ink);padding:6px 12px;font-family:var(--head);font-weight:700;font-size:16px;text-align:center;max-width:220px;box-shadow:4px 4px 0 var(--ink)}
@media (hover:none){.reel-track{animation:none}.reel-strip{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-mask-image:none;mask-image:none}.reel{scroll-snap-align:center}}

/* Presse */
.presse{background:var(--white);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink)}
.presse .wrap{padding-top:76px;padding-bottom:76px}
.pm-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px;margin-bottom:60px}
.pm{cursor:pointer;text-align:left;padding:0;background:var(--paper);border:3px solid var(--ink);box-shadow:7px 7px 0 var(--ink);display:flex;flex-direction:column;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.pm:nth-child(odd){transform:rotate(-1deg)}.pm:nth-child(even){transform:rotate(1deg)}
.pm:hover{transform:rotate(0) translateY(-6px)}
.pm img{width:100%;height:200px;object-fit:cover;border-bottom:3px solid var(--ink)}
@media (min-width:761px){.pm img[src$="neujahr-gruppe.jpg"]{object-position:center 15%}}
.pm__b{padding:18px 18px 22px;display:flex;flex-direction:column;gap:8px}
.pm__date{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.8px;color:var(--berry)}
.pm__title{font-family:var(--head);font-weight:700;font-size:22px;line-height:1.15}
.pm__teaser{font-size:14px;line-height:1.5;font-weight:600;color:var(--soft)}
.pm__more{font-weight:800;font-size:14px;text-transform:uppercase;color:var(--indigo);border-bottom:2px solid var(--indigo);align-self:flex-start}
.echo{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.echo__side{flex:0 0 240px}
.echo__side h3{margin:0;font-family:var(--head);font-weight:700;font-size:30px;color:var(--indigo)}
.echo__side p{margin:6px 0 0;font-size:13px;line-height:1.5;color:var(--muted);font-weight:600}
.echo__list{flex:1 1 520px;min-width:0}
.echo__item{text-decoration:none;display:flex;align-items:center;gap:14px;padding:15px 0;border-top:2px solid var(--ink);transition:padding .2s ease,background-color .2s ease}
.echo__item:hover{padding-left:10px;background:var(--paper)}
.echo__item[hidden]{display:none}
.echo__item.is-new{animation:pop .3s ease both}
.wnz{background:var(--indigo);color:var(--white);font-size:11px;font-weight:800;padding:3px 7px;letter-spacing:.5px;flex:0 0 auto}
.echo__t{flex:1;min-width:0;font-family:var(--head);font-weight:700;font-size:19px;line-height:1.2}
.echo__src{display:block;font-family:var(--body);font-size:13px;font-weight:600;color:var(--muted);margin-top:2px}
.echo__arrow{font-weight:800;color:var(--berry);transition:transform .2s ease}
.echo__item:hover .echo__arrow{transform:translateX(5px)}
.echo__more{margin-top:18px}

/* Ausblick */
.ausblick{padding:76px 0 70px}
.dates{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:26px}
.date{position:relative;background:var(--white);border:4px solid var(--ink);box-shadow:7px 7px 0 var(--ink);display:flex;flex-direction:column}
.date:nth-child(odd){transform:rotate(-1deg)}.date:nth-child(even){transform:rotate(.8deg)}
.date__top{background:var(--indigo);color:var(--white);padding:8px 14px;font-weight:800;font-size:13px;text-transform:uppercase;letter-spacing:.6px;border-bottom:4px solid var(--ink);display:flex;justify-content:space-between;gap:8px}
.date--own .date__top{background:var(--berry)}
.date__day{font-family:var(--head);font-weight:700;font-size:64px;line-height:.9;padding:16px 14px 0;color:var(--indigo)}
.date__day small{font-size:22px;margin-left:6px;color:var(--ink)}
.date__body{padding:8px 14px 16px;display:flex;flex-direction:column;gap:4px;flex:1}
.date__gremium{font-family:var(--head);font-weight:700;font-size:19px;line-height:1.2}
.date__meta{font-size:13px;font-weight:700;color:var(--muted)}
.countdown{position:absolute;top:-16px;right:-10px;background:var(--grass);color:var(--ink);border:3px solid var(--ink);padding:4px 10px;font-weight:800;font-size:13px;text-transform:uppercase;transform:rotate(6deg);animation:wobble 2.4s ease-in-out infinite}
.reveal.is-in .date{animation:flipIn .6s cubic-bezier(.3,1.3,.5,1) both}
.reveal.is-in .date:nth-child(2){animation-delay:.1s}.reveal.is-in .date:nth-child(3){animation-delay:.2s}.reveal.is-in .date:nth-child(4){animation-delay:.3s}
.ausblick__foot{margin-top:34px;display:flex;flex-wrap:wrap;gap:16px 26px;align-items:center;font-weight:700;color:var(--soft)}

/* Mitmachen */
.mitmachen{background:var(--berry);color:var(--white);border-top:4px solid var(--ink)}
.mitmachen .wrap{display:flex;flex-wrap:wrap;gap:36px;align-items:center;justify-content:space-between;padding-top:68px;padding-bottom:68px}
.mitmachen h2{margin:0;font-family:var(--head);font-weight:700;font-size:clamp(52px,7vw,84px);line-height:.92}
.mitmachen h2 span{border-bottom:8px solid var(--grass)}
.mitmachen p{margin:20px 0 0;font-size:18px;line-height:1.5;font-weight:600;color:#fbe3ec;max-width:520px}
.mitmachen__cta{flex:1 1 320px;display:flex;flex-direction:column;gap:16px}
.mitmachen__cta .btn{font-size:18px;justify-content:space-between}
.first{font-size:14px;font-weight:800;display:flex;align-items:center;gap:8px}
.first::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--grass)}

/* Footer */
.site-footer{background:var(--ink);color:#c9d7e3}
.footer__wrap{padding-top:56px;padding-bottom:28px;display:flex;flex-direction:column;align-items:center;gap:26px}
.hover-word{display:block;width:min(720px,100%);height:auto;cursor:crosshair;user-select:none}
.hover-word text{font-family:var(--head);font-weight:700;font-size:64px}
.hw-base{fill:transparent;stroke:#2b3d52;stroke-width:.8}
.hw-draw{fill:transparent;stroke:#4a6680;stroke-width:.7;stroke-dasharray:1200;stroke-dashoffset:1200}
.hover-word.is-drawn .hw-draw{animation:draw 4s ease-in-out forwards}
.hw-color{fill:transparent;stroke-width:1.6}
@keyframes draw{to{stroke-dashoffset:0}}
.footer__line{width:100%;display:flex;flex-wrap:wrap;gap:12px 24px;align-items:center;justify-content:center;border-top:1px solid #22344a;padding-top:20px;font-size:14px;font-weight:700}
.footer__line nav{display:flex;flex-wrap:wrap;gap:20px}
.site-footer a{color:#c9d7e3}

/* Modal */
.modal{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;padding:20px}
.modal[hidden]{display:none}
.modal__bg{position:absolute;inset:0;background:rgba(11,21,32,.82);border:0;cursor:pointer}
.modal__box{position:relative;width:100%;max-width:760px;max-height:90vh;overflow-y:auto;background:var(--white);border:4px solid var(--ink);box-shadow:12px 12px 0 var(--berry);animation:pop .25s cubic-bezier(.3,1.5,.5,1) both}
.modal__box--video{max-width:480px;background:var(--ink)}
.modal__box--video video{width:100%;max-height:80vh}
.modal__x{position:sticky;top:10px;float:right;margin:10px;z-index:3;width:46px;height:46px;border-radius:50%;background:var(--ink);color:var(--white);border:3px solid var(--white);font-size:24px;line-height:1;cursor:pointer}
.doc{padding:30px 34px 36px}
.doc__kicker{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}
.pill{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;padding:4px 10px;border:2px solid var(--ink)}
.pill--ok{background:var(--berry);color:var(--white);display:inline-flex;align-items:center;gap:5px}
.pill--soft{background:var(--paper)}
.doc h2{margin:0 0 6px;font-family:var(--head);font-weight:700;font-size:clamp(26px,3.6vw,36px);line-height:1.1;color:var(--indigo)}
.doc__sub{margin:0 0 22px;font-size:14px;font-weight:700;color:var(--muted)}
.doc h3{margin:26px 0 10px;font-family:var(--head);font-weight:700;font-size:21px;color:var(--ink);display:flex;align-items:center;gap:10px}
.doc h3::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--berry)}
.doc p{margin:0 0 14px;font-size:16px;line-height:1.7;color:#23323f}
.doc ol,.doc ul{margin:0 0 14px;padding-left:22px;font-size:16px;line-height:1.65;color:#23323f}
.doc li{margin-bottom:8px}
.doc li::marker{color:var(--berry);font-weight:800}
.doc blockquote{margin:12px 0 22px;padding:4px 0 4px 18px;border-left:6px solid var(--berry);font-family:var(--head);font-weight:700;font-size:24px;line-height:1.25;color:var(--indigo)}
.doc__sign{margin-top:24px;padding-top:16px;border-top:3px dashed var(--ink);font-size:14px;font-weight:700;color:var(--muted)}
.doc__sign strong{color:var(--ink)}
.doc__link{display:inline-block;margin-top:12px;font-weight:800;color:var(--indigo)}
.gallery{position:relative;background:var(--ink)}
.gallery img{width:100%;max-height:460px;object-fit:contain}
.gallery__btn{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;background:var(--white);border:3px solid var(--ink);font-size:22px;font-weight:800;cursor:pointer}
.gallery__btn--p{left:12px}.gallery__btn--n{right:12px}
.gallery__cap{padding:8px 34px 0;font-size:12px;color:var(--muted)}
.form{display:flex;flex-direction:column;gap:16px}
.form label{font-weight:700;font-size:14px;display:block}
.input{width:100%;margin-top:6px;font:600 16px var(--body);padding:12px 14px;border:3px solid var(--ink);background:var(--white);color:var(--ink)}
textarea.input{resize:vertical;min-height:130px}
.form__row{display:flex;flex-wrap:wrap;gap:16px}.form__row>label{flex:1 1 200px}
.check{display:flex!important;gap:10px;align-items:flex-start;font-size:13px!important;line-height:1.5;font-weight:600!important}
.check input{width:22px;height:22px;margin:0;flex:0 0 auto;accent-color:var(--berry)}
.hp{position:absolute;left:-5000px}
.form__msg{font-weight:700;font-size:14px;color:var(--berry)}
.thanks{text-align:center;padding:30px 10px}
.thanks b{display:block;font-family:var(--head);font-size:48px;color:var(--berry)}

/* Reveal on scroll */
.reveal>*{opacity:0;transform:translateY(34px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.9,.3,1)}
.reveal.is-in>*{opacity:1;transform:none}
.reveal.is-in>*:nth-child(2){transition-delay:.08s}.reveal.is-in>*:nth-child(3){transition-delay:.16s}.reveal.is-in>*:nth-child(4){transition-delay:.24s}
.no-js .reveal>*{opacity:1;transform:none}

/* Keyframes */
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes drop{0%{transform:translateY(-120%);opacity:0}70%{transform:translateY(6%);opacity:1}100%{transform:translateY(0)}}
@keyframes snap{0%{transform:scale(0) rotate(-20deg)}60%{transform:scale(1.15) rotate(-9deg)}100%{transform:scale(1) rotate(-6deg)}}
@keyframes roll{0%{transform:translateX(-300px) rotate(-360deg)}100%{transform:none}}
@keyframes word{0%{transform:translateY(40px) rotate(6deg);opacity:0}100%{transform:none;opacity:1}}
@keyframes stamp{0%{transform:scale(2.4) rotate(14deg);opacity:0}60%{transform:scale(.92) rotate(5deg);opacity:1}80%{transform:scale(1.05) rotate(7deg)}100%{transform:scale(1) rotate(6deg)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes dotty{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
@keyframes pop{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}}
@keyframes flipNext{from{transform:rotateY(0)}to{transform:rotateY(-180deg)}}
@keyframes flipPrev{from{transform:rotateY(0)}to{transform:rotateY(180deg)}}
@keyframes flipIn{0%{transform:rotateX(-80deg);opacity:0}100%{opacity:1}}
@keyframes wobble{0%,100%{transform:rotate(6deg)}50%{transform:rotate(-2deg)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .reveal>*{opacity:1;transform:none}
  .reel-track{animation:none}
  html{scroll-behavior:auto}
}

/* Handy: Team zweispaltig */
@media (max-width:640px){
  .people,.people--big{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
  .person__name{font-size:16px}
  .person__info{padding:10px}
  .badge--first,.badge--lead{font-size:10px;padding:3px 6px}
  .duo{grid-template-columns:1fr}
}

/* Kreis-Porträts (eigener enger Ausschnitt) */
.contact img{width:64px;height:64px}
.schied__p img,.schied__ph{width:64px;height:64px}

/* Instagram-Beiträge im Handy */
.phone--post{background:#fff;padding:8px}
.ig{position:relative;width:100%;height:100%;border-radius:20px;overflow:hidden;background:#fff;display:flex;flex-direction:column;text-align:left;color:var(--ink)}
.ig__top{display:flex;align-items:center;gap:7px;padding:10px 10px 8px;font-size:11px;font-weight:800}
.ig__av{width:24px;height:24px;border-radius:50%;background:var(--berry);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-family:var(--head);font-size:11px;flex:0 0 auto;box-shadow:0 0 0 2px #fff,0 0 0 3.5px #c13584}
.ig__img{position:relative;aspect-ratio:4/5;overflow:hidden;background:#eee}
.ig__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .8s ease}
.ig__img img.is-on{opacity:1}
.ig__stack{position:absolute;top:8px;right:8px;z-index:2;width:18px;height:18px}
.ig__dots{display:flex;gap:3px;justify-content:center;padding:6px 0 2px}
.ig__dots i{width:5px;height:5px;border-radius:50%;background:#c9d0d6}
.ig__dots i.is-on{background:#3897f0}
.ig__icons{display:flex;gap:10px;padding:4px 10px 2px}
.ig__icons svg{width:17px;height:17px}
.ig__cap{padding:2px 10px 10px;font-size:10.5px;line-height:1.35;font-weight:600;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.ig__cap b{font-weight:800}
.post-modal{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);background:var(--white)}
.post-modal .gallery{display:flex;align-items:center;background:#000}
.post-modal .gallery img{max-height:80vh;width:100%;object-fit:contain}
.post-modal__txt{padding:26px 26px 28px;max-height:80vh;overflow-y:auto}
.post-modal__txt .ig__top{padding:0 0 14px;font-size:14px}
.post-modal__txt .ig__av{width:34px;height:34px;font-size:15px}
.caption{white-space:pre-line;font-size:15px;line-height:1.6;color:#23323f;margin:0 0 20px}
.caption a{color:var(--indigo);font-weight:700}
.post-modal__btns{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.post-modal__more{margin-top:18px;padding-top:14px;border-top:3px dashed var(--ink);font-size:14px;font-weight:700;display:flex;flex-direction:column;gap:6px}
.post-modal__more b{font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.post-modal__more button,.post-modal__more a{background:none;border:0;padding:0;cursor:pointer;text-align:left;font:800 14px var(--body);color:var(--berry);text-decoration:underline}
@media (max-width:760px){.post-modal{grid-template-columns:1fr}.post-modal .gallery img{max-height:55vh}.post-modal__txt{max-height:none}}

/* Game */
.game{background:#5fb4ff;background:linear-gradient(#6ec3ff 0%,#a9dcff 62%,#7cc35a 62%,#7cc35a 70%,#b56a3b 70%);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink);position:relative;overflow:hidden}
.game::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(0,0,0,.06) 2px,transparent 2px),linear-gradient(90deg,rgba(0,0,0,.06) 2px,transparent 2px);background-size:32px 32px;background-position:0 70%;pointer-events:none}
.game__wrap{position:relative;display:flex;flex-wrap:wrap;gap:48px;align-items:center;justify-content:center;padding-top:70px;padding-bottom:70px}
.game__media{position:relative;flex:0 0 auto}
.phone--game{transform:rotate(-4deg);width:220px}
.phone--game:hover{transform:rotate(0) translateY(-8px) scale(1.04)}
.coins{position:absolute;left:-30px;top:-14px;background:var(--ink);color:#ffd84a;border:3px solid #fff;padding:6px 12px;font:700 20px/1 var(--head);display:flex;align-items:center;gap:8px;transform:rotate(-6deg);image-rendering:pixelated}
.coin{width:18px;height:18px;border-radius:50%;background:#ffd84a;border:3px solid #c68a00;animation:coinSpin 1s steps(4) infinite}
@keyframes coinSpin{0%,100%{transform:scaleX(1)}50%{transform:scaleX(.2)}}
.game__text{flex:1 1 420px;max-width:600px}
.game__kicker{margin:0 0 10px;display:inline-block;background:var(--ink);color:#fff;font-weight:800;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;padding:5px 10px}
.game__title{margin:0;font-family:'Courier New',ui-monospace,monospace;font-weight:900;text-transform:uppercase;line-height:1;letter-spacing:-1px}
.game__title span{display:block;color:#ffd84a;font-size:clamp(40px,6vw,72px);text-shadow:4px 4px 0 #c0392b,8px 8px 0 var(--ink)}
.game__title span+span{color:#fff;font-size:clamp(30px,4.4vw,50px);text-shadow:4px 4px 0 var(--ink);margin-top:6px}
.game__lead{margin:22px 0 0;font-size:18px;line-height:1.5;font-weight:700;color:var(--ink);background:rgba(255,255,255,.85);border:3px solid var(--ink);padding:12px 16px;box-shadow:5px 5px 0 var(--ink)}
.qblocks{display:flex;gap:10px;margin:22px 0}
.qblocks span{width:46px;height:46px;background:var(--berry);color:#fff;border:3px solid var(--ink);box-shadow:inset -4px -4px 0 rgba(0,0,0,.25),inset 4px 4px 0 rgba(255,255,255,.25);display:flex;align-items:center;justify-content:center;font:700 18px var(--head)}
.reveal-game.is-in .qblocks span{animation:bump .5s cubic-bezier(.3,1.6,.5,1) both}
.reveal-game.is-in .qblocks span:nth-child(2){animation-delay:.15s}.reveal-game.is-in .qblocks span:nth-child(3){animation-delay:.3s}
.qblocks span:hover{animation:bump .4s cubic-bezier(.3,1.6,.5,1)}
@keyframes bump{0%,100%{transform:none}40%{transform:translateY(-16px)}}
.game__btn{font-size:18px}
.game__ctrl{margin:12px 0 0;font-size:13px;font-weight:800;color:var(--ink)}
.modal__box--game{max-width:min(980px,96vw);background:var(--ink);border:6px solid #ffd84a;box-shadow:12px 12px 0 #c0392b}
.game-frame{display:block;width:100%;height:min(78vh,720px);border:0;background:#000}
.game-bar{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:space-between;padding:10px 16px;color:#fff;font:700 14px var(--body)}
.game-bar a{color:#ffd84a}

/* ===== Version 3 ===== */
@font-face{font-family:'Caveat';font-weight:700;font-display:swap;src:url(../fonts/caveat-latin-700-normal.woff2) format('woff2')}

/* Hero: feste zwei Spalten ab Tablet */
@media (min-width:760px){
  .hero .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,56px);align-items:center;flex-wrap:nowrap}
  .hero__media{min-height:0;padding:20px 0}
  .disc{width:clamp(300px,35vw,580px)}
  .hero__solms{font-size:clamp(70px,10.5vw,200px)}
  .hero__jetzt{font-size:clamp(58px,9vw,170px)}
  .hero h1{font-size:clamp(22px,2.9vw,46px)}
}

/* Kalender: lange Wörter trennen */
.date__gremium{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:anywhere}

/* Footer: eine Zeile */
.footer__wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px 32px;padding-top:34px;padding-bottom:34px}
.hover-word{width:min(540px,52vw)}
.foot-link{font-weight:800;font-size:14px;text-transform:uppercase;letter-spacing:.5px;color:#c9d7e3}
.foot-link--l{justify-self:start;display:inline-flex;align-items:center;gap:8px;text-decoration:none}
.foot-link--r{justify-self:end;display:flex;gap:22px}
.foot-link a,.foot-link--l{text-decoration:none}
.foot-link a:hover,.foot-link--l:hover{color:#fff;text-decoration:underline}
@media (max-width:760px){
  .footer__wrap{grid-template-columns:1fr 1fr;justify-items:center}
  .hover-word{grid-column:1/-1;grid-row:1;width:100%}
  .foot-link--l{justify-self:center}.foot-link--r{justify-self:center}
}

/* Team: Sofortbild-Wand auf hellem Indigo */
.team{background-color:#e3ecf4;background-image:linear-gradient(rgba(31,74,108,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(31,74,108,.07) 1px,transparent 1px);background-size:24px 24px;color:var(--ink);border-top:4px solid var(--ink);border-bottom:4px solid var(--ink)}
.team .wrap{padding-top:72px;padding-bottom:64px}
.team .group-title{margin:6px 0 22px}
.team .group-title b{background:var(--indigo);color:#fff;padding:5px 12px;font-family:var(--head);font-size:22px}
.team .group-title span{color:var(--indigo)}
.filter{border-color:var(--ink);color:var(--ink);background:#fff;box-shadow:4px 4px 0 var(--ink)}
.filter.is-active{background:var(--berry);border-color:var(--ink);color:#fff;box-shadow:4px 4px 0 var(--ink)}
.wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(172px,1fr));gap:26px 20px;margin-bottom:46px}
.wall--big{grid-template-columns:repeat(3,minmax(0,220px));gap:30px;justify-content:start}
.pola{position:relative;perspective:900px;transition:opacity .35s ease,transform .35s ease}
.pola__inner{position:relative;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,1.3,.5,1);transform:rotate(var(--r,-2deg))}
.pola:hover .pola__inner,.pola:focus-within .pola__inner{transform:rotate(0) rotateY(180deg)}
.pola__face,.pola__back{background:#fff;padding:9px 9px 0;box-shadow:0 2px 0 rgba(16,32,46,.15),6px 8px 0 rgba(16,32,46,.12);backface-visibility:hidden;-webkit-backface-visibility:hidden}
.pola__face img{width:100%;aspect-ratio:4/5;object-fit:cover;display:block;background:#111}
.pola__cap{padding:8px 4px 12px;text-align:center}
.pola__name{font-family:'Caveat',cursive;font-weight:700;font-size:24px;line-height:1.05;color:var(--ink)}
.wall--big .pola__name{font-size:28px}
.pola__role{font-family:'Caveat',cursive;font-weight:700;font-size:18px;line-height:1.1;color:var(--berry);margin-top:2px}
.pola__back{position:absolute;inset:0;transform:rotateY(180deg);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px;gap:10px}
.pola__back small{font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted)}
.pola__back strong{font-family:'Caveat',cursive;font-size:26px;line-height:1.1;color:var(--indigo)}
.pola__tape{position:absolute;top:-12px;left:50%;width:64px;height:22px;transform:translateX(-50%) rotate(-3deg);background:rgba(156,190,70,.55);z-index:3;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.pola__badge{position:absolute;z-index:4;top:16px;right:-10px;background:var(--berry);color:#fff;border:3px solid var(--ink);padding:3px 9px;font-weight:800;font-size:12px;text-transform:uppercase;transform:rotate(7deg);box-shadow:3px 3px 0 var(--ink)}
.pola.is-dim{opacity:.3;transform:rotate(6deg) translateY(6px)}
.wall__hint{margin:-24px 0 34px;font-family:'Caveat',cursive;font-size:22px;color:var(--indigo)}
.crew{display:flex;flex-wrap:wrap;gap:16px 34px;align-items:center;border-top:3px dashed rgba(31,74,108,.35);padding-top:24px}
.crew__p{display:flex;align-items:center;gap:12px;font-size:13px;line-height:1.35;color:var(--soft)}
.crew__p img,.crew__ph{width:60px;height:60px;border-radius:50%;object-fit:cover;border:3px solid #fff;box-shadow:3px 3px 0 var(--ink);background:var(--indigo);flex:0 0 auto}
.crew__p strong{color:var(--ink);font-size:14px}
.crew__sep{width:2px;height:44px;background:rgba(31,74,108,.25)}
.crew__note{flex-basis:100%;font-size:12px;color:var(--muted)}
@media (max-width:640px){.wall{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px 16px}.wall--big{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.wall--big .pola__name{font-size:20px}.pola__role{font-size:15px}.pola__name{font-size:21px}.crew__sep{display:none}}
@media (prefers-reduced-motion:reduce){.pola__inner{transform:none}.pola:hover .pola__inner{transform:none}.pola__back{display:none}}
.crew{display:flex;flex-wrap:wrap;gap:24px 56px;align-items:flex-start}
.crew__grp{display:flex;flex-direction:column;gap:14px}
.crew__h{font-family:var(--head);font-weight:700;font-size:18px;color:var(--indigo)}
.crew__row{display:flex;flex-wrap:wrap;gap:16px 30px}
