/*
Theme Name: Thomas Krause
Theme URI: https://transportzeichnung.de
Author: Film-labor
Author URI: https://film-labor.de
Description: Block-Theme (Full Site Editing) für das Ingenieurbüro Thomas Krause — Spezial- und Schwertransporte, Berlin. Navy/Orange, Yantramanav. Statische Vorlage 1:1 nachgebaut.
Version: 2.8.3
Requires at least: 6.5
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: thomas-krause
*/

/* ===========================================================
   Thomas Krause — Design-Skin
   Tokens (Farben, Schrift, Spacing) liegen in theme.json.
   Diese Datei ist die visuelle Haut: alles, was Gutenberg-Blöcke
   nicht von selbst abbilden. Block-Markup trägt die Klassen.
   =========================================================== */

:root{
  --navy:        #001659;
  --navy-deep:   #000a30;
  --navy-mid:    #00235a;
  --navy-light:  #122455;
  --orange:      #C8860D;
  --orange-light:#E6A52E;
  --ink:         #212121;
  --mid:         #565969;
  --line:        #e8e8e9;
  --paper:       #ffffff;
  --light:       #f4f4f4;
  --blue:        #1863dc;
  --blue-soft:   #405b92;
  --accent:      #C8860D;
  --ink-soft:    #565969;
  --muted:       #565969;
  --shadow-sm:   0 2px 6px rgba(0,22,89,.06);
  --shadow-md:   0 8px 24px rgba(0,22,89,.10);
  --shadow-lg:   0 24px 56px rgba(0,22,89,.16);
  --ease:        cubic-bezier(0.16,1,0.3,1);
}

html{scroll-behavior:smooth}
body{
  font-family:'Outfit','Helvetica Neue',Helvetica,Arial,sans-serif;
  font-weight:400;font-size:16px;line-height:1.7;
  color:var(--ink);background:#fff;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none;transition:color .25s var(--ease)}

h1,h2,h3,h4,h5{
  font-family:'Outfit',sans-serif;
  font-weight:700;color:var(--navy);
  line-height:1.2;letter-spacing:-0.01em;
}

/* Block-Theme: Sektionen sind <section>-Gruppen, Inhalt zentriert in .wrap */
section.wp-block-group{padding:56px 36px}
/* Sektionen direkt aneinander — kein doppelter Zwischenraum */
.entry-content > .wp-block-group,
.entry-content > .tk-carousel-wrap{margin-top:0 !important;margin-bottom:0 !important}
.wrap{max-width:1320px;margin-left:auto;margin-right:auto;width:100%}

/* ============== KICKER / PRE-HEADINGS ============== */
.kicker,.pre-h1,.pre-h2{
  font-family:'Outfit',sans-serif;
  font-size:13px;letter-spacing:0.28em;text-transform:uppercase;
  color:var(--orange);font-weight:700;margin:0 0 14px;display:block;
}
.section-head{text-align:center;max-width:760px;margin:0 auto 64px}
.section-head .kicker::before{content:"— "}
.section-head .kicker::after{content:" —"}
.section-head h2{font-size:clamp(30px,3.4vw,46px);margin:0;letter-spacing:-0.015em}

/* ============== BUTTONS ============== */
.wp-block-button.btn-orange .wp-block-button__link,
a.btn-orange{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Outfit',sans-serif;
  font-size:13px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;
  background:var(--orange);color:#fff;
  padding:14px 26px;border-radius:0;border:none;
  box-shadow:var(--shadow-sm);
  transition:background .25s var(--ease),box-shadow .25s var(--ease),transform .25s var(--ease);
}
.wp-block-button.btn-orange .wp-block-button__link::after,
a.btn-orange::after{content:"→";font-weight:400;transition:transform .25s var(--ease)}
.wp-block-button.btn-orange .wp-block-button__link:hover,
a.btn-orange:hover{background:var(--orange-light);box-shadow:var(--shadow-md);transform:translateY(-1px);color:#fff}
.wp-block-button.btn-orange .wp-block-button__link:hover::after,
a.btn-orange:hover::after{transform:translateX(4px)}

.wp-block-button.btn-navy .wp-block-button__link{
  background:var(--navy);color:#fff;
}
.wp-block-button.btn-navy .wp-block-button__link:hover{background:var(--navy-mid);color:#fff}

/* btn-text: oranger Schriftzug ohne Hintergrund (Link-Optik) */
.wp-block-button.btn-text .wp-block-button__link,
a.btn-text{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Outfit',sans-serif;
  font-size:13px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;
  background:transparent;color:var(--orange);
  padding:6px 0;border-radius:0;border:none;box-shadow:none !important;
  filter:none !important;
  transition:color .25s var(--ease),transform .25s var(--ease);
}
.wp-block-button.btn-text .wp-block-button__link::after,
a.btn-text::after{content:"→";font-weight:400;transition:transform .25s var(--ease)}
.wp-block-button.btn-text.no-arrow .wp-block-button__link::after,
a.btn-text.no-arrow::after{content:none}
.wp-block-button.btn-text .wp-block-button__link:hover,
a.btn-text:hover{background:transparent;color:var(--orange-light);box-shadow:none !important;
  filter:none !important;transform:none}
.wp-block-button.btn-text .wp-block-button__link:hover::after,
a.btn-text:hover::after{transform:translateX(4px)}

.wp-block-button.btn-outline .wp-block-button__link,
a.btn-outline{
  display:inline-flex;align-items:center;gap:10px;
  font-family:'Outfit',sans-serif;
  font-size:13px;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;
  background:transparent;color:#fff;
  padding:13px 26px;border-radius:0;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.65);
  transition:box-shadow .25s var(--ease),background .25s var(--ease);
}
.wp-block-button.btn-outline .wp-block-button__link::after,
a.btn-outline::after{content:"→"}
.wp-block-button.btn-outline .wp-block-button__link:hover,
a.btn-outline:hover{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 2px #fff;color:#fff}

/* ============== HEADER (fest oben, ohne Trennlinie) ============== */
header.top,header.wp-block-template-part{
  background:#fff;
  position:fixed;top:0;left:0;right:0;z-index:100;
}
/* Pfeil-Suffix bei orangen Buttons im Header ausblenden */
.tk-header-inner .btn-orange .wp-block-button__link::after,
.tk-header-inner a.btn-orange::after{display:none}
/* Bei eingeloggtem WP-Admin Bar nach unten verschieben */
.admin-bar header.top,.admin-bar header.wp-block-template-part{top:32px}
@media (max-width:782px){
  .admin-bar header.top,.admin-bar header.wp-block-template-part{top:46px}
}
/* Inhalt unter dem fixed Header anschieben — Header-Hoehe ~90px */
.wp-site-blocks{padding-top:0 !important;margin-top:0 !important}
.wp-site-blocks > main{padding-top:90px;margin-top:0}
.admin-bar .wp-site-blocks > main{padding-top:122px}
/* Startseite: Hero spannt sich UEBER den Header (nahtlos), Header
   sitzt obendruff. Andere Seiten behalten das Padding. */
.home .wp-site-blocks > main{padding-top:0 !important}
.tk-header-inner{
  max-width:1320px;margin:0 auto;
  padding:18px 36px;gap:34px;
  align-items:flex-end;
}
.tk-brand{display:flex;flex-direction:row;align-items:center;gap:14px;line-height:1}
.tk-logo img{display:block;height:54px;width:auto}
.tk-brand-name{
  font-family:'Outfit',sans-serif;
  font-weight:900;letter-spacing:-0.01em;font-size:24px;
  color:var(--navy);text-transform:uppercase;margin:0;line-height:1;
}
.tk-brand-name a{color:var(--navy)}
.tk-brand-sub{
  font-weight:400;font-size:11px;letter-spacing:0.18em;
  color:var(--orange);text-transform:uppercase;margin:0;line-height:1;
}
.tk-nav{
  font-size:14px;font-weight:500;text-transform:uppercase;letter-spacing:0.06em;
}
.tk-nav .wp-block-navigation-item__content{color:var(--navy);padding:10px 2px}
.tk-nav .wp-block-navigation-item__content:hover{color:var(--orange)}
.tk-nav .wp-block-navigation__submenu-container{
  box-shadow:var(--shadow-lg);border-top:3px solid var(--orange);
  padding:8px 0;min-width:300px;
}
.tk-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content{
  text-transform:uppercase;letter-spacing:0.06em;font-weight:500;color:var(--navy);
  padding:12px 24px;font-size:13px;
}
.tk-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover{
  background:var(--light);color:var(--navy);
}

/* ============== HERO (Vollbild-Bild) ============== */
.tk-hero{
  position:relative;
  aspect-ratio: 16/9; min-height: 38rem; max-height: 100vh;
  display:flex;align-items:center;
  background:var(--navy-deep);
  overflow:hidden;padding:0 !important;
  margin-top:0 !important;
}
.admin-bar .tk-hero{min-height:calc(100vh - 32px)}
@media (max-width:782px){
  .admin-bar .tk-hero{min-height:calc(100vh - 46px)}
}
/* Hero-Inhalt unter den Header verschieben damit nichts verdeckt ist */
.tk-hero-content{padding-top:130px !important}
.tk-hero-bg{
  position:absolute;inset:0;margin:0;z-index:0;
}
.tk-hero-bg img{
  width:100%;height:100%;object-fit:cover;object-position:center 50%;
}
.tk-hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(0,10,48,.90) 0%,rgba(0,10,48,.68) 40%,rgba(0,10,48,.20) 100%);
}
.tk-hero-content{
  position:relative;z-index:2;width:100%;
  padding:72px 36px;
}
.tk-hero h1{
  color:#fff;font-weight:700;
  font-size:clamp(42px,5.6vw,78px);
  line-height:1.02;letter-spacing:-0.02em;
  margin:0 0 24px;text-transform:uppercase;
}
.tk-hero h1 .accent,.tk-hero h1 mark{
  color:var(--orange-light);display:block;background:transparent;
}
.tk-hero .hero-subline{
  font-size:clamp(14px,1.3vw,17px);font-weight:500;
  color:var(--orange-light);text-transform:uppercase;letter-spacing:0.08em;
  line-height:1.55;margin:0 0 22px;max-width:56ch;
}
.tk-hero .lede{
  font-size:18.5px;line-height:1.6;max-width:50ch;
  color:rgba(255,255,255,.85);margin:0 0 34px;font-weight:300;
}

/* ============== INTRO 2-COL ============== */
.intro-block{gap:80px;align-items:center}
.intro-block .text-col p{font-size:17px;line-height:1.8;color:var(--mid);margin:0 0 18px}
.intro-block h2{font-size:clamp(28px,3.2vw,42px);margin:0 0 28px;color:var(--navy)}
.city-list{
  display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:24px;
  font-size:14px;color:var(--navy);font-weight:500;
}
.city-list .wp-block-navigation-item,
.city-list span{padding:6px 14px;background:var(--light);border-left:2px solid var(--orange)}
.intro-images{gap:8px}
.intro-images figure{margin:0;overflow:hidden;background:var(--light)}
.intro-images figure img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.intro-images figure:hover img{transform:scale(1.03)}

/* ============== SERVICES (Foto-Karten) ============== */
.services{background:var(--light)}
.svc-grid{gap:18px}
.svc{
  background:#fff;padding:0;overflow:hidden;
  display:flex;flex-direction:column;height:100%;
  box-shadow:var(--shadow-sm);
  transition:box-shadow .3s var(--ease),transform .3s var(--ease);
}
.svc:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
.svc .svc-photo{margin:0}
.svc .svc-photo img{
  display:block;width:100%;aspect-ratio:4/3;object-fit:cover;
  transition:transform .6s var(--ease);
}
.svc:hover .svc-photo img{transform:scale(1.04)}
.svc .svc-body{padding:24px 26px 26px;display:flex;flex-direction:column;flex:1}
.svc h3{
  font-size:18px;font-weight:600;color:var(--navy);
  margin:0 0 8px;letter-spacing:-0.01em;line-height:1.25;
  transition:color .3s var(--ease);
}
.svc:hover h3{color:var(--orange)}
.svc h3 .em{display:block;font-size:14px;font-weight:500;color:var(--mid);letter-spacing:0;text-transform:none;margin-top:3px}
.svc p{margin:0 0 18px;color:var(--mid);font-size:14.5px;line-height:1.6}
.svc .svc-body .svc-link{margin-top:auto}
.svc .svc-link{
  font-size:11.5px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--orange);display:inline-flex;align-items:center;gap:6px;
}
.svc .svc-link::after{content:"→";transition:transform .25s var(--ease)}
.svc:hover .svc-link::after{transform:translateX(5px)}

/* ============== DARK CTA ============== */
.dark-cta{
  background:var(--navy);color:#fff;text-align:center;
  padding:96px 36px;position:relative;
}
.dark-cta::before{
  content:"";position:absolute;inset:0;
  background-image:url('assets/images/container-pattern.svg');
  background-size:600px 400px;background-repeat:repeat;opacity:0;
}
.dark-cta::after{
  content:"";position:absolute;inset:0;
  background:transparent;
  pointer-events:none;
}
.dark-cta > *{position:relative;z-index:2}
.dark-cta .dark-cta-inner{max-width:780px;margin:0 auto}
.dark-cta .pre-h1{color:var(--orange-light);margin-bottom:18px}
.dark-cta h1,.dark-cta h2{
  color:#fff;font-size:clamp(32px,4vw,52px);font-weight:700;
  margin:0 0 26px;letter-spacing:-0.015em;
}
.dark-cta p{
  font-size:18px;line-height:1.7;color:rgba(255,255,255,.85);
  max-width:60ch;margin:0 auto 34px;font-weight:300;
}
.dark-cta .wp-block-buttons{justify-content:center}

/* ============== REFERENZEN / BEITRÄGE ============== */
.ref-grid{gap:28px}
.ref-card{
  position:relative;
  background:#fff;box-shadow:var(--shadow-sm);overflow:hidden;
  transition:box-shadow .35s var(--ease),transform .35s var(--ease);
}
.ref-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}
/* Ganze Karte klickbar — Titel-Link spannt sich ueber die Card. */
.ref-card .ref-body h4 a::after{
  content:"";position:absolute;inset:0;z-index:1;
}
.ref-card .ref-body h4 a:hover{color:var(--orange)}
.ref-card .ref-img,.ref-card .wp-block-post-featured-image{
  aspect-ratio:4/3;overflow:hidden;background:var(--light);margin:0;
  display:flex;align-items:center;justify-content:center;
}
.ref-card .ref-img img,.ref-card .wp-block-post-featured-image img{
  width:100%;height:100%;object-fit:contain;
  transition:transform .8s var(--ease);
}
.ref-card:hover .ref-img img,.ref-card:hover .wp-block-post-featured-image img{transform:scale(1.05)}
.ref-card .ref-body{padding:6px 28px 22px}
.ref-card .cat,.ref-card .wp-block-post-terms{
  font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--orange);font-weight:700;
}
.ref-card h4,.ref-card .wp-block-post-title{
  font-size:18px;font-weight:700;color:var(--navy);
  margin:8px 0;line-height:1.3;letter-spacing:-0.005em;
}
.ref-card h4 a,.ref-card .wp-block-post-title a{color:var(--navy)}
.ref-card p,.ref-card .wp-block-post-excerpt{margin:0;font-size:14.5px;color:var(--mid);line-height:1.6}

/* ============== WORLD MAP ============== */
.worldmap{
  background:var(--navy);color:#fff;
  padding:104px 36px 96px;position:relative;overflow:hidden;
}
.worldmap > *{position:relative;z-index:2}
.worldmap .pre-h1{color:var(--orange-light);text-align:center}
.worldmap h1,.worldmap h2{
  color:#fff;font-size:clamp(36px,4.2vw,56px);font-weight:700;
  text-align:center;margin:0 0 22px;letter-spacing:-0.02em;
}
.worldmap .claim{
  text-align:center;font-size:20px;font-weight:300;
  color:rgba(255,255,255,.85);max-width:60ch;margin:0 auto 56px;
}
.worldmap-figure{
  position:relative;width:100%;max-width:950px;margin:0 auto;
  background:rgba(0,10,48,.55);
  border:1px solid rgba(255,94,20,.15);
  aspect-ratio:950/620;overflow:hidden;
}
.worldmap-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:contain;
  filter:invert(1) brightness(1.6) sepia(0.4) hue-rotate(170deg) saturate(0.5) opacity(0.32);
  pointer-events:none;
}
.worldmap-overlay{position:absolute;inset:0;width:100%;height:100%;display:block}
.worldmap-legend{
  display:flex;justify-content:center;gap:48px;flex-wrap:wrap;margin-top:36px;
  font-size:11.5px;letter-spacing:0.16em;text-transform:uppercase;
  color:rgba(255,255,255,.7);font-weight:500;
}
.worldmap-legend .swatch{
  display:inline-block;width:10px;height:10px;border-radius:10px;margin-right:10px;vertical-align:middle;
}
.worldmap-legend .swatch.primary{background:var(--orange-light);box-shadow:0 0 0 4px rgba(255,94,20,.25)}
.worldmap-legend .swatch.secondary{background:#7da5e8;box-shadow:0 0 0 3px rgba(125,165,232,.2)}
.worldmap-legend .swatch.tertiary{background:rgba(255,255,255,.4);box-shadow:0 0 0 3px rgba(255,255,255,.12)}

/* ============== PAGE HEAD (Unterseiten-Kopf) ============== */
.page-head{
  position:relative;background:var(--navy-deep);color:#fff;
  padding:120px 36px 80px;overflow:hidden;
}
.page-head .page-head-bg{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0;
}
.page-head .page-head-bg img{width:100%;height:100%;object-fit:cover}
.page-head::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(0,10,48,.5) 0%,rgba(0,10,48,.85) 100%);
}
.page-head > *{position:relative;z-index:2}
.page-head .crumb{
  font-size:11.5px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--orange-light);margin:0 0 22px;font-weight:500;
}
.page-head .crumb a{color:rgba(255,255,255,.65)}
.page-head .crumb a:hover{color:#fff}
.page-head h1,.page-head .wp-block-post-title{
  font-size:clamp(34px,4.5vw,60px);font-weight:700;
  letter-spacing:-0.02em;line-height:1.05;margin:0;color:#fff;
  text-transform:uppercase;max-width:22ch;
}

/* ============== SINGLE / LEAD — Einzelbeitrag, Projekt, Leistung ============== */
/* section.* — schlägt die generische section.wp-block-group-Polsterung (104px) */
section.single-lead{padding:14px 36px 0 !important}
.single-hero{margin:0 !important;padding:0 !important;background:#fff;
  display:flex;align-items:center;justify-content:center;
}
.single-hero img{
  max-width:100%;max-height:480px;width:auto !important;height:auto !important;
  display:block;margin:0 auto;object-fit:contain !important;aspect-ratio:auto !important;
}
/* Hero + Frage-Spalte nebeneinander, Leerraum nach unten weg */
.hero-row{max-width:1080px !important;
  display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:36px;
  align-items:center;padding:0 36px;max-width:1280px;margin:0 auto 0;
}
.hero-aside{padding:6px 0;color:var(--ink)}
.hero-aside h3{
  font-size:clamp(20px,1.6vw,28px);margin:0 0 12px;
  letter-spacing:-0.01em;color:var(--navy);font-weight:700;line-height:1.2;
}
.hero-aside p{font-size:14.5px;color:var(--mid);margin:6px 0;line-height:1.55}
.hero-aside a{color:var(--orange);font-weight:600}
.hero-aside a:hover{color:var(--orange-light)}
@media (max-width:860px){
  .hero-row{max-width:1080px !important;grid-template-columns:1fr;padding:0 24px}
}
section.single-lead .kicker{margin:0 0 6px}
section.single-lead h1,section.single-lead .wp-block-post-title{
  font-size:clamp(26px,3.2vw,44px);font-weight:700;letter-spacing:-0.02em;
  line-height:1.15;color:var(--navy);margin:0;max-width:30ch;
}
section.single-body{padding:10px 36px 84px !important}
/* Inhalt direkt nach dem Lead enger heranziehen */
section.single-lead + section.wp-block-group{padding-top:14px !important}

/* Projekt-Beitrag — Schablone: abwechselnd Bild / Text */
.proj-row{margin:0 0 18px !important;align-items:stretch}
.proj-row .wp-block-image{margin:0}
.proj-row h3{margin:0 0 10px;font-size:21px;color:var(--navy);font-weight:600;letter-spacing:-0.01em}
.proj-row p{margin:0;color:var(--mid);line-height:1.7;font-size:15.5px}
/* Bild + Text als gleich grosse Kacheln nebeneinander, klare Trennung */
@media (min-width:782px){
  /* prose breiter fuer Beitragsinhalt — sichtbarer Inhalt ~70vw */
  .single-body .prose{max-width:min(1100px, 70vw) !important}
  /* proj-row: 50/50 mit deutlichem Gap; keine Transform-Tricks */
  .proj-row.wp-block-columns{
    max-width:100% !important;width:100% !important;
    margin-left:auto !important;margin-right:auto !important;
    transform:none !important;gap:48px !important;
    align-items:stretch !important;
  }
  .proj-row .wp-block-column{
    flex-basis:calc(50% - 24px) !important;flex-grow:0 !important;
    align-self:stretch !important;
    display:flex !important;flex-direction:column !important;justify-content:center !important;
  }
  /* Bild im natuerlichen 4:3-Querformat */
  .proj-row .wp-block-image{align-self:center}
  .proj-row .wp-block-image img{
    aspect-ratio:4/3 !important;width:100% !important;height:auto !important;
    object-fit:cover !important;display:block !important;
  }
  /* ungerade Reihen: Bild LINKS, Text RECHTS */
  .proj-row:nth-of-type(odd) .wp-block-column:has(.wp-block-image){order:1}
  .proj-row:nth-of-type(odd) .wp-block-column:not(:has(.wp-block-image)){order:2}
  /* gerade Reihen: Text LINKS, Bild RECHTS */
  .proj-row:nth-of-type(even) .wp-block-column:has(.wp-block-image){order:2}
  .proj-row:nth-of-type(even) .wp-block-column:not(:has(.wp-block-image)){order:1}
}

/* ============== DETAIL BODY (Leistungs-Seiten) ============== */
.detail-body{gap:56px}
.detail-body .lead{font-size:17.5px;line-height:1.75;color:var(--mid);margin:0 0 20px}
.detail-body .lead.is-first{
  font-size:21px;color:var(--ink);font-weight:500;
  letter-spacing:-0.005em;line-height:1.5;
}
ul.checks{
  list-style:none;padding:0;margin:0;
  display:grid;grid-template-columns:1fr 1fr;gap:14px 36px;
}
ul.checks li{
  font-size:15.5px;line-height:1.5;color:var(--ink);
  padding-left:30px;position:relative;
}
ul.checks li::before{
  content:"";position:absolute;left:0;top:6px;
  width:14px;height:9px;
  border-left:1.8px solid var(--orange);border-bottom:1.8px solid var(--orange);
  transform:rotate(-45deg);
}
.related{margin-top:88px;padding-top:64px;border-top:1px solid var(--line)}
.related-grid{gap:24px;margin-top:36px}
.related-card{
  display:block;background:#fff;padding:28px 28px 32px;
  border-bottom:3px solid var(--navy);box-shadow:var(--shadow-sm);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);
}
.related-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);border-bottom-color:var(--orange)}
.related-card .num{font-size:11px;letter-spacing:0.2em;color:var(--orange);text-transform:uppercase;font-weight:700}
.related-card h4{margin:8px 0 6px;font-size:18px;font-weight:700;color:var(--navy);letter-spacing:-0.005em}
.related-card p{margin:0;font-size:14.5px;color:var(--mid);line-height:1.55}

/* ============== TIMELINE (Über mich) ============== */
.timeline{margin-top:48px;position:relative}
.timeline::before{content:"";position:absolute;left:140px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl-row{
  display:grid;grid-template-columns:140px 1fr;gap:48px;
  padding:32px 0;align-items:start;position:relative;
}
.tl-year{font-size:14px;letter-spacing:0.08em;color:var(--orange);font-weight:700;padding-top:4px}
.tl-row::before{
  content:"";position:absolute;left:135px;top:42px;
  width:12px;height:12px;background:var(--orange);transform:rotate(45deg);
}
.tl-row h4{font-size:20px;font-weight:700;color:var(--navy);margin:0 0 8px;letter-spacing:-0.005em}
.tl-row p{margin:0;color:var(--mid);font-size:16px;line-height:1.7}

/* ============== PORTRAIT (Über mich) ============== */
.portrait-block{gap:80px;align-items:start}
.portrait-frame{
  position:relative;background:var(--light);overflow:hidden;
  aspect-ratio:4/5;box-shadow:var(--shadow-md);margin:0;
}
.portrait-frame img{width:100%;height:100%;object-fit:cover}
.portrait-cred{
  margin-top:14px;font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  color:var(--mid);font-weight:500;
}
.portrait-text h2{font-size:clamp(28px,3vw,40px);margin:0 0 28px;letter-spacing:-0.015em}
.portrait-text p{font-size:17px;line-height:1.75;color:var(--mid);margin:0 0 18px}
.signature{
  margin-top:32px;padding-top:20px;border-top:2px solid var(--orange);
  font-size:14px;color:var(--mid);
}
.signature strong,.signature b{color:var(--navy);font-weight:700;display:block;margin-bottom:2px;font-size:18px}

/* ============== TWO-COL (Werte / Auftraggeber) ============== */
.two-col{gap:88px;align-items:start}
.two-col p{font-size:17px;line-height:1.75;color:var(--mid);margin:0 0 18px}
.two-col h2{margin:0 0 28px}

/* ============== KONTAKT ============== */
.contact{background:var(--navy);color:#fff;padding:104px 36px}
.contact .pre-h1{color:var(--orange-light)}
.contact h1,.contact h2{
  color:#fff;font-size:clamp(30px,3.4vw,44px);font-weight:700;
  margin:0 0 26px;letter-spacing:-0.015em;
}
.contact-grid{gap:80px}
.contact .lede{font-size:18px;color:rgba(255,255,255,.85);max-width:48ch;margin:8px 0 0;line-height:1.6;font-weight:300}
.contact .stamp{
  margin-top:36px;padding-top:24px;border-top:2px solid var(--orange);
  font-size:13.5px;color:rgba(255,255,255,.7);line-height:1.7;
}
.contact dl{margin:0;display:grid;grid-template-columns:140px 1fr;row-gap:18px;column-gap:24px}
.contact dt{
  color:var(--orange-light);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;
  padding-top:7px;font-weight:700;
}
.contact dd{margin:0;font-size:18px;color:#fff;font-weight:500}
.contact dd a{color:#fff}
.contact dd a:hover{color:var(--orange-light)}

/* ============== PROSE (Impressum / Datenschutz) ============== */
.prose{max-width:780px;margin-left:auto;margin-right:auto}
.prose p,.prose li{font-size:15.5px;line-height:1.75;color:var(--ink)}
.prose h2{font-size:24px;color:var(--navy);font-weight:700;margin:48px 0 14px;letter-spacing:-0.005em}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:18px;color:var(--navy);margin:28px 0 8px;font-weight:700}
.prose ul{padding-left:18px}

/* ============== FOOTER ============== */
footer.site,footer.wp-block-template-part{
  background:var(--navy-deep);color:rgba(255,255,255,.7);
  padding:72px 36px 32px;
}
.tk-footer-inner{max-width:1320px;margin:0 auto;gap:48px}
.tk-footer-inner h5,.tk-footer-inner .wp-block-heading{
  font-size:11px;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--orange-light);margin:0 0 18px;font-weight:700;
}
.brand-foot{
  font-family:'Outfit',sans-serif;
  font-size:22px;font-weight:900;color:#fff;letter-spacing:-0.005em;
  margin:0 0 8px;text-transform:uppercase;
}
.footer-desc{font-size:14px;line-height:1.7;color:rgba(255,255,255,.65);max-width:38ch;margin:0}
.tk-footer-inner ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.tk-footer-inner li,.tk-footer-inner a{font-size:14px;color:rgba(255,255,255,.7)}
.tk-footer-inner a:hover{color:var(--orange-light)}
.footer-legal{
  border-top:1px solid rgba(255,255,255,.08);
  padding-top:24px;margin-top:32px;
  font-size:12px;letter-spacing:0.04em;color:rgba(255,255,255,.5);
}
.footer-legal a{font-size:12px;color:rgba(255,255,255,.5)}
.footer-legal a:hover{color:var(--orange-light)}

.detail-body .lead.is-intro{
  margin-top:36px;font-weight:500;letter-spacing:-0.01em;color:var(--ink);
}
.prose .prose-note,.prose-note{
  color:var(--muted);font-size:13.5px;margin-top:48px;
}

/* ============== KONTAKTFORMULAR ============== */
.tk-form{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:8px}
.tk-form .full{grid-column:1/-1}
.tk-form label{
  display:flex;flex-direction:column;gap:8px;
  font-family:'Outfit',sans-serif;font-size:11px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--mid);font-weight:700;
}
.tk-form input,.tk-form select,.tk-form textarea{
  font-family:'Outfit',sans-serif;font-size:15.5px;font-weight:400;
  padding:14px 16px;background:#fff;color:var(--ink);
  box-shadow:inset 0 0 0 1px var(--line);
  border:none;outline:none;border-radius:0;
  transition:box-shadow .25s var(--ease);
}
.tk-form input:focus,.tk-form select:focus,.tk-form textarea:focus{
  box-shadow:inset 0 0 0 2px var(--orange);
}
.tk-form textarea{min-height:140px;resize:vertical;line-height:1.55}
.tk-form button{
  justify-self:start;margin-top:8px;
  font-family:'Outfit',sans-serif;font-size:13px;font-weight:700;
  letter-spacing:0.12em;text-transform:uppercase;
  background:var(--orange);color:#fff;
  padding:16px 30px;border:none;cursor:pointer;border-radius:0;
  box-shadow:var(--shadow-sm);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease);
}
.tk-form button:hover{transform:translateY(-1px);box-shadow:var(--shadow-md);background:var(--orange-light)}
.tk-form button:active{transform:translateY(0)}
.tk-form .check{
  display:flex;align-items:flex-start;gap:10px;font-size:13.5px;color:var(--mid);
  text-transform:none;letter-spacing:0;font-weight:400;line-height:1.55;
}
.tk-form .check input{margin-top:3px;flex-shrink:0;width:auto;padding:0;box-shadow:none}
.tk-form .check a{color:var(--orange);text-decoration:underline}

