/* Self-hosted brand fonts (SIL OFL, licences in assets/fonts). Latin subset, variable weight. */
:root{color-scheme:only light}
@font-face{font-family:'DM Sans';font-style:normal;font-weight:300 800;font-display:swap;src:url(../fonts/dm-sans-latin-300-800.woff2) format('woff2')}
@font-face{font-family:'Manrope';font-style:normal;font-weight:200 800;font-display:swap;src:url(../fonts/manrope-latin-200-800.woff2) format('woff2')}
/* Zentrale Farbrichtung für große, textuell verlaufende Überschriften. */
:root{--heading-gradient-light:linear-gradient(90deg,#2466A5 0%,#1c293c 42%,#1c293c 100%);--heading-gradient-dark:linear-gradient(90deg,#b4e4f7 0%,#fff 42%,#fff 100%);--heading-gradient-hero:linear-gradient(90deg,#2b70ad 0%,#1c293c 46%,#1c293c 100%)}
/* Verlauf auf der gesamten Überschrift verankern, nicht an wechselnden .gx-Wörtern. */
:is(h1,h2):has(.gx){background-image:var(--heading-gradient-light)!important;-webkit-background-clip:text!important;background-clip:text!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
:is(h1,h2):has(.gx) span{background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;-webkit-text-fill-color:transparent!important;color:transparent!important}
:is(.home-hero,.service-entry-copy,.about-hero,.contact-hero) h1{background-image:var(--heading-gradient-hero)!important}
:is(.sub-cta,.home-compare,.home-finale .home-contact,.contact-stage) :is(h1,h2):has(.gx){background-image:var(--heading-gradient-dark)!important}
/* Diese Kontaktüberschrift steht auf der hellen Innenkarte des dunklen Kontaktabschnitts. */
.contact-page .contact-stage-inner .contact-lead-title{background-image:linear-gradient(90deg,#000 0%,#111 42%,#111 100%)!important}
/* Shared site frame. Selectors deliberately avoid homepage content. */
.global-header,.global-footer{color:#1c293c;font-family:'DM Sans',Arial,sans-serif}
.global-skip{position:absolute;top:8px;left:24px;z-index:100;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;background:#fff;color:var(--blue)}
.global-skip:focus{width:auto;height:auto;overflow:visible;clip-path:none;padding:10px 16px}
.global-header{position:sticky;top:0;z-index:20;background:#fff}
.global-header-inner{max-width:var(--page-max);width:calc(100% - 48px);margin:auto;min-height:96px;display:grid;grid-template-columns:192px minmax(0,1fr) auto;align-items:center;gap:32px}
.global-brand{display:block;width:192px}
.global-brand img{display:block;width:100%;height:80px;object-fit:contain;object-position:left center}
.global-nav{display:flex;align-items:center;justify-content:center;gap:clamp(16px,1.9vw,36px);font-size:14px;font-weight:600;white-space:nowrap}
.global-nav>a{position:relative;display:block;padding:16px 0;transition:color .15s}
.global-nav>a:hover,.global-nav>a[aria-current]{color:var(--blue)}
.global-nav>a[aria-current]::after{content:'';position:absolute;bottom:5px;left:0;width:100%;height:2px;background:var(--blue)}
.global-contact{display:flex;align-items:center;gap:13px;padding-left:25px;border-left:1px solid #e5ebef;white-space:nowrap}
.global-contact svg{width:28px;height:28px;fill:none;stroke:var(--blue);stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round}
.global-contact small{display:block;font-size:9px;letter-spacing:.09em;color:#697581;text-transform:uppercase;line-height:1.5}
.global-contact strong{display:block;font-size:17px;letter-spacing:.025em;color:var(--blue);font-weight:700}
.global-menu-toggle,.global-nav .global-mobile-phone{display:none}
.global-header a:focus-visible,.global-header button:focus-visible,.global-footer a:focus-visible{outline:2px solid var(--blue);outline-offset:5px}
.global-footer{background:#f3f6f8;border-top:1px solid #dfe6eb}
.global-footer-inner{max-width:var(--page-max);width:calc(100% - 48px);margin:auto;padding:46px 0 24px;display:grid;grid-template-columns:1fr 1fr 1.25fr;gap:38px 64px}
.global-footer-brand img{width:174px;height:78px;object-fit:contain;object-position:left center;display:block}
.global-footer-brand p{font-size:14px;color:#617080;margin:15px 0 0;line-height:1.7}
.global-footer h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin:5px 0 17px;font-weight:700}
.global-footer-contact>a{display:block;width:fit-content;font-size:14px;margin-bottom:8px;overflow-wrap:anywhere}
.global-footer-contact .global-footer-phone{color:var(--blue);font-size:21px;font-weight:700;letter-spacing:.02em;margin-bottom:12px}
.global-footer-nav>div{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px;font-size:14px}
.global-footer a:hover{color:var(--blue)}
.global-footer-bottom{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #dfe6eb;padding-top:20px;color:#617080;font-size:12px}
.global-footer-bottom nav{display:flex;gap:24px}
@media(max-width:1279px){
 .global-header-inner{gap:22px;grid-template-columns:170px minmax(0,1fr) auto}
 .global-brand{width:170px}
 .global-nav{font-size:13px;gap:18px}
 .global-contact{padding-left:18px;gap:10px}
 .global-contact svg{display:none}
 .global-contact strong{font-size:15px}
}
@media(max-width:1190px){
 .global-header-inner{min-height:84px;grid-template-columns:170px 1fr auto}
 .global-brand img{height:70px}
 .global-contact{justify-self:end;border:0;padding:0}
 .global-menu-toggle{display:flex;align-items:center;justify-content:center;gap:12px;border:0;background:transparent;color:#1c293c;font:600 14px 'DM Sans',Arial,sans-serif;padding:12px 0 12px 14px;cursor:pointer}
 .global-menu-toggle i{width:22px;height:14px;border-top:2px solid currentColor;border-bottom:2px solid currentColor;position:relative}
 .global-menu-toggle i:before{content:'';position:absolute;left:0;right:0;top:5px;border-top:2px solid currentColor}
 .global-menu-toggle[aria-expanded=true] i{border:0}
 .global-menu-toggle[aria-expanded=true] i:before,.global-menu-toggle[aria-expanded=true] i:after{content:'';position:absolute;left:0;right:0;top:6px;border-top:2px solid currentColor;transform:rotate(45deg)}
 .global-menu-toggle[aria-expanded=true] i:after{transform:rotate(-45deg)}
 .global-nav{display:none;position:absolute;left:0;right:0;top:100%;padding:12px 24px 20px;background:#fff;border-bottom:1px solid #dfe6eb;white-space:normal;grid-template-columns:1fr 1fr;gap:0 30px;box-shadow:0 12px 16px rgba(20,35,45,.04)}
 .global-nav.is-open{display:grid}
 .global-nav>a{padding:14px 0;border-bottom:1px solid #edf1f4;font-size:15px}
 .global-nav>a[aria-current]::after{display:none}
 .global-nav .global-mobile-phone{display:block;color:var(--blue);border:0;grid-column:1/-1}
 .global-footer-inner{gap:30px}
}
@media(max-width:600px){
 .global-header-inner{width:calc(100% - 40px);min-height:76px;grid-template-columns:140px 1fr;gap:16px}
 .global-brand{width:140px}
 .global-brand img{height:62px}
 .global-contact{display:none}
 .global-menu-toggle{justify-self:end}
 .global-nav{grid-template-columns:1fr;padding:10px 20px 16px}
 .global-footer-inner{width:calc(100% - 40px);grid-template-columns:1fr;padding:32px 0 24px;gap:28px}
 .global-footer-brand{display:flex;align-items:center;gap:25px}
 .global-footer-brand img{width:132px;height:62px}
 .global-footer-brand p{margin:0;font-size:13px}
 .global-footer h2{margin:0 0 12px}
 .global-footer-bottom{padding-top:18px;gap:16px;flex-wrap:wrap}
}


/* Shared restrained interaction timing */
.global-nav>a,.global-footer a{transition:color .22s cubic-bezier(.22,1,.36,1)}
.global-nav>a[aria-current]::after{transform:scaleX(1);transform-origin:center;transition:transform .24s cubic-bezier(.22,1,.36,1)}
.global-nav>a:focus-visible,.global-footer a:focus-visible{transition:outline-offset .22s ease}
@media(prefers-reduced-motion:reduce){.global-nav>a,.global-footer a,.global-nav>a[aria-current]::after{transition:none}}

.global-footer-hours h2{font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin:5px 0 17px;font-weight:700}.global-footer-hours dl{margin:0;display:grid;gap:8px;font-size:14px;color:#617080}.global-footer-hours dl div{display:grid;grid-template-columns:88px 1fr;gap:10px}.global-footer-hours dt{font-weight:600;color:#1c293c}.global-footer-hours dd{margin:0}.global-footer-inner{grid-template-columns:1fr 1fr 1fr 1.25fr}@media(max-width:1190px){.global-footer-inner{grid-template-columns:1fr 1fr 1.25fr}.global-footer-hours{grid-column:1/-1;order:3}.global-footer-nav{order:4}.global-footer-bottom{order:5}}@media(max-width:600px){.global-footer-hours{grid-column:auto}.global-footer-hours dl div{grid-template-columns:96px 1fr}}

/* Final navigation and footer polish. */
.global-footer-inner{grid-template-columns:1fr 1fr 1fr}
.footer-credit-brand{color:var(--blue);font-weight:600}.footer-credit-separator{margin:0 7px;color:#aab7c2}
@media(min-width:1191px){.global-nav>a:not(:first-child):before{content:'';position:absolute;left:calc(clamp(16px,1.9vw,36px) / -2);top:50%;width:1px;height:12px;transform:translateY(-50%);background:linear-gradient(to bottom,transparent,#87c9ed,#d5e1e8,transparent);opacity:.75}.global-nav>a[aria-current]::after{left:12%;right:12%;width:auto;height:1px;background:linear-gradient(90deg,transparent,#087fe5,#8fd7f5,#087fe5,transparent);transform:scaleX(1)}.global-nav>a:not([aria-current]):after{content:'';position:absolute;left:12%;right:12%;bottom:5px;height:1px;background:linear-gradient(90deg,transparent,#087fe5,transparent);transform:scaleX(0);transform-origin:center;opacity:.7;transition:transform .24s cubic-bezier(.22,1,.36,1),opacity .24s ease}.global-nav>a:not([aria-current]):hover:after,.global-nav>a:not([aria-current]):focus-visible:after{transform:scaleX(1)}}
@media(max-width:1190px){.global-footer-inner{grid-template-columns:1fr 1fr 1.25fr}}
@media(max-width:600px){.global-footer-inner{grid-template-columns:1fr}.footer-credit-separator{margin:0 4px}}
.global-footer-contact .footer-phone-row{display:flex;align-items:baseline;gap:12px;margin:0 0 7px}.global-footer-contact .footer-phone-row span{min-width:58px;color:#617080;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.global-footer-contact .footer-phone-row a{margin:0;font-size:15px;font-weight:600;color:#1c293c}.global-footer-contact .footer-phone-row a:hover{color:var(--blue)}
/* Global footer: restrained editorial contact hierarchy. */
.global-footer-inner{align-items:start;column-gap:56px;row-gap:30px;padding-top:52px;padding-bottom:26px}
.global-footer-brand p{margin-top:12px;font-size:13px;line-height:1.6}
.global-footer-contact h2,.global-footer-hours h2{margin-bottom:18px}
.global-footer-contact .footer-phone-row{display:block;margin:0 0 13px}
.global-footer-contact .footer-phone-row span{display:block;min-width:0;margin-bottom:3px;font-size:10px;letter-spacing:.14em;color:#71808c}
.global-footer-contact .footer-phone-row a{display:block;font-size:16px;line-height:1.25;color:var(--blue);font-weight:600;letter-spacing:.01em}
.global-footer-contact .footer-phone-row:last-of-type{margin-bottom:17px;padding-bottom:15px;border-bottom:1px solid #dfe6eb}
.global-footer-contact>a:not(.global-footer-phone){font-size:13px;margin-bottom:6px;color:#617080}
.global-footer-hours dl{gap:10px;font-size:13px}
.global-footer-hours dl div{grid-template-columns:86px 1fr;gap:12px}
.global-footer-hours dt{font-weight:600}
@media(max-width:1190px){.global-footer-inner{column-gap:36px}}
@media(max-width:600px){.global-footer-inner{padding-top:38px;row-gap:30px}.global-footer-contact .footer-phone-row a{font-size:16px}.global-footer-contact .footer-phone-row:last-of-type{padding-bottom:14px}}
/* Final mobile navigation: compact, editorial panel attached to the header. */
@media(max-width:1190px){
 .global-nav{display:grid;visibility:hidden;opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .24s cubic-bezier(.22,1,.36,1),transform .24s cubic-bezier(.22,1,.36,1),visibility 0s linear .24s}
 .global-nav.is-open{display:grid;visibility:visible;opacity:1;transform:none;pointer-events:auto;transition:opacity .24s cubic-bezier(.22,1,.36,1),transform .24s cubic-bezier(.22,1,.36,1),visibility 0s}
 .global-nav>a{min-height:48px;display:flex;align-items:center;color:#1c293c}
 .global-nav>a[aria-current]{color:var(--blue);font-weight:700}
 .global-nav>a[aria-current]:before{content:'';width:3px;height:18px;margin-right:10px;background:var(--blue)}
 .global-menu-toggle{min-height:44px}
}
@media(max-width:600px){.global-nav{padding-left:20px;padding-right:20px}.global-nav>a{min-height:50px}.global-nav .global-mobile-phone{display:block;padding-top:18px;padding-bottom:8px;min-height:0;border:0;font-size:14px}}
@media(prefers-reduced-motion:reduce){.global-nav{transition:none!important}}
body.menu-locked{overflow:hidden}
/* Responsive safeguards for the final mobile pass. */
@media(max-width:800px){
 .legal-page{overflow-wrap:anywhere}
 .contact-field input,.contact-field select,.contact-field textarea{font-size:16px}
 .home-hero-copy{min-width:0}
 .home-button{max-width:100%;white-space:normal;text-align:center}
 .service-entry-copy,.service-result-copy,.service-overview-copy{min-width:0}
 .service-sequence-timeline b{overflow-wrap:anywhere}
}
@media(max-width:600px){
 .global-footer-bottom small{line-height:1.6}
 .global-footer-bottom nav{gap:16px}
}
@media(max-width:1190px){
 .global-nav .global-mobile-whatsapp{grid-column:1/-1;margin-top:10px;padding-top:16px;padding-bottom:4px;border-top:1px solid #dfe6eb;border-bottom:0;color:var(--blue);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
 .global-nav .global-mobile-whatsapp span{display:inline-block;margin-left:5px;transition:transform .22s cubic-bezier(.22,1,.36,1)}
}
@media(hover:hover) and (pointer:fine){.global-nav .global-mobile-whatsapp:hover span{transform:translateX(3px)}}
@media(max-width:600px){.global-nav .global-mobile-whatsapp{min-height:44px}}

/* ==========================================================================
   Final Polish (2026-10)
   Small, isolated refinements. Everything above stays untouched.
   ========================================================================== */
:root{--ease-out:cubic-bezier(.22,1,.36,1);--dur-micro:.2s;--dur-ui:.28s;--dur-reveal:.6s}

/* One header background on every page (was white on Kontakt/Impressum/Datenschutz, light grey elsewhere). */
.global-header{background:#f7f8f9}

/* Desktop header: the nine links plus the mobile-only WhatsApp entry did not fit between
   logo and phone block below ~1700px and overlapped both. The WhatsApp entry and the two
   legal links stay in the mobile menu and in the footer of every page. */
@media(min-width:1191px){
 .global-nav .global-mobile-whatsapp,
 .global-nav>a[href="impressum.html"],
 .global-nav>a[href="datenschutz.html"]{display:none}
}

/* Mobile menu toggle: comfortable 44px touch target and a softer icon morph. */
@media(max-width:1190px){
 .global-menu-toggle{min-width:44px}
 .global-menu-toggle i,.global-menu-toggle i:before,.global-menu-toggle i:after{transition:transform var(--dur-micro) var(--ease-out)}
}

/* Consistent, clearly visible keyboard focus inside page content (previously the
   browser default thin ring on CTAs, cards, form fields and the Mertako link). */
main a:focus-visible,main button:focus-visible,main summary:focus-visible{outline:2px solid var(--blue);outline-offset:3px}
main input[type=checkbox]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.global-skip:focus{outline:2px solid var(--blue);outline-offset:2px;box-shadow:0 6px 18px rgba(20,35,45,.12)}

/* Touch targets: footer contact links and breadcrumbs get a larger invisible hit area (>= 24px)
   without changing the layout. */
.global-footer-contact>a,.global-footer-contact .footer-phone-row a,.global-footer-bottom nav a,.service-breadcrumb a{position:relative}
.global-footer-contact>a:after,.global-footer-contact .footer-phone-row a:after,.global-footer-bottom nav a:after{content:'';position:absolute;inset:-3px -2px}
.service-breadcrumb a:after{content:'';position:absolute;inset:-7px -4px}

@media(prefers-reduced-motion:reduce){.global-menu-toggle i,.global-menu-toggle i:before,.global-menu-toggle i:after{transition:none}}

/* Gradient headings use background-clip:text, which cuts glyphs at the element box. Manrope has deeper
 descenders than Arial, so g/p/q on the last line were clipped. Extra bottom padding paints them; the
 reduced margin keeps every following element exactly where it was. */
#main-content .home-contact-copy h2{padding-bottom:.24em;margin-bottom:calc(18px - .24em)}
#main-content .about-hero-copy h1{padding-bottom:.24em;margin-bottom:calc(24px - .24em)}
#main-content .about-editorial-lead h2{padding-bottom:.24em;margin-bottom:calc(20px - .24em)}
#main-content .about-network-copy h2{padding-bottom:.24em;margin-bottom:calc(22px - .24em)}
#main-content .contact-intro h1{padding-bottom:.24em;margin-bottom:calc(16px - .24em)}
#main-content .contact-info h2{padding-bottom:.24em;margin-bottom:calc(14px - .24em)}
#main-content .contact-form-panel h2{padding-bottom:.24em;margin-bottom:calc(10px - .24em)}
#main-content .legal-page h1{padding-bottom:.24em;margin-bottom:calc(14px - .24em)}
/* Avoid single-word last lines (e.g. a lone "km.") now that DM Sans sets slightly wider than Arial. */
#main-content p{text-wrap:pretty}

/* ==========================================================================
   Footer · hell, auf allen Seiten gleich
   Ruhiger Abschluss nach den dunklen Abschnitten: Off-White mit feiner Verlaufslinie am
   Rand, Navy für Text, Markenblau für Links und Rufnummern. Das Logo steht frei (transparent).
   ========================================================================== */
.global-footer{position:relative;color:#1c293c;border-top:0;background:#f4f8fc}
.global-footer:before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#c9d9e8 18%,#c9d9e8 82%,transparent)}
.homepage-final ~ .global-footer:before{display:none}
.global-footer .global-footer-inner{padding-top:40px;padding-bottom:20px;row-gap:26px}
.global-footer h2{color:#1c293c}
.global-footer-brand img{width:150px;height:67px}
.global-footer .global-footer-brand p{color:#5c6979}
.global-footer a{color:#1c293c}
.global-footer a:hover{color:#087fe5}
.global-footer a:focus-visible{outline-color:#087fe5}
.global-footer-contact .footer-phone-row span{color:#68798e}
.global-footer-contact .footer-phone-row a{color:#087fe5}
.global-footer-contact .footer-phone-row a:hover{color:#066dca}
.global-footer-contact .footer-phone-row:last-of-type{border-bottom-color:#dbe5ee}
.global-footer-contact>a:not(.global-footer-phone){color:#1c293c}
.global-footer-hours dl{color:#5c6979}
.global-footer-hours dt{color:#1c293c}
.global-footer-bottom{border-top-color:#dbe5ee;color:#68798e}
.global-footer-bottom a{color:#1c293c}
.footer-credit-brand{color:#087fe5}
.footer-credit-separator{color:#a9b8c7}
@media(max-width:600px){.global-footer-brand img{width:118px;height:54px}.global-footer .global-footer-inner{padding-top:30px}}