/**
 * Design 71 Base - Typografie-Skala
 * ---------------------------------------------------------------------------
 * KASKADEN-PRINZIP
 *
 * Diese Datei ersetzt exakt Divis eigene Standard-Schriftgroessen - nicht mehr
 * und nicht weniger. Dazu werden bewusst DIESELBEN Selektoren mit DERSELBEN
 * Spezifitaet verwendet, die Divi in seiner style.css benutzt.
 *
 * Ergebnis:
 *   1. Modul-Feld auf "Default"    -> zentrale Werte aus "Typografie (Design 71)"
 *   2. Modul-Feld manuell gesetzt  -> Divis Modul-CSS hat hoehere Spezifitaet
 *                                     bzw. steht spaeter im Head -> Modul gewinnt
 *   3. Plugin/Theme deaktiviert    -> Divis Originalwerte greifen wieder
 *
 * ZWEI BEDINGUNGEN:
 *   a) KEIN @layer. Gelayertes CSS verliert immer gegen ungelayertes CSS -
 *      also auch gegen Divis Basis-CSS. Deshalb steht hier nichts in einem Layer.
 *   b) Diese Datei muss NACH Divis style.css und VOR Divis Modul-CSS
 *      (et-critical-inline-css / et-core-unified-*) geladen werden.
 *      Im Enqueue: wp_enqueue_style( 'design71base-typography-scale', ...,
 *                                    array( 'divi-style' ), ... );
 *
 *   Kein !important - jedes !important wuerde Punkt 2 zerstoeren.
 * ---------------------------------------------------------------------------
 */


/* ===========================================================================
   1. Backend / Visual Builder - Modalfenster lesbar halten
   ========================================================================= */
.media-modal h1,
.media-modal h2,
.media-modal h3,
.media-frame .media-frame-title,
.media-frame h1,
.et-fb-modal h1,
.et-fb-modal h2 {
	font-size: 22px !important;
	line-height: 1.4 !important;
	font-weight: 600 !important;
}


/* ===========================================================================
   2. Ueberschriften - Desktop
   Spiegelt Divi: h1{30px} h2{26px} h3{22px} h4{18px} h5{16px} h6{14px}
   Groesse und Zeilenhoehe kommen je Ebene aus "Typografie (Design 71)".
   ========================================================================= */
h1 { font-size: var(--d71-h1-size); line-height: var(--d71-h1-lh); }
h2 { font-size: var(--d71-h2-size); line-height: var(--d71-h2-lh); }
h3 { font-size: var(--d71-h3-size); line-height: var(--d71-h3-lh); }
h4 { font-size: var(--d71-h4-size); line-height: var(--d71-h4-lh); }
h5 { font-size: var(--d71-h5-size); line-height: var(--d71-h5-lh); }
h6 { font-size: var(--d71-h6-size); line-height: var(--d71-h6-lh); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--d71-font-heading);
}

/* Divi verkleinert Ueberschriften in schmalen Spalten (1/3, 1/4, 1/5, 1/6, 2/5).
   Gleiche Selektoren -> zentrale Werte gelten auch dort.
   Wer Divis Verkleinerung behalten will, kommentiert diesen Block aus. */
.et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 { font-size: var(--d71-h1-size); }
.et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 { font-size: var(--d71-h2-size); }
.et_pb_column_1_3 h3, .et_pb_column_1_4 h3, .et_pb_column_1_5 h3, .et_pb_column_1_6 h3, .et_pb_column_2_5 h3 { font-size: var(--d71-h3-size); }
.et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4 { font-size: var(--d71-h4-size); }
.et_pb_column_1_3 h5, .et_pb_column_1_4 h5, .et_pb_column_1_5 h5, .et_pb_column_1_6 h5, .et_pb_column_2_5 h5 { font-size: var(--d71-h5-size); }
.et_pb_column_1_3 h6, .et_pb_column_1_4 h6, .et_pb_column_1_5 h6, .et_pb_column_1_6 h6, .et_pb_column_2_5 h6 { font-size: var(--d71-h6-size); }


/* ===========================================================================
   3. Fliesstext
   Spezifitaet (0,1,0) - Divis Modul-CSS (.et_pb_text_0) hat dieselbe
   Spezifitaet, steht aber spaeter im Head und gewinnt daher.
   ========================================================================= */
body {
	font-family: var(--d71-font-body);
}

.et_pb_text,
.entry-content {
	font-size: var(--d71-body-size);
	line-height: var(--d71-body-line-height);
}


/* ===========================================================================
   4. Mobile (max. 980px)
   Media Queries erhoehen die Spezifitaet NICHT - deshalb muessen hier
   dieselben Selektorpaare wiederholt werden wie im Desktop-Block.
   ========================================================================= */
@media (max-width: 980px) {

	h1 { font-size: var(--d71-h1-size-mobile); line-height: var(--d71-h1-lh-mobile); }
	h2 { font-size: var(--d71-h2-size-mobile); line-height: var(--d71-h2-lh-mobile); }
	h3 { font-size: var(--d71-h3-size-mobile); line-height: var(--d71-h3-lh-mobile); }
	h4 { font-size: var(--d71-h4-size-mobile); line-height: var(--d71-h4-lh-mobile); }
	h5 { font-size: var(--d71-h5-size-mobile); line-height: var(--d71-h5-lh-mobile); }
	h6 { font-size: var(--d71-h6-size-mobile); line-height: var(--d71-h6-lh-mobile); }

	.et_pb_column_1_3 h1, .et_pb_column_1_4 h1, .et_pb_column_1_5 h1, .et_pb_column_1_6 h1, .et_pb_column_2_5 h1 { font-size: var(--d71-h1-size-mobile); }
	.et_pb_column_1_3 h2, .et_pb_column_1_4 h2, .et_pb_column_1_5 h2, .et_pb_column_1_6 h2, .et_pb_column_2_5 h2 { font-size: var(--d71-h2-size-mobile); }
	.et_pb_column_1_3 h3, .et_pb_column_1_4 h3, .et_pb_column_1_5 h3, .et_pb_column_1_6 h3, .et_pb_column_2_5 h3 { font-size: var(--d71-h3-size-mobile); }
	.et_pb_column_1_3 h4, .et_pb_column_1_4 h4, .et_pb_column_1_5 h4, .et_pb_column_1_6 h4, .et_pb_column_2_5 h4 { font-size: var(--d71-h4-size-mobile); }
	.et_pb_column_1_3 h5, .et_pb_column_1_4 h5, .et_pb_column_1_5 h5, .et_pb_column_1_6 h5, .et_pb_column_2_5 h5 { font-size: var(--d71-h5-size-mobile); }
	.et_pb_column_1_3 h6, .et_pb_column_1_4 h6, .et_pb_column_1_5 h6, .et_pb_column_1_6 h6, .et_pb_column_2_5 h6 { font-size: var(--d71-h6-size-mobile); }

}