/* ============================================================
   ShimmerGates — Components
   ============================================================ */

/* ── HERO ── */
.hero{position:relative;min-height:100vh;min-height:100dvh;display:flex;align-items:center;justify-content:center;overflow:hidden;background:rgba(6,6,8,.1)}
.hero__media{position:absolute;inset:0;z-index:0}
.hero__media img,.hero__media video{width:100%;height:100%;object-fit:cover;opacity:.35;filter:grayscale(40%) contrast(1.1)}
.hero__overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,6,8,.3) 0%,rgba(6,6,8,.7) 60%,var(--abyss) 100%);z-index:1}
.hero__content{position:relative;z-index:2;text-align:center;padding:var(--space-xl) var(--space-md);max-width:900px}
.hero__logo{width:clamp(210px,29vw,330px);aspect-ratio:1;height:auto;margin:0 auto var(--space-lg);position:relative;isolation:isolate;animation:hero-logo-float 5s ease-in-out infinite}
.hero__logo::before{content:"";position:absolute;inset:0;z-index:2;background:url('../images/shimmergates-logo-v2.png') center/contain no-repeat;filter:drop-shadow(0 0 16px rgba(133,55,205,.5)) drop-shadow(0 0 42px rgba(82,25,133,.35))}
.hero__logo::after{content:"";position:absolute;inset:-23%;z-index:0;border-radius:50%;background:radial-gradient(circle,rgba(196,76,255,.34) 0,rgba(111,34,195,.2) 38%,transparent 70%);filter:blur(15px) saturate(1.3);animation:hero-flame-aura 2.7s ease-in-out infinite alternate}
.hero__flames{position:absolute;inset:0;z-index:1;pointer-events:none;transform:scale(.96)}
.hero__flames i{position:absolute;left:var(--x);top:var(--y);width:var(--w);height:var(--h);background:linear-gradient(0deg,rgba(88,19,153,.06) 0%,rgba(154,43,232,.95) 30%,rgba(232,137,255,.92) 56%,rgba(175,61,242,.28) 80%,transparent 100%);clip-path:polygon(50% 0,70% 28%,84% 64%,68% 100%,32% 100%,16% 64%,30% 28%);filter:blur(2px) drop-shadow(0 0 8px rgba(190,71,255,.88));mix-blend-mode:screen;transform-origin:50% 62%;animation:hero-flame-tongue var(--speed) ease-in-out var(--delay) infinite alternate}
@keyframes hero-logo-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes hero-flame-aura{0%{opacity:.62;transform:scale(.94)}100%{opacity:1;transform:scale(1.08)}}
@keyframes hero-flame-tongue{0%{opacity:.42;transform:translate(-50%,-50%) rotate(calc(var(--r) - 4deg)) scaleX(.72) scaleY(.82)}55%{opacity:.95;transform:translate(-50%,-50%) rotate(calc(var(--r) + 4deg)) scaleX(1.08) scaleY(1.12)}100%{opacity:.64;transform:translate(-50%,-50%) rotate(calc(var(--r) - 2deg)) scaleX(.88) scaleY(1.28)}}
@media(prefers-reduced-motion:reduce){.hero__logo,.hero__logo::before,.hero__logo::after,.hero__flames i{animation:none}}
.hero__title{font-family:var(--font-display);font-size:clamp(2.2rem,6vw,4.5rem);color:var(--light);line-height:1.1;margin-bottom:var(--space-sm);letter-spacing:.03em;text-shadow:0 4px 30px rgba(0,0,0,.6)}
.hero__subtitle{font-size:clamp(1rem,2.5vw,1.35rem);color:var(--mist);margin-bottom:var(--space-lg);max-width:60ch;margin-inline:auto}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--space-sm);justify-content:center}

@keyframes pulse-glow{0%,100%{box-shadow:0 0 0 0 rgba(91,79,196,.15)}50%{box-shadow:0 0 30px 8px rgba(91,79,196,.08)}}

/* ── Scroll-Indicator ── */
.scroll-indicator{position:absolute;bottom:var(--space-lg);left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.4rem;color:var(--mist);font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;animation:float 3s ease-in-out infinite}
.scroll-indicator__line{width:1px;height:40px;background:linear-gradient(180deg,var(--mist),transparent);animation:scroll-line 2s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}
@keyframes scroll-line{0%{opacity:0;transform:scaleY(0);transform-origin:top}50%{opacity:1;transform:scaleY(1)}100%{opacity:0;transform:scaleY(0);transform-origin:bottom}}

