/* LUCRAM MEDIA — WP-Gen Design v6 */
:root {
  --font-heading: 'Michroma', 'Arial', sans-serif;
  --font-body: 'Space Grotesk', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --c-ink: #15110C;
  --c-bg: #F5EFE9;
  --c-card: #FBF8F4;
  --c-orange: #FC6A0B;
  --c-orange-light: #FF8A3D;
  --c-warm: #493F37;
  --c-muted: #9A8D80;
  --c-stone: #B8ADA3;
}
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--c-bg); }
html { overflow-x: clip; }
body { font-family: var(--font-body); color: var(--c-ink); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
a { color: var(--c-ink); text-decoration: none; }
a:hover { color: var(--c-orange); }
::selection { background: var(--c-orange); color: #FAF7F2; }
:focus-visible { outline: 2px solid var(--c-orange); outline-offset: 3px; }
input, textarea, button, select { font-family: inherit; }
img { max-width: 100%; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
@media (prefers-reduced-motion: reduce) { * { animation-duration: 0.001s !important; animation-iteration-count: 1 !important; transition-duration: 0.001s !important; } }

@keyframes lmFloatYs { 0% { transform: translateY(0) rotate(var(--r, 0deg)); } 100% { transform: translateY(-9px) rotate(var(--r, 0deg)); } }
@keyframes lmPulse { 0%, 100% { opacity: 0.55; transform: scale(1); } 50% { opacity: 1; transform: scale(1.25); } }
@keyframes lmGlow { 0%, 100% { opacity: 0.5; transform: scale(0.85); } 50% { opacity: 1; transform: scale(1.3); } }
@keyframes lmMenuIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes lmShine { from { background-position: 150% center; } to { background-position: -50% center; } }
@keyframes lmOrbit { from { offset-distance: 0%; } to { offset-distance: 100%; } }
@keyframes lmColUp { from { transform: translateY(0); } to { transform: translateY(-50%); } }
@keyframes lmColDown { from { transform: translateY(-50%); } to { transform: translateY(0); } }
@keyframes lmStepIn { from { opacity: 0; transform: translateX(56px); } to { opacity: 1; transform: translateX(0); } }

/* ---------- Typo ---------- */
.eyebrow { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--c-orange); margin: 0 0 28px; }
.mono-hint { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-muted); margin: 0; }
.mono-strong { font-family: var(--font-mono); font-weight: 700; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-ink); margin: 0; }
.h-display { font-family: var(--font-heading); font-weight: 500; line-height: 1.2; margin: 0; }
.h-xl { font-size: clamp(30px, 3.74vw, 52px); }
.h-lg { font-size: clamp(27px, 3.19vw, 46px); }
.h-md { font-size: clamp(24px, 2.53vw, 36px); }
.accent-shine { background-image: linear-gradient(110deg, #FC6A0B 0%, #FC6A0B 38%, #FFC79E 50%, #FC6A0B 62%, #FC6A0B 100%); background-size: 200% auto; -webkit-background-clip: text; background-clip: text; color: transparent; animation: lmShine 3.5s linear infinite; }
.lead-bold { font-size: clamp(16px, 1.4vw, 19px); line-height: 1.75; color: #2E2620; font-weight: 600; margin: 0 0 20px; }
.lead { font-size: 15px; line-height: 1.75; color: var(--c-warm); margin: 0 0 20px; }
.reveal { opacity: 0; transform: translateY(50px); transition: opacity 1s ease, transform 1.1s cubic-bezier(0.16, 1, 0.3, 1); }
.reveal.is-in { opacity: 1; transform: none; }

/* ---------- Buttons ---------- */
.btn-primary { font-family: var(--font-mono); font-size: 13px; letter-spacing: 0.18em; text-transform: uppercase; color: #FAF7F2; padding: 17px 32px; border-radius: 999px; display: inline-block; border: none; cursor: pointer; background-image: linear-gradient(110deg, #FC6A0B 0%, #FC6A0B 42%, #FFC79E 50%, #FC6A0B 58%, #FC6A0B 100%); background-size: 230% auto; background-position: 0% center; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.btn-primary:hover { animation: lmShine 1.8s linear infinite; transform: translateY(-3px); box-shadow: 0 14px 34px rgba(252, 106, 11, 0.4); color: #FAF7F2; }

/* ---------- Rahmen ---------- */
.progress-rail { position: fixed; left: 0; top: 0; bottom: 0; width: 6px; background: rgba(21, 17, 12, 0.08); z-index: 150; pointer-events: none; }
.progress-rail .bar { width: 6px; height: 0%; border-radius: 0 999px 999px 0; background: linear-gradient(#FF8A3D, #FC6A0B); box-shadow: 0 0 12px rgba(252, 106, 11, 0.9), 0 0 30px rgba(252, 106, 11, 0.5); transition: height 0.15s linear; }
.spark-canvas { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 220; pointer-events: none; }
.skip-link { position: fixed; top: -80px; left: 20px; z-index: 300; background: var(--c-orange); color: #FAF7F2; padding: 12px 22px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; border-radius: 999px; transition: top 0.2s ease; }
.skip-link:focus { top: 20px; color: #FAF7F2; }

/* ---------- Intro / Preloader ---------- */
.preloader { position: fixed; inset: 0; z-index: 240; background: var(--c-bg); transition: opacity 0.5s ease; }
.preloader video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.intro-flash { position: fixed; inset: 0; z-index: 241; background: radial-gradient(circle at 50% 55%, #FFB073 0%, #FC6A0B 45%, #FC6A0B 100%); opacity: 0; pointer-events: none; }

/* ---------- Header ---------- */
.site-header { position: fixed; top: 0; left: 0; right: 0; z-index: 100; border-bottom: 1px solid rgba(255, 255, 255, 0.5); background: rgba(250, 247, 242, 0.88); backdrop-filter: blur(14px) saturate(0.9); transition: background 0.5s ease, border-color 0.5s ease; }
.site-header.is-scrolled { border-bottom-color: rgba(255, 255, 255, 0.6); }
.site-header .inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 0 clamp(20px, 4vw, 56px); height: 76px; }
.brand { font-family: var(--font-heading); font-weight: 700; font-size: 16px; letter-spacing: 0.12em; display: flex; align-items: center; gap: 12px; color: var(--c-ink); }
.brand img { height: 30px; width: auto; display: block; }
.wp-gen-menu { list-style: none; display: flex; align-items: center; gap: clamp(14px, 2.2vw, 34px); margin: 0; padding: 0; }
.wp-gen-menu li { margin: 0; padding: 0; position: relative; }
.wp-gen-menu li.menu-item-has-children > a::after { content: ' ▾'; font-size: 9px; color: var(--c-orange); }
.wp-gen-menu .sub-menu { position: absolute; top: 100%; left: 50%; min-width: 240px; margin: 0; padding: 10px; list-style: none; display: flex; flex-direction: column; gap: 2px; background: rgba(250, 247, 242, 0.97); backdrop-filter: blur(14px); border: 1px solid rgba(21, 17, 12, 0.12); border-radius: 14px; box-shadow: 0 20px 50px rgba(21, 17, 12, 0.16); opacity: 0; visibility: hidden; transform: translate(-50%, 16px); transition: opacity 0.25s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s; z-index: 6; }
.wp-gen-menu li:hover > .sub-menu, .wp-gen-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: translate(-50%, 8px); }
.wp-gen-menu .sub-menu::before { content: ''; position: absolute; left: 0; right: 0; top: -16px; height: 16px; }
.wp-gen-menu .sub-menu li { width: 100%; }
.wp-gen-menu .sub-menu a { display: flex; align-items: baseline; gap: 10px; padding: 10px 14px; border-radius: 9px; font-size: 11px; letter-spacing: 0.12em; transition: background 0.25s ease, color 0.25s ease; }
.wp-gen-menu .sub-menu a:hover { background: rgba(252, 106, 11, 0.1); color: var(--c-orange); }
.wp-gen-menu .sub-menu .sub-num { font-size: 9px; color: var(--c-orange); min-width: 16px; }
body.lm-dark .wp-gen-menu .sub-menu { background: rgba(25, 22, 19, 0.97); border-color: rgba(240, 232, 224, 0.15); }
body.lm-dark .wp-gen-menu .sub-menu a:hover { background: rgba(252, 106, 11, 0.16); }
.wp-gen-menu a { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; padding: 6px 0; transition: color 0.25s ease; color: var(--c-ink); }
.wp-gen-menu a:hover, .wp-gen-menu .current-menu-item a { color: var(--c-orange); }
.header-right { display: flex; align-items: center; gap: 18px; }
.lang-switch { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; }
.lang-switch button { background: none; border: none; padding: 2px; cursor: pointer; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; font-weight: 700; color: var(--c-muted); transition: color 0.25s ease; }
.lang-switch button.is-active { color: var(--c-orange); }
.lang-switch button svg { display: block; border-radius: 2.5px; opacity: 0.45; filter: saturate(0.35); transition: opacity 0.25s ease, filter 0.25s ease, box-shadow 0.25s ease; }
.lang-switch button:hover svg { opacity: 0.85; filter: saturate(0.8); }
.lang-switch button.is-active svg { opacity: 1; filter: none; box-shadow: 0 0 0 1.5px var(--c-orange); }
.dark-toggle { background: none; border: 1px solid rgba(21, 17, 12, 0.25); border-radius: 999px; flex: 0 0 auto; min-width: 34px; width: 34px; height: 34px; cursor: pointer; font-size: 15px; line-height: 1; color: var(--c-ink); display: inline-flex; align-items: center; justify-content: center; padding: 0; transition: border-color 0.25s ease, color 0.25s ease; }
.dark-toggle:hover { border-color: var(--c-orange); color: var(--c-orange); }
.header-cta { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; color: #FAF7F2; padding: 12px 24px; border-radius: 999px; display: inline-block; background-image: linear-gradient(110deg, #FC6A0B 0%, #FC6A0B 42%, #FFC79E 50%, #FC6A0B 58%, #FC6A0B 100%); background-size: 230% auto; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.header-cta:hover { animation: lmShine 1.8s linear infinite; transform: translateY(-2px); box-shadow: 0 10px 26px rgba(252, 106, 11, 0.4); color: #FAF7F2; }
@media (max-width: 900px) { .site-header .nav-center { display: none; } }

/* ---------- Hero ---------- */
.hero { position: relative; min-height: 100svh; display: flex; align-items: center; overflow: clip; }
.hero-vids { position: absolute; inset: 0; background: #14110e; }
.hero-vids video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 0.65s ease; }
.hero-vids video[data-hero-vid="base"] { opacity: 1; }
.hero-rays { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; mix-blend-mode: screen; }
.hero-glow { position: absolute; left: calc(49.5% - 130px); top: calc(62% - 130px); margin-top: -80px; width: 260px; height: 260px; border-radius: 50%; background: radial-gradient(circle, rgba(252, 106, 11, 0.95) 0%, rgba(255, 138, 61, 0.5) 38%, rgba(252, 106, 11, 0) 70%); mix-blend-mode: screen; filter: blur(5px); animation: lmGlow 2.4s ease-in-out infinite; pointer-events: none; z-index: 1; }.hero-panel { position: relative; z-index: 2; width: min(480px, calc(100vw - 40px)); margin: 130px auto 130px clamp(20px, 6vw, 110px); border-radius: 26px; padding: clamp(28px, 3.4vw, 54px); box-shadow: 0 30px 80px rgba(21, 17, 12, 0.14); will-change: transform; }
.hero-panel .kicker { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--c-orange); margin: 0 0 24px; }
.hero-panel .kicker .sub { color: var(--c-warm); }
.hero-panel h1 { font-family: var(--font-heading); font-weight: 400; font-size: clamp(26px, 2.8vw, 46px); line-height: 1.14; letter-spacing: 0.01em; margin: 0; }
.hero-services { margin-top: 28px; border-top: 1px solid rgba(21, 17, 12, 0.15); }
.hero-service { display: flex; align-items: center; gap: 16px; width: 100%; text-align: left; background: none; border: none; border-bottom: 1px solid rgba(21, 17, 12, 0.15); padding: 15px 6px; cursor: pointer; transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), background 0.35s ease; }
.hero-service .num { font-family: var(--font-mono); font-weight: 700; font-size: 13px; letter-spacing: 0.2em; color: var(--c-muted); min-width: 28px; transition: color 0.3s ease; }
.hero-service .title { font-family: var(--font-heading); font-weight: 700; font-size: clamp(15px, 1.35vw, 20px); letter-spacing: 0.03em; color: var(--c-ink); flex: 1; transition: color 0.3s ease; }
.hero-service .arrow { font-family: var(--font-mono); font-size: 14px; color: var(--c-orange); opacity: 0; transform: translateX(-8px); transition: opacity 0.3s ease, transform 0.35s cubic-bezier(0.22, 1, 0.36, 1); }
.hero-service.is-on { transform: translateX(10px); background: rgba(252, 106, 11, 0.09); }
.hero-service.is-on .num, .hero-service.is-on .title { color: var(--c-orange); }
.hero-service.is-on .arrow { opacity: 1; transform: translateX(0); }
.hero-panel .ctas { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-top: 26px; }
.logo-rail { position: absolute; right: clamp(24px, 3.4vw, 56px); top: 50%; transform: translateY(-50%); z-index: 2; width: 150px; height: min(64vh, 540px); border-radius: 22px; overflow: hidden; }
.logo-rail .fade-top, .logo-rail .fade-bottom { position: absolute; left: 0; right: 0; height: 80px; z-index: 2; pointer-events: none; }
.logo-rail .fade-top { top: 0; background: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0)); }
.logo-rail .fade-bottom { bottom: 0; background: linear-gradient(rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.7)); }
.logo-rail .track { display: flex; flex-direction: column; align-items: center; gap: 24px; padding: 24px 0; animation: lmColUp 26s linear infinite; will-change: transform; }
.logo-rail .logo-item { width: 112px; height: 48px; display: flex; align-items: center; justify-content: center; flex: 0 0 auto; }
.logo-rail .logo-item img, .logo-rail .logo-item svg { max-width: 100px; max-height: 40px; width: 100px; height: 40px; object-fit: contain; display: block; }
@media (min-width: 901px) and (max-width: 980px) { .logo-rail { display: none; } }
.hero-foot { position: absolute; bottom: 24px; z-index: 2; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--c-warm); display: flex; align-items: center; gap: 14px; }
.hero-foot.left { left: clamp(20px, 4vw, 56px); }
.hero-foot.right { right: clamp(20px, 4vw, 56px); }
.hero-foot .line { width: 44px; height: 1px; background: rgba(21, 17, 12, 0.35); display: inline-block; }

/* ---------- Mega Menu ---------- */
.mega-menu { position: fixed; inset: 0; z-index: 95; background: rgba(245, 239, 233, 0.96); backdrop-filter: blur(18px); overflow-y: auto; animation: lmMenuIn 0.5s cubic-bezier(0.16, 1, 0.3, 1) both; display: none; }
.mega-menu.is-open { display: block; }
.mega-menu .inner { max-width: 1080px; margin: 0 auto; padding: 140px clamp(20px, 5vw, 60px) 80px; }
.mega-menu .head { display: flex; justify-content: space-between; align-items: baseline; border-bottom: 1px solid rgba(21, 17, 12, 0.15); padding-bottom: 18px; }
.mega-menu .head .kicker { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-orange); }
.mega-menu .close { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; background: none; border: 1px solid rgba(21, 17, 12, 0.3); border-radius: 999px; padding: 10px 22px; color: var(--c-ink); transition: border-color 0.25s ease, color 0.25s ease, transform 0.25s ease; cursor: pointer; }
.mega-menu .close:hover { border-color: var(--c-orange); color: var(--c-orange); transform: translateY(-2px); }
.mega-menu .row { display: flex; align-items: baseline; gap: clamp(16px, 3vw, 40px); padding: 24px 10px; border-bottom: 1px solid rgba(21, 17, 12, 0.12); transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), background 0.35s ease; }
.mega-menu .row:hover { transform: translateX(12px); background: rgba(251, 248, 244, 0.8); }
.mega-menu .row .num { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; color: var(--c-orange); min-width: 34px; }
.mega-menu .row .t { font-family: var(--font-heading); font-weight: 500; font-size: clamp(22px, 3.2vw, 38px); letter-spacing: 0.01em; flex: 1 1 auto; }
.mega-menu .row .arr { font-family: var(--font-mono); font-size: 14px; color: var(--c-muted); }

/* ---------- Sektionen ---------- */
.section { background: var(--c-bg); padding: clamp(100px, 14vh, 170px) clamp(20px, 6vw, 110px); }

/* System + Orbit */
.system-section { background: var(--c-bg); padding: clamp(100px, 14vh, 170px) 0 clamp(130px, 18vh, 220px); overflow: clip; }
.system-inner { padding: 0 clamp(20px, 6vw, 110px); }
.system-cols { display: flex; flex-wrap: wrap; gap: clamp(30px, 5vw, 80px); margin-top: clamp(44px, 6vh, 80px); align-items: center; }
.system-copy { flex: 1 1 320px; max-width: 480px; }
.orbit-outer { flex: 1 1 480px; position: relative; aspect-ratio: 900 / 470; min-width: 0; }
.orbit-stage { position: absolute; left: 50%; top: 50%; width: 900px; height: 470px; margin-left: -450px; margin-top: -235px; will-change: transform; }
.orbit-ring { position: absolute; left: 90px; top: 85px; width: 720px; height: 300px; border: 1px dashed rgba(21, 17, 12, 0.22); border-radius: 50%; }
.orbit-item { position: absolute; left: 0; top: 0; width: 235px; height: 270px; offset-path: path('M 90 235 A 360 150 0 1 0 810 235 A 360 150 0 1 0 90 235'); offset-rotate: 0deg; offset-anchor: center; animation: lmOrbit 46s linear infinite reverse; will-change: offset-distance; }
.orbit-card { width: 235px; height: 270px; background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.18); border-radius: 14px; overflow: hidden; display: flex; flex-direction: column; box-shadow: 0 10px 26px rgba(21, 17, 12, 0.08); }
.orbit-card .media { display: block; flex: 1 1 auto; position: relative; overflow: hidden; }
.orbit-card .media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.orbit-card .media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(251, 248, 244, 0) 35%, rgba(251, 248, 244, 0.9) 82%, #FBF8F4 100%); }
.orbit-card .label { display: block; flex: 0 0 auto; padding: 0 12px 16px; text-align: center; background: var(--c-card); }
.orbit-card .label .num { font-family: var(--font-heading); font-weight: 700; font-size: 23px; letter-spacing: 0.08em; color: var(--c-orange); }
.orbit-card .label .name { display: block; font-family: var(--font-heading); font-weight: 700; font-size: 20px; line-height: 1.35; color: var(--c-ink); margin-top: 4px; }
.orbit-center { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.14); border-radius: 999px; padding: 24px 40px; display: flex; align-items: center; gap: 12px; box-shadow: 0 24px 60px rgba(21, 17, 12, 0.18); }
.orbit-center img { height: 38px; width: auto; display: block; }
.orbit-center .t { font-family: var(--font-heading); font-weight: 700; font-size: clamp(16px, 1.8vw, 22px); letter-spacing: 0.04em; color: var(--c-ink); white-space: nowrap; }