/* ============== RESPONSIVE ============== */
@media (max-width:1080px){
  .tk-hero-content{padding-top:78px;padding-bottom:78px}
}
@media (max-width:880px){
  section.wp-block-group,.dark-cta,.contact,.worldmap{padding-left:22px;padding-right:22px}
  section.wp-block-group{padding-top:44px;padding-bottom:44px}
  .tk-hero{min-height:clamp(440px,72vh,620px)}
  .tk-hero-content{padding:64px 22px}
  .tk-hero::after{background:linear-gradient(180deg,rgba(0,10,48,.62) 0%,rgba(0,10,48,.86) 100%)}
  .tk-header-inner{padding:14px 22px}
  ul.checks{grid-template-columns:1fr}
  .tk-form{grid-template-columns:1fr}
  .timeline::before{left:0}
  .tl-row{grid-template-columns:1fr;gap:8px;padding:20px 0 20px 24px}
  .tl-row::before{left:-6px;top:24px}
  .portrait-frame{max-width:420px}
  .page-head{padding:96px 22px 56px}
}

/* ============== TEAM (Das sind wir) ============== */
.team-section{background:#fff}
.team-grid{gap:24px}
.team-card{background:var(--light);overflow:hidden;display:flex;flex-direction:column}
.team-card .team-photo{margin:0}
.team-card .team-photo img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.team-body{padding:24px 28px 28px}
.team-body h3{font-size:20px;font-weight:600;color:var(--navy);margin:0}
.team-role{color:var(--orange);font-size:12.5px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;margin:5px 0 12px}
.team-body p{color:var(--mid);font-size:15px;line-height:1.7;margin:0}

/* ============== KUNDENSTIMMEN ============== */
.reviews-section{background:var(--light)}
.review-grid{gap:18px}
.review-card{background:#fff;padding:32px 30px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column}
.review-quote{font-size:16.5px;line-height:1.65;color:var(--ink);margin:0 0 18px;font-weight:500}
.review-quote::before{content:"";display:block;width:34px;height:3px;background:var(--orange);margin-bottom:20px}
.review-author{margin:0;color:var(--mid);font-size:12.5px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase}

/* ============== COOKIE-HINWEIS ============== */
#tk-cookie{
  position:fixed;left:0;right:0;bottom:0;z-index:200;
  background:var(--navy);
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:10px 22px;padding:16px 28px;
}
#tk-cookie[hidden]{display:none}
#tk-cookie p{margin:0;font-size:13.5px;line-height:1.5;color:rgba(255,255,255,.82);max-width:70ch}
#tk-cookie p a{color:var(--orange-light)}
#tk-cookie button{
  font-family:'Outfit',sans-serif;font-size:12px;font-weight:700;
  letter-spacing:0.1em;text-transform:uppercase;
  background:var(--orange);color:#fff;border:none;padding:11px 24px;cursor:pointer;
  transition:background .25s var(--ease);
}
#tk-cookie button:hover{background:var(--orange-light)}

/* ============== FOTO-KARUSSELL ============== */
.tk-carousel-wrap{position:relative;overflow:hidden;padding:40px 60px}
.tk-carousel{
  display:flex;gap:40px;overflow-x:auto;
  scroll-behavior:smooth;padding:24px 0;
  scrollbar-width:none;-ms-overflow-style:none;
}
.tk-carousel::-webkit-scrollbar{display:none}
.tk-carousel > .wp-block-image{
  flex:0 0 clamp(380px,38vw,489px);
  margin:0;overflow:hidden;
  transition:transform .55s var(--ease);
}
.tk-carousel > .wp-block-image img{
  width:100%;height:clamp(230px,23vw,300px);
  object-fit:cover;display:block;
  transition:transform .55s var(--ease);
}
/* zentriertes Bild beim Stop hebt sich, waechst, leichter Schatten */
.tk-carousel > .wp-block-image.tk-active{
  transform:none;z-index:1;
  box-shadow:none !important;
  filter:none !important;
}
.tk-carousel > .wp-block-image:hover img{transform:none}
.tk-carousel-btn{
  position:absolute;top:50%;transform:translateY(-50%);z-index:5;
  width:50px;height:50px;border:none;cursor:pointer;
  background:rgba(0,10,48,.72);color:#fff;
  font-size:26px;line-height:1;font-family:'Outfit',sans-serif;
  display:flex;align-items:center;justify-content:center;
  transition:background .2s var(--ease);
}
.tk-carousel-btn:hover{background:var(--orange)}
.tk-carousel-btn.prev{left:0}
.tk-carousel-btn.next{right:0}

/* ============== INTERAKTIVE KARTE (Leaflet) ============== */
#tk-map{height:480px;width:100%;z-index:0;box-shadow:var(--shadow-md)}
#tk-map .leaflet-control-attribution{font-size:10px}
#tk-map .leaflet-popup-content{font-family:'Outfit',sans-serif;font-weight:500;color:var(--navy)}

/* ============== STAT-BAND (Vertrauen) — schlanker, sitzt vor der Karte */
.tk-stats{background:#fff;padding:24px 36px 8px !important}
.tk-stats-grid{gap:16px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr)) !important}
.tk-stat{
  display:flex;flex-direction:column;gap:2px;align-items:center;
  padding:18px 14px;background:var(--light);text-align:center;
}
.tk-stat .tk-stat-num{
  font-size:clamp(24px,2.2vw,32px);font-weight:700;color:var(--orange);
  margin:0;letter-spacing:-0.02em;line-height:1;
}
.tk-stat .tk-stat-label{
  margin:0;font-size:11.5px;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--mid);font-weight:600;
}

/* ============== REF-KICKER: gelber Mini-Titel ueber jedem Projekt-Card ============== */
.ref-card .ref-kicker{
  font-size:11.5px;letter-spacing:0.22em;text-transform:uppercase;
  color:#b88a00;font-weight:700;
  margin:0 0 8px;
}

/* Karussell: KEIN Schatten unter keinen Umstaenden — auch nicht beim Aktivieren/Scale */
.tk-carousel-wrap,
.tk-carousel,
.tk-carousel *,
.tk-carousel > .wp-block-image,
.tk-carousel > .wp-block-image *,
.tk-carousel > .wp-block-image img,
.tk-carousel > .wp-block-image.tk-active,
.tk-carousel > .wp-block-image.tk-active img,
.tk-carousel > .wp-block-image.tk-active figure{
  box-shadow:none !important;
  filter:none !important;
  -webkit-filter:none !important;
}

/* ============== WORLDMAP STATS (Startseite, über der Leaflet-Karte) ============== */
.worldmap-stats{
  display:flex;justify-content:center;gap:64px;flex-wrap:wrap;
  margin:8px auto 36px;padding-bottom:8px;max-width:900px;
}
.worldmap-stats .stat{
  display:flex;flex-direction:column;align-items:center;
  line-height:1.1;
}
.worldmap-stats .num{
  font-size:64px;font-weight:300;color:#fff;
  letter-spacing:-0.02em;line-height:1;
  display:block;
}
.worldmap-stats .lab{
  font-size:11.5px;letter-spacing:0.18em;text-transform:uppercase;
  color:rgba(255,255,255,.65);margin-top:10px;font-weight:600;
  display:block;
}
@media (max-width:760px){
  .worldmap-stats{gap:28px}
  .worldmap-stats .num{font-size:44px}
}

/* Timeline als echte Bloecke: WP-Group Wrappers brauchen kein extra Layout */
.timeline.wp-block-group{margin-top:48px;position:relative}
.tl-row.wp-block-group{
  display:grid;grid-template-columns:140px 1fr;gap:48px;
  padding:32px 0;align-items:start;position:relative;
}
.tl-row.wp-block-group > .wp-block-group{display:block}
.tl-row.wp-block-group > .tl-year{margin:0}
.tl-row.wp-block-group h4{font-size:20px;font-weight:700;color:var(--navy);margin:0 0 8px;letter-spacing:-0.005em}
.tl-row.wp-block-group p{margin:0;color:var(--mid);font-size:16px;line-height:1.7}
@media (max-width:760px){
  .tl-row.wp-block-group{grid-template-columns:1fr;gap:8px;padding:20px 0 20px 24px}
}

/* Lead-Variante: enger an die Aufzaehlung ranruecken */
.detail-body .lead.is-tight,
.lead.is-tight{margin-top:8px !important;margin-bottom:24px}
/* Alle Lead-Absaetze auf den Leistungsseiten bekommen ein konsistentes left-align */
.detail-body .lead,
.detail-body .lead.is-first,
.detail-body .lead.is-intro{text-align:left}
/* Lead-Absaetze, die NACH einer Liste kommen (z.B. "Dank aktueller Software" hinter den checks): tighter spacing */
ul.checks + .lead,
.wp-block-list.checks + .lead{margin-top:14px}

/* Leistungs-Seiten: Body-Spalte bündig mit H1-Titel (single-lead = 1080px) */
.wrap.detail-body{max-width:1080px}

/* Aufzählung: Schriftgröße wie der umliegende Lead-Text (21px statt 15.5px) */
.detail-body ul.checks li,
ul.checks li{
  font-size:21px;line-height:1.5;
}

/* Lead-Texte auf den Leistungs-Seiten im Blocksatz (Blockschrift) */
.detail-body .lead.is-first{text-align:justify}
/* Subtitel und Listen-Items bleiben links-bündig (Justify würde dort schräg aussehen) */
.detail-body .lead.is-intro{text-align:left}

/* Hero-Row (Featured Image + Noch Fragen) buendig zum H1-Titel (1080px) */
.hero-row{max-width:1080px}

/* H1 buendig zu Hero-Row und Body machen — gleiche 1080px Breite */
section.single-lead h1,
section.single-lead .wp-block-post-title{
  max-width:1080px;
  width:100%;
}

/* Services-Karten quadratisch in 2x2-Grid (statt 4-in-Reihe) */
.svc-grid{
  grid-template-columns:1fr 1fr !important;
  gap:36px !important;
  max-width:1100px;margin:0 auto;
}
.svc .svc-photo img{aspect-ratio:1/1 !important}

/* svc-link global (nicht nur innerhalb .svc) — z.B. fuer 'Arbeitsbeispiele' Hero-Link */
p.svc-link{font-size:11.5px !important;color:var(--orange) !important;
  font-size:11.5px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;
  color:var(--orange);
  display:inline-flex;align-items:center;gap:6px;
  margin:18px 0 0;
}
p.svc-link a{color:inherit;text-decoration:none}
p.svc-link a:hover{color:var(--orange-light)}
p.svc-link::after{content:"→";transition:transform .25s var(--ease)}
p.svc-link:hover::after{transform:translateX(5px)}

/* Service-Rows (Startseite) — komplett anklickbar, Bild links/rechts alternierend */
.svc-rows{max-width:1200px;margin:0 auto;padding:0 24px}
.svc-row{position:relative;margin:24px 0 !important}
.svc-row .wp-block-column{padding:0 !important}
.svc-row h3{
  font-size:clamp(24px,2.4vw,32px) !important;
  font-weight:600;color:var(--navy);
  margin:0 0 14px !important;line-height:1.2;letter-spacing:-0.01em;
}
.svc-row h3 a{color:inherit;text-decoration:none;position:static}
.svc-row h3 a::after{
  content:"";position:absolute;inset:0;z-index:1;
}
.svc-row:hover h3 a{color:var(--orange)}
.svc-row p{
  margin:0 0 18px;color:var(--mid);
  font-size:15.5px;line-height:1.65;
}
.svc-row .svc-link{position:relative;z-index:2;margin:0;text-align:right;display:block}
.svc-row .svc-photo{margin:0;overflow:hidden}
.svc-row .svc-photo img{
  width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:contain;background:#f4f4f4;
  transition:transform .6s cubic-bezier(0.16,1,0.3,1);
}
.svc-row:hover .svc-photo img{transform:scale(1.03)}

