/* =========================================================
   10_core.css — GLOBAL
   Enthält: Fonts, Tokens, Grundtypografie, Master-Container,
            Header/Footer-Rahmen, md-content-Breite, Debug-Hilfen
   Keine seiten-/feature-spezifischen Styles hier.
========================================================= */


/* ======================= */
/*  Local Fonts (no CDN)   */
/* ======================= */
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('../assets/fonts/poppins-v24-latin-regular.woff2') format('woff2');
  font-display: block;
}
@font-face {
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../assets/fonts/poppins-v24-latin-500.woff2') format('woff2');
  font-display: block;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../assets/fonts/open-sans-v44-latin-regular.woff2') format('woff2');
  font-display: block;
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../assets/fonts/open-sans-v44-latin-600.woff2') format('woff2');
  font-display: block;
}

/* ================ */
/* Layout Variables */
/* ================ */
:root{
  --ix-maxw: 1400px;      /* gemeinsame Gesamtbreite */
  --ix-gutter-l: 24px;    /* linke Innenkante */
  --ix-gutter-r: 24px;    /* rechte Innenkante */

  /* 🎨 Primär- und Akzentfarben */
  --ix-color-primary:       #F59E0B;  /* Amber – Hauptfarbe */
  --ix-color-primary-soft:  #E29A26;  /* Gedämpftes Amber – dezente Variante */
  --ix-color-accent:        #D9467E;  /* Warm Magenta – Sekundärakzent */
                      
  /* ⚙️ Neutrale und Hintergrundfarben */
  --ix-color-neutral:       #374151;  /* Graphite Gray – neutraler Text-/Flächenton */
  --ix-color-bg:            #F3F4F6;  /* Soft Gray – Standard-Hintergrund */
  --ix-color-header-bg:     #000000;  /* Tiefschwarz – Header/Navigation */
  --ix-color-footer-bg:     #000000;  /* Tiefschwarz – Footer/Navigation */
  /* 🧱 Basisfarben */
  --ix-color-black:         #000000;  /* Schwarz – absolute Basis */
  --ix-color-white:         #FFFFFF;  /* Weiß – Text auf dunklem Hintergrund */

  /* 🌗 Optionale Schattierung / Utility-Töne */
  --ix-color-border:        #E5E7EB;  /* zarte Linien, z. B. Tabellenrahmen */
  --ix-color-surface:       #1F2937;  /* dunkle Oberflächen (Cards, Overlays) */

  --md-text-font: 'Open Sans';

    /* Tip (Amber – freundlich) */
  --md-admonition-bg-color--tip: #FFF8E1;
  --md-admonition-border-color--tip: #F59E0B;
  --md-admonition-fg-color--tip: #4A3000;

    /* Info (neutral – technisch) */
  --md-admonition-bg-color--info: #FAFAFA;
  --md-admonition-border-color--info: #BDBDBD;
  --md-admonition-fg-color--info: #333333;

  /* Warning (heller Amber – stärkerer Rahmen) */
  --md-admonition-bg-color--warning: #FFF4CC;
  --md-admonition-border-color--warning: #F59E0B;
  --md-admonition-fg-color--warning: #4A3000;
  
}

/* ===================================== */
/*   Grundtypografie (neutral, robust)   */
/* ===================================== */

body{
  font-family: 'Open Sans', system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html{
  overflow-y: scroll;
}

.md-typeset h1,
#lp h2 {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 1.8rem !important;
  line-height: 1.22;
  color:  var(--ix-color-neutral);
  margin: 0;
}

.md-typeset h2,
#lp h2 {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 1.5rem !important;  /* klar kleiner, aber immer noch präsent */
  line-height: 1.25;
  color: var(--ix-color-neutral);
  margin: 1.2em 0 0.4em;  /* oben wieder Abstand zulassen */
}

.md-typeset h3,
#lp h2 {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 1.25rem !important; /* subtil, schon mehr „Fließtext-Nähe“ */
  line-height: 1.25;
  color: var(--ix-color-neutral);
  margin: 1em 0 0.3em;
}

.md-typeset p{
  font-family: 'Open Sans', sans-serif;
  font-weight: 400;
  font-size: 0.84rem !important;
  line-height: 1.7;
  color: var(--ix-color-neutral);
}

#lp .lp-sub {
  font-size: 1.6rem !important;
  line-height: 1.25 !important;
  color: var(--ix-color-neutral);
  white-space: normal;
  overflow-wrap: break-word;
}

/* ===================================== */
/*  Master-Grid (MD + Landing identisch) */
/* ===================================== */
.md-grid{
  max-width: var(--ix-maxw) !important;
  margin: 0 auto !important;
  padding-left: var(--ix-gutter-l) !important;
  padding-right: var(--ix-gutter-r) !important;
  padding-top: 1rem;
  box-sizing: border-box;
}

/* Material-Content auf die gleiche Breite zwingen */
.md-content{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Einheitlicher Außen-Container (falls verwendet) */
.ix-container{
  max-width: var(--ix-maxw);
  margin: 0 auto;
  padding-left: var(--ix-gutter-l);
  padding-right: var(--ix-gutter-r);
}

/* ======================= */
/*  Header                 */
/* ======================= */
.ix-header{
  position: sticky;
  top: 0;
  z-index: 10;
  height: 105px;
}

.ix-header__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
 
  height: 85px;
}


/* ======================= */
/*  Content                */
/* ======================= */
.ix-main .ix-content{
  padding-top: 1rem;
  padding-bottom: 1.6rem;
  min-height: 24px; /* bleibt sichtbar auch wenn leer */
}

/* ======================= */
/*  Content + Footer       */
/* ======================= */
.ix-footer__inner{
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  max-height: 60px;
}

/* ======================= */
/*  Responsive Gutters     */
/* ======================= */
@media (max-width: 980px){
  :root{
    --ix-gutter-l: 24px;
    --ix-gutter-r: 16px;
  }
}


/* sticky */

:root {
  --ix-header-height: 105px;
  --ix-sticky-gap: 16px;
  --ix-sticky-offset: calc(var(--ix-header-height) + var(--ix-sticky-gap));
}

/* NAV & TOC unterhalb des Headers fixieren */
.md-sidebar,
.md-sidebar--secondary {
  top: var(--ix-sticky-offset) !important;
}

.md-sidebar{
  width:9.5rem;

}

/* sticky ende */