/* iDATEC – additions on top of the shared KanzleiAI glass design system */

/* Animated service panel (hero visual) */
.id-panel {
  width: min(440px, 100%); margin-inline: auto; padding: 18px 20px 14px;
  border-radius: var(--radius-lg, 22px);
  background: var(--glass-fill-strong, rgba(255,255,255,0.7));
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 30px 60px -28px color-mix(in srgb, var(--color-accent) 55%, transparent);
  backdrop-filter: blur(22px) saturate(165%); -webkit-backdrop-filter: blur(22px) saturate(165%);
  animation: idFloat 7s ease-in-out infinite;
}
.id-panel-head { display: flex; align-items: center; gap: 6px; padding-bottom: 12px; font-size: 0.78rem; color: var(--color-text-faint); }
.id-panel-head i { width: 9px; height: 9px; border-radius: 50%; background: color-mix(in srgb, var(--color-accent) 35%, white); }
.id-panel-head span { margin-left: auto; font-weight: 600; letter-spacing: .02em; }
.id-row {
  display: flex; align-items: center; gap: 12px; padding: 13px 14px; margin-top: 8px;
  border-radius: 14px; font-size: 0.92rem; font-weight: 550;
  background: rgba(255,255,255,0.55); border: 1px solid rgba(255,255,255,0.7);
  opacity: 0; transform: translateY(10px); animation: idRow .6s cubic-bezier(.2,.7,.2,1) forwards; animation-delay: var(--d, 300ms);
}
.id-row em { margin-left: auto; font-style: normal; font-size: 0.78rem; font-weight: 650; color: var(--color-accent-hover);
  background: var(--color-accent-soft); padding: 3px 10px; border-radius: 999px; }
.id-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--color-accent); box-shadow: 0 0 0 4px var(--color-accent-soft); animation: pulseAccent 2.4s ease-in-out infinite; flex: none; }
@keyframes idRow { to { opacity: 1; transform: none; } }
@keyframes idFloat { 50% { transform: translateY(-8px); } }

/* Partner strip */
.id-partners { padding: 4px 0 8px; }
.id-partners .container { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; }
.id-partners-label { font-size: 0.75rem; text-transform: uppercase; letter-spacing: .08em; color: var(--color-text-faint); font-weight: 650; }
.id-partners ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; list-style: none; margin: 0; padding: 0; }
.id-partners li { padding: 7px 14px; border-radius: 999px; font-size: 0.85rem; font-weight: 600;
  background: var(--glass-fill, rgba(255,255,255,0.55)); border: 1px solid rgba(255,255,255,0.7);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9); }

/* Clickable tiles */
.id-tile { display: block; color: inherit; text-decoration: none; transition: transform .25s ease, box-shadow .25s ease; }
.id-tile:hover { transform: translateY(-4px); }
.id-tile h4 { margin: 0 0 6px; }
.id-tile p { margin: 0; color: var(--color-text-muted, inherit); font-size: 0.92rem; }
.id-more { display: inline-flex; align-items: center; gap: 4px; margin-top: 12px; font-size: 0.85rem; font-weight: 650; color: var(--color-accent-hover); }
.id-more svg { width: 15px; height: 15px; }

/* KanzleiAI product teaser band */
.id-product {
  display: grid; grid-template-columns: 1.4fr 1fr; gap: 40px; align-items: center; padding: 44px;
  border-radius: var(--radius-lg, 22px);
  background: linear-gradient(150deg, color-mix(in srgb, var(--color-accent) 16%, rgba(255,255,255,0.75)), rgba(255,255,255,0.55));
  border: 1px solid color-mix(in srgb, var(--color-accent) 30%, rgba(255,255,255,0.7));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.9), 0 30px 60px -36px color-mix(in srgb, var(--color-accent) 60%, transparent);
}
.id-product h2 { margin: 10px 0 12px; }
.id-product-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.id-product-list li { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; font-weight: 600;
  background: rgba(255,255,255,0.6); border: 1px solid rgba(255,255,255,0.7); }
.id-product-list svg { width: 20px; height: 20px; flex: none; margin-top: 1px; }

@media (max-width: 860px) {
  .id-product { grid-template-columns: 1fr; padding: 28px 22px; gap: 24px; }
}
@media (prefers-reduced-motion: reduce) {
  .id-panel { animation: none; }
  .id-row { animation: none; opacity: 1; transform: none; }
}

/* Hero plaque text for iDATEC */
.hero-illustration::after { content: "✓\00a0\00a0 iDATEC · We make IT easy" !important; }
.id-row span:nth-child(2) { min-width: 0; }
.id-row em { white-space: nowrap; }

/* Logo image (header + footer) */
.logo-img { height: 46px; width: auto; display: block; }
.site-footer .logo-img { height: 54px; }
@media (max-width: 860px) { .logo-img { height: 38px; } }

/* No plaque in heroes */
.hero-illustration::after { display: none !important; }

/* Partner logos */
.id-partner-logos li { padding: 8px 16px; display: flex; align-items: center; }
.id-partner-logos img { height: 40px; width: auto; max-width: 150px; object-fit: contain; display: block; }
.logo-img { height: 64px; margin: -8px 0; }
.site-footer .logo-img { height: 76px; margin: -10px 0; }
@media (max-width: 860px) { .logo-img { height: 52px; margin: -6px 0; } }

/* Ruhiges Motion-Konzept */
.id-panel, .id-dot { animation: none !important; }
.id-row { animation: none !important; opacity: 1 !important; transform: none !important; }

/* Footer-Logo linksbündig, Partnerleiste mit Überschrift über größeren Logos */
.site-footer .footer-brand .logo { justify-content: flex-start; }
.site-footer .logo-img { margin-left: -16px; object-position: left center; }
.id-partners { padding: 12px 0 24px; }
.id-partners .container { flex-direction: column; gap: 18px; }
.id-partners-label { display: block; text-align: center; }
.id-partner-logos { gap: 14px 22px; }
.id-partner-logos li { background: none; border: 0; box-shadow: none; padding: 0; }
.id-partner-logos img { height: 72px; max-width: 200px; }
@media (max-width: 640px) { .id-partner-logos img { height: 56px; max-width: 150px; } }

