/*!
Theme Name: Fussball-Szene
Theme URI: https://www.fussball-szene.de/
Author: Fussball-Szene.de
Description: Bundesliga-Magazin.
Version: 1.0.0
Requires at least: 6.5
Tested up to: 6.9
Requires PHP: 8.1
License: GPL-2.0-or-later
Text Domain: fussballszene
*/

:root{
  --fs-ground:#ffffff;
  --fs-ground-deep:#f4f4f1;
  --fs-surface:#ffffff;
  --fs-surface-hi:#faf9f7;
  --fs-hairline:#111214;
  --fs-hairline-soft:#d7d7d2;

  --fs-amber:#c8102e;
  --fs-amber-deep:#8e0b20;
  --fs-amber-wash:rgba(200,16,46,.07);

  --fs-ink:#0b0b0c;
  --fs-ink-2:#33343a;
  --fs-ink-3:#6a6c73;

  --fs-display:'Fjalla One',"Arial Narrow",Impact,sans-serif;
  --fs-text:'PT Serif',Georgia,"Times New Roman",serif;

  
  --fs-shell:64rem;
  --fs-measure:46rem;
  --fs-gap:clamp(1.25rem,3vw,2.5rem);

  --fs-warmup:620ms cubic-bezier(.22,.61,.36,1);
  --fs-quick:180ms cubic-bezier(.22,.61,.36,1);
}


*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--fs-ground);
  color:var(--fs-ink);
  font-family:var(--fs-text);
  font-size:clamp(1.02rem,.99rem + .18vw,1.115rem);
  line-height:1.66;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img,picture,video{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit}

h1,h2,h3,h4{
  font-family:var(--fs-display);
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.008em;
  
  line-height:1.22;
  margin:0 0 .5em;
  text-wrap:balance;
}
h1{font-size:clamp(2.1rem,1.4rem + 3vw,3.9rem)}
h2{font-size:clamp(1.5rem,1.2rem + 1.3vw,2.25rem)}
h3{font-size:clamp(1.18rem,1.05rem + .55vw,1.5rem)}
h4{font-size:clamp(1rem,.95rem + .25vw,1.15rem)}
p{margin:0 0 1.15em}

.fs-shell{width:min(100% - 2.5rem,var(--fs-shell));margin-inline:auto}
.fs-wide{width:min(100% - 1.5rem,92rem);margin-inline:auto}


