/* =====================================================================
   INVENTOR GmbH — Design System
   Premium / Trust · Poppins · Accent #1E5B4C + Creme · Rounded · Glass
   ===================================================================== */

/* ---------- Tokens ---------- */
:root{
  /* Brand — Dark-Theme: dunkles Tannengrün + helle Grün-Akzente */
  --accent:        #297E5B;   /* mittleres Grün (Buttons/Icons, weißer Text ≥4.5:1, poppt auf dunkel) */
  --accent-600:    #226A4D;   /* Hover */
  --accent-700:    #86CFA8;   /* helles Grün: Text/Links auf dunkel */
  --accent-050:    #1C2C25;   /* dunkelgrüner Tint (Icon-BG, Tags) */
  --accent-100:    #27392F;   /* Tint/Borders */
  --gold:          #C6A15B;   /* dezentes Gold-Detail */

  /* Ink / neutrals (dunkel) */
  --white:         #17221D;   /* Card-/Surface-Farbe (dunkel, hebt sich vom BG ab) */
  --ink:           #F2F0E9;   /* Überschriften (Creme) */
  --ink-body:      #C4CFC8;   /* Fließtext */
  --ink-soft:      #8C9A92;   /* muted / captions */
  --line:          #2B3A32;   /* Borders auf dunkel */
  --bg:            #0D1410;   /* dunkler Grund */
  --bg-soft:       #111A15;   /* alternate sections */
  --bg-tint:       #14201A;   /* accent-tinted blocks */

  /* Glass (dunkel) */
  --glass-bg:      rgba(18,28,23,.62);
  --glass-brd:     rgba(255,255,255,.09);

  /* Radius */
  --r-sm: 14px;
  --r:    20px;
  --r-lg: 28px;
  --r-xl: 36px;
  --pill: 999px;

  /* Shadow — dunkel (schwarz), damit Tiefe auf Dark sichtbar bleibt */
  --sh-sm:  0 1px 2px rgba(0,0,0,.22), 0 6px 16px rgba(0,0,0,.22);
  --sh:     0 2px 6px rgba(0,0,0,.24), 0 14px 40px rgba(0,0,0,.30);
  --sh-md:  0 6px 14px rgba(0,0,0,.28), 0 30px 70px rgba(0,0,0,.40);
  --sh-lg:  0 12px 26px rgba(0,0,0,.32), 0 50px 100px rgba(0,0,0,.50);
  --sh-accent: 0 10px 24px rgba(95,182,140,.22), 0 2px 6px rgba(95,182,140,.18);

  /* Type — normale, professionelle Desktop-Größen (Body 16px) */
  --font: "Poppins", system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  --fs-eyebrow: .78rem;
  --fs-body:  clamp(.95rem, .92rem + .1vw, 1rem);      /* max 16px */
  --fs-lead:  clamp(1rem, .95rem + .28vw, 1.15rem);    /* max ~18px */
  --h1: clamp(2rem, 1.5rem + 1.6vw, 2.75rem);          /* max 44px */
  --h2: clamp(1.6rem, 1.25rem + 1.4vw, 2.35rem);       /* max ~38px */
  --h3: clamp(1.12rem, 1.02rem + .35vw, 1.35rem);      /* max ~22px */

  /* Layout */
  --container: 1180px;
  --gutter: clamp(1.15rem, .6rem + 2vw, 2.5rem);
  --section-y: clamp(5rem, 3rem + 6.5vw, 9.5rem);

  /* Motion — premium spring-ease (Linear/Apple-tier) */
  --ease: cubic-bezier(.32,.72,0,1);
  --ease-spring: cubic-bezier(.34,1.4,.5,1);
  --dur: .4s;
}

/* ---------- Reset ---------- */
*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
section[id], header[id], #kalender{ scroll-margin-top:5.5rem; }
body{
  font-family:var(--font);
  font-size:var(--fs-body);
  line-height:1.65;
  color:var(--ink-body);
  background-color:#0B120E;
  background-image:
    radial-gradient(72% 55% at 78% 4%, rgba(84,120,98,.55), transparent 60%),
    radial-gradient(66% 55% at 3% 97%, rgba(40,64,52,.5), transparent 62%);
  background-attachment:fixed; background-repeat:no-repeat;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
img,svg,video{ display:block; max-width:100%; }
img{ height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; cursor:pointer; border:none; background:none; color:inherit; }
ul{ list-style:none; }
h1,h2,h3,h4{ color:var(--ink); font-weight:600; line-height:1.12; letter-spacing:-.02em; overflow-wrap:break-word; }
::selection{ background:var(--accent); color:#fff; }

/* ---------- Layout helpers ---------- */
.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); }
/* Prevent grid/flex blowout: children must be allowed to shrink below content size */
.hero__grid>*,.page-hero__grid>*,.split>*,.contact-grid>*,.cards>*,.steps>*,.reviews>*,.blog-grid>*,.team>*,.stats>*,.field-row>*{ min-width:0; }
.field input,.field select,.field textarea{ max-width:100%; }
.section{ padding-block:var(--section-y); }
.section--soft{ background:rgba(255,255,255,.025); }
.section--tint{ background:rgba(95,182,140,.06); }
.narrow{ max-width:760px; }
.center{ text-align:center; }
.mx-auto{ margin-inline:auto; }

/* ---------- Eyebrow / headings ---------- */
.eyebrow{
  display:inline-block;
  font-size:.72rem; font-weight:600; letter-spacing:.18em;
  text-transform:uppercase; color:var(--accent-700);
}
.section-head{ max-width:660px; margin-bottom:clamp(2rem,1.4rem + 2vw,3.5rem); }
.section-head.is-center{ margin-inline:auto; text-align:center; }
h2.title{ font-size:var(--h2); margin:.7rem 0 .9rem; }
h3.title{ font-size:var(--h3); }
.lead{ font-size:var(--fs-lead); color:var(--ink-soft); line-height:1.6; }
.text-accent{ color:var(--accent-700); }

/* ---------- Buttons ---------- */
.btn{
  --pad-y:.62rem; --pad-x:1.25rem;
  display:inline-flex; align-items:center; justify-content:center; gap:.45rem;
  padding:var(--pad-y) var(--pad-x);
  border-radius:var(--pill);
  font-weight:600; font-size:.9rem; line-height:1;
  min-height:44px;
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease);
  will-change:transform;
}
.btn svg{ width:16px; height:16px; flex:none; }
.btn--primary{ background:var(--accent); color:#fff; box-shadow:var(--sh-accent); }
.btn--primary:hover{ background:var(--accent-600); transform:translateY(-2px); box-shadow:0 18px 40px rgba(30,91,76,.42); }
.btn--ghost{ background:transparent; color:var(--ink); box-shadow:none; border:1.5px solid var(--accent); }
.btn--ghost:hover{ transform:translateY(-2px); border-color:var(--accent-700); color:var(--accent-700); background:rgba(41,126,91,.1); }
.btn--outline{ background:transparent; color:var(--ink); border:1.5px solid var(--accent); }
.btn--outline:hover{ border-color:var(--accent-700); color:var(--accent-700); background:rgba(41,126,91,.1); transform:translateY(-2px); }
.btn--light{ background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.3); backdrop-filter:blur(6px); }
.btn--light:hover{ background:rgba(255,255,255,.24); transform:translateY(-2px); }
.btn--block{ width:100%; }
.btn--sm{ min-height:40px; --pad-y:.5rem; --pad-x:1rem; font-size:.82rem; }

.link-arrow{
  display:inline-flex; align-items:center; gap:.4rem;
  font-weight:600; color:var(--accent-700);
  transition:gap var(--dur) var(--ease), color var(--dur) var(--ease);
}
.link-arrow svg{ width:18px; height:18px; transition:transform var(--dur) var(--ease); }
.link-arrow:hover{ color:var(--accent); gap:.65rem; }
.link-arrow:hover svg{ transform:translateX(3px); }

/* =====================================================================
   NAVBAR — Glass Pill
   ===================================================================== */
