/* IntelliTuning Startseite – Konfigurator-Abschnitt (#it3-plans). Präfix itsk-, alles mit .itsk qualifiziert.
   Dunkel ist Standard; die hellen Regeln am Ende folgen dem Schalter im Website-Kopf (html[data-it-theme="light"]).
   Das Gerät-Mockup bleibt in beiden Modi ein dunkles „Display“ (echte Bildschirmfotos der Konfiguratoren). */

.itsk{--bg:#070a0d;--sf:rgba(255,255,255,.035);--sf2:rgba(255,255,255,.06);--ln:rgba(255,255,255,.09);--ln2:rgba(69,227,211,.32);--fg:#f2f6f5;--fg2:#b9c6c4;--fg3:#8a9a98;
  --tq:#45e3d3;--tq2:#1fb9aa;--tqs:rgba(69,227,211,.14);--gold:#e8c873;--gold2:#f3dc9a;--gold3:#c9a34c;--golds:rgba(232,200,115,.14);--dev:#0a0f12;
  --head:var(--it-head,'Sora',sans-serif);--body:var(--it-body,'Inter',sans-serif);
  position:relative;isolation:isolate;overflow:hidden;box-sizing:border-box;width:100%;margin:0;padding:0;border-top:1px solid var(--ln);
  background:var(--bg);color:var(--fg);font-family:var(--body);font-size:15px;line-height:1.6;color-scheme:dark;text-align:left}
