*{margin:0;padding:0;box-sizing:border-box}
:root{--bg:#0a0a2e;--bg2:#0d1142;--bg3:#111655;--cyan:#00f0ff;--orange:#F68B27;--gold:#e2af3c;--text:#e8eaf6;--muted:#7986cb;--green:#00e676;--border:rgba(0,240,255,0.15)}
html,body{background:var(--bg)!important;color:var(--text)!important;font-family:'Segoe UI',system-ui,sans-serif;line-height:1.6;min-height:100vh}

/* NAV */
.it-nav{display:flex;align-items:center;justify-content:space-between;padding:0 clamp(16px,4vw,40px);height:80px;background:rgba(20,18,55,0.42);border-bottom:1px solid rgba(226,175,60,0.4);position:sticky;top:0;z-index:999;backdrop-filter:blur(24px) saturate(160%);-webkit-backdrop-filter:blur(24px) saturate(160%)}
@keyframes it-logo-flow{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}.it-logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0;font-family:'Orbitron',sans-serif;font-weight:700;font-size:1.15rem;letter-spacing:.08em;background:linear-gradient(90deg,#FF7A00,#FFD700,#fff,#00F0FF,#FF7A00);background-size:300% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:it-logo-flow 4s ease infinite}.it-logo:hover{filter:drop-shadow(0 0 8px rgba(246,139,39,.6))}.it-logo img{height:36px;width:36px;object-fit:contain;flex-shrink:0;transition:filter .25s}.it-logo:hover img{filter:brightness(1.1)}
.it-menu{display:flex;gap:4px;list-style:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}
.it-menu a{background:linear-gradient(90deg,#FF7A00,#FFD700,#fff,#00F0FF,#FF7A00);background-size:300% auto;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;animation:it-logo-flow 5s ease infinite;animation-play-state:paused;text-decoration:none;font-size:14px;font-weight:600;padding:8px 12px;border-radius:8px;white-space:nowrap;transition:filter .2s}
.it-menu a:hover,.it-menu a.active{filter:drop-shadow(0 0 10px rgba(0,240,255,.65));animation-play-state:running;animation-duration:2s}
.it-menu li:nth-child(1) a{animation-delay:0s}.it-menu li:nth-child(2) a{animation-delay:-1s}.it-menu li:nth-child(3) a{animation-delay:-2s}.it-menu li:nth-child(4) a{animation-delay:-3s}.it-menu li:nth-child(5) a{animation-delay:-4s}

.it-cta{background:linear-gradient(135deg,var(--cyan),#0080ff);color:#000;font-size:13px;font-weight:800;padding:9px 20px;border-radius:20px;text-decoration:none;flex-shrink:0}
.it-burger{display:none;flex-direction:column;gap:6px;cursor:pointer;padding:8px;background:none;border:none;z-index:1001}
.it-burger span{display:block;height:2.5px;border-radius:3px;transition:all .3s}
.it-burger span:nth-child(1){width:24px;background:linear-gradient(90deg,var(--text),var(--cyan))}
.it-burger span:nth-child(2){width:18px;background:linear-gradient(90deg,var(--cyan),var(--orange))}
.it-burger span:nth-child(3){width:12px;background:var(--cyan);opacity:.8}
.it-burger.open span:nth-child(1){width:22px;transform:translateY(8.5px) rotate(45deg);background:var(--cyan)}
.it-burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.it-burger.open span:nth-child(3){width:22px;transform:translateY(-8.5px) rotate(-45deg);background:var(--cyan);opacity:1}
.it-mob-backdrop{display:none;position:fixed;inset:0;background:rgba(0,0,0,0);z-index:997;pointer-events:none}
.it-mob-backdrop.open{display:block}
.it-mobile-menu{display:none;position:fixed;top:0;left:0;right:0;width:100%;background:rgba(10,12,40,.78);backdrop-filter:blur(36px) saturate(180%);-webkit-backdrop-filter:blur(36px) saturate(180%);border-bottom:1px solid rgba(226,175,60,.4);z-index:1000;flex-direction:column;box-shadow:0 28px 80px rgba(0,0,0,.6);overflow:hidden}
.it-mobile-menu.open{display:flex}
.it-mob-top{height:80px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}
.it-mob-brand{font-size:18px;line-height:1}
.it-mob-close{background:rgba(255,255,255,.07);border:none;color:rgba(255,255,255,.5);width:32px;height:32px;border-radius:8px;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s}
.it-mob-close:hover{background:rgba(0,240,255,.15);color:var(--cyan)}
.it-mob-nav{padding:10px 16px 6px;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.it-mob-nav a{display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;text-decoration:none;padding:14px 8px;border-radius:14px;border:1px solid rgba(0,200,220,.2);border-top-color:rgba(0,220,240,.45);box-shadow:0 8px 20px rgba(0,0,0,.55),0 0 14px rgba(0,180,200,.12),inset 0 1px 0 rgba(255,255,255,.12);transition:all .2s;letter-spacing:.3px}

.it-mob-nav a:last-child:nth-child(odd){grid-column:span 2}
.it-mob-nav a:nth-child(1){background:linear-gradient(135deg,#00c8f0,#1565c0)}
.it-mob-nav a:nth-child(2){background:linear-gradient(135deg,#00b8e0,#1248b0)}
.it-mob-nav a:nth-child(3){background:linear-gradient(135deg,#00d4f0,#1a72cc)}
.it-mob-nav a:nth-child(4){background:linear-gradient(135deg,#00acd8,#0f3fa0)}
.it-mob-nav a:nth-child(5){background:linear-gradient(135deg,#00c8f0,#1565c0)}
.it-mob-nav a:hover{color:var(--cyan);border-color:rgba(0,240,255,.3);background:rgba(0,240,255,.07)}

.it-mobile-cta{margin:8px 16px 20px;padding:13px 16px;background:linear-gradient(160deg,#00b8cc,#0070a0);color:#fff;font-size:14px;font-weight:800;border-radius:14px;text-decoration:none;text-align:center;display:block;border:1px solid rgba(0,220,240,.4);border-top-color:rgba(0,240,255,.6);box-shadow:0 8px 24px rgba(0,0,0,.5),0 0 20px rgba(0,180,220,.3),inset 0 1px 0 rgba(255,255,255,.2)}

/* HERO */
.tl-hero{background:#0d1142 url('/wp-content/mu-plugins/assets/media/tools-hero-cybersecurity.webp') center/cover no-repeat;border-bottom:1px solid var(--border);min-height:clamp(440px,44vw,620px);padding:clamp(40px,6vw,80px) clamp(16px,4vw,40px);text-align:center;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;isolation:isolate}
.tl-hero::before{content:'';position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(7,9,39,.78),rgba(7,9,39,.72) 48%,rgba(7,9,39,.86)),radial-gradient(ellipse at 50% 55%,rgba(0,240,255,.08),transparent 62%)}
.tl-hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:0;pointer-events:none}
.tl-hero-inner{position:relative;z-index:2;max-width:760px;margin:0 auto}
.tl-badge{display:inline-flex;gap:8px;align-items:center;background:rgba(0,240,255,0.08);border:1px solid rgba(0,240,255,0.2);color:var(--cyan);font-size:12px;font-weight:700;letter-spacing:1px;padding:6px 16px;border-radius:20px;margin-bottom:24px;text-transform:uppercase}
.tl-hero h1{font-size:clamp(28px,5vw,56px);font-weight:900;margin-bottom:16px;line-height:1.1;color:var(--text)!important}
.tl-hero h1 span{color:var(--cyan)!important}
.tl-hero p{font-size:clamp(14px,2vw,17px);color:var(--muted);max-width:520px;margin:0 auto;line-height:1.7}
@media(max-width:767px){.tl-hero{min-height:430px}}
@media(prefers-reduced-motion:reduce){.tl-hero-video{display:none!important}}

/* TOOLS LIST */
.tl-section{max-width:800px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(16px,4vw,40px)}
.tl-section-label{font-size:13px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:2px;margin-bottom:12px}
.tl-section-h2{font-size:clamp(22px,3vw,36px);font-weight:800;margin-bottom:clamp(24px,4vw,40px);color:var(--text)!important}
.tl-section-h2 span{color:var(--orange)!important}
.tl-list{display:flex;flex-direction:column;gap:14px}
.tl-card{background:var(--bg2);border:1px solid var(--border);border-radius:16px;padding:20px 24px;text-decoration:none;display:flex;align-items:center;gap:20px;transition:border-color .2s,transform .2s}
a.tl-card:hover{border-color:rgba(0,240,255,.45);transform:translateX(4px)}
div.tl-card{cursor:default;opacity:.65}
.tl-card-icon{font-size:28px;width:52px;height:52px;flex-shrink:0;display:flex;align-items:center;justify-content:center;background:var(--bg3);border-radius:12px;border:1px solid var(--border)}
.tl-card-icon--media{background:transparent;border-color:transparent;overflow:visible}
.tl-card-body{flex:1;min-width:0}
.tl-card-name{font-size:17px;font-weight:800;color:var(--text);margin-bottom:3px}
.tl-card-desc{font-size:13px;color:var(--muted);line-height:1.4}
.tl-card-badge{flex-shrink:0;font-size:12px;font-weight:700;padding:5px 14px;border-radius:20px}
.tl-card-badge.live{background:rgba(0,240,255,.1);color:var(--cyan);border:1px solid rgba(0,240,255,.3)}
.tl-card-badge.soon{background:rgba(246,139,39,.08);color:var(--orange);border:1px solid rgba(246,139,39,.25)}
/* NAV-ACCESS-1b: Produktbereiche + Plan-Badges (nur bestehende Vars) */
.tl-area{margin-bottom:34px}
.tl-area-h{font-size:clamp(18px,2.4vw,24px);font-weight:800;color:var(--text);margin-bottom:4px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.tl-area-premium{font-size:11px;font-weight:800;letter-spacing:1px;text-transform:uppercase;color:var(--gold);border:1px solid var(--gold);border-radius:20px;padding:3px 10px}
.tl-area-sub{font-size:13px;color:var(--muted);margin-bottom:16px}
.tl-card-badges{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-shrink:0;flex-wrap:wrap}
.tl-plan-badge{font-size:11px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;padding:5px 12px;border-radius:20px;white-space:nowrap}
.tl-plan-badge.plan-free{background:rgba(0,230,118,.1);color:var(--green);border:1px solid rgba(0,230,118,.3)}
.tl-plan-badge.plan-basic{background:rgba(0,240,255,.1);color:var(--cyan);border:1px solid rgba(0,240,255,.3)}
.tl-plan-badge.plan-pro{background:rgba(246,139,39,.1);color:var(--orange);border:1px solid rgba(246,139,39,.3)}
.tl-plan-badge.plan-enterprise,.tl-plan-badge.plan-business{background:rgba(226,175,60,.12);color:var(--gold);border:1px solid rgba(226,175,60,.4)}

/* TOOLS-LOCKED-UI (D21): Plan-Status-Bar + Locked-Cards */
.tl-planbar{max-width:800px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.tl-planbar-inner{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--bg2);border:1px solid rgba(226,175,60,.4);border-radius:14px;padding:12px 18px;margin-top:clamp(24px,4vw,40px)}
.tl-planbar-txt{font-size:14px;color:var(--text);font-weight:600}
.tl-planbar-txt strong{color:var(--gold)}
.tl-planbar-cta{flex-shrink:0;font-size:13px;font-weight:800;color:#00122b;background:linear-gradient(135deg,var(--cyan),#0080ff);padding:9px 18px;border-radius:20px;text-decoration:none;box-shadow:0 6px 18px rgba(0,150,220,.28)}
.tl-planbar-cta:hover{filter:brightness(1.08)}
.tl-usage{max-width:800px;margin:10px auto 0;padding:0 clamp(16px,4vw,40px)}
.tl-usage-inner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--muted)}
.tl-usage-lbl{font-weight:700;color:var(--text)}
.tl-usage-item{background:var(--bg3);border:1px solid var(--border);border-radius:20px;padding:5px 12px;white-space:nowrap}
.tl-usage-item b{color:var(--cyan);font-weight:800}
.tl-usage-item.warn b{color:var(--gold)} .tl-usage-item.zero{border-color:rgba(255,107,107,.4)} .tl-usage-item.zero b{color:#ff8a8a}
.tl-usage-up{margin-left:auto;font-size:12px;font-weight:800;color:var(--cyan);text-decoration:none;white-space:nowrap}
.tl-usage-up:hover{text-decoration:underline}
.tl-planbar-trial{font-size:12px;font-weight:700;color:var(--orange);background:rgba(246,139,39,.1);border:1px solid rgba(246,139,39,.3);padding:5px 12px;border-radius:20px;white-space:nowrap}
.tl-planbar-manage{background:var(--bg3)!important;color:var(--cyan)!important;border:1px solid rgba(0,240,255,.35)}
a.tl-card.locked{opacity:.9}
a.tl-card.locked:hover{border-color:rgba(226,175,60,.4);transform:translateX(4px)}
.tl-card-badge.locked{background:rgba(226,175,60,.12);color:var(--gold);border:1px solid rgba(226,175,60,.4)}

/* COMING NEXT */
.tl-coming{background:var(--bg2);border:1px solid var(--border);border-radius:20px;padding:clamp(24px,4vw,40px);text-align:center;margin-top:40px}
.tl-coming h3{font-size:clamp(16px,2.5vw,22px);font-weight:800;color:var(--text);margin-bottom:10px}
.tl-coming p{color:var(--muted);font-size:14px;max-width:440px;margin:0 auto 20px}
.tl-coming-pills{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}
.tl-pill{background:var(--bg3);border:1px solid var(--border);color:var(--muted);font-size:12px;font-weight:600;padding:6px 14px;border-radius:20px}

/* FOOTER 3-SPALTEN */
.it-footer{background:var(--bg2);border-top:1px solid rgba(226,175,60,0.3);padding:clamp(40px,5vw,60px) clamp(16px,4vw,40px) 24px;margin-top:0}
.it-footer-cols{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,4vw,48px);margin-bottom:36px}
.it-footer-col h3{font-size:11px;font-weight:800;letter-spacing:2px;text-transform:uppercase;color:var(--text);margin-bottom:16px}
.it-footer-col a{display:block;font-size:14px;color:var(--muted);text-decoration:none;padding:4px 0;transition:color .15s}
.it-footer-col a:hover{color:var(--cyan)}
.it-footer-col .soon-link{display:block;font-size:14px;color:var(--muted);padding:4px 0;opacity:.4}
.it-footer-copy{font-size:12px;color:var(--muted);text-align:center;padding-top:20px;border-top:1px solid var(--border);max-width:1200px;margin:0 auto}
@media(max-width:900px){.it-menu,.it-cta{display:none}.it-burger{display:flex}}
@media(max-width:600px){.tl-card{flex-wrap:wrap;gap:14px;padding:16px 18px}.tl-card-badges{flex-basis:calc(100% - 66px);max-width:calc(100% - 66px);justify-content:flex-start;margin-left:66px;margin-top:2px}}
@media(max-width:420px){.it-footer-cols{gap:12px}.it-footer-col h3{font-size:10px;letter-spacing:1px}.it-footer-col a,.it-footer-col .soon-link{font-size:12px}}

/* GTranslate */
.skiptranslate,.goog-te-banner-frame{display:none!important}
body{top:0!important}
#it-lang-bar{width:100%;background:linear-gradient(180deg,rgba(10,10,46,.98) 0%,rgba(5,5,30,1) 100%);border-top:1px solid rgba(0,240,255,.25);padding:4px 0;min-height:28px;display:flex;align-items:center;justify-content:center;position:relative;z-index:100}
.gt_switcher-popup{background:linear-gradient(135deg,rgba(0,240,255,.08) 0%,rgba(0,180,220,.05) 100%)!important;border:1px solid rgba(0,240,255,.5)!important;border-radius:20px!important;padding:6px 18px 6px 14px!important;color:#00f0ff!important;font-size:13px!important;font-weight:500!important;cursor:pointer;display:inline-flex!important;align-items:center!important;gap:7px!important;box-shadow:0 0 12px rgba(0,240,255,.15)!important;backdrop-filter:blur(4px)!important}
.gt_switcher-popup:hover{background:linear-gradient(135deg,rgba(0,240,255,.18) 0%,rgba(0,180,220,.12) 100%)!important;border-color:rgba(0,240,255,.85)!important;box-shadow:0 0 20px rgba(0,240,255,.3)!important;color:#fff!important}
.gt-current-lang,.gt_switcher-popup span{color:#00f0ff!important;font-size:13px!important}
.gt_switcher-popup:hover .gt-current-lang,.gt_switcher-popup:hover span{color:#fff!important}
.gt_white_content{background:rgba(8,8,40,.97)!important;border:1px solid rgba(0,240,255,.3)!important;border-radius:12px!important;box-shadow:0 8px 32px rgba(0,0,0,.5)!important;backdrop-filter:blur(12px)!important;max-height:60vh;overflow-y:auto}
.gt_languages a,.gt_languages span{color:#c8d6e5!important;font-size:13px!important;border-bottom:1px solid rgba(0,240,255,.07)!important;padding:7px 14px!important;display:block!important}
/* Farben pro Zeile */
.gt_languages tr:nth-child(1) a{color:#ff6b6b!important;text-shadow:0 0 10px rgba(255,107,107,.45)!important}
.gt_languages tr:nth-child(2) a{color:#ffd700!important;text-shadow:0 0 10px rgba(255,215,0,.4)!important}
.gt_languages tr:nth-child(3) a{color:#00d2d3!important;text-shadow:0 0 10px rgba(0,210,211,.45)!important}
.gt_languages tr:nth-child(4) a{color:#a29bfe!important;text-shadow:0 0 10px rgba(162,155,254,.45)!important}
.gt_languages tr:nth-child(5) a{color:#ff9ff3!important;text-shadow:0 0 10px rgba(255,159,243,.45)!important}
.gt_languages tr:nth-child(6) a{color:#55efc4!important;text-shadow:0 0 10px rgba(85,239,196,.45)!important}
.gt_languages tr:nth-child(7) a{color:#74b9ff!important;text-shadow:0 0 10px rgba(116,185,255,.45)!important}
.gt_languages tr:nth-child(8) a{color:#fdcb6e!important;text-shadow:0 0 10px rgba(253,203,110,.4)!important}
.gt_languages a:hover{background:linear-gradient(90deg,rgba(0,240,255,.12) 0%,transparent 100%)!important;color:#fff!important;text-shadow:0 0 14px rgba(0,240,255,.85)!important;padding-left:18px!important}
.gt_black_overlay{opacity:.65!important;background:rgba(5,5,25,.8)!important}
@media(max-width:767px){#it-lang-bar{padding:3px 0;min-height:26px}.gt_switcher-popup{font-size:12px!important;padding:5px 14px 5px 11px!important}}


.tools-page-body{background:#0a0a2e;color:#e8eaf6}
.tools-page-logo img{display:block;flex-shrink:0}
.it-mob-brand.it-logo{gap:10px;letter-spacing:.08em}
