/* api-bi.dev Designsystem. Basis ist das Original: Dark als Standard, Gradient-Bühnen, Glas-Pill, Pill-Labels. */
@font-face{font-family:"Poppins";font-weight:400;font-display:swap;src:url("/fonts/poppins-latin-400-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:500;font-display:swap;src:url("/fonts/poppins-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:600;font-display:swap;src:url("/fonts/poppins-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Poppins";font-weight:700;font-display:swap;src:url("/fonts/poppins-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"ApiBiHo";font-weight:500;font-display:swap;src:url("/fonts/apibi-ho-500.woff2") format("woff2");unicode-range:U+1ED3}
@font-face{font-family:"ApiBiHo";font-weight:600;font-display:swap;src:url("/fonts/apibi-ho-600.woff2") format("woff2");unicode-range:U+1ED3}
@font-face{font-family:"Inter";font-weight:100 900;font-display:swap;src:url("/fonts/inter-latin-wght-normal.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-weight:100 900;font-display:swap;src:url("/fonts/inter-vietnamese-wght-normal.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"InterPrint";font-weight:400;src:url("/fonts/inter-print-400.woff2") format("woff2")}
@font-face{font-family:"InterPrint";font-weight:600;src:url("/fonts/inter-print-600.woff2") format("woff2")}
@font-face{font-family:"Be Vietnam Pro";font-weight:500;font-display:swap;src:url("/fonts/be-vietnam-pro-500-vi.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-weight:600;font-display:swap;src:url("/fonts/be-vietnam-pro-600-vi.woff2") format("woff2");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}
@font-face{font-family:"Be Vietnam Pro";font-weight:500;font-display:swap;src:url("/fonts/be-vietnam-pro-500-la.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Be Vietnam Pro";font-weight:600;font-display:swap;src:url("/fonts/be-vietnam-pro-600-la.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2190-2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --black:#07040D;--ink:#16131C;--violet:#1D1434;--lilac:#F3EDF8;--white:#FFFFFF;
  --blue:#4200FE;--grape:#6600EB;--magenta:#D2158D;--red:#E62554;--orange:#FF8036;
  --display:"ApiBiHo","Poppins","Inter",system-ui,sans-serif;
  --ui:"Poppins","Inter",system-ui,sans-serif;
  --text:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --wrap:1140px;--gutter:clamp(1rem,.3rem + 3.2vw,2.5rem);
  --sec:clamp(4.5rem,3rem + 6vw,8.5rem);
  --fs-h1:clamp(2.6rem,1.7rem + 3.1vw,4rem);
  --fs-h2:clamp(2.1rem,1.5rem + 2.4vw,3.2rem);
  --fs-h3:clamp(1.5rem,1.3rem + .8vw,2rem);
  --grad-text:linear-gradient(76deg,#4200FE 10%,#D2158D 47%,#E62554 60%,#FF8036 100%);
  --radius:10px;
}
html[lang="vi"]{--display:"Be Vietnam Pro","Inter",system-ui,sans-serif;--ui:"Be Vietnam Pro","Inter",system-ui,sans-serif}

html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#07040D;--bg-2:#0E0A16;--bg-3:#16131C;
  --fg:#FFFFFF;--fg-2:#FFFFFF;--fg-3:rgba(255,255,255,.62);
  --line:rgba(255,255,255,.16);--line-2:rgba(255,255,255,.34);
  --card:rgba(255,255,255,.03);--glass:rgba(7,4,13,.62);--glass-line:rgba(255,255,255,.08);
  --head-accent:var(--fg);--logo-fill:#fff;--logo-fill-scrolled:#fff;
  --chip:rgba(255,255,255,.72);--shadow:0 8px 30px rgba(0,0,0,.25);
  --strip-bg:#fff;--strip-fg:#07040D;--strip-block:#07040D;--strip-block-fg:#fff;
  --gb-a:#fff;--gb-b:rgba(255,255,255,.35);--tab-line:linear-gradient(75deg,rgba(255,255,255,.6),rgba(255,255,255,.2));--tab-line-on:linear-gradient(75deg,#fff,rgba(255,255,255,.5));--fade-line:rgba(230,225,255,.75);
}
html[data-theme="light"]{
  color-scheme:light;
  --bg:#FFFFFF;--bg-2:#F8F5FB;--bg-3:#F3EDF8;
  --fg:#16131C;--fg-2:#16131C;--fg-3:rgba(7,4,13,.6);
  --line:rgba(7,4,13,.14);--line-2:rgba(7,4,13,.36);
  --card:#fff;--glass:rgba(255,255,255,.4);--glass-line:rgba(7,4,13,.08);
  --head-accent:transparent;--logo-fill:#fff;--logo-fill-scrolled:var(--lg);
  --chip:rgba(7,4,13,.72);--shadow:0 8px 30px rgba(29,20,52,.12);
  --strip-bg:#16131C;--strip-fg:#fff;--strip-block:#fff;--strip-block-fg:#16131C;
  --gb-a:#07040D;--gb-b:rgba(7,4,13,.35);--tab-line:linear-gradient(75deg,rgba(7,4,13,.6),rgba(7,4,13,.2));--tab-line-on:linear-gradient(75deg,#07040D,rgba(7,4,13,.5));--fade-line:rgba(7,4,13,.75);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:150px;background:var(--bg);overflow-x:clip}
::selection{background:#E62554;color:#fff}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--text);font-size:1rem;line-height:1.5;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:clip}
img,svg,picture,canvas{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,h4{font-family:var(--display);font-weight:600;line-height:1.1;text-wrap:balance}
h1{font-size:var(--fs-h1);line-height:1}
h2{font-size:var(--fs-h2);line-height:1}
h3{font-size:var(--fs-h3);line-height:1.1}
html[lang="vi"] h1,html[lang="vi"] h2,html[lang="vi"] h3,html[lang="vi"] h4{line-height:1.22}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:4px}
.skip{position:fixed;left:1rem;top:-4rem;z-index:100;padding:.6rem 1rem;background:var(--white);color:var(--black);border-radius:6px}
.skip:focus{top:1rem}
.wrap{max-width:calc(var(--wrap) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter)}
.sec{padding-block:var(--sec)}

/* Kopf: feste Leiste für Sprache und Modus, darunter die Pill wie im Original */
.site-head{position:fixed;inset:0 0 auto;z-index:50;pointer-events:none}
.site-head>*{pointer-events:auto}
.topbar{height:32px;background:var(--strip-bg);color:var(--strip-fg)}
.strip{display:flex;justify-content:flex-end;align-items:stretch;gap:.9rem;height:100%;max-width:calc(var(--wrap) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter);font-family:var(--ui);font-weight:500;font-size:.875rem;letter-spacing:.02em}
.top-partner{display:inline-flex;align-items:center;margin-right:auto;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.top-partner:hover{text-decoration:underline;text-underline-offset:.25em}
.p-short{display:none}
@media (max-width:560px){.p-long{display:none}.p-short{display:inline}}
.langs{display:flex;align-items:center;gap:.15rem}
.langs svg,.theme svg,.li svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.li svg{width:15px;height:15px;fill:currentColor;stroke:none}
.langs svg{margin-right:.3rem}
.langs a{display:inline-flex;align-items:center;justify-content:center;align-self:stretch;min-width:32px;padding-inline:.4rem;text-decoration:none}
.langs a[aria-current]{background:var(--strip-block);color:var(--strip-block-fg)}
.langs a:not([aria-current]):hover{text-decoration:underline;text-underline-offset:.25em}
.theme{display:inline-flex;align-items:stretch;gap:.5rem;padding:0;border:0;background:none;color:inherit;cursor:pointer;font:inherit;letter-spacing:.04em;text-transform:uppercase}
.theme svg{align-self:center}
.theme span{display:inline-flex;align-items:center;padding-inline:.7rem;background:var(--strip-block);color:var(--strip-block-fg)}
.li{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;background:var(--strip-block);color:var(--strip-block-fg)}
@media (max-width:560px){.top-partner{display:none}.strip{gap:.6rem}.theme span{padding-inline:.5rem}.langs a{min-width:30px;padding-inline:.3rem}}
html[data-theme="dark"] .i-moon,html[data-theme="dark"] .t-dark,html[data-theme="light"] .i-sun,html[data-theme="light"] .t-light{display:none}
.glass-header{max-width:calc(var(--wrap) + var(--gutter)*2);margin:28px auto 0;padding-inline:var(--gutter)}
.pill{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;min-height:66px;padding:.5rem 2rem .5rem 1.1rem;border:1px solid rgba(255,255,255,0);border-radius:999px;background:rgba(7,4,13,0);box-shadow:0 8px 30px rgba(0,0,0,0);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);transition:background .35s ease,border-color .35s ease,box-shadow .35s ease,backdrop-filter .35s ease,-webkit-backdrop-filter .35s ease}
.is-scrolled-page .pill{background:var(--glass);border-color:var(--glass-line);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}
.is-scrolled-page.head-top .pill{background:rgba(7,4,13,0);border-color:rgba(255,255,255,0);box-shadow:0 8px 30px rgba(0,0,0,0);-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}
.brand{display:block;flex:none;color:#fff}
.logo{height:48px;width:auto}
.logo-w{fill:currentColor}
.is-scrolled-page .logo-w{fill:var(--logo-fill-scrolled)}
html[data-theme="light"] .is-scrolled-page:not(.head-on-color) .logo-w{fill:var(--lg)}
html[data-theme="light"] .head-on-color .logo-w{fill:#fff}
.mainnav{display:flex;align-items:center;font-family:var(--ui);font-size:1rem;line-height:1.25;color:#fff;transition:color .3s ease}
.mainnav a{position:relative;padding:13px 12px;text-decoration:none;white-space:nowrap}
.mainnav a + a::before{content:"";position:absolute;left:0;top:50%;height:16px;margin-top:-8px;width:1px;background:currentColor}
.mainnav a::after{content:"";position:absolute;left:0;right:0;bottom:-10px;height:1px;background:currentColor;opacity:0;transition:opacity .3s ease}
.mainnav a:hover::after,.mainnav a[aria-current]::after{opacity:1}
.is-scrolled-page .mainnav{color:var(--fg)}
html[data-theme="light"] .head-on-color .mainnav{color:#fff}
.kontakt-btn{display:inline-flex;align-items:center;gap:.5rem;flex:none;padding:.5rem .7rem;border:1px solid currentColor;border-radius:6px;color:#fff;font-family:var(--ui);font-weight:500;font-size:1rem;line-height:1.3;letter-spacing:1px;text-transform:uppercase;text-decoration:none;transition:background .3s ease,color .3s ease,border-color .3s ease}
.kontakt-btn svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kontakt-btn:hover{background:#fff;color:var(--black);border-color:#fff}
.is-scrolled-page .kontakt-btn{color:var(--fg)}
.is-scrolled-page .kontakt-btn:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
html[data-theme="light"] .head-on-color .kontakt-btn{color:#fff}
html[data-theme="light"] .head-on-color .kontakt-btn:hover{background:#fff;color:var(--black);border-color:#fff}
.burger{display:none;width:44px;height:44px;padding:11px 9px;border:0;background:none;cursor:pointer;color:#fff}
.burger span{display:block;height:2px;margin-block:4px;background:currentColor}
.is-scrolled-page .burger{color:var(--fg)}
html[data-theme="light"] .head-on-color .burger{color:#fff}
.mobile-menu{position:fixed;inset:0;width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:0;border:0;color:#fff;background:#07040D}
.mobile-menu::backdrop{background:#07040D}
.mobile-menu::before{content:"";position:fixed;inset:0;background:url("/img/grad-hero-dark.avif") center top/cover no-repeat;transform:rotate(180deg)}
.mm-in{position:relative;display:grid;grid-template-rows:minmax(0,1fr) auto;gap:2rem;min-height:100dvh;padding:5.25rem var(--gutter) 1.5rem}
.mm-close{position:absolute;top:1.5rem;right:1.5rem;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:none;color:#fff;cursor:pointer}
.mm-close svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round}
.mm-main{display:grid;justify-items:center;align-content:start;gap:.75rem}
.mm-nav{display:grid;justify-items:center}
.mm-nav a{padding:.35rem 1rem;font-family:var(--display);font-weight:400;font-size:1.5rem;line-height:1.3;text-decoration:none}
.mm-nav a:hover{text-decoration:underline;text-underline-offset:.25em}
.mm-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem}
.mm-tools{display:grid;gap:.7rem;justify-items:start}
.mm-langs{display:flex;flex-wrap:wrap;gap:.2rem .9rem}
.mm-langs a{padding-block:.3rem;font-size:.9375rem;font-weight:500;text-decoration:none}
.mm-langs a[aria-current]{box-shadow:inset 0 -1.5px 0 currentColor}
.mm-legal{display:grid;gap:.15rem;justify-items:end}
.mm-legal a{padding-block:.35rem;font-family:var(--display);font-size:1rem;text-decoration:none}
.mm-legal a:hover{text-decoration:underline;text-underline-offset:.25em}
@media (max-width:1260px){
  .mainnav{font-size:.9375rem}
  .mainnav a{padding-inline:9px}
  .kontakt-btn{font-size:.875rem}
}
@media (max-width:920px){
  .mainnav,.kontakt-btn{display:none}
  .burger{display:block}
  .pill{min-height:58px;padding:.35rem .5rem .35rem .9rem}
  .logo{height:40px}
  .glass-header{margin-top:14px;padding-inline:.5rem}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:2.5rem;padding:.75rem .8rem;border:1px solid transparent;border-radius:6px;font-family:var(--ui);font-weight:500;font-size:1rem;line-height:1;letter-spacing:1px;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .3s ease,color .3s ease,border-color .3s ease}
html[lang="vi"] .btn{letter-spacing:.03em}
.btn svg{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn-solid{background:#fff;color:var(--black);border-color:#fff}
.btn-solid:hover{background:var(--black);color:#fff;border-color:#fff}
.btn-line{background:transparent;color:#fff;border-color:rgba(255,255,255,.72)}
.btn-line:hover{background:#fff;color:var(--black);border-color:#fff}
html[data-theme="light"] .hero .btn-solid{background:var(--black);color:#fff;border-color:var(--black)}
html[data-theme="light"] .hero .btn-solid:hover{background:#fff;color:var(--black);border-color:#fff}
@media (max-width:560px){.btn{font-size:.875rem}}

/* Hero */
.hero{position:relative;isolation:isolate;overflow:clip;display:flex;align-items:stretch;min-height:min(100svh,1000px);border-radius:0 0 20px 20px;color:#fff;background:
  radial-gradient(62% 62% at 20% 78%,rgba(64,38,255,.62),transparent 62%),
  radial-gradient(58% 54% at 46% 80%,rgba(185,18,255,.42),transparent 58%),
  radial-gradient(58% 56% at 78% 74%,rgba(255,20,64,.56),transparent 58%),
  linear-gradient(180deg,#04010b 0%,#05010e 100%)}
html[data-theme="light"] .hero{background:
  radial-gradient(64% 82% at 8% 78%,#4200FE 0%,rgba(66,0,254,.82) 28%,rgba(66,0,254,0) 68%),
  radial-gradient(52% 58% at 46% 82%,rgba(210,21,141,.92) 0%,rgba(210,21,141,.56) 34%,rgba(210,21,141,0) 72%),
  radial-gradient(56% 60% at 80% 74%,rgba(230,37,84,.96) 0%,rgba(255,128,54,.76) 38%,rgba(255,128,54,0) 74%),
  linear-gradient(90deg,#4a00ff 0%,#7a00ff 20%,#c91793 56%,#ff4a21 86%,#ff9b73 100%)}
.hero-canvas{position:absolute;inset:0;z-index:-1;width:100%;height:100%}
.hero-in{position:relative;display:grid;grid-template-columns:minmax(0,6.6fr) minmax(0,5.4fr);align-items:center;gap:1rem;width:100%}
.hero-copy{position:relative;z-index:2;display:grid;align-content:center;gap:1rem;padding-block:150px clamp(2rem,1rem + 4vh,3.5rem)}
.hero-hello{font-family:var(--ui);font-size:clamp(1.3rem,1.05rem + 1vw,2rem);line-height:1.2}
.hero-title{font-family:var(--ui);font-weight:500;font-size:clamp(.875rem,.8rem + .3vw,1rem);line-height:1.3}
.hero h1{max-width:13em;font-size:clamp(2.3rem,1.5rem + 2.6vw,3.4rem);line-height:1.04}
@media (max-width:560px){.hero h1{font-size:clamp(1.9rem,8.9vw,2.6rem)}}
.hero-lead{max-width:34rem;font-size:clamp(1.0625rem,.95rem + .45vw,1.3rem);line-height:1.5}
.hero-cta{display:flex;flex-wrap:wrap;gap:1rem;margin-top:.5rem}
.nowrap{white-space:nowrap}
.cert-box{display:flex;align-items:center;gap:.6rem;justify-self:start;max-width:36rem;margin-top:.25rem;padding:.25rem 0;border:0;background:none;color:rgba(255,255,255,.86);text-align:left;cursor:pointer;transition:color .3s ease}
.cert-box:hover{color:#fff}
.cert-box:hover .nowrap{text-decoration:underline;text-underline-offset:3px}
.cert-box img{flex:none;width:26px;height:26px;filter:brightness(0) invert(1)}
.cert-box b{font-family:var(--ui);font-weight:600}
.cert-box > span{font-size:.8125rem;line-height:1.4}
.hero-photo{position:relative;align-self:end;justify-self:end;width:clamp(460px,55.5vw,800px);max-width:none;margin-top:6rem;margin-bottom:-80px;margin-right:calc(-7vw + .5rem)}
.hero-photo img{width:100%;height:auto;display:block}
@media (max-width:980px){
  .hero{min-height:0;border-radius:0 0 16px 16px}
  .hero-in{grid-template-columns:minmax(0,1fr);gap:0}
  .hero-copy{padding-top:6.25rem;padding-bottom:.5rem}
  .hero-photo{margin:0 calc(var(--gutter)*-.4) 0 auto;width:min(88vw,460px);justify-self:end}
}

/* Zertifikate: Seitenpanel wie im Original */
.dlg{position:fixed;inset:0 0 0 auto;width:min(800px,100vw);max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;border-radius:10px 0 0 10px;background:#07040D url("/img/bg-spotlight.avif") 0 0/cover no-repeat;color:#fff;overflow-y:auto;overscroll-behavior:contain}
html[data-theme="light"] .dlg{background:#fff;color:#16131C}
.dlg::backdrop{background:rgba(7,4,13,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.dlg-in{position:relative;display:grid;gap:1.25rem;padding:clamp(1.5rem,1rem + 2.5vw,2.5rem)}
.dlg-x{position:absolute;right:.75rem;top:.75rem;width:44px;height:44px;border:0;background:none;font-size:1.75rem;line-height:1;cursor:pointer;color:inherit}
.dlg-head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.25rem 1.1rem;align-items:center;padding-bottom:1.1rem;padding-right:2.5rem;border-bottom:1px solid var(--line-2)}
.dlg-head img{grid-row:1 / 3;width:64px;height:64px}
html[data-theme="dark"] .dlg-head img{filter:brightness(0) invert(1)}
.dlg h2{font-size:clamp(1.5rem,1.3rem + 1vw,2rem);line-height:1.1}
.dlg-sub{max-width:30em}
.dlg-intro{max-width:44em}
.cert-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.cert-card{display:grid;align-content:start;justify-items:start;gap:.6rem;padding:1.1rem .9rem}
.cert-card img{justify-self:center;width:64px;height:64px}
.cert-card b{font-family:var(--display);font-weight:600;font-size:1rem;line-height:1.2}
.cert-card a{margin-top:auto;font-size:.875rem;text-underline-offset:.2em}
.cert-ihk{grid-column:span 2;align-content:center}
.cert-ihk span{font-size:.875rem;line-height:1.4}
.dlg-mean{padding-top:1.1rem;border-top:1px solid var(--line-2)}
.dlg-mean h3{font-size:1.25rem}
.mean-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem;margin-top:1rem}
.mean-grid li{display:grid;gap:.6rem;font-size:.875rem;line-height:1.35}
.mean-grid img{width:52px;height:52px}
html[data-theme="dark"] .mean-grid img{filter:brightness(0) invert(1)}
@media (max-width:640px){
  .dlg{border-radius:0}
  .cert-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mean-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* Bausteine */
.chip{display:inline-block;padding:.45rem .6rem;border:1px solid var(--chip);border-radius:4px;font-family:var(--ui);font-weight:500;font-size:.8rem;line-height:1;letter-spacing:2px;text-transform:uppercase;color:var(--fg)}
html[lang="vi"] .chip{letter-spacing:.06em}
html[data-theme="light"] .hl{background:var(--grad-text);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="light"] .hl::selection{-webkit-text-fill-color:#fff}
.fade-left{position:relative;padding-left:1.25rem}
.fade-left::before{content:"";position:absolute;left:0;top:0;bottom:8px;width:2px;border-radius:2px;background:linear-gradient(to bottom,transparent 0%,var(--fade-line) 20%,var(--fade-line) 80%,transparent 100%)}
.tags{display:flex;flex-wrap:wrap;gap:.5rem}
.tags li{padding:.4rem .55rem;border:1px solid var(--chip);border-radius:4px;font-family:var(--ui);font-weight:500;font-size:.75rem;line-height:1;letter-spacing:1.6px;text-transform:uppercase}
html[lang="vi"] .tags li{letter-spacing:.05em}

/* Orchestrator */
.orch{background:linear-gradient(-10deg,var(--bg) 25%,color-mix(in srgb,var(--violet) 70%,var(--bg)) 50%,var(--bg) 75%);padding-block:clamp(5rem,4rem + 6vw,9rem) 0}
html[data-theme="light"] .orch{background:var(--bg)}
.orch-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(2rem,6vw,5.5rem);align-items:start}
.orch-left{position:sticky;top:clamp(150px,27vh,250px);display:grid;gap:1.25rem;justify-items:start;padding-bottom:3rem}
.orch-left p{max-width:27em;font-size:clamp(1.0625rem,1rem + .35vw,1.2rem)}
.orch-points{display:grid;gap:clamp(7rem,28vh,13rem);padding-block:clamp(2rem,12vh,7rem) clamp(3rem,14vh,8rem)}
.orch-points li{display:grid;gap:.75rem}
.orch-kicker{font-family:var(--ui);font-weight:500;font-size:.8rem;line-height:1;letter-spacing:2px;text-transform:uppercase;color:var(--fg-3)}
html[lang="vi"] .orch-kicker{letter-spacing:.06em}
.orch-points h3{display:flex;align-items:flex-start;gap:.6rem;font-size:var(--fs-h3)}
.orch-points .bullet{flex:none;width:2.25rem;height:2.25rem;margin-top:-.1rem}
html[data-theme="light"] .bullet .logo-w{fill:var(--lg)}
.orch-points .fade-left{margin-left:.85rem}
@media (max-width:860px){
  .orch-in{grid-template-columns:minmax(0,1fr)}
  .orch-left{position:static;padding-bottom:0}
  .orch-points{padding-top:2rem;padding-bottom:3rem;gap:5rem}
}

/* Karte */
.btn-grad{background:linear-gradient(90deg,var(--grape),var(--magenta));color:#fff;border:0}
.btn-grad:hover{background:linear-gradient(90deg,var(--blue),var(--grape) 40%,var(--magenta))}
.karte{--bus-a:#D2158D;--node-bg:#17121F;--node-line:#4A4655;--node-fg:#fff;--wire:#fff;--wire-o:.46;--cab:rgba(255,255,255,.035);background:var(--bg)}
html[data-theme="light"] .karte{--bus-a:#4200FE;--node-bg:#fff;--node-line:rgba(7,4,13,.28);--node-fg:#16131C;--wire:#16131C;--wire-o:.4;--cab:#F8F5FB}
.karte-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:1rem clamp(1.5rem,4vw,4rem);align-items:end}
.karte-head h2{margin-top:.9rem}
.karte-head>p{color:var(--fg-2);max-width:32em}
.k-switches{display:flex;flex-wrap:wrap;gap:.75rem 1.5rem;align-items:center;justify-content:space-between;margin-top:clamp(1.75rem,1.2rem + 2vw,2.75rem)}
.k-left{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem clamp(1rem,2.5vw,2.25rem)}
.seg{display:inline-flex;padding:3px;border:1px solid var(--line);border-radius:8px;background:var(--cab)}
.seg label{position:relative;display:block;cursor:pointer}
.seg input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.seg span{display:block;padding:.42rem clamp(.7rem,.5rem + .8vw,1.1rem);border-radius:5px;font-family:var(--ui);font-weight:500;font-size:.8125rem;color:var(--fg-2);white-space:nowrap;transition:background .18s ease,color .18s ease}
.seg input:checked + span{background:var(--fg);color:var(--bg)}
.seg input:focus-visible + span{outline:2px solid var(--orange);outline-offset:2px}
.seg-main input:checked + span{background:linear-gradient(90deg,var(--grape),var(--magenta));color:#fff}
.lens{display:flex;align-items:center;gap:.6rem;font-size:.8125rem;color:var(--fg-3)}
.readout{display:flex;gap:clamp(.9rem,2vw,1.6rem);font-size:.8125rem;line-height:1.25;color:var(--fg-2)}
.readout>span{display:flex;align-items:baseline;gap:.4rem}
.readout b{font-family:var(--display);font-weight:600;font-size:clamp(1.3rem,1.1rem + .9vw,1.75rem);line-height:1.1;letter-spacing:-.02em;color:var(--fg);font-variant-numeric:tabular-nums}
.k-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,21rem);gap:clamp(1rem,2vw,1.5rem);margin-top:1rem;align-items:start}
.k-main{min-width:0;display:grid;gap:1rem}
.board{position:relative;width:100%;aspect-ratio:16/11;border:1px solid var(--line);border-radius:var(--radius);background:var(--cab);overflow:hidden}
.wires{position:absolute;inset:0;width:100%;height:100%}
.wire{fill:none;stroke:var(--wire);stroke-opacity:var(--wire-o);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.bus{fill:none;stroke:url(#busg);stroke-width:3;stroke-linecap:round}
.drop{fill:none;stroke:var(--wire);stroke-opacity:.82;stroke-width:1.4}
.dot{fill:var(--orange)}
.node{position:absolute;left:0;top:0;display:inline-flex;align-items:center;gap:.4rem;min-height:1.95rem;padding:.22rem .6rem;border:1px solid var(--node-line);border-radius:6px;background:var(--node-bg);color:var(--node-fg);font-family:var(--text);font-weight:550;font-size:.78rem;line-height:1.15;white-space:nowrap;cursor:pointer;will-change:transform;transition:background .15s ease,color .15s ease,border-color .15s ease,opacity .35s ease}
.node:hover{border-color:var(--fg)}
.node[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.node.retired{opacity:.5;border-style:dashed;text-decoration:line-through;text-decoration-color:var(--orange)}
.node-hub{z-index:2;min-height:2.6rem;padding:.3rem .85rem .3rem .55rem;font-family:var(--display);font-weight:600;font-size:.875rem;border:1.5px solid transparent;background:linear-gradient(var(--node-bg),var(--node-bg)) padding-box,linear-gradient(90deg,var(--bus-a),var(--orange)) border-box}
.node-hub .logo{height:26px}
html[data-theme="light"] .node-hub .logo-w{fill:var(--lg)}
.picker{margin:0;padding:0;border:0;min-width:0}
.picker legend{padding:0;margin-bottom:.5rem;font-family:var(--display);font-weight:600;font-size:1rem}
.k-chips{display:flex;flex-wrap:wrap;gap:.35rem}
.k-chip{position:relative;display:block;cursor:pointer}
.k-chip input{position:absolute;inset:0;margin:0;opacity:0;cursor:pointer}
.k-chip span{display:block;padding:.26rem .6rem;border:1px solid var(--line-2);border-radius:5px;font-size:.78rem;font-weight:500;color:var(--fg-2);transition:background .15s ease,color .15s ease}
.k-chip input:checked + span{background:var(--fg);border-color:var(--fg);color:var(--bg)}
.k-chip input:focus-visible + span{outline:2px solid var(--orange);outline-offset:2px}
.k-side{display:grid;gap:1rem;min-width:0}
.k-panel{padding:1.1rem 1.15rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--cab)}
.k-panel h3{font-size:1.0625rem;letter-spacing:-.01em}
.k-inspect{min-height:8.5rem;display:grid;align-content:start;gap:.35rem}
.k-inspect p{font-size:.9rem;line-height:1.5;color:var(--fg-2)}
.k-state{font-size:.8125rem!important;color:var(--orange)!important}
html[data-theme="light"] .k-state{color:#A83400!important}
.finds{display:grid;gap:.75rem;margin-top:.7rem}
.finds li{display:grid;gap:.1rem;padding-top:.65rem;border-top:1px solid var(--line)}
.when{font-family:var(--display);font-weight:600;font-size:.875rem;color:var(--orange)}
html[data-theme="light"] .when{color:#A83400}
.when.quiet{color:var(--fg-3);font-weight:500}
.finds p{font-size:.875rem;line-height:1.45;color:var(--fg-2)}
.k-cta{display:grid;gap:.55rem;margin-top:.9rem}
.k-cta .btn{width:100%}
.k-more[hidden]{display:none}
.k-more{justify-self:start;padding:0;border:0;background:none;color:var(--fg-2);font-size:.8125rem;text-decoration:underline;text-underline-offset:.2em;cursor:pointer;display:inline-flex;align-items:center;min-height:24px}
.k-privacy{font-size:.75rem;line-height:1.45;color:var(--fg-3)}
@media (max-width:1040px){
  .karte-head,.k-grid{grid-template-columns:minmax(0,1fr)}
  .k-side{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .k-side{grid-template-columns:minmax(0,1fr)}
  .board{aspect-ratio:auto;height:600px}
  .k-inspect{min-height:0}
}

/* Allgemeine Abschnitte */
.sec-lead{margin-top:1rem;max-width:36em;font-size:clamp(1.0625rem,1rem + .35vw,1.2rem)}
.leist h2,.belege h2{margin-top:1rem}
.grad-border{position:relative;border-radius:var(--radius);isolation:isolate;--gb1:var(--gb-a);--gb2:var(--gb-b)}
.grad-border.on-grad{--gb1:#fff;--gb2:rgba(255,255,255,.35)}
.grad-border::before{content:"";position:absolute;inset:0;z-index:-1;padding:1px;border-radius:inherit;background:linear-gradient(70deg,var(--gb1) 39%,var(--gb2) 100%);pointer-events:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
html[data-theme="light"] .grad-border::before{padding:1.5px}
.plus{display:grid;gap:.4rem}
.plus li{position:relative;padding-left:1.4rem}
.plus li::before{content:"+";position:absolute;left:0;top:-.02em;font-weight:500}
.arrows{display:grid;gap:.4rem}
.arrows li{position:relative;padding-left:1.4rem;font-size:.9rem;line-height:1.5}
.arrows li::before{content:"→";position:absolute;left:0}

/* Leistungen */
.leist{background:var(--bg)}
.tabs{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(1.5rem,4vw,3.5rem);margin-top:clamp(2rem,1.2rem + 3vw,3.5rem);align-items:start}
.tab-side{display:grid;gap:clamp(2rem,1.5rem + 2vw,3rem)}
.tab-list{display:grid}
.tab-list button{position:relative;padding:1rem 0;border:0;background:none;font-family:var(--display);font-weight:500;font-size:1.1rem;line-height:1.5;letter-spacing:.2px;text-align:left;color:var(--fg-3);cursor:pointer;transition:color .28s ease}
.tab-list button:hover,.tab-list button[aria-selected="true"]{color:var(--fg)}
.tab-list button::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;z-index:1;pointer-events:none;background:var(--tab-line);transition:background .28s ease,opacity .28s ease}
.tab-list button[aria-selected="true"]::after{background:var(--tab-line-on)}
.tab-list button::before{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;z-index:2;pointer-events:none;opacity:0;transition:opacity .22s ease,filter .28s ease;background:radial-gradient(90px 100% at var(--tab-x,50%) 50%,rgba(var(--tab-rgb,66,0,254),1) 0%,rgba(var(--tab-rgb,66,0,254),.96) 18%,rgba(var(--tab-rgb,66,0,254),.62) 46%,rgba(var(--tab-rgb,66,0,254),.14) 78%,rgba(var(--tab-rgb,66,0,254),0) 100%);filter:drop-shadow(0 1px 3px rgba(var(--tab-rgb,66,0,254),.55)) drop-shadow(0 3px 8px rgba(var(--tab-rgb,66,0,254),.18))}
.tab-list button.is-glow::before{opacity:1}
.kosten{display:grid;justify-items:start;gap:.8rem;color:var(--fg-3);transition:color .3s ease}
.kosten .chip{color:inherit;border-color:currentColor;transition:color .3s ease}
.kosten:hover{color:var(--fg)}
.tab-panel{display:grid;gap:1rem;padding:clamp(1.25rem,1rem + 1.5vw,2rem)}
.tab-panel[hidden]{display:none}
.tab-panel h3{padding-bottom:.8rem;border-bottom:1px solid var(--line-2)}
.tab-focus{font-size:clamp(1.0625rem,1rem + .35vw,1.2rem)}
.tab-focus b{font-weight:600}
.pillars-h{margin-top:clamp(3.5rem,2.5rem + 3vw,5rem)}
.pillars{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:1.25rem}
.pillars li{display:grid;align-content:start;gap:.6rem;padding:1.25rem;transition:translate .4s ease}
.pillars li:hover{translate:0 -5px}
.pillars h4{font-size:1.25rem;line-height:1.15}
@media (max-width:860px){.tabs{grid-template-columns:minmax(0,1fr)}.pillars{grid-template-columns:minmax(0,1fr)}}

/* Vorgehen: Verlauf, darauf Glas-Karten */
.vorgehen{position:relative;color:#fff;padding-block:clamp(5rem,4rem + 6vw,9rem) clamp(8rem,6rem + 9vw,14rem);background:#07040D url("/img/grad-long-dark.avif") 0 0/cover no-repeat;isolation:isolate}
.vorgehen::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,4,13,0) 71%,#07040D 100%)}
html[data-theme="light"] .vorgehen{background:#fff url("/img/grad-long-light-b.avif") center/cover no-repeat}
html[data-theme="light"] .vorgehen::before{background:linear-gradient(90deg,rgba(40,0,160,.2) 0%,rgba(115,0,105,.48) 52%,rgba(140,10,40,.74) 100%);-webkit-mask-image:linear-gradient(180deg,#000 76%,transparent 97%);mask-image:linear-gradient(180deg,#000 76%,transparent 97%)}
.vorg-head{display:grid;justify-items:center;gap:1rem;text-align:center}
.vorgehen .chip{color:#fff;border-color:rgba(255,255,255,.72)}
.flow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:clamp(2rem,1.4rem + 2.4vw,3.25rem)}
.flow-card{display:grid;align-content:start;gap:.7rem;padding:2rem 1.1rem 1.25rem;overflow:hidden;background:linear-gradient(135deg,rgba(0,0,0,.10) 0%,rgba(0,0,0,.30) 22%,rgba(0,0,0,.20) 48%,rgba(0,0,0,.40) 72%);-webkit-backdrop-filter:blur(18px) saturate(115%);backdrop-filter:blur(18px) saturate(115%)}
html[data-theme="light"] .flow-card{background:linear-gradient(135deg,rgba(255,255,255,.04) 0%,rgba(255,255,255,.09) 22%,rgba(255,255,255,.05) 48%,rgba(255,255,255,.1) 72%)}
.flow-card img{width:64px;height:64px;filter:brightness(0) invert(1)}
.flow-card h3{margin-top:.5rem;font-size:clamp(1.35rem,1.2rem + .5vw,1.6rem)}
.flow-sub{font-family:var(--display);font-weight:500;margin-top:-.25rem}
.flow-label{justify-self:start;margin-top:.5rem;padding:.4rem .55rem;border:1px solid rgba(255,255,255,.72);border-radius:4px;font-family:var(--ui);font-weight:500;font-size:.75rem;line-height:1;letter-spacing:2px;text-transform:uppercase}
html[lang="vi"] .flow-label{letter-spacing:.06em}
.flow-res{font-weight:550}
@media (max-width:900px){.flow{grid-template-columns:minmax(0,1fr)}}

/* Erfahrung: Spotlight, Karussell mit weichen Rändern */
.belege{position:relative;padding-block:clamp(4rem,3rem + 4vw,6rem);background:#07040D url("/img/bg-spotlight.avif") bottom center/cover no-repeat;isolation:isolate}
.belege::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.7;background:linear-gradient(180deg,#07040D 0%,rgba(7,4,13,0) 57%)}
html[data-theme="light"] .belege{background:var(--bg)}
html[data-theme="light"] .belege::before{display:none}
.bel-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:1rem clamp(1.5rem,4vw,4rem);align-items:end}
.car{position:relative;margin-top:clamp(2rem,1.2rem + 3vw,3.5rem)}
.car-view{-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 10%,#000 90%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 10%,#000 90%,rgba(0,0,0,0) 100%)}
.car-track{display:grid;grid-auto-flow:column;grid-auto-columns:min(80%,56rem);gap:15px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:10%;scrollbar-width:none;padding-block:2px;padding-inline:10%}
.car-track::-webkit-scrollbar{display:none}
.case{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);padding:clamp(1.25rem,1rem + 1.5vw,2rem);scroll-snap-align:start;background:color-mix(in srgb,var(--bg) 62%,transparent)}
.case-l{display:grid;align-content:start;gap:1rem}
.case-l h3{padding-bottom:.8rem;border-bottom:1px solid var(--line-2)}
.case-r{display:grid;align-content:start;gap:.5rem}
.case-r h4{font-size:1.5rem;line-height:1.1;margin-top:.75rem}
.case-r h4:first-child{margin-top:0}
.tags-m{margin-top:.2rem}
.car-nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin-top:.8rem}
.car-dots{grid-column:2;display:flex;gap:.1rem}
.car-dots button{display:grid;place-items:center;width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer;color:var(--fg)}
.car-dots button::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;opacity:.35;transition:opacity .2s ease}
.car-dots button[aria-current="true"]::before{opacity:1}
.car-arrows{grid-column:3;justify-self:end;display:flex;gap:.25rem}
.car-arrows button{display:grid;place-items:center;width:44px;height:44px;border:0;background:none;cursor:pointer;color:var(--fg);opacity:.7;transition:opacity .2s ease}
.car-arrows button:hover{opacity:1}
.car-arrows svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem clamp(1rem,2.5vw,2rem);margin-top:clamp(2rem,1.5rem + 2vw,3rem);padding-top:1.5rem;border-top:1px solid var(--line)}
.stats div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:.35rem}
.stats dd{font-family:var(--display);font-weight:600;font-size:clamp(1.5rem,1.2rem + 1.2vw,2.2rem);line-height:1.1}
.stats dt{font-size:.9375rem;line-height:1.4}
.badges{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.25rem;margin-top:clamp(1.75rem,1.2rem + 2vw,2.5rem)}
.badges img{width:86px;height:86px}
.badges a{display:block;transition:transform .2s ease}
.badges a:hover{transform:translateY(-3px)}
.badge-ihk{display:grid;gap:.1rem;padding-left:1.25rem;border-left:1px solid var(--line);font-size:.9375rem}
.badge-ihk b{font-family:var(--display);font-weight:600;font-size:1.0625rem;color:var(--fg)}
@media (max-width:860px){
  .bel-head,.case{grid-template-columns:minmax(0,1fr)}
  .stats{grid-template-columns:minmax(0,1fr)}
  .car-view{-webkit-mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 5%,#000 95%,rgba(0,0,0,0) 100%);mask-image:linear-gradient(to right,rgba(0,0,0,0) 0%,#000 5%,#000 95%,rgba(0,0,0,0) 100%)}
  .car-track{grid-auto-columns:88%;padding-inline:5%;scroll-padding-inline:5%}
  .badge-ihk{padding-left:0;border-left:0}
}

/* Über mich und Stack: eine Bühne */
.ueber-stage{position:relative;color:#fff;background:#07040D url("/img/bg-about.avif") 0 0/cover no-repeat;isolation:isolate}
.ueber-stage::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,4,13,0) 75%,#07040D 100%)}
html[data-theme="light"] .ueber-stage{background:#fff url("/img/grad-about-light.avif") center/cover no-repeat}
html[data-theme="light"] .ueber-stage::before{background:linear-gradient(90deg,rgba(84,30,235,.62) 0%,rgba(66,0,254,.34) 45%,rgba(66,0,254,.06) 100%);-webkit-mask-image:linear-gradient(180deg,#000 90%,transparent 100%);mask-image:linear-gradient(180deg,#000 90%,transparent 100%)}
.ueber-stage .chip,.ueber-stage .tags li{color:#fff;border-color:rgba(255,255,255,.72)}
.ueber{display:grid;grid-template-columns:minmax(0,490px) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:center;padding-top:clamp(5rem,4rem + 5vw,8.5rem)}
.ueber-photo{position:relative}
.ueber-photo img{width:100%;height:auto;aspect-ratio:490/602;object-fit:cover;border-radius:var(--radius)}
.ueber-photo .tags{position:absolute;left:.9rem;right:.9rem;bottom:.9rem}
.ueber-photo .tags li{background:rgba(7,4,13,.4);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.ueber-copy{display:grid;gap:1.1rem;justify-items:start}
.ueber-copy>p{max-width:30em;font-size:clamp(1.0625rem,1rem + .35vw,1.2rem)}
.ueber-btns{display:grid;gap:.75rem;justify-items:stretch;justify-self:end;margin-top:.3rem;width:min(100%,24rem)}
.ueber-knot{display:flex;align-items:center;gap:.8rem;margin-top:.5rem;padding-top:.9rem;border-top:1px solid rgba(255,255,255,.3);font-size:.9375rem!important}
.ueber-knot .logo{flex:none;width:2.4rem;height:2.4rem}
.stack{display:grid;gap:1rem;justify-items:start;padding-top:clamp(4rem,3rem + 5vw,7.5rem);padding-bottom:clamp(5rem,4rem + 6vw,9rem)}
.stack h2{font-size:var(--fs-h3);line-height:1.1}
.stack-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;width:100%;margin-top:1rem}
.stack-card{display:grid;align-content:start;gap:.9rem;padding:1.5rem 1.25rem;transition:translate .4s ease}
.stack-card:hover{translate:0 -8px}
.stack-card h3{font-size:clamp(1.3rem,1.15rem + .5vw,1.5rem)}
@media (max-width:900px){
  .ueber{grid-template-columns:minmax(0,1fr)}
  .stack-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:560px){.stack-grid{grid-template-columns:minmax(0,1fr)}}

/* Was mich antreibt */
.drive{position:relative;background:#07040D url("/img/bg-spotlight.avif") top center/cover no-repeat;isolation:isolate}
.drive::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,4,13,0) 0%,#07040D 95%)}
html[data-theme="light"] .drive{background:var(--bg)}
html[data-theme="light"] .drive::before{display:none}
.drive-head{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:1rem clamp(1.5rem,4vw,4rem);align-items:start}
.drive-head h2{font-size:var(--fs-h3);line-height:1.1}
.drive-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;margin-top:clamp(2rem,1.5rem + 2.5vw,3.5rem)}
.drive-card{display:grid;align-content:start;gap:.7rem;padding:1.5rem 1.25rem;transition:translate .4s ease}
.drive-card:hover{translate:0 -8px}
.drive-card img{width:64px;height:64px}
html[data-theme="dark"] .drive-card img{filter:brightness(0) invert(1)}
.drive-card h3{margin-top:.4rem;font-size:clamp(1.3rem,1.15rem + .5vw,1.5rem)}
.drive-card.wide{grid-column:1 / -1;justify-self:center;width:min(100%,46rem)}
.btn-fg{justify-self:end;margin-top:.5rem;background:var(--fg);color:var(--bg);border-color:var(--fg)}
.btn-fg:hover{background:transparent;color:var(--fg)}
@media (max-width:860px){
  .drive-head{grid-template-columns:minmax(0,1fr)}
  .drive-grid{grid-template-columns:minmax(0,1fr)}
  .btn-fg{justify-self:start}
}

/* FAQ */
.faq{position:relative;padding-block:clamp(4rem,3rem + 5vw,8rem);background:#07040D url("/img/bg-faq.avif") top center/cover no-repeat;isolation:isolate}
.faq::before{content:"";position:absolute;inset:0;z-index:-1;opacity:.64;background:linear-gradient(180deg,rgba(7,4,13,0) 0%,#07040D 76%)}
html[data-theme="light"] .faq{background:var(--bg)}
html[data-theme="light"] .faq::before{display:none}
.faq-in{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.faq-left{position:sticky;top:10rem;display:grid;gap:1rem;justify-items:start}
.faq-list details{position:relative}
.faq-list details::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(to right,var(--gb-a) 0%,color-mix(in srgb,var(--gb-a) 30%,transparent) 100%)}
.faq-list details:last-child::after{display:none}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem;font-family:var(--display);font-weight:400;font-size:1.1rem;line-height:1.5;letter-spacing:.3px;cursor:pointer;list-style:none;color:var(--fg-3);transition:color .3s ease-in-out}
.faq-list summary:hover,.faq-list details[open] summary{color:var(--fg)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";flex:none;font-size:1.5rem;line-height:1;font-weight:300}
.faq-list details[open] summary::after{content:"−"}
.faq-list p{padding:.25rem 1rem 1.25rem;max-width:46em}
@media (max-width:860px){.faq-in{grid-template-columns:minmax(0,1fr)}.faq-left{position:static}}

/* Footer-CTA */
.c2a{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:max(100svh,700px);color:#fff;background:#07040D url("/img/grad-hero-dark.avif") center/cover no-repeat;isolation:isolate}
html[data-theme="light"] .c2a{background:#4a00ff url("/img/grad-hero-light.avif") center/cover no-repeat}
html[data-theme="light"] .c2a::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 42%,rgba(70,0,150,.52) 68%,rgba(50,0,120,.74) 100%)}
html[data-theme="light"] .c2a-plain::before{background:rgba(60,0,130,.62)}
.c2a-plain{min-height:0}
.c2a-cta{display:grid;justify-items:center;align-content:center;flex:1;gap:1rem;width:100%;padding-top:clamp(8rem,7rem + 5vw,11rem);padding-bottom:clamp(3rem,2.5rem + 3vw,5rem);text-align:center}
.c2a-eyebrow{font-family:var(--ui);font-size:clamp(1.15rem,1rem + .7vw,1.5rem);line-height:1.3}
.c2a-cta h2{max-width:15em;font-size:clamp(2.2rem,1.6rem + 2.4vw,3.4rem)}
.btn-avatar{display:inline-flex;align-items:center;gap:.9rem;margin-top:.75rem;padding:.3rem .35rem .3rem 1.25rem;border-radius:6px;background:#fff;color:var(--black);font-family:var(--ui);font-weight:500;font-size:clamp(1rem,.95rem + .3vw,1.2rem);letter-spacing:2px;text-transform:uppercase;text-decoration:none;transition:transform .3s ease}
html[lang="vi"] .btn-avatar{letter-spacing:.05em}
.btn-avatar:hover{transform:scale(1.1)}
.btn-avatar img{width:48px;height:48px;border-radius:5px}
.c2a-foot{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:1.5rem clamp(2rem,6vw,5rem);width:100%;padding-top:1.5rem;padding-bottom:1.75rem}
.c2a-brand{display:grid;gap:.75rem;justify-items:start}
.c2a-brand p{font-size:.9rem;max-width:22em}
.c2a-title{opacity:.9;font-size:.8125rem!important}
.c2a-foot nav{display:grid;gap:.1rem;align-content:start;font-size:.9rem}
.c2a-foot nav h2{margin-bottom:.6rem;font-family:var(--ui);font-weight:600;font-size:.9rem;line-height:1;letter-spacing:2px;text-transform:uppercase}
.c2a-foot nav a{display:block;padding-block:.3rem;min-height:24px;text-decoration:none}
.c2a-foot nav a:hover{text-decoration:underline;text-underline-offset:.2em}
.c2a-note{grid-column:1 / -1;padding-top:.9rem;border-top:1px solid rgba(255,255,255,.22);font-size:.8125rem}
@media (max-width:640px){.c2a-foot{grid-template-columns:repeat(2,minmax(0,1fr))}.c2a-brand{grid-column:1 / -1}}

/* Unterseiten */
.page-hero{position:relative;color:#fff;background:#07040D url("/img/grad-hero-dark.avif") center top/cover no-repeat;border-radius:0 0 20px 20px;isolation:isolate;overflow:clip}
.page-hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,4,13,.2),rgba(7,4,13,.35))}
html[data-theme="light"] .page-hero{background:#4a00ff url("/img/grad-long-light-b.avif") center/cover no-repeat}
html[data-theme="light"] .page-hero::after{background:rgba(29,10,60,.26)}
.page-hero .chip{color:#fff;border-color:rgba(255,255,255,.72)}
.page-hero-in{display:grid;gap:1rem;justify-items:start;padding-top:clamp(9.5rem,8rem + 5vw,12rem);padding-bottom:clamp(3rem,2.4rem + 3vw,5rem)}
.page-hero.compact .page-hero-in{padding-bottom:clamp(2rem,1.6rem + 2vw,3rem)}
.page-hero h1{max-width:17em}
.page-lead{max-width:36em;font-size:clamp(1.0625rem,1rem + .3vw,1.2rem);line-height:1.5}
.kontakt-stage{position:relative;color:#fff;background:#07040D url("/img/bg-about.avif") 0 0/cover no-repeat;border-radius:0 0 20px 20px;overflow:clip;isolation:isolate}
html[data-theme="light"] .kontakt-stage{background:#4a00ff url("/img/grad-about-light.avif") center/cover no-repeat}
html[data-theme="light"] .kontakt-stage::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(84,30,235,.72) 0%,rgba(66,0,254,.5) 55%,rgba(66,0,254,.06) 100%)}
.kontakt-stage .chip{color:#fff;border-color:rgba(255,255,255,.72)}
.kontakt{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,490px);gap:clamp(2rem,5vw,4.5rem);align-items:start;padding-top:clamp(9rem,8rem + 4vw,11.5rem);padding-bottom:clamp(4rem,3rem + 4vw,7rem)}
.kontakt-main{display:grid;gap:1rem;justify-items:start;min-width:0}
.kontakt-main h1{font-size:var(--fs-h2)}
.kontakt-sub{font-family:var(--display);font-weight:500;font-size:clamp(1.25rem,1.1rem + .8vw,1.75rem);line-height:1.25}
.kontakt-lead{max-width:34em;font-size:clamp(1.0625rem,1rem + .3vw,1.2rem);line-height:1.5}
.kontakt-side{position:sticky;top:130px;display:grid;gap:.35rem}
.kontakt-side img{width:100%;height:auto;aspect-ratio:490/620;object-fit:cover;object-position:50% 25%;border-radius:var(--radius);margin-bottom:.75rem}
.kontakt-side a{font-family:var(--display);font-weight:600;font-size:1.0625rem;text-decoration:none}
.kontakt-side a:hover{text-decoration:underline;text-underline-offset:.2em}
.kontakt-direct{font-size:.875rem}
.kform{display:grid;gap:.85rem;width:100%;margin-top:.5rem}
.kform label{display:grid;gap:.3rem;font-family:var(--ui);font-weight:500;font-size:.75rem;letter-spacing:1.6px;text-transform:uppercase}
html[lang="vi"] .kform label{letter-spacing:.05em}
.kform input,.kform select,.kform textarea{width:100%;min-height:2.75rem;padding:.55rem .75rem;border:1px solid rgba(255,255,255,.6);border-radius:6px;background:#fff;color:var(--black);font-family:var(--text);font-size:1rem;letter-spacing:0;text-transform:none}
.kform textarea{resize:vertical;min-height:8.5rem;line-height:1.45}
.kform ::placeholder{color:#5c5868;opacity:1}
.kform input:focus,.kform select:focus,.kform textarea:focus{outline:2px solid #fff;outline-offset:2px}
.kform .btn{justify-self:start;min-width:12rem;margin-top:.35rem}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.k-status{padding:.55rem .7rem;border:1px solid rgba(255,255,255,.72);border-radius:6px;font-size:.9375rem}
.k-note{font-size:.8125rem}
.k-note a{display:inline-block;min-height:24px;padding-block:.15rem;text-underline-offset:.2em}
@media (max-width:900px){.kontakt{grid-template-columns:minmax(0,1fr)}.kontakt-side{position:static}.kontakt-side img{aspect-ratio:4/3;object-position:50% 18%}}
@media (max-width:520px){.k2{grid-template-columns:minmax(0,1fr)}}
.cv-hero{position:relative;color:#fff;background:#07040D url("/img/grad-long-dark.avif") 0 0/cover no-repeat;border-radius:0 0 20px 20px;overflow:clip;isolation:isolate}
html[data-theme="light"] .cv-hero{background:#4a00ff url("/img/grad-long-light-b.avif") center/cover no-repeat}
html[data-theme="light"] .cv-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(40,0,160,.2) 0%,rgba(115,0,105,.48) 52%,rgba(140,10,40,.74) 100%)}
.cv-hero .chip,.cv-hero .tags li{color:#fff;border-color:rgba(255,255,255,.72)}
.cv-hero .ueber-photo .tags li{background:rgba(7,4,13,.58)}
.cv-hero-in{display:grid;grid-template-columns:minmax(0,490px) minmax(0,1fr);gap:clamp(1.5rem,5vw,4.5rem);align-items:center;padding-top:clamp(8.5rem,7.5rem + 4vw,11rem);padding-bottom:clamp(3rem,2.4rem + 3vw,5rem)}
.cv-hero-copy{display:grid;gap:1rem;justify-items:start}
.cv-hero h1{font-size:clamp(1.9rem,1.5rem + 1.6vw,2.5rem)}
.cv-hero h1 span{display:block}
.cv-place{font-family:var(--ui);font-size:.9375rem;line-height:1.4}
@media (max-width:900px){.cv-hero-in{grid-template-columns:minmax(0,1fr)}.cv-hero-copy{order:-1}}
.cv-btns{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:.3rem}
.cv-sec{padding-top:clamp(3rem,2.4rem + 3vw,5rem)}
.cv-sec:last-of-type{padding-bottom:var(--sec)}
.cv-sec>h2{margin-top:.9rem;font-size:clamp(1.75rem,1.3rem + 1.8vw,2.6rem)}
.cv-profile{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.cv-profile h2{margin-block:.9rem;font-size:clamp(1.75rem,1.3rem + 1.8vw,2.6rem)}
.cv-profile p{color:var(--fg-2);margin-bottom:.75rem}
.cv-photo img{width:100%;height:auto;border-radius:var(--radius)}
.cv-values{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem;margin-top:.75rem}
.cv-values li{padding:.5rem .7rem;border:1px solid var(--line);border-radius:6px;font-size:.875rem;font-weight:550}
.tl{display:grid;margin-top:1.25rem;border-top:1px solid var(--line)}
.tl>li{display:grid;grid-template-columns:minmax(8rem,11rem) minmax(0,1fr);gap:.25rem 1.5rem;padding-block:1.05rem;border-bottom:1px solid var(--line)}
.tl-when{font-family:var(--ui);font-size:.8125rem;color:var(--fg-3);padding-top:.15rem}
.tl h3{font-size:1.1875rem}
.tl-role{margin-top:.1rem;margin-bottom:.45rem;color:var(--fg-2);font-weight:550;font-size:.9375rem}
.tl .arrows li{color:var(--fg-2)}
.cv-tech{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(1.5rem,4vw,3rem);margin-top:1.1rem}
.cv-tech div{padding-block:.6rem;border-top:1px solid var(--line)}
.cv-tech dt{font-family:var(--display);font-weight:600;font-size:.9375rem}
.cv-tech dd{font-size:.875rem;color:var(--fg-2)}
@media (max-width:760px){.cv-profile,.cv-tech{grid-template-columns:minmax(0,1fr)}.tl>li{grid-template-columns:minmax(0,1fr)}}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(1.5rem,4vw,3rem);border-top:1px solid var(--line)}
.facts div{display:grid;grid-template-columns:minmax(7rem,9.5rem) minmax(0,1fr);gap:.1rem 1rem;padding-block:.7rem;border-bottom:1px solid var(--line);font-size:.9375rem}
.facts dt{color:var(--fg-3)}
.facts dd{font-weight:500}
.partner-btns{display:flex;flex-wrap:wrap;gap:.65rem;margin-top:1.5rem}
.btn-ghost{background:transparent;color:var(--fg);border-color:var(--line-2)}
.btn-ghost:hover{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.partner-h{margin-top:clamp(2.5rem,2rem + 3vw,4rem);font-size:clamp(1.6rem,1.3rem + 1.4vw,2.3rem)}
.partner-list{margin-top:.9rem;max-width:44em}
@media (max-width:760px){.facts{grid-template-columns:minmax(0,1fr)}}
.legal-page{padding-top:clamp(9rem,8rem + 4vw,11.5rem);background:#07040D url("/img/bg-spotlight.avif") top center/cover no-repeat}
html[data-theme="light"] .legal-page{background:var(--bg)}
.legal{display:grid;gap:1.5rem;padding-bottom:var(--sec)}
.legal>*{max-width:46rem}
.legal h1{font-size:var(--fs-h2)}
.legal h2{font-size:1.25rem;margin-bottom:.35rem}
.legal p{color:var(--fg-2);font-size:1rem}

/* Lebenslauf als PDF und Ausdruck: reiner Text, eine Spalte, ATS-tauglich */
.print-only{display:none}
@media print{
  *{animation:none!important;transition:none!important}
  @page{size:A4;margin:16mm 16mm 15mm}
  html,body{background:#fff!important;color:#000!important;font-size:10pt;line-height:1.38}
  html{--fg:#000;--fg-2:#222;--fg-3:#444;--line:#bbb;--bg:#fff;--grad-text:none}
  html:root{--text:"InterPrint","Inter",sans-serif}
  /* Eine Schriftdatei je Schnitt, damit Parser Wörter im PDF nicht an Teilfont-Grenzen trennen */
  html[lang="vi"]{--display:"InterPrint",sans-serif;--ui:"InterPrint",sans-serif}
  .site-head,.skip,.mobile-menu,.c2a,.page-hero,.cv-hero,.cv-photo,.cv-btns,.chip,.dlg{display:none!important}
  .print-only{display:block}
  .print-only .pn{font-family:var(--text);font-weight:600;font-size:20pt;line-height:1.1;margin:0}
  .print-only p{margin:2pt 0 0;font-size:10pt}
  .print-only .pt{font-weight:600}
  .wrap{max-width:none;padding:0}
  .cv-sec{padding:0;margin-top:10pt}
  .cv-profile{display:block}
  .cv-sec h2,.cv-profile h2{font-size:12.5pt;margin:0 0 3pt;color:#000!important;background:none!important;-webkit-text-fill-color:#000;border-bottom:.75pt solid #000;padding-bottom:1.5pt}
  .cv-profile p{margin-bottom:3pt;color:#000}
  .tl{margin-top:2pt;border:0}
  .tl>li{display:block;padding:3pt 0;border:0;break-inside:avoid}
  .tl-when{display:inline;font-size:9pt;color:#333}
  .tl h3{display:inline;font-size:10.5pt}
  .tl-role{margin:0 0 1pt;font-size:10pt;color:#000}
  .tl .arrows{gap:0}
  /* Ohne Positionierung, sonst stehen die Stichpunkte im PDF-Text hinter allen Stationen */
  .tl .arrows li{position:static;padding-left:9pt;text-indent:-9pt;font-size:9.5pt;color:#000}
  .tl .arrows li::before{content:"•";position:static;display:inline-block;width:9pt;text-indent:0}
  .cv-tech{display:block;margin-top:2pt}
  .cv-tech div{padding:1.5pt 0;border:0}
  .cv-tech dt{display:inline;font-size:9.5pt}
  .cv-tech dt::after{content:": "}
  .cv-tech dd{display:inline;font-size:9.5pt;color:#000}
  .cv-sec:last-of-type{padding-bottom:0}
}

/* Bewegung nach dem Original. Ohne Unterstützung oder bei "weniger Bewegung" bleibt alles sichtbar. */
.glow{position:relative;overflow:visible;isolation:isolate}
.glow>:not(.glow-aura):not(.glow-tint){position:relative;z-index:2}
.glow-aura,.glow-tint{position:absolute;pointer-events:none;border-radius:inherit;opacity:0;transition:opacity .22s ease}
.glow-aura{inset:-56px;z-index:0;filter:blur(100px);mix-blend-mode:screen;background:radial-gradient(200px circle at var(--mx,50%) var(--my,50%),rgba(var(--glow-rgb,66,0,254),.3) 0%,rgba(var(--glow-rgb,66,0,254),.18) 22%,rgba(var(--glow-rgb,66,0,254),.08) 42%,rgba(var(--glow-rgb,66,0,254),0) 68%),radial-gradient(700px circle at var(--mx,50%) var(--my,50%),rgba(var(--glow-rgb,66,0,254),.16) 0%,rgba(var(--glow-rgb,66,0,254),.11) 18%,rgba(var(--glow-rgb,66,0,254),.07) 34%,rgba(var(--glow-rgb,66,0,254),.035) 52%,rgba(var(--glow-rgb,66,0,254),.012) 72%,rgba(var(--glow-rgb,66,0,254),0) 100%)}
.glow-tint{inset:0;z-index:1;border:1px solid transparent;background:linear-gradient(transparent,transparent) padding-box,radial-gradient(450px circle at var(--mx,50%) var(--my,50%),rgba(var(--glow-rgb,66,0,254),1) 0%,rgba(var(--glow-rgb,66,0,254),.92) 14%,rgba(var(--glow-rgb,66,0,254),.52) 32%,rgba(var(--glow-rgb,66,0,254),.12) 48%,rgba(var(--glow-rgb,66,0,254),0) 68%) border-box;background-origin:padding-box,border-box;background-clip:padding-box,border-box}
.glow.is-glow>.glow-aura,.glow.is-glow>.glow-tint{opacity:1}

@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes fadeInUp{from{opacity:0;transform:translate3d(0,100%,0)}to{opacity:1;transform:none}}
@keyframes fadeInUpS{from{opacity:0;transform:translate3d(0,70px,0)}to{opacity:1;transform:none}}
@keyframes fadeInDown{from{opacity:0;transform:translate3d(0,-100%,0)}to{opacity:1;transform:none}}
@keyframes fadeInLeft{from{opacity:0;transform:translate3d(-100%,0,0)}to{opacity:1;transform:none}}
@keyframes fadeInRight{from{opacity:0;transform:translate3d(100%,0,0)}to{opacity:1;transform:none}}
@keyframes slideInRight{from{transform:translate3d(100%,0,0)}to{transform:none}}
@keyframes show{to{opacity:1}}
/* Einblendung beim ersten Sichtkontakt, Dauer und Versatz wie Elementor */
.anim [data-a]{opacity:0;animation:show 0s 5s forwards}
.anim [data-a].in{animation:var(--a,fadeIn) var(--t,1.25s) var(--d,0s) both}
[data-a="fadeIn"]{--a:fadeIn}
[data-a="fadeInUp"]{--a:fadeInUp}
[data-a="fadeInUpS"]{--a:fadeInUpS}
[data-a="fadeInDown"]{--a:fadeInDown}
[data-a="fadeInLeft"]{--a:fadeInLeft}
[data-a="fadeInRight"]{--a:fadeInRight}
.anim .dlg[open]{animation:slideInRight .45s cubic-bezier(.2,.7,.2,1) both}
.anim .hero-hello,.anim .hero-title{animation:fadeIn 1.25s both}
.anim .hero h1{animation:fadeIn 1.25s .3s both}
.anim .hero-lead{animation:fadeIn 1.25s .6s both}
.anim .hero-cta,.anim .cert-box{animation:fadeIn 1.25s .8s both}
.anim .hero-photo{animation:fadeIn 1.25s both}
.anim .tab-panel:not([hidden]){animation:fadeIn .5s ease both}

/* Scroll-Effekte: Sektionen blenden ein und aus, Punkte werden in der Mitte scharf, Knoten drehen sich */
@keyframes hero-out{to{opacity:.68;scale:.965}}
@keyframes sec-in{from{opacity:0}to{opacity:1}}
@keyframes sec-out{from{opacity:1}to{opacity:.08}}
@keyframes focus-point{0%,30%{opacity:0;filter:blur(7px);translate:0 70px}46%{filter:blur(0)}58%{opacity:1}72%{opacity:1;filter:blur(0)}92%,100%{opacity:0;filter:blur(0);translate:0 -70px}}
@keyframes knot-turn{to{rotate:-108deg}}
@media (prefers-reduced-motion:no-preference){
  @supports (animation-timeline:view()){
    .hero{animation:hero-out linear both;animation-timeline:view();animation-range:exit 62% exit 100%}
    .orch{view-timeline:--orch block;animation:sec-out linear both;animation-timeline:view();animation-range:exit 45% exit 100%}
    .orch-left{animation:sec-in linear both;animation-timeline:--orch;animation-range:entry 12% entry 58%}
    .orch-points li{animation:focus-point linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    .orch-points .bullet{animation:knot-turn linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    .ueber-knot .logo{animation:knot-turn linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
    .drive{animation:sec-out linear both;animation-timeline:view();animation-range:exit 28% exit 100%}
    @media (min-width:768px){
      .vorgehen{animation:sec-in linear both;animation-timeline:view();animation-range:entry 0% entry 58%}
      .belege{animation:sec-in linear both;animation-timeline:view();animation-range:entry 30% entry 86%}
      .ueber-stage{animation:sec-in linear both;animation-timeline:view();animation-range:entry 18% entry 85%}
    }
  }
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
@media print{.anim [data-a]{opacity:1!important}}
@media (forced-colors:active){
  .wire,.bus,.drop{stroke:CanvasText}
  .btn,.node,.seg span,.chip{border:1px solid ButtonText}
  .hl{background:none!important;color:CanvasText!important}
}

/* Block „Mit Claude verbinden“ */
.connect{margin-top:clamp(2rem,5vw,3rem);padding:clamp(1.1rem,3vw,1.6rem);border:1px solid var(--line);border-radius:var(--radius);display:grid;gap:.8rem;max-width:46rem}
.connect-h{font-size:1.25rem;margin:0}
.connect p{margin:0}
.connect-row{display:flex;flex-wrap:wrap;gap:.6rem;align-items:end}
.connect-url{display:grid;gap:.3rem;flex:1 1 16rem;font-size:.875rem;color:var(--fg-3)}
.connect-url input{font:500 .9375rem/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;color:inherit;background:transparent;border:1px solid var(--line-2);border-radius:var(--radius);padding:.6rem .75rem;width:100%}
.connect-url input{color:var(--fg)}
.connect-note{font-size:.875rem;color:var(--fg-3)}

/* Einstiegsangebote: Karten unter den Leistungen und eigene Seiten */
.einstiege{margin-top:clamp(2.5rem,2rem + 3vw,4.5rem)}
.einstiege .sec-lead{margin-top:.6rem}
.einstiege-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.4rem}
.einstiege-list li{border-radius:var(--radius);transition:translate .4s ease}
.einstiege-list li:hover{translate:0 -6px}
.einstiege-list a{display:grid;gap:.6rem;padding:1.4rem 1.25rem;text-decoration:none;height:100%}
.einstiege-list h4{font-size:clamp(1.2rem,1.1rem + .4vw,1.4rem)}
.einstiege-list p{color:var(--fg-3)}
.einstiege-list .chip{justify-self:start}
.einstiege-more{font-weight:500;margin-top:auto}
@media (max-width:760px){.einstiege-list{grid-template-columns:minmax(0,1fr)}}
.offer-q{font-weight:500}
.offer-q-label{color:var(--fg-3);font-weight:400}
.offer-scope{align-self:center;font-size:.9375rem}
.offer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(1.5rem,4vw,3rem)}
@media (max-width:760px){.offer-grid{grid-template-columns:minmax(0,1fr)}}
.offer-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));gap:1rem;margin-top:1rem}
.offer-steps li{display:grid;gap:.5rem;align-content:start;padding:1.25rem;border-radius:var(--radius)}
.offer-steps h3{font-size:1.125rem}
.offer-n{font:600 .875rem var(--ui);color:var(--fg-3)}
.offer-facts{margin-top:clamp(2rem,4vw,3rem);grid-template-columns:minmax(0,1fr)}
.offer-kosten{margin-top:1.5rem;max-width:46rem}
.offer .partner-btns{margin-top:1.5rem}

/* Agent-Readiness-Prüfstand */
.ps-form{display:flex;flex-wrap:wrap;gap:.65rem;align-items:end;margin-top:.4rem;max-width:42rem}
.ps-form label{display:grid;gap:.35rem;flex:1 1 18rem;font-size:.875rem;color:var(--fg-3)}
.ps-form input{font:inherit;font-size:1rem;color:var(--fg);background:transparent;border:1px solid var(--line-2);border-radius:var(--radius);padding:.7rem .85rem;width:100%}
.ps-privacy{font-size:.875rem;color:var(--fg-3);max-width:42rem}
.ps-error{padding:1rem 1.2rem;border:1px solid var(--line-2);border-radius:var(--radius);max-width:42rem}
.ps-head{display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center}
.ps-score{display:grid;justify-items:center;padding:1.2rem 1.6rem;border-radius:var(--radius);min-width:9rem}
.ps-score-n{font:600 clamp(2.6rem,2rem + 2vw,3.4rem)/1 var(--display)}
.ps-score-of,.ps-score-l{font-size:.875rem;color:var(--fg-3)}
.ps-meta{display:grid;gap:.8rem;flex:1 1 18rem}
.ps-meta p{overflow-wrap:anywhere}
.ps-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;margin-top:1.6rem}
@media (max-width:760px){.ps-list{grid-template-columns:minmax(0,1fr)}}
.ps-item{display:grid;gap:.45rem;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:var(--radius)}
.ps-item-h{display:flex;align-items:center;gap:.6rem}
.ps-item h3{font-size:1rem;flex:1}
.ps-badge{font:600 .72rem var(--ui);letter-spacing:1px;text-transform:uppercase;padding:.3rem .5rem;border-radius:4px;border:1px solid currentColor}
.ps-pass .ps-badge{color:#2fbf71}
.ps-fail .ps-badge{color:#E62554}
.ps-hint .ps-badge{color:#FF8036}
.ps-pts{font-size:.8125rem;color:var(--fg-3)}
.ps-detail{font-size:.8125rem;color:var(--fg-3);overflow-wrap:anywhere}
.ps-next{display:grid;gap:.5rem;list-style:decimal;padding-left:1.3rem;max-width:46rem}
.ps-cta{max-width:46rem}
.tab-link{margin-top:.4rem;font-weight:500}
.tab-link a{text-underline-offset:.2em}
html[data-theme="dark"] .ps-fail .ps-badge{color:#ff6b8b}
html[data-theme="dark"] .ps-hint .ps-badge{color:#ffa066}
html[data-theme="dark"] .ps-pass .ps-badge{color:#4fd68c}
html[data-theme="light"] .ps-fail .ps-badge{color:#b0123a}
html[data-theme="light"] .ps-hint .ps-badge{color:#a3480a}
html[data-theme="light"] .ps-pass .ps-badge{color:#15703a}
/* Integrations-Rezepte */
.rz-sys{font-size:.9375rem;color:var(--fg-3)}
.zielbild ol{display:grid;gap:.8rem;max-width:46rem}
.zielbild li{display:grid;grid-template-columns:minmax(0,1fr) minmax(6rem,1.2fr) minmax(0,1fr);align-items:center;gap:.6rem}
.zb-node{padding:.7rem .9rem;border:1px solid var(--line-2);border-radius:var(--radius);text-align:center;font-weight:500}
.zb-arrow{position:relative;display:grid;place-items:center;font-size:.8125rem;color:var(--fg-3);padding-bottom:.6rem}
.zb-arrow::after{content:"";position:absolute;left:0;right:.4rem;bottom:.2rem;border-bottom:1px solid var(--line-2)}
.zb-arrow::before{content:"";position:absolute;right:0;bottom:-.05rem;border:.3rem solid transparent;border-left:.45rem solid var(--fg-3)}
.rz-body{max-width:46rem;margin-top:2rem;display:grid;gap:1rem}
.rz-body h2{font-size:clamp(1.3rem,1.2rem + .5vw,1.6rem);margin-top:1rem}
.rz-body ul{list-style:disc;padding-left:1.3rem;display:grid;gap:.35rem}
.rz-body ol{list-style:decimal;padding-left:1.3rem;display:grid;gap:.35rem}
.rezept .ps-cta{margin-top:2.5rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* Seiten-Bausteine pf */
.pf-jump{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.6rem}
.pf-jump a{padding:.45rem .7rem;border:1px solid rgba(255,255,255,.5);border-radius:999px;color:#fff;font:500 .8125rem/1.2 var(--ui);text-decoration:none;transition:background .25s ease}
.pf-jump a:hover{background:rgba(255,255,255,.14)}
.pf-intro{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;align-items:stretch}
.pf-prinzip,.pf-herkunft{display:grid;align-content:start;gap:.7rem;padding:clamp(1.2rem,3vw,1.8rem);border-radius:var(--radius)}
.pf-herkunft{border:1px solid var(--line)}
.pf-prinzip h2,.pf-herkunft h2{font-size:clamp(1.25rem,1.1rem + .6vw,1.6rem)}
.pf-prinzip p{font-size:clamp(1.0625rem,1rem + .3vw,1.2rem);line-height:1.5;max-width:46rem}
.pf-legend{display:flex;flex-wrap:wrap;gap:.5rem}
.pf-lead{max-width:46rem;margin-top:.7rem;color:var(--fg-3);font-size:1.0625rem}
.pf-gruppe>h2{font-size:clamp(1.75rem,1.3rem + 1.8vw,2.6rem);max-width:22em}
.pf-badge{justify-self:start;display:inline-block;font:600 .7rem/1 var(--ui);letter-spacing:1px;text-transform:uppercase;padding:.35rem .5rem;border-radius:4px;border:1px solid currentColor}
.pf-praxis{color:#ff6bb5}
.pf-eigen{color:#9d8cff}
html[data-theme="light"] .pf-praxis{color:#a3105f}
html[data-theme="light"] .pf-eigen{color:#4a1fd1}
.pf-fall{display:grid;gap:1.4rem;margin-top:1.6rem;padding:clamp(1.2rem,3vw,2rem);border-radius:var(--radius)}
.pf-fall-kopf{display:grid;gap:.6rem;max-width:46rem}
.pf-fall h3{font-size:var(--fs-h3)}
.pf-schritte{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.9rem;counter-reset:none}
.pf-schritte li{display:flex;gap:.75rem;align-items:flex-start;padding:1rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--card)}
.pf-schritte li p{margin-top:.3rem;color:var(--fg-3);font-size:.9375rem;line-height:1.45}
.pf-schritte b{font-family:var(--ui);font-weight:600}
.pf-nr{flex:none;display:grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--grad-text);color:#fff;font:600 .875rem/1 var(--ui)}
.pf-geplant{border-style:dashed !important}
.pf-geplant .pf-nr{background:none;border:1px dashed var(--line-2);color:var(--fg)}
.pf-tag{display:inline-block;margin-left:.5rem;padding:.2rem .4rem;border:1px dashed var(--line-2);border-radius:4px;font:500 .68rem/1 var(--ui);letter-spacing:.8px;text-transform:uppercase;vertical-align:.15em;color:var(--fg-3)}
.pf-leitplanken{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}
.pf-karten{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin-top:1.2rem}
.pf-karten li{display:grid;align-content:start;gap:.55rem;padding:1.3rem 1.25rem;border-radius:var(--radius)}
.pf-karten h3{font-size:clamp(1.15rem,1.05rem + .4vw,1.35rem)}
.pf-karten p{color:var(--fg-3);line-height:1.5}
.pf-karten .pf-kennen{color:var(--fg)}
.pf-link{font-weight:500;margin-top:.2rem;justify-self:start}
.pf-labor{grid-template-columns:repeat(3,minmax(0,1fr))}
.pf-artefakte{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 2rem;margin-top:1.4rem;max-width:60rem}
.pf-artefakte div{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:1rem;padding:.8rem 0;border-bottom:1px solid var(--line)}
.pf-artefakte dt{font-family:var(--ui);font-weight:600}
.pf-artefakte dd{color:var(--fg-3)}
@media (max-width:980px){.pf-schritte,.pf-labor{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:760px){.pf-intro,.pf-karten,.pf-schritte,.pf-labor,.pf-artefakte{grid-template-columns:minmax(0,1fr)}.pf-artefakte div{grid-template-columns:minmax(0,1fr);gap:.2rem}}

/* Lebenslauf nach Fragen */
.cvq-lead{max-width:46rem;margin-top:.7rem;color:var(--fg-3);font-size:1.0625rem}
.cvq-talk{display:grid;grid-template-columns:minmax(0,21rem) minmax(0,1fr);gap:clamp(1.2rem,3vw,2.5rem);align-items:start;margin-top:1.6rem}
.cvq-qs{display:grid;gap:.5rem;position:sticky;top:140px}
.cvq-q{display:grid;gap:.25rem;text-align:left;border:1px solid var(--line);border-radius:16px 16px 16px 4px;background:var(--card);padding:.75rem .9rem;cursor:pointer;font:500 .9375rem/1.35 var(--ui);color:var(--fg);transition:background .2s,color .2s}
.cvq-q small{font:400 .75rem var(--text);color:var(--fg-3)}
.cvq-q[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.cvq-q[aria-pressed="true"] small{color:inherit;opacity:.7}
.cvq-answers{min-width:0}
.cvq-a{display:grid;gap:1.1rem}
.cvq-a[hidden]{display:none}
.cvq-bubble{display:grid;gap:.7rem;padding:1.1rem 1.25rem;border-radius:16px 16px 4px 16px}
.cvq-who{font:500 .75rem var(--ui);color:var(--fg-3)}
.cvq-bubble p{font-size:clamp(1.0625rem,1rem + .3vw,1.2rem);line-height:1.5;max-width:42rem}
.cvq-facts{display:flex;flex-wrap:wrap;gap:.5rem}
.cvq-facts span{font:600 .8125rem/1 var(--ui);padding:.45rem .65rem;border-radius:999px;border:1px solid var(--line-2);font-variant-numeric:tabular-nums}
.cvq-facts small{font-weight:500;font-size:inherit;color:var(--fg-3)}
.cvq-trail{font:600 .75rem/1 var(--ui);letter-spacing:.12em;text-transform:uppercase;color:var(--fg-3)}
.cvq-steps{display:grid}
.cvq-step{display:grid;grid-template-columns:6.5rem 18px minmax(0,1fr);gap:0 .75rem}
.cvq-when{font:500 .8125rem/1.4 var(--ui);color:var(--fg-3);text-align:right;padding-top:2px;font-variant-numeric:tabular-nums}
.cvq-ln{position:relative}
.cvq-ln::before{content:"";position:absolute;left:8px;top:0;bottom:0;width:2px;background:var(--line-2)}
.cvq-ln::after{content:"";position:absolute;left:3px;top:5px;width:12px;height:12px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 2px var(--fg)}
.cvq-step.edu .cvq-ln::after{border-radius:3px}
.cvq-step.lab .cvq-ln::after{background:var(--fg)}
.cvq-step:last-child .cvq-ln::before{bottom:auto;height:12px}
.cvq-step>div{display:grid;gap:.2rem;padding-bottom:1rem;min-width:0}
.cvq-kind{font:500 .6875rem/1 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--fg-3)}
.cvq-step b{font:600 1rem/1.3 var(--ui)}
.cvq-org{font-size:.8125rem;color:var(--fg-3)}
.cvq-step ul{list-style:disc;padding-left:1.1rem;display:grid;gap:.15rem;color:var(--fg-2);font-size:.875rem;margin-top:.2rem}
.cvq-m{font:500 .6875rem/1 var(--ui);padding:.2rem .35rem;border:1px dashed var(--line-2);border-radius:4px;color:var(--fg-3);margin-left:.4rem;vertical-align:1px}
.cvq-mh{font-size:clamp(1.3rem,1.15rem + .6vw,1.7rem);margin-top:clamp(2.5rem,2rem + 2vw,3.5rem)}
.cvq-tbl{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);margin-top:1rem}
.cvq-tbl table{border-collapse:collapse;width:100%;min-width:760px;font-size:.84rem}
.cvq-tbl th,.cvq-tbl td{padding:.55rem .6rem;border-bottom:1px solid var(--line);text-align:center}
.cvq-tbl th{font:600 .75rem/1.25 var(--ui);color:var(--fg-3);vertical-align:bottom}
.cvq-tbl th.on{color:var(--fg)}
.cvq-tbl th.on::after{content:"";display:block;height:3px;margin-top:.35rem;border-radius:2px;background:var(--c)}
.cvq-tbl .r{text-align:left}
.cvq-tbl td.r b{display:block;font:600 .84rem/1.3 var(--ui)}
.cvq-tbl td.r span{font-size:.75rem;color:var(--fg-3)}
.cvq-tbl tr:last-child td{border-bottom:0}
.cvq-cell{width:30px;height:30px;border:0;border-radius:50%;background:transparent;cursor:pointer;display:inline-grid;place-items:center}
.cvq-cell i{width:12px;height:12px;border-radius:50%;background:var(--c)}
.cvq-cell.lite i{width:8px;height:8px;opacity:.5}
.cvq-cell:hover{background:var(--card)}
@media (max-width:760px){
  .cvq-talk{grid-template-columns:minmax(0,1fr)}
  .cvq-qs{position:static;grid-auto-flow:column;grid-auto-columns:minmax(14rem,80%);overflow-x:auto;padding-bottom:.4rem;scroll-snap-type:x mandatory}
  .cvq-q{scroll-snap-align:start}
  .cvq-step{grid-template-columns:4.6rem 18px minmax(0,1fr)}
}
@media print{.cvq{display:none!important}}