 /*
Theme Name: Astra Child
Theme URI: https://wpastra.com/
Template: astra
Author: Brainstorm Force
Author URI: https://wpastra.com/about/?utm_source=theme_preview&utm_medium=author_link&utm_campaign=astra_theme
Description: The Astra WordPress theme is lightning-fast and highly customizable. It has over 1 million downloads and the only theme in the world with 5,700+ five-star reviews! It’s ideal for professional web designers, solopreneurs, small businesses, eCommerce, membership sites and any type of website. It offers special features and templates so it works perfectly with all page builders like Spectra, Elementor, Beaver Builder, etc. Fast performance, clean code, mobile-first design and schema markup are all built-in, making the theme exceptionally SEO-friendly. It’s fully compatible with WooCommerce, SureCart and other eCommerce plugins and comes with lots of store-friendly features and templates. Astra also provides expert support for free users. A dedicated team of fully trained WordPress experts are on hand to help with every aspect of the theme. Try the live demo of Astra: https://zipwp.org/themes/astra/
Tags: custom-menu,custom-logo,entertainment,one-column,two-columns,left-sidebar,e-commerce,right-sidebar,custom-colors,editor-style,featured-images,full-width-template,microformats,post-formats,rtl-language-support,theme-options,threaded-comments,translation-ready,blog
Version: 4.11.9.1755186216
Updated: 2025-08-14 17:43:36

/************************************************************
  WebSoul Typografie – Playfair + Lato (ohne !important)
  - Farben steuert Astra (hier keine color:)
  - clamp() für mobil ? desktop
  - Gilt für Seiten, Blog (Gutenberg) & Elementor-Headings
*************************************************************/

