/* =========================
   FEDV CORE (Global)
   - Tokens
   - CTA System (Primary + Ghost)
   - FSE Header spacing fixes
   - Full-bleed helpers (robust for FSE)
   - Global Hero System (bg-image via vars)
========================= */

:root{
  --fedv-brand:#1B47DA;
  --fedv-brand2:#003d8f;

  --fedv-text:#1a1a1a;
  --fedv-lead:#222222;
  --fedv-muted:#4c5b66;
  --fedv-label:#7c8d9a;

  --fedv-border1:#dde4ea;
  --fedv-border2:#ccd8e3;

  --fedv-surface:#fafbfd;

  /* CTA tokens */
  --fedv-btn-radius: 14px;
  --fedv-btn-pad-y: 12px;
  --fedv-btn-pad-x: 16px;
  --fedv-btn-focus: 0 0 0 4px rgba(27,71,218,.22);
  --fedv-content-max: 1560px;
  --fedv-pad-x: clamp(14px, 2.2vw, 26px);
}

body{
  color: var(--fedv-text);
  font-family: system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height: 1.65;
}

/* =========================
   Full-bleed helpers (ROBUST for FSE)
   - avoids calc(50% - 50vw) pitfalls in constrained/padded wrappers
   - centers element on viewport and expands to viewport width
========================= */

.fedv-fullbleed{
  position: relative;
  left: 50%;
  transform: translateX(-50%);

  width: 100vw;
  max-width: none;

  margin-left: 0;
  margin-right: 0;
}

/* modern viewport units (optional, but good) */
@supports (width: 100dvw){
  .fedv-fullbleed{ width: 100dvw; }
}
@supports (width: 100svw){
  .fedv-fullbleed{ width: 100svw; }
}

/* Prevent accidental horizontal scroll */
html, body{ overflow-x: clip; }
@supports not (overflow-x: clip){
  html, body{ overflow-x: hidden; }
}

/* =========================
   FSE / Neve-FSE: Header spacing fixes
========================= */
.wp-site-blocks > header,
header.wp-block-template-part{
  margin-block: 0 !important;
  position: relative;
  z-index: 50;
}

.wp-site-blocks > header > *{
  margin-block: 0 !important;
}

