
/* GYM REPUBLIC, Screendesign 05.06 (Iteration 3)
   Fixes: Reveal-Animation via @keyframes (sichtbar) · Sticky-Scroll ok ·
   genau 1 aktiver Block + Zähler · Hover ohne Flicker · innovativer
   halb-offener Trenner (Geister-Wortmarke) · weniger Leerraum. */
:root{
  --black:#000; --coal:#0E0D0B; --coal-2:#16140F; --coal-3:#211D16;
  --yellow:#F4E116; --yellow-hi:#FFF04A;
  --tl:#F4EEE2; --tl-mut:#A89E8C;
  --line:rgba(255,255,255,.09); --line-y:rgba(244,225,22,.55);
  --maxw:1600px; --pad:clamp(20px,5vw,80px);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;background:var(--coal);color:var(--tl);-webkit-font-smoothing:antialiased;line-height:1.6}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.warm{filter:saturate(.98) contrast(1.05) brightness(.94) sepia(.06)}
.display{font-family:'Archivo','Arial Narrow','Helvetica Neue Condensed',Impact,sans-serif;font-weight:900;font-style:italic;font-stretch:75%;text-transform:uppercase;letter-spacing:-.012em;line-height:.9}
.kicker{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-stretch:80%;text-transform:uppercase;letter-spacing:.26em;font-size:.74rem;color:var(--tl-mut)}
.kicker .mk{color:var(--yellow)}
.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad);position:relative;z-index:1}
.sec{padding-block:clamp(52px,6vw,96px)}
section{position:relative}
.tex-grid::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.022) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:52px 52px}
.tex-diag::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(125deg,rgba(255,255,255,.016) 0 1px,transparent 1px 26px)}

#progress{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--yellow);transform:scaleX(0);transform-origin:0 50%;z-index:90;will-change:transform}

/* Scroll-Reveal als @keyframes (unabhängig von element-eigenen transitions) */
.reveal{opacity:0}
.reveal.in{opacity:1;animation:revIn .7s cubic-bezier(.2,.7,.2,1) both}
@keyframes revIn{from{opacity:0;transform:translateY(38px)}to{opacity:1;transform:translateY(0)}}
.usp-item svg,.eq svg{transition:transform .6s cubic-bezier(.2,.9,.3,1.5)}
.usp-item:not(.in) svg,.eq:not(.in) svg{transform:scale(.5)}
.usp-item.in svg,.eq.in svg{transform:scale(1)}

/* Buttons */
.btn{display:inline-flex;align-items:center;gap:.55em;font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:85%;text-transform:uppercase;letter-spacing:.02em;font-size:.98rem;padding:.9em 1.5em;border-radius:7px;border:2px solid transparent;cursor:pointer;transition:filter .18s,background .18s,color .18s,border-color .18s;white-space:nowrap}
.btn-primary{background:var(--yellow);color:#000;border-color:var(--yellow)}
.btn-primary:hover{filter:brightness(1.08)}
.btn-ghost{background:transparent;color:var(--tl);border-color:rgba(255,255,255,.5)}
.btn-ghost:hover{border-color:var(--yellow);color:var(--yellow)}
.btn-sm{font-size:.84rem;padding:.62em 1.05em}
.txtlink{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;text-transform:uppercase;letter-spacing:.04em;font-size:.92rem;border-bottom:2px solid var(--yellow);padding-bottom:2px;color:var(--tl);transition:color .15s}
.txtlink:hover{color:var(--yellow)}
.soon-flag{display:inline-block;font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:#000;background:var(--yellow);border-radius:4px;padding:.2em .55em;vertical-align:middle}

/* HEADER */
header{position:sticky;top:0;z-index:60;background:rgba(8,7,6,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.metabar{border-bottom:1px solid var(--line)}
.metabar .wrap{display:flex;justify-content:flex-end;gap:1.4rem;padding-block:.45rem;font-size:.74rem;color:var(--tl-mut)}
.metabar a{transition:color .15s}.metabar a:hover{color:var(--yellow)}
.navbar .wrap{display:flex;align-items:center;gap:2rem;padding-block:1rem}
.logo{height:30px;width:auto;filter:invert(1)}
.mainnav{display:flex;gap:1.9rem;margin-left:auto;align-items:center}
.mainnav a{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-stretch:88%;text-transform:uppercase;letter-spacing:.04em;font-size:.95rem;color:var(--tl);display:inline-flex;align-items:center;gap:.3em;padding:.25em 0;border-bottom:2px solid transparent;transition:color .15s,border-color .15s}
.mainnav a:hover,.mainnav a.active{color:var(--yellow);border-color:var(--yellow)}
.mainnav .car{font-size:.7em;color:var(--yellow)}
.nav-cta{margin-left:.3rem}
.burger{display:none;margin-left:auto;background:none;border:0;color:var(--tl);font-size:1.6rem;cursor:pointer}

/* HERO */
.hero{position:relative;min-height:90vh;display:flex;align-items:center;background:var(--black);color:var(--tl);overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(1.04) contrast(1.04) brightness(.86) sepia(.05)}
.hero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,5,4,.87) 0%,rgba(6,5,4,.64) 36%,rgba(6,5,4,.26) 70%,rgba(6,5,4,.46) 100%),linear-gradient(0deg,rgba(6,5,4,.8) 0%,transparent 30%),linear-gradient(180deg,rgba(6,5,4,.4) 0%,transparent 18%)}
.hero .wrap{position:relative;z-index:2;width:100%;padding-block:clamp(48px,7vw,96px)}
.hero-text{max-width:840px}
.hero-ey{margin-bottom:1.5rem}
.hero h1{font-size:clamp(3.8rem,12.5vw,10.5rem);margin-bottom:1.6rem}
.hero h1 .ln{display:block}
.hero h1 .out{color:transparent;-webkit-text-stroke:2.5px var(--yellow);text-stroke:2.5px var(--yellow)}
.hero-body{color:var(--tl-mut);max-width:50ch;margin-bottom:2rem;font-size:1.08rem}
.hero-cta{display:flex;gap:.9rem;flex-wrap:wrap;align-items:center}
.hero-note{margin-top:1.2rem;font-size:.88rem;color:var(--tl-mut);display:flex;align-items:center;gap:.6rem}
.hero-note .dotmark{width:7px;height:7px;border-radius:50%;background:var(--yellow);flex:none;box-shadow:0 0 0 3px rgba(244,225,22,.18)}

/* MARQUEE */
.marquee{background:var(--yellow);color:#000;overflow:hidden;border-block:2px solid #000;position:relative}
.marquee-track{display:inline-flex;align-items:center;white-space:nowrap;will-change:transform;animation:scroll 38s linear infinite}
.marquee-track span{display:inline-flex;align-items:center;font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;font-size:1.05rem;letter-spacing:.02em;padding-block:.7rem}
.marquee .city{padding-inline:1.1rem}
.marquee .cs{padding-inline:1.1rem;opacity:.62}
.marquee .sep{font-size:.7em;opacity:.5}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* Innovativer halb-offener Trenner: riesige, beschnittene Geister-Wortmarke (driftet) */
.divider{position:relative;height:clamp(96px,13vw,168px);overflow:hidden;display:flex;align-items:center;justify-content:center;background:var(--coal)}
.divider.alt{background:var(--coal-2)}
.dword{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:72%;text-transform:uppercase;font-size:clamp(3.4rem,13vw,10rem);line-height:1;letter-spacing:-.02em;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.3);white-space:nowrap;animation:drift 8s ease-in-out infinite alternate}
.dword .y{-webkit-text-stroke-color:rgba(244,225,22,.6)}
@keyframes drift{from{transform:translateX(-7%)}to{transform:translateX(7%)}}.band{position:relative;min-height:clamp(360px,52vh,560px);display:flex;align-items:center;overflow:hidden;background:var(--black)}.band-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}.band-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(6,5,4,.8),rgba(6,5,4,.34) 58%,rgba(6,5,4,.56)),linear-gradient(0deg,rgba(6,5,4,.56),transparent 38%)}.band .wrap{position:relative;z-index:2}.band-in{max-width:700px}.band-in h2{font-size:clamp(2.4rem,6vw,5rem);color:var(--tl);margin:.5rem 0 1rem}.band-in h2 .y{color:transparent;-webkit-text-stroke:2px var(--yellow)}.band-in p{color:var(--tl-mut);max-width:46ch;font-size:1.06rem}

