:root{ --iks-red:var(--wp--preset--color--iks-red); --iks-anth:var(--wp--preset--color--anthrazit); --iks-line:var(--wp--preset--color--line); --iks-sticky-top:0px; }
.admin-bar{ --iks-sticky-top:32px; }
@media(max-width:782px){ .admin-bar{ --iks-sticky-top:46px; } }

/* ===== Header durchgehend sichtbar (sticky) =====
   WICHTIG: Fixiert wird das oberste <header> – das direkte Kind von .wp-site-blocks.
   Dessen Elternelement umfasst die volle Seitenhöhe, daher greift position:sticky
   zuverlässig (auf .iks-header allein scheitert es, weil dessen Wrapper nur header-hoch
   ist). Zusammen mit body{overflow-x:clip} weiter unten. */
.wp-site-blocks > header{ position:sticky; top:var(--iks-sticky-top); z-index:1000; }
.iks-header{ border-bottom:1px solid var(--iks-line);
  background:rgba(251,251,250,.96); backdrop-filter:blur(10px); }
.iks-header-in{ width:min(1640px,94vw); margin-inline:auto; padding:12px 0;
  display:flex; align-items:center; justify-content:space-between; gap:18px; }
.iks-header-nav{ display:flex; align-items:center; gap:18px; flex-wrap:nowrap; }
.iks-header .wp-block-navigation{ gap:16px; align-items:center; font-size:.92rem; }
.iks-header .wp-block-navigation a{ text-decoration:none; color:var(--iks-anth); font-weight:500; white-space:nowrap; }
.iks-header .wp-block-navigation a:hover{ color:var(--iks-red); }
.iks-header .wp-block-navigation .current-menu-item>a,
.iks-header .wp-block-navigation [aria-current]>a{ color:var(--iks-red); }
.iks-header .wp-block-button__link{ white-space:nowrap; }
/* Mega-Menü */
.iks-header .wp-block-navigation__submenu-container{ background:var(--wp--preset--color--paper); border:1px solid var(--iks-line);
  box-shadow:0 18px 34px -20px rgba(0,0,0,.45); padding:6px 0; min-width:260px; }
