/* WPF Gadgets — wiederverwendbare Stahlblau-Grafiken (Chevrons, Punkt-Bänder, Dot-Patches)
   Aus der Startseite extrahiert, damit Unterseiten dieselbe Bildsprache nutzen. */

.gx{ --steel:#2F6FA8; --steel-deep:#235586; --sky:#9CC4E6; --pap:#16222E; }
.gx-band{ padding:30px 24px; display:flex; flex-direction:column; align-items:center; gap:4px; }
.gx-band.dark{ background:var(--pap); }
@media(min-width:768px){ .gx-band:has(.gx-chev){ padding-top:34px; } }

/* großer Abwärts-Chevron (Dreifarb-Stack) */
.gx-chev svg{ display:block; margin:-12px 0; }
.gx-chev path{ stroke:var(--steel); stroke-width:13; fill:none; stroke-linecap:square; }
.gx-chev .c2 path{ stroke:var(--steel-deep); } .gx-chev .c3 path{ stroke:var(--sky); }

/* Mini-Chevron */
.gx-chevmini{ display:flex; flex-direction:column; align-items:center; padding:30px 0 16px; }
.gx-chevmini svg{ display:block; margin:-9px 0; }
.gx-chevmini path{ stroke:var(--steel); stroke-width:11; fill:none; stroke-linecap:square; }
.gx-chevmini .c2 path{ stroke:var(--steel-deep); } .gx-chevmini .c3 path{ stroke:var(--sky); }

/* verteilte Dot-Patches (Akzent) */
.gx-dotpatch{ width:100%; max-width:1100px; margin:0 auto; padding:0 24px; display:flex; pointer-events:none; }
.gx-dotpatch.right{ justify-content:flex-end; } .gx-dotpatch.left{ justify-content:flex-start; }
.gx-dotpatch i{ display:block; width:300px; height:130px;
  background-image:radial-gradient(rgba(47,111,168,.16) 1.4px, transparent 1.6px);
  background-size:18px 18px;
  -webkit-mask-image:radial-gradient(closest-side, #000 35%, transparent 100%);
          mask-image:radial-gradient(closest-side, #000 35%, transparent 100%); }
@media(max-width:600px){ .gx-dotpatch i{ width:200px; height:100px; } }

/* gepunktetes Halftone-Band */
.gx-half{ width:100%; max-width:1200px; height:48px; border-radius:6px; background:
  radial-gradient(#2F6FA8 1.5px,transparent 1.6px) 0 0/13px 13px,
  radial-gradient(#2F6FA8 1.5px,transparent 1.6px) 6.5px 6.5px/13px 13px,transparent;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 30%,#000 70%,transparent); opacity:.55; }

/* × Marks */
.gx-marks{ display:flex; gap:16px; color:var(--steel); font-weight:800; font-size:26px; line-height:1; }
.gx-marks span:nth-child(2){ color:var(--steel-deep); } .gx-marks span:nth-child(3){ color:var(--sky); }

/* zentrierter CTA-Helfer */
.gx-cta{ display:flex; justify-content:center; margin:10px 0 6px; }

/* Editorial-Display-Schrift (Grift) für Headlines auf den Unterseiten — konsistent mit der Startseite */
@font-face{font-family:'Grift';font-weight:400;font-display:swap;src:url('fonts/grift-regular.woff2') format('woff2');}
@font-face{font-family:'Grift';font-weight:600;font-display:swap;src:url('fonts/grift-semibold.woff2') format('woff2');}
@font-face{font-family:'Grift';font-weight:700;font-display:swap;src:url('fonts/grift-bold.woff2') format('woff2');}
@font-face{font-family:'Grift';font-weight:900;font-display:swap;src:url('fonts/grift-black.woff2') format('woff2');}
h1, h2, h3{ font-family:'Grift','Inter',serif !important; letter-spacing:-.02em; }