/* ============================================================
   DMC  pages.css  -  Seitenspezifische Kompositionen
   (Home-Hero, Rally-Detail, Event-Detail-Akkordeon,
   Mitglieder-Dashboard-Bento, Aufnahmeantrag-Stepper,
   Magazin-Archiv). Nutzt Layout-Primitive + Komponenten.
   ============================================================ */

/* ---------- Geteilte Bausteine ---------- */
.split{display:grid;gap:var(--space-8);align-items:center}
@media (min-width:900px){
  .split{grid-template-columns:repeat(2,minmax(0,1fr))}
  .split--wide-first{grid-template-columns:1.3fr 1fr}
  .split--wide-last{grid-template-columns:1fr 1.3fr}
}
.media-frame{position:relative;border-radius:var(--radius-lg);overflow:hidden;background:var(--surface-2);box-shadow:var(--shadow-3)}
.media-frame::after{content:"";position:absolute;inset:0;box-shadow:var(--edge-catch);border-radius:inherit;pointer-events:none}
.media-frame img{width:100%;height:100%;object-fit:cover;aspect-ratio:4/3}
.media-frame--tall img{aspect-ratio:3/4}

/* ============================================================
   HOME
   ============================================================ */
.home-hero .hero__title{max-width:18ch}
.home-intro{display:grid;gap:var(--space-8)}
@media (min-width:960px){.home-intro{grid-template-columns:1fr 1.1fr;align-items:center}}
.home-intro__lead{font-family:var(--font-display);font-weight:500;font-size:var(--text-h3);line-height:var(--leading-snug);color:var(--text)}
.home-events{display:grid;gap:var(--gutter);grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr))}
.home-stats{padding-block:var(--space-9);border-block:1px solid var(--hairline)}

/* Feature-Magazin (DER DREIZACK auf Home) */
.home-dreizack{display:grid;gap:var(--space-8)}
@media (min-width:900px){.home-dreizack{grid-template-columns:minmax(0,340px) 1fr;align-items:center}}

/* Beitritts-Band */
.join-band{position:relative;border-radius:var(--radius-xl);overflow:hidden;background:linear-gradient(150deg,var(--surface),var(--bg-2));border:1px solid var(--hairline);padding:clamp(var(--space-8),5vw,var(--space-11));box-shadow:var(--shadow-3)}
.join-band__inner{position:relative;z-index:1;max-width:52ch}
.join-band__title{font-size:var(--text-h1)}

/* ============================================================
   VERANSTALTUNGEN  (Detail: Tages-Akkordeon)
   ============================================================ */
.event-hero{display:grid;gap:var(--space-6);align-items:end;min-height:56svh;padding-block:calc(var(--header-h) + var(--space-8)) var(--space-8);position:relative;isolation:isolate;overflow:hidden;border-radius:0}
.event-hero__media{position:absolute;inset:0;z-index:-1}
.event-hero__media img{width:100%;height:100%;object-fit:cover}
.event-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,oklch(13% .02 264 / .2),var(--bg))}
.event-detail{display:grid;gap:var(--space-9)}
@media (min-width:1024px){.event-detail{grid-template-columns:minmax(0,1fr) 340px}}
.event-detail__aside{align-self:start}
@media (min-width:1024px){.event-detail__aside{position:sticky;top:calc(var(--header-h) + var(--space-5))}}
.event-facts{display:flex;flex-direction:column;gap:var(--space-4);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:var(--space-6)}
.event-facts__row{display:flex;justify-content:space-between;gap:var(--space-4);padding-block:var(--space-3);border-top:1px solid var(--hairline)}
.event-facts__row:first-of-type{border-top:0}
.event-facts__row dt{color:var(--text-muted);font-size:var(--text-caption);text-transform:uppercase;letter-spacing:var(--tracking-wide)}
.event-facts__row dd{color:var(--text);text-align:right;margin:0}

/* Tages-Akkordeon (natives details/summary) */
.event-day{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-md);overflow:hidden;transition:border-color var(--dur-normal) var(--ease-standard)}
.event-day+.event-day{margin-top:var(--space-3)}
.event-day>summary{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-5);cursor:pointer;list-style:none;user-select:none}
.event-day>summary::-webkit-details-marker{display:none}
.event-day__daynum{font-family:var(--font-mono);color:var(--accent-hover);font-size:var(--text-caption)}
.event-day__title{flex:1;font-family:var(--font-display);font-weight:700;font-size:var(--text-h4);color:var(--text)}
.event-day__time{color:var(--text-muted);font-size:var(--text-caption)}
.event-day__chev{width:1em;height:1em;color:var(--text-muted);transition:transform var(--dur-normal) var(--ease-out-expo)}
.event-day[open]{border-color:var(--accent-line)}
.event-day[open] .event-day__chev{transform:rotate(180deg)}
.event-day__panel{padding:0 var(--space-5) var(--space-5)}
.event-day__agenda{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.event-day__agenda li{display:grid;grid-template-columns:5.5em 1fr;gap:var(--space-4);padding-block:var(--space-3);border-top:1px solid var(--hairline);color:var(--text-muted)}
.event-day__agenda time{font-family:var(--font-mono);color:var(--text);font-size:var(--text-caption)}

/* ============================================================
   RALLY-DETAIL
   ============================================================ */
.rally-detail{display:grid;gap:var(--space-9)}
@media (min-width:1024px){.rally-detail{grid-template-columns:minmax(0,1fr) 360px}}
.rally-aside{align-self:start;display:flex;flex-direction:column;gap:var(--space-5)}
@media (min-width:1024px){.rally-aside{position:sticky;top:calc(var(--header-h) + var(--space-5))}}
.rally-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-5);background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:var(--space-6)}
.rally-stats .stat__value{font-size:var(--text-h3)}
.rally-map{border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--hairline);background:var(--surface-2);aspect-ratio:4/5}
.rally-map img{width:100%;height:100%;object-fit:cover}