/* LOCATION TEASER */
.loc{background:var(--coal-2)}
.sec-head{margin-bottom:clamp(30px,4vw,56px);display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap}
.sec-head h2{font-size:clamp(2.3rem,5.5vw,4.6rem);color:var(--tl);margin-top:.4rem}
.loc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.ltile{position:relative;aspect-ratio:4/5;border-radius:12px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;box-shadow:0 16px 40px rgba(0,0,0,.45);border:1px solid var(--line);cursor:pointer;transition:border-color .25s}
.ltile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .6s ease}
.ltile .lscrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(8,6,3,.94) 6%,rgba(14,11,6,.35) 52%,rgba(14,11,6,.06) 100%)}
.ltile:hover{border-color:var(--line-y)}
.ltile:hover img{transform:scale(1.07)}
.ltile-body{position:relative;z-index:2;padding:22px}
.ltile .city{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:78%;text-transform:uppercase;font-size:1.7rem;line-height:.95;letter-spacing:-.01em;margin-bottom:.8rem}
.ltile .csbtn{display:inline-flex;align-items:center;gap:.4em;background:var(--yellow);color:#000;font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:85%;text-transform:uppercase;letter-spacing:.05em;font-size:.74rem;padding:.55em .95em;border-radius:6px}
.ltile .pin{position:absolute;top:16px;left:16px;z-index:2;font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.6rem;letter-spacing:.18em;text-transform:uppercase;color:#fff;opacity:.72}

/* USP-STRIP */
.usp{background:var(--coal)}
.usp .wrap{padding-block:clamp(40px,5vw,64px)}
.usp-head{margin-bottom:1.9rem}
.usp-row{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.usp-item{display:flex;flex-direction:column;gap:.7rem;padding:1.2rem 1.1rem;border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,var(--coal-3),var(--coal-2));transition:border-color .2s}
.usp-item:hover{border-color:var(--line-y)}
.usp-item svg{width:30px;height:30px;color:var(--tl);stroke-width:1.6}
.usp-item b{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:88%;text-transform:uppercase;font-size:1rem;line-height:1.05}
.usp-item span{font-size:.82rem;color:var(--tl-mut);line-height:1.4}

/* PHILOSOPHIE, verschobener Scroll */
.philo{background:var(--coal-2)}
.philo .wrap{padding-block:clamp(48px,5.5vw,88px)}
.philo-grid{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(30px,5vw,78px);align-items:start}
.philo-left{position:sticky;top:88px;align-self:start;display:flex;flex-direction:column;gap:clamp(1rem,2.2vh,1.8rem)}
.philo-left h2{font-size:clamp(2.6rem,5.6vw,5.4rem);color:var(--tl);margin:.6rem 0 1.1rem}
.philo-left h2 .y{color:var(--yellow)}
.philo-left p{color:var(--tl-mut);max-width:34ch;font-size:1.02rem}
.philo-count{margin-top:2.4rem;font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:74%;font-size:2.2rem;line-height:1;color:var(--tl-mut)}
.philo-count #pcur{color:var(--yellow);font-size:3.4rem}
.philo-right{display:flex;flex-direction:column;gap:clamp(48px,8vw,120px);padding-block:clamp(16px,5vh,64px)}
.pblock{display:block;padding-left:26px;border-left:2px solid transparent;opacity:.5;transition:border-color .35s ease,opacity .35s ease}
.pthumb{position:relative;width:240px;aspect-ratio:4/3;border-radius:13px;overflow:hidden;border:1px solid var(--line);transition:border-color .35s,box-shadow .35s}
.pthumb img{width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.pbadge{position:absolute;left:11px;bottom:11px;font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:74%;font-size:1.05rem;line-height:1;color:#000;background:var(--yellow);padding:.18em .5em;border-radius:5px}
.pbtext h3{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:78%;text-transform:uppercase;font-size:clamp(1.7rem,3.1vw,2.5rem);line-height:.95;color:var(--tl);margin-bottom:.7rem;transition:color .35s}
.pbtext p{color:var(--tl-mut);max-width:46ch;font-size:1rem}
.pblock.active .pbtext h3{color:var(--yellow)}.pblock.active{border-left-color:var(--yellow);opacity:1}.philo-head{margin-bottom:0}.philo-head h2{font-size:clamp(2.1rem,3.6vw,3.5rem);color:var(--tl);margin:.4rem 0 .9rem}.philo-head h2 .y{color:var(--yellow)}.philo-head p{color:var(--tl-mut);max-width:42ch;font-size:1rem}.philo-stage{position:relative;width:100%;height:clamp(280px,46vh,520px);border-radius:16px;overflow:hidden;border:1px solid var(--line);box-shadow:0 22px 50px rgba(0,0,0,.55)}.ps-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}.ps-img.on{opacity:1;animation:kenburns 10s ease-out both}@keyframes kenburns{from{transform:scale(1.03)}to{transform:scale(1.13)}}
.pblock.active .pthumb{border-color:var(--line-y);box-shadow:0 14px 36px rgba(0,0,0,.5)}
.pblock.active .pthumb img{transform:scale(1.07)}

/* TEASER */
.teaser{background:var(--coal)}
.tz-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.tz{position:relative;min-height:440px;border-radius:14px;overflow:hidden;color:#fff;display:flex;align-items:flex-end;padding:34px;border:1px solid var(--line);transition:box-shadow .3s,border-color .25s}
.tz img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .6s ease}
.tz .tscrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(8,6,3,.93) 4%,rgba(14,10,6,.42) 50%,rgba(14,10,6,.1) 100%)}
.tz:hover{box-shadow:0 26px 56px rgba(0,0,0,.55);border-color:var(--line-y)}
.tz:hover img{transform:scale(1.06)}.tz-media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .6s ease}.tz:hover .tz-media{transform:scale(1.06)}
.tz-in{position:relative;z-index:2}
.tz-in h3{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;font-size:2.5rem;line-height:.95;margin-bottom:.5rem}
.tz-in p{color:var(--tl-mut);font-size:.96rem;max-width:38ch;margin-bottom:1.1rem}
.tz-in .arrow{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.05em;font-size:.88rem;color:#fff;display:inline-flex;gap:.5em;align-items:center}
.tz-in .arrow .ic{color:var(--yellow);font-size:1.2em}

/* EQUIPMENT */
.equip{background:var(--coal-2)}
.equip-head{margin-bottom:2.6rem;max-width:62ch}
.equip-head h2{font-size:clamp(2rem,4.6vw,3.2rem);color:var(--tl);margin-top:.4rem}
.equip-head p{color:var(--tl-mut);margin-top:.9rem}
.equip-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.eq{border:1px solid var(--line);border-radius:12px;padding:28px;background:linear-gradient(180deg,var(--coal-3),var(--coal-2));transition:border-color .2s}
.eq:hover{border-color:var(--line-y)}
.eq svg{width:34px;height:34px;color:var(--yellow);stroke-width:1.5;margin-bottom:1rem}
.eq h4{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:85%;text-transform:uppercase;font-size:1.25rem;margin-bottom:.5rem}
.eq p{color:var(--tl-mut);font-size:.92rem}
.eq .chips{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:1.1rem}
.eq .chip{font-size:.7rem;font-weight:600;color:var(--tl-mut);border:1px solid var(--line);border-radius:20px;padding:.28em .75em}

/* TEAM / B2B */
.team{background:var(--coal)}
.team-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(30px,4vw,72px);align-items:center}
.team h2{font-size:clamp(2.1rem,5vw,3.6rem);color:var(--tl);margin:.4rem 0 1.2rem}
.team-lead{font-size:1.08rem;color:var(--tl-mut);max-width:52ch;margin-bottom:1.7rem}
.team-list{list-style:none;display:flex;flex-direction:column;gap:.95rem;margin-bottom:1.9rem}
.team-list li{display:flex;gap:.85rem;align-items:flex-start;font-size:.98rem;color:var(--tl)}
.team-list .tk{flex:none;width:23px;height:23px;border-radius:50%;background:var(--yellow);color:#000;display:grid;place-items:center;font-size:.72rem;font-weight:800;margin-top:.15rem}
.b2b-panel{background:linear-gradient(155deg,var(--coal-3),var(--black));color:var(--tl);border:1px solid var(--line-y);border-radius:16px;padding:34px;position:relative;overflow:hidden}
.b2b-panel .b2b-stat{display:flex;gap:1.8rem;margin:1.3rem 0 1.5rem;flex-wrap:wrap}
.b2b-stat .n{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:78%;font-size:2.6rem;line-height:.9;color:var(--tl)}
.b2b-stat .n .u{color:var(--yellow)}
.b2b-stat small{display:block;color:var(--tl-mut);font-size:.74rem;margin-top:.3rem;text-transform:uppercase;letter-spacing:.1em}
.b2b-panel p{color:var(--tl-mut);font-size:.94rem;margin-bottom:1.4rem}

/* CLOSER */
.closer{position:relative;color:var(--tl);text-align:center;overflow:hidden;background:var(--black)}
.closer-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(1) contrast(1.04) brightness(.68) sepia(.06)}
.closer-scrim{position:absolute;inset:0;z-index:1;background:radial-gradient(120% 90% at 50% 30%,rgba(8,6,4,.32),rgba(5,4,3,.8))}
.closer .wrap{position:relative;z-index:2;padding-block:clamp(72px,9vw,140px)}
.closer .kicker{justify-content:center;display:flex}
.closer h2{font-size:clamp(2.8rem,8vw,6.4rem);margin:.6rem 0 1.2rem}
.closer h2 .y{color:transparent;-webkit-text-stroke:2px var(--yellow)}
.closer p{color:var(--tl-mut);max-width:50ch;margin:0 auto 2rem}
.closer-cta{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}
.closer-note{margin-top:1.3rem;font-size:.86rem;color:var(--tl-mut)}

