/* KIDATIS: einheitliche, matte Oberflächen mit feiner Lichtkante. */
:root{
  --panel-fill:linear-gradient(135deg,rgba(31,43,65,.91),rgba(20,29,45,.91));
  --panel-line:rgba(166,180,211,.16);
  --panel-light:rgba(245,247,250,.045);
  --panel-shadow:0 12px 32px -24px rgba(0,0,0,.7),inset 0 1px 0 var(--panel-light);
}
.shield>div,.person,.legal-card,.security-boxes>div,.model-option,.model-platform,.protocol-flow>div,.mock{
  background:var(--panel-fill);
  border:1px solid var(--panel-line);
  border-radius:7px;
  box-shadow:var(--panel-shadow);
}
/* Partnerschaften bleiben kompakt; die Wortmarke bekommt einen ruhigen Platz. */
.partner,#partner .partner{
  position:relative;
  background:radial-gradient(ellipse at 100% 0%,rgba(74,107,173,.1),transparent 65%),var(--panel-fill);
  border:1px solid var(--panel-line);
  border-radius:7px;
  box-shadow:var(--panel-shadow);
  padding:28px 32px;
  gap:40px;
  overflow:hidden;
}
.partner::before{
  content:"";
  position:absolute;
  top:0;left:32px;
  width:36px;height:2px;
  background:linear-gradient(90deg,#11b7d4,rgba(17,183,212,.1));
}
.partner.split,#partner .partner.split{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)}
.partner h2,#partner .partner h2{font-size:27px;line-height:1.2;margin:10px 0 13px;letter-spacing:-.025em}
.partner h2 br{display:none}
.partner p,#partner .partner p{font-size:14px;line-height:1.7;color:#b7c4da;max-width:63ch;margin:10px 0}
.partner .eyebrow,#partner .partner .eyebrow{color:#a6b4d3!important;font-size:10px;letter-spacing:.13em;line-height:1.6;display:block}
.partnername,#partner .partnername{font-size:28px;font-weight:400;color:#f5f7fa;letter-spacing:-.02em;line-height:1.2}
.partner.split>div:last-child{padding:6px 0 6px 28px;border-left:1px solid rgba(166,180,211,.11)}
.partner.split>div:last-child>p{font-size:12px;color:#a6b4d3;max-width:30ch;margin:8px 0 16px}
.partner .lightlink,#partner .lightlink{
  display:inline-flex;align-items:center;gap:9px;
  width:fit-content;padding:7px 11px;
  border:1px solid rgba(166,180,211,.24);border-radius:4px;
  background:rgba(17,23,34,.14);
  color:#d5dfee;font-size:12px;font-weight:400;line-height:1.5;text-decoration:none;
  transition:background .18s,border-color .18s,color .18s;
}
.partner .lightlink:hover,#partner .lightlink:hover{color:#f5f7fa;border-color:rgba(17,183,212,.65);background:rgba(17,183,212,.06);text-decoration:none}
/* Sicherheit und Team: klare Hierarchie, zurückhaltende Flächen. */
.security-boxes{gap:18px}
.security-boxes>div{padding:27px 28px}
.security-boxes>div>strong{display:block;color:#9eb1d2;font-size:10px;font-weight:500;letter-spacing:.14em;margin-bottom:15px}
.security-boxes .principle-title{font-size:23px;line-height:1.25;margin:0 0 13px;max-width:26ch}
.security-boxes p{font-size:14px;line-height:1.75;margin:0}
.shield>div{padding:22px;line-height:1.55;font-size:15px}
.shield b{font-size:10px;letter-spacing:.09em;color:#a6b4d3;margin-bottom:12px}
.person{padding:22px}
.person .portrait{border-radius:6px;box-shadow:0 1px 0 rgba(245,247,250,.06)}
.person h3{font-size:22px;line-height:1.2;margin:20px 0 8px}
.person .role{font-size:11px;letter-spacing:.02em;line-height:1.6;color:#7ed3e2}
.person>p{font-size:14px;line-height:1.7}
/* Kennzahlen und Prozessschritte ohne schwere Rahmen. */
.protocol-kpi{border:1px solid var(--panel-line);border-left:2px solid #11b7d4;background:radial-gradient(ellipse at 100% 0,rgba(17,183,212,.07),transparent 75%),var(--panel-fill);border-radius:0 7px 7px 0;box-shadow:var(--panel-shadow)}
.protocol-flow .flow-result{background:linear-gradient(135deg,#2a4266,#1b3049);border-color:rgba(17,183,212,.45);color:#f5f7fa}
.protocol-flow .flow-result span{color:#8cdce9}
.model-option,.model-platform{box-shadow:inset 0 1px 0 var(--panel-light)}
.model-gateway{background:linear-gradient(135deg,#314672,#253655);border:1px solid rgba(166,180,211,.28);box-shadow:var(--panel-shadow);border-radius:7px}
.model-badges span{border-color:rgba(166,180,211,.25);background:rgba(17,23,34,.16)}
/* Antworten und rechtliche Inhalte bleiben gut lesbar. */
main details{padding:20px 24px;margin:12px 0;background:var(--panel-fill);border:1px solid var(--panel-line)!important;border-radius:7px;box-shadow:var(--panel-shadow)}
main details summary{display:flex;justify-content:space-between;align-items:center;gap:20px;list-style:none;font-size:17px;line-height:1.5}
main details summary::-webkit-details-marker{display:none}
main details summary::after{content:"+";font:300 24px/1 Outfit,sans-serif;color:#a6b4d3;flex:none;width:18px;text-align:center}
main details[open] summary::after{content:"−";color:#11b7d4}
main details[open] summary{color:#f5f7fa}
main details p{font-size:14px;line-height:1.8;margin:16px 0 0;max-width:90ch}
main details summary:focus-visible{outline:2px solid #11b7d4;outline-offset:5px;border-radius:2px}
.legal-grid{gap:18px}.legal-card{padding:28px}.legal-card h2{font-size:21px;font-weight:400;margin-bottom:16px}.legal-card p,.legal-card address{line-height:1.8}
/* Formulare: sanfte Vertiefung statt greller Eingaberahmen. */
form#demo{padding:30px;background:var(--panel-fill);border:1px solid var(--panel-line);border-radius:7px;box-shadow:var(--panel-shadow)}
form#demo label{font-size:13px;color:#d0d8e7}
form#demo input,form#demo select,form#demo textarea{background:rgba(13,20,32,.55);border-color:rgba(166,180,211,.24);border-radius:4px;color:#f5f7fa;transition:border-color .18s,box-shadow .18s}
form#demo input:focus,form#demo select:focus,form#demo textarea:focus{outline:none;border-color:#11b7d4;box-shadow:0 0 0 3px rgba(17,183,212,.09)}
form#demo option{background:#1a2337}
form#demo .notice{font-size:12px;line-height:1.8;margin:0}
form#demo textarea{resize:vertical;min-height:130px}
/* Kompakte Produktliste und Medienrahmen behalten ihre ruhige Form. */
#produkte .product-entry{border-bottom-color:rgba(166,180,211,.13)}
#produkte .product-entry:hover{background:linear-gradient(90deg,rgba(74,107,173,.08),transparent)}
.film-frame{background:linear-gradient(135deg,#202c42,#141d2d);border-color:var(--panel-line);border-radius:8px;box-shadow:0 14px 38px -24px rgba(0,0,0,.75)}
.film-frame video{border-radius:5px}
@media(max-width:760px){
  .partner,#partner .partner{padding:24px;gap:20px}
  .partner::before{left:24px}
  .partner.split,#partner .partner.split{grid-template-columns:1fr}
  .partner.split>div:last-child{border:0;padding:0}
  .partner h2,#partner .partner h2{font-size:25px}
  .partnername,#partner .partnername{font-size:24px}
  .partner p,#partner .partner p{font-size:13px}
  .partner.split>div:last-child>p{max-width:none;margin-bottom:12px}
  .security-boxes>div{padding:23px}.security-boxes .principle-title{font-size:22px}
  .person{padding:24px}.legal-card{padding:23px}
  main details{padding:18px 20px}main details summary{font-size:16px}
  form#demo{padding:22px;gap:18px}
}
@media(prefers-reduced-motion:reduce){.partner .lightlink,#partner .lightlink,form#demo input,form#demo select,form#demo textarea{transition:none}}

/* Primäre Anfrage-Buttons: klare Cyan-Fläche mit ruhiger Tiefe und eigenem Pfeil. */
body .btn:not(.ghost){
  align-items:center;justify-content:space-between;gap:22px;
  width:fit-content;max-width:100%;min-height:52px;
  padding:11px 16px 11px 21px;
  border:1px solid rgba(112,224,239,.48);border-radius:6px;
  background:linear-gradient(135deg,#38c4d9 0%,#19b8d1 52%,#0da9c4 100%);
  color:#101c2b;font-family:Inter,sans-serif;font-size:14px;font-weight:500;line-height:1.5;
  letter-spacing:0;text-decoration:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),0 8px 22px -16px rgba(17,183,212,.5);
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}
body .btn:not(.ghost)::after{
  content:'↗';display:grid;place-items:center;flex:none;
  width:27px;height:27px;margin-left:0;
  border:1px solid rgba(17,23,34,.12);border-radius:50%;
  background:rgba(17,23,34,.065);color:#101c2b;
  font-size:17px;font-weight:400;line-height:1;
  transition:background .18s ease,transform .18s ease;
}
body .btn:not(.ghost):hover{
  filter:none;transform:translateY(-1px);border-color:rgba(156,235,246,.8);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 10px 24px -16px rgba(17,183,212,.65);
}
body .btn:not(.ghost):hover::after{background:rgba(17,23,34,.11);transform:translate(1px,-1px)}
body .btn:not(.ghost):active{transform:translateY(0);box-shadow:inset 0 1px 2px rgba(17,23,34,.14)}
body .btn:not(.ghost):focus-visible{outline:2px solid #8cdeeb;outline-offset:4px}
body .btn:not(.ghost):disabled{opacity:.6;cursor:default;transform:none}
@media(max-width:760px){body .btn:not(.ghost){gap:18px;min-height:50px;padding:10px 14px 10px 18px}}
@media(prefers-reduced-motion:reduce){body .btn:not(.ghost),body .btn:not(.ghost)::after{transition:none}body .btn:not(.ghost):hover,body .btn:not(.ghost):hover::after{transform:none}}

/* Geschützter Wissensfluss im Einstieg von Daten & Sicherheit. */
.security-hero-visual{width:100%;max-width:430px;margin:20px 0 0;align-self:start;justify-self:end;min-width:0}.security-hero-visual>svg{width:100%;height:auto;display:block;overflow:visible}.security-flow-line{fill:none;stroke:#314672;stroke-width:1.6}.security-flow-signals{fill:#11b7d4}.security-visual-ring{color:#a6b4d3}.security-visual-ring>circle{fill:rgba(26,35,55,.75);stroke:#4b5c78;stroke-width:1}.security-visual-ring.is-shield{color:#a5dce7}.security-visual-ring.is-shield>circle{stroke:#4a6bad}.security-visual-title{fill:#f5f7fa;font:400 20px Outfit,sans-serif}.security-visual-sub{fill:#a6b4d3;font:400 11.5px Inter,sans-serif}.security-option-title{fill:#f5f7fa;font:400 16px Outfit,sans-serif}.security-visual-choice{fill:#a6b4d3;font:500 8px Inter,sans-serif;letter-spacing:1px}.security-shield-pulse{fill:#11b7d4;opacity:0;animation:security-shield-breathe 6s ease-in-out infinite}@keyframes security-shield-breathe{0%,100%{opacity:0}50%{opacity:.06}}@media(max-width:1050px){.security-hero-visual{justify-self:start;margin-top:6px;max-width:400px}}@media(prefers-reduced-motion:reduce){.security-flow-signals{display:none}.security-shield-pulse{animation:none;opacity:0}}
@media(min-width:1051px){.security-producthero{align-items:start}}

/* Daten & Sicherheit: Die Überschrift führt, die Grafik ergänzt kompakt. */
.security-producthero h1{font-size:clamp(44px,5vw,70px);line-height:1.04;max-width:none}
.security-producthero .intro{font-size:19px;max-width:54ch}
@media(min-width:1051px){
  .security-producthero{grid-template-columns:minmax(0,1.5fr) minmax(320px,.85fr);gap:56px}
  .security-hero-visual{max-width:390px;margin-top:48px}
}
@media(max-width:760px){.security-producthero h1{font-size:clamp(38px,8vw,50px)}.security-producthero .intro{font-size:17px}}

/* Produktnavigation: kompakte, klar gegliederte Auswahl mit passenden Bildmarken. */
.product-menu summary{gap:7px;padding:7px 9px;margin-left:-9px;border:1px solid transparent;border-radius:4px;transition:background .18s,border-color .18s}
.product-menu summary:hover{background:rgba(74,107,173,.09)}
.product-menu[open] summary{background:rgba(74,107,173,.1);border-color:rgba(166,180,211,.13)}
.menu-chevron{width:15px;height:15px;flex:none;transition:transform .2s}
.product-menu[open] .menu-chevron{transform:rotate(180deg)}
.product-menu .product-menu-panel{
  top:calc(100% + 12px);left:-12px;width:378px;min-width:0;max-width:calc(100vw - 48px);
  padding:15px 9px 9px;
  background:radial-gradient(ellipse at 100% 0%,rgba(49,70,114,.22),transparent 70%),linear-gradient(145deg,#1b2639,#141d2c);
  border:1px solid rgba(166,180,211,.24);border-radius:8px;
  box-shadow:0 20px 48px -20px rgba(0,0,0,.75),inset 0 1px 0 rgba(245,247,250,.045);
}
.product-menu-panel .menu-eyebrow{display:block;padding:0 12px 9px;color:#98a9c6;font:500 9px/1.5 Inter,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.product-menu-panel a.menu-product-item{display:grid;grid-template-columns:38px minmax(0,1fr) 15px;align-items:center;gap:12px;padding:12px;border:1px solid transparent;border-radius:5px;line-height:1.4;transition:background .18s,border-color .18s}
.product-menu-panel .menu-product-icon{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(166,180,211,.2);border-radius:50%;background:rgba(74,107,173,.075);color:#a6b4d3;transition:border-color .18s,color .18s}
.product-menu-panel .menu-product-icon>svg{width:18px;height:18px}
.product-menu-panel .menu-product-copy{display:block;min-width:0}
.product-menu-panel .menu-product-name{display:block;font:400 19px/1.25 Outfit,sans-serif;color:#f5f7fa;letter-spacing:-.015em}
.product-menu-panel .menu-product-name .menu-product-suffix{display:inline;font:inherit;color:#11b7d4}
.product-menu-panel .menu-product-description{display:block;font:400 12px/1.55 Inter,sans-serif;color:#a6b4d3;margin-top:4px}
.product-menu-panel .menu-product-arrow{display:block;color:#a6b4d3;font-size:14px;opacity:.45;transition:opacity .18s,color .18s}
.product-menu-panel a.menu-product-item:hover,.product-menu-panel a.menu-product-item:focus-visible{background:rgba(74,107,173,.13);border-color:rgba(166,180,211,.1);outline:none}
.product-menu-panel a.menu-product-item:hover .menu-product-icon,.product-menu-panel a.menu-product-item:focus-visible .menu-product-icon{border-color:rgba(17,183,212,.5);color:#bce5ed}
.product-menu-panel a.menu-product-item:hover .menu-product-arrow,.product-menu-panel a.menu-product-item:focus-visible .menu-product-arrow{color:#11b7d4;opacity:1}
.product-menu-panel a.menu-product-item:focus-visible{outline:2px solid #11b7d4;outline-offset:-2px}
.product-menu-panel a[aria-current="page"]{background:rgba(17,183,212,.055);border-color:rgba(17,183,212,.16)}
.product-menu-panel a[aria-current="page"] .menu-product-icon{border-color:rgba(17,183,212,.4);color:#11b7d4}
.product-menu-panel a.menu-overview{padding-top:8px;padding-bottom:15px;margin-bottom:5px;border-radius:0;border-bottom:1px solid rgba(166,180,211,.12)}
.product-menu-panel .menu-overview .menu-product-name{font-size:15px}
.product-menu-panel .menu-overview .menu-product-icon{border-radius:6px}
@media(max-width:760px){.product-menu .product-menu-panel{left:-1px;width:min(378px,calc(100vw - 48px));top:calc(100% + 10px)}.product-menu-panel a.menu-product-item{gap:10px;padding:11px 10px}.product-menu-panel .menu-product-name{font-size:18px}.product-menu-panel .menu-product-description{font-size:12px}}
@media(prefers-reduced-motion:reduce){.product-menu summary,.menu-chevron,.product-menu-panel a.menu-product-item,.product-menu-panel .menu-product-icon,.product-menu-panel .menu-product-arrow{transition:none}}
.product-menu .product-menu-panel{max-height:calc(100vh - 140px);max-height:calc(100dvh - 140px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#40526a transparent}