/*
 * SNL Fachkalender — Seiten-Variante (Governance-Fachkalender)
 * Prefix: snl-fk-
 *
 * 1:1 extrahiert aus dem Design-Modul
 *   outputs/pages/snl-governance-fachkalender_v1.0.0.html
 * Bei Design-Aenderungen im Modul muss diese Datei nachgezogen werden.
 */

:root{
  --blue:#28465A;--gold:#B1A675;--burgundy:#8B0029;--green:#3d7a4a;
  --text:#555555;--subtext:#888888;--light:#f5f5f0;--warm:#faf9f5;
  --bw:#e0ded6;--bn:#e8e8e2;--white:#fff;--terra:#b5622a;
  --snl-shadow-subtle:0 8px 32px rgba(0,0,0,.06);--snl-shadow-hover:0 8px 28px rgba(0,0,0,.1);
}
.snl-fk-page *{margin:0;padding:0;box-sizing:border-box}
.snl-fk-page{font-family:'Lato',sans-serif;color:var(--text);background:var(--white);line-height:1.6;-webkit-font-smoothing:antialiased}
.snl-fk-wrap{max-width:1000px;margin:0 auto;padding:0 32px}
.snl-fk-page h1,.snl-fk-page h2,.snl-fk-page h3,.snl-fk-page h4{color:var(--blue);font-weight:900;letter-spacing:-.01em;line-height:1.2}

.snl-fk-head{padding:54px 0 8px;text-align:center}
.snl-fk-eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:18px;display:block}
.snl-fk-head h1{font-size:34px;margin:0 auto 16px;max-width:20ch}
.snl-fk-head .snl-fk-lead{font-size:17px;color:var(--blue);font-weight:400;max-width:56ch;margin:0 auto}
.snl-fk-head .snl-fk-gold-rule{width:50px;height:3px;background:linear-gradient(90deg,var(--gold),#d4c98a);margin:26px auto 0}

/* Filter */
.snl-fk-filterbar{position:sticky;top:0;z-index:20;/* sticky filter bar */background:var(--white);border-bottom:1px solid var(--bw);padding:16px 0;margin-bottom:8px}
.snl-fk-filterbar.snl-fk-stuck{box-shadow:var(--snl-shadow-subtle)}
.snl-fk-filter-grid{display:flex;flex-direction:column;gap:10px}
.snl-fk-filter-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.snl-fk-filter-row .snl-fk-flabel{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--subtext);min-width:64px}
.snl-fk-chip{font-size:12px;font-weight:700;letter-spacing:.03em;padding:6px 13px;border-radius:4px;border:1px solid var(--bw);background:var(--white);color:var(--text);cursor:pointer;transition:all .15s}
.snl-fk-chip:hover{border-color:var(--gold)}
.snl-fk-chip[aria-pressed="true"]{border-color:var(--gold);background:var(--light);color:var(--blue)}
.snl-fk-filter-count{font-size:13px;color:var(--subtext);margin-left:auto;font-weight:700}

/* gemeinsame Marker/Badges */
.snl-fk-badge{font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:4px;border:1px solid var(--gold);color:var(--blue);white-space:nowrap}
.snl-fk-badge--typ{border-color:var(--bw);color:var(--subtext)}
.snl-fk-badge--recht{border-color:var(--bn);color:var(--terra);background:var(--white)}
.snl-fk-flag{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:3px 8px;border-radius:4px;border:1px solid var(--gold);color:var(--blue);background:var(--light)}
.snl-fk-flag svg{width:10px;height:10px;color:var(--gold)}
.snl-fk-flag--emp{background:var(--white)}
.snl-fk-flag--own{border-color:var(--burgundy);color:var(--burgundy);background:var(--white)}
.snl-fk-flag--own svg{color:var(--burgundy)}

/* Aktionen (Link + Kalender) */
.snl-fk-acts{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.snl-fk-act{display:inline-flex;align-items:center;gap:5px;font-family:'Lato',sans-serif;font-size:11.5px;font-weight:700;
  letter-spacing:.02em;padding:6px 11px;border-radius:4px;border:1px solid var(--bw);background:var(--white);
  color:var(--blue);text-decoration:none;cursor:pointer;transition:all .15s;line-height:1.2;white-space:nowrap}
.snl-fk-act:hover{border-color:var(--gold);background:var(--warm)}
.snl-fk-act svg{width:12px;height:12px;flex-shrink:0;color:var(--gold)}
.snl-fk-act--link{border-color:var(--gold)}
.snl-fk-act--link svg{color:var(--terra)}

.snl-fk-empty{display:none;text-align:center;padding:50px 0;color:var(--subtext);font-size:15px}
.snl-fk-empty.snl-fk-show{display:block}

@media(max-width:760px){.snl-fk-head h1{font-size:27px}.snl-fk-filter-row .snl-fk-flabel{min-width:0;width:100%}}

/* Quartalsgruppen + Kachel-Grid */
.snl-fk-qgroup{margin-bottom:34px}
.snl-fk-qhead{display:flex;align-items:baseline;justify-content:space-between;gap:12px;
  padding:10px 0 12px;border-bottom:2px solid var(--gold);margin-bottom:18px}
.snl-fk-qhead h3{font-size:18px}
.snl-fk-qhead .snl-fk-qcount{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--subtext)}
.snl-fk-qhead.snl-fk-pinned h3{display:inline-flex;align-items:center;gap:8px}
.snl-fk-qhead.snl-fk-pinned svg{width:14px;height:14px;color:var(--gold)}
.snl-fk-qgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(284px,1fr));gap:16px}