/* FOOTER */
footer{background:var(--black);color:var(--tl);border-top:1px solid var(--line)}
.foot-top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:36px;padding-block:clamp(52px,6vw,84px)}
.foot-brand .logo{height:30px;margin-bottom:1rem;filter:invert(1)}
.foot-brand p{color:var(--tl-mut);font-size:.88rem;max-width:36ch}
.foot-col h5{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:85%;text-transform:uppercase;font-size:.88rem;letter-spacing:.04em;margin-bottom:1rem;color:var(--tl)}
.foot-col ul{list-style:none;display:flex;flex-direction:column;gap:.55rem}
.foot-col a{color:var(--tl-mut);font-size:.86rem;transition:color .15s}.foot-col a:hover{color:var(--yellow)}
.foot-mid{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-block:24px;align-items:center}
.foot-block h5{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;font-size:.8rem;letter-spacing:.06em;color:var(--tl-mut);margin-bottom:.6rem}
.socials{display:flex;gap:.5rem}
.soc{width:42px;height:42px;border:1px solid var(--line);border-radius:9px;display:grid;place-items:center;color:var(--tl);transition:border-color .15s,color .15s}
.soc:hover{border-color:var(--yellow);color:var(--yellow)}.soc svg{width:18px;height:18px}
.foot-legal{border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-block:18px;color:var(--tl-mut);font-size:.78rem}
.foot-legal a:hover{color:var(--tl)}

