/*
Theme Name: Feuerwehr Modern
Theme URI: https://example.com
Author: Dein Name
Author URI: https://example.com
Description: Modernes, cleanes WordPress-Theme fuer Feuerwehr-Webseiten
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: fw-modern
Tags: custom, responsive, dark
*/

/* =========================================================
   DESIGN TOKENS
   ========================================================= */
:root {
    --clr-bg:        #0d0f14;
    --clr-surface:   #13161e;
    --clr-surface-2: #1c2030;
    --clr-border:    rgba(255,255,255,.07);
    --clr-red:       #e8280b;
    --clr-red-dark:  #b81e07;
    --clr-red-glow:  rgba(232,40,11,.18);
    --clr-text:      #f0f2f7;
    --clr-muted:     #8a909f;
    --clr-white:     #ffffff;

    --font-display: 'Barlow Condensed', sans-serif;
    --font-body:    'DM Sans', sans-serif;

    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;

    --shadow-card: 0 4px 32px rgba(0,0,0,.45);
    --shadow-red:  0 0 40px rgba(232,40,11,.25);

    --transition: .25s cubic-bezier(.4,0,.2,1);
    --max-w: 1200px;
}

/* =========================================================
   RESET & BASE
   ========================================================= */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html  { scroll-behavior: smooth; font-size: 16px; }
body  {
    background-color: var(--clr-bg);
    color: var(--clr-text);
    font-family: var(--font-body);
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
}
img   { max-width: 100%; height: auto; display: block; }
a     { color: var(--clr-red); text-decoration: none; transition: color var(--transition); }
a:hover { color: var(--clr-white); }
ul    { list-style: none; }

/* =========================================================
   UTILITY
   ========================================================= */
.container {
    width: 100%;
    max-width: var(--max-w);
    margin-inline: auto;
    padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}
.section-label {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    font-family: var(--font-display);
    font-size: .8rem;
    font-weight: 600;
    letter-spacing: .18em;
    text-transform: uppercase;
    color: var(--clr-red);
    margin-bottom: 1rem;
}
.section-label::before {
    content: '';
    display: block;
    width: 24px; height: 2px;
    background: var(--clr-red);
    flex-shrink: 0;
}
.section-title {
    font-family: var(--font-display);
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 700;
    line-height: 1.1;
    color: var(--clr-white);
}
.btn {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    padding: .8rem 1.75rem;
    border-radius: var(--radius-sm);
    font-family: var(--font-display);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    transition: all var(--transition);
    cursor: pointer;
    border: none;
}
.btn-primary {
    background: var(--clr-red);
    color: var(--clr-white);
    box-shadow: 0 4px 20px rgba(232,40,11,.35);
}
.btn-primary:hover {
    background: var(--clr-red-dark);
    color: var(--clr-white);
    transform: translateY(-2px);
    box-shadow: 0 8px 28px rgba(232,40,11,.45);
}
.btn-outline {
    background: transparent;
    color: var(--clr-white);
    border: 1.5px solid rgba(255,255,255,.25);
}
.btn-outline:hover {
    border-color: var(--clr-red);
    color: var(--clr-red);
    background: var(--clr-red-glow);
}

/* =========================================================
   TOP BAR
   ========================================================= */
.topbar {
    background: var(--clr-surface);
    border-bottom: 1px solid var(--clr-border);
    padding: .5rem 0;
    font-size: .8rem;
    color: var(--clr-muted);
}
.topbar .container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .5rem;
}
.topbar-left { display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }
.topbar a    { color: var(--clr-muted); display: inline-flex; align-items: center; gap: .4rem; }
.topbar a:hover { color: var(--clr-red); }
.topbar-emergency {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    background: var(--clr-red);
    color: var(--clr-white) !important;
    padding: .25rem .9rem;
    border-radius: 100px;
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .04em;
    animation: pulse-red 2.5s ease-in-out infinite;
}
.topbar-emergency:hover { background: var(--clr-red-dark); }
@keyframes pulse-red {
    0%,100% { box-shadow: 0 0 0 0 rgba(232,40,11,.5); }
    50%     { box-shadow: 0 0 0 6px rgba(232,40,11,0); }
}

/* =========================================================
   HEADER / NAVIGATION
   ========================================================= */
#masthead {
    position: sticky;
    top: 0;
    z-index: 1000;
    background: rgba(13,15,20,.92);
    backdrop-filter: blur(18px) saturate(180%);
    -webkit-backdrop-filter: blur(18px) saturate(180%);
    border-bottom: 1px solid var(--clr-border);
    transition: box-shadow var(--transition);
}
#masthead.scrolled { box-shadow: 0 4px 40px rgba(0,0,0,.6); }
#masthead .container {
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    height: 72px;
    gap: 2rem;
}

/* Branding */
.site-branding         { flex-shrink: 0; align-self: center; }
.site-branding a       { display: flex; align-items: center; gap: .75rem; color: var(--clr-white); }
.site-branding a:hover { color: var(--clr-white); }
.site-branding .custom-logo { height: 44px; width: auto; }
.site-title {
    font-family: var(--font-display);
    font-size: 1.35rem;
    font-weight: 800;
    letter-spacing: .02em;
    text-transform: uppercase;
    line-height: 1.1;
    color: var(--clr-white);
}
.site-title span       { color: var(--clr-red); }
.site-title--mobile    { display: none; }
@media (max-width: 480px) {
    .site-title--full   { display: none; }
    .site-title--mobile { display: inline; }
}
.site-description      { font-size: .7rem; color: var(--clr-muted); letter-spacing: .08em; text-transform: uppercase; }

/* ── Primary Navigation ── */
.main-navigation { display: flex; align-items: center; }

.main-navigation > div > ul,
.main-navigation > ul {
    display: flex;
    align-items: center;
    gap: 0;
    margin: 0; padding: 0;
}
.main-navigation li { position: relative; list-style: none; }

/* Desktop: li stretcht auf volle Masthead-Höhe → top:100% = Masthead-Unterkante */
@media (min-width: 769px) {
    .main-navigation { align-items: stretch; }
    .main-navigation > div { display: flex; height: 100%; }
    .main-navigation > div > ul,
    .main-navigation > ul { align-items: stretch; height: 100%; }
    .main-navigation > div > ul > li,
    .main-navigation > ul > li { height: 100%; display: flex; align-items: center; }
}

/* Top-level links */
.main-navigation > div > ul > li > a,
.main-navigation > ul > li > a {
    display: flex;
    align-items: center;
    height: 100%;
    gap: .35rem;
    padding: 0 .9rem;
    color: var(--clr-muted);
    font-family: var(--font-display);
    font-size: .88rem;
    font-weight: 500;
    letter-spacing: .05em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color var(--transition);
    position: relative;
}

/* Animated red underline on hover */
.main-navigation > div > ul > li > a::after,
.main-navigation > ul > li > a::after {
    content: '';
    position: absolute;
    bottom: -1px; left: .9rem; right: .9rem;
    height: 2px;
    background: var(--clr-red);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform var(--transition);
    border-radius: 2px;
}
.main-navigation > div > ul > li > a:hover,
.main-navigation > ul > li > a:hover { color: var(--clr-white); }
.main-navigation > div > ul > li > a:hover::after,
.main-navigation > ul > li > a:hover::after { transform: scaleX(1); }

/* Active page */
.main-navigation li.current-menu-item > a,
.main-navigation li.current-menu-parent > a,
.main-navigation li.current-menu-ancestor > a { color: var(--clr-white); }
.main-navigation li.current-menu-item > a::after,
.main-navigation li.current-menu-parent > a::after,
.main-navigation li.current-menu-ancestor > a::after { transform: scaleX(1); }

/* Dropdown chevron */
.main-navigation li.menu-item-has-children > a > span.chevron {
    display: inline-block;
    width: 0; height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 4px solid currentColor;
    opacity: .5;
    transition: transform var(--transition), opacity var(--transition);
}
.main-navigation li.menu-item-has-children:hover > a > span.chevron {
    opacity: 1;
    transform: rotate(180deg);
}


/* Dropdown submenu */
.main-navigation ul ul {
    position: absolute;
    top: 100%;
    left: 0;
    transform: translateY(-4px);
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-top: 2px solid var(--clr-red);
    border-radius: 0 0 var(--radius-md) var(--radius-md);
    min-width: 210px;
    padding: .4rem 0;
    opacity: 0;
    visibility: hidden;
    transition: opacity var(--transition), transform var(--transition), visibility var(--transition);
    box-shadow: 0 16px 40px rgba(0,0,0,.5);
    z-index: 100;
}
.main-navigation ul ul::before { display: none; }
.main-navigation li:hover > ul,
.main-navigation li:focus-within > ul {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}
.main-navigation ul ul li a {
    display: block;
    padding: .55rem 1.25rem;
    color: var(--clr-muted);
    font-family: var(--font-display);
    font-size: .82rem;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    transition: color var(--transition), padding-left var(--transition);
    white-space: nowrap;
}
.main-navigation ul ul li a::after { display: none; }
.main-navigation ul ul li a:hover  { color: var(--clr-white); padding-left: 1.6rem; }
.main-navigation ul ul li + li     { border-top: 1px solid var(--clr-border); }

/* ── Hamburger ── */
.nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    align-self: center;
    gap: 5px;
    width: 38px; height: 38px;
    background: none;
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-sm);
    padding: 8px;
    cursor: pointer;
    flex-shrink: 0;
}
.nav-toggle span {
    display: block;
    height: 1.5px;
    background: var(--clr-text);
    border-radius: 2px;
    transition: all var(--transition);
}
.nav-toggle.active span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.nav-toggle.active span:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-toggle.active span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }

/* =========================================================
   HERO
   ========================================================= */