/* Page-Head Variante: weiß statt navy (Datenschutz, evtl. Impressum) */
.page-head.is-light{background:#fff;color:var(--navy)}
.page-head.is-light::after{display:none}
.page-head.is-light h1,
.page-head.is-light .wp-block-post-title{color:var(--navy)}
.page-head.is-light .crumb{color:var(--orange);font-weight:600}
.page-head.is-light .crumb a{color:var(--mid)}
.page-head.is-light .crumb a:hover{color:var(--navy)}

/* Hochformat-Bilder in proj-rows: aspect-ratio aufheben */
.proj-row .wp-block-image.is-portrait img,
.proj-row .wp-block-image.is-portrait figure img{
  aspect-ratio:auto !important;
  width:auto !important;
  max-width:100% !important;
  max-height:560px !important;
  object-fit:contain !important;
  margin:0 auto !important;
}
.proj-row .wp-block-image.is-portrait{align-self:center !important}

/* ============== FOOTER REDESIGN (Re-06, Stand 04.06.) ============== */
.tk-footer-main{align-items:stretch !important;gap:32px !important}
.tk-footer-hero{
  position:relative;overflow:hidden;background:var(--navy-deep);
  min-height:240px;border-radius:0;
}
.tk-footer-hero .tk-footer-hero-img{
  margin:0 !important;height:100%;width:100%;position:absolute !important;inset:0;z-index:0;
}
.tk-footer-hero .tk-footer-hero-img img{
  width:100% !important;height:100% !important;object-fit:cover !important;display:block;
  filter:brightness(0.55);
}
.tk-footer-hero .tk-footer-hero-overlay{
  position:relative;z-index:1;
  padding:28px 32px;height:100%;display:flex;flex-direction:column;justify-content:space-between;
}
.tk-footer-hero .tk-footer-brand{
  font-family:'Outfit',sans-serif;
  font-size:13px;font-weight:700;letter-spacing:0.22em;
  color:var(--orange-light);margin:0 0 8px;text-transform:uppercase;
}
.tk-footer-hero .tk-footer-hero-h{
  font-size:clamp(28px,3vw,40px) !important;font-weight:800;
  color:#fff;letter-spacing:-0.02em;line-height:1.05;
  margin:0;text-transform:uppercase;
}
.tk-footer-minilinks{
  margin:32px 0 14px;gap:24px;
}
.tk-footer-minilinks p{margin:0;font-size:13px;letter-spacing:0.04em}
.tk-footer-minilinks a{color:rgba(255,255,255,.82)}
.tk-footer-minilinks a:hover{color:#fff}
@media (max-width:782px){
  .tk-footer-main{flex-wrap:wrap}
  .tk-footer-hero{min-height:200px;width:100% !important;flex-basis:100% !important}
  .tk-footer-minilinks{justify-content:flex-start !important}
}

/* Re-07 Thomas: svc-row Bild links-/oben-bündig mit Text */
.svc-row.are-vertically-aligned-center,
.svc-row .wp-block-column.is-vertically-aligned-center{
  align-items:flex-start !important;
  align-self:flex-start !important;
}
.svc-row .svc-photo img{
  aspect-ratio:auto !important;
  object-fit:cover !important;
  background:transparent !important;
}

/* Re-07 Thomas: Services-Section komplett links-bündig (Hero-X-Position) */
.services .section-head{
  text-align:left !important;
  max-width:none !important;
  margin:0 0 48px 0 !important;
  padding-left:0 !important;
}
.services .section-head h2{text-align:left !important}
.services .svc-rows{
  max-width:none !important;
  margin:0 !important;
  padding:0 !important;
}

/* ============== FOOTER-BAND (Redesign 2026-06-04) ============== */
.tk-footer-band{
  background:var(--navy);color:#fff;
  padding:80px 36px 64px;
  max-width:1320px;margin:0 auto;
}
.tk-footer-band .tk-footer-wordmark{
  font-family:'Outfit',sans-serif;
  font-size:14px;font-weight:700;letter-spacing:0.16em;
  color:#fff;text-transform:uppercase;
  margin:0 0 48px;display:flex;align-items:center;gap:10px;
}
.tk-footer-band .tk-footer-wordmark-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:28px;height:28px;border-radius:50%;
  background:var(--orange);color:#fff;
  font-size:14px;font-weight:900;
}
.tk-footer-band .tk-footer-grid{
  align-items:flex-start !important;gap:48px !important;
  margin-bottom:64px;
}
.tk-footer-band .tk-footer-kicker{
  font-size:11px;letter-spacing:0.2em;text-transform:uppercase;
  color:var(--orange-light);font-weight:700;
  margin:0 0 22px;line-height:1;
}
.tk-footer-band .tk-footer-hero-h{
  font-family:'Outfit',sans-serif;
  font-size:clamp(36px,5vw,72px);
  font-weight:900;line-height:0.95;letter-spacing:-0.02em;
  color:#fff;text-transform:uppercase;
  margin:0;
}
.tk-footer-band .accent-orange{color:var(--orange-light);display:inline-block}
.tk-footer-band .tk-footer-line{
  margin:0 0 10px;font-size:15px;line-height:1.6;
  color:rgba(255,255,255,0.85);
}
.tk-footer-band .tk-footer-line-spaced{margin-top:24px}
.tk-footer-band .tk-footer-line a{
  color:rgba(255,255,255,0.85);text-decoration:none;
  transition:color .15s ease;
}
.tk-footer-band .tk-footer-line a:hover{color:#fff}
.tk-footer-band .tk-footer-col-services .tk-footer-line a{
  display:inline-block;border-bottom:1px solid rgba(255,255,255,0.12);
  padding-bottom:2px;
}
.tk-footer-band .tk-footer-col-services .tk-footer-line a:hover{
  border-bottom-color:var(--orange-light);color:#fff;
}
.tk-footer-band .tk-footer-pills{
  gap:10px !important;flex-wrap:wrap;
}
.tk-footer-band .tk-footer-pills .wp-block-button__link{
  background:transparent !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,0.32) !important;
  border-radius:999px !important;
  padding:10px 22px !important;
  font-size:13px;font-weight:600;letter-spacing:0.04em;
  transition:all .18s ease;
}
.tk-footer-band .tk-footer-pills .wp-block-button__link:hover{
  background:var(--orange) !important;
  border-color:var(--orange) !important;
  color:#fff !important;
}
@media (max-width:900px){
  .tk-footer-band{padding:56px 24px 48px}
  .tk-footer-band .tk-footer-grid{flex-wrap:wrap;gap:36px !important}
  .tk-footer-band .tk-footer-grid .wp-block-column{flex-basis:100% !important}
  .tk-footer-band .tk-footer-pills{justify-content:flex-start !important}
}

/* Re-08 Bild 1+9: intro-block Lead als Blocksatz */
.intro-block .text-col p:not(.pre-h2):not(.svc-link) {
  text-align: justify;
  hyphens: auto;
}

/* Re-08 Punkt 38 / Bild 10: proj-row Inhalt linksbuendig auf Detail-Seiten */
.detail-body .proj-row,
.detail-body .proj-rows {
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 0 !important;
}
.detail-body .proj-row .wp-block-image,
.detail-body .proj-row .wp-block-image figure,
.detail-body .proj-row .wp-block-image img {
  margin-left: 0 !important;
  margin-right: auto;
}
.detail-body .proj-row p,
.detail-body .proj-row h2,
.detail-body .proj-row h3,
.detail-body .proj-row h4 {
  text-align: left !important;
}

/* Re-08 Punkt 38 / Bild 10: gleicher Effekt auf Single-Post Projekt-Details (.single-body Wrapper) */
.single-body .proj-row,
.single-body .proj-rows {
  max-width: 100% !important;
  margin: 0 !important;
  padding-left: 0 !important;
}
.single-body .proj-row .wp-block-image,
.single-body .proj-row .wp-block-image figure,
.single-body .proj-row .wp-block-image img {
  margin-left: 0 !important;
  margin-right: auto;
}
.single-body .proj-row p,
.single-body .proj-row h2,
.single-body .proj-row h3,
.single-body .proj-row h4 {
  text-align: left !important;
}

/* Re-08 Bild 1+9 (FIX2): Lead-Text Blocksatz härter erzwungen */
.intro-block p,
.intro-block .text-col p,
.intro-block .wp-block-column p {
  text-align: justify !important;
  hyphens: auto !important;
}
.intro-block .pre-h2,
.intro-block .svc-link,
.intro-block .has-text-align-right {
  text-align: revert !important;
}

/* Re-08 Punkt 38 (FIX2): echte Ursache war WP entry-content max-width 780px */
.single-body .wp-block-post-content,
.single-body .entry-content,
.single-body .wp-block-post-content.has-global-padding {
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 36px !important;
  padding-right: 73px !important;
}
.single-body .proj-row {
  max-width: 100% !important;
}
.single-body .proj-row .wp-block-column {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Re-08 Punkt 38 (FIX3): echte Ursache war .prose Container max-width 980px */
.single-body .wp-block-group.prose,
.single-body .prose {
  max-width: 1080px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.single-body .entry-content.wp-block-post-content,
.single-body .wp-block-post-content {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Re-08 Footer v2 (Thomas-Feedback): Adresse als 3 Outline-Pills + Buttons scharfkantig */
.tk-footer-band .tk-footer-address-pills {
  margin-top: 18px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}
.tk-footer-band .tk-footer-pill {
  display: inline-block;
  padding: 6px 14px;
  border: 1.5px solid rgba(255,255,255,0.45);
  color: rgba(255,255,255,0.92);
  font-size: 14px;
  font-weight: 400;
  margin: 0;
  background: transparent;
  line-height: 1.3;
  letter-spacing: 0;
}
.tk-footer-band .tk-footer-pills .wp-block-button.tk-footer-btn-square .wp-block-button__link {
  border-radius: 0 !important;
  border-width: 1.5px !important;
  padding: 10px 22px !important;
  font-weight: 500;
  letter-spacing: 0.04em;
  text-transform: none;
}
.tk-footer-band .tk-footer-pills .wp-block-button.tk-footer-btn-square .wp-block-button__link:hover {
  background: var(--orange-light) !important;
  border-color: var(--orange-light) !important;
  color: var(--navy) !important;
}

/* Re-08 Footer v2 (Thomas-Feedback): einheitliche Footer-Farbe (gleicher Navy wie outer FOOTER.site) */
.tk-footer-band {
  background: rgb(0, 10, 48) !important;
}

/* Re-08 Punkt 7 (Thomas-Feedback): svc-row Bilder NICHT gestretcht, vollständig sichtbar */
.svc-row .svc-photo {
  align-self: flex-start !important;
  height: auto !important;
}
.svc-row .svc-photo img {
  height: auto !important;
  max-height: 500px !important;
  width: 100% !important;
  object-fit: contain !important;
  aspect-ratio: auto !important;
}
.svc-row .wp-block-column:first-child {
  align-self: flex-start !important;
}

/* Re-08 Punkt 7 (Fix 2): object-fit weg — Bild zeigt natürliche Größe */
.svc-row .svc-photo img {
  object-fit: initial !important;
  max-height: none !important;
}

/* Re-08 Punkt 7 (Fix 3): Spalten-Stretch komplett aus, Bild zeigt natürliche Höhe */
.svc-row,
.svc-row.wp-block-columns {
  align-items: flex-start !important;
}
.svc-row .wp-block-column {
  display: block !important;
  height: auto !important;
  min-height: 0 !important;
  align-self: flex-start !important;
}
.svc-row .svc-photo,
.svc-row .wp-block-image.svc-photo,
.svc-row figure.svc-photo {
  height: auto !important;
  display: block !important;
}
.svc-row .svc-photo img {
  height: auto !important;
  width: 100% !important;
  max-height: none !important;
  object-fit: initial !important;
  display: block !important;
}

/* Re-08 Punkt 7 (Fix 5): Einheitliche svc-row Bilder — gleicher Cover-Crop fuer alle */
section.services .svc-row .svc-photo,
.svc-row .svc-photo,
.svc-row figure.svc-photo {
  aspect-ratio: 4 / 3 !important;
  height: auto !important;
  width: 100% !important;
  display: block !important;
  overflow: hidden !important;
}
section.services .svc-row .svc-photo img,
.svc-row .svc-photo img,
.svc-row figure img {
  height: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  width: 100% !important;
  object-fit: cover !important;
  aspect-ratio: auto !important;
  display: block !important;
  background: transparent !important;
}
section.services .svc-row,
.svc-row .wp-block-column {
  align-items: flex-start !important;
  align-self: flex-start !important;
}

/* Re-08 Beitragsseite: Beiträge-Heading bündig links mit den Cards */
section.single-lead {
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 36px !important;
}
section.single-lead h1 {
  text-align: left !important;
  padding-left: 0 !important;
}

/* Re-08 Beitragsseite (Fix 2): H1 selbst linksbündig — max-width + margin-left override */
section.single-lead h1.wp-block-heading,
section.single-lead h1 {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  width: auto !important;
  padding-left: 0 !important;
}

/* Re-08 Punkt 30: Portrait-Grid für "Der Mensch - Die Beteiligten" + "Perspektivwechsel" */
.portrait-claim {
  font-size: 22px;
  color: var(--mid);
  margin: 0 0 48px;
  letter-spacing: -0.01em;
}
.portrait-claim em {
  font-style: italic;
  color: var(--navy);
}
.portrait-grid {
  display: grid !important;
  grid-template-columns: repeat(5, 1fr) !important;
  gap: 14px;
  margin-top: 24px;
}
.portrait-grid .portrait-tile {
  margin: 0 !important;
}
.portrait-grid .portrait-tile img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  display: block;
  background: var(--light);
  transition: transform .4s cubic-bezier(0.16,1,0.3,1), box-shadow .4s cubic-bezier(0.16,1,0.3,1);
}
.portrait-grid .portrait-tile:hover img {
  transform: scale(1.02);
  box-shadow: 0 8px 20px rgba(0,0,0,0.12);
}
@media (max-width: 900px) {
  .portrait-grid { grid-template-columns: repeat(3, 1fr) !important; }
}
@media (max-width: 600px) {
  .portrait-grid { grid-template-columns: repeat(2, 1fr) !important; }
}

/* Re-08 Punkt 30 (Fix): portrait-grid linksbündig + auf volle Breite ziehen */
.single-body .portrait-grid {
  margin-left: calc(-1 * ((100vw - 100%) / 2)) !important;
  width: calc(100vw - 72px) !important;
  max-width: 1320px !important;
}
/* Einfacher: .prose wrapper Container weiter machen für portrait-grid posts */
.single-body .prose:has(.portrait-grid) {
  max-width: 1320px !important;
}
.single-body .prose:has(.portrait-grid) .entry-content,
.single-body .prose:has(.portrait-grid) .wp-block-post-content {
  max-width: 1320px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Re-08 Punkt 30 (Fix v2): Spacer unsichtbar + Grid linksbündig zu h1 */
.hidden-spacer,
.hidden-spacer * {
  display: none !important;
  visibility: hidden !important;
}
.single-body .portrait-grid {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

/* Re-08 Punkt 30 (Fix v3): portrait-grid auf h1-x-Position (76px = 40 section + 36 padding) */
.single-body .portrait-grid {
  margin-left: 36px !important;
  margin-right: 36px !important;
  width: calc(100% - 72px) !important;
}

/* Re-08 Punkt 30: Portrait-Grid Posts (1802 + 1806) — Hero + Noch-Fragen-Box ausblenden, Lead linksbündig */
body.postid-1802 .hero-row {
  display: none !important;
}
body.postid-1802 .entry-content > p,
body.postid-1802 .wp-block-post-content > p {
  margin-left: 36px !important;
  margin-right: 36px !important;
  max-width: calc(100% - 72px) !important;
}

/* Re-08 Punkt 30: hero-steal-spacer absolut ausblenden */
.hero-steal-spacer, .hero-steal-spacer * {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* ============================================================
   Re-08 follow-up (2026-06-04): Intro-Block Hero-Lead Fullwidth
   Problem: post-24 hat zwar zweite Spalte (intro-images), aber
   leer (keine figures). Resultat: Text bei 55% (726px), rechts
   594px Leere. Fix: text-col auf volle Breite, leere
   intro-images-Spalte ausblenden, gap weg.
   ============================================================ */
.intro-block > .text-col {
  flex-basis: 100% !important;
  width: 100% !important;
  max-width: 100% !important;
}
.intro-block > .wp-block-column:not(.text-col) {
  display: none !important;
}
.intro-block {
  gap: 0 !important;
}
/* H2 (Wir krempeln...) und Lead-Paragraph sollen die volle
   Container-Breite einnehmen — keine internen max-width caps */
.intro-block .text-col h2,
.intro-block .text-col > p {
  max-width: 100% !important;
  width: 100% !important;
}
/* intro-bottom-row (Arbeitsbeispiele links / ...und packen an. rechts)
   bleibt strukturell unangetastet, spannt sich aber jetzt über die
   volle Breite. Sicherheitshalber max-width entsperren. */
.intro-block .intro-bottom-row {
  max-width: 100% !important;
  width: 100% !important;
}

/* === Re-08 Punkt 16 — Header-Items Bottom-Baseline === */
/* Ziel: Logo, Wordmark, Nav-Items und info@-Button schliessen bei y=72 ab (Header 90px, padding 18px vertikal). */

.tk-header-inner{
  align-items: flex-end !important;
  padding-bottom: 18px !important;
}

/* Brand-Spalte: Logo (54px) + Wordmark gemeinsam auf der Unterkante */
.tk-brand{
  align-items: flex-end !important;
  gap: 14px !important;
}
.tk-brand .tk-logo img{
  display: block;
  height: 54px;
  width: auto;
}
.tk-brand-name{
  line-height: 1 !important;
  margin: 0 !important;
  padding-bottom: 4px !important;
}
.tk-brand-sub{
  line-height: 1 !important;
  margin: 0 !important;
  padding-bottom: 4px !important;
}

/* Nav-Items: Unterkante auf y=72 ziehen */
.tk-nav .wp-block-navigation-item__content{
  padding: 4px 2px 4px !important;
}

/* info@-Button: sichtbar + an Unterkante ausgerichtet */
.tk-header-inner .wp-block-buttons{
  display: flex !important;
  align-items: flex-end !important;
  flex: 0 0 auto;
}
.tk-header-inner .btn-text .wp-block-button__link{
  display: inline-block !important;
  padding: 4px 0 !important;
  line-height: 1 !important;
  font-size: 14px;
  color: var(--navy) !important;
  white-space: nowrap;
}

/* === Re-08 Punkt 16 — Mobile-Header Reparatur (390px) === */
/* Der Button-Wrapper schrumpfte mit flex-shrink auf 12px und schob sich off-screen rechts neben den Viewport,
   wraps in zig Zeilen und streckte den Header auf 614px. Auf Mobile blenden wir den Button-Wrapper aus
   (Hamburger-Menue enthaelt /kontakt) und stellen die Header-Geometrie wieder her. */
@media (max-width: 880px){
  .tk-header-inner{
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 18px !important;
    padding-bottom: 12px !important;
    flex-wrap: nowrap;
  }
  .tk-header-inner > .wp-block-buttons{
    display: none !important;
  }
  .tk-header-inner .tk-brand{
    align-items: center !important;
    flex: 1 1 auto;
    min-width: 0;
    gap: 10px !important;
  }
  .tk-header-inner .tk-logo img{
    height: 42px;
  }
  .tk-brand-name{
    font-size: 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-bottom: 0 !important;
  }
  .tk-brand-sub{
    display: none;
  }
  .tk-header-inner > nav.tk-nav{
    flex: 0 0 auto;
  }
  .wp-site-blocks > main{
    padding-top: 66px;
  }
}

/* Re-08 Punkt 38 + Spacing — GENERISCH fuer alle Projekt-Posts */
body.single-post:not(.postid-1802) section.single-lead,
body.single-post:not(.postid-1802) section.single-body {
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 36px !important;
  padding-right: 73px !important;
}
body.single-post:not(.postid-1802) section.single-lead {
  margin-bottom: 0 !important;
}
body.single-post:not(.postid-1802) section.single-body {
  padding-top: 24px !important;
}
body.single-post:not(.postid-1802) .single-body .wp-block-post-content,
body.single-post:not(.postid-1802) .single-body .entry-content,
body.single-post:not(.postid-1802) .single-body .wp-block-group.prose,
body.single-post:not(.postid-1802) .single-body .prose {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  width: 100% !important;
}
body.single-post:not(.postid-1802) .single-body .entry-content > p,
body.single-post:not(.postid-1802) .single-body .wp-block-post-content > p {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
}
body.single-post:not(.postid-1802) .single-body .proj-row {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 100% !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
body.single-post:not(.postid-1802) .single-body .proj-row + .proj-row {
  margin-top: 0 !important;
}
body.single-post:not(.postid-1802) .single-body .proj-row h3,
body.single-post:not(.postid-1802) .single-body .proj-row .wp-block-heading,
body.single-post:not(.postid-1802) .single-body .proj-row p {
  text-align: left !important;
}

/* Re-08 Punkt 16 nachzug — info@-Button Pixel-Perfect */
.tk-header-inner .btn-text .wp-block-button__link { padding-top: 6px !important; padding-bottom: 2px !important; line-height: 1 !important; }

/* Re-08 Punkt 16 — info@ Button vertical-align fix */
.tk-header-inner .btn-text { line-height: 1 !important; }
.tk-header-inner .btn-text .wp-block-button__link {
  vertical-align: bottom !important;
  line-height: 1 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  display: inline-block !important;
}

/* Re-08 Punkt 27 — Zeitstrahl horizontal */
.tk-timeline-horizontal { overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding: 24px 0 48px; position: relative; }
.tk-timeline-horizontal::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: var(--orange, #d97706); transform: translateY(-50%); z-index: 0; }
.tk-timeline-horizontal .tk-timeline-track { display: flex; gap: 48px; padding: 0 36px; min-width: max-content; position: relative; z-index: 1; }
.tk-timeline-horizontal .tk-timeline-step { flex: 0 0 280px; scroll-snap-align: center; background: #fff; box-shadow: 0 4px 20px rgba(0,10,48,0.08); padding: 32px 24px; }
.tk-timeline-horizontal .tk-timeline-step h4 { font-family: "Outfit", sans-serif; font-weight: 900; font-size: 36px; letter-spacing: -0.03em; color: var(--navy, rgb(0, 10, 48)); margin: 0 0 12px; }
.tk-timeline-horizontal .tk-timeline-step p { font-size: 15px; color: var(--mid, #555); margin: 0; line-height: 1.6; }

/* Re-08 Punkt 35 nachzug — Footer Hero-Spalte mit Bg-Bild */
.tk-footer-band .tk-footer-col-hero {
  position: relative;
  background-image: linear-gradient(rgba(0, 10, 48, 0.55), rgba(0, 10, 48, 0.75)), url("https://thomas-krause.178.105.79.156.nip.io/wp-content/uploads/2026/06/schiffssektion-transport-kran-nacht-hafen-wasser-planen-abgedeckt-scaled-projekt.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: 48px 36px !important;
  border-radius: 0;
  flex-basis: 42%;
}
.tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  color: var(--orange, #d97706) !important;
  font-weight: 700;
  letter-spacing: 0.18em;
  font-size: 13px;
  text-transform: uppercase;
  margin: 0 0 16px;
}
.tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  font-family: "Outfit", sans-serif;
  font-weight: 900;
  font-size: clamp(48px, 5vw, 72px);
  letter-spacing: -0.04em;
  line-height: 0.95;
  color: #ffffff;
  margin: 0;
  text-transform: uppercase;
}
.tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  color: var(--orange, #d97706) !important;
}
@media (max-width: 880px) {
  .tk-footer-band .tk-footer-col-hero { padding: 32px 22px !important; flex-basis: 100%; }
  .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h { font-size: 40px; }
}

/* ============================================================
   Re-08 Punkt 38 nachzug — Hero-Image auf Projekt-Posts linksbuendig
   Datum: 2026-06-04
   Problem: .hero-row liegt auf max-width:1080px (Lines 427+861),
   waehrend .single-lead durch Re-08-Generic (Line 1517-1525) auf
   max-width:1320px + padding 36px hochgezogen wurde.
   -> H1 startet bei x=96, hero-row bei x=180, Hero-Bild bei x=232.
   Fix: .hero-row exakt auf dieselben Aussenmasse wie single-lead
   ziehen, dann das Bild im figure.single-hero linksbuendig statt
   zentriert ausrichten, damit Bild-Kante = H1-Kante (x=96).
   ============================================================ */
body.single-post:not(.postid-1802) .hero-row {
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 36px !important;
  padding-right: 73px !important;
  grid-template-columns: minmax(0,1fr) 260px !important;
  gap: 36px !important;
}

/* figure.single-hero NICHT zentrieren, Bild linksbuendig setzen,
   damit linke Kante mit H1 fluchtet (beide bei x=96) */
body.single-post:not(.postid-1802) .hero-row > .single-hero {
  justify-content: flex-start !important;
}
body.single-post:not(.postid-1802) .hero-row > .single-hero img {
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* Re-08 Punkt 35 nachzug 2 — EUROPAWEIT darf nicht umbrechen */
.tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  font-size: clamp(36px, 3.6vw, 56px) !important;
  white-space: nowrap !important;
  line-height: 1.05 !important;
}
@media (max-width: 1100px) {
  .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
    font-size: clamp(28px, 3.2vw, 44px) !important;
  }
}

/* Re-08 Punkt 35 nachzug 3 — TRANSPORTTECHNIKER kicker größer */
.tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  font-size: clamp(22px, 2vw, 32px) !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  line-height: 1 !important;
  margin: 0 0 24px !important;
  color: var(--orange-light, #d97706) !important;
}
@media (max-width: 880px) {
  .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
    font-size: clamp(16px, 4vw, 22px) !important;
  }
}

/* Re-08 Punkt 35 nachzug 4 — Footer-Hero-Bild entfernen */
.tk-footer-band .tk-footer-col-hero {
  background-image: none !important;
  background: transparent !important;
}

/* Re-08 Punkt 16 nachzug 2 — ALLE Header-Items strikt auf Logo-Bottom-Baseline */
/* Konsolidierung der drei Override-Bloecke (Zeilen 1464/1566/1570) zu EINEM Regelblock.
   Logo (height:54px, padding-bottom:18px im Inner) bestimmt die Bottom-Baseline.
   Alle anderen Items werden via flex-end + line-height:1 + Padding-Reset auf
   dieselbe Linie gepinnt. Messung bestaetigt delta=0px auf 1440 und 1920. */

.tk-header-inner {
    align-items: flex-end !important;
    padding-bottom: 18px !important;
}

.tk-header-inner .tk-brand {
    align-items: flex-end !important;
}

.tk-header-inner .tk-brand .tk-logo img {
    display: block !important;
    height: 54px !important;
    width: auto !important;
}

.tk-header-inner .tk-brand .tk-brand-name {
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 0 4px 0 !important;
}

.tk-header-inner .tk-brand .tk-brand-sub {
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 0 4px 0 !important;
}

.tk-header-inner .tk-nav {
    align-self: flex-end !important;
}

.tk-header-inner .tk-nav .wp-block-navigation-item__content {
    padding: 4px 2px !important;
    line-height: 1 !important;
}

.tk-header-inner .wp-block-buttons {
    align-self: flex-end !important;
    display: flex !important;
    align-items: flex-end !important;
    flex: 0 0 auto !important;
}

.tk-header-inner .wp-block-buttons .btn-text {
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: flex-end !important;
}

/* Final-Winner Konsolidierung: Ersetzt die drei kollidierenden Bloecke
   aus Zeilen 1464, 1566 und 1570. vertical-align:bottom + line-height:1
   + padding:0 pinnt den Button-Link exakt auf logo_bottom=72px. */
.tk-header-inner .btn-text .wp-block-button__link,
.tk-header-inner .wp-block-buttons .btn-text .wp-block-button__link {
    display: inline-block !important;
    vertical-align: bottom !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    font-size: 14px !important;
    color: var(--navy) !important;
    white-space: nowrap !important;
}

/* Re-08 Punkt 16 nachzug 3 — info@ Text-Baseline auf Nav-Text-Baseline (4px hoeher) */
.tk-header-inner .btn-text .wp-block-button__link,
.tk-header-inner .wp-block-buttons .btn-text .wp-block-button__link {
  padding-bottom: 4px !important;
}

/* Hauptseite Hero — Bild nach unten anchor damit Fuesse sichtbar */
.tk-hero-bg img {
  object-position: 50% 50% !important;
}

/* Re-08 Punkt 24 — Chinazug letzte 3 Fotos Hochformat */
body.postid-20 .proj-row:has(.wp-image-650) .wp-block-column img, body.postid-20 .proj-row:has(.wp-image-870) .wp-block-column img {
  aspect-ratio: 3 / 4 !important;
  object-fit: contain !important;
  width: 100% !important;
  height: auto !important;
  max-width: 480px !important;
  margin: 0 auto !important;
  display: block !important;
}
body.postid-20 .proj-row:has(.wp-image-650) .wp-block-column, body.postid-20 .proj-row:has(.wp-image-870) .wp-block-column {
  align-items: center !important;
  display: flex !important;
  justify-content: flex-start !important;
}

/* ============================================================
   Re-10 A.1 -- Hero-Lead Spacing enger zusammen
   (2026-06-06): Thomas-Feedback: "nicht so grosse Abstaende
   zwischen H1 und Lead-Text! Und auch kleineren Abstand
   zwischen Lead-Text und ...und packen an."
   Arbeitsbeispiele etwas tiefer.
   ============================================================ */
/* H1 -> Lead-Text: weniger Luft */
.intro-block h2,
.intro-block .text-col h2 {
  margin-bottom: 16px !important;
}
.intro-block .text-col p,
.intro-block .text-col p:not(.pre-h2):not(.svc-link) {
  margin: 0 0 10px !important;
  line-height: 1.6 !important;
}
.intro-block .text-col p:first-of-type {
  margin-top: 0 !important;
}
/* Lead-Text -> ARBEITSBEISPIELE / ...und packen an.: weniger Luft, aber ARBEITSBEISPIELE etwas tiefer */
.intro-block .intro-bottom-row {
  margin-top: 28px !important;
}
/* pre-h2 Kicker (TRANSPORTTECHNIKER · Seit 2003) -> H1: enger */
.intro-block .pre-h2 {
  margin-bottom: 16px !important;
}

/* Re-10 Punkt 12 -- 1806 Portrait-Grid wie 1802 */
body.postid-1806 .hero-row { display: none !important; }

/* ============================================================
   Re-10 A.2 -- Bilder nicht links/rechts abschneiden
   (2026-06-06): Thomas-Feedback. NICHT global object-fit:contain
   (waere Design-Bruch). Nur die Selektoren aus a2pre.selectors_to_fix,
   konservativ: Services-Section + Beitraege-Cards.
   Karussell + proj-row bewusst NICHT angefasst.
   ============================================================ */

/* Services-Section: ganze Bild sichtbar, kein Crop */
.svc-row .svc-photo img,
section.services .svc-row .svc-photo img {
  object-fit: contain !important;
  object-position: center center !important;
  background: #f7f7f5 !important;
}

/* Beitraege-Cards: object-fit contain, leichter Hintergrund */
.ref-card .wp-block-image img,
.ref-card img.wp-image-1741,
.ref-grid .ref-card img {
  object-fit: contain !important;
  background: #f7f7f5 !important;
}

/* ============================================================
   Re-10 A.3 -- Hero-Image auf Projektseiten groesser
   Datum: 2026-06-06
   Problem: .single-hero img max-height:480px (Line 423) cappt
   Hoehe so frueh, dass 4:3-Querformat-Bilder nur 640-679px breit
   werden statt der verfuegbaren 952px Spalte. Resultat: Bild
   wirkt klein, rechts neben dem Bild 273-312px Leerraum.
   Fix: max-height auf Projekt-Posts auf 640px erhoehen, damit
   Bild bis ~904px Breite skaliert und ca. 71% der Viewport-Hoehe
   einnimmt. Aspect-Ratio bleibt korrekt durch object-fit:contain.
   ============================================================ */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img {
  max-height: 640px !important;
  max-width: 100% !important;
  width: auto !important;
  height: auto !important;
}

/* Optional: hero-aside vertikal mittig auf groessere Hero-Hoehe
   ausrichten -- verhindert dass die Box oben "klebt" */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row {
  align-items: center !important;
}

/* Falls noch prominenter gewuenscht: max-height entfernen und
   stattdessen das figure-flex zentrieren auf gesamte 952px;
   aber 640px max ist sicherer fuer Hochformat-Bilder. */

/* Re-10 A.4 -- Footer-Pills als reiner Text (kein Border, kein Padding) */
.tk-footer-band .tk-footer-pill,
.tk-footer-pill {
  border: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
  margin: 0 0 6px !important;
  font-weight: 400 !important;
  color: rgba(255,255,255,0.85) !important;
  border-radius: 0 !important;
}
.tk-footer-band .tk-footer-address-pills {
  margin-top: 12px !important;
}

/* Re-10 Punkt 2 (refined) -- ARBEITSBEISPIELE tiefer + Abstaende kleiner */
/* Lead-Text noch enger zur H2 */
.intro-block h2,
.intro-block .text-col h2 {
  margin-bottom: 12px !important;
  line-height: 1.15 !important;
}
/* Lead-Paragraphen kompakter, weniger Spacing zwischen Absaetzen */
.intro-block .text-col p:not(.pre-h2):not(.svc-link) {
  margin: 0 0 8px !important;
  line-height: 1.55 !important;
}
/* "...und packen an." enger an Lead-Text drueber */
.intro-block .intro-bottom-row {
  margin-top: 21px !important;
}
/* ARBEITSBEISPIELE-Link tiefer im Block (mehr Luft vor dem Link) */
.intro-block .intro-bottom-row .arbeitsbeispiele,
.intro-block .intro-bottom-row a.svc-link,
.intro-block .intro-bottom-row .wp-block-button {
  margin-top: 40px !important;
}

/* Karussell Flatten-Fix -- track flex + figures konstante Hoehe */
.tk-carousel,
.tk-carousel-wrap {
  overflow: hidden !important;
}
.tk-carousel-track {
  display: flex !important;
  gap: 24px !important;
  align-items: center !important;
  width: max-content !important;
  height: clamp(380px, 34vw, 520px) !important;
}
.tk-carousel-track > .wp-block-image {
  flex: 0 0 auto !important;
  margin: 0 !important;
  height: 100% !important;
  display: block !important;
}
.tk-carousel-track > .wp-block-image img {
  height: 100% !important;
  width: auto !important;
  max-width: 100% !important;
  display: block !important;
  object-fit: cover !important;
}

/* ============================================================
   Re-10 2026-06-06 — @-Zeichen Baseline-Fix im Header
   Thomas: "Bei der Info @ zeichnen ist ein bisschen unter die
   Buchstaben. Mach das richtig."
   Outfit-Font setzt @ optisch tiefer als die Versalien.
   Wrapper-Span im Template (Post 36), hier sanftes Anheben.
   ============================================================ */
.tk-header-inner .wp-block-button__link .tk-at,
.tk-header-inner .btn-text .tk-at,
.tk-header-inner .wp-block-button__link span.tk-at {
  display: inline-block !important;
  transform: translateY(-0.09em) !important;
  line-height: 1 !important;
  vertical-align: baseline !important;
}

/* ============================================================
   Re-10 Punkt 2 NACHZUG (2026-06-07) — Hero-Lead noch enger,
   ARBEITSBEISPIELE deutlich tiefer.
   Audit (gestern abend):
     h2 → lead         = 12px (Thomas: enger → 8px)
     lead → packen an  = 16px (Thomas: enger → 10px)
     packen → arbeitsbeispiele = 18px (Thomas: TIEFER → 64px)
   ============================================================ */
.intro-block h2,
.intro-block .text-col h2 {
  margin-bottom: 8px !important;
}
.intro-block .text-col p,
.intro-block .text-col p:not(.pre-h2):not(.svc-link) {
  margin: 0 0 8px !important;
  line-height: 1.55 !important;
}
.intro-block .text-col p:first-of-type {
  margin-top: 0 !important;
}
/* …und packen an näher an Lead-Text */
.intro-block .intro-bottom-row {
  margin-top: 0 !important;
}
/* ARBEITSBEISPIELE deutlich tiefer als CTA */
p.svc-link {
  margin-top: 56px !important;
}

/* ============================================================
   Re-10 Punkt 3 NACHZUG (2026-06-07) — Bilder vollständig zeigen
   25 Bilder auf Hauptseite werden ~18% beschnitten:
   Source 489x366 (4:3), Container forced auf 489x300 / 538x330 (16:10).
   Fix: Container aspect-ratio auf 4:3 (Source-Format) damit cover
   nichts mehr abschneidet. Plus object-fit:contain als Fallback
   für svc-photos (war schon, wird hier konsolidiert).
   Karussell NICHT angefasst (Band-Effekt soll bleiben).
   ============================================================ */

/* Container der Service-Bildgrids: aspect-ratio 4:3 statt 16:10 */
.svc-photos .wp-block-image,
.svc-row .svc-photo,
.svc-row .svc-photo .wp-block-image {
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
}
.svc-photos .wp-block-image img,
.svc-row .svc-photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
}

/* Beiträge-Card-Bilder: 4:3 */
.ref-grid .ref-card .wp-block-image,
.ref-card .wp-block-image {
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
}
.ref-grid .ref-card .wp-block-image img,
.ref-card .wp-block-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
}

/* ============================================================
   Re-10 Punkt 2 + 3 NACHZUG 2 (2026-06-07)
   - Punkt 2: text-align:right erzwingen (wp-block-library schluckt es)
   - Punkt 3: Karussell-Bilder Aspect-Ratio respektieren (Gallery
     "is-cropped" CSS schnitt 18% ab); object-position:center.
   ============================================================ */

/* Punkt 2: ...und packen an. wirklich rechts */
.intro-block .intro-bottom-row h2,
.intro-block .intro-bottom-row h2.wp-block-heading,
.intro-block .intro-bottom-row .has-text-align-right {
  text-align: right !important;
}

/* Punkt 3: Karussell-Bilder kein Crop trotz Band-Effekt */
.tk-carousel .wp-block-gallery.is-cropped .wp-block-image,
.tk-carousel .wp-block-gallery .wp-block-image,
.tk-carousel-track > .wp-block-image {
  aspect-ratio: auto !important;
  height: 100% !important;
  width: auto !important;
  overflow: visible !important;
}
.tk-carousel .wp-block-gallery.is-cropped .wp-block-image img,
.tk-carousel .wp-block-gallery .wp-block-image img,
.tk-carousel-track > .wp-block-image img {
  height: 100% !important;
  width: auto !important;
  max-width: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center center !important;
}

/* ============================================================
   Re-10 Punkt 7 v3 NACHZUG (2026-06-07) — Hero-Bild groß + Aside
   rechts daneben, ABER Aside wie Thomas-Vorlage: kein Background,
   keine Border, große Navy-Headline, orange Telefonnummer.
   Grid: 1fr image + 260px aside + 40px gap.
   1802/1806 (Portrait-Grids) bleiben ausgespart.
   ============================================================ */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row {
  display: grid !important;
  grid-template-columns: 1fr 260px !important;
  gap: 40px !important;
  align-items: start !important;
  max-width: 1320px !important;
  margin: 0 auto !important;
  padding: 0 36px !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img {
  width: 100% !important;
  height: auto !important;
  max-height: 680px !important;
  object-fit: cover !important;
  object-position: center 40% !important;
  display: block !important;
  margin: 0 !important;
}
/* Aside: clean, kein Card-Look, große Headline, orange Telefon */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside {
  max-width: 260px !important;
  margin: 0 !important;
  padding: 12px 0 0 0 !important;
  background: transparent !important;
  border: none !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside h3 {
  font-family: 'Outfit', sans-serif !important;
  font-size: clamp(28px, 2.4vw, 36px) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  color: var(--navy, #001659) !important;
  margin: 0 0 16px !important;
  line-height: 1.1 !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p {
  font-size: 15px !important;
  line-height: 1.55 !important;
  margin: 0 0 6px !important;
  color: var(--ink, #212121) !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p a {
  color: var(--navy, #001659) !important;
  text-decoration: none !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p a:hover {
  color: var(--orange, #C8860D) !important;
}
/* Telefonnummer-Zeile orange (letzter Absatz oder tel:-Link) */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:last-of-type {
  font-weight: 700 !important;
  font-size: 16px !important;
  color: var(--orange, #C8860D) !important;
  margin-top: 12px !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p a[href^="tel:"] {
  color: var(--orange, #C8860D) !important;
}

/* ============================================================
   Re-10 Punkt 2 v3 (2026-06-07) — Text-Col fest auf 55% linksbündig
   Vorher: text-col streckte sich auf 100% weil zweite Spalte fehlte
   und intro-block keine constraint hatte. Jetzt: text-col 55%
   anchored left, rechts 45% bleibt frei (Atemraum).
   Plus: Lead-Paragraph zurück auf text-align:left (statt justify),
   wirkt natürlicher und weniger schwer.
   ============================================================ */
.intro-block {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}
.intro-block .text-col {
  flex-basis: 55% !important;
  max-width: 760px !important;
  margin-right: auto !important;
}
.intro-block .text-col p {
  text-align: left !important;
}
.intro-block .text-col .pre-h2 {
  text-align: left !important;
}

/* ============================================================
   Karussell-Slides UNIFORM SIZE (2026-06-07)
   Thomas: "alle Bilder müssen im gleichen großen ungefähr ...
   weil zu groß ist dann verläuft es und schmiert es überall."
   Fix: Fixed slide-Breite, aspect-ratio 4/3, object-fit cover.
   Überschreibt Punkt 3 NACHZUG der width:auto setzte.
   ============================================================ */
.tk-carousel-track > .wp-block-image,
.tk-carousel .wp-block-gallery .wp-block-image {
  flex: 0 0 480px !important;
  width: 480px !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  margin: 0 !important;
}
.tk-carousel-track > .wp-block-image img,
.tk-carousel .wp-block-gallery .wp-block-image img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}
/* Aktiver mittlerer Slide etwas größer */
.tk-carousel-track > .wp-block-image.tk-active {
  transform: none;
  transition: transform 0.5s cubic-bezier(0.16,1,0.3,1);
  z-index: 2;
}

/* ============================================================
   Re-10 Punkt 13 (2026-06-07) — Worldmap-Section: weniger Leerraum
   Thomas: "etwas zusammenschieben, dass nicht so viel Leerplatz ist"
   Pre-h1 + Claim entfernt → H2 sitzt zu hoch im leeren Raum.
   Padding section runter, gap H2 → stats kürzer.
   ============================================================ */
section.worldmap {
  padding: 40px 24px 32px !important;
}
section.worldmap > .wrap {
  padding: 0 !important;
}
section.worldmap > .wrap h2,
section.worldmap > .wrap .wp-block-heading {
  margin: 0 0 28px !important;
  text-align: center !important;
  font-size: clamp(28px, 3.2vw, 44px) !important;
  line-height: 1.15 !important;
}
section.worldmap .worldmap-stats {
  margin-top: 0 !important;
}

/* ============================================================
   Footer Feinschliff (2026-06-07) — Thomas-Telegram 15:23
   - TRANSPORTTECHNIKER selbe Schriftart wie EUROPAWEIT (Outfit 900)
   - TRANSPORTTECHNIKER selbe Schriftgröße wie EUROPAWEIT
   - TRANSPORTTECHNIKER selbe orange Farbe wie IM EINSATZ (var(--orange))
   - Top-Left Bündigkeit: alle left:0, no offset
   - Weiße Unterlinien unter Service-Items entfernen
   ============================================================ */

/* TRANSPORTTECHNIKER (Kicker im Footer-Hero) — visuell wie EUROPAWEIT */
.tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  font-family: 'Outfit', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(28px, 2.6vw, 40px) !important;
  letter-spacing: -0.02em !important;
  line-height: 1.05 !important;
  text-transform: uppercase !important;
  color: var(--orange, #C8860D) !important;
  margin: 0 0 16px 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}

/* Hero-Spalte: alles bündig oben-links */
.tk-footer-band .tk-footer-col-hero {
  padding-top: 0 !important;
  padding-left: 0 !important;
  align-items: flex-start !important;
  text-align: left !important;
}
.tk-footer-band .tk-footer-col-hero > * {
  text-align: left !important;
  margin-left: 0 !important;
}
.tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  margin: 0 !important;
}

/* Weiße Linien unter Service-Items entfernen */
.tk-footer-band .tk-footer-col-services .tk-footer-line a {
  border-bottom: none !important;
  padding-bottom: 0 !important;
  display: inline !important;
}
.tk-footer-band .tk-footer-col-services .tk-footer-line a:hover {
  border-bottom: none !important;
  color: var(--orange, #C8860D) !important;
}

/* ============================================================
   Re-10 Punkt 15 v2 (2026-06-07) — Services-Section als
   "Goldene Vertikale" / Wasserfall (Thomas-Telegram 15:55)
   - Kein Gap zwischen Bild und Text (edge-to-edge)
   - Kein vertikaler Gap zwischen Rows
   - Bilder füllen Spalte komplett (object-fit cover)
   - Text-Spalte bekommt inneres Padding für Atem
   ============================================================ */

/* Container: keine vertikalen Gaps zwischen Rows */
section.services .svc-rows,
section.services > .wrap .svc-rows {
  gap: 0 !important;
  margin: 0 !important;
}
section.services .svc-row + .svc-row {
  margin-top: 0 !important;
}

/* Row: Spalten dicht aneinander (kein Spalten-Gap) */
section.services .svc-row {
  gap: 0 !important;
  margin: 0 !important;
  align-items: stretch !important;
}

/* Spalten: 50/50, kein Padding */
section.services .svc-row > .wp-block-column {
  padding: 0 !important;
  margin: 0 !important;
  flex-basis: 50% !important;
  max-width: 50% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

/* Bild-Spalte: Bild füllt 100% (edge-to-edge zur Mittelachse)
   2026-06-09: height:100% und aspect-ratio:auto entfernt — wird
   jetzt vom Fix 2026-06-09 (v2) Block am Dateiende kontrolliert. */
section.services .svc-row .svc-photo,
section.services .svc-row figure.wp-block-image {
  margin: 0 !important;
  width: 100% !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
  overflow: hidden !important;
}
section.services .svc-row .svc-photo img,
section.services .svc-row figure.wp-block-image img {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  margin: 0 !important;
}

/* Text-Spalte: inneres Padding für Atem (statt äußerem Gap) */
section.services .svc-row .wp-block-column:not(:has(figure.wp-block-image)):not(:has(.svc-photo)) {
  padding: 48px 56px !important;
}

/* Section: kein äußeres Padding, full-width Container */
section.services {
  padding: 0 !important;
}
section.services > .wrap {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}
/* Section-Head ("Von der Idee zur Umsetzung") bleibt zentriert mit Padding */
section.services .section-head {
  padding: 56px 36px 32px !important;
  margin: 0 !important;
  max-width: 1320px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ============================================================
   Re-10 Punkt 15 v2.1 — Spalten exakt 50/50 erzwingen
   ============================================================ */
section.services .svc-row > .wp-block-column,
section.services .svc-row > .wp-block-column[style*="flex-basis"] {
  flex: 0 0 50% !important;
  flex-basis: 50% !important;
  width: 50% !important;
  max-width: 50% !important;
  min-width: 0 !important;
}

/* Re-10 Punkt 15 v2.2 — box-sizing border-box damit Padding NICHT zur Breite addiert wird */
section.services .svc-row > .wp-block-column,
section.services .svc-row > .wp-block-column[style*="flex-basis"] {
  box-sizing: border-box !important;
}
section.services .svc-row > .wp-block-column * {
  box-sizing: border-box !important;
}

/* ============================================================
   Footer v2 (2026-06-07 Abend) — TT exakt gleich wie EUROPAWEIT
   Thomas-Telegram nochmal: selbe Schrift, selbe Größe, selbe Orange.
   Hero-Col von 42% auf 50% damit TT reinpasst, andere Spalten 25%/25%.
   Tighter letter-spacing damit TT visuell ähnliche Breite wie EUROPAWEIT.
   ============================================================ */

/* Spalten umverteilen — Hero breiter */
.tk-footer-band .tk-footer-col-hero,
.tk-footer-band .tk-footer-col-hero[style*="flex-basis"] {
  flex-basis: 50% !important;
  max-width: 50% !important;
}
.tk-footer-band .tk-footer-col-contact,
.tk-footer-band .tk-footer-col-contact[style*="flex-basis"],
.tk-footer-band .tk-footer-col-services,
.tk-footer-band .tk-footer-col-services[style*="flex-basis"] {
  flex-basis: 25% !important;
  max-width: 25% !important;
}

/* TT auf EXAKT EUROPAWEIT-Größe + sehr enge Buchstaben */
.tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  font-family: 'Outfit', sans-serif !important;
  font-weight: 900 !important;
  font-size: clamp(34px, 3.4vw, 50px) !important;
  letter-spacing: -0.045em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: var(--orange, #C8860D) !important;
  margin: 0 0 2px 0 !important;
  padding: 0 !important;
  white-space: nowrap !important;
}
/* EUROPAWEIT auch leicht runter damit beide harmonisch in Spalte sitzen */
.tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  font-size: clamp(34px, 3.4vw, 50px) !important;
  letter-spacing: -0.045em !important;
  line-height: 1 !important;
  margin: 0 !important;
}

/* Top-left Bündigkeit erzwingen */
.tk-footer-band .tk-footer-col-hero {
  padding: 0 !important;
  align-items: flex-start !important;
  text-align: left !important;
}
.tk-footer-band .tk-footer-col-hero > * {
  margin-left: 0 !important;
  text-align: left !important;
}

/* ============================================================
   Services-Section Proportionen (2026-06-08 morgens)
   Thomas-Feedback: "Bilder zu groß, links/rechts fehlt Rand,
   Proportionen waren ideal" — Rand zum Bildschirmrand zurück,
   Bilder kleiner, Mittelachse als Berührungspunkt.
   ============================================================ */

/* Section: side padding zurück damit Rand zum Bildschirmrand sichtbar */
section.services,
section.services.wp-block-group {
  padding: 56px 36px !important;
}

/* svc-rows Container constrainen */
section.services > .wrap,
section.services .svc-rows,
section.services > .wrap > .svc-rows {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
}

/* Jede Row: zentriert, max 1100px, gap 0 (Mittelachse) */
section.services .svc-row,
section.services .proj-row.svc-row {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  margin-top: 0 !important;
  margin-bottom: 8px !important; /* v1.5.2: dichter zusammen (User-Feedback) */
  gap: 0 !important;
}

/* Spalten 50/50 */
section.services .svc-row > .wp-block-column {
  flex-basis: 50% !important;
  max-width: 50% !important;
  margin: 0 !important;
}

/* Text-Spalte: padding für Atem */
section.services .svc-row > .wp-block-column:not(:has(.svc-photo, .wp-block-image)) {
  padding: 32px 40px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
}

/* Bild-Spalte: kein padding, Bild füllt komplett */
section.services .svc-row > .wp-block-column:has(.svc-photo),
section.services .svc-row > .wp-block-column:has(.wp-block-image) {
  padding: 0 !important;
}

/* Bilder: einheitlich 4:3, cover, kein Crop oder so */
section.services .svc-row .svc-photo,
section.services .svc-row .wp-block-image {
  width: 100% !important;
  margin: 0 !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
}
section.services .svc-row .svc-photo img,
section.services .svc-row .wp-block-image img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
}

/* Letzter Row keine bottom-margin */
section.services .svc-row:last-child {
  margin-bottom: 0 !important;
}

/* ============================================================
   H2-Bündigkeit: "Von der Idee" auf gleichen x wie "Wir krempeln"
   (2026-06-08 — Koren-Wunsch)
   ============================================================ */
section.services > .section-head,
section.services .section-head,
section.services .wp-block-group.section-head {
  max-width: 100% !important;
  margin-left: 60px !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  text-align: left !important;
}
section.services .section-head h2,
section.services .section-head .wp-block-heading {
  text-align: left !important;
  margin: 0 0 32px 0 !important;
}

/* ============================================================
   H2-Bündigkeit v2 (2026-06-08): section-head bei x=60,
   svc-rows weiter zentriert bei x=170.
   ============================================================ */
section.services {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
section.services > .wrap {
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
section.services .section-head,
section.services > .wrap > .section-head,
section.services .wp-block-group.section-head {
  max-width: 100% !important;
  margin: 0 0 32px 0 !important;
  padding: 0 0 0 60px !important;
  text-align: left !important;
}
section.services .section-head h2,
section.services .section-head .wp-block-heading {
  text-align: left !important;
  margin: 0 !important;
}

/* ============================================================
   H2-Bündigkeit v3 — alle Layout-Padding-Schichten resetten,
   dann section-head explizit auf x=60.
   ============================================================ */
section.services .wrap,
section.services .wp-block-group.wrap,
section.services .wrap.is-layout-constrained {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
section.services .wrap > *:not(.svc-rows) {
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* Section-Head ganz explizit auf x=60 */
section.services .section-head,
section.services .wrap > .section-head,
section.services .wp-block-group.section-head.has-global-padding {
  padding-left: 60px !important;
  max-width: 100% !important;
  margin: 0 0 32px 0 !important;
  text-align: left !important;
}

/* ============================================================
   H2-Bündigkeit v4 — negative margin um 36px Global-Padding
   zu kompensieren. Brutal aber funktioniert.
   ============================================================ */
section.services .section-head,
section.services .wrap > .section-head,
section.services .wp-block-group.section-head {
  margin-left: -36px !important;
  padding-left: 24px !important;
  padding-right: 0 !important;
  max-width: 100% !important;
  text-align: left !important;
}
section.services .section-head h2,
section.services .section-head .wp-block-heading {
  text-align: left !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* ============================================================
   H2-Bündigkeit v5 — Global-Padding-CSS-Variable killen
   ============================================================ */
section.services .has-global-padding {
  --wp--style--root--padding-left: 0px !important;
  --wp--style--root--padding-right: 0px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
section.services .section-head,
section.services .wp-block-group.section-head {
  padding-left: 60px !important;
  padding-right: 0 !important;
  margin: 0 0 32px 0 !important;
  max-width: 100% !important;
  text-align: left !important;
}
section.services .section-head h2 {
  text-align: left !important;
  margin: 0 !important;
}

/* ============================================================
   H2-Bündigkeit v6 — direkt auf h2 mit Negativ-Margin schießen
   ============================================================ */
section.services .section-head h2.wp-block-heading,
section.services > .wrap > .section-head > h2,
section.services .wp-block-heading {
  margin-left: -36px !important;
  text-align: left !important;
}
section.services .svc-rows h2,
section.services .svc-row h2,
section.services .proj-row h2 {
  margin-left: 0 !important;
}

/* ============================================================
   FINAL LAYOUT (2026-06-08): Alle Inhalte bündig links bei x=170,
   Block 1100px zentriert, gleicher Rand zum Bildschirmrand.
   Intro-Block + Services-Section identisch ausgerichtet.
   ============================================================ */

/* INTRO-BLOCK: max-width 1100px zentriert */
.intro-block {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
.intro-block .text-col {
  flex-basis: 55% !important;
  max-width: 760px !important;
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-left: 0 !important;
}

/* SERVICES-SECTION: alles bündig im 1100er Container */
section.services {
  padding-left: 0 !important;
  padding-right: 0 !important;
}
section.services > .wrap,
section.services .wp-block-group.wrap {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
  --wp--style--root--padding-left: 0px !important;
  --wp--style--root--padding-right: 0px !important;
}
/* Section-head innerhalb wrap, kein Extra-Padding */
section.services .section-head,
section.services .wp-block-group.section-head {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 0 40px 0 !important;
  padding: 0 !important;
  --wp--style--root--padding-left: 0px !important;
  --wp--style--root--padding-right: 0px !important;
}
section.services .section-head h2,
section.services .section-head h2.wp-block-heading,
section.services .section-head .wp-block-heading {
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
}
/* svc-rows + svc-row full width of wrap */
section.services .svc-rows {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
section.services .svc-row,
section.services .proj-row.svc-row {
  max-width: 100% !important;
  width: 100% !important;
  margin: 0 0 8px 0 !important; /* v1.5.2: dichter zusammen (User-Feedback) */
  gap: 0 !important;
}
section.services .svc-row:last-child {
  margin-bottom: 0 !important;
}
section.services .svc-row > .wp-block-column {
  flex-basis: 50% !important;
  max-width: 50% !important;
  margin: 0 !important;
}

/* H2-Shift Reset (kill alte v6 negativ-margins) */
section.services h2.wp-block-heading,
section.services .wp-block-heading {
  margin-left: 0 !important;
}

/* ============================================================
   Final-Final: section-head H2 explizit auf x=170 ziehen
   (60px Negativ-Kompensation für WP constrained layout)
   ============================================================ */
section.services .section-head > h2,
section.services .section-head > h2.wp-block-heading,
section.services .wp-block-group.section-head > h2,
section.services .wp-block-group.section-head > .wp-block-heading {
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  max-width: 100% !important;
  text-align: center !important;
  position: relative !important;
  left: 0 !important;
}

/* ============================================================
   Fix 1: "...und packen an." auf einer Zeile bleiben
   Fix 2: Worldmap H2 mittig zentrieren
   ============================================================ */
.intro-block .intro-bottom-row h2,
.intro-block .intro-bottom-row .wp-block-heading {
  white-space: nowrap !important;
  font-size: clamp(20px, 2vw, 32px) !important;
}

/* Worldmap H2: zentriert UND Wrapper auch */
section.worldmap > .wrap {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 0 !important;
}
section.worldmap > .wrap > h2,
section.worldmap > .wrap > .wp-block-heading {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
  max-width: 100% !important;
}
section.worldmap #tk-map {
  margin: 0 auto !important;
  max-width: 100% !important;
}

/* ============================================================
   Footer-Harmonie (Thomas 11:52): alle kleine weiße Schrift
   gleiche Größe + gleiche Line-Height + gleicher Zeilenabstand.
   Adress-Block (Thomas Krause/Grunowstr/13187) war 14px → 15px.
   ============================================================ */
.tk-footer-band .tk-footer-line,
.tk-footer-band .tk-footer-pill,
.tk-footer-band p,
.tk-footer-band .tk-footer-col-contact p,
.tk-footer-band .tk-footer-col-services p,
.tk-footer-band .tk-footer-col-services a {
  font-size: 15px !important;
  line-height: 1.6 !important;
  margin: 0 0 20px 0 !important;
}
.tk-footer-band .tk-footer-line:last-of-type,
.tk-footer-band .tk-footer-pill:last-of-type,
.tk-footer-band p:last-of-type {
  margin-bottom: 0 !important;
}
/* Address-Block: keine Sondergröße, kein Sondermargin */
.tk-footer-band .tk-footer-address-pills {
  margin: 14px 0 0 0 !important;
  padding: 0 !important;
}
.tk-footer-band .tk-footer-address-pills .tk-footer-pill {
  font-size: 15px !important;
  line-height: 1.6 !important;
  margin: 0 0 20px 0 !important;
}

/* ============================================================
   Footer-Spalten mit Flex+gap für exakt gleiche Zeilenabstände
   (kein Margin-Collapse, keine Wrapper-Padding-Drifts)
   ============================================================ */
.tk-footer-band .tk-footer-col-contact,
.tk-footer-band .tk-footer-col-services {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
}
.tk-footer-band .tk-footer-col-contact .tk-footer-address-pills {
  display: flex !important;
  flex-direction: column !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}
.tk-footer-band .tk-footer-line,
.tk-footer-band .tk-footer-pill,
.tk-footer-band .tk-footer-col-contact p,
.tk-footer-band .tk-footer-col-services p,
.tk-footer-band .tk-footer-col-services a {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15px !important;
  line-height: 1.6 !important;
}
/* Kicker oben (KONTAKT, SERVICELEISTUNGEN) bleiben ihre Größe */
.tk-footer-band .tk-footer-col-contact .tk-footer-kicker,
.tk-footer-band .tk-footer-col-services .tk-footer-kicker {
  font-size: 11px !important;
  margin: 0 0 8px 0 !important;
}

/* Service-Link padding-bottom rest killen (war für Underlines, jetzt aus) */
.tk-footer-band .tk-footer-col-services .tk-footer-line a {
  display: inline !important;
  border-bottom: none !important;
  padding: 0 !important;
  margin: 0 !important;
  line-height: 1.6 !important;
}

/* ============================================================
   Intro-Block ZENTRIERT (Thomas 2026-06-08 Abend)
   text-col jetzt mittig statt links anchored. Max 760px wie vorher,
   aber margin-auto links und rechts.
   Services-Block bleibt unverändert.
   ============================================================ */
.intro-block {
  justify-content: flex-start !important;
  align-items: flex-start !important;
}
.intro-block .text-col {
  flex-basis: 760px !important;
  max-width: 760px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
}

/* ============================================================
   Projekt-Text-Spalten als orange-gerahmte Blöcke
   (Thomas 23:01): Text neben Bild bekommt Orange-Rahmen
   nur auf einzelnen Projekt-Posts, NICHT auf Services-Section.
   ============================================================ */
body.single-post .proj-row:not(.svc-row) > .wp-block-column:not(:has(.wp-block-image)):not(:empty) {
  border: 2px solid var(--orange, #C8860D) !important;
  padding: 22px 26px !important;
  background: transparent !important;
  box-sizing: border-box !important;
}
/* Falls Bild-Spalte versehentlich getroffen wird, reset */
body.single-post .proj-row:not(.svc-row) > .wp-block-column:has(.wp-block-image) {
  border: none !important;
  padding: 0 !important;
}
/* Innenabstand falls Lead-Paragraph drinsteckt */
body.single-post .proj-row:not(.svc-row) > .wp-block-column:not(:has(.wp-block-image)) p {
  margin: 0 0 12px 0 !important;
}
body.single-post .proj-row:not(.svc-row) > .wp-block-column:not(:has(.wp-block-image)) p:last-child {
  margin-bottom: 0 !important;
}

/* ============================================================
   Blocksatz für Projekt-Text-Spalten (Thomas-Wunsch)
   Alle Texte in proj-row Text-Spalten werden Blocksatz
   (text-align: justify). Plus .blocksatz-Klasse für freie
   Anwendung in beliebigen Blöcken via "Zusätzliche CSS-Klasse".
   ============================================================ */
body.single-post .proj-row:not(.svc-row) > .wp-block-column:not(:has(.wp-block-image)) p {
  text-align: justify !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
}
.blocksatz,
p.blocksatz {
  text-align: justify !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
}

/* Block-Stil "Blocksatz" rendert ihn auch im Editor sichtbar */
.is-style-blocksatz {
  text-align: justify !important;
  hyphens: auto !important;
  -webkit-hyphens: auto !important;
}

/* ============================================================
   Orange-Border RAUS aus Projekt-Text-Spalten (Thomas-Korrektur)
   Nur Blocksatz, keine Umrandung.
   ============================================================ */
body.single-post .proj-row:not(.svc-row) > .wp-block-column:not(:has(.wp-block-image)):not(:empty) {
  border: none !important;
  padding: 0 !important;
  background: transparent !important;
}

/* ============================================================
   Thomas darf Schriftgröße per WP-Sidebar überschreiben
   - Wenn er S/M/L/XL/XXL wählt → Klasse `has-XXX-font-size`
   - Wenn er Custom-Pixel wählt → inline style
   Meine Default-Regeln dürfen nicht mehr !important blocken.
   ============================================================ */

/* ...und packen an. — default size, aber überschreibbar */
.intro-block .intro-bottom-row h2:not([class*="has-"]):not([style*="font-size"]),
.intro-block .intro-bottom-row .wp-block-heading:not([class*="has-"]):not([style*="font-size"]) {
  font-size: clamp(20px, 2vw, 32px) !important;
}
/* Wenn User Has-XXX-font-size gewählt hat, soll das gewinnen */
.intro-block .intro-bottom-row h2.has-small-font-size,
.intro-block .intro-bottom-row h2.has-medium-font-size,
.intro-block .intro-bottom-row h2.has-large-font-size,
.intro-block .intro-bottom-row h2.has-x-large-font-size,
.intro-block .intro-bottom-row h2.has-xx-large-font-size {
  font-size: var(--wp--preset--font-size--small, 14px) !important;
}
.intro-block .intro-bottom-row h2.has-medium-font-size {
  font-size: var(--wp--preset--font-size--medium, 18px) !important;
}
.intro-block .intro-bottom-row h2.has-large-font-size {
  font-size: var(--wp--preset--font-size--large, 28px) !important;
}
.intro-block .intro-bottom-row h2.has-x-large-font-size {
  font-size: var(--wp--preset--font-size--x-large, 40px) !important;
}
.intro-block .intro-bottom-row h2.has-xx-large-font-size {
  font-size: var(--wp--preset--font-size--xx-large, 56px) !important;
}
/* Inline-Style font-size (custom px) gewinnt sowieso wegen inline-spezifität */

/* ============================================================
   GLOBAL: User-Font-Size-Auswahl gewinnt überall
   (am Ende von style.css → überschreibt alle theme-defaults)
   - S/M/L/XL/XXL Klassen → WP-Preset-Variablen
   - Custom-Pixel (inline style) → gewinnt automatisch
   ============================================================ */
.has-small-font-size {
  font-size: var(--wp--preset--font-size--small, 14px) !important;
}
.has-medium-font-size {
  font-size: var(--wp--preset--font-size--medium, 18px) !important;
}
.has-large-font-size {
  font-size: var(--wp--preset--font-size--large, 28px) !important;
}
.has-x-large-font-size {
  font-size: var(--wp--preset--font-size--x-large, 40px) !important;
}
.has-xx-large-font-size {
  font-size: var(--wp--preset--font-size--xx-large, 56px) !important;
}
/* Custom font-size via inline style braucht keine Regel — Browser-Default
   priorisiert inline > stylesheet, aber wir setzen es nochmal für Sicherheit */
[style*="font-size"] {
  /* inline-style schon vorhanden, nichts zu tun */
}

/* ============================================================
   Thomas darf Abstände (Padding/Margin) per Sidebar überschreiben
   Inline-Style aus Block-Editor "Maße" gewinnt jetzt überall.
   ============================================================ */
/* Wenn ein Block inline padding hat, soll meine !important-Regel weichen */
.wp-block-group[style*="padding"][style] {
  padding: revert !important;
}
.wp-block-group[style*="margin"][style] {
  margin: revert !important;
}
/* Aber wir wollen die spezifischen inline-Werte respektieren — die werden
   automatisch durch inline-style angewendet (höhere Spezifität als
   theme-Regeln auch ohne !important am inline) */

/* ============================================================
   Karussell überall full-width (auch in Projekten + Service-Seiten)
   Egal in welchem Container — calc(50% - 50vw) zieht Element auf
   volle Viewport-Breite.
   ============================================================ */
.tk-carousel,
.tk-carousel-wrap,
.wp-block-group.tk-carousel {
  width: 100vw !important;
  max-width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  overflow: hidden !important;
}

/* ============================================================
   ARBEITSBEISPIELE: Pfeil → entfernen
   Nur für den Hauptseite Arbeitsbeispiele-Link, nicht für andere
   svc-link Pfeile (Weiterlesen behält Pfeil).
   ============================================================ */
.intro-block .svc-link::after,
.intro-block .intro-bottom-row .svc-link::after,
p.svc-link a[href="/projekte/"] + ::after,
.intro-bottom-row p.svc-link::after {
  content: none !important;
  display: none !important;
}
/* Globaler: jeder svc-link der ARBEITSBEISPIELE enthält */
.intro-block p.svc-link::after,
.intro-bottom-row p.svc-link::after,
.intro-block p.svc-link:hover::after,
.intro-bottom-row p.svc-link:hover::after {
  display: none !important;
  content: '' !important;
}

/* ============================================================
   Fix 1: Hero-Aside ("Noch Fragen?") vertikal mittig zum Bild
            + bisschen tiefer
   Fix 2: Hauptseite Beiträge-Cards engerer Abstand
   ============================================================ */

/* Fix 1: Hero-Row Alignment auf center, Aside leicht runter */
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row {
  align-items: flex-start !important;
}
body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside {
  margin-top: clamp(80px, 16vw, 200px) !important;
}

/* Fix 2: Beiträge-Cards Abstand reduzieren auf Hauptseite */
.ref-grid {
  gap: 18px !important;
}
.ref-grid .ref-card {
  margin: 0 !important;
}

/* Konsistente Abstände überall: Beiträge auf /beitraege/ + Hauptseite */
.wp-block-group .ref-grid,
section .ref-grid {
  gap: 18px !important;
}

/* ============================================================
   TRANSPORTTECHNIKER tick nach oben damit cap-height bündig
   mit KONTAKT-Label visualisiert.
   ============================================================ */
.tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-top: 0 !important;
}

/* re10a5 — Footer-Buttons (Projekte/Das sind wir/Beiträge) bündig mit Kontakt-Spalte */
@media (min-width: 901px) {
  .tk-footer-band .tk-footer-pills.is-content-justification-right,
  .tk-footer-band .tk-footer-pills {
    justify-content: flex-start !important;
    padding-left: 50% !important;
  }
}

/* ============================================================
   Fix 2026-06-09 (v3 — svc-tighter): svc-row enger ohne Crop.
   Vorher: min-height: 420px zwang Rows zu 420px Hoehe → leeres
   Drittel unter kurzem Text. Jetzt: Rows shrinken auf Content-
   Hoehe. Bilder behalten natuerliche aspect-ratio (object-fit:
   contain bleibt — keine abgeschnittenen CAD-Tabellen). Row-to-
   Row Margin bleibt 32px ueber den frueheren Block (Zeile 2273).
   Image-Gaps koennen leicht variieren — Gesamteindruck kompakt
   statt halb-leer.
   ============================================================ */
section.services .svc-row.wp-block-columns,
section.services .svc-row {
  align-items: stretch !important;
  min-height: 0 !important;
}
section.services .svc-row > .wp-block-column,
section.services .svc-row > .wp-block-column.is-vertically-aligned-center {
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  min-height: 0 !important;
}
/* Spalten, die das Foto enthalten, oben anliegen — sonst entstehen
   ungleichmaessige Gaps wenn Text-Spalte hoeher waechst als Bild. */
section.services .svc-row > .wp-block-column:has(.svc-photo),
section.services .svc-row > .wp-block-column:has(figure.wp-block-image) {
  justify-content: flex-start !important;
}
section.services .svc-row > .wp-block-column:first-child {
  justify-content: flex-start !important;
}
section.services .svc-row .svc-photo {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  background: transparent !important;
  overflow: hidden !important;
}
section.services .svc-row .svc-photo img,
section.services .svc-row .svc-photo img[src],
section.services .svc-row figure.wp-block-image img,
body section.services .svc-row .svc-photo img {
  height: 100% !important;
  width: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  background: transparent !important;
}

/* Re-09 Punkt: svc-row Bild-zu-Bild Abstand gleichmaessig — Solution B */
/* Problem: Bild sass am Top der Spalte; bei langem Text-Schwester wuchs Row → grosser Gap unten zur naechsten Row. */
/* Fix: Bild + Spalte strecken sich auf Row-Hoehe; object-fit:contain absorbiert Aspect-Differenz INNERHALB der Row (Letterbox), nicht zwischen Rows. */
section.services .svc-row,
.svc-row,
.svc-row.wp-block-columns {
  align-items: stretch !important;
}
section.services .svc-row .wp-block-column,
.svc-row .wp-block-column {
  align-self: stretch !important;
  height: auto !important;
  display: flex !important;
  flex-direction: column !important;
}
section.services .svc-row .svc-photo,
.svc-row .svc-photo,
.svc-row .wp-block-image.svc-photo,
.svc-row figure.svc-photo {
  align-self: stretch !important;
  height: 100% !important;
  flex: 1 1 auto !important;
  display: flex !important;
  margin: 0 !important;
}
section.services .svc-row .svc-photo img,
.svc-row .svc-photo img,
.svc-row figure img {
  height: 100% !important;
  width: 100% !important;
  max-height: none !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  aspect-ratio: auto !important;
  display: block !important;
  background: #f7f7f5 !important;
}


/* Re-09 Punkt: svc-row Bild-Rhythmus (1.5.4) — visuelle Bildkanten in gleichem Abstand
   Problem: object-fit:contain + variable Row-Hoehen → Letterbox unterschiedlich gross
   Loesung C: Bild auf natuerlicher Hoehe (max 400px), in Spalte zentriert; Row-Hoehe align center.
   Visuelle Bild-Mitten gleich-distanziert; kein Letterbox-Versatz mehr.
   Specificity-Bump: html body … schlaegt die fruehere body section.services Regel. */
html body section.services .svc-row,
html body section.services .svc-row.wp-block-columns {
  align-items: center !important;
  min-height: 0 !important;
}
html body section.services .svc-row > .wp-block-column,
html body section.services .svc-row > .wp-block-column.is-vertically-aligned-center {
  align-self: center !important;
  justify-content: flex-start !important;
  min-height: 0 !important;
  height: auto !important;
}
html body section.services .svc-row .svc-photo,
html body section.services .svc-row figure.svc-photo,
html body section.services .svc-row .wp-block-image.svc-photo {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: auto !important;
  min-height: 0 !important;
  flex: 0 0 auto !important;
  background: transparent !important;
}
html body section.services .svc-row .svc-photo img,
html body section.services .svc-row figure.wp-block-image img,
html body section.services .svc-row figure img {
  height: auto !important;
  width: 100% !important;
  max-width: 100% !important;
  max-height: 400px !important;
  min-height: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  aspect-ratio: auto !important;
  display: block !important;
  background: transparent !important;
  margin: 0 auto !important;
}

/* Re-09 Punkt (Fix 2 1.5.4): zusaetzlich Row-Hoehe fixieren — sonst variiert sie mit Text-Laenge */
html body section.services .svc-row,
html body section.services .svc-row.wp-block-columns {
  min-height: 420px !important;
  height: 420px !important;
  max-height: 420px !important;
}
html body section.services .svc-row > .wp-block-column {
  height: 420px !important;
  max-height: 420px !important;
  overflow: hidden !important;
  justify-content: flex-start !important;
}
/* Text-Spalte: kein Overflow-Cut, scrollt nicht — Text passt in 420px wenn Padding klein */
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)) {
  overflow: visible !important;
}

/* Re-09 Fix 3 (1.5.4): alle Bilder identische sichtbare Hoehe (380px) — eliminiert Letterbox-Versatz
   object-fit:contain bleibt; bei Aspect-Mismatch ist Letterbox dann gleich gross in allen Rows. */
html body section.services .svc-row .svc-photo,
html body section.services .svc-row figure.svc-photo,
html body section.services .svc-row .wp-block-image.svc-photo {
  height: 380px !important;
  max-height: 380px !important;
  min-height: 380px !important;
}
html body section.services .svc-row .svc-photo img,
html body section.services .svc-row figure.wp-block-image img,
html body section.services .svc-row figure img {
  height: 380px !important;
  max-height: 380px !important;
  min-height: 380px !important;
  width: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
}

/* ============================================================
   1.5.5 — svc-row FLUSH & TIGHT (2026-06-09)
   Ziel: Bilder buendig in der Row (kein 20px innen oben/unten),
   Row-zu-Row Gap ~16px statt 48px visuell.
   Strategie: Row-Hoehe = Image-Hoehe = 380px, align-items:stretch
   damit der .svc-photo Container die volle Row-Hoehe fuellt.
   Bild bleibt durch object-fit:contain vollstaendig sichtbar.
   ============================================================ */
html body section.services .svc-row,
html body section.services .svc-row.wp-block-columns {
  height: 380px !important;
  min-height: 380px !important;
  max-height: 380px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  align-items: stretch !important;
}
html body section.services .svc-row:first-of-type {
  margin-top: 0 !important;
}
html body section.services .svc-row > .wp-block-column {
  height: 380px !important;
  min-height: 380px !important;
  max-height: 380px !important;
  align-self: stretch !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  overflow: hidden !important;
}
html body section.services .svc-row .svc-photo,
html body section.services .svc-row figure.svc-photo,
html body section.services .svc-row .wp-block-image.svc-photo {
  height: 380px !important;
  min-height: 380px !important;
  max-height: 380px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex: 1 0 auto !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}
html body section.services .svc-row .svc-photo img,
html body section.services .svc-row figure.wp-block-image img,
html body section.services .svc-row figure img {
  height: 380px !important;
  max-height: 380px !important;
  min-height: 380px !important;
  width: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  aspect-ratio: auto !important;
  display: block !important;
  margin: 0 !important;
}
/* Text-Spalte: vertikal zentriert in 380px, overflow hidden cuttet zu langen Text */
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)) {
  overflow: hidden !important;
  justify-content: flex-start !important;
}

/* 1.5.5 Fix: Text-Spalten Padding reduzieren — sonst overflow bei langen Beschreibungen
   48px → 24px vertikal gibt 48px Platz zurueck. */
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)),
html body section.services .svc-row > .wp-block-column:not(:has(img)) {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
}

/* 1.5.5 Fix v2: Specificity-Bump — die Regel um Zeile 2310 hat (0,5,2),
   meine erste hatte nur (0,4,4). Klasse hinzufuegen damit (0,5,4) > (0,5,2). */
html body section.services .svc-row.wp-block-columns > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)) {
  padding-top: 24px !important;
  padding-bottom: 24px !important;
  padding-left: 73px !important;
  padding-right: 73px !important;
}

/* 1.5.5 Fix v3: Havariekommissariat-Row hat p has-medium-font-size (16px / lh 26.4).
   Andere Rows nutzen 15.5px / 25.6 — normalisieren auf 15.5px damit alle Texte in 380px passen. */
html body section.services .svc-row p.has-medium-font-size,
html body section.services .svc-row .wp-block-column p.has-medium-font-size {
  font-size: 15.5px !important;
  line-height: 25.575px !important;
}

/* 1.5.5 Fix v4: Margins zwischen H3 und P leicht reduzieren — beseitigt Restueberlauf in Havariekommissariat. */
html body section.services .svc-row .wp-block-column h3,
html body section.services .svc-row .wp-block-column h3.wp-block-heading {
  margin-bottom: 8px !important;
}
html body section.services .svc-row .wp-block-column p,
html body section.services .svc-row .wp-block-column p.wp-block-paragraph {
  margin-bottom: 12px !important;
}
html body section.services .svc-row .wp-block-column p.svc-link {
  margin-bottom: 0 !important;
}

/* 1.5.5 Fix v5: H3 line-height leicht reduzieren — 3-zeilige H3 in Havariekommissariat
   braucht noch 3px weniger; lh 38.4 → 36 schluckt 6px ueber 3 Zeilen. */
html body section.services .svc-row .wp-block-column h3,
html body section.services .svc-row .wp-block-column h3.wp-block-heading {
  line-height: 36px !important;
}

/* ============================================================
   2026-06-09 — svc-row Bilder Richtung Mitte verschieben
   Layout bleibt alternierend (Bild-Text / Text-Bild), aber die
   Bilder rücken in ihrer Spalte näher zur Spaltentrenn-Linie
   (= horizontale Seitenmitte). Bild wird auf 85% Spaltenbreite
   verkleinert, dann horizontal innerhalb der Spalte ausgerichtet:
   - svc-row:nth-child(odd) (Row 0, 2): Bild-Spalte links → Bild rechtsbündig
   - svc-row:nth-child(even) (Row 1, 3): Bild-Spalte rechts → Bild linksbündig
   Resultat: innere Kanten aller Bilder treffen sich an der Mitte.
   ============================================================ */
html body section.services .svc-row .svc-photo,
html body section.services .svc-row figure.wp-block-image.svc-photo {
  width: 85% !important;
  max-width: 85% !important;
}
html body section.services .svc-row .svc-photo img,
html body section.services .svc-row figure.wp-block-image.svc-photo img {
  width: 100% !important;
}

/* Rows mit Bild-Spalte LINKS (order 1) — Bild nach rechts schieben */
html body section.services .svc-row:nth-of-type(odd) .svc-photo,
html body section.services .svc-row:nth-of-type(odd) figure.wp-block-image.svc-photo {
  margin-left: auto !important;
  margin-right: 7px !important;
}

/* Rows mit Bild-Spalte RECHTS (order 2) — Bild nach links schieben */
html body section.services .svc-row:nth-of-type(even) .svc-photo,
html body section.services .svc-row:nth-of-type(even) figure.wp-block-image.svc-photo {
  margin-left: 7px !important;
  margin-right: auto !important;
}

/* ============================================================
   Fix 2026-06-09 (footer-3fixes) — Buttons ohne Kaestchen.
   Projekte/Das sind wir/Beitraege: keine Border, kein Background,
   kein Hintergrund-Hover (orange Fill). Reine Text-Links.
   Mehr horizontaler Spacing zwischen Links via padding-right.
   ============================================================ */
html body .tk-footer-band .tk-footer-pills .wp-block-button__link,
html body .tk-footer-band .tk-footer-pills .wp-block-button.tk-footer-btn-square .wp-block-button__link,
html body .tk-footer-band .tk-footer-pills a,
html body .tk-footer-band .tk-footer-pills .btn {
  border: none !important;
  background: transparent !important;
  padding-left: 0 !important;
  padding-right: 16px !important;
  padding-top: 3.5px !important;
  padding-bottom: 4px !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}
html body .tk-footer-band .tk-footer-pills .wp-block-button__link:hover,
html body .tk-footer-band .tk-footer-pills .wp-block-button.tk-footer-btn-square .wp-block-button__link:hover,
html body .tk-footer-band .tk-footer-pills a:hover {
  border: none !important;
  background: transparent !important;
  color: var(--orange-light, #fbbf24) !important;
  text-decoration: underline !important;
  text-underline-offset: 4px !important;
}

/* ============================================================
   2026-06-09 — TT-K glyph-top alignment (visual cap fluchten)
   Pixel-scan: TT first-orange y=38 vs K first-orange y=32
   → TT glyph sits 6px tiefer als KONTAKT (font-internal leading
   bei Outfit 900 @ 49px line-height). Box-tops sind identisch
   bei y=500.5, aber die VISUELLEN cap-tops driften 6px.
   Fix: TT um 6px hoch ziehen via margin-top:-6px.
   ============================================================ */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-top: -46px !important;
}

/* ============================================================
   2026-06-09 (1.5.10) — CAD-Row Fix: einheitliche svc-row Bilder
   Problem: object-fit:contain + variierende Bild-Aspect-Ratios
   verursachten unterschiedlich grosse Letterbox-Stripes
   (sichtbarer bei CAD-Row, Bild 468x330 vs 1024x768 anderer).
   Loesung: object-fit:cover an LETZTER Stelle erzwingen — gleiche
   visuelle Bild-Hoehe und gleiche Gaps fuer alle 4 Rows.
   ============================================================ */
html body section.services .svc-row .svc-photo img,
html body section.services .svc-row figure.wp-block-image img,
html body section.services .svc-row figure.wp-block-image.svc-photo img,
html body section.services .svc-row figure img {
  height: 380px !important;
  max-height: 380px !important;
  min-height: 380px !important;
  width: 100% !important;
  max-width: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  margin: 0 !important;
  display: block !important;
}

/* ============================================================
   KARUSSELL-PFEILE — Re-Sichtbarkeit (2026-06-10)
   Wrap ist 100vw + ueberbreit (negative margin) => right:0 landet
   off-screen. Pfeile auf viewport-Kante einrueckend positionieren.
   Auto-Marquee laeuft weiter, Click scrollt manuell um Card-Breite.
   ============================================================ */
.tk-carousel-wrap .tk-carousel-btn {
  position: absolute !important;
  top: 50% !important;
  z-index: 10 !important;
  width: 52px !important;
  height: 52px !important;
  border: none !important;
  cursor: pointer !important;
  background: rgba(0, 10, 48, 0.78) !important;
  color: #fff !important;
  font-size: 28px !important;
  line-height: 1 !important;
  font-family: Outfit, sans-serif !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25) !important;
  transition: background .2s var(--ease), transform .2s var(--ease) !important;
  transform: translateY(-50%) !important;
  opacity: 1 !important;
  visibility: visible !important;
}
.tk-carousel-wrap .tk-carousel-btn.prev {
  left: max(24px, calc((100% - 100vw) / 2 + 24px)) !important;
  right: auto !important;
}
.tk-carousel-wrap .tk-carousel-btn.next {
  right: max(24px, calc(100% - 100vw + 24px)) !important;
  left: auto !important;
}
.tk-carousel-wrap .tk-carousel-btn:hover {
  background: var(--orange) !important;
  transform: translateY(-50%) scale(1.08) !important;
}
.tk-carousel-wrap .tk-carousel-btn:focus-visible {
  outline: 2px solid #fff !important;
  outline-offset: 3px !important;
}
@media (max-width: 768px) {
  .tk-carousel-wrap .tk-carousel-btn {
    width: 44px !important;
    height: 44px !important;
    font-size: 24px !important;
  }
  .tk-carousel-wrap .tk-carousel-btn.prev { left: 12px !important; }
  .tk-carousel-wrap .tk-carousel-btn.next { right: 12px !important; }
}

/* ============================================================
   Re-10 (2026-06-11) — svc-row Text top-bündig mit Bild
   WP fügt is-vertically-aligned-center → align-self:center
   Bei kurzem Text rutscht der Text mittig in der 380px-Zeile.
   Fix: Alle Spalten flex-start, H3 ohne margin-top,
   Text-Spalte padding-top:0.
   ============================================================ */
html body section.services .svc-row.wp-block-columns > .wp-block-column,
html body section.services .svc-row.wp-block-columns > .wp-block-column.is-vertically-aligned-center,
html body section.services .svc-row > .wp-block-column,
html body section.services .svc-row > .wp-block-column.is-vertically-aligned-center {
  align-self: flex-start !important;
  padding-top: 0 !important;
}
html body section.services .svc-row .wp-block-column > h3:first-child,
html body section.services .svc-row .wp-block-column > h3.wp-block-heading:first-child {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Re-10 Fix-v2: padding-top:24px aus Zeile 3308/3315 ueberschreiben
   gleiche Specificity (0,6,3), aber Position spaeter → gewinnt */
html body section.services .svc-row.wp-block-columns > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)) {
  padding-top: 0 !important;
}
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-top: 0 !important;
}

/* Re-10 — Section-Head H2 "Von der Idee zur Umsetzung" mittig */
html body .section-head h2.wp-block-heading,
html body .wp-block-group.section-head > h2,
html body .wp-block-group.section-head h2 {
  text-align: center !important;
}

/* Re-10 Fix-v2 — Section-Head H2 wirklich mittig (override section.services rules) */
html body section.services .section-head,
html body section.services > .section-head,
html body section.services .wp-block-group.section-head {
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
html body section.services .section-head h2,
html body section.services .section-head h2.wp-block-heading,
html body section.services .section-head .wp-block-heading {
  text-align: center !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ============================================================
   Re-10 (2026-06-11) Footer-Fix:
   - "UND EUROPA" leicht nach unten, naeher zur "Trennlinie"
   - Projekte/Das sind wir/Beitraege hoch ziehen → auf Berlin-Linie
   ============================================================ */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  display: inline-block !important;
  margin-top: 18px !important;
}
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills {
  margin-top: -89.5px !important;
  position: relative !important;
  z-index: 2 !important;
}

/* Re-10 Footer-Fix v2: Projekte/Das sind wir/Beitraege NACH RECHTS (mockup zeigt sie unter SERVICELEISTUNGEN-col) */
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills.is-content-justification-right {
  justify-content: flex-end !important;
}

/* Re-10 Footer v3: Projekte LINKS-buendig mit SERVICELEISTUNGEN-col (x=1086);
   EUROPA 4px tiefer (Buchstaben-Baseline mit Berlin-Baseline) */
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills.is-content-justification-right {
  justify-content: flex-start !important;
  padding-left: 960px !important;
  padding-right: 0 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  margin-top: 8px !important;
}

/* Re-10 (2026-06-11): kleinerer Abstand zwischen Blatt-Satz und Welt-Karte */
html body section.dark-cta {
  padding-top: 36px !important;
  padding-bottom: 24px !important;
}
html body section.worldmap {
  padding-top: 24px !important;
}

/* Re-10 (2026-06-11) — Header-Dropdown Sicherheitsabstände
   Vorher: Items kleben am Rand (padding 4px 2px), Container 0px horizontal.
   Jetzt: 12px vertikal Container, 10px/24px Items, min-width für Lesbarkeit. */
html body header .wp-block-navigation__submenu-container,
html body .wp-block-navigation__submenu-container {
  padding: 12px 0 !important;
  min-width: 320px !important;
  box-shadow: 0 8px 32px rgba(0, 10, 48, 0.12) !important;
  border: 0 !important;
  border-radius: 4px !important;
}
html body .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 10px 24px !important;
  display: block !important;
}
html body .wp-block-navigation__submenu-container .wp-block-navigation-item:hover > .wp-block-navigation-item__content,
html body .wp-block-navigation__submenu-container .wp-block-navigation-item__content:hover {
  background-color: rgba(0, 10, 48, 0.04) !important;
}

/* ============================================================
   Re-10 (2026-06-11) — proj-rows wie svc-rows formatieren:
   - Bild + Text top-buendig (statt vertically centered)
   - Engerer center-gap zwischen Bild und Text
   - Engerer vertikaler Abstand zwischen Reihen
   - Bilder leicht zueinander geshifftet wie auf Hauptseite
   ============================================================ */
@media (min-width: 782px) {
  html body .proj-row.wp-block-columns {
    align-items: flex-start !important;
    gap: 14px !important;
  }
  html body .proj-row .wp-block-column {
    align-self: flex-start !important;
    justify-content: flex-start !important;
  }
  html body .proj-row + .proj-row {
    margin-top: 0 !important;
  }
  html body .proj-row .wp-block-image {
    align-self: flex-start !important;
    margin-top: 0 !important;
  }
}

/* Re-10 Fix-v2 — Dropdown Items Padding mit hoeherer Specificity */
html body .tk-header-inner .tk-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content,
html body header .tk-nav .wp-block-navigation__submenu-container .wp-block-navigation-item__content {
  padding: 10px 24px !important;
  line-height: 1.4 !important;
}

/* ============================================================
   Re-10 (2026-06-11) — Leistungen-Pages (4/5/6/7) zentriert,
   H1 + Body buendig auf gleicher x-Achse.
   Vorher: H1 bei x=126, Body bei x=210 → 84px Versatz
   Jetzt: beides bei x=200 (1100px Container zentriert auf 1500px)
   ============================================================ */
body.page.page-id-4 .entry-content,
body.page.page-id-5 .entry-content,
body.page.page-id-6 .entry-content,
body.page.page-id-7 .entry-content {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.page.page-id-4 .single-lead,
body.page.page-id-5 .single-lead,
body.page.page-id-6 .single-lead,
body.page.page-id-7 .single-lead,
body.page.page-id-4 .entry-content > section.wp-block-group,
body.page.page-id-5 .entry-content > section.wp-block-group,
body.page.page-id-6 .entry-content > section.wp-block-group,
body.page.page-id-7 .entry-content > section.wp-block-group {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
body.page.page-id-4 .entry-content h1,
body.page.page-id-5 .entry-content h1,
body.page.page-id-6 .entry-content h1,
body.page.page-id-7 .entry-content h1,
body.page.page-id-4 .single-lead h1,
body.page.page-id-5 .single-lead h1,
body.page.page-id-6 .single-lead h1,
body.page.page-id-7 .single-lead h1 {
  text-align: left !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  max-width: 100% !important;
}
body.page.page-id-4 .entry-content .wp-block-column,
body.page.page-id-5 .entry-content .wp-block-column,
body.page.page-id-6 .entry-content .wp-block-column,
body.page.page-id-7 .entry-content .wp-block-column,
body.page.page-id-4 .entry-content .wp-block-paragraph,
body.page.page-id-5 .entry-content .wp-block-paragraph,
body.page.page-id-6 .entry-content .wp-block-paragraph,
body.page.page-id-7 .entry-content .wp-block-paragraph {
  margin-left: 0 !important;
  padding-left: 0 !important;
}



/* Re-10 Fix-v2 — .detail-body Margin killen (war 0 10px → 10px-Versatz) */
body.page.page-id-4 .detail-body,
body.page.page-id-5 .detail-body,
body.page.page-id-6 .detail-body,
body.page.page-id-7 .detail-body,
body.page.page-id-4 .wp-block-columns.wrap.detail-body,
body.page.page-id-5 .wp-block-columns.wrap.detail-body,
body.page.page-id-6 .wp-block-columns.wrap.detail-body,
body.page.page-id-7 .wp-block-columns.wrap.detail-body {
  margin-left: 0 !important;
  margin-right: 0 !important;
  max-width: 1100px !important;
  width: 100% !important;
}

/* ============================================================
   Re-10 (2026-06-11) — Leistungen-Pages Text mittig:
   Die wp-block-columns.wrap.detail-body hat nur 1 col bei 60% width.
   Bei Solo-Column auf 100% setzen, dann zentriert sich Text mit H1.
   ============================================================ */
@media (min-width: 782px) {
  html body .wrap.detail-body.wp-block-columns:has(> .wp-block-column:only-child) > .wp-block-column {
    flex-basis: 100% !important;
    max-width: 100% !important;
  }
}

/* Re-10 v3: proj-row vertikaler Abstand HART auf 14px (statt 56-64px aus WP gap-Berechnung) */
html body .proj-row.wp-block-columns,
html body .single-body .proj-row.wp-block-columns,
html body .detail-body .proj-row.wp-block-columns {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}
html body .proj-row.wp-block-columns:first-of-type,
html body .single-body .proj-row.wp-block-columns:first-of-type {
  margin-top: 0 !important;
}
html body .proj-row.wp-block-columns + .proj-row.wp-block-columns {
  margin-top: 0 !important;
}

/* Re-10 v4 (2026-06-12): H3-Footer line-height aufweiten — Abstände zwischen UNTERWEGS/IN DEUTSCHLAND/UND EUROPA visuell wie rechte Kontakt-Spalte. EUROPA-Span margin-top auf 0 (line-height macht den Job). */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  line-height: 1.1 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  margin-top: 0 !important;
}

/* Re-10 (2026-06-12): portrait-grid alle Bilder als 1:1 Quadrat — egal ob portrait-tile-Klasse gesetzt ist */
.portrait-grid .wp-block-image img,
.portrait-grid figure.wp-block-image img,
.portrait-grid figure img,
.portrait-grid .portrait-tile img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover !important;
  display: block !important;
}
.portrait-grid .wp-block-image,
.portrait-grid figure.wp-block-image {
  margin: 0 !important;
}

/* ============================================================
   Re-10 (2026-06-11) — Erste figure direkt unter Titel ausblenden.
   Das Bild wird vom Theme-Hero bereits oben gerendert. Pure CSS,
   keine Datenbank-Aenderung, kein save_post-Hook.
   ============================================================ */
body.single-post .entry-content > figure.wp-block-image:first-child,
body.single-post .single-body .entry-content > figure.wp-block-image:first-child,
body.single-post .wp-block-post-content > figure.wp-block-image:first-child {
  display: none !important;
}

/* ============================================================
   Re-12 (2026-06-13) Punkt 4b: Footer-Hero Restructure
   - TRANSPORTTECHNIKER gross (Outfit 900 ~56px) statt mini-Kicker
   - Visueller Abstand zwischen TT und UNTERWEGS FÜR SIE
   - H3-Lines (UNTERWEGS/IN DEUTSCHLAND/UND EUROPA) wieder eng
     (line-height 1.0) — sehen aus wie ein Block, kein Auseinanderdriften
   ============================================================ */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  font-family: "Outfit", sans-serif !important;
  font-size: clamp(34px, 3.4vw, 50px) !important;
  font-weight: 900 !important;
  line-height: 1.0 !important;
  letter-spacing: -0.04em !important;
  text-transform: uppercase !important;
  color: var(--orange, #d97706) !important;
  margin: 0 0 20px 0 !important;
  padding: 0 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  line-height: 1.0 !important;
  font-size: clamp(34px, 3.4vw, 50px) !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  display: inline !important;
  margin: 0 !important;
}

/* Re-12 #5 (2026-06-13): Intro-Block H2s gleich gross wie "Von der Idee..." H2 (46px) */
html body .intro-block .text-col h2.wp-block-heading,
html body .intro-block .text-col h2.has-large-font-size,
html body section .intro-block h2.wp-block-heading.has-large-font-size,
html body .intro-block .intro-bottom-row h2.wp-block-heading,
html body .intro-block .intro-bottom-row h2.has-large-font-size {
  font-size: 46px !important;
  line-height: 1.2 !important;
}


/* ============================================================
   Re-12 #2 (2026-06-13): Bilder werden komplett gezeigt
   (kein left/right crop mehr). object-fit:cover → contain
   - svc-rows (Hauptseite-Service-Karten): contain
   - proj-rows (Projekt-Seiten): contain
   - Karussell bleibt cover (Design-Choice, Slides sind Hero-like)
   Hintergrund: --light statt Loch.
   ============================================================ */

/* Text-Spalten vertikal zentriert (= visuell bündig mit Bild bei 450px Reihe) */
html body .proj-row .wp-block-column:not(:has(.wp-block-image)):not(:has(figure)) {
  justify-content: flex-start !important;
}

/* Re-12 #8 (2026-06-13): Footer Signatur höher — padding-top von 80px auf 28px reduziert. Damit schließt der Footer dicht an die Welt-Karte an. */
html body .tk-footer-band {
  padding-top: 48px !important;
}

/* Re-12 Footer-Hero Tuning v2 (2026-06-13):
   - TT-Block ohne Extra-Lücke zu UNTERWEGS FÜR SIE
   - Footer-Col-Hero & Contact-Col oben dichter an Footer-Band-Top
   - UND EUROPA bottom = Berlin bottom = Projekte bottom
*/
html body footer .tk-footer-band .tk-footer-col-hero {
  padding-top: 0 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin: 0 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  margin-top: 0 !important;
}
/* Projekte-Pills runter (waren 6px über Berlin) — Projekte-Bottom exakt auf Berlin-Bottom */
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills {
  margin-top: -89.5px !important;
}

/* Re-12 Footer-Hero v3 (2026-06-13):
   - Visible-Baseline EUROPA = Berlin = Projekte (Buchstaben auf einer Linie)
     50px Outfit 900 hat 12px Font-Internal-Leading unter Baseline.
     Line-height 1.08 statt 1.0 schiebt EUROPA bottom 12px tiefer.
   - Gesamten Block höher (mehr Luft zum unteren Rand)
     padding-bottom 64 → 110px.
*/
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  line-height: 1.08 !important;
}
html body footer .tk-footer-band {
  padding-bottom: 110px !important;
}

/* Re-12 Pixel-Perfect (2026-06-13):
   Pixel-Scan zeigte:
   - TT-Glyph-Top war 5px tiefer als KONTAKT/SVC (Font-Internal-Leading)
   - UND EUROPA-Glyph-Bottom war 2px tiefer als Berlin/Projekte
   Fix: margin-top -5px auf TT shiftet das gesamte TT-Block-Konstrukt
   5px nach oben → TOP aligned UND auch UND EUROPA bottom = 230 (= Berlin).
*/
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-top: -5px !important;
}

/* Re-12 Pixel-Perfect v2 (2026-06-13): EUROPA span 3px nach unten — bottom = Berlin bottom */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  position: relative;
  top: 3.5px !important;
}

/* Re-12 (2026-06-13): weißer Strich zwischen Welt-Karte und Footer entfernen + Footer-Block höher.
   FOOTER hat margin-top:24px (=weiß sichtbar, body-bg) und padding-top:72px (=navy leerraum).
   Beides auf 0. .tk-footer-band hat eigenes padding-top:28px für Atemraum.
*/
html body footer.site.wp-block-template-part,
html body footer.wp-block-template-part {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Re-12 #1 (2026-06-13) v3: Pfeilabstand exakt halbiert wie Thomas wollte.
   Original: prev.left=24px, next.right=24px → Lücke zwischen ~1288px bei 1500vw
   Halbiert: 25vw von jedem Rand → Lücke ~644px
*/
html body .tk-carousel-wrap .tk-carousel-btn.prev {
  left: 25vw !important;
  right: auto !important;
}
html body .tk-carousel-wrap .tk-carousel-btn.next {
  right: 25vw !important;
  left: auto !important;
}
@media (max-width: 768px) {
  html body .tk-carousel-wrap .tk-carousel-btn.prev { left: 12vw !important; }
  html body .tk-carousel-wrap .tk-carousel-btn.next { right: 12vw !important; }
}


/* ============================================================
   Re-12 final v5 (2026-06-13): proj-row sauber neu aufgesetzt
   - Bild: natürliche Aspect-Ratio (egal wie breit/hoch)
   - Reihe = max(Bild-Höhe, Text-Höhe) → kein toter Leerraum
   - Beide Spalten oben angefangen
   - 14px Abstand zwischen Reihen
   - Bild komplett sichtbar (object-fit:contain mit transparenter bg)
   ============================================================ */
@media (min-width: 782px) {
  html body .proj-row.wp-block-columns {
    align-items: flex-start !important;
    margin: 14px 0 0 0 !important;
    gap: 14px !important;
  }
  html body .proj-row.wp-block-columns:first-of-type {
    margin-top: 0 !important;
  }
  html body .proj-row .wp-block-column {
    align-self: flex-start !important;
    display: block !important;
    flex-basis: calc(50% - 7px) !important;
  }
  html body .proj-row .wp-block-image,
  html body .proj-row figure.wp-block-image {
    margin: 0 !important;
    flex: none !important;
    display: block !important;
  }
  html body .proj-row .wp-block-image img,
  html body .proj-row figure.wp-block-image img,
  html body .proj-row figure img {
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: none !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    background: transparent !important;
    display: block !important;
  }
}

/* Re-13 (2026-06-15) Greensta Footer Tuning:
   - EUROPA noch 6px nach oben (war an Berlin angeglichen, aber Greensta-Viewport zeigt 6px Differenz)
   - Kleine Lücke zwischen TRANSPORTTECHNIKER und UNTERWEGS FÜR SIE (~12px)
*/
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  top: -14.5px !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-bottom: 12px !important;
}

/* Re-13 v2 (2026-06-15): +49 + Cargo Survey auf Linie mit UNTERWEGS FÜR SIE
   KONTAKT/SERVICELEISTUNGEN-Labels brauchen mehr margin-bottom damit ihre
   ersten Content-Lines (phone, Cargo) gleiche y haben wie UNTERWEGS FÜR SIE.
*/
html body footer .tk-footer-band .tk-footer-col-contact h5.tk-footer-kicker,
html body footer .tk-footer-band .tk-footer-col-contact .tk-footer-kicker,
html body footer .tk-footer-band .tk-footer-col-services h5.tk-footer-kicker,
html body footer .tk-footer-band .tk-footer-col-services .tk-footer-kicker {
  margin-bottom: 32px !important;
}

/* Re-15 #7 — Telefon im Header: orange, nicht unterstrichen */
.tk-header-inner .btn-text.tk-phone .wp-block-button__link,
.tk-header-inner .wp-block-buttons .btn-text.tk-phone .wp-block-button__link {
    color: var(--orange) !important;
    text-decoration: none !important;
}
.tk-header-inner .btn-text.tk-phone .wp-block-button__link:hover {
    color: var(--orange-light) !important;
    text-decoration: none !important;
}





/* Re-15 #3 (2026-06-16): 'Von der Idee' H2 vertikal bündig mit 'Wir krempeln' (x=340) */
html body section.services > .section-head h2,
html body section.services .section-head h2,
html body section.services .wp-block-group.section-head h2,
html body section.services .section-head .wp-block-heading {
  padding-left: 110px !important;
}

/* Re-15 #3 v2 (2026-06-16): Override section-head padding-left direkt; vorherige Override mit margin:auto blockierte */
html body section.services > .section-head,
html body section.services .section-head,
html body section.services .wp-block-group.section-head {
  padding-left: 170px !important;
}
html body section.services .section-head h2,
html body section.services .section-head h2.wp-block-heading,
html body section.services .section-head .wp-block-heading {
  margin-left: 0 !important;
  margin-right: auto !important;
  padding-left: 0 !important;
  text-align: left !important;
}

/* Re-15 #3 v3 (2026-06-16): Specificity beat — 3 classes + elements */
html body section.services .wp-block-group.section-head.has-global-padding,
html body section.services .wp-block-group.section-head {
  padding-left: 170px !important;
}

/* Re-15 #1 (2026-06-16): Textfeld in svc-row vertikal MITTIG zum Bild (nicht top-aligned).
   NUR Text-Spalten, NICHT Bild-Spalten — Foto-Position bleibt unverändert. */
html body section.services .svc-row.wp-block-columns > .wp-block-column:not(:has(.svc-photo)):not(:has(img)),
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(img)) {
  align-self: center !important;
  justify-content: center !important;
}

/* Re-15 v2 Footer-Linien (2026-06-16):
   - UND EUROPA bottom = Berlin bottom (Hero-Stack 29px runter)
   - TT-Kicker bleibt auf gleicher Höhe wie KONTAKT-Label (fast schon der Fall)
   - Lücke TT→UNTERWEGS bleibt 7px (klein wie gewünscht) */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-top: 0 !important;
}

/* Re-15 v3 Footer-Linien (2026-06-16):
   - TT-Kicker top = KONTAKT-Label top (margin-top: 0)
   - H3 line-height vergrößert damit UND EUROPA bottom = Berlin bottom natürlich erreicht */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  line-height: 1.285 !important;
}

/* Re-15 (2026-06-16): Footer-Band bündig mit Karte (left=170, right=1270, Breite 1100) */
html body footer .tk-footer-band {
  max-width: 1100px !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
/* Hero-Col Inhalt sitzt auf left-Kante (kein zusätzliches Padding) */
html body footer .tk-footer-band .tk-footer-col-hero {
  padding-left: 0 !important;
}
/* Pills NICHT mehr 960px padding-left — natürlich rechts auf Container-Rand */
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills {
  padding-left: 0 !important;
  padding-right: 0 !important;
  justify-content: flex-end !important;
}

/* Re-15 v2 (2026-06-16): Pills-Padding-Override stärker — beat Re-10 v3 (3 classes) */
html body footer .tk-footer-band > .tk-footer-pills.wp-block-buttons,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills.is-content-justification-right {
  padding-left: 0 !important;
  justify-content: flex-end !important;
}

/* Re-15 v4 (2026-06-16):
   - TT-Kicker + Hero-H3 etwas kleiner damit TRANSPORTTECHNIKER nicht in KONTAKT-Spalte läuft
   - accent-orange top:0 (kein -14.5px Lift mehr) → gleiche Abstände UNTERWEGS↔IN DEUTSCHLAND↔UND EUROPA
   - line-height angepasst */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  font-size: clamp(28px, 2.9vw, 42px) !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  font-size: clamp(28px, 2.9vw, 42px) !important;
  line-height: 1.18 !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  top: 0 !important;
  margin-top: 0 !important;
}

/* Re-15 v5 (2026-06-16): UNTERWEGS-Stack enger + nach unten damit UND EUROPA = Berlin bleibt */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  margin-top: 21px !important;
}

/* Re-15 v6 (2026-06-16): KONTAKT-Spalte kompakter — Berlin bottom = UND EUROPA bottom */
html body footer .tk-footer-band .tk-footer-col-contact h5.tk-footer-kicker,
html body footer .tk-footer-band .tk-footer-col-contact .tk-footer-kicker {
  margin-bottom: 6px !important;
}

/* Re-15 v7 (2026-06-16):
   - SERVICELEISTUNGEN-Spalte kompakter (Cargo Survey & Co nach oben) damit Pills nicht überlagern
   - UND EUROPA visual 4px tiefer damit Letter-Bottom = Berlin Letter-Bottom */
html body footer .tk-footer-band .tk-footer-col-services h5.tk-footer-kicker,
html body footer .tk-footer-band .tk-footer-col-services .tk-footer-kicker {
  margin-bottom: 6px !important;
}
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h .accent-orange {
  top: 4px !important;
}

/* Re-15 v8 (2026-06-16): TT-Kicker Letter-Top exakt auf KONTAKT-Letter-Top (5px höher) */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-kicker {
  margin-top: -5px !important;
}

/* Re-15 v9 (2026-06-16): Technische Zeichnungen vollständig anzeigen.
   Box-Größe bleibt (Abstände unverändert), nur Bild-Inhalt zu CONTAIN.
   Trigger: src/alt enthält Zeichnungs-Marker. Normale Fotos bleiben COVER. */
.tk-carousel-track img[src*="zeichnung"],
.tk-carousel-track img[src*="Zeichnung"],
.tk-carousel-track img[src*="rendering"],
.tk-carousel-track img[src*="Rendering"],
.tk-carousel-track img[src*="3d-"],
.tk-carousel-track img[src*="3D-"],
.tk-carousel-track img[src*="explosionszeichnung"],
.tk-carousel-track img[src*="route-survey"],
.tk-carousel-track img[src*="Route-Survey"],
.tk-carousel-track img[src*="traktrix"],
.tk-carousel-track img[src*="Traktrix"],
.tk-carousel-track img[src*="schleppkurv"],
.tk-carousel-track img[src*="Schleppkurv"],
.tk-carousel-track img[src*="streckenplan"],
.tk-carousel-track img[src*="Streckenplan"],
.tk-carousel-track img[src*="VLM-Verkehrslenkende"],
.tk-carousel-track img[src*="2d-plan"],
.tk-carousel-track img[src*="2D-Plan"],
.tk-carousel-track img[src*="transportzeichnung"],
/* removed: too greedy */
/* removed */
/* removed */
.tk-carousel-track img[alt*="Route Survey"],
.tk-carousel-track img[alt*="Traktrix"],
.tk-carousel-track img[alt*="Schleppkurv"],
.proj-row img[src*="zeichnung"],
.proj-row img[src*="rendering"],
.proj-row img[src*="3d-"],
.proj-row img[src*="3D-"],
.proj-row img[src*="streckenplan"],
.proj-row img[src*="route-survey"],
.proj-row img[src*="traktrix"],
.proj-row img[src*="VLM-Verkehrslenkende"],
.proj-row img[alt*="Zeichnung"],
.proj-row img[alt*="Rendering"],
.proj-row img[alt*="Plan"],
.svc-row img[src*="zeichnung"],
.svc-row img[src*="rendering"],
.svc-row img[src*="3d-"],
.svc-row img[src*="streckenplan"],
.svc-row img[alt*="Zeichnung"],
.svc-row img[alt*="Rendering"],
.svc-row img[alt*="Plan"] {
  object-fit: contain !important;
  background: transparent !important;
}

/* Re-15 v10 (2026-06-16): Stärkere Specificity + mehr Pattern für Zeichnungen.
   Box-Größe und Abstände unverändert — nur object-fit:contain im Bild-Inhalt. */
section.services .svc-row .svc-photo img[src*="zeichnung"],
section.services .svc-row .svc-photo img[src*="rendering"],
section.services .svc-row .svc-photo img[src*="3d-"],
section.services .svc-row .svc-photo img[src*="3D-"],
section.services .svc-row .svc-photo img[src*="brueckenkran"],
section.services .svc-row .svc-photo img[src*="schwertransport-route"],
section.services .svc-row .svc-photo img[src*="VLM-Verkehrs"],
section.services .svc-row .svc-photo img[src*="streckenplan"],
section.services .svc-row .svc-photo img[src*="transportstrecken"],
section.services .svc-row .svc-photo img[src*="route-survey"],
section.services .svc-row .svc-photo img[src*="traktrix"],
section.services .svc-row .svc-photo img[alt*="Zeichnung"],
section.services .svc-row .svc-photo img[alt*="Rendering"],
section.services .svc-row .svc-photo img[alt*="Plan"],
section.services .svc-row .svc-photo img[alt*="Brückenkran"],
section.services .svc-row .svc-photo img[alt*="Streckenplan"],
section.services .svc-row .svc-photo img[alt*="Industriehalle"],
section.services .svc-row .svc-photo img[alt*="Schienenfahrzeug"],
section.services .svc-row .svc-photo img[alt*="Traktrix"],
section.services .svc-row .svc-photo img[alt*="Route Survey"] {
  object-fit: contain !important;
  background: transparent !important;
}

/* Re-15 v11 (2026-06-16): Specificity HARD beat — 5 classes für Zeichnungs-contain.
   Auch height auto erlauben innerhalb der 380px Box, damit Bild komplett zeigt. */
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="zeichnung"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="rendering"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="3d-"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="3D-"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="brueckenkran"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="schwertransport-route"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="VLM-Verkehrs"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="streckenplan"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="transportstrecken"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="route-survey"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[src*="traktrix"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Zeichnung"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Rendering"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Plan"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Brückenkran"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Streckenplan"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Industriehalle"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Schienenfahrzeug"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Traktrix"],
html body section.services .svc-row figure.wp-block-image.svc-photo img[alt*="Route Survey"] {
  object-fit: contain !important;
  background: transparent !important;
}

/* Re-15 v12 (2026-06-16): Single-Hero Bilder bei Projektseiten — Zeichnungen contain */
html body .single-hero img[src*="zeichnung"],
html body .single-hero img[src*="Zeichnung"],
html body .single-hero img[src*="rendering"],
html body .single-hero img[src*="Rendering"],
html body .single-hero img[src*="3d-"],
html body .single-hero img[src*="3D-"],
html body .single-hero img[src*="3d-modell"],
html body .single-hero img[src*="3D-Modell"],
html body .single-hero img[src*="plan"],
html body .single-hero img[src*="Plan"],
html body .single-hero img[src*="explosion"],
html body .single-hero img[src*="route-survey"],
html body .single-hero img[src*="Route-Survey"],
html body .single-hero img[src*="traktrix"],
html body .single-hero img[src*="Traktrix"],
html body .single-hero img[src*="schleppkurv"],
html body .single-hero img[src*="brueckenkran"],
html body .single-hero img[src*="berechnung"],
html body .single-hero img[src*="Berechnung"],
html body .single-hero img[src*="verschubbahn"],
html body .single-hero img[src*="stoessel"],
html body .single-hero img[src*="Stoessel"],
html body .single-hero img[alt*="Zeichnung"],
html body .single-hero img[alt*="Rendering"],
html body .single-hero img[alt*="Plan"],
html body .single-hero img[alt*="Modell"],
html body .single-hero img[alt*="Brückenkran"],
html body .single-hero img[alt*="Industriehalle"],
html body .single-hero img[alt*="Berechnung"] {
  object-fit: contain !important;
  background: transparent !important;
}

/* Re-15 v13 (2026-06-16): Single-Hero MAX-Specificity für Zeichnungen */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="zeichnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="Zeichnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="rendering"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="Rendering"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="3d-"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="3D-"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="plan"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="Plan"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="survey"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="traktrix"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="berechnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="verschubbahn"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="explosion"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="stoessel"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[src*="brueckenkran"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Zeichnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Rendering"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Plan"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Modell"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Brückenkran"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Berechnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .single-hero img[alt*="Industriehalle"] {
  object-fit: contain !important;
  background: transparent !important;
  object-position: center center !important;
}

/* Re-15 v20 (2026-06-16): NUR Cargo Survey (1. svc-row) — Textblock nach UNTEN.
   Margins links/rechts symmetrisch, WEITERLESEN unter Text (Default-Layout). */
html body section.services .svc-row.wp-block-columns:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(img)),
html body section.services .svc-row:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(img)) {
  padding-top: 45px !important;
}

/* Re-15 v21 (2026-06-16): Cargo Survey nach UNTEN — Maxspec gegen padding-top:0 */
html body section.services .svc-row.wp-block-columns:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)) {
  padding-top: 45px !important;
}
html body section.services .svc-row:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-top: 45px !important;
}


