/* Hygge and Home – Brand-Angleichung an Instagram (Vorschau, Okt 2026)
   Creme-Hintergrund, Textbraun, Jost als Fließtext, Teilen-Buttons in Brand-Farben. */
:root {
  --hnh-bg: #FBF6EE;
  --hnh-bg-alt: #F6EEE3;
  --hnh-surface-soft: #F6EEE3;
  --hnh-text: #3A2328;
  --hnh-muted: #7A6660;
}

body {
  background:
    radial-gradient(circle at top left, rgba(165, 70, 87, 0.05), transparent 34%),
    linear-gradient(180deg, #FBF6EE 0%, #F6EEE3 100%);
  color: var(--hnh-text);
  font-family: "Jost", "DM Sans", "Segoe UI", sans-serif;
}

/* Artikel: Fließtext in Jost + Textbraun statt Arial/Schwarz */
.entry-content,
.entry-content p,
.entry-content li,
.entry-content td,
.entry-content th,
.entry-content blockquote,
.hnh-article-prose,
.hnh-article-prose p,
.hnh-article-prose li,
.hnh-article-prose td,
.hnh-article-prose th,
.hnh-article-prose blockquote {
  font-family: "Jost", "DM Sans", sans-serif !important;
  color: var(--hnh-text) !important;
}
.entry-content p,
.entry-content li,
.hnh-article-prose p,
.hnh-article-prose li {
  font-size: 18px;
  line-height: 1.75;
}

/* Artikelfläche auf Creme statt Weiß (GeneratePress-Container ist weiß) */
.site.grid-container,
.single .site-content,
.single .inside-article,
.single .site-main,
.page .inside-article {
  background: transparent !important;
}

/* Teilen-Buttons (Shared Counts) in Brand-Farben statt Facebook-Blau/Pinterest-Rot */
.shared-counts-wrap .shared-counts-button {
  background: #FBF6EE !important;
  color: #A54657 !important;
  border: 1px solid rgba(165, 70, 87, 0.35) !important;
  border-radius: 999px !important;
}
.shared-counts-wrap .shared-counts-button:hover {
  background: #A54657 !important;
  color: #FBF6EE !important;
}
.shared-counts-wrap .shared-counts-button .shared-counts-label {
  color: inherit !important;
}
.shared-counts-wrap .shared-counts-button svg {
  fill: currentColor !important;
}

/* Inhaltsverzeichnis (Easy TOC) ebenfalls in Jost */
.ez-toc-container,
.ez-toc-container *,
.ez-toc-list a,
[class*="toc"] a {
  font-family: "Jost", "DM Sans", sans-serif !important;
  color: var(--hnh-text);
}

/* Kopfbereich in Creme statt Rosa-Grau */
.hnh-site-header {
  background: linear-gradient(180deg, rgba(251, 246, 238, 0.96), rgba(251, 246, 238, 0.86)) !important;
}
.site-header {
  background: transparent !important;
}

/* Regel-Box im Artikel (Instagram-Muster: Problem → Regel → Frage) */
.hnh-regel-box {
  background: #F6EEE3;
  border: 1px solid rgba(165, 70, 87, 0.22);
  border-radius: 22px;
  padding: 28px 32px !important;
  margin: 32px 0 !important;
}
.hnh-regel-box h2 {
  margin-top: 0 !important;
  color: #A54657 !important;
  font-style: italic;
}
.hnh-regel-box ol li {
  margin-bottom: 12px;
}
.hnh-regel-box--frage {
  border-color: rgba(92, 117, 93, 0.3);
}
.hnh-regel-box--frage h2 {
  color: #5C755D !important;
}
.hnh-pin-bild img {
  max-width: 420px;
  border-radius: 18px;
}
/* Box-Titel als Absatz (kein H2), damit er nicht im Inhaltsverzeichnis mitgezählt wird */
.hnh-regel-box .hnh-regel-box__titel {
  font-family: Fraunces, Georgia, serif !important;
  font-style: italic;
  font-size: 30px !important;
  line-height: 1.2;
  color: #A54657 !important;
  margin: 0 0 14px !important;
}
.hnh-regel-box .hnh-regel-box__titel--frage {
  color: #5C755D !important;
}

/* Startseiten-Claim: kursiver Teil in Beere wie auf Instagram */
.hnh-display-title em {
  font-style: italic;
  color: #A54657;
}

/* Instagram-Block auf der Startseite: keine Link-Unterstreichung, Brand-Schriften */
.hnh-home-instagram,
.hnh-home-instagram * {
  text-decoration: none !important;
  text-shadow: none !important;
}
.hnh-home-instagram h2 {
  font-family: Fraunces, Georgia, serif !important;
}
.hnh-home-instagram p,
.hnh-home-instagram span {
  font-family: "Jost", "DM Sans", sans-serif !important;
}
html body a.hnh-home-instagram.hnh-home-instagram--link,
html body a.hnh-home-instagram.hnh-home-instagram--link:hover,
html body a.hnh-home-instagram.hnh-home-instagram--link:focus,
html body a.hnh-home-instagram.hnh-home-instagram--link:visited {
  text-decoration: none !important;
  text-decoration-line: none !important;
}