/*
Theme Name: imt Veranstaltungstechnik
Theme URI: https://imt-vt.de
Author: Florian Hierholzer Design
Description: Custom Onepager-Theme fuer imt Veranstaltungstechnik GmbH. Dunkel, editorial, mit isometrischen Bau-Animationen. Fotos, Hero-Video und Showreel sind ueber den Customizer (Design > Customizer > imt Medien) austauschbar.
Version: 1.4.2
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
Text Domain: imt
*/

/* =========================================================
   imt Veranstaltungstechnik – Relaunch Onepager
   Konzept: "Technical Editorial" – dunkel, kinematisch,
   Signal-Amber, Blueprint-Textur, Mono-Fachlabels.
   Texte = echte imt-Inhalte. Bilder/Zahlen/Zitate = Platzhalter.
   Self-contained. Alle Tokens über CSS-Variablen.
   ========================================================= */
:root{
  --bg:#161616;             /* Canvas – exakt aus imt-Figma-Export */
  --bg-2:#1C1C1E;
  --surface:#202023;
  --surface-2:#28282C;
  --line:#2E2E34;
  --line-2:#3C3C44;
  --text:#F1F1F1;           /* Figma light */
  --muted:#8C8C93;          /* Figma #888888-Familie */
  --muted-2:#5E5E66;
  --accent:#F08223;         /* imt-Orange – exakt aus Figma-Export */
  --accent-2:#F9B27A;
  --accent-soft:rgba(240,130,35,.12);
  --radius:0px;
  --maxw:none;
  --gutter:clamp(20px,5vw,72px);
  --ff-display:'IBM Plex Sans',system-ui,sans-serif;
  --ff-body:'IBM Plex Sans',system-ui,sans-serif;
  --ff-mono:'IBM Plex Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.22,1,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0;font-weight:400!important}
html{scroll-behavior:smooth}
body{
  background:var(--bg);color:var(--text);
  font-family:var(--ff-body);font-size:16px;line-height:1.62;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;position:relative;
}
/* Sehr dezente Vignette – kein Raster */
body::before{
  content:"";position:fixed;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(120% 90% at 50% -10%,rgba(240,130,35,.04),transparent 60%);
}
/* Grain */
body::after{
  content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.14;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.35'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}
main,header,footer{position:relative;z-index:1}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.cover{width:100%;height:100%;object-fit:cover}
.container{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}

/* Fach-/Mono-Labels */
.eyebrow{
  font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.22em;
  text-transform:uppercase;color:var(--accent);font-weight:500;
  display:inline-flex;align-items:center;gap:12px;
}
.eyebrow::before{content:"";width:28px;height:1px;background:var(--accent);display:inline-block}
h1,h2,h3,h4{font-family:var(--ff-display);font-weight:400;line-height:1.0;letter-spacing:normal}
.section{padding-block:clamp(80px,9vw,150px);position:relative}
.section-head{max-width:760px;margin-bottom:clamp(40px,6vw,76px)}
.section-head h2{font-size:clamp(2.4rem,6vw,5.2rem);margin:0;line-height:1.12;white-space:nowrap}
.section-head p{color:var(--muted);font-size:1.22rem;margin-top:20px;max-width:none;white-space:nowrap}
.divider{border-top:0}

/* Buttons */
.btn{
  display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-mono);
  font-weight:500;font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;
  padding:15px 26px;border-radius:0;border:1px solid transparent;
  transition:.3s var(--ease);cursor:pointer;position:relative;overflow:hidden;
}
.btn-primary{background:var(--accent);color:#1a1204;box-shadow:0 0 0 rgba(240,130,35,0)}
.btn-primary:hover{filter:brightness(1.06)}
.btn-ghost{border:0;padding:0;overflow:visible;color:var(--text);font-family:var(--ff-mono);font-size:.76rem;letter-spacing:.16em;text-transform:uppercase}
.btn-ghost:hover{color:var(--accent)}
.btn:active{transform:scale(.97)}
.btn svg{width:15px;height:15px;transition:transform .3s var(--ease)}
.btn:hover svg{transform:translateX(4px)}

/* Scroll-Progress */
#progress{position:fixed;top:0;left:0;height:2px;width:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));z-index:80;transition:width .1s linear}

/* Nav */
header.nav{position:fixed;inset:0 0 auto 0;z-index:60;background:transparent;border-bottom:1px solid transparent;transition:.35s var(--ease)}
header.nav.scrolled{background:rgba(32,32,36,.92);backdrop-filter:blur(14px) saturate(1.1);border-bottom-color:var(--line)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;height:76px}
.logo{font-family:var(--ff-display);font-weight:700;font-size:1.55rem;letter-spacing:-.03em;display:flex;align-items:baseline;gap:9px}
.logo b{color:var(--accent)}
.logo span{font-family:var(--ff-mono);font-size:.56rem;letter-spacing:.22em;color:var(--muted);text-transform:uppercase;font-weight:400}
/* Echtes imt-Logo (SVG) – Dark-Mode-Fills */
.logo-svg{height:40px;width:auto;display:block}
.logo-svg .cls-1{fill:#F1F1F1}
.logo-svg .cls-2{fill:#C9C9CE}
.logo-svg .cls-3{fill:var(--accent)}
footer .logo-svg{height:42px}
.nav-links{display:flex;align-items:center;gap:34px}
.nav-links a{font-family:var(--ff-mono);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);transition:.2s;position:relative}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-6px;height:1px;width:0;background:var(--accent);transition:width .3s var(--ease)}
.nav-links a:hover{color:var(--text)}
.nav-links a:hover::after{width:100%}
.nav-cta{display:flex;align-items:center;gap:16px}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:8px}
.burger span{width:24px;height:2px;background:var(--text);transition:.3s}

/* Hero */
.hero{position:sticky;top:0;z-index:0;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden}
main>section:not(#top){position:relative;z-index:2;background:var(--bg)}
/* Sprungmarken: Überschrift landet mit festem Abstand unter der Navi */
:root{--navH:77px;--padT:clamp(80px,9vw,150px);--jumpGap:clamp(28px,3.5vw,48px)}
@media(max-width:960px){:root{--navH:67px}}
@media(max-width:560px){:root{--padT:clamp(52px,13vw,84px)}}
section[id]{scroll-margin-top:calc(var(--navH) + var(--jumpGap) - var(--padT))}
.hero video,.hero .hero-fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero .hero-fallback{background-position:center;background-size:cover;background-repeat:no-repeat}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(9,9,11,.5) 0%,rgba(9,9,11,.15) 38%,rgba(9,9,11,.96) 100%)}
.hero-content{position:relative;z-index:2;width:100%;padding-block:clamp(52px,8vw,104px)}
.hero h1{font-size:clamp(2.5rem,6vw,5.4rem);max-width:18ch;margin:26px 0 0;letter-spacing:-.02em;line-height:.98}
.hero h1 em{font-style:normal;color:var(--accent)}
.hero-sub{color:var(--muted);font-size:clamp(1.15rem,1.9vw,1.55rem);max-width:64ch;margin-top:30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:40px}
/* Hero-Meta (technische Ecke) */
.hero-meta{position:absolute;top:104px;right:var(--gutter);z-index:2;font-family:var(--ff-mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted-2);text-align:right;line-height:2;display:grid}
.hero-meta b{color:var(--muted);font-weight:400}
.hero-scroll{position:absolute;bottom:30px;right:var(--gutter);z-index:2;color:var(--muted-2);font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;writing-mode:vertical-rl;display:flex;align-items:center;gap:14px}
.hero-scroll::after{content:"";width:1px;height:46px;background:linear-gradient(var(--accent),transparent);animation:scrollpulse 2s var(--ease) infinite}
@keyframes scrollpulse{0%,100%{opacity:.3;transform:scaleY(.7)}50%{opacity:1;transform:scaleY(1)}}
/* Staggered Load */
.load{opacity:0;transform:translateY(26px);animation:rise .9s var(--ease) forwards}
.load.d1{animation-delay:.05s}.load.d2{animation-delay:.16s}.load.d3{animation-delay:.28s}.load.d4{animation-delay:.4s}
@keyframes rise{to{opacity:1;transform:none}}
/* Preloader (RPA-inspiriert · fail-safe: nur mit JS sichtbar) */
#preloader{display:none}
.js #preloader{display:flex;position:fixed;inset:0;z-index:100;background:var(--bg);flex-direction:column;align-items:center;justify-content:center;gap:20px;transition:opacity .7s var(--ease)}
#preloader.done{opacity:0;pointer-events:none}
#preloader .pl-logo{font-family:var(--ff-display);font-weight:700;font-size:clamp(3rem,10vw,6rem);letter-spacing:-.04em}
#preloader .pl-logo b{color:var(--accent)}
#preloader .pl-bar{width:min(260px,60vw);height:2px;background:var(--line);overflow:hidden}
#preloader .pl-bar i{display:block;height:100%;width:0;background:linear-gradient(90deg,#3A3A40,var(--accent));transition:width .1s linear}
#preloader .pl-count{font-family:var(--ff-mono);font-size:.74rem;letter-spacing:.2em;color:var(--muted)}
/* Hero-Wortrotator (RPA "Vamos con…") */
.rotator{display:inline-block;color:var(--accent);font-style:normal;transition:opacity .35s var(--ease),transform .35s var(--ease)}
.rotator.swap{opacity:0;transform:translateY(-12px)}