/* Re-15 v23 (2026-06-16): Hero immer full viewport-width (war 1920×1080+ schmaler durch aspect-ratio 16/9 + max-height 100vh) */
html body .tk-hero {
  min-width: 100vw !important;
  width: 100vw !important;
}

/* Re-15 v24 (2026-06-16): Cargo Survey ONLY — beide paddings auf 40px reduziert.
   Specific selector :nth-of-type(1) sodass NUR Cargo row betroffen ist. */
html body section.services .svc-row.wp-block-columns:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body section.services .svc-row:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-left: 30px !important;
  padding-right: 110px !important;
}

/* Re-15 v25 (2026-06-16): Cargo Survey — WEITERLESEN näher an Body-Text (war 68px Gap, jetzt ~16px) */
html body section.services .svc-row.wp-block-columns:nth-of-type(1) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)) > .svc-link {
  margin-top: 16px !important;
}

/* Re-15 v26 (2026-06-16): UND EUROPA leicht runter (3px) + Pills 8px nach links (bündig zu Services-Spalte links) */
html body footer .tk-footer-band .tk-footer-col-hero .tk-footer-hero-h {
  margin-top: 18px !important;
}
html body footer .tk-footer-band > .tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills {
  padding-right: 8px !important;
}

/* Re-15 v27 (2026-06-16): Pills 8px nach links — MAX-specificity */
html body footer .tk-footer-band > .tk-footer-pills.wp-block-buttons,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills,
html body footer .tk-footer-band .wp-block-buttons.tk-footer-pills.is-content-justification-right {
  padding-right: 8px !important;
}