.fs-skip{position:absolute;left:-9999px;top:0;background:var(--fs-amber);color:#000;padding:.7rem 1.1rem;font-weight:700;z-index:999}
.fs-skip:focus{left:.6rem;top:.6rem}


.fs-anstoss{
  display:flex;
  align-items:center;
  gap:.85rem;
  margin:0 0 1.6rem;
}
.fs-anstoss::before{
  content:"";
  flex:0 0 auto;
  width:.85rem;height:.85rem;
  border:2px solid var(--fs-amber);
  border-radius:50%;
  background:transparent;
}
.fs-anstoss::after{
  content:"";
  flex:1 1 auto;
  height:3px;
  background:linear-gradient(90deg,var(--fs-amber) 0 3.5rem,var(--fs-hairline) 3.5rem 100%);
}
.fs-anstoss h2,.fs-anstoss h3{margin:0;flex:0 1 auto;min-width:0}


.fs-prose a,.fs-chalk{
  text-decoration:none;
  background-image:linear-gradient(var(--fs-amber),var(--fs-amber));
  background-repeat:no-repeat;
  background-position:0 100%;
  background-size:100% 1px;
  padding-bottom:.08em;
  transition:background-size var(--fs-quick),color var(--fs-quick);
}
.fs-prose a:hover,.fs-chalk:hover{background-size:100% 3px;color:var(--fs-amber)}
.fs-prose a:focus-visible,a:focus-visible{outline:2px solid var(--fs-amber);outline-offset:3px}


.fs-sweep{opacity:0;transform:translateY(14px)}
.fs-sweep.is-on{opacity:1;transform:none;transition:opacity var(--fs-warmup),transform var(--fs-warmup)}
.fs-sweep-rule{position:relative}
.fs-sweep-rule::before{
  content:"";position:absolute;left:0;top:-.9rem;height:2px;width:0;background:var(--fs-amber);
}
.fs-sweep-rule.is-on::before{width:4.5rem;transition:width var(--fs-warmup)}

@media (prefers-reduced-motion:reduce){
  .fs-sweep,.fs-sweep.is-on{opacity:1;transform:none;transition:none}
  .fs-sweep-rule::before{width:4.5rem;transition:none}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

.no-js .fs-sweep{opacity:1;transform:none}


.fs-head{
  background:var(--fs-ground);
  border-bottom:3px solid var(--fs-hairline);
  position:sticky;top:0;z-index:80;
}
.fs-head__in{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:4.6rem}
.fs-brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex:0 0 auto}
.fs-brand img,.fs-brand svg{height:2.15rem;width:auto}
.fs-brand__txt{
  font-family:var(--fs-display);font-size:1.55rem;font-weight:400;
  text-transform:uppercase;letter-spacing:.01em;line-height:1;color:var(--fs-ink);
}
.fs-brand__txt em{font-style:normal;color:var(--fs-amber)}

.fs-nav{display:flex;align-items:center;gap:1.6rem}
.fs-nav a{
  font-family:var(--fs-display);font-size:1.04rem;font-weight:400;text-transform:uppercase;
  letter-spacing:.045em;text-decoration:none;color:var(--fs-ink-2);
  padding:.35rem 0;border-bottom:2px solid transparent;
  transition:color var(--fs-quick),border-color var(--fs-quick);
  white-space:nowrap;
}
.fs-nav a:hover,.fs-nav .current-menu-item>a,.fs-nav .current_page_item>a{color:var(--fs-ink);border-bottom-color:var(--fs-amber)}
.fs-nav ul{list-style:none;display:flex;gap:1.6rem;margin:0;padding:0}

.fs-burger{display:none;background:none;border:1px solid var(--fs-hairline);color:var(--fs-ink);padding:.5rem .7rem;cursor:pointer}
.fs-burger span{display:block;width:1.15rem;height:2px;background:currentColor;margin:.22rem 0}

@media (max-width:64rem){
  .fs-burger{display:block}
  .fs-nav{
    position:absolute;left:0;right:0;top:100%;background:var(--fs-ground-deep);
    border-bottom:1px solid var(--fs-hairline);flex-direction:column;align-items:stretch;
    gap:0;padding:.5rem 1.25rem 1.1rem;display:none;
  }
  .fs-nav.is-open{display:flex}
  .fs-nav ul{flex-direction:column;gap:0;width:100%}
  .fs-nav a{display:block;padding:.75rem 0;border-bottom:1px solid var(--fs-hairline-soft)}
}


.fs-lead{
  position:relative;background:var(--fs-ground);
  border-top:3px solid var(--fs-hairline);border-bottom:1px solid var(--fs-hairline);
  margin-bottom:clamp(2rem,4vw,3.5rem);
}
.fs-lead img{width:100%;height:clamp(18rem,46vh,32rem);object-fit:cover}
.fs-lead__body{
  position:static;
  padding:clamp(1.1rem,3vw,2rem) 0 clamp(1.4rem,3vw,2.2rem);
  background:none;
}
.fs-lead__body .fs-shell{width:min(100% - 2.5rem,var(--fs-measure))}
.fs-kicker{
  display:inline-block;font-family:var(--fs-display);font-size:.92rem;font-weight:400;
  text-transform:uppercase;letter-spacing:.16em;color:#fff;background:var(--fs-amber);
  padding:.24rem .7rem;margin-bottom:.85rem;
}
.fs-lead h1,.fs-lead h2{color:var(--fs-ink);margin-bottom:.3em;font-size:clamp(1.95rem,1.3rem + 2.4vw,3.2rem)}
.fs-lead p{color:var(--fs-ink-2);margin:0;font-size:1.08rem}
.fs-lead a{text-decoration:none;color:inherit;display:block}


.fs-stories{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));
  gap:0;border-top:3px solid var(--fs-hairline);
  margin-bottom:clamp(2.5rem,5vw,4rem);
}
.fs-story{
  border-bottom:1px solid var(--fs-hairline);
  border-right:1px solid var(--fs-hairline-soft);
  padding:1.4rem 1.5rem 1.7rem;
}
.fs-story:last-child{border-right:0}
.fs-story a{text-decoration:none;display:block}
.fs-story img{width:100%;aspect-ratio:16/10;object-fit:cover;margin-bottom:1rem;filter:grayscale(1) contrast(1.08)}
.fs-story h3{margin-bottom:.4em;transition:color var(--fs-quick)}
.fs-story a:hover h3{color:var(--fs-amber)}
.fs-story p{color:var(--fs-ink-3);font-size:.95rem;margin:0}
.fs-story__meta{
  font-family:var(--fs-display);font-size:.86rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--fs-amber);margin-bottom:.5rem;
}
@media (max-width:48rem){.fs-story{border-right:0}}