/* News: DATEV-Feeds, Magazin, Videos */
.id-feed { padding: 24px; min-height: 220px; }
.id-feed .mym-rss-article { padding: 14px 0; border-bottom: 1px solid var(--color-border); }
.id-feed .mym-rss-article:last-child { border-bottom: 0; }
.id-feed .mym-rss-header { font-size: 0.78rem; color: var(--color-text-faint); margin-bottom: 4px; }
.id-feed h4 { margin: 0 0 6px; }
.id-feed a { color: var(--color-accent-hover); font-weight: 650; cursor: pointer; }
.id-magazin { display: flex; flex-direction: column; align-items: center; gap: 22px; padding: 32px; text-align: center; }
.id-magazin-banner { max-width: 100%; overflow-x: auto; line-height: 0; }
.id-video-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.id-video-frame { position: relative; aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; background: rgba(0,0,0,0.06); border: 1px solid rgba(255,255,255,0.7); box-shadow: 0 18px 36px -24px color-mix(in srgb, var(--color-accent) 50%, transparent); }
.id-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.id-video p { margin: 10px 4px 0; font-weight: 600; font-size: 0.92rem; }
@media (max-width: 960px) { .id-video-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) { .id-video-grid { grid-template-columns: 1fr; } .id-feed { padding: 16px; } }

/* Partner-Logos: größer, ovaler Rahmen mit Schatten */
.id-partner-logos { gap: 18px 24px; }
.id-partner-logos li {
  display: flex; align-items: center; justify-content: center;
  padding: 18px 40px; min-width: 190px; border-radius: 999px;
  background: rgba(255,255,255,0.82); border: 1px solid rgba(255,255,255,0.9);
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.95), 0 14px 30px -14px color-mix(in srgb, var(--color-accent) 45%, rgba(0,0,0,0.25)), 0 3px 8px -2px rgba(0,0,0,0.08);
}
.id-partner-logos img { height: 88px; max-width: 210px; }
@media (max-width: 640px) {
  .id-partner-logos li { padding: 12px 26px; min-width: 150px; }
  .id-partner-logos img { height: 64px; max-width: 150px; }
}

/* Rechtstexte */
.id-legal-head { max-width: 860px; margin: 0 auto 24px; }
.id-legal-head h1 { margin: 8px 0 0; }
.id-legal { max-width: 860px; margin: 0 auto; padding: clamp(24px, 4vw, 48px); line-height: 1.7; }
.id-legal-title { font-size: 1.25rem; margin: 0 0 18px; }
.id-legal h3 { font-size: 1.05rem; margin: 0 0 10px; }
.id-legal p { margin: 0 0 14px; }
.id-legal ol, .id-legal ul { margin: 0 0 16px; padding-left: 1.4em; }
.id-legal li { margin-bottom: 6px; }
.id-legal a { color: var(--color-accent-hover); text-decoration: underline; }
.id-legal p { margin: 0 0 14px !important; }
.id-legal h3 { margin: 0 0 14px !important; }
.id-legal-head { margin-bottom: 32px; padding-top: 24px; }
.id-legal-head h1 { margin-bottom: 0; }

/* Logo kleiner */
.logo-img { height: 48px; margin: -6px 0; }
.site-footer .logo-img { height: 56px; margin: -8px 0 -8px -12px; }
@media (max-width: 860px) { .logo-img { height: 40px; margin: -4px 0; } }

/* Partner-Logos: Rahmen mit abgerundeten Ecken, Hintergrund wie die Logos (weiß) */
.id-partner-logos li {
  border-radius: 16px; background: #fff; border: 1px solid rgba(0,0,0,0.06);
  box-shadow: 0 14px 30px -16px color-mix(in srgb, var(--color-accent) 40%, rgba(0,0,0,0.3)), 0 3px 8px -2px rgba(0,0,0,0.08);
  padding: 14px 28px;
}
.id-partner-logos img { mix-blend-mode: normal; }
@media (max-width: 640px) { .id-partner-logos li { padding: 10px 18px; } }

/* Webdesign & SEO: Skyline Berlin (wie e-dopamin.de) */
.id-skyline {
  position: relative; overflow: hidden;
  background:
    linear-gradient(90deg, rgba(246,250,242,0.95) 0%, rgba(246,250,242,0.84) 42%, rgba(246,250,242,0.38) 100%),
    url("../img/Berlin-Skyline-2.jpeg") center 60% / cover no-repeat;
}
.id-skyline::before { display: none; }

/* Rechtstexte: kompaktere Schrift, saubere Listen */
.id-legal { font-size: 0.92rem; line-height: 1.65; }
.id-legal p, .id-legal li { font-size: 0.92rem !important; line-height: 1.65; }
.id-legal ul { list-style: disc outside !important; padding-left: 1.5em !important; margin: 0 0 16px !important; }
.id-legal ol { list-style: decimal outside !important; padding-left: 1.6em !important; margin: 0 0 16px !important; }
.id-legal li { display: list-item !important; margin: 0 0 6px !important; padding-left: 4px; }
.id-legal li::before { content: none !important; display: none !important; }
.id-legal-title { font-size: 1.2rem !important; line-height: 1.3; }
.id-legal li { color: var(--color-text-muted, inherit); }

/* Partner-Logos: eine Reihe, Rahmenhintergrund #f1f5ea */
.id-partner-logos { display: grid !important; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 16px; width: 100%; }
.id-partner-logos li { background: #f1f5ea !important; min-width: 0 !important; padding: 14px 16px !important; justify-content: center; }
.id-partner-logos img { height: 64px !important; width: 100%; max-width: 100% !important; object-fit: contain; }
@media (max-width: 960px) { .id-partner-logos { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 560px) { .id-partner-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); } .id-partner-logos img { height: 52px !important; } }
.id-partner-logos li { padding: 10px 10px !important; }
.id-partner-logos img { height: 84px !important; }
@media (max-width: 560px) { .id-partner-logos img { height: 68px !important; } }

