/*
Theme Name: SymphoX
Theme URI: https://www.symphox.de/
Author: Traxon Technologies Europe GmbH
Description: SymphoX by e:cue lighting control. All pages are edited in the WordPress block editor, German and English, trade shows, contact form, light and dark theme, cookie banner without cookies.
Version: 2.0.10
Requires at least: 6.4
Requires PHP: 7.4
License: Proprietary
Text Domain: symphox
*/
/* Layout: dark faceted ground from the deck, slide-style titles with a thin left rule, one neon frame in the hero as the signature moment */
:root{
  --bg:#07080c;            /* deck background, near-black with blue bias */
  --panel:#0f1117;         /* raised surfaces */
  --panel-2:#151822;
  --line:rgba(226,230,245,.10);
  --line-2:rgba(226,230,245,.18);
  --fg:#f1f2f6;
  --muted:#a2a7b2;
  --dim:#6e747a;           /* deck grey */
  --accent:#e30613;        /* e:cue red, the only accent, as in the PDF */
  --accent-hi:#ff5a45;     /* red lifted for small text on dark */
  --red:#e30613;           /* e:cue red */
  --x:#f1573e;             /* SymphoX X gradient end */
  --neon-a:#3aa8ff;
  --neon-b:#c23cff;
  --neon-c:#ff4fd8;
  --f-display:"Bahnschrift","Barlow","DIN Alternate","Segoe UI",system-ui,sans-serif;
  --f-cond:"Bahnschrift SemiCondensed","Barlow Semi Condensed","Arial Narrow",system-ui,sans-serif;
  --f-mono:"Bahnschrift SemiCondensed","Barlow Semi Condensed","Segoe UI",system-ui,sans-serif;
  --wrap:1200px;
  --r:4px;
  /* theme tokens (dark is the brand default) */
  --bg-img:url(assets/bg.jpg);
  --bg-fade-a:rgba(7,8,12,.25);
  --bg-fade-b:rgba(7,8,12,.85);
  --header-bg:rgba(7,8,12,.78);
  --glass:rgba(7,8,12,.7);
  --panel-a:rgba(15,17,23,.45);
  --panel-b:rgba(15,17,23,.72);
  --text-2:#d6d8de;
  --facet-a:rgba(255,255,255,.04);
  --facet-b:rgba(255,255,255,.18);
  --hover:rgba(255,255,255,.03);
  --shadow:rgba(0,0,0,.6);
  --svg-box:#0f1117;
  --svg-box-2:#151822;
  --svg-red:#1a0c10;
  --svg-stroke:rgba(226,230,245,.35);
  --svg-text:#f1f2f6;
  --svg-sub:#a2a7b2;
  color-scheme:dark;
}
:root[data-site-theme="light"]{
  --bg:#f3f4f6;
  --panel:#ffffff;
  --panel-2:#eceef2;
  --line:rgba(12,16,28,.10);
  --line-2:rgba(12,16,28,.22);
  --fg:#0d0f14;
  --muted:#525863;
  --dim:#666c76;
  --accent-hi:#c40511;
  --x:#b8321a;
  --bg-img:url(assets/bg-light.jpg);
  --bg-fade-a:rgba(243,244,246,.15);
  --bg-fade-b:rgba(243,244,246,.9);
  --header-bg:rgba(243,244,246,.86);
  --glass:rgba(255,255,255,.85);
  --panel-a:rgba(255,255,255,.62);
  --panel-b:rgba(255,255,255,.88);
  --text-2:#2b2f37;
  --facet-a:rgba(13,15,20,.02);
  --facet-b:rgba(13,15,20,.09);
  --hover:rgba(13,15,20,.04);
  --shadow:rgba(20,24,40,.18);
  --svg-box:#ffffff;
  --svg-box-2:#f3f4f6;
  --svg-red:#fff1f0;
  --svg-stroke:rgba(12,16,28,.35);
  --svg-text:#0d0f14;
  --svg-sub:#525863;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{
  margin:0;background:var(--bg);color:var(--fg);
  font:300 17px/1.6 var(--f-display);
  -webkit-font-smoothing:antialiased;
  background-image:linear-gradient(180deg,var(--bg-fade-a),var(--bg-fade-b) 60%,var(--bg)),var(--bg-img);
  background-size:100% 100%,1400px auto;background-repeat:no-repeat,repeat;background-attachment:scroll,fixed;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent-hi);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:clamp(16px,4vw,40px)}