.itsk *,.itsk *::before,.itsk *::after{box-sizing:border-box}
.itsk ul{list-style:none;margin:0;padding:0}
.itsk p{margin:0}
.itsk a{text-decoration:none;color:inherit}
.itsk svg.itsk-ic{width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.itsk svg.itsk-ic path[d^="M8 5v14"],.itsk svg.itsk-ic path[d^="M12 3l2.7"]{fill:currentColor;stroke:none}

/* ---------- Hintergrund: Leuchtflächen, feines Raster ---------- */
.itsk .itsk-bg{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.itsk .itsk-bg i{position:absolute;display:block;border-radius:50%}
.itsk .itsk-g1{width:900px;height:620px;left:-260px;top:-240px;background:radial-gradient(closest-side,rgba(69,227,211,.16),rgba(69,227,211,0));filter:blur(10px)}
.itsk .itsk-g2{width:820px;height:620px;right:-220px;top:120px;background:radial-gradient(closest-side,rgba(232,200,115,.12),rgba(232,200,115,0));filter:blur(12px)}
.itsk .itsk-grid{inset:0;border-radius:0;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(ellipse 70% 60% at 50% 40%,#000 20%,transparent 80%);mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,#000 20%,transparent 80%)}

/* ---------- Raster (bündig mit dem Kopf: 42 px, Handy 20 px) ---------- */
.itsk .itsk-wrap{position:relative;z-index:1;width:100%;max-width:1440px;margin:0 auto;padding:72px 42px 64px}
.itsk .itsk-top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.06fr);gap:54px;align-items:center}

/* Einblenden beim Scrollen */
.itsk.js .itsk-rv{opacity:0;transform:translateY(20px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1)}
.itsk.js .itsk-rv.in{opacity:1;transform:none}
.itsk.js .itsk-vis.itsk-rv{transition-delay:.12s}
.itsk.js .itsk-plans.itsk-rv{transition-delay:.05s}

/* ---------- Text ---------- */
.itsk .itsk-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--head);font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--tq);margin:0 0 18px}
.itsk .itsk-dot{width:8px;height:8px;border-radius:50%;background:var(--tq);box-shadow:0 0 0 0 rgba(69,227,211,.55);animation:itskPulse 2.4s ease-out infinite}
@keyframes itskPulse{0%{box-shadow:0 0 0 0 rgba(69,227,211,.55)}100%{box-shadow:0 0 0 12px rgba(69,227,211,0)}}
.itsk h2.itsk-h2{font-family:var(--head);font-weight:600;font-size:clamp(34px,4.1vw,54px);line-height:1.06;letter-spacing:-1.6px;margin:0 0 20px;color:var(--fg)}
.itsk h2.itsk-h2 span{display:block}
.itsk h2.itsk-h2 .l2{background:linear-gradient(100deg,#45e3d3 0%,#b8fff7 45%,#45e3d3 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 0 22px rgba(69,227,211,.22))}
.itsk .itsk-lead{font-size:16px;line-height:1.75;color:var(--fg2);max-width:560px;margin:0 0 22px}
.itsk .itsk-ticks{display:grid;gap:10px;margin:0 0 22px}
.itsk .itsk-ticks li{display:flex;align-items:center;gap:12px;font-size:14px;line-height:1.5;color:var(--fg)}
.itsk .itsk-fic{display:inline-flex;align-items:center;justify-content:center;flex:none;width:34px;height:34px;border-radius:10px;border:1px solid var(--ln2);background:var(--tqs);color:var(--tq);font-size:17px;box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}

/* Elite-Zeile (Gold) */
.itsk a.itsk-eline{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;margin:0 0 24px;padding:11px 16px 11px 13px;border-radius:14px;border:1px solid rgba(232,200,115,.45);
  background:linear-gradient(140deg,rgba(232,200,115,.2),rgba(232,200,115,.05) 60%,rgba(255,255,255,.03));color:var(--gold2);font-family:var(--head);font-size:13px;font-weight:600;line-height:1.4;
  box-shadow:0 14px 34px -24px rgba(232,200,115,.6);transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,border-color .45s ease}
.itsk a.itsk-eline .itsk-ic:first-child{font-size:16px;color:var(--gold)}
.itsk a.itsk-eline .itsk-ic:last-child{font-size:15px;opacity:.75;transition:transform .35s ease}
.itsk a.itsk-eline::after{content:"";position:absolute;inset:-1px;transform:translateX(-130%);background:linear-gradient(115deg,transparent 30%,rgba(255,243,207,.16) 48%,rgba(255,243,207,.03) 56%,transparent 66%);pointer-events:none}
.itsk a.itsk-eline:hover,.itsk a.itsk-eline:focus-visible{transform:translateY(-2px);border-color:rgba(232,200,115,.85);box-shadow:0 18px 40px -22px rgba(232,200,115,.8),0 0 0 1px rgba(232,200,115,.2);color:#fff3cf}
.itsk a.itsk-eline:hover::after{transform:translateX(130%);transition:transform .9s cubic-bezier(.22,1,.36,1)}
.itsk a.itsk-eline:hover .itsk-ic:last-child{transform:translateX(3px)}

/* Knöpfe */
.itsk .itsk-ctas{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.itsk a.itsk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 15px;border-radius:12px;border:1px solid var(--ln);background:var(--sf2);color:var(--fg);
  font-family:var(--head);font-size:13px;font-weight:600;line-height:1.3;white-space:nowrap;transition:transform .45s cubic-bezier(.22,1,.36,1),box-shadow .45s ease,border-color .45s ease,background-color .45s ease}
.itsk a.itsk-btn .itsk-ic{font-size:16px}
.itsk a.itsk-btn.ghost .itsk-ic{color:var(--tq)}
.itsk a.itsk-btn:hover,.itsk a.itsk-btn:focus-visible{transform:translateY(-2px);border-color:var(--ln2);box-shadow:0 14px 30px -16px rgba(69,227,211,.55)}
.itsk a.itsk-btn.gold,.itsk a.itsk-btn.gold:is(:hover,:focus,:active,:visited){background:linear-gradient(135deg,#f6e3a6 0%,#e8c873 45%,#cfa953 100%)!important;color:#1b1407!important;border-color:rgba(255,236,180,.7);box-shadow:0 14px 34px -14px rgba(232,200,115,.7),inset 0 1px 0 rgba(255,255,255,.5)}
.itsk a.itsk-btn.gold:hover{box-shadow:0 20px 44px -16px rgba(232,200,115,.9),inset 0 1px 0 rgba(255,255,255,.6)}
.itsk a.itsk-btn.tq,.itsk a.itsk-btn.tq:is(:hover,:focus,:active,:visited){background:linear-gradient(135deg,#9ff5ec,#45e3d3 55%,#23c9b9)!important;color:#05211e!important;border-color:rgba(69,227,211,.8);box-shadow:0 14px 34px -14px rgba(69,227,211,.65),inset 0 1px 0 rgba(255,255,255,.4)}
.itsk a.itsk-btn.ghost:is(:focus,:active){background:var(--sf2)!important;color:var(--fg)!important}

/* ---------- Gerät-Mockup ---------- */
.itsk .itsk-vis{position:relative;min-width:0}
.itsk .itsk-device{--rx:0deg;--ry:0deg;position:relative;z-index:1;padding:10px;border-radius:20px;border:1px solid rgba(69,227,211,.22);
  background:linear-gradient(160deg,#141c20,#0a0f12 70%);box-shadow:0 50px 100px -50px rgba(0,0,0,.9),0 30px 80px -44px rgba(69,227,211,.4),inset 0 1px 0 rgba(255,255,255,.06);
  transform:perspective(1200px) rotateX(var(--rx)) rotateY(var(--ry));transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .55s ease,border-color .45s ease;transform-style:preserve-3d}
@media (hover:hover){
  .itsk .itsk-device.hov{border-color:rgba(69,227,211,.5);box-shadow:0 60px 110px -50px rgba(0,0,0,.9),0 36px 90px -40px rgba(69,227,211,.6),0 0 0 1px rgba(69,227,211,.18),inset 0 1px 0 rgba(255,255,255,.08)}
  .itsk .itsk-device[data-ui="modern"].hov{border-color:rgba(232,200,115,.55);box-shadow:0 60px 110px -50px rgba(0,0,0,.9),0 36px 90px -40px rgba(232,200,115,.55),0 0 0 1px rgba(232,200,115,.2),inset 0 1px 0 rgba(255,240,200,.1)}
}
.itsk .itsk-device::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;opacity:0;transform:translateX(-120%);background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.09) 48%,rgba(255,255,255,.02) 56%,transparent 66%)}
.itsk .itsk-device.hov::after{opacity:1;transform:translateX(120%);transition:transform 1s cubic-bezier(.22,1,.36,1)}
.itsk .itsk-dev-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 2px 10px}
.itsk .itsk-tabs{display:inline-flex;gap:3px;padding:3px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07)}
.itsk button.itsk-tab{appearance:none;display:inline-flex;align-items:center;gap:7px;margin:0;padding:7px 14px;border:0;border-radius:999px;background:transparent;color:#aab8b6;font-family:var(--head);font-size:12.5px;font-weight:600;line-height:1;cursor:pointer;
  transition:background-color .35s ease,color .35s ease,box-shadow .35s ease}
.itsk button.itsk-tab:hover{color:#eafffd}
.itsk button.itsk-tab.on{background:rgba(69,227,211,.16);color:#9ff5ec;box-shadow:inset 0 0 0 1px rgba(69,227,211,.45),0 0 18px -6px rgba(69,227,211,.6)}
.itsk button.itsk-tab[data-ui="modern"].on{background:rgba(232,200,115,.16);color:#f6e3a6;box-shadow:inset 0 0 0 1px rgba(232,200,115,.5),0 0 18px -6px rgba(232,200,115,.6)}
.itsk button.itsk-tab em{display:inline-block;padding:2px 6px;border-radius:999px;background:rgba(232,200,115,.2);color:#f3dc9a;font-style:normal;font-size:9.5px;letter-spacing:.6px;text-transform:uppercase}
.itsk .itsk-url{display:inline-flex;align-items:center;gap:7px;min-width:0;padding:7px 12px;border-radius:999px;background:rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.07);color:#8fa3a0;font-size:12px;letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.itsk .itsk-url .itsk-ic{font-size:13px;color:var(--tq)}
.itsk .itsk-screen{position:relative;aspect-ratio:16/10;overflow:hidden;border-radius:12px;background:#05080a;border:1px solid rgba(255,255,255,.06);isolation:isolate}
.itsk .itsk-frames{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s linear .6s}
.itsk .itsk-frames.on{opacity:1;visibility:visible;transition:opacity .6s ease}
.itsk .itsk-frame{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.025);transition:opacity .75s ease,transform 1.4s cubic-bezier(.22,1,.36,1)}
.itsk .itsk-frame.on{opacity:1;transform:none}
.itsk .itsk-frame img{display:block;width:100%;height:100%;object-fit:cover;object-position:top;border:0;border-radius:0;box-shadow:none!important;transform:none!important;filter:none}
.itsk .itsk-frame figcaption{position:absolute;left:12px;bottom:12px;z-index:2;display:inline-flex;align-items:center;gap:8px;padding:6px 11px;border-radius:999px;background:rgba(5,8,10,.78);border:1px solid rgba(69,227,211,.35);
  color:#eafffd;font-family:var(--head);font-size:10.5px;font-weight:600;letter-spacing:.9px;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.itsk .itsk-frame figcaption::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--tq);box-shadow:0 0 8px var(--tq)}
.itsk .itsk-dots{position:absolute;right:14px;bottom:16px;z-index:3;display:flex;gap:6px}
.itsk .itsk-dots i{display:block;width:6px;height:6px;border-radius:999px;background:rgba(255,255,255,.35);transition:width .4s cubic-bezier(.22,1,.36,1),background-color .4s ease}
.itsk .itsk-dots i.on{width:20px;background:var(--tq);box-shadow:0 0 10px rgba(69,227,211,.7)}
.itsk .itsk-cap{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:11px 4px 2px;font-size:12.5px;color:#8fa3a0}
.itsk .itsk-cap-ui{display:none;color:#c7d4d2}
.itsk .itsk-device[data-ui="modern"] .itsk-cap-ui[data-ui="modern"],.itsk .itsk-device[data-ui="classic"] .itsk-cap-ui[data-ui="classic"]{display:inline}
.itsk .itsk-cap-live{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.itsk .itsk-live{width:7px;height:7px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 0 rgba(74,222,128,.6);animation:itskLive 2s ease-out infinite}
@keyframes itskLive{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6)}100%{box-shadow:0 0 0 9px rgba(74,222,128,0)}}

/* Demo-Overlay (per JS gefüllt): Zeiger, Ring, Rahmen, Ripple, Tipp-Linie, Mausrad – fängt keine Klicks */
.itsk .itsk-ov{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.itsk .itsk-cur{position:absolute;left:0;top:0;width:22px;height:22px;transform-origin:1.5px 1.5px;opacity:0;fill:#fff;stroke:#0b1215;stroke-width:1.3;stroke-linejoin:round;filter:drop-shadow(0 1px 1px rgba(0,0,0,.65)) drop-shadow(0 5px 12px rgba(69,227,211,.45));transition:opacity .4s ease;will-change:transform}
.itsk .itsk-cur.ok{opacity:1}
.itsk .itsk-cur.dn{filter:drop-shadow(0 1px 1px rgba(0,0,0,.65)) drop-shadow(0 2px 8px rgba(69,227,211,.75))}
.itsk .itsk-box{position:absolute;left:50%;top:50%;width:14%;height:20%;border:2px solid rgba(69,227,211,.65);border-radius:10px;box-shadow:0 0 18px rgba(69,227,211,.4),inset 0 0 14px rgba(69,227,211,.14);transform:translate(-50%,-50%);opacity:0;transition:opacity .35s ease}
.itsk .itsk-box.on{opacity:1;animation:itskPop .5s cubic-bezier(.22,1,.36,1)}
@keyframes itskPop{0%{opacity:0;transform:translate(-50%,-50%) scale(1.08)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
.itsk .itsk-rip{position:absolute;left:50%;top:50%;width:5%;aspect-ratio:1/1;border-radius:50%;border:2px solid rgba(69,227,211,.85);box-shadow:0 0 12px rgba(69,227,211,.4);transform:translate(-50%,-50%);opacity:0}
.itsk .itsk-rip.on{animation:itskRip .6s cubic-bezier(.22,1,.36,1) forwards}
@keyframes itskRip{0%{opacity:.9;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-50%) scale(2.2)}}
.itsk .itsk-type{position:absolute;left:0;top:0;width:24%;height:2px;margin-top:-1px;border-radius:2px;background:linear-gradient(90deg,rgba(69,227,211,.95),rgba(69,227,211,.55));box-shadow:0 0 10px rgba(69,227,211,.6);transform-origin:0 50%;opacity:0;transition:opacity .4s ease}
.itsk .itsk-type.on{opacity:1;animation:itskType .9s cubic-bezier(.22,1,.36,1)}
@keyframes itskType{0%{transform:scaleX(0)}100%{transform:scaleX(1)}}
.itsk .itsk-ring{position:absolute;left:50%;top:28%;width:12%;aspect-ratio:1/1;border-radius:50%;border:2px solid rgba(69,227,211,.6);box-shadow:0 0 16px rgba(69,227,211,.45),0 0 2px rgba(69,227,211,.6),inset 0 0 12px rgba(69,227,211,.16);transform:translate(-50%,-50%);opacity:0;
  transition:left .28s cubic-bezier(.22,1,.36,1),top .28s cubic-bezier(.22,1,.36,1),width .28s cubic-bezier(.22,1,.36,1),opacity .35s ease}
.itsk .itsk-ring.on{opacity:1}
.itsk .itsk-ring.mid{border-color:rgba(232,200,115,.85);box-shadow:0 0 22px rgba(232,200,115,.5),0 0 2px rgba(232,200,115,.7),inset 0 0 14px rgba(232,200,115,.18)}
.itsk .itsk-pulse{position:absolute;left:50%;top:28%;width:14%;aspect-ratio:1/1;border-radius:50%;border:2px solid rgba(232,200,115,.7);box-shadow:0 0 22px rgba(232,200,115,.4);transform:translate(-50%,-50%);opacity:0}
.itsk .itsk-pulse.on{animation:itskPulse2 1.3s ease-out infinite}
@keyframes itskPulse2{0%{opacity:.75;transform:translate(-50%,-50%) scale(.8)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.5)}}
.itsk .itsk-mouse{position:absolute;right:14px;top:14px;width:30px;height:46px;overflow:visible;opacity:0;filter:drop-shadow(0 6px 14px rgba(0,0,0,.6));transition:opacity .4s ease}
.itsk .itsk-mouse.on{opacity:1}
.itsk .itsk-mouse .b{fill:rgba(4,8,10,.7);stroke:rgba(69,227,211,.9);stroke-width:2}
.itsk .itsk-mouse .w{fill:rgba(69,227,211,.08);stroke:rgba(69,227,211,.8);stroke-width:1.6}
.itsk .itsk-mouse .n{fill:#45e3d3;opacity:.35}
.itsk .itsk-mouse.tick .n{animation:itskNotch .42s cubic-bezier(.22,1,.36,1)}
.itsk .itsk-mouse.tick.back .n{animation-name:itskNotchB}
@keyframes itskNotch{0%{transform:translateY(-4px);opacity:.2}30%{opacity:1}100%{transform:translateY(4px);opacity:.35}}
@keyframes itskNotchB{0%{transform:translateY(4px);opacity:.2}30%{opacity:1}100%{transform:translateY(-4px);opacity:.35}}
.itsk .itsk-frame img.nudge{animation:itskNudge .32s cubic-bezier(.22,1,.36,1)}
.itsk .itsk-frame img.nudge.back{animation-name:itskNudgeB}
@keyframes itskNudge{0%{transform:translateX(0)}35%{transform:translateX(2px)}100%{transform:translateX(0)}}
@keyframes itskNudgeB{0%{transform:translateX(0)}35%{transform:translateX(-2px)}100%{transform:translateX(0)}}

/* schwebende Chips um das Gerät */
.itsk .itsk-chips{position:absolute;inset:0;z-index:2;pointer-events:none}
.itsk .itsk-chip{position:absolute;display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;border:1px solid rgba(69,227,211,.4);background:rgba(14,21,24,.92);color:#eafffd;font-family:var(--head);font-size:12px;font-weight:600;white-space:nowrap;
  box-shadow:0 18px 40px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.03);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);animation:itskFloat 6s ease-in-out infinite}
.itsk .itsk-chip .itsk-ic{font-size:15px;color:var(--tq)}
.itsk .itsk-chip.gold{border-color:rgba(232,200,115,.55);color:#f6e3a6;background:linear-gradient(140deg,rgba(60,48,20,.95),rgba(14,21,24,.95))}
.itsk .itsk-chip.gold .itsk-ic{color:var(--gold)}
.itsk .itsk-chip.c1{top:-16px;right:26px}
.itsk .itsk-chip.c2{left:-20px;bottom:88px;animation-delay:-2s}
.itsk .itsk-chip.c3{right:30px;bottom:-14px;animation-delay:-4s}
@keyframes itskFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* ---------- Lizenzen ---------- */
.itsk .itsk-plans{margin-top:72px}
.itsk .itsk-ph{text-align:center;max-width:760px;margin:0 auto 28px}
.itsk .itsk-kick{font-family:var(--head);font-size:11px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--tq);margin:0 0 12px}
.itsk h3.itsk-h3{font-family:var(--head);font-weight:600;font-size:clamp(24px,2.9vw,34px);line-height:1.15;letter-spacing:-.9px;margin:0 0 16px;color:var(--fg)}
.itsk .itsk-launch{display:none;align-items:center;gap:9px;padding:9px 15px;border-radius:999px;border:1px solid rgba(232,200,115,.5);background:linear-gradient(140deg,rgba(232,200,115,.22),rgba(232,200,115,.06));color:var(--gold2);font-family:var(--head);font-size:12.5px;font-weight:600}
.itsk[data-launch="1"] .itsk-launch{display:inline-flex}
.itsk .itsk-launch .itsk-ic{font-size:15px;color:var(--gold)}
.itsk .itsk-cd{font-variant-numeric:tabular-nums;color:#fff3cf;font-weight:700}
.itsk .itsk-cd:empty{display:none}
.itsk .itsk-pgrid{display:grid;grid-template-columns:1fr 1fr;gap:22px;max-width:980px;margin:0 auto}
.itsk .itsk-pc{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:14px;padding:28px 28px 26px;border-radius:20px;border:1px solid var(--ln);background:linear-gradient(160deg,rgba(255,255,255,.055),rgba(255,255,255,.025));
  box-shadow:0 30px 70px -50px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.05);transition:transform .55s cubic-bezier(.22,1,.36,1),box-shadow .55s ease,border-color .45s ease}
.itsk .itsk-pc::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:linear-gradient(90deg,transparent,var(--tq),transparent);opacity:.7}
.itsk .itsk-pc.gold{border-color:rgba(232,200,115,.45);background:linear-gradient(160deg,rgba(232,200,115,.14),rgba(255,255,255,.03) 45%,rgba(232,200,115,.05));box-shadow:0 36px 90px -50px rgba(232,200,115,.65),inset 0 1px 0 rgba(255,240,200,.08)}
.itsk .itsk-pc.gold::before{background:linear-gradient(90deg,transparent,var(--gold),transparent)}
@media (hover:hover){
  .itsk .itsk-pc:hover{transform:translateY(-6px);border-color:var(--ln2);box-shadow:0 40px 80px -44px rgba(69,227,211,.5),0 0 0 1px rgba(69,227,211,.14),inset 0 1px 0 rgba(255,255,255,.06)}
  .itsk .itsk-pc.gold:hover{border-color:rgba(232,200,115,.85);box-shadow:0 46px 110px -44px rgba(232,200,115,.9),0 0 50px -14px rgba(232,200,115,.4),0 0 0 1px rgba(232,200,115,.25)}
}
.itsk .itsk-pc-h{display:flex;align-items:center;justify-content:space-between;gap:12px}
.itsk .itsk-pc h4{font-family:var(--head);font-weight:600;font-size:22px;letter-spacing:-.4px;margin:0;color:var(--fg)}
.itsk .itsk-pc-tag{display:inline-block;padding:4px 10px;border-radius:999px;border:1px solid var(--ln2);background:var(--tqs);color:var(--tq);font-family:var(--head);font-size:10.5px;font-weight:600;letter-spacing:.8px;text-transform:uppercase}
.itsk .itsk-pc.gold .itsk-pc-tag{border-color:rgba(232,200,115,.5);background:var(--golds);color:var(--gold2)}
.itsk .itsk-pc>p{font-size:14px;line-height:1.65;color:var(--fg2);min-height:3.3em}
.itsk .itsk-pc-p{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-top:2px}
.itsk .itsk-pc-p b{font-family:var(--head);font-weight:700;font-size:44px;line-height:1;letter-spacing:-1.8px;color:var(--fg);text-shadow:0 0 30px rgba(69,227,211,.18)}
.itsk .itsk-pc.gold .itsk-pc-p b{color:#fff3cf;text-shadow:0 0 30px rgba(232,200,115,.3)}
.itsk .itsk-pc-p s{font-size:17px;color:var(--fg3);text-decoration-color:rgba(255,120,120,.8)}
.itsk .itsk-pc-p span{font-size:13px;color:var(--fg3)}
.itsk .itsk-pc-sub{font-size:13px;color:var(--fg3);margin-top:-8px}
.itsk .itsk-pc ul{display:grid;gap:8px;margin:4px 0 6px}
.itsk .itsk-pc li{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;line-height:1.5;color:var(--fg)}
.itsk .itsk-pc li .itsk-ic{font-size:16px;margin-top:2px;color:var(--tq)}
.itsk .itsk-pc.gold li .itsk-ic{color:var(--gold)}
.itsk .itsk-pc-a{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:auto}
.itsk a.itsk-more{font-family:var(--head);font-size:13px;font-weight:600;color:var(--fg2);border-bottom:1px solid var(--ln);transition:color .3s ease,border-color .3s ease}
.itsk a.itsk-more:hover{color:var(--tq);border-color:var(--tq)}
.itsk .itsk-foot{text-align:center;font-size:12.5px;line-height:1.7;color:var(--fg3);max-width:820px;margin:22px auto 0}

/* ---------- Breiten ---------- */
@media (max-width:1100px){
  .itsk .itsk-top{gap:40px}
  .itsk h2.itsk-h2{font-size:clamp(32px,4.4vw,46px)}
}
@media (max-width:960px){
  .itsk .itsk-top{grid-template-columns:minmax(0,1fr);gap:40px}
  .itsk .itsk-vis{max-width:720px}
  .itsk .itsk-lead{max-width:none}
}
@media (max-width:800px){
  .itsk .itsk-wrap{padding:56px 20px 52px}
  .itsk .itsk-pgrid{grid-template-columns:minmax(0,1fr)}
  .itsk .itsk-plans{margin-top:56px}
  .itsk .itsk-chips{position:static;display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
  .itsk .itsk-chip{position:static;animation:none}
}
@media (max-width:560px){
  .itsk h2.itsk-h2{font-size:32px;letter-spacing:-1.2px}
  .itsk .itsk-lead{font-size:15px}
  .itsk a.itsk-btn{flex:1 1 auto}
  .itsk .itsk-device{padding:7px;border-radius:16px}
  .itsk .itsk-url{display:none}
  .itsk .itsk-frame figcaption{font-size:9.5px;padding:5px 9px}
  .itsk .itsk-pc{padding:22px 20px}
  .itsk .itsk-pc-p b{font-size:38px}
  .itsk .itsk-cur{width:18px;height:18px}
  .itsk .itsk-mouse{width:24px;height:37px;right:10px;top:10px}
}

/* ---------- Reduzierte Bewegung ---------- */
@media (prefers-reduced-motion:reduce){
  .itsk.js .itsk-rv{opacity:1;transform:none;transition:none}
  .itsk .itsk-dot,.itsk .itsk-live,.itsk .itsk-chip,.itsk .itsk-pulse.on,.itsk .itsk-frame img.nudge{animation:none}
  .itsk .itsk-device,.itsk .itsk-pc,.itsk a.itsk-btn,.itsk a.itsk-eline,.itsk .itsk-frame,.itsk .itsk-frames,.itsk .itsk-ring{transition:none}
  .itsk .itsk-device{transform:none}
  .itsk .itsk-device::after,.itsk a.itsk-eline::after{display:none}
}

/* ---------- Hell (Schalter im Kopf setzt html[data-it-theme="light"]) ---------- */
html[data-it-theme="light"] .itsk{--bg:#f3f6f6;--sf:rgba(255,255,255,.9);--sf2:#fff;--ln:rgba(23,35,38,.11);--ln2:rgba(0,108,103,.3);--fg:#172326;--fg2:#3f5053;--fg3:#627376;
  --tq:#006c67;--tq2:#0d9a90;--tqs:rgba(0,108,103,.08);--gold:#a8801f;--gold2:#8a6514;--gold3:#7a5a10;--golds:rgba(232,200,115,.22);color-scheme:light}
html[data-it-theme="light"] .itsk .itsk-g1{background:radial-gradient(closest-side,rgba(0,108,103,.12),rgba(0,108,103,0))}
html[data-it-theme="light"] .itsk .itsk-g2{background:radial-gradient(closest-side,rgba(232,200,115,.3),rgba(232,200,115,0))}
html[data-it-theme="light"] .itsk .itsk-grid{background-image:linear-gradient(rgba(0,108,103,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(0,108,103,.07) 1px,transparent 1px)}
html[data-it-theme="light"] .itsk .itsk-dot{box-shadow:0 0 0 0 rgba(0,108,103,.4)}
html[data-it-theme="light"] .itsk h2.itsk-h2 .l2{background-image:linear-gradient(100deg,#006c67 0%,#13a89d 50%,#006c67 100%);filter:none}
html[data-it-theme="light"] .itsk .itsk-fic{box-shadow:none;background:rgba(0,108,103,.08)}
html[data-it-theme="light"] .itsk a.itsk-eline,html[data-it-theme="light"] .itsk a.itsk-eline:is(:hover,:focus,:active,:visited){border-color:rgba(185,143,44,.5);background:linear-gradient(140deg,rgba(232,200,115,.3),rgba(255,255,255,.9) 60%,rgba(252,250,244,.9));color:var(--gold2);box-shadow:0 14px 34px -24px rgba(185,143,44,.6)}
html[data-it-theme="light"] .itsk a.itsk-eline:hover{color:var(--gold3);border-color:rgba(185,143,44,.85)}
html[data-it-theme="light"] .itsk a.itsk-eline::after{background:linear-gradient(115deg,transparent 30%,rgba(255,255,255,.3) 44%,rgba(255,255,255,.8) 50%,rgba(255,255,255,.3) 56%,transparent 70%)}
html[data-it-theme="light"] .itsk a.itsk-btn.ghost,html[data-it-theme="light"] .itsk a.itsk-btn.ghost:is(:hover,:focus,:active,:visited){background:#fff!important;color:var(--fg)!important;box-shadow:0 1px 2px rgba(23,35,38,.05)}
html[data-it-theme="light"] .itsk a.itsk-btn.ghost:hover{box-shadow:0 0 0 1px rgba(0,108,103,.25),0 12px 28px -14px rgba(0,108,103,.45)}
html[data-it-theme="light"] .itsk a.itsk-btn.gold,html[data-it-theme="light"] .itsk a.itsk-btn.gold:is(:hover,:focus,:active,:visited){border-color:rgba(185,143,44,.55);box-shadow:0 12px 30px -12px rgba(185,143,44,.55),inset 0 1px 0 rgba(255,255,255,.7)}
html[data-it-theme="light"] .itsk a.itsk-btn.tq,html[data-it-theme="light"] .itsk a.itsk-btn.tq:is(:hover,:focus,:active,:visited){background:linear-gradient(135deg,#0d9a90,#006c67)!important;color:#fff!important;border-color:rgba(0,108,103,.6);box-shadow:0 12px 30px -12px rgba(0,108,103,.55)}
html[data-it-theme="light"] .itsk .itsk-device{border-color:rgba(0,108,103,.25);box-shadow:0 44px 90px -46px rgba(23,35,38,.55),0 24px 70px -40px rgba(0,108,103,.4),inset 0 1px 0 rgba(255,255,255,.06)}
html[data-it-theme="light"] .itsk .itsk-chip{background:rgba(255,255,255,.96);color:var(--fg);border-color:rgba(0,108,103,.35);box-shadow:0 16px 36px -20px rgba(23,35,38,.4)}
html[data-it-theme="light"] .itsk .itsk-chip.gold{background:linear-gradient(140deg,rgba(232,200,115,.35),#fff);color:var(--gold2);border-color:rgba(185,143,44,.5)}
/* Bildunterschriften bleiben im dunklen Gerät hell lesbar (kein Hell-Override) */
html[data-it-theme="light"] .itsk .itsk-pc{background:linear-gradient(160deg,#fff,#fafcfc);box-shadow:0 30px 70px -50px rgba(23,35,38,.35),0 1px 2px rgba(23,35,38,.04)}
html[data-it-theme="light"] .itsk .itsk-pc.gold{border-color:rgba(185,143,44,.5);background:linear-gradient(160deg,rgba(232,200,115,.28),#fff 45%,#fcfaf4);box-shadow:0 36px 90px -50px rgba(185,143,44,.7),0 0 0 1px rgba(185,143,44,.1)}
html[data-it-theme="light"] .itsk .itsk-pc-p b{text-shadow:none}
html[data-it-theme="light"] .itsk .itsk-pc.gold .itsk-pc-p b{color:var(--gold3);text-shadow:none}
html[data-it-theme="light"] .itsk .itsk-pc.gold li .itsk-ic,html[data-it-theme="light"] .itsk .itsk-launch .itsk-ic{color:var(--gold2)}
html[data-it-theme="light"] .itsk .itsk-launch{background:linear-gradient(140deg,rgba(232,200,115,.3),rgba(255,255,255,.9));border-color:rgba(185,143,44,.45);color:var(--gold2)}
html[data-it-theme="light"] .itsk .itsk-cd{color:var(--gold3)}
html[data-it-theme="light"] .itsk .itsk-pc.gold .itsk-pc-tag{color:var(--gold2)}