/* YouTube-Link-Karte (lokale Vorschau) */
.id-video-fallback { position: absolute; inset: 0; display: block; color: #fff; text-decoration: none; }
.id-video-fallback img { width: 100%; height: 100%; object-fit: cover; display: block; }
.id-video-fallback span { position: absolute; left: 12px; bottom: 12px; padding: 8px 14px; border-radius: 999px; background: rgba(0,0,0,0.72); font-size: 0.85rem; font-weight: 650; }

/* Videos: Datum und "Weitere anzeigen" */
.id-video-date { display: block; margin: 2px 4px 0; font-size: 0.8rem; color: var(--color-text-faint); }
.id-video .id-more { margin: 6px 4px 0; }
.id-videos-more { margin-top: 32px; text-align: center; }
.id-videos-more > summary { display: inline-flex; list-style: none; cursor: pointer; padding: 12px 24px; border-radius: 999px; font-weight: 650;
  background: var(--glass-fill, rgba(255,255,255,0.7)); border: 1px solid rgba(255,255,255,0.8); box-shadow: 0 10px 24px -14px color-mix(in srgb, var(--color-accent) 45%, rgba(0,0,0,0.2)); }
.id-videos-more > summary::-webkit-details-marker { display: none; }
.id-videos-more[open] > summary { display: none; }
.id-videos-more .id-video-grid { text-align: left; }

/* Siegel & Partner-Logos auf Leistungsseiten, DATEV-Partnerlogo im Hero */
.id-badges { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 22px; }
.id-badge { display: inline-flex; align-items: center; justify-content: center; padding: 14px 20px; border-radius: 16px; background: #f1f5ea;
  border: 1px solid rgba(0,0,0,0.06); box-shadow: 0 14px 30px -16px color-mix(in srgb, var(--color-accent) 40%, rgba(0,0,0,0.3)), 0 3px 8px -2px rgba(0,0,0,0.08); }
.id-badge img { height: 92px; width: auto; max-width: 240px; object-fit: contain; display: block; }
.id-logo-panel { display: flex; align-items: center; justify-content: center; padding: 40px; background: #fff; }
.id-logo-panel img { width: min(320px, 100%); height: auto; display: block; }

/* Animated checklist (DATEV video sections) */
.id-check-anim li { opacity: 0; transform: translateX(-14px); transition: opacity .5s ease, transform .5s cubic-bezier(.2,.7,.2,1); }
.id-check-anim li svg { stroke-dasharray: 26; stroke-dashoffset: 26; transition: stroke-dashoffset .5s ease .15s; }
.card.is-visible .id-check-anim li, .id-check-anim.is-visible li { opacity: 1; transform: none; }
.card.is-visible .id-check-anim li svg { stroke-dashoffset: 0; }
.id-check-anim li:nth-child(1), .id-check-anim li:nth-child(1) svg { transition-delay: .15s; }
.id-check-anim li:nth-child(2), .id-check-anim li:nth-child(2) svg { transition-delay: .4s; }
.id-check-anim li:nth-child(3), .id-check-anim li:nth-child(3) svg { transition-delay: .65s; }
.id-check-anim li:nth-child(4), .id-check-anim li:nth-child(4) svg { transition-delay: .9s; }
.id-check-anim li:nth-child(5), .id-check-anim li:nth-child(5) svg { transition-delay: 1.15s; }
.id-check-anim li:nth-child(6), .id-check-anim li:nth-child(6) svg { transition-delay: 1.4s; }
@media (prefers-reduced-motion: reduce) { .id-check-anim li, .id-check-anim li svg { opacity: 1; transform: none; stroke-dashoffset: 0; transition: none; } }

/* ==========================================================
   iDATEC-Eigenständigkeit: flächiger, eckiger, dunkle Header-Bänder,
   eigene Überschriftenschrift (Poppins). Farben bleiben unverändert.
   KanzleiAI (Unterordner kanzleiai/) behält sein Glas-Design.
   ========================================================== */
@font-face { font-family: "Poppins"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/Poppins-Bold.woff") format("woff"); }

:root, :root:not([data-theme="x"]) {
  --font-head: "Poppins", "Avenir Next", Futura, "Century Gothic", var(--font-sans);
  --radius-sm: 3px; --radius-md: 6px; --radius-lg: 10px; --radius-pill: 6px;
  --glass-fill: #ffffff; --glass-fill-strong: #ffffff; --glass-header: #ffffff;
  --glass-edge: var(--color-border, #dfe6d6); --glass-hi: none;
  --glass-shadow: 0 1px 2px rgba(23,38,16,.06), 0 6px 16px -10px rgba(23,38,16,.18);
  --glass-blur: none; --shadow-lg: 0 6px 18px -10px rgba(23,38,16,.25);
  --id-dark: #172610; --id-dark-2: #213615; --id-on-dark: #eef4e6; --id-accent-light: #a9cf7a;
}
h1, h2, h3, h4, .page-hero h1, .hero h1 { font-family: var(--font-head); font-weight: 700; letter-spacing: -0.015em; }
.btn { border-radius: 6px; font-weight: 600; }

/* Flächen statt Glas */
*, *::before, *::after { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.card, .id-product, .id-panel, .id-row, .id-product-list li, .id-partner-logos li, .id-tile, .id-feed, .id-magazin, .tab-btn, .hero-chips li {
  box-shadow: none; }
.card { background: #fff; border: 1px solid var(--color-border, #dfe6d6); border-radius: 8px; }
.id-panel { animation: none; border-radius: 10px; background: #fff; box-shadow: 0 10px 30px -18px rgba(0,0,0,.5); }
.id-row { border-radius: 6px; }
.id-partner-logos li { border-radius: 6px; }
.id-tile:hover { transform: none; box-shadow: 0 6px 18px -10px rgba(23,38,16,.35); }

/* Header: flach, volle Breite */
.site-header { top: 0 !important; margin: 0 !important; width: 100% !important; border-radius: 0 !important;
  border: 0; border-bottom: 1px solid var(--color-border, #dfe6d6); box-shadow: none !important; background: #fff; }
.site-header::before { border-radius: 0; background: #fff; opacity: 1; }
.site-header.is-scrolled { box-shadow: 0 2px 10px -6px rgba(23,38,16,.25) !important; }
.site-header .container { max-width: var(--container-max, 1180px); margin-inline: auto; }
.dropdown, .nav-dropdown, .submenu { border-radius: 6px; }

/* Dunkle Header-Bänder */
.page-hero:not(.id-skyline), .hero:not(.id-skyline) { background: var(--id-dark); color: var(--id-on-dark); }
.page-hero::before, .hero-glow { background: radial-gradient(600px 300px at 85% 20%, rgba(98,134,54,.28), transparent 70%) !important; filter: none !important; animation: none !important; }
.page-hero h1, .hero h1, .page-hero .lead, .hero .lead { color: #fff; }
.page-hero .lead, .hero .lead { color: var(--id-on-dark); opacity: .88; }
.page-hero h1 em, .hero h1 em { color: var(--id-accent-light); }
.page-hero .eyebrow { background: transparent; border: 0; box-shadow: none; padding: 0; color: var(--id-accent-light); border-radius: 0; }
.page-hero .eyebrow::before { background: var(--id-accent-light); }
.page-hero .hero-chips li { background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.22); color: var(--id-on-dark); border-radius: 4px; }
.page-hero .hero-chips li::before { color: var(--id-accent-light); }
.page-hero .btn-secondary { background: transparent; border-color: rgba(255,255,255,.45); color: #fff; }
.page-hero .btn-secondary:hover { border-color: var(--id-accent-light); color: var(--id-accent-light); }
.id-skyline { background:
  linear-gradient(90deg, rgba(23,38,16,0.94) 0%, rgba(23,38,16,0.82) 45%, rgba(23,38,16,0.45) 100%),
  url("../img/Berlin-Skyline-2.jpeg") center 60% / cover no-repeat; color: var(--id-on-dark); }
.cta-banner { border-radius: 10px; }
.section-alt { background: #f4f7ef; }

/* KanzleiAI-Teaser: bewusst im KanzleiAI-Glas-Look (zeigt das andere Produkt) */
.id-product { border-radius: 22px; background: linear-gradient(150deg, color-mix(in srgb, var(--color-accent) 16%, rgba(255,255,255,0.8)), rgba(255,255,255,0.6));
  border: 1px solid color-mix(in srgb, var(--color-accent) 30%, #fff); box-shadow: inset 0 1px 0 #fff, 0 30px 60px -36px color-mix(in srgb, var(--color-accent) 60%, transparent); }
.id-product h2 { font-family: var(--font-sans); }
.id-product-list li { border-radius: 14px; }
.hero-illustration, .hero-illustration > * { border-radius: 10px; }
.hero-illustration { background: none !important; box-shadow: none !important; border: 0 !important; }
.site-footer { border-radius: 0 !important; }
.id-tile, .card, .cta-banner, .tab-panel, .id-video-frame, .id-video-frame iframe, .id-feed, .id-magazin, .id-badge { border-radius: 8px; }
.btn-primary { background: var(--color-accent); box-shadow: none; }
.hero-illustration::before, .hero-illustration::after { display: none !important; }
.hero-illustration { padding: 0 !important; }
.page-hero h1 em, .hero h1 em { background: none !important; background-image: none !important; }
.hero h1 em::after { display: none; }

/* Noch eckiger: minimale Radien */
:root, :root:not([data-theme="x"]) { --radius-sm: 1px; --radius-md: 2px; --radius-lg: 3px; --radius-pill: 2px; }
.btn, .btn-primary, .btn-secondary, .card, .id-tile, .id-panel, .id-row, .id-row em, .id-product, .id-product-list li,
.id-partner-logos li, .id-feed, .id-magazin, .id-badge, .id-video-frame, .id-video-frame iframe, .tab-btn, .tab-panel,
.hero-chips li, .cta-banner, .hero-illustration, .hero-illustration > *, .site-header .btn, .nav-highlight, .icon-badge,
.dropdown, .nav-dropdown, .submenu, input, textarea, select, .form-field, .step-num, .id-panel-head i, .id-more {
  border-radius: 2px !important; }
.id-dot, .nav-dot { border-radius: 50% !important; }

/* Hero-Band heller: Markengrün statt fast Schwarz */
:root, :root:not([data-theme="x"]) { --id-dark: #4f6d2b; --id-dark-2: #628636; --id-on-dark: #f4f8ee; --id-accent-light: #d3eaa8; }
.page-hero:not(.id-skyline), .hero:not(.id-skyline) { background: linear-gradient(120deg, #44612a 0%, #5a7d31 55%, #6b9239 100%); }
.page-hero::before, .hero-glow { background: radial-gradient(600px 300px at 85% 20%, rgba(255,255,255,.14), transparent 70%) !important; }
.id-skyline { background:
  linear-gradient(90deg, rgba(68,97,42,0.93) 0%, rgba(79,109,43,0.80) 45%, rgba(98,134,54,0.45) 100%),
  url("../img/Berlin-Skyline-2.jpeg") center 60% / cover no-repeat; }
.page-hero .hero-chips li { background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.35); }
.page-hero .btn-primary { background: #fff; color: #3f5c24; }
.page-hero .btn-primary:hover { background: #eef5e4; }

/* Dienstleistungsseiten: Kennzahlen, FAQ */
.id-facts { display: grid; gap: 14px; }
.id-fact { display: flex; flex-direction: column; gap: 2px; padding: 18px 22px; background: #fff; border: 1px solid var(--color-border, #dfe6d6); border-left: 4px solid var(--color-accent); border-radius: 2px; }
.id-fact strong { font-family: var(--font-head); font-size: 1.15rem; color: var(--color-accent-hover); }
.id-fact span { color: var(--color-text-muted, #5b6552); font-size: 0.95rem; }
.id-faq details { background: #fff; border: 1px solid var(--color-border, #dfe6d6); border-radius: 2px; margin-bottom: 10px; }
.id-faq summary { cursor: pointer; padding: 18px 22px; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.id-faq summary::-webkit-details-marker { display: none; }
.id-faq summary::after { content: "+"; font-size: 1.4rem; line-height: 1; color: var(--color-accent); transition: transform .2s; }
.id-faq details[open] summary::after { transform: rotate(45deg); }
.id-faq details p { margin: 0; padding: 0 22px 20px; color: var(--color-text-muted, #5b6552); line-height: 1.7; }
.id-badges + .btn { margin-top: 18px; }
.card.tight h4 { margin-bottom: 8px; }

/* Anker-Untermenüs mittig */
.anchor-nav .container { justify-content: center; flex-wrap: wrap; overflow-x: visible; }
@media (max-width: 760px) { .anchor-nav .container { justify-content: flex-start; flex-wrap: nowrap; overflow-x: auto; } }
/* Footer: Unterseiten der Produktlinie */
.site-footer .footer-col li.sub { padding-left: 12px; font-size: 0.88rem; opacity: .9; }
.site-footer .footer-col li.sub a::before { content: "› "; color: var(--color-accent); }

/* ==========================================================
   DATEV-nahes Erscheinungsbild (Orientierung: datev.de)
   Teal als Hauptfarbe, Lindgrün für Aktionen, neutrale Graustufen,
   eckige Flächen, ruhige Typografie. KanzleiAI behält sein Grün.
   ========================================================== */
:root, :root:not([data-theme="x"]) {
  --color-bg: #f2f2f2; --color-bg-alt: #ebebeb; --color-surface: #ffffff; --color-surface-alt: #f5f5f5;
  --color-border: #d9d9d9; --color-border-strong: #bdbdbd;
  --color-text: #0f0f0f; --color-text-muted: #4a4a4a; --color-text-faint: #767676;
  --color-accent: #628636; --color-accent-hover: #4f6d2b; --color-accent-soft: #e9f0dd; --color-accent-contrast: #fff;
  --glass-ring: rgba(98,134,54,.12); --amb-1: transparent; --amb-2: transparent; --amb-3: transparent;
  --id-lime: #9ccf50; --id-lime-hover: #88bb3d;
  --id-dark: #4f6d2b; --id-on-dark: #ffffff; --id-accent-light: #d3eaa8;
  --font-sans: "Segoe UI", "Noto Sans Display", Inter, Arial, sans-serif;
  --font-head: "Segoe UI", "Noto Sans Display", Inter, Arial, sans-serif;
  --radius-sm: 2px; --radius-md: 4px; --radius-lg: 4px; --radius-pill: 4px;
}
body { background: #f2f2f2 !important; font-family: var(--font-sans); }
body::before, body::after { background: none !important; }
h1, h2, h3, h4, .page-hero h1, .hero h1 { font-family: var(--font-head); font-weight: 500; letter-spacing: -0.005em; }
h2 { color: #628636; }
h4 { font-weight: 650; color: #0f0f0f; }
.eyebrow { color: #628636; }
.section-alt { background: #ebebeb; }
.card, .id-fact, .id-faq details { border-color: #e2e2e2; }
.section-border-top { border-color: #d9d9d9; }

/* Header + Breadcrumb-Optik */
.site-header, .site-header::before { background: #fff; }
.site-header { border-bottom: 1px solid #e2e2e2; }
.nav-links a, .site-header nav a { color: #0f0f0f; }

/* Buttons: Lindgrün mit dunkler Schrift wie bei DATEV */
.btn-primary, .page-hero .btn-primary, .cta-banner .btn-primary { background: var(--id-lime) !important; color: #0f0f0f !important; border: 1px solid var(--id-lime); border-radius: 4px; box-shadow: none; font-weight: 600; }
.btn-primary:hover, .page-hero .btn-primary:hover { background: var(--id-lime-hover) !important; border-color: var(--id-lime-hover); transform: none; }
.btn-secondary { background: #fff; color: #628636; border: 1px solid #628636; }
.btn-secondary:hover { background: #e9f0dd; color: #4f6d2b; border-color: #4f6d2b; transform: none; }
.page-hero .btn-secondary { background: transparent; color: #fff; border-color: rgba(255,255,255,.7); }
.page-hero .btn-secondary:hover { background: rgba(255,255,255,.12); color: #fff; border-color: #fff; }

/* Hero-Band: DATEV-Teal mit sanftem Verlauf */
.page-hero:not(.id-skyline), .hero:not(.id-skyline) { background: linear-gradient(105deg, #3f5c24 0%, #5a7d31 55%, #628636 100%); }
.page-hero::before, .hero-glow { background: radial-gradient(700px 320px at 85% 10%, rgba(255,255,255,.10), transparent 70%) !important; }
.id-skyline { background:
  linear-gradient(90deg, rgba(63,92,36,0.94) 0%, rgba(90,125,49,0.82) 45%, rgba(98,134,54,0.45) 100%),
  url("../img/Berlin-Skyline-2.jpeg") center 60% / cover no-repeat; }
.page-hero h1 em, .hero h1 em { color: var(--id-accent-light); font-style: normal; }
.page-hero .eyebrow, .page-hero .eyebrow::before { color: var(--id-accent-light); }
.page-hero .hero-chips li { background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.35); }
.page-hero .hero-chips li::before { color: var(--id-accent-light); }
.id-panel { background: #fff; }
.id-row em, .id-panel-head i { background: #e9f0dd; color: #4f6d2b; }
.id-dot { background: #628636; box-shadow: 0 0 0 4px #e9f0dd; }
.id-row { background: #f5f5f5; border-color: #e5e5e5; }
.hero-chips li::before, .id-more, .icon-badge { color: #628636; }
.icon-badge { background: #e9f0dd; }
.compare-list svg, .id-product-list svg { color: #628636; }

/* Anker-Navigation + Tabs */
.anchor-nav, .anchor-nav::before { background: #fff !important; }
.anchor-nav { border-bottom: 1px solid #e2e2e2; }
.anchor-nav a { color: #0f0f0f; }
.anchor-nav a:hover, .anchor-nav a.is-active { color: #628636; border-color: #628636; }

/* Partnerleiste, Fakten, Badges neutral */
.id-partners { background: #fff; }
.id-badge { background: #fff; border-radius: 2px; }
.id-fact { border-left-color: #9ccf50; }
.id-fact strong { color: #628636; }
.id-faq summary::after { color: #628636; }
.cta-banner { background: linear-gradient(105deg, #3f5c24, #5a7d31) !important; }
.cta-banner .btn-secondary { color: #fff; border-color: rgba(255,255,255,.7); background: transparent; }
.step-num { background: #628636 !important; color: #fff; border-radius: 2px; }
.steps::before, .step::after { border-color: #cfdcbc; }
.site-footer { background: #fff; border-top: 4px solid #9ccf50; }
.site-footer a:hover { color: #628636; }
.tab-btn.is-active { color: #628636; border-color: #628636; }

/* KanzleiAI bleibt erkennbar grün (eigenes Produkt) */
.nav-highlight, .id-product { --color-accent: #628636; --color-accent-hover: #4f6d2b; --color-accent-soft: #e9f0dd; }
.nav-highlight { background: #eef4e4; border-color: #c9dbb0; color: #4f6d2b; }
.id-product .btn-primary { background: #628636 !important; color: #fff !important; border-color: #628636; }
.id-product .btn-secondary { color: #4f6d2b; border-color: #628636; }
.id-product .icon-badge { background: #e9f0dd; color: #628636; }
.id-product h2, .id-product .eyebrow { color: #4f6d2b; }
.id-product .ai-mark { color: #628636; }

/* Hero-Fotos (Wikimedia Commons) mit Teal-Verlauf für Lesbarkeit */
.id-photo { background-size: cover !important; background-position: center !important; }
.id-ph-bauhaus { background: linear-gradient(95deg, rgba(63,92,36,.90) 0%, rgba(74,107,42,.62) 45%, rgba(98,134,54,.3) 100%), url("../img/Magdeburger_Dom_und_Magdeburger_Elbe.jpg") center 62% / cover no-repeat !important; }
.id-ph-magdeburg { background: linear-gradient(95deg, rgba(63,92,36,.94) 0%, rgba(90,125,49,.80) 50%, rgba(90,125,49,.40) 100%), url("../img/Magdeburg_2018.jpeg") center / cover no-repeat !important; }
.id-ph-server { background: linear-gradient(95deg, rgba(63,92,36,.94) 0%, rgba(90,125,49,.80) 50%, rgba(90,125,49,.40) 100%), url("../img/BalticServers_data_center.jpg") center 40% / cover no-repeat !important; }
.id-ph-server2 { background: linear-gradient(95deg, rgba(63,92,36,.94) 0%, rgba(90,125,49,.80) 50%, rgba(90,125,49,.40) 100%), url("../img/BalticServers_data_center.jpg") center 75% / cover no-repeat !important; }
.id-photo::before { display: none; }

/* Hero-Panel: transparent, edel (Milchglas auf dem Foto) */
.page-hero .id-panel:not(.id-logo-panel) { background: rgba(255,255,255,.10); border: 1px solid rgba(255,255,255,.30); border-radius: 4px;
  box-shadow: 0 20px 50px -24px rgba(0,0,0,.45); -webkit-backdrop-filter: blur(14px) saturate(130%) !important; backdrop-filter: blur(14px) saturate(130%) !important; }
.page-hero .id-panel-head { color: rgba(255,255,255,.75); border-bottom: 1px solid rgba(255,255,255,.18); }
.page-hero .id-panel-head i { background: rgba(255,255,255,.35); }
.page-hero .id-row { background: transparent; border: 0; border-bottom: 1px solid rgba(255,255,255,.14); border-radius: 0; color: #fff; font-weight: 500; margin-top: 0; padding: 14px 6px; }
.page-hero .id-row:last-child { border-bottom: 0; }
.page-hero .id-row em { background: rgba(255,255,255,.16); color: #fff; font-weight: 600; }
.page-hero .id-dot { background: var(--id-accent-light); box-shadow: 0 0 0 4px rgba(182,220,122,.25); }
.page-hero .id-logo-panel { background: rgba(255,255,255,.92); border-radius: 4px; }

/* Grün als Markenfarbe, teils heller */
h2, .eyebrow, .id-fact strong { color: #4f6d2b; }
.section-alt { background: #eef2e8; }
.id-partners { background: #f7f9f3; }
.page-hero:not(.id-skyline):not(.id-photo), .hero:not(.id-skyline) { background: linear-gradient(105deg, #4a6b2a 0%, #587a30 55%, #628636 100%); }
.cta-banner { background: linear-gradient(105deg, #5a7d31, #628636) !important; }
.btn-primary, .page-hero .btn-primary { background: #a6d16a !important; border-color: #a6d16a; }
.btn-primary:hover, .page-hero .btn-primary:hover { background: #93c056 !important; border-color: #93c056; }
.site-footer { border-top-color: #a6d16a; }
.id-fact { border-left-color: #a6d16a; }
.icon-badge { background: #e6f0d6; }

/* Kennzahl-Box mit kleinem Zertifikatslogo */
.id-fact { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; }
.id-fact > div { display: flex; flex-direction: column; gap: 2px; }
.id-fact-logo { height: 44px; width: auto; flex: none; }
.site-footer .footer-col h4 a { color: inherit; text-decoration: none; }
.site-footer .footer-col h4 a:hover { color: var(--color-accent); }

/* KanzleiAI im Menü: schlicht, nur „AI" in Grün */
.nav-highlight, .nav-link.nav-highlight { background: none !important; border: 0 !important; box-shadow: none !important; padding-left: inherit; color: inherit !important; font-weight: inherit; }
.nav-highlight .nav-dot { display: none !important; }
.nav-highlight .nav-ai { color: #628636; font-weight: 700; }
.nav-highlight:hover .nav-ai { color: #4f6d2b; }
.nav-link.nav-highlight { gap: 0 !important; margin: 0 !important; transform: none !important; } .nav-link.nav-highlight:hover { background: none !important; transform: none !important; }

/* Menü: KanzleiAI mit Unterzeile */
.nav-stack { display: inline-flex; flex-direction: column; align-items: flex-start; line-height: 1.1; }
.nav-sub { font-size: 0.66rem; letter-spacing: .03em; color: #767676; font-weight: 500; margin-top: 3px; }

/* Header-Button: klar, Glas, farbig */
.site-header .btn-primary, .site-header .btn.btn-primary {
  background: linear-gradient(135deg, rgba(166,209,106,.55), rgba(98,134,54,.38)) !important;
  color: #2f4a17 !important; border: 1px solid rgba(98,134,54,.55) !important; border-radius: 6px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 6px 16px -8px rgba(98,134,54,.6) !important;
  -webkit-backdrop-filter: blur(10px) saturate(150%) !important; backdrop-filter: blur(10px) saturate(150%) !important;
  font-weight: 650; transition: background .2s, box-shadow .2s; }
.site-header .btn-primary:hover { background: linear-gradient(135deg, rgba(166,209,106,.75), rgba(98,134,54,.55)) !important; color: #243b11 !important; transform: none; }

/* KanzleiAI im Menü: dezenter grüner Glas-Button */
.nav-link.nav-highlight {
  background: linear-gradient(135deg, rgba(255,255,255,.75), rgba(166,209,106,.28)) !important;
  border: 1px solid rgba(98,134,54,.38) !important; border-radius: 6px !important;
  padding: 6px 14px !important; margin: 0 4px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 4px 14px -8px rgba(98,134,54,.55) !important;
  -webkit-backdrop-filter: blur(10px) saturate(150%) !important; backdrop-filter: blur(10px) saturate(150%) !important;
  transition: box-shadow .2s, border-color .2s, background .2s; }
.nav-link.nav-highlight:hover { background: linear-gradient(135deg, rgba(255,255,255,.85), rgba(166,209,106,.42)) !important;
  border-color: rgba(98,134,54,.6) !important; box-shadow: inset 0 1px 0 #fff, 0 6px 18px -8px rgba(98,134,54,.7) !important; }
.nav-highlight .nav-main { font-weight: 650; }
.nav-highlight .nav-sub { color: #5b7a35; }

/* Kontaktformular: Einwilligung + Fehlermeldung */
.id-consent { display: flex; gap: 10px; align-items: flex-start; margin-top: 18px; font-size: 0.86rem; color: var(--color-text-muted); line-height: 1.5; }
.id-consent input { margin-top: 3px; flex: none; width: 16px; height: 16px; accent-color: #628636; }
.form-error { display: none; padding: 14px 18px; border-radius: 4px; background: #fbeaea; color: #7a2323; border: 1px solid #efc5c5; font-size: 0.9rem; margin-top: 16px; }
.form-error.is-visible { display: block; }
.form-success.is-visible { background: #e9f0dd; border: 1px solid #c9dbb0; }

/* weitere Hero-Fotos (Wikimedia Commons) */
.id-ph-lock { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Data_security_privacy_lock_password__41237924492_.jpg") center 40% / cover no-repeat !important; }
.id-ph-expert { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Magnifying_glass2.jpg") center 45% / cover no-repeat !important; }
.id-ph-repair { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Computer_repair_in_progress.jpg") center 45% / cover no-repeat !important; }
.id-ph-contact { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Business_agreement_handshake_at_coffee_shop.jpg") center 40% / cover no-repeat !important; }
.id-ph-news { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Business_Woman_is_reading_Newspaper_-_35870943420.jpg") center 35% / cover no-repeat !important; }

/* Aktive Tabs (News): weiße Schrift auf Grün */
.tab-btn.is-active, .tab-btn[aria-selected="true"] { background: #628636 !important; border-color: #628636 !important; color: #fff !important; }

/* Hero-Fotos DATEV / Fernwartung */
.id-ph-docs { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Legal_Contract___Signature_-_Warm_Tones.jpg") center 40% / cover no-repeat !important; }
.id-ph-keys { background: linear-gradient(95deg, rgba(63,92,36,.92) 0%, rgba(74,107,42,.72) 48%, rgba(98,134,54,.35) 100%), url("../img/Computer_keyboard_placed_on_a_black_desk_in_a_modern_workspace.jpg") center 55% / cover no-repeat !important; }

/* Milchglas-Panel sofort sichtbar: keine Einblend-Animation des Elternelements (Blur startet sonst verzögert) */
.page-hero .hero-illustration, .page-hero .hero-illustration.reveal { opacity: 1 !important; transform: none !important; transition: none !important; will-change: auto; }
.page-hero .id-panel { animation: none !important; transition: none !important; }
.page-hero .id-row { animation-duration: .35s; }

/* Helles Grün in dunklen iDATEC-Grün-Flächen entfernen: Akzente weiß, Buttons iDATEC-Grün */
:root, :root:not([data-theme="x"]), :root[data-theme="dark"], :root[data-theme="light"] { --id-accent-light: #ffffff !important; }
.page-hero h1 em, .hero h1 em, .page-hero .eyebrow, .page-hero .eyebrow::before, .page-hero .hero-chips li::before { color: #ffffff !important; }
.page-hero .eyebrow::before { background: #ffffff !important; }
.page-hero .id-dot { background: #ffffff !important; box-shadow: 0 0 0 4px rgba(255,255,255,.22) !important; }
.btn-primary, .page-hero .btn-primary, .cta-banner .btn-primary { background: #628636 !important; border-color: #628636 !important; color: #fff !important; }
.btn-primary:hover, .page-hero .btn-primary:hover, .cta-banner .btn-primary:hover { background: #4f6d2b !important; border-color: #4f6d2b !important; }
.page-hero .btn-primary, .cta-banner .btn-primary { border: 2px solid #fff !important; }
.site-footer { border-top-color: #628636 !important; }
.id-fact { border-left-color: #628636 !important; }

/* Menü: KanzleiAI wie die Chips (Corporate Partner …), Kontakt-Button wie im Slider */
.nav-link.nav-highlight, .nav-link.nav-highlight:hover {
  background: rgba(98,134,54,.10) !important; border: 1px solid rgba(98,134,54,.38) !important; border-radius: 4px !important;
  box-shadow: none !important; -webkit-backdrop-filter: blur(14px) saturate(130%) !important; backdrop-filter: blur(14px) saturate(130%) !important; }
.nav-link.nav-highlight:hover { background: rgba(98,134,54,.18) !important; border-color: rgba(98,134,54,.6) !important; }
.site-header .btn-primary, .site-header .btn.btn-primary { background: #628636 !important; color: #fff !important; border: 2px solid #fff !important; border-radius: 4px !important; box-shadow: 0 0 0 1px #628636 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.site-header .btn-primary:hover { background: #4f6d2b !important; color: #fff !important; }
/* Weitere Videos: Einblend-Animation nicht abwarten */
.id-videos-more .reveal-item, .id-videos-more .reveal { opacity: 1 !important; transform: none !important; }


/* Logo-Panel (DATEV Partner) ohne Hintergrund */
.id-panel.id-logo-panel, .page-hero .id-panel.id-logo-panel { background: transparent !important; border: 0 !important; box-shadow: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }

/* Menü: KanzleiAI im gleichen Stil wie "Kontakt aufnehmen" */
.nav-link.nav-highlight, .nav-link.nav-highlight:hover { background: #628636 !important; color: #fff !important; border: 2px solid #fff !important; border-radius: 4px !important; box-shadow: 0 0 0 1px #628636 !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
.nav-link.nav-highlight:hover { background: #4f6d2b !important; }
.nav-highlight .nav-main, .nav-highlight .nav-ai, .nav-highlight:hover .nav-ai { color: #fff !important; }
.nav-highlight .nav-sub { color: rgba(255,255,255,.85) !important; }

/* KanzleiAI im Menü: dezentes, langsames Aufleuchten */
@keyframes id-nav-glow { 0%, 70%, 100% { box-shadow: 0 0 0 1px #628636, 0 0 0 0 rgba(166,209,106,0); filter: brightness(1); } 85% { box-shadow: 0 0 0 1px #628636, 0 0 14px 3px rgba(166,209,106,.55); filter: brightness(1.12); } }
.nav-link.nav-highlight { animation: id-nav-glow 4.5s ease-in-out infinite; }
.nav-link.nav-highlight:hover { animation: none; }
@media (prefers-reduced-motion: reduce) { .nav-link.nav-highlight { animation: none; } }

/* Kontakt: Text näher an der Überschrift */
.contact-info-row h4 { margin: 0 0 2px !important; line-height: 1.25; }
.contact-info-row p { margin: 0 !important; line-height: 1.4; }

/* Video-Vorschau (Klick lädt YouTube) */
.id-yt-facade { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; cursor: pointer; background: #1d2b12 center / cover no-repeat; }
.id-yt-play { position: absolute; left: 50%; top: 50%; width: 64px; height: 44px; margin: -22px 0 0 -32px; border-radius: 8px; background: #628636; box-shadow: 0 0 0 2px #fff; }
.id-yt-play::after { content: ""; position: absolute; left: 26px; top: 12px; border-left: 16px solid #fff; border-top: 10px solid transparent; border-bottom: 10px solid transparent; }
.id-yt-facade:hover .id-yt-play { background: #4f6d2b; }
/* Menü-Button: etwas auffälliger */
@keyframes id-nav-glow { 0%, 60%, 100% { box-shadow: 0 0 0 1px #628636, 0 0 0 0 rgba(166,209,106,0); transform: scale(1); } 80% { box-shadow: 0 0 0 1px #628636, 0 0 16px 5px rgba(120,170,60,.65); transform: scale(1.04); } }
.nav-link.nav-highlight { animation: id-nav-glow 3.5s ease-in-out infinite !important; }
.nav-link.nav-highlight:hover { animation: none !important; }

/* Partner & Zertifizierungen: größere Logos */
.id-partner-logos img { height: 110px !important; }
.id-partner-logos li { padding: 14px 12px !important; }
@media (max-width: 960px) { .id-partner-logos img { height: 96px !important; } }
@media (max-width: 560px) { .id-partner-logos img { height: 78px !important; } }

/* KanzleiAI-Button: deutlich sichtbares, langsames Pulsieren */
@keyframes id-nav-pulse { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 1px #628636, 0 0 0 0 rgba(98,134,54,.55); } 50% { transform: scale(1.06); box-shadow: 0 0 0 1px #628636, 0 0 16px 5px rgba(98,134,54,.45); } }
.nav-link.nav-highlight { animation: id-nav-pulse 3s ease-in-out infinite !important; transform-origin: center; }
.nav-link.nav-highlight:hover { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .nav-link.nav-highlight { animation: none !important; } }
/* Korrektur: !important-Regeln blockieren transform/box-shadow in Animationen -> scale + filter nutzen */
@keyframes id-nav-pulse2 { 0%, 100% { scale: 1; filter: drop-shadow(0 0 0 rgba(98,134,54,0)); } 50% { scale: 1.06; filter: drop-shadow(0 0 8px rgba(98,134,54,.75)) brightness(1.1); } }
.nav-link.nav-highlight { animation: id-nav-pulse2 3s ease-in-out infinite !important; }

/* Responsive: Hero-Panel (Milchglas) volle Breite, Zeilen ohne Umbruch */
@media (max-width: 860px) {
  .page-hero .hero-illustration { max-width: none !important; width: 100% !important; margin: 0 !important; }
  .page-hero .id-panel { width: 100%; max-width: none; }
  .page-hero .id-row { padding-left: 12px; padding-right: 12px; gap: 8px; }
  .page-hero .id-row > span:nth-child(2) { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .92rem; }
  .page-hero .id-row em { white-space: nowrap; flex: none; }
}
@media (max-width: 380px) { .page-hero .id-row > span:nth-child(2) { font-size: .84rem; } .page-hero .id-row em { font-size: .72rem; } }