/* ── STAT-CARDS ── */
.stat-card{text-align:center;padding:var(--space-lg);background:var(--slate);border:1px solid var(--iron);border-radius:var(--radius);position:relative;overflow:hidden}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--shimmer-deep),transparent);opacity:.5}
.stat-card__value{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);color:var(--light);line-height:1}
.stat-card__label{font-size:.8rem;color:var(--mist);text-transform:uppercase;letter-spacing:.1em;margin-top:.5rem}

/* ── DIVISION-CARD (groß, atmosphärisch) ── */
.division-card{position:relative;min-height:320px;display:flex;flex-direction:column;justify-content:flex-end;padding:var(--space-lg);background:var(--stone);border:1px solid var(--iron);border-radius:var(--radius);overflow:hidden;transition:border-color .3s,box-shadow .3s}
.division-card__bg{position:absolute;inset:0;z-index:0}
.division-card__bg img{width:100%;height:100%;object-fit:cover;opacity:.25;transition:opacity .5s,transform .5s}
.division-card:hover .division-card__bg img{opacity:.35;transform:scale(1.03)}
.division-card__overlay{position:absolute;inset:0;background:linear-gradient(0deg,rgba(6,6,8,.95) 0%,rgba(6,6,8,.5) 50%,rgba(6,6,8,.3) 100%);z-index:1}
.division-card__content{position:relative;z-index:2}
.division-card__title{font-family:var(--font-display);font-size:1.6rem;color:var(--light);margin-bottom:.3rem}
.division-card__meta{display:flex;gap:var(--space-sm);margin-bottom:var(--space-sm);flex-wrap:wrap}
.division-card__desc{color:var(--mist);font-size:.95rem;margin-bottom:var(--space-md);max-width:45ch}
.division-card:hover{border-color:var(--ash);box-shadow:var(--shadow-lg)}

