/* ============================================================
   SVG Euro-Zert GmbH — gemeinsame Design-Basis (site.css)
   Palette: Original-Marke Hellblau #00a0d1 + Navy + Weiss
   Wird von Startseite + allen Unterseiten geladen.
   ============================================================ */
:root{
 --bg:#f4f7fa;--bg2:#e7eff6;--panel:#ffffff;--panel2:#f5f9fc;
 --silver:linear-gradient(135deg,#ffffff,#dbe7f1 48%,#bcccdd 72%,#eef4f9);
 --ink:#0e2138;--ink2:#33485f;--mut:#647890;--faint:#9aacbf;
 --line:#dde7f0;--line2:#c6d5e2;
 --cy:#0a7ba0;--cy2:#3fbfe4;--cyD:#0a6f96;
 --grad:linear-gradient(135deg,#33b5dd,#00a0d1 55%,#0a7ba0);
 --gradNavy:linear-gradient(100deg,#0b4377,#0089bf);
 --glow:rgba(0,160,209,.16);
 --navy:#0a2540;--navy2:#0e3052;
 --sh:0 42px 84px -38px rgba(12,28,48,.5),0 12px 28px -18px rgba(12,28,48,.28);
 --shSoft:0 22px 48px -28px rgba(12,28,48,.3);
 --shCy:0 24px 52px -22px rgba(0,160,209,.4);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:Inter,system-ui,sans-serif;color:var(--ink2);background:var(--bg);line-height:1.68;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::after{content:"";position:fixed;inset:0;pointer-events:none;z-index:9998;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
h1,h2,h3,h4{font-family:Sora,system-ui,sans-serif;color:var(--ink);line-height:1.12;letter-spacing:-.02em;font-weight:700}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.wrap{max-width:1560px;margin:0 auto;padding:0 clamp(20px,4vw,52px)}
.nb{white-space:nowrap}

/* ---- Buttons (poliert) ---- */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:Sora;font-weight:600;font-size:15px;padding:15px 30px;border-radius:13px;transition:transform .25s,box-shadow .25s,background .25s,color .25s,border-color .25s;cursor:pointer;border:0;position:relative}
.btn svg{width:18px;height:18px;transition:transform .25s}
.btn:hover svg{transform:translateX(3px)}
.btn-cy{background:var(--grad);color:#fff;box-shadow:var(--shCy)}
.btn-cy:hover{transform:translateY(-2px);box-shadow:0 28px 56px -20px rgba(0,160,209,.55)}
.btn-out{background:rgba(255,255,255,.06);color:#fff;border:1.5px solid rgba(255,255,255,.4)}
.btn-out:hover{background:rgba(255,255,255,.16);border-color:#fff;transform:translateY(-2px)}
.btn-ghost{background:var(--panel);color:var(--ink);border:1.5px solid var(--line2);box-shadow:var(--shSoft)}
.btn-ghost:hover{border-color:var(--cy);color:var(--cyD);transform:translateY(-2px)}

/* ---- Header (strukturiert + Dropdown) ---- */
.sh{position:sticky;top:0;z-index:1000;background:linear-gradient(100deg,rgba(11,67,119,.985),rgba(0,143,191,.975));margin-bottom:-1px;box-shadow:0 10px 30px -18px rgba(0,90,130,.5)}
.sh-in{display:flex;align-items:center;gap:26px;height:104px}
.sh-logo img{height:84px;width:auto}
.sh-nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.sh-nav>a,.sh-drop>button{font-family:Sora;font-weight:500;font-size:14.5px;color:#ffffff!important;background:none;border:0;cursor:pointer;padding:10px 14px;border-radius:10px;transition:.2s;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.sh-nav>a:hover,.sh-drop>button:hover,.sh-nav>a.active{color:#fff!important;background:rgba(255,255,255,.14)}
.sh-drop>button svg,.sh-nav>a svg{color:#fff}
.sh-drop{position:relative}
.sh-drop>button svg{width:14px;height:14px;transition:transform .25s}
.sh-drop:hover>button svg{transform:rotate(180deg)}
.sh-menu{position:absolute;top:calc(100% + 10px);left:0;min-width:286px;background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:var(--sh);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;display:grid;gap:2px}
.sh-drop:hover .sh-menu{opacity:1;visibility:visible;transform:translateY(0)}
.sh-menu a{display:flex;align-items:center;gap:11px;padding:11px 14px;border-radius:10px;color:var(--ink2)!important;font-size:14px;transition:.18s}
.sh-menu a:hover{background:var(--bg2);color:var(--cyD)!important}
.sh-menu a svg{width:18px;height:18px;color:var(--cy);flex:none}
.sh-cta{margin-left:8px}
.sh-burger{display:none;margin-left:auto;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:10px}
.sh-burger span{width:27px;height:2.5px;background:#fff;border-radius:2px;transition:.25s;transform-origin:center}
body.nav-open .sh-burger span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
body.nav-open .sh-burger span:nth-child(2){opacity:0}
body.nav-open .sh-burger span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
@media(max-width:1140px){
 .sh-nav,.sh-cta{display:none!important}
 .sh-burger{display:flex}
 .sh-in{height:88px}.sh-logo img{height:64px}
 .sh{backdrop-filter:none;-webkit-backdrop-filter:none}
 body.nav-open .sh-mobile{display:block}
 body.nav-open{overflow:hidden}
}
.sh-mobile{display:none;position:fixed;inset:88px 0 0;z-index:999;background:linear-gradient(180deg,#0b4377,#0a2540);padding:24px clamp(20px,5vw,40px);overflow-y:auto}
.sh-mobile a{display:block;color:#ffffff!important;font-family:Sora;font-weight:500;font-size:18px;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.sh-mobile a.sub{font-size:15px;color:#d6ecf8!important;font-weight:400;padding-left:16px}
.sh-mobile .btn{color:#fff!important;display:flex!important;align-items:center;justify-content:center;gap:9px;text-align:center;margin-top:22px;width:100%;border-radius:13px}

/* ---- Footer (high class) ---- */
.sf{position:relative;background:linear-gradient(180deg,#0b2742,#06182d);color:#9fb3c6;padding:0 0 28px}
.sf::before{content:"";display:block;height:3px;background:var(--grad)}
.sf-top{display:grid;grid-template-columns:1.7fr 1fr 1.15fr 1fr;gap:36px;padding:64px 0 46px}
.sf-logo img{height:60px;margin-bottom:20px}
.sf-name{font-family:Sora;font-weight:600;color:#fff;font-size:17px;letter-spacing:-.01em;margin-bottom:10px}
.sf-brand p{color:#8ea3b8;font-size:13.5px;line-height:1.7;max-width:330px}
.sf-col h4{font-family:Sora;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#fff;margin:6px 0 16px;font-weight:600}
.sf-col a{display:block;color:#8ea3b8;font-size:13.5px;padding:5px 0;transition:.22s}
.sf-col a:hover{color:var(--cy2);transform:translateX(4px)}
.sf-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:#7089a0;font-size:12.5px}
.sf-bottom a{color:#9fb3c6}.sf-bottom a:hover{color:var(--cy2)}
@media(max-width:860px){.sf-top{grid-template-columns:1fr 1fr}.sf-brand{grid-column:1/-1}}
@media(max-width:560px){.sf-top{grid-template-columns:1fr}.sf-bottom{flex-direction:column}}

/* ---- Footer (.ft) — global (fuer WP-Shell; Kupfer->Blau) ---- */
.ft{position:relative;background:linear-gradient(180deg,#0b2742,#06182d);color:#9fb3c6;padding:0 0 28px;z-index:1}
.ft::before{content:"";display:block;height:3px;background:var(--grad)}
.ft-top{display:grid;grid-template-columns:1.7fr 1fr 1.15fr 1fr;gap:36px;padding:64px 0 46px}
.ft-logo img{height:60px;display:block;margin-bottom:20px}
.ft-brand p{color:#8ea3b8;font-size:13.5px;line-height:1.7;max-width:320px}
.ft-col h4{font-family:Sora;font-size:11.5px;letter-spacing:.18em;text-transform:uppercase;color:#fff;margin:6px 0 16px;font-weight:600}
.ft-col a{display:block;color:#8ea3b8;font-size:13.5px;padding:5px 0;transition:.22s}
.ft-col a:hover{color:var(--cy2);transform:translateX(4px)}
.ft-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;color:#7089a0;font-size:12.5px}
.ft-bottom a{color:#9fb3c6;transition:.2s}
.ft-bottom a:hover{color:var(--cy2)}
@media(max-width:860px){.ft-top{grid-template-columns:1fr 1fr}.ft-brand{grid-column:1/-1}}
@media(max-width:560px){.ft-top{grid-template-columns:1fr}.ft-bottom{flex-direction:column}}

/* ---- gemeinsame Raum-Helfer ---- */
.eyebrow,.up-ens .head .lbl{display:none!important} /* keine Eyebrows (Kevin) */
/* Überschriften IMMER Sora (Theme-Lato überschreiben) */
body.svg-shell h1,body.svg-shell h2,body.svg-shell h3,body.svg-shell h4,body.svg-shell h5{font-family:Sora,system-ui,sans-serif!important}
/* qs „Ihre Vorteile auf einen Blick" überlappt den dunklen Hero -> weiß */
.qs-band .head h2{color:#fff!important}
/* Blocksy-eigenen Back-to-Top ausblenden (sonst 2 Buttons übereinander) */
body.svg-shell .ct-back-to-top,body.svg-shell #ct-back-to-top{display:none!important}
/* Select-Dropdown-Optionen immer lesbar (Theme kann sie weiß setzen) */
body.svg-shell select option,body.svg-shell .ctl option{color:#0e2138;background:#fff}
/* Anrede/Select: Pfeil direkt aufs Select (der .sel::after-Chevron saß mittig über Label+Select) */
.sel::after{display:none!important}
.sel select.ctl{appearance:none!important;-webkit-appearance:none!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23647890' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 16px center!important;background-size:14px!important;padding-right:44px!important}
/* rz „In drei Schritten…" überlappt dunklen Hero -> weiß */
.rz-proc .head h2{color:#fff!important}
/* Experten-Karten: Akad. Grad + Name IMMER einzeilig (lange Ausreißer -> …) */
.xc-id h3{white-space:nowrap!important;overflow:hidden;text-overflow:ellipsis}
/* wb „Online/Vor Ort"-Karten: Text klärt das Icon oben */
.fmt{padding-top:94px!important}
/* Experten-Verzeichnis: 3 große Karten pro Reihe */
.xf-grid{grid-template-columns:repeat(3,1fr)!important;gap:26px!important}
.xc{padding:30px 30px 26px!important}
.xc .mono{width:62px!important;height:62px!important;font-size:22px!important}
.xc-id h3{font-size:19px!important}
@media(max-width:1000px){.xf-grid{grid-template-columns:repeat(2,1fr)!important}}
@media(max-width:640px){.xf-grid{grid-template-columns:1fr!important}}

/* ---- Norm-Badges: Lücke + Doppelrahmen um .nb weg, kräftiger lesbar ---- */
.norms .nb,.hero-norms .nb{background:transparent!important;border:0!important;padding:0!important;border-radius:0!important;display:inline!important}
.norms>span{gap:0!important}
.norms>span>svg{margin-right:7px;flex:none}
.norms>span .nb{margin-left:.32em}
/* dunkle Intro-Pills: weiß + kräftigerer Hintergrund + helle Norm */
[class*="-intro"] .norms>span{color:#ffffff!important;background:rgba(255,255,255,.12)!important;border-color:rgba(255,255,255,.34)!important;font-weight:600}
[class*="-intro"] .norms>span .nb{color:#7fe0ff!important;font-weight:700}
[class*="-intro"] .norms>span svg{color:#7fe0ff!important}
/* Hero-Badges: Label weiß, Norm hell, kein 25px-Versatz an der Norm, Schatten für Lesbarkeit */
.hero-norms .n b{color:#ffffff!important}
.hero-norms .n span{color:#eaf7fd!important}
.hero-norms .n span .nb{color:#9fe6ff!important;font-weight:700}
.hero-norms .n b,.hero-norms .n span{text-shadow:0 1px 6px rgba(4,16,30,.55)}
.glow{position:absolute;border-radius:50%;filter:blur(50px);pointer-events:none;z-index:0}
.lead{font-size:clamp(16px,1.6vw,19px);color:var(--mut)}

/* ---- Back-to-Top (schwebend, footer-bewusst) ---- */
.totop{position:fixed;right:clamp(16px,3vw,28px);bottom:clamp(16px,3vw,28px);z-index:1500;width:46px;height:46px;border:0;border-radius:50%;background:var(--grad);color:#fff;box-shadow:0 10px 26px -8px rgba(0,160,209,.55);cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(14px) scale(.92);transition:opacity .3s,transform .3s,visibility .3s}
.totop.show{opacity:1;visibility:visible;transform:none}
.totop:hover{transform:translateY(-3px);box-shadow:0 16px 34px -8px rgba(0,160,209,.7)}
.totop svg{width:20px;height:20px}

/* ---- Globale Mobile-Haerteregeln (greifen ueber alle 1:1-Raeume) ---- */
@media(max-width:900px){
 /* H1 nie clippen */
 [class$="-intro"] h1,[class*="hero"] h1,[class*="-hero"] h1{max-width:100%!important;overflow-wrap:break-word;hyphens:none}
 /* ALLE Norm-Pill-Reihen voll-breit stapeln (kein min-content-Ueberlauf) */
 .norms{flex-direction:column!important;gap:8px!important;flex-wrap:nowrap!important}
 .norms>span{display:block!important;width:100%!important;white-space:normal!important;align-items:flex-start!important}
 .norms>span svg{display:inline-block!important;vertical-align:-3px;margin-right:6px;flex:none}
 /* ALLE Inhalts-Grids voll stapeln + minmax(0,1fr) gegen Track-Aufblaehen */
 .wrap.grid,[class*="-intro"] .grid,[class*="-story"] .grid,[class*="-ens"] .grid,[class*="-adv"] .stagger,.stagger,[class*="-sub"] .row,[class*="-proc"] .row,.ab .grid{grid-template-columns:minmax(0,1fr)!important}
 /* Float-/Siegel-Badges nicht ueberstehen lassen */
 [class*="-story"] .float,[class*="-intro"] .seal,.lz-seal{position:static!important;right:auto!important;bottom:auto!important;left:auto!important;transform:none!important;display:inline-block;margin-top:14px}
 /* CTA-Buttonreihen stapeln */
 [class$="-intro"] .cta,[class*="-intro"] .cta,.hero-cta,[class*="-cta"] .row{flex-direction:column;align-items:stretch}
 [class*="-intro"] .cta .btn,.hero-cta .btn{width:100%;justify-content:center}
}