.snl-fk-tile{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--bw);
  border-radius:8px;padding:20px;transition:box-shadow .2s,transform .2s;
  opacity:0;transform:translateY(12px);animation:snl-fk-rise .45s ease forwards}
@keyframes snl-fk-rise{to{opacity:1;transform:none}}
.snl-fk-tile:hover{box-shadow:var(--snl-shadow-hover)}
.snl-fk-tile.snl-fk-is-hl{background:var(--warm);border-color:var(--gold)}
.snl-fk-tile.snl-fk-is-own{border-top:3px solid var(--burgundy)}
.snl-fk-tile .snl-fk-t-date{font-size:13px;font-weight:900;color:var(--subtext);letter-spacing:.02em}
.snl-fk-tile .snl-fk-t-typ{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--subtext);margin:8px 0 6px}
.snl-fk-tile h4{font-size:15.5px;line-height:1.32;margin-bottom:7px}
.snl-fk-tile .snl-fk-t-meta{font-size:12.5px;color:var(--text);margin-bottom:12px}
.snl-fk-tile .snl-fk-t-tags{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.snl-fk-tile .snl-fk-t-acts{margin-top:auto;padding-top:14px;border-top:1px solid var(--bn)}
.snl-fk-tile .snl-fk-acts{gap:6px}

/* Lade-Indikator (Infinite-Scroll) */
.snl-fk-tl-loader{display:flex;align-items:center;justify-content:center;gap:9px;padding:26px 0 6px;
  color:var(--subtext);font-size:13px;font-weight:700;letter-spacing:.04em}
.snl-fk-tl-loader.snl-fk-hidden{display:none}
.snl-fk-tl-loader .snl-fk-dots{display:inline-flex;gap:5px}
.snl-fk-tl-loader .snl-fk-dots i{width:7px;height:7px;border-radius:50%;background:var(--gold);display:block;animation:snl-fk-pulse 1.1s ease-in-out infinite}
.snl-fk-tl-loader .snl-fk-dots i:nth-child(2){animation-delay:.16s}
.snl-fk-tl-loader .snl-fk-dots i:nth-child(3){animation-delay:.32s}
@keyframes snl-fk-pulse{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1)}}
#snl-fk-sentinel{height:1px}
.snl-fk-tl-done{display:none;align-items:center;justify-content:center;gap:16px;margin-top:24px;
  color:var(--subtext);font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
.snl-fk-tl-done.snl-fk-show{display:flex}
.snl-fk-tl-done::before,.snl-fk-tl-done::after{content:"";width:46px;height:2px;background:linear-gradient(90deg,var(--gold),#d4c98a)}

@media(max-width:640px){.snl-fk-qgrid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.snl-fk-tile{animation:none;opacity:1;transform:none}.snl-fk-tl-loader .snl-fk-dots i{animation:none;opacity:.6}}

.snl-fk-head{padding:60px 0 8px;text-align:center}
.snl-fk-head .snl-fk-eyebrow{font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--terra);margin-bottom:18px;display:block}
.snl-fk-head h1{font-size:36px;margin:0 auto 16px;max-width:18ch}
.snl-fk-head .snl-fk-lead{font-size:18px;color:var(--blue);font-weight:400;max-width:56ch;margin:0 auto}
.snl-fk-head .snl-fk-gold-rule{width:50px;height:3px;background:linear-gradient(90deg,var(--gold),#d4c98a);margin:26px auto 34px}
.snl-fk-intro{padding:34px 0 6px;max-width:760px;margin:0 auto}
.snl-fk-intro h2{font-size:22px;margin-bottom:12px}
.snl-fk-intro h2 .snl-fk-mk{display:block;width:40px;height:3px;background:var(--gold);margin-bottom:12px}
.snl-fk-intro p{font-size:16px;margin-bottom:14px}
.snl-fk-faq{padding:30px 0 10px;max-width:760px;margin:0 auto}
.snl-fk-faq h2{font-size:22px;margin-bottom:16px}
.snl-fk-faq h2 .snl-fk-mk{display:block;width:40px;height:3px;background:var(--gold);margin-bottom:12px}
.snl-fk-page details{border-bottom:1px solid var(--bn);padding:4px 0}
.snl-fk-page summary{cursor:pointer;padding:14px 0;font-weight:700;color:var(--blue);font-size:16px;list-style:none;display:flex;justify-content:space-between;align-items:center}
.snl-fk-page summary::-webkit-details-marker{display:none}
.snl-fk-page summary::after{content:"+";font-size:21px;color:var(--gold);font-weight:300}
details[open] .snl-fk-page summary::after{content:"\2013"}
.snl-fk-page details p{padding:0 0 16px;font-size:15px}
.snl-fk-cal-wrap{padding:18px 0 60px}
.snl-fk-lead a{color:var(--terra);text-decoration:underline;text-underline-offset:2px;transition:all .3s ease}
.snl-fk-lead a:hover{color:var(--blue)}
.snl-fk-cta{max-width:760px;margin:24px auto 8px;padding:38px 40px;background:var(--light);text-align:center;border-radius:8px;border-top:3px solid var(--gold)}
.snl-fk-cta h3{font-size:20px;margin-bottom:8px}
.snl-fk-cta p{font-size:14.5px;color:var(--text);max-width:54ch;margin:0 auto 20px;line-height:1.6}
.snl-fk-cta-btn{display:inline-flex;align-items:center;gap:6px;padding:13px 28px;background:var(--burgundy);color:#fff;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:4px;text-decoration:none;transition:all .3s ease}
.snl-fk-cta-btn:hover{background:var(--green)}
