/*
Theme Name: A Football Manager's Life
Theme URI: https://example.com
Author: Redaktion
Author URI: https://example.com
Description: Dunkles, dramatisches Blog-Theme im Flutlicht-Stadion-Look für Football-Manager-Storys, echte Trainer-Geschichten, Matchday-Kommentare, Fussball-Historie und Taktik. Nutzt WordPress-Kategorien als Rubriken mit automatischer Akzentfarbe.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: football-managers-life
*/

:root{
  --night:#0A0D0A;
  --dugout:#141A15;
  --dugout-2:#1B231C;
  --chalk:#EDEFE8;
  --chalk-dim:#A9B0A5;
  --line:#2B342C;
  --floodlight:#E8B34E;
  --turf:#3E7A52;
  --steel:#5C8AA8;
  --gold:#A67C52;
  --clay:#B25444;
  --focus:#E8B34E;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(232,179,78,0.10), transparent 60%),
    radial-gradient(ellipse 900px 500px at 85% -10%, rgba(232,179,78,0.10), transparent 60%),
    var(--night);
  color:var(--chalk);
  font-family:'Source Serif 4', Georgia, serif;
  line-height:1.5;
  min-height:100vh;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
::selection{background:var(--floodlight);color:var(--night);}
:focus-visible{outline:2px solid var(--focus); outline-offset:2px;}

.display{font-family:'Anton', sans-serif; letter-spacing:0.02em; text-transform:uppercase; font-weight:400;}
.mono{font-family:'JetBrains Mono', monospace;}
.screen-reader-text{position:absolute; left:-9999px;}

/* HEADER */
.site-header{
  display:flex; align-items:center; justify-content:space-between;
  padding:22px 5vw; border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:40;
  background:rgba(10,13,10,0.88); backdrop-filter:blur(8px);
}
.brand{display:flex; align-items:center; gap:12px;}
.brand-mark{
  width:34px; height:34px; border-radius:50%;
  border:2px solid var(--floodlight);
  display:flex; align-items:center; justify-content:center;
  font-family:'Anton',sans-serif; font-size:15px; color:var(--floodlight);
  flex-shrink:0;
}
.brand-text{font-size:15px; letter-spacing:0.06em; line-height:1.15;}
.brand-text b{display:block; font-family:'Anton',sans-serif; font-size:19px; letter-spacing:0.03em; color:var(--chalk); font-weight:400;}
.brand-text span{color:var(--chalk-dim); font-size:11px; font-family:'JetBrains Mono',monospace;}

.header-actions{display:flex; gap:10px;}
.btn{
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.05em;
  padding:10px 16px; border-radius:2px; border:1px solid var(--line);
  background:transparent; color:var(--chalk); cursor:pointer;
  text-transform:uppercase; transition:border-color .15s, color .15s, background .15s;
  display:inline-block;
}
.btn:hover{border-color:var(--floodlight); color:var(--floodlight);}
.btn-solid{background:var(--floodlight); color:var(--night); border-color:var(--floodlight); font-weight:700;}
.btn-solid:hover{background:#f2c366; color:var(--night);}

/* HERO */
.hero{padding:64px 5vw 40px; position:relative; overflow:hidden;}
.hero-eyebrow{
  font-family:'JetBrains Mono',monospace; font-size:12px; color:var(--floodlight);
  letter-spacing:0.18em; text-transform:uppercase; margin:0 0 14px;
}
.hero h1{
  margin:0; font-size:clamp(38px, 7vw, 84px); line-height:0.96; color:var(--chalk);
  max-width:14ch;
}
.hero h1 em{font-style:normal; color:var(--floodlight);}
.hero-sub{margin:22px 0 0; max-width:56ch; color:var(--chalk-dim); font-size:17px;}

/* TICKER */
.ticker-wrap{
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  background:var(--dugout); overflow:hidden; white-space:nowrap; position:relative;
}
.ticker-wrap::before{
  content:"LIVE"; position:absolute; left:0; top:0; bottom:0; z-index:2;
  background:var(--clay); color:var(--chalk); font-family:'JetBrains Mono',monospace;
  font-weight:700; font-size:11px; display:flex; align-items:center; padding:0 14px;
  letter-spacing:0.1em;
}
.ticker{
  display:inline-flex; gap:48px; padding:10px 0 10px 90px;
  animation:ticker-scroll 32s linear infinite;
  font-family:'JetBrains Mono',monospace; font-size:13px; color:var(--chalk-dim);
}
.ticker span b{color:var(--floodlight); margin-right:8px;}
@keyframes ticker-scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@media (prefers-reduced-motion: reduce){ .ticker{animation:none;} }

/* CATEGORY NAV */
.cat-nav{display:flex; gap:10px; flex-wrap:wrap; padding:26px 5vw 4px;}
.cat-pill{
  font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.04em;
  padding:9px 15px; border-radius:999px; border:1px solid var(--line);
  background:var(--dugout); color:var(--chalk-dim); cursor:pointer;
  display:inline-flex; align-items:center; gap:8px; transition:all .15s;
}
.cat-pill .dot{width:8px; height:8px; border-radius:50%; flex-shrink:0;}
.cat-pill:hover{color:var(--chalk); border-color:var(--chalk-dim);}
.cat-pill.active{background:var(--dugout-2); border-color:currentColor;}

main{padding:30px 5vw 90px; max-width:1400px; margin:0 auto;}

/* GRID */
.grid{display:grid; grid-template-columns:repeat(auto-fill, minmax(300px,1fr)); gap:22px; margin-top:14px;}
.card{
  background:var(--dugout); border:1px solid var(--line); border-radius:3px;
  padding:24px; transition:transform .15s, border-color .15s, box-shadow .15s;
  display:flex; flex-direction:column; gap:14px; position:relative;
}
.card:hover{transform:translateY(-3px); border-color:var(--floodlight); box-shadow:0 12px 30px -14px rgba(232,179,78,0.35);}
.card-tag{
  align-self:flex-start; font-family:'JetBrains Mono',monospace; font-size:11px;
  letter-spacing:0.06em; text-transform:uppercase; padding:5px 10px; border-radius:2px;
  display:inline-flex; align-items:center; gap:7px;
}
.card-tag .dot{width:7px; height:7px; border-radius:50%;}
.card h3{margin:0; font-family:'Anton',sans-serif; font-weight:400; font-size:23px; line-height:1.12; color:var(--chalk); letter-spacing:0.01em;}
.card h3 a{color:inherit;}
.card p{margin:0; color:var(--chalk-dim); font-size:14.5px; line-height:1.55; flex-grow:1;}
.card-meta{
  display:flex; justify-content:space-between; align-items:center;
  font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--chalk-dim);
  border-top:1px solid var(--line); padding-top:12px;
}
.empty-state{padding:60px 20px; text-align:center; color:var(--chalk-dim); border:1px dashed var(--line); border-radius:4px;}
.empty-state b{display:block; font-family:'Anton',sans-serif; color:var(--chalk); font-size:20px; margin-bottom:8px; letter-spacing:0.02em; font-weight:400;}

/* ARTICLE VIEW */
.article-view{max-width:720px; margin:0 auto;}
.back-link{
  color:var(--chalk-dim); font-family:'JetBrains Mono',monospace;
  font-size:12px; display:inline-flex; align-items:center; gap:6px; padding:0 0 26px;
}
.back-link:hover{color:var(--floodlight);}
.article-tag{
  font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  padding:5px 10px; border-radius:2px; display:inline-flex; align-items:center; gap:7px; margin-bottom:18px;
}
.article-tag .dot{width:7px;height:7px;border-radius:50%;}
.article-view h1{font-size:clamp(30px,5vw,48px); margin:0 0 18px; line-height:1.05;}
.article-meta{
  display:flex; gap:18px; flex-wrap:wrap; color:var(--chalk-dim); font-family:'JetBrains Mono',monospace;
  font-size:12px; border-bottom:1px solid var(--line); padding-bottom:22px; margin-bottom:28px;
}
.article-thumb{width:100%; height:auto; border-radius:3px; margin-bottom:28px; border:1px solid var(--line);}
.article-body p{margin:0 0 20px; font-size:17.5px; color:#DCDFD7; line-height:1.75;}
.article-body p:first-of-type::first-letter{
  font-family:'Anton',sans-serif; font-size:58px; float:left; line-height:0.8; padding:6px 10px 0 0; color:var(--floodlight);
}
.article-body img{border-radius:3px; margin:8px 0 24px;}
.article-body a{color:var(--floodlight); text-decoration:underline;}
.article-body blockquote{
  border-left:3px solid var(--floodlight); margin:0 0 20px; padding:4px 0 4px 20px; color:var(--chalk-dim); font-style:italic;
}
.article-footer{border-top:1px solid var(--line); padding-top:22px; margin-top:36px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px;}

/* PAGINATION */
.pagination{display:flex; gap:8px; flex-wrap:wrap; margin-top:44px; justify-content:center;}
.pagination a, .pagination span{
  font-family:'JetBrains Mono',monospace; font-size:12px; padding:9px 14px; border:1px solid var(--line);
  border-radius:2px; color:var(--chalk-dim);
}
.pagination .current{color:var(--floodlight); border-color:var(--floodlight);}
.pagination a:hover{color:var(--chalk); border-color:var(--chalk-dim);}

footer.site-footer{
  border-top:1px solid var(--line); padding:34px 5vw; color:var(--chalk-dim);
  font-family:'JetBrains Mono',monospace; font-size:12px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}

@media (max-width:640px){
  .site-header{padding:16px 5vw;}
  .hero{padding:40px 5vw 30px;}
  main{padding:22px 5vw 70px;}
}