.hero {
    position: relative;
    min-height: 92vh;
    display: flex;
    align-items: center;
    overflow: hidden;
}
.hero-bg {
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, #0d0f14 0%, #1a0a07 40%, #2a0d08 60%, #0d0f14 100%);
    z-index: 0;
}
.hero-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
    background-size: 60px 60px;
    mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
    -webkit-mask-image: radial-gradient(ellipse 80% 80% at 50% 50%, black 40%, transparent 100%);
}
.hero-bg::after {
    content: '';
    position: absolute;
    top: -40%; right: -10%;
    width: 80%; height: 140%;
    background: radial-gradient(ellipse at center, rgba(232,40,11,.12) 0%, transparent 65%);
    animation: hero-glow 6s ease-in-out infinite alternate;
}
@keyframes hero-glow {
    0%   { transform: scale(1) translateX(0); opacity: .7; }
    100% { transform: scale(1.1) translateX(-40px); opacity: 1; }
}
.hero .container {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 4rem;
    padding-block: 6rem;
}
.hero-content  { max-width: 680px; }
.hero-badge {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    background: var(--clr-red-glow);
    border: 1px solid rgba(232,40,11,.3);
    color: #ff6b55;
    font-family: var(--font-display);
    font-size: .78rem;
    font-weight: 600;
    letter-spacing: .12em;
    text-transform: uppercase;
    padding: .4rem 1rem;
    border-radius: 100px;
    margin-bottom: 1.5rem;
    animation: fadeInDown .6s ease both;
}
.hero-badge::before {
    content: '';
    width: 6px; height: 6px;
    background: var(--clr-red);
    border-radius: 50%;
    animation: blink 1.4s ease infinite;
}
@keyframes blink     { 0%,100%{opacity:1} 50%{opacity:.2} }
@keyframes fadeInDown{ from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeInUp  { from{opacity:0;transform:translateY(24px)}  to{opacity:1;transform:translateY(0)} }
@keyframes fadeIn    { from{opacity:0} to{opacity:1} }

.hero-title {
    font-family: var(--font-display);
    font-size: clamp(3rem, 7vw, 6rem);
    font-weight: 900;
    line-height: .95;
    letter-spacing: -.02em;
    color: var(--clr-white);
    text-transform: uppercase;
    margin-bottom: 1.5rem;
    animation: fadeInUp .7s .1s ease both;
}
.hero-title .accent { color: var(--clr-red); }
.hero-title .thin   { font-weight: 300; }
.hero-text {
    font-size: 1.1rem;
    color: var(--clr-muted);
    line-height: 1.7;
    max-width: 520px;
    margin-bottom: 2.5rem;
    animation: fadeInUp .7s .2s ease both;
}
.hero-actions { display: flex; gap: 1rem; flex-wrap: wrap; animation: fadeInUp .7s .3s ease both; }
.hero-stats   { display: flex; flex-direction: column; gap: 1rem; animation: fadeInUp .7s .4s ease both; }
.stat-card {
    background: rgba(255,255,255,.04);
    border: 1px solid var(--clr-border);
    border-left: 3px solid var(--clr-red);
    border-radius: var(--radius-md);
    padding: 1.25rem 1.5rem;
    min-width: 200px;
    backdrop-filter: blur(8px);
    transition: all var(--transition);
}
.stat-card:hover { background: rgba(255,255,255,.07); transform: translateX(-4px); box-shadow: var(--shadow-red); }
.stat-number { font-family: var(--font-display); font-size: 2.2rem; font-weight: 900; color: var(--clr-white); line-height: 1; margin-bottom: .25rem; }
.stat-number .unit { font-size: 1rem; color: var(--clr-red); font-weight: 700; }
.stat-label  { font-size: .78rem; color: var(--clr-muted); text-transform: uppercase; letter-spacing: .06em; }
.hero-scroll {
    position: absolute;
    bottom: 2rem; left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: .5rem;
    color: var(--clr-muted);
    font-size: .7rem;
    letter-spacing: .1em;
    text-transform: uppercase;
    animation: fadeIn 1s 1s ease both;
    z-index: 1;
}
.scroll-line {
    width: 1px; height: 40px;
    background: linear-gradient(to bottom, var(--clr-red), transparent);
    animation: scroll-anim 1.8s ease-in-out infinite;
}
@keyframes scroll-anim {
    0%  { transform: scaleY(0); transform-origin: top; }
    50% { transform: scaleY(1); transform-origin: top; }
    51% { transform: scaleY(1); transform-origin: bottom; }
    100%{ transform: scaleY(0); transform-origin: bottom; }
}

/* =========================================================
   INFO STRIP
   ========================================================= */
.info-strip {
    background: var(--clr-surface);
    border-top: 1px solid var(--clr-border);
    border-bottom: 1px solid var(--clr-border);
    padding: 3.5rem 0;
}
.info-strip .container { display: grid; grid-template-columns: repeat(3,1fr); }
.info-card {
    padding: 2.5rem 2rem;
    position: relative;
    transition: all var(--transition);
    border-right: 1px solid var(--clr-border);
}
.info-card:last-child { border-right: none; }
.info-card::before {
    content: '';
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 3px;
    background: var(--clr-red);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform var(--transition);
}
.info-card:hover::before { transform: scaleX(1); }
.info-card:hover         { background: var(--clr-surface-2); }
.info-card-icon {
    width: 52px; height: 52px;
    background: var(--clr-red-glow);
    border: 1px solid rgba(232,40,11,.25);
    border-radius: var(--radius-md);
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
    color: var(--clr-red);
    font-size: 1.4rem;
}
.info-card-value { font-family: var(--font-display); font-size: 2.5rem; font-weight: 900; color: var(--clr-white); line-height: 1; margin-bottom: .5rem; }
.info-card-title { font-family: var(--font-display); font-size: 1rem; font-weight: 600; color: var(--clr-muted); text-transform: uppercase; letter-spacing: .08em; margin-bottom: .75rem; }
.info-card-text  { font-size: .9rem; color: var(--clr-muted); line-height: 1.6; }
.info-card-list  { font-size: .9rem; color: var(--clr-muted); }
.info-card-list li { padding: .2rem 0; }

/* =========================================================
   WELCOME SECTION
   ========================================================= */
.welcome-section { padding: 7rem 0; }
.welcome-section .container { display: grid; grid-template-columns: 1fr 1fr; gap: 5rem; align-items: center; }
.welcome-image-wrap { position: relative; border-radius: var(--radius-lg); overflow: hidden; }
.welcome-image-wrap img { width: 100%; height: 480px; object-fit: cover; filter: brightness(.85) saturate(1.1); border-radius: var(--radius-lg); transition: filter var(--transition); }
.welcome-image-wrap:hover img { filter: brightness(.95) saturate(1.2); }
.welcome-image-wrap::before { content: ''; position: absolute; inset: -2px; border-radius: calc(var(--radius-lg) + 2px); background: linear-gradient(135deg, var(--clr-red) 0%, transparent 60%); z-index: -1; }
.welcome-image-badge { position: absolute; bottom: 1.5rem; left: 1.5rem; background: var(--clr-red); color: var(--clr-white); padding: .75rem 1.25rem; border-radius: var(--radius-md); font-family: var(--font-display); }
.welcome-image-badge strong { display: block; font-size: 1.6rem; font-weight: 900; line-height: 1; }
.welcome-image-badge span   { font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; opacity: .85; }
.welcome-text p { color: var(--clr-muted); margin-bottom: 1.25rem; font-size: 1.025rem; line-height: 1.75; }
.welcome-features { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 2rem 0; }
.feature-item {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: 1rem;
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    transition: all var(--transition);
}
.feature-item:hover  { border-color: rgba(232,40,11,.3); background: var(--clr-surface-2); }
.feature-icon        { color: var(--clr-red); font-size: 1.1rem; margin-top: .15rem; flex-shrink: 0; }
.feature-item h4     { font-size: .9rem; font-weight: 600; color: var(--clr-white); margin-bottom: .2rem; }
.feature-item p      { font-size: .8rem; color: var(--clr-muted); line-height: 1.4; }

/* =========================================================
   DATES SECTION
   ========================================================= */
.dates-section { background: var(--clr-surface); border-top: 1px solid var(--clr-border); border-bottom: 1px solid var(--clr-border); padding: 5rem 0; }
.dates-section .container { display: grid; grid-template-columns: 1fr 1.6fr; gap: 5rem; align-items: center; }
.dates-grid { display: flex; flex-direction: column; gap: 1rem; }
.date-item {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem 1.5rem;
    background: var(--clr-surface-2);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    transition: all var(--transition);
}
.date-item:hover { border-color: rgba(232,40,11,.3); transform: translateX(6px); box-shadow: -4px 0 24px rgba(232,40,11,.1); }
.date-icon { width: 46px; height: 46px; background: var(--clr-red-glow); border: 1px solid rgba(232,40,11,.3); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; color: var(--clr-red); font-size: 1.1rem; flex-shrink: 0; }
.date-info h4 { font-family: var(--font-display); font-size: .95rem; font-weight: 600; color: var(--clr-white); text-transform: uppercase; letter-spacing: .04em; margin-bottom: .2rem; }
.date-info p  { font-size: .85rem; color: var(--clr-muted); }

/* =========================================================
   POSTS SECTION
   ========================================================= */
.posts-section { padding: 7rem 0; }
.section-header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 3rem; flex-wrap: wrap; gap: 1rem; }
.posts-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 1.5rem; }
.post-card { background: var(--clr-surface); border: 1px solid var(--clr-border); border-radius: var(--radius-lg); overflow: hidden; transition: all var(--transition); display: flex; flex-direction: column; }
.post-card:hover { border-color: rgba(232,40,11,.25); transform: translateY(-4px); box-shadow: 0 20px 48px rgba(0,0,0,.5), 0 0 0 1px rgba(232,40,11,.1); }
.post-card-thumb { aspect-ratio: 16/9; overflow: hidden; background: var(--clr-surface-2); }
.post-card-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.post-card:hover .post-card-thumb img { transform: scale(1.05); }
.post-card-thumb-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; color: rgba(255,255,255,.1); font-size: 2rem; }
.post-card-body { padding: 1.5rem; flex: 1; display: flex; flex-direction: column; }
.post-card-meta { display: flex; gap: 1rem; font-size: .75rem; color: var(--clr-muted); text-transform: uppercase; letter-spacing: .06em; margin-bottom: .75rem; }
.post-cat { color: var(--clr-red); font-weight: 600; font-family: var(--font-display); }
.post-card-title { font-family: var(--font-display); font-size: 1.2rem; font-weight: 700; color: var(--clr-white); line-height: 1.3; margin-bottom: .75rem; flex: 1; }
.post-card-title a { color: inherit; }
.post-card-title a:hover { color: var(--clr-red); }
.post-card-excerpt { font-size: .875rem; color: var(--clr-muted); line-height: 1.6; margin-bottom: 1.25rem; }
.post-card-link { display: inline-flex; align-items: center; gap: .4rem; font-family: var(--font-display); font-size: .82rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--clr-red); }
.post-card-link:hover { color: var(--clr-white); }
.post-card-link::after { content: '\2192'; transition: transform var(--transition); }
.post-card-link:hover::after { transform: translateX(4px); }

/* =========================================================
   CTA BANNER
   ========================================================= */
.cta-section { padding: 5rem 0; position: relative; overflow: hidden; }
.cta-section::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, var(--clr-red-dark) 0%, #8b1606 100%); }
.cta-section::after  { content: ''; position: absolute; inset: 0; background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px); background-size: 40px 40px; }
.cta-section .container { position: relative; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 3rem; flex-wrap: wrap; }
.cta-text h2 { font-family: var(--font-display); font-size: clamp(1.8rem, 3.5vw, 2.8rem); font-weight: 800; color: var(--clr-white); line-height: 1.1; text-transform: uppercase; margin-bottom: .5rem; }
.cta-text p  { color: rgba(255,255,255,.75); }
.btn-cta-white { background: white; color: var(--clr-red); font-family: var(--font-display); font-size: 1rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: .9rem 2rem; border-radius: var(--radius-sm); white-space: nowrap; transition: all var(--transition); display: inline-block; }
.btn-cta-white:hover { background: var(--clr-bg); color: var(--clr-red); transform: scale(1.03); }

/* =========================================================
   FOOTER
   ========================================================= */
#colophon { background: var(--clr-surface); border-top: 1px solid var(--clr-border); padding-top: 4rem; }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 3rem; padding-bottom: 3rem; border-bottom: 1px solid var(--clr-border); }
.footer-brand .site-title { font-size: 1.2rem; margin-bottom: .75rem; }
.footer-brand p { font-size: .875rem; color: var(--clr-muted); line-height: 1.7; max-width: 320px; margin-bottom: 1.5rem; }
.footer-social { display: flex; gap: .75rem; }
.social-link { width: 38px; height: 38px; background: var(--clr-surface-2); border: 1px solid var(--clr-border); border-radius: var(--radius-sm); display: flex; align-items: center; justify-content: center; color: var(--clr-muted); font-size: .9rem; transition: all var(--transition); }
.social-link:hover { background: var(--clr-red); border-color: var(--clr-red); color: var(--clr-white); transform: translateY(-2px); }
.footer-col h4 { font-family: var(--font-display); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--clr-white); margin-bottom: 1.25rem; }
.footer-col ul { display: flex; flex-direction: column; gap: .5rem; }
.footer-col ul li a { font-size: .875rem; color: var(--clr-muted); display: flex; align-items: center; gap: .5rem; transition: all var(--transition); }
.footer-col ul li a:hover { color: var(--clr-red); padding-left: 4px; }
.footer-col ul li a::before { content: '\2014'; color: var(--clr-red); font-size: .6rem; }
.footer-contact-item { display: flex; gap: .75rem; align-items: flex-start; margin-bottom: .75rem; }
.footer-contact-icon { color: var(--clr-red); font-size: .9rem; margin-top: .2rem; flex-shrink: 0; }
.footer-contact-item span, .footer-contact-item a { font-size: .875rem; color: var(--clr-muted); line-height: 1.4; }
.footer-contact-item a:hover { color: var(--clr-red); }
.footer-bottom { padding: 1.5rem 0; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 1rem; }
.footer-bottom p, .footer-bottom a { font-size: .8rem; color: var(--clr-muted); }
.footer-bottom a:hover { color: var(--clr-red); }

/* =========================================================
   INNER PAGES
   ========================================================= */
.page-hero { padding: 1.25rem 0; }
.page-hero .container { position: relative; z-index: 1; }
.page-hero-breadcrumb { display: flex; align-items: center; gap: .5rem; font-size: .75rem; color: var(--clr-muted); letter-spacing: .08em; text-transform: uppercase; margin-bottom: .75rem; }
.page-hero-breadcrumb a { color: var(--clr-muted); }
.page-hero-breadcrumb a:hover { color: var(--clr-red); }
.page-hero-breadcrumb span { color: rgba(255,255,255,.2); }
.page-hero h1 { font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 800; color: var(--clr-white); text-transform: uppercase; }

.content-wrap { padding: 5rem 0; }
.content-wrap .container { display: grid; grid-template-columns: 1fr 320px; gap: 4rem; align-items: start; }
.content-wrap.no-sidebar .container { grid-template-columns: 1fr; max-width: 800px; }

