/* ============================================================
   HEINRICH SPORTS — Design System (zentrale Quelle)
   Konvention: --surface/--gold etc., .nav-* / .card-* (wie Live-Markup)
   Eingebunden ueber includes/header.php. Footer-Styles: includes/footer.php
   ============================================================ */

/* ── RESET & BASE ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root {
  --bg:      #0A0A0A;
  --surface: #141414;
  --surf2:   #1C1C1C;
  --border:  #2A2A2A;
  --gold:    #cc9933;
  --gold-lt: #e0b040;
  --white:   #FFFFFF;
  --muted:   #888888;
  --muted2:  #555555;
}
html { scroll-behavior: smooth; }
body { font-family: "Montserrat", sans-serif; background: var(--bg); color: var(--white); overflow-x: hidden; }

/* ── SLASH BACKGROUND TEXTURE ─── */
.slash-texture {
  position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background-image: repeating-linear-gradient(
    72deg,
    transparent 0px, transparent 36px,
    rgba(204,153,51,.035) 36px, rgba(204,153,51,.035) 38px
  );
}

/* ── NAV ─── */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 0 48px; height: 72px;
  transition: background .3s, border-bottom .3s;
}
nav.scrolled, nav.solid {
  background: rgba(10,10,10,.95);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(12px);
}
.nav-logo { text-decoration: none !important; display: flex; align-items: center; border: none !important; outline: none; line-height: 0; font-size: 0; box-shadow: none !important; -webkit-tap-highlight-color: transparent; }
.nav-logo img { height: 52px; width: auto; display: block; border: none !important; outline: none; vertical-align: bottom; }
.nav-links { display: flex; gap: 36px; list-style: none; }
.nav-links a {
  text-decoration: none; color: var(--muted); font-size: 11px; font-weight: 600;
  letter-spacing: 1.5px; text-transform: uppercase; transition: color .2s; position: relative;
}
.nav-links a:hover { color: var(--white); }
.nav-links a.active { color: var(--white); }
.nav-links a.active::after {
  content: ""; position: absolute; bottom: -4px; left: 0; right: 0;
  height: 2px; background: var(--gold);
}
.nav-cta {
  padding: 10px 22px; border: 1px solid var(--white); color: var(--white); border-radius: 10px;
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  text-decoration: none; transition: background .2s, color .2s;
}
.nav-cta:hover { background: var(--white); color: #000; }
.nav-hamburger { display: none; flex-direction: column; gap: 5px; cursor: pointer; }
.nav-hamburger span { width: 24px; height: 2px; background: var(--white); }
.mobile-menu {
  position: fixed; top: 0; right: 0; bottom: 0; width: 280px;
  background: var(--surface); z-index: 200; padding: 80px 40px 40px;
  flex-direction: column; gap: 32px; border-left: 1px solid var(--border);
  transform: translateX(100%); transition: transform .3s; display: flex;
}
.mobile-menu.open { transform: translateX(0); }
.mobile-menu a { text-decoration: none; color: var(--muted); font-size: 13px; font-weight: 600; letter-spacing: 2px; text-transform: uppercase; }
.mobile-menu a:hover { color: var(--white); }
.mobile-close { position: absolute; top: 24px; right: 24px; background: none; border: none; color: var(--white); font-size: 24px; cursor: pointer; }
.mobile-menu a.active { color: var(--white); }
.mobile-menu a.active::after { content: ""; display: block; width: 28px; height: 2px; background: var(--gold); margin-top: 6px; }
.mobile-menu a.btn-primary { color: #fff; justify-content: center; }

/* ── SECTION LABEL WITH SLASH ─── */
.section-label { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.section-label .slash {
  font-size: 22px; font-weight: 900; color: var(--gold);
  font-style: italic; display: inline-block; transform: skewX(-8deg); line-height: 1;
}
.section-label .text { font-size: 10px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); }
.section-title { font-size: clamp(28px, 3.5vw, 44px); font-weight: 900; text-transform: uppercase; letter-spacing: -1px; line-height: 1; }

/* ── HERO ─── */
#hero {
  position: relative; min-height: 100vh;
  display: flex; align-items: center; overflow: hidden;
}
.hero-bg {
  position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(to right, #0A0A0A 35%, transparent 65%),
              linear-gradient(to top, #0A0A0A 0%, transparent 40%);
}
.hero-players {
  position: absolute; right: 0; top: 0; bottom: 0; width: 65%;
  background: linear-gradient(135deg, #1a1a1a 0%, #0d0d0d 100%);
  z-index: 1; overflow: hidden;
}
.hero-players::before {
  content: ""; position: absolute; inset: 0;
  background: radial-gradient(ellipse at 70% 40%, rgba(204,153,51,.07) 0%, transparent 60%),
              linear-gradient(to bottom, transparent 30%, rgba(10,10,10,.7) 100%);
  z-index: 2;
}
.hero-player-img {
  position: absolute; top: 0; bottom: 0;
  width: 25%; height: 100%;
  object-fit: cover; object-position: top center;
  filter: grayscale(30%) brightness(0.7);
  z-index: 1;
}
.hero-player-img:nth-child(3) { left: 0; }
.hero-player-img:nth-child(4) { left: 25%; }
.hero-player-img:nth-child(5) { left: 50%; }
.hero-player-img:nth-child(6) { left: 75%; }
.hero-splits { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero-splits::before, .hero-splits::after {
  content: ""; position: absolute; top: 0; bottom: 0; width: 1px;
  background: rgba(204,153,51,.12); transform: skewX(-8deg);
}
.hero-splits::before { left: 38%; }
.hero-splits::after  { left: 55%; }
.hero-content {
  position: relative; z-index: 3;
  padding: 160px 48px 80px; max-width: 580px;
}
.hero-title {
  font-size: clamp(36px, 5vw, 68px); font-weight: 900;
  line-height: .95; letter-spacing: -2px; text-transform: uppercase;
  margin-bottom: 28px;
}
.hero-sub { font-size: 14px; color: var(--muted); line-height: 1.7; margin-bottom: 44px; max-width: 400px; }
.hero-btns { display: flex; gap: 16px; flex-wrap: wrap; }
.btn-primary {
  display: inline-flex; align-items: center; gap: 10px;
  background: var(--gold); color: #000;
  padding: 14px 28px; font-size: 11px; font-weight: 700; border-radius: 10px;
  letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none;
  transition: background .2s, transform .15s;
}
.btn-primary:hover { background: var(--gold-lt); transform: translateY(-1px); }
.btn-ghost {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid rgba(255,255,255,.3); color: var(--white);
  padding: 14px 28px; font-size: 11px; font-weight: 700; border-radius: 10px;
  letter-spacing: 1.5px; text-transform: uppercase; text-decoration: none;
  transition: border-color .2s, background .2s;
}
.btn-ghost:hover { border-color: var(--white); background: rgba(255,255,255,.05); }
.jersey { position: absolute; bottom: 10%; font-size: 100px; font-weight: 900; color: rgba(255,255,255,.035); letter-spacing: -4px; line-height: 1; }
.j1 { left: 5%; } .j2 { left: 27%; } .j3 { left: 50%; } .j4 { left: 73%; }

/* ── SECTIONS ─── */
section { padding: 100px 48px; }
#clients { background: var(--bg); }
.section-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 48px; }
.view-all {
  font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase;
  color: var(--white); text-decoration: none;
  display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid var(--gold); padding-bottom: 2px; white-space: nowrap;
}

/* ── PLAYER CARDS (matched 1:1 with clients.php) ─── */
.players-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(205px,1fr)); gap: 18px; margin-bottom: 2px; }
.player-card {
  background: var(--surface); border: 1px solid var(--border); border-radius: 12px;
  cursor: pointer; transition: border-color .25s, transform .25s;
  position: relative; overflow: hidden; text-decoration: none; display: block; color: inherit;
}
.player-card:hover { border-color: var(--gold); transform: translateY(-3px); z-index: 2; }
.card-photo-wrap { position: relative; overflow: hidden; }
.player-photo {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; object-position: top center;
  display: block; filter: grayscale(20%); transition: filter .4s, transform .4s;
}
.player-card:hover .player-photo { filter: grayscale(0%); transform: scale(1.03); }
.player-photo-ph { width: 100%; aspect-ratio: 3/4; background: linear-gradient(to bottom, var(--surf2), var(--border)); }
.card-pos-badge { position: absolute; top: 10px; left: 10px; background: var(--gold); color: #000; font-size: 11px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; padding: 3px 8px; z-index: 3; }
.card-signed { position: absolute; top: 10px; right: 10px; background: rgba(10,10,10,.85); border: 1px solid var(--gold); color: var(--gold); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; text-transform: uppercase; padding: 3px 6px; z-index: 3; }
.card-ghost-slash { position: absolute; top: -12px; right: 8px; font-size: 80px; font-weight: 900; color: rgba(204,153,51,.06); font-style: italic; transform: skewX(-8deg); line-height: 1; pointer-events: none; user-select: none; z-index: 2; }
.card-meta { padding: 12px 16px 48px; position: relative; z-index: 1; height: 132px; overflow: hidden; }
.card-club { display: flex; align-items: flex-start; gap: 5px; font-size: 9px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; line-height: 1.4; height: 25px; overflow: hidden; }
.card-club img { flex-shrink: 0; margin-top: 1px; min-width: 20px; }
.card-club .club-text { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1; min-width: 0; }
.card-name-row { display: flex; align-items: flex-start; gap: 8px; margin-bottom: 8px; }
.card-slash { font-size: 38px; font-weight: 900; color: var(--gold); font-style: italic; transform: skewX(-8deg); flex-shrink: 0; line-height: 1; align-self: stretch; display: flex; align-items: center; padding-right: 6px; }
.card-name { font-size: 13px; font-weight: 800; text-transform: uppercase; line-height: 1.15; color: var(--white); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.card-height { position: absolute; bottom: 0; left: 0; right: 0; font-size: 12px; color: var(--muted); font-weight: 600; border-top: 1px solid var(--border); padding: 8px 16px 8px 42px; display: flex; align-items: center; gap: 6px; line-height: 1; background: var(--surface); }
.card-height span { color: var(--white); font-weight: 700; line-height: 1; }
.card-height .sep { color: var(--border); font-weight: 400; line-height: 1; }
.card-nat-flag { margin-left: auto; display: flex; align-items: center; }
.player-dots { display: flex; gap: 8px; justify-content: center; padding: 24px 0 0; }
.dot { width: 32px; height: 2px; background: var(--border); cursor: pointer; transition: background .2s, width .2s; }
.dot.active { background: var(--gold); width: 48px; }

/* ── STATS BAR ─── */
.stats-bar {
  background: var(--surface);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  border-radius: 12px 12px 0 0;
  display: grid; grid-template-columns: repeat(4,1fr); position: relative; overflow: hidden;
  margin: 0 48px;
}
.stats-bar .slash-texture { opacity: .7; }
.stat-item {
  padding: 44px 32px; display: flex; align-items: center; gap: 20px;
  border-right: 1px solid var(--border); position: relative; z-index: 1;
}
.stat-item:last-child { border-right: none; }
.stat-icon { width: 44px; height: 44px; border: 1px solid var(--border); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.stat-icon svg { width: 22px; height: 22px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
.stat-num { font-size: 36px; font-weight: 900; line-height: 1; }
.stat-num span { color: var(--gold); }
.stat-label { font-size: 10px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--gold); }
.stat-desc { font-size: 11px; color: var(--muted); margin-top: 2px; }

/* ── SERVICES ─── */
#services { background: #FFFFFF; position: relative; overflow: hidden; }
.services-grid { display: grid; grid-template-columns: 1fr 3fr; gap: 60px; align-items: start; }
.services-left p { font-size: 13px; color: #555555; line-height: 1.8; margin-bottom: 32px; max-width: 280px; }
.services-cards { display: grid; grid-template-columns: repeat(5,1fr); gap: 10px; align-self: center; }
.service-card {
  background: #f7f7f7; padding: 32px 24px; border-radius: 14px;
  border: 1px solid #e0e0e0; transition: border-color .2s, background .2s;
}
.service-card:hover { border-color: var(--gold); background: #efefef; }
.service-icon { width: 48px; height: 48px; margin-bottom: 24px; display: flex; align-items: center; justify-content: center; }
.service-icon svg { width: 28px; height: 28px; stroke: var(--gold); fill: none; stroke-width: 1.5; }
.service-name { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; color: #111111; }
.service-desc { font-size: 12px; color: #666666; line-height: 1.7; }

/* ── NEWS ─── */
#news { background: var(--bg); }
.news-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.news-card {
  display: grid; grid-template-columns: 110px 1fr; gap: 16px;
  background: var(--surface); border: 1px solid var(--border); padding: 20px; border-radius: 14px;
  cursor: pointer; transition: border-color .2s; text-decoration: none; color: inherit;
}
.news-card:hover { border-color: var(--gold); }
.news-img {
  width: 110px; height: 110px; background: var(--surf2);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  overflow: hidden; border-radius: 10px;
}
.news-img img { width: 100%; height: 100%; object-fit: cover; }
.news-img svg { width: 28px; height: 28px; stroke: var(--muted2); fill: none; stroke-width: 1; }
.news-date { font-size: 10px; font-weight: 700; color: var(--gold); letter-spacing: 2px; margin-bottom: 8px; text-transform: uppercase; }
.news-title { font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: .3px; line-height: 1.3; margin-bottom: 8px; }
.news-body { font-size: 11px; color: var(--muted); line-height: 1.6; }
.news-arrow { margin-top: 10px; font-size: 15px; color: var(--gold); font-style: italic; }

/* ── PAGE HEADER (Innenseiten) ─── */
.page-header{padding:140px 48px 60px;min-height:340px;border-bottom:1px solid var(--border);display:flex;align-items:flex-end;justify-content:space-between;gap:48px;position:relative;overflow:hidden;}
.page-header::before{content:"";position:absolute;inset:0;background-image:repeating-linear-gradient(72deg,transparent 0px,transparent 36px,rgba(204,153,51,.045) 36px,rgba(204,153,51,.045) 38px);}
.page-header>*{position:relative;z-index:1;}
.page-header__label{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.page-header__label .slash{font-size:22px;font-weight:900;color:var(--gold);font-style:italic;transform:skewX(-8deg);display:inline-block;line-height:1;}
.page-header__label .text{font-size:10px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--gold);}
.page-header__title{font-size:clamp(28px,4vw,52px);font-weight:900;text-transform:uppercase;letter-spacing:-1px;line-height:1;}
.page-header__desc{max-width:320px;font-size:13px;color:var(--muted);line-height:1.7;flex-shrink:0;}

/* ── FILTER BAR ─── */
.filter-bar{padding:20px 48px;display:flex;align-items:center;gap:12px;flex-wrap:wrap;border-bottom:1px solid var(--border);background:var(--surface);position:sticky;top:72px;z-index:50;}
.filter-search{display:flex;align-items:center;gap:10px;background:var(--bg);border:1px solid var(--border);padding:10px 16px;flex:1;min-width:180px;max-width:280px;border-radius:10px;}
.filter-search svg{width:14px;height:14px;stroke:var(--muted2);fill:none;stroke-width:2;flex-shrink:0;}
.filter-search input{background:none;border:none;outline:none;font-family:"Montserrat",sans-serif;font-size:11px;color:var(--white);width:100%;}
.filter-search input::placeholder{color:var(--muted2);}
.filter-select{background:var(--bg);border:1px solid var(--border);color:var(--muted);font-family:"Montserrat",sans-serif;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:10px 32px 10px 14px;cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%23555'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;transition:border-color .2s,color .2s;border-radius:10px;}
.filter-select:hover,.filter-select:focus{border-color:var(--muted);color:var(--white);outline:none;}
.filter-divider{width:1px;height:20px;background:var(--border);flex-shrink:0;}
.filter-sort-label{font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted2);white-space:nowrap;}
.filter-view{display:flex;gap:4px;margin-left:auto;}
.filter-view-btn{width:32px;height:32px;border:1px solid var(--border);background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--muted2);border-radius:10px;transition:all .2s;}
.filter-view-btn.active,.filter-view-btn:hover{border-color:var(--gold);color:var(--gold);}
.filter-view-btn svg{width:14px;height:14px;}

/* ── PLAYERS WRAP ─── */
.players-wrap{padding:48px;}

/* ── LIST VIEW ─── */
.players-grid.list-view { grid-template-columns: 1fr; gap: 1px; }
.players-grid.list-view .card-photo-wrap,
.players-grid.list-view .card-ghost-slash,
.players-grid.list-view .card-pos-badge,
.players-grid.list-view .card-signed,
.players-grid.list-view .card-meta { display: none; }
.players-grid.list-view .player-card {
  display: grid;
  grid-template-columns: 64px 1fr 80px 110px 1fr 120px;
  align-items: center;
  gap: 0;
  padding: 0;
  min-height: 68px;
  border-radius: 0;
  transform: none !important;
  border-left: none; border-right: none; border-top: none;
}
.players-grid.list-view .player-card:first-child { border-top: 1px solid var(--border); }
.players-grid.list-view .player-card:hover { transform: none !important; }
.list-photo { width: 56px; height: 68px; object-fit: cover; object-position: top center; display: none; flex-shrink: 0; }
.list-photo-ph { width: 56px; height: 68px; background: var(--surf2); display: none; }
.players-grid.list-view .list-photo,
.players-grid.list-view .list-photo-ph { display: block; }
.list-slash { display: none; font-size: 20px; font-weight: 900; color: var(--gold); font-style: italic; transform: skewX(-8deg); justify-self: center; padding: 0 6px; }
.players-grid.list-view .list-slash { display: none; }
.list-nameblock { display: none; padding: 0 20px; border-left: 3px solid var(--gold); margin-left: 16px; }
.players-grid.list-view .list-nameblock { display: block; }
.list-name { font-size: 13px; font-weight: 800; text-transform: uppercase; color: var(--white); line-height: 1.2; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.list-pos  { font-size: 10px; font-weight: 600; text-transform: uppercase; color: var(--muted); letter-spacing: .5px; white-space: nowrap; }
.list-pos-sep { color: var(--border); font-size: 10px; }
.list-nation { display: none; justify-content: center; border-left: 1px solid var(--border); }
.players-grid.list-view .list-nation { display: flex; align-items: center; justify-content: center; }
.list-nation img { height: 16px; }
.list-height { display: none; padding: 0 16px; border-left: 1px solid var(--border); }
.players-grid.list-view .list-height { display: flex; align-items: center; gap: 0; }
.list-height-val { font-size: 12px; font-weight: 700; color: var(--white); }
.list-height-lbl { font-size: 9px; color: var(--muted2); text-transform: uppercase; letter-spacing: 1px; }
.list-h-num { font-size: 12px; font-weight: 700; color: var(--white); }
.list-h-unit { font-size: 9px; font-weight: 400; color: var(--muted2); margin-left: 4px; }
.list-h-sep { font-size: 11px; font-weight: 300; color: var(--border); margin: 0 5px; }
.list-club { display: none; padding: 0 16px; border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
.players-grid.list-view .list-club { display: flex; flex-direction: column; justify-content: center; gap: 4px; }
.list-club-name { display: flex; align-items: center; gap: 6px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .5px; color: var(--white); }
.list-club-name img { height: 12px; }
.list-status { display: inline-flex; align-items: center; gap: 4px; }
.list-status-dot { width: 5px; height: 5px; border-radius: 50%; }
.list-status-dot.signed    { background: var(--gold); }
.list-status-dot.available { background: #44bb66; }
.list-status-label { font-size: 8px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; }
.list-status-label.signed    { color: var(--gold); }
.list-status-label.available { color: #44bb66; }
.list-statusbox { display: none; justify-content: flex-start; align-items: center; padding: 0 16px; }
.players-grid.list-view .list-statusbox { display: flex; }
.list-badge { font-size: 9px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; padding: 4px 8px; border: 1px solid; }
.list-badge.signed    { color: var(--gold); border-color: var(--gold); }
.list-badge.available { color: #44bb66;     border-color: #44bb66; }
.list-arrow { display: none; color: var(--gold); font-size: 16px; opacity: 0; transition: opacity .2s; justify-self: center; }
.players-grid.list-view .list-arrow { display: none; }
.player-card:hover .list-arrow { opacity: 1; }
.list-header { display: none; grid-template-columns: 64px 1fr 80px 110px 1fr 120px; gap: 0; padding: 10px 0; background: var(--surf2); border-bottom: 1px solid var(--border); border-radius: 12px 12px 0 0; overflow: hidden; }
.list-header span { font-size: 9px; font-weight: 800; letter-spacing: 2px; text-transform: uppercase; color: var(--muted); padding: 0 8px; }
.list-header span.lh-center { text-align: center; }
.list-header span:nth-child(5) { border-left: 1px solid var(--border); border-right: 1px solid var(--border); }
.list-header span:nth-child(4) { border-left: 1px solid var(--border); }
.list-header span:nth-child(3) { border-left: 1px solid var(--border); }
.players-wrap.is-list .list-header { display: grid; }
.no-results{text-align:center;padding:80px 0;color:var(--muted);}
.no-results strong{display:block;font-size:20px;font-weight:900;text-transform:uppercase;color:var(--white);margin-bottom:8px;}

/* ── HOVER OVERLAY (Desktop) ─── */
.player-overlay{position:fixed;z-index:500;width:540px;display:none;flex-direction:row;background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 20px 80px rgba(0,0,0,.85);pointer-events:none;opacity:0;transform:scale(.97);transition:opacity .18s ease,transform .18s ease;overflow:hidden;}
.player-overlay.visible{opacity:1;transform:scale(1);pointer-events:all;display:flex;}
.overlay-photo-col{position:relative;width:200px;flex-shrink:0;background:var(--bg);overflow:hidden;}
.overlay-photo{width:100%;height:100%;object-fit:cover;object-position:top center;display:block;}
.overlay-photo-ph{width:100%;height:100%;min-height:380px;background:linear-gradient(to bottom,var(--surf2),var(--bg));display:flex;align-items:center;justify-content:center;}
.overlay-photo-ph svg{width:48px;height:48px;stroke:var(--border);}
.overlay-photo-grad{position:absolute;top:0;right:0;bottom:0;width:32px;background:linear-gradient(to right,transparent,var(--surface));}
.overlay-info{flex:1;padding:24px 20px 20px;display:flex;flex-direction:column;overflow:hidden;min-height:380px;}
.overlay-club{font-size:9px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--gold);margin-bottom:10px;}
.overlay-name{font-size:22px;font-weight:900;text-transform:uppercase;letter-spacing:-0.5px;line-height:.92;margin-bottom:6px;}
.overlay-pos{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin-bottom:14px;}
.overlay-phys{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border);margin-bottom:12px;border-radius:10px;overflow:hidden;}
.overlay-phys-item{background:var(--surf2);padding:10px 4px;display:flex;flex-direction:column;align-items:center;justify-content:center;}
.overlay-phys-val{font-size:12px;font-weight:900;line-height:1;min-height:20px;display:flex;align-items:center;justify-content:center;}
.overlay-phys-lbl{font-size:7px;font-weight:700;letter-spacing:.5px;text-transform:uppercase;color:var(--muted2);margin-top:4px;height:12px;display:flex;align-items:center;}
.overlay-stats{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;margin-top:6px;padding-bottom:14px;border-bottom:1px solid var(--border);}
.overlay-stats .stat-block{text-align:center;flex:1;position:relative;}
.overlay-stats .stat-block:not(:last-child)::after{content:"";position:absolute;right:0;top:15%;bottom:15%;width:1px;background:var(--border);}
.overlay-stats .stat-val{font-size:18px;font-weight:900;color:var(--white);line-height:1;display:block;}
.overlay-stats .stat-lbl{font-size:8px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted2);display:block;margin-top:3px;}
.overlay-signed{display:inline-block;border:1px solid var(--gold);color:var(--gold);font-size:8px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;padding:3px 8px;margin-bottom:10px;}
.overlay-divider{height:1px;background:var(--border);margin:10px 0;}
.overlay-attributes{min-height:0;display:flex;flex-wrap:wrap;gap:6px;align-items:flex-start;margin:0 0 14px;}
.ov-skill{display:inline-flex;align-items:center;gap:6px;background:var(--surf2);border:1px solid var(--border);border-radius:7px;padding:5px 9px 5px 7px;}
.ov-skill img{height:17px;width:auto;display:block;flex-shrink:0;}
.ov-skill span{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.4px;color:var(--white);white-space:nowrap;}
.overlay-btn{display:flex;align-items:center;justify-content:center;gap:10px;background:var(--gold);color:#000;padding:13px;font-size:10px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;text-decoration:none;border-radius:10px;transition:background .2s;margin-top:auto;flex-shrink:0;}
.overlay-btn:hover{background:var(--gold-lt);}
@media(max-width:900px){.player-overlay{display:none !important;}}

/* ── BOTTOM STATS (Innenseiten) ─── */
.bottom-stats{position:relative;overflow:hidden;background:var(--surface);border:1px solid var(--border);border-radius:12px;margin:0 48px 56px;display:grid;grid-template-columns:repeat(4,1fr);}
.bottom-stats::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(72deg,transparent 0px,transparent 36px,rgba(204,153,51,.04) 36px,rgba(204,153,51,.04) 38px);}
.bottom-stat{position:relative;z-index:1;padding:40px 48px;border-right:1px solid var(--border);display:flex;align-items:center;gap:16px;}
.bottom-stat:last-child{border-right:none;}
.bottom-stat svg{width:22px;height:22px;stroke:var(--gold);fill:none;stroke-width:1.5;flex-shrink:0;}
.bottom-stat__num{font-size:28px;font-weight:900;line-height:1;}
.bottom-stat__label{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--muted2);margin-top:3px;}

/* ── ANIMATIONS ─── */
@keyframes fadeUp { from { opacity:0; transform:translateY(24px); } to { opacity:1; transform:none; } }
.hero-content > * { opacity: 0; animation: fadeUp .8s ease forwards; }
.section-label { animation-delay: .05s; }
.hero-title     { animation-delay: .2s; }
.hero-sub       { animation-delay: .35s; }
.hero-btns      { animation-delay: .5s; }
.reveal { opacity: 0; transform: translateY(20px); transition: opacity .6s ease, transform .6s ease; }
.reveal.visible { opacity: 1; transform: none; }

/* ── RESPONSIVE ─── */
/* Footer-Responsiveness liegt in includes/footer.php */
@media (max-width: 1100px) { .players-grid { grid-template-columns: repeat(3,1fr); } }
@media (max-width: 900px) {
  nav .nav-links, nav .nav-cta { display: none; }
  .nav-hamburger { display: flex; }
  .services-grid { grid-template-columns: 1fr; gap: 40px; }
  .services-cards { grid-template-columns: repeat(2,1fr); }
  .news-grid { grid-template-columns: 1fr; }
  .stats-bar { grid-template-columns: repeat(2, minmax(0,1fr)); margin: 0 24px; }
  .stat-item > div { min-width: 0; }
  .page-header { padding: 120px 24px 40px; min-height: auto; flex-direction: column; align-items: flex-start; gap: 20px; }
  .filter-bar { padding: 16px 24px; }
  .players-wrap { padding: 24px; }
  .bottom-stats { grid-template-columns: repeat(2,1fr); margin: 0 24px 40px; }
}
@media (max-width: 640px) {
  section { padding: 72px 24px; }
  nav { padding: 0 24px; }
  .hero-content { padding: 140px 24px 60px; }
  .players-grid { grid-template-columns: repeat(2,1fr); }
  /* Hero: mobil nur 2 Spielerbilder, fuellen das Panel (Desktop bleibt 4) */
  .hero-player-img { width: 50%; }
  .hero-player-img:nth-child(3) { left: 0; }
  .hero-player-img:nth-child(4) { left: 50%; }
  .hero-player-img:nth-child(5),
  .hero-player-img:nth-child(6) { display: none; }
  /* Stats-Bar: Icon ueber Text, kompakter -> nichts wird rechts abgeschnitten */
  .stat-item { flex-direction: column; align-items: flex-start; gap: 14px; padding: 28px 20px; }
  .stat-num { font-size: 30px; }
  /* Bottom-Stats kompakter */
  .bottom-stat { padding: 24px; }
  /* Filterleiste mobil: 2 Reihen statt 3 (Suche+View, dann Selects) */
  .filter-bar { gap: 10px; }
  .filter-search { flex: 1 1 auto; min-width: 0; max-width: none; order: 1; }
  .filter-view { order: 2; margin-left: 0; }
  .filter-divider, .filter-sort-label { display: none; }
  .filter-select { order: 3; flex: 1 1 0; min-width: 0; }
  /* List-View mobil: Foto | Name/Pos | Status; Name/Pos darf umbrechen, Status bleibt sichtbar */
  .players-wrap.is-list .list-header { display: none; }
  .players-grid.list-view .player-card { grid-template-columns: 48px minmax(0,1fr) auto; min-height: 60px; }
  .players-grid.list-view .list-photo,
  .players-grid.list-view .list-photo-ph { width: 48px; height: 60px; }
  .players-grid.list-view .list-nation,
  .players-grid.list-view .list-height,
  .players-grid.list-view .list-club { display: none; }
  .players-grid.list-view .list-nameblock { margin-left: 12px; padding: 0 12px; min-width: 0; }
  .players-grid.list-view .list-pos { white-space: normal; }
  .players-grid.list-view .list-statusbox { padding: 0 12px; flex-shrink: 0; }
}

/* ===== SERVICES PAGE ===== */
.svc-sec { padding: 110px 6vw; position:relative; overflow:hidden; }
.svc-sec--light { background: #f4f3f1; color: #0a0a0a; }
.svc-sec--dark  { background: var(--bg); }
.svc-sec__inner { position:relative; z-index:1; }
.svc-threads { position:absolute; inset:0; pointer-events:none; z-index:0; background-image: repeating-linear-gradient(72deg, transparent 0px, transparent 36px, rgba(204,153,51,.045) 36px, rgba(204,153,51,.045) 38px); }
.svc-label { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.svc-label .slash { font-size:22px; font-weight:900; font-style:italic; transform:skewX(-8deg); display:inline-block; line-height:1; color:var(--gold); }
.svc-label .text { font-size:10px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }
.svc-h2 { font-size: clamp(28px, 4vw, 46px); font-weight: 900; text-transform: uppercase; letter-spacing:-1.5px; line-height: 1.02; }
.svc-sec--light .svc-h2 { color:#0a0a0a; }

.svc-hero { position:relative; display:flex; align-items:flex-end; padding: 140px 6vw 60px; min-height:340px; overflow:hidden; background:#0c0c0c; border-bottom:1px solid var(--border); }
.svc-hero::before { content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(72deg, transparent 0px, transparent 36px, rgba(204,153,51,.05) 36px, rgba(204,153,51,.05) 38px); }
.svc-hero__inner { position:relative; z-index:2; width:100%; display:flex; align-items:flex-end; justify-content:space-between; gap:48px; }
.svc-hero h1 { font-size: clamp(28px, 4vw, 52px); font-weight:900; line-height:1; letter-spacing:-1px; text-transform:uppercase; }
.svc-hero__desc { max-width:320px; font-size:13px; line-height:1.7; color:var(--muted); flex-shrink:0; }

.svc-core__grid { display:grid; grid-template-columns: repeat(5,1fr); gap:16px; margin-top:48px; }
.svc-card { background:#fff; border:1px solid #c7c3ba; border-radius:12px; overflow:hidden; display:flex; flex-direction:column; transition:border-color .25s; }
.svc-card:hover { border-color:var(--gold); }
.svc-card__head { position:relative; background:#0d0d0d; padding:22px 18px 18px; overflow:hidden; }
.svc-card__ghost { position:absolute; top:-16px; right:4px; font-size:74px; font-weight:900; font-style:italic; color:rgba(204,153,51,.10); transform:skewX(-8deg); line-height:1; pointer-events:none; user-select:none; }
.svc-card__icon { position:relative; width:30px; height:30px; color:var(--gold); margin-bottom:14px; }
.svc-card__icon svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.svc-card__title { position:relative; font-size:13px; font-weight:800; text-transform:uppercase; letter-spacing:.3px; color:#fff; line-height:1.25; }
.svc-card__body { padding:30px 18px 26px; }
.svc-card__desc { font-size:12px; line-height:1.6; color:#666; }

.svc-proc { display:grid; grid-template-columns: .8fr 1.4fr; gap:64px; align-items:start; }
.svc-proc__intro p { font-size:15px; line-height:1.85; color:var(--muted); margin-top:22px; max-width:340px; }
.svc-steps { display:grid; grid-template-columns: repeat(5,1fr); gap:18px; position:relative; }
.svc-steps::before { content:""; position:absolute; top:18px; left:6%; right:6%; height:1px; background:var(--border); }
.svc-step { position:relative; text-align:center; }
.svc-step__num { width:38px; height:38px; border-radius:50%; background:var(--bg); border:1px solid var(--gold); color:var(--gold); font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center; margin:0 auto 22px; position:relative; z-index:1; }
.svc-step__icon { width:30px; height:30px; color:#fff; margin:0 auto 12px; }
.svc-step__icon svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.6; }
.svc-step__title { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px; }
.svc-step__desc { font-size:11.5px; line-height:1.6; color:var(--muted); }

.svc-net { display:grid; grid-template-columns: 1.15fr 1fr; gap:56px; align-items:center; }
.svc-net__stats { display:grid; grid-template-columns:1fr 1fr; gap:34px 28px; margin:38px 0 34px; }
.svc-net__num { font-size:clamp(30px,3.4vw,46px); font-weight:900; color:var(--gold); letter-spacing:-1px; line-height:1; }
.svc-net__lbl { font-size:11px; font-weight:700; letter-spacing:1.2px; text-transform:uppercase; color:#555; margin-top:8px; }
.svc-net__btn { display:inline-flex; align-items:center; gap:10px; background:#0a0a0a; color:#fff; padding:14px 28px; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; border-radius:8px; transition:background .2s; }
.svc-net__btn:hover { background:var(--gold); color:#000; }
.svc-net__map svg { width:100%; height:auto; }

.svc-phil { display:grid; grid-template-columns: 1.1fr 1fr; gap:60px; align-items:center; }
.svc-phil__media { height:440px; border-radius:16px; overflow:hidden; background:linear-gradient(135deg,#1a1a1a,#0c0c0c); border:1px solid var(--border); position:relative; }
.svc-phil__media img { width:100%; height:100%; object-fit:cover; filter:grayscale(100%); display:block; }
.svc-phil__panel { position:relative; width:100%; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:24px; padding:24px; overflow:hidden; }
.svc-phil__ghost { position:absolute; top:-40px; right:0; font-size:210px; font-weight:900; font-style:italic; color:rgba(204,153,51,.07); transform:skewX(-8deg); line-height:1; pointer-events:none; user-select:none; }
.svc-phil__ball { width:150px; height:150px; color:var(--gold); position:relative; z-index:1; }
.svc-phil__cap { text-align:center; position:relative; z-index:1; }
.svc-phil__cap-top { font-size:9px; font-weight:700; letter-spacing:2.5px; text-transform:uppercase; color:var(--gold); margin-bottom:8px; }
.svc-phil__cap-main { font-size:19px; font-weight:900; text-transform:uppercase; letter-spacing:-.5px; color:#fff; line-height:1; }
.svc-phil p.lead { font-size:15px; line-height:1.85; color:var(--muted); margin:22px 0 36px; max-width:480px; }
.svc-pillars { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
.svc-pillar__ic { width:30px; height:30px; color:var(--gold); margin-bottom:12px; }
.svc-pillar__ic svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.6; }
.svc-pillar__t { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:1px; margin-bottom:8px; }
.svc-pillar__d { font-size:12.5px; line-height:1.65; color:var(--muted); }

.svc-cta2 { display:grid; grid-template-columns: 1fr 1fr; gap:40px; align-items:center; }
.svc-cta2 .svc-h2 { color:#0a0a0a; }
.svc-cta2 p { font-size:15px; line-height:1.8; color:#555; margin-bottom:26px; }
.svc-cta2__btns { display:flex; gap:14px; }
.svc-btn { display:inline-flex; align-items:center; gap:10px; padding:15px 30px; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; border-radius:8px; transition:all .2s; }
.svc-btn--gold { background:#0a0a0a; color:#fff; }
.svc-btn--gold:hover { background:var(--gold); color:#000; }
.svc-btn--ghost { background:transparent; color:#0a0a0a; border:1px solid #c9c7c2; }
.svc-btn--ghost:hover { border-color:#0a0a0a; }

@media (max-width: 1000px) {
  .svc-hero { padding:120px 6vw 44px; min-height:auto; }
  .svc-hero__inner { flex-direction:column; align-items:flex-start; gap:18px; }
  .svc-hero__desc { max-width:none; padding-bottom:0; }
  .svc-core__grid { grid-template-columns: repeat(2,1fr); }
  .svc-proc, .svc-net, .svc-phil, .svc-cta2 { grid-template-columns:1fr; gap:36px; }
  .svc-net__map { order:-1; }
  .svc-steps { grid-template-columns: repeat(2,1fr); gap:30px; }
  .svc-steps::before { display:none; }
  .svc-phil__media { height:300px; order:-1; }
}
@media (max-width: 560px){ .svc-core__grid, .svc-steps, .svc-net__stats, .svc-pillars { grid-template-columns:1fr; } }

/* ===== NEWS PAGE (news.php) ===== */
.news-section { padding: 64px 48px; }

/* Listenkarte (eigener Namespace, unabhaengig von der Startseiten-.news-card) */
.np-card { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; display: grid; grid-template-columns: 120px 1fr; gap: 20px; padding: 20px; text-decoration: none; color: inherit; transition: border-color .2s; cursor: pointer; }
.np-card:hover { border-color: var(--gold); }
.np-card.featured { grid-template-columns: 1fr; grid-column: span 2; }
.np-card__img { width: 120px; height: 120px; background: var(--surf2); overflow: hidden; flex-shrink: 0; border-radius: 10px; }
.np-card.featured .np-card__img { width: 100%; height: 200px; }
.np-card__img img { width: 100%; height: 100%; object-fit: cover; object-position: center 28%; filter: grayscale(20%); transition: filter .3s; }
.np-card:hover .np-card__img img { filter: grayscale(0%); }
.np-card__img-ph { width: 100%; height: 100%; background: var(--surf2); display: flex; align-items: center; justify-content: center; }
.np-card__img-ph svg { width: 28px; height: 28px; stroke: var(--muted2); fill: none; }
.np-card__body { display: flex; flex-direction: column; }
.np-card__date { font-size: 10px; font-weight: 700; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 8px; }
.np-card__title { font-size: 13px; font-weight: 800; text-transform: uppercase; line-height: 1.3; margin-bottom: 8px; }
.np-card.featured .np-card__title { font-size: 16px; }
.np-card__excerpt { font-size: 11px; color: var(--muted); line-height: 1.65; flex: 1; }
.np-card__arrow { margin-top: 12px; font-size: 14px; color: var(--gold); transition: transform .2s; display: inline-block; }
.np-card:hover .np-card__arrow { transform: translateX(4px); }

/* Pager (Archiv) */
.news-pager { display: flex; align-items: center; justify-content: center; gap: 18px; margin-top: 48px; }
.news-pager__btn { display: inline-flex; align-items: center; gap: 8px; padding: 11px 22px; border: 1px solid var(--border); border-radius: 10px; color: var(--white); text-decoration: none; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; transition: border-color .2s, color .2s; }
.news-pager__btn:hover { border-color: var(--gold); color: var(--gold); }
.news-pager__btn.is-disabled { color: var(--muted2); opacity: .5; pointer-events: none; }
.news-pager__info { font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); }

/* Einzelartikel */
.news-detail { padding: 64px 48px; max-width: none; }
.news-detail__back { display: inline-flex; align-items: center; gap: 8px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); text-decoration: none; margin-bottom: 40px; transition: color .2s; }
.news-detail__back:hover { color: var(--gold); }
.news-detail__main { display: grid; grid-template-columns: minmax(0, 400px) 1fr; gap: 44px; align-items: start; }
.news-detail__main.no-img { grid-template-columns: 1fr; }
.news-detail__media img { width: 100%; height: auto; display: block; border-radius: 8px; filter: grayscale(10%); position: sticky; top: 100px; }
.news-detail__date { font-size: 11px; font-weight: 700; color: var(--gold); letter-spacing: 2px; text-transform: uppercase; margin-bottom: 16px; }
.news-detail__title { font-size: clamp(22px, 3vw, 36px); font-weight: 900; text-transform: uppercase; letter-spacing: -1px; line-height: 1.05; margin-bottom: 28px; }
.news-detail__body { font-size: 14px; color: var(--muted); line-height: 1.9; }
.news-detail__body p { margin-bottom: 20px; }
/* Links im Artikel: Goldton statt Browser-Blau/Violett (auch :visited) */
.news-detail__body a { color: var(--gold); text-decoration: underline; text-underline-offset: 2px; transition: color .2s; }
.news-detail__body a:visited { color: var(--gold); }
.news-detail__body a:hover { color: var(--gold-lt); }
.news-detail__copyright { font-size: 11px; color: var(--muted2); margin-top: 32px; padding-top: 20px; border-top: 1px solid var(--border); }

@media (max-width: 900px) {
  .news-section, .news-detail { padding: 100px 24px 48px; }
  .news-detail__main { grid-template-columns: 1fr; gap: 24px; }
  .news-detail__media img { position: static; max-width: 420px; }
  .np-card.featured { grid-column: span 1; }
}
@media (max-width: 600px) {
  .np-card { grid-template-columns: 1fr; }
  .np-card__img { width: 100%; height: 180px; }
  .news-pager { gap: 12px; }
  .news-pager__btn { padding: 10px 16px; }
}

/* ============================================================
   ABOUT PAGE
   ============================================================ */
.page-title { font-size: clamp(32px, 5vw, 64px); font-weight: 900; text-transform: uppercase; letter-spacing: -2px; line-height: .95; }

.ab-sec { padding: 100px 6vw; position:relative; overflow:hidden; }
.ab-sec--light { background:#f4f3f1; color:#0a0a0a; }
.ab-sec--dark  { background:var(--bg); }
.ab-sec__inner { position:relative; z-index:1; }
.ab-threads { position:absolute; inset:0; pointer-events:none; z-index:0; background-image: repeating-linear-gradient(72deg, transparent 0px, transparent 36px, rgba(204,153,51,.045) 36px, rgba(204,153,51,.045) 38px); }
.ab-label { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.ab-label .slash { font-size:22px; font-weight:900; font-style:italic; transform:skewX(-8deg); display:inline-block; line-height:1; color:var(--gold); }
.ab-label .text { font-size:10px; font-weight:700; letter-spacing:3px; text-transform:uppercase; color:var(--gold); }
.ab-h2 { font-size:clamp(26px,3.6vw,42px); font-weight:900; text-transform:uppercase; letter-spacing:-1.5px; line-height:1.04; }
.ab-sec--light .ab-h2 { color:#0a0a0a; }

.ab-story { display:grid; grid-template-columns: 1fr 1.05fr; gap:54px; align-items:center; }
.ab-story__text p { font-size:14px; line-height:1.85; color:#555; margin-top:16px; max-width:440px; }
.ab-story__text p strong { color:#0a0a0a; }
.ab-story__collage { display:grid; grid-template-columns: 1.5fr 1fr; grid-template-rows: repeat(3, 92px); gap:12px; }
.ab-photo { background:#141414 center/cover no-repeat; border:1px solid #d9d6d0; border-radius:10px; }
.ab-sec--dark .ab-photo { border-color:var(--border); }
.ab-photo--big { grid-row:1 / span 3; }
.ab-story__panel { position:relative; overflow:hidden; background:#0d0d0d; border:1px solid var(--border); border-radius:14px; padding:56px 46px; display:flex; flex-direction:column; justify-content:center; min-height:300px; }
.ab-story__panel::before { content:""; position:absolute; inset:0; background-image: repeating-linear-gradient(72deg, transparent 0 34px, rgba(204,153,51,.05) 34px 36px); }
.ab-story__slash { position:absolute; top:-34px; right:-4px; font-size:200px; font-weight:900; font-style:italic; color:rgba(204,153,51,.08); transform:skewX(-8deg); line-height:1; pointer-events:none; user-select:none; }
.ab-story__quote { position:relative; font-size:clamp(20px,2.3vw,30px); font-weight:800; line-height:1.3; color:#fff; letter-spacing:-.5px; }
.ab-story__quote .gold { color:var(--gold); }
.ab-story__tags { position:relative; margin-top:24px; font-size:11px; font-weight:700; letter-spacing:2px; text-transform:uppercase; color:var(--gold); }

.ab-values { display:grid; grid-template-columns: .8fr 1.6fr; gap:56px; align-items:center; }
.ab-pillars { display:grid; grid-template-columns: repeat(3,1fr); gap:30px; }
.ab-pillar__ic { width:30px; height:30px; color:var(--gold); margin-bottom:14px; }
.ab-pillar__ic svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.ab-pillar__t { font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:1px; margin-bottom:8px; }
.ab-pillar__d { font-size:12.5px; line-height:1.65; color:var(--muted); }

.ab-net { display:grid; grid-template-columns: 1.15fr 1fr; gap:54px; align-items:center; }
.ab-net__map svg { width:100%; height:auto; }
.ab-net__text p { font-size:14px; line-height:1.8; color:#555; margin:16px 0 30px; max-width:420px; }
.ab-net__stats { display:grid; grid-template-columns: repeat(4,1fr); gap:28px; }
.ab-net__num { font-size:clamp(26px,2.8vw,40px); font-weight:900; color:var(--gold); letter-spacing:-1px; line-height:1; }
.ab-net__lbl { font-size:10px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:#555; margin-top:8px; }

.ab-founder { display:grid; grid-template-columns: 400px 1fr; gap:54px; align-items:stretch; }
.ab-founder__photo { position:relative; }
.ab-photo--founder { height:100%; min-height:460px; border-radius:12px; background:#141414 center/cover no-repeat; border:1px solid var(--border); }
.ab-founder__tag { position:absolute; bottom:14px; left:14px; background:var(--gold); color:#000; font-size:10px; font-weight:800; letter-spacing:1.5px; text-transform:uppercase; padding:5px 12px; border-radius:6px; }
.ab-founder__name { font-size:clamp(22px,2.6vw,30px); font-weight:900; text-transform:uppercase; letter-spacing:-.5px; color:var(--gold); margin:18px 0; }
.ab-founder__bio p { color:var(--muted); font-size:13.5px; line-height:1.8; margin-bottom:14px; }
.ab-founder__quote { margin-top:22px; padding:18px 24px; border-left:3px solid var(--gold); background:var(--surf2); border-radius:0 10px 10px 0; }
.ab-founder__quote p { color:#e8e8e8; font-size:14px; font-style:italic; line-height:1.7; }

.ab-cta { display:flex; flex-direction:row; align-items:center; gap:34px; }
.ab-cta__left { display:flex; align-items:center; gap:24px; }
.ab-cta__ic { width:54px; height:54px; color:#0a0a0a; flex-shrink:0; }
.ab-cta__ic svg { width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.4; }
.ab-cta__textwrap p { font-size:14px; line-height:1.7; color:#555; white-space:nowrap; margin-top:4px; }
.ab-cta__btn { display:inline-flex; align-items:center; gap:10px; background:#0a0a0a; color:#fff; padding:16px 32px; font-size:11px; font-weight:700; letter-spacing:1.5px; text-transform:uppercase; text-decoration:none; border-radius:8px; transition:background .2s; flex-shrink:0; }
.ab-cta__btn:hover { background:var(--gold); color:#000; }

@media (max-width: 1000px) {
  .ab-story, .ab-values, .ab-net, .ab-founder { grid-template-columns:1fr; gap:32px; }
  .ab-net__map { order:-1; }
  .ab-founder__photo { max-width:320px; }
  .ab-photo--founder { height:360px; }
  .ab-pillars { grid-template-columns:1fr; gap:22px; }
  .ab-cta { flex-direction:column; align-items:flex-start; gap:22px; }
  .ab-cta__textwrap p { white-space:normal; }
}
@media (max-width: 560px){ .ab-net__stats { grid-template-columns: repeat(2,1fr); } .ab-story__collage { grid-template-rows: repeat(3,70px); } }

/* ============================================================
   CONTACT PAGE
   ============================================================ */
.contact-wrap { display: grid; grid-template-columns: 1fr 1.6fr; min-height: calc(100vh - 280px); }

.contact-info { padding: 64px 48px; background: var(--surface); border-right: 1px solid var(--border); display: flex; flex-direction: column; gap: 48px; }
.contact-info__label { font-size: 9px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: var(--gold); margin-bottom: 16px; }
.contact-info__value { font-size: 14px; font-weight: 600; color: var(--white); line-height: 1.7; }
.contact-info__value a { color: var(--white); text-decoration: none; transition: color .2s; }
.contact-info__value a:hover { color: var(--gold); }
.contact-info__value .muted { color: var(--muted); font-weight: 400; font-size: 13px; }
.contact-divider { width: 32px; height: 1px; background: var(--gold); }

.contact-social { display: flex; gap: 10px; flex-wrap: wrap; }
.contact-social a { width: 40px; height: 40px; border: 1px solid var(--border); border-radius: 10px; display: flex; align-items: center; justify-content: center; color: var(--muted); text-decoration: none; font-size: 11px; font-weight: 700; transition: border-color .2s, color .2s, background .2s; }
.contact-social a:hover { border-color: var(--gold); color: var(--gold); }
.contact-social a svg { display: block; }

.contact-form-wrap { padding: 64px 56px; background: var(--bg); }
.contact-form-title { font-size: 22px; font-weight: 900; text-transform: uppercase; letter-spacing: -0.5px; margin-bottom: 8px; }
.contact-form-sub { font-size: 13px; color: var(--muted); line-height: 1.6; margin-bottom: 40px; }

.type-selector { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 32px; }
.type-btn { padding: 8px 18px; border: 1px solid var(--border); background: none; border-radius: 8px; font-family: "Montserrat", sans-serif; font-size: 10px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; color: var(--muted); cursor: pointer; transition: all .2s; }
.type-btn:hover { border-color: var(--muted); color: var(--white); }
.type-btn.active { border-color: var(--gold); color: var(--gold); background: rgba(204,153,51,.06); }

.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px; }
.form-field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.form-field label { font-size: 9px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: var(--muted2); }
.form-field input,
.form-field textarea,
.form-field select { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; color: var(--white); font-family: "Montserrat", sans-serif; font-size: 13px; font-weight: 500; padding: 14px 16px; outline: none; transition: border-color .2s; resize: none; appearance: none; }
.form-field input::placeholder,
.form-field textarea::placeholder { color: var(--muted2); }
.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus { border-color: var(--gold); }
.form-field textarea { min-height: 140px; }

.form-submit { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 8px; flex-wrap: wrap; }
.form-note { font-size: 11px; color: var(--muted2); line-height: 1.5; max-width: 260px; }
.btn-submit { display: inline-flex; align-items: center; gap: 12px; background: var(--gold); color: #000; border-radius: 10px; padding: 16px 36px; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; text-transform: uppercase; border: none; cursor: pointer; font-family: "Montserrat", sans-serif; transition: background .2s, transform .15s; }
.btn-submit:hover { background: var(--gold-lt); transform: translateY(-1px); }

.form-success, .form-error { padding: 20px 24px; margin-bottom: 24px; font-size: 13px; font-weight: 600; line-height: 1.5; }
.form-success { background: rgba(204,153,51,.1); border: 1px solid var(--gold); color: var(--gold); }
.form-error { background: rgba(200,50,50,.1); border: 1px solid #c83232; color: #e07070; }

@media (max-width: 900px) {
  .contact-wrap { grid-template-columns: 1fr; }
  .contact-info { padding: 40px 24px; border-right: none; border-bottom: 1px solid var(--border); }
  .contact-form-wrap { padding: 40px 24px; }
}
@media (max-width: 600px) {
  .form-grid { grid-template-columns: 1fr; }
  .form-submit { flex-direction: column; align-items: flex-start; }
  .type-selector { gap: 6px; }
}

/* ============================================================
   LEGAL PAGES (imprint / privacy)
   ============================================================ */
.legal-wrap { max-width: 820px; margin: 0 auto; padding: 0 48px 110px; }
.legal-updated { color: var(--muted2); font-size: 12px; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 10px; }
.legal-intro { color: var(--muted); font-size: 14px; line-height: 1.7; margin-bottom: 36px; padding-bottom: 26px; border-bottom: 1px solid var(--border); }
.legal-section { margin-bottom: 30px; }
.legal-section h2 { font-size: 12px; font-weight: 800; letter-spacing: 1.8px; text-transform: uppercase; color: var(--gold); margin-bottom: 11px; }
.legal-section p { color: #c9c9c9; font-size: 14px; line-height: 1.75; margin-bottom: 8px; }
.legal-section ul { list-style: none; margin: 6px 0 10px; padding: 0; }
.legal-section li { color: #c9c9c9; font-size: 14px; line-height: 1.6; padding-left: 18px; position: relative; margin-bottom: 4px; }
.legal-section li::before { content: ""; position: absolute; left: 2px; top: 9px; width: 5px; height: 5px; background: var(--gold); border-radius: 50%; }
.legal-section a { color: var(--gold-lt); text-decoration: none; word-break: break-word; }
.legal-section a:hover { text-decoration: underline; }
.legal-section strong { color: #fff; font-weight: 700; }
.legal-basis { color: var(--muted); font-size: 13px; margin-top: 6px; }
.legal-basis strong { color: var(--gold-lt); font-weight: 700; }
@media (max-width: 700px) { .legal-wrap { padding: 0 24px 70px; } }