.nav-wrap{
  position:fixed; inset:0 0 auto 0; z-index:100;
  display:flex; justify-content:center;
  padding:clamp(.7rem,.4rem + 1vw,1.15rem) var(--gutter);
  pointer-events:none;
}
.nav{
  pointer-events:auto;
  width:100%; max-width:var(--container);
  display:flex; align-items:center; gap:.85rem;
  padding:.4rem .5rem .4rem 1.1rem;
  border-radius:18px;
  background:rgba(18,28,23,.58);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 12px 36px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(20px) saturate(150%);
  -webkit-backdrop-filter:blur(20px) saturate(150%);
  transition:box-shadow var(--dur) var(--ease), transform var(--dur) var(--ease), background var(--dur) var(--ease);
}
.nav.is-scrolled{
  box-shadow:0 14px 42px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.08); background:rgba(12,19,15,.82); }
.nav__brand{ display:flex; align-items:center; gap:.6rem; font-weight:700; color:var(--ink); letter-spacing:.01em; }
.nav__brand .logo-mark{ width:30px; height:30px; color:var(--accent-700); flex:none; }
.nav__brand b{ font-weight:700; font-size:1rem; letter-spacing:.02em; }
.nav__links{ display:flex; align-items:center; gap:.1rem; margin-left:auto; }
.nav__links a{
  padding:.45rem .72rem; border-radius:var(--pill);
  font-size:.875rem; font-weight:500; color:var(--ink-body);
  transition:background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.nav__links a:hover{ background:var(--accent-050); color:var(--accent-700); }
.nav__links a.is-active{ color:var(--accent-700); font-weight:600; }
.nav__cta{ margin-left:.4rem; min-height:36px; --pad-y:.42rem; }
/* Nav dropdown (Immobilien) */
.nav__links li{ position:relative; }
.nav__item--drop > a{ display:inline-flex; align-items:center; gap:.15rem; }
.nav__caret{ width:13px; height:13px; transition:transform var(--dur) var(--ease); }
.nav__item--drop:hover .nav__caret,
.nav__item--drop:focus-within .nav__caret{ transform:rotate(180deg); }
.nav__item--drop::after{ content:""; position:absolute; top:100%; left:0; right:0; height:.7rem; } /* Hover-Brücke */
.nav__drop{
  position:absolute; top:100%; left:0; margin-top:.55rem; min-width:238px;
  display:flex; flex-direction:column; gap:.1rem; padding:.4rem;
  border-radius:14px; background:rgba(14,22,18,.94);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:0 16px 40px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.06);
  backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%);
  opacity:0; visibility:hidden; transform:translateY(6px);
  transition:opacity var(--dur) var(--ease), transform var(--dur) var(--ease), visibility var(--dur);
}
.nav__item--drop:hover .nav__drop,
.nav__item--drop:focus-within .nav__drop{ opacity:1; visibility:visible; transform:translateY(0); }
.nav__drop a{ display:block; white-space:nowrap; padding:.55rem .7rem; border-radius:10px; }
.nav__burger{
  display:none; margin-left:auto;
  width:44px; height:44px; border-radius:12px;
  align-items:center; justify-content:center; color:var(--ink);
  background:var(--accent-050);
}
.nav__burger svg{ width:24px; height:24px; }

/* Mobile menu */
.mobile-menu{
  position:fixed; inset:0; z-index:99;
  background:rgba(11,18,14,.96);
  backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  display:flex; flex-direction:column; justify-content:flex-start; gap:.3rem;
  padding:5.5rem var(--gutter) 3rem;
  opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .3s var(--ease), transform .35s var(--ease), visibility .3s;
}
.mobile-menu.is-open{ opacity:1; visibility:visible; transform:none; }
.mobile-menu a:not(.btn){
  font-size:1.15rem; font-weight:600; color:var(--ink);
  padding:.7rem 0; border-bottom:1px solid var(--line);
}
.mobile-menu a:not(.btn):last-of-type{ border:none; }
.mobile-menu .btn{ margin-top:1.4rem; width:auto; align-self:center; font-size:.75rem; --pad-y:.6rem; --pad-x:1.6rem; min-height:42px; white-space:nowrap;
  border:1.5px solid #A9E3C2;
  box-shadow:0 0 26px -4px rgba(134,207,168,.6), 0 0 62px -14px rgba(134,207,168,.42), var(--sh-accent); }

/* =====================================================================
   HERO
   ===================================================================== */
/* Cinematic full-bleed hero */
.hero{ position:relative; min-height:100svh; display:flex; overflow:hidden; isolation:isolate; background:var(--bg); }
.hero__glow{ position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    radial-gradient(42rem 42rem at 6% 54%, rgba(41,126,91,.34), rgba(41,126,91,0) 60%),
    radial-gradient(24rem 24rem at 24% 34%, rgba(134,207,168,.16), rgba(134,207,168,0) 62%),
    radial-gradient(30rem 30rem at 88% 66%, rgba(41,126,91,.16), rgba(41,126,91,0) 64%); }
.hero__bg{ position:absolute; inset:0; z-index:-2; }
.hero__bg img{ width:100%; height:100%; object-fit:cover; object-position:center 60%; transform:scale(1.04); }
.hero__scrim{ position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:
    linear-gradient(180deg, rgba(12,24,19,.5) 0%, rgba(12,24,19,.06) 16%, rgba(12,24,19,.1) 44%, rgba(12,24,19,.92) 100%),
    linear-gradient(72deg, rgba(12,24,19,.8) 0%, rgba(12,24,19,.5) 30%, rgba(12,24,19,.12) 62%, rgba(12,24,19,0) 88%);
}
.hero__inner{ position:relative; z-index:1; width:100%; max-width:var(--container);
  margin-inline:auto; padding-inline:var(--gutter);
  display:flex; flex-direction:column;
  padding-top:clamp(7rem,5rem + 6vw,9.5rem); padding-bottom:clamp(2rem,1.4rem + 2vw,3.4rem); }
.hero__kicker{ display:none; }
.hero__title{ color:#F6F3EC; font-weight:600; letter-spacing:-.022em; line-height:1.1;
  font-size:clamp(1.95rem, 1.5rem + 1.9vw, 2.9rem); margin:auto 0 0; max-width:15ch;
  text-wrap:balance; }
