/* FF Vereinsprofil – Service-Baender der Kategorie-Archive ([ff_rubrik], [ff_kennzahlen]) */
.ffr{--n:#0E2A52;--o:#e07645;--l:#a8481b;--g:#5a6b82;--bd:#dfe5ee;--bg:#f4f6fa;font-family:Inter,system-ui,sans-serif;color:#14213a;display:grid;gap:1.1rem;min-width:0}
.ffr *{box-sizing:border-box}
.ffr-lbl{display:block;font:700 .7rem "JetBrains Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--o);margin-bottom:-.6rem}
.ffr h2{font-family:"Barlow Condensed","Arial Narrow",sans-serif;font-weight:800;font-size:clamp(1.65rem,3vw,2.1rem);line-height:1.1;color:#14213a;margin:0}
.ffr-band{border-radius:16px;padding:1.2rem 1.3rem;background:radial-gradient(110% 120% at 100% 0%,#1f5fae 0%,#0E2A52 50%,#081a35 100%);color:#fff}
.ffr-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.75rem}
.ffr-kpi{border-radius:12px;padding:.85rem 1rem;background:rgba(255,255,255,.08);display:grid;gap:.1rem}
.ffr-kpi b{font:800 2.2rem/1.05 "Barlow Condensed",sans-serif;color:#fff;font-variant-numeric:tabular-nums}
.ffr-kpi span{font:700 .64rem "JetBrains Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#f2a173}
.ffr-kpi small{font-size:.74rem;color:rgba(255,255,255,.7)}
.ffr-kpis.is-light .ffr-kpi{background:#f4f6fa}.ffr-kpis.is-light .ffr-kpi b{color:#0E2A52}.ffr-kpis.is-light .ffr-kpi span{color:#a8481b}.ffr-kpis.is-light .ffr-kpi small{color:#5a6b82}
.ffr-src{margin:.7rem 0 0;font-size:.7rem;color:rgba(255,255,255,.65)}
.ffr-chart{min-width:0}
.ffr-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.8rem}
.ffr-tile{position:relative;display:grid;gap:.25rem;align-content:start;background:#fff;border:1px solid var(--bd);border-radius:14px;padding:1rem 1.1rem 2.2rem;text-decoration:none!important;color:#14213a!important;box-shadow:0 2px 8px rgba(14,42,82,.05);transition:border-color .15s,transform .15s,box-shadow .15s}
.ffr-tile:hover{border-color:var(--o);transform:translateY(-2px);box-shadow:0 10px 24px rgba(14,42,82,.12)}
.ffr-tile:focus-visible{outline:3px solid var(--o);outline-offset:2px}
.ffr-k{font:700 .62rem "JetBrains Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--o)}
.ffr-tile b{font:800 1.3rem/1.1 "Barlow Condensed",sans-serif;color:#0E2A52}
.ffr-x{font-size:.84rem;line-height:1.4;color:var(--g)}
.ffr-tile i{position:absolute;left:1.1rem;bottom:.8rem;font-style:normal;font-weight:700;color:var(--o);transition:transform .15s}
.ffr-tile:hover i{transform:translateX(4px)}
.ffr-tile.is-hero{background:linear-gradient(160deg,#0E2A52,#1f5fae);border-color:transparent;color:#fff!important}
.ffr-tile.is-hero b{color:#fff}.ffr-tile.is-hero .ffr-x{color:#c9d6ea}.ffr-tile.is-hero .ffr-k,.ffr-tile.is-hero i{color:#f2a173}
.ffr-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:.9rem;align-items:stretch}
.ffr-band-sm{display:flex;align-items:center}
.ffr-band-sm .ffr-kpis{width:100%}

.ffr-app{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,1fr);gap:1.4rem;align-items:center;border-radius:20px;padding:1.6rem 1.7rem;background:radial-gradient(120% 140% at 0% 0%,#f08a55 0%,#e07645 35%,#bf5320 100%);color:#fff;box-shadow:0 14px 34px rgba(191,83,32,.25)}
.ffr-app.has-img{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr)}
.ffr-app::after{content:"";position:absolute;right:-80px;top:-80px;width:260px;height:260px;border-radius:50%;border:40px solid rgba(255,255,255,.08);pointer-events:none}
.ffr-app-txt{display:grid;gap:.45rem;align-content:start;position:relative;z-index:1}
.ffr-app .ffr-k{color:#fde3d4}
.ffr-app b{font:800 clamp(1.6rem,2.8vw,2.2rem)/1.05 "Barlow Condensed",sans-serif;color:#fff}
.ffr-app .ffr-x{color:#fde3d4}
.ffr-badges{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.ffr-badges a{display:inline-flex;align-items:center;gap:.4rem;background:#111;color:#fff!important;text-decoration:none!important;border-radius:8px;padding:.5rem .9rem;font-weight:600;font-size:.85rem}
.ffr-badges a:hover{background:#0E2A52}
.ffr-badges a.is-img{background:none;padding:0;border-radius:0;transition:transform .15s}
.ffr-badges a.is-img:hover{background:none;transform:translateY(-2px)}
.ffr-badges a.is-img img{display:block;height:44px;width:auto}
.ffr-app-list{list-style:none;margin:.2rem 0 0;padding:0;display:grid;gap:.3rem;font-size:.9rem;color:#fff}
.ffr-app-list li{position:relative;padding-left:1.4rem}
.ffr-app-list li::before{content:"\2713";position:absolute;left:0;top:0;font-weight:800;color:#0E2A52;background:#fff;border-radius:50%;width:1.05rem;height:1.05rem;font-size:.68rem;line-height:1.05rem;text-align:center}
.ffr-app-pic{position:relative;z-index:1;display:block;border-radius:16px;overflow:hidden;box-shadow:0 18px 40px rgba(60,20,0,.35);transition:transform .25s}
.ffr-app-pic:hover{transform:translateY(-3px)}
.ffr-app-img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.ffr-split--kpi{grid-template-columns:minmax(0,1fr) minmax(0,2fr)}
.ffr-split--kpi .ffr-band-sm .ffr-kpis{grid-template-columns:1fr}
.ffr-tiles--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.ffr-chips{display:flex;flex-wrap:wrap;gap:.5rem}
.ffr-chips a{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:999px;border:1px solid var(--bd);background:#fff;color:#0E2A52!important;text-decoration:none!important;font-weight:600;font-size:.88rem;transition:border-color .15s,background .15s}
.ffr-chips a small{font:600 .7rem "JetBrains Mono",ui-monospace,monospace;color:var(--g)}
.ffr-chips a:hover{border-color:var(--o)}
.ffr-chips a[aria-current]{background:#0E2A52;border-color:#0E2A52;color:#fff!important}
.ffr-chips a[aria-current] small{color:#f2a173}
.ffr-bns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem}
.ffr-bn{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:.3rem;min-height:220px;border-radius:18px;padding:1.4rem 1.5rem 1.3rem;color:#fff!important;text-decoration:none!important;isolation:isolate;transition:transform .18s,box-shadow .18s}
.ffr-bn:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(14,42,82,.25)}
.ffr-bn:focus-visible{outline:3px solid var(--o);outline-offset:3px}
.ffr-bn .ffr-k{color:rgba(255,255,255,.75)}
.ffr-bn b{font:800 clamp(1.5rem,2.4vw,2rem)/1.05 "Barlow Condensed",sans-serif;color:#fff;max-width:85%}
.ffr-bn .ffr-x{font-size:.9rem;line-height:1.45;color:rgba(255,255,255,.82);max-width:34ch}
.ffr-bn-num{margin-top:auto;padding-top:.8rem;font-size:.8rem;color:rgba(255,255,255,.8)}
.ffr-bn-num strong{font:800 2.1rem/1 "Barlow Condensed",sans-serif;color:#fff;margin-right:.2rem;font-variant-numeric:tabular-nums}
.ffr-bn i{font-style:normal;font-weight:700;font-size:.88rem;color:#fff;margin-top:.5rem;transition:transform .15s}
.ffr-bn:not(:has(.ffr-bn-num)) i{margin-top:auto}
.ffr-bn:hover i{transform:translateX(4px)}
.ffr-bn-art{position:absolute;right:-18px;bottom:-14px;width:58%;max-width:300px;z-index:-1;fill:none;stroke:rgba(255,255,255,.18);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round;transition:transform .3s}
.ffr-bn:hover .ffr-bn-art{transform:scale(1.05) rotate(-2deg)}
.ffr-bn--sm{grid-column:span 2;min-height:260px;background:radial-gradient(120% 140% at 100% 0%,#1f5fae 0%,#0E2A52 55%,#081a35 100%)}
.ffr-bn--sm b{font-size:clamp(2rem,3.4vw,2.8rem)}
.ffr-bn--nat{background:linear-gradient(155deg,#1b1f2a 0%,#3a0d14 60%,#7a1424 100%)}
.ffr-bn--club{background:linear-gradient(155deg,#0f4c81,#1f7fc4)}
.ffr-bn--app{background:linear-gradient(155deg,#bf5320,#e07645)}
.ffr-bn--data{background:linear-gradient(155deg,#12355f,#2c6aa8)}
.ffr-bn--tools{grid-column:1/-1;min-height:150px;background:linear-gradient(155deg,#121826,#2a3446)}
.ffr-bn--tools b{max-width:none}
.ffr-bn--tools .ffr-bn-art{width:30%;bottom:-30px}
.ffr-bn--tools .ffr-bn-art{stroke:rgba(242,161,115,.35)}
@media (max-width:760px){.ffr-app.has-img{grid-template-columns:1fr}.ffr-app-pic{order:-1}}
@media (max-width:1000px){.ffr-bns{grid-template-columns:repeat(2,minmax(0,1fr))}.ffr-bn--sm{grid-column:1/-1}.ffr-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}.ffr-split{grid-template-columns:1fr}}
@media (max-width:560px){.ffr-tiles,.ffr-bns{grid-template-columns:1fr}.ffr-bn{min-height:190px}}
@media (prefers-reduced-motion:reduce){.ffr-app-pic,.ffr-badges a.is-img{transition:none}.ffr-app-pic:hover{transform:none}.ffr-tile,.ffr-tile i,.ffr-bn,.ffr-bn i,.ffr-bn-art{transition:none}.ffr-tile:hover,.ffr-bn:hover,.ffr-bn:hover .ffr-bn-art{transform:none}}