/* ── TEAM-PROFILE-CARD ── */
.profile-card{background:var(--slate);border:1px solid var(--iron);border-radius:var(--radius);overflow:hidden;transition:border-color .3s,transform .3s;display:flex;flex-direction:column}
.profile-card:hover{border-color:var(--ash);transform:translateY(-2px)}
.profile-card__image{aspect-ratio:1;overflow:hidden;background:var(--stone);position:relative}
.profile-card__image img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.profile-card__image img.minecraft-skin-render{object-fit:contain;padding:.75rem .25rem 0;background:radial-gradient(circle at 50% 35%,rgba(122,161,210,.18),rgba(19,22,28,.94) 68%);filter:drop-shadow(0 14px 12px rgba(0,0,0,.42))}
.profile-card:hover .profile-card__image img{transform:scale(1.03)}
.profile-card__frame{position:absolute;inset:8px;border:1px solid rgba(168,176,192,.15);pointer-events:none}
.profile-card--female .profile-card__frame{border:2px solid rgba(220,62,75,.9);box-shadow:inset 0 0 18px rgba(220,62,75,.18),0 0 12px rgba(220,62,75,.22)}
.profile-card--male .profile-card__frame{border:2px solid rgba(66,137,224,.9);box-shadow:inset 0 0 18px rgba(66,137,224,.16),0 0 12px rgba(66,137,224,.22)}
.profile-card--duck .profile-card__frame{border:2px solid rgba(74,190,116,.92);box-shadow:inset 0 0 18px rgba(74,190,116,.16),0 0 12px rgba(74,190,116,.24)}
.profile-card--hamster .profile-card__frame{border:2px solid rgba(235,190,58,.94);box-shadow:inset 0 0 18px rgba(235,190,58,.17),0 0 12px rgba(235,190,58,.25)}
.profile-card--penguin .profile-card__frame{border:2px solid rgba(84,205,238,.95);box-shadow:inset 0 0 18px rgba(84,205,238,.18),0 0 14px rgba(84,205,238,.28)}
.profile-card__gender{position:absolute;top:16px;right:16px;z-index:2;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(122,161,210,.65);border-radius:50%;background:rgba(10,13,18,.86);color:#8fc2ff;font-size:1.45rem;font-weight:700;line-height:1;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.profile-card__gender--female{border-color:rgba(235,72,86,.9);color:#ff6f7d;box-shadow:0 4px 14px rgba(0,0,0,.35),0 0 12px rgba(220,62,75,.3)}
.profile-card__gender--duck{border-color:rgba(74,190,116,.9);color:#70d99a;box-shadow:0 4px 14px rgba(0,0,0,.35),0 0 12px rgba(74,190,116,.3)}
.profile-card__gender--hamster{border-color:rgba(235,190,58,.92);color:#f3cc59;box-shadow:0 4px 14px rgba(0,0,0,.35),0 0 12px rgba(235,190,58,.3)}
.profile-card__gender--penguin{border-color:rgba(84,205,238,.92);color:#75ddf7;box-shadow:0 4px 14px rgba(0,0,0,.35),0 0 12px rgba(84,205,238,.32)}
.section-header__aside{display:inline-block;margin-left:.55rem;color:var(--mist);font-family:var(--font-body);font-size:.58em;font-weight:400;letter-spacing:.02em;text-decoration:line-through;vertical-align:middle;opacity:.7}
@media(min-width:1024px){.senior-guardian-grid > :first-child{grid-column:2}}
.profile-grid--single{grid-template-columns:minmax(0,280px);justify-content:center}
.profile-card__body{padding:var(--space-md);flex:1;display:flex;flex-direction:column}
.profile-card__name{font-family:var(--font-display);font-size:1.1rem;color:var(--light);margin-bottom:.15rem}
.profile-card__role{font-size:.8rem;color:var(--shimmer-ghost);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--space-xs)}
.profile-card__dept{font-size:.8rem;color:var(--mist);margin-bottom:var(--space-sm)}
.profile-card__bio{color:var(--mist);font-size:.9rem;line-height:1.55;flex:1}
.profile-card__socials{display:flex;gap:.5rem;margin-top:var(--space-sm)}
.profile-card__socials a{width:32px;height:32px;display:flex;align-items:center;justify-content:center;border:1px solid var(--iron);border-radius:var(--radius);color:var(--mist);transition:border-color .2s,color .2s}
.profile-card__socials svg{width:17px;height:17px;fill:currentColor}
.profile-card__socials a:hover{border-color:var(--shimmer-deep);color:var(--light)}

/* ── NEWS-CARD ── */
.news-card{display:grid;gap:0;background:var(--slate);border:1px solid var(--iron);border-radius:var(--radius);overflow:hidden;transition:border-color .3s;grid-template-columns:1fr}
@media(min-width:768px){.news-card--featured{grid-template-columns:1.2fr 1fr}}
.news-card:hover{border-color:var(--ash)}
.news-card__image{aspect-ratio:16/9;overflow:hidden;background:var(--stone)}
.news-card__image img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.news-card:hover .news-card__image img{transform:scale(1.03)}
.news-card__body{padding:var(--space-md);display:flex;flex-direction:column;justify-content:center}
.news-card__meta{display:flex;gap:var(--space-sm);align-items:center;margin-bottom:var(--space-xs);flex-wrap:wrap}
.news-card__title{font-family:var(--font-display);font-size:1.2rem;color:var(--light);margin-bottom:.4rem;transition:color .2s}
.news-card:hover .news-card__title{color:var(--shimmer-ghost)}
.news-card__excerpt{color:var(--mist);font-size:.95rem;line-height:1.6}
.news-card__readmore{display:inline-flex;align-items:center;gap:.4rem;margin-top:var(--space-sm);font-size:.85rem;font-weight:500;color:var(--shimmer-ghost);transition:gap .2s}
.news-card__readmore:hover{gap:.7rem}

/* ── EVENT-CARD ── */
.event-card{background:var(--slate);border:1px solid var(--iron);border-radius:var(--radius);padding:var(--space-md);display:flex;gap:var(--space-md);align-items:flex-start;transition:border-color .3s}
.event-card:hover{border-color:var(--ash)}
.event-card__date{flex-shrink:0;text-align:center;min-width:60px;padding:var(--space-xs);background:var(--stone);border:1px solid var(--iron);border-radius:var(--radius)}
.event-card__date-day{font-family:var(--font-display);font-size:1.5rem;color:var(--light);line-height:1}
.event-card__date-month{font-size:.7rem;color:var(--mist);text-transform:uppercase;letter-spacing:.08em}
.event-card__content{flex:1}
.event-card__title{font-family:var(--font-display);font-size:1.1rem;color:var(--light);margin-bottom:.2rem}
.event-card__info{display:flex;gap:var(--space-sm);flex-wrap:wrap;color:var(--mist);font-size:.85rem;margin-bottom:var(--space-xs)}
.event-card__desc{color:var(--mist);font-size:.9rem}

/* ── PARTNER-CARD ── */
.partner-card{background:var(--slate);border:1px solid var(--iron);border-radius:var(--radius);padding:var(--space-md);text-align:center;transition:border-color .3s,transform .3s}
.partner-card:hover{border-color:var(--ash);transform:translateY(-2px)}
.partner-card__logo{width:80px;height:80px;margin:0 auto var(--space-sm);background:var(--stone);border:1px solid var(--iron);border-radius:var(--radius);display:flex;align-items:center;justify-content:center;color:var(--mist);font-size:.7rem;text-transform:uppercase;letter-spacing:.06em}
.partner-card__logo img{width:100%;height:100%;object-fit:cover;border-radius:inherit}
.partner-card__logo--round{border-radius:50%}
.partner-card__name{font-family:var(--font-display);font-size:1.1rem;color:var(--light);margin-bottom:.2rem}
.partner-card__desc{color:var(--mist);font-size:.9rem;margin-bottom:var(--space-sm)}
.partner-card__owner{color:var(--mist);font-size:.85rem;margin-bottom:var(--space-sm)}
.partner-card__owner strong{color:var(--light);font-weight:600}
.partner-card__tags{display:flex;flex-wrap:wrap;justify-content:center;gap:.4rem;margin-bottom:var(--space-md)}
.partner-card__tags .tag{text-transform:none}

/* ── TIMELINE ── */
.timeline{position:relative;padding-left:var(--space-lg)}
.timeline::before{content:'';position:absolute;left:6px;top:0;bottom:0;width:2px;background:linear-gradient(180deg,var(--shimmer-deep),var(--iron),transparent)}
.timeline__item{position:relative;padding-bottom:var(--space-xl)}
.timeline__item:last-child{padding-bottom:0}
.timeline__dot{position:absolute;left:calc(var(--space-lg)*-1 + 2px);top:4px;width:12px;height:12px;background:var(--shimmer-deep);border:2px solid var(--stone);border-radius:50%;box-shadow:0 0 8px rgba(91,79,196,.3)}
.timeline__year{font-family:var(--font-display);font-size:.9rem;color:var(--shimmer-ghost);margin-bottom:.2rem}
.timeline__title{font-size:1.1rem;color:var(--light);margin-bottom:.3rem}
.timeline__text{color:var(--mist);font-size:.95rem;line-height:1.6}

/* ── FORMULAR ── */
.form-group{margin-bottom:var(--space-md)}
.form-label{display:block;font-size:.8rem;font-weight:500;color:var(--mist);text-transform:uppercase;letter-spacing:.06em;margin-bottom:.4rem}
.form-input,.form-select,.form-textarea{width:100%;padding:.75rem 1rem;background:var(--stone);border:1px solid var(--iron);border-radius:var(--radius);color:var(--bone);font-family:var(--font-body);font-size:.95rem;transition:border-color .2s,box-shadow .2s}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--shimmer-deep);box-shadow:0 0 0 3px rgba(91,79,196,.1);outline:none}
.form-input::placeholder,.form-textarea::placeholder{color:var(--ash)}
.form-textarea{min-height:140px;resize:vertical}
.form-hint{font-size:.8rem;color:var(--mist);margin-top:.3rem}
.form-check{display:flex;align-items:flex-start;gap:.6rem}
.form-check input{margin-top:.25rem;accent-color:var(--accent-violet)}
.form-check label{font-size:.9rem;color:var(--mist);line-height:1.5}
.form-check a{color:var(--shimmer-ghost);text-decoration:underline}
.form-error{color:#c45a5a;font-size:.85rem;margin-top:.3rem;display:none}
.form-group.is-error .form-input{border-color:#c45a5a}
.form-group.is-error .form-error{display:block}
.form-success{background:rgba(74,143,168,.1);border:1px solid var(--accent-cyan);color:var(--shimmer-ghost);padding:var(--space-md);border-radius:var(--radius);margin-bottom:var(--space-md)}

/* ── 404 ── */
.error-page{min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:var(--space-xl)}
.error-page__code{font-family:var(--font-display);font-size:clamp(4rem,12vw,10rem);color:var(--light);line-height:1;opacity:.15}
.error-page__title{font-family:var(--font-display);font-size:clamp(1.5rem,4vw,2.5rem);color:var(--light);margin-bottom:var(--space-sm)}
.error-page__text{color:var(--mist);margin-bottom:var(--space-lg);max-width:50ch;margin-inline:auto}