/* Marquee */
.marquee-wrap { margin-top: clamp(130px, 20vh, 260px); padding: clamp(22px, 3.5vh, 40px) 0; overflow: clip; display: flex; flex-direction: column; gap: clamp(10px, 2vh, 24px); }
.marquee-row { display: flex; align-items: center; gap: 40px; width: max-content; will-change: transform; }
.marquee-item { display: flex; align-items: center; gap: 40px; white-space: nowrap; }
.marquee-item .word { font-family: var(--font-heading); font-weight: 500; font-size: clamp(38px, 4vw, 58px); line-height: 1.2; color: var(--c-ink); }
.marquee-item .diamond { width: 11px; height: 11px; background: var(--c-orange); transform: rotate(45deg); display: inline-block; flex: 0 0 auto; }
.marquee-row.alt .diamond { background: transparent; border: 1px solid var(--c-ink); }

/* Fan (Kompetenzwelten) */
.fan-scale { display: flex; justify-content: center; }
.fan { position: relative; width: 1400px; height: 530px; flex: 0 0 auto; }
.fan-card { position: absolute; left: 50%; top: 50%; width: 350px; height: 490px; margin-left: -175px; margin-top: -245px; background: transparent; border: none; padding: 0; cursor: pointer; perspective: 1400px; transform: translate(0, 0) scale(1); transition: transform 0.9s cubic-bezier(0.34, 1.56, 0.64, 1); will-change: transform; }
body:not(.lm-fan-track-present) .fan:not(.is-revealed) .fan-card { transform: translate(0, 0) scale(0); }
.fan-card .flip { position: absolute; inset: 0; display: block; transition: transform 0.7s cubic-bezier(0.35, 0.1, 0.2, 1); transform-style: preserve-3d; }
.fan-card.is-open .flip { transform: rotateY(180deg); }
.fan-face { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; border-radius: 18px; overflow: hidden; box-shadow: 0 18px 44px rgba(21, 17, 12, 0.12); display: flex; flex-direction: column; text-align: left; }
.fan-front { background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); justify-content: flex-end; gap: 8px; padding: 22px; position: absolute; }
.fan-card.is-open .fan-front { border-color: rgba(252, 106, 11, 0.7); }
.fan-front .media { position: absolute; inset: 0; }
.fan-front .media img { width: 100%; height: 100%; object-fit: cover; object-position: center top; display: block; }
.fan-front .media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(251, 248, 244, 0) 38%, rgba(251, 248, 244, 0.88) 70%, #FBF8F4 100%); }
.fan-front .num { position: relative; font-family: var(--font-heading); font-size: 19px; line-height: 1.2; color: var(--c-orange); }
.fan-front .title { position: relative; font-family: var(--font-heading); font-size: 16.5px; line-height: 1.45; color: var(--c-ink); }
.fan-back { transform: rotateY(180deg); background: var(--c-card); border: 1px solid rgba(252, 106, 11, 0.5); align-items: flex-start; gap: 12px; padding: 24px; }
.fan-cta { margin-top: auto; display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-mono); font-weight: 700; font-size: 12px; letter-spacing: 0.08em; color: var(--c-orange); text-decoration: none; cursor: pointer; border-bottom: 1px solid rgba(252, 106, 11, 0.4); padding-bottom: 3px; }
.fan-cta:hover { border-bottom-color: var(--c-orange); }
.fan-back .meta { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-orange); }
.fan-back .headline { font-family: var(--font-heading); font-size: 21px; line-height: 1.35; color: var(--c-ink); }
.fan-back .text { font-size: 13.5px; line-height: 1.65; color: var(--c-warm); }
.fan-back .close-hint { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-muted); margin-top: auto; }
.fan-back .close-hint em { font-style: normal; color: var(--c-orange); }

/* Diagnose */
.diag { display: flex; flex-wrap: wrap; gap: clamp(30px, 4vw, 70px); align-items: stretch; }
.diag-list { flex: 1 1 380px; display: flex; flex-direction: column; border-top: 1px solid rgba(21, 17, 12, 0.18); }
.diag-tab { display: flex; align-items: baseline; gap: 18px; text-align: left; padding: 20px 16px; border: none; border-bottom: 1px solid rgba(21, 17, 12, 0.18); background: transparent; color: var(--c-ink); transition: background 0.35s ease, padding-left 0.35s ease, box-shadow 0.35s ease; font-family: var(--font-body); cursor: pointer; border-radius: 8px 8px 0 0; width: 100%; }
.diag-tab:hover { padding-left: 26px; background: rgba(252, 106, 11, 0.1); box-shadow: inset 4px 0 0 var(--c-orange); }
.diag-tab.is-active { background: var(--c-card); }
.diag-tab .num { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.18em; color: var(--c-muted); min-width: 26px; }
.diag-tab.is-active .num { color: var(--c-orange); }
.diag-tab .t { font-size: clamp(15px, 1.3vw, 18px); font-weight: 600; line-height: 1.4; }
.diag-stage { flex: 1 1 420px; position: relative; overflow: hidden; background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); border-radius: 18px; padding: clamp(26px, 3vw, 46px); min-height: 360px; transition: border-color 0.35s ease; }
.diag-stage:hover { border-color: rgba(252, 106, 11, 0.5); }
.diag-panel { display: none; }
.diag-panel.is-active { display: block; }
.diag-panel .plabel { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-orange); margin: 0 0 16px; }
.diag-panel h3 { font-family: var(--font-heading); font-weight: 500; font-size: clamp(22px, 2.4vw, 36px); line-height: 1.1; margin: 0 0 22px; }
.diag-panel .slabel { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-muted); margin: 0 0 10px; }
.diag-panel .sol { font-size: 15px; line-height: 1.7; color: var(--c-warm); margin: 0 0 26px; }
.chips { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.chip { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; border: 1px solid rgba(21, 17, 12, 0.25); border-radius: 999px; padding: 8px 14px; background: var(--c-bg); display: inline-block; }
.chip-connector { width: 14px; height: 1px; background: rgba(252, 106, 11, 0.6); display: inline-block; }
.chip-final { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; border-radius: 999px; padding: 9px 16px; background: var(--c-orange); color: #FAF7F2; display: inline-block; }
.diag-cta { display: inline-block; margin-top: 28px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.16em; text-transform: uppercase; color: #FAF7F2; padding: 15px 28px; border-radius: 999px; background-image: linear-gradient(110deg, #FC6A0B 0%, #FC6A0B 42%, #FFC79E 50%, #FC6A0B 58%, #FC6A0B 100%); background-size: 230% auto; transition: transform 0.3s ease, box-shadow 0.3s ease; }
.diag-cta:hover { animation: lmShine 1.8s linear infinite; transform: translateY(-3px); box-shadow: 0 14px 34px rgba(252, 106, 11, 0.4); color: #FAF7F2; }

/* Würfel */
.cubes-scale { display: flex; justify-content: center; overflow: visible; }
.cubes { display: grid; grid-template-columns: repeat(7, 96px); gap: 34px; perspective: 1100px; flex: 0 0 auto; }
.cube-slot { position: relative; width: 96px; height: 96px; }
.cube-shadow { position: absolute; left: 4%; bottom: -24px; width: 92%; height: 18px; background: radial-gradient(ellipse at center, rgba(21, 17, 12, 0.3), transparent 70%); filter: blur(5px); }
.cube { position: relative; width: 96px; height: 96px; transform-style: preserve-3d;  will-change: transform; }
.cube .face { position: absolute; inset: 0; border-radius: 6px; transition: background 0.25s ease; }
.cube .f-b { transform: rotateY(180deg) translateZ(48px); background: #F0E8E0; }
.cube .f-r { transform: rotateY(90deg) translateZ(48px); background: #EDE4DA; }
.cube .f-l { transform: rotateY(-90deg) translateZ(48px); background: #F3EBE2; }
.cube .f-t { transform: rotateX(90deg) translateZ(48px); background: #FFFFFF; }
.cube .f-bo { transform: rotateX(-90deg) translateZ(48px); background: #E3D9CE; }
.cube .f-f { transform: translateZ(48px); background: var(--c-card); border-radius: 6px; border: 1px solid rgba(21, 17, 12, 0.08); display: flex; align-items: center; justify-content: center; transition: box-shadow 0.3s ease, border-color 0.3s ease, background 0.25s ease; overflow: hidden; position: absolute; inset: 0; }
.cube .f-f > img.icon-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: 6px; }
.cube .f-f > img.logo-img { width: 46px; height: auto; display: block; }

/* Bento-Glow */
.bento { position: relative; overflow: hidden; }
.bento::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: radial-gradient(320px circle at var(--gx, 50%) var(--gy, 50%), rgba(252, 106, 11, 0.12), transparent 70%); opacity: var(--gi, 0); transition: opacity 0.35s ease; }

/* Projekte (Scroll-Jack) */
.cases-section { position: relative; height: 340vh; background: var(--c-bg); }
.cases-sticky { position: sticky; top: 0; height: 100svh; overflow: clip; display: flex; flex-direction: column; justify-content: center; }
.cases-head { padding: 100px clamp(20px, 6vw, 110px) 30px; }
.cases-track { display: flex; gap: clamp(20px, 3vw, 44px); width: max-content; padding: 10px clamp(20px, 6vw, 110px) 40px; will-change: transform; }
.case-card { flex: 0 0 auto; width: min(72vw, 620px); background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); border-radius: 18px; transition: transform 0.5s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.5s ease, border-color 0.35s ease; }
.case-card:hover { transform: translateY(-10px); box-shadow: 0 30px 60px rgba(21, 17, 12, 0.12); border-color: rgba(252, 106, 11, 0.5); }
.case-media { aspect-ratio: 16 / 8; position: relative; overflow: hidden; border-radius: 18px 18px 0 0; }
.case-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.case-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(251, 248, 244, 0) 55%, rgba(251, 248, 244, 0.85) 88%, #FBF8F4 100%); }
.case-media .dot { position: absolute; right: 16px; top: 16px; width: 8px; height: 8px; border-radius: 50%; background: var(--c-orange); z-index: 1; }
.case-body { padding: clamp(18px, 2vw, 30px); }
.case-meta { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 12px; font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; }
.case-meta .tag { color: var(--c-orange); }
.case-meta .yc { color: var(--c-muted); }
.case-client { font-family: var(--font-mono); font-weight: 700; font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--c-warm); margin: 0 0 8px; }
.case-title { font-family: var(--font-heading); font-weight: 700; font-size: clamp(20px, 2.2vw, 30px); line-height: 1.2; margin: 0 0 12px; }
.case-text { font-size: 13.5px; line-height: 1.6; color: var(--c-warm); margin: 0 0 16px; }
.case-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.case-chips .chip { font-size: 10px; padding: 6px 12px; background: transparent; color: var(--c-warm); border-color: rgba(21, 17, 12, 0.2); }
.case-link { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 10px; border-bottom: 1px solid rgba(21, 17, 12, 0.3); padding-bottom: 4px; transition: color 0.25s ease, gap 0.25s ease; }
.case-link:hover { color: var(--c-orange); gap: 16px; }

/* Zahlen & Fakten */
.metrics-wrap { position: relative; overflow: clip; background-color: #F5EFE9; }
.metrics-wrap > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.metrics-wrap > img.bg-media, .kontakt-section > img.bg-media, .hero-vids > img.bg-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.metrics-inner { position: relative; z-index: 1; padding: clamp(140px, 20vh, 240px) clamp(20px, 6vw, 110px); }
.metrics-head { display: inline-flex; flex-direction: column; gap: 18px; border-radius: 22px; padding: clamp(22px, 2.6vw, 40px); max-width: 100%; }
.metrics-head .sub { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-orange); margin: 0; }
.metrics-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: 38px; }
@media (max-width: 860px) { .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.metric-card { position: relative; overflow: hidden; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.6); border-radius: 18px; padding: clamp(20px, 2.6vw, 36px); transition: background 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; }
.metric-card .value { font-family: var(--font-heading); font-weight: 500; font-size: clamp(26px, 2.9vw, 54px); line-height: 1.2; white-space: nowrap; color: var(--c-ink); transition: color 0.3s ease; }
.metric-card .suffix { color: var(--c-orange); transition: color 0.3s ease; }
.metric-card .label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-muted); margin: 14px 0 0; overflow-wrap: anywhere; transition: color 0.3s ease; }
.metric-card:hover { background: var(--c-orange) !important; border-color: var(--c-orange) !important; box-shadow: 0 18px 44px rgba(252, 106, 11, 0.35); }
.metric-card:hover .value, .metric-card:hover .suffix { color: #FAF7F2; }
.metric-card:hover .label { color: rgba(255, 255, 255, 0.85); }

/* Insights */
.insights-section { background: var(--c-bg); padding: clamp(60px, 9vh, 110px) clamp(20px, 6vw, 110px) clamp(70px, 10vh, 120px); }
.insights-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; }
.insight-card { position: relative; overflow: hidden; background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); border-radius: 18px; display: flex; flex-direction: column; min-height: 340px; opacity: 0; transform: translate3d(var(--dx, 0px), 440px, 0) rotate(var(--tilt, 0deg)) scale(0.8); transition: transform 0.95s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.65s ease, border-color 0.35s ease, box-shadow 0.35s ease; will-change: transform, opacity; }
.insight-card.is-in { opacity: 1; transform: none; }
.insight-card:hover { border-color: rgba(252, 106, 11, 0.55); box-shadow: 0 18px 44px rgba(252, 106, 11, 0.18); }
.insight-media { aspect-ratio: 16 / 10; display: block; width: 100%; object-fit: cover; border-bottom: 1px solid rgba(21, 17, 12, 0.12); background: repeating-linear-gradient(45deg, #E8E0D8 0 12px, #F0E8E0 12px 24px); }
.insight-body { padding: clamp(18px, 2vw, 28px); display: flex; flex-direction: column; gap: 14px; flex: 1; }
.insight-cat { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-orange); }
.insight-title { font-family: var(--font-heading); font-weight: 500; font-size: clamp(19px, 1.7vw, 25px); letter-spacing: 0.01em; line-height: 1.18; margin: 0; flex: 1; }
.insight-meta { display: flex; justify-content: space-between; gap: 10px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-muted); }

/* Stimmen */
.reviews-viewport { position: relative; height: 620px; overflow: hidden; }
.reviews-fade-top, .reviews-fade-bottom { position: absolute; left: 0; right: 0; height: 110px; z-index: 2; pointer-events: none; }
.reviews-fade-top { top: 0; background: linear-gradient(var(--c-bg), rgba(245, 239, 233, 0)); }
.reviews-fade-bottom { bottom: 0; background: linear-gradient(rgba(245, 239, 233, 0), var(--c-bg)); }
.reviews-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 22px; height: 100%; }
.reviews-col { overflow: hidden; height: 100%; }
.reviews-col .track { display: flex; flex-direction: column; gap: 22px; padding-bottom: 22px; will-change: transform; }
.reviews-col .track > .review-set { display: flex; flex-direction: column; gap: 22px; }
.reviews-col .review-card { margin: 0 !important; flex: 0 0 auto; }
.reviews-col .track:hover { animation-play-state: paused; }
.reviews-col:nth-child(1) .track { animation: lmColDown 36s linear infinite; }
.reviews-col:nth-child(2) .track { animation: lmColUp 31s linear infinite; }
.reviews-col:nth-child(3) .track { animation: lmColDown 41s linear infinite; }
.review-card { position: relative; overflow: hidden; background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); border-radius: 14px; padding: 24px; transition: border-color 0.3s ease, box-shadow 0.3s ease; }
.review-card:hover { border-color: var(--c-orange); box-shadow: 0 0 30px rgba(252, 106, 11, 0.22); }
.review-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 12px; }
.review-head .name { font-weight: 700; font-size: 14px; }
.review-head .stars { color: var(--c-orange); letter-spacing: 3px; font-size: 12px; }
.review-text { font-size: 14px; line-height: 1.6; color: rgba(21, 17, 12, 0.75); margin: 0 0 16px; }
.review-src { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase; color: rgba(21, 17, 12, 0.4); }