/* ── Gutenberg / Block Editor content ── */
.entry-content,
.wp-block-post-content { color: var(--clr-muted); font-size: 1.025rem; line-height: 1.8; }
.entry-content h1, .entry-content h2, .entry-content h3,
.entry-content h4, .entry-content h5, .entry-content h6 { font-family: var(--font-display); color: var(--clr-white); margin: 2rem 0 .75rem; font-weight: 700; text-transform: uppercase; }
.entry-content h2 { font-size: 1.75rem; }
.entry-content h3 { font-size: 1.35rem; }
.entry-content p  { margin-bottom: 1.25rem; }
.entry-content a  { color: var(--clr-red); text-decoration: underline; text-decoration-color: rgba(232,40,11,.3); }
.entry-content a:hover { color: var(--clr-white); }
.entry-content ul, .entry-content ol { margin: 1rem 0 1.25rem 1.5rem; }
.entry-content li { margin-bottom: .4rem; }
.entry-content blockquote { border-left: 3px solid var(--clr-red); padding: 1rem 1.5rem; background: var(--clr-surface); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin: 1.5rem 0; font-style: italic; color: var(--clr-muted); }
.entry-content img { border-radius: var(--radius-md); margin: 1.5rem 0; }

/* Gutenberg-specific block resets for dark theme */
.wp-block-columns { gap: 1.5rem; }
.wp-block-image img { border-radius: var(--radius-md); }
.wp-block-separator { border-color: var(--clr-border) !important; opacity: 1; }
.wp-block-quote { border-left: 3px solid var(--clr-red); padding: 1rem 1.5rem; background: var(--clr-surface); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; margin: 1.5rem 0; font-style: italic; color: var(--clr-muted); }
.wp-block-quote p { color: var(--clr-muted); margin-bottom: 0; }
.wp-block-button__link { font-family: var(--font-display) !important; letter-spacing: .04em; text-transform: uppercase; }
.wp-block-gallery { gap: 1rem; }
.wp-block-gallery figure { border-radius: var(--radius-md); overflow: hidden; }

/* Sidebar */
.widget-area { display: flex; flex-direction: column; gap: 1.5rem; }
.widget { background: var(--clr-surface); border: 1px solid var(--clr-border); border-radius: var(--radius-md); padding: 1.5rem; }
.widget-title { font-family: var(--font-display); font-size: .8rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--clr-white); margin-bottom: 1.25rem; padding-bottom: .75rem; border-bottom: 1px solid var(--clr-border); }

/* Post navigation */
.post-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin: 3rem 0; }
.nav-previous, .nav-next { background: var(--clr-surface); border: 1px solid var(--clr-border); border-radius: var(--radius-md); padding: 1rem 1.25rem; transition: all var(--transition); }
.nav-previous:hover, .nav-next:hover { border-color: rgba(232,40,11,.3); background: var(--clr-surface-2); }
.nav-next { text-align: right; }
.nav-previous a, .nav-next a { color: var(--clr-muted); font-size: .875rem; }
.nav-previous a:hover, .nav-next a:hover { color: var(--clr-red); }

/* 404 */
.error-404 { min-height: 60vh; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; padding: 6rem 2rem; }
.error-code { font-family: var(--font-display); font-size: clamp(6rem,15vw,12rem); font-weight: 900; line-height: 1; color: transparent; -webkit-text-stroke: 2px rgba(232,40,11,.3); margin-bottom: 1rem; }
.error-404 h1 { font-family: var(--font-display); color: var(--clr-white); font-size: 2rem; margin-bottom: 1rem; }
.error-404 p  { color: var(--clr-muted); margin-bottom: 2rem; }

/* =========================================================
   GUTENBERG BLOCK CLASSES  (gb-)
   ========================================================= */

/* ── Gutenberg Standard-Variablen überschreiben ── */
:root {
    --wp--style--block-gap: 1rem;
    --wp--preset--spacing--50: 1rem;
}

/* ── Gutenberg Block-Abstände normalisieren ── */

/*
 * gb-section-dark/flow: kein layout:constrained → kein __inner-container.
 * Gutenberg setzt margin-block auf is-layout-flow Kinder – wir überschreiben
 * alle margins innerhalb von gb-section komplett und steuern selbst.
 */
.gb-section > *,
.gb-section > .wp-block-group__inner-container > * {
    margin-block: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.gb-section > * + *,
.gb-section > .wp-block-group__inner-container > * + * {
    margin-top: 0.85rem !important;
}

/* gb-step: margin-bottom nur als Abstand zwischen Schritten,
   nicht nach dem letzten */
.gb-section .wp-block-group.gb-step {
    margin-top: 0 !important;
    margin-bottom: 0.75rem !important;
}
.gb-section .wp-block-group.gb-step:last-child {
    margin-bottom: 0 !important;
}

/* inner-container (hero/red bleiben constrained): kein extra Padding */
.wp-block-group__inner-container {
    padding: 0 !important;
    margin: 0 !important;
}

/* Columns-Kinder ebenfalls bereinigen */
.wp-block-column > * {
    margin-block: 0 !important;
}
.wp-block-column > * + * {
    margin-top: 0.85rem !important;
}

/* ── Columns: Gap und volle Höhe ── */
.wp-block-columns {
    gap: 1.25rem !important;
    align-items: stretch !important;
}
.wp-block-column {
    display: flex;
    flex-direction: column;
}

/* ── SECTIONS ── */
.gb-section {
    border-radius: var(--radius-lg);
    /* padding-block: top 2.5rem, bottom 2rem (weniger, da letztes Kind kein margin hat) */
    padding: 2.5rem clamp(1.25rem, 4vw, 2.5rem) 2rem;
    box-sizing: border-box;
    width: 100%;
}

.gb-section-hero {
    background: linear-gradient(135deg, #1a0a07 0%, #0d0f14 60%);
    border: 1px solid rgba(232,40,11,.15);
    position: relative;
    overflow: hidden;
}
.gb-section-hero::after {
    content: '';
    position: absolute;
    top: -40%; right: -10%;
    width: 60%; height: 180%;
    background: radial-gradient(ellipse at center, rgba(232,40,11,.1) 0%, transparent 65%);
    pointer-events: none;
    z-index: 0;
}
.gb-section-hero > * { position: relative; z-index: 1; }

.gb-section-red {
    background: linear-gradient(135deg, var(--clr-red-dark) 0%, #8b1606 100%);
    position: relative;
    overflow: hidden;
}
.gb-section-red::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 40px 40px;
    pointer-events: none;
    z-index: 0;
}
.gb-section-red > * { position: relative; z-index: 1; }

/* ── BADGE ── */
.gb-badge {
    display: inline-flex !important;
    align-items: center;
    gap: .5rem;
    background: rgba(232,40,11,.15);
    border: 1px solid rgba(232,40,11,.3);
    color: #ff6b55 !important;
    font-family: var(--font-display) !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    letter-spacing: .14em !important;
    text-transform: uppercase !important;
    padding: .35rem 1rem !important;
    border-radius: 100px !important;
    margin-bottom: 1rem !important;
}
.gb-badge::before {
    content: '';
    width: 6px; height: 6px;
    background: var(--clr-red);
    border-radius: 50%;
    flex-shrink: 0;
}

/* ── SECTION LABEL ── */
.gb-section-label {
    display: flex !important;
    align-items: center;
    gap: .5rem;
    color: var(--clr-red) !important;
    font-family: var(--font-display) !important;
    font-size: .78rem !important;
    font-weight: 600 !important;
    letter-spacing: .18em !important;
    text-transform: uppercase !important;
    margin-bottom: .5rem !important;
    margin-top: 0 !important;
}
.gb-section-label::before {
    content: '';
    display: block;
    width: 22px; height: 2px;
    background: var(--clr-red);
    flex-shrink: 0;
}

/* ── HEADINGS ── */
.gb-heading-xl {
    font-family: var(--font-display) !important;
    font-size: clamp(2.8rem, 6vw, 5rem) !important;
    font-weight: 900 !important;
    line-height: .95 !important;
    letter-spacing: -.02em !important;
    color: var(--clr-white) !important;
    text-transform: uppercase !important;
    margin-top: 0 !important;
    margin-bottom: 1.25rem !important;
}
.gb-heading-lg {
    font-family: var(--font-display) !important;
    font-size: clamp(1.8rem, 3.5vw, 2.6rem) !important;
    font-weight: 800 !important;
    line-height: 1.05 !important;
    color: var(--clr-white) !important;
    text-transform: uppercase !important;
    margin-top: 0 !important;
    margin-bottom: 1rem !important;
}
.gb-heading-md {
    font-family: var(--font-display) !important;
    font-size: 1.15rem !important;
    font-weight: 700 !important;
    color: var(--clr-white) !important;
    text-transform: uppercase !important;
    letter-spacing: .04em !important;
    margin-top: 0 !important;
    margin-bottom: .4rem !important;
}
.gb-heading-sm {
    font-family: var(--font-display) !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    color: var(--clr-white) !important;
    text-transform: uppercase !important;
    letter-spacing: .08em !important;
    margin-top: 0 !important;
    margin-bottom: .35rem !important;
}

/* ── TEXT ── */
.gb-lead     { font-size: 1.1rem !important;  color: var(--clr-muted) !important; line-height: 1.75 !important; max-width: 600px; margin-top: 0 !important; }
.gb-text     { font-size: 1rem !important;    color: var(--clr-muted) !important; line-height: 1.75 !important; margin-top: 0 !important; }
.gb-text-sm  { font-size: .875rem !important; color: var(--clr-muted) !important; line-height: 1.6 !important;  margin-top: 0 !important; }
/* Für Adressblöcke: enger Abstand zwischen Zeilen */
.gb-text-tight { font-size: 1rem !important; color: var(--clr-muted) !important; line-height: 1.6 !important; margin-top: 0 !important; margin-bottom: 0.1rem !important; }
.gb-text-tight a { color: var(--clr-red); text-decoration: none; }
.gb-text-tight a:hover { color: var(--clr-white); }
/* Sequence of tight paragraphs: minimal gap */
.gb-section > .gb-text-tight + .gb-text-tight,
.gb-section > .wp-block-paragraph.gb-text-tight + .wp-block-paragraph.gb-text-tight { margin-top: 0.15rem !important; }
.gb-text-centered { text-align: center !important; }
.gb-red      { color: var(--clr-red) !important; }

/* ── BUTTONS ── */
.wp-block-button.gb-btn-primary .wp-block-button__link {
    background: var(--clr-red) !important;
    color: var(--clr-white) !important;
    font-family: var(--font-display) !important;
    font-size: .95rem !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    padding: .85rem 1.85rem !important;
    border-radius: 6px !important;
    border: none !important;
    box-shadow: 0 4px 20px rgba(232,40,11,.35) !important;
    transition: all var(--transition) !important;
}
.wp-block-button.gb-btn-primary .wp-block-button__link:hover {
    background: var(--clr-red-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 28px rgba(232,40,11,.45) !important;
}
.wp-block-button.gb-btn-outline .wp-block-button__link {
    background: transparent !important;
    color: var(--clr-white) !important;
    font-family: var(--font-display) !important;
    font-size: .95rem !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    padding: .85rem 1.85rem !important;
    border-radius: 6px !important;
    border: 1.5px solid rgba(255,255,255,.25) !important;
    transition: all var(--transition) !important;
}
.wp-block-button.gb-btn-outline .wp-block-button__link:hover {
    border-color: var(--clr-red) !important;
    color: var(--clr-red) !important;
    background: rgba(232,40,11,.1) !important;
}
.wp-block-button.gb-btn-white .wp-block-button__link {
    background: #fff !important;
    color: var(--clr-red) !important;
    font-family: var(--font-display) !important;
    font-size: .95rem !important;
    font-weight: 800 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    padding: .9rem 2.25rem !important;
    border-radius: 6px !important;
    border: none !important;
    transition: all var(--transition) !important;
}
.wp-block-button.gb-btn-white .wp-block-button__link:hover {
    background: var(--clr-bg) !important;
    transform: scale(1.03) !important;
}

/* ── STAT CARDS ── */
.wp-block-column:has(.gb-stat-card) { align-items: stretch; }
.gb-stat-card {
    background: var(--clr-surface-2) !important;
    border: 1px solid var(--clr-border) !important;
    border-left: 3px solid var(--clr-red) !important;
    border-radius: var(--radius-md) !important;
    padding: 1.4rem 1.5rem !important;
    transition: all var(--transition) !important;
    flex: 1;               /* füllt volle Spaltenhöhe */
    box-sizing: border-box;
}
.gb-stat-card:hover { background: rgba(255,255,255,.06) !important; transform: translateY(-3px) !important; }
.gb-stat-num   { font-family: var(--font-display) !important; font-size: 2.2rem !important; font-weight: 900 !important; color: var(--clr-white) !important; line-height: 1 !important; margin-bottom: .3rem !important; margin-top: 0 !important; }
.gb-stat-unit  { color: var(--clr-red) !important; }
.gb-stat-label { font-size: .75rem !important; color: var(--clr-muted) !important; text-transform: uppercase !important; letter-spacing: .08em !important; margin: 0 !important; }

/* ── STEPS ── */
.gb-section-dark .wp-block-group.gb-step,
.gb-step {
    background: var(--clr-surface-2) !important;
    border: 1px solid var(--clr-border) !important;
    border-radius: var(--radius-md) !important;
    padding: 1.25rem 1.5rem !important;
    display: flex !important;
    align-items: flex-start !important;
    gap: 1.25rem !important;
    transition: all var(--transition) !important;
    margin-top: 0 !important;
    margin-bottom: .75rem !important;
    box-sizing: border-box;
}
.gb-step:hover { border-color: rgba(232,40,11,.3) !important; background: rgba(255,255,255,.04) !important; }
.gb-step-num {
    font-family: var(--font-display) !important;
    font-size: 2.5rem !important;
    font-weight: 900 !important;
    color: rgba(232,40,11,.2) !important;
    line-height: 1 !important;
    flex-shrink: 0 !important;
    width: 3rem !important;
    transition: color var(--transition) !important;
    margin: 0 !important;
}
.gb-step:hover .gb-step-num { color: rgba(232,40,11,.5) !important; }
.gb-step-content { flex: 1 !important; min-width: 0; }
/* Kein Extra-Spacing innerhalb von step-content */
.gb-step-content > * { margin-top: 0 !important; }
.gb-step-content > * + * { margin-top: .35rem !important; }

/* ── REQ CARDS ── */
.wp-block-column:has(.gb-req-card) { align-items: stretch; }
.gb-req-card {
    background: var(--clr-surface) !important;
    border: 1px solid var(--clr-border) !important;
    border-radius: var(--radius-md) !important;
    padding: 1.5rem !important;
    text-align: center !important;
    transition: all var(--transition) !important;
    flex: 1;
    box-sizing: border-box;
}
.gb-req-card:hover { border-color: rgba(232,40,11,.25) !important; background: var(--clr-surface-2) !important; transform: translateY(-3px) !important; }
.gb-req-icon { font-size: 1.6rem !important; margin-bottom: .75rem !important; margin-top: 0 !important; display: block !important; line-height: 1 !important; }

/* ── CONTACT ITEMS ── */
.gb-contact-item {
    display: flex !important;
    align-items: center !important;
    gap: .75rem !important;
    font-size: .9rem !important;
    color: var(--clr-muted) !important;
    margin-top: 0 !important;
    margin-bottom: .6rem !important;
}
.gb-contact-item a { color: var(--clr-text); text-decoration: none; }
.gb-contact-item a:hover { color: var(--clr-red); }

/* ── Adress-Text (z.B. Impressum): engerer Zeilenabstand bei <br>-Zeilen ── */
.gb-text br + br { display: none; } /* doppelte br verhindern */
p.gb-text:has(br) {
    line-height: 1.55 !important;   /* statt 1.75 – kompakter für Adressblöcke */
}
/* Fallback ohne :has() Support */
.gb-address {
    font-size: 1rem !important;
    color: var(--clr-muted) !important;
    line-height: 1.55 !important;
}
.gb-address a { color: var(--clr-red); text-decoration: none; }
.gb-address a:hover { color: var(--clr-white); }

/* ── IMAGE PLACEHOLDER ── */
.gb-img-placeholder .wp-element-caption {
    background: rgba(232,40,11,.1);
    border: 1px dashed rgba(232,40,11,.3);
    border-top: none;
    color: rgba(232,40,11,.7);
    font-size: .7rem;
    letter-spacing: .08em;
    text-align: center;
    padding: .35rem;
    font-style: normal;
    text-transform: uppercase;
}
.gb-img-placeholder .wp-block-image img { border-radius: var(--radius-lg); }
/* ── Specs-Tabelle (Fahrzeugdaten) ── */
.gb-specs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
}
.gb-specs-table tr {
    border-bottom: 1px solid var(--clr-border);
    transition: background var(--transition);
}
.gb-specs-table tr:last-child { border-bottom: none; }
.gb-specs-table tr:hover { background: rgba(255,255,255,.03); }
.gb-specs-table td {
    padding: .75rem 1rem;
    vertical-align: middle;
    color: var(--clr-muted);
    line-height: 1.5;
}
.gb-specs-table td:first-child {
    color: var(--clr-white);
    font-family: var(--font-display);
    font-weight: 600;
    font-size: .8rem;
    letter-spacing: .06em;
    text-transform: uppercase;
    width: 42%;
    white-space: nowrap;
}
.gb-specs-table td:last-child {
    color: var(--clr-text);
}
@media (max-width: 540px) {
    .gb-specs-table td:first-child { width: auto; white-space: normal; }
    .gb-specs-table tr { display: flex; flex-direction: column; padding: .5rem 0; }
    .gb-specs-table td { padding: .2rem .75rem; }
    .gb-specs-table td:first-child { font-size: .72rem; color: var(--clr-red); padding-bottom: 0; }
}

/* ── Trennlinien & Listen auf Inhaltsseiten (Impressum, Datenschutz) ── */
.wp-block-separator {
    border: none;
    border-top: 1px solid var(--clr-border);
    margin: 2rem 0;
    opacity: 1;
}
.entry-content ul, .entry-content ol,
.wp-block-list, .gb-text + ul, ul.gb-text {
    margin: .5rem 0 1rem 1.5rem;
    color: var(--clr-muted);
    font-size: 1rem;
    line-height: 1.75;
}
.wp-block-list li, ul.gb-text li { margin-bottom: .35rem; }
.gb-text a { color: var(--clr-red); text-decoration: underline; text-decoration-color: rgba(232,40,11,.3); }
.gb-text a:hover { color: var(--clr-white); text-decoration-color: transparent; }

/* =========================================================
   PAGE-BLOCKS – Gutenberg Seiten-Layout
   ========================================================= */

/*
 * Mit useRootPaddingAwareAlignments=true setzt Gutenberg folgende Variablen:
 *   --wp--style--root--padding-left / right = clamp(1.25rem, 4vw, 2.5rem)
 * Blöcke mit align=full ignorieren dieses Padding – das ist gewollt für
 * gb-section-red / gb-section-hero.
 * Normale Blöcke erben das Padding automatisch über Gutenbergs Layout-System.
 */

.page-blocks {
    padding-top: 2rem;
    padding-bottom: 5rem;
}

/* Alle direkten Kinder zentrieren und auf max-width begrenzen */
.page-blocks > * {
    max-width: var(--max-w);
    margin-inline: auto;
    box-sizing: border-box;
}

/* Seitenabstand: alle Blöcke außer gb-section und Spacer */
.page-blocks > :not(.gb-section):not(.wp-block-spacer):not(.wp-block-separator) {
    padding-inline: clamp(1.25rem, 4vw, 2.5rem);
}

/* gb-section: kein extra padding von page-blocks – .gb-section steuert sein eigenes */
.page-blocks > .wp-block-group.gb-section {
    /* padding-inline bewusst NICHT gesetzt – .gb-section hat sein eigenes padding */
    width: 100%;
    max-width: var(--max-w);
}

/* Abstand nach unten */
.page-blocks > :not(.wp-block-spacer):not(.wp-block-separator) {
    margin-bottom: 1.75rem;
}

/* Spacer/Separator: volle Breite, kein padding */
.page-blocks > .wp-block-spacer,
.page-blocks > .wp-block-separator {
    max-width: 100%;
    margin-inline: 0;
    padding-inline: 0;
    margin-bottom: 0;
}

/* =========================================================
   STACKING CONTEXT & FOOTER
   ========================================================= */
#page {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    isolation: isolate;
}
#colophon {
    position: relative;
    z-index: 0;
    margin-top: auto;
}
.hero { z-index: 0; }
.hero .container { position: relative; z-index: 2; }