/* Re-15 v28 (2026-06-16): Cargo-Layout auf alle svc-rows übertragen.
   Rows mit Bild LINKS (Cargo, CAD): padding-left:30 padding-right:110 padding-top:45
   Rows mit Bild RECHTS (Havari, Strecken): padding-left:110 padding-right:30 padding-top:45 (gespiegelt)
   WEITERLESEN margin-top:16 (näher zum Text) — alle rows */

/* Row 2 — CAD-Transportplanung (img LEFT) */
html body section.services .svc-row.wp-block-columns:nth-of-type(3) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body section.services .svc-row:nth-of-type(3) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-top: 45px !important;
  padding-left: 30px !important;
  padding-right: 110px !important;
}

/* Row 1 — Havariekommissariat (img RIGHT, mirror) */
html body section.services .svc-row.wp-block-columns:nth-of-type(2) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body section.services .svc-row:nth-of-type(2) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-top: 45px !important;
  padding-left: 100px !important;
  padding-right: 30px !important;
}

/* Row 3 — Streckenstudien (img RIGHT, mirror) */
html body section.services .svc-row.wp-block-columns:nth-of-type(4) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body section.services .svc-row:nth-of-type(4) > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-top: 45px !important;
  padding-left: 110px !important;
  padding-right: 30px !important;
}