.fs-panel{margin-bottom:clamp(2.5rem,5vw,4rem)}

.fs-table-wrap{border-top:3px solid var(--fs-hairline);border-bottom:3px solid var(--fs-hairline);background:var(--fs-surface)}
table.fs-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.fs-table th{
  font-family:var(--fs-display);font-size:.95rem;font-weight:600;text-transform:uppercase;
  letter-spacing:.09em;color:var(--fs-ink);text-align:left;
  padding:.7rem 1rem;border-bottom:1px solid var(--fs-hairline);background:var(--fs-ground-deep);
}
.fs-table td{padding:.85rem 1rem;border-bottom:1px solid var(--fs-hairline-soft);font-size:.97rem}
.fs-table tr:last-child td{border-bottom:0}
.fs-table td:first-child{color:var(--fs-ink-3);white-space:nowrap;font-variant-numeric:tabular-nums}
.fs-sender{
  font-family:var(--fs-display);font-size:.88rem;font-weight:400;letter-spacing:.09em;
  text-transform:uppercase;color:#fff;background:var(--fs-ink);
  padding:.14rem .5rem;white-space:nowrap;
}


.fs-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));border-top:3px solid var(--fs-hairline);border-bottom:3px solid var(--fs-hairline)}
.fs-stat{padding:1.4rem 1.25rem;border-right:1px solid var(--fs-hairline-soft);background:var(--fs-surface)}
.fs-stat:last-child{border-right:0}
.fs-stat__label{
  font-family:var(--fs-display);font-size:.85rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--fs-ink-3);margin:0 0 .45rem;
}
.fs-stat__value{
  font-family:var(--fs-display);font-size:clamp(2.1rem,1.6rem + 1.8vw,3rem);font-weight:700;
  line-height:1;color:var(--fs-amber);margin:0 0 .3rem;font-variant-numeric:tabular-nums;
}
.fs-stat__note{font-size:.85rem;color:var(--fs-ink-3);margin:0}
@media (max-width:40rem){.fs-stat{border-right:0;border-bottom:1px solid var(--fs-hairline)}}


.fs-kit{display:grid;grid-template-columns:repeat(auto-fit,minmax(12rem,1fr));gap:0;border:1px solid var(--fs-hairline)}
.fs-kit__item{padding:1.4rem;text-align:center;border-right:1px solid var(--fs-hairline);background:var(--fs-surface)}
.fs-kit__item:last-child{border-right:0}
.fs-kit__item img{width:100%;height:11rem;object-fit:contain;margin-bottom:.9rem;background:#fff;padding:.6rem}
.fs-kit__item h4{margin:0 0 .25rem}
.fs-kit__item p{font-size:.88rem;color:var(--fs-ink-3);margin:0}


.fs-links{display:grid;grid-template-columns:repeat(auto-fit,minmax(19rem,1fr));gap:0 2.5rem}
.fs-links__item{padding:1.05rem 0;border-bottom:1px solid var(--fs-hairline-soft)}
.fs-links__item a{text-decoration:none}
.fs-links__item h4{margin:0 0 .2rem;transition:color var(--fs-quick)}
.fs-links__item a:hover h4{color:var(--fs-amber)}
.fs-links__item p{font-size:.9rem;color:var(--fs-ink-3);margin:0}


.fs-article{padding:clamp(1.75rem,4vw,3.25rem) 0}
.fs-article__head{max-width:var(--fs-measure);margin:0 auto 2rem}
.fs-article__meta{
  font-family:var(--fs-display);font-size:.9rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--fs-ink-3);margin-bottom:.8rem;
}
.fs-article__meta span+span::before{content:"·";margin:0 .5rem;color:var(--fs-hairline)}
.fs-hero{max-width:58rem;margin:0 auto 2rem}
.fs-hero img{width:100%;max-height:30rem;object-fit:cover}
.fs-hero figcaption{font-size:.85rem;color:var(--fs-ink-3);padding-top:.5rem;border-top:1px solid var(--fs-hairline-soft);margin-top:.5rem}