.hero__lead{ color:rgba(244,241,234,.86); font-size:var(--fs-lead); line-height:1.6; max-width:48ch; margin-top:1.5rem; }
.hero__actions{ display:flex; flex-wrap:nowrap; gap:.9rem 1.2rem; margin-top:2.1rem; align-items:center; }
.hero .btn--primary{ background:var(--accent); color:#fff; box-shadow:0 16px 40px rgba(41,126,91,.34); }
.hero .btn--primary:hover{ background:var(--accent-600); color:#fff; transform:translateY(-2px); box-shadow:0 22px 52px rgba(41,126,91,.46); }
.hero__link{ display:inline-flex; align-items:center; gap:.55rem; color:#F6F3EC; font-weight:600; font-size:.98rem;
  padding:.4rem 0; border-bottom:1px solid rgba(246,243,236,.4);
  transition:gap var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.hero__link svg{ width:18px; height:18px; }
.hero__link:hover{ gap:.8rem; border-color:#F6F3EC; }
.hero__meta{ display:flex; flex-wrap:nowrap; align-items:center; gap:.7rem 1.3rem;
  margin-top:clamp(1.6rem,1rem + 1.6vw,2.4rem); padding-top:1.2rem; border-top:1px solid rgba(246,243,236,.16); }
.hero__stat{ display:flex; flex-direction:column; gap:.2rem; }
.hero__stat b{ color:#F6F3EC; font-size:1.08rem; font-weight:700; line-height:1; letter-spacing:-.01em; }
.hero__stat > span{ color:rgba(244,241,234,.68); font-size:.68rem; white-space:nowrap; }
.hero__stat .stars{ color:var(--gold); }
.hero__scroll{ margin-left:auto; display:inline-flex; align-items:center; gap:.55rem;
  color:rgba(244,241,234,.7); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase; }
.hero__scroll svg{ width:16px; height:16px; animation:heroBob 2.2s var(--ease) infinite; }
@keyframes heroBob{ 0%,100%{transform:translateY(-2px)} 50%{transform:translateY(3px)} }
@media (prefers-reduced-motion: reduce){ .hero__scroll svg{ animation:none; } }
/* Hero split layout (Text links, Motion-Video rechts) */
.hero__inner--split{ display:grid; grid-template-columns:minmax(360px,445px) 1fr;
  gap:clamp(1.5rem,.6rem + 3vw,4.5rem); align-items:center; }
.hero__copy{ display:flex; flex-direction:column; align-items:flex-start; min-width:0; }
.hero__inner--split .hero__title{ margin:0; }
.hero__media{ position:relative; justify-self:end; width:100%; max-width:64rem; }
@media (min-width:881px){ .hero__media{ width:min(45.5rem,49vw); max-width:none; margin-right:-4.5vw; } }
@media (min-width:881px){ .hero__copy{ margin-left:calc(var(--gutter) * -0.5); } }
.hero__actions .btn, .hero__actions .hero__link{ white-space:nowrap; }
.hero__media::before{ content:""; position:absolute; inset:6% 8%; z-index:-1;
  background:radial-gradient(closest-side, rgba(41,126,91,.28), rgba(41,126,91,0) 72%);
  filter:blur(8px); }
.hero__video{ width:100%; height:auto; display:block; }
.hero__video.is-floating{ animation:heroFloat 5.5s ease-in-out infinite; will-change:transform; }
@keyframes heroFloat{ 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(-16px) } }
@media (prefers-reduced-motion: reduce){ .hero__video.is-floating{ animation:none; } }
@media (max-width:880px){
  .hero{ min-height:auto; }
  .hero__inner--split{ display:flex; flex-direction:column; gap:1.9rem; }
  .hero__copy{ align-items:center; }
  .hero__media{ order:2; max-width:26rem; margin-inline:auto; margin-top:-4rem; }
}
@media (min-width:881px){ .hero__media{ transform:translateY(-3rem); } }

.stars{ display:inline-flex; gap:1px; color:#F5A623; }
.stars svg{ width:17px; height:17px; }

/* Image placeholder look (when no <img>) */
.ph{
  position:relative; display:grid; place-items:center; gap:.5rem;
  background:
    linear-gradient(135deg,#E9F0EC,#F1ECE2);
  color:var(--accent-700); text-align:center; padding:2rem;
}
.ph svg{ width:46px; height:46px; opacity:.5; }
.ph span{ font-size:.82rem; font-weight:600; letter-spacing:.04em; color:var(--ink-soft); text-transform:uppercase; }

/* =====================================================================
   LOGO / TRUST STRIP
   ===================================================================== */
.marquee{ padding-block:1.3rem; border-block:1px solid var(--line); overflow:hidden; }
.marquee__label{ text-align:center; font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--ink-soft); margin-bottom:.85rem; }
.marquee__viewport{ overflow:hidden;
  -webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
  mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent); }
.marquee__track{ display:flex; align-items:center; gap:3rem; width:max-content;
  animation:marqueeX 32s linear infinite; }
.marquee:hover .marquee__track{ animation-play-state:paused; }
@keyframes marqueeX{ to{ transform:translateX(-50%); } }
.chip{
  display:inline-flex; align-items:center; gap:.5rem; flex:none; white-space:nowrap;
  font-weight:500; color:var(--ink-body); font-size:.9rem;
}
.chip svg{ width:16px; height:16px; color:var(--accent); flex:none; }
@media (prefers-reduced-motion: reduce){
  .marquee__track{ animation:none; flex-wrap:wrap; width:auto; justify-content:center; }
  .marquee__viewport{ -webkit-mask:none; mask:none; }
}

/* =====================================================================
   SERVICE CARDS (3 Gewerke)
   ===================================================================== */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,.5rem + 1.6vw,1.6rem); }
@media (min-width:1025px){ .cards--grid2{ grid-template-columns:repeat(2,1fr); } }
/* Startseite: kompaktere Service-Cards, übersichtlicher in einer Section */
.cards--grid2 .card__media{ aspect-ratio:auto; height:clamp(160px,13vw,205px); }
.cards--grid2 .card__body{ padding:clamp(1.1rem,.7rem + .7vw,1.45rem); }
.cards--grid2 .card h3{ margin-bottom:.4rem; }
.cards--grid2 .card p{ margin-bottom:.75rem; font-size:.95rem; }
.cards--grid2 .card__tags{ margin-bottom:.85rem; }
.card{
  position:relative; display:flex; flex-direction:column;
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); overflow:hidden;
  box-shadow:var(--sh-sm);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease);
}
.card:hover{ border-color:rgba(30,91,76,.5);
  box-shadow:0 0 0 1px rgba(30,91,76,.28), 0 0 48px -8px rgba(30,91,76,.45), var(--sh-md); }
/* Vorteile-/Lösungs-Cards: dezenter Accent-Border-Glow im Default (geringere Streuung), Hover sticht hell heraus */
#vorteile .card, #loesungen .card, #wege .card{ border-color:rgba(134,207,168,.3);
  box-shadow:0 0 0 1px rgba(134,207,168,.1), 0 0 16px -7px rgba(41,126,91,.4), var(--sh-sm); }
#vorteile .card:hover, #loesungen .card:hover, #wege .card:hover{ transform:translateY(-5px); border-color:rgba(134,207,168,.85);
  box-shadow:0 0 0 1px rgba(134,207,168,.4), 0 0 34px -4px rgba(95,182,140,.6), 0 0 80px -18px rgba(95,182,140,.42), var(--sh-md); }
#vorteile .card:hover .card__ico, #loesungen .card:hover .card__ico, #wege .card:hover .card__ico{ background:var(--accent); color:#fff;
  box-shadow:0 0 22px -1px rgba(95,182,140,.9), 0 0 46px -8px rgba(95,182,140,.55); }
.card__media{ aspect-ratio:4/3; overflow:hidden; background:var(--bg-soft); }
.card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.card:hover .card__media img{ transform:scale(1.06); }
.card__num{ position:absolute; top:1rem; left:1rem; z-index:2;
  width:29px; height:29px; border-radius:var(--pill); display:grid; place-items:center;
  background:var(--glass-bg); backdrop-filter:blur(10px); color:var(--accent-700);
  font-weight:700; font-size:.85rem; border:1px solid var(--glass-brd); }
.card__body{ padding:clamp(1.4rem,1rem + 1vw,2rem); display:flex; flex-direction:column; flex:1; }
.card__ico{ width:44px; height:44px; border-radius:13px; display:grid; place-items:center;
  background:var(--accent-050); color:var(--accent-700); margin-bottom:1.1rem;
  transition:background var(--dur) var(--ease), color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.card:hover .card__ico{ background:var(--accent); color:#fff; box-shadow:0 0 26px -2px rgba(30,91,76,.7); }
.card__ico svg{ width:22px; height:22px; }
/* Kompaktere Icon-Tiles (z. B. Immobilien: Warum Immobilien) */
.cards--tiles .card__body{ padding:clamp(1.05rem,.7rem + .7vw,1.45rem); }
.cards--tiles .card__ico{ width:38px; height:38px; border-radius:11px; margin-bottom:.75rem; }
.cards--tiles .card__ico svg{ width:19px; height:19px; }
.cards--tiles .card h3{ font-size:1.06rem; margin-bottom:.3rem; }
.cards--tiles .card p{ font-size:.9rem; margin-bottom:0; }
.card h3{ font-size:var(--h3); margin-bottom:.6rem; }
.card p{ color:var(--ink-soft); font-size:1rem; margin-bottom:1.2rem; }
.card__tags{ display:flex; flex-wrap:wrap; gap:.4rem; margin-bottom:1.4rem; }
.tag{ font-size:.72rem; font-weight:500; padding:.26rem .62rem; border-radius:var(--pill);
  background:var(--accent-050); color:var(--accent-700); }
.card .link-arrow{ margin-top:auto; }

/* =====================================================================
   ALT / SPLIT feature rows
   ===================================================================== */
.split{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,1rem + 4vw,4.5rem); align-items:center; }
.split--rev .split__media{ order:2; }
.split__media{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-md); aspect-ratio:5/4; background:var(--bg-soft); }
.split__media--tall{ aspect-ratio:1/1; }
.split__media--top img{ object-position:50% 12%; }
.split__media img{ width:100%; height:100%; object-fit:cover; }
.feature-list{ display:flex; flex-direction:column; gap:1.1rem; margin-top:1.6rem; }
.feature-list li{ display:flex; gap:1.1rem; align-items:center; }
.feature-list .fi{ width:50px; height:50px; border-radius:50%; flex:none; display:grid; place-items:center;
  background:var(--accent); color:#fff;
  box-shadow:0 0 22px -3px rgba(41,126,91,.75), 0 0 0 5px rgba(41,126,91,.13); }
