/* ==========================================================================
   DIE BRANDMAUER: NAVIGATION (Absolut isoliert)
   ========================================================================== */

/* Wir greifen nur die Elemente innerhalb der navbar an */
nav.navbar, 
nav.navbar * {
    /* Hier erzwingen wir, dass alles in der Navi seinen Standard behält */
    font-family: inherit; 
}

nav.navbar a {
    /* Wir fixieren die Navi-Links so spezifisch, dass globale a-Regeln abprallen */
    text-decoration: none !important;
}

/* Falls deine Navigation eine spezielle Klasse für die Links hat (meist .nav-link) */
nav.navbar .nav-link {
    /* Hier bleibt alles genau so, wie Bootstrap es vorgibt, unberührt von p-Regeln */
}




/* ==========================================================================
   DROPDOWN - ARTOPICA EDITION (Deine Werte mit Gleit-Effekt)
   ========================================================================== */

/* 1. Die Links: Deine Kompaktheit mit zeitlicher Verzögerung */
.dropdown-menu .dropdown-item {
    font-size: 0.95rem !important;
    line-height: 1.1 !important;      /* Dein gewählter Wert */
    padding: 0.35rem 1.25rem !important; 
    font-family: 'Lato', sans-serif !important;
    
    /* DER GLEIT-EFFEKT: Verzögerung von 0.3 Sekunden */
    transition: all 0.3s ease-in-out !important; 
}

/* 2. Strong: Dein gewählter Standard */
.dropdown-menu .dropdown-item strong {
    font-weight: 500 !important;      /* Deine gewählte Gewichtung */
    color: inherit !important;
}

/* 3. Hover: Dein dunkles Grau mit Einrücken */
.dropdown-menu .dropdown-item:hover {
    background-color: #444 !important; /* Deine gewählte Farbe */
    color: #ffffff !important;         /* Text auf dunklem Grund weiß für Lesbarkeit */
    
    /* DAS EINRÜCKEN: Schiebt den Text beim Hover sanft nach rechts */
    padding-left: 1.6rem !important; 
    
    text-decoration: none !important;
}

/* 4. Abstände bereinigen */
.dropdown-menu li {
    margin-bottom: 0 !important;
}




/* -----------------------------------------------------------
   H1 - DIE MONUMENTALE PRÄSENZ (Isoliert vom Menü)
   ----------------------------------------------------------- */
h1 {
    /* Deine exakten mathematischen Maße */
    font-size: 2.369rem !important; 
    font-weight: 100 !important; 
    
    font-family: 'Lato', -apple-system, sans-serif !important;
    line-height: 1.2 !important;
    color: #ffffff !important;
    
    margin-bottom: 0.5rem !important;
    letter-spacing: normal !important;
    -webkit-font-smoothing: antialiased;
}

h1 strong {
    /* Dein gewählter Standard für die noble Kraft */
    font-weight: 500 !important; 
    color: #ffffff !important;
    display: inline;
}




/* -----------------------------------------------------------
   H2 - DER CREMONA-STANDARD (Monumental & Isoliert)
   ----------------------------------------------------------- */
h2 {
    /* Die monumentale Größe aus display-4 */
    font-size: 4.199rem !important; 
    
    /* Die noble Leichtigkeit der Basis */
    font-weight: 300 !important; 
    
    font-family: 'Lato', -apple-system, sans-serif !important;
    line-height: 1.1 !important;
    color: #000000 !important;
    margin-bottom: 1.5rem !important;
    letter-spacing: -0.02rem !important;
    
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-transform: none !important;
}

/* Der massive Block (Das G-Klasse Pferd) innerhalb der H2 */
h2 strong {
    /* Die maximale Wucht (Black 900) */
    font-weight: 900 !important; 
    color: #000000 !important;
    
    /* Ausgeklammert für natürlichen Textfluss: 
    display: block !important; 
    */
    
    /* Der kompakte "Condensed"-Effekt der Lato 900 */
    letter-spacing: -0.05rem !important; 
    margin-top: 0.2rem !important;
}




/* -----------------------------------------------------------
   H2-BANNER - DER ARISTOKRATISCHE KONTRAST
   ----------------------------------------------------------- */
h2.banner {
    color: #ffffff !important; /* Absolut Weiß für den Banner */
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3) !important; /* Dezenter Schatten für die Lesbarkeit auf unruhigem Hintergrund */
}

