/* =================================================================
   Jäger-Show — pages.css
   Seitenspezifische Layouts: Hero, Page-Header, Equipment, Blog, Prosa
   ================================================================= */

/* ---------- Startseiten-Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;isolation:isolate;padding-top:var(--header-h)}
.hero__media{position:absolute;inset:0;z-index:-2;overflow:hidden}
.hero__media img,.hero__media video{width:100%;height:100%;object-fit:cover}
.hero__media video{position:absolute;inset:0}
.hero__media img.hero__poster{position:absolute;inset:0}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--grad-hero)}
.hero__glow{position:absolute;z-index:-1;width:60vw;height:60vw;max-width:720px;max-height:720px;
    top:-15%;right:-10%;border-radius:50%;
    background:radial-gradient(circle,rgba(124,58,237,.28),transparent 65%);filter:blur(20px);pointer-events:none}
.hero__inner{max-width:820px;padding-block:clamp(3rem,10vh,7rem)}
.hero__title{margin:.4rem 0 1.25rem;text-transform:uppercase}
.hero__title .accent{background:var(--grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero__sub{font-size:clamp(1.1rem,1rem + .8vw,1.5rem);color:var(--text-soft);max-width:44ch;margin-bottom:2.25rem}
.hero__scroll{position:absolute;bottom:1.6rem;left:50%;transform:translateX(-50%);color:var(--text-muted);
    display:flex;flex-direction:column;align-items:center;gap:.5rem;font-size:.78rem;letter-spacing:.15em;text-transform:uppercase}
.hero__scroll span{width:1px;height:38px;background:linear-gradient(var(--violet-400),transparent);animation:scrollpulse 2s var(--ease) infinite}
@keyframes scrollpulse{0%,100%{opacity:.3;transform:scaleY(.6)}50%{opacity:1;transform:scaleY(1)}}

/* Hero-Entrée (einmalig beim Laden) */
.hero__inner>*{opacity:0;transform:translateY(24px);animation:heroIn .9s var(--ease-out) forwards}
.hero__inner>*:nth-child(1){animation-delay:.1s}
.hero__inner>*:nth-child(2){animation-delay:.24s}
.hero__inner>*:nth-child(3){animation-delay:.38s}
.hero__inner>*:nth-child(4){animation-delay:.52s}
@keyframes heroIn{to{opacity:1;transform:none}}

/* ---------- Seiten-Header (Unterseiten) ---------- */
.page-hero{position:relative;isolation:isolate;padding:calc(var(--header-h) + clamp(3rem,8vw,6rem)) 0 clamp(2.5rem,6vw,4.5rem);overflow:hidden}
.page-hero__media{position:absolute;inset:0;z-index:-2}
.page-hero__media img{width:100%;height:100%;object-fit:cover}
.page-hero::after{content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(180deg,rgba(10,10,11,.6),rgba(10,10,11,.86)),linear-gradient(120deg,rgba(70,14,105,.5),transparent 60%)}
.page-hero__inner{max-width:760px}
.page-hero h1{margin:.6rem 0 1rem}
.page-hero .lead{color:var(--text-soft)}

/* ---------- Über-uns / Story ---------- */
.philosophy{position:relative;text-align:center;max-width:760px;margin-inline:auto}
.philosophy .h-lg{color:var(--cream);margin-bottom:1.1rem}

/* ---------- Leistungen: Detailblöcke ---------- */
.svc-detail+.svc-detail{margin-top:clamp(2.5rem,6vw,4.5rem)}
.svc-detail__head{display:flex;align-items:center;gap:1rem;margin-bottom:1.4rem}
.svc-detail__badge{display:inline-flex;width:56px;height:56px;flex:0 0 auto;align-items:center;justify-content:center;border-radius:var(--r-md);background:var(--grad-violet);border:1px solid var(--border-strong);color:var(--violet-300)}
.svc-detail__badge .icon{width:28px;height:28px}
.svc-detail h2{font-size:clamp(1.4rem,1.1rem + 1.2vw,2rem)}