.iks-header .wp-block-navigation__submenu-container a{ padding:8px 18px; font-size:.95rem; }
.iks-header .wp-block-navigation__submenu-container a:hover{ background:var(--wp--preset--color--nebel); }
/* Suche */
.iks-search .wp-block-search__inside-wrapper{ border:1px solid var(--iks-line); background:#fff; }
.iks-search .wp-block-search__input{ border:0; font-family:'IBM Plex Sans',sans-serif; font-size:.9rem;
  padding:8px 10px; min-width:150px; background:transparent; }
.iks-search .wp-block-search__button{ background:var(--iks-red); color:#fff; border:0; margin:0; }
.iks-search .wp-block-search__button svg{ fill:#fff; }

/* Responsiv */
/* Suche nur auf breiten Schirmen zeigen – sonst reicht der Platz nicht für die einzeilige Navigation */
@media(max-width:1599px){ .iks-search{ display:none; } }
@media(max-width:782px){
  .iks-header-in{ padding:10px 0; }
  .iks-header-nav{ gap:12px; }
}

/* ===== Marken-Skalenkante (volle Breite) ===== */
body{ overflow-x:clip; } /* clip statt hidden: verhindert Querscrollen durch Vollbreiten-Bänder, OHNE den Sticky-Header zu brechen */
.iks-tick{ position:relative; width:100vw; max-width:100vw; margin-left:0; margin-right:0; left:50%; transform:translateX(-50%); }
.iks-tick::before{ content:""; position:absolute; left:0; top:0; bottom:0; width:8px;
  background:repeating-linear-gradient(180deg,var(--iks-red) 0,var(--iks-red) 7px,#6f0f17 7px,#6f0f17 10px); }

/* Dunkle Sektionen: Überschriften hell */
.has-anthrazit-background-color, .has-ink-background-color{ color:var(--wp--preset--color--nebel); }
.has-anthrazit-background-color :is(h1,h2,h3,h4), .has-ink-background-color :is(h1,h2,h3,h4){ color:#fff; }

/* Bilder rahmen */
.entry-content figure.wp-block-image img,
.wp-block-post-content figure.wp-block-image img{ border:1px solid var(--iks-line); background:#fff; }

/* Hilfsklassen */
.iks-kicker{ font-family:'IBM Plex Mono',monospace; text-transform:uppercase; letter-spacing:.08em; font-size:.8rem; }
.iks-meta{ font-family:'IBM Plex Mono',monospace; font-size:.8rem; color:var(--iks-red); }
.iks-card{ transition:.2s; }
.iks-card:hover{ transform:translateY(-3px); box-shadow:0 14px 30px -18px rgba(36,52,62,.5); }

/* ===== Breite Kachel-Raster + Brotkrumen ===== */
.iks-cardgrid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:20px; max-width:min(1560px,96vw); margin-inline:auto; }
.prodgrid{ grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); }
.iks-card-tile{ display:flex; flex-direction:column; border:1px solid var(--iks-line); background:#fff;
  text-decoration:none; color:var(--iks-anth); transition:.2s; padding:0; overflow:hidden; }
.iks-card-tile:hover{ border-color:var(--iks-anth); transform:translateY(-3px); box-shadow:0 14px 30px -18px rgba(36,52,62,.5); }
.iks-card-img{ display:block; aspect-ratio:16/10; background:var(--wp--preset--color--nebel); border-bottom:1px solid var(--iks-line); }
.iks-card-img img{ width:100%; height:100%; object-fit:cover; display:block; }
.iks-card-b{ display:flex; flex-direction:column; flex:1; padding:18px 20px; }
.iks-card-tile:not(.has-img) .iks-card-b{ min-height:120px; }
.iks-card-tile:not(.has-img)::before{ content:""; display:block; height:6px;
  background:repeating-linear-gradient(90deg,var(--iks-red) 0 11px,#6f0f17 11px 15px); }
.iks-card-h{ font-size:1.05rem; font-weight:600; color:var(--iks-anth); }
.iks-card-x{ font-size:.85rem; color:var(--wp--preset--color--muted); margin-top:8px; }
.iks-card-go{ margin-top:auto; padding-top:12px; font-family:"IBM Plex Mono",monospace; font-size:.8rem; color:var(--iks-red); }
.iks-crumbs{ font-family:"IBM Plex Mono",monospace; font-size:.8rem; color:var(--wp--preset--color--muted); margin:0 0 18px; }
.iks-crumbs a{ color:var(--wp--preset--color--muted); text-decoration:none; } .iks-crumbs a:hover{ color:var(--iks-red); }
.iks-crumbs .cur{ color:var(--iks-anth); } .iks-crumbs span{ opacity:.55; margin:0 4px; }
@media(max-width:680px){ .iks-cardgrid,.prodgrid{ grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); } }
@media(max-width:430px){ .iks-cardgrid,.prodgrid{ grid-template-columns:1fr; } }

/* ===== Vollbreiten-Bänder mit zentriertem Inhalt ===== */
.iks-band{ position:relative; width:100vw; max-width:100vw; margin-left:0; margin-right:0; left:50%; transform:translateX(-50%); }
.iks-band-in{ max-width:1320px; margin:0 auto; }
.iks-video-band{ background:#0F1A20; }
.iks-video-band h2{ color:#fff; }
.iks-feat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:22px; max-width:1360px; margin:30px auto 0; }
.iks-feat{ background:#fff; border:1px solid #E1E5E8; padding:26px 24px; transition:.2s; }
.iks-feat:hover{ border-color:var(--iks-anth); transform:translateY(-3px); box-shadow:0 16px 32px -22px rgba(36,52,62,.5); }
.iks-feat-ic{ display:inline-flex; width:46px; height:46px; color:var(--iks-red); margin-bottom:12px; }
.iks-feat-ic svg{ width:46px; height:46px; }
.iks-feat h3{ margin:0 0 8px; font-size:1.1rem; color:var(--iks-anth); }
.iks-feat p{ margin:0; color:#5A6A73; font-size:.92rem; }
.iks-videowrap{ max-width:920px; margin:0 auto; }
.iks-embed{ position:relative; aspect-ratio:16/9; width:100%; }
.iks-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; }

/* ============================================================
   Modernisierung v1.3 — Bewegung, Tiefe, Technik-Textur
   (B2B-seriös, dezent, prefers-reduced-motion wird respektiert)
   ============================================================ */

/* Header bekommt beim Scrollen sanfte Tiefe */
.wp-site-blocks > header{ transition:box-shadow .25s ease; }
body.iks-scrolled .wp-site-blocks > header{ box-shadow:0 12px 30px -24px rgba(36,52,62,.7); }

/* Navigation: animierte Unterstreichung (wächst von links) */
.iks-header .wp-block-navigation a{ background-image:linear-gradient(var(--iks-red),var(--iks-red));
  background-repeat:no-repeat; background-position:left bottom; background-size:0% 2px;
  transition:background-size .28s cubic-bezier(.22,.61,.36,1), color .2s; padding-bottom:4px; }
.iks-header .wp-block-navigation a:hover{ background-size:100% 2px; }
.iks-header .wp-block-navigation .current-menu-item>a,
.iks-header .wp-block-navigation [aria-current]>a{ background-size:100% 2px; }

/* Buttons: dezenter Lift + Schatten */
.wp-block-button__link, .wp-element-button{ transition:background-color .2s, transform .2s, box-shadow .2s; }
.wp-block-button__link:hover, .wp-element-button:hover{ transform:translateY(-1px); box-shadow:0 12px 24px -14px rgba(153,20,36,.55); }

/* Karten: Bild-Zoom, Pfeil-Nudge, weicherer Hover-Schatten */
.iks-card-img{ overflow:hidden; }
.iks-card-img img{ transition:transform .55s cubic-bezier(.22,.61,.36,1); }
.iks-card-tile:hover .iks-card-img img{ transform:scale(1.06); }
.iks-card-go{ transition:transform .25s ease; }
.iks-card-tile:hover .iks-card-go{ transform:translateX(4px); }
.iks-card-tile{ transition:transform .2s ease, box-shadow .25s ease, border-color .2s ease; }
.iks-card-tile:hover{ box-shadow:0 22px 40px -26px rgba(36,52,62,.5); }
.iks-feat{ transition:transform .2s ease, box-shadow .25s ease, border-color .2s ease; }

/* Technische Textur (Blueprint-Raster) in dunklen Sektionen — sehr dezent */
.has-anthrazit-background-color, .has-ink-background-color, .iks-video-band{
  background-image:
    linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size:46px 46px; background-position:center top; }

/* Scroll-Reveal: Inhalte steigen beim Scrollen sanft ein
   WICHTIG: 'translate' (Eigenschaft) statt 'transform' verwenden – sonst würde es die
   transform:translateX(-50%)-Zentrierung der Vollbreiten-Bänder überschreiben. */
@media (prefers-reduced-motion: no-preference){
  .iks-reveal{ opacity:0; translate:0 20px;
    transition:opacity .65s cubic-bezier(.22,.61,.36,1), translate .65s cubic-bezier(.22,.61,.36,1); }
  .iks-reveal.is-in{ opacity:1; translate:0 0; }
  .iks-reveal-stagger > *{ opacity:0; translate:0 18px;
    transition:opacity .6s cubic-bezier(.22,.61,.36,1), translate .6s cubic-bezier(.22,.61,.36,1); }
  .iks-reveal-stagger.is-in > *{ opacity:1; translate:0 0; }
  .iks-reveal-stagger.is-in > *:nth-child(2){ transition-delay:.06s; }
  .iks-reveal-stagger.is-in > *:nth-child(3){ transition-delay:.12s; }
  .iks-reveal-stagger.is-in > *:nth-child(4){ transition-delay:.18s; }
  .iks-reveal-stagger.is-in > *:nth-child(5){ transition-delay:.24s; }
  .iks-reveal-stagger.is-in > *:nth-child(6){ transition-delay:.30s; }
  .iks-reveal-stagger.is-in > *:nth-child(7){ transition-delay:.36s; }
  .iks-reveal-stagger.is-in > *:nth-child(n+8){ transition-delay:.42s; }
}

/* =================================================================
   Professionelle Content-Typografie (IKS) – :where() => leicht überschreibbar,
   bricht keine bestehenden, spezifischeren Regeln (z. B. dunkle Bänder).
   ================================================================= */
:where(.wp-block-post-content, .entry-content){ font-size:1.0625rem; line-height:1.75; color:#2b3a43; }
:where(.wp-block-post-content, .entry-content) p{ margin:0 0 1.15em; }
:where(.wp-block-post-content, .entry-content) > :first-child{ margin-top:0; }

/* Überschriften: klare Hierarchie mit dezentem Marken-Akzent */
:where(.wp-block-post-content, .entry-content) h2{ font-size:1.7rem; line-height:1.2; font-weight:700; margin:2em 0 .6em; padding-left:.6em; border-left:4px solid var(--iks-red); }
:where(.wp-block-post-content, .entry-content) h3{ font-size:1.3rem; line-height:1.25; font-weight:600; margin:1.7em 0 .45em; }
:where(.wp-block-post-content, .entry-content) h4{ font-size:1.1rem; font-weight:600; margin:1.4em 0 .4em; }
:where(.wp-block-post-content, .entry-content) h2+h3{ margin-top:.8em; }

/* Lesefluss-Breite für reinen Text (Bilder/Bänder bleiben voll) */
:where(.wp-block-post-content, .entry-content) :is(p,ul,ol,h3,h4,blockquote){ max-width:70ch; }

/* Listen: sauberer Einzug, Marken-Marker, luftige Zeilen */
:where(.wp-block-post-content, .entry-content) ul{ list-style:none; padding-left:1.4em; }
:where(.wp-block-post-content, .entry-content) ul > li{ position:relative; margin:.4em 0; }
:where(.wp-block-post-content, .entry-content) ul > li::before{ content:""; position:absolute; left:-1.1em; top:.62em; width:.5em; height:.5em; border-radius:50%; background:var(--iks-red); }
:where(.wp-block-post-content, .entry-content) ol{ padding-left:1.5em; }
:where(.wp-block-post-content, .entry-content) ol > li{ margin:.4em 0; }
:where(.wp-block-post-content, .entry-content) li > ul{ margin:.3em 0; }

/* Links */
:where(.wp-block-post-content, .entry-content) a{ color:var(--iks-red); text-decoration:underline; text-underline-offset:2px; }
:where(.wp-block-post-content, .entry-content) a:hover{ text-decoration:none; }
:where(.wp-block-post-content, .entry-content) strong{ color:var(--iks-anth); }

/* Bilder: weicher Rahmen, Rundung, Tiefe, Luft – professionell eingebunden */
:where(.wp-block-post-content, .entry-content) figure.wp-block-image{ margin:1.8em 0; }
:where(.wp-block-post-content, .entry-content) figure.wp-block-image img{ border-radius:10px; box-shadow:0 18px 40px -26px rgba(36,52,62,.55); height:auto; }
:where(.wp-block-post-content, .entry-content) figure.wp-block-image figcaption{ margin-top:.6em; font-size:.85rem; color:var(--wp--preset--color--muted); text-align:center; }

/* Zitate */
:where(.wp-block-post-content, .entry-content) blockquote{ margin:1.6em 0; padding:.4em 0 .4em 1.2em; border-left:4px solid var(--iks-red); color:#3c4a52; font-style:italic; }
:where(.wp-block-post-content, .entry-content) blockquote p:last-child{ margin-bottom:0; }

/* Tabellen */
:where(.wp-block-post-content, .entry-content) table{ width:100%; border-collapse:collapse; margin:1.6em 0; font-size:.95rem; }
:where(.wp-block-post-content, .entry-content) th, :where(.wp-block-post-content, .entry-content) td{ border:1px solid var(--iks-line); padding:10px 14px; text-align:left; vertical-align:top; }
:where(.wp-block-post-content, .entry-content) thead th{ background:var(--iks-anth); color:#fff; font-weight:600; }
:where(.wp-block-post-content, .entry-content) tbody tr:nth-child(even){ background:#F6F8F9; }

/* Trenner */
:where(.wp-block-post-content, .entry-content) hr{ border:0; border-top:1px solid var(--iks-line); margin:2.2em 0; }

/* =================================================================
   Professioneller Feinschliff (IKS 1.3.3) – kohärentes, modernes
   Erscheinungsbild über alle Seitentypen. Bewusst dezent & markentreu.
   ================================================================= */

/* Karten-Familie vereinheitlichen: weicher Rahmen, dezente Rundung, ruhige Tiefe */
.prod, .iks-card-tile, .iks-cc-item, .iks-feat, .iks-price, .iks-news, .iks-gate, .iks-brandseo{
  border-color:#E4E8EB; border-radius:10px;
}
.prod, .iks-card-tile, .iks-cc-item, .iks-feat{ box-shadow:0 1px 2px rgba(36,52,62,.05); }
.prod:hover, .iks-card-tile:hover, .iks-cc-item:hover, .iks-feat:hover{
  border-color:#CBD2D7; transform:translateY(-4px);
  box-shadow:0 22px 44px -28px rgba(36,52,62,.55), 0 4px 10px -7px rgba(36,52,62,.22);
}
.iks-card-tile{ overflow:hidden; }
.iks-card-img{ border-bottom-color:#E4E8EB; }
.iks-feat{ padding:28px 26px; }
.prod{ padding:24px 22px; }

/* CTA-Pfeil klarer und „lebendig" beim Hover */
.prod .arrow, .iks-card-go, .iks-cc-item .iks-cc-name{ display:inline-flex; align-items:center; gap:.4em; }
.prod .arrow{ font-weight:500; transition:gap .18s; }
.prod:hover .arrow{ gap:.75em; }

/* Filter-Chips als moderne Pillen */
.iks-chip{ border-radius:999px; padding:8px 16px; }
.iks-filterbar{ gap:10px; }

/* Einheitliches Button-System */
.iks-dl-btn, .iks-submit, .iks-cart-btn, .wp-block-button__link{ border-radius:8px; transition:.18s; }
.iks-dl-btn:hover{ box-shadow:0 8px 18px -10px rgba(153,20,36,.6); }
.iks-submit:hover, .iks-cart-btn:hover{ transform:translateY(-1px); box-shadow:0 10px 22px -10px rgba(153,20,36,.5); }

/* Downloads-/Listenzeilen ruhiger, mit dezentem Hover */
.iks-dl-list li{ padding:16px 6px; border-radius:8px; }
.iks-dl-list li:hover{ background:var(--wp--preset--color--paper); }

/* Marken-Pillen (Hersteller) abrunden */
.iks-brand{ border-radius:999px; border-color:#E4E8EB; }

/* Dunkles Seiten-Header-Band: mehr Luft + feine technische Textur */
.wp-block-cover.has-anthrazit-background-color,
.wp-block-cover.has-ink-background-color{
  background-image:repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0 1px, transparent 1px 72px);
}
.wp-block-cover.has-anthrazit-background-color .wp-block-cover__inner-container,
.wp-block-cover.has-ink-background-color .wp-block-cover__inner-container{ padding-block:10px; }

/* Breadcrumb dezent absetzen */
.iks-crumbs{ padding-bottom:14px; border-bottom:1px solid var(--iks-line); }

/* Durchgängige Fokus-Sichtbarkeit (Barrierefreiheit + Wertigkeit) */
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--iks-red); outline-offset:2px;
}

/* =================================================================
   Footer-Feinschliff (IKS 1.3.4) — schließt den durchgängigen
   modern-professionellen Stil über das gesamte Seiten-Chrome.
   ================================================================= */
.wp-site-blocks footer.wp-block-group.has-anthrazit-background-color{ border-top:3px solid var(--iks-red); }
footer.has-anthrazit-background-color a{ color:#D7DDE1; text-decoration:none; transition:color .18s ease; }
footer.has-anthrazit-background-color a:hover{ color:#fff; text-decoration:underline; text-underline-offset:3px; }
footer.has-anthrazit-background-color .iks-kicker{ color:#fff; opacity:.9; margin:0 0 12px; letter-spacing:.1em; }
footer.has-anthrazit-background-color .wp-block-site-title a{ color:#fff; font-weight:600; }
footer.has-anthrazit-background-color :is(p,li){ color:#C4CCD1; }
footer.has-anthrazit-background-color .wp-block-column{ line-height:1.85; }
/* Copyright-Zeile (direktes Footer-Kind) dezent absetzen */
footer.has-anthrazit-background-color > p.has-steel-color{ margin-top:34px; padding-top:18px; border-top:1px solid rgba(255,255,255,.13); font-size:.82rem; color:#8F9BA3 !important; }
footer.has-anthrazit-background-color > p.has-steel-color a{ color:#AAB4BB; }
@media(max-width:782px){ footer.wp-block-group .wp-block-columns{ gap:28px; } }