h2.banner strong {
    color: #ffffff !important;
    font-weight: 900 !important;
    /* Hier kannst du den Zeilenumbruch für Banner bei Bedarf wieder aktivieren */
    display: inline !important; 
    margin-top: 0.5rem !important;
}

/* Optional: Das Argument im Banner-Modus etwas dezenter */
.argument.banner {
    color: rgba(255, 255, 255, 0.7) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
    display: inline-block;
    padding-bottom: 5px;
}









/* -----------------------------------------------------------
   H3 & STRONG - DIE HARMONISCHE SEO-EINHEIT (Inhalts-Isoliert)
   ----------------------------------------------------------- */
section h3 {
    font-family: 'Lato', sans-serif !important; /* Dein Sans-Serif Standard */
    font-weight: 600 !important; /* Dein gewählter Goldstandard */
    color: #000000 !important;
    letter-spacing: 0.02em !important;
    text-transform: none !important;
    margin-bottom: 1rem !important;
}

section h3 strong {
    font-weight: 600 !important; /* Identisch zu h3 für die noble Ruhe */
    color: #000000 !important;
}






/* -----------------------------------------------------------
   DATETIME-ZEILE (Substanz-Upgrade auf 400/500)
   ----------------------------------------------------------- */

.datetime {
    font-family: 'Lato', sans-serif !important; /* Sicherer Fallback auf Lato */
    font-size: 0.9rem !important; 
    color: rgba(255, 255, 255, 0.8) !important;
    
    /* Deine gewünschte Substanz */
    font-weight: 400 !important; 
    
    letter-spacing: 0.03rem !important;
    margin-bottom: 0.5rem !important;
    display: block;
}

/* Das Datum: Deine zeitliche Autorität */
.datetime time {
    font-weight: 500 !important; 
    color: #ffffff !important;
    border-right: 1px solid rgba(255, 255, 255, 0.3) !important;
    padding-right: 12px !important;
    margin-right: 10px !important;
    display: inline-block !important;
}

/* Das Strong in der Zeile: Harmonische 500er Gewichtung */
.datetime strong {
    font-weight: 500 !important; 
    color: #ffffff !important;
    letter-spacing: 0.01rem !important;
}




/* -----------------------------------------------------------
   CAPTION - KLARHEIT UND RUHE (Isolierte Klasse)
   ----------------------------------------------------------- */
.caption {
    font-family: 'Lato', sans-serif !important; /* Sicherer Rückgriff auf Lato */
    font-size: 1.0rem !important; 
    line-height: 1.5 !important; /* Dein natürlicher Zeilenabstand */
    color: rgba(255, 255, 255, 0.8) !important;
    font-weight: 400 !important;
    
    /* Deine Vorgabe: Auf Null */
    letter-spacing: 0 !important;
    
    margin-top: 1rem !important;
    margin-bottom: 1.5rem !important;
    max-width: 800px !important;
    display: block; /* Stellt sicher, dass die Abstände wirken */
}

.caption strong {
    font-weight: 600 !important; /* Deine gewählte Betonung */
    color: #ffffff !important;
    letter-spacing: 0 !important;
}




/* -----------------------------------------------------------
   ARGUMENT (Schwarz auf Hell - Monumental)
   ----------------------------------------------------------- */
.argument {
    font-family: 'Lato', sans-serif !important;
    font-size: 1rem !important;        /* Etwas kleiner, damit es Platz hat */
    font-weight: 300 !important;
    color: rgba(0, 0, 0, 0.6) !important;
    letter-spacing: 0.1rem !important;  /* Halbiert: Immer noch weit, aber passend */
    text-transform: uppercase !important;
    margin-bottom: 0.5rem !important;
    display: block !important;
}



/* -----------------------------------------------------------
   P - DER NOBLE TEXTFLUSS (Bodenständig & Kompakt)
   ----------------------------------------------------------- */

section p {
    font-family: "PT Serif", Times, "Times New Roman", Georgia, serif !important;
    font-size: 1.25rem !important;      /* Minimal reduziert für besseren Fluss */
    font-weight: 400 !important;
    line-height: 1.45 !important;       /* Der "ganz normale" Zeilenabstand */
    color: #000000 !important; 
    margin-bottom: 1.2rem !important;   /* Etwas weniger Abstand nach unten */
    -webkit-font-smoothing: antialiased;
}

/* Die Betonung innerhalb des Fließtextes */
section p strong {
    font-weight: 600 !important; 
    color: #000000 !important;
}