/* Kontakt */
.kontakt-section { position: relative; overflow: clip; background-color: var(--c-bg); }
.kontakt-section > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.kontakt-section > .eyebrow, .kontakt-headbox, .kontakt-form-box { position: relative; z-index: 1; }
.kontakt-headbox { display: inline-block; border-radius: 24px; padding: clamp(24px, 3vw, 44px); max-width: 100%; }
.kontakt-form-box { overflow: hidden; margin-top: clamp(44px, 7vh, 70px); border-radius: 20px; padding: clamp(26px, 3.4vw, 54px); transition: border-color 0.35s ease; }
.kontakt-form-box:hover { border-color: rgba(252, 106, 11, 0.45); }
.form-grid { display: flex; flex-wrap: wrap; gap: clamp(30px, 4vw, 70px); }
.form-col { display: flex; flex-direction: column; }
.form-col.left { flex: 1 1 360px; gap: 22px; }
.form-col.right { flex: 1 1 340px; gap: 4px; }
.form-step { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-orange); margin: 0; }
.select-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label { font-family: var(--font-mono); font-weight: 700; font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-ink); }
.select-wrap { position: relative; }
.select-wrap select { appearance: none; -webkit-appearance: none; width: 100%; background: rgba(255, 255, 255, 0.85); border: 1px solid rgba(21, 17, 12, 0.14); border-radius: 10px; color: var(--c-ink); font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.06em; padding: 14px 40px 14px 14px; cursor: pointer; transition: border-color 0.3s ease; }
.select-wrap select:focus { border-color: var(--c-orange); }
.select-wrap .arrow { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); color: var(--c-orange); pointer-events: none; font-size: 12px; }
.form-col input[type="text"], .form-col input[type="email"], .form-col input[type="tel"], .form-col textarea { background: rgba(255, 255, 255, 0.85); border: 1px solid rgba(21, 17, 12, 0.14); border-radius: 10px; color: var(--c-ink); font-size: 15px; padding: 13px 14px; transition: border-color 0.3s ease; }
.form-col input:focus, .form-col textarea:focus { border-color: var(--c-orange); outline: none; }
.form-col textarea { resize: vertical; }
.field-row { display: flex; gap: 16px; flex-wrap: wrap; }
.field-row .field { flex: 1 1 150px; }
.summary-line { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-ink); margin: 0; border-top: 1px solid rgba(21, 17, 12, 0.12); padding-top: 16px; }
.summary-line .val { color: var(--c-orange); }
.radar { border: 1px solid rgba(21, 17, 12, 0.12); border-radius: 14px; background: rgba(255, 255, 255, 0.72); padding: 20px 22px; display: flex; flex-direction: column; gap: 14px; }
.radar .rlabel { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-orange); margin: 0; }
.radar .row { display: flex; align-items: center; gap: 12px; }
.radar .row .k { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-ink); font-weight: 700; width: 78px; flex: 0 0 auto; }
.radar .row .bar { flex: 1; height: 7px; border-radius: 999px; background: rgba(21, 17, 12, 0.1); overflow: hidden; display: block; }
.radar .row .bar .fill { display: block; height: 7px; border-radius: 999px; background: linear-gradient(90deg, #FF8A3D, #FC6A0B); width: 0%; transition: width 0.6s cubic-bezier(0.22, 1, 0.36, 1); }
.radar .row .v { font-family: var(--font-mono); font-size: 10px; font-weight: 700; color: var(--c-ink); min-width: 86px; text-align: right; }
.radar .dots { display: flex; gap: 8px; flex: 1; }
.radar .dots span { width: 12px; height: 12px; border-radius: 50%; background: rgba(21, 17, 12, 0.14); transition: background 0.4s ease; display: inline-block; }
.radar .dots span.on { background: var(--c-orange); }
.radar .fine { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-stone); margin: 0; }
.privacy { display: flex; align-items: flex-start; gap: 10px; margin-top: 16px; font-size: 12.5px; line-height: 1.55; color: var(--c-ink); cursor: pointer; }
.privacy input { margin-top: 2px; accent-color: var(--c-orange); width: 16px; height: 16px; }
.privacy a { text-decoration: underline; }
.form-note { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--c-ink); margin: 14px 0 0; }
.form-success { text-align: center; padding: 30px 0; display: none; }
.form-success .pulse { width: 10px; height: 10px; border-radius: 50%; background: var(--c-orange); box-shadow: 0 0 30px rgba(252, 106, 11, 0.8); margin: 0 auto 26px; animation: lmPulse 2s ease-in-out infinite; }
.form-success h3 { font-family: var(--font-heading); font-weight: 500; font-size: clamp(24px, 2.8vw, 40px); margin: 0 0 14px; }

/* Footer */
.site-footer { background: var(--c-bg); position: relative; overflow: clip; }
.footer-cols { padding: clamp(50px, 7vh, 80px) clamp(20px, 6vw, 110px) 40px; display: flex; flex-wrap: wrap; gap: clamp(30px, 5vw, 90px); justify-content: space-between; }
.footer-brand { flex: 1 1 260px; }
.footer-brand .brand { font-weight: 800; font-size: 24px; letter-spacing: 0.14em; }
.footer-brand .tagline { font-size: 13.5px; line-height: 1.7; color: var(--c-warm); max-width: 300px; margin: 0; }
.footer-nav { display: flex; gap: clamp(30px, 5vw, 80px); flex-wrap: wrap; }
.footer-col { display: flex; flex-direction: column; gap: 12px; }
.footer-col .col-title { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-stone); }
.footer-col a { font-size: 14px; transition: color 0.25s ease; }
.footer-big { padding: 0 clamp(20px, 6vw, 110px) clamp(40px, 6vh, 60px); }
.footer-big .line { font-family: var(--font-heading); font-weight: 500; font-size: clamp(27px, 3.85vw, 59px); line-height: 1.2; margin: 0; }
.footer-meta { display: flex; justify-content: space-between; gap: 14px; flex-wrap: wrap; border-top: 1px solid rgba(21, 17, 12, 0.16); margin-top: clamp(30px, 5vh, 50px); padding-top: 22px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; }
.footer-meta .l { color: var(--c-muted); }
.footer-meta .r { color: var(--c-stone); }