.wp-site-blocks > header + *,
.wp-site-blocks > header + main{
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.wp-site-blocks{
  padding-top: 0 !important;
}

/* =========================
   FEDV CTA System (Primary + Ghost)
   Namespace: .fedv-btn
========================= */

/* Base */
.fedv-btn{
  -webkit-tap-highlight-color: transparent;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: var(--fedv-btn-pad-y) var(--fedv-btn-pad-x);
  border-radius: var(--fedv-btn-radius);

  font-weight: 750;
  text-decoration: none;
  line-height: 1;
  white-space: nowrap;

  border: 1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, color .15s ease, opacity .15s ease;
  will-change: transform;
}

.fedv-btn:focus-visible{
  outline: none;
  box-shadow: var(--fedv-btn-focus);
}

/* Primary (blue background, white text) */
.fedv-btn--primary{
  background: linear-gradient(180deg, var(--fedv-brand) 0%, #0f3be0 100%);
  color: #fff;
  box-shadow: 0 16px 34px rgba(27,71,218,.28);
}
.fedv-btn--primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(27,71,218,.32);
}

/* Ghost (white background, blue text) */
.fedv-btn--ghost{
  background: rgba(255,255,255,.86);
  color: var(--fedv-brand);
  border-color: rgba(15,23,42,.14);
  box-shadow: 0 12px 28px rgba(15,23,42,.10);
}
.fedv-btn--ghost:hover{
  transform: translateY(-1px);
  border-color: rgba(27,71,218,.26);
  box-shadow: 0 14px 32px rgba(15,23,42,.12);
}

/* Disabled (for <button> or aria-disabled links) */
.fedv-btn:disabled,
.fedv-btn[aria-disabled="true"]{
  opacity: .55;
  cursor: not-allowed;
  pointer-events: none;
  transform: none !important;
  box-shadow: none !important;
}

/* CTA row helper */
.fedv-cta-row{
  display:flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

/* Optional: icon sizing (SVG inside button) */
.fedv-btn svg{
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
}

/* =========================
   Backwards compatibility
   (deine bisherigen Klassen)
========================= */

.btn{
  -webkit-tap-highlight-color: transparent;
  appearance: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;

  padding: var(--fedv-btn-pad-y) var(--fedv-btn-pad-x);
  border-radius: var(--fedv-btn-radius);

  font-weight: 750;
  text-decoration: none;
  line-height: 1;
  white-space: nowrap;

  border: 1px solid transparent;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease, color .15s ease, opacity .15s ease;
  will-change: transform;
}

.btn:focus-visible{
  outline: none;
  box-shadow: var(--fedv-btn-focus);
}

.btn-primary{
  background: linear-gradient(180deg, var(--fedv-brand) 0%, #0f3be0 100%);
  color: #fff;
  box-shadow: 0 16px 34px rgba(27,71,218,.28);
}
.btn-primary:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 40px rgba(27,71,218,.32);
}

.btn-ghost{
  background: rgba(255,255,255,.86);
  color: var(--fedv-brand);
  border-color: rgba(15,23,42,.14);
  box-shadow: 0 12px 28px rgba(15,23,42,.10);
}
.btn-ghost:hover{
  transform: translateY(-1px);
  border-color: rgba(27,71,218,.26);
  box-shadow: 0 14px 32px rgba(15,23,42,.12);
}

html{ scroll-behavior: smooth; }
:where([id]){ scroll-margin-top: 110px; }

/* =========================
   FEDV – Global Content Utilities
   (Typography, Lists, Layout)
========================= */

/* Optional universal content wrap */
.fedv-wrap{
  max-width: 1560px;
  margin: 0 auto;
  padding: 0 var(--fedv-pad-x);
}

/* Headline helper */
.fedv-h2{
  margin:0 0 10px 0;
  font-size:22px;
  letter-spacing:-.2px;
  color: var(--fedv-text);
}

/* Paragraph helper */
.fedv-p{
  margin:0 0 10px 0;
}

/* Muted override (falls in Modules genutzt) */
.fedv-muted{
  color: var(--fedv-muted);
}

/* Lists */
.fedv-list{
  margin:0;
  padding-left:18px;
  color:#1f2a44;
}
.fedv-list li{
  margin:6px 0;
}

/* Word-break safety (optional utility) */
.fedv-nowrapfix,
.fedv-nowrapfix *{
  overflow-wrap:anywhere;
  word-break:break-word;
}

/* =========================
   FEDV – Global Hero System
   Base: .fedv-hero (bg-image via vars)
========================= */

/* Full-bleed wrapper (robust) */
.fedv-hero-wrap{
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;
  max-width: none;
  margin: 0;
}
@supports (width: 100dvw){
  .fedv-hero-wrap{ width: 100dvw; }
}
@supports (width: 100svw){
  .fedv-hero-wrap{ width: 100svw; }
}

/* Base hero */
.fedv-hero{
  width: 100%;
  position: relative;
  overflow: hidden;
  min-height: var(--fedv-hero-min-h, auto);
  border-radius: 0;
  box-shadow: var(--fedv-hero-shadow, 0 24px 60px rgba(15,23,42,.14));

  /* Defaults via CSS variables */
  --fedv-hero-bg-x: 50%;
  --fedv-hero-bg-y: 50%;
  --fedv-hero-top-pad: clamp(64px, 7.2vw, 98px);
  --fedv-hero-bottom-pad: clamp(30px, 4vw, 54px);

  --fedv-hero-max: 1560px;
  --fedv-hero-pad-x: clamp(14px, 2.2vw, 26px);

  /* Gradient overlay (tunable) */
  --fedv-hero-grad-a: rgba(238,243,255,.96);
  --fedv-hero-grad-b: rgba(238,243,255,.90);
  --fedv-hero-grad-c: rgba(238,243,255,.55);
  --fedv-hero-grad-d: rgba(238,243,255,.20);
  --fedv-hero-grad-e: rgba(238,243,255,0);

  /* Stops (defaults) */
  --fedv-hero-stop-b: 32%;
  --fedv-hero-stop-c: 48%;
  --fedv-hero-stop-d: 60%;
  --fedv-hero-stop-e: 70%;

  background-color: #fff !important;
  background-image:
    linear-gradient(
      90deg,
      var(--fedv-hero-grad-a) 0%,
      var(--fedv-hero-grad-b) var(--fedv-hero-stop-b),
      var(--fedv-hero-grad-c) var(--fedv-hero-stop-c),
      var(--fedv-hero-grad-d) var(--fedv-hero-stop-d),
      var(--fedv-hero-grad-e) var(--fedv-hero-stop-e)
    ),
    var(--fedv-hero-image) !important;

  background-position: 0 0, var(--fedv-hero-bg-x) var(--fedv-hero-bg-y) !important;
  background-size: auto, cover !important;
  background-repeat: no-repeat, no-repeat !important;
}

/* Ambient overlay */
.fedv-hero::before{
  content:"";
  position:absolute;
  inset:-2px;
  background: linear-gradient(
    90deg,
    rgba(27,71,218,.18),
    rgba(0,61,143,.10),
    rgba(27,71,218,.14)
  );
  opacity: var(--fedv-hero-ambient-opacity, .68);
  filter: blur(18px);
  pointer-events:none;
}

/* Top fade (header merge feel) */
.fedv-hero::after{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height: var(--fedv-hero-topfade, 38px);
  background: linear-gradient(
    180deg,
    rgba(27,71,218,.14) 0%,
    rgba(238,243,255,.90) 62%,
    rgba(255,255,255,0) 100%
  );
  pointer-events:none;
}

/* Inner container */
.fedv-hero__content{
  position: relative;
  max-width: var(--fedv-hero-max);
  margin: 0 auto;
  padding: var(--fedv-hero-top-pad) var(--fedv-hero-pad-x) var(--fedv-hero-bottom-pad) var(--fedv-hero-pad-x);
}

/* Grid layout inside hero */
.fedv-hero__grid{
  display: grid;
  grid-template-columns: minmax(0, var(--fedv-hero-left, 1.35fr)) minmax(0, var(--fedv-hero-right, .9fr));
  gap: clamp(18px, 2.6vw, 28px);
  align-items: start;
}

/* Stack on tablet/mobile */
@media (max-width:1024px){
  .fedv-hero__grid{ grid-template-columns: 1fr; }
}

/* Word-break safety (if needed) */
@media (max-width:1441px){
  .fedv-hero, .fedv-hero *{
    overflow-wrap:anywhere;
    word-break:break-word;
  }
}

/* Generic lead helper */
.fedv-lead{
  max-width: var(--fedv-lead-max, 80ch);
}