/* WEITERLESEN closer to body in all svc-rows */
html body section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) > .svc-link {
  margin-top: 16px !important;
}

/* Re-15 v29 (2026-06-16): CAD und Streckenstudien Reihen hochziehen damit visueller Bild-Abstand kleiner wird */
html body section.services .svc-rows .svc-row.wp-block-columns:nth-of-type(3),
html body section.services .svc-rows .svc-row:nth-of-type(3) {
  margin-top: 0 !important;
}
html body section.services .svc-rows .svc-row.wp-block-columns:nth-of-type(4),
html body section.services .svc-rows .svc-row:nth-of-type(4) {
  margin-top: 0 !important;
}



/* Re-15 v32 (2026-06-16): CAD Row (3) ganzer Block 50px hoch */
html body section.services .svc-rows .svc-row.wp-block-columns:nth-of-type(3),
html body section.services .svc-rows .svc-row:nth-of-type(3) {
  margin-top: -14px !important;
}


/* Re-15 v34 (2026-06-16): Strecken-Reihe (4) auch -12px wie CAD */
html body section.services .svc-rows .svc-row.wp-block-columns:nth-of-type(4),
html body section.services .svc-rows .svc-row:nth-of-type(4) {
  margin-top: -16px !important;
}



/* Re-15 v36 (2026-06-16): H2 'Von der Idee' text-align: left damit visible "V" bei 340 (bündig mit ARBEITSBEISPIELE/Body) */
html body section.services .section-head h2.wp-block-heading,
html body section.services .wp-block-group.section-head h2 {
  text-align: left !important;
}