.fs-prose{max-width:var(--fs-measure);margin-inline:auto;font-size:1.06rem}
.fs-prose h2{margin-top:2.4em}
.fs-prose h3{margin-top:1.9em}
.fs-prose ul,.fs-prose ol{padding-left:1.2rem;margin:0 0 1.15em}
.fs-prose li{margin-bottom:.45em}
.fs-prose blockquote{
  margin:1.8em 0;padding:.2em 0 .2em 1.4rem;border-left:3px solid var(--fs-amber);
  font-size:1.12rem;color:var(--fs-ink-2);font-style:normal;
}
.fs-prose img{margin:1.8em 0}
.fs-prose figure{margin:1.8em 0}
.fs-prose figcaption{font-size:.85rem;color:var(--fs-ink-3);margin-top:.5rem}
.fs-prose table{width:100%;border-collapse:collapse;margin:1.8em 0;font-size:.97rem}
.fs-prose th,.fs-prose td{padding:.7rem .85rem;border-bottom:1px solid var(--fs-hairline);text-align:left}
.fs-prose th{font-family:var(--fs-display);text-transform:uppercase;letter-spacing:.07em;font-size:.92rem;color:var(--fs-ink);border-bottom:2px solid var(--fs-hairline)}



.fs-morefrom{border-top:3px solid var(--fs-hairline);margin:3rem 0 0;padding-top:1.4rem}
.fs-prose .fs-morefrom h3{
  font-family:var(--fs-display);font-size:.95rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--fs-ink-3);margin:1.6rem 0 .6rem;
}
.fs-prose .fs-morefrom h3:first-child{margin-top:0}
.fs-prose .fs-morefrom ul{list-style:none;padding:0;margin:0}
.fs-prose .fs-morefrom li{margin:0;border-bottom:1px solid var(--fs-hairline-soft)}
.fs-prose .fs-morefrom li:last-child{border-bottom:0}
.fs-prose .fs-morefrom a{display:block;padding:.6rem 0;background-image:none}
.fs-prose .fs-morefrom a:hover{color:var(--fs-amber)}

.fs-faq{border-top:3px solid var(--fs-hairline);max-width:var(--fs-measure);margin:2.5rem auto}
.fs-faq details{border-bottom:1px solid var(--fs-hairline)}
.fs-faq summary{
  cursor:pointer;padding:1.05rem 2.5rem 1.05rem 0;position:relative;list-style:none;
}
.fs-faq summary::-webkit-details-marker{display:none}
.fs-faq summary h3{
  font-family:var(--fs-text);
  font-size:clamp(1.05rem,1rem + .35vw,1.2rem);margin:0;text-transform:none;
  letter-spacing:0;line-height:1.4;font-weight:700;display:inline;
}
.fs-faq summary::after{
  content:"";position:absolute;right:.3rem;top:50%;width:.72rem;height:.72rem;
  border:2px solid var(--fs-amber);border-radius:50%;transform:translateY(-50%);
  transition:background var(--fs-quick);
}
.fs-faq details[open] summary::after{background:var(--fs-amber)}
.fs-faq__a{padding:0 0 1.15rem;color:var(--fs-ink-2)}
.fs-faq__a p:last-child{margin-bottom:0}


.fs-archive-head{padding:clamp(2rem,4vw,3rem) 0 1rem}
.fs-archive-head h1{max-width:var(--fs-measure);margin-inline:auto}


