/*
Theme Name: Lichtblickkrieger Astra Child
Theme URI: https://www.lichtblickkrieger.de
Author: Rolf Studios
Author URI: https://www.rolfstudios.de
Description: Child Theme für Astra – stabiler Style-Layer für Fonts, Farben und Buttons (Wolf/Mira/TamTam).
Template: astra
Version: 1.0.0
Text Domain: astra-child-lbk
*/

/* ===== Global Design Tokens ===== */
:root{
  /* Brand Palette */
  --lbk-wolf-ink: #0e0f13;       /* tiefes Schwarzgrau */
  --lbk-wolf-silver: #cfd3da;    /* kühles Silber */
  --lbk-wolf-smoke: #2a2d34;     /* Nebelgrau */

  --lbk-mira-neon: #ff2aa3;      /* Neon Pink */
  --lbk-mira-blue: #2dd4ff;      /* Neon Blau */
  --lbk-mira-violet: #8b5cf6;    /* Violett Akzent */

  --lbk-tam-sky: #4fb0ff;        /* jugendliches Blau */
  --lbk-tam-graphite: #374151;   /* urban Grau */
  --lbk-tam-sun: #ffd166;        /* Akzent Gelb */

  /* Neutrals */
  --lbk-bg: #0b0c10;
  --lbk-text: #e5e7eb;
  --lbk-muted: #9ca3af;
  --lbk-border: #2a2f36;

  /* Typography (fallbacks safe; self-host later) */
  --heading-font: "Cinzel", "Times New Roman", serif;
  --display-font: "Bebas Neue", "Impact", system-ui, sans-serif;
  --body-font: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif;

  /* Radii & Spacing */
  --lbk-radius: 14px;
  --lbk-pad: 1.2rem;
  --lbk-pad-lg: 2rem;

  /* Buttons */
  --btn-bg: var(--lbk-mira-neon);
  --btn-bg-hover: #d40085;
  --btn-fg: #ffffff;
}

/* ===== Base ===== */
html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }

body{
  background: var(--lbk-bg);
  color: var(--lbk-text);
  font-family: var(--body-font);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6{
  font-family: var(--heading-font);
  letter-spacing: 0.4px;
  margin-top: 0.6em;
  margin-bottom: 0.3em;
}

.display, .lbk-display{
  font-family: var(--display-font);
  letter-spacing: 0.5px;
  text-transform: uppercase;
}

a{ color: var(--lbk-mira-blue); text-decoration: none; }
a:hover{ text-decoration: underline; }

/* ===== Containers ===== */
.lbk-section{
  padding: calc(var(--lbk-pad-lg) * 1.25) var(--lbk-pad);
}
.lbk-card{
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(255,255,255,0.01));
  border: 1px solid var(--lbk-border);
  border-radius: var(--lbk-radius);
  padding: var(--lbk-pad-lg);
  backdrop-filter: blur(4px);
}

/* ===== Buttons (global utility classes) ===== */
.lbk-btn, .lbk-button, .button.lbk-btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  border-radius: var(--lbk-radius);
  padding: 12px 22px;
  font-weight: 700;
  line-height: 1.1;
  border: 1px solid transparent;
  transition: all .2s ease;
  cursor: pointer;
}

.lbk-btn-primary{
  background: var(--btn-bg);
  color: var(--btn-fg);
}
.lbk-btn-primary:hover{ background: var(--btn-bg-hover); transform: translateY(-1px); }

.lbk-btn-outline{
  background: transparent;
  color: var(--btn-fg);
  border-color: var(--lbk-wolf-silver);
}
.lbk-btn-outline:hover{
  background: rgba(255,255,255,0.06);
}

/* Spectra / Gutenberg button normalization */
.wp-block-button .wp-block-button__link,
.uagb-button__wrapper .uagb-button__link{
  border-radius: var(--lbk-radius);
  font-weight: 700;
}

/* ===== Typography helpers ===== */
.lead{ font-size: clamp(1.05rem, 1.2vw + .6rem, 1.35rem); color: var(--lbk-muted); }
.small{ font-size: .9rem; color: var(--lbk-muted); }

/* ===== Paletten als Utility-Klassen ===== */
.palette-wolf{ --btn-bg: var(--lbk-wolf-silver); --btn-bg-hover:#b8bec8; }
.palette-mira{ --btn-bg: var(--lbk-mira-neon); --btn-bg-hover:#d40085; }
.palette-tam{ --btn-bg: var(--lbk-tam-sun); --btn-bg-hover:#e3b84e; }

/* ===== Optional: Header/Footer Feintuning (Astra) ===== */
.site-header, .main-header-bar{
  background: rgba(11,12,16,0.7);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--lbk-border);
}
.site-footer{
  border-top: 1px solid var(--lbk-border);
}

/* ===== Font-face Platzhalter für DSGVO-konforme lokale Einbindung ===== */
/* Lege WOFF2-Dateien später in /fonts und hebe die Kommentare auf, dann nutzt du 100% lokal gehostete Fonts. */
/*
@font-face{
  font-family: "Cinzel";
  src: url("./fonts/Cinzel-Variable.woff2") format("woff2-variations");
  font-weight: 200 900;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Bebas Neue";
  src: url("./fonts/BebasNeue-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Open Sans";
  src: url("./fonts/OpenSans-Variable.woff2") format("woff2-variations");
  font-weight: 300 800;
  font-style: normal;
  font-display: swap;
}
*/