/* FLOATING */
.floating{position:fixed;right:22px;bottom:22px;z-index:70;display:flex;flex-direction:column;gap:.6rem;align-items:flex-end}
.floating .btn{box-shadow:0 12px 30px rgba(0,0,0,.45)}
.floating .btn-dark{background:var(--coal-3);color:var(--tl);border-color:rgba(255,255,255,.25)}
.floating .btn-dark:hover{border-color:var(--yellow);color:var(--yellow)}
.floating-tag{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:#000;background:var(--yellow);border-radius:4px;padding:.12em .5em;align-self:flex-end;margin-bottom:-.2rem}

/* RESPONSIVE */
@media (max-width:1080px){
  .loc-grid{grid-template-columns:repeat(2,1fr)}
  .usp-row{grid-template-columns:repeat(3,1fr)}
  .equip-grid{grid-template-columns:1fr}
  .team-grid{grid-template-columns:1fr}
  .tz-grid{grid-template-columns:1fr}
  .foot-top{grid-template-columns:1fr 1fr}
  .philo-grid{grid-template-columns:1fr;gap:30px}
  .philo-left{position:static;height:auto;display:block;margin-bottom:22px}.philo-stage{height:auto;aspect-ratio:16/10}.philo-right{padding-block:0;gap:clamp(40px,8vw,64px)}
  .philo-count{display:none}
}
@media (max-width:560px){
  .metabar .wrap{justify-content:flex-start;gap:.9rem;font-size:.66rem}
  .metabar a.hide-m{display:none}
  .mainnav{display:none}.burger{display:block}.nav-cta{display:none}
  .hero{min-height:84vh}
  .hero h1{font-size:clamp(3.1rem,17vw,5.4rem)}
  .hero-scrim{background:linear-gradient(0deg,rgba(6,5,4,.88) 8%,rgba(6,5,4,.42) 52%,rgba(6,5,4,.36) 100%)}
  .hero-cta{flex-direction:column;align-items:stretch}.hero-cta .btn{justify-content:center}
  .loc-grid{grid-template-columns:1fr 1fr;gap:12px}
  .usp-row{grid-template-columns:1fr 1fr;gap:8px}
  .pblock{grid-template-columns:1fr;gap:14px}
  .pthumb{width:100%;aspect-ratio:16/9}
  .tz-in h3{font-size:2rem}
  .foot-top{grid-template-columns:1fr}
  .foot-mid{flex-direction:column;align-items:flex-start}
  .floating{left:12px;right:12px;bottom:12px;flex-direction:row}.floating .btn{flex:1;justify-content:center}.floating-tag{display:none}
}
@media (max-width:380px){.loc-grid{grid-template-columns:1fr}}
.usp-row .usp-item:nth-child(1){order:1}.usp-row .usp-item:nth-child(5){order:2}.usp-row .usp-item:nth-child(3){order:3}.usp-row .usp-item:nth-child(4){order:4}.usp-row .usp-item:nth-child(2){order:5}

/* ======================================================================
   GYM REPUBLIC — Erweiterungen für die Multi-Page-Website (Unterseiten)
   Ergänzt das aus dem Screendesign extrahierte Basis-CSS.
   ====================================================================== */

/* --- Header: Dropdown-Navigation --- */
.brand{display:inline-flex;align-items:center}
.mainnav .nav-item{position:relative;display:inline-flex;align-items:center}
.mainnav .submenu{position:absolute;top:100%;left:-14px;min-width:236px;background:rgba(14,13,11,.98);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:11px;padding:.5rem;display:flex;flex-direction:column;gap:.05rem;opacity:0;visibility:hidden;transform:translateY(9px);transition:opacity .18s,transform .18s,visibility .18s;box-shadow:0 20px 46px rgba(0,0,0,.55);z-index:80}
.mainnav .nav-item:hover .submenu,.mainnav .nav-item:focus-within .submenu{opacity:1;visibility:visible;transform:translateY(0)}
.mainnav .submenu a{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-stretch:88%;text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;color:var(--tl-mut);padding:.55em .7em;border:0;border-bottom:0;border-radius:7px;white-space:nowrap}
.mainnav .submenu a:hover{background:var(--coal-3);color:var(--yellow);border-color:transparent}
.mainnav .submenu a[aria-current="page"]{color:var(--yellow)}

/* --- Header: Burger-Navigation (Mobile + Tablet bis 1080px, sonst läuft die Nav über) --- */
.navbar .nav-cta-m{display:none}
.mainnav:not(.open) .nav-cta-m{display:none!important}
@media (max-width:1080px){
  .mainnav{display:none}
  .burger{display:block}
  .nav-cta{display:none}
  .mainnav.open{display:flex;position:fixed;left:0;right:0;top:0;flex-direction:column;align-items:stretch;gap:.1rem;background:var(--coal);padding:6.6rem var(--pad) 1.8rem;border-bottom:1px solid var(--line);max-height:100vh;overflow:auto;z-index:55;box-shadow:0 24px 54px rgba(0,0,0,.6);margin-left:0}
  .mainnav.open .nav-item{flex-direction:column;align-items:stretch}
  .mainnav.open .navlink{padding-block:.95em;border-bottom:1px solid var(--line);justify-content:space-between;display:flex}
  .mainnav.open .submenu{display:none;position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;background:transparent;padding:.2rem 0 .7rem 1rem;min-width:0}
  .mainnav.open .nav-item.sub-open .submenu{display:flex}
  .mainnav.open .nav-item.sub-open .car{transform:rotate(180deg)}
  .mainnav.open .nav-cta-m{display:inline-flex;justify-content:center;margin-top:1.2rem}
  .burger{position:relative;z-index:60}
  .navbar .brand{position:relative;z-index:60}
}

/* --- Subhero (kompakter Kopf für Unterseiten) --- */
.subhero{position:relative;min-height:clamp(360px,54vw,580px);display:flex;align-items:flex-end;overflow:hidden;background:var(--black)}
.subhero.tall{min-height:clamp(470px,80vh,780px);align-items:center}
.subhero>img,.subhero>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(1.08) contrast(1.04) brightness(.82) sepia(.1)}
.subhero .subhero-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(10,7,3,.95) 2%,rgba(28,19,8,.42) 44%,rgba(28,19,8,.34) 100%),linear-gradient(90deg,rgba(8,6,4,.84),transparent 66%),radial-gradient(78% 56% at 84% 22%,rgba(244,225,22,.12),transparent 62%)}
.subhero .wrap{position:relative;z-index:2;width:100%;padding-block:clamp(40px,6vw,78px)}
.subhero.plain{min-height:0;background:var(--coal);align-items:stretch}
.subhero.plain .wrap{padding-block:clamp(40px,6vw,72px)}
.crumb{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-stretch:84%;text-transform:uppercase;letter-spacing:.16em;font-size:.7rem;color:var(--tl-mut);margin-bottom:.7rem;display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.crumb a{color:var(--tl-mut)}.crumb a:hover{color:var(--yellow)}
.crumb .sep{opacity:.5}
.subhero h1{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:75%;text-transform:uppercase;letter-spacing:-.012em;line-height:.92;font-size:clamp(2.6rem,6.6vw,5.6rem);color:var(--tl);margin:0 0 1rem;max-width:20ch}
.subhero h1 .y{color:transparent;-webkit-text-stroke:2px var(--yellow);text-stroke:2px var(--yellow)}
.subhero .lead{color:var(--tl-mut);max-width:56ch;font-size:1.1rem}
.subhero .sub-cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.subhero .hero-stats{display:flex;gap:2.2rem;flex-wrap:wrap;margin-top:1.8rem}
.subhero .hero-stats .hs{display:flex;flex-direction:column}
.subhero .hero-stats .hs b{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:76%;font-size:1.9rem;line-height:1;color:var(--yellow)}
.subhero .hero-stats .hs span{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--tl-mut);margin-top:.25rem}