/* Fallback für p-Elemente außerhalb von Sektionen */
p {
    font-family: 'Lato', sans-serif;
    line-height: 1.4 !important;
}



/* -----------------------------------------------------------
   A - DIE NOBLEN TEXT-LINKS (Optimiert für Platz & Fluss)
   ----------------------------------------------------------- */

section a.text-primary {
    font-family: "PT Serif", serif !important;
    font-size: 1.333rem !important;    /* Ein Hauch größer für die Klickbarkeit */
    font-weight: 400 !important;
    color: #045bc1 !important; 
    text-decoration: none !important;
    line-height: 1.4 !important;    /* Erlaubt sauberen Umbruch, falls kein Platz ist */
    display: inline-block !important; /* Gibt dem Link eine eigene Substanz */
    transition: color 0.2s ease-in-out !important;
}

/* Der Strong-Anteil im Link */
section a.text-primary strong {
    font-weight: 700 !important;    /* Etwas mehr Gewicht für die SGE-Relevanz */
    color: inherit !important;
}

/* HOVER */
section a.text-primary:hover {
    color: #004494 !important;
    text-decoration: underline !important;
}




/* -----------------------------------------------------------
   ARTOPICA-LINK (Text-Optik für Links außerhalb von P)
   ----------------------------------------------------------- */
section a.artopica-link {
    /* Identisch mit deinem p-Stil */
    font-family: "PT Serif", serif !important;
    font-size: 1.0rem !important;
    font-weight: 400 !important;
    line-height: 1.6 !important;
    
    /* Farbe und Verhalten */
    color: #045bc1 !important; /* Dein artopica-Blau */
    text-decoration: none !important;
    display: inline-block; /* Damit Abstände besser greifen */
    transition: all 0.2s ease-in-out;
}

/* Das Strong im Link */
section a.artopica-link strong {
    font-weight: 600 !important;
    color: inherit !important;
}

/* Hover-Zustand: Dunkler und Unterstrichen wie besprochen */
section a.artopica-link:hover {
    color: #004494 !important; /* Etwas dunkler */
    text-decoration: underline !important;
}





/* -----------------------------------------------------------
   ARISTOKRATISCHE WERTE-TABELLE
   ----------------------------------------------------------- */
.table-noble {
    width: 100%;
    margin-top: 2rem;
    border-collapse: collapse;
    font-family: 'Lato', sans-serif; /* Clean für Daten */
}

.table-noble thead tr {
    border-bottom: 2px solid #000000 !important;
}

.table-noble th {
    padding: 1.5rem 1rem;
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    font-size: 0.85rem;
    color: #666666;
    font-weight: 400;
}

.table-noble tbody tr {
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
    transition: background-color 0.3s ease;
}

.table-noble tbody tr:hover {
    background-color: rgba(0,0,0,0.02); /* Hauchfeiner Effekt beim Drüberfahren */
}

.table-noble td {
    padding: 1.5rem 1rem;
    vertical-align: middle;
    line-height: 1.6;
}

.table-noble td:first-child {
    font-weight: 700;
    width: 25%;
    color: #000000;
}



/* Struktur für die schlichte Werte-Tabelle */
.table-noble {
    border-top: 2px solid #000000; /* Ein starker oberer Abschluss */
    margin-top: 1rem;
}

.table-noble th {
    color: #000000 !important;
    font-weight: 900 !important;
    text-transform: uppercase;
    border-bottom: 1px solid #000000 !important;
}

.table-noble td {
    color: #000000 !important;
    border-bottom: 1px solid rgba(0,0,0,0.1) !important;
}




/* Rechtliche Links im Footer */
.link-footer {
    font-family: 'Lato', sans-serif;
    font-size: 0.7rem; /* Sehr klein, aber noch lesbar */
    text-transform: none;
    letter-spacing: 0.2rem; /* Weiter Abstand für edle Optik */
    color: rgba(0, 0, 0, 0.4) /* Dezentes Grau */
    transition: color 0.3s ease;
}

.link-footer:hover {
    color: #000000 !important; /* Wird beim Drüberfahren schwarz */
}




.signature {
    font-family: 'Great Vibes', cursive !important;
    font-size: 3.2rem;
    line-height: 1.1;
    display: inline;
    font-weight: 400;
}

.signature-autor {
    font-size: 1.2rem;
    letter-spacing: 2px;
    text-transform: none;
    font-weight: 500;
}