/* Value Trio */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(28px,4vw,80px)}
.trio .cell{padding:0}
.trio .cell:hover .num{color:var(--accent-2)}
.trio .num{font-family:var(--ff-mono);color:var(--accent);font-size:.76rem;letter-spacing:.14em}
.trio h3{font-size:1.55rem;margin:22px 0 12px}
.trio p{color:var(--muted);font-size:.98rem}

/* Stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,4vw,64px);border-block:1px solid var(--line);padding-inline:var(--gutter)}
.stat{padding:clamp(44px,5vw,76px) 0}
.stat .val{font-family:var(--ff-display);font-weight:400;font-size:clamp(2.8rem,5.2vw,4.4rem);line-height:1;letter-spacing:-.04em}
.stat .val span{font-family:var(--ff-mono);font-size:.32em;color:var(--accent);vertical-align:super;letter-spacing:0}
.stat .lbl{color:var(--text);margin-top:16px;font-size:.96rem;font-weight:600}
.stat .desc{color:var(--muted-2);margin-top:6px;font-size:.82rem;max-width:24ch}

/* Vision */
.vision{display:grid;grid-template-columns:minmax(0,560px) minmax(0,440px);gap:clamp(40px,6vw,88px);justify-content:start;align-items:center}
.vision .lead{font-family:var(--ff-display);font-size:clamp(1.3rem,2.1vw,1.9rem);font-weight:400;line-height:1.2;letter-spacing:normal}
.vision .lead b{color:var(--accent);font-weight:600}
.vision .lead{max-width:24ch}
.vision .body{color:var(--muted);margin-top:26px;max-width:48ch}
.vision-media{aspect-ratio:4/3;background:var(--surface);position:relative;overflow:hidden}
.vision-media::after{content:"IMG · 4:5";position:absolute;left:14px;bottom:12px;font-family:var(--ff-mono);font-size:.6rem;letter-spacing:.14em;color:rgba(255,255,255,.7);z-index:2;mix-blend-mode:difference}

