:root{
  --bg:#FAFAFA; --ink:#1A1B1C; --muted:#AEADAD; --ink-weak:#4a4b4c; --sheet:#FAFAFA;
}

/* Globale Content-Breite zentral definieren */
:root { --content-w: 664px; }

/* Falls irgendwo noch inline max-width steht, hier sauber übersteuern */
.single .twok-content{ max-width: var(--content-w) !important; }

/* Post-Navigation auf Contentbreite bringen */
.twok-postnav.indented{ max-width: var(--content-w); }

/* Extra Luft unten, damit nix an die Bottom-Nav stößt */
.single .twok-postnav{
  margin-bottom: calc(var(--bottomnav-h, 90px) + 80px);
}

/* Optional: falls du es nur auf Single noch üppiger willst */
.single .twok-content{ margin-bottom: 40px; }

*{box-sizing:border-box}
body{background-color: #FAFAFA !important; color:var(--ink); line-height:1.5;}

.twok-wrap{max-width:1200px; margin:0 auto; padding:0 36px; padding-top: 72px;}
.twok-grid{display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:64px;}
@media (max-width:1024px){ .twok-grid{grid-template-columns:1fr} }

.twok-post{padding:80px 0; border-bottom:1px solid #eee;}
.twok-post:first-child{padding-top:0px}

.twok-thumb img{display:block; width:100%; max-width:720px; height:auto; aspect-ratio:720/450; object-fit:cover;}

.indented{margin-left:80px; max-width:600px;}
@media (max-width:780px){ .indented{margin-left:0} }

.twok-title{margin:0px 0px 24px 80px; font-size:36px; line-height:44px;}
.twok-title a{text-decoration:none; color:inherit;}
.twok-title a:hover{opacity:.8}

.twok-meta{display:flex; align-items:center; gap:12px; margin-top:24px; margin-bottom:24px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); font-size:14px; line-height:14px;}
.twok-meta-avatar img{width:40px; height:40px; border-radius:999px; display:block}

.twok-excerpt{margin-top:0; margin-bottom:24px; color:var(--ink); font-size:16px; line-height:24px;}

.twok-actions{display:flex; gap:16px; margin-top:40px;}
.twok-btn{display:inline-block; padding:8px 20px; border:1px solid #1a1b1c; text-decoration:none; color:#1a1b1c; border-radius:999px;}
.twok-btn:hover{background:#1a1b1c; color:#fff}
.twok-share{appearance:none; border:0; background:transparent; color:var(--ink-weak); text-transform:uppercase; letter-spacing:.05em; font-size:14px; padding:10px 0; cursor:pointer;}
.twok-share:hover{opacity:.8}

.twok-sidebar{position:relative}
.twok-recent ul, .twok-catlist{list-style:none; padding:0; margin:0}
.twok-recent li + li{margin-top:14px}
.twok-recent a{color:var(--ink); text-decoration:none}
.twok-recent a:hover{text-decoration:underline}

/* Kategorien rechts: 14/14px, 20px Abstand */
.twok-catlist li{font-size:14px; line-height:14px; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin-bottom:12px;}
.twok-catlist a{color:var(--muted); text-decoration:none;}
.twok-catlist a:hover{text-decoration:underline}

/* Pagination minimal */
.twok-pagination{margin:60px 0 40px;}

/* Reveal-Nav (oben) */
/* Reveal-Nav (nur falls wirklich Bottomnav aktiv wäre) */
body.twok-has-bottomnav .twok-topnav{
  position:fixed; left:0; right:0; top:-100px; height:90px;
  background:#F0E9E1;
  border-bottom:1px solid #eee;
  display:flex; align-items:center; gap:28px; padding:0 24px;
  transition:transform .35s ease, top .35s ease;
  transform:translateY(-100px);
  z-index:999;
  justify-content:center;
}
body.twok-has-bottomnav .twok-topnav.is-visible{ top:0; transform:translateY(0); }

.twok-topnav a, .twok-topnav button{
  text-transform:uppercase; letter-spacing:.05em;
  font-size:18px; line-height:14px;
  color:var(--muted); text-decoration:none; background:none; border:0; cursor:pointer;
}
.twok-topnav .twok-spacer{ flex:1 1 auto; }
.twok-topnav .twok-searchbtn{ width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; }

.twok-topnav{
  position:sticky; top:0; height:90px;
  background:#fafafa; border-top:1px solid #eee; border-bottom:1px solid #eee;
  display:flex; align-items:center; justify-content:center; padding:0 24px; z-index:999;
}
.twok-topnav .twok-topnav-inner{ display:flex; align-items:center; gap:36px; }
.twok-topnav a, .twok-topnav button{
  text-transform:uppercase; letter-spacing:.05em; font-size:18px; line-height:14px;
  color:var(--muted); text-decoration:none; background:none; border:0; cursor:pointer;
}
.twok-topnav .twok-searchbtn{ width:40px; height:40px; display:inline-flex; align-items:center; justify-content:center; }



/* ------------Vollflächige Suche------------------ */
/* ==== Vollflächige Suche (verfeinert) ==== */
.twok-search-overlay{
  position:fixed; inset:0; z-index:1000;
  display:none; align-items:center; justify-content:center;
  padding:24px;
background:#fff;               /* hell/weiß */
  backdrop-filter:none;          /* kein Blur */
}
.twok-search-overlay.is-open{ display:flex; }

.twok-search-dialog{
  width:min(780px, 92vw);
  transform: translateY(-6vh);
}

.twok-search-input{
  width:100%;
  font-size:34px; line-height:1.25;
  padding:22px 26px;
  border:1px solid #eee;
  border-radius:20px;
  background:#fff;
  outline:none;
  box-shadow:none;               /* flach */
}

.twok-search-hint{
  margin-top:12px;
  color:#AEADAD; font-size:12px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
  text-align:center;
}

/* Close-Button: flach, ohne Shadow */
.twok-search-close{
  position:fixed; top:24px; right:24px;
  width:40px; height:40px; border-radius:999px;
  border:1px solid #ddd;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  box-shadow:none;               /* flach */
}
.twok-search-close:hover{ background:#FAFAFA; }
.twok-search-close svg{ display:block }


/* Suchfeld: gleiche Schrift wie der Rest, korrekte Farben */
.twok-search-input{
  font-family:inherit;         /* nutzt die aktuell gesetzte Site-Schrift */
  color:var(--ink);            /* #1A1B1C */
  caret-color:var(--ink);
  -webkit-text-size-adjust:100%;
}

/* Platzhalter dezent */
.twok-search-input::placeholder{
  color:var(--muted);          /* #AEADAD */
  opacity:1;
}

/* iOS/Autofill etwas neutralisieren (optional, aber hilfreich) */
.twok-search-input:-webkit-autofill{
  -webkit-text-fill-color:var(--ink);
  transition:background-color 9999s ease 0s;
}




/*-------PRINT---------*/
@media print{
  /* Seitenränder */
  @page { margin: 18mm; }

  /* Nur Inhalt drucken */
  .twok-topnav, .twok-sidebar, .twok-actions, .twok-pagination, .twok-search-overlay{ display:none !important; }

  /* Farben & Typo für Druck */
  body{ color:#000; }
  a, a:visited{ color:#000; text-decoration:underline; }
  /* Links als URL in Klammern nachstellen */
  a[href^="http"]:after{ content:" (" attr(href) ")"; font-size:10px; }

  /* Bilder und Captions */
  .twok-cap-overlay{ display:none !important; } /* Overlay im Druck ausblenden */
  .twok-cap-below{ color:#555; font-style:italic; }

  /* Layout auf 1 Spalte, volle Breite für Text */
  .twok-grid{ display:block; }
  .indented{ margin-left:0; max-width:100%; }

  /* Vermeide „hängende“ Zeilen */
  p, h1, h2, h3, h4, blockquote{ orphans:3; widows:3; }
  h1, h2, h3{ page-break-after:avoid; }
  img{ page-break-inside:avoid; }
}

/*-------CAPTION---------*/

.twok-figure{ max-width:720px; margin:0; } 
.twok-thumb{position:relative; display:block;}
.twok-cap-below{
  display:block;
  width:100%;
  margin:8px auto 0;
  text-align:center;                                  /* HIER: zentriert */
  font-size:12px; line-height:16px; color:#AEADAD; font-style:italic;
}


/* Titel wie Kategorien, aber nicht klickbar + Sonderfarbe */
.twok-aside-title{
  font-size:14px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
  color:#275C8D; margin-bottom:20px;
}

/*-------HEADER---------*/
.twok-sitehead{
  display:flex; align-items:center; justify-content:center;
  padding-top:80px; margin-top: 0px; padding-bottom:0px;
}
.twok-sitehead-logo{
  max-width: 480px; height:auto; display:block; padding-bottom: 60px;
}



/*-------AUTORBOX RECHTS---------*/

/* Single: Autorbox rechts */
.twok-sidebar .twok-authorbox{
  display:flex; flex-direction:column; align-items:left;
}
.twok-author-avatar img,
.twok-author-avatar .twok-avatar-fallback{
  width:120px; height:120px; border-radius:999px; display:block;
}
.twok-author-meta{
  margin-top:20px; text-align:left;
  color:#1A1B1C; font-size:14px; line-height:20px;
  letter-spacing:.05em; text-transform:uppercase;
}
.twok-author-meta .twok-author-line + .twok-author-line{ margin-top:2px; }

/* Kategorienblock in der Sidebar mit 60px Abstand zu den Metainfos */
.twok-sidebar .twok-cats{ margin-top:60px; }



/* ==== Post-Navigation am Ende ==== */
.twok-postnav{ margin-top:40px; padding-top:24px; border-top:1px solid #eee; }
.twok-postnav-inner{ display:flex; justify-content:space-between; gap:24px; }
.twok-postnav a{ text-decoration:none; color:#1A1B1C; display:inline-block; max-width:420px; }
.twok-postnav .twok-postnav-kicker{
  display:block; margin-bottom:6px;
  font-size:12px; line-height:14px; color:#AEADAD;
  text-transform:uppercase; letter-spacing:.05em;
}
.twok-postnav .twok-postnav-arrow{ font-size:18px; margin-right:8px; }
.twok-postnav strong{ display:block; font-weight:700; line-height:1.3; }
.twok-prev{ flex:1; }
.twok-next{ flex:1; text-align:right; }
.twok-next a .twok-postnav-arrow{ margin:0 0 0 8px; } /* Pfeil rechts */
@media (max-width:780px){
  .twok-postnav-inner{ flex-direction:column; }
  .twok-next{ text-align:left; }
}


/* ==== Suchergebnisse ==== */
.twok-results-title{
  margin: 0 0 24px;
  color:#275C8D; font-size:14px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
}

.twok-results-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:48px 32px;
  margin-bottom: 20px;
}
@media (max-width:980px){ .twok-results-grid{ grid-template-columns:1fr; } }

.twok-card-thumb img{ display:block; width:100%; height:auto; aspect-ratio:720/450; object-fit:cover; }
.twok-card-cap{
  margin-top:8px; font-size:12px; line-height:16px;
  color:#AEADAD; font-style:italic; text-align:center;
}

.twok-card-title{ margin:16px 0 0; font-size:24px; line-height:30px; }
.twok-card-title a{ color:#275C8D; text-decoration:none; }
.twok-card-title a:visited{
  color:#275C8D;}
.twok-card-title a:hover{ opacity:.8; }

.twok-card-meta{
  margin-top:12px;
  display:flex; flex-wrap:wrap; gap:6px 10px;
  color:#AEADAD; font-size:14px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
}

.twok-card-excerpt{ margin-top:12px; font-size:16px; line-height:24px; color:#1A1B1C; }
.twok-card-actions{ margin-top:16px; }


/* ---------------REVEAL-------------*/
/* ===== Sequenzielles Reveal (Home & Single) ===== */
:root{
  --reveal-dur:.44s;
  --reveal-ease:cubic-bezier(.2,.7,.2,1);
}

/* HOME: Startzustand (solange .is-in noch nicht am Artikel hängt) */
.home .twok-post:not(.is-in) .twok-figure,
.home .twok-post:not(.is-in) .twok-title,
.home .twok-post:not(.is-in) .twok-meta,
.home .twok-post:not(.is-in) .twok-excerpt,
.home .twok-post:not(.is-in) .twok-actions{
  opacity:0; transform:translateY(10px);
}

/* HOME: Zielzustand + Delays pro Teil */
.home .twok-post.is-in .twok-figure,
.home .twok-post.is-in .twok-title,
.home .twok-post.is-in .twok-meta,
.home .twok-post.is-in .twok-excerpt,
.home .twok-post.is-in .twok-actions{
  opacity:1; transform:none;
  transition:opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease);
  will-change:opacity, transform;
}
.home .twok-post.is-in .twok-figure{ transition-delay:0s; }
.home .twok-post.is-in .twok-title{ transition-delay:.08s; }
.home .twok-post.is-in .twok-meta{ transition-delay:.16s; }
.home .twok-post.is-in .twok-excerpt{ transition-delay:.24s; }
.home .twok-post.is-in .twok-actions{ transition-delay:.32s; }

/* SINGLE: Artikelteile */
.single .twok-post:not(.is-in) .twok-figure,
.single .twok-post:not(.is-in) .twok-title,
.single .twok-post:not(.is-in) .twok-content{
  opacity:0; transform:translateY(10px);
}
.single .twok-post.is-in .twok-figure,
.single .twok-post.is-in .twok-title,
.single .twok-post.is-in .twok-content{
  opacity:1; transform:none;
  transition:opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease);
}
.single .twok-post.is-in .twok-figure{ transition-delay:0s; }
.single .twok-post.is-in .twok-title{ transition-delay:.10s; }
.single .twok-post.is-in .twok-content{ transition-delay:.20s; }

/* SINGLE: rechte Sidebar (Autorbox → Kategorien) */
.single .twok-sidebar:not(.is-in) .twok-authorbox,
.single .twok-sidebar:not(.is-in) .twok-cats{
  opacity:0; transform:translateY(10px);
}
.single .twok-sidebar.is-in .twok-authorbox,
.single .twok-sidebar.is-in .twok-cats{
  opacity:1; transform:none;
  transition:opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease);
}
.single .twok-sidebar.is-in .twok-authorbox{ transition-delay:.12s; }
.single .twok-sidebar.is-in .twok-cats{ transition-delay:.20s; }

/* Bewegungsreduktion respektieren */
@media (prefers-reduced-motion: reduce){
  .home .twok-post:not(.is-in) .twok-figure,
  .home .twok-post:not(.is-in) .twok-title,
  .home .twok-post:not(.is-in) .twok-meta,
  .home .twok-post:not(.is-in) .twok-excerpt,
  .home .twok-post:not(.is-in) .twok-actions,
  .single .twok-post:not(.is-in) .twok-figure,
  .single .twok-post:not(.is-in) .twok-title,
  .single .twok-post:not(.is-in) .twok-content,
  .single .twok-sidebar:not(.is-in) .twok-authorbox,
  .single .twok-sidebar:not(.is-in) .twok-cats{
    opacity:1; transform:none;
  }
}


/* Meta-Links sollen die Meta-Optik übernehmen */
.twok-meta a,
.twok-card-meta a,
.twok-author-meta a{
  color: inherit;
  text-decoration: none;
}
.twok-meta a:hover,
.twok-card-meta a:hover,
.twok-author-meta a:hover{
  text-decoration: underline;
}


/* 404 Intro & Inline-Suche (kleiner, linksbündig) */
.twok-404-intro{ max-width:600px; margin-bottom:32px; }
.twok-404-text{ margin:12px 0 12px; font-size:16px; line-height:24px; color:var(--ink); }

/* Nur die Inline-Suche auf der 404-Seite kleiner stylen (Overlay bleibt groß) */
.twok-inline-search .twok-search-input{
  font-size:20px; line-height:1.3;
  padding:12px 16px;
  border-radius:12px;
 margin-top: 12px;
}

/* 404: Titel linksbündig, ohne Einzug */
.twok-404-intro .twok-title{
  margin-left:0;           /* überschreibt evtl. inherited/alte Regeln */
}



/* Kategorien in der rechten Sidebar: deutlicher darstellen */
.twok-sidebar .twok-catlist a{
  display:inline-block;
  background:#fff;              /* Wunsch: weißer Hintergrund */
  padding:6px 10px;             /* rundherum ~6px (leicht mehr seitlich für Optik) */
  border-radius:3px;            /* Wunsch: 3px */
  text-decoration:none;
  color:var(--muted);           /* wie zuvor (#AEADAD) */
  transition:background .2s ease, color .2s ease, box-shadow .2s ease;
}

.twok-sidebar .twok-catlist a:hover{
  background:#F3F4F5;           /* dezentes Hover – optional, aber hübsch */
  text-decoration:none;         /* bei Bedarf weiter underline entfernen */
}

.twok-sidebar .twok-catlist a:focus{
  outline:none;
  box-shadow:0 0 0 2px #275C8D; /* klare Tastaturfokussierung */
}



/* ---------------STICKY RECHTE SPALTE-------------*/
/* Grid-Items oben ausrichten – hilft Sticky in manchen Browsern */
.twok-grid{ align-items:flex-start; }

/* Desktop: Sidebar kleben lassen */
@media (min-width: 1025px){
  .twok-sidebar{
    position: sticky;
    top: calc(var(--topnav-h, 90px) + 40px);               /* Abstand zum Viewport oben */
    align-self: start;       /* Safari/Firefox Robustheit */
  }
}


/* ---------------PAGINATION-------------*/
/* Pagination als kleine Pills mittig */
.twok-pagination{
  margin:60px 0 40px;
  text-align:center;
}
.twok-pagination .page-numbers{
  display:inline-block;
  min-width:34px; padding:8px 12px;
  margin:0 4px;
  border:1px solid #ddd; border-radius:999px;
  text-decoration:none; color:#1A1B1C; font-size:14px; line-height:14px;
}
.twok-pagination a.page-numbers:hover{ background:#FAFAFA; }
.twok-pagination .current{
  background:#1A1B1C; color:#fff; border-color:#1A1B1C;
}


/* ---- Angebot (CLEAN) ---- */

/* Typografische Leistungsaufzählung (ohne Boxen) */
.twok-angebot-listclean{
  margin-top:60px;
  max-width:var(--content-w, 664px);
}
.twok-angebot-stack + .twok-angebot-stack{
  margin-top:24px;
  padding-top:16px;
  border-top:1px solid #eee;           /* feiner Rhythmus zwischen den Blöcken */
}

.twok-angebot-h3{
  margin:6px 0 8px;
  font-size:18px; line-height:24px; color:#1A1B1C;
}
.twok-angebot-ul{
  margin:0; padding-left:16px; border-left: 1px solid #eaeaea;         /* klassische Bullets */
}
.twok-angebot-ul li{
  font-size:16px; line-height:24px; color:#1A1B1C;
}
.twok-angebot-ul li + li{ margin-top:4px; }

/* Werte-Block (wenn genutzt) */
.twok-angebot-values{ margin-top:32px; max-width:var(--content-w, 664px); }
.twok-angebot-points{ margin:8px 0 0; padding:0; list-style:none; }
.twok-angebot-points li + li{ margin-top:8px; }
.twok-angebot-points strong{ color:#1A1B1C; }

/* CTA clean – NUR Textlink, keine Box */
.twok-cta{ margin-top:60px; max-width:var(--content-w, 664px); background:transparent; border:0; padding:0; }
.twok-cta-link{
  color:#275C8D; text-decoration:none;
  border-bottom:1px solid currentColor; padding-bottom:2px;
}
.twok-cta-link:hover{ opacity:.9; }

/* Mini-Team (falls am Ende genutzt) */
.twok-team-mini{
  margin-top:32px;
  display:grid; grid-template-columns:1fr 1fr; gap:24px;
  max-width:var(--content-w, 664px);
}
@media (max-width:640px){ .twok-team-mini{ grid-template-columns:1fr; } }
.twok-team-mini-card{ text-align:center; }
.twok-team-mini-avatar{ width:96px; height:96px; border-radius:999px; display:block; margin:0 auto 10px; }
.twok-team-mini-name{
  color:#1A1B1C; font-size:14px; line-height:20px;
  text-transform:uppercase; letter-spacing:.05em;
}

/* Extra Bottom-Space nur auf der Angebots-Seite */
.page-template-page-angebot .twok-wrap{
  padding-bottom: calc(var(--bottomnav-h, 90px) + 120px);
}

/* --- Entfernte „Karten“-Variante NICHT mehr nutzen ---
   (falls der Markup-Block versehentlich noch drin ist, hier neutralisiert) */
.twok-angebot-cards{ display:none !important; }




/* Angebot: drei Spalten, clean */
.twok-angebot-listclean{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap:24px;
  max-width: var(--content-w, 664px); /* behält eure Contentbreite bei */
}

/* responsive runterstufen */
@media (max-width: 1100px){
  .twok-angebot-listclean{ grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px){
  .twok-angebot-listclean{ grid-template-columns: 1fr; }
}

/* frühere vertikale Trennlinien/Abstände neutralisieren */
.twok-angebot-listclean .twok-angebot-stack{ padding-top:0; border-top:0; }
.twok-angebot-listclean .twok-angebot-stack + .twok-angebot-stack{ margin-top:0; }

/* Feinschliff Typo (bleibt wie gehabt) */
.twok-angebot-listclean .twok-kicker{ margin-bottom:8px; }
.twok-angebot-h3{ margin:0 0 8px; }





/* ---------------WER WIR SIND-------------*/
/* Wer wir sind – Intro */
.twok-kicker{
  color:#AEADAD;
  font-size:14px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
  margin-bottom:12px;
}
.twok-about-intro p{ max-width:var(--content-w, 664px); }

/* Autoren-Layout */
.twok-authors{
  margin-top:80px;
    margin-bottom:80px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:48px;
  max-width:var(--content-w, 664px);
}
@media (max-width:980px){
  .twok-authors{ grid-template-columns:1fr; }
}
.twok-author-card{ }
.twok-author-head{ text-align:center; margin-bottom:16px; }
.twok-author-portrait{
  width:160px; height:160px; border-radius:999px; display:block;
  margin:0 auto 12px;
}
.twok-author-name{
  color:#1A1B1C;
  font-size:14px; line-height:20px;
  text-transform:uppercase; letter-spacing:.05em;
}
.twok-author-sub{
  color:#AEADAD;
  font-size:14px; line-height:20px;
  text-transform:uppercase; letter-spacing:.05em;
}

.twok-author-bio {
  margin-top:24px;
}

.twok-author-bio p{
  margin:12px 0;
  font-size:16px; line-height:24px; color:#1A1B1C;
}

/* Extra Bottom-Space nur auf der "Wer wir sind"-Seite */
.page-template-page-wer-wir-sind .twok-wrap{
  padding-bottom: calc(var(--bottomnav-h, 90px) + 120px);
}

/* Wer wir sind – Mitgliedschaftszeile (statt Chips) */
.twok-author-member{
  margin-top:6px;
  color:#AEADAD;
  font-size:14px; line-height:20px;
  text-transform:uppercase; letter-spacing:.05em;
  text-align:center;
}
.twok-author-member a{
  color:#275C8D;
  text-decoration:underline;
}
.twok-author-member a:hover{ opacity:.9; }

/* Safety: Falls irgendwo noch Chips-Markup übrig ist, auf dieser Seite ausblenden */
.page-template-page-wer-wir-sind .twok-badges{ display:none; }



/* ---------------SCROLL TO TOP-------------*/

/* ToTop-Button: unten rechts in die Ecke */
.twok-totop{
  right: 24px;
  bottom: 24px;                 /* statt calc(... + 24px) */
  position: fixed;
  width:44px; height:44px;
  border-radius:999px;
  border:1px solid #ddd;
  background:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
  z-index: 120;
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .2s ease, transform .2s ease, visibility .2s;
}
.twok-totop.is-visible{ opacity:1; visibility:visible; transform:none; }




/* ---------------MOBILE ANPASSUNG-------------*/
/* Avatar stets rund & unverzerrt */
.twok-meta-avatar{
  width:40px; height:40px;
  flex:0 0 40px;                 /* nicht schrumpfen */
}
.twok-meta-avatar img,
.twok-meta-avatar .twok-avatar-fallback{
  width:100%; height:100%;
  display:block;
  object-fit:cover;
  border-radius:999px;
}

/* Avatar stets rund & unverzerrt */
.twok-meta-avatar{
  width:40px; height:40px;
  flex:0 0 40px;                 /* nicht schrumpfen */
}
.twok-meta-avatar img,
.twok-meta-avatar .twok-avatar-fallback{
  width:100%; height:100%;
  display:block;
  object-fit:cover;
  border-radius:999px;
}

@media (max-width: 640px){
  .twok-sitehead{ padding-top:60px; padding-bottom:0px; }
  .twok-sitehead-logo{ max-width:200px; height:auto; }
}

/* Mobile: keine Einrückung */
@media (max-width: 780px){
  .indented{ margin-left:0 !important; }
}

/* Mobile: extra Luft am Seitenende, damit nichts an die Bottom-Nav stößt */
@media (max-width: 780px){
  .twok-sidebar{ 
    margin-bottom: calc(var(--bottomnav-h, 90px) + 80px);
  }
}

/* Mobile: Textlinks in der Bottom-Nav ausblenden, Menütaste zeigen */
@media (max-width: 780px){
  .twok-topnav a{ display:none; }
  .twok-topnav .twok-menubtn{ display:inline-flex; align-items:center; justify-content:center; }
}
/* Desktop: Menütaste verstecken */
@media (min-width: 781px){
  .twok-topnav .twok-menubtn{ display:none; }
}

/* Menü-Overlay: hell & clean wie Suche */
.twok-menu-overlay{
  position:fixed; inset:0; z-index:1000;
  display:none; align-items:center; justify-content:center;
  padding:24px; background:#fff;
}
.twok-menu-overlay.is-open{ display:flex; }
.twok-menu-close{
  position:fixed; top:24px; right:24px;
  width:40px; height:40px; border-radius:999px;
  border:1px solid #ddd; background:#fff;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.twok-menu-dialog{ width:min(520px, 92vw); }
.twok-menu-list{ list-style:none; margin:0; padding:0; text-align:center; }
.twok-menu-list li + li{ margin-top:16px; }
.twok-menu-list a{
  text-decoration:none; color:#1A1B1C;
  font-size:18px; line-height:24px;
}
.twok-menu-list a:hover{ text-decoration:underline; }

/* Body nicht scrollen, wenn Overlay offen */
.twok-menu-open{ overflow:hidden; }


/* Mobile Menü-Overlay: Links wie Desktop/Kategorien-Stil */
.twok-menu-list a{
  display:inline-block;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:24px;            /* wenn du EXAKT wie Kategorien willst: 14px */
  line-height:14px;
  color:var(--muted);        /* #AEADAD */
  text-decoration:none;
  padding:8px 0;             /* bessere Tap-Ziele */
}
.twok-menu-list a:hover,
.twok-menu-list a:focus,
.twok-menu-list a:active{
  text-decoration:underline;
  outline:none;
}
.twok-menu-list a:visited{ color:var(--muted); }

/* Extra Luft unter der Pagination, damit sie nicht unter die Bottom-Nav rutscht */
body.twok-has-bottomnav .twok-pagination{
  margin-bottom: calc(var(--bottomnav-h, 90px) + 80px); /* = 170px */
}


/* ========== MOBILE FIXES: TITEL UMBRECHEN & BILDER NICHT ÜBERLAUFEN ========== */

/* 1) Lange Wörter sauber umbrechen/hyphenieren (Titel, Karten-Titel, Post-Navi) */
@media (max-width: 780px){
  .twok-title, .twok-title a,
  .twok-card-title, .twok-card-title a,
  .twok-postnav strong {
    overflow-wrap:anywhere;        /* moderne Browser */
    word-break:break-word;         /* Fallback */
    hyphens:auto;                  /* Silbentrennung */
    -webkit-hyphens:auto;          /* Safari/iOS */
  }
}

/* 2) Thumbnails responsiv begrenzen (Listen + Karten) */
.twok-figure{ margin:0; }
.twok-thumb{ display:block; width:100%; max-width:100%; }
.twok-thumb img{
  display:block;
  width:100%;
  height:auto;                     /* kein Verzerren */
}

/* Karten-Variante (falls nicht bereits gesetzt) */
.twok-card-thumb{ display:block; width:100%; max-width:100%; }
.twok-card-thumb img{
  display:block;
  width:100%;
  height:auto;
  object-fit:cover;                /* sauberes Crop innerhalb */
}

/* 3) Sicherheitsnetz: horizontales Überlaufen auf ganz schmalen Screens verhindern */
@media (max-width: 780px){
  .twok-wrap, .twok-grid, .twok-list{
    max-width:100%;
  }
  html, body{ overflow-x:hidden; } /* nur mobil als letzter Schutz */
}


/* Mobile: Pill-Pagination einzeilig, horizontal scrollen statt umbrechen */
@media (max-width: 780px){
  .twok-pagination{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;                         /* Abstand zwischen Pills */
    overflow-x:auto;                 /* horizontales Scrollen erlauben */
    -webkit-overflow-scrolling:touch;
    white-space:nowrap;              /* kein Umbruch */
    padding:0 12px 12px;             /* unten etwas Luft, für Thumb-Hitbox & Nav */
    margin-bottom: calc(var(--bottomnav-h, 90px) + 80px); /* bleibt über Bottom-Nav */
    scrollbar-width:none;            /* Firefox: Scrollbar aus */
  }
  .twok-pagination::-webkit-scrollbar{ display:none; }   /* WebKit: Scrollbar aus */

  /* Items kompakter & nicht schrumpfen */
  .twok-pagination .page-numbers,
  .twok-pagination .dots{
    flex:0 0 auto;
    display:inline-block;
    min-width:32px;
    padding:6px 10px;
    line-height:14px;
    margin:0;                        /* wir nutzen gap statt margin */
  }
}



/* ========== TEILEN-AKTIONEN AUF DER SINGLE-SEITE ========== */

/* Single: Aktionsleiste */
.single .twok-actionbar{
  display:flex; gap:12px; align-items:center; justify-content:flex-end;
  position:relative; max-width: 664px; margin-right: 4px;
}
@media (max-width:780px){
  .single .twok-actionbar{ justify-content:flex-start; }
}

/* Buttons: flach, rund */
.twok-action-btn{
  width:40px; height:40px; border-radius:999px;
  border:0px solid #eaeaea; background:#fff;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.twok-action-btn:hover{ background:#FAFAFA; }
.twok-action-btn:focus{ outline:none; box-shadow:0 0 0 2px rgba(39,92,141,.25); }
.twok-action-btn svg{ display:block; }

/* Popover: klein, flach */
.twok-share-popover{
  position:absolute; right:0; top:calc(100% + 8px);
  background:#fff; border:1px solid #eee; border-radius:14px;
  padding:8px; min-width:220px; z-index:1000; display:none;
}
.twok-share-popover.is-open{ display:block; }
.twok-share-list{ list-style:none; margin:0; padding:0; }
.twok-share-item{
  display:block; padding:8px 10px;
  color:var(--ink); text-decoration:none;
  border-radius:10px;
}
.twok-share-item:hover{ background:#FAFAFA; text-decoration:none; }

/* Beim Drucken die Aktionsleiste & Navi ausblenden (sauberer PDF-Export) */
@media print{
  .twok-actionbar, .twok-topnav, .twok-search-overlay, .twok-menu-overlay,
  .twok-sidebar, .twok-postnav, .twok-totop{ display:none !important; }
  body{ background:#fff; }
  a[href]::after{ content:" (" attr(href) ")"; font-size:12px; }
}



/* ========== COPYRIGHT ========== */
/* Footer: Copyright + Impressum */
.twok-legal{
  text-align:center;
  padding:24px 0;
  margin-top:40px;
  /* genug Luft zur Bottom-Nav */
  margin-bottom: 40px;
  color:var(--muted);                 /* #AEADAD */
  font-size:12px; line-height:14px;
  text-transform:uppercase; letter-spacing:.05em;
}
.twok-legal a.twok-legal-link{
  color:#275C8D; text-decoration:none;
}
.twok-legal a.twok-legal-link:hover{ text-decoration:underline; }
.twok-legal-sep{ padding:0 6px; }

/* Auf sehr kleinen Screens etwas kompakter */
@media (max-width:640px){
  .twok-legal{ padding:18px 0; }
}


/* ========== RECHTE SEITENLEISTE LISTENABSTAND ========== */
/* Sidebar: einheitlicher Abstand für Listenblöcke */
.twok-popular ul{ list-style:none; margin:0; padding:0; }
.twok-popular li + li{ margin-top:12px !important; }


/* ========== MOST POPULAR ========== */
/* Sidebar: Meistgeklickt wie Neueste Beiträge stylen */
.twok-popular ul{ list-style:none; margin:0; padding:0; }
.twok-popular li + li{ margin-top:14px; }
.twok-popular a{
  color: var(--ink);               /* #1A1B1C */
  text-decoration: none;
}
.twok-popular a:hover{
  text-decoration: underline;
}


/* ========== MOBILE STICKY PATCH ========== */
/* Topnav: sticky überall + iOS-WebKit-Präfix */
.twok-topnav{
  position: -webkit-sticky; /* iOS Safari */
  position: sticky;
  top: 0;
  z-index: 999;
}

/* Fallback: Wenn sticky nicht unterstützt wird → fixed oben andocken */
@supports not ((position: sticky) or (position: -webkit-sticky)) {
  .twok-topnav{ position: fixed; top: 0; left: 0; right: 0; }
  /* Platz schaffen, damit die Nav nichts überlagert */
  body.twok-has-topnav .twok-sitehead{ padding-top: calc(100px + 90px); } /* Logoabstand + Navhöhe */
}

/* TOPNAV: Sticky-Variante erzwingen, alte Bottom-Reveal-Werte neutralisieren */
body.twok-has-topnav .twok-topnav{
  position:-webkit-sticky; /* iOS */
  position:sticky;
  top:0;
  bottom:auto !important;
  transform:none !important;
  transition:none !important;
  z-index:999;
}
body.twok-has-topnav .twok-topnav.is-visible{
  bottom:auto !important;
  transform:none !important;
}



/* ========== HOME TEASER GRID ========== */
/* Home: Teaser-Grid (ab Beitrag 2) – 2 Spalten, mobil 1 */
.twok-teasers{
  margin-top:60px;
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:48px 32px;
}
@media (max-width:980px){ .twok-teasers{ grid-template-columns:1fr; } }

/* Teaser-Reveal wie beim großen Artikel */
.home .twok-teaser:not(.is-in) .twok-card-thumb,
.home .twok-teaser:not(.is-in) .twok-card-title,
.home .twok-teaser:not(.is-in) .twok-card-meta,
.home .twok-teaser:not(.is-in) .twok-card-excerpt{
  opacity:0; transform:translateY(10px);
}
.home .twok-teaser.is-in .twok-card-thumb,
.home .twok-teaser.is-in .twok-card-title,
.home .twok-teaser.is-in .twok-card-meta,
.home .twok-teaser.is-in .twok-card-excerpt{
  opacity:1; transform:none;
  transition:opacity var(--reveal-dur) var(--reveal-ease), transform var(--reveal-dur) var(--reveal-ease);
  will-change:opacity, transform;
}





/* Meta in Teasern: präzise Abstände */
.twok-card-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0 4px; /* horizontal klein, vertikal 0 */
  color:#AEADAD;
  font-size:14px; line-height:16px;
  text-transform:uppercase; letter-spacing:.05em;
}

/* Punkt-Separator bekommt den Abstand, nicht die Textknoten */
.twok-card-meta .m-sep{ margin:0 2px !important; }

/* Links übernehmen die Meta-Optik (du hast global schon was ähnliches – hier nochmal lokal) */
.twok-card-meta a{
  color:inherit;
  text-decoration:none;
}
.twok-card-meta a:hover{ text-decoration:underline; }






:root{ --topnav-h: 90px; }

/* Fallback: wenn JS .is-fixed setzt → wirklich fixieren */
.twok-topnav.is-fixed{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 1000;
}
.twok-topnav.is-fixed + *{
  /* verhindert, dass der nachfolgende Inhalt unter die fixed-Nav rutscht */
  margin-top: var(--topnav-h, 90px);
}

/* Alte Bottom-Reveal-Reste vollständig neutralisieren, sobald Topnav aktiv */
body.twok-has-topnav .twok-topnav{
  position: -webkit-sticky; /* iOS */
  position: sticky;
  top: 0;
  bottom: auto !important;
  transform: none !important;
  transition: none !important;
  z-index: 999;
}
body.twok-has-topnav .twok-topnav.is-visible{
  top: 0 !important;
  transform: none !important;
}


.twok-sidebar .twok-aside-title { font-weight: 300; margin: 0 0 .5rem; }
.twok-sidebar section { margin-top: 60px; }
.twok-sidebar section:first-child { margin-top: 0; }
.twok-muted { color: #AEADAD; }

/* Robust: immer 60px Abstand über "Meistgeklickt" */
.twok-sidebar .twok-popular { margin-top: 60px !important; }

/* Kategorien-Block in der Sidebar vorerst ausblenden */
.twok-sidebar .twok-cats { display: none !important; }




/* ---- Sidebar: Fundstücke-Box ---- */
.twok-fundsbox { margin-top: 60px; }
.twok-fundsbox-link{
  display:block;
  padding:20px 22px;
  background:#fff;
  border:1px solid #eaeaea;
  border-radius:16px;
  text-decoration:none;
  text-align:center;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.twok-fundsbox-link:hover{
  background:#F3F8FE;
  transform:translateY(-1px);
  box-shadow:0 2px 10px rgba(0,0,0,.04);
}
.twok-fundsbox-line{
  display:block;
  font-size:18px;
  line-height:22px;
  color:#1A1B1C;
}
.twok-fundsbox-line:first-child{ margin-bottom:2px; }




/* Archiv "Fundstücke" – Title mittig & ohne Einzug */
.post-type-archive-fundstueck .twok-title{
  margin-left: 0 !important;     /* überschreibt Standard-Einzug */
  text-align: center;
}

/* Grid für Fundstücke – zentriert, mehrspaltig, mit komfortablen Rändern */
.post-type-archive-fundstueck .twok-fund-grid{
  width: min(1100px, 92vw);
  margin: 0 auto;                 /* zentriert das gesamte Grid */
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 24px;
  padding: 12px 6px;              /* leichte Innenabstände, damit nichts klebt */
}

/* einzelne "Post-it"-Karten */
.twok-fund-card{
  background:#fff;
  border:1px solid #eaeaea;
  border-radius:16px;
  padding:16px;
}

.twok-fund-card a{
  color:#1A1B1C; text-decoration:none;
}
.twok-fund-card a:hover{ text-decoration:underline; }

/* Optional: kleine Bildvorschau oben in der Karte */
.twok-fund-card .twok-fund-thumb{
  display:block; margin:-16px -16px 12px; /* Bild bündig an die Box */
}
.twok-fund-card .twok-fund-thumb img{
  display:block; width:100%; height:auto; border-top-left-radius:16px; border-top-right-radius:16px;
}





/* Archiv-Header mittig */
.fundstuecke-archive .archive-header{
  margin: 60px 0 60px;
  text-align: center;
}
.fundstuecke-archive .archive-sub{ color:#666; }

/* Außenhülle zentriert die Masonry-Spalten */
.fundstuecke-archive .fund-outer{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 36px; /* verhindert "ankleben" am Rand */
}

/* Masonry via CSS columns */
.fundstuecke-archive .masonry{
  column-width: 320px;
  column-gap: 20px;
}

/* Karten */
.fundstuecke-archive .card{
  display:inline-block;
  width:100%;
  margin:0 0 20px;
  break-inside: avoid;
  background:#F3F8FE;        /* Post-it-Feeling */
  border-radius:14px;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  overflow:hidden;
}
.fundstuecke-archive .card-media img{ display:block; width:100%; height:auto; }
.fundstuecke-archive .card-body{ padding:16px 16px 12px; }
.fundstuecke-archive .card-title{ font-size:1.1rem; line-height:1.3; margin:0 0 8px; }
.fundstuecke-archive .card-title a{ color:#275c8d; text-decoration:none; }
.fundstuecke-archive .card-title a:hover{ text-decoration:underline; }
.fundstuecke-archive .card-text p{ margin:.5rem 0; }
.fundstuecke-archive .card-meta{ display:block; font-size:.85rem; color:#777; margin-top:.25rem; }

/* kleine „Petersburger“ Unruhe */
.fundstuecke-archive .card:nth-child(3n){ transform: rotate(-.8deg); }
.fundstuecke-archive .card:nth-child(5n){ transform: rotate(.6deg); }
.fundstuecke-archive .card:nth-child(7n){ transform: rotate(-.4deg); }

/* Mobil einspaltig */
@media (max-width: 640px){
  .fundstuecke-archive .masonry{ column-width: 100%; }
}


/* Audio */
.twok-audio{ display:flex; align-items:center; gap:12px; margin:16px 0 24px; }
.twok-audio-btn{ border:1px solid #ddd; background:#fff; border-radius:999px; padding:8px 14px; cursor:pointer; }
.twok-audio-btn:hover{ background:#FAFAFA; }
.twok-audio-time{ color:#AEADAD; font-size:12px; letter-spacing:.05em; text-transform:uppercase; }

/* Audio-Block bündig wie Titel */
.twok-audio.indented{
  margin-left: 80px !important;    /* falls irgendwas überstimmt */
  max-width: 600px;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}

@media (max-width: 780px){
  .twok-audio.indented{
    margin-left: 0 !important;     /* mobil wie Titel */
    max-width: 100%;
  }
}

/* Button-Optik */
.twok-audio-btn{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #ddd;
  background: #fff;
  border-radius: 999px;
  padding: 8px 14px;
  cursor: pointer;
}
.twok-audio-btn .icon{ display:inline-flex; }
.twok-audio-time{
  color:#AEADAD; font-size:12px; line-height:14px;
  letter-spacing:.05em; text-transform:uppercase;
}

/* hidden-Attribut respektieren */
.twok-audio-btn .icon[hidden]{
  display: none !important;
}