/* ---------- Equipment ---------- */
.equip-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1rem,2.5vw,1.6rem)}
@media (max-width:820px){.equip-grid{grid-template-columns:1fr}}
.equip-cat{background:linear-gradient(160deg,var(--surface-2),var(--surface) 72%);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(1.5rem,3vw,2rem);transition:transform var(--t),border-color var(--t)}
.equip-cat:hover{transform:translateY(-4px);border-color:var(--border-strong)}
.equip-cat__head{display:flex;align-items:center;gap:.85rem;margin-bottom:1.15rem;padding-bottom:1.15rem;border-bottom:1px solid var(--border)}
.equip-cat__icon{display:inline-flex;width:44px;height:44px;flex:0 0 auto;align-items:center;justify-content:center;border-radius:var(--r-sm);background:var(--grad-violet);color:var(--violet-300)}
.equip-cat__icon .icon{width:22px;height:22px}
.equip-cat h3{font-size:1.12rem}
.equip-cat__list li{display:flex;gap:.7rem;padding:.5rem 0;color:var(--text-soft);font-size:.96rem;border-bottom:1px dashed var(--border)}
.equip-cat__list li:last-child{border-bottom:none}
.equip-cat__list li::before{content:"";width:6px;height:6px;margin-top:.6rem;flex:0 0 auto;border-radius:var(--r-full);background:var(--violet-400)}

/* ---------- Events / Blog ---------- */
.event-article{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-xl);overflow:hidden}
.event-article+.event-article{margin-top:clamp(2rem,5vw,3.5rem)}
.event-article__cover{position:relative;aspect-ratio:21/9;overflow:hidden}
.event-article__cover img{width:100%;height:100%;object-fit:cover}
.event-article__cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(22,18,29,.9))}
.event-article__cover .badge{position:absolute;top:1.2rem;left:1.2rem;z-index:1}
.event-article__body{padding:clamp(1.6rem,4vw,3rem)}
.event-article__body h2{font-size:clamp(1.5rem,1.2rem + 1.4vw,2.2rem);margin-bottom:.4rem}
.event-article__kicker{color:var(--violet-300);font-family:var(--font-head);font-weight:600;margin-bottom:1.5rem}
.prose h3{font-size:1.25rem;color:var(--cream);margin:1.8rem 0 .8rem}
.prose p{color:var(--text-soft);margin-bottom:1.1rem}
.prose .feature-list{margin:1.2rem 0}
.event-article__gallery{margin-top:2rem}

/* ---------- Prosa / Rechtstexte ---------- */
.legal{max-width:820px}
.legal h2{font-size:clamp(1.3rem,1.1rem + 1vw,1.7rem);margin:2.5rem 0 1rem;color:var(--text)}
.legal h3{font-size:1.1rem;margin:1.6rem 0 .6rem;color:var(--cream)}
.legal h2:first-child,.legal h3:first-child{margin-top:0}
.legal p{color:var(--text-soft);margin-bottom:1rem}
.legal ul{margin:0 0 1rem 1.2rem;list-style:disc}
.legal ul li{margin-bottom:.4rem;color:var(--text-soft)}
.legal a{color:var(--violet-300);text-decoration:underline;overflow-wrap:anywhere}
.legal address{font-style:normal;color:var(--text-soft);line-height:1.9;margin-bottom:1rem}
.legal .muted-source{font-size:.85rem;color:var(--text-dim);margin-top:2rem}
.legal .callout{background:var(--surface);border:1px solid var(--border);border-left:3px solid var(--violet);border-radius:var(--r-md);padding:1rem 1.25rem;margin:1.25rem 0}

/* ---------- Info-Karte (Kontakt Sidebar) ---------- */
.info-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:clamp(1.5rem,3vw,2rem)}
.info-card h3{font-size:1.15rem;margin-bottom:1.25rem}
.response-note{display:flex;gap:.7rem;align-items:center;margin-top:1.5rem;padding:.9rem 1.1rem;background:var(--grad-violet);border:1px solid var(--border-strong);border-radius:var(--r-md);font-size:.92rem;color:var(--text-soft)}
.response-note .icon{width:22px;height:22px;color:var(--violet-300);flex:0 0 auto}

/* ---------- Kontakt-Layout ---------- */
.contact-layout{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(2rem,5vw,3.5rem);align-items:start}
@media (max-width:900px){.contact-layout{grid-template-columns:1fr}}

/* ---------- 404 ---------- */
.error-page{min-height:70vh;display:flex;align-items:center;justify-content:center;text-align:center}
.error-page .code{font-family:var(--font-head);font-weight:800;font-size:clamp(5rem,20vw,11rem);line-height:1;
    background:var(--grad-accent);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Reduced Motion ---------- */
@media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
    .reveal,.js .reveal,[data-stagger]>*,.js [data-stagger]>*,.hero__inner>*{opacity:1!important;transform:none!important}
    .hero__scroll span{animation:none}
}