h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;margin:0;text-wrap:balance;letter-spacing:-.01em}
h1{font-size:clamp(2.2rem,4.2vw,3.6rem);line-height:1.05;font-weight:300}
h2{font-size:clamp(1.8rem,3.4vw,2.7rem);line-height:1.1}
h3{font-size:1.35rem;line-height:1.25;font-weight:400}
p{margin:0}
.lead{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--muted);max-width:60ch;font-weight:300}
.eyebrow{font-family:var(--f-cond);text-transform:uppercase;letter-spacing:.22em;font-size:.8rem;color:var(--x);font-weight:400}
.mono{font-family:var(--f-mono);font-size:.82rem;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.stack{display:flex;flex-direction:column;gap:18px}
.xmark{color:var(--x);background:linear-gradient(135deg,var(--red),var(--x));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}

/* slide-title motif: thin vertical rule, title + subtitle */
.stitle{border-left:3px solid var(--fg);padding-left:20px;display:flex;flex-direction:column;gap:6px}
.stitle .sub{font-size:1.05rem;color:var(--muted);font-weight:300}

/* header */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--header-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:28px;min-height:68px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;flex-shrink:0}
.brand img.ecue{height:13px;width:auto}
.brand .sep{width:1px;height:22px;background:var(--line-2)}
.brand img.sx{height:36px;width:auto}
.nav{display:flex;gap:2px;margin-left:auto;align-items:center}
.nav a{text-decoration:none;font-family:var(--f-cond);font-size:.98rem;letter-spacing:.04em;color:var(--muted);padding:8px 12px;white-space:nowrap;border-radius:var(--r);transition:color .2s}
.nav a:hover{color:var(--fg)}
.nav a[aria-current="page"]{color:var(--fg);box-shadow:inset 0 -2px 0 var(--accent-hi)}
.btn{white-space:nowrap;display:inline-flex;align-items:center;gap:10px;font-family:var(--f-cond);font-size:1rem;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;padding:13px 22px;border-radius:var(--r);border:1px solid var(--line-2);color:var(--fg);background:transparent;cursor:pointer;transition:background .2s,border-color .2s}
.btn:hover{border-color:var(--fg)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:#fff}
.btn.primary:hover{background:#b8000c;border-color:#b8000c}
.btn .arr{transition:transform .2s}
.btn:hover .arr{transform:translateX(3px)}
.nav .btn{padding:9px 16px;font-size:.9rem;margin-left:10px}
.menu-t{display:none;margin-left:auto;background:none;border:1px solid var(--line-2);color:var(--fg);border-radius:var(--r);padding:8px 12px;font-family:var(--f-cond);letter-spacing:.08em;text-transform:uppercase;font-size:.85rem;cursor:pointer}
.top .wrap{max-width:1480px}
@media (min-width:1280px) and (max-width:1439px){
  .top .wrap{gap:12px!important}
  .nav a{padding:8px 6px!important}
  .nav .btn{padding:9px 10px!important}
}
@media (min-width:1280px) and (max-width:1599px){
  .top .wrap{gap:16px}
  .nav a{padding:8px 8px;font-size:.92rem;letter-spacing:.03em}
  .nav .btn{margin-left:6px;padding:9px 12px}
  .lang{margin-left:6px}
}
@media (max-width:1279px){
  .menu-t{display:block}
  .nav{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;background:var(--bg);border-bottom:1px solid var(--line);padding:10px 16px 18px}
  .nav.open{display:flex}
  .nav .btn{margin:8px 0 0;justify-content:center}
}

/* language switch */
.lang{display:flex;border:1px solid var(--line-2);border-radius:var(--r);overflow:hidden;flex-shrink:0;margin-left:14px}
.lang :is(button,a){all:unset;cursor:pointer;font-family:var(--f-mono);font-size:.75rem;letter-spacing:.06em;padding:7px 10px;color:var(--muted)}
.lang :is(button,a):hover{color:var(--fg)}
.lang :is(button[aria-pressed="true"],a[aria-current="true"]){background:var(--fg);color:var(--bg)}
.lang :is(button,a):focus-visible{outline:2px solid var(--accent-hi);outline-offset:-2px}
@media (max-width:900px){.lang{margin-left:10px}}

/* theme switch and logo variants */
.logo-l{display:none!important}
:root[data-site-theme="light"] .logo-d{display:none!important}
:root[data-site-theme="light"] .logo-l{display:block!important}
.theme-t{all:unset;box-sizing:border-box;cursor:pointer;display:grid;place-items:center;width:34px;height:31px;border:1px solid var(--line-2);border-radius:var(--r);color:var(--fg);flex-shrink:0;margin-left:8px}
.theme-t:hover{border-color:var(--fg)}
.theme-t:focus-visible{outline:2px solid var(--accent-hi);outline-offset:2px}
.theme-t svg{width:16px;height:16px}
.theme-t .i-moon{display:none}
:root[data-site-theme="light"] .theme-t .i-sun{display:none}
:root[data-site-theme="light"] .theme-t .i-moon{display:block}

/* e:cue brand family card */
.family-card{border:1px solid var(--line-2);background:var(--panel-b);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:22px;min-width:0}
.fam-logo{display:flex;align-items:flex-end;gap:14px;flex-wrap:wrap}
.fam-logo img{height:44px;width:auto}
.fam-logo span{font-family:var(--f-cond);text-transform:uppercase;letter-spacing:.3em;font-size:.8rem;color:var(--muted);padding-bottom:4px}
ul.fam{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
ul.fam li{display:grid;grid-template-columns:150px 1fr;gap:6px 18px;padding:14px 0;border-bottom:1px solid var(--line);align-items:baseline}
ul.fam li b{font-weight:500;font-size:1.05rem}
ul.fam li span{color:var(--muted);font-size:.95rem}
ul.fam li.is-sx b{color:var(--x)}
.fam-foot{display:flex;align-items:baseline;gap:14px}
.fam-foot b{font-size:clamp(2.2rem,4vw,3rem);font-weight:300;line-height:1}
.fam-foot span{color:var(--muted)}
@media (max-width:520px){ul.fam li{grid-template-columns:1fr}}

/* node extension schematic */
.node-diagram svg{min-width:680px}
.dg-duo{fill:var(--svg-red);stroke:var(--red);stroke-width:1.5}
.dg-node{fill:var(--svg-box);stroke:var(--x);stroke-width:1.5}
.dg-node.ghost{fill:none;stroke:var(--svg-stroke);stroke-dasharray:5 4}
.dg-sw{fill:var(--svg-box-2);stroke:var(--svg-stroke)}
.dg-dali{stroke:var(--x);stroke-width:1.6;fill:none}
.dg-enet{stroke:var(--svg-text);stroke-width:1.6;fill:none;opacity:.75}
.dg-fix{fill:var(--svg-box);stroke:var(--x);stroke-width:1.2}
.dg-fix-in{fill:var(--x)}
.dg-big{font-size:17px!important;font-weight:500}
.dg-tag{font-family:"Bahnschrift SemiCondensed","Barlow Semi Condensed",sans-serif;font-size:10px;letter-spacing:.14em;text-transform:uppercase;fill:var(--x)}
.dg-note{font-family:"Bahnschrift","Barlow",system-ui,sans-serif;font-size:13px;fill:var(--svg-text)}
.dg-legend{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:14px;color:var(--muted);font-size:.9rem}
.dg-legend span{display:flex;align-items:center;gap:8px}
.dg-legend i{width:22px;height:0;border-top:2px solid var(--x);display:inline-block}
.dg-legend i.en{border-top-color:var(--fg);opacity:.75}

.dg-in{fill:var(--svg-box);stroke:var(--svg-text);stroke-width:1.3;opacity:.95}
.dg-in-mark{fill:none;stroke:var(--svg-text);stroke-width:1.4}
.dg-in-dot{fill:var(--svg-text)}
.lg-ico{width:18px;height:18px;flex-shrink:0}
.dg-legend .lg-note{color:var(--fg)}

/* multi device schematic */
.dg-backbone{stroke-width:3}
.dg-res{fill:var(--x);font-weight:500}
.dg-sum{font-size:15px!important;font-weight:500}


/* news & events */
.evs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ev{display:flex;flex-direction:column;gap:16px;border:1px solid var(--line);background:var(--panel);border-radius:var(--r);padding:22px}
.ev-top{display:flex;gap:18px;align-items:flex-start}
.ev-date{flex:0 0 84px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid var(--line-2);border-top:3px solid var(--accent);height:88px;text-align:center}
.ev-date .mono{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ev-date b{font-family:var(--f-cond);font-weight:300;font-size:2.3rem;line-height:1}
.ev-head{display:flex;flex-direction:column;gap:6px;min-width:0;padding-top:4px}
.ev h3{margin:0;font-size:1.35rem;font-weight:400;line-height:1.2}
.ev-when{margin:0;color:var(--fg)}
.ev-meta{list-style:none;margin:0;padding:14px 0 0;border-top:1px solid var(--line);color:var(--muted);font-size:.95rem;display:grid;gap:6px}
.ev-meta li{position:relative;padding-left:16px}
.ev-meta li::before{content:"";position:absolute;left:0;top:.62em;width:6px;height:6px;background:var(--x)}
.ev-now{color:var(--accent-hi);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.ev-act{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}
.ev-act .btn{padding:10px 14px;font-size:.85rem;flex:1 1 auto;justify-content:center}
.ev[hidden]{display:none!important}
.evs-empty{color:var(--muted)}
@media (max-width:1100px){.evs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.evs{grid-template-columns:1fr}}
@media (max-width:360px){.ev{padding:18px}.ev-date{flex-basis:68px;height:76px}.ev-date b{font-size:1.9rem}}

/* extension callout */
.ext-callout{display:flex;align-items:center;gap:16px;text-decoration:none;border:1px solid var(--line-2);background:var(--panel-a);padding:12px 18px 12px 12px;border-radius:var(--r);max-width:520px;transition:border-color .2s}
.ext-callout:hover{border-color:var(--x)}
.ext-callout img{height:64px;width:auto;flex-shrink:0}
.ext-callout .t{display:flex;flex-direction:column;gap:2px;min-width:0}
.ext-callout .t b{font-weight:500}
.ext-callout .t small{color:var(--muted);font-size:.9rem}
.ext-callout .arr{margin-left:auto;color:var(--x);font-size:1.2rem}

/* quality seals */
.seals{display:flex;gap:10px;flex-wrap:wrap}
.seal{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--line-2);background:var(--panel-a);padding:6px 14px 6px 10px;border-radius:99px}
.seal b{font-family:var(--f-cond);font-weight:500;letter-spacing:.06em;font-size:.88rem;white-space:nowrap}
.seal-flag{width:20px;height:14px;flex-shrink:0}
.seal-flag .fl-b{fill:none;stroke:var(--line-2)}
.seal-ico{width:18px;height:18px;color:var(--x);flex-shrink:0}
.fam-trust{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.fam-trust div{padding:16px 12px 0 0;display:flex;flex-direction:column;gap:6px;min-width:0}
.fam-trust b{font-size:clamp(1.6rem,3vw,2.2rem);font-weight:300;line-height:1.05}
.fam-trust span{color:var(--muted);font-size:.88rem;line-height:1.35}
.fam-trust .ic{display:flex;align-items:center;gap:8px;height:1.05em;font-size:clamp(1.6rem,3vw,2.2rem)}
.fam-trust .ic svg{height:.8em;width:auto}
@media (max-width:520px){.fam-trust{grid-template-columns:1fr 1fr}}

/* sections */
section{padding-block:clamp(64px,9vw,120px)}
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.sec-head .lead{max-width:48ch}
.rule{border-top:1px solid var(--line)}

/* light facet in the top right, as on every PDF slide */
main{position:relative;overflow-x:clip}
main::before{content:"";position:absolute;top:0;right:0;width:min(46vw,640px);height:170px;background:linear-gradient(100deg,var(--facet-a),var(--facet-b));clip-path:polygon(18% 0,100% 0,100% 38%,0 62%);pointer-events:none;z-index:0}
main>*{position:relative;z-index:1}

/* key visual hero */
.kvhero{padding-block:clamp(28px,4vw,56px) clamp(56px,7vw,96px)}
.kvhero .wrap{display:grid;grid-template-columns:1.35fr 1fr;gap:clamp(28px,4vw,64px);align-items:center}
.kvhero .wrap>*{min-width:0}
.kv{position:relative;box-shadow:0 40px 90px -40px rgba(194,60,255,.55),0 30px 80px -50px rgba(58,168,255,.6)}
.kv img{width:100%}
.kvhero .hero-copy{gap:22px}
.kvhero .sub-red{font-family:var(--f-display);font-weight:600;color:var(--red);font-size:clamp(1.3rem,2vw,1.7rem);letter-spacing:.01em}
.kvhero h1{font-size:clamp(2rem,3.3vw,3.1rem)}
.kvhero h1 .thin{display:block;color:var(--muted)}
@media (max-width:960px){.kvhero .wrap{grid-template-columns:1fr}}
@media (max-width:390px){.brand img.sx{height:22px!important}.lang{margin-left:6px}.lang :is(button,a){padding:7px 8px}.theme-t{margin-left:4px}.top .wrap{gap:8px!important}}
@media (max-width:520px){.brand .sep,:root .brand img.ecue.logo-d,:root .brand img.ecue.logo-l{display:none!important}.brand img.sx{height:28px}.top .wrap{gap:12px}.menu-t{padding:7px 10px}}

/* feature list with arrows (PDF USP page 2) */
.extras{display:grid;grid-template-columns:repeat(3,1fr);margin-top:40px;border-top:1px solid var(--line)}
.extras div{padding:20px 22px 0 0;display:flex;gap:12px;min-width:0}
.extras div::before{content:"→";color:var(--x)}
@media (max-width:820px){.extras{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.extras{grid-template-columns:1fr}}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stats div{padding:24px 20px 22px 0;display:flex;flex-direction:column;gap:4px;min-width:0}
.stats b{font-weight:300;font-size:clamp(2rem,4vw,3rem);line-height:1;font-variant-numeric:tabular-nums}
.stats span{color:var(--muted);font-size:.92rem}
@media (max-width:700px){.stats{grid-template-columns:1fr 1fr}}

/* pilot projects */
.ref{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:clamp(28px,4vw,64px);padding-block:clamp(48px,6vw,80px);border-top:1px solid var(--line)}
.ref .meta{display:flex;flex-direction:column;gap:22px}
.ref .when{display:flex;flex-wrap:wrap;gap:8px 18px;color:var(--muted);font-size:.95rem}
.ref .when span{display:flex;gap:8px;align-items:center}
.ref .when span::before{content:"";width:6px;height:6px;background:var(--x)}
.ref dl{display:grid;grid-template-columns:130px 1fr;gap:10px 18px;margin:0}
.ref dt{font-family:var(--f-cond);text-transform:uppercase;letter-spacing:.14em;font-size:.76rem;color:var(--muted);padding-top:3px}
.ref dd{margin:0}
.qty{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.qty div{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 14px 12px;display:flex;flex-direction:column;gap:2px}
.qty b{font-weight:300;font-size:1.7rem;line-height:1.05;font-variant-numeric:tabular-nums}
.qty span{color:var(--muted);font-size:.84rem;line-height:1.3}
.ref .pics{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.ref .pics img{width:100%;height:100%;object-fit:cover;background:#fff}
.ref .pics .wide{grid-column:1/-1}
.ref .big{border:1px solid var(--line-2);background:var(--panel-b);padding:clamp(28px,4vw,48px);display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:260px}
.ref .big b{font-size:clamp(4rem,9vw,7rem);font-weight:200;line-height:.9;font-variant-numeric:tabular-nums}
.ref .big span{color:var(--muted)}
.ref .size{display:inline-flex;width:fit-content;font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;font-size:.78rem;border:1px solid var(--line-2);padding:5px 12px;border-radius:99px}
@media (max-width:900px){.ref{grid-template-columns:1fr}.ref dl{grid-template-columns:110px 1fr}}

/* product photo carousel */
.carousel{display:flex;flex-direction:column;gap:14px;min-width:0}
.car-stage{position:relative;background:radial-gradient(60% 60% at 50% 55%,rgba(227,6,19,.2),transparent 70%)}
.car-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;outline:none}
.car-track::-webkit-scrollbar{display:none}
.car-track:focus-visible{box-shadow:inset 0 0 0 2px var(--accent-hi)}
.car-slide{flex:0 0 100%;scroll-snap-align:center;margin:0;display:flex;flex-direction:column;align-items:center;gap:12px;padding:clamp(12px,3vw,32px)}
.car-slide img{width:100%;aspect-ratio:5/4;object-fit:contain}
.car-slide figcaption{color:var(--muted);font-size:.92rem;text-align:center}
.car-btn{position:absolute;top:44%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid var(--line-2);background:var(--glass);color:var(--fg);font:400 1.1rem/1 var(--f-display);cursor:pointer;display:grid;place-items:center}
.car-btn:hover{border-color:var(--fg)}
.car-btn.prev{left:4px}.car-btn.next{right:4px}
.car-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.car-thumbs button{all:unset;box-sizing:border-box;cursor:pointer;border:1px solid var(--line);padding:6px;background:var(--panel-b);aspect-ratio:4/3;display:grid;place-items:center}
.car-thumbs button{min-width:0;overflow:hidden}
.car-thumbs button img{width:100%;height:100%;object-fit:contain}
.car-thumbs button[aria-current="true"]{border-color:var(--red)}
.car-thumbs button:focus-visible{outline:2px solid var(--accent-hi);outline-offset:2px}

/* technical data */
.dl-row{display:flex;gap:10px;flex-wrap:wrap}
.dl-row .btn small{font-size:.78em;opacity:.75;text-transform:none;letter-spacing:.02em}
.spec{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 48px}
.spec>div{min-width:0;display:flex;flex-direction:column;gap:12px}
.spec h3{font-size:1.15rem;font-weight:500;border-left:3px solid var(--fg);padding-left:12px}
table.spec-t{min-width:0;font-size:.94rem}
table.spec-t th{width:40%;text-transform:none;letter-spacing:0;font:400 .92rem/1.45 var(--f-display);color:var(--muted);background:transparent;padding:10px 16px 10px 0}
table.spec-t td{color:var(--fg);white-space:normal;font-weight:300;padding:10px 0}
table.spec-t td:first-child{white-space:normal}
.drawings{display:grid;grid-template-columns:1fr 1.4fr;gap:24px;margin-top:48px}
.drawings figure{margin:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.drawings figcaption{color:var(--muted);font-size:.9rem}
.prelim{display:inline-flex;align-items:center;gap:8px;color:var(--muted);font-size:.88rem}
.prelim::before{content:"";width:6px;height:6px;background:var(--x)}
@media (max-width:860px){.spec,.drawings{grid-template-columns:1fr}}

/* legal links in footer */
.legal-links{display:flex;flex-wrap:wrap;gap:6px 18px}
.legal-links a,.legal-links button{all:unset;cursor:pointer;color:var(--muted);font-size:.85rem}
.legal-links a:hover,.legal-links button:hover{color:var(--fg)}
.legal-links a:focus-visible,.legal-links button:focus-visible{outline:2px solid var(--accent-hi);outline-offset:3px}

/* imprint */
.imprint{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(28px,4vw,64px);padding-block:clamp(40px,5vw,64px);border-top:1px solid var(--line)}
.imprint address{font-style:normal;line-height:1.7}
.imprint dl{display:grid;grid-template-columns:180px 1fr;gap:10px 18px;margin:0}
.imprint dt{color:var(--muted)}
.imprint dd{margin:0}
.imprint .links{display:flex;flex-direction:column;gap:10px}
.imprint .links a{display:flex;justify-content:space-between;gap:16px;text-decoration:none;border-bottom:1px solid var(--line);padding:12px 0}
.imprint .links a:hover{color:var(--accent-hi)}
@media (max-width:760px){.imprint{grid-template-columns:1fr}.imprint dl{grid-template-columns:1fr}.imprint dt{margin-top:8px}}

/* legal documents */
.legal-page{padding-block:0 clamp(48px,6vw,80px)}
.legal-doc{max-width:78ch;border-top:1px solid var(--line);padding-top:clamp(28px,4vw,44px)}
.legal-doc h2{font-size:1.35rem;font-weight:500;margin:36px 0 12px;border-left:3px solid var(--fg);padding-left:14px}
.legal-doc h2:first-child{margin-top:0}
.legal-doc h3{font-size:1.1rem;font-weight:500;margin:26px 0 10px}
.legal-doc h4{font-size:1rem;font-weight:500;margin:20px 0 8px}
.legal-doc p{color:var(--text-2);margin:0 0 14px;font-size:.98rem;line-height:1.7}
.legal-doc ul{margin:0 0 16px;padding-left:22px;color:var(--text-2);font-size:.98rem;line-height:1.7}
.legal-doc li{margin-bottom:6px}
.legal-doc a{color:var(--fg);overflow-wrap:anywhere}
.legal-sep{margin:56px 0 0}
.legal-doc .pending{color:var(--muted);font-size:1.05rem}
.legal-meta{display:flex;gap:10px 22px;flex-wrap:wrap;color:var(--muted);font-size:.9rem}
.legal-meta a{color:var(--fg)}
.linklike{all:unset;cursor:pointer;color:var(--fg);text-decoration:underline}
.linklike:focus-visible{outline:2px solid var(--accent-hi);outline-offset:3px}

/* cookie consent */
.consent{position:fixed;left:0;right:0;bottom:0;z-index:50;padding:0 16px calc(16px + env(safe-area-inset-bottom,0px))}
.consent-box{max-width:980px;margin:0 auto;background:var(--panel);border:1px solid var(--line-2);box-shadow:0 -20px 60px var(--shadow);padding:22px 24px;display:flex;flex-direction:column;gap:16px}
.consent-box h2{font-size:1.25rem;font-weight:500;border-left:3px solid var(--fg);padding-left:12px}
.consent-box p{color:var(--muted);font-size:.95rem;max-width:80ch}
.consent-box p a{color:var(--fg)}
.consent-actions{display:flex;flex-wrap:wrap;gap:10px}
.consent-actions .btn{padding:11px 18px;font-size:.92rem}
.consent-opts{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.consent-opts label{flex-direction:row;align-items:flex-start;gap:14px;padding:14px 0;border-bottom:1px solid var(--line);text-transform:none;letter-spacing:0;font:300 .95rem/1.5 var(--f-display);color:var(--fg);cursor:pointer}
.consent-opts label b{display:block;font-weight:500}
.consent-opts label span span{color:var(--muted);font-size:.9rem}
.consent-opts input{width:20px;height:20px;flex:0 0 20px;margin-top:2px;accent-color:var(--red);padding:0}
@media (max-width:560px){.consent-actions .btn{flex:1 1 100%;justify-content:center}}

/* HERO */
.hero{padding-block:clamp(40px,7vw,96px) clamp(56px,8vw,110px)}
.hero .wrap{display:grid;grid-template-columns:1.05fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.hero-copy{display:flex;flex-direction:column;gap:26px;min-width:0}
.hero-word{width:min(420px,90%)}
.triad{display:flex;gap:clamp(14px,3vw,34px);font-family:var(--f-display);font-weight:300;letter-spacing:.2em;text-transform:uppercase;font-size:.95rem;color:var(--fg);flex-wrap:wrap}
.hero h1 .thin{display:block;color:var(--muted)}
.cta-row{display:flex;gap:12px;flex-wrap:wrap}
.neon{position:relative;padding:clamp(18px,3vw,34px);min-width:0}
.neon::before{content:"";position:absolute;inset:0;border-radius:2px;padding:2px;background:linear-gradient(115deg,var(--neon-a) 0%,#7c6bff 38%,var(--neon-b) 70%,var(--neon-c) 100%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);pointer-events:none}
.neon::after{content:"";position:absolute;inset:-2px;z-index:-1;filter:blur(28px);opacity:.55;background:linear-gradient(115deg,var(--neon-a),transparent 40%,transparent 60%,var(--neon-c));animation:breathe 6s ease-in-out infinite}
@keyframes breathe{50%{opacity:.3}}
.neon img{border-radius:2px}
.neon .tag{position:absolute;left:clamp(18px,3vw,34px);bottom:-14px;background:var(--bg);padding:2px 12px;font-family:var(--f-display);font-weight:300;letter-spacing:.24em;text-transform:uppercase;font-size:.78rem;color:var(--fg)}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}}

/* USP grid */
.usps{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}
.usp{padding:30px 28px 34px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:12px;min-width:0;background:var(--panel-a)}
.usp .dot{width:8px;height:8px;background:var(--fg)}
.usp h3{font-size:1.25rem}
.usp p{color:var(--muted);font-size:.98rem}
@media (max-width:900px){.usps{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.usps{grid-template-columns:1fr}}

/* bullets like the deck */
ul.b{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
ul.b li{position:relative;padding-left:24px;color:var(--fg);font-weight:300}
ul.b li::before{content:"";position:absolute;left:0;top:.6em;width:6px;height:6px;background:var(--fg)}
ul.arrow{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:4px}
ul.arrow li{padding-left:22px;position:relative;font-weight:300}
ul.arrow li::before,ul.b ul.arrow li::before{content:"→";position:absolute;left:0;top:0;width:auto;height:auto;background:none;color:var(--fg)}
ul.b li small{display:block;color:var(--muted);font-size:.92rem}

/* split blocks */
.split{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:center}
.split.rev{grid-template-columns:1.15fr 1fr}
.split.rev>:first-child{order:2}
.split>*{min-width:0}
@media (max-width:900px){.split,.split.rev{grid-template-columns:1fr}.split.rev>:first-child{order:0}}

/* screenshot frame */
.shot{background:var(--panel);border:1px solid var(--line-2);border-radius:6px;overflow:hidden;box-shadow:0 30px 80px -30px rgba(227,6,19,.55)}
.shot .bar{display:flex;align-items:center;gap:6px;padding:9px 12px;border-bottom:1px solid var(--line);background:var(--panel-2)}
.shot .bar i{width:8px;height:8px;border-radius:50%;background:var(--line-2)}
.shot .bar span{margin-left:10px;color:var(--dim)}

/* two modes */
.modes{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.mode{border:1px solid var(--line-2);background:var(--panel-b);padding:clamp(24px,3vw,40px);display:flex;flex-direction:column;gap:20px;min-width:0}
.mode.expert{border-color:rgba(241,87,62,.45)}
.mode .kicker{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.mode .pill{font-family:var(--f-mono);font-size:.72rem;padding:4px 10px;border:1px solid var(--line-2);border-radius:99px;color:var(--muted)}
.mode.expert .pill{border-color:var(--accent-hi);color:var(--accent-hi)}
.mode .more{margin-top:auto}
@media (max-width:820px){.modes{grid-template-columns:1fr}}
.adapt{margin-top:28px;display:flex;align-items:center;gap:14px;color:var(--muted);flex-wrap:wrap}
.adapt img{height:24px;width:auto}

/* product feature */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,5vw,72px);align-items:center}
.feature>*{min-width:0}
.prod-stage{position:relative;padding:clamp(20px,4vw,48px);background:radial-gradient(60% 60% at 50% 55%,rgba(227,6,19,.18),transparent 70%)}
.badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--f-mono);font-size:.76rem;color:var(--fg);border:1px solid var(--red);padding:5px 12px;border-radius:99px;width:fit-content}
.badge::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--red);box-shadow:0 0 10px var(--red)}
.facts{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);margin-top:8px}
.fact{padding:18px 16px 4px 0;display:flex;flex-direction:column;gap:4px;min-width:0}
.fact b{font-weight:300;font-size:1.7rem;line-height:1.1;font-variant-numeric:tabular-nums}
.fact span{color:var(--muted);font-size:.85rem;line-height:1.35}
@media (max-width:900px){.feature{grid-template-columns:1fr}}
@media (max-width:560px){.facts{grid-template-columns:repeat(2,1fr)}}

/* product family */
.family{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.pcard{display:flex;flex-direction:column;border:1px solid var(--line);background:var(--panel-b);min-width:0}
.pcard .ph{aspect-ratio:4/3;display:grid;place-items:center;padding:22px;background:radial-gradient(70% 60% at 50% 60%,rgba(227,6,19,.28),transparent 70%);border-bottom:1px solid var(--line)}
.pcard .ph img{max-height:166px;max-width:100%;width:auto;height:auto;object-fit:contain}
.pcard .ph{height:210px;aspect-ratio:auto}
.pcard .pb{padding:20px 20px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.pcard .pb p{color:var(--muted);font-size:.95rem}
.pcard .sx{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:8px;color:var(--dim)}
.pcard .sx b{color:var(--fg);font-weight:500}
@media (max-width:1000px){.family{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.family{grid-template-columns:1fr}}

/* table */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line)}
table{border-collapse:collapse;width:100%;min-width:720px;font-size:.95rem}
th,td{text-align:left;padding:14px 18px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-family:var(--f-cond);font-weight:500;letter-spacing:.12em;text-transform:uppercase;font-size:.75rem;color:var(--muted);background:var(--panel)}
td:first-child{font-weight:500;white-space:nowrap}
td{color:var(--muted)}
td:first-child{color:var(--fg)}
tr:last-child td{border-bottom:0}
.yes{color:var(--fg)}

/* workflow tabs */
.flow{display:grid;grid-template-columns:320px 1fr;gap:clamp(24px,4vw,56px);align-items:start}
.flow>*{min-width:0}
.steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border-left:1px solid var(--line)}
.steps button{all:unset;box-sizing:border-box;display:grid;grid-template-columns:44px 1fr;gap:6px 8px;width:100%;padding:14px 16px 14px 20px;cursor:pointer;margin-left:-1px;border-left:2px solid transparent;transition:background .2s,border-color .2s}
.steps button:hover{background:var(--hover)}
.steps button[aria-selected="true"]{border-left-color:var(--accent-hi);background:rgba(227,6,19,.14)}
.steps .n{font-family:var(--f-mono);font-size:.78rem;color:var(--dim);padding-top:3px}
.steps button[aria-selected="true"] .n{color:var(--accent-hi)}
.steps .t{font-size:1.08rem}
.steps .d{grid-column:2;color:var(--muted);font-size:.9rem;display:none}
.steps button[aria-selected="true"] .d{display:block}
.steps .prev{font-family:var(--f-mono);font-size:.66rem;color:var(--x);margin-left:6px;vertical-align:2px}
.flow-view .cap{margin-top:14px;color:var(--muted);font-size:.9rem;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
@media (max-width:900px){.flow{grid-template-columns:1fr}}

/* diagram */
.diagram{border:1px solid var(--line);background:var(--panel-b);padding:clamp(14px,3vw,32px);overflow-x:auto}
.diagram svg{display:block;width:100%;min-width:620px;height:auto}
.dg-label{font-family:"Bahnschrift","Barlow",system-ui,sans-serif;font-size:13px;fill:var(--svg-text)}
.dg-sub{font-family:"Bahnschrift SemiCondensed","Barlow Semi Condensed",sans-serif;font-size:10.5px;fill:var(--svg-sub)}

/* solutions */
.sol-nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.sol-nav a{font-family:var(--f-cond);letter-spacing:.06em;text-decoration:none;padding:8px 14px;border:1px solid var(--line-2);border-radius:99px;color:var(--muted);font-size:.92rem}
.sol-nav a:hover{color:var(--fg);border-color:var(--fg)}
.sol{display:grid;grid-template-columns:300px 1fr;gap:clamp(24px,4vw,64px);padding-block:clamp(48px,6vw,80px);border-top:1px solid var(--line)}
.sol>*{min-width:0}
.sol .side{display:flex;flex-direction:column;gap:14px}
.sol .side h2{font-size:clamp(1.6rem,2.3vw,2.1rem);overflow-wrap:break-word;hyphens:manual}
.sol .side .fit{color:var(--muted);font-size:.92rem}
.sol .side .fit b{display:block;color:var(--fg);font-weight:500;font-family:var(--f-cond);letter-spacing:.1em;text-transform:uppercase;font-size:.75rem;margin-bottom:4px}
.sol .body{display:flex;flex-direction:column;gap:28px}
.sol .cols{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.sol .cols>*{min-width:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{font-family:var(--f-mono);font-size:.74rem;padding:5px 10px;border:1px solid var(--line-2);color:var(--muted);border-radius:var(--r)}
@media (max-width:900px){.sol{grid-template-columns:1fr}.sol .cols{grid-template-columns:1fr}}
.paper{background:#fff;border-radius:4px;padding:10px;box-shadow:0 0 0 1px var(--line)}

/* band + contact */
.band{border-block:1px solid var(--line);background:linear-gradient(90deg,rgba(58,168,255,.08),rgba(227,6,19,.18) 50%,rgba(255,79,216,.08))}
.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;padding-block:44px}
.band h2{font-size:clamp(1.5rem,2.6vw,2.1rem);max-width:28ch}
.contact{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(32px,5vw,72px)}
.contact>*{min-width:0}
form{display:grid;grid-template-columns:1fr 1fr;gap:16px}
form .full{grid-column:1/-1}
.form-privacy{margin:0}
.form-privacy a{color:inherit}
.hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
#demoForm{position:relative}
#demoForm button[disabled]{opacity:.6;cursor:wait}
label{display:flex;flex-direction:column;gap:6px;font-family:var(--f-cond);letter-spacing:.08em;text-transform:uppercase;font-size:.75rem;color:var(--muted)}
input,select,textarea{font:400 1rem/1.4 var(--f-display);color:var(--fg);background:var(--panel);border:1px solid var(--line-2);border-radius:var(--r);padding:12px 14px;text-transform:none;letter-spacing:0;width:100%}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent-hi)}
textarea{min-height:110px;resize:vertical}
.form-note{color:var(--muted);font-size:.9rem}
.form-ok{grid-column:1/-1;border:1px solid var(--accent-hi);background:rgba(227,6,19,.16);padding:16px 18px;border-radius:var(--r)}
@media (max-width:820px){.contact{grid-template-columns:1fr}}
@media (max-width:520px){form{grid-template-columns:1fr}}

/* marketing */
.kit{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line)}
.kit div{padding:22px 20px 0 0;display:flex;flex-direction:column;gap:6px;min-width:0}
.kit b{font-weight:400;font-size:1.08rem}
.kit span{color:var(--muted);font-size:.92rem}
@media (max-width:800px){.kit{grid-template-columns:repeat(2,1fr)}}

/* page intro for sub pages */
.intro{padding-block:clamp(48px,7vw,96px) clamp(32px,4vw,56px)}
.intro .wrap{display:flex;flex-direction:column;gap:22px}

/* footer */
footer{border-top:1px solid var(--line);padding-block:48px 40px;margin-top:40px}
footer .wrap{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:32px}
footer .wrap>*{min-width:0}
footer .foot-logo{height:26px;width:auto;align-self:flex-start}
footer h4{font-family:var(--f-cond);font-weight:500;text-transform:uppercase;letter-spacing:.14em;font-size:.75rem;color:var(--muted);margin-bottom:12px}
footer ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:8px}
footer a{text-decoration:none;color:var(--fg);font-weight:300}
footer a:hover{color:var(--accent-hi)}
footer .legal{grid-column:1/-1;border-top:1px solid var(--line);padding-top:22px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;color:var(--dim);font-size:.85rem}
@media (max-width:800px){footer .wrap{grid-template-columns:1fr 1fr}}

/* views */
.view[hidden]{display:none!important}
.view{animation:fade .45s ease both}
@keyframes fade{from{opacity:.4;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ---- generated from inline styles of the original page ---- */
.sx-s1{gap:22px!important}
.sx-s2{padding-top:clamp(56px,7vw,96px)!important}
.sx-s3{font-size:1rem!important}
.sx-s4{text-decoration:none!important}
.sx-s5{color:var(--accent-hi)!important}
.sx-s6{gap:24px!important}
.sx-s7{margin-top:14px!important}
.sx-s8{color:var(--x)!important}
.sx-s9{gap:32px!important}
.sx-s10{border:1px solid var(--line)!important}
.sx-s11{padding-top:clamp(48px,6vw,80px)!important}
.sx-s12{margin-top:6px!important}
.sx-s13{margin-top:clamp(40px,5vw,64px)!important}
.sx-s14{margin-bottom:22px!important}
.sx-s15{font-size:1.5rem!important}
.sx-s16{margin-top:clamp(36px,5vw,56px)!important}
.sx-s17{margin-top:28px!important}
.sx-s18{margin-top:12px!important}
.sx-s19{border-top:0!important;padding-top:0!important}
.sx-s20{gap:26px!important}
.sx-s21{gap:14px!important}
.sx-s22{max-width:36ch!important}
.lang a{text-decoration:none}

/* WordPress */
.admin-bar .top{top:32px}
@media (max-width:782px){.admin-bar .top{top:46px}}
@media (max-width:600px){.admin-bar .top{top:0}}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
[id]{scroll-margin-top:84px}
