/* ============================================================
 * Individuelle Styles für: HS Meta Boxes Content Template
 * Diese Datei wird von "HS Features" verwaltet und liegt außerhalb
 * des Plugin-Ordners, damit Anpassungen bei Updates erhalten bleiben.
 * Sie wird im Frontend geladen, solange das Plugin aktiv ist.
 * ============================================================ */

/* ==========================================================================
   HS Meta Boxes Content Template – KSR-Designadaption
   --------------------------------------------------------------------------
   Ueberschreibt die Design-Tokens des Plugins (--hsmbct-*) mit den KSR-Farben
   und uebernimmt die KSR-Optik: kantig (Radius 3px), helle Ueberschriften
   (font-weight 400), rote Akzentlinie, weicher grosser Schatten, max. 1320px.

   EINBINDEN NACH der Plugin-CSS, z. B.:
   - Design -> Zusaetzliches CSS (Customizer), oder
   - ein eigenes wp_enqueue_style( ..., array('hsmbct-front'), ... ), oder
   - ein Code-Snippet / Child-Theme.

   Alle Plugin-Overrides sind auf .hsmbct-main begrenzt – der Rest der Seite
   bleibt unberuehrt.
   ========================================================================== */

/* 1) KSR-Palette ---------------------------------------------------------- */
:root {
	--ksr-primary:   #213d67;
	--ksr-secondary: #333333;
	--ksr-accent:    #be1522;
	--ksr-tertiary:  #f2f2f2;
	--ksr-text:      #333333;
	--ksr-heading:   #333333;
	--ksr-border:    #d8dede;
	--ksr-surface:   #f2f2f2;
	--ksr-white:     #fff;
	--ksr-blue:      var(--ksr-primary);
	--ksr-blue-dark: #172f52;
	--ksr-cyan:      var(--ksr-accent);
	--ksr-red:       var(--ksr-accent);
	--ksr-muted:     #575756;
	/*--ksr-max:       1320px;*/
	--ksr-shadow:    0 4px 40px rgba(33, 61, 103, 0.11);
	--ksr-radius:    3px; /* KSR ist kantig */
}

/* 2) Plugin-Tokens auf KSR mappen (nur innerhalb des Plugins) ------------- */
.hsmbct-main {
	/* Theme-Schrift uebernehmen (KSR nutzt die Theme-Schrift) */
	--hsmbct-font: inherit;

	/* Farben */
	--hsmbct-primary:       var(--ksr-primary);
	--hsmbct-primary-dark:  var(--ksr-blue-dark);
	--hsmbct-primary-ghost: #e9edf4; /* helle Blau-Tönung für Tags/Icon-Kreise */
	--hsmbct-secondary:     var(--ksr-accent); /* Akzent = Rot */

	--hsmbct-text:       var(--ksr-text);
	--hsmbct-muted:      var(--ksr-muted);
	--hsmbct-gray-dark:  var(--ksr-muted);
	--hsmbct-dark:       var(--ksr-heading);
	--hsmbct-heading:    var(--ksr-heading);
	--hsmbct-white:      var(--ksr-white);
	--hsmbct-gray-light: var(--ksr-surface);

	--hsmbct-border:       var(--ksr-border);
	--hsmbct-border-green: var(--ksr-border); /* neutralisiert den grünen Rahmen */

	/* Form & Tiefe: kantig + weicher KSR-Schatten */
	--hsmbct-radius:    var(--ksr-radius);
	--hsmbct-radius-sm: var(--ksr-radius);
	--hsmbct-shadow:    var(--ksr-shadow);

	/* Inhaltsbreite wie KSR (1320px) */
	--hsmbct-maxw:      var(--ksr-max);
	--hsmbct-container: var(--ksr-max);

	line-height: 1.7; /* ruhige KSR-Zeilenhöhe */
}

/* Modernere Schreibweise */
@media (max-width: 1400px) {
  .hsmbct-section:not(.hsmbct-section--header, .hsmbct-section--image_divider) > div {
    --hsmbct-container: 990px;
  }
}

@media (max-width: 1200px) {
  .hsmbct-section:not(.hsmbct-section--header, .hsmbct-section--image_divider) > div {
    --hsmbct-container: 990px;
  }
}

@media (max-width: 992px) {
  .hsmbct-section:not(.hsmbct-section--header, .hsmbct-section--image_divider) > div {
    --hsmbct-container: 880px;
  }
}

@media (max-width: 782px) {
  .hsmbct-section:not(.hsmbct-section--header, .hsmbct-section--image_divider) > div {
    --hsmbct-container: 90%;
  }
}

/* 3) KSR-Optik: helle Ueberschriften ------------------------------------- */
.hsmbct-main .hsmbct-h1,
.hsmbct-main .hsmbct-h2,
.hsmbct-main .hsmbct-sec-heading,
.hsmbct-main .hsmbct-ctasec-heading,
.hsmbct-main .hsmbct-card-title,
.hsmbct-main .hsmbct-panel-title,
.hsmbct-main .hsmbct-infostat-heading {
	font-weight: 400;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

/* Rote Akzentlinie unter den Sektions-Ueberschriften (KSR-Signatur).
   Linksbuendig; bei zentrierten Ueberschriften ggf. margin-inline: auto. */
.hsmbct-main .hsmbct-sec-heading::after,
.hsmbct-main .hsmbct-ctasec-heading::after {
	content: "";
	display: block;
	width: 72px;
	height: 2px;
	background: var(--ksr-accent);
	margin: 16px auto 0;).
}

/* 4) Feinschliff --------------------------------------------------------- */
/* Links im Fliesstext in KSR-Blau */
.hsmbct-main a {
	/*color: var(--ksr-primary);*/
}

/* Primaerer Button: Hover -> dunkleres Blau (KSR) */
.hsmbct-main .hsmbct-btn:hover,
.hsmbct-main .hsmbct-btn:focus-visible {
	background: var(--ksr-blue-dark);
	color: var(--ksr-white);
}

/* Sichtbarer Fokus (Barrierefreiheit, KSR) */
.hsmbct-main a:focus-visible,
.hsmbct-main button:focus-visible {
	outline: 2px solid var(--ksr-accent);
	outline-offset: 2px;
}