/* --- Bewegte Bild-Kacheln (Hub-Areas, Galerien) --- */
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:980px){.media-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.media-grid{grid-template-columns:1fr}}
.mtile{position:relative;min-height:300px;border-radius:13px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:22px;border:1px solid var(--line);color:#fff;transition:border-color .25s,transform .25s,box-shadow .3s}
.mtile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;transition:transform .6s ease}
.mtile .mscrim{position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(8,6,3,.93) 6%,rgba(20,13,6,.34) 56%,rgba(20,13,6,.06) 100%)}
.mtile:hover{border-color:var(--line-y);transform:translateY(-3px);box-shadow:0 22px 48px rgba(0,0,0,.5)}
.mtile:hover img{transform:scale(1.07)}
.mtile-body{position:relative;z-index:2}
.mtile .mk{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tl-mut)}
.mtile h3{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;font-size:1.55rem;line-height:.95;margin:.45rem 0 .55rem;color:#fff}
.mtile p{color:rgba(244,238,226,.82);font-size:.85rem;margin-bottom:.7rem;max-width:30ch}
.mtile .go{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.04em;font-size:.8rem;display:inline-flex;gap:.4em;align-items:center;color:#fff}
.mtile .go .ic{color:var(--yellow);transition:transform .2s}
.mtile:hover .go .ic{transform:translateX(4px)}

/* --- Rich-Content (Fließtext + Listen auf Unterseiten) --- */
.rich{max-width:75ch}
.rich.wide{max-width:none}
.rich h2{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(1.7rem,3.6vw,2.7rem);color:var(--tl);margin:0 0 1.1rem}
.rich h2 .y{color:var(--yellow)}
.rich h3{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-size:1.22rem;color:var(--tl);margin:1.7rem 0 .55rem}
.rich p{color:var(--tl-mut);margin-bottom:1.1rem;font-size:1.05rem}
.rich strong,.rich b{color:var(--tl)}
.rich a:not(.btn){color:var(--yellow);border-bottom:1px solid rgba(244,225,22,.4)}
.rich a:not(.btn):hover{border-color:var(--yellow)}
.rich ul{list-style:none;display:flex;flex-direction:column;gap:.72rem;margin:0 0 1.5rem}
.rich ul li{display:flex;gap:.75rem;align-items:flex-start;color:var(--tl);font-size:1.02rem}
.rich ul li::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--yellow);flex:none;margin-top:.5em;transform:rotate(45deg)}
.rich blockquote{border-left:2px solid var(--yellow);padding:.2rem 0 .2rem 1.1rem;margin:0 0 1.2rem;color:var(--tl-mut);font-style:italic}

/* --- Split (Text + Medium nebeneinander) --- */
.split{display:grid;grid-template-columns:1.04fr .96fr;gap:clamp(28px,4.5vw,68px);align-items:center}
.split.rev .split-media{order:-1}
.split-media{position:relative;border-radius:15px;overflow:hidden;border:1px solid var(--line);aspect-ratio:4/3;box-shadow:0 18px 44px rgba(0,0,0,.45)}
.split-media img,.split-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:880px){.split{grid-template-columns:1fr}.split.rev .split-media{order:0}}

/* --- Info-Karten-Grid (nutzt .eq-Optik, generisch) --- */
.info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.info-grid.cols-2{grid-template-columns:repeat(2,1fr)}
.info-grid.cols-4{grid-template-columns:repeat(4,1fr)}
@media (max-width:1080px){.info-grid,.info-grid.cols-4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:620px){.info-grid,.info-grid.cols-2,.info-grid.cols-4{grid-template-columns:1fr}}
.icard{border:1px solid var(--line);border-radius:12px;padding:24px;background:linear-gradient(180deg,var(--coal-3),var(--coal-2));transition:border-color .2s}
.icard:hover{border-color:var(--line-y)}
.icard .num{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:76%;font-size:1.5rem;color:var(--yellow);line-height:1;margin-bottom:.7rem}
.icard h4{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:86%;text-transform:uppercase;font-size:1.12rem;color:var(--tl);margin-bottom:.45rem}
.icard p{color:var(--tl-mut);font-size:.92rem}

/* --- Hub-Kachelgrid (Links auf Unterseiten) --- */
.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width:980px){.hub-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.hub-grid{grid-template-columns:1fr}}
.hub-tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:1.4rem;min-height:188px;border:1px solid var(--line);border-radius:13px;padding:24px;background:linear-gradient(160deg,var(--coal-3),var(--coal-2));transition:border-color .2s,transform .2s,box-shadow .2s;overflow:hidden}
.hub-tile:hover{border-color:var(--line-y);transform:translateY(-3px);box-shadow:0 20px 44px rgba(0,0,0,.45)}
.hub-tile .ht-k{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tl-mut)}
.hub-tile h3{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;font-size:1.55rem;line-height:.95;color:var(--tl);margin:.5rem 0 .4rem}
.hub-tile p{color:var(--tl-mut);font-size:.9rem}
.hub-tile .ht-go{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.04em;font-size:.82rem;color:var(--tl);display:inline-flex;gap:.5em;align-items:center}
.hub-tile .ht-go .ic{color:var(--yellow);font-size:1.15em;transition:transform .2s}
.hub-tile:hover .ht-go .ic{transform:translateX(4px)}