/* Blog (nativ) */
.page-hero { padding: clamp(150px, 20vh, 220px) clamp(20px, 6vw, 110px) clamp(50px, 7vh, 80px); }
.archive-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; padding: 0 clamp(20px, 6vw, 110px) clamp(80px, 10vh, 130px); }
.post-card { background: var(--c-card); border: 1px solid rgba(21, 17, 12, 0.16); border-radius: 18px; overflow: hidden; display: flex; flex-direction: column; transition: border-color 0.35s ease, transform 0.4s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease; }
.post-card:hover { border-color: rgba(252, 106, 11, 0.5); transform: translateY(-6px); box-shadow: 0 18px 44px rgba(252, 106, 11, 0.15); }
.post-card .thumb { aspect-ratio: 16 / 10; width: 100%; object-fit: cover; display: block; border-bottom: 1px solid rgba(21, 17, 12, 0.12); background: repeating-linear-gradient(45deg, #E8E0D8 0 12px, #F0E8E0 12px 24px); }
.post-card .thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.post-card .body { padding: clamp(18px, 2vw, 28px); display: flex; flex-direction: column; gap: 12px; flex: 1; }
.post-card h2 { font-family: var(--font-heading); font-weight: 500; font-size: clamp(19px, 1.7vw, 25px); line-height: 1.18; margin: 0; }
.post-card .excerpt { font-size: 14px; line-height: 1.6; color: var(--c-warm); flex: 1; }
.post-card .date { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.16em; text-transform: uppercase; color: var(--c-muted); }
.wp-pagination { display: flex; justify-content: center; gap: 8px; padding: 0 20px clamp(80px, 10vh, 120px); font-family: var(--font-mono); font-size: 13px; }
.wp-pagination a, .wp-pagination span { padding: 10px 16px; border: 1px solid rgba(21, 17, 12, 0.2); border-radius: 999px; }
.wp-pagination .current { background: var(--c-orange); color: #FAF7F2; border-color: var(--c-orange); }
.single-main { max-width: 860px; margin: 0 auto; padding: clamp(150px, 20vh, 220px) clamp(20px, 5vw, 40px) clamp(80px, 10vh, 130px); }
.single-main .featured { width: 100%; border-radius: 18px; margin: 30px 0; }
.single-main h1 { font-family: var(--font-heading); font-weight: 500; font-size: clamp(30px, 4.2vw, 58px); line-height: 1.1; margin: 0 0 14px; }
.single-main .date { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--c-muted); }
.post-content { font-size: 16.5px; line-height: 1.8; color: #2E2620; }
.post-content h2, .post-content h3 { font-family: var(--font-heading); font-weight: 500; line-height: 1.2; }
.post-content a { color: var(--c-orange); text-decoration: underline; }
.post-content img { border-radius: 14px; }
.back-link { font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; display: inline-block; margin-bottom: 26px; }

.flex-wrap-row { display: flex; flex-wrap: wrap; }
.center { text-align: center; }
img[data-cms-src]:not([src]), img[data-cms-src][src=""], video[data-cms-src]:not([src]), video[data-cms-src][src=""] { visibility: hidden; }

/* ================= DARK MODE ================= */
body.lm-dark { background: #191613; color: #F0E8E0; }
body.lm-dark .section, body.lm-dark .system-section, body.lm-dark .insights-section, body.lm-dark .cases-section, body.lm-dark .kontakt-section, body.lm-dark .site-footer, body.lm-dark .hero { background-color: #191613; }
body.lm-dark a { color: #F0E8E0; }
body.lm-dark a:hover { color: var(--c-orange); }
body.lm-dark .h-display, body.lm-dark .brand, body.lm-dark .mono-strong, body.lm-dark .case-title, body.lm-dark .insight-title, body.lm-dark .orbit-card .label .name, body.lm-dark .fan-front .title, body.lm-dark .fan-back .headline, body.lm-dark .marquee-item .word, body.lm-dark .diag-panel h3, body.lm-dark .orbit-center .t, body.lm-dark .form-success h3 { color: #F0E8E0; }
body.lm-dark .lead, body.lm-dark .case-text, body.lm-dark .fan-back .text, body.lm-dark .diag-panel .sol, body.lm-dark .footer-brand .tagline { color: #B8ADA3; }
body.lm-dark .lead-bold { color: #DDD3C8; }
body.lm-dark .diag-tab .t, body.lm-dark .review-head .name { color: #F0E8E0; }
body.lm-dark .review-text { color: rgba(240, 232, 224, 0.78); }
body.lm-dark .review-src { color: rgba(240, 232, 224, 0.4); }
body.lm-dark .preloader { background: #191613; }
body.lm-dark .site-header { background: rgba(25, 22, 19, 0.82); }
body.lm-dark .site-header.is-scrolled { border-bottom-color: rgba(240, 232, 224, 0.12); }
body.lm-dark .wp-gen-menu a, body.lm-dark .dark-toggle { color: #F0E8E0; }
body.lm-dark .dark-toggle { border-color: rgba(240, 232, 224, 0.3); }
body.lm-dark .brand-logo, body.lm-dark img[data-role="logo"] { filter: invert(1); }body.lm-dark .orbit-card, body.lm-dark .fan-front, body.lm-dark .fan-back, body.lm-dark .diag-stage, body.lm-dark .case-card, body.lm-dark .insight-card, body.lm-dark .review-card, body.lm-dark .post-card, body.lm-dark .orbit-center, body.lm-dark .diag-tab.is-active, body.lm-dark .mega-menu .row:hover { background: #26221E; border-color: rgba(240, 232, 224, 0.22); }
body.lm-dark .orbit-card .label { background: #26221E; }
body.lm-dark .orbit-card .media::after { background: linear-gradient(rgba(38, 34, 30, 0) 35%, rgba(38, 34, 30, 0.9) 82%, #26221E 100%); }
body.lm-dark .fan-front .media::after { background: linear-gradient(rgba(38, 34, 30, 0) 38%, rgba(38, 34, 30, 0.88) 70%, #26221E 100%); }
body.lm-dark .case-media::after { background: linear-gradient(rgba(38, 34, 30, 0) 55%, rgba(38, 34, 30, 0.85) 88%, #26221E 100%); }
body.lm-dark .chip { background: #191613; color: #DDD3C8; border-color: rgba(240, 232, 224, 0.25); }
body.lm-dark .cube .f-f { background: #26221E; border-color: rgba(240, 232, 224, 0.1); }
body.lm-dark .cube .f-b { background: #211D19; }
body.lm-dark .cube .f-r { background: #2B2721; }
body.lm-dark .cube .f-l { background: #2E2924; }
body.lm-dark .cube .f-t { background: #383129; }
body.lm-dark .cube .f-bo { background: #211D19; }
body.lm-dark .marquee-wrap, body.lm-dark .diag-list, body.lm-dark .diag-tab, body.lm-dark .hero-services, body.lm-dark .hero-service, body.lm-dark .footer-meta, body.lm-dark .summary-line, body.lm-dark .system-section, body.lm-dark .section { border-color: rgba(240, 232, 224, 0.16); }
body.lm-dark .marquee-row.alt .diamond { border-color: #F0E8E0; }
body.lm-dark .hero-service .title { color: #F0E8E0; }
body.lm-dark .hero-service.is-on .title { color: var(--c-orange); }
body.lm-dark .mega-menu { background: rgba(25, 22, 19, 0.96); }
body.lm-dark .mega-menu .close { color: #F0E8E0; border-color: rgba(240, 232, 224, 0.3); }
body.lm-dark .reviews-fade-top { background: linear-gradient(#191613, rgba(25, 22, 19, 0)); }
body.lm-dark .reviews-fade-bottom { background: linear-gradient(rgba(25, 22, 19, 0), #191613); }
body.lm-dark .logo-rail .fade-top { background: linear-gradient(rgba(22, 19, 16, 0.8), rgba(22, 19, 16, 0)); }
body.lm-dark .logo-rail .fade-bottom { background: linear-gradient(rgba(22, 19, 16, 0), rgba(22, 19, 16, 0.8)); }
body.lm-dark .logo-rail .logo-item svg { filter: brightness(0) invert(1); opacity: 0.85; }
body.lm-dark .select-wrap select, body.lm-dark .form-col input, body.lm-dark .form-col textarea { background: rgba(38, 34, 30, 0.85); color: #F0E8E0; border-color: rgba(240, 232, 224, 0.25); }
body.lm-dark .radar { background: rgba(38, 34, 30, 0.72); border-color: rgba(240, 232, 224, 0.15); }
body.lm-dark .field label, body.lm-dark .radar .row .k, body.lm-dark .radar .row .v, body.lm-dark .privacy, body.lm-dark .form-note, body.lm-dark .summary-line { color: #F0E8E0; }
body.lm-dark .metric-card .value { color: #F0E8E0; }
body.lm-dark .metric-card:hover .value { color: #FAF7F2; }
body.lm-dark .metric-card .label { color: rgba(240, 232, 224, 0.7); }
body.lm-dark .metric-card:hover .label { color: rgba(255, 255, 255, 0.85); }

/* Header-Nav: kein Umbruch in Menüpunkten */
.site-header .wp-gen-menu > li > a { white-space: nowrap; }
@media (max-width: 1080px) { .site-header .wp-gen-menu { gap: clamp(14px, 1.8vw, 26px); } }

/* Footer-Spaltentitel in Orange */
.site-footer .footer-col .col-title { color: var(--c-orange); }

/* Weiche Übergänge: Zahlen & Fakten / Kontakt (Startseite) */
.metrics-wrap > img.bg-media, .metrics-wrap > video, .kontakt-section > img.bg-media {
  --sec-mask: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.28) 7%, rgba(0,0,0,0.72) 14%, rgba(0,0,0,1) 22%, rgba(0,0,0,1) 78%, rgba(0,0,0,0.72) 86%, rgba(0,0,0,0.28) 93%, rgba(0,0,0,0) 100%);
  -webkit-mask-image: var(--sec-mask); mask-image: var(--sec-mask);
}
.metrics-wrap::before, .metrics-wrap::after, .kontakt-section::before, .kontakt-section::after {
  content: ''; position: absolute; left: 0; right: 0; height: clamp(90px, 13vh, 170px); z-index: 0; pointer-events: none;
}
.metrics-wrap::before { top: 0; background: linear-gradient(#F5EFE9, rgba(245,239,233,0)); }
.metrics-wrap::after { bottom: 0; background: linear-gradient(rgba(245,239,233,0), #F5EFE9); }
.kontakt-section::before { top: 0; background: linear-gradient(#F5EFE9, rgba(245,239,233,0)); }
.kontakt-section::after { bottom: 0; background: linear-gradient(rgba(245,239,233,0), #F5EFE9); }
body.lm-dark .metrics-wrap::before, body.lm-dark .kontakt-section::before { background: linear-gradient(#211D19, rgba(33,29,25,0)); }
body.lm-dark .metrics-wrap::after, body.lm-dark .kontakt-section::after { background: linear-gradient(rgba(33,29,25,0), #211D19); }

html.lm-dark-pre, html.lm-dark-pre body { background: #191613; }

body.lm-dark img[src*="primevideo"] { filter: none !important; opacity: 0.95; }
body.lm-dark .btn-primary:hover, body.lm-dark .header-cta:hover { background: #FF8A3D; color: #14110E; border-color: #FF8A3D; }

/* ==================== Runde 20: Angleichung an die Leistungsseiten ==================== */

/* Kompetenz-Matrix: Würfel bleiben auch im Dark Mode hell */
body.lm-dark .cube .f-f { background: #FBF8F4; border-color: rgba(21,17,12,0.1); }
body.lm-dark .cube .f-b { background: #F0E8E0; }
body.lm-dark .cube .f-r { background: #EDE4DA; }
body.lm-dark .cube .f-l { background: #F3EBE2; }
body.lm-dark .cube .f-t { background: #FFFFFF; }
body.lm-dark .cube .f-bo { background: #E3D9CE; }
body.lm-dark .cube .f-f .label, body.lm-dark .cube .f-f span { color: #15110C; }
body.lm-dark .cube .f-f > img.icon-img { filter: none; }

/* Hintergrundton wie auf den Unterseiten */
body.lm-dark { background: #1C1815; }
body.lm-dark .section, body.lm-dark .system-section, body.lm-dark .insights-section,
body.lm-dark .cases-section, body.lm-dark .site-footer { background-color: #1C1815; }

/* Pulsierende Orbs (wie auf den Leistungsseiten) */
.orb-glow { display: block; position: absolute !important; border-radius: 50%; pointer-events: none; z-index: 0;
  background: radial-gradient(circle, rgba(252,106,11,0.5), rgba(252,106,11,0.16) 42%, rgba(252,106,11,0) 70%);
  filter: blur(46px); opacity: 0.5; transform: translate(-50%,-50%); animation: lmOrbPulse 9s ease-in-out infinite; }
@keyframes lmOrbPulse { 0%,100% { opacity: 0.34; transform: translate(-50%,-50%) scale(0.94); } 50% { opacity: 0.62; transform: translate(-50%,-50%) scale(1.1); } }
.section, .system-section, .insights-section { position: relative; }
.section > *:not(.orb-glow):not(.bg-media), .system-section > *:not(.orb-glow):not(.bg-media), .insights-section > *:not(.orb-glow):not(.bg-media) { position: relative; z-index: 1; }
@media (prefers-reduced-motion: reduce) { .orb-glow { animation: none; } }


/* Aurora-Cursor */
.lm-aura { position: fixed; left: 0; top: 0; width: 460px; height: 460px; margin: -230px 0 0 -230px; border-radius: 50%; pointer-events: none; z-index: 190;
  background: radial-gradient(circle, rgba(252,106,11,0.24), rgba(252,106,11,0.09) 42%, rgba(252,106,11,0) 68%);
  filter: blur(24px); opacity: 0; transition: opacity 0.5s ease; will-change: transform; mix-blend-mode: multiply; }
body.lm-dark .lm-aura { mix-blend-mode: screen; background: radial-gradient(circle, rgba(252,106,11,0.32), rgba(252,106,11,0.12) 42%, rgba(252,106,11,0) 68%); }
.lm-aura.is-on { opacity: 1; }
.lm-aura.is-down { opacity: 1; }
.lm-ripple { position: fixed; left: 0; top: 0; width: 26px; height: 26px; margin: -13px 0 0 -13px; border-radius: 50%; pointer-events: none; z-index: 191;
  border: 1.5px solid rgba(252,106,11,0.75); animation: lmRipple 0.72s cubic-bezier(0.22,1,0.36,1) forwards; }
@keyframes lmRipple { from { transform: scale(0.4); opacity: 0.9; } to { transform: scale(7); opacity: 0; } }
@media (pointer: coarse), (prefers-reduced-motion: reduce) { .lm-aura, .lm-ripple { display: none; } }


/* ==================== Testimonial-Rondell (global) ==================== */
.testi-sec { background: #F5EFE9; padding: clamp(80px,12vh,150px) clamp(20px,6vw,110px); overflow: clip; position: relative; }
body.lm-dark .testi-sec { background: #1C1815; }
.tcard-label { position: absolute; left: 20px; right: 20px; bottom: 18px; z-index: 2; display: flex; flex-direction: column; gap: 5px; }
.tcard-label .nm { font-family: var(--font-heading); font-weight: 500; font-size: clamp(15px,1.4vw,19px); color: var(--c-ink); }
.tcard-label .rl { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--c-orange); }
body.lm-dark .tcard-label .nm { color: #F0E8E0; }
.testi-progress { display: flex; align-items: center; gap: 14px; margin-top: 22px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.22em; color: var(--c-muted); }
.testi-progress .bar { flex: 1 1 120px; max-width: 220px; height: 3px; border-radius: 999px; background: rgba(21,17,12,0.12); overflow: hidden; }
.testi-progress .bar i { display: block; height: 3px; width: 0; border-radius: 999px; background: var(--c-orange); }
body.lm-dark .testi-progress { color: #B2A69B; }
/* ==================== Testimonial-Rondell ==================== */
.testi-rondel { display: block; padding: clamp(70px,10vh,120px) 0 clamp(60px,9vh,110px); position: relative; }
.testi-rondel .rond-head { max-width: 1100px; margin: 0 auto; padding: 0 clamp(20px,6vw,110px); text-align: center; }
.testi-rondel .rond-head h2 { margin: 14px 0 0; }
.testi-rondel .rond-stage {
  --rw: clamp(280px, 26vw, 400px);
  --rh: calc(var(--rw) * 16 / 9);
  position: relative; height: calc(var(--rh) + 40px);
  margin-top: clamp(34px,5vh,60px);
  perspective: 1600px;
  touch-action: pan-y;
  cursor: grab;
  overflow: hidden;
}
.testi-rondel .rond-stage.is-drag { cursor: grabbing; }
.testi-rondel .rond-track { position: absolute; inset: 0; transform-style: preserve-3d; }
.rcard {
  position: absolute; left: 50%; top: 50%;
  width: var(--rw); height: var(--rh);
  margin: calc(var(--rh) / -2) 0 0 calc(var(--rw) / -2);
  border-radius: 22px; overflow: hidden; background: #E9E0D6;
  border: 1px solid rgba(21,17,12,0.14);
  box-shadow: 0 18px 44px rgba(21,17,12,0.18);
  transition: transform 0.62s cubic-bezier(0.22,1,0.36,1), opacity 0.5s ease, box-shadow 0.4s ease, border-color 0.3s ease;
  will-change: transform; cursor: pointer; user-select: none;
}
.rond-stage.is-drag .rcard { transition: none; }
.rcard video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 6%; transform: scale(1.12); transform-origin: 50% 0%; display: block; pointer-events: none; }
.rcard .veil { position: absolute; left: 0; right: 0; bottom: 0; height: 26%; background: linear-gradient(rgba(245,239,233,0), rgba(245,239,233,0.94) 44%, #F5EFE9 62%); pointer-events: none; }
.rcard .tcard-label { position: absolute; left: 20px; right: 20px; bottom: 18px; z-index: 2; display: flex; flex-direction: column; gap: 5px; pointer-events: none; }
.rcard.is-center { box-shadow: 0 34px 80px rgba(21,17,12,0.3); border-color: rgba(252,106,11,0.4); }
.rcard.is-side::after { content: ''; position: absolute; inset: 0; border-radius: 22px; background: rgba(245,239,233,0.42); transition: background 0.4s ease; pointer-events: none; }
.rcard.is-side:hover::after { background: rgba(245,239,233,0.16); }
.testi-rondel .rond-controls { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: clamp(26px,4vh,42px); padding: 0 20px; }
.testi-rondel .rond-controls .btn-ghost { padding: 11px 18px; font-size: 10px; letter-spacing: 0.14em; }
.testi-rondel .rond-progress { justify-content: center; margin-top: 20px; padding: 0 20px; }
@media (max-width: 760px) { .testi-rondel .rond-stage { --rw: min(70vw, 300px); } }
body.lm-dark .rcard { background: #26221E; border-color: rgba(240,232,224,0.18); }
body.lm-dark .rcard .veil { background: linear-gradient(rgba(33,29,25,0), rgba(33,29,25,0.94) 44%, #211D19 62%); }
body.lm-dark .rcard.is-side::after { background: rgba(20,17,14,0.5); }
body.lm-dark .rcard.is-side:hover::after { background: rgba(20,17,14,0.2); }

/* Rondell: Seitenkarten abgedunkelt statt transparent, Bühnenrand ausgefadet */
.rcard.is-side { opacity: 1 !important; }
.rcard.is-side::after { background: rgba(20,17,14,0.5) !important; }
.rcard.is-side:hover::after { background: rgba(20,17,14,0.2) !important; }
.testi-rondel .rond-stage { --rond-mask: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.35) 6%, #000 20%, #000 80%, rgba(0,0,0,0.35) 94%, transparent 100%);
  -webkit-mask-image: var(--rond-mask); mask-image: var(--rond-mask); }


/* Orbit: Logo über dem Rondell, mit angedeutetem Lichtkegel */
.orbit-outer { aspect-ratio: 900 / 610 !important; }
.orbit-stage { top: 60% !important; }
.orbit-item { z-index: 2; }
.orbit-center {
  left: 50% !important; top: -142px !important;
  transform: translateX(-50%) !important;
  z-index: 6; overflow: visible;
}
/* Lichtkegel: oben schmal am Logo, unten so breit wie die Kartenbahn (720px) */
.orbit-center::before {
  content: ''; position: absolute; left: 50%; top: calc(100% - 6px);
  width: 720px; height: 210px; margin-left: -360px; z-index: -2; pointer-events: none;
  background: linear-gradient(180deg, rgba(252,106,11,0.32), rgba(252,106,11,0.12) 46%, rgba(252,106,11,0) 100%);
  clip-path: polygon(44% 0%, 56% 0%, 100% 100%, 0% 100%);
  filter: blur(9px);
  animation: lmConeBlink 3.4s ease-in-out infinite;
}
@keyframes lmConeBlink {
  0%, 100% { opacity: 0.5; }
  38% { opacity: 0.94; }
  46% { opacity: 0.62; }
  54% { opacity: 1; }
  70% { opacity: 0.72; }
}
@media (max-width: 980px) { .orbit-center { top: -118px !important; } .orbit-center::before { width: 560px; margin-left: -280px; height: 170px; } }
@media (prefers-reduced-motion: reduce) { .orbit-center::before { animation: none; } }

/* ==================== Referenzen 2: WebGL-Zylinder ==================== */
.ring-sec { position: relative; min-height: 100svh; background: #F5EFE9; overflow: clip; padding: clamp(60px,8vh,96px) 0 clamp(30px,5vh,60px); }
body.lm-dark .ring-sec { background: #1C1815; }
.ring-lines { position: absolute; inset: -20% -10% auto -10%; height: 140%; pointer-events: none; z-index: 0; opacity: 0.55;
  background: repeating-radial-gradient(ellipse 60% 48% at 50% 38%, rgba(21,17,12,0) 0 34px, rgba(21,17,12,0.09) 34px 35px);
  mask-image: radial-gradient(ellipse at 50% 40%, #000 30%, transparent 78%); }
body.lm-dark .ring-lines { background: repeating-radial-gradient(ellipse 60% 48% at 50% 38%, rgba(240,232,224,0) 0 34px, rgba(240,232,224,0.09) 34px 35px); }
.ring-sec::before, .ring-sec::after { content: ''; position: absolute; left: 0; right: 0; height: 110px; z-index: 5; pointer-events: none; }
.ring-sec::before { top: 0; background: linear-gradient(#F5EFE9, rgba(245,239,233,0)); }
.ring-sec::after { bottom: 0; background: linear-gradient(rgba(245,239,233,0), #F5EFE9); }
body.lm-dark .ring-sec::before { background: linear-gradient(#1C1815, rgba(28,24,21,0)); }
body.lm-dark .ring-sec::after { background: linear-gradient(rgba(28,24,21,0), #1C1815); }

.ring-intro { position: relative; z-index: 4; text-align: center; padding: 0 20px; }
.ring-eyebrow { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase; color: var(--c-orange); margin: 0 0 16px; }
.ring-title { font-family: var(--font-heading); font-weight: 400; font-size: clamp(38px,6.4vw,96px); line-height: 1.02; margin: 0; color: var(--c-ink); transition: font-size 1.1s cubic-bezier(0.16,1,0.3,1); }
body.lm-dark .ring-title { color: #F0E8E0; }
.ring-intro .w { display: inline-block; opacity: 0; transform: translateY(0.55em) rotate(2deg); filter: blur(10px); }
.ring-sec.is-started .ring-intro .w { animation: ringWord 1.05s cubic-bezier(0.16,1,0.3,1) forwards; }
.ring-sec.is-started .ring-eyebrow .w:nth-child(1) { animation-delay: 0.05s; } .ring-sec.is-started .ring-eyebrow .w:nth-child(2) { animation-delay: 0.12s; }
.ring-sec.is-started .ring-eyebrow .w:nth-child(3) { animation-delay: 0.19s; } .ring-sec.is-started .ring-eyebrow .w:nth-child(4) { animation-delay: 0.26s; }
.ring-sec.is-started .ring-title .w:nth-child(1) { animation-delay: 0.32s; } .ring-sec.is-started .ring-title .w:nth-child(2) { animation-delay: 0.46s; } .ring-sec.is-started .ring-title .w:nth-child(3) { animation-delay: 0.6s; }
@keyframes ringWord { to { opacity: 1; transform: none; filter: blur(0); } }
.ring-sec.is-live .ring-title { font-size: clamp(24px,3vw,44px); }

.ring-stage { position: relative; z-index: 2; width: 100%; height: clamp(560px, 84vh, 920px); margin-top: clamp(6px,1.5vh,18px); }
.ring-canvas { position: absolute; inset: 0; cursor: grab; opacity: 0; transform: scale(0.94) translateY(30px); transition: opacity 1.6s ease 0.7s, transform 2.2s cubic-bezier(0.16,1,0.3,1) 0.7s; touch-action: pan-y; will-change: transform, opacity; }
.ring-canvas:active { cursor: grabbing; }
.ring-canvas canvas { display: block; width: 100% !important; height: 100% !important; }
.ring-sec.is-started .ring-canvas { opacity: 1; transform: none; }

.ring-caption { position: absolute; left: clamp(20px,6vw,110px); bottom: clamp(28px,6vh,64px); z-index: 4; max-width: min(360px, 28vw); opacity: 0; transform: translateY(20px); transition: opacity 0.8s ease 2s, transform 0.9s cubic-bezier(0.16,1,0.3,1) 2s; pointer-events: none; }
.ring-sec.is-live .ring-caption { opacity: 1; transform: none; }
.ring-caption > * { pointer-events: auto; }
.ring-kicker { display: flex; align-items: center; gap: 10px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.3em; color: var(--c-orange); margin: 0 0 12px; }
.ring-kicker .dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-orange); box-shadow: 0 0 14px rgba(252,106,11,0.8); animation: lmPulse 2s ease-in-out infinite; }
.ring-name { font-family: var(--font-heading); font-weight: 500; font-size: clamp(24px,3vw,48px); line-height: 1.02; text-wrap: balance; letter-spacing: -0.01em; margin: 0; color: var(--c-ink); text-shadow: 0 2px 30px rgba(245,239,233,0.9); }
.ring-role { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-warm); margin: 14px 0 22px; }
body.lm-dark .ring-name { color: #F0E8E0; text-shadow: 0 2px 30px rgba(28,24,21,0.9); }
body.lm-dark .ring-role { color: #B2A69B; }
.ring-sec.is-swap .ring-name, .ring-sec.is-swap .ring-role { animation: ringSwap 0.7s cubic-bezier(0.16,1,0.3,1); }
@keyframes ringSwap { from { opacity: 0; transform: translateY(14px); filter: blur(6px); } to { opacity: 1; transform: none; filter: blur(0); } }
.ring-mute { padding: 13px 24px; font-size: 10px; }

.ring-nav { position: absolute; right: clamp(20px,5vw,80px); top: 50%; transform: translateY(-50%); z-index: 4; display: flex; flex-direction: column; gap: 14px; opacity: 0; transition: opacity 0.8s ease 2.2s; }
.ring-sec.is-live .ring-nav { opacity: 1; }
.ring-arrow { width: 56px; height: 56px; border-radius: 50%; border: 1.5px solid rgba(252,106,11,0.7); background: rgba(245,239,233,0.55); backdrop-filter: blur(10px); color: var(--c-ink); font-size: 11px; cursor: pointer; display: flex; align-items: center; justify-content: center; transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1), background 0.3s ease, color 0.3s ease; }
.ring-arrow:hover { transform: scale(1.1); background: var(--c-orange); color: #FAF7F2; }
body.lm-dark .ring-arrow { background: rgba(28,24,21,0.55); color: #F0E8E0; }

.ring-thumbs-wrap { position: absolute; right: clamp(20px,5vw,80px); bottom: clamp(28px,6vh,64px); z-index: 4; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; opacity: 0; transition: opacity 0.8s ease 2.4s; }
.ring-sec.is-live .ring-thumbs-wrap { opacity: 1; }
.ring-thumbs-label { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase; color: var(--c-muted); }
.ring-thumbs { display: flex; gap: 8px; }
.ring-thumb { width: 38px; height: 66px; border-radius: 8px; overflow: hidden; border: 1.5px solid rgba(21,17,12,0.18); background: #2A241F; padding: 0; cursor: pointer; opacity: 0.6; transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1), opacity 0.3s ease, border-color 0.3s ease; }
.ring-thumb canvas { display: block; width: 100%; height: 100%; object-fit: cover; }
.ring-thumb:hover { opacity: 1; transform: translateY(-3px); }
.ring-thumb.is-on { opacity: 1; border-color: var(--c-orange); transform: translateY(-5px) scale(1.06); box-shadow: 0 10px 24px rgba(252,106,11,0.35); }
body.lm-dark .ring-thumb { border-color: rgba(240,232,224,0.22); }
.ring-sec.is-fallback .ring-stage { display: none; }
@media (max-width: 720px) {
  .ring-stage { height: clamp(560px, 82vh, 760px); }
  .ring-thumbs-wrap { right: 14px; bottom: 96px; }
  .ring-thumb { width: 28px; height: 50px; }
  .ring-caption { left: 18px; right: 18px; bottom: 18px; max-width: none; }
  .ring-name { font-size: clamp(26px,8vw,36px); }
}

.ring-vhost { position: absolute; left: 0; bottom: 0; width: 2px; height: 2px; overflow: hidden; opacity: 0.01; pointer-events: none; z-index: 0; }
.ring-vhost video { width: 2px; height: 2px; }

/* Hero-Kicker-Subzeile im dunklen Glas hell */
body.lm-dark .hero-panel .kicker .sub, body.lm-dark .hero-panel .kicker { color: #F0E8E0; }
body.lm-dark .svc-hero .svc-label, body.lm-dark .svc-hero .svc-meta { color: #F0E8E0; }

/* ==================== Globales Breitenraster ==================== */
:root { --lm-max: 1440px; --lm-pad: clamp(20px, 5vw, 80px); }
@media (min-width: 1920px) { :root { --lm-max: 1600px; } }
.section, .system-section, .insights-section, .final-cta, .testi-sec, .form-sec, .ring-sec, .partner-band, .legal-main, .site-footer .footer-cols, .site-footer .footer-big,
.svc-hero-panel-wrap, .stack3d-sticky, .smask-sticky, .kt-sec, .tiles-sec .tt-copy-wrap, .about-hero-inner {
  padding-left: var(--lm-pad) !important; padding-right: var(--lm-pad) !important; }
.section > *:not(.orb-glow):not(.bg-media):not(.metrics-wrap):not(.section-fade), .system-section > .system-inner, .insights-section > *:not(.orb-glow), .final-cta > *:not(.halo):not(.orb-glow),
.testi-sec > *:not(.orb-glow):not(.bg-media), .form-sec > .form-inner, .ring-sec > .ring-intro, .ring-sec > .ring-stage, .partner-band > *, .legal-main > *:not(.orb-glow), .site-footer .footer-cols, .site-footer .footer-big,
.hero-panel-row, .metrics-inner, .kt-inner {
  max-width: var(--lm-max); margin-left: auto !important; margin-right: auto !important; }
.legal-main { max-width: none; }
.legal-main > *:not(.orb-glow) { max-width: min(var(--lm-max), 860px); }

/* Breitenraster — Nachzügler: Bildsektionen, Hero-Panels */
.metrics-inner { padding-left: var(--lm-pad) !important; padding-right: var(--lm-pad) !important; }
.metrics-inner > * { max-width: var(--lm-max); margin-left: auto; margin-right: auto; }
.metrics-inner > .metrics-head { display: flex; width: fit-content; margin-left: auto; margin-right: auto; }
.metrics-inner > .metrics-grid { width: 100%; }
.kontakt-section > .kontakt-headbox, .kontakt-section > .kontakt-form-box, .kontakt-section > .eyebrow { max-width: var(--lm-max); margin-left: auto !important; margin-right: auto !important; }
.kontakt-section > .kontakt-headbox { width: 100%; }
.form-sec > .form-inner { max-width: var(--lm-max); }
.svc-hero { padding-left: var(--lm-pad); padding-right: var(--lm-pad); }
.svc-hero-panel { margin-left: 0 !important; margin-right: 0 !important; }
.svc-hero .logo-rail { right: var(--lm-pad) !important; }
@media (min-width: 1700px) {
  .svc-hero, .hero { padding-left: max(var(--lm-pad), calc((100vw - var(--lm-max)) / 2)); padding-right: max(var(--lm-pad), calc((100vw - var(--lm-max)) / 2)); }
}

.metrics-inner > .metrics-head { margin-left: auto !important; margin-right: auto !important; width: 100%; max-width: var(--lm-max); }
.metrics-inner > .metrics-head { display: flex; align-items: flex-start; }
.metrics-inner > .metrics-head > * { max-width: 620px; }

/* Hero (Startseite): Fade von transparent in die Folgesektion */
.hero { position: relative; }
.hero::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(120px, 18vh, 240px); z-index: 1; pointer-events: none; background: linear-gradient(rgba(245,239,233,0), #F5EFE9); }
body.lm-dark .hero::after { background: linear-gradient(rgba(28,24,21,0), #1C1815); }
.hero > .hero-panel, .hero > .hero-foot, .hero > .logo-rail, .hero > .hero-service-list { z-index: 2; }
/* Unterseiten-Fade an den globalen Hintergrundton angleichen */
body.lm-dark .svc-hero::after, body.lm-dark .about-hero::after { background: linear-gradient(rgba(28,24,21,0), #1C1815); }

/* Ring — Höhe an den Viewport binden */
.ring-sec { display: flex; flex-direction: column; padding-bottom: clamp(24px,4vh,44px); }
.ring-stage { height: min(84vh, calc(100svh - 300px)) !important; min-height: 360px; flex: 0 0 auto; }


/* ==================================================================
   RESPONSIVE — Handy, Tablet, Ultrawide (gemeinsame Ebene)
   ================================================================== */

/* --- Ultrawide: Inhalt zentriert statt gestreckt --- */
@media (min-width: 2200px) { :root { --lm-max: 1720px; } }
@media (min-width: 2600px) { :root { --lm-max: 1840px; } }

/* --- Mobile Navigation (Burger) --- */
.nav-burger { display: none; width: 44px; height: 44px; border: 1px solid rgba(21,17,12,0.22); border-radius: 999px; background: transparent; cursor: pointer; align-items: center; justify-content: center; flex-direction: column; gap: 4px; padding: 0; flex: 0 0 auto; }
.nav-burger span { display: block; width: 16px; height: 1.5px; background: var(--c-ink); transition: transform 0.3s ease, opacity 0.25s ease; }
body.lm-dark .nav-burger { border-color: rgba(240,232,224,0.28); }
body.lm-dark .nav-burger span { background: #F0E8E0; }
body.nav-open .nav-burger span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
body.nav-open .nav-burger span:nth-child(2) { opacity: 0; }
body.nav-open .nav-burger span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }
.nav-sheet { position: fixed; inset: 0; z-index: 180; background: rgba(245,239,233,0.97); backdrop-filter: blur(20px); display: flex; flex-direction: column; padding: 88px clamp(20px,6vw,40px) 32px; overflow-y: auto; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity 0.35s ease, transform 0.4s cubic-bezier(0.16,1,0.3,1), visibility 0.35s; }
body.lm-dark .nav-sheet { background: rgba(24,21,18,0.97); }
body.nav-open .nav-sheet { opacity: 1; visibility: visible; transform: none; }
body.nav-open { overflow: hidden; }
.nav-sheet a { display: flex; align-items: center; justify-content: space-between; gap: 14px; min-height: 56px; padding: 12px 4px; border-bottom: 1px solid rgba(21,17,12,0.12); font-family: var(--font-heading); font-weight: 500; font-size: clamp(19px,5vw,26px); color: var(--c-ink); text-decoration: none; }
body.lm-dark .nav-sheet a { color: #F0E8E0; border-color: rgba(240,232,224,0.14); }
.nav-sheet a .n { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.2em; color: var(--c-orange); }
.nav-sheet a.sub { font-size: clamp(15px,4vw,18px); padding-left: 18px; min-height: 50px; opacity: 0.88; }
.nav-sheet .sheet-cta { margin-top: 26px; }
.nav-sheet .sheet-cta a { justify-content: center; border: 0; background: var(--c-orange); color: #FAF7F2; border-radius: 999px; font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase; min-height: 56px; }
.nav-sheet .sheet-meta { margin-top: auto; padding-top: 28px; font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-muted); }
@media (max-width: 900px) { .nav-burger { display: flex; } }
@media (min-width: 901px) { .nav-sheet { display: none; } }

/* --- Header kompakt --- */
@media (max-width: 900px) {
  .site-header .inner { gap: 10px; padding-left: clamp(14px,4vw,20px); padding-right: clamp(14px,4vw,20px); }
  .site-header .brand span { font-size: 13px; }
  .header-right { gap: 8px; }
  .header-cta { display: none; }
  .lang-switch { transform: scale(0.92); }
}
@media (max-width: 420px) { .site-header .brand span { display: none; } }

/* --- Kompetenzwelten-Fächer: auf Mobil gestapelte Karten statt geschrumpfter Fächer --- */
@media (max-width: 860px) {
  .fan-scale { height: auto !important; overflow: visible; }
  .fan { position: static !important; width: 100% !important; height: auto !important; transform: none !important;
    display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
  .fan-card { position: static !important; width: 100% !important; height: auto !important; min-height: 420px;
    margin: 0 !important; transform: none !important; z-index: auto !important; }
  .fan-card .flip { position: relative; inset: auto; min-height: 420px; }
  .fan-face { position: absolute; inset: 0; }
  .fan-card.is-open { z-index: 5 !important; }
}
@media (max-width: 520px) {
  .fan { grid-template-columns: 1fr; }
  .fan-card, .fan-card .flip { min-height: 400px; }
}

/* --- Kompetenz-Matrix (Würfel): auf Mobil umbrechendes Raster in Originalgröße --- */
@media (max-width: 900px) {
  .cubes-scale { height: auto !important; overflow: visible; }
  .cubes { transform: none !important; grid-template-columns: repeat(4, 76px); gap: 22px; justify-content: center; }
  .cube-slot, .cube { width: 76px; height: 76px; }
  .cube .f-b { transform: rotateY(180deg) translateZ(38px); }
  .cube .f-r { transform: rotateY(90deg) translateZ(38px); }
  .cube .f-l { transform: rotateY(-90deg) translateZ(38px); }
  .cube .f-t { transform: rotateX(90deg) translateZ(38px); }
  .cube .f-bo { transform: rotateX(-90deg) translateZ(38px); }
  .cube .f-f { transform: translateZ(38px); }
  .cube .f-f > img.logo-img { width: 36px; }
  .cube-shadow { bottom: -18px; height: 14px; }
}
@media (max-width: 520px) {
  .cubes { grid-template-columns: repeat(3, 68px); gap: 18px; }
  .cube-slot, .cube { width: 68px; height: 68px; }
  .cube .f-b { transform: rotateY(180deg) translateZ(34px); }
  .cube .f-r { transform: rotateY(90deg) translateZ(34px); }
  .cube .f-l { transform: rotateY(-90deg) translateZ(34px); }
  .cube .f-t { transform: rotateX(90deg) translateZ(34px); }
  .cube .f-bo { transform: rotateX(-90deg) translateZ(34px); }
  .cube .f-f { transform: translateZ(34px); }
  .cube .f-f > img.logo-img { width: 32px; }
}

/* --- Hero --- */
@media (max-width: 900px) {
  .hero, .svc-hero, .about-hero { min-height: 92svh; }
  .hero-panel, .svc-hero-panel { width: 100% !important; max-width: none; padding: clamp(22px,5vw,32px); }
  .hero-foot { font-size: 8.5px; letter-spacing: 0.2em; }
  .hero-foot.right { display: none; }
  .about-hero-inner { gap: 24px; }
}
@media (max-width: 600px) {
  .hero-panel h1, .svc-hero h1 { font-size: clamp(26px,8vw,38px); }
  .hero-services { display: none; }
}

/* --- Referenz-Ring auf kleinen Geräten --- */
@media (max-width: 900px) {
  .ring-stage { height: min(74vh, calc(100svh - 300px)) !important; min-height: 320px; }
  .ring-arrow { width: 46px; height: 46px; }
  .ring-thumbs-wrap { display: none; }
}

/* --- Raster & Karten: nie schmaler als lesbar, nie überlaufend --- */
@media (max-width: 900px) {
  .svc-grid, .insights-grid, .xlinks, .works, .team-grid, .stance, .dash, .frag-grid, .mech { grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)) !important; }
  .depth-cards { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
  .two-col, .diag { gap: 26px; }
  .svc-row, .svc-row:nth-child(even) { flex-direction: column; }
  .svc-rows { gap: 34px; }
  .tl-track { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .levels .row { grid-template-columns: repeat(4, minmax(0, 1fr)); row-gap: 24px; }
  .arch, .universe { width: 100%; }
  .fcase .fbody, .fcase .fgallery { grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); }
  .hm .col { flex: 1 1 100%; }
  .hm .col.system { border-left: 0; border-top: 2px solid var(--c-orange); }
}
@media (max-width: 560px) {
  .svc-grid, .insights-grid, .xlinks, .works, .team-grid, .stance, .dash, .frag-grid, .mech, .depth-cards { grid-template-columns: 1fr !important; }
  .metrics-grid { grid-template-columns: 1fr !important; }
  .tl-track { grid-template-columns: 1fr; }
  .levels .row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Typografie-Untergrenzen + Umbruchschutz --- */
@media (max-width: 900px) {
  .h-display, .h-xl, .h-lg { overflow-wrap: break-word; }
  .metric-card .value { white-space: normal; }
  .eyebrow { letter-spacing: 0.2em; }
  .chips { gap: 8px; }
  .chip { font-size: 10.5px; padding: 8px 13px; }
}

/* --- Berührziele mindestens 44px --- */
@media (pointer: coarse) {
  .btn-primary, .btn-ghost, .header-cta, .bm-tab, .filter-chip, .mech-tile, .ring-arrow, .ring-mute, .lang-switch button, .dark-toggle { min-height: 44px; }
  .lang-switch button { min-width: 44px; }
  .faq summary { min-height: 56px; }
}

/* --- Formulare --- */
@media (max-width: 700px) {
  .svc-form, .kontakt-form-box form { grid-template-columns: 1fr !important; }
  .svc-form .field.full, .svc-form .field { grid-column: 1 / -1; }
  .form-inner { gap: 22px; }
  input, select, textarea { font-size: 16px !important; }
}

/* --- Sektionsabstände auf Mobil straffen --- */
@media (max-width: 700px) {
  .section, .testi-sec, .form-sec, .insights-section, .system-section { padding-top: clamp(56px,9vh,80px); padding-bottom: clamp(56px,9vh,80px); }
  .final-cta { padding-top: clamp(70px,11vh,110px); padding-bottom: clamp(70px,11vh,110px); }
  .legal-main { padding-top: clamp(110px,16vh,150px); }
}

/* --- Content-Wall / Bildtunnel --- */
@media (max-width: 860px) {
  .tt-stage { height: clamp(360px, 52vh, 520px); }
  .tiles-sec .tt-copy { position: static; margin: 24px auto 0; width: 100%; }
}

/* --- Kein horizontaler Überlauf (clip statt hidden: kein Scroll-Container, sticky bleibt funktionsfähig) --- */
html, body { overflow-x: clip; max-width: 100%; }
img, video, svg, canvas { max-width: 100%; }

/* Hero-Leistungsauswahl bleibt auf Mobil erhalten — als antippbare Liste */
@media (max-width: 600px) {
  .hero-services { display: flex !important; flex-direction: column; gap: 0; margin-top: 20px; }
  .hero-service { min-height: 52px; padding: 12px 4px; font-size: 14px; }
  .hero-service .num { font-size: 9.5px; }
  .hero-service .title { font-size: 14px; }
  .hero-service .arrow { opacity: 1 !important; transform: none !important; color: var(--c-orange); }
}

/* Ring — Caption und Navigation als Geschwister unter der Bühne (Flow, nicht absolut) */
.ring-sec > .ring-caption {
  max-width: var(--lm-max); width: 100%; margin: clamp(14px,2vh,22px) auto 0; padding: 0 var(--lm-pad);
  display: flex; align-items: center; gap: clamp(12px,2vw,26px); flex-wrap: wrap; text-align: left;
  position: relative; z-index: 4; left: auto; right: auto; bottom: auto; }
.ring-sec > .ring-caption .ring-kicker { margin: 0; order: 1; flex: 0 0 auto; }
.ring-sec > .ring-caption .ring-name { margin: 0; order: 2; font-size: clamp(19px,2vw,30px); line-height: 1.1; }
.ring-sec > .ring-caption .ring-role { margin: 0; order: 3; flex: 1 1 auto; }
.ring-sec > .ring-caption .ring-mute { order: 4; margin: 0; flex: 0 0 auto; }
.ring-sec > .ring-nav {
  max-width: var(--lm-max); width: 100%; margin: clamp(12px,1.6vh,18px) auto 0; padding: 0 var(--lm-pad);
  display: flex; justify-content: flex-end; gap: 12px; flex-direction: row;
  position: relative; z-index: 4; top: auto; right: auto; bottom: auto; transform: none; }
@media (max-width: 620px) {
  .ring-sec > .ring-caption { justify-content: center; text-align: center; }
  .ring-sec > .ring-caption .ring-role { flex: 1 1 100%; }
  .ring-sec > .ring-caption .ring-mute { flex: 1 1 100%; }
  .ring-sec > .ring-nav { justify-content: center; }
}

/* Ring — kurze Viewports (13-Zoll, Landscape): Bühne und Intro zusammenziehen */
@media (max-height: 760px) {
  .ring-sec { min-height: 0; padding-top: clamp(34px,5vh,60px); }
  .ring-sec .ring-eyebrow { margin-bottom: 8px; }
  .ring-sec .ring-title { font-size: clamp(22px,3.4vw,38px); }
  .ring-sec.is-live .ring-title { font-size: clamp(19px,2.4vw,30px); }
  .ring-stage { height: min(60vh, calc(100svh - 250px)) !important; min-height: 240px; }
  .ring-sec > .ring-caption { margin-top: 10px; }
  .ring-sec > .ring-nav { margin-top: 8px; }
}
@media (max-height: 560px) {
  .ring-sec .ring-title, .ring-sec.is-live .ring-title { font-size: clamp(17px,2vw,24px); }
  .ring-stage { height: max(190px, calc(100svh - 215px)) !important; min-height: 0; }
  .ring-sec > .ring-caption .ring-name { font-size: 17px; }
}

/* Ring — Caption/Nav: klare Trennung, keine Kollision mit dem Ton-Button */
.ring-sec > .ring-nav { margin-top: clamp(14px,2vh,22px); }
@media (max-height: 760px) { .ring-sec > .ring-nav { margin-top: 12px; } }

/* Ring — Bedienleiste: Angaben links, Ton und Pfeile rechts, eine Zeile, keine Überlappung */
.ring-sec > .ring-bar {
  max-width: var(--lm-max); width: 100%; margin: clamp(14px,2vh,22px) auto 0; padding: 0 var(--lm-pad);
  position: relative; z-index: 4; display: flex; align-items: center; justify-content: space-between;
  gap: clamp(14px,2vw,28px); flex-wrap: wrap; }
.ring-bar .ring-caption { position: static; left: auto; right: auto; bottom: auto; max-width: none; width: auto;
  margin: 0; padding: 0; display: flex; align-items: center; gap: clamp(10px,1.6vw,22px); flex: 1 1 320px; flex-wrap: wrap; text-align: left; }
.ring-bar .ring-caption .ring-kicker { margin: 0; flex: 0 0 auto; }
.ring-bar .ring-caption .ring-name { margin: 0; font-size: clamp(18px,1.9vw,28px); line-height: 1.1; }
.ring-bar .ring-caption .ring-role { margin: 0; flex: 0 1 auto; }
.ring-bar .ring-nav { position: static; top: auto; right: auto; bottom: auto; transform: none;
  max-width: none; width: auto; margin: 0; padding: 0; display: flex; flex-direction: row; align-items: center;
  gap: 10px; flex: 0 0 auto; }
.ring-bar .ring-mute { margin: 0; flex: 0 0 auto; order: -1; }
@media (max-width: 620px) {
  .ring-sec > .ring-bar { justify-content: center; }
  .ring-bar .ring-caption { justify-content: center; text-align: center; flex: 1 1 100%; }
  .ring-bar .ring-nav { justify-content: center; }
}

/* Ring — Kicker ohne Leuchtpunkt */
.ring-caption .ring-kicker .dot { display: none !important; }

/* Ring — Titel liegt über der Bühne, Video läuft dahinter durch */
.ring-sec { position: relative; }
.ring-sec > .ring-intro { position: absolute; left: 0; right: 0; top: clamp(70px,9vh,110px); z-index: 5; pointer-events: none; }
.ring-sec > .ring-stage { margin-top: 0 !important; height: min(96vh, calc(100svh - 210px)) !important; }
@media (max-height: 760px) { .ring-sec > .ring-stage { height: min(88vh, calc(100svh - 180px)) !important; } }
@media (max-height: 560px) { .ring-sec > .ring-stage { height: max(220px, calc(100svh - 150px)) !important; } }

/* Ring — Vollbild-Sektion, Bühne zwischen Titel und Caption eingespannt */
.ring-sec { position: relative; min-height: 100svh; height: 100svh; display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto; align-items: stretch;
  padding-top: clamp(84px,11vh,130px); padding-bottom: clamp(20px,3vh,36px); overflow: hidden; }
.ring-sec > .ring-intro { position: static !important; top: auto !important; z-index: 5; pointer-events: none; margin-bottom: clamp(10px,1.6vh,20px); }
.ring-sec > .ring-stage { position: relative; height: auto !important; min-height: 0 !important; margin: 0 !important; }
.ring-sec > .ring-canvas, .ring-stage > .ring-canvas { position: absolute; inset: 0; height: 100% !important; margin: 0 !important; }
.ring-sec > .ring-caption { margin-top: clamp(10px,1.6vh,20px) !important; }
@media (max-width: 620px) { .ring-sec { height: auto; min-height: 100svh; } .ring-sec > .ring-stage { min-height: 46svh !important; } }

/* Ring — feste Mindestabstände zwischen Titel, Bühne und Caption */
.ring-sec { row-gap: clamp(22px, 3vh, 40px); }
.ring-sec > .ring-intro { margin-bottom: 0 !important; }
.ring-sec > .ring-caption { margin-top: 0 !important; }

/* Ring — Titel und Caption kompakt halten, Bühne bekommt den Rest */
.ring-sec { row-gap: clamp(16px, 2.2vh, 30px); padding-top: clamp(78px,10vh,120px); }
.ring-sec > .ring-intro .ring-eyebrow { margin-bottom: clamp(6px,1vh,12px); }
.ring-sec > .ring-intro .ring-title { font-size: clamp(26px, 4vw, 62px); line-height: 1.02; }
.ring-sec.is-live > .ring-intro .ring-title { font-size: clamp(22px, 2.8vw, 42px); }
@media (max-height: 820px) { .ring-sec.is-live > .ring-intro .ring-title { font-size: clamp(20px, 2.4vw, 32px); } }

/* ==================== Würfel-Intro: Einflug von rechts ==================== */
#lm-cubes.is-pre .cube { opacity: 0; transform: translate3d(var(--fly-x, 140vw), var(--fly-y, 0), 0) rotateX(-24deg) rotateY(38deg) scale(0.72) !important; }
#lm-cubes.is-arranged .cube-wrap { animation: cubeSettle 0.9s cubic-bezier(0.34,1.4,0.64,1) var(--fly-delay, 0s) both; }
@keyframes cubeSettle { 0% { filter: blur(3px); } 60% { filter: blur(0); } 100% { filter: none; } }
@media (prefers-reduced-motion: reduce) { #lm-cubes .cube { opacity: 1 !important; transform: none !important; } #lm-cubes .cube-wrap { animation: none !important; } }

/* Ring — Bühne über die ganze Sektionshöhe, Titel und Caption liegen darüber */
.ring-sec { row-gap: clamp(16px, 2.2vh, 28px); }
.ring-sec > .ring-intro { position: relative; z-index: 6; pointer-events: none; }

.ring-sec > .ring-stage { position: static !important; }
.ring-sec .ring-canvas { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; z-index: 2; }
.ring-sec > .ring-nav, .ring-stage > .ring-nav { z-index: 7; }

/* Ring — Bühne füllt die Sektion, Titel und Steuerleiste liegen darüber */
.ring-sec > .ring-bar { position: relative; z-index: 6; }
.ring-sec > .ring-stage { position: static !important; height: auto !important; min-height: 0 !important; margin: 0 !important; }
.ring-sec .ring-canvas { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; z-index: 2; }
.ring-sec .ring-caption, .ring-sec .ring-nav { position: relative !important; }

/* ==================== Kompetenzwelten: Stapel steigt, dann Auffächern ==================== */
.fan-track { position: relative; height: 200vh; }
.fan-sticky { position: sticky; top: 0; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding: clamp(70px,9vh,110px) 0 clamp(40px,6vh,70px); }
.fan-sticky > .eyebrow, .fan-sticky > h2, .fan-sticky > .mono-hint { position: relative; z-index: 3; }
.fan-sticky > .mono-hint { opacity: 0.55; transition: opacity 0.6s ease; }
.fan-track.is-fanned .fan-sticky > .mono-hint { opacity: 1; }
.fan-track .fan-card { transition: none; }
.fan-track:not(.is-fanned) .fan-card { pointer-events: auto; }
.fan-track.is-fanned .fan-card { transition: transform 0.7s cubic-bezier(0.16,1,0.3,1), box-shadow 0.4s ease; pointer-events: auto; }
@media (max-width: 860px) {
  .fan-track { height: auto; }
  .fan-sticky { position: static; min-height: 0; padding: clamp(40px,6vh,80px) 0; }
  .fan-track .fan-card { transform: none !important; }
}

/* ==================== Orbit-Startsequenz: Karten aus dem Lichtstrahl ==================== */
.orbit-fly { display: block; will-change: transform, opacity; }
.orbit-stage.is-preflight .orbit-fly { opacity: 0; }
.orbit-beam { position: absolute; left: 50%; top: 62%; width: clamp(52px, 6vw, 82px); height: clamp(150px, 22vh, 260px);
  transform: translateX(-50%); pointer-events: none; opacity: 0; z-index: -1;
  background: linear-gradient(rgba(252,106,11,0.42), rgba(252,106,11,0.14) 46%, rgba(252,106,11,0) 92%);
  clip-path: polygon(34% 0, 66% 0, 100% 100%, 0 100%); filter: blur(5px); }
.orbit-beam.is-pulse { animation: orbitBeam 0.85s cubic-bezier(0.22,1,0.36,1); }
@keyframes orbitBeam { 0% { opacity: 0; transform: translateX(-50%) scaleY(0.5); } 22% { opacity: 1; } 100% { opacity: 0; transform: translateX(-50%) scaleY(1.08); } }
@media (prefers-reduced-motion: reduce) { .orbit-beam { display: none; } .orbit-fly { opacity: 1 !important; transform: none !important; } }

/* Kompetenzwelten — Höhenkorrektur: Sticky exakt Viewporthöhe, Inhalt schrumpft mit */
.fan-sticky { height: 100svh; min-height: 0; overflow: hidden; padding: clamp(56px,8vh,104px) 0 clamp(24px,4vh,56px); }
.fan-sticky > h2 { margin-bottom: 10px !important; }
.fan-sticky > .mono-hint { margin-bottom: clamp(14px,2.4vh,34px) !important; }
@media (max-height: 760px) {
  .fan-sticky { padding-top: clamp(48px,7vh,72px); }
  .fan-sticky > h2 { font-size: clamp(22px, 3.4vw, 40px); }
}
@media (max-width: 860px) { .fan-sticky { height: auto; overflow: visible; } }

/* ==================== Buzzword-Laufband: größer, schneller, volle Breite ==================== */
.marquee-wrap { margin-left: calc(var(--lm-pad) * -1); margin-right: calc(var(--lm-pad) * -1); width: calc(100% + var(--lm-pad) * 2); max-width: none !important; padding-top: clamp(30px,4.5vh,56px); padding-bottom: clamp(30px,4.5vh,56px); gap: clamp(6px,1.4vh,18px); }
.marquee-item .word { font-size: clamp(56px, 7.4vw, 128px); line-height: 1.04; letter-spacing: -0.012em; }
.marquee-item, .marquee-row { gap: clamp(30px, 3.6vw, 64px); }
.diamond { width: clamp(12px, 1.1vw, 18px); height: clamp(12px, 1.1vw, 18px); }

/* ==================== Lucram Media Experience ==================== */
.xp-sec { padding-top: clamp(90px,13vh,150px); padding-bottom: clamp(90px,13vh,150px); }
.xp-inner { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(300px, 0.95fr); gap: clamp(34px,5vw,88px); align-items: center; }
.xp-copy .lead-bold { margin-top: clamp(22px,3vh,34px); }
.xp-signature { margin-top: clamp(26px,3.6vh,40px); padding-top: 18px; border-top: 1px solid rgba(21,17,12,0.18); display: flex; flex-direction: column; gap: 6px; }
.xp-sig-name { font-family: var(--font-heading); font-weight: 500; font-size: clamp(16px,1.5vw,20px); color: var(--c-ink); }
.xp-sig-role { font-family: var(--font-mono); font-size: 9.5px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-orange); }
.xp-ctas { display: flex; flex-wrap: wrap; gap: 14px; margin-top: clamp(26px,3.6vh,40px); }
body.lm-dark .xp-signature { border-color: rgba(240,232,224,0.2); }
body.lm-dark .xp-sig-name { color: #F0E8E0; }

.xp-media { position: relative; }
.xp-chroma { position: relative; width: 100%; aspect-ratio: 0.72; border-radius: 26px; overflow: hidden; cursor: crosshair; }
.xp-chroma canvas { position: absolute; inset: 0; }
.xp-chroma .xp-fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: opacity 0.6s ease; }
.xp-chroma.is-live .xp-fallback { opacity: 0; }
.xp-a11y { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
@media (max-width: 900px) {
  .xp-inner { grid-template-columns: 1fr; }
  .xp-media { order: -1; max-width: 420px; }
  .xp-chroma { aspect-ratio: 0.8; }
}

/* ==================== Footer-Globus ==================== */
.footer-big { position: relative; display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-areas: 'line globe' 'meta globe'; align-items: end; column-gap: clamp(24px,4vw,64px); }
.footer-big > .line { grid-area: line; }
.footer-big > .footer-meta { grid-area: meta; }
.footer-globe { grid-area: globe; position: relative; display: flex; flex-direction: column; align-items: flex-end; gap: 6px; align-self: end; justify-self: end; padding-bottom: 2px; }
.footer-globe .fg-stage { position: relative; width: clamp(190px, 20vw, 300px); height: clamp(190px, 20vw, 300px); overflow: visible;
  opacity: 0; transform: scale(0.9); transition: opacity 0.9s ease, transform 1.1s cubic-bezier(0.34,1.56,0.64,1); }
.footer-globe .fg-stage.is-live { opacity: 1; transform: none; }
.footer-globe .fg-stage canvas { display: block; width: 100% !important; height: 100% !important; }
.footer-globe .fg-label, .footer-globe .fg-hint { font-family: var(--font-mono); font-size: 9px; letter-spacing: 0.26em; text-transform: uppercase; color: var(--c-muted); margin: 0; text-align: right; }
.footer-globe .fg-hint { color: var(--c-orange); opacity: 0.85; }
.footer-globe .fg-stage.is-failed, .footer-globe .fg-stage.is-failed ~ p { display: none; }
body.lm-dark .footer-globe .fg-label { color: #8E8377; }
@media (max-width: 900px) {
  .footer-big { grid-template-columns: 1fr; grid-template-areas: 'line' 'globe' 'meta'; }
  .footer-globe { align-items: flex-start; justify-self: start; margin: clamp(20px,4vh,36px) 0; }
  .footer-globe .fg-label, .footer-globe .fg-hint { text-align: left; }
  .footer-globe .fg-stage { width: min(240px, 62vw); height: min(240px, 62vw); }
}
@media (prefers-reduced-motion: reduce) { .footer-globe { display: none; } }/* Zahlen & Fakten: gleiche Behandlung für Kopf und Karten */
.metric-card .label { color: #3A3128; }
body.lm-dark .metric-card .label { color: #E4DCD2; }/* Header: eine Schriftfamilie je Modus */
.site-header .brand span, .site-header .wp-gen-menu > li > a, .site-header .header-cta,
.site-header .dark-toggle, .site-header .lang-btn { color: var(--c-ink); }
.site-header .header-cta { border-color: rgba(21, 17, 12, 0.4); }
body.lm-dark .site-header .brand span, body.lm-dark .site-header .wp-gen-menu > li > a,
body.lm-dark .site-header .header-cta, body.lm-dark .site-header .dark-toggle,
body.lm-dark .site-header .lang-btn { color: #F4EDE5; }
body.lm-dark .site-header .header-cta { border-color: rgba(244, 237, 229, 0.45); }
.site-header .lang-btn.is-active, body.lm-dark .site-header .lang-btn.is-active { color: var(--c-orange); }

/* Insights: maximal 4 Spalten, egal wie breit */
.insights-grid { grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important; }
@media (min-width: 1180px) { .insights-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; } }

/* Kontaktkacheln exakt gleich breit und bündig */
.kontakt-headbox, .kontakt-form-box { width: 100%; max-width: var(--lm-max); margin-left: auto; margin-right: auto; transform: none !important; }

/* Kompetenz-Matrix: Lag vermeiden — Übergänge nur während der Interaktion */
#lm-cubes.is-pre .cube, #lm-cubes.is-arranged .cube { will-change: transform, opacity; }
#lm-cubes.intro-done .cube { will-change: auto; }
/* Klick-Welle */
#lm-cubes .cube.is-hot .f-f { background: var(--c-orange) !important; }
#lm-cubes .cube.is-hot .f-f span, #lm-cubes .cube.is-hot .f-f .label { color: #FAF7F2 !important; }
#lm-cubes .cube.is-hot .f-f img { filter: brightness(0) invert(1) !important; }
/* Matrix-Logo im Dark Mode schwarz statt invertiert */
body.lm-dark #lm-cubes img, body.lm-dark #lm-cubes .cube img { filter: none !important; }

/* Ring: Rondell 20 % tiefer, Name zentriert */
.ring-sec > .ring-stage { padding-top: 20%; }
.ring-sec .ring-caption { text-align: center; left: 0 !important; right: 0 !important; align-items: center; }
.ring-sec .ring-caption .ring-name, .ring-sec .ring-caption .ring-role { text-align: center; }
.ring-sec .ring-nav { display: flex; justify-content: space-between; align-items: center; left: 0 !important; right: 0 !important; width: 100%; pointer-events: none; }
.ring-sec .ring-nav > button { pointer-events: auto; }
@media (max-height: 800px) { .ring-sec > .ring-stage { padding-top: 12%; } }.hero-panel .hero-service .num, .hero-panel .hero-service .arrow { color: var(--c-orange); }

/* Logo-Leiste im Hero: volle Höhe füllen, ohne Glas-Tönung */
.hero .logo-rail, .svc-hero .logo-rail { position: absolute; top: 50%; transform: translateY(-50%); height: min(60vh, 520px); }
.logo-rail .track { min-height: 200%; justify-content: flex-start; }body.lm-dark .logo-rail .fade-top { background: linear-gradient(rgba(28,24,21,0.85), rgba(28,24,21,0)); }
body.lm-dark .logo-rail .fade-bottom { background: linear-gradient(rgba(28,24,21,0), rgba(28,24,21,0.85)); }

/* Kompetenz-Matrix: Hinweis unter den Würfeln sichtbar */
#lm-cubes-scale + .mono-hint { display: block; position: relative; z-index: 2; margin-top: clamp(24px,4vh,40px) !important; }

/* Experience-Bild: natürlicher Ausschnitt, kein Zoom */
.xp-depth { aspect-ratio: 0.72; }
.xp-depth .dc-img { transform: none !important; background-size: cover; background-position: 50% 18%; filter: none; }
.xp-depth .dc-body { background: linear-gradient(rgba(21,17,12,0) 55%, rgba(21,17,12,0.7)); }

/* Referenzen: Steuerleiste rechts unten, Buttons nebeneinander */
.ring-sec > .ring-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; flex-wrap: wrap; }
.ring-bar .ring-caption { flex: 1 1 auto; display: flex; align-items: center; gap: clamp(10px,1.6vw,22px); flex-wrap: wrap; }
.ring-bar .ring-controls { display: flex; align-items: center; gap: 10px; flex: 0 0 auto; margin-left: auto; }
.ring-bar .ring-controls .ring-mute { order: 0; margin: 0; }
.ring-bar .ring-controls .ring-nav { position: static; transform: none; display: flex; flex-direction: row; gap: 10px; margin: 0; }
.ring-bar .ring-controls .ring-arrow { width: 46px; height: 46px; }

/* Footer-Globus: kein Beschnitt */
.footer-globe .fg-stage { overflow: visible; }
.footer-globe .fg-stage canvas { overflow: visible; }

/* ==================== Depth-Card (aus service.css, für Experience) ==================== */
.depth-card { position: relative; display: block; aspect-ratio: 3/4; border-radius: 18px; overflow: hidden; perspective: 1000px; cursor: pointer; background: #26221E; text-decoration: none; }
.depth-card .dc-inner { position: absolute; inset: 0; border-radius: 18px; transform-style: preserve-3d; backface-visibility: hidden; will-change: transform; box-shadow: 0 10px 22px rgba(21,17,12,0.2); transition: box-shadow 0.35s ease; }
.depth-card:hover .dc-inner { box-shadow: 0 24px 48px rgba(21,17,12,0.38); }
.depth-card .dc-img { position: absolute; inset: 0; background-size: cover; background-position: center; transform: scale(1.28); will-change: transform; backface-visibility: hidden; filter: saturate(0.45) brightness(0.82); }
.depth-card .dc-spot { position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; mix-blend-mode: soft-light; filter: blur(2px); transition: opacity 0.3s ease; }
.depth-card .dc-body { position: absolute; inset: 0; z-index: 3; display: flex; flex-direction: column; justify-content: flex-end; padding: clamp(18px, 2vw, 26px); background: linear-gradient(rgba(21,17,12,0) 40%, rgba(21,17,12,0.55) 72%, rgba(21,17,12,0.86)); }
.depth-card .dc-num { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.24em; color: var(--c-orange); margin-bottom: 10px; }
.depth-card .dc-title { font-family: var(--font-heading); font-weight: 500; font-size: clamp(15px, 1.3vw, 19px); line-height: 1.3; color: #FBF8F4; transform: translateY(6px); transition: transform 0.5s cubic-bezier(0.16,1,0.3,1); }
.depth-card:hover .dc-title { transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { .depth-card .dc-img { transform: scale(1); } }


/* ==================== Kompetenz-Matrix: Vollbild ==================== */
.matrix-sec { min-height: 100svh; display: flex; flex-direction: column; justify-content: center; padding-top: clamp(90px, 11vh, 130px) !important; padding-bottom: clamp(40px, 6vh, 70px) !important; }
.matrix-sec .cubes { gap: 30px 34px; }
.matrix-sec #lm-cubes-scale { flex: 0 0 auto; }
.matrix-sec #lm-cubes-scale + .mono-hint { position: relative; z-index: 3; margin: clamp(26px, 4vh, 44px) auto 0 !important; display: block; width: fit-content; }
/* Klick-Welle & Hover: ganzer Würfel orange, alle Flächen */
#lm-cubes .cube.is-hot .face, #lm-cubes .cube:hover .face { background: var(--c-orange) !important; }
#lm-cubes .cube.is-hot .f-b, #lm-cubes .cube:hover .f-b { background: #D85806 !important; }
#lm-cubes .cube.is-hot .f-r, #lm-cubes .cube.is-hot .f-l, #lm-cubes .cube:hover .f-r, #lm-cubes .cube:hover .f-l { background: #E65F08 !important; }
#lm-cubes .cube.is-hot .f-bo, #lm-cubes .cube:hover .f-bo { background: #C24F04 !important; }
#lm-cubes .cube.is-hot .f-t, #lm-cubes .cube:hover .f-t { background: #FF7F2A !important; }
#lm-cubes .cube.is-hot .f-f img, #lm-cubes .cube:hover .f-f img { filter: brightness(0) invert(1) !important; opacity: 0.9; }
@media (max-width: 900px) { .matrix-sec { min-height: 0; } }.logo-rail .fade-top, .logo-rail .fade-bottom { height: 70px; z-index: 4; }
.logo-rail .fade-top { background: linear-gradient(rgba(245,239,233,0.9), rgba(245,239,233,0)); }
.logo-rail .fade-bottom { background: linear-gradient(rgba(245,239,233,0), rgba(245,239,233,0.9)); }
body.lm-dark .logo-rail .fade-top { background: linear-gradient(rgba(20,17,14,0.92), rgba(20,17,14,0)); }
body.lm-dark .logo-rail .fade-bottom { background: linear-gradient(rgba(20,17,14,0), rgba(20,17,14,0.92)); }
.logo-rail .track { position: relative; z-index: 3; min-height: 0; padding: 24px 0; }/* Würfel mit Bild: Bild bleibt, orangene Tönung darüber */
#lm-cubes .cube .f-f { overflow: hidden; }
#lm-cubes .cube.is-hot .f-f::after, #lm-cubes .cube:hover .f-f::after { background: rgba(252, 106, 11, 0.55); }
#lm-cubes .cube.is-hot .f-f img, #lm-cubes .cube:hover .f-f img { filter: none !important; opacity: 1 !important; }
#lm-cubes .cube.is-hot .f-f:has(img), #lm-cubes .cube:hover .f-f:has(img) { background: #F5EFE9 !important; }

/* Experience: Chroma-Karte formatfüllend */
.xp-chroma { position: relative; width: 100%; aspect-ratio: 0.72; border-radius: 26px; overflow: hidden; cursor: crosshair; background: transparent; }
.xp-chroma canvas { position: absolute; inset: 0; }
.xp-chroma .xp-fallback { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; transition: opacity 0.6s ease; }
.xp-chroma.is-live .xp-fallback { opacity: 0; }
.xp-label { position: absolute; left: clamp(18px,2vw,26px); right: clamp(18px,2vw,26px); bottom: clamp(18px,2vw,26px); z-index: 3; pointer-events: none; display: flex; flex-direction: column; gap: 8px; }
.xp-label .xl-num { font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.24em; text-transform: uppercase; color: var(--c-orange); }
.xp-label .xl-title { font-family: var(--font-heading); font-weight: 500; font-size: clamp(15px,1.3vw,19px); color: #FBF8F4; text-shadow: 0 1px 12px rgba(0,0,0,0.5); }
.xp-chroma::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 42%; z-index: 2; pointer-events: none; background: linear-gradient(rgba(21,17,12,0), rgba(21,17,12,0.62)); border-radius: inherit; }/* Matrix + Referenzen: Titel in Sektionsgröße */
#matrix h2.h-display { font-size: clamp(32px, 3.85vw, 56px) !important; }
.ring-sec .ring-title, .ring-sec.is-live .ring-title { font-size: clamp(32px, 3.85vw, 56px) !important; line-height: 1.06; }
@media (max-height: 820px) { .ring-sec.is-live > .ring-intro .ring-title { font-size: clamp(28px, 3.2vw, 44px) !important; } }
/* Referenzen: Abstand nach unten + Fade zur nächsten Sektion */
.ring-sec { padding-bottom: clamp(90px, 12vh, 150px) !important; }
.ring-sec::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: clamp(120px, 18vh, 220px); z-index: 4; pointer-events: none; background: linear-gradient(rgba(245,239,233,0), #F5EFE9); }
body.lm-dark .ring-sec::after { background: linear-gradient(rgba(28,24,21,0), #1C1815); }/* Referenzen — Caption unter dem Rondell, Sektion mit Luft nach unten */
.ring-sec { padding-bottom: clamp(70px, 10vh, 130px) !important; row-gap: clamp(20px, 3vh, 40px); }
.ring-sec > .ring-bar { order: 3; margin-top: clamp(14px, 2.4vh, 34px) !important; }
.ring-sec > .ring-stage { order: 2; }
.ring-sec > .ring-intro { order: 1; }
.ring-sec .ring-caption { text-align: center; align-items: center; }.site-header .sub-menu { z-index: 60; }.lg:not(.lg-header) { position: relative; isolation: isolate; box-shadow: 0 30px 80px rgba(0,0,0,0.22) !important; }
.lg-header { isolation: auto; box-shadow: 0 1px 0 rgba(255,255,255,0.08) !important; }/* Text auf Glas */
.lg, .lg h1, .lg h2, .lg h3, .lg p, .lg span, .lg li, .lg label, .lg a { color: #F4EDE5; }
.lg .accent-shine, .lg .eyebrow, .lg .kicker, .lg .num, .lg .rl, .lg .suffix, .lg .sub-num { color: var(--c-orange); }
.lg .btn-primary, .lg .btn-primary span { color: #FAF7F2; }
.lg .site-header, .lg-header .sub-menu { color: inherit; }

/* ==================== GlassSurface (React Bits — Original-CSS) ==================== */
.glass-surface { position: relative; overflow: hidden; transition: opacity 0.26s ease-out; }
.glass-surface__filter { position: absolute; width: 100%; height: 100%; pointer-events: none; z-index: -1; }
.glass-surface__content { position: relative; z-index: 1; width: 100%; height: 100%; border-radius: inherit; }
.glass-surface--svg {
  color-scheme: dark;
  background: light-dark(hsl(0 0% 100% / var(--glass-frost, 0)), hsl(0 0% 0% / var(--glass-frost, 0)));
  backdrop-filter: var(--filter-id) saturate(var(--glass-saturation, 1));
  -webkit-backdrop-filter: var(--filter-id) saturate(var(--glass-saturation, 1));
  box-shadow:
    0 0 2px 1px light-dark(color-mix(in oklch, black, transparent 85%), color-mix(in oklch, white, transparent 65%)) inset,
    0 0 10px 4px light-dark(color-mix(in oklch, black, transparent 90%), color-mix(in oklch, white, transparent 85%)) inset,
    0px 4px 16px rgba(17, 17, 26, 0.05), 0px 8px 24px rgba(17, 17, 26, 0.05), 0px 16px 56px rgba(17, 17, 26, 0.05),
    0px 4px 16px rgba(17, 17, 26, 0.05) inset, 0px 8px 24px rgba(17, 17, 26, 0.05) inset, 0px 16px 56px rgba(17, 17, 26, 0.05) inset;
}
body:not(.lm-dark) .glass-surface--svg { color-scheme: light; }
.glass-surface--fallback { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(12px) saturate(1.8) brightness(1.2); -webkit-backdrop-filter: blur(12px) saturate(1.8) brightness(1.2); border: 1px solid rgba(255,255,255,0.2); }
body.lm-dark .glass-surface--fallback { background: rgba(0, 0, 0, 0.25); border-color: rgba(255,255,255,0.1); }
/* Header: Glas ohne Rundung, Dropdown darf herausragen */
.site-header.glass-surface { overflow: visible; }
.site-header.glass-surface .glass-surface__content { height: auto; }

/* ==================== Feinschliff nach Glas-Reset ==================== */
/* 1) Tönung: 40 % Schwarz in beiden Modi (Effekt unverändert, nur Frost) */
.glass-surface--svg { --glass-frost: 0.4; color-scheme: dark !important; }
/* Header: fixed bleibt fixed, transparenter für den Effekt */
.site-header.glass-surface { position: fixed !important; top: 0; left: 0; right: 0; z-index: 100; --glass-frost: 0.22; background: hsl(0 0% 0% / var(--glass-frost)) !important; border-bottom: 1px solid rgba(255,255,255,0.14); overflow: visible; }
.site-header.glass-surface .glass-surface__filter { z-index: -1; }
.site-header.glass-surface .glass-surface__content { height: auto; }
/* 2) Abschluss: Kopf und Formular auf derselben Kante, Text in der Kachel zentriert */
.kontakt-section > .eyebrow, .kontakt-section > .kontakt-headbox, .kontakt-section > .kontakt-form-box { width: 100%; max-width: var(--lm-max); margin-left: auto !important; margin-right: auto !important; }
/* 4) Referenzen: Bühne bleibt in der Sektion — Höhe an Viewport gebunden, Canvas füllt nur die Bühne */
.ring-sec { height: 100svh; max-height: 1100px; min-height: 620px; }
.ring-sec > .ring-stage { position: relative !important; height: auto !important; min-height: 0 !important; }
.ring-sec .ring-canvas { position: absolute !important; inset: 0 !important; height: 100% !important; width: 100% !important; }
/* 5) Kompetenz-Matrix: Skalierung folgt der Sektionsbreite */
#lm-cubes-scale { width: 100%; max-width: var(--lm-max); margin: 0 auto; }
/* 6) Experience-Bild: flacher, mittig */
.xp-chroma { aspect-ratio: 1.03 !important; max-width: 420px; margin: 0 auto; }
.xp-media { display: flex; align-items: center; justify-content: center; }

/* ==================== Runde 27 ==================== */
/* 1) Tönung: 80 % global, Hero 90 %; weiße Ränder an Glas weg */
.glass-surface--svg { --glass-frost: 0.8; }
.hero-panel.glass-surface--svg, .svc-hero-panel.glass-surface--svg { --glass-frost: 0.9; }
.site-header.glass-surface { --glass-frost: 0.6; }
.glass-surface--svg, .metric-card.glass-surface--svg, .metrics-head.glass-surface--svg, .form-head.glass-surface--svg, .svc-form.glass-surface--svg, .kontakt-headbox.glass-surface--svg, .kontakt-form-box.glass-surface--svg { border: 0 !important; }

/* Logo-Rail: Glas ohne Fades */
.logo-rail .fade-top, .logo-rail .fade-bottom { display: none !important; }
.logo-rail.glass-surface--svg { --glass-frost: 0.8; }
/* 2) Orbit-Zentrum als Glaskachel */
.orbit-center.glass-surface--svg { --glass-frost: 0.8; border-radius: 22px; padding: 18px 22px; }
.orbit-center.glass-surface--svg .glass-surface__content { display: flex; flex-direction: column; align-items: center; gap: 8px; }
/* 3) Experience: Depth-Card, 10 % höher */
.xp-depth { aspect-ratio: 0.9 !important; max-width: 440px; margin: 0 auto; }
/* 4) Unterseiten-Anfrage: Fade oben aus dem Dunklen */
.form-sec::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: clamp(120px, 18vh, 220px); z-index: 1; pointer-events: none; background: linear-gradient(#F5EFE9, rgba(245,239,233,0)); }
body.lm-dark .form-sec::before { background: linear-gradient(#1C1815, rgba(28,24,21,0)); }
.form-sec .svc-form.glass-surface--svg, .form-sec .form-head.glass-surface--svg { border: 0 !important; background-color: transparent; }
/* 5) Referenzen: Bühne füllt die Sektion zentriert, Bar unten mit Pfeilen neben dem Menü */
.ring-sec > .ring-stage { position: absolute !important; inset: 0 !important; height: auto !important; }
.ring-sec .ring-canvas { position: absolute !important; inset: 0 !important; }
.ring-sec > .ring-intro, .ring-sec > .ring-bar { position: relative; z-index: 6; }
.ring-sec { display: flex !important; flex-direction: column; justify-content: space-between; }
.ring-controls { display: flex; align-items: center; gap: 12px; }
.ring-nav { display: flex; gap: 8px; margin: 0; position: static !important; }
.ring-arrow { width: 46px; height: 46px; }
/* 6) Leistungs-Hero: Panel und Rail auf einer Achse vertikal zentriert */
.svc-hero { align-items: center !important; }
.svc-hero-panel { margin-top: 0 !important; margin-bottom: 0 !important; align-self: center; }
.svc-hero .logo-rail { top: 50% !important; transform: translateY(-50%) !important; }
/* 7) Matrix: kleinere Würfel, Zeilenabstand = Spaltenabstand */
#lm-cubes { display: grid !important; grid-template-columns: repeat(7, 84px); gap: 34px 34px; justify-content: center; }
.cube-slot, .cube { width: 84px !important; height: 84px !important; }
.cube .f-b { transform: rotateY(180deg) translateZ(42px) !important; } .cube .f-r { transform: rotateY(90deg) translateZ(42px) !important; }
.cube .f-l { transform: rotateY(-90deg) translateZ(42px) !important; } .cube .f-t { transform: rotateX(90deg) translateZ(42px) !important; }
.cube .f-bo { transform: rotateX(-90deg) translateZ(42px) !important; } .cube .f-f { transform: translateZ(42px) !important; }
/* 8) Startseite Kontakt: Kopf und Formular gleiche Kante und Breite */
.kontakt-section > .eyebrow, .kontakt-section > .kontakt-headbox, .kontakt-section > .kontakt-form-box { display: block; width: 100%; max-width: var(--lm-max); margin-left: auto !important; margin-right: auto !important; box-sizing: border-box; }
.kontakt-section > .kontakt-headbox { display: block !important; }

/* Runde 27 — Nacharbeit */
.cubes, #lm-cubes { grid-template-columns: repeat(7, 84px) !important; gap: 34px !important; }
.ring-bar { padding: 0 !important; }
.ring-bar .ring-controls, .ring-controls { margin-left: auto; flex: 0 0 auto; }
.ring-arrow { width: 44px; height: 44px; flex: 0 0 auto; }
.xp-depth { display: block; width: 100%; max-width: 440px; aspect-ratio: 0.9 !important; }
.xp-depth .dc-img { transform: scale(1.12) !important; }

.ring-bar .ring-nav, .ring-nav { width: auto !important; min-width: 0 !important; padding: 0 !important; }

/* Orbit-Zentrum: absolute Zentrierung gegen .glass-surface { position: relative } behaupten */
.orbit-center.glass-surface { position: absolute !important; left: 50% !important; top: 50% !important; transform: translate(-50%, -50%) !important; width: max-content !important; height: auto !important; margin: 0 !important; }
.orbit-center.glass-surface .glass-surface__content { width: auto; height: auto; }

/* Runde 28 */
.glass-surface--svg { --glass-frost: 0.6; }
.hero-panel.glass-surface--svg, .svc-hero-panel.glass-surface--svg { --glass-frost: 0.6; }
.site-header.glass-surface { --glass-frost: 0.45; }
/* Matrix: Zeilen exakt Würfelhöhe → Zeilenabstand = Spaltenabstand */
.cubes, #lm-cubes { grid-template-rows: repeat(3, 84px) !important; grid-auto-rows: 84px !important; gap: 34px !important; align-content: start; }
.cube-slot { height: 84px !important; }
/* Orbit: Logo-Glas oben, Strahl darunter */
.orbit-center.glass-surface { z-index: 6 !important; overflow: visible !important; }
.orbit-center .orbit-beam { z-index: -1 !important; }
.orbit-center.glass-surface > .orbit-beam { position: absolute; left: 50%; top: 62%; }
/* Referenzen: Canvas exakt auf Viewport-Mitte */
.ring-sec .ring-canvas { left: 50% !important; right: auto !important; width: 100vw !important; max-width: none !important; transform: translateX(-50%) !important; }

/* Ring: Mitte bezogen auf die Sektion (ohne Scrollbar-Versatz) */
.ring-sec .ring-canvas { width: 100% !important; left: 0 !important; transform: none !important; }
.ring-sec { overflow: clip; }

/* Runde 29 */
.metric-card.glass-surface--svg { background: hsl(0 0% 0% / var(--glass-frost, 0.6)) !important; }
.footer-big { max-width: none !important; padding-left: 0 !important; padding-right: 0 !important; }
.site-footer .footer-big > * { max-width: none; }

/* Footer-Schlusszeile: volle Sektionsbreite, aus dem Padding des Containers ausbrechen */
.footer-cols > .footer-big { width: calc(100% + var(--lm-pad) * 2) !important; margin-left: calc(var(--lm-pad) * -1) !important; margin-right: calc(var(--lm-pad) * -1) !important; padding-left: var(--lm-pad) !important; padding-right: var(--lm-pad) !important; max-width: none !important; }


/* Experience Depth-Card (React Bits Pro Depth Card, Vanilla): 10 % größer, Kopf frei, orangener Glow bei Hover */
.xp-depth { aspect-ratio: 0.82 !important; max-width: 484px !important; perspective: 1000px; }
.xp-depth .dc-inner { transition: box-shadow 0.35s ease, transform 0.05s linear; }
.xp-depth .dc-img { background-position: 50% 8% !important; transform: scale(1.3) !important; transition: none; will-change: transform; }
.xp-depth:hover .dc-inner { box-shadow: 0 0 0 1.5px rgba(252,106,11,0.9), 0 0 28px rgba(252,106,11,0.55), 0 0 70px rgba(252,106,11,0.28), 0 24px 48px rgba(0,0,0,0.4) !important; }
.xp-depth .dc-spot { position: absolute; inset: 0; z-index: 3; pointer-events: none; mix-blend-mode: soft-light; filter: blur(2px); opacity: 0; transition: opacity 0.3s ease; border-radius: inherit; }
.xp-depth:hover .dc-spot { opacity: 1; }
.xp-depth .dc-body { z-index: 4; }
.xp-depth .dc-title, .xp-depth .dc-num { transform: translateY(10px); transition: transform 0.5s ease, opacity 0.5s ease; }
.xp-depth:hover .dc-title, .xp-depth:hover .dc-num { transform: none; }

/* Footer-Schlusszeile: volle Breite, Globus in eigener Zeile darunter */
.footer-cols > .footer-big { display: grid !important; grid-template-columns: 1fr !important; grid-auto-flow: row; row-gap: clamp(24px, 4vh, 44px); }
.footer-big > .line, .footer-big > .footer-meta { grid-column: 1 / -1; }
.footer-big > .footer-globe { grid-column: 1 / -1; justify-self: center; }
.footer-big .line { font-size: clamp(36px, 6vw, 110px) !important; line-height: 1.42 !important; text-wrap: balance; }

.footer-cols > .footer-big { grid-template-areas: 'line' 'meta' 'globe' !important; grid-template-columns: minmax(0, 1fr) !important; align-items: start !important; }
.footer-big > .line { grid-area: line !important; } .footer-big > .footer-meta { grid-area: meta !important; } .footer-big > .footer-globe { grid-area: globe !important; }

/* ==================== Runde 32 ==================== */
/* Light-Mode-Umschalter ausblenden */
#lm-dark-toggle { display: none !important; }
/* 02 Lösung: Logo oberhalb des Orbits, Lichtkegel strahlt nach unten auf die Karten */
.orbit-center.glass-surface { top: -12% !important; transform: translate(-50%, -100%) !important; }
.orbit-center .orbit-beam { top: 100% !important; height: clamp(300px, 46vh, 520px) !important; width: clamp(420px, 60vw, 900px) !important; clip-path: polygon(46% 0, 54% 0, 100% 100%, 0 100%) !important; z-index: -1 !important; opacity: 0.85 !important; }
.orbit-center .orbit-beam.is-pulse { animation-duration: 1.4s !important; }
.orbit-outer { padding-top: clamp(110px, 14vh, 160px); }
/* 05 Experience: Bild ohne dunklen Layer */
.xp-depth .dc-veil, .xp-depth .dc-body::before, .xp-depth .dc-inner::after { display: none !important; background: none !important; }
.xp-depth .dc-body { background: none !important; }
.xp-depth .dc-img { filter: none !important; opacity: 1 !important; }
/* Footer: Zeile links, Globus rechts, Meta unter der Zeile — volle Breite */
.footer-cols > .footer-big { grid-template-columns: minmax(0, 1fr) auto !important; grid-template-areas: 'line globe' 'meta globe' !important; column-gap: clamp(24px, 4vw, 60px); align-items: end !important; }
.footer-big > .footer-globe { justify-self: end; }
.footer-big .line { font-size: clamp(34px, 4.6vw, 84px) !important; line-height: 1.3 !important; }
@media (max-width: 860px) { .footer-cols > .footer-big { grid-template-columns: 1fr !important; grid-template-areas: 'line' 'meta' 'globe' !important; } }

/* ==================== Runde 33: Leistungsseiten — Hintergründe ungefiltert, Glas ohne Rand ==================== */
.form-sec > .bg-media, body.lm-dark .form-sec > .bg-media, .metrics-wrap > .bg-media, .metrics-wrap > img.bg-media, .metrics-wrap > video, body.lm-dark .metrics-wrap > .bg-media { filter: none !important; opacity: 1 !important; }
.form-sec > .bg-media::after, .metrics-wrap .bg-veil, .form-sec .bg-veil { display: none !important; }
.glass-surface--svg, .glass-surface--svg .glass-surface__content { border: 0 !important; outline: 0 !important; }
.form-head.glass-surface--svg, .svc-form.glass-surface--svg, .metric-card.glass-surface--svg, .metrics-head.glass-surface--svg, .svc-hero-panel.glass-surface--svg, .logo-rail.glass-surface--svg { border: 0 !important; background-image: none !important; }

/* ==================== V8: CSS-Glas (performant) ==================== */
.glass-css { position: relative; background: rgba(12, 10, 8, 0.6) !important; backdrop-filter: blur(10px) saturate(1.15); -webkit-backdrop-filter: blur(10px) saturate(1.15); border: 1px solid rgba(255,255,255,0.08) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,0.12), 0 24px 60px rgba(0,0,0,0.28); }
.site-header.glass-css { position: fixed !important; background: rgba(12, 10, 8, 0.45) !important; border: 0 !important; border-bottom: 1px solid rgba(255,255,255,0.1) !important; box-shadow: none; }
.orbit-center.glass-css { position: absolute !important; }
.metric-card.glass-css, .form-head.glass-css, .svc-form.glass-css, .kontakt-headbox.glass-css, .kontakt-form-box.glass-css, .metrics-head.glass-css, .kt-inner.glass-css, .tt-copy.glass-css { background: rgba(12, 10, 8, 0.6) !important; }
.logo-rail.glass-css { background: rgba(12, 10, 8, 0.6) !important; }
/* Rondell: Stage darf nicht am Raster-Maximum hängen */
.ring-sec > .ring-stage { max-width: none !important; width: auto !important; }

/* Runde 36 */
.orbit-center .orbit-beam { display: none !important; }
#leistungen .fan-sticky { padding-top: clamp(130px, 17vh, 190px) !important; }
@media (max-width: 860px) { #leistungen .fan-sticky { padding-top: clamp(90px, 12vh, 130px) !important; } }

/* ==================== Runde 38 ==================== */
/* 1) Footer: Globus auf einer Höhe mit der Schlusszeile */
.footer-cols > .footer-big { grid-template-columns: minmax(0, 1fr) auto !important; grid-template-areas: 'line globe' 'meta globe' !important; align-items: center !important; column-gap: clamp(30px, 5vw, 80px); }
.footer-big > .footer-globe { justify-self: end; align-self: center; }
@media (max-width: 900px) { .footer-cols > .footer-big { grid-template-columns: 1fr !important; grid-template-areas: 'line' 'meta' 'globe' !important; } .footer-big > .footer-globe { justify-self: center; } }

/* 2) Übergänge dunkel → hell: Fade oben und unten an jeder Bildsektion */
.metrics-wrap { position: relative; }
.metrics-wrap::before, .metrics-wrap::after, .form-sec::before, .form-sec::after { content: ''; position: absolute; left: 0; right: 0; height: clamp(120px, 18vh, 240px); z-index: 2; pointer-events: none; }
.metrics-wrap::before, .form-sec::before { top: 0; background: linear-gradient(#1C1815, rgba(28,24,21,0)) !important; }
.metrics-wrap::after, .form-sec::after { bottom: 0; background: linear-gradient(rgba(28,24,21,0), #1C1815) !important; }
.metrics-wrap > *:not(.bg-media):not(video), .form-sec > *:not(.bg-media) { position: relative; z-index: 3; }

/* 3) Experience: Bild im natürlichen Seitenverhältnis, Zweit-CTA raus */
.xp-depth { aspect-ratio: auto !important; height: clamp(420px, 52vh, 560px) !important; }
.xp-depth .dc-img { background-size: cover !important; background-position: 50% 12% !important; }
.xp-ctas .btn-ghost { display: none !important; }

/* 4) Referenzen: Spacer oben und unten, Menü tiefer */
.ring-sec { margin-top: clamp(60px, 9vh, 120px); margin-bottom: clamp(60px, 9vh, 120px); }
.ring-sec > .ring-bar { margin-top: clamp(18px, 3vh, 34px) !important; padding-bottom: clamp(6px, 1.4vh, 18px); }

/* 5) Turnstile: Platzhalter-Key blendet das Widget aus (verhindert den blauen Troubleshoot-Link) */
.cf-turnstile[data-sitekey="TURNSTILE_SITE_KEY"] { display: none !important; }

/* Kontakt/Abschluss: Fade oben und unten wie bei den anderen Bildsektionen */
.kontakt-section::before, .kontakt-section::after { content: ''; position: absolute; left: 0; right: 0; height: clamp(120px, 18vh, 240px); z-index: 2; pointer-events: none; }
.kontakt-section::before { top: 0; background: linear-gradient(#1C1815, rgba(28,24,21,0)); }
.kontakt-section::after { bottom: 0; background: linear-gradient(rgba(28,24,21,0), #1C1815); }
.kontakt-section > *:not(.bg-media):not(video) { position: relative; z-index: 3; }

/* ==================== Runde 39 ==================== */
/* Alle Sektionstitel einheitlich — Referenz: Startseite 02 „Ein Dienstleister." */
.h-display, .h-xl, .h-lg, .svc-head h2, .section h2, .testi-sec h2, .form-sec h2, .kontakt-section h2, .ring-title, .matrix-sec h2, .xp-copy h2 { font-size: clamp(32px, 3.85vw, 56px) !important; line-height: 1.2 !important; }

.ring-sec.is-live > .ring-intro .ring-title { font-size: clamp(32px, 3.85vw, 56px) !important; }
/* 2) Experience-Portrait: echtes <img> mit object-fit — kein Hintergrundbild, nicht verzerrt */
.xp-depth .dc-photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; display: block; will-change: transform; }
.xp-depth .dc-img { display: none !important; }
.xp-media .xp-a11y { display: none; }
/* 3) Kompetenz-Matrix: GPU-freundlich, keine Layout-Reads pro Frame */
#lm-cubes { contain: layout paint; }

/* Würfel: Intro-Transition endet mit dem Intro, Hover reagiert sofort */
#lm-cubes .cube, #lm-cubes.is-arranged .cube, #lm-cubes.intro-done .cube { transition: transform 0.26s cubic-bezier(0.22,1,0.36,1) !important; will-change: transform !important; }
#lm-cubes.is-pre .cube { transition: none !important; }
#lm-cubes.is-arranged.is-intro .cube { transition: transform 1.15s cubic-bezier(0.16,1,0.3,1) var(--fly-delay, 0s), opacity 0.55s ease var(--fly-delay, 0s) !important; }
/* Sektionstitel: eine Größe — auch die Insights-Überschriften */
.h-display, .h-xl, .h-lg, .h-md, .svc-head h2, .section h2, .testi-sec h2, .form-sec h2, .kontakt-section h2, .ring-title, .matrix-sec h2, .xp-copy h2, .insights-section h2 { font-size: clamp(32px, 3.85vw, 56px) !important; line-height: 1.2 !important; }

/* Abschluss + Anfrage: Ausrichtung am Block selbst — wirkt in beiden Glas-Modi */
.kontakt-section .kontakt-headbox, .form-sec .form-head { text-align: center; }
.kontakt-section .kontakt-headbox > *, .kontakt-section .kontakt-headbox .glass-surface__content > *, .form-sec .form-head > *, .form-sec .form-head .glass-surface__content > * { margin-left: auto !important; margin-right: auto !important; }
.kontakt-section .kontakt-headbox h2, .form-sec .form-head h2 { text-align: center; }
.kontakt-section .kontakt-headbox .lead, .form-sec .form-head .lead { max-width: 620px; }
.kontakt-section .kontakt-headbox .eyebrow, .form-sec .form-head .eyebrow { text-align: center; }

/* ==================== MOBIL-ÜBERARBEITUNG ==================== */
@media (max-width: 900px) {
  /* Header: läuft mit, Schriftzug sichtbar, Burger orange */
  .site-header { position: fixed !important; top: 0; left: 0; right: 0; z-index: 200; }
  .site-header .inner { padding: 10px clamp(14px, 4vw, 22px); gap: 10px; }
  .site-header .brand span { display: inline !important; font-size: 12px; letter-spacing: 0.12em; white-space: nowrap; }
  .site-header .brand-logo { width: 26px; height: 26px; }
  .site-header .header-cta { display: none; }
  .nav-burger { display: flex !important; flex-direction: column; justify-content: center; gap: 5px; width: 42px; height: 42px; border-radius: 12px; border: 1px solid rgba(252,106,11,0.5); background: rgba(252,106,11,0.12); }
  .nav-burger span { display: block; width: 20px; height: 2px; margin: 0 auto; background: var(--c-orange); border-radius: 2px; transition: transform 0.25s ease, opacity 0.2s ease; }
  body.nav-open .nav-burger span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  body.nav-open .nav-burger span:nth-child(2) { opacity: 0; }
  body.nav-open .nav-burger span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .sheet-close { position: absolute; top: 18px; right: 18px; width: 46px; height: 46px; border-radius: 14px; border: 1px solid rgba(252,106,11,0.55); background: rgba(252,106,11,0.14); display: flex; align-items: center; justify-content: center; z-index: 5; }
  .sheet-close span { position: absolute; width: 22px; height: 2px; background: var(--c-orange); border-radius: 2px; }
  .sheet-close span:first-child { transform: rotate(45deg); }
  .sheet-close span:last-child { transform: rotate(-45deg); }
  .nav-sheet { padding-top: 84px; }
  .lang-switch { gap: 4px !important; }
  .lang-switch button, .lang-switch a { padding: 4px 6px !important; }

  /* Titel: höchstens drei Zeilen */
  .h-display, .h-xl, .h-lg, .h-md, .section h2, .svc-head h2, .ring-title, .matrix-sec h2, .xp-copy h2, .insights-section h2, .testi-sec h2, .form-sec h2, .kontakt-section h2 { font-size: clamp(24px, 7.4vw, 34px) !important; line-height: 1.22 !important; }
  .hero-panel h1, .svc-hero h1 { font-size: clamp(26px, 8.2vw, 38px) !important; line-height: 1.16 !important; }
  .footer-big .line { font-size: clamp(28px, 9vw, 44px) !important; }
  .marquee-item .word { font-size: clamp(34px, 12vw, 60px) !important; }

  /* Hero: Panel mit Rand, Logo-Leiste darunter horizontal */
  .hero, .svc-hero { min-height: 100svh; padding-left: clamp(14px, 4vw, 22px) !important; padding-right: clamp(14px, 4vw, 22px) !important; padding-top: 74px; align-items: center !important; }
  .hero-panel, .svc-hero-panel { position: relative !important; width: 100% !important; max-width: none !important; margin: 0 auto !important; inset: auto !important; }
  .logo-rail { display: flex !important; flex-direction: column; position: relative !important; right: auto !important; top: auto !important; transform: none !important; width: 100% !important; height: 74px !important; margin-top: 14px; border-radius: 16px; }
  .logo-rail .track { display: flex !important; flex-direction: row !important; align-items: center; gap: 26px; height: 100%; width: max-content; animation: lmBandSlide 34s linear infinite; }
  .logo-rail .logo-item { flex: 0 0 auto; width: 84px; height: 34px; }
  .logo-rail .logo-item img { width: 78px; height: 30px; object-fit: contain; }
  .logo-rail .fade-top, .logo-rail .fade-bottom { display: none !important; }

  /* 02 Lösung: Rondell volle Breite, Logo groß */
  .system-inner { grid-template-columns: 1fr !important; }
  .orbit-outer { width: 100% !important; aspect-ratio: 1 / 1 !important; padding-top: clamp(80px, 16vh, 120px); }
  .orbit-center.glass-css, .orbit-center.glass-surface { padding: 14px 18px !important; }
  .orbit-center img { width: clamp(72px, 20vw, 104px) !important; }
  .orbit-center .wm { font-size: 11px !important; }

  /* 04 Kompetenzwelten: gestapelt, Flip per Klick, CTA auf der Rückseite */
  .fan-track { height: auto !important; }
  .fan-sticky { position: static !important; min-height: 0 !important; padding-top: clamp(70px, 12vh, 100px) !important; }
  #lm-fan { display: flex !important; flex-direction: column; gap: 14px; height: auto !important; width: 100% !important; }
  #lm-fan-scale { transform: none !important; width: 100% !important; height: auto !important; }
  .fan-card { position: relative !important; left: auto !important; top: auto !important; width: 100% !important; height: auto !important; aspect-ratio: 3 / 4; transform: none !important; }
  .fan-card .flip { height: 100%; }
  .fan-cta { display: inline-flex !important; }
  .matrix-sec .mono-hint, .fan-sticky .mono-hint { font-size: 10px; }

  /* Kompetenz-Matrix: volle Breite */
  .matrix-sec { padding-left: 0 !important; padding-right: 0 !important; }
  #lm-cubes-scale { width: 100vw !important; max-width: 100vw !important; overflow: hidden; }
  #lm-cubes { grid-template-columns: repeat(7, 11.6vw) !important; gap: 2.2vw !important; transform: none !important; }
  .cube-slot, #lm-cubes .cube { width: 11.6vw !important; height: 11.6vw !important; }
  #lm-cubes .cube .face { transform-style: flat; }
  #lm-cubes .cube .f-f { transform: translateZ(5.8vw) !important; }
  #lm-cubes .cube .f-b { transform: rotateY(180deg) translateZ(5.8vw) !important; }
  #lm-cubes .cube .f-r { transform: rotateY(90deg) translateZ(5.8vw) !important; }
  #lm-cubes .cube .f-l { transform: rotateY(-90deg) translateZ(5.8vw) !important; }
  #lm-cubes .cube .f-t { transform: rotateX(90deg) translateZ(5.8vw) !important; }
  #lm-cubes .cube .f-bo { transform: rotateX(-90deg) translateZ(5.8vw) !important; }

  /* Referenzen: Vollbild, Titel oben, Menü unten, Rondell groß */
  .ring-sec { height: 100svh !important; min-height: 100svh !important; max-height: none !important; display: grid !important; grid-template-rows: auto 1fr auto !important; padding: 84px 0 18px !important; }
  .ring-sec > .ring-intro { padding: 0 clamp(14px, 4vw, 22px); }
  .ring-sec > .ring-stage { min-height: 0 !important; }
  .ring-sec > .ring-bar { padding: 0 clamp(14px, 4vw, 22px); }
  .ring-controls { justify-content: center; width: 100%; }
  .ring-nav { margin-left: 0 !important; }

  /* Zahlen & Fakten: immer zwei Kacheln je Zeile */
  .metrics-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
  .metric-card { padding: 16px 14px !important; }
  .metric-card .value { font-size: clamp(26px, 9vw, 40px) !important; }
  .metric-card .label { font-size: 10px !important; }

  /* Insights: ein Beitrag mit Pfeilen */
  .insights-grid { grid-template-columns: 1fr !important; }
  .ins-nav { display: flex !important; align-items: center; justify-content: center; gap: 14px; margin-top: 18px; }

  /* Fortschritt schmaler */
  .progress-rail { width: 4px; }
  .progress-rail .bar { width: 4px; }
}

/* Insights: Desktop maximal zwei Vierer-Reihen, Pfeile nur mobil */
@media (min-width: 701px) {
  .insights-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
  .ins-nav { display: none !important; }
}
.ins-nav { display: none; }
.ins-nav button { width: 46px; height: 46px; border-radius: 999px; border: 0; background: var(--c-orange); color: #FAF7F2; font-size: 22px; line-height: 1; cursor: pointer; box-shadow: 0 10px 26px rgba(252,106,11,0.32); }
.ins-nav .ins-count { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.2em; color: var(--c-muted); min-width: 56px; text-align: center; }
body.lm-dark .ins-nav .ins-count { color: #B2A69B; }

/* Mobil: Ladelast senken — schwere Effekte aus */
@media (max-width: 900px) {
  .lm-aura, #lm-spark, .orb-glow { display: none !important; }
  .ring-lines, .hero-rays { display: none !important; }
  .glass-css { backdrop-filter: blur(6px) !important; -webkit-backdrop-filter: blur(6px) !important; }
}

/* Sprachumschalter: Flaggen dichter beieinander */
.lang-switch { gap: 3px !important; }
.lang-switch button { padding: 3px 4px !important; line-height: 0; }
@media (max-width: 900px) { .lang-switch button svg { width: 18px; height: 12px; } }

/* Marken-Band: horizontaler Durchlauf (Track enthält die Logos doppelt) */
@keyframes lmBandSlide { to { transform: translateX(-50%); } }