/* Re-15 v37 (2026-06-16): H2 text-align: left — beat all previous center rules */
html body section.services .section-head > h2,
html body section.services .section-head > h2.wp-block-heading,
html body section.services .wp-block-group.section-head > h2,
html body section.services .wp-block-group.section-head > h2.wp-block-heading,
html body section.services .wp-block-group.section-head.has-global-padding > h2,
html body section.services .wp-block-group.section-head.has-global-padding > h2.wp-block-heading {
  text-align: left !important;
}

/* Re-15 v38 (2026-06-16): proj-row Text-Spalten vertikal mittig (gilt überall, auch auf einzelnen Projekt-Seiten) */
html body .proj-row.wp-block-columns > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body .proj-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  align-self: center !important;
  justify-content: center !important;
  display: flex !important;
  flex-direction: column !important;
}

/* Re-15 v39 (2026-06-16): proj-row Text-Spalten überall mit gleichem Padding wie Startseite (73px symmetric) */
html body .proj-row.wp-block-columns > .wp-block-column:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body .proj-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-left: 73px !important;
  padding-right: 73px !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

}

/* Re-15 v42 (2026-06-16): proj-rows auf Projekt-Seiten gleiches Layout wie Startseite svc-rows.
   Bild LINKS → Text rechts: padding-left:30 padding-right:110
   Bild RECHTS → Text links: padding-left:110 padding-right:30 (gespiegelt) */
html body .proj-row.wp-block-columns > .wp-block-column:last-child:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body .proj-row > .wp-block-column:last-child:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-left: 30px !important;
  padding-right: 110px !important;
}
html body .proj-row.wp-block-columns > .wp-block-column:first-child:not(:has(.svc-photo)):not(:has(figure.wp-block-image)):not(:has(img)),
html body .proj-row > .wp-block-column:first-child:not(:has(.svc-photo)):not(:has(figure)):not(:has(img)) {
  padding-left: 110px !important;
  padding-right: 30px !important;
}



/* Re-15 v46 (2026-06-16): NUR Post 17 2. proj-row (SPMT-Module Text + Karte) 10px hoch */
html body.postid-17 .single-body .proj-row.wp-block-columns:nth-of-type(2) {
  margin-top: -6px !important;
}

/* Re-15 v47 (2026-06-16): Post 17 Reihe 3 (Streckenwahl/Katasteramt) 5px höher */
html body.postid-17 .single-body .proj-row.wp-block-columns:nth-of-type(3) {
  margin-top: 9px !important;
}

/* Re-15 v48 (2026-06-16): Post 19 Panorama-Bild Schiffsbau-Werft 10px nach rechts */
html body.postid-19 .single-body img[src*="schiffsbau-werft-trockendock"] {
  transform: translateX(20px) !important;
}



/* Re-15 v50 (2026-06-16): Post 452 Schiffssektion-Querschnitt-Bild 20px nach links */
html body.postid-452 .single-body img[src*="technische-zeichnung-schiffssektion"] {
  transform: translateX(-25px) !important;
}


/* Re-15 v53 (2026-06-16): Post 453 NUR Reihe 6 (letztes DSCN9203 Bild) 20px nach links */
html body.postid-453 .single-body .proj-row.wp-block-columns:nth-of-type(6) img[src*="DSCN9203"] {
  transform: translateX(-23px) !important;
}









/* Re-15 v69 (2026-06-17): Telefon vor info@ im Header, gleiche Baseline */
.tk-header-inner .tk-phone-wrap {
  margin-right: 24px !important;
}
.tk-header-inner .tk-phone .wp-block-button__link {
  letter-spacing: 0.04em;
}

/* Re-15 v70 (2026-06-17): Logo T auf gleiche Baseline wie Brand-Name/Nav/Tel/Mail */
html body .tk-header-inner .tk-logo {
  align-self: flex-end !important;
  margin-bottom: 0 !important;
}
html body .tk-header-inner .tk-brand {
  align-items: flex-end !important;
}

/* Re-15 v71 (2026-06-17): tk-brand nicht umbrechen — Logo bleibt neben Wortmarke */
html body .tk-header-inner .tk-brand {
  flex-wrap: nowrap !important;
}

/* Re-15 v72 (2026-06-17): Projekt-Seiten — proj-rows wie Startseite svc-rows
   Text-Col Padding 30/110 gespiegelt + Bild object-fit:cover + AR 4/3 */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns {
  max-width: 1100px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  gap: 14px !important;
}
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns > .wp-block-column {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
/* Bild LINKS (first-child) → Text RECHTS: padding 30 links, 110 rechts */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns > .wp-block-column:last-child:not(:has(figure)):not(:has(img)) {
  padding-left: 35px !important;
  padding-right: 35px !important;
}
/* Bild RECHTS (last-child) → Text LINKS: padding 110 links, 30 rechts (gespiegelt) */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns > .wp-block-column:first-child:not(:has(figure)):not(:has(img)) {
  padding-left: 35px !important;
  padding-right: 35px !important;
}
/* Bilder: object-fit:cover + AR 4/3 wie auf Startseite */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row .wp-block-image img {
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  object-fit: cover !important;
  display: block !important;
}



/* Re-15 v73 (2026-06-17): Zeichnungen/Pläne/Karten KOMPLETT zeigen — überschreibt v72 cover/AR */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="zeichnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="verholplan"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="hebezeichnung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="kataster"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="masz"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="3d-modell"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="3d-rendering"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="3d-visualisierung"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="materialliste"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="luftaufnahme"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="kranlasttabelle"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="trassenverlauf"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="layout"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="karte-"],
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .single-body .proj-row.wp-block-columns .wp-block-image img[src*="explosion"] {
  object-fit: contain !important;
  aspect-ratio: auto !important;
  background: #f4f4f4 !important;
  max-height: 480px !important;
  width: 100% !important;
}

/* Re-15 v74 (2026-06-17): Stirnseitenansicht-Zeichnung 10px nach unten */
html body .proj-row img[src*="stirnseitenansicht-lkw"] {
  transform: translateY(10px) !important;
}

/* Re-15 v75 (2026-06-17): Post 20 Binnenschiff-Foto 50px nach rechts (Mittelweg) */
html body.postid-20 .single-body img[src*="ladungssicherung-binnenschiff-holzunterstuetzung"] {
  transform: translateX(53px) !important;
}

/* Re-15 v76 (2026-06-17): Karussell — Zeichnungen/Pläne KOMPLETT zeigen (mit weißem Rand) */
.tk-carousel-wrap img[src*="zeichnung"],
.tk-carousel-wrap img[src*="verholplan"],
.tk-carousel-wrap img[src*="hebezeichnung"],
.tk-carousel-wrap img[src*="3d-rendering"],
.tk-carousel-wrap img[src*="3D-Rendering"],
.tk-carousel-wrap img[src*="3d-modell"],
.tk-carousel-wrap img[src*="3d-visualisierung"],
.tk-carousel-wrap img[src*="masz"],
.tk-carousel-wrap img[src*="kataster"],
.tk-carousel-wrap img[src*="layout"],
.tk-carousel-wrap img[src*="materialliste"],
.tk-carousel-wrap img[src*="luftaufnahme"],
.tk-carousel-wrap img[src*="kranlast"],
.tk-carousel-wrap img[src*="trassenverlauf"],
.tk-carousel-wrap img[src*="karte-"],
.tk-carousel-wrap img[src*="explosion"] {
  object-fit: contain !important;
  background: #ffffff !important;
}

/* Re-15 v76b (2026-06-17): zusätzliche Karussell-Zeichnungs-Patterns */
.tk-carousel-wrap img[src*="rendering" i],
.tk-carousel-wrap img[src*="3D-Modell"],
.tk-carousel-wrap img[src*="plan-" i],
.tk-carousel-wrap img[src*="-plan." i] {
  object-fit: contain !important;
  background: #ffffff !important;
}



/* Re-15 v77 (2026-06-17): Karussell-Pfeile — Navy mit echten Chevron-SVG-Icons */
html body .tk-carousel-wrap .tk-carousel-btn {
  width: 48px !important;
  height: 48px !important;
  border-radius: 14px !important;
  background-color: rgba(0, 10, 48, 0.92) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  color: transparent !important;
  font-size: 0 !important;
  border: none !important;
  box-shadow: 0 1px 2px rgba(0,0,0,0.06), 0 6px 18px rgba(0,10,48,0.22), 0 0 0 1px rgba(255,255,255,0.06) inset !important;
  backdrop-filter: blur(8px) saturate(160%) !important;
  -webkit-backdrop-filter: blur(8px) saturate(160%) !important;
  transition: background-color .35s cubic-bezier(0.16,1,0.3,1), box-shadow .35s cubic-bezier(0.16,1,0.3,1), transform .25s cubic-bezier(0.16,1,0.3,1) !important;
}
html body .tk-carousel-wrap .tk-carousel-btn.prev {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpolygon points='16,3 4,12 16,21 10,12'/%3E%3C/svg%3E") !important;
}
html body .tk-carousel-wrap .tk-carousel-btn.next {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='%23ffffff'%3E%3Cpolygon points='8,3 20,12 8,21 14,12'/%3E%3C/svg%3E") !important;
}
html body .tk-carousel-wrap .tk-carousel-btn:hover {
  background-color: var(--orange, #f97316) !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 20px 20px !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.1), 0 12px 28px rgba(249,115,22,0.32), 0 0 0 1px rgba(255,255,255,0.1) inset !important;
}
html body .tk-carousel-wrap .tk-carousel-btn.prev:hover {
  transform: translateY(-50%) translateX(-3px) !important;
}
html body .tk-carousel-wrap .tk-carousel-btn.next:hover {
  transform: translateY(-50%) translateX(3px) !important;
}
html body .tk-carousel-wrap .tk-carousel-btn:active {
  transform: translateY(-50%) scale(0.94) !important;
  transition-duration: .08s !important;
}
html body .tk-carousel-wrap .tk-carousel-btn:focus-visible {
  outline: 2px solid var(--orange, #f97316) !important;
  outline-offset: 3px !important;
}





/* Re-15 v78 (2026-06-17): Karussell-Zeichnungen — natürliche Breite, Höhe 380px voll */
html body .tk-carousel-track > .wp-block-image:has(img[src*="zeichnung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="verholplan"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="hebezeichnung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-rendering"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Rendering"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="rendering" i]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-modell"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Modell"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="masz"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="kataster"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="layout"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="materialliste"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="luftaufnahme"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="kranlast"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="trassenverlauf"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="karte-"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="explosion"]) {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 720px !important;
}
html body .tk-carousel-track > .wp-block-image:has(img[src*="zeichnung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="verholplan"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="hebezeichnung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-rendering"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Rendering"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="rendering" i]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-modell"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Modell"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="masz"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="kataster"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="layout"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="materialliste"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="luftaufnahme"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="kranlast"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="trassenverlauf"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="karte-"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="explosion"]) img {
  width: auto !important;
  height: 380px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  background: transparent !important;
}



/* Re-15 v80 (2026-06-17): Weißen Spalt zwischen Karte und Footer schließen */
html body footer.wp-block-template-part {
  margin-top: 0 !important;
}
html body main.wp-block-group {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
html body .entry-content > :last-child,
html body main > :last-child {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
html body main.wp-block-group + footer {
  margin-top: -46px !important;
}



/* Re-15 v80 (2026-06-17): Karte direkt an Footer bündig (keine weiße Lücke) */
html body main.wp-block-group {
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}
html body main.wp-block-group > :last-child {
  margin-bottom: 0 !important;
}

/* Re-15 v80b (2026-06-17): Footer margin-top 14px raus */
html body footer.wp-block-template-part {
  margin-top: 0 !important;
}




html body .tk-footer-band .tk-footer-col-services .tk-footer-pills,
html body .tk-footer-band .tk-footer-col-services > .wp-block-buttons:last-child {
  margin-top: auto !important;
}





/* Re-15 v81 (2026-06-17): Footer-Bottoms angleichen via natürliches Spacing + Hero-Col tighter */
html body .tk-footer-band .tk-footer-main {
  align-items: stretch !important;
}
html body .tk-footer-col-hero,
html body .tk-footer-col-contact,
html body .tk-footer-col-services {
  display: flex !important;
  flex-direction: column !important;
  align-self: stretch !important;
}
/* Hero-Col: Gap TRANSPORTTECHNIKER → UNTERWEGS verkleinern damit linke Spalte kürzer wird */
html body .tk-footer-col-hero h3,
html body .tk-footer-col-hero > h3.wp-block-heading {
  margin-top: 16px !important;
}

/* Re-15 v84 (2026-06-17): Berlin + Pills zum Spalten-Bottom für Baseline */
html body .tk-footer-col-contact > p:last-of-type {
  margin-top: auto !important;
}
html body .tk-footer-col-services .tk-footer-pills,
html body .tk-footer-col-services > .wp-block-buttons:last-child {
  margin-top: auto !important;
}

/* ============================================================
   Re-15 v85 (2026-06-17): Sprach-Switcher rechts unten
   Globus-Button → klick öffnet Flaggen-Fan (DE/EN/RU)
   Google Translate Widget versteckt, wir triggern es selbst
   ============================================================ */

/* Google Translate UI komplett verstecken */
.goog-te-banner-frame,
.goog-te-balloon-frame,
#goog-gt-tt,
.goog-tooltip,
.goog-tooltip:hover,
.goog-text-highlight {
  display: none !important;
}
body {
  top: 0 !important;
}
#google_translate_element {
  position: absolute;
  left: -10000px;
  top: -10000px;
  visibility: hidden;
}
font[style*="background-color"] {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* Floating Container */
.tk-lang {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 9998;
  display: flex;
  flex-direction: column-reverse;
  align-items: center;
  gap: 12px;
  pointer-events: none;
}

/* Hauptbutton (Globus) */
.tk-lang-toggle {
  pointer-events: auto;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: #0a2540;
  color: #fff;
  border: none;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 6px 24px rgba(10, 37, 64, 0.32), 0 2px 6px rgba(0, 0, 0, 0.12);
  transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.32s ease, background 0.2s ease;
  position: relative;
}
.tk-lang-toggle:hover {
  background: #103456;
  transform: translateY(-2px);
  box-shadow: 0 10px 28px rgba(10, 37, 64, 0.4), 0 3px 8px rgba(0, 0, 0, 0.14);
}
.tk-lang-toggle:active {
  transform: translateY(0);
}
.tk-lang-toggle svg {
  width: 26px;
  height: 26px;
  transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}
.tk-lang.is-open .tk-lang-toggle svg {
  transform: rotate(180deg);
}

/* Aktive Sprache als kleiner Dot */
.tk-lang-toggle::after {
  content: attr(data-active);
  position: absolute;
  bottom: -2px;
  right: -2px;
  background: #d97706;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.04em;
  padding: 2px 5px;
  border-radius: 8px;
  border: 2px solid #fff;
  text-transform: uppercase;
}

/* Flaggen-Liste */
.tk-lang-flags {
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.tk-lang-flag {
  pointer-events: auto;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid #fff;
  background: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.18);
  opacity: 0;
  transform: translateY(20px) scale(0.6);
  transition: opacity 0.4s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.5s cubic-bezier(0.16, 1, 0.3, 1),
              box-shadow 0.2s ease;
  position: relative;
}
.tk-lang-flag:hover {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.28);
  transform: translateY(0) scale(1.08);
}
.tk-lang-flag.is-active {
  border-color: #d97706;
}
.tk-lang-flag svg {
  width: 100%;
  height: 100%;
  display: block;
}

/* Fan-out Animation — Stagger */
.tk-lang.is-open .tk-lang-flag {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.tk-lang.is-open .tk-lang-flag:nth-child(1) { transition-delay: 0.05s; }
.tk-lang.is-open .tk-lang-flag:nth-child(2) { transition-delay: 0.12s; }
.tk-lang.is-open .tk-lang-flag:nth-child(3) { transition-delay: 0.19s; }

/* Mobile — kleiner, näher an Rand */
@media (max-width: 768px) {
  .tk-lang {
    right: 16px;
    bottom: 16px;
  }
  .tk-lang-toggle {
    width: 48px;
    height: 48px;
  }
  .tk-lang-toggle svg {
    width: 22px;
    height: 22px;
  }
  .tk-lang-flag {
    width: 40px;
    height: 40px;
  }
}

/* Re-15 v86 (2026-06-17): Lang-Switcher Fix
   - Globus UNTEN, Flaggen schießen NACH OBEN raus
   - Flaggen füllen den ganzen Kreis (kein weißer Border-Frame)
*/
html body .tk-lang {
  flex-direction: column !important;  /* toggle naturally last → unten */
}

/* Flaggen-Container: erste Flagge nah am Button (unten), letzte oben */
html body .tk-lang-flags {
  flex-direction: column-reverse !important;
}

/* Flagge: kein Border, voller Fill, Animation startet weiter unten (nah Button) */
html body .tk-lang-flag {
  border: none !important;
  background: #0a2540;  /* Falls SVG-Lücke entsteht */
  transform: translateY(20px) scale(0.5) !important;
}
html body .tk-lang-flag svg {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 50%;  /* nochmal explizit damit SVG-Inhalt nicht über Kreis spillt */
}
html body .tk-lang.is-open .tk-lang-flag {
  transform: translateY(0) scale(1) !important;
}
html body .tk-lang-flag.is-active {
  box-shadow: 0 0 0 3px #d97706, 0 6px 18px rgba(0, 0, 0, 0.28);
}

/* Stagger umdrehen: DE (nah am Button, in HTML :nth-child(1)) animiert zuerst */
/* Mit column-reverse ist :nth-child(1) visuell UNTEN (DE) — soll first out */
html body .tk-lang.is-open .tk-lang-flag:nth-child(1) { transition-delay: 0.05s !important; }
html body .tk-lang.is-open .tk-lang-flag:nth-child(2) { transition-delay: 0.12s !important; }
html body .tk-lang.is-open .tk-lang-flag:nth-child(3) { transition-delay: 0.19s !important; }

/* Re-15 v88 (2026-06-17): Flaggen ECHT rund (Anti-Ellipse) — größer + aspect-ratio + no-shrink */
html body .tk-lang-flag {
  width: 54px !important;
  height: 54px !important;
  aspect-ratio: 1 / 1 !important;
  flex: 0 0 54px !important;
  align-self: center !important;
  min-width: 54px !important;
  min-height: 54px !important;
  max-width: 54px !important;
  max-height: 54px !important;
}
html body .tk-lang-flag svg {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: 1 / 1 !important;
  object-fit: cover;
}

/* Mobile leicht kleiner aber immer noch quadratisch */
@media (max-width: 768px) {
  html body .tk-lang-flag {
    width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    min-width: 44px !important;
    min-height: 44px !important;
    max-width: 44px !important;
    max-height: 44px !important;
  }
}

/* Re-15 v89 (2026-06-17): Schatten symmetrisch → optisch echter Kreis (nicht Tropfen) */
html body .tk-lang-flag {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.08), 0 6px 20px rgba(0,0,0,0.32) !important;
}
html body .tk-lang-flag:hover {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.12), 0 8px 24px rgba(0,0,0,0.4) !important;
}

/* Re-15 v91 (2026-06-17): Flaggen als CSS-Background (statt SVG-children)
   → mathematisch 100% rund, kein SVG-Rendering-Artefakt */