/* Isometrische Event-Räume – graue Kuben, orange akzentuiert, bauen sich beim Scrollen auf */
.iso-wrap{position:relative;transform-style:preserve-3d;transition:transform .4s var(--ease);will-change:transform}
.iso{display:block;width:100%;height:auto;overflow:visible}
.iso polygon{stroke:#131317;stroke-width:.6;stroke-linejoin:round}
.iso .cube{opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease),transform .6s cubic-bezier(.2,.75,.2,1);transform-box:fill-box}
.iso.built .cube{opacity:1;transform:none}
.hero-iso{position:absolute;z-index:2;right:clamp(-24px,1vw,32px);bottom:clamp(48px,11vh,130px);width:min(50vw,620px);pointer-events:none}
.hero-iso::before{content:"";position:absolute;inset:-10% -8%;background:radial-gradient(closest-side,rgba(240,130,35,.13),transparent 72%);filter:blur(12px);z-index:-1}
.vision-media.has-iso{background:transparent}
.vision-media.has-iso::after{display:none}
.vision-media .iso-wrap{position:relative;width:100%;max-width:clamp(300px,32vw,410px);margin:0;display:block}
.vision-media.has-iso{aspect-ratio:auto;overflow:visible}
@media(max-width:960px){.hero-iso{display:none}}
@media(prefers-reduced-motion:reduce){.iso .cube{opacity:1;transform:none;transition:none}.iso-wrap{transition:none}}

/* Showreel-Band (RPA "Showreel") */
.showreel{position:relative;min-height:clamp(440px,64vw,780px);display:flex;align-items:center;justify-content:center;overflow:hidden}
.showreel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:grayscale(.35) brightness(.62)}
.showreel::after{content:"";position:absolute;inset:0;background:radial-gradient(65% 65% at 50% 50%,rgba(9,9,11,.28),rgba(9,9,11,.78))}
.showreel .sr-inner{position:relative;z-index:2;text-align:center;padding:24px}
.showreel .eyebrow{justify-content:center;margin-bottom:16px}
.showreel .sr-play{width:88px;height:88px;border:1px solid rgba(255,255,255,.42);display:flex;align-items:center;justify-content:center;margin:0 auto 24px;background:rgba(255,255,255,.06);backdrop-filter:blur(4px);transition:.3s var(--ease)}
.showreel .sr-play svg{width:26px;height:26px;color:#fff;margin-left:4px;transition:.3s var(--ease)}
.showreel .sr-play:hover{background:var(--accent);border-color:var(--accent)}
.showreel .sr-play:hover svg{color:#1a1204}
.showreel h2{font-size:clamp(1.9rem,5vw,3.4rem)}

/* Leistungen */
.service{position:relative;display:grid;grid-template-columns:minmax(0,600px) minmax(0,400px);gap:clamp(40px,6vw,96px);justify-content:start;align-items:center;padding-block:clamp(66px,8vw,128px)}
.service::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:100vw;height:1px;background:var(--line)}
.service:first-of-type::before{display:block}
.service:last-of-type{padding-bottom:0}
.service .service-content{min-width:0}
.service .idx{display:none}
.service h3{font-size:clamp(2.2rem,5vw,4.2rem);margin:0 0 clamp(16px,2vw,28px)}
.service p{color:var(--muted);max-width:52ch}
.service ul{list-style:none;margin-top:24px;display:block}
.service ul li{display:inline;font-family:var(--ff-display);font-size:clamp(.85rem,1.05vw,1.05rem);color:var(--accent);line-height:1.6;letter-spacing:normal}
.service ul li:not(:last-child)::after{content:", ";color:var(--accent)}
.service-content{position:relative;z-index:1}
.svc-kicker{display:block;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--accent);margin-bottom:clamp(14px,1.6vw,22px)}
.svc-ghost{display:block;font-family:var(--ff-mono);font-size:clamp(1.4rem,1.9vw,2rem);color:var(--accent);letter-spacing:.06em;line-height:1;margin-bottom:clamp(16px,2vw,28px)}
.service-iso{position:relative;z-index:1;width:100%;max-width:400px;margin-inline:0}
.service-iso::before{display:none}
.service-iso:has(.iso.built)::before{opacity:1}
/* Einheitliches Layout: Text links, Grafik rechts (kein Zickzack) */
@media(max-width:860px){.service,.service:nth-of-type(even){grid-template-columns:1fr}.service-iso,.service:nth-of-type(even) .service-iso{order:2;max-width:440px;margin-inline:auto;margin-top:clamp(28px,7vw,52px)}.service-content,.service:nth-of-type(even) .service-content{order:1}.vision-media{margin-top:clamp(28px,7vw,52px)}}

/* Event-Typen */
.events-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:2px}
.event-cell{position:relative;aspect-ratio:1/.9;background:var(--surface);display:flex;align-items:flex-end;padding:28px;overflow:hidden}
.event-cell img{position:absolute;inset:0;transition:transform .6s var(--ease);filter:grayscale(.3)}
.event-cell .lbl{position:relative;z-index:2;font-family:var(--ff-display);font-weight:700;font-size:1.2rem}
.event-cell .tag{position:absolute;top:16px;left:16px;z-index:2;font-family:var(--ff-mono);font-size:.6rem;letter-spacing:.14em;color:var(--accent-2);opacity:.85}
.event-cell::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(0deg,rgba(9,9,11,.9),rgba(9,9,11,.12) 72%)}
.event-cell:hover img{filter:grayscale(0)}
.event-cell:hover .lbl{color:var(--accent)}

/* Prozess */
.process{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(24px,3vw,56px)}
.step{padding:26px 0 0;position:relative}
.step:hover{background:transparent}
.step .n{font-family:var(--ff-mono);font-size:2.4rem;font-weight:600;color:var(--surface-2);line-height:1}
.step:hover .n{color:var(--accent)}
.step h4{font-family:var(--ff-display);font-size:1.25rem;margin:20px 0 12px}
.step p{color:var(--muted);font-size:.9rem}
.step::before{content:"";position:absolute;top:0;left:0;width:38px;height:2px;background:var(--accent)}