.feature-list .fi svg{ width:24px; height:24px; }
.feature-list b{ color:var(--ink); display:block; font-weight:600; }
.feature-list span{ color:var(--ink-soft); font-size:.96rem; }

/* =====================================================================
   PROCESS / STEPS
   ===================================================================== */
/* Horizontale Timeline (So arbeiten wir) */
.timeline{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; margin-top:3.2rem; }
.tl-item{ position:relative; display:flex; flex-direction:column; align-items:center; text-align:center; }
/* durchlaufende Linie zwischen den Punkten */
.tl-item:not(:last-child)::before{ content:""; position:absolute; top:26px; left:50%; z-index:0;
  width:calc(100% + 1.5rem); height:2px;
  background:linear-gradient(90deg, rgba(134,207,168,.55), rgba(134,207,168,.28)); }
/* Linie zeichnet sich beim Scrollen (nur mit JS; ohne JS bleibt sie sichtbar) */
html.js .tl-item:not(:last-child)::before{ transform:scaleX(0); transform-origin:left center; transition:transform .7s var(--ease) .18s; }
html.js .tl-item.is-in:not(:last-child)::before{ transform:scaleX(1); }
.tl-node{ position:relative; z-index:1; width:54px; height:54px; border-radius:50%; flex:none;
  display:grid; place-items:center;
  background:linear-gradient(160deg,#AEE6C6 0%,#82C9A3 100%); color:#0E2A22; font-weight:700; font-size:1.25rem;
  box-shadow:0 6px 16px -4px rgba(0,0,0,.4), 0 0 0 6px rgba(134,207,168,.12), 0 0 22px -6px rgba(134,207,168,.55);
  transition:box-shadow var(--dur) var(--ease); }
.tl-card{ margin-top:1.5rem; width:100%; flex:1 1 auto; text-align:left; padding:1.6rem 1.4rem; border-radius:var(--r-lg);
  background:var(--white); border:1px solid rgba(134,207,168,.35); box-shadow:var(--sh-sm);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.tl-card p{ text-wrap:pretty; }
.tl-item:hover .tl-node{ box-shadow:0 6px 16px -4px rgba(0,0,0,.4), 0 0 0 6px rgba(134,207,168,.22), 0 0 32px -3px rgba(134,207,168,.75); }
.tl-item:hover .tl-card{ transform:translateY(-4px); border-color:rgba(134,207,168,.7); box-shadow:var(--sh-md); }
.tl-card h3{ font-size:1.15rem; margin-bottom:.45rem; }
.tl-card p{ font-size:.94rem; color:var(--ink-soft); }

/* =====================================================================
   STATS band
   ===================================================================== */
.stats-band{ padding-block:clamp(2.25rem, 1.4rem + 2vw, 3.5rem); }
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1.5rem; text-align:center; }
.stat b{ display:block; font-size:clamp(3.1rem, 2.1rem + 3.8vw, 4.9rem); font-weight:700; color:var(--accent-700); line-height:1; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.stat span{ display:block; margin-top:.65rem; color:var(--ink-soft); font-size:1rem; }

/* =====================================================================
   TEAM
   ===================================================================== */
.team-cards{ display:grid; grid-template-columns:repeat(2,1fr); gap:1.6rem; max-width:920px; margin-inline:auto; perspective:1500px; }
.pcard{ position:relative; aspect-ratio:4/5; border-radius:var(--r-lg); overflow:hidden;
  border:1px solid var(--line); box-shadow:var(--sh-lg); background:var(--bg-soft);
  transform-style:preserve-3d; will-change:transform;
  transition:transform .5s var(--ease), box-shadow var(--dur) var(--ease); }
.pcard img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 18%;
  transition:transform .8s var(--ease); }
.pcard:hover{ box-shadow:0 34px 74px -14px rgba(0,0,0,.62), 0 0 0 1px rgba(134,207,168,.28); }
.pcard:hover img{ transform:scale(1.05); }
.pcard__scrim{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(6,12,9,.95) 3%, rgba(6,12,9,.55) 34%, rgba(6,12,9,0) 66%); }
.pcard__body{ position:absolute; left:0; right:0; bottom:0; padding:clamp(1.4rem,1rem + 1.2vw,2rem);
  display:flex; flex-direction:column; gap:1.1rem; }
