@font-face{font-family:'Inter';font-style:normal;font-weight:400;font-display:swap;src:url(inter-400.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:500;font-display:swap;src:url(inter-500.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:600;font-display:swap;src:url(inter-600.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:700;font-display:swap;src:url(inter-700.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:800;font-display:swap;src:url(inter-800.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
:root{
  /* dunkle Flächen */
  --void:#0C1426; --d1:#141E36; --d2:#1C2846; --d3:#243357; --d4:#2C3A62;
  --d-line:rgba(255,255,255,.13); --d-line2:rgba(255,255,255,.20);
  --dfg:#F0F4FC; --dfg2:#B6C2DA; --dfg3:#8492B0;
  /* helle Blau-Grau-Flächen */
  --l1:#E8EEF9; --l2:#DEE7F6; --l3:#F3F7FD;
  --ink:#0A1122; --ink2:#414F6C; --ink3:#5F6A7E;   /* 4.5:1 auch auf hellgrauen Flächen */
  --line:rgba(10,17,34,.11); --line2:rgba(10,17,34,.19);
  /* Akzente — aus dem Logo: Blau → Violett */
  --blue:#2E6BFF; --blue2:#5B8CFF; --blue-d:#1B44C4; --cyan:#5FD0FF; --violet:#7A5BFF;
  --blue-link:#2258F9;   /* Links auf hellem Grund, 4.5:1 */
  --grad:linear-gradient(120deg,#5FD0FF 0%,#2E6BFF 46%,#7A5BFF 100%);
  /* Knopf-Verlauf ohne das helle Cyan: weisse Schrift bleibt überall lesbar */
  --grad-btn:linear-gradient(120deg,#2D67FE 0%,#4A5FFE 52%,#7759FE 100%);
  --tint:rgba(46,107,255,.10); --tint2:rgba(46,107,255,.18);
  --font:'Inter',ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:ui-monospace,"SF Mono",Menlo,Consolas,"Liberation Mono",monospace;
  --side:238px; --gut:48px; --pad:clamp(20px,3.2vw,56px); --wrap:1090px;
  --rl:24px; --rm:16px; --rs:11px; --rp:999px;
  --ease:cubic-bezier(.22,.8,.24,1);
  --sh-s:0 1px 2px rgba(5,8,15,.16);
  --sh-m:0 16px 38px rgba(5,8,15,.16);
  --sh-l:0 34px 78px rgba(5,8,15,.30);
  --glow:0 12px 34px rgba(46,107,255,.34);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;overflow-x:hidden;scroll-behavior:smooth;scroll-padding-top:24px;}
body{background:var(--d1);color:var(--dfg);font-family:var(--font);
  font-size:16.5px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
h1,h2,h3{font-weight:800;letter-spacing:-.032em;line-height:1.05;text-wrap:balance;}
h4{font-weight:700;letter-spacing:-.01em;}
a{color:inherit;text-decoration:none;}
img,svg{display:block;max-width:100%;height:auto;}
::selection{background:var(--blue);color:#fff;}
:focus-visible{outline:2px solid var(--blue2);outline-offset:3px;border-radius:6px;}
.skip{position:absolute;left:-9999px;top:0;z-index:999;background:var(--blue);color:#fff;
  padding:12px 22px;font-weight:800;border-radius:0 0 var(--rs) 0;}
.skip:focus{left:0;}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition-duration:.001ms!important;scroll-behavior:auto!important;}}

/* ===== GERÜST ===== */
.shell{display:grid;grid-template-columns:var(--side) minmax(0,1fr);min-height:100vh;}
.side{position:fixed;top:0;left:0;bottom:0;width:var(--side);z-index:60;
  background:none;display:flex;flex-direction:column;padding:24px 20px 20px;overflow:visible;}
/* Glanz liegt jetzt im Wellen-SVG der Seitenleiste */
.side>.side-edge{position:absolute;top:0;left:0;width:calc(var(--side) + 30px);max-width:none;height:100%;z-index:0;pointer-events:none;overflow:visible;}
.side-edge .se-fill{fill:url(#sideFill);}
.side-edge .se-line{fill:none;stroke:url(#sgrad);stroke-width:1.7;vector-effect:non-scaling-stroke;filter:url(#sglow);}
.side-nav{overflow-y:auto;}
.side>*{position:relative;z-index:1;}
.side-brand{display:flex;align-items:center;gap:11px;margin-bottom:26px;}
.mark{width:44px;height:47px;flex-shrink:0;object-fit:contain;
  filter:drop-shadow(0 6px 14px rgba(46,107,255,.42));}
.side-word b{display:block;font-size:16px;font-weight:800;letter-spacing:-.02em;color:#fff;line-height:1.2;}
.side-word span{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--blue2);font-weight:600;margin-top:2px;}
.side-nav{display:flex;flex-direction:column;flex:1;gap:1px;}
.side-nav a{position:relative;display:grid;grid-template-columns:22px 1fr;align-items:baseline;gap:9px;
  padding:9px 12px;border-radius:10px;font-size:14px;font-weight:500;color:var(--dfg2);
  transition:color .25s var(--ease),background .25s var(--ease);}
.side-nav a i{font-family:var(--mono);font-size:9.5px;font-style:normal;color:var(--dfg3);}
.side-nav a:hover{color:#fff;background:rgba(255,255,255,.05);}
.side-nav a[aria-current="true"]{color:#fff;background:linear-gradient(100deg,rgba(46,107,255,.26),rgba(122,91,255,.16));
  font-weight:600;box-shadow:inset 0 0 0 1px rgba(91,140,255,.34);}
.side-nav a[aria-current="true"] i{color:var(--cyan);}
.side-foot{border-top:1px solid var(--d-line);padding-top:15px;margin-top:15px;}
.side-foot .lbl{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--dfg3);margin-bottom:2px;}
.side-foot a.line{display:block;font-size:13px;color:var(--dfg2);margin-bottom:11px;font-weight:500;line-height:1.4;}
.side-foot a.line:hover{color:var(--cyan);}
.side-cta{display:flex!important;align-items:center;justify-content:center;gap:8px;
  background:var(--grad);color:#fff!important;border-radius:var(--rp);
  padding:12px;font-size:13.5px;font-weight:700;margin-bottom:0!important;box-shadow:var(--glow);
  transition:transform .28s var(--ease),box-shadow .28s var(--ease);}
.side-cta:hover{transform:translateY(-2px);box-shadow:0 18px 40px rgba(46,107,255,.46);}
main{grid-column:2;min-width:0;position:relative;z-index:1;background:var(--void);}

/* ===== KOPFLEISTE MOBIL ===== */
.top{display:none;position:fixed;top:0;left:0;right:0;height:62px;z-index:70;
  background:rgba(10,15,28,.90);backdrop-filter:blur(16px);border-bottom:1px solid var(--d-line);
  align-items:center;justify-content:space-between;padding:0 12px 0 16px;}
.top .brand{display:flex;align-items:center;gap:9px;}
.top .mark{width:33px;height:35px;}
.top .side-word b{font-size:14px;} .top .side-word span{font-size:8px;}
.tbtn{width:42px;height:42px;border-radius:50%;border:1px solid var(--d-line2);background:rgba(255,255,255,.05);
  color:var(--dfg);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;cursor:pointer;}
.tbtn i{display:block;width:16px;height:1.6px;background:currentColor;border-radius:2px;transition:.3s var(--ease);}
.tbtn[aria-expanded="true"] i:nth-child(1){transform:translateY(6.6px) rotate(45deg);}
.tbtn[aria-expanded="true"] i:nth-child(2){opacity:0;}
.tbtn[aria-expanded="true"] i:nth-child(3){transform:translateY(-6.6px) rotate(-45deg);}
.drawer{display:none;position:fixed;inset:62px 0 0;z-index:65;background:var(--d1);padding:10px 8px;overflow-y:auto;}
.drawer.open{display:block;}
.drawer a{display:grid;grid-template-columns:30px 1fr;gap:12px;align-items:baseline;
  padding:14px 16px;border-radius:var(--rm);font-size:19px;font-weight:800;letter-spacing:-.025em;color:var(--dfg);}
.drawer a:active{background:rgba(255,255,255,.06);}
.drawer a i{font-family:var(--mono);font-size:11px;font-style:normal;color:var(--blue2);font-weight:500;}
.drawer .dv{height:1px;background:var(--d-line);margin:10px 16px;}
.drawer-cta{display:flex;gap:9px;flex-wrap:wrap;padding:14px 16px 4px;}
.drawer-cta .b{flex:1 1 100%;white-space:nowrap;}

/* ===== SEKTIONEN + WELLEN ===== */
.sec{position:relative;padding:clamp(52px,5.6vw,84px) var(--pad);}
.sec-in{max-width:var(--wrap);position:relative;z-index:2;}
.sec.dark{background:var(--d1);color:var(--dfg);}
.sec.deep{background:var(--void);color:var(--dfg);}
.sec.light{background:var(--l1);color:var(--ink);}
.sec.dark::before,.sec.deep::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(760px 460px at 88% 0%,rgba(46,107,255,.13),transparent 64%),
             radial-gradient(620px 420px at 4% 92%,rgba(122,91,255,.10),transparent 66%);}
.sec.light::before{content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background:radial-gradient(700px 420px at 92% 4%,rgba(46,107,255,.09),transparent 62%);}
/* Welle am oberen Rand — füllt in der eigenen Sektionsfarbe nach oben */
.wave{position:absolute;top:0;left:0;width:100%;height:clamp(46px,5.6vw,92px);z-index:3;
  transform:translateY(-99.4%);pointer-events:none;display:block;}
.sec.dark>.wave .wf{fill:var(--d1);} .sec.deep>.wave .wf{fill:var(--void);}
.sec.light>.wave .wf{fill:var(--l1);}
footer>.wave .wf{fill:var(--void);}
.dark h3,.deep h3{color:#fff;}
.wl{fill:none;stroke:url(#wgrad);stroke-width:2.2;vector-effect:non-scaling-stroke;filter:url(#wglow);}

/* ===== KOPFZEILEN ===== */
.bh{display:grid;grid-template-columns:var(--gut) minmax(0,1fr);margin-bottom:clamp(22px,2.6vw,36px);}
.bh .ix{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;font-weight:700;padding-top:.9em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.bh h2{font-size:clamp(28px,4.3vw,48px);}
.bh h2{grid-column:2;}
.bh h2.minor{font-size:clamp(25px,3.3vw,36px);}
.bh .sub{grid-column:2;font-size:16.5px;max-width:58ch;margin-top:14px;}
.focus{grid-column:2;display:inline-flex;align-items:center;gap:9px;width:max-content;margin-bottom:15px;
  padding:6px 15px 6px 12px;border-radius:var(--rp);font-family:var(--mono);font-size:9.5px;
  letter-spacing:.17em;text-transform:uppercase;font-weight:700;color:#fff;
  background:var(--grad-btn);box-shadow:var(--glow);}
.focus::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;flex-shrink:0;}
.dark .bh h2,.deep .bh h2{color:#fff;} .light .bh h2{color:var(--ink);}
.dark .bh .sub,.deep .bh .sub{color:var(--dfg2);} .light .bh .sub{color:var(--ink2);}
.ind{padding-left:var(--gut);}
.mono{font-family:var(--mono);font-size:10.5px;letter-spacing:.15em;text-transform:uppercase;font-weight:600;}
.dark .mono,.deep .mono{color:var(--dfg3);} .light .mono{color:var(--ink3);}
.dark p,.deep p{color:var(--dfg2);} .light p{color:var(--ink2);}

/* ===== HERO ===== */
.hero{position:relative;overflow:hidden;background:var(--void);
  padding:clamp(54px,7vh,96px) var(--pad) clamp(30px,3.4vw,50px);}
.hero::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(900px 620px at 78% -8%,rgba(46,107,255,.28),transparent 62%),
             radial-gradient(700px 520px at 6% 106%,rgba(122,91,255,.20),transparent 64%);}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(760px 520px at 26% 34%,#000,transparent 74%);
  mask-image:radial-gradient(760px 520px at 26% 34%,#000,transparent 74%);}
.hero-in{max-width:var(--wrap);position:relative;z-index:2;}
/* Das Logo erscheint nur, wenn daneben oder darüber genug Platz ist.
   Reicht der Platz nicht, bleibt es weg — lieber kein Logo als eines,
   das in der Schrift liegt. */
.hero-logo{display:none;}

/* Breit genug: Text und Logo als zwei echte Spalten.
   Als Raster können sie sich nicht überlappen, egal wie breit das Fenster ist. */
@media (min-width:1340px){
  .hero{display:grid;grid-template-columns:minmax(0,1fr) clamp(260px,21vw,400px);
    align-items:center;column-gap:clamp(24px,3.5vw,72px);}
  .hero-in{max-width:var(--wrap);min-width:0;}
  .hero-logo{display:block;position:relative;z-index:1;pointer-events:none;
    width:100%;height:auto;min-width:0;justify-self:center;
    filter:drop-shadow(0 0 46px rgba(62,123,255,.42)) drop-shadow(0 22px 48px rgba(0,0,0,.6));
    animation:float 9s ease-in-out infinite;}
}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-12px);}}
.kick{display:inline-flex;align-items:center;gap:10px;margin-bottom:clamp(20px,2.6vw,30px);
  padding:7px 16px 7px 12px;border-radius:var(--rp);
  border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);backdrop-filter:blur(8px);}
.kick span{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--dfg2);font-weight:600;}
.kick .dot{width:7px;height:7px;background:var(--cyan);border-radius:50%;flex-shrink:0;
  box-shadow:0 0 0 4px rgba(95,208,255,.20);animation:pulse 2.8s ease-in-out infinite;}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(95,208,255,.20);}50%{box-shadow:0 0 0 10px rgba(95,208,255,0);}}
.hero h1{font-size:clamp(38px,6.6vw,80px);margin-bottom:clamp(20px,2.6vw,32px);color:#fff;}
.hero h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.95fr);gap:clamp(24px,3.4vw,52px);align-items:start;}
.hero-grid p{color:var(--dfg2);font-size:17px;}
.hero-lead{color:var(--dfg2);font-size:18px;max-width:60ch;}
.hero-act{display:flex;flex-wrap:wrap;gap:11px;margin-top:30px;}
.hero-act .b{min-width:184px;}
@media (max-width:560px){ .hero-act{flex-direction:column;} .hero-act .b{width:100%;} }
.idx{list-style:none;display:grid;gap:3px;padding:13px;border-radius:var(--rl);
  background:rgba(255,255,255,.045);border:1px solid var(--d-line);backdrop-filter:blur(10px);}
.idx li{display:grid;grid-template-columns:22px 1fr auto;gap:11px;align-items:baseline;
  padding:9px 12px;border-radius:10px;font-size:14px;color:var(--dfg2);transition:.25s var(--ease);}
.idx li:hover{background:rgba(255,255,255,.07);color:#fff;}
.idx li b{font-family:var(--mono);font-size:10px;font-weight:500;color:var(--dfg3);}
.idx li span{font-family:var(--mono);font-size:9.5px;color:var(--blue2);letter-spacing:.08em;font-weight:600;}

/* Laufband */
.tick{position:relative;z-index:2;margin:0 var(--pad) clamp(74px,8.4vw,124px);border-radius:var(--rp);overflow:hidden;
  padding:12px 0;background:rgba(255,255,255,.05);border:1px solid var(--d-line);}
.tick-in{display:flex;width:max-content;animation:slide 52s linear infinite;}
.tick-in span{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;
  color:var(--dfg2);padding:0 22px;white-space:nowrap;font-weight:500;}
.tick-in span::after{content:"◆";color:var(--blue2);margin-left:22px;opacity:.6;}
@keyframes slide{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ===== BUTTONS ===== */
.b{display:inline-flex;align-items:center;justify-content:space-between;gap:18px;
  padding:14px 23px;border-radius:var(--rp);font-weight:700;font-size:14.5px;letter-spacing:-.01em;
  border:1px solid var(--line2);color:var(--ink);background:#fff;
  transition:transform .28s var(--ease),background .28s var(--ease),border-color .28s var(--ease),box-shadow .28s var(--ease);}
.b i{font-style:normal;transition:transform .3s var(--ease);}
.b em{font-style:normal;}
.b:hover{transform:translateY(-2px);box-shadow:var(--sh-m);}
.b:hover i{transform:translateX(5px);}
.dark .b,.deep .b,.hero .b,.drawer .b{color:#fff;background:rgba(255,255,255,.06);border-color:var(--d-line2);}
.dark .b:hover,.deep .b:hover,.hero .b:hover,.drawer .b:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.28);}
.b-solid,.dark .b-solid,.deep .b-solid,.hero .b-solid,.drawer .b-solid{
  background:var(--grad-btn);color:#fff;border-color:transparent;box-shadow:var(--glow);}
.b-solid:hover,.dark .b-solid:hover,.deep .b-solid:hover,.hero .b-solid:hover,.drawer .b-solid:hover{
  box-shadow:0 20px 44px rgba(46,107,255,.46);background:var(--grad-btn);}

/* ===== KARTEN (Leistungen) ===== */
.svc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;}
.sv{position:relative;border-radius:var(--rm);padding:24px 22px 20px;overflow:hidden;
  background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.sv::after{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--grad);
  opacity:0;transition:opacity .3s var(--ease);}
.sv:hover{transform:translateY(-4px);box-shadow:var(--sh-m);border-color:var(--line2);}
.sv:hover::after{opacity:1;}
.sv-n{font-family:var(--mono);font-size:10px;letter-spacing:.16em;font-weight:700;display:block;margin-bottom:11px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.sv h3{font-size:19px;margin-bottom:8px;color:var(--ink);}
.sv p{color:var(--ink2);font-size:14.3px;line-height:1.6;margin-bottom:15px;}
.sv-k{display:flex;flex-wrap:wrap;gap:5px;margin-top:auto;}
.k{font-family:var(--mono);font-size:10px;letter-spacing:.05em;padding:4px 10px;border-radius:var(--rp);
  border:1px solid var(--line);background:var(--l3);color:var(--ink3);transition:.28s var(--ease);}
.sv:hover .k{color:var(--ink2);border-color:var(--line2);}
.dark .sv,.deep .sv{background:var(--d2);border-color:var(--d-line);}
.dark .sv h3,.deep .sv h3{color:#fff;} .dark .sv p,.deep .sv p{color:var(--dfg2);}
.dark .k,.deep .k{background:rgba(255,255,255,.05);border-color:var(--d-line);color:var(--dfg3);}
@media (max-width:1120px){ .svc{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:640px){ .svc{grid-template-columns:1fr;} }

/* ===== PLATTE / REFERENZ ===== */
.plate{border-radius:var(--rl);padding:clamp(20px,2.6vw,38px);position:relative;overflow:hidden;
  background:#fff;border:1px solid var(--line);box-shadow:var(--sh-m);}
.dark .plate,.deep .plate{background:linear-gradient(150deg,var(--d2),var(--d1));
  border-color:var(--d-line2);box-shadow:var(--sh-l);}
.ref{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(22px,3vw,42px);align-items:center;}
.shot{position:relative;}
.frame{border-radius:var(--rm);overflow:hidden;background:#fff;border:1px solid rgba(255,255,255,.16);
  box-shadow:0 34px 70px rgba(0,0,0,.55);}
.frame .bar{display:flex;align-items:center;gap:6px;padding:10px 13px;background:#E9EEF8;border-bottom:1px solid var(--line);}
.frame .bar u{width:8px;height:8px;border-radius:50%;background:#C3CEE2;text-decoration:none;}
.frame .bar b{margin-left:8px;font-family:var(--mono);font-size:10px;color:var(--ink3);font-weight:500;}
.ph{position:absolute;right:-18px;bottom:-26px;width:25%;border-radius:15px;overflow:hidden;
  background:#fff;border:1px solid rgba(255,255,255,.2);box-shadow:0 26px 56px rgba(0,0,0,.6);}
.ph-top{height:9px;background:#0E1420;}
.mockimg{width:100%;height:auto;display:block;}

/* ===== META-LISTE ===== */
.meta{list-style:none;display:grid;gap:6px;margin:20px 0 0;}
.meta li{display:grid;grid-template-columns:122px 1fr;gap:15px;padding:11px 15px;border-radius:var(--rs);
  background:var(--l3);font-size:14.3px;transition:background .28s var(--ease);}
.meta li:hover{background:var(--l2);}
.meta li b{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink3);font-weight:700;padding-top:3px;
  min-width:0;overflow-wrap:anywhere;hyphens:auto;}  /* lange Beschriftungen laufen nicht in den Text */
.meta li span{color:var(--ink2);}
.dark .meta li,.deep .meta li{background:rgba(255,255,255,.045);}
.dark .meta li:hover,.deep .meta li:hover{background:rgba(46,107,255,.14);}
.dark .meta li b,.deep .meta li b{color:var(--blue2);}
.dark .meta li span,.deep .meta li span{color:var(--dfg2);}

/* ===== ACHSE ===== */
.spine{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
.sp{position:relative;padding:20px 22px 21px;border-radius:var(--rm);
  border:1px solid var(--d-line);background:rgba(255,255,255,.045);
  transition:transform .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease);}
.sp:hover{transform:translateY(-3px);background:rgba(46,107,255,.12);border-color:rgba(91,140,255,.42);}
.sp::before{content:"";display:block;width:32px;height:3px;border-radius:2px;background:var(--grad);margin-bottom:12px;}
@media (max-width:820px){ .spine{grid-template-columns:1fr;} }
.sp .n{font-family:var(--mono);font-size:10px;letter-spacing:.14em;font-weight:700;display:block;margin-bottom:6px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.sp h3{font-size:18.5px;margin-bottom:6px;}
.dark .sp h3,.deep .sp h3{color:#fff;}
.sp p{font-size:14.6px;}

/* ===== DIAGRAMM (klein & dezent) ===== */
.diag{max-width:560px;border-radius:var(--rm);border:1px solid var(--line);padding:14px 16px;background:var(--l3);}
.dark .diag,.deep .diag{background:rgba(255,255,255,.04);border-color:var(--d-line);}
.flow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.flow-box{flex:1 1 96px;background:#fff;border:1px solid var(--line);border-radius:9px;
  padding:7px 9px;display:flex;align-items:center;justify-content:center;text-align:center;
  font-size:11px;font-weight:700;color:var(--ink);min-height:32px;line-height:1.2;}
.flow-box.on{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 15px rgba(46,107,255,.28);}
.flow-arrow{display:flex;align-items:center;color:var(--blue);font-size:12px;flex:0 0 auto;}
.flow-stack{display:flex;flex-direction:column;justify-content:center;gap:4px;flex:1 1 96px;align-self:stretch;}
.flow-stack .flow-box{flex:0 0 auto;min-height:0;padding:6px 9px;}
.flow-note{margin-top:10px;font-family:var(--mono);font-size:9.5px;color:var(--ink3);padding-top:9px;border-top:1px solid var(--line);}
.dark .flow-box,.deep .flow-box{background:var(--d3);border-color:var(--d-line);color:var(--dfg);}
.dark .flow-note,.deep .flow-note{color:var(--dfg3);border-color:var(--d-line);}
@media (max-width:760px){ .flow{flex-direction:column;align-items:stretch;} .flow-arrow{transform:rotate(90deg);justify-content:center;} }

/* ===== LISTEN ===== */
.pl{display:grid;grid-template-columns:repeat(auto-fill,minmax(298px,1fr));gap:8px;}
.pi{padding:13px 17px;border-radius:var(--rm);display:flex;gap:12px;align-items:baseline;
  font-size:14.6px;color:var(--ink2);background:#fff;border:1px solid var(--line);
  transition:.28s var(--ease);}
.pi:hover{color:var(--ink);border-color:var(--blue2);transform:translateX(4px);box-shadow:var(--sh-s);}
.pi b{font-family:var(--mono);font-size:9.5px;font-weight:700;flex-shrink:0;padding-top:2px;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.dark .pi,.deep .pi{background:rgba(255,255,255,.045);border-color:var(--d-line);color:var(--dfg2);}
.dark .pi:hover,.deep .pi:hover{color:#fff;background:rgba(46,107,255,.14);border-color:rgba(91,140,255,.42);}

/* ===== PAKETE ===== */
.packs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;}
.pk{border-radius:var(--rm);border:1px solid var(--line);padding:24px 26px;background:#fff;
  display:flex;flex-direction:column;position:relative;overflow:hidden;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.pk:hover{transform:translateY(-4px);box-shadow:var(--sh-m);border-color:var(--line2);}
/* Helle Paketkarten stehen im dunklen Abschnitt: Button-Farben zurückholen */
.dark .pk.ag .b,.deep .pk.ag .b{color:var(--ink);background:#fff;border-color:var(--line2);}
.dark .pk.ag .b:hover,.deep .pk.ag .b:hover{background:var(--tint);border-color:var(--blue);}
.pk.hl{background:linear-gradient(155deg,#131E3A,#0A1122 70%);border-color:rgba(91,140,255,.35);color:#fff;}
.pk.hl::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 260px at 100% 0%,rgba(122,91,255,.28),transparent 66%);}
.pk.hl>*{position:relative;}
.pk.hl:hover{box-shadow:0 26px 56px rgba(46,107,255,.34);}
.pk.hl h3{color:#fff;} .pk.hl>p{color:var(--dfg2);} .pk.hl li{color:var(--dfg2);}
.pk.hl .st{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.pk.hl li::before{border-color:var(--cyan);}
.pk .tp{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:11px;}
.pk h3{font-size:22px;color:var(--ink);}
.pk .st{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.pk>p{color:var(--ink2);font-size:14.5px;margin-bottom:16px;}
.pk ul{list-style:none;display:grid;gap:8px;margin-bottom:21px;}
.pk li{font-size:14px;color:var(--ink2);padding-left:19px;position:relative;}
.pk li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;border:1.6px solid var(--blue);}
.pk .b{margin-top:auto;}
@media (max-width:900px){ .packs{grid-template-columns:1fr;} }

/* ===== FRAGEN ===== */
.qa{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;}
.q{padding:21px 23px;border-radius:var(--rm);border:1px solid var(--line);background:#fff;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.q:hover{transform:translateY(-2px);box-shadow:var(--sh-m);border-color:var(--line2);}
.q h3{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.07em;text-transform:uppercase;
  margin-bottom:10px;line-height:1.55;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.q p{color:var(--ink2);font-size:14.6px;line-height:1.66;}
.dark .q,.deep .q{background:rgba(255,255,255,.045);border-color:var(--d-line);}
.dark .q p,.deep .q p{color:var(--dfg2);}
@media (max-width:820px){ .qa{grid-template-columns:1fr;} }

/* ===== NOTE ===== */
.note{border-radius:var(--rm);border:1px solid rgba(46,107,255,.3);background:rgba(46,107,255,.10);
  padding:15px 19px;font-size:14.3px;margin:18px 0;color:var(--ink2);}
.note b{color:var(--ink);}
.dark .note,.deep .note{color:var(--dfg2);border-color:rgba(91,140,255,.34);background:rgba(46,107,255,.13);}
.dark .note b,.deep .note b{color:#fff;}
.sh-b .note{color:var(--dfg2);border-color:rgba(91,140,255,.34);background:rgba(46,107,255,.13);}
.sh-b .note b{color:#fff;}

/* ===== FORMULAR ===== */
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(16px,2.2vw,30px);}
.f{margin-bottom:16px;}
.f.wide{grid-column:1 / -1;}
.f label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dfg3);margin-bottom:7px;padding-left:4px;font-weight:700;}
.f label em{color:var(--cyan);font-style:normal;}
.f input,.f textarea,.f select{width:100%;min-width:0;background:rgba(255,255,255,.05);
  border:1px solid var(--d-line2);border-radius:var(--rs);color:#fff;font-family:inherit;font-size:16.5px;
  padding:13px 17px;transition:border-color .26s var(--ease),box-shadow .26s var(--ease),background .26s var(--ease);}
.f input:focus,.f textarea:focus,.f select:focus{outline:none;border-color:var(--blue2);
  background:rgba(255,255,255,.08);box-shadow:0 0 0 4px rgba(46,107,255,.18);}
.f input::placeholder,.f textarea::placeholder{color:var(--dfg3);}
.f textarea{min-height:126px;resize:vertical;line-height:1.62;}
.f select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236E7B99' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;background-size:17px;padding-right:42px;}
.f select option{background:#101828;color:#fff;}
.ok{grid-column:1 / -1;display:flex;gap:12px;align-items:flex-start;font-size:13.3px;color:var(--dfg3);margin:4px 0 20px;line-height:1.58;}
.ok input{appearance:none;width:24px;height:24px;flex:0 0 24px;border-radius:7px;border:1px solid var(--d-line2);
  background:rgba(255,255,255,.05);cursor:pointer;flex-shrink:0;margin-top:1px;position:relative;transition:.24s var(--ease);}
.ok input:hover{border-color:var(--blue2);}
.ok input:checked{background:var(--blue);border-color:transparent;}
.ok input:checked::after{content:"";position:absolute;left:8px;top:4px;width:5px;height:10px;
  border-right:2.2px solid #fff;border-bottom:2.2px solid #fff;transform:rotate(42deg);}
.ok a{color:var(--blue2);text-decoration:underline;text-underline-offset:2px;}
.fs{grid-column:1 / -1;display:none;border-radius:var(--rm);border:1px solid rgba(91,140,255,.34);
  background:rgba(46,107,255,.13);padding:18px 20px;font-size:14.3px;line-height:1.62;color:var(--dfg2);}
.fs.show{display:block;}
.fs strong{color:#fff;}
.fs .alt{margin-top:14px;padding-top:13px;border-top:1px solid var(--d-line);display:flex;gap:9px;flex-wrap:wrap;}
.fs .alt .b{padding:10px 17px;font-size:13px;}
@media (max-width:760px){ .form{grid-template-columns:1fr;} }

/* ===== KONTAKTDATEN ===== */
.cd{display:grid;grid-template-columns:repeat(auto-fit,minmax(206px,1fr));gap:9px;}
.cd>div{padding:18px 20px;border-radius:var(--rm);border:1px solid var(--d-line);background:rgba(255,255,255,.045);
  transition:.28s var(--ease);}
.cd>div:hover{border-color:rgba(91,140,255,.4);background:rgba(46,107,255,.12);}
.cd .lbl{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--dfg3);margin-bottom:7px;font-weight:700;}
.cd .v{font-size:16.5px;font-weight:800;letter-spacing:-.02em;line-height:1.35;color:#fff;}
.cd a.v:hover{color:var(--cyan);}
.cd .n{font-size:13.8px;color:var(--dfg2);font-weight:400;letter-spacing:0;}


/* ===== EINSATZGEBIET + DIREKTKONTAKT ===== */
.reach{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(16px,2.2vw,28px);
  align-items:stretch;margin-top:clamp(30px,3.4vw,46px);}
.reach-map{border-radius:var(--rl);border:1px solid var(--d-line);background:rgba(255,255,255,.05);
  padding:20px 20px 16px;display:flex;flex-direction:column;}
.reach-map .geo{width:100%;height:auto;margin:2px 0 6px;flex:1;min-height:0;}
.geo-dot{fill:#8FB4FF;}
.geo-lbl{fill:#B6C2DA;font-family:var(--mono);font-size:10.5px;letter-spacing:.02em;}
.geo-km{fill:#5FD0FF;font-family:var(--mono);font-size:10px;letter-spacing:.2em;font-weight:700;}
.geo-home{fill:#fff;font-family:var(--font);font-size:12.5px;font-weight:800;letter-spacing:-.01em;}
.geo-pulse{fill:none;stroke:#5FD0FF;stroke-opacity:.5;stroke-width:1.2;}
.reach-cap{font-size:13.6px;color:var(--dfg2);line-height:1.55;margin-top:auto;padding-top:12px;
  border-top:1px solid var(--d-line);}
.reach-cap b{color:#fff;}

.dk{border-radius:var(--rl);border:1px solid var(--d-line);padding:24px clamp(20px,2.4vw,30px);
  background:linear-gradient(158deg,var(--d2),var(--d1) 72%);position:relative;overflow:hidden;
  display:flex;flex-direction:column;}
.dk::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 260px at 100% 0%,rgba(122,91,255,.24),transparent 66%);}
.dk>*{position:relative;}
.dk h3{font-size:21px;margin-bottom:18px;}
.dkl{list-style:none;display:grid;gap:3px;margin-bottom:18px;}
.dkl li{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:12px;
  padding:10px 12px;border-radius:var(--rm);transition:background .26s var(--ease);}
.dkl li:hover{background:rgba(255,255,255,.06);}
.dki{width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  background:rgba(46,107,255,.16);border:1px solid rgba(91,140,255,.3);}
.dki svg{width:17px;height:17px;stroke:#8FB4FF;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;}
.dkl .lbl{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--dfg3);font-weight:700;margin-bottom:1px;}
.dkl .val{display:block;font-size:15.6px;font-weight:700;color:#fff;letter-spacing:-.01em;line-height:1.35;}
.dkl a.val:hover{color:var(--cyan);}
.dkl .val small{display:block;font-size:12.8px;font-weight:400;color:var(--dfg2);letter-spacing:0;}
.dk-act{display:grid;gap:8px;margin-top:auto;}
.b-wa{background:#25D366;color:#07270F;border-color:transparent;box-shadow:0 12px 30px rgba(37,211,102,.26);}
.dark .b-wa,.deep .b-wa{background:#25D366;color:#07270F;border-color:transparent;}
.dark .b-wa:hover,.deep .b-wa:hover,.b-wa:hover{background:#31E276;color:#07270F;box-shadow:0 18px 40px rgba(37,211,102,.36);}
.b-wa svg{width:17px;height:17px;fill:currentColor;flex-shrink:0;}
.b-wa em{display:flex;align-items:center;gap:9px;}
@media (max-width:900px){ .reach{grid-template-columns:1fr;} }
@media (max-width:900px){ .reach-map .geo{max-width:520px;margin-inline:auto;} }
@media (max-width:760px){ .geo-lbl{font-size:14px;} .geo-km{font-size:13px;} .geo-home{font-size:17px;} .geo-dot{r:4.4;} }

/* ===== RECHTLICHES ===== */
.legal{position:relative;padding:clamp(26px,3vw,42px) var(--pad) clamp(46px,5vw,72px);background:var(--d1);}
.legal::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(600px 300px at 50% 0%,rgba(46,107,255,.12),transparent 70%);}
.legal-in{position:relative;max-width:var(--wrap);display:flex;justify-content:space-between;align-items:center;
  gap:22px;flex-wrap:wrap;border-radius:var(--rl);border:1px solid var(--d-line);padding:24px 28px;
  background:rgba(255,255,255,.04);}
.legal-in h2{font-size:clamp(20px,2.3vw,27px);margin-top:9px;margin-bottom:6px;color:#fff;}
.legal-in p{color:var(--dfg2);font-size:14.2px;}
.legal-in .g{display:flex;gap:9px;flex-wrap:wrap;}

/* ===== MODALE ===== */
.sh{position:fixed;inset:0;z-index:400;display:none;}
.sh:target{display:block;}
.sh-x{position:absolute;inset:0;background:rgba(3,6,14,.66);backdrop-filter:blur(4px);}
.sh-p{position:absolute;top:0;right:0;bottom:0;width:min(760px,100%);background:var(--d1);
  display:flex;flex-direction:column;overflow:hidden;box-shadow:-34px 0 80px rgba(0,0,0,.6);}
.sh:target .sh-p{animation:inn .34s var(--ease) both;}
@keyframes inn{from{transform:translateX(30px);opacity:0;}to{transform:none;opacity:1;}}
.sh-h{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;
  padding:24px clamp(20px,3vw,36px) 16px;border-bottom:1px solid var(--d-line);flex-shrink:0;}
.sh-h h2{font-size:clamp(21px,2.7vw,29px);margin-top:8px;color:#fff;}
.sh-c{width:42px;height:42px;border-radius:50%;border:1px solid var(--d-line2);background:rgba(255,255,255,.05);
  display:flex;align-items:center;justify-content:center;color:var(--dfg2);flex-shrink:0;transition:.26s var(--ease);}
.sh-c:hover{color:#fff;border-color:var(--blue2);background:rgba(46,107,255,.18);}
.sh-c svg{width:17px;height:17px;}
.sh-b{overflow-y:auto;overscroll-behavior:contain;padding:22px clamp(20px,3vw,36px);}
.sh-b h3{font-size:15px;margin:22px 0 8px;letter-spacing:-.015em;color:#fff;}
.sh-b h3:first-child{margin-top:0;}
.sh-b p,.sh-b li{color:var(--dfg2);font-size:14.8px;}
.sh-b p{margin-bottom:10px;}
.sh-b ul{padding-left:20px;margin-bottom:11px;display:grid;gap:5px;}
.sh-b a{color:var(--blue2);text-decoration:underline;text-underline-offset:2px;}
.sh-f{padding:14px clamp(20px,3vw,36px);border-top:1px solid var(--d-line);display:flex;justify-content:flex-end;flex-shrink:0;}
body.lock{overflow:hidden;}

/* ===== FUSS ===== */
footer{background:var(--void);color:var(--dfg);position:relative;
  padding:clamp(60px,7vw,104px) var(--pad) 24px;}   /* var(--pad): gleicher Seitenabstand wie die Sektionen */
footer::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(760px 380px at 28% 0%,rgba(46,107,255,.17),transparent 66%),
             radial-gradient(560px 320px at 96% 30%,rgba(122,91,255,.13),transparent 68%);}
footer>*{position:relative;}
.f-brand{display:flex;align-items:center;gap:11px;margin-bottom:14px;}
.f-word b{display:block;font-size:16px;font-weight:800;letter-spacing:-.02em;color:#fff;line-height:1.2;}
.f-word span{display:block;font-family:var(--mono);font-size:9px;letter-spacing:.15em;text-transform:uppercase;
  color:var(--blue2);font-weight:600;margin-top:2px;}
.fg{max-width:var(--wrap);display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:clamp(22px,3.2vw,44px);padding-bottom:26px;}
.fg p{color:var(--dfg2);font-size:14.2px;max-width:34ch;}
.fg h2{font-family:var(--mono);font-weight:700;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  line-height:1.4;
  color:var(--dfg3);margin-bottom:12px;}
.fg a,.fg span{display:block;color:var(--dfg2);font-size:14px;margin-bottom:8px;transition:color .24s var(--ease);}
.fg a:hover{color:var(--cyan);}
/* Tippfläche der Fußzeilen-Links auf Fingergröße bringen, ohne das Bild zu verändern:
   Innenabstand vergrößert die Fläche, der negative Außenabstand nimmt ihn optisch zurück. */
.fg a{padding-block:9px;margin-bottom:-10px;}
.fb{max-width:var(--wrap);border-top:1px solid var(--d-line);padding-top:18px;display:flex;
  justify-content:space-between;gap:14px;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;
  letter-spacing:.07em;color:var(--dfg3);}
.fb a{display:inline-block;vertical-align:middle;padding:11px 5px;margin:-11px -4px;}
.fb a:hover{color:var(--cyan);}

/* ===== RESPONSIVE ===== */
@media (min-width:1121px){ footer,.legal{margin-left:var(--side);width:calc(100% - var(--side));} }
@media (max-width:1120px){
  .shell{grid-template-columns:1fr;}
  .side{display:none;}
  main{grid-column:1;padding-top:62px;}
  .top{display:flex;}
  .hero-grid,.ref,.qa,.form,.packs{grid-template-columns:1fr;}
  .bh{grid-template-columns:30px minmax(0,1fr);}
  .ind{padding-left:0;}
  :root{--gut:30px;--rl:20px;}
  .hero-in{max-width:100%;}
}
@media (max-width:760px){
  .spine{grid-template-columns:1fr;}
}
@media (max-width:640px){
  body{font-size:16px;}
  .hero h1{font-size:clamp(31px,8.8vw,46px);}
  .pl{grid-template-columns:1fr;}
  .ph{position:static;width:60%;margin:14px auto 0;right:auto;bottom:auto;}
  .cd,.fg{grid-template-columns:1fr;}
  .fb{flex-direction:column;align-items:center;text-align:center;}
  .sh-p{width:100%;}
  .legal-in{align-items:flex-start;padding:20px 18px;}
  .legal-in .g{width:100%;} .legal-in .g .b{flex:1 1 100%;justify-content:center;}
  .meta li{grid-template-columns:1fr;gap:3px;}
}
@media print{
  .side,.top,.drawer,.tick,.legal-in .g,.sh-c,.sh-f,.wave,.hero-logo{display:none!important;}
  .shell{grid-template-columns:1fr;} main{grid-column:1;padding-top:0;}
  .sh{display:block!important;position:static;} .sh-p{position:static;width:100%;box-shadow:none;}
  .sh-x{display:none!important;}
  body,main,.sec,.hero,footer,.legal{background:#fff!important;color:#000!important;}
  .sec::before,.hero::before,.hero::after,footer::before,.legal::before{display:none!important;}
  .bh h2,h1,h3{color:#000!important;} p,.sub,li,span{color:#222!important;}
}

/* ============================================================
   MEHRSEITIGE STRUKTUR — Ergänzungen
   ============================================================ */
/* Seitenleiste: Seiten- und Abschnittsnavigation getrennt */
.side-group{display:block;font-family:var(--mono);font-size:8.5px;letter-spacing:.17em;
  text-transform:uppercase;color:var(--dfg3);font-weight:700;margin:14px 12px 6px;}
.side-group:first-child{margin-top:0;}
.side-nav a.page{font-weight:600;color:var(--dfg);}
.side-nav a.page[aria-current="page"]{color:#fff;
  background:linear-gradient(100deg,rgba(46,107,255,.3),rgba(122,91,255,.18));
  box-shadow:inset 0 0 0 1px rgba(91,140,255,.4);}
.side-sub{border-top:1px solid var(--d-line);margin-top:12px;padding-top:6px;}
.drawer .dgroup{font-family:var(--mono);font-size:9.5px;letter-spacing:.17em;text-transform:uppercase;
  color:var(--dfg3);font-weight:700;padding:14px 16px 4px;}

/* Brotkrumen */
.crumb{font-family:var(--mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;
  display:flex;gap:9px;flex-wrap:wrap;align-items:center;margin-bottom:18px;}
.crumb a{color:var(--dfg3);transition:color .24s var(--ease);
  display:inline-block;padding:9px 4px;margin:-9px -4px;}
.crumb a:hover{color:var(--cyan);}
.crumb span{color:var(--blue2);}
.crumb i{font-style:normal;color:var(--dfg3);opacity:.55;}
.light .crumb a{color:var(--ink3);} .light .crumb a:hover{color:var(--blue);}
.light .crumb span{color:var(--blue);} .light .crumb i{color:var(--ink3);}

/* Seitenkopf für Unterseiten */
.phead{position:relative;overflow:hidden;background:var(--void);
  padding:clamp(40px,5vw,72px) var(--pad) clamp(86px,9.5vw,138px);}
.phead::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(820px 520px at 82% -12%,rgba(46,107,255,.26),transparent 62%),
             radial-gradient(620px 420px at 2% 108%,rgba(122,91,255,.20),transparent 64%);}
.phead-in{position:relative;z-index:1;max-width:var(--wrap);}
.phead h1{font-size:clamp(32px,5.2vw,58px);color:#fff;margin:12px 0 18px;max-width:19ch;}
.phead h1 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.phead p{color:var(--dfg2);font-size:17.5px;max-width:60ch;}
.phead .g{display:flex;gap:11px;flex-wrap:wrap;margin-top:26px;}

/* Referenzprojekte */
.proj{display:grid;gap:clamp(18px,2.4vw,30px);}
.pj{border-radius:var(--rl);overflow:hidden;border:1px solid var(--d-line);
  background:linear-gradient(150deg,var(--d2),var(--d1));box-shadow:var(--sh-l);}
.light .pj{background:#fff;border-color:var(--line);box-shadow:var(--sh-m);}
.pj-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(20px,3vw,40px);padding:clamp(20px,2.6vw,36px);align-items:center;}
.pj-shot{position:relative;}
.pj-shot .frame{border-radius:var(--rm);overflow:hidden;background:#fff;
  border:1px solid rgba(255,255,255,.16);box-shadow:0 30px 62px rgba(0,0,0,.5);}
.light .pj-shot .frame{border-color:var(--line2);box-shadow:var(--sh-l);}
.pj-tag{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:10px;
  letter-spacing:.14em;text-transform:uppercase;font-weight:700;padding:5px 12px;border-radius:var(--rp);
  background:rgba(46,107,255,.16);color:var(--blue2);border:1px solid rgba(91,140,255,.32);margin-bottom:12px;}
.pj-tag.demo{background:rgba(122,91,255,.16);color:#B9A6FF;border-color:rgba(122,91,255,.36);}
.light .pj-tag{background:var(--tint);color:var(--blue);border-color:rgba(46,107,255,.28);}
.pj h2{font-size:clamp(23px,2.9vw,32px);margin-bottom:11px;}
.pj-lead{font-size:15.6px;margin-bottom:16px;}
.pj-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px;}
.pj-cta .b{flex:1 1 auto;min-width:0;}
.pj-cta .b em{white-space:nowrap;}
@media (max-width:560px){ .pj-cta .b{flex:1 1 100%;} }

/* Prosa (Rechtstexte) */
.prose{max-width:76ch;}
.prose h2{font-size:clamp(21px,2.4vw,27px);margin:34px 0 10px;}
.prose h2:first-child{margin-top:0;}
.prose h3{font-size:17px;margin:22px 0 7px;}
.prose p{margin-bottom:11px;font-size:16px;}
.prose ul{padding-left:21px;margin-bottom:13px;display:grid;gap:5px;}
.prose li{font-size:16px;}
.prose a{color:var(--blue-link);text-decoration:underline;text-underline-offset:2px;}
.prose .mark{display:inline;width:auto;height:auto;color:var(--blue);filter:none;}

/* Phasen (Vorgehen) */
.phase{display:grid;grid-template-columns:clamp(52px,6vw,84px) minmax(0,1fr);
  gap:clamp(16px,3vw,34px);padding:clamp(22px,3vw,34px) 0;border-top:1px solid var(--line);}
.dark .phase,.deep .phase{border-color:var(--d-line);}
.phase:last-child{border-bottom:1px solid var(--line);}
.dark .phase:last-child,.deep .phase:last-child{border-color:var(--d-line);}
.phase .pn{font-family:var(--mono);font-size:clamp(24px,3.4vw,40px);font-weight:700;line-height:1;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;padding-top:4px;}
.phase h3{font-size:clamp(20px,2.4vw,26px);margin-bottom:9px;}
.phase p{font-size:15.8px;max-width:62ch;}
.phase p+p{margin-top:9px;}
.phase .out{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line2);
  font-size:14.4px;display:grid;grid-template-columns:auto 1fr;gap:10px;align-items:baseline;}
.dark .phase .out,.deep .phase .out{border-color:var(--d-line2);}
.phase .out b{font-family:var(--mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--blue-link);white-space:nowrap;}

/* Prüfliste */
.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;}
.ck{display:grid;grid-template-columns:20px 1fr;gap:12px;align-items:start;padding:14px 17px;
  border-radius:var(--rm);border:1px solid var(--d-line);background:rgba(255,255,255,.045);}
.light .ck{border-color:var(--line);background:#fff;}
.ck svg{width:18px;height:18px;margin-top:2px;flex-shrink:0;}
.ck svg path{stroke:var(--cyan);stroke-width:2.2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.light .ck svg path{stroke:var(--blue);}
.ck b{display:block;font-size:15px;font-weight:700;margin-bottom:2px;}
.dark .ck b,.deep .ck b{color:#fff;}
.ck span{display:block;font-size:14px;color:var(--ink2);line-height:1.55;}
.dark .ck span,.deep .ck span{color:var(--dfg2);}
@media (max-width:760px){ .checks{grid-template-columns:1fr;} .pj-grid{grid-template-columns:1fr;}
  .phase{grid-template-columns:1fr;gap:6px;} .phase .pn{padding-top:0;} }

/* ============================================================
   PREISE & GOLD-HERVORHEBUNG
   ============================================================ */
:root{ --gold:#C9A227; --gold2:#E8C86A; --gold3:#F5E3A8; --gold-d:#7A5F14; }

/* Hervorgehobenes Paket — kräftige Goldfassung */
.pk.hl{
  border:2px solid var(--gold);
  box-shadow:0 0 0 1px rgba(201,162,39,.30), 0 0 34px rgba(201,162,39,.20),
             0 24px 56px rgba(5,8,15,.42);
}
.pk.hl::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  background:linear-gradient(160deg,rgba(232,200,106,.16),transparent 46%);}
.pk.hl:hover{border-color:var(--gold2);
  box-shadow:0 0 0 1px rgba(232,200,106,.45), 0 0 46px rgba(201,162,39,.34), 0 30px 66px rgba(5,8,15,.5);}
.pk.hl .st{background:none;-webkit-text-fill-color:var(--gold3);color:var(--gold3);}
.pk.hl li::before{border-color:var(--gold2);}
.pk.hl .b-solid{background:linear-gradient(120deg,var(--gold2),var(--gold));color:#221A02;
  border-color:transparent;box-shadow:0 12px 30px rgba(201,162,39,.32);}
.pk.hl .b-solid:hover{background:linear-gradient(120deg,var(--gold3),var(--gold2));color:#221A02;
  box-shadow:0 18px 42px rgba(201,162,39,.46);}
/* Schleife oben rechts */
.pk .ribbon{position:absolute;top:0;right:0;z-index:2;
  font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;
  color:#221A02;background:linear-gradient(120deg,var(--gold2),var(--gold));
  padding:6px 15px;border-bottom-left-radius:12px;}

/* Preisdarstellung */
.packs3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:stretch;}
.pk .price{display:flex;align-items:baseline;gap:8px;margin:2px 0 4px;}
.pk .price b{font-size:clamp(30px,3.6vw,40px);font-weight:800;letter-spacing:-.035em;line-height:1;color:var(--ink);}
.pk .price span{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink3);}
.pk .dur{display:inline-flex;align-items:center;gap:7px;font-size:12.5px;font-weight:600;
  padding:4px 11px;border-radius:var(--rp);border:1px solid var(--line2);color:var(--ink2);margin-bottom:14px;}
/* Nur die hervorgehobene Karte ist dunkel — deshalb hier goldene Schrift */
.pk.hl .price b{color:var(--gold3);}
.pk.hl .price span{color:rgba(245,227,168,.78);}
.pk.hl .dur{border-color:rgba(232,200,106,.45);color:var(--gold3);}
.pk .dur::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex-shrink:0;}

/* Laufende Leistung — eigenes Band */
.run{margin-top:14px;border-radius:var(--rl);border:1px solid var(--d-line);
  background:linear-gradient(140deg,rgba(46,107,255,.14),rgba(122,91,255,.08));
  padding:clamp(20px,2.6vw,32px);display:grid;
  grid-template-columns:minmax(0,1fr) auto;gap:clamp(18px,3vw,40px);align-items:center;}
.light .run{border-color:var(--line);background:linear-gradient(140deg,var(--tint),#fff);}
.run h3{font-size:clamp(21px,2.4vw,27px);margin-bottom:8px;}
.run p{font-size:15.2px;max-width:56ch;}
.run p+p{margin-top:10px;}
.run ul{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin-top:13px;}
.run li{font-family:var(--mono);font-size:10.5px;letter-spacing:.05em;padding:4px 11px;border-radius:var(--rp);
  border:1px solid var(--d-line);color:var(--dfg2);}
.light .run li{border-color:var(--line);color:var(--ink2);background:#fff;}
.run-p{text-align:right;flex-shrink:0;}
.run-p b{display:block;font-size:clamp(32px,3.8vw,44px);font-weight:800;letter-spacing:-.035em;line-height:1;color:#fff;}
.light .run-p b{color:var(--ink);}
.run-p span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dfg3);margin-top:7px;}
.light .run-p span{color:var(--ink3);}
.run-p .b{margin-top:16px;}

/* Vertrauensleiste unter den Paketen */
.trust{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px;}
.tw{display:flex;gap:11px;align-items:flex-start;padding:16px 17px;border-radius:var(--rm);
  border:1px solid var(--d-line);background:rgba(255,255,255,.05);}
.light .tw{border-color:var(--line);background:#fff;box-shadow:var(--sh-s);}
.tw-i{flex-shrink:0;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;
  background:rgba(46,107,255,.16);border:1px solid rgba(91,140,255,.3);}
.light .tw-i{background:var(--tint);border-color:rgba(46,107,255,.24);}
.tw-i svg{width:17px;height:17px;fill:none;stroke:var(--blue2);stroke-width:1.9;
  stroke-linecap:round;stroke-linejoin:round;}
.light .tw-i svg{stroke:var(--blue);}
.tw b{display:block;font-size:13.6px;font-weight:700;letter-spacing:-.01em;margin-bottom:5px;color:#fff;}
.light .tw b{color:var(--ink);}
.tw span{display:block;font-size:13px;line-height:1.55;color:var(--dfg2);}
.light .tw span{color:var(--ink2);}
@media (max-width:1120px){ .trust{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:620px){ .trust{grid-template-columns:1fr;} }

/* Stundensatz-Hinweis */
.rate{display:grid;grid-template-columns:auto 1fr;gap:16px;align-items:center;
  border-radius:var(--rm);border:1px solid var(--d-line);background:rgba(255,255,255,.05);
  padding:18px 22px;margin-top:20px;}
.light .rate{border-color:var(--line);background:#fff;}
.rate b{font-size:clamp(24px,2.6vw,30px);font-weight:800;letter-spacing:-.03em;line-height:1;white-space:nowrap;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
.rate span{font-size:14.8px;color:var(--ink2);}
.dark .rate span,.deep .rate span{color:var(--dfg2);}

/* Hervorgehobenes Festpreis-Angebot (Privat) */
.offer{position:relative;overflow:hidden;border-radius:var(--rl);border:2px solid var(--gold);
  background:linear-gradient(155deg,#16213C,#0E1730 72%);color:var(--dfg);
  padding:clamp(24px,3vw,40px);
  box-shadow:0 0 0 1px rgba(201,162,39,.28),0 0 38px rgba(201,162,39,.16),0 24px 56px rgba(5,8,15,.34);}
.offer::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(520px 320px at 100% 0%,rgba(232,200,106,.16),transparent 62%);}
.offer>*{position:relative;}
.offer .ribbon{position:absolute;top:0;right:0;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;
  text-transform:uppercase;font-weight:700;color:#221A02;
  background:linear-gradient(120deg,var(--gold2),var(--gold));padding:7px 16px;border-bottom-left-radius:12px;}
.offer-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:start;
  padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid rgba(232,200,106,.26);}
.offer h3{font-size:clamp(23px,2.9vw,32px);color:#fff;margin-bottom:9px;max-width:20ch;}
.offer-top p{font-size:15.6px;color:var(--dfg2);max-width:52ch;}
.offer-price{text-align:right;flex-shrink:0;}
.offer-price b{display:block;font-size:clamp(36px,4.4vw,52px);font-weight:800;letter-spacing:-.04em;
  line-height:1;color:var(--gold3);}
.offer-price span{display:block;font-family:var(--mono);font-size:10.5px;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(245,227,168,.7);margin-top:8px;}
.offer-list{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 22px;}
.offer-list li{display:grid;grid-template-columns:18px 1fr;gap:11px;align-items:start;font-size:15px;color:var(--dfg2);}
.offer-list svg{width:16px;height:16px;margin-top:4px;}
.offer-list svg path{stroke:var(--gold2);stroke-width:2.4;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.offer .b{margin-top:24px;}
.offer .b-solid{background:linear-gradient(120deg,var(--gold2),var(--gold));color:#221A02;border-color:transparent;
  box-shadow:0 12px 30px rgba(201,162,39,.30);}
.offer .b-solid:hover{background:linear-gradient(120deg,var(--gold3),var(--gold2));color:#221A02;
  box-shadow:0 18px 42px rgba(201,162,39,.44);}

/* MwSt.-Hinweis */
.vat{font-family:var(--mono);font-size:11px;letter-spacing:.07em;color:var(--dfg3);margin-top:16px;}
.light .vat{color:var(--ink3);}

@media (max-width:1000px){ .packs3{grid-template-columns:1fr;} }
@media (max-width:760px){
  .run{grid-template-columns:1fr;} .run-p{text-align:left;}
  .offer-top{grid-template-columns:1fr;} .offer-price{text-align:left;}
  .offer-list{grid-template-columns:1fr;}
  .rate{grid-template-columns:1fr;gap:8px;}
}

/* ============================================================
   SILBER-FASSUNG, GOLD-BAND, PORTRAIT-KONTAKT, STAFFELPREIS
   ============================================================ */
:root{ --silver:#AEB8CB; --silver2:#DDE4EF; --silver3:#8B96AB; }

/* Silberne Umrandung für die Nebenpakete */
.pk.ag{border:2px solid transparent;background:
    linear-gradient(#fff,#fff) padding-box,
    linear-gradient(150deg,var(--silver2) 0%,var(--silver) 42%,var(--silver3) 68%,var(--silver2) 100%) border-box;
  box-shadow:0 0 0 1px rgba(174,184,203,.22),0 16px 40px rgba(5,8,15,.28);}
.pk.ag:hover{box-shadow:0 0 0 1px rgba(174,184,203,.45),0 24px 54px rgba(5,8,15,.36);}
.pk.ag .st{background:linear-gradient(140deg,var(--silver3),var(--silver));
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.pk.ag li::before{border-color:var(--silver3);}

/* Goldband für die laufende Leistung */
.run.gold{border:2px solid var(--gold);position:relative;overflow:hidden;
  background:linear-gradient(150deg,#1B2440,#121B31 72%);
  box-shadow:0 0 0 1px rgba(201,162,39,.30),0 0 34px rgba(201,162,39,.18),0 22px 52px rgba(5,8,15,.4);}
.run.gold::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(560px 300px at 100% 0%,rgba(232,200,106,.15),transparent 62%);}
.run.gold>*{position:relative;}
.run.gold .ribbon{position:absolute;top:0;right:0;z-index:2;font-family:var(--mono);font-size:9.5px;
  letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:#221A02;
  background:linear-gradient(120deg,var(--gold2),var(--gold));padding:6px 15px;border-bottom-left-radius:12px;}
.run.gold .run-p b{color:var(--gold3);}
.run.gold .run-p span{color:rgba(245,227,168,.72);}
.run.gold li{border-color:rgba(232,200,106,.3);color:var(--dfg2);}
.run.gold .b-solid{background:linear-gradient(120deg,var(--gold2),var(--gold));color:#221A02;
  border-color:transparent;box-shadow:0 12px 30px rgba(201,162,39,.30);}
.run.gold .b-solid:hover{background:linear-gradient(120deg,var(--gold3),var(--gold2));color:#221A02;
  box-shadow:0 18px 42px rgba(201,162,39,.44);}

/* Staffelpreis: erste Stunde + Folgeeinheiten */
.tier{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px;margin-top:20px;}
.tr{position:relative;border-radius:var(--rm);border:1px solid var(--d-line);
  background:rgba(255,255,255,.05);padding:22px 24px;}
.light .tr{border-color:var(--line);background:#fff;}
.tr .tl{display:block;font-family:var(--mono);font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--blue2);margin-bottom:11px;}
.light .tr .tl{color:var(--blue);}
.tr b{display:block;font-size:clamp(27px,3.2vw,36px);font-weight:800;letter-spacing:-.035em;
  line-height:1;color:#fff;margin-bottom:9px;}
.light .tr b{color:var(--ink);}
.tr b em{font-style:normal;font-size:.46em;font-weight:700;letter-spacing:.01em;color:var(--dfg3);margin-left:5px;}
.light .tr b em{color:var(--ink3);}
.tr p{font-size:14.6px;line-height:1.55;}
.tr.first{border-color:rgba(91,140,255,.42);background:linear-gradient(150deg,rgba(46,107,255,.16),rgba(122,91,255,.07));}
.light .tr.first{border-color:rgba(46,107,255,.32);background:linear-gradient(150deg,var(--tint),#fff);}
@media (max-width:760px){ .tier{grid-template-columns:1fr;} }

/* Direkter Kontakt mit Portrait */
.dk.pf{background:none;border-color:rgba(255,255,255,.16);}
.dk.pf::before{background:
    linear-gradient(96deg,rgba(9,14,26,.96) 0%,rgba(9,14,26,.90) 30%,rgba(9,14,26,.58) 58%,rgba(9,14,26,.40) 100%),
    linear-gradient(180deg,rgba(9,14,26,.55) 0%,transparent 26%,transparent 62%,rgba(9,14,26,.80) 100%),
    url(paul-bg.webp) 12% 42% / cover no-repeat;}
.dk.pf::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(480px 300px at 106% -8%,rgba(46,107,255,.30),transparent 64%);}
.dk.pf>*{position:relative;z-index:1;}
.dk-me{display:flex;align-items:center;gap:10px;margin-bottom:18px;
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  font-weight:700;color:var(--cyan);}
.dk-me::before{content:"";width:26px;height:1.5px;background:var(--cyan);flex-shrink:0;}

/* Anklickbare Referenz-Teaser */
a.pi{cursor:pointer;}
a.pi:hover b{filter:brightness(1.15);}

/* Zweites Angebot ohne Festpreis — blaue Fassung statt Gold */
.offer.alt{border:2px solid rgba(91,140,255,.55);
  background:linear-gradient(155deg,#152040,#0D1730 74%);
  box-shadow:0 0 0 1px rgba(91,140,255,.24),0 0 34px rgba(46,107,255,.16),0 22px 52px rgba(5,8,15,.32);}
.offer.alt::before{background:radial-gradient(520px 320px at 100% 0%,rgba(95,208,255,.18),transparent 62%);}
.offer.alt .ribbon{background:linear-gradient(120deg,#2E6BFF,#7A5BFF);color:#fff;}
.offer.alt .offer-top{border-bottom-color:rgba(91,140,255,.3);}
.offer.alt .offer-list svg path{stroke:var(--cyan);}
.offer.alt .offer-price b{color:#fff;font-size:clamp(20px,2.3vw,26px);letter-spacing:-.025em;line-height:1.2;}
.offer.alt .offer-price span{color:var(--dfg3);}
.offer.alt .b-solid{background:var(--grad);color:#fff;box-shadow:var(--glow);}
.offer.alt .b-solid:hover{background:var(--grad);box-shadow:0 20px 44px rgba(46,107,255,.46);}

/* Honeypot: für Menschen unsichtbar, für Bots sichtbar */
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden;}
.fs.bad{border-color:rgba(255,120,120,.42);background:rgba(255,90,90,.10);}
.fs.bad strong{color:#FFB3B3;}

/* Handy: Logo über der Schrift */
@media (max-width:700px){
  .hero{display:flex;flex-direction:column;}
  .hero-in{max-width:100%;}
  .hero-logo{display:block;position:relative;transform:none;animation:none;order:-1;
    width:min(210px,44vw);height:auto;margin:0 auto clamp(16px,4vw,28px);
    filter:drop-shadow(0 0 34px rgba(62,123,255,.40)) drop-shadow(0 14px 30px rgba(0,0,0,.55));}
}

/* Zwei Pakete nebeneinander — breitere Karten, Liste zweispaltig */
.packs2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:stretch;}
.packs2 .pk{padding:clamp(24px,2.6vw,34px);}
.packs2 .pk>p{max-width:52ch;}
.packs2 .pk ul{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px;row-gap:9px;}
.packs2 .pk .b{max-width:340px;}
@media (max-width:1240px){ .packs2 .pk ul{grid-template-columns:1fr;} }
@media (max-width:820px){ .packs2{grid-template-columns:1fr;} .packs2 .pk ul{grid-template-columns:repeat(2,minmax(0,1fr));} }
@media (max-width:520px){ .packs2 .pk ul{grid-template-columns:1fr;} .packs2 .pk .b{max-width:none;} }

@media (max-width:1000px) and (min-width:641px){ .fg{grid-template-columns:repeat(2,minmax(0,1fr));} }
.packs2 .pk .dur{align-self:flex-start;}

/* Preisübersicht auf den Ortsseiten: 2 × 2, Preis gut lesbar */
.pl.prices{grid-template-columns:repeat(2,minmax(0,1fr));}
.pl.prices .pi b{font-family:inherit;font-size:17px;font-weight:800;letter-spacing:-.02em;min-width:62px;color:var(--blue);}
@media (max-width:640px){ .pl.prices{grid-template-columns:1fr;} }

/* ===== Vorschaukarten "Zuletzt gebaut" ===== */
.refc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.rc{display:flex;flex-direction:column;border-radius:var(--rm);overflow:hidden;
  border:1px solid var(--d-line);background:rgba(255,255,255,.045);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);}
.light .rc{border-color:var(--line);background:#fff;}
.rc:hover{transform:translateY(-4px);border-color:rgba(122,160,255,.45);
  box-shadow:0 22px 48px rgba(4,8,16,.45);}
.rc-shot{display:block;position:relative;background:#0A1122;}
.rc-bar{display:flex;align-items:center;gap:5px;padding:7px 12px;background:rgba(255,255,255,.06);
  border-bottom:1px solid var(--d-line);}
.light .rc-bar{background:#F1F4FA;border-bottom-color:var(--line);}
.rc-bar u{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.28);flex-shrink:0;}
.light .rc-bar u{background:#C7D0DF;}
.rc-bar b{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;color:var(--dfg3);
  margin-left:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-weight:500;}
.light .rc-bar b{color:var(--ink3);}
.rc-shot img{display:block;width:100%;height:auto;}
.rc-txt{display:block;padding:15px 18px 17px;}
.rc-txt b{display:block;font-size:16.5px;font-weight:700;color:#fff;margin-bottom:5px;}
.light .rc-txt b{color:var(--ink);}
.rc-txt span{display:block;font-size:14px;color:var(--dfg2);}
.light .rc-txt span{color:var(--ink2);}
.rc-txt em{display:inline-flex;align-items:center;gap:7px;margin-top:11px;font-style:normal;
  font-size:13.5px;font-weight:700;color:var(--cyan);}
.light .rc-txt em{color:var(--blue);}
.rc-txt i{font-style:normal;transition:transform .24s var(--ease);}
.rc:hover .rc-txt i{transform:translateX(5px);}
@media (max-width:760px){ .refc{grid-template-columns:1fr;} }

/* ═══════════════════════════════════════════════════════════════
   GROSSE BILDSCHIRME
   Bis etwa 1400 px füllt die Inhaltsspalte den Platz neben der
   Seitenleiste aus. Auf breiteren Monitoren klebte sie bisher links
   und rechts blieb eine tote Fläche. Ab hier steht sie mittig und
   wächst behutsam mit — nicht unbegrenzt, denn Zeilen über rund
   80 Zeichen lesen sich schlechter.
   ═══════════════════════════════════════════════════════════════ */
@media (min-width:1400px){
  .sec-in,.phead-in,.fg,.fb,.legal-in{margin-inline:auto;}
  /* Der Hero nutzt denselben Container wie die Sektionen darunter,
     damit Überschrift und Fließtext überall auf derselben linken Kante
     beginnen. Das Logo sitzt innerhalb dieser Breite, nicht daneben. */
  /* Der Hintergrund des Heros laeuft weiter ueber die volle Breite — nur
     der Inhalt rueckt in die Mitte, auf dieselbe linke Kante wie die
     Sektionen darunter. Eine Breitenbegrenzung des Heros selbst wuerde
     die dunkle Flaeche samt Leuchten mitschrumpfen. */
  .hero{padding-inline:max(var(--pad), (100% - var(--wrap)) / 2);}
}
@media (min-width:1560px){ :root{--wrap:1180px;} }
@media (min-width:1840px){ :root{--wrap:1280px;} }

/* Zusatzleistungen im größeren Paket hervorheben: gefüllter Punkt, kräftigere Schrift.
   Die Grundliste ist in beiden Karten identisch — so sieht man auf einen Blick,
   was das teurere Paket obendrauf legt. */
.pk li.xtra{font-weight:600;color:var(--ink);}
.pk li.xtra::before{background:var(--blue);border-color:var(--blue);}
.pk.hl li.xtra{color:#fff;}
.pk.hl li.xtra::before{background:var(--cyan);border-color:var(--cyan);}

/* Kleine Zwischenüberschrift in der Merkmalsliste, über beide Spalten */
.pk li.xhead{grid-column:1/-1;padding-left:0;margin-top:9px;font-family:var(--mono);
  font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--ink3);}
.pk li.xhead::before{display:none;}
.pk.hl li.xhead{color:var(--gold3);}