/* Galerie */
.gallery{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(240px,22vw,340px);gap:2px;background:var(--bg);overflow:hidden}
.gallery figure{position:relative;overflow:hidden}
.gallery img{transition:transform .7s var(--ease)}
.gallery figure:hover img{transform:none}
.g-wide{grid-column:auto}
.g-tall{grid-row:auto}
/* Projekt-Overlay (Volt-inspiriert) */
.gallery figure::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(9,9,11,.86),transparent 62%);opacity:.7;transition:opacity .4s var(--ease)}
.gallery figure:hover::after{opacity:1}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:20px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;transform:translateY(6px);opacity:.92;transition:.4s var(--ease)}
.gallery figure:hover figcaption{transform:none;opacity:1}
.gallery figcaption .pname{display:block;font-family:var(--ff-display);font-size:1.15rem;line-height:1.15}
.gallery figcaption .ptype{display:block;font-family:var(--ff-mono);font-size:.68rem;letter-spacing:.12em;color:var(--muted);margin-top:7px}
.gallery figcaption .pyear{font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.08em;color:var(--accent);flex:none}
.g-wide figcaption .pname,.g-tall figcaption .pname{font-size:1.4rem}

/* Fuhrpark / Equipment (Volt "Gear") */
.gear{border-top:1px solid var(--line)}
.gear-row{display:grid;grid-template-columns:64px 1.4fr 1fr auto;align-items:center;gap:20px;padding:22px clamp(20px,3vw,32px);border-top:1px solid var(--line);transition:.3s var(--ease)}
.gear-row:first-child{border-top:0}
.gear-row:hover{background:var(--surface)}
.gear-row .gnum{font-family:var(--ff-mono);font-size:.8rem;color:var(--muted-2)}
.gear-row:hover .gnum{color:var(--accent)}
.gear-row .gname{font-family:var(--ff-display);font-weight:400;font-size:clamp(1.15rem,2vw,1.5rem)}
.gear-row .gcat{font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.gear-row .gtag{font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.1em;color:var(--muted-2);border:1px solid var(--line-2);border-radius:0;padding:6px 12px;white-space:nowrap}
.gear-foot{display:flex;justify-content:flex-end;margin-top:26px}

/* Logo-Marquee */
.marquee{overflow:hidden;border-block:1px solid var(--line);-webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;width:max-content;animation:scroll 34s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee .logo-cell{flex:none;width:200px;height:104px;display:flex;align-items:center;justify-content:center;color:var(--muted-2);font-family:var(--ff-mono);font-size:.82rem;letter-spacing:.1em;border-right:1px solid var(--line);transition:.25s}
.marquee .logo-cell:hover{color:var(--text)}
@keyframes scroll{to{transform:translateX(-50%)}}

/* Testimonials */
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(32px,4.5vw,72px)}
.quote{padding:clamp(26px,2.4vw,38px) 0 0;border-top:1px solid var(--line);display:flex;flex-direction:column;transition:.3s var(--ease)}
.quote:hover{border-top-color:var(--line-2)}
.quote .mark{font-family:var(--ff-display);color:var(--accent);font-size:3rem;line-height:.5}
.quote p{color:var(--text);margin:26px 0 auto;font-family:var(--ff-display);font-size:clamp(1.1rem,1.5vw,1.4rem);line-height:1.5;letter-spacing:normal}
.quote .who{margin-top:32px;display:flex;align-items:center;gap:14px}
.quote .who .av{display:none}
.quote .who b{font-family:var(--ff-display);font-size:.98rem;display:block}
.quote .who small{color:var(--muted);font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.04em}

/* Kontakt */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,76px);align-items:center}
.contact h2{font-size:clamp(2.1rem,4.6vw,3.6rem)}
.contact-lead{max-width:1060px}
.contact-lead h2{font-size:clamp(2.4rem,5.2vw,4.2rem)}
.contact-main{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(40px,6vw,90px);align-items:start;margin-top:clamp(44px,6vw,84px)}
.contact-meta{display:flex;flex-direction:column;gap:clamp(16px,1.8vw,26px)}
.mrow .k{display:block;color:var(--muted-2);font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase}
.mrow .v{display:block;font-family:var(--ff-display);font-size:1.05rem;margin-top:7px;line-height:1.45;color:var(--text)}
.mrow .v a:hover{color:var(--accent)}
.contact-depts{display:flex;flex-direction:column;gap:clamp(16px,1.8vw,26px);margin-top:clamp(2px,.6vw,10px)}
@media(max-width:860px){.contact-main{grid-template-columns:1fr}}
@media(max-width:520px){.contact-depts{grid-template-columns:1fr}}
.contact-cards{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,44px)}
.ccard{padding:0}
.ccard .k{color:var(--muted-2);font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase}
.ccard .v{font-family:var(--ff-display);font-weight:600;font-size:1.08rem;margin-top:12px;word-break:break-word}
.ccard .v a:hover{color:var(--accent)}
.ccard.full{grid-column:span 2}
.contact-links{display:flex;flex-direction:column;gap:10px}
.contact-link{font-family:var(--ff-display);font-size:clamp(1.6rem,3.2vw,2.6rem);line-height:1.1;color:var(--text);width:fit-content;transition:.2s var(--ease)}
.contact-link:hover{color:var(--accent)}
/* Abteilungs-Kontaktraster (Volt "General Info") */
.deptgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,48px);margin-top:24px}
.dept{padding:0}
.dept:hover{background:transparent}
.dept .k{color:var(--muted-2);font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.14em;text-transform:uppercase}
.dept a,.dept .v{display:block;margin-top:12px;font-family:var(--ff-display);font-weight:600;font-size:1rem;word-break:break-word}
.dept a:hover{color:var(--accent)}
.contact-loc{display:flex;align-items:flex-start;gap:18px;margin-top:8px}
.contact-loc svg{width:18px;height:18px;color:var(--accent);flex:none;margin-top:2px}

/* CTA band */
.cta-band{position:relative;padding:clamp(44px,6vw,80px) 0;text-align:center}
.cta-band::before{display:none}
.cta-band h2{font-size:clamp(2rem,4.4vw,3.2rem);max-width:20ch;margin:16px auto 0}
.cta-band p{color:var(--muted);margin:20px auto 0;max-width:52ch}
.cta-band .btn{margin-top:36px}