/* --- Legal / Prosa-Seiten --- */
.legal{max-width:80ch;margin-inline:auto}
.legal h1{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(2rem,4.4vw,3.1rem);color:var(--tl);margin-bottom:1.5rem}
.legal h2{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-size:1.32rem;color:var(--tl);margin:2.1rem 0 .6rem}
.legal h3{font-weight:700;color:var(--tl);margin:1.3rem 0 .4rem;font-size:1.05rem}
.legal p,.legal li{color:var(--tl-mut);margin-bottom:.8rem;font-size:.99rem;line-height:1.7}
.legal a{color:var(--yellow)}
.legal ul{padding-left:1.2rem;margin-bottom:1rem}
.legal .muted-note{border:1px solid var(--line-y);border-radius:11px;padding:18px 20px;background:rgba(244,225,22,.05);color:var(--tl-mut);font-size:.9rem;margin-bottom:1.6rem}

/* --- Coming-Soon-Platzhalter (mit Video-Hintergrund) --- */
.soon{position:relative;min-height:68vh;display:flex;align-items:center;text-align:center;background:var(--coal);overflow:hidden}
.soon>video,.soon .soon-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:saturate(1.04) contrast(1.05) brightness(.42) sepia(.08)}
.soon .soon-scrim{position:absolute;inset:0;z-index:1;background:radial-gradient(120% 90% at 50% 32%,rgba(10,7,4,.46),rgba(6,5,3,.93))}
.soon .wrap{width:100%;position:relative;z-index:2}
.soon .kicker{justify-content:center;display:flex;margin-bottom:.6rem}
.soon h1{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:76%;text-transform:uppercase;letter-spacing:-.012em;font-size:clamp(2.6rem,7.5vw,5.6rem);line-height:.92;color:var(--tl);margin:.3rem 0 .5rem}
.soon h1 .y{color:transparent;-webkit-text-stroke:2px var(--yellow)}
.soon .soon-sub{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.04em;color:var(--yellow);margin-bottom:1rem;font-size:1.05rem}
.soon p{color:var(--tl-mut);max-width:50ch;margin:0 auto 1.8rem;font-size:1.05rem}
.soon-links{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}