/* =========================================================
   TIMELINE  (gb-timeline)
   ========================================================= */

/*
 * Struktur pro Eintrag:
 *   <div class="gb-timeline-item [gb-timeline-highlight]">
 *     <div class="gb-timeline-dot"></div>   ← Punkt auf der Linie
 *     <div class="gb-timeline-content">
 *       <p class="gb-timeline-year">1933</p>
 *       <p class="gb-heading-md">Titel</p>
 *       <p class="gb-text-sm">Text</p>
 *     </div>
 *   </div>
 *
 * Jahreszahl sitzt INNERHALB der Karte – kein Overflow-Problem
 * bei langen Jahreszeiträumen (z.B. "1933–1945").
 */

.gb-timeline {
    position: relative;
    margin: 0 !important;
}

/* Vertikale Linie – links bei 9px (Mitte des 18px-Dots) */
.gb-timeline::before {
    content: '';
    position: absolute;
    left: 9px;
    top: 9px;
    bottom: 9px;
    width: 2px;
    background: linear-gradient(
        to bottom,
        var(--clr-red)       0%,
        rgba(232,40,11,.4)  50%,
        rgba(232,40,11,.1) 100%
    );
}

/* Item: Abstand links für Linie + Dot */
.gb-timeline-item {
    position: relative;
    padding: 0 0 1.25rem 2.75rem;
}
.gb-timeline-item:last-child { padding-bottom: 0; }

/* Dot: eigenes Element, unabhängig vom Text */
.gb-timeline-dot {
    position: absolute;
    left: 0;
    top: 0.9rem;          /* vertikal zur Mitte des Jahr-Badges */
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: var(--clr-surface);
    border: 2px solid var(--clr-red);
    box-shadow: 0 0 0 3px rgba(232,40,11,.15);
    transition: box-shadow var(--transition), background var(--transition);
    z-index: 1;
}
.gb-timeline-item:hover .gb-timeline-dot {
    background: var(--clr-red);
    box-shadow: 0 0 0 5px rgba(232,40,11,.2);
}

/* Highlight: ausgefüllter Dot */
.gb-timeline-highlight .gb-timeline-dot {
    background: var(--clr-red);
    border-color: var(--clr-red);
    box-shadow: 0 0 0 4px rgba(232,40,11,.25);
    width: 20px;
    height: 20px;
    left: -1px;
    top: 0.8rem;
}

/* Inhaltskarte */
.gb-timeline-content {
    background: var(--clr-surface-2);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    padding: 1rem 1.25rem 1.1rem;
    transition: border-color var(--transition), background var(--transition);
}
.gb-timeline-item:hover .gb-timeline-content {
    border-color: rgba(232,40,11,.3);
    background: rgba(255,255,255,.025);
}

/* Jahreszahl als Badge oben in der Karte */
.gb-timeline-year {
    display: inline-block !important;
    font-family: var(--font-display) !important;
    font-size: .78rem !important;
    font-weight: 700 !important;
    letter-spacing: .12em !important;
    text-transform: uppercase !important;
    color: var(--clr-red) !important;
    background: rgba(232,40,11,.1);
    border: 1px solid rgba(232,40,11,.25);
    border-radius: 100px;
    padding: .2rem .75rem !important;
    margin: 0 0 .6rem !important;
    line-height: 1.6 !important;
    white-space: nowrap;         /* "1933–1945" bleibt auf einer Zeile */
}

/* Karte-Inhalt: keine störenden Margins */
.gb-timeline-content > * {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
.gb-timeline-content > * + * {
    margin-top: 0.45rem !important;
}

/* Highlight-Karte: roter Akzent */
.gb-timeline-highlight .gb-timeline-content {
    border-color: rgba(232,40,11,.35);
    background: linear-gradient(135deg, rgba(232,40,11,.06) 0%, var(--clr-surface-2) 100%);
}
.gb-timeline-highlight .gb-timeline-year {
    background: rgba(232,40,11,.18) !important;
    border-color: rgba(232,40,11,.45) !important;
    color: #ff7a66 !important;
}

/* Responsive: Linie + Dot etwas enger */
@media (max-width: 600px) {
    .gb-timeline::before { left: 7px; }
    .gb-timeline-dot { width: 14px; height: 14px; top: 1rem; }
    .gb-timeline-highlight .gb-timeline-dot { width: 16px; height: 16px; left: -1px; }
    .gb-timeline-item { padding-left: 2.1rem; padding-bottom: 1rem; }
    .gb-timeline-year { font-size: .72rem !important; }
}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width: 1024px) {
    .welcome-section .container { grid-template-columns: 1fr; gap: 3rem; }
    .dates-section .container   { grid-template-columns: 1fr; gap: 3rem; }
    .hero .container            { grid-template-columns: 1fr; }
    .hero-stats                 { flex-direction: row; flex-wrap: wrap; }
    .stat-card                  { min-width: 0; flex: 1; }
    .footer-grid                { grid-template-columns: 1fr 1fr; }
    .posts-grid                 { grid-template-columns: repeat(2,1fr); }
}