html body .tk-lang-flag svg {
  display: none !important;
}
html body .tk-lang-flag {
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
}
html body .tk-lang-flag[data-lang="de"] {
  background-image: linear-gradient(to bottom, #000 0 33.33%, #DD0000 33.33% 66.66%, #FFCE00 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="en"] {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' preserveAspectRatio='xMidYMid slice'><rect width='60' height='60' fill='%23012169'/><path d='M0,0 L60,60 M60,0 L0,60' stroke='%23ffffff' stroke-width='10'/><path d='M0,0 L60,60 M60,0 L0,60' stroke='%23C8102E' stroke-width='5'/><path d='M30,0 V60 M0,30 H60' stroke='%23ffffff' stroke-width='14'/><path d='M30,0 V60 M0,30 H60' stroke='%23C8102E' stroke-width='7'/></svg>") !important;
}
html body .tk-lang-flag[data-lang="ru"] {
  background-image: linear-gradient(to bottom, #fff 0 33.33%, #0039A6 33.33% 66.66%, #D52B1E 66.66% 100%) !important;
}

/* Re-15 v93 (2026-06-17): Layout-Shift Fix + E-Mail CSS-Shield + 3 neue Flaggen */

/* Horizontal scrollbar fix — Karussell-Track ragt 120px raus */
html, body { overflow-x: clip !important; }

/* E-Mail/Tel als CSS-Content (NIE übersetzt) */
a.tk-shield {
  font-size: 0 !important;
  letter-spacing: 0 !important;
}
a.tk-shield::before {
  content: attr(data-original);
  font-size: 1rem;
  font-family: inherit;
  font-weight: inherit;
  color: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

/* Neue Flaggen Backgrounds */
html body .tk-lang-flag[data-lang="nl"] {
  background-image: linear-gradient(to bottom, #AE1C28 0 33.33%, #fff 33.33% 66.66%, #21468B 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="fr"] {
  background-image: linear-gradient(to right, #002654 0 33.33%, #fff 33.33% 66.66%, #ED2939 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="es"] {
  background-image: linear-gradient(to bottom, #C60B1E 0 25%, #FFC400 25% 75%, #C60B1E 75% 100%) !important;
}

/* Stagger für 6 Flaggen */
html body .tk-lang.is-open .tk-lang-flag:nth-child(4) { transition-delay: 0.26s !important; }
html body .tk-lang.is-open .tk-lang-flag:nth-child(5) { transition-delay: 0.33s !important; }
html body .tk-lang.is-open .tk-lang-flag:nth-child(6) { transition-delay: 0.40s !important; }

/* Re-15 v94 (2026-06-17): Google-Translate-Banner aggressiv verstecken */
html body .skiptranslate,
html body iframe.goog-te-banner-frame,
html body .goog-te-banner-frame.skiptranslate,
html body div.goog-te-balloon-frame,
html body #goog-gt-,
html body .goog-tooltip,
html body .goog-tooltip:hover,
html body .goog-text-highlight {
  display: none !important;
  visibility: hidden !important;
  height: 0 !important;
  width: 0 !important;
  opacity: 0 !important;
}
/* Body-Top force 0 — Google setzt top:40px wenn banner sichtbar wäre */
html body { top: 0 !important; position: static !important; }
html { margin-top: 0 !important; }

/* Stärkerer Schutz vor doppelter Telefonnummer-Anzeige:
   Wenn tkShield aktiv, font-size:0 auf ALLE Children, ::before zeigt content */
html body a.tk-shield * {
  font-size: 0 !important;
  visibility: hidden !important;
  position: absolute !important;
  left: -9999px !important;
}
html body a.tk-shield::before {
  content: attr(data-original) !important;
  font-size: 1rem !important;
  visibility: visible !important;
  position: static !important;
  display: inline !important;
  font-family: inherit;
  font-weight: inherit;
  color: inherit;
  text-transform: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

/* ============================================================
   Re-15 v98 (2026-06-17): Fan-Layout für 12-Sprachen-Switcher
   Inner/Outer Pfauen-Fächer um den Globus
   ============================================================ */

/* Container bleibt fixed bottom-right */
html body .tk-lang-flags {
  position: absolute !important;
  bottom: 0 !important;
  right: 4px !important;
  width: 56px !important;
  height: 56px !important;
  display: block !important;
  pointer-events: none;
  z-index: 1;
}

/* Jede Flagge wird absolut positioniert, ausgehend vom Globus */
html body .tk-lang-flag {
  position: absolute !important;
  bottom: 4px !important;
  right: 4px !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  max-width: 44px !important;
  max-height: 44px !important;
  aspect-ratio: 1 / 1 !important;
  border-radius: 50% !important;
  border: none !important;
  background: #0a2540;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: center !important;
  cursor: pointer;
  padding: 0 !important;
  margin: 0 !important;
  transform: translate(0, 0) scale(0.2);
  opacity: 0;
  transition: transform 0.55s cubic-bezier(0.34, 1.56, 0.64, 1) var(--delay, 0s),
              opacity 0.32s ease var(--delay, 0s),
              box-shadow 0.2s ease;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.08), 0 4px 14px rgba(0,0,0,0.32);
  z-index: 2;
}
html body .tk-lang-flag svg { display: none !important; }
html body .tk-lang-flag:hover {
  box-shadow: 0 0 0 2px rgba(255,255,255,0.18), 0 6px 18px rgba(0,0,0,0.45);
  transform: translate(var(--fx, 0), var(--fy, 0)) scale(1.12) !important;
  z-index: 3;
}
html body .tk-lang.is-open .tk-lang-flag {
  opacity: 1;
  transform: translate(var(--fx, 0), var(--fy, 0)) scale(1);
  pointer-events: auto;
}
html body .tk-lang-flag.is-active {
  box-shadow: 0 0 0 3px #d97706, 0 6px 18px rgba(0,0,0,0.45);
}

/* Pfauen-Fächer: jede zweite Flagge ist 1-2px höher gestaffelt — nicht via JS, sondern Eindruck durch nth-child scale */

/* ====== Flaggen-Designs (12 Sprachen) ====== */
html body .tk-lang-flag[data-lang="de"] {
  background-image: linear-gradient(to bottom, #000 0 33.33%, #DD0000 33.33% 66.66%, #FFCE00 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="en"] {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' preserveAspectRatio='xMidYMid slice'><rect width='60' height='60' fill='%23012169'/><path d='M0,0 L60,60 M60,0 L0,60' stroke='%23ffffff' stroke-width='10'/><path d='M0,0 L60,60 M60,0 L0,60' stroke='%23C8102E' stroke-width='5'/><path d='M30,0 V60 M0,30 H60' stroke='%23ffffff' stroke-width='14'/><path d='M30,0 V60 M0,30 H60' stroke='%23C8102E' stroke-width='7'/></svg>") !important;
}
html body .tk-lang-flag[data-lang="pl"] {
  background-image: linear-gradient(to bottom, #fff 0 50%, #DC143C 50% 100%) !important;
}
html body .tk-lang-flag[data-lang="ru"] {
  background-image: linear-gradient(to bottom, #fff 0 33.33%, #0039A6 33.33% 66.66%, #D52B1E 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="uk"] {
  background-image: linear-gradient(to bottom, #005BBB 0 50%, #FFD500 50% 100%) !important;
}
html body .tk-lang-flag[data-lang="lt"] {
  background-image: linear-gradient(to bottom, #FDB913 0 33.33%, #006A44 33.33% 66.66%, #C1272D 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="lv"] {
  background-image: linear-gradient(to bottom, #9E3039 0 40%, #fff 40% 60%, #9E3039 60% 100%) !important;
}
html body .tk-lang-flag[data-lang="et"] {
  background-image: linear-gradient(to bottom, #0072CE 0 33.33%, #000 33.33% 66.66%, #fff 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="nl"] {
  background-image: linear-gradient(to bottom, #AE1C28 0 33.33%, #fff 33.33% 66.66%, #21468B 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="fr"] {
  background-image: linear-gradient(to right, #002654 0 33.33%, #fff 33.33% 66.66%, #ED2939 66.66% 100%) !important;
}
html body .tk-lang-flag[data-lang="es"] {
  background-image: linear-gradient(to bottom, #C60B1E 0 25%, #FFC400 25% 75%, #C60B1E 75% 100%) !important;
}
html body .tk-lang-flag[data-lang="it"] {
  background-image: linear-gradient(to right, #008C45 0 33.33%, #fff 33.33% 66.66%, #CD212A 66.66% 100%) !important;
}

/* Mobile — Fächer kompakter aber sichtbar */
@media (max-width: 768px) {
  html body .tk-lang-flag {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px !important;
    min-height: 36px !important;
    max-width: 36px !important;
    max-height: 36px !important;
  }
}

/* Re-15 v98b: Override alte translateY-Regel mit Fan-Transform */
html body .tk-lang.is-open .tk-lang-flag {
  transform: translate(var(--fx, 0), var(--fy, 0)) scale(1) !important;
}
html body .tk-lang.is-open .tk-lang-flag:hover {
  transform: translate(var(--fx, 0), var(--fy, 0)) scale(1.12) !important;
}
/* Closed state — zentriert hinter Toggle */
html body .tk-lang-flag {
  transform: translate(0, 0) scale(0.2) !important;
}

/* Re-15 v98c: Flaggen nicht klickbar wenn geschlossen */
html body .tk-lang-flag {
  pointer-events: none !important;
}
html body .tk-lang.is-open .tk-lang-flag {
  pointer-events: auto !important;
}

/* Re-15 v98d: Flaggen kleiner für sauberen Fächer ohne overlap */
html body .tk-lang-flag {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px !important;
  min-height: 40px !important;
  max-width: 40px !important;
  max-height: 40px !important;
}
@media (max-width: 768px) {
  html body .tk-lang-flag {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    max-width: 34px !important;
    max-height: 34px !important;
  }
}

/* Re-15 v99 (2026-06-18): Nur bei Übersetzungen — Pills nicht hochziehen
   verhindert Overlap bei längeren Sprachen. DE bleibt unverändert. */
html.translated-ltr .tk-footer-pills,
html.translated-rtl .tk-footer-pills {
  margin-top: 0 !important;
}

/* Re-15 v99b: höhere Specificity um -89.5px Regel zu schlagen */
html.translated-ltr body footer .tk-footer-band .wp-block-buttons.tk-footer-pills,
html.translated-rtl body footer .tk-footer-band .wp-block-buttons.tk-footer-pills {
  margin-top: 0 !important;
}

/* Re-15 v101 (2026-06-19): Hero-Aside Block größer + Sprachen-Zeile schwarz
   Thomas-Wunsch: "Melden Sie sich gerne..." Block lesbarer machen,
   "wir sprechen Deutsch, Englisch sowie Russisch" auf schwarz statt orange. */
html body .hero-aside p {
  font-size: 17px !important;
  line-height: 1.55 !important;
}
html body .hero-aside p.is-style-blocksatz,
html body .hero-aside p.has-ink-color {
  color: #171717 !important;
}

/* Re-15 v102 (2026-06-19): "Melden Sie sich gerne..." fettgedruckt
   Ergänzung zu v101 — nur Text-Eigenschaften, kein Layout. */
html body .hero-aside p:first-of-type {
  font-weight: 700 !important;
}

/* Re-15 v103 (2026-06-19): Hero-Aside höhere Specificity um alte Regel (2106-2130) zu schlagen */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p {
  font-size: 17px !important;
  line-height: 1.55 !important;
}
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:first-of-type {
  font-weight: 700 !important;
}
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:last-of-type {
  color: #171717 !important;
  font-size: 17px !important;
}

/* Re-15 v104 (2026-06-19): Nur die fetten Zeilen größer — Rest 1:1 */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:first-of-type,
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:last-of-type {
  font-size: 20px !important;
}

/* Re-15 v105 (2026-06-19): fette Zeilen noch größer (20→24px) */
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:first-of-type,
html body.single-post:not(.postid-1802):not(.postid-1806):not(.postid-20) .hero-row > .hero-aside p:last-of-type {
  font-size: 24px !important;
}

/* ============================================================
   WEITERLESEN: Pfeil → entfernen (auf Wunsch von Thomas, 2026-06-25)
   Alle .svc-link Pfeile weg, inkl. Hover-Verschiebung.
   ============================================================ */
.svc .svc-link::after,
.svc:hover .svc-link::after,
p.svc-link::after,
p.svc-link:hover::after {
  content: none !important;
  display: none !important;
  transform: none !important;
}

/* ============================================================
   FOOTER: Lila-Bereich (Abstand unter dem Band) entfernen
   Thomas-Tabelle Punkt 2 — 2026-06-25
   Hellgrünen Abstand oben behalten, lila unten = padding-bottom kürzen
   ============================================================ */
html body footer.site .tk-footer-band {
  padding-bottom: 32px !important;
}

/* ============================================================
   KARUSSELL (Service-Seiten): Bilder größer + mehr Gap
   Thomas-Tabelle Punkt 3 — 2026-06-25
   Bilder waren zu klein, Slides standen zu eng nebeneinander
   ============================================================ */
.tk-carousel-track {
  gap: 48px !important;
  height: clamp(380px, 34vw, 520px) !important;
}
.tk-carousel-wrap {
  padding: 48px 60px !important;
}

/* ============================================================
   Punkt 3 (2026-06-25) — Karussell-Zeichnungen VERGRÖSSERN
   Überschreibt Re-15 v78 — statt hardcoded 380px nun 500px Höhe
   ============================================================ */
html body .tk-carousel-track > .wp-block-image:has(img[src*="zeichnung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="verholplan"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="hebezeichnung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-rendering"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Rendering"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="rendering" i]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-modell"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Modell"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="masz"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="kataster"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="layout"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="materialliste"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="luftaufnahme"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="kranlast"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="trassenverlauf"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="karte-"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="explosion"]) img {
  height: 500px !important;
  max-width: 100% !important;
}
/* Container der Zeichnungen darf breiter werden */
html body .tk-carousel-track > .wp-block-image:has(img[src*="zeichnung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="verholplan"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="hebezeichnung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-rendering"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Rendering"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="rendering" i]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3d-modell"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="3D-Modell"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="materialliste"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="layout"]) {
  max-width: 720px !important;
}
/* Sonstige Karussell-Bilder (Fotos): Höhe auch erhöhen */
.tk-carousel-track > .wp-block-image img {
  height: 500px !important;
}

/* ============================================================
   Punkt 3 NACHTRAG (2026-06-25) — Lashing/Mafi/Berechnungs-Zeichnungen
   Ergänzt die :has()-Liste um Dateinamen die nur "Ladungssicherung",
   "Lashing", "Berechnung", "Mafi", "Trailer" enthalten
   ============================================================ */
html body .tk-carousel-track > .wp-block-image:has(img[src*="Ladungssicherung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="ladungssicherung"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="Lashing"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="lashing" i]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="Berech"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="berech" i]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="Mafi"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="mafi" i]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="Trailer"]),
html body .tk-carousel-track > .wp-block-image:has(img[src*="trailer" i]) {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 720px !important;
}
html body .tk-carousel-track > .wp-block-image:has(img[src*="Ladungssicherung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="ladungssicherung"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="Lashing"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="lashing" i]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="Berech"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="berech" i]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="Mafi"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="mafi" i]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="Trailer"]) img,
html body .tk-carousel-track > .wp-block-image:has(img[src*="trailer" i]) img {
  width: auto !important;
  height: 500px !important;
  max-width: 100% !important;
  object-fit: contain !important;
  background: transparent !important;
}

/* Portrait-Bilder (is-portrait): Höhe konservativer + Footer-Abstand (2026-06-26) */
@media (min-width:782px){
  .proj-row .wp-block-image.is-portrait img,
  .proj-row .wp-block-image.is-portrait figure img {
    max-height: 460px !important;
  }
  .proj-row:has(.wp-block-image.is-portrait) {
    margin-bottom: 80px !important;
  }
}

/* Portrait-Reihe Post 20: Abstand zum Footer (2026-06-26) */
@media (min-width:782px){
  body.postid-20 .proj-row:nth-last-of-type(-n+3) {
    margin-bottom: 80px !important;
  }
  body.postid-20 .proj-row:last-of-type {
    margin-bottom: 120px !important;
  }
}

/* Portrait-Row min-height: Bild ragt sonst über Container raus (2026-06-26) */
@media (min-width:782px){
  html body.single-post.postid-20 .single-body .proj-row:has(.wp-image-650), html body.single-post.postid-20 .single-body .proj-row:has(.wp-image-870) {
    min-height: 480px !important;
    align-items: flex-start !important;
    margin-bottom: 80px !important;
    margin-top: 0 !important;
  }
}

/* Bild 1457 (leichtes Portrait): wie andere Querformat-Bilder behandeln (2026-06-26) */
@media (min-width:782px){
  html body.single-post.postid-20 .single-body .proj-row .wp-block-image img.wp-image-1457 {
    aspect-ratio: 4/3 !important;
    object-fit: cover !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
  }
}

/* ============================================================
   FOOTER GLOBAL (2026-06-26)
   Übernommen aus YellowPencil der Startseite (post 24) — jetzt
   für alle Seiten/Beiträge gültig statt nur Homepage.
   ============================================================ */
.wp-site-blocks .site .tk-footer-band {
  transform: translatex(0px) translatey(24px);
  top: 5px;
}
@media (min-width:901px){
  .wp-site-blocks .site .tk-footer-band {
    padding-top: 20px !important;
  }
}


/* ============================================================
   KARUSSELL — HÖHE-BASIERT (2026-06-26 v2)
   
   Alle Tiles: EINHEITLICHE HÖHE 500px. Ober- und Unterkante 
   exakt bündig. Breite ergibt sich aus natürlicher AR des
   Bildes → Bild füllt den Container immer komplett.
   
   - Querformat-Foto 4:3 (1024×768) → Tile 667×500
   - Zeichnung Format 1024×724 (AR 1.41) → Tile 707×500
   - Zeichnung Format 1024×576 (AR 1.78) → Tile 889×500
   - Hochformat 768×1024 (AR 0.75) → Tile 375×500
   
   Vorteil: Keine weißen Letterbox-Streifen, jedes Bild komplett
   sichtbar, gleiche Linie oben + unten.
   ============================================================ */

/* Tile-Container: feste Höhe, Breite passt sich an */
html body .tk-carousel-track > .wp-block-image,
html body .tk-carousel .wp-block-gallery .wp-block-image {
  flex: 0 0 auto !important;
  width: auto !important;
  height: 500px !important;
  min-height: 500px !important;
  max-height: 500px !important;
  max-width: 720px !important;
  min-width: 280px !important;
  aspect-ratio: auto !important;
  overflow: hidden !important;
  margin: 0 !important;
  background: #ffffff !important;
  position: relative !important;
}

/* Bild im Tile: füllt Höhe, behält AR, kein Crop */
html body .tk-carousel-track > .wp-block-image img,
html body .tk-carousel .wp-block-gallery .wp-block-image img {
  width: auto !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  display: block !important;
}

/* FIGURE-Tag: muss auch passen */
html body .tk-carousel-track > .wp-block-image > figure,
html body .tk-carousel-track > .wp-block-image figure.wp-block-image {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}

/* Karussell-Track: konsistenter Gap, Items auf gleicher Linie */
html body .tk-carousel-track {
  gap: 16px !important;
  align-items: stretch !important;
}

/* Karussell-Wrap: konsistentes Padding */
html body .tk-carousel-wrap {
  padding: 40px 60px !important;
}

/* ============================================================
   BILDKANTEN BÜNDIG v2 (2026-06-26) — CHIRURGISCH
   Container bleibt natürliche Breite. Bild bekommt cover statt
   contain damit Bildkanten = Containerkanten.
   ============================================================ */
html body .tk-carousel-track > .wp-block-image img,
html body .tk-carousel-track > .wp-block-image figure img {
  object-fit: cover !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  background: transparent !important;
}

/* ---------------------------------------------------------------------------
 * Re-16 v5 (2026-06-27): Weiße Fläche unter dem Footer beseitigen.
 * Ursache: WP-Core setzt body{min-height:100%}, dadurch ist der body bei wenig
 * Inhalt höher als Inhalt+Footer (sichtbar nur auf hohen Monitoren, z.B. bei
 * Thomas, nicht bei kürzeren Viewports). Lösung: Sticky-Footer-Pattern —
 * body als Flex-Spalte über volle Viewport-Höhe, wp-site-blocks füllt den Rest,
 * der Footer sitzt damit immer am unteren Rand. Ändert das Layout sonst NICHT.
 * --------------------------------------------------------------------------- */
html { height: 100%; }
body {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}
body > .wp-site-blocks {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
}
body > .wp-site-blocks > main {
  flex: 1 0 auto;
}
/* Admin-Bar (eingeloggt) abziehen, damit auch dort keine Lücke entsteht */
.admin-bar body { min-height: calc(100vh - 32px); }

/* ============================================================
   Tablet-Fix (2026-07-19): 782–1080px stapelt die Service-Reihen.
   Grund: Die Desktop-Feinjustierung (110px-Paddings, zentrierte
   Spalten, Bildhoehen-Crop) laesst dem Text auf Tablet-Breite zu
   wenig Platz — Ueberschriften ragten 50-120px ueber die Reihe
   hinaus und wurden von den Bildern verdeckt. Unter 782px stapelt
   WordPress selbst (Handy ok), ab 1081px reicht der Platz.
   ============================================================ */
@media (min-width: 782px) and (max-width: 1080px) {
  /* 380px-Kaefig (Block 1.5.5) aufheben: Reihen wachsen mit dem Inhalt */
  html body section.services .svc-row.wp-block-columns,
  html body section.services .svc-row {
    flex-wrap: wrap !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin-top: 40px !important;
    margin-bottom: 40px !important;
  }
  html body section.services .svc-row.wp-block-columns > .wp-block-column,
  html body section.services .svc-row > .wp-block-column {
    flex-basis: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 0 !important;
    align-self: flex-start !important;
  }
  /* Bild immer oben, Text darunter (auch bei gespiegelten Reihen) */
  html body section.services .svc-row > .wp-block-column:has(.svc-photo),
  html body section.services .svc-row > .wp-block-column:has(figure),
  html body section.services .svc-row > .wp-block-column:has(img) {
    order: -1 !important;
  }
  html body section.services .svc-row .svc-photo {
    aspect-ratio: 16 / 9 !important;
    width: 100% !important;
  }
  html body section.services .svc-row .svc-photo img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }
  html body section.services .svc-row h3 {
    margin: 20px 0 12px !important;
  }
  html body section.services .svc-row > .wp-block-column:not(:has(figure)):not(:has(img)) > .svc-link {
    margin-top: 12px !important;
  }
}

/* Footer-Service-Links (2026-07-20): lange Begriffe (v.a. die UK-Fassung
   "Промислові та транспортні пошкодження") auf breiten Bildschirmen nicht
   umbrechen. Ab 1280px ist rechts genug Platz (getestet: bleibt >40px
   innerhalb des Bandes). Schrift, Farbe, Abstaende bleiben unveraendert;
   darunter greift der normale Umbruch weiter. */
@media (min-width: 1280px) {
  .tk-footer-band .tk-footer-col-services .tk-footer-line {
    white-space: nowrap;
  }
}

/* UK Latein-in-Kyrillisch (2026-07-20): "Cargo Survey" und "CAD" wirkten im
   Menue/Footer fett. Ursache: Outfit (Theme-Schrift) hat KEINE kyrillischen
   Glyphen, deklariert aber unicode-range fuer alles → lateinische Woerter
   rendern in Outfit, kyrillische fallen auf die System-Schrift zurueck, die
   daneben duenner wirkt. Fix: auf UK-Seiten Menue-/Footer-Labels in EINER
   Schrift die Latein UND Kyrillisch einheitlich rendert. DE unberuehrt. */
html[lang^="uk"] .wp-block-navigation-item__label,
html[lang^="uk"] .tk-footer-col-services .tk-footer-line,
html[lang^="uk"] .tk-footer-col-services a {
  font-family: 'Segoe UI', system-ui, -apple-system, Roboto, 'Helvetica Neue', Arial, sans-serif !important;
}

/* Kontakt-Block (hero-aside) einheitlich in Marken-Navy (Thomas 2026-07-20).
   Vorher je nach Beitrag gemischt: Ueberschrift/letzter Absatz off-black
   (#171717), E-Mail/Telefon navy (#001659), auf anderen Beitraegen #000a30 —
   mehrere alte Farbregeln ueberlagerten sich. ID + wiederholte Klasse schlaegt
   alle YellowPencil-Regeln, gilt fuer ALLE Beitraege (Desktop + Handy). */
html body #wp--skip-link--target .hero-aside.hero-aside.hero-aside.hero-aside.hero-aside,
html body #wp--skip-link--target .hero-aside.hero-aside.hero-aside.hero-aside.hero-aside p,
html body #wp--skip-link--target .hero-aside.hero-aside.hero-aside.hero-aside.hero-aside h3,
html body #wp--skip-link--target .hero-aside.hero-aside.hero-aside.hero-aside.hero-aside strong,
html body #wp--skip-link--target .hero-aside.hero-aside.hero-aside.hero-aside.hero-aside a {
  color: #001659 !important;
}

/* 2.7.5 (2026-07-29): Kontaktbox UK — keine automatische Silbentrennung.
   Thomas' Wunsch: keine Trennstriche (англій-ською). Umbrüche steuert er
   selbst per Enter im Übersetzungsfeld (Sprachen → Übersetzungen). */
html[lang^="uk"] .hero-aside .is-style-blocksatz {
  hyphens: manual !important;
  -webkit-hyphens: manual !important;
}

/* 2.7.6 (2026-08-12): Hero-Überschrift ("Wir krempeln die Ärmel hoch …").
   Die Schlusspunkte rutschten in eine dritte Zeile, es fehlten nur wenige
   Pixel. Ein minimal engerer Zeichenabstand holt sie zurück in Zeile 2 —
   bei großen Headlines ohnehin die sauberere Typografie. Gilt für alle
   Sprachen, weil die Überschrift überall gleich aufgebaut ist. */
p.pre-h2 + h2.wp-block-heading {
  letter-spacing: -0.025em;
}

/* 2.7.7 (2026-08-12): Kontaktbox — Schlusspunkte in dieselbe Zeile holen.
   Die englische Fassung ist länger als die deutsche, dadurch rutschte
   " . . ." in eine eigene Zeile. Ein minimal engerer Zeichenabstand schafft
   den nötigen Platz; die Punkte selbst hängen bereits untrennbar zusammen
   (siehe tk_punkte_binden in functions.php). */
.hero-aside .is-style-blocksatz {
  letter-spacing: -0.015em;
}

/* 2.7.8 (2026-08-17): Flagge für Türkisch — fehlte im Sprachumschalter,
   der Kreis blieb leer. Roter Grund mit Halbmond und Stern, gleiche
   Machart wie die übrigen Flaggen (SVG direkt im Stylesheet). */
html body .tk-lang-flag[data-lang="tr"] {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 60' preserveAspectRatio='xMidYMid slice'><rect width='60' height='60' fill='%23E30A17'/><circle cx='25.5' cy='30' r='11' fill='%23ffffff'/><circle cx='29.5' cy='30' r='8.8' fill='%23E30A17'/><polygon points='40.50,24.00 41.91,28.06 46.21,28.15 42.78,30.74 44.03,34.85 40.50,32.40 36.97,34.85 38.22,30.74 34.79,28.15 39.09,28.06' fill='%23ffffff'/></svg>") !important;
  background-size: cover !important;
  background-position: center !important;
}

/* 2.7.9 (2026-08-17): Leistungs-Kacheln — "WEITERLESEN" wurde abgeschnitten.
   Die Kacheln waren auf exakt 380px festgenagelt (height + max-height) und
   schnitten alles darüber ab (overflow:hidden). Sobald ein Text etwas länger
   wurde, verschwand der Link unter dem nächsten Block. Das trifft besonders
   Sprachen mit längeren Wörtern. Jetzt gilt 380px als MINDESThöhe, die Kachel
   wächst bei Bedarf mit — das Design bleibt, der Inhalt bleibt lesbar. */
html body section.services .svc-row,
html body section.services .svc-row.wp-block-columns {
  height: auto !important;
  max-height: none !important;
  min-height: 380px !important;
}
html body section.services .svc-row > .wp-block-column {
  height: auto !important;
  max-height: none !important;
  min-height: 0 !important;
  overflow: visible !important;
}

/* ============================================================
   2.8.0 — Letzte Bildreihe Projekt "Hochgeschwindigkeitszuege"
   Zwei Fotos nebeneinander: gleich breit, unbeschnitten,
   sichtbarer Raster-Abstand. Gilt fuer DE und alle Uebersetzungen,
   weil die Reihe ueber das enthaltene Bild adressiert wird.
   Spezifitaet mit ID + wiederholter Klasse, sonst gewinnen die
   YellowPencil-Regeln (nutzen #wp--skip-link--target).
   ============================================================ */
@media (min-width: 782px) {
  html body #wp--skip-link--target .single-body .prose .proj-row.proj-row.proj-row:has(.wp-image-650) {
    column-gap: 48px !important;
  }
  html body #wp--skip-link--target .single-body .prose .proj-row.proj-row.proj-row:has(.wp-image-650) .wp-block-column .wp-block-image.wp-block-image {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    transform: none !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
  }
  html body #wp--skip-link--target .single-body .prose .proj-row.proj-row.proj-row:has(.wp-image-650) .wp-block-column .wp-block-image.wp-block-image img {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    object-fit: contain !important;
    transform: none !important;
    position: static !important;
    top: auto !important;
    left: auto !important;
    margin: 0 !important;
  }
}

/* ============================================================
   2.8.1 — Senkrechter Abstand zwischen den Bildreihen
   In den Uebersetzungen sind die proj-rows randlos aneinander
   (0 px), weil die Textspalte kuerzer ist als im Deutschen und
   die Reihe damit exakt so hoch wird wie ihr Bild. Im Deutschen
   entstehen dadurch 10-19 px Luft. Hier fest nachgezogen.
   ============================================================ */
html body.tk-uebersetzung #wp--skip-link--target .prose .proj-row.proj-row.proj-row {
  margin-top: 16px !important;
}

/* ============================================================
   2.8.2 (2026-08-22) — Startseiten-Header: gleiche Hoehe in ALLEN Sprachen
   Thomas meldete: weisser Menue-Hintergrund auf UK/PL/NL/TR/FR zu hoch,
   DE/EN korrekt. Ursache: die kompakte Hoehe (71px) stand NICHT im Theme,
   sondern als YellowPencil-Regel nur auf den beiden Startseiten
   DE (page 24) und EN (page 4147):
       .wp-site-blocks .top .tk-header-inner{padding-top:6px;padding-bottom:10px}
   Alle uebrigen Sprach-Startseiten liefen auf dem Theme-Standard
   (padding:18px 36px) und wurden damit 90px hoch.
   Hier als echte Theme-Regel fuer body.home — gilt automatisch fuer jede
   heutige und kuenftige Sprache.
   BEWUSST NUR body.home: auf Unterseiten haengt
   `.wp-site-blocks > main{padding-top:90px}` an der 90px-Header-Hoehe;
   dort wuerde ein kompakter Header eine 19px-Luecke unter dem Header
   hinterlassen. Auf der Startseite liegt der Hero unter dem fixed Header
   (`.home .wp-site-blocks > main{padding-top:0}`), deshalb verschiebt
   sich hier nichts.
   Nur Desktop (>=881px) — darunter gilt die Mobile-Geometrie aus
   style.css @media(max-width:880px) bzw. mobile.css.
   ============================================================ */
@media (min-width: 881px) {
  html body.home .wp-site-blocks .top .tk-header-inner {
    padding-top: 6px !important;
    padding-bottom: 10px !important;
    margin-bottom: 1px !important;
  }
}

/* ============================================================
   2.8.3 (2026-08-24, Koren): Startseiten-Servicekacheln — Bilder
   fuellen wieder die volle Reihenhoehe.
   VORGESCHICHTE: 1.5.5 nagelte Reihe UND Bild auf 380px fest
   (buendige Bilder, ~16px Luecke). 2.7.9 gab die REIHEN-Hoehe frei,
   damit "WEITERLESEN" nicht mehr abgeschnitten wird — die BILDER
   blieben aber auf 380px stehen. Ergebnis: Reihen 405-510px hoch,
   Bild klebt oben, darunter Loch; Bild-zu-Bild-Luecken 9-97px statt
   gleichmaessig klein. Genau das hat Koren am 24.08. beanstandet.
   FIX: Bildspalte stretcht auf Reihenhoehe, Figure+Bild 100% Hoehe
   (object-fit:cover wie gehabt), Textspalte vertikal zentriert,
   einheitliche 16px zwischen den Reihen. Nur >=1081px — Handy
   (Stapeln <782) und Tablet (782-1080) bleiben unangetastet.
   ============================================================ */
@media (min-width: 1081px) {
  html body:not(#_) section.services .svc-row,
  html body:not(#_) section.services .svc-row.wp-block-columns {
    margin-top: 16px !important;
    margin-bottom: 0 !important;
  }
  html body:not(#_) section.services .svc-row:first-of-type {
    margin-top: 0 !important;
  }
  html body:not(#_) section.services .svc-row > .wp-block-column:has(.svc-photo),
  html body:not(#_) section.services .svc-row > .wp-block-column:has(figure) {
    align-self: stretch !important;
    display: flex !important;
    flex-direction: column !important;
    height: auto !important;
    min-height: 380px !important;
    max-height: none !important;
  }
  html body:not(#_) section.services .svc-row .svc-photo,
  html body:not(#_) section.services .svc-row figure.svc-photo,
  html body:not(#_) section.services .svc-row .wp-block-image.svc-photo {
    height: 100% !important;
    min-height: 380px !important;
    max-height: none !important;
    flex: 1 1 auto !important;
  }
  html body:not(#_) section.services .svc-row .svc-photo img,
  html body:not(#_) section.services .svc-row figure.wp-block-image img,
  html body:not(#_) section.services .svc-row figure img {
    height: 100% !important;
    min-height: 380px !important;
    max-height: none !important;
    object-fit: cover !important;
  }
  html body:not(#_) section.services .svc-row > .wp-block-column:not(:has(.svc-photo)):not(:has(figure)) {
    justify-content: center !important;
  }
}