/* ============================================================
   WISION CLAIMS — eigene Produkt-Identität
   Logistik-Blau · Archivo · Akte, Status, Frist
   Bewusst NICHT das Agentur-Gold: Werkzeugcharakter statt Boutique.
   ============================================================ */

:root{
  --cl-blau:#2D6CDF;
  --cl-blau2:#5B8DEA;
  --cl-orange:#EA5B0C;
  --cl-navy:#0A1A2F;
}

/* ---------- Kopfzeile: Statusleiste wie in einer Fallakte ---------- */
.hero{position:relative}
.hero::before{
  content:"";position:absolute;top:0;left:0;right:0;height:3px;z-index:2;
  background:linear-gradient(90deg,
    var(--cl-blau) 0%,var(--cl-blau) 34%,
    var(--warnf,#C77414) 34%,var(--warnf,#C77414) 55%,
    var(--cl-orange) 55%,var(--cl-orange) 72%,
    var(--ok,#178A50) 72%,var(--ok,#178A50) 100%);
  opacity:.85;
}

/* Dezentes Raster – „Ordnung im Prozess" */
.hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
  background-image:
    linear-gradient(rgba(91,141,234,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(91,141,234,.05) 1px,transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(70% 60% at 30% 20%,#000 0%,transparent 72%);
  -webkit-mask-image:radial-gradient(70% 60% at 30% 20%,#000 0%,transparent 72%);
}
.hero > *{position:relative;z-index:1}

/* ---------- Typografie schärfen (Archivo, werkzeughaft) ---------- */
h1{letter-spacing:-.03em !important}
h2{letter-spacing:-.025em !important}
.kicker{
  display:inline-flex;align-items:center;gap:.5rem;
  letter-spacing:.14em !important;
}
.kicker::before{
  content:"";width:14px;height:2px;background:var(--cl-blau);display:inline-block;
}
.dunkel .kicker::before{background:var(--cl-blau2)}

/* ---------- Fristen/Eskalation: Orange als Signalfarbe ---------- */
.pil,.tag{letter-spacing:.02em}
.karte{transition:border-color .25s,transform .25s,box-shadow .25s;border:1px solid transparent}
.karte:hover{
  transform:translateY(-2px);
  border-color:rgba(45,108,223,.28);
  box-shadow:0 16px 40px rgba(10,26,47,.10);
}
.dunkel .karte:hover{
  border-color:rgba(91,141,234,.35);
  box-shadow:0 16px 44px rgba(0,0,0,.35);
}

/* CTA mit Tiefe statt Verlaufsspielerei – Werkzeug, kein Schmuck */
.cta{
  background:var(--cl-blau) !important;
  box-shadow:0 10px 26px rgba(45,108,223,.34),inset 0 1px 0 rgba(255,255,255,.18) !important;
  transition:background .2s,transform .2s,box-shadow .2s;
}
.cta:hover{background:#1F56B8 !important;transform:translateY(-1px)}

/* Preis-Empfehlung im Produktton */
.preis .empf,.empf{
  background:var(--cl-blau) !important;color:#fff !important;
  letter-spacing:.08em;font-weight:700;
}

/* Mono-Kennungen (Fall-Nummern) leicht betonen */
.mono,.chip{letter-spacing:.01em}
.chip{border-color:rgba(91,141,234,.28) !important}

/* Browser-Mockup: Produktrahmen */
.frame{box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(91,141,234,.18) !important}

@media(prefers-reduced-motion:reduce){
  .karte:hover,.cta:hover{transform:none}
}