/* ============================================================
   MITGLIEDERBEREICH  -  Dashboard-Bento
   ============================================================ */
.member-hero{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:var(--space-5);padding-block:var(--space-8) var(--space-6);border-bottom:1px solid var(--hairline);margin-bottom:var(--space-8)}
.member-hero__greet{font-family:var(--font-display);font-weight:700;font-size:var(--text-h2)}
.member-hero__sub{color:var(--text-muted);margin-top:var(--space-2)}
.dash-bento{display:grid;gap:var(--gutter);grid-template-columns:repeat(4,1fr);grid-auto-rows:minmax(160px,auto)}
.dash-bento .tile--feature{grid-column:span 2;grid-row:span 2}
@media (max-width:1024px){
  .dash-bento{grid-template-columns:repeat(2,1fr)}
  .dash-bento .tile--feature{grid-column:span 2;grid-row:auto}
}
@media (max-width:560px){
  .dash-bento{grid-template-columns:1fr}
  .dash-bento .tile--feature{grid-column:auto}
}

/* Mitgliederkarte (Prestige) */
.member-pass{position:relative;aspect-ratio:1.586/1;border-radius:var(--radius-lg);padding:var(--space-6);background:linear-gradient(150deg,var(--surface-2),var(--bg-2));border:1px solid var(--rame-soft);box-shadow:var(--shadow-3),var(--glow-rame);display:flex;flex-direction:column;justify-content:space-between;overflow:hidden}
.member-pass__label{font-size:var(--text-caption);text-transform:uppercase;letter-spacing:var(--tracking-kicker);color:var(--rame-luce)}
.member-pass__no{font-family:var(--font-mono);font-size:var(--text-lead);letter-spacing:.12em;color:var(--text)}
.member-pass__name{font-family:var(--font-display);font-weight:700;font-size:var(--text-h4)}

/* Zugriffs-Zustaende (data-member-gate / data-member-content) */
[data-member-gate]{display:grid;place-items:center;min-height:50svh}
[data-member-content][hidden]{display:none}

/* ============================================================
   AUFNAHMEANTRAG  (mehrstufig)
   ============================================================ */
.antrag{max-width:780px;margin-inline:auto}
.antrag__panel{display:block}
.antrag__panel:not(.is-active){display:none}
.antrag fieldset{border:0;margin:0;padding:0}
.antrag legend{font-family:var(--font-display);font-weight:700;font-size:var(--text-h3);margin-bottom:var(--space-2);padding:0}
.antrag__intro{color:var(--text-muted);margin-bottom:var(--space-6)}
.antrag__fields{display:grid;gap:var(--space-5);grid-template-columns:repeat(2,minmax(0,1fr))}
.antrag__fields .field--full{grid-column:1 / -1}
@media (max-width:640px){.antrag__fields{grid-template-columns:1fr}}
.antrag__nav{display:flex;justify-content:space-between;align-items:center;gap:var(--space-4);margin-top:var(--space-8);padding-top:var(--space-5);border-top:1px solid var(--hairline)}
.antrag__nav .antrag__prev[hidden]{visibility:hidden}
.antrag__review{background:var(--surface);border:1px solid var(--hairline);border-radius:var(--radius-lg);padding:var(--space-6);display:flex;flex-direction:column;gap:var(--space-3)}
.antrag__review dl{display:grid;grid-template-columns:auto 1fr;gap:var(--space-2) var(--space-5);margin:0}
.antrag__review dt{color:var(--text-muted);font-size:var(--text-caption);text-transform:uppercase;letter-spacing:var(--tracking-wide)}
.antrag__review dd{margin:0;color:var(--text)}
/* Honeypot (Feldname website) unsichtbar, nicht fokussierbar */
.honeypot{position:absolute!important;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}

/* ============================================================
   MAGAZIN-ARCHIV  (DER DREIZACK)
   ============================================================ */
.dreizack-grid{display:grid;gap:var(--space-8) var(--gutter);grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr))}
.dreizack-grid .magazine-card--feature{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:var(--space-8);align-items:center}
.magazine-card--feature .magazine-card__title{font-size:var(--text-h2)}
@media (max-width:768px){
  .dreizack-grid .magazine-card--feature{grid-template-columns:1fr}
}

/* Seiten-Kopf (inner page hero) — Abstand plus ein zurueckhaltender Akzent-Bloom */
.page-hero{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(2.5rem,1.6rem + 5vw,6rem) clamp(1.5rem,1rem + 2vw,3rem);margin-bottom:clamp(1.5rem,1rem + 2vw,3rem);}
.page-hero > *{position:relative;z-index:1;}
.page-hero::after{content:"";position:absolute;z-index:0;inset:0;background:radial-gradient(55% 120% at 84% 22%, oklch(59% .185 262 / .10), transparent 62%);pointer-events:none;}
.page-hero__title{max-width:20ch;}
.page-hero__lead{max-width:64ch;}
@media (max-width:767px){.page-hero::after{opacity:.7;}}

/* QA-FIXES */
.page-hero__title,.hero h1,.hero__title{overflow-wrap:break-word;hyphens:auto;}
.site-header.is-scrolled{background:oklch(14% 0.02 264 / 0.86);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--hairline);}

/* QA-HYPHEN card titles */
.reason__title,.event-card__title,.magazine-card__title,.tile__title,.next-event__title{hyphens:auto;overflow-wrap:break-word;}