@media (max-width: 768px) {
    .topbar-left { display: none; }
    .info-strip .container { grid-template-columns: 1fr; }
    .info-card { border-right: none; border-bottom: 1px solid var(--clr-border); }
    .info-card:last-child { border-bottom: none; }

    /* Mobile nav */
    .nav-toggle { display: flex; }
    .theme-toggle:not(.theme-toggle--nav) { display: none; }
    .theme-toggle.theme-toggle--nav { display: inline-flex; margin-left: auto; margin-top: .5rem; }
    #masthead { position: sticky; }
    .main-navigation {
        position: absolute;
        top: 100%; left: 0; right: 0;
        background: var(--clr-surface);
        border-top: 2px solid var(--clr-red);
        border-bottom: 1px solid var(--clr-border);
        padding: .75rem 1rem 1rem;
        opacity: 0;
        visibility: hidden;
        transform: translateY(-6px);
        transition: all var(--transition);
    }
    .main-navigation.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
    .main-navigation > div > ul,
    .main-navigation > ul { flex-direction: column; gap: 0; align-items: stretch; }
    .main-navigation > div > ul > li > a,
    .main-navigation > ul > li > a { padding: .65rem .75rem; border-radius: var(--radius-sm); }
    .main-navigation > div > ul > li > a:hover,
    .main-navigation > ul > li > a:hover { background: rgba(255,255,255,.05); }
    .main-navigation > div > ul > li > a::after,
    .main-navigation > ul > li > a::after { display: none; }
    .main-navigation ul ul {
        position: static !important;
        opacity: 1 !important; visibility: visible !important; transform: none !important;
        background: transparent; border: none;
        border-left: 2px solid rgba(232,40,11,.3);
        border-top: none; border-radius: 0; box-shadow: none;
        padding: 0 0 .25rem .75rem;
        margin: 0 0 .25rem .75rem;
        min-width: 0;
    }
    .main-navigation ul ul::before { display: none; }
    .main-navigation ul ul li + li { border-top: none; }
    .main-navigation ul ul li a { padding: .45rem .5rem; font-size: .82rem; }
    .main-navigation ul ul li a:hover { padding-left: .85rem; }

    /* Layout */
    .content-wrap .container { grid-template-columns: 1fr; }
    .posts-grid     { grid-template-columns: 1fr; }
    .footer-grid    { grid-template-columns: 1fr; }
    .welcome-features { grid-template-columns: 1fr; }
    .cta-section .container { flex-direction: column; text-align: center; }
    .hero-stats { display: none; }
    .welcome-image-wrap img { height: 280px; }

    /* Gutenberg mobile */
    .gb-section { padding: 2rem 1.25rem; }
    .gb-step { gap: .85rem !important; }
    .gb-step-num { font-size: 2rem !important; }
    .gb-req-card { padding: 1.25rem !important; }

    /* Columns stacken auf Mobile */
    .wp-block-columns { flex-direction: column !important; }
    .wp-block-column  { flex-basis: 100% !important; }
}

@media (max-width: 480px) {
    .hero-title { font-size: 3rem; }
    .hero-actions { flex-direction: column; }
    .btn { width: 100%; justify-content: center; }
    .post-navigation { grid-template-columns: 1fr; }
    .footer-bottom { flex-direction: column; text-align: center; }
    .gb-section { padding: 1.5rem 1rem; }
    .gb-heading-xl { font-size: 2.4rem !important; }
}

/* =========================================================
   LIGHT MODE
   =========================================================

   Farbsystem Light:
   ┌─────────────────────────────────────────────────────┐
   │  --clr-bg         #f5f5f5   Seitenhintergrund        │
   │  --clr-surface    #ffffff   Karten / Header          │
   │  --clr-surface-2  #ebebeb   Eingezogene Flächen      │
   │  --clr-border     rgba(0,0,0,.09)                    │
   │  --clr-text       #1c1e2b   Fließtext                │
   │  --clr-muted      #6b7280   Sekundärtext             │
   │                                                      │
   │  --clr-white bleibt #ffffff – wird NICHT             │
   │  überschrieben! Es wird für weiße Texte auf          │
   │  dunklen/roten Flächen (Hero, CTA, Buttons,          │
   │  Topbar, Footer) gebraucht.                          │
   │                                                      │
   │  Inline-Styles mit color:var(--clr-white) in         │
   │  hellen Sektionen werden per Attribut-Selektor       │
   │  überschrieben (→ Abschnitt "Inline-Fix").           │
   └─────────────────────────────────────────────────────┘

   Drei Zustände:
   (A) kein data-theme → folgt System (prefers-color-scheme)
   (B) data-theme="light" → immer hell
   (C) data-theme="dark"  → immer dunkel (:root bereits gesetzt)
   ========================================================= */

/* ── Makro: kombinierter Selector-Trigger ── */
/* Statt überall @media + data-theme doppeln, definieren wir
   das Muster als :is()-Selektor. Alle Regeln unten nutzen
   konsequent beide Trigger in einem Block.                 */

/* ── Design Tokens ── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) {
        --clr-bg:        #f5f5f5;
        --clr-surface:   #ffffff;
        --clr-surface-2: #ebebeb;
        --clr-border:    rgba(0,0,0,.09);
        --clr-text:      #1c1e2b;
        --clr-muted:     #6b7280;
        --shadow-card:   0 1px 12px rgba(0,0,0,.08), 0 4px 24px rgba(0,0,0,.05);
        --shadow-red:    0 0 32px rgba(232,40,11,.18);
        --clr-red-glow:  rgba(232,40,11,.12);
        /* --clr-white bleibt #ffffff */
    }
}
[data-theme="light"] {
    --clr-bg:        #f5f5f5;
    --clr-surface:   #ffffff;
    --clr-surface-2: #ebebeb;
    --clr-border:    rgba(0,0,0,.09);
    --clr-text:      #1c1e2b;
    --clr-muted:     #6b7280;
    --shadow-card:   0 1px 12px rgba(0,0,0,.08), 0 4px 24px rgba(0,0,0,.05);
    --shadow-red:    0 0 32px rgba(232,40,11,.18);
    --clr-red-glow:  rgba(232,40,11,.12);
}

/* ── color-scheme hint ── */
@media (prefers-color-scheme: light) { :root:not([data-theme="dark"]) { color-scheme: light; } }
[data-theme="light"] { color-scheme: light; }

/* ──────────────────────────────────────────────────────────
   TOPBAR & FOOTER – immer dunkel, egal welcher Modus
   ────────────────────────────────────────────────────────── */
/* Topbar + Footer nutzen var(--clr-surface) als Background →
   im Light-Mode werden sie sonst weiß. Beide werden auf den
   Dark-Surface-Wert (#13161e) fixiert.                       */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .topbar {
        background: #13161e;
        border-bottom-color: rgba(255,255,255,.07);
    }
    :root:not([data-theme="dark"]) #colophon {
        background: #13161e;
        border-top-color: rgba(255,255,255,.07);
    }
    :root:not([data-theme="dark"]) .footer-grid {
        border-bottom-color: rgba(255,255,255,.07);
    }
}
[data-theme="light"] .topbar              { background: #13161e; border-bottom-color: rgba(255,255,255,.07); }
[data-theme="light"] #colophon            { background: #13161e; border-top-color:    rgba(255,255,255,.07); }
[data-theme="light"] .footer-grid         { border-bottom-color: rgba(255,255,255,.07); }

/* ──────────────────────────────────────────────────────────
   STICKY HEADER & MOBILE NAV – bleibt in beiden Modi dunkel
   ────────────────────────────────────────────────────────── */
/* Hamburger-Linien: Header ist immer dunkel → Linien immer hell */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .nav-toggle span { background: #f0f2f7; }
}
[data-theme="light"] .nav-toggle span { background: #f0f2f7; }

/* Header: im Light Mode voll opak machen, damit der helle Hintergrund nicht durchscheint */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) #masthead { background: rgba(13,15,20,1); }
}
[data-theme="light"] #masthead { background: rgba(13,15,20,1); }

/* Mobile Dropdown: dunkel halten (nur auf Mobile) */
@media (max-width: 768px) and (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .main-navigation { background: rgba(13,15,20,.97); }
}
@media (max-width: 768px) {
    [data-theme="light"] .main-navigation { background: rgba(13,15,20,.97); }
}

/* Sub-menu Dropdown: im Light Mode hat das Menü weißen Hintergrund (var(--clr-surface)).
   Hover- und aktive Links wären sonst weiß auf weiß → auf Rot umschalten. */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .main-navigation ul ul li a:hover,
    :root:not([data-theme="dark"]) .main-navigation ul ul li.current-menu-item > a { color: var(--clr-red); }
}
[data-theme="light"] .main-navigation ul ul li a:hover,
[data-theme="light"] .main-navigation ul ul li.current-menu-item > a { color: var(--clr-red); }