/* 0) Lokale Webfonts (Pfade ggf. anpassen) */
@font-face {
  font-family: "Lato";
  src: url("fonts/Lato-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Lato";
  src: url("fonts/Lato-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url("fonts/PlayfairDisplay-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Playfair Display";
  src: url("fonts/PlayfairDisplay-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}

/* 1) Grundtext – Familie & Rhythmus (Farbe über Astra) */
html, body {
  font-family: "Lato", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  line-height: 1.55;
  margin: 0;
}
p { margin: 0 0 1.1em; }

/* 2) Headings – Basis (keine Farben, nur Abstände/Zeilenhöhe) */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0.25em;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: none;
}
h1 { margin-bottom: .60em; }
h2 { margin-bottom: .55em; }
h3 { margin-bottom: .50em; }
h4 { margin-bottom: .45em; }
h5 { margin-bottom: .40em; }
h6 { margin-bottom: .35em; }
h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p { margin-top: .2em; }

/* 3) Größen + Familien je Level
   Zielwerte ˜ (px): mobil ? desktop
   H1 34?51 | H2 28?39 | H3 23?30 | H4 19?23 | H5 17?20 | H6 16?17
*/

/* H1 – Playfair 400 (keine Caps) */
h1,
body .entry-content h1,
.elementor .elementor-widget-heading h1.elementor-heading-title {
  font-family: "Playfair Display", serif;
  font-weight: 400;
  font-size: clamp(2.125rem, 1.25rem + 3.5vw, 3.1875rem);
}

/* H2 – Playfair 700 */
h2,
body .entry-content h2,
.elementor .elementor-widget-heading h2.elementor-heading-title {
  font-family: "Playfair Display", serif;
  font-weight: 700;
  font-size: clamp(1.75rem, 1.05rem + 2.2vw, 2.4375rem);
}

/* H3 – Lato 700 */
h3,
body .entry-content h3,
.elementor .elementor-widget-heading h3.elementor-heading-title,
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-icon-box .elementor-icon-box-title a {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  font-size: clamp(1.4375rem, 1.05rem + 1.2vw, 1.875rem);
}

/* H4 – Lato 400 (optional leicht italic – bei Bedarf aktivieren) */
/* standardmäßig ohne italic, damit es überall ruhig bleibt */
h4,
body .entry-content h4,
.elementor .elementor-widget-heading h4.elementor-heading-title {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  /* font-style: italic; */
  font-size: clamp(1.1875rem, 1.02rem + 0.6vw, 1.4375rem);
}

/* H5 – Lato 700 Uppercase */
h5,
body .entry-content h5,
.elementor .elementor-widget-heading h5.elementor-heading-title {
  font-family: "Lato", sans-serif;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-size: clamp(1.0625rem, 1.00rem + 0.35vw, 1.25rem);
}

/* H6 – Lato 400 */
h6,
body .entry-content h6,
.elementor .elementor-widget-heading h6.elementor-heading-title {
  font-family: "Lato", sans-serif;
  font-weight: 400;
  font-size: clamp(1rem, 0.98rem + 0.15vw, 1.0625rem);
}

/* 4) Zitate – dezent, Theme-Farbe via currentColor */
blockquote,
.wp-block-quote {
  font-style: italic;
  line-height: 1.55;
  margin: 1.4em 0;
  padding-left: 1rem;
  border-left: 4px solid currentColor;
}

/* 5) Elementor-spezifische Headings: Ausrichtung & Abstand vom Widget konsistent */
.elementor .elementor-widget-heading .elementor-heading-title { 
  margin: 0; /* wir steuern Abstand über die H*-Regeln oben */
  line-height: inherit;
}

/* 6) Header-Links nie kursiv (falls altes Kit das setzt) – ohne !important */
.site-header .main-header-menu a,
.site-header .site-title a {
  font-style: normal;
}
/* ===== WebSoul – Lesbarkeit: Zeilenhöhe, Abstände, Umbrüche ===== */

/* 1) Basis – Fließtext-Lesbarkeit + automatische Silbentrennung (DE) */
.entry-content,
.elementor,
.elementor .elementor-widget-text-editor {
  line-height: 1.65;              /* angenehme Lesbarkeit im Fließtext */
  hyphens: auto;                  /* Silbentrennung (setzt lang="de" voraus) */
  overflow-wrap: break-word;      /* verhindert überlange Wörter/URLs */
  word-break: normal;
}

/* 2) Headings – nur Line-Height + Absatzabstand (keine Farben/Größen) */
/* spezifische Selektoren, damit Elementor-Defaults (0px/1.3em etc.) überstimmt werden */
.entry-content h1, .elementor h1 { line-height: 1.13; margin: 0 0 clamp(12px, 2vw, 22px); }
.entry-content h2, .elementor h2 { line-height: 1.13; margin: 0 0 clamp(10px, 1.8vw, 20px); }
.entry-content h3, .elementor h3 { line-height: 1.20; margin: 0 0 clamp(8px, 1.6vw, 18px); }
.entry-content h4, .elementor h4 { line-height: 1.26; margin: 0 0 clamp(8px, 1.4vw, 16px); }
.entry-content h5, .elementor h5 { line-height: 1.3;  margin: 0 0 clamp(6px, 1.2vw, 14px); }
.entry-content h6, .elementor h6 { line-height: 1.3;  margin: 0 0 clamp(6px, 1vw, 12px); }

/* 3) Gutenberg/Elementor: Standard-Widget-Margins entschärfen,
      damit Überschriften nicht "nach unten gezogen" werden */
.elementor .elementor-widget-heading,
.elementor .elementor-widget-heading .elementor-widget-container {
  margin: 0;                      /* keine zusätzlichen Widget-Ränder */
  padding: 0;
}

/* 4) Fließtext-Absätze: harmonischer Abstand untereinander */
.entry-content p,
.elementor .elementor-widget-text-editor p {
  margin: 0 0 0.9em;              /* moderater Absatzabstand */
}

/* 5) Listen – etwas mehr Luft, bessere Einrückung */
.entry-content ul, .entry-content ol,
.elementor .elementor-widget-text-editor ul,
.elementor .elementor-widget-text-editor ol {
  margin: 0 0 1em 1.2em;
  line-height: 1.6;
}

/* 6) Zitate – oft enger gesetzt: hier ein bisschen großzügiger */
.entry-content blockquote,
.elementor blockquote {
  line-height: 1.5;
  margin: 0 0 1.1em;
}

/* Optional (falls Überschriften sehr lang sind): sanfter Umbruch */
.entry-content h1, .elementor h1,
.entry-content h2, .elementor h2 {
  overflow-wrap: anywhere;        /* lange H1/H2 dürfen im Notfall umbrechen */
}
/*globale variablen für Galerie für Neurographiken = Übersicht/Menü*/
:root {
    --galerie-font: 'GillSans-Light', sans-serif;
    --galerie-text:#FAF3E0;
	--galerie-navi-line-height:1.3;
	--galerie-navi-fontsize:1.7rem;
    --galerie-buyButton-bg:#EAE2D6;
    --galerie-buyButton-text:#464646;
	--galerie-buyButton-margin-top:10px;
	--galerie-buyButton-margin-bottom:10px;
    --galerie-hochkant-width: 30%;
    --galerie-quadrat-width: 30%;
    --galerie-quer-width: 30%;
	--galerie-formatueberschrift-margin-top: 70px;
	--galerie-formatueberschrift-margin-bottom: 30px;
/*globale variablen für Imageview = Einzelbilder*/	
    --imgview-bg:#464646;
    --imgview-text:#FAF3E0;
    --imgview-img-quadrat-height:70em;
    --imgview-img-hochkant-height:65em;
    --imgview-img-quer-height:60em;
    --imgview-h4-magin-top:6px;
    --imgview-h4-magin-left:2px;
    --imgview-h4-font-size: 1.6rem;
}