.pcard__name{ color:#fff; font-size:clamp(1.35rem,1.1rem + .8vw,1.6rem); font-weight:700; line-height:1.1; }
.pcard__role{ color:rgba(236,244,239,.8); font-size:.92rem; margin-top:.3rem; }
.pcard__btn{ align-self:flex-start; min-height:38px; --pad-y:.44rem; --pad-x:1rem; font-size:.8rem; font-weight:600; gap:.4rem; }
.pcard__btn svg{ width:14px; height:14px; }

/* =====================================================================
   REVIEWS
   ===================================================================== */
.google-badge{ display:inline-flex; align-items:center; gap:.8rem; padding:.7rem 1.2rem;
  background:var(--white); border:1px solid var(--line); border-radius:var(--pill); box-shadow:var(--sh-sm); }
.google-badge .g{ font-weight:700; font-size:1.05rem; letter-spacing:-.01em; }
.google-badge .g b:nth-child(1){color:#4285F4}.google-badge .g b:nth-child(2){color:#EA4335}.google-badge .g b:nth-child(3){color:#FBBC05}.google-badge .g b:nth-child(4){color:#4285F4}.google-badge .g b:nth-child(5){color:#34A853}
.google-badge .rating{ font-weight:700; color:var(--ink); }
.reviews{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,.5rem + 1.5vw,1.6rem); }
.review{ display:flex; flex-direction:column; gap:1rem; padding:1.8rem; border-radius:var(--r-lg);
  background:var(--white); border:1px solid var(--line); box-shadow:var(--sh-sm); }
.review .stars svg{ width:18px; height:18px; }
.review p{ color:var(--ink-body); font-size:1rem; flex:1; }
.review__author{ display:flex; align-items:center; gap:.75rem; }
.review__avatar{ width:42px; height:42px; border-radius:var(--pill); display:grid; place-items:center;
  background:var(--accent); color:#fff; font-weight:700; }
.review__author b{ color:var(--ink); font-size:.95rem; display:block; }
.review__author span{ font-size:.82rem; color:var(--ink-soft); }

/* =====================================================================
   FAQ
   ===================================================================== */
.faq{ max-width:820px; margin-inline:auto; display:flex; flex-direction:column; gap:.8rem; }
.qa{ border:1px solid rgba(134,207,168,.4); border-radius:var(--r); background:var(--white); overflow:hidden;
  transition:box-shadow var(--dur) var(--ease), border-color var(--dur) var(--ease); }
.qa[open]{ border-color:rgba(134,207,168,.75);
  box-shadow:0 0 32px -6px rgba(95,182,140,.42), 0 0 66px -16px rgba(95,182,140,.26), var(--sh); }
.qa summary{ list-style:none; cursor:pointer; padding:1.25rem 1.5rem; font-weight:600; color:var(--ink);
  display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.qa summary::-webkit-details-marker{ display:none; }
.qa summary .pm{ width:30px; height:30px; border-radius:var(--pill); flex:none; display:grid; place-items:center;
  background:var(--accent-050); color:var(--accent-700); transition:transform var(--dur) var(--ease), background var(--dur) var(--ease); }
.qa[open] summary .pm{ transform:rotate(45deg); background:var(--accent); color:#fff; }
.qa .qa__body{ padding:0 1.5rem 1.4rem; color:var(--ink-soft); }

/* =====================================================================
   CTA band
   ===================================================================== */
.cta-band{ position:relative; overflow:hidden; border-radius:var(--r-xl);
  padding:clamp(2.5rem,1.5rem + 4vw,4.5rem); color:#fff;
  background:linear-gradient(130deg,#06140F 0%,#0B271E 55%,#103328 100%);
  border:1px solid rgba(134,207,168,.32);
  box-shadow:0 0 46px -6px rgba(41,126,91,.5), 0 0 110px -26px rgba(41,126,91,.4), var(--sh-lg); }
.cta-band::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(rgba(134,207,168,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(134,207,168,.07) 1px, transparent 1px);
  background-size:46px 46px; }
.cta-band::after{ content:""; position:absolute; inset:0; z-index:0;
  background:radial-gradient(circle at 85% 20%, rgba(134,207,168,.18), transparent 50%),
             radial-gradient(circle at 10% 92%, rgba(255,255,255,.05), transparent 44%); }
.cta-band > *{ position:relative; z-index:1; }
.cta-band h2{ color:#fff; font-size:var(--h2); max-width:18ch; }
.cta-band p{ color:rgba(255,255,255,.9); font-size:var(--fs-lead); max-width:52ch; margin:1rem 0 2rem; }
.cta-band .btn--primary{ background:#fff; color:#123A30; box-shadow:0 14px 34px rgba(0,0,0,.25); }
.cta-band .btn--primary:hover{ background:#fff; color:#0E2A22; }
.cta-band__actions{ display:flex; flex-wrap:wrap; gap:.8rem; }

/* =====================================================================
   CONTACT / FORM
   ===================================================================== */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(1.5rem,1rem + 3vw,3.5rem); align-items:start; }
.contact-info{ display:flex; flex-direction:column; gap:1.1rem; }
.contact-info .ci{ display:flex; gap:1rem; align-items:flex-start; }
.contact-info .ci .ico{ width:44px; height:44px; border-radius:50%; flex:none; display:grid; place-items:center;
  background:var(--accent); color:#fff; }
.contact-info .ci .ico svg{ width:22px; height:22px; }
.contact-info .ci b{ color:var(--ink); display:block; }
.contact-info .ci a,.contact-info .ci span{ color:var(--ink-soft); }
.contact-info .ci a:hover{ color:var(--accent-700); }
.form-card{ background:var(--white); border:none; border-radius:var(--r-xl);
  padding:clamp(1.5rem,1rem + 2vw,2.5rem);
  box-shadow:0 0 46px -6px rgba(30,91,76,.4), 0 0 110px -18px rgba(30,91,76,.3), var(--sh);
  transition:box-shadow var(--dur) var(--ease); }
.form-card:focus-within{
  box-shadow:0 0 66px -6px rgba(30,91,76,.55), 0 0 140px -18px rgba(30,91,76,.38), var(--sh-md); }
.field{ margin-bottom:1.05rem; }
.field label{ display:block; font-size:.88rem; font-weight:600; color:var(--ink); margin-bottom:.4rem; }
.field label .req{ color:var(--accent-700); }
.field input,.field textarea,.field select{
  width:100%; padding:.85rem 1rem; border-radius:var(--r-sm);
  border:1.5px solid var(--line); background:var(--bg); color:var(--ink); font:inherit; font-size:.98rem;
  min-height:50px; transition:border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.field textarea{ min-height:130px; resize:vertical; }
.field input:focus,.field textarea:focus,.field select:focus{ outline:none; border-color:var(--accent);
  box-shadow:0 0 0 4px rgba(30,91,76,.16); }
.field-row{ display:grid; grid-template-columns:1fr 1fr; gap:1.05rem; }
.form-consent{ display:flex; gap:.6rem; align-items:flex-start; font-size:.85rem; color:var(--ink-soft); margin:.3rem 0 1.2rem; }
.form-consent input{ width:18px; height:18px; min-height:0; margin-top:3px; accent-color:var(--accent); flex:none; }
.form-note{ font-size:.82rem; color:var(--ink-soft); margin-top:1rem; text-align:center; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer{ background:#0E1B15; color:#B9C6BF; padding-block:clamp(3rem,2rem + 3vw,4.5rem) 2rem; }
.footer a{ color:#B9C6BF; transition:color var(--dur) var(--ease); }
.footer a:hover{ color:#fff; }
.footer__grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:2.5rem; padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.1); }
.footer__brand{ display:flex; align-items:center; gap:.6rem; color:#fff; font-weight:700; font-size:1.15rem; margin-bottom:1rem; }
.footer__brand .logo-mark{ width:34px; height:34px; color:var(--accent); }
.footer p{ font-size:.94rem; line-height:1.7; }
.footer h3{ color:#fff; font-size:.9rem; letter-spacing:.06em; text-transform:uppercase; margin-bottom:1.1rem; font-weight:600; }
/* Footer-Rechtslinks nicht mit .legal-Seitenregel kollidieren lassen (Kontrast!) */
.footer .legal a{ color:#8A988F; }
.footer .legal a:hover{ color:#fff; }
.footer ul{ display:flex; flex-direction:column; gap:.6rem; font-size:.94rem; }
.footer .fcontact{ display:flex; flex-direction:column; gap:.6rem; font-size:.94rem; }
.footer .fcontact a{ display:inline-flex; align-items:center; gap:.5rem; }
.footer .fcontact svg{ width:16px; height:16px; color:var(--accent); flex:none; }
.footer__bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding-top:1.6rem; font-size:.85rem; color:#8A988F; }
.footer__bottom a{ color:#8A988F; }
.footer__madeby{ display:inline-flex; align-items:baseline; gap:.42rem; }
.footer__madeby img{ height:12px; width:auto; opacity:.85; transition:opacity var(--dur) var(--ease); }
.footer__madeby:hover img{ opacity:1; }
.footer__bottom .legal{ display:flex; gap:1.4rem; flex-wrap:wrap; }

/* =====================================================================
   ARTICLE / BLOG
   ===================================================================== */
.post-hero{ padding-top:clamp(8rem,6rem + 6vw,10rem); padding-bottom:2rem; }
.post-meta{ display:flex; flex-wrap:wrap; gap:.6rem 1.2rem; align-items:center; color:var(--ink-soft); font-size:.88rem; margin-top:1rem; }
.post-meta .tag{ background:var(--accent-050); }
.post-cover{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-md); aspect-ratio:16/7; margin:2rem 0; background:var(--bg-soft); }
.post-cover img{ width:100%; height:100%; object-fit:cover; }
.prose{ max-width:760px; margin-inline:auto; }
.prose h2{ font-size:clamp(1.5rem,1.2rem + 1vw,2rem); margin:2.4rem 0 .9rem; }
.prose h3{ font-size:1.3rem; margin:1.8rem 0 .6rem; }
.prose p{ margin-bottom:1.15rem; color:var(--ink-body); }
.prose ul{ list-style:disc; padding-left:1.3rem; margin-bottom:1.3rem; display:flex; flex-direction:column; gap:.5rem; }
.prose ul li{ color:var(--ink-body); }
.prose ul li::marker{ color:var(--accent); }
.prose blockquote{ margin:1.6rem 0; padding:1.2rem 1.6rem; border-left:4px solid var(--accent);
  background:var(--accent-050); border-radius:0 var(--r) var(--r) 0; color:var(--ink); font-style:italic; }
.prose strong{ color:var(--ink); }
.callout{ display:flex; gap:1rem; padding:1.4rem 1.6rem; border-radius:var(--r); background:var(--bg-tint);
  border:1px solid var(--accent-100); margin:1.8rem 0; }
.callout svg{ width:24px; height:24px; color:var(--accent-700); flex:none; }

.blog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(1rem,.5rem + 1.5vw,1.8rem); }
.post-card{ display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line);
  border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm);
  transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease); }
.post-card:hover{ transform:translateY(-6px); box-shadow:var(--sh-md); }
.post-card__media{ aspect-ratio:16/10; overflow:hidden; background:var(--bg-soft); }
.post-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s var(--ease); }
.post-card:hover .post-card__media img{ transform:scale(1.05); }
.post-card__body{ padding:1.5rem; display:flex; flex-direction:column; flex:1; }
.post-card__body .tag{ align-self:flex-start; margin-bottom:.8rem; }
.post-card h3{ font-size:1.2rem; margin-bottom:.5rem; }
.post-card p{ color:var(--ink-soft); font-size:.95rem; margin-bottom:1.1rem; flex:1; }

/* =====================================================================
   PAGE HERO (subpages)
   ===================================================================== */
.page-hero{ position:relative; padding-top:clamp(8.5rem,6rem + 6vw,11rem); padding-bottom:var(--section-y); overflow:hidden; }
.page-hero::before{ content:""; position:absolute; top:-20%; right:-10%; width:min(600px,60vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(30,91,76,.22), transparent 68%); z-index:-1; }
.breadcrumb{ display:flex; gap:.5rem; align-items:center; font-size:.85rem; color:var(--ink-soft); margin-bottom:1.2rem; }
.breadcrumb a:hover{ color:var(--accent-700); }
.breadcrumb svg{ width:15px; height:15px; opacity:.6; }
/* ---- Full-Bleed Bild-Hero (Buttons unten links in der Ecke angedockt) ---- */
.imghero{ padding-top:6.5rem; padding-bottom:1.5rem; padding-inline:var(--gutter); }
.imghero > .container{ max-width:none; padding-inline:0; }
.imghero__crumb{ max-width:var(--container); margin:0 auto .8rem; padding-left:1.1rem; }
.imghero__frame{ position:relative; overflow:hidden; max-width:var(--container); margin-inline:auto;
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(1.8rem,1.1rem + 3vw,3.4rem);
  border-radius:clamp(20px,1rem + 1.4vw,32px); border:1px solid rgba(255,255,255,.09);
  min-height:calc(100vh - 10.5rem); min-height:max(480px, calc(100svh - 10.5rem)); box-shadow:var(--sh-lg); }
.imghero__frame > img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 58%; }
.imghero__scrim{ position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(90deg, rgba(5,13,9,.86) 0%, rgba(5,13,9,.5) 44%, rgba(5,13,9,.08) 74%),
             linear-gradient(0deg, rgba(5,13,9,.66) 0%, rgba(5,13,9,0) 52%); }
@media (max-width:760px){
  .imghero__frame{ padding-inline:.9rem; }
  .imghero__scrim{ background:linear-gradient(180deg, rgba(5,13,9,.5) 0%, rgba(5,13,9,.74) 42%, rgba(5,13,9,.9) 100%); }
}
.imghero__head{ position:relative; z-index:1; max-width:560px; }
.imghero__head .eyebrow{ margin-bottom:.7rem; }
.imghero h1{ color:#fff; font-size:clamp(1.55rem,1.05rem + 2.2vw,2.8rem); line-height:1.14; margin-bottom:.9rem; }
.imghero .lead{ color:rgba(255,255,255,.9); max-width:42ch; margin:0; }
.imghero__actions{ position:relative; z-index:2; margin-top:1.9rem; display:flex; flex-wrap:wrap; gap:.7rem; }
.page-hero__grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,1rem + 4vw,4rem); align-items:center; }
.page-hero h1{ font-size:clamp(1.55rem,1.05rem + 2.2vw,2.8rem); margin:.6rem 0 1rem; }

/* legal pages */
.legal{ max-width:820px; margin-inline:auto; }
.legal h2{ font-size:1.4rem; margin:2rem 0 .7rem; }
.legal h3{ font-size:1.1rem; margin:1.4rem 0 .5rem; }
.legal p, .legal li{ color:var(--ink-body); margin-bottom:.8rem; font-size:.98rem; }
.legal ul{ list-style:disc; padding-left:1.3rem; margin-bottom:1rem; }
.legal a{ color:var(--accent-700); word-break:break-word; }
.legal a:hover{ text-decoration:underline; }

/* =====================================================================
   SCROLL REVEAL
   ===================================================================== */
[data-reveal]{ opacity:0; transform:translateY(30px); filter:blur(8px);
  transition:opacity .9s var(--ease), transform .9s var(--ease), filter .9s var(--ease); }
/* Fallback: ohne JS (kein .js am <html>) bleibt der Inhalt sichtbar */
html:not(.js) [data-reveal]{ opacity:1 !important; transform:none !important; filter:none !important; }
[data-reveal].is-in{ opacity:1; transform:none; filter:blur(0); }
[data-reveal][data-delay="1"]{ transition-delay:.1s; }
[data-reveal][data-delay="2"]{ transition-delay:.2s; }
[data-reveal][data-delay="3"]{ transition-delay:.3s; }
[data-reveal][data-delay="4"]{ transition-delay:.4s; }
@media (prefers-reduced-motion: reduce){
  [data-reveal]{ filter:none; transform:none; transition:opacity .3s ease; }
}

/* =====================================================================
   COOKIE CONSENT
   ===================================================================== */
.cookie{ position:fixed; left:50%; bottom:1.2rem; transform:translateX(-50%) translateY(150%);
  z-index:200; width:min(680px,calc(100% - 2rem));
  background:var(--glass-bg); backdrop-filter:blur(18px) saturate(150%); -webkit-backdrop-filter:blur(18px) saturate(150%);
  border:1px solid var(--glass-brd); border-radius:var(--r-lg); box-shadow:var(--sh-lg);
  padding:1.3rem 1.5rem; transition:transform .5s var(--ease-spring); }
.cookie.is-in{ transform:translateX(-50%) translateY(0); }
.cookie p{ font-size:.9rem; color:var(--ink-body); margin-bottom:1rem; }
.cookie p a{ color:var(--accent-700); text-decoration:underline; }
.cookie__actions{ display:flex; flex-wrap:wrap; gap:.6rem; }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width:1024px){
  .cards, .reviews, .blog-grid{ grid-template-columns:repeat(2,1fr); }
  .float-card--tl{ left:.6rem; } .float-card--br{ right:.6rem; }
}
@media (max-width:860px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{ display:flex; }
  .split, .page-hero__grid, .contact-grid{ grid-template-columns:1fr; }
  .split{ display:flex; flex-direction:column; gap:0; }
  .split > div:not(.split__media){ display:contents; }
  .split > div:not(.split__media) > *{ order:3; }
  .split > div:not(.split__media) > .eyebrow,
  .split > div:not(.split__media) > .title{ order:1; }
  .split__media{ order:2; margin:1.4rem 0 1.7rem; }
  .fin-avatar{ margin-inline:auto; }
  .footer__grid{ grid-template-columns:1fr 1fr; gap:2rem; }
}
/* Timeline: unter 760px vertikal (klassisch, Linie links) */
@media (max-width:760px){
  .timeline{ grid-template-columns:1fr; gap:0; max-width:540px; margin-inline:auto; }
  .tl-item{ flex-direction:row; align-items:flex-start; text-align:left; gap:1.2rem; padding-bottom:1.8rem; }
  .tl-item:not(:last-child)::before{ top:54px; left:26px; width:2px; height:calc(100% - 54px);
    background:linear-gradient(180deg, rgba(134,207,168,.55), rgba(134,207,168,.28)); }
  html.js .tl-item:not(:last-child)::before{ transform:scaleY(0); transform-origin:top center; }
  html.js .tl-item.is-in:not(:last-child)::before{ transform:scaleY(1); }
  .tl-card{ margin-top:0; }
}
@media (max-width:560px){
  .cards, .reviews, .blog-grid, .stats, .team-cards{ grid-template-columns:1fr; }
  .team-cards{ max-width:400px; }
  .card__media{ aspect-ratio:16/10; }
  .hero__inner{ justify-content:center; padding-bottom:2rem; }
  .hero__title{ margin-top:0; }
  .field-row{ grid-template-columns:1fr; }
  .footer__grid{ grid-template-columns:1fr; }
  .hero__actions, .cta-band__actions, .imghero__actions{ justify-content:center; flex-wrap:wrap; }
  .imghero__actions .btn{ flex:0 1 auto; }
  h1, h2, .title, .eyebrow, .hero__kicker{ text-align:center; }
  .eyebrow{ display:block; }
  .lead, .hero__lead{ text-align:center; }
  .hero__lead{ max-width:100%; }
  .hero__scroll{ display:none; }
  .hero__meta{ display:none; }
  .stats-vp{ overflow:hidden;
    -webkit-mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);
    mask:linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent); }
  .stats.is-mloop{ display:flex; flex-wrap:nowrap; width:max-content; gap:2.8rem; animation:marqueeX 16s linear infinite; }
  .stats.is-mloop .stat{ flex:0 0 auto; }
  .footer__bottom{ flex-direction:column; align-items:center; gap:.8rem; text-align:center; }
  .footer__madeby{ justify-content:center; }
}

/* =====================================================================
   LARGE SCREENS / 4K — Container + Root-Schrift wachsen mit,
   damit der Content große Displays füllt (rem-basiert = alles skaliert)
   ===================================================================== */
/* Nur der Container wächst moderat mit — KEINE Root-Font-Skalierung
   (Schrift bleibt normal groß, auch auf 2K/4K). */
@media (min-width:1680px){ :root{ --container:1280px; } }
@media (min-width:2200px){ :root{ --container:1400px; } }
@media (min-width:3000px){ :root{ --container:1600px; } }

/* =====================================================================
   PREMIUM POLISH (soft-skill) — Agency-Tier Feinschliff
   Film-Grain · gerahmte Cards (Doppelrand) · magnetische Buttons · Icon-Chip
   ===================================================================== */

/* Feiner Film-Grain über dem Content = "teures Papier"-Gefühl */
body::after{
  content:""; position:fixed; inset:0; z-index:60; pointer-events:none;
  opacity:.05; mix-blend-mode:soft-light;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='150' height='150'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.82' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:150px 150px;
}

/* Magnetische Buttons: physisches Drücken + Icon-Slide */
.btn{ transition:transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease); }
.btn:active{ transform:scale(.975); }
.btn svg{ transition:transform var(--dur) var(--ease), background var(--dur) var(--ease); }

/* "Button-in-Button": Pfeil sitzt in eigenem Kreis-Chip */
.btn--primary svg{
  width:23px; height:23px; padding:4px; box-sizing:border-box;
  background:rgba(255,255,255,.18); border-radius:50%;
  margin-left:.15rem; margin-right:-.45rem;
}
.btn--primary:hover svg{ transform:translate(3px,-1px); background:rgba(255,255,255,.32); }
.hero .btn--primary svg{ background:rgba(255,255,255,.16); }
.hero .btn--primary:hover svg{ background:rgba(255,255,255,.26); }

/* Gerahmte "Tray"-Cards (nur Blog-Cards) */
.post-card{ padding:.5rem; }
.post-card__media{ border-radius:calc(var(--r-lg) - .5rem); }
.post-card__body{ padding:1.35rem 1.05rem 1.2rem; }

/* Cards heben beim Hover weicher + tiefer */
.card:hover, .post-card:hover{ transform:translateY(-8px); }

/* Person- & Review-Cards: feiner Innen-Highlight für Tiefe */
.person, .review, .form-card, .step, .qa{ box-shadow:var(--sh-sm); }
.person:hover, .review:hover{ box-shadow:var(--sh-md); }

/* Feinere, hellere Icon-Strokes (weg vom "dicken Lucide"-Look) */
.card__ico svg, .contact-info .ci .ico svg, .float-card .ico svg{ stroke-width:1.6; }

/* Echtes Inventor-Logo (Navbar hell / Footer dunkel) */
.nav__logo{ height:44px; width:auto; display:block; }
.footer__logo{ height:56px; width:auto; display:block; }
@media (max-width:560px){ .nav__logo{ height:42px; } }

/* Kontaktformular-Button kürzer (nicht full-width) */
.form-card button[type="submit"]{ width:auto; min-width:220px; }

/* =====================================================================
   TESTIMONIALS — 3 endlos vertikal scrollende Spalten (21st columns-1)
   ===================================================================== */
.testimonials{ position:relative; display:grid; grid-template-columns:repeat(3,1fr);
  gap:1.4rem; max-height:620px; overflow:hidden; margin-top:2.6rem;
  -webkit-mask:linear-gradient(180deg,transparent 0,#000 13%,#000 87%,transparent 100%);
  mask:linear-gradient(180deg,transparent 0,#000 13%,#000 87%,transparent 100%); }
.testi-col{ display:flex; flex-direction:column; gap:1.4rem; will-change:transform;
  animation:testiScroll var(--spd,28s) linear infinite; }
.testi-col--b{ --spd:36s; animation-delay:-6s; }
.testi-col--c{ --spd:32s; animation-delay:-14s; }
.testimonials:hover .testi-col{ animation-play-state:paused; }
@keyframes testiScroll{ to{ transform:translateY(-50%); } }
.testi{ background:#FFFFFF; border:1px solid rgba(0,0,0,.06); border-radius:var(--r-lg);
  padding:1.5rem 1.4rem; box-shadow:var(--sh-sm); }
.testi p{ color:#2A3A32; font-size:.95rem; line-height:1.6; margin-bottom:1.1rem; }
.testi__by{ display:flex; align-items:center; gap:.75rem; }
.testi__av{ width:40px; height:40px; border-radius:var(--pill); flex:none; display:grid; place-items:center;
  background:var(--accent); color:#fff; font-weight:700; font-size:.92rem; }
.testi__by b{ display:block; color:#14231E; font-size:.9rem; line-height:1.15; }
.testi__by div span{ font-size:.8rem; color:#5E6E66; }
@media (max-width:1024px){ .testimonials{ grid-template-columns:repeat(2,1fr); } .testi-col--c{ display:none; } }
@media (max-width:600px){ .testimonials{ grid-template-columns:1fr; max-height:560px; } .testi-col--b{ display:none; } }
@media (prefers-reduced-motion: reduce){ .testi-col{ animation:none; } }

/* Zeeg-Terminbuchung — eigener Kalender (Deep-Link zu Zeeg) */
.booking-embed{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sh-lg); border:1px solid rgba(255,255,255,.09); background:#fff; }
.booking-embed .zeeg-inline-widget{ display:block; }
/* Finanzierung: runder Ansprechpartner-Avatar */
.fin-avatar{ width:150px; height:150px; border-radius:50%; overflow:hidden; margin-bottom:1.5rem;
  border:1px solid rgba(134,207,168,.5);
  box-shadow:0 0 46px -6px rgba(41,126,91,.5), 0 0 110px -26px rgba(41,126,91,.4), var(--sh-lg); }
.fin-avatar img{ width:100%; height:100%; object-fit:cover; object-position:50% 16%; }
/* Termin-Buchung: kompakte, vertikal zentrierte Zwei-Spalten */
.book-grid{ align-items:center; }
.book-grid .fin-avatar{ width:118px; height:118px; margin-bottom:1rem; }
.book-grid .contact-info{ gap:.8rem; }
.book-grid .title{ font-size:clamp(1.5rem,1.2rem + 1.3vw,2rem); line-height:1.16; margin-bottom:.4rem; }
.book-grid .lead{ margin-bottom:.4rem; }
/* Footer: eu-frei.de-Link in deren Gold */
.footer__eufrei a{ color:#CDB88A; }
.footer__eufrei a:hover{ color:#E8D4A3; }
/* Hero: Microcopy + Trust-Zeile unter dem CTA */
.cta-micro{ font-size:.82rem; color:var(--ink-soft); margin-top:.15rem; }
.hero-trust{ display:inline-flex; align-items:center; gap:.45rem; font-size:.8rem; color:var(--ink-soft);
  margin-top:.55rem; padding:.34rem .7rem; border-radius:var(--pill);
  background:rgba(134,207,168,.08); border:1px solid rgba(134,207,168,.22); }
.hero-trust svg{ width:15px; height:15px; color:var(--accent-700); flex:none; }
.imghero__actions{ flex-wrap:wrap; }
.imghero__actions .cta-micro, .imghero__actions .hero-trust{ flex:0 0 100%; }
.hero__actions .cta-micro, .hero__actions .hero-trust{ flex:0 0 100%; }
/* Trust-Bar (ruhige Häkchen-Zeile unter dem Hero) */
.trustbar{ padding:1rem var(--gutter); border-bottom:1px solid var(--line); background:var(--bg-soft); overflow:hidden; }
.trustbar__track{ display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:.55rem 1.7rem; }
.trustbar__track > span:nth-child(n+5){ display:none; }
.trustbar span{ display:inline-flex; align-items:center; gap:.45rem; font-size:.9rem; color:var(--ink-soft); white-space:nowrap; }
.trustbar svg{ width:16px; height:16px; color:var(--accent-700); flex:none; }
@media (max-width:760px){
  .trustbar{ padding-inline:0; }
  .trustbar__track{ flex-wrap:nowrap; justify-content:flex-start; width:max-content; gap:0;
    animation:trustMarquee 20s linear infinite; }
  .trustbar__track > span{ display:inline-flex; margin-right:1.7rem; flex:none; }
  .trustbar__track > span:nth-child(n+5){ display:inline-flex; }
}
@keyframes trustMarquee{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .trustbar__track{ animation:none; flex-wrap:wrap; width:auto; justify-content:center; gap:.55rem 1.7rem; }
  .trustbar__track > span{ margin-right:0; }
  .trustbar__track > span:nth-child(n+5){ display:none; }
}
/* Sticky Mobile-CTA-Leiste (nur Mobile) */
.mcta-bar{ display:none; }
@media (max-width:860px){
  .mcta-bar{ position:fixed; left:0; right:0; bottom:0; z-index:94;
    display:flex; gap:.5rem; align-items:center;
    padding:.55rem .7rem calc(.55rem + env(safe-area-inset-bottom));
    background:rgba(11,18,14,.94); backdrop-filter:blur(16px) saturate(150%); -webkit-backdrop-filter:blur(16px) saturate(150%);
    border-top:1px solid rgba(255,255,255,.1); box-shadow:0 -6px 24px rgba(0,0,0,.4); }
  .mcta-bar a{ min-height:46px; display:flex; align-items:center; justify-content:center; gap:.4rem;
    border-radius:12px; font-weight:600; font-size:.92rem; white-space:nowrap; }
  .mcta-call{ flex:0 0 auto; padding:0 1.05rem; color:var(--ink); background:var(--accent-050); border:1px solid var(--line); }
  .mcta-call svg{ width:19px; height:19px; }
  .mcta-book{ flex:1 1 auto; }
  body{ padding-bottom:66px; }
  .cookie{ bottom:70px; }
}
.booking-card{ background:var(--white); border-radius:var(--r-xl);
  padding:clamp(1.4rem,1rem + 1.4vw,2rem); display:flex; flex-direction:column; gap:1.3rem;
  box-shadow:0 0 46px -6px rgba(30,91,76,.4), 0 0 110px -18px rgba(30,91,76,.3), var(--sh); }
.booking-cols{ display:grid; grid-template-columns:1fr 148px; gap:1.4rem; align-items:start; }
.cal__head{ display:flex; align-items:center; justify-content:space-between; margin-bottom:.9rem; }
.cal__title{ font-weight:600; color:var(--ink); font-size:1rem; }
.cal__nav{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; color:var(--ink);
  background:var(--accent-050); transition:background var(--dur) var(--ease); }
.cal__nav:hover{ background:var(--accent-100); }
.cal__nav svg{ width:17px; height:17px; }
.cal__weekdays{ display:grid; grid-template-columns:repeat(7,1fr); gap:2px; margin-bottom:.45rem; }
.cal__weekdays span{ text-align:center; font-size:.68rem; font-weight:600; color:var(--ink-soft); text-transform:uppercase; }
.cal__grid{ display:grid; grid-template-columns:repeat(7,1fr); gap:3px; }
.cal__day{ aspect-ratio:1; border-radius:50%; display:grid; place-items:center; font-size:.85rem; color:var(--ink);
  transition:background var(--dur) var(--ease), color var(--dur) var(--ease); }
.cal__day:hover:not(:disabled):not(.is-sel){ background:var(--accent-050); }
.cal__day.is-sel{ background:var(--accent); color:#fff; font-weight:600; }
.cal__day:disabled{ color:#3C4C44; cursor:default; }
.cal__day.is-empty{ visibility:hidden; }
.slots__label{ display:block; font-size:.78rem; color:var(--ink-soft); margin-bottom:.6rem; font-weight:600; }
.slots__list{ display:flex; flex-direction:column; gap:.45rem; max-height:246px; overflow-y:auto; padding-right:2px; }
.slot{ padding:.55rem .4rem; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--bg); color:var(--ink);
  font-size:.85rem; font-weight:500; text-align:center; cursor:pointer;
  transition:border-color var(--dur) var(--ease), background var(--dur) var(--ease), color var(--dur) var(--ease); }
.slot:hover{ border-color:var(--accent); }
.slot.is-sel{ background:var(--accent); color:#fff; border-color:var(--accent); }
.slots__empty{ font-size:.8rem; color:var(--ink-soft); }
.booking-card [data-book]{ align-self:center; width:auto; min-width:230px; }
.booking-card [data-book][aria-disabled="true"]{ opacity:.45; pointer-events:none; }
.form-note a{ color:var(--accent-700); text-decoration:underline; }
@media (max-width:600px){
  .booking-cols{ grid-template-columns:1fr; }
  .slots__list{ max-height:none; flex-direction:row; flex-wrap:wrap; }
  .slot{ flex:1 0 27%; }
}

/* CTA-Balken mit Ansprechpartner-Foto (rund) */
.cta-band--person{ display:flex; align-items:center; gap:clamp(1.6rem,1rem + 3vw,3.4rem); }
.cta-band--person.is-right{ flex-direction:row-reverse; }
.cta-band__photo{ flex:none; width:clamp(215px,21vw,310px); aspect-ratio:1; border-radius:50%; overflow:hidden;
  border:1px solid rgba(134,207,168,.85);
  box-shadow:0 0 24px -2px rgba(41,126,91,.65), 0 0 52px -12px rgba(41,126,91,.45), 0 14px 30px rgba(0,0,0,.3); }
.cta-band__photo img{ width:100%; height:100%; object-fit:cover; }
.cta-band__photo.is-team img{ object-position:50% 8%; }
.cta-band__text h2{ max-width:20ch; }
@media (max-width:640px){
  .cta-band--person, .cta-band--person.is-right{ flex-direction:column; text-align:center; }
  .cta-band__text h2, .cta-band__text p{ max-width:100%; }
  .cta-band__actions{ justify-content:center; }
}

/* "Alle Bewertungen auf Google"-Button: Rand in Accent-Farbe (kein Glow) */
#bewertungen .btn--ghost{ border:1.5px solid var(--accent); background:transparent; color:var(--ink); box-shadow:none; }
#bewertungen .btn--ghost:hover{ border-color:var(--accent-700); color:var(--accent-700); background:rgba(41,126,91,.1); transform:translateY(-2px); box-shadow:none; }

/* Kariertes Accent-Gitter nur hinter den Testimonial-Kacheln */
.testimonials{
  background-image:
    linear-gradient(rgba(134,207,168,.5) 1px, transparent 1px),
    linear-gradient(90deg, rgba(134,207,168,.5) 1px, transparent 1px);
  background-size:46px 46px; background-position:center;
}