/* ──────────────────────────────────────────────────────────
   PAGE HERO (Seitentitel-Bereich über dem Inhalt)
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .page-hero {
        background: #ebebeb;
        border-bottom-color: rgba(0,0,0,.09);
    }
    :root:not([data-theme="dark"]) .page-hero h1 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .page-hero-breadcrumb { color: #6b7280; }
    :root:not([data-theme="dark"]) .page-hero-breadcrumb a { color: #6b7280; }
    :root:not([data-theme="dark"]) .page-hero-breadcrumb a:hover { color: var(--clr-red); }
    :root:not([data-theme="dark"]) .page-hero-breadcrumb span { color: rgba(0,0,0,.2); }
}
[data-theme="light"] .page-hero { background: #ebebeb; border-bottom-color: rgba(0,0,0,.09); }
[data-theme="light"] .page-hero h1 { color: #1c1e2b; }
[data-theme="light"] .page-hero-breadcrumb { color: #6b7280; }
[data-theme="light"] .page-hero-breadcrumb a { color: #6b7280; }
[data-theme="light"] .page-hero-breadcrumb a:hover { color: var(--clr-red); }
[data-theme="light"] .page-hero-breadcrumb span { color: rgba(0,0,0,.2); }

/* ──────────────────────────────────────────────────────────
   GB-SECTION-HERO: bleibt immer dunkel
   Der Hero nutzt --clr-surface als Basisfarbe + Gradient.
   Im Light-Mode würde --clr-surface=#fff werden → fix.
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .gb-section-hero {
        background: #13161e;
    }
}
[data-theme="light"] .gb-section-hero { background: #13161e; }

/* ──────────────────────────────────────────────────────────
   GB-SECTION-DARK: Haupt-Content-Sektionen
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .gb-section-dark {
        background: #ffffff;
        border-color: rgba(0,0,0,.08);
        box-shadow: 0 1px 12px rgba(0,0,0,.06);
    }
    /* Fließtext */
    :root:not([data-theme="dark"]) .gb-section-dark .gb-text,
    :root:not([data-theme="dark"]) .gb-section-dark .gb-text-sm { color: #3d4152; }
    :root:not([data-theme="dark"]) .gb-section-dark .gb-lead    { color: #5a6070; }
    /* Überschriften – gb-heading-Klassen nutzen kein Token,
       sondern erben color: var(--clr-white) via .gb-heading-xl etc.
       → explizit überschreiben */
    :root:not([data-theme="dark"]) .gb-section-dark .gb-heading-xl,
    :root:not([data-theme="dark"]) .gb-section-dark .gb-heading-lg,
    :root:not([data-theme="dark"]) .gb-section-dark .gb-heading-md,
    :root:not([data-theme="dark"]) .gb-section-dark .gb-heading-sm,
    :root:not([data-theme="dark"]) .gb-section-dark h1,
    :root:not([data-theme="dark"]) .gb-section-dark h2,
    :root:not([data-theme="dark"]) .gb-section-dark h3,
    :root:not([data-theme="dark"]) .gb-section-dark h4 { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .gb-section-dark .gb-section-label { color: var(--clr-red); }
}
[data-theme="light"] .gb-section-dark {
    background: #ffffff;
    border-color: rgba(0,0,0,.08);
    box-shadow: 0 1px 12px rgba(0,0,0,.06);
}
[data-theme="light"] .gb-section-dark .gb-text,
[data-theme="light"] .gb-section-dark .gb-text-sm { color: #3d4152; }
[data-theme="light"] .gb-section-dark .gb-lead    { color: #5a6070; }
[data-theme="light"] .gb-section-dark .gb-heading-xl,
[data-theme="light"] .gb-section-dark .gb-heading-lg,
[data-theme="light"] .gb-section-dark .gb-heading-md,
[data-theme="light"] .gb-section-dark .gb-heading-sm,
[data-theme="light"] .gb-section-dark h1,
[data-theme="light"] .gb-section-dark h2,
[data-theme="light"] .gb-section-dark h3,
[data-theme="light"] .gb-section-dark h4 { color: #1c1e2b !important; }
[data-theme="light"] .gb-section-dark .gb-section-label { color: var(--clr-red); }

/* ──────────────────────────────────────────────────────────
   INLINE-FIX: color:var(--clr-white) in hellen Sektionen
   Diese Inline-Styles sind in Gutenberg-Seiten hard-coded
   und sollen in Light-Mode dunklen Text zeigen.
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .gb-section-dark *[style*="--clr-white"] {
        color: #1c1e2b !important;
    }
    /* Ausnahme: Elemente die explizit weiß sein müssen
       (Buttons, Badges auf rotem Hintergrund)
       → werden über gb-section-red / gb-section-hero selektiert
       und dort nicht überschrieben */
    :root:not([data-theme="dark"]) .gb-stat-card *[style*="--clr-white"],
    :root:not([data-theme="dark"]) .gb-contact-card *[style*="--clr-white"],
    :root:not([data-theme="dark"]) .gb-step *[style*="--clr-white"],
    :root:not([data-theme="dark"]) .gb-timeline-content *[style*="--clr-white"] {
        color: #1c1e2b !important;
    }
}
[data-theme="light"] .gb-section-dark *[style*="--clr-white"] { color: #1c1e2b !important; }
[data-theme="light"] .gb-stat-card *[style*="--clr-white"],
[data-theme="light"] .gb-contact-card *[style*="--clr-white"],
[data-theme="light"] .gb-step *[style*="--clr-white"],
[data-theme="light"] .gb-timeline-content *[style*="--clr-white"] { color: #1c1e2b !important; }

/* ──────────────────────────────────────────────────────────
   KARTEN
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    /* Stat-Karten */
    :root:not([data-theme="dark"]) .gb-stat-card {
        background: #f5f5f5 !important;
        border-color: rgba(0,0,0,.08) !important;
        box-shadow: 0 1px 8px rgba(0,0,0,.05) !important;
    }
    :root:not([data-theme="dark"]) .gb-stat-card:hover {
        background: #eee !important;
        transform: translateY(-3px) !important;
    }
    :root:not([data-theme="dark"]) .gb-stat-num   { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .gb-stat-unit  { color: var(--clr-red) !important; }
    :root:not([data-theme="dark"]) .gb-stat-label { color: #6b7280 !important; }

    /* Anforderungs-/Feature-Karten */
    :root:not([data-theme="dark"]) .gb-req-card {
        background: #f7f7f7 !important;
        border-color: rgba(0,0,0,.08) !important;
    }
    :root:not([data-theme="dark"]) .gb-req-card:hover {
        background: #f0f0f0 !important;
        border-color: rgba(232,40,11,.2) !important;
        transform: translateY(-3px) !important;
    }
    :root:not([data-theme="dark"]) .gb-req-card .gb-heading-sm { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .gb-req-card p              { color: #4a5060 !important; }

    /* Prozessschritte */
    :root:not([data-theme="dark"]) .gb-step {
        background: #f7f7f7 !important;
        border-color: rgba(0,0,0,.08) !important;
    }
    :root:not([data-theme="dark"]) .gb-step:hover {
        background: #f0f0f0 !important;
        border-color: rgba(232,40,11,.2) !important;
    }
    :root:not([data-theme="dark"]) .gb-step .gb-heading-md { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .gb-step .gb-text-sm    { color: #4a5060 !important; }
    :root:not([data-theme="dark"]) .gb-step p              { color: #4a5060 !important; }

    /* Kontaktkarten */
    :root:not([data-theme="dark"]) .gb-contact-card {
        background: #f7f7f7;
        border-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .gb-contact-card .gb-heading-md { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .gb-contact-card .gb-contact-item { color: #4a5060; }
    :root:not([data-theme="dark"]) .gb-contact-card .gb-text-sm { color: #4a5060; }
    :root:not([data-theme="dark"]) .gb-contact-card a { color: var(--clr-red); }
    :root:not([data-theme="dark"]) .gb-contact-card a:hover { color: var(--clr-red-dark); }
}
[data-theme="light"] .gb-stat-card { background: #f5f5f5 !important; border-color: rgba(0,0,0,.08) !important; box-shadow: 0 1px 8px rgba(0,0,0,.05) !important; }
[data-theme="light"] .gb-stat-card:hover { background: #eee !important; transform: translateY(-3px) !important; }
[data-theme="light"] .gb-stat-num   { color: #1c1e2b !important; }
[data-theme="light"] .gb-stat-unit  { color: var(--clr-red) !important; }
[data-theme="light"] .gb-stat-label { color: #6b7280 !important; }
[data-theme="light"] .gb-req-card { background: #f7f7f7 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .gb-req-card:hover { background: #f0f0f0 !important; border-color: rgba(232,40,11,.2) !important; transform: translateY(-3px) !important; }
[data-theme="light"] .gb-req-card .gb-heading-sm { color: #1c1e2b !important; }
[data-theme="light"] .gb-req-card p              { color: #4a5060 !important; }
[data-theme="light"] .gb-step { background: #f7f7f7 !important; border-color: rgba(0,0,0,.08) !important; }
[data-theme="light"] .gb-step:hover { background: #f0f0f0 !important; border-color: rgba(232,40,11,.2) !important; }
[data-theme="light"] .gb-step .gb-heading-md { color: #1c1e2b !important; }
[data-theme="light"] .gb-step .gb-text-sm    { color: #4a5060 !important; }
[data-theme="light"] .gb-step p              { color: #4a5060 !important; }
[data-theme="light"] .gb-contact-card { background: #f7f7f7; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .gb-contact-card .gb-heading-md  { color: #1c1e2b; }
[data-theme="light"] .gb-contact-card .gb-contact-item { color: #4a5060; }
[data-theme="light"] .gb-contact-card .gb-text-sm     { color: #4a5060; }
[data-theme="light"] .gb-contact-card a               { color: var(--clr-red); }
[data-theme="light"] .gb-contact-card a:hover         { color: var(--clr-red-dark); }

/* ──────────────────────────────────────────────────────────
   TIMELINE
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .gb-timeline-dot {
        background: #ffffff;
        border-color: var(--clr-red);
        box-shadow: 0 0 0 3px rgba(232,40,11,.12);
    }
    :root:not([data-theme="dark"]) .gb-timeline-item:hover .gb-timeline-dot { background: var(--clr-red); }
    :root:not([data-theme="dark"]) .gb-timeline-highlight .gb-timeline-dot  { background: var(--clr-red); }
    :root:not([data-theme="dark"]) .gb-timeline-content {
        background: #f7f7f7;
        border-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .gb-timeline-item:hover .gb-timeline-content {
        background: #f0f0f0;
        border-color: rgba(232,40,11,.2);
    }
    :root:not([data-theme="dark"]) .gb-timeline-content p      { color: #3d4152 !important; }
    :root:not([data-theme="dark"]) .gb-timeline-content strong { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .gb-timeline-highlight .gb-timeline-content {
        background: linear-gradient(135deg, rgba(232,40,11,.04) 0%, #f7f7f7 100%);
        border-color: rgba(232,40,11,.18);
    }
}
[data-theme="light"] .gb-timeline-dot { background: #ffffff; border-color: var(--clr-red); box-shadow: 0 0 0 3px rgba(232,40,11,.12); }
[data-theme="light"] .gb-timeline-item:hover .gb-timeline-dot { background: var(--clr-red); }
[data-theme="light"] .gb-timeline-highlight .gb-timeline-dot  { background: var(--clr-red); }
[data-theme="light"] .gb-timeline-content { background: #f7f7f7; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .gb-timeline-item:hover .gb-timeline-content { background: #f0f0f0; border-color: rgba(232,40,11,.2); }
[data-theme="light"] .gb-timeline-content p      { color: #3d4152 !important; }
[data-theme="light"] .gb-timeline-content strong { color: #1c1e2b !important; }
[data-theme="light"] .gb-timeline-highlight .gb-timeline-content {
    background: linear-gradient(135deg, rgba(232,40,11,.04) 0%, #f7f7f7 100%);
    border-color: rgba(232,40,11,.18);
}

/* ──────────────────────────────────────────────────────────
   SPECS-TABELLE
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .gb-specs-table tr        { border-bottom-color: rgba(0,0,0,.07); }
    :root:not([data-theme="dark"]) .gb-specs-table tr:hover  { background: rgba(0,0,0,.025); }
    :root:not([data-theme="dark"]) .gb-specs-table td:first-child { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .gb-specs-table td:last-child  { color: #3d4152; }
}
[data-theme="light"] .gb-specs-table tr        { border-bottom-color: rgba(0,0,0,.07); }
[data-theme="light"] .gb-specs-table tr:hover  { background: rgba(0,0,0,.025); }
[data-theme="light"] .gb-specs-table td:first-child { color: #1c1e2b; }
[data-theme="light"] .gb-specs-table td:last-child  { color: #3d4152; }

/* ──────────────────────────────────────────────────────────
   POST-KARTEN (Blog / Neuigkeiten)
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .post-card {
        background: #ffffff;
        border-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .post-card:hover {
        box-shadow: 0 12px 40px rgba(0,0,0,.1), 0 0 0 1px rgba(232,40,11,.1);
    }
    :root:not([data-theme="dark"]) .post-card-title { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .post-card-thumb-placeholder { color: rgba(0,0,0,.1); }
    :root:not([data-theme="dark"]) .post-card-meta   { color: #6b7280; }
    :root:not([data-theme="dark"]) .post-card-excerpt { color: #6b7280; }
}
[data-theme="light"] .post-card { background: #ffffff; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .post-card:hover { box-shadow: 0 12px 40px rgba(0,0,0,.1), 0 0 0 1px rgba(232,40,11,.1); }
[data-theme="light"] .post-card-title { color: #1c1e2b; }
[data-theme="light"] .post-card-thumb-placeholder { color: rgba(0,0,0,.1); }
[data-theme="light"] .post-card-meta    { color: #6b7280; }
[data-theme="light"] .post-card-excerpt { color: #6b7280; }

/* ──────────────────────────────────────────────────────────
   ALLGEMEINE SEITEN-INHALTE (Impressum, Datenschutz, Single)
   ────────────────────────────────────────────────────────── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .entry-content h2,
    :root:not([data-theme="dark"]) .entry-content h3,
    :root:not([data-theme="dark"]) .entry-content h4 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .entry-content p,
    :root:not([data-theme="dark"]) .entry-content li { color: #3d4152; }
    :root:not([data-theme="dark"]) .entry-content a { color: var(--clr-red); }
    :root:not([data-theme="dark"]) .entry-content hr { border-color: rgba(0,0,0,.09); }
    :root:not([data-theme="dark"]) .content-section { background: #ffffff; border-color: rgba(0,0,0,.08); }
}
[data-theme="light"] .entry-content h2,
[data-theme="light"] .entry-content h3,
[data-theme="light"] .entry-content h4 { color: #1c1e2b; }
[data-theme="light"] .entry-content p,
[data-theme="light"] .entry-content li { color: #3d4152; }
[data-theme="light"] .entry-content a  { color: var(--clr-red); }
[data-theme="light"] .entry-content hr { border-color: rgba(0,0,0,.09); }
[data-theme="light"] .content-section  { background: #ffffff; border-color: rgba(0,0,0,.08); }

/* ──────────────────────────────────────────────────────────
   THEME-TOGGLE BUTTON
   ────────────────────────────────────────────────────────── */
@media (min-width: 769px) {
    .theme-toggle.theme-toggle--nav { display: none; }
}

.theme-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    align-self: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid var(--clr-border);
    background: var(--clr-surface-2);
    color: var(--clr-muted);
    cursor: pointer;
    flex-shrink: 0;
    transition: border-color var(--transition), background var(--transition),
                color var(--transition), transform var(--transition);
    font-size: 1rem;
    line-height: 1;
    padding: 0;
    margin-right: .25rem;
}
.theme-toggle:hover {
    border-color: var(--clr-red);
    color: var(--clr-red);
}
.theme-toggle .tt-icon { pointer-events: none; }

@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .theme-toggle {
        background: rgba(255,255,255,.1);
        border-color: rgba(255,255,255,.15);
        color: #f0f2f7;
    }
    :root:not([data-theme="dark"]) .theme-toggle:hover {
        border-color: var(--clr-red);
        color: var(--clr-red);
    }
}
[data-theme="light"] .theme-toggle { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.15); color: #f0f2f7; }
[data-theme="light"] .theme-toggle:hover { border-color: var(--clr-red); color: var(--clr-red); }

/* ──────────────────────────────────────────────────────────
   HOMEPAGE-SEKTIONEN (front-page.php / index.php)
   ────────────────────────────────────────────────────────── */

/* Welcome-Section */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .welcome-section { background: var(--clr-bg); }
    :root:not([data-theme="dark"]) .welcome-text h2,
    :root:not([data-theme="dark"]) .welcome-text h3 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .welcome-text p   { color: #4a5060; }
    :root:not([data-theme="dark"]) .feature-item {
        background: #ffffff;
        border-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .feature-item:hover {
        background: #f5f5f5;
        border-color: rgba(232,40,11,.25);
    }
    :root:not([data-theme="dark"]) .feature-item h4 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .feature-item p  { color: #6b7280; }
}
[data-theme="light"] .welcome-section { background: var(--clr-bg); }
[data-theme="light"] .welcome-text h2,
[data-theme="light"] .welcome-text h3 { color: #1c1e2b; }
[data-theme="light"] .welcome-text p   { color: #4a5060; }
[data-theme="light"] .feature-item { background: #ffffff; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .feature-item:hover { background: #f5f5f5; border-color: rgba(232,40,11,.25); }
[data-theme="light"] .feature-item h4 { color: #1c1e2b; }
[data-theme="light"] .feature-item p  { color: #6b7280; }

/* Info-Strip (3 Spalten: Übungszeiten, Standort) */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .info-strip {
        background: #ffffff;
        border-top-color: rgba(0,0,0,.08);
        border-bottom-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .info-card { border-right-color: rgba(0,0,0,.08); }
    :root:not([data-theme="dark"]) .info-card:hover { background: #f5f5f5; }
    :root:not([data-theme="dark"]) .info-card-value { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .info-card-title { color: #6b7280; }
    :root:not([data-theme="dark"]) .info-card-text,
    :root:not([data-theme="dark"]) .info-card-list  { color: #4a5060; }
}
[data-theme="light"] .info-strip {
    background: #ffffff;
    border-top-color: rgba(0,0,0,.08);
    border-bottom-color: rgba(0,0,0,.08);
}
[data-theme="light"] .info-card         { border-right-color: rgba(0,0,0,.08); }
[data-theme="light"] .info-card:hover   { background: #f5f5f5; }
[data-theme="light"] .info-card-value   { color: #1c1e2b; }
[data-theme="light"] .info-card-title   { color: #6b7280; }
[data-theme="light"] .info-card-text,
[data-theme="light"] .info-card-list    { color: #4a5060; }

/* Dates-Section (Übungstermine) */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .dates-section {
        background: var(--clr-bg);
        border-top-color: rgba(0,0,0,.08);
        border-bottom-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .dates-section h2,
    :root:not([data-theme="dark"]) .dates-section h3 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .dates-section p   { color: #4a5060; }
    :root:not([data-theme="dark"]) .date-item {
        background: #ffffff;
        border-color: rgba(0,0,0,.08);
    }
    :root:not([data-theme="dark"]) .date-item:hover {
        border-color: rgba(232,40,11,.3);
        box-shadow: -4px 0 20px rgba(232,40,11,.08);
    }
    :root:not([data-theme="dark"]) .date-info h4 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .date-info p  { color: #6b7280; }
    :root:not([data-theme="dark"]) .date-icon {
        background: rgba(232,40,11,.08);
        border-color: rgba(232,40,11,.2);
    }
}
[data-theme="light"] .dates-section {
    background: var(--clr-bg);
    border-top-color: rgba(0,0,0,.08);
    border-bottom-color: rgba(0,0,0,.08);
}
[data-theme="light"] .dates-section h2,
[data-theme="light"] .dates-section h3  { color: #1c1e2b; }
[data-theme="light"] .dates-section p    { color: #4a5060; }
[data-theme="light"] .date-item          { background: #ffffff; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .date-item:hover    { border-color: rgba(232,40,11,.3); box-shadow: -4px 0 20px rgba(232,40,11,.08); }
[data-theme="light"] .date-info h4       { color: #1c1e2b; }
[data-theme="light"] .date-info p        { color: #6b7280; }
[data-theme="light"] .date-icon          { background: rgba(232,40,11,.08); border-color: rgba(232,40,11,.2); }

/* Posts-Section (Neuigkeiten auf Homepage) */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .posts-section { background: var(--clr-bg); }
    :root:not([data-theme="dark"]) .section-header h2,
    :root:not([data-theme="dark"]) .section-header h3 { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .post-card-title   { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .post-card-link:hover { color: var(--clr-red-dark); }
}
[data-theme="light"] .posts-section              { background: var(--clr-bg); }
[data-theme="light"] .section-header h2,
[data-theme="light"] .section-header h3          { color: #1c1e2b; }
[data-theme="light"] .post-card-title            { color: #1c1e2b; }
[data-theme="light"] .post-card-link:hover       { color: var(--clr-red-dark); }

/* Section-Label (roter Strich links) – immer sichtbar */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .section-label { color: var(--clr-red); }
}
[data-theme="light"] .section-label { color: var(--clr-red); }

/* Allgemeine Überschriften auf hellem Hintergrund
   (Seiten die nicht gb-section-dark verwenden)
   AUSNAHME: gb-section-hero und gb-section-red bleiben immer weiß! */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .page-blocks h1,
    :root:not([data-theme="dark"]) .page-blocks h2,
    :root:not([data-theme="dark"]) .page-blocks h3,
    :root:not([data-theme="dark"]) .page-blocks h4 { color: #1c1e2b; }
    /* Überschriften in roten/dunklen Sektionen – immer weiß */
    :root:not([data-theme="dark"]) .gb-section-red h1,
    :root:not([data-theme="dark"]) .gb-section-red h2,
    :root:not([data-theme="dark"]) .gb-section-red h3,
    :root:not([data-theme="dark"]) .gb-section-red h4,
    :root:not([data-theme="dark"]) .gb-section-red .gb-heading-xl,
    :root:not([data-theme="dark"]) .gb-section-red .gb-heading-lg,
    :root:not([data-theme="dark"]) .gb-section-red .gb-heading-md { color: #ffffff !important; }
    :root:not([data-theme="dark"]) .gb-section-red .gb-text,
    :root:not([data-theme="dark"]) .gb-section-red .gb-text-sm,
    :root:not([data-theme="dark"]) .gb-section-red .gb-lead,
    :root:not([data-theme="dark"]) .gb-section-red p { color: rgba(255,255,255,.82) !important; }
    /* Hero ebenfalls schützen */
    :root:not([data-theme="dark"]) .gb-section-hero h1,
    :root:not([data-theme="dark"]) .gb-section-hero h2,
    :root:not([data-theme="dark"]) .gb-section-hero .gb-heading-xl,
    :root:not([data-theme="dark"]) .gb-section-hero .gb-heading-lg { color: #ffffff !important; }
    :root:not([data-theme="dark"]) .gb-section-hero .gb-lead,
    :root:not([data-theme="dark"]) .gb-section-hero .gb-text { color: rgba(255,255,255,.75) !important; }
}
[data-theme="light"] .page-blocks h1,
[data-theme="light"] .page-blocks h2,
[data-theme="light"] .page-blocks h3,
[data-theme="light"] .page-blocks h4 { color: #1c1e2b; }
/* Rote Sektionen – Texte immer weiß */
[data-theme="light"] .gb-section-red h1,
[data-theme="light"] .gb-section-red h2,
[data-theme="light"] .gb-section-red h3,
[data-theme="light"] .gb-section-red h4,
[data-theme="light"] .gb-section-red .gb-heading-xl,
[data-theme="light"] .gb-section-red .gb-heading-lg,
[data-theme="light"] .gb-section-red .gb-heading-md { color: #ffffff !important; }
[data-theme="light"] .gb-section-red .gb-text,
[data-theme="light"] .gb-section-red .gb-text-sm,
[data-theme="light"] .gb-section-red .gb-lead,
[data-theme="light"] .gb-section-red p { color: rgba(255,255,255,.82) !important; }
/* Hero – Texte immer weiß */
[data-theme="light"] .gb-section-hero h1,
[data-theme="light"] .gb-section-hero h2,
[data-theme="light"] .gb-section-hero .gb-heading-xl,
[data-theme="light"] .gb-section-hero .gb-heading-lg { color: #ffffff !important; }
[data-theme="light"] .gb-section-hero .gb-lead,
[data-theme="light"] .gb-section-hero .gb-text { color: rgba(255,255,255,.75) !important; }

/* =========================================================
   ENTRY-CONTENT – Gutenberg-Blöcke im Beitrag
   Alle Regeln auf .entry-content oder spezifische
   Gutenberg-Block-Klassen beschränkt – kein anderer
   Seitenbereich wird beeinflusst.
   ========================================================= */

/* ── 1. Listen: Aufzählungszeichen wiederherstellen ──
   ul { list-style: none } aus dem globalen Reset deaktiviert
   Bullets. Im Beitragsinhalt werden sie zurückgesetzt.      */
.entry-content .wp-block-list {
    list-style: disc;
    padding-left: 1.5rem;
    margin-left: 0;
}
.entry-content ol.wp-block-list {
    list-style: decimal;
}
.entry-content .wp-block-list .wp-block-list {
    list-style: circle;
    margin-top: .35rem;
    margin-bottom: 0;
}
.entry-content .wp-block-list li {
    padding-left: .2rem;
}

/* ── 2. Bildunterschriften ── */
.entry-content figcaption,
.entry-content .wp-element-caption {
    /* Reset möglicher Core-Block-Styles */
    background: none;
    border: none;
    border-radius: 0;
    padding: 0;
    box-shadow: none;

    margin-top: .45rem;
    font-size: .75rem;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: .03em;
    text-align: left;
    color: var(--clr-muted);
}

/* ── 3. Inline-Code ── */
.entry-content :not(pre) > code {
    background: var(--clr-surface-2);
    border: 1px solid var(--clr-border);
    border-radius: 3px;
    padding: .15em .45em;
    font-family: 'Courier New', Courier, monospace;
    font-size: .875em;
    color: #e8a87c;
}

/* ── 4. Text-Formatierung ── */
.entry-content strong { color: var(--clr-white); font-weight: 700; }
.entry-content em     { font-style: italic; }
.entry-content s      { text-decoration: line-through; opacity: .65; }

/* ── 5. Buttons – Basis (ohne gb-Klassen) ── */
.wp-block-button:not([class*="gb-btn"]) .wp-block-button__link {
    background: var(--clr-red) !important;
    color: var(--clr-white) !important;
    padding: .75rem 1.75rem !important;
    border-radius: var(--radius-sm) !important;
    font-family: var(--font-display) !important;
    font-size: .9rem !important;
    font-weight: 700 !important;
    letter-spacing: .06em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    transition: all var(--transition) !important;
    box-shadow: 0 4px 16px rgba(232,40,11,.3) !important;
    border: none !important;
}
.wp-block-button:not([class*="gb-btn"]) .wp-block-button__link:hover {
    background: var(--clr-red-dark) !important;
    color: var(--clr-white) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(232,40,11,.4) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent !important;
    color: var(--clr-text) !important;
    border: 1.5px solid rgba(255,255,255,.3) !important;
    box-shadow: none !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
    border-color: var(--clr-red) !important;
    color: var(--clr-red) !important;
    background: var(--clr-red-glow) !important;
    transform: none !important;
}

/* ── 6. Pullquote ── */
.entry-content .wp-block-pullquote {
    border-top: 3px solid var(--clr-red);
    border-bottom: 3px solid var(--clr-red);
    padding: 2rem 1.5rem;
    margin: 2rem 0;
    text-align: center;
    background: var(--clr-surface);
    border-radius: var(--radius-md);
}
.entry-content .wp-block-pullquote blockquote {
    border: none !important;
    padding: 0 !important;
    background: transparent !important;
    margin: 0 !important;
    font-style: normal !important;
}
.entry-content .wp-block-pullquote blockquote p {
    font-family: var(--font-display) !important;
    font-size: clamp(1.15rem, 2.5vw, 1.6rem) !important;
    font-weight: 700 !important;
    color: var(--clr-white) !important;
    line-height: 1.3 !important;
    margin-bottom: .75rem !important;
    text-transform: uppercase;
    letter-spacing: .02em;
}
.entry-content .wp-block-pullquote cite {
    font-size: .78rem;
    color: var(--clr-red);
    font-style: normal;
    letter-spacing: .12em;
    text-transform: uppercase;
    font-weight: 600;
    display: block;
}

/* ── 7. Tabelle ── */
.entry-content .wp-block-table {
    overflow-x: auto;
    margin: 1.5rem 0;
    border-radius: var(--radius-md);
    border: 1px solid var(--clr-border);
}
.entry-content .wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: .9rem;
    margin: 0;
}
.entry-content .wp-block-table thead tr {
    background: var(--clr-surface-2);
    border-bottom: 2px solid var(--clr-red);
}
.entry-content .wp-block-table thead th {
    padding: .85rem 1rem;
    text-align: left;
    font-family: var(--font-display);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--clr-white);
}
.entry-content .wp-block-table tbody tr {
    border-bottom: 1px solid var(--clr-border);
    transition: background var(--transition);
}
.entry-content .wp-block-table tbody tr:last-child { border-bottom: none; }
.entry-content .wp-block-table tbody tr:hover     { background: rgba(255,255,255,.03); }
.entry-content .wp-block-table td {
    padding: .75rem 1rem;
    color: var(--clr-muted);
    vertical-align: middle;
    line-height: 1.5;
}
.entry-content .wp-block-table tfoot tr {
    border-top: 1px solid var(--clr-border);
    background: var(--clr-surface);
}
.entry-content .wp-block-table tfoot td {
    padding: .65rem 1rem;
    color: var(--clr-muted);
    font-size: .8rem;
    font-style: italic;
}
.entry-content .wp-block-table figcaption { margin-top: .4rem; text-align: left; }

/* ── 8. Media & Text ── */
.entry-content .wp-block-media-text {
    margin: 1.5rem 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
}
.entry-content .wp-block-media-text .wp-block-media-text__media img {
    border-radius: 0;
    height: 100%;
    object-fit: cover;
}
.entry-content .wp-block-media-text .wp-block-media-text__content {
    padding: 1.5rem !important;
}
.entry-content .wp-block-media-text .wp-block-media-text__content h3 {
    margin-top: 0 !important;
}

/* ── 9. Video-Embed (YouTube, Vimeo …) ── */
.entry-content .wp-block-embed       { margin: 1.5rem 0; }
.entry-content .wp-block-embed__wrapper {
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--clr-surface-2);
}
.entry-content .wp-block-embed__wrapper iframe {
    width: 100%;
    display: block;
    border: none;
}
.entry-content .wp-embed-aspect-16-9 .wp-block-embed__wrapper {
    position: relative;
    aspect-ratio: 16 / 9;
}
.entry-content .wp-embed-aspect-16-9 .wp-block-embed__wrapper iframe {
    position: absolute;
    inset: 0;
    height: 100%;
}
.entry-content .wp-block-embed figcaption { text-align: left; }

/* ── 10. Details / Akkordeon ── */
.entry-content .wp-block-details {
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    margin-bottom: .75rem;
    overflow: hidden;
    transition: border-color var(--transition);
}
.entry-content .wp-block-details:last-of-type { margin-bottom: 0; }
.entry-content .wp-block-details:hover        { border-color: rgba(232,40,11,.3); }

.entry-content .wp-block-details summary {
    padding: 1rem 1.25rem;
    font-family: var(--font-display);
    font-size: .95rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--clr-white);
    cursor: pointer;
    list-style: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    user-select: none;
    transition: color var(--transition), background var(--transition);
}
.entry-content .wp-block-details summary::-webkit-details-marker { display: none; }
.entry-content .wp-block-details summary::marker                 { display: none; }
.entry-content .wp-block-details summary::after {
    content: '+';
    color: var(--clr-red);
    font-size: 1.4rem;
    font-weight: 300;
    flex-shrink: 0;
    line-height: 1;
    transition: transform var(--transition);
}
.entry-content .wp-block-details[open] summary {
    color: var(--clr-red);
    border-bottom: 1px solid var(--clr-border);
    background: rgba(232,40,11,.04);
}
.entry-content .wp-block-details[open] summary::after { transform: rotate(45deg); }
.entry-content .wp-block-details > p,
.entry-content .wp-block-details .wp-block-paragraph {
    padding: 1rem 1.25rem;
    margin: 0;
    color: var(--clr-muted);
    font-size: .925rem;
    line-height: 1.7;
}

/* ── 11. Code-Block ── */
.entry-content .wp-block-code {
    background: var(--clr-surface-2);
    border: 1px solid var(--clr-border);
    border-left: 3px solid var(--clr-red);
    border-radius: var(--radius-md);
    padding: 1.25rem 1.5rem;
    margin: 1.5rem 0;
    overflow-x: auto;
}
.entry-content .wp-block-code code {
    font-family: 'Courier New', Courier, monospace;
    font-size: .875rem;
    color: #e8a87c;
    line-height: 1.8;
    white-space: pre;
    background: none;
    border: none;
    padding: 0;
}

/* ── 12. Preformatted ── */
.entry-content .wp-block-preformatted {
    background: var(--clr-surface-2);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-md);
    padding: 1.25rem 1.5rem;
    font-family: 'Courier New', Courier, monospace;
    font-size: .875rem;
    color: var(--clr-muted);
    line-height: 1.8;
    overflow-x: auto;
    white-space: pre;
    margin: 1.5rem 0;
}

/* ── 13. Vers / Gedicht ── */
.entry-content .wp-block-verse {
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-left: 3px solid rgba(232,40,11,.45);
    border-radius: 0 var(--radius-md) var(--radius-md) 0;
    padding: 1.25rem 1.5rem;
    font-family: var(--font-body);
    font-style: italic;
    font-size: 1rem;
    color: var(--clr-muted);
    line-height: 1.9;
    white-space: pre-wrap;
    margin: 1.5rem 0;
}

/* ── 14. Suche ── */
.entry-content .wp-block-search { margin: 1.5rem 0; }
.entry-content .wp-block-search__label {
    font-family: var(--font-display);
    font-size: .8rem;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--clr-muted);
    margin-bottom: .5rem;
    display: block;
}
.entry-content .wp-block-search .wp-block-search__inside-wrapper {
    display: flex;
    gap: .5rem;
    flex-wrap: wrap;
}
.entry-content .wp-block-search__input {
    flex: 1;
    min-width: 200px;
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-radius: var(--radius-sm);
    color: var(--clr-text);
    font-family: var(--font-body);
    font-size: .9rem;
    padding: .65rem 1rem;
    outline: none;
    transition: border-color var(--transition);
}
.entry-content .wp-block-search__input:focus        { border-color: var(--clr-red); }
.entry-content .wp-block-search__input::placeholder { color: var(--clr-muted); }
.entry-content .wp-block-search__button {
    background: var(--clr-red);
    color: var(--clr-white);
    border: none;
    border-radius: var(--radius-sm);
    padding: .65rem 1.25rem;
    font-family: var(--font-display);
    font-size: .85rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background var(--transition);
    white-space: nowrap;
}
.entry-content .wp-block-search__button:hover { background: var(--clr-red-dark); }

/* ── 15. Tag-Cloud ── */
.entry-content .wp-block-tag-cloud {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin: 1rem 0;
}
.entry-content .wp-block-tag-cloud a {
    display: inline-block;
    padding: .3rem .9rem;
    background: var(--clr-surface);
    border: 1px solid var(--clr-border);
    border-radius: 100px;
    font-size: .8rem !important;
    color: var(--clr-muted) !important;
    text-decoration: none !important;
    font-family: var(--font-display);
    letter-spacing: .06em;
    text-transform: uppercase;
    transition: all var(--transition);
}
.entry-content .wp-block-tag-cloud a:hover {
    background: var(--clr-red-glow);
    border-color: rgba(232,40,11,.3);
    color: var(--clr-red) !important;
}

/* ── 16. Kategorien-Block ── */
.entry-content .wp-block-categories { margin: 1rem 0; }
.entry-content .wp-block-categories ul {
    list-style: none !important;
    margin-left:  0 !important;
    padding-left: 0 !important;
}
.entry-content .wp-block-categories li {
    padding: .45rem 0;
    border-bottom: 1px solid var(--clr-border);
    margin-bottom: 0;
    font-size: .9rem;
}
.entry-content .wp-block-categories li:last-child { border-bottom: none; }
.entry-content .wp-block-categories li a {
    color: var(--clr-muted);
    text-decoration: none !important;
    display: flex;
    justify-content: space-between;
    align-items: center;
    transition: color var(--transition);
}
.entry-content .wp-block-categories li a:hover { color: var(--clr-red); }

/* ── 17. Cover-Block: Inner-Container Padding sicherstellen ── */
.entry-content .wp-block-cover {
    border-radius: var(--radius-lg);
    overflow: hidden;
    margin: 1.5rem 0;
}
.entry-content .wp-block-cover .wp-block-cover__inner-container {
    padding: 2rem !important;
}

/* ── 18. Group-Block mit Hintergrundfarbe ── */
.entry-content .wp-block-group.has-background {
    border-radius: var(--radius-md);
    margin: 1.5rem 0;
}

/* ── 19. alignwide im Single-Beitrag ── */
.entry-content .alignwide {
    width: 100%;
    max-width: 100%;
}

/* ── 20. Spacer ── */
.entry-content .wp-block-spacer { display: block; }

/* ── Light-Mode-Korrekturen für entry-content Blöcke ── */
@media (prefers-color-scheme: light) {
    :root:not([data-theme="dark"]) .entry-content strong                                           { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-pullquote                              { background: #ffffff; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-pullquote blockquote p                 { color: #1c1e2b !important; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-details summary                        { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-details[open] summary                  { color: var(--clr-red); }
    :root:not([data-theme="dark"]) .entry-content .wp-block-code code                              { color: #b85c00; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-preformatted                           { color: #3d4152; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-verse                                  { color: #3d4152; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-search__input                          { background: #ffffff; color: #1c1e2b; }
    :root:not([data-theme="dark"]) .entry-content .wp-block-table thead th                         { color: #1c1e2b; }
    :root:not([data-theme="dark"]) .entry-content :not(pre) > code                                 { color: #b85c00; background: #ebebeb; }
    :root:not([data-theme="dark"]) .wp-block-button.is-style-outline .wp-block-button__link        { color: #1c1e2b !important; border-color: rgba(0,0,0,.25) !important; }
    /* gb-btn-outline: weiße Schrift + weißer Rahmen → auf hellem Hintergrund unsichtbar */
    :root:not([data-theme="dark"]) .wp-block-button.gb-btn-outline .wp-block-button__link          { color: var(--clr-red) !important; border-color: var(--clr-red) !important; }
    :root:not([data-theme="dark"]) .wp-block-button.gb-btn-outline .wp-block-button__link:hover    { color: #fff !important; background: var(--clr-red) !important; border-color: var(--clr-red) !important; }
    /* Default-Button: WP-Core-Block-Styles können das Rot überschreiben → explizit setzen */
    :root:not([data-theme="dark"]) .wp-block-button:not([class*="gb-btn"]) .wp-block-button__link  { background: var(--clr-red) !important; color: #ffffff !important; }
}
[data-theme="light"] .entry-content strong                                            { color: #1c1e2b; }
[data-theme="light"] .entry-content .wp-block-pullquote                               { background: #ffffff; }
[data-theme="light"] .entry-content .wp-block-pullquote blockquote p                  { color: #1c1e2b !important; }
[data-theme="light"] .entry-content .wp-block-details summary                         { color: #1c1e2b; }
[data-theme="light"] .entry-content .wp-block-details[open] summary                   { color: var(--clr-red); }
[data-theme="light"] .entry-content .wp-block-code code                               { color: #b85c00; }
[data-theme="light"] .entry-content .wp-block-preformatted                            { color: #3d4152; }
[data-theme="light"] .entry-content .wp-block-verse                                   { color: #3d4152; }
[data-theme="light"] .entry-content .wp-block-search__input                           { background: #ffffff; color: #1c1e2b; }
[data-theme="light"] .entry-content .wp-block-table thead th                          { color: #1c1e2b; }
[data-theme="light"] .entry-content :not(pre) > code                                  { color: #b85c00; background: #ebebeb; }
[data-theme="light"] .wp-block-button.is-style-outline .wp-block-button__link         { color: #1c1e2b !important; border-color: rgba(0,0,0,.25) !important; }
[data-theme="light"] .wp-block-button.gb-btn-outline .wp-block-button__link            { color: var(--clr-red) !important; border-color: var(--clr-red) !important; }
[data-theme="light"] .wp-block-button.gb-btn-outline .wp-block-button__link:hover      { color: #fff !important; background: var(--clr-red) !important; border-color: var(--clr-red) !important; }
[data-theme="light"] .wp-block-button:not([class*="gb-btn"]) .wp-block-button__link    { background: var(--clr-red) !important; color: #ffffff !important; }