/* --- CTA-Band (Abschluss-Aufforderung) --- */
.ctaband{position:relative;overflow:hidden;background:linear-gradient(118deg,#11100e 32%,#080706);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.ctaband::after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(74% 150% at 88% 50%,rgba(244,225,22,.14),transparent 56%),repeating-linear-gradient(125deg,rgba(255,255,255,.02) 0 1px,transparent 1px 24px)}
.ctaband .wrap{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;padding-block:clamp(36px,5vw,66px)}
.ctaband h2{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;letter-spacing:-.01em;font-size:clamp(1.8rem,4.2vw,3.1rem);color:var(--tl);max-width:20ch;line-height:.95}
.ctaband h2 .y{color:var(--yellow)}
.ctaband .cta-actions{display:flex;gap:.8rem;flex-wrap:wrap}

/* --- Kontaktformular --- */
.cform{display:grid;gap:1.05rem;max-width:640px}
.cform .row{display:grid;gap:1.05rem;grid-template-columns:1fr 1fr}
@media (max-width:620px){.cform .row{grid-template-columns:1fr}}
.cform label{font-family:'Archivo',sans-serif;font-weight:700;font-style:italic;font-size:.76rem;letter-spacing:.08em;text-transform:uppercase;color:var(--tl-mut);display:block;margin-bottom:.42rem}
.cform input,.cform textarea,.cform select{width:100%;background:var(--coal-2);border:1px solid var(--line);border-radius:9px;padding:.82em .95em;color:var(--tl);font:inherit;font-size:.95rem;transition:border-color .15s,background .15s}
.cform input::placeholder,.cform textarea::placeholder{color:#6f6757}
.cform input:focus,.cform textarea:focus,.cform select:focus{outline:none;border-color:var(--yellow);background:var(--coal-3)}
.cform textarea{min-height:138px;resize:vertical}
.cform .check{display:flex;gap:.6rem;align-items:flex-start;font-size:.84rem;color:var(--tl-mut);font-family:'Inter',system-ui,sans-serif;text-transform:none;letter-spacing:0;font-weight:400;line-height:1.5}
.cform .check input{width:auto;margin-top:.18rem;accent-color:var(--yellow)}
.cform .check a{color:var(--yellow)}
.form-note{font-size:.8rem;color:var(--tl-mut);margin-top:.3rem}

/* --- kleine Helfer --- */
.btn-dark{background:var(--coal-3);color:var(--tl);border-color:rgba(255,255,255,.22)}
.btn-dark:hover{border-color:var(--yellow);color:var(--yellow)}
.sec.tight{padding-block:clamp(36px,4vw,60px)}
.sec-lead{color:var(--tl-mut);max-width:60ch;font-size:1.08rem;margin-top:.6rem}
.btnrow{display:flex;gap:.8rem;flex-wrap:wrap;align-items:center;margin-top:1.4rem}
.divider.flat{height:clamp(70px,8vw,110px)}
.anchor-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:760px){.anchor-cards{grid-template-columns:1fr}}
.acard{display:flex;flex-direction:column;gap:.5rem;border:1px solid var(--line);border-radius:12px;padding:22px;background:var(--coal-2);transition:border-color .2s}
.acard:hover{border-color:var(--line-y)}
.acard h4{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:86%;text-transform:uppercase;color:var(--tl);font-size:1.1rem}
.acard p{color:var(--tl-mut);font-size:.9rem}
.acard .go{color:var(--yellow);font-weight:700;font-style:italic;font-family:'Archivo';text-transform:uppercase;font-size:.8rem;letter-spacing:.05em}

/* ===== 10.06 Feedback-Erweiterungen (Website) ===== */
.dword.dbrand{-webkit-text-stroke:3px rgba(255,255,255,.92);animation:none}
.dword.dbrand .y{-webkit-text-stroke-color:var(--yellow)}
.dword .reg{font-size:.3em;vertical-align:1.5em;letter-spacing:0;margin-left:.04em;-webkit-text-stroke:0;color:var(--yellow)}
sup.reg{font-size:.54em;line-height:0;vertical-align:super;letter-spacing:.02em;margin-left:.06em;font-style:normal;color:inherit}
.usp-head .kicker{font-size:1.05rem;letter-spacing:.3em}
.usp-item{transition:background .22s,border-color .22s}
.usp-item svg{width:34px;height:34px}
.usp-item b{font-size:1.16rem}
.usp-item span{font-size:.92rem}
.usp-item b,.usp-item span,.usp-item svg{transition:color .22s}
.usp-item:hover{background:var(--yellow);border-color:var(--yellow)}
.usp-item:hover b{color:#000}
.usp-item:hover span{color:rgba(0,0,0,.72)}
.usp-item:hover svg{color:#000}
.usp-item:hover svg *{stroke:#000}
.eq h4,.tz-in h3,.ltile .city,.mtile h3,.hub-tile h3,.acard h4,.icard h4{transition:color .2s}
.eq:hover{border-color:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.eq:hover h4{color:var(--yellow)}
.tz:hover{border-color:var(--yellow);box-shadow:0 26px 56px rgba(0,0,0,.55),inset 0 0 0 1.5px var(--yellow)}
.tz:hover .tz-in h3{color:var(--yellow)}
.ltile:hover{border-color:var(--yellow);box-shadow:0 16px 40px rgba(0,0,0,.45),inset 0 0 0 1.5px var(--yellow)}
.ltile:hover .city{color:var(--yellow)}
.mtile:hover{border-color:var(--yellow);box-shadow:0 22px 48px rgba(0,0,0,.5),inset 0 0 0 1.5px var(--yellow)}
.mtile:hover h3{color:var(--yellow)}
.hub-tile:hover{border-color:var(--yellow);box-shadow:0 20px 44px rgba(0,0,0,.45),inset 0 0 0 1.5px var(--yellow)}
.hub-tile:hover h3{color:var(--yellow)}
.acard:hover{border-color:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.acard:hover h4{color:var(--yellow)}
.icard:hover{border-color:var(--yellow);box-shadow:inset 0 0 0 1.5px var(--yellow)}
.band-img.warm{filter:saturate(1) contrast(1.04) brightness(1.05) sepia(.05)}
.ap-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:760px){.ap-grid{grid-template-columns:1fr}}
.ap-block{border:1px solid var(--line);border-radius:12px;padding:20px;background:var(--coal-2)}
.ap-block h4{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;font-size:.95rem;letter-spacing:.03em;color:#000;background:var(--yellow);display:inline-block;border-radius:6px;padding:.28em .65em;margin-bottom:.95rem}
.ap-block ul{list-style:none;display:flex;flex-direction:column;gap:.55rem;margin:0;padding:0}
.ap-block li{display:flex;gap:.6rem;font-size:.9rem;color:var(--tl-mut);line-height:1.5}
.ap-block li::before{content:"";width:8px;height:8px;border-radius:2px;background:var(--yellow);transform:rotate(45deg);flex:none;margin-top:.45em}

/* ===== 10.06b Feedback-Runde ===== */
/* Buttons: Vollgelb-Hover (Ghost/Dark fuellen gelb, schwarze Schrift) */
.btn-ghost:hover{background:var(--yellow);color:#000;border-color:var(--yellow)}
.btn-dark:hover{background:var(--yellow);color:#000;border-color:var(--yellow)}
/* Info-Kacheln: Vollgelb-Hover wie USP-Kacheln */
.icard{transition:background .22s,border-color .22s,box-shadow .22s}
.icard h4,.icard p,.icard .num{transition:color .22s}
.icard:hover{background:var(--yellow);border-color:var(--yellow);box-shadow:none}
.icard:hover h4{color:#000}
.icard:hover p{color:rgba(0,0,0,.74)}
.icard:hover .num{color:#000}
/* Gelber Satz-Endpunkt in Display-Headlines */
.ydot{color:var(--yellow)}
/* Floating: 3. Button-Set, Extra-Buttons auf Mobile ausblenden */
@media (max-width:560px){.floating .float-extra{display:none}}
/* Floating-Hover: Schrift IMMER auf Schwarz (ueberschreibt .floating .btn-dark:hover) */
.floating .btn:hover{background:var(--yellow);color:#000;border-color:var(--yellow)}
/* Bild-Icons (eingefaerbte PNG-Pictogramme) in USP-/Equipment-Kacheln */
.usp-item .ico-img{width:36px;height:36px;object-fit:contain;display:block;transition:filter .22s}
.eq .ico-img{width:36px;height:36px;object-fit:contain;display:block;margin-bottom:1rem}
.usp-item:hover .ico-img{filter:brightness(0)}
.usp-item:not(.in) .ico-img{transform:scale(.5)}.usp-item.in .ico-img{transform:scale(1)}
.usp-item .ico-img,.eq .ico-img{transition:transform .6s cubic-bezier(.2,.9,.3,1.5),filter .22s}

/* ===== Mobile-First-Pass (90% Mobile-Traffic) ===== */
body{overflow-x:clip}
@media (max-width:560px){
  /* svh statt vh: stabile Hero-Höhe trotz ein-/ausblendender Mobile-Browserleiste */
  .hero{min-height:88svh}
  .subhero.tall{min-height:min(80svh,640px)}
  /* CTA-Gruppen: volle Breite, sauber gestapelt (Daumen-Reichweite) */
  .subhero .sub-cta,.closer-cta,.soon-links{flex-direction:column;align-items:stretch}
  .ctaband .cta-actions{width:100%;flex-direction:column;align-items:stretch}
  .subhero .sub-cta .btn,.closer-cta .btn,.soon-links .btn,.ctaband .cta-actions .btn{justify-content:center}
  .btnrow .btn{flex:1;justify-content:center}
  /* iOS-Zoom beim Fokussieren verhindern (Inputs >= 16px) */
  .cform input,.cform textarea,.cform select{font-size:16px}
  /* Platz für die Floating-CTA-Leiste am Seitenende */
  .foot-legal{padding-bottom:84px}
  .subhero .hero-stats{gap:1.4rem}
  .subhero .lead{font-size:1.02rem}
  .ap-foot{flex-direction:column;align-items:stretch}
  .ap-foot .btn{justify-content:center}
}

/* ===== 11.06 Feedback-Runde ===== */
/* Responsive Divider-Störer (GYM REPUBLIC u.a.): darf nie über den Rand laufen */
@media (max-width:980px){
  .divider{height:clamp(60px,12vw,150px)}
  .divider.flat{height:clamp(56px,9vw,110px)}
  .dword{font-size:clamp(1.9rem,9vw,5rem);animation:none}
}
@media (max-width:560px){
  .dword{font-size:clamp(1.55rem,8.2vw,2.7rem)}
  .dword .reg{vertical-align:1.3em}
}
/* Club-Seiten: „Das erwartet dich"-Kacheln nicht so breit ziehen */
.info-grid.narrow{max-width:980px;margin-inline:auto}
/* Teaser-Tiles (home): kurze Tagline-Zeile über der Beschreibung */
.tz-in .tz-tag{font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;font-stretch:88%;color:var(--tl);font-size:1.06rem;line-height:1.15;margin:0 0 .5rem;max-width:34ch}
/* Icon-Bilder in Info-Karten (z. B. /design statt Ziffern) */
.icard .ico-img{width:36px;height:36px;object-fit:contain;display:block;margin-bottom:.85rem;transition:filter .22s,transform .6s cubic-bezier(.2,.9,.3,1.5)}
.icard:hover .ico-img{filter:brightness(0)}
.icard:not(.in) .ico-img{transform:scale(.5)}.icard.in .ico-img{transform:scale(1)}
/* Footer: Agentur-Credit (i-group) */
.foot-credit{display:block;color:var(--tl-mut)}
.foot-credit a{color:var(--tl-mut);text-decoration:underline;text-underline-offset:2px;transition:color .15s}
.foot-credit a:hover{color:var(--yellow)}

/* ===== Wartelisten-Popup ("Zum Start informiert werden") ===== */
.wl-backdrop{position:fixed;inset:0;z-index:200;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(6,5,4,.74);backdrop-filter:blur(6px);opacity:0;transition:opacity .2s}
.wl-backdrop.in{opacity:1}
.wl-backdrop[hidden]{display:none}
.wl-panel{position:relative;width:100%;max-width:460px;max-height:92vh;overflow:auto;background:linear-gradient(180deg,var(--coal-3),var(--coal-2));border:1px solid var(--line-y);border-radius:16px;padding:30px 28px;box-shadow:0 30px 80px rgba(0,0,0,.6);transform:translateY(14px) scale(.97);transition:transform .22s}
.wl-backdrop.in .wl-panel{transform:none}
.wl-close{position:absolute;top:10px;right:12px;background:none;border:0;color:var(--tl-mut);font-size:1.3rem;cursor:pointer;line-height:1;padding:.25em;transition:color .15s}
.wl-close:hover{color:var(--yellow)}
.wl-badge{display:inline-block;font-family:'Archivo',sans-serif;font-weight:800;font-style:italic;text-transform:uppercase;letter-spacing:.12em;font-size:.62rem;color:#000;background:var(--yellow);border-radius:5px;padding:.32em .7em;margin-bottom:.9rem}
.wl-panel h2{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;font-stretch:80%;text-transform:uppercase;font-size:1.7rem;line-height:1;color:var(--tl);margin:0 0 .55rem}
.wl-panel h2 .y{color:var(--yellow)}
.wl-sub{color:var(--tl-mut);font-size:.92rem;line-height:1.5;margin-bottom:1.3rem}
.wl-form{max-width:none;gap:.95rem}
.wl-form[hidden]{display:none}
.wl-form .btn{width:100%;justify-content:center}
.wl-success{text-align:center;padding:.6rem 0 .4rem}
.wl-check{width:54px;height:54px;border-radius:50%;background:var(--yellow);color:#000;font-size:1.7rem;font-weight:900;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem}
.wl-success h3{font-family:'Archivo',sans-serif;font-weight:900;font-style:italic;text-transform:uppercase;font-size:1.5rem;color:var(--tl);margin-bottom:.4rem}
.wl-success p{color:var(--tl-mut);margin-bottom:1.4rem}
.wl-success .wl-city{color:var(--yellow)}
@media (max-width:560px){
  .wl-backdrop{padding:0;align-items:flex-end}
  .wl-panel{max-width:none;max-height:90svh;border-radius:18px 18px 0 0;border-bottom:0;padding:26px 20px 30px}
}

/* ===== 29.06 Feedback-Runde ===== */
/* USP-Strip (Home): Inline-SVG-Icon (Top Preis-Leistung) im CI-Gelb, Hover bleibt Schwarz */
.usp-item svg{color:var(--yellow)}
/* Scroll-Highlight: Headline der zentral stehenden Kachel CI-gelb (analog .pblock.active der Philosophie). JS toggelt .hot */
.hl-scroll .icard h4,.hl-scroll .acard h4{transition:color .3s ease}
.hl-scroll .icard.hot:not(:hover) h4,.hl-scroll .acard.hot:not(:hover) h4{color:var(--yellow)}

/* ===== 29.06 Feedback-Runde 2 ===== */
/* Section-Head-Headline: gelbes Wort (.y) solid einfärben (Default-Kontext hatte keine Regel → erbte Textfarbe) */
.sec-head h2 .y{color:var(--yellow)}
/* Info-Karten auf Mobile kompakter + lange Komposita sauber umbrechen (Headline-Schrift mobil-optimiert) */
@media (max-width:560px){
  .icard{padding:20px}
  .icard h4{font-size:1.02rem;overflow-wrap:break-word}
  .icard p{font-size:.9rem}
}

/* ===== 29.06c Feedback-Runde (Mobile-Responsive + Scroll-Highlight sichtbarer) ===== */
/* Home-Teaser-Kacheln (.tz): lange Headline ("Fitnesstraining") + Tagline/Body duerfen mobil nicht beschnitten werden */
@media (max-width:560px){
  .tz{padding:20px;min-height:360px}
  .tz-in h3{font-size:clamp(1.4rem,6.6vw,2rem);overflow-wrap:break-word}
  .tz-in .tz-tag{font-size:.96rem;max-width:none}
  .tz-in p{font-size:.9rem;max-width:none}
  /* Standort-Kacheln (.ltile): Staedtenamen ("Bergisch Gladbach", "Altenessen") passend skalieren statt abschneiden */
  .ltile-body{padding:14px}
  .ltile .city{font-size:clamp(1.15rem,4.6vw,1.55rem);overflow-wrap:break-word;margin-bottom:.55rem}
  .ltile .csbtn{font-size:.66rem;padding:.5em .8em}
}
/* Scroll-Highlight deutlicher machen: zentrierte Kachel zusaetzlich mit gelbem Rahmen (analog .pblock.active der Philosophie) */
.hl-scroll .icard.hot:not(:hover),.hl-scroll .acard.hot:not(:hover){border-color:var(--line-y);box-shadow:inset 0 0 0 1px rgba(244,225,22,.22)}