.home #main .fs-prose,
.home #main .fs-faq{margin-inline:0}
.home .fs-archive-head h1{margin-inline:0}
.home .fs-lead__body .fs-shell{width:min(100% - 2.5rem,var(--fs-shell))}
.home .fs-lead p{max-width:var(--fs-measure)}
.fs-list{border-top:1px solid var(--fs-hairline);max-width:60rem;margin-inline:auto}
.fs-list__item{
  display:grid;grid-template-columns:minmax(0,14rem) 1fr;gap:1.5rem;
  padding:1.5rem 0;border-bottom:1px solid var(--fs-hairline);
}
.fs-list__item img{width:100%;aspect-ratio:16/10;object-fit:cover}
.fs-list__item a{text-decoration:none}
.fs-list__item h3{margin-bottom:.35em;transition:color var(--fs-quick)}
.fs-list__item a:hover h3{color:var(--fs-amber)}
.fs-list__item p{color:var(--fs-ink-3);margin:0;font-size:.95rem}
.fs-list__item--flat{grid-template-columns:1fr}
@media (max-width:44rem){.fs-list__item{grid-template-columns:1fr}}

.fs-pager{display:flex;gap:.5rem;padding:2rem 0;flex-wrap:wrap;max-width:60rem;margin-inline:auto}
.fs-pager .page-numbers{
  font-family:var(--fs-display);text-transform:uppercase;letter-spacing:.06em;
  padding:.5rem .85rem;border:1px solid var(--fs-hairline);text-decoration:none;color:var(--fs-ink-2);
}
.fs-pager .page-numbers.current,.fs-pager .page-numbers:hover{border-color:var(--fs-amber);color:var(--fs-amber)}


.fs-foot{background:var(--fs-ground-deep);border-top:3px solid var(--fs-hairline);margin-top:clamp(3rem,6vw,5rem);padding:clamp(2rem,4vw,3.25rem) 0 2rem}
.fs-foot__top{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.8rem}
.fs-foot nav{display:flex;gap:1.5rem;flex-wrap:wrap}
.fs-foot nav a{font-size:.92rem;color:var(--fs-ink-3);text-decoration:none;transition:color var(--fs-quick)}
.fs-foot nav a:hover{color:var(--fs-amber)}
.fs-foot ul{list-style:none;display:flex;gap:1.5rem;margin:0;padding:0;flex-wrap:wrap}

.fs-foot .fs-foot__cats{display:block;margin:0 0 1.6rem}
.fs-foot__cats h2{
  font-family:var(--fs-display);font-size:.85rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--fs-ink-3);margin:0 0 .7rem;
}
.fs-foot__cats ul{display:flex;gap:1.2rem 1.5rem;flex-wrap:wrap}
.fs-foot__cats a{font-size:.92rem;color:var(--fs-ink-2);text-decoration:none}
.fs-foot__cats a:hover{color:var(--fs-amber)}

.fs-foot__legal{border-top:1px solid var(--fs-hairline);padding-top:1.4rem;font-size:.85rem;color:var(--fs-ink-3)}


@media (max-width:44rem){
  table.fs-table,table.fs-table tbody,table.fs-table tr,table.fs-table td{display:block;width:100%}
  table.fs-table thead{position:absolute;left:-9999px}
  table.fs-table tr{border-bottom:1px solid var(--fs-hairline);padding:.5rem 0}
  table.fs-table tr:last-child{border-bottom:0}
  table.fs-table td{
    border-bottom:0;padding:.4rem 1rem;display:flex;justify-content:space-between;gap:1rem;align-items:center;
  }
  table.fs-table td::before{
    content:attr(data-label);font-family:var(--fs-display);text-transform:uppercase;
    letter-spacing:.09em;font-size:.82rem;color:var(--fs-ink-3);flex:0 0 auto;
  }
  .fs-prose table,.fs-prose tbody,.fs-prose tr,.fs-prose td{display:block;width:100%}
  .fs-prose thead{position:absolute;left:-9999px}
  .fs-prose tr{border-bottom:1px solid var(--fs-hairline);padding:.5rem 0}
  .fs-prose td{border-bottom:0;padding:.35rem 0;display:flex;justify-content:space-between;gap:1rem}
  .fs-prose td::before{content:attr(data-label);font-weight:600;color:var(--fs-ink-3);flex:0 0 auto}
}


.alignleft{float:left;margin:0 1.5rem 1rem 0}
.alignright{float:right;margin:0 0 1rem 1.5rem}
.aligncenter{margin-inline:auto}
.wp-caption{max-width:100%}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}