/* Referenz-Filter (Volt "Projects") */
.filter{display:flex;flex-wrap:wrap;gap:clamp(18px,2.4vw,34px);margin:-4px 0 clamp(34px,5vw,60px)}
.filter button{font-family:var(--ff-mono);font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:none;border:0;padding:4px 0;cursor:pointer;transition:.2s var(--ease);position:relative}
.filter button:hover{color:var(--text)}
.filter button.active{color:var(--accent)}
.gallery figure.hide{display:none}

/* Überdimensionale Wortmarke (Volt-Signature) */
.wordmark-band{position:relative;padding:clamp(22px,2.6vw,46px) 0 0}
.wordmark-band::before{display:none}
.wm{position:relative;font-family:var(--ff-display);font-weight:700;font-size:clamp(6rem,26vw,20rem);line-height:.8;letter-spacing:-.05em;background:linear-gradient(180deg,#fff,#c9c9d2);-webkit-background-clip:text;background-clip:text;color:transparent}
.wm b{color:var(--accent);-webkit-text-fill-color:var(--accent)}
.wm-logo{position:relative;height:clamp(82px,14vw,212px);width:auto;max-width:100%;display:block;margin-bottom:0;will-change:transform}
/* Wortmarke monochrom */
.wm-logo .cls-1,.wm-logo .cls-2,.wm-logo .cls-3{fill:#2B2B30}
.wm-tag{position:relative;font-family:var(--ff-mono);font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-top:18px;max-width:44ch}

/* Footer */
footer{border-top:1px solid var(--line);padding-block:34px 40px;background:var(--bg-2)}
.foot-top{display:flex;justify-content:space-between;gap:40px;flex-wrap:wrap;align-items:stretch}
.foot-intro{display:flex;flex-direction:column}
.copyr{display:block;margin-top:auto;padding-top:36px;color:var(--muted-2);font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.04em}
.foot-top p{color:var(--muted);max-width:62ch;margin-top:0;font-size:.92rem}
.foot-nav{display:flex;gap:64px;flex-wrap:wrap}
.foot-col h5{font-family:var(--ff-mono);font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted-2);margin-bottom:18px}
.foot-col a{display:block;color:var(--muted);font-size:.92rem;padding:5px 0;transition:.2s}
.foot-col a:hover{color:var(--accent)}
.foot-bottom{margin-top:24px;padding-top:0;border:0;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;color:var(--muted-2);font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.04em}

/* Reveal – nur versteckt wenn JS aktiv ist (Fail-Safe: ohne JS alles sichtbar) */
.js [data-reveal]{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.js [data-reveal].in{opacity:1;transform:none}
/* Staggered Reveal (Grid-Kinder nacheinander) */
.js [data-stagger]>*{opacity:0;transform:translateY(22px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js [data-stagger]>*.in{opacity:1;transform:none}
/* Parallax */
[data-parallax]{will-change:transform}
.hero-content{will-change:transform,opacity}
/* Eyebrows ausgeblendet (auf Wunsch) */
.eyebrow{display:none!important}
.service .idx{display:none!important}
.hero-meta{display:none!important}
.hero .hero-actions{display:none!important}
.hero-scroll{display:none!important}
/* Typo-Zoom (scroll-getrieben) */
[data-zoom]{will-change:transform}
.keyword-band{position:relative;padding-block:clamp(12px,2.5vw,44px);overflow:hidden;text-align:center}
.keyword-band::after{display:none}
.keyword-band .kw{position:relative;z-index:1;display:inline-block;font-family:var(--ff-display);font-size:clamp(3.6rem,17vw,16rem);line-height:.85;letter-spacing:-.03em;transform-origin:center;color:var(--text)}
.keyword-band .kw b{color:var(--accent)}

/* Mobile-Menü (Overlay) */
.nav-links.open{display:flex;position:fixed;inset:0;z-index:59;flex-direction:column;justify-content:center;align-items:flex-start;gap:0;background:rgba(18,18,20,.98);backdrop-filter:blur(10px);padding:0 var(--gutter)}
.nav-links.open a{font-family:var(--ff-display);font-size:clamp(1.5rem,6vw,2rem);line-height:1.1;letter-spacing:normal;text-transform:none;color:var(--text);padding:11px 0;text-align:left}
.nav-links.open a::after{display:none}
.nav-links.open a:hover{color:var(--accent)}
header.nav .logo-svg,header.nav .burger{position:relative;z-index:61}
.stub-toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(12px);z-index:90;background:rgba(32,32,36,.96);backdrop-filter:blur(10px);border:1px solid var(--line);color:var(--text);font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.06em;padding:11px 18px;border-radius:2px;opacity:0;transition:opacity .3s var(--ease),transform .3s var(--ease);pointer-events:none}
.stub-toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.vision-claim{margin-top:clamp(24px,3vw,40px);font-family:var(--ff-display);font-size:clamp(1.5rem,2.4vw,2.1rem);line-height:1.2;letter-spacing:-.01em}
.vision-claim span{color:var(--accent)}
body.nav-locked{overflow:hidden}
.burger.active span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.active span:nth-child(2){opacity:0}
.burger.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Responsive */
@media(max-width:960px){
  .nav-links{display:none}
  .burger{display:flex}
  .nav-inner{height:66px}
  .logo-svg{height:34px}
  .nav-cta .btn-primary{padding:11px 18px;font-size:.9rem}
  .hero-meta{display:none}
  .trio,.stats,.events-grid,.process,.tgrid,.deptgrid{grid-template-columns:repeat(2,1fr)}
  .vision,.contact{grid-template-columns:1fr}
  .section-head h2{white-space:normal}
  .section-head p{white-space:normal}
  .vision-media{order:2}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:560px){
  :root{--gutter:clamp(18px,5.5vw,28px)}
  .section{padding-block:clamp(52px,13vw,84px)}
  .service{padding-block:clamp(46px,12vw,72px) clamp(24px,6vw,40px)}
  .stats,.trio,.events-grid,.process,.tgrid,.contact-cards,.deptgrid{grid-template-columns:1fr}
  .stats{gap:6px;padding-inline:var(--gutter)}
  .stat{padding:18px 0}
  .contact-cards .ccard.full{grid-column:span 1}
  .hero-scroll{display:none}
  .gear-row{grid-template-columns:40px 1fr;row-gap:6px}
  .gear-row .gcat{grid-column:2}
  .gear-row .gtag{display:none}
  .gear-foot{justify-content:flex-start}
  .gallery{grid-template-columns:1fr}
  .keyword-band .kw{font-size:clamp(2.6rem,11vw,3.4rem)}
  .wordmark-band{padding-bottom:0}
  .wm-logo{height:clamp(104px,26vw,128px);margin-bottom:0;display:block}
  .foot-top{gap:34px;flex-direction:column;align-items:flex-start}
  .foot-intro{display:contents}
  .foot-intro p{order:1}
  .foot-nav{order:2;gap:38px}
  .copyr{order:3;margin-top:0;padding-top:0}
  .nav-cta .btn-primary{display:none}
}
/* Reduced Motion */
@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  [data-reveal],[data-stagger]>*,.load{opacity:1!important;transform:none!important}
  [data-parallax],.hero-content{transform:none!important;opacity:1!important}
}

/* WordPress-Adminleiste (nur eingeloggt): Navigation darunter setzen */
.admin-bar header.nav{top:32px}
.admin-bar .nav-links.open{top:32px}
@media screen and (max-width:782px){
  .admin-bar header.nav{top:46px}
  .admin-bar .nav-links.open{top:46px}
}
@media screen and (max-width:600px){
  #wpadminbar{position:fixed}
}

/* Kunden-Logos (Customizer) */
.marquee .logo-cell img{display:block;max-width:140px;max-height:56px;width:auto;height:auto;object-fit:contain;filter:grayscale(1) brightness(1.7);opacity:.55;transition:opacity .25s,filter .25s}
.marquee .logo-cell:hover img{opacity:1;filter:none}

/* ===== Unterseiten (Impressum, Datenschutz …) ===== */
.legal{padding-top:calc(var(--navH) + clamp(56px,8vw,120px));padding-bottom:clamp(72px,9vw,140px)}
.legal-back{display:inline-flex;align-items:center;gap:10px;font-family:var(--ff-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);text-decoration:none;transition:color .2s}
.legal-back svg{width:15px;height:15px}
.legal-back:hover{color:var(--accent)}
.legal-title{font-family:var(--ff-display);font-size:clamp(2.6rem,6vw,5.2rem);line-height:1.08;letter-spacing:-.02em;color:var(--text);margin:clamp(22px,2.6vw,36px) 0 clamp(44px,5.5vw,84px)}
.legal-title::after{content:".";color:var(--accent)}
.legal-content{max-width:72ch;color:var(--muted);font-size:1.02rem;line-height:1.72}
.legal-content>*:first-child{margin-top:0}
.legal-content h2{font-family:var(--ff-display);color:var(--text);font-size:clamp(1.3rem,1.9vw,1.7rem);line-height:1.25;margin:2.2em 0 .7em}
.legal-content h3{color:var(--text);font-size:1.08rem;margin:1.8em 0 .5em}
.legal-content p{margin:0 0 1.1em}
.legal-content ul,.legal-content ol{margin:0 0 1.1em 1.2em}
.legal-content li{margin-bottom:.35em}
.legal-content strong,.legal-content b{color:var(--text)}
.legal-content a{color:var(--accent);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.legal-content a:hover{color:var(--text)}
.legal-content hr{border:0;border-top:1px solid var(--line);margin:2.4em 0}

/* Sprungmarken: Gewerke (Zahl landet mit Abstand unter Navi) + Partner-Band */
:root{--svcPadT:clamp(66px,8vw,128px)}
@media(max-width:560px){:root{--svcPadT:clamp(46px,12vw,72px)}}
article.service[id]{scroll-margin-top:calc(var(--navH) + var(--jumpGap) - var(--svcPadT))}
#partner{scroll-margin-top:calc(var(--navH) + var(--jumpGap) - clamp(24px,3vw,40px))}


/* =========================================================
   v1.3 – Briefing v3: echte Medien, Referenzen, FAQ
   ========================================================= */

/* Hero: kein Video bei reduzierter Bewegung (Standbild bleibt) */
@media(prefers-reduced-motion:reduce){.hero video,.band-video,.ev-video{display:none!important}}

/* Über imt – Foto statt Iso-Grafik */
@media(min-width:961px){.vision{grid-template-columns:minmax(0,560px) minmax(0,1fr)}}
@media(max-width:960px){.vision-media.has-photo{max-width:none;margin-top:clamp(28px,7vw,52px)}}
.vision-media.has-photo{aspect-ratio:4/3;margin:0;background:var(--surface);max-width:720px}
.vision-media.has-photo::after{display:none}
.vision .body + .body{margin-top:18px}

/* Leistungen – Foto mit Duoton (grau, helle Elemente imt-Orange), Hover = Originalfarbe */
.svg-defs{position:absolute;width:0;height:0;overflow:hidden}
.service.has-photo{grid-template-columns:minmax(0,560px) minmax(0,1fr)}
.service-media{position:relative;margin:0;aspect-ratio:4/3;overflow:hidden;background:var(--surface);max-width:680px}
.service-media img{filter:grayscale(1) contrast(1.06) brightness(.86);transition:filter .6s var(--ease),transform .9s var(--ease)}
.service-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(135deg,rgba(240,130,35,0) 30%,rgba(240,130,35,.35) 65%,rgba(240,130,35,.75) 100%);mix-blend-mode:color;transition:opacity .8s var(--ease)}
.service:hover .service-media img{filter:none}
.service:hover .service-media::after{opacity:0}
@media(max-width:860px){.service.has-photo{grid-template-columns:1fr}.service-media{order:2;margin-top:clamp(28px,7vw,52px);max-width:none}}

/* Showreel – Lightbox */
.showreel .sr-poster{filter:grayscale(.2) brightness(.6)}
.sr-lightbox{border:0;padding:0;background:transparent;max-width:min(1280px,94vw);width:100%;overflow:visible;margin:auto}
.sr-lightbox::backdrop{background:rgba(9,9,11,.92);backdrop-filter:blur(6px)}
.sr-lightbox .sr-video{position:static;display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;object-fit:contain}
.sr-close{position:absolute;top:-52px;right:0;width:44px;height:44px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:.25s var(--ease)}
.sr-close svg{width:20px;height:20px}
.sr-close:hover{background:var(--accent);border-color:var(--accent);color:#1a1204}

/* Schlagwort-Bänder mit Hintergrund (Atmosphäre / Präzision) */
.keyword-band.has-media{padding-block:clamp(90px,13vw,220px);isolation:isolate}
.keyword-band .band-media{position:absolute;inset:0;z-index:0}
.keyword-band .band-media img,.keyword-band .band-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.keyword-band.has-media::before{content:"";position:absolute;inset:0;z-index:1;background:rgba(9,9,11,.66);pointer-events:none}
.keyword-band.has-media .kw{z-index:2}
@media(max-width:560px){.keyword-band.has-media{padding-block:clamp(64px,22vw,110px)}}

/* Anlässe – Hochformat, Kurztext als Hover */
.event-cell{aspect-ratio:3/4;align-items:flex-end}
.event-cell img,.event-cell video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.event-cell .ev-video{opacity:0;transition:opacity .4s var(--ease);z-index:0}
.event-cell.playing .ev-video{opacity:1}
.event-cell .ev-body{position:relative;z-index:2}
.event-cell .ev-txt{color:var(--muted);font-size:.9rem;line-height:1.5;max-height:0;opacity:0;overflow:hidden;margin-top:0;transition:max-height .5s var(--ease),opacity .4s var(--ease),margin .4s var(--ease)}
.event-cell:hover .ev-txt,.event-cell:focus-within .ev-txt{max-height:9em;opacity:1;margin-top:12px}
.event-cell:hover .lbl{color:var(--accent)}
@media(hover:none){.event-cell .ev-txt{max-height:none;opacity:1;margin-top:10px}}
@media(max-width:960px){.event-cell{aspect-ratio:4/5}}
@media(max-width:560px){.event-cell{aspect-ratio:4/3}}

/* Referenzen – 12er-Raster, Kachelgrößen setzt app.js (groß/klein im Wechsel) */
.gallery{grid-template-columns:repeat(3,1fr)}
.gallery.laid{grid-template-columns:repeat(12,1fr);grid-auto-rows:clamp(280px,31vw,560px)}
.gallery.laid figure{grid-column:span 6}
.gallery.laid figure.s-7{grid-column:span 7}
.gallery.laid figure.s-5{grid-column:span 5}
.gallery.laid figure.s-12{grid-column:span 12}
.gallery.laid figure.s-4{grid-column:span 4}
.gallery figure{margin:0;background:var(--surface)}
.gallery figure.is-tall img{object-position:center 30%}
.js .gallery figure.is-more{display:none}
.js .gallery.show-all figure.is-more{display:block}
.gallery figure.hide{display:none!important}
.gallery figcaption .pevent{display:block;font-family:var(--ff-display);font-size:.92rem;color:var(--muted);margin-top:6px;line-height:1.35}
.gallery figcaption .ptype{font-family:var(--ff-mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);flex:none;margin:0}
.gallery-more{display:flex;justify-content:center;margin-top:clamp(28px,4vw,48px)}
.gallery-more .btn-ghost span{color:var(--muted-2)}
.gallery-more .btn-ghost{background:none;cursor:pointer;padding:8px 0;border-bottom:1px solid var(--line-2)}
.gallery-more .btn-ghost:hover{border-bottom-color:var(--accent)}
.gallery-more .btn-ghost[hidden]{display:none}
@media(max-width:960px){.gallery.laid{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(220px,40vw,360px)}.gallery.laid figure,.gallery.laid figure.s-7,.gallery.laid figure.s-5,.gallery.laid figure.s-4{grid-column:span 1}.gallery.laid figure.s-12{grid-column:span 2}}
@media(max-width:560px){.gallery.laid{grid-template-columns:1fr;grid-auto-rows:clamp(220px,62vw,320px)}.gallery.laid figure,.gallery.laid figure.s-12{grid-column:span 1}}

/* Kunden & Partner – Überschrift über der Logo-Leiste */
.partner-head{margin-bottom:clamp(28px,4vw,52px)}
.partner-head h2{font-size:clamp(1.9rem,3.6vw,3rem);line-height:1.1}
.partner-head p{color:var(--muted);font-size:1.05rem;margin-top:16px;max-width:72ch}

/* FAQ */
.faq-wrap{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:clamp(32px,6vw,96px);align-items:start}
.faq-wrap .section-head{margin-bottom:0}
.faq-wrap .section-head h2{white-space:normal;font-size:clamp(2.2rem,4vw,3.8rem)}
.faq{border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 0;font-family:var(--ff-display);font-size:clamp(1.1rem,1.6vw,1.4rem);line-height:1.3;transition:color .2s}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{color:var(--accent)}
.faq-item summary i{position:relative;flex:none;width:14px;height:14px}
.faq-item summary i::before,.faq-item summary i::after{content:"";position:absolute;left:0;top:6px;width:14px;height:1.5px;background:var(--accent);transition:transform .3s var(--ease)}
.faq-item summary i::after{transform:rotate(90deg)}
.faq-item[open] summary i::after{transform:rotate(0)}
.faq-item p{color:var(--muted);padding:0 0 26px;max-width:68ch}
@media(max-width:860px){.faq-wrap{grid-template-columns:1fr}}

/* Kontakt – Intro */
.contact-intro{color:var(--muted);font-size:1.4rem;margin-top:22px;max-width:74ch}
.contact-intro.small{font-size:1.05rem;margin-top:16px;color:var(--muted-2)}
@media(max-width:560px){.contact-intro{font-size:1.15rem}}


/* =========================================================
   imt QA-Fixes 09.10.2026 (Anlass-Lesbarkeit, Tippflaechen, Menue-CTA)
   ========================================================= */
@media (hover: none) {
  .event-cell::after {
    background: linear-gradient(0deg, rgba(9,9,11,.96) 0%, rgba(9,9,11,.85) 40%, rgba(9,9,11,.15) 82%);
  }
  .event-cell .ev-txt { color: var(--text); opacity: .82; }
}
@media (max-width: 960px) {
  .burger { padding: 12px; margin-right: -12px; }
  .filter { gap: 4px 24px; }
  .filter button { padding: 12px 0; min-height: 44px; }
  #ueber .btn-ghost { padding-top: 12px; padding-bottom: 12px; }
  .mrow .k, .ccard .k, .dept .k,
  .gallery figcaption .ptype { font-size: .72rem; }
}
.nav-links .nav-cta { display: none; }
@media (max-width: 960px) {
  .nav-links.open .nav-cta {
    display: block; margin-top: 28px; font-family: var(--ff-mono);
    font-size: .8rem !important; letter-spacing: .14em !important;
    text-transform: uppercase !important; color: var(--accent) !important;
  }
  .nav-links.open .nav-cta + .nav-cta { margin-top: 0; color: var(--muted) !important; }
}
/* Optional: Hero-Buttons auf Mobile/Tablet wieder einblenden
@media (max-width: 960px) { .hero .hero-actions { display: flex !important; margin-top: 28px; } }
*/

/* =========================================================
   imt QA-Fixes 10.10.2026
   ========================================================= */
/* Mobiles Menue: Blur liegt auf ::before statt auf dem Header, sonst wird das fixed-Overlay auf Header-Hoehe beschnitten (iOS) */
header.nav.scrolled { background: transparent; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
header.nav::before { content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0; background: rgba(32,32,36,.92); -webkit-backdrop-filter: blur(14px) saturate(1.1); backdrop-filter: blur(14px) saturate(1.1); transition: opacity .35s var(--ease); }
header.nav.scrolled::before { opacity: 1; }
/* Footer-Links: engerer Zeilenabstand */
.foot-col a { padding: 4px 0; line-height: 1.5; }

/* =========================================================
   imt 404-Seite (10.10.2026)
   ========================================================= */
.e404 { min-height: 78vh; display: flex; align-items: center; }
.e404 .container { width: 100%; }
.e404-tag { display: block; font-family: var(--ff-mono); font-size: .74rem; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); margin-bottom: 18px; }
.e404-num { font-family: var(--ff-display); font-size: clamp(7rem, 26vw, 22rem); line-height: .82; letter-spacing: -.04em; color: var(--text); margin: 0 0 clamp(24px, 4vw, 48px); }
.e404-num span { color: var(--accent); }
.e404-title { font-family: var(--ff-display); font-size: clamp(1.6rem, 3.6vw, 2.8rem); line-height: 1.15; margin-bottom: 18px; }
.e404-text { color: var(--muted); font-size: 1.1rem; max-width: 56ch; margin-bottom: 34px; }
.e404-actions { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; margin-bottom: clamp(40px, 6vw, 72px); }
.e404-links { display: flex; flex-wrap: wrap; gap: 10px 30px; padding-top: 24px; border-top: 1px solid var(--line); }
.e404-links a { font-family: var(--ff-mono); font-size: .76rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); padding: 6px 0; transition: color .2s; }
.e404-links a:hover { color: var(--accent); }

/* 404: Schnelllinks aus, Inhalt vertikal mittig (10.10.2026) */
.e404-links { display: none !important; }
.e404-actions { margin-bottom: 0; }
.section.e404 { min-height: 100vh; min-height: 100svh; display: flex; align-items: center; padding-top: calc(88px + clamp(56px, 10vh, 140px)); padding-bottom: clamp(56px, 10vh, 140px); margin: 0; }
.admin-bar .section.e404 { min-height: calc(100vh - 32px); min-height: calc(100svh - 32px); }


/* =========================================================
   imt Feedback Runde 2 (15.10.2026) – v1.4.0
   ========================================================= */
/* 01 Markenname im Fließtext: IMT in Orange */
.brand { color: var(--accent); text-transform: uppercase; font-weight: inherit; }

/* 14a Leistungsbilder: Duoton statt reinem S/W – helle Elemente (Lichtkegel, LED, Technik) in imt-Orange, Hover = Originalfarbe */
.service-media img { filter: url(#imt-duo) contrast(1.04); }
.service-media::after { opacity: 0; }
.service:hover .service-media img { filter: none; }

/* 05 Weitere Filme (Kacheln öffnen die Showreel-Lightbox) */
.films-sec { padding-block: clamp(48px, 6vw, 96px) clamp(24px, 3vw, 48px); }
.films { display: grid; grid-template-columns: minmax(0, 1fr) repeat(var(--n, 1), minmax(0, 1fr)); gap: clamp(16px, 2vw, 28px); align-items: center; }
.films-head p { color: var(--muted); max-width: 40ch; margin-top: 14px; }
.films-head h2 { font-size: clamp(1.6rem, 3vw, 2.6rem); margin-top: 14px; }
.film-tile { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: var(--surface); color: #fff; }
.film-tile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(.2) brightness(.6); transition: transform .6s var(--ease), filter .6s var(--ease); }
.film-tile:hover img { transform: scale(1.04); filter: brightness(.78); }
.film-tile .ft-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 64px; height: 64px; border: 1px solid rgba(255,255,255,.42); display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.06); backdrop-filter: blur(4px); transition: .3s var(--ease); }
.film-tile .ft-play svg { width: 20px; height: 20px; margin-left: 3px; color: #fff; transition: .3s var(--ease); }
.film-tile:hover .ft-play { background: var(--accent); border-color: var(--accent); }
.film-tile:hover .ft-play svg { color: #1a1204; }
.film-tile .ft-meta { position: absolute; left: 18px; right: 18px; bottom: 16px; display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.film-tile .ft-title { font-family: var(--ff-display); font-size: clamp(1rem, 1.4vw, 1.25rem); }
.film-tile .ft-sub { font-family: var(--ff-mono); font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
@media (max-width: 860px) { .films { grid-template-columns: 1fr; } }
