/* ========================================================================== 
   PATTAYAFANS.DE – ZUSÄTZLICHES THEME-STYLESHEET
   ========================================================================== 

   Diese Datei wird NACH den drei CSS-Dateien des Stories-Templates geladen:

   1. assets/css/style.css
   2. assets/css/widgets.css
   3. assets/css/responsive.css
   4. assets/css/pattayafans.css  ← diese Datei

   Dadurch lassen sich Farben, Breiten und eigene Komponenten zentral ändern,
   ohne die Originaldateien des gekauften Templates bearbeiten zu müssen.

   INHALT
   01. Zentrale Einstellungen
   02. Grundgestaltung
   03. Kopfbereich und Suche
   04. Hauptnavigation und Untermenüs
   05. Mobile Navigation
   06. Startseite: Titelbereich
   07. Startseite: Karten und Beitragslisten
   08. Sidebar und Widgets
   09. Footer und Empfehlungen
   10. Artikel: Grundaufbau
   11. Artikel: Kopfbereich, Metadaten und Bilder
   12. Artikel: Text und Überschriften
   13. Artikel: Fakten, Listen und Infoboxen
   14. Related Posts
   15. Inhaltsverzeichnis
   16. Besondere Goldpreis-Box
   17. Wiederverwendbare Komponenten und Style Guide
   18. Responsive Anpassungen
   ========================================================================== */

/* ========================================================================== 
   01. ZENTRALE EINSTELLUNGEN
   Farben, Breiten, Schriften und Rundungen werden hauptsächlich hier geändert.
   ========================================================================== */

:root {
  --pf-accent: #b88a38;
  --pf-accent-dark: #9c6d1e;
  --pf-blue: #2f465a;
  --pf-blue-dark: #203545;
  --pf-heading: #22303c;
  --pf-text: #34424d;
  --pf-muted: #65717a;
  --pf-page-bg: #f4f1eb;
  --pf-card-bg: #ffffff;
  --pf-border: #d9d1c5;
  --pf-border-soft: #e5dfd6;
  --pf-page-width: 1330px;
  --pf-reading-width: 800px;
  --pf-article-card-width: calc(var(--pf-reading-width) + 110px);
  --pf-sidebar-width: 350px;
  --pf-radius: 10px;
  --pf-font-body: "Noto Sans JP", Arial, sans-serif;
  --pf-font-heading: "Crimson Text", Georgia, serif;
  --color-primary: var(--pf-accent) !important;
  --color-secondary: var(--pf-blue) !important;
  --color-grey: var(--pf-page-bg) !important;
  --color-light: #faf8f4 !important;
  --color-dark: var(--pf-heading) !important;
  --color-muted: var(--pf-muted) !important;
  --color-white: #ffffff !important;
  --primary-border-color: var(--pf-border) !important;
  --mutted-border-color: var(--pf-border-soft) !important;
}

/* ========================================================================== 
   02. GRUNDGESTALTUNG
   Allgemeine Regeln für Seite, Text, Links und Bilder.
   ========================================================================== */

* {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  background: var(--pf-card-bg);
  color: var(--pf-text);
  font-family: var(--pf-font-body);
}
body,
p {
  font-size: 15px;
  line-height: 1.75;
}
h1,
h2,
h3,
h4,
h5,
h6,
.font-heading,
.post-title {
  color: var(--pf-heading);
}
a:hover {
  color: #9c6d1e;
}
img {
  max-width: 100%;
  height: auto;
}

/* ========================================================================== 
   03. KOPFBEREICH UND SUCHE
   Obere Hinweisleiste, Logo, Slogan und Suchfeld.
   ========================================================================== */

.pf-topline {
  background: #2f465a;
  color: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  letter-spacing: 0.04em;
  padding: 8px 0;
}
.pf-toplinks {
  display: flex;
  gap: 24px;
}
.pf-toplinks a {
  color: #fff;
}
.pf-logo-wrap {
  display: inline-flex;
  align-items: center;
}
.pf-logo-wrap img.logo {
  display: block;
  width: 270px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  object-position: left center;
}

@media (max-width: 767px) {
  .pf-logo-wrap img.logo {
    width: 215px;
  }
}

.pf-header-actions {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 14px;
}
/* =======================================================
   Vertrauensleiste anstelle der Suche
   ======================================================= */

/* Persönlicher Hinweis rechts neben dem Logo */
.pf-header-signature {
  width: 390px;
  margin-left: auto;
  padding: 11px 0 11px 21px;
  border-left: 3px solid var(--pf-accent);
  text-align: left;
}

.pf-header-signature > span {
  display: block;
  margin-bottom: 3px;
  color: var(--pf-accent-dark);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.pf-header-signature strong {
  display: block;
  color: var(--pf-heading);
  font-family: var(--pf-font-heading);
  font-size: 19px;
  line-height: 1.25;
}

.pf-header-signature small {
  display: block;
  margin-top: 3px;
  color: var(--pf-muted);
  font-size: 11px;
  line-height: 1.5;
}

@media (max-width: 991px) {
  .pf-header-signature {
    display: none;
  }
}

/* ========================================================================== 
   04. HAUPTNAVIGATION UND UNTERMENÜS
   Horizontale Desktop-Navigation einschließlich ausklappbarer Menüs.
   ========================================================================== */

.pf-nav-wrap {
  background: #fff;
  border-top: 1px solid #ebe5dc;
  border-bottom: 1px solid #ded7cd;
  min-height: 56px;
}
.main-header .main-nav > nav > ul > li > a {
  color: #354654;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 20px 11px;
  font-size: 12px;
}
.main-header .main-nav ul li > a::after {
  background: #b88a38;
  height: 3px;
  bottom: -1px;
}
.main-header .main-nav ul li.current-menu-item > a {
  color: #9c6d1e;
}
.pf-header .main-nav ul ul.sub-menu {
  min-width: 270px !important;
  padding: 11px 0 13px !important;
  background: #fff !important;
  border: 2px solid #cec4b6 !important;
  border-top: 4px solid #b88a38 !important;
  border-radius: 0 0 9px 9px !important;
  box-shadow: 0 16px 38px rgba(28, 43, 54, 0.18) !important;
  transform: translateY(7px);
}
.pf-header .main-nav ul li:hover > ul.sub-menu {
  visibility: visible !important;
  opacity: 1 !important;
  background: #fff !important;
}
.pf-header .main-nav ul ul.sub-menu > li {
  margin: 0 11px;
  border-bottom: 1px solid #ece6de;
}
.pf-header .main-nav ul ul.sub-menu > li:last-child {
  border-bottom: 0;
}
.pf-header .main-nav ul ul.sub-menu > li > a {
  color: #43535e !important;
  font-size: 12px;
  line-height: 1.45;
  padding: 11px 10px;
  white-space: nowrap;
}
.pf-header .main-nav ul ul.sub-menu > li > a:hover {
  color: #9c6d1e !important;
  background: #f7f3ec;
  padding-left: 14px;
}

/* ==========================================================================
   05. MOBILE NAVIGATION
   Menüknopf und ausklappbare Unterseiten auf Tablet und Smartphone.
   Funktioniert vollständig ohne zusätzliches JavaScript.
   ========================================================================== */

/* Äußerer Menübereich */
.pf-mobile-menu {
  position: relative;
  display: inline-block;
}

/* Menüknopf */
.pf-mobile-menu > summary {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 43px;
  padding: 8px 12px;
  background: #fff;
  border: 1px solid #d8d0c5;
  border-radius: 7px;
  color: #2f465a;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  list-style: none;
  cursor: pointer;
  box-shadow: 0 4px 12px rgba(35, 49, 59, 0.06);
  transition:
    color 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}

.pf-mobile-menu > summary::-webkit-details-marker {
  display: none;
}

.pf-mobile-menu > summary::marker {
  content: "";
  display: none;
}

/* Hamburger-Symbol */
.pf-mobile-menu > summary span:first-child {
  font-size: 21px;
  line-height: 1;
}

/* Geöffneter Menüknopf */
.pf-mobile-menu[open] > summary {
  background: #f7f3ed;
  border-color: #b88a38;
  color: #9c6d1e;
}

/* Tastaturbedienung */
.pf-mobile-menu > summary:focus-visible,
.pf-mobile-submenu > summary:focus-visible,
.pf-mobile-menu nav a:focus-visible {
  outline: 2px solid #b88a38;
  outline-offset: 2px;
}

/* Ausklappbarer Navigationskasten */
.pf-mobile-menu nav {
  position: absolute;
  top: calc(100% + 11px);
  right: 0;
  z-index: 10000;
  width: min(360px, calc(100vw - 28px));
  max-height: 72vh;
  padding: 12px 14px 14px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  background: #fff;
  border: 1px solid #d6cec3;
  border-top: 4px solid #b88a38;
  border-radius: 0 0 9px 9px;
  box-shadow: 0 18px 45px rgba(28, 41, 50, 0.22);
  text-align: left;
}

/* Startseite und Hotelberichte */
.pf-mobile-menu nav > a {
  display: block;
  padding: 13px 10px;
  border-bottom: 1px solid #e9e3da;
  color: #2f465a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  transition:
    color 0.2s ease,
    background 0.2s ease,
    padding-left 0.2s ease;
}

.pf-mobile-menu nav > a:last-child {
  border-bottom: 0;
}

.pf-mobile-menu nav > a:hover {
  padding-left: 15px;
  background: #f7f3ed;
  color: #9c6d1e;
}

/* Einzelnes ausklappbares Untermenü */
.pf-mobile-submenu {
  margin: 0;
  border-bottom: 1px solid #e9e3da;
}

/* Überschrift des Untermenüs */
.pf-mobile-submenu > summary {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  width: 100%;
  padding: 13px 10px;
  color: #2f465a;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.4;
  list-style: none;
  cursor: pointer;
  transition:
    color 0.2s ease,
    background 0.2s ease;
}

.pf-mobile-submenu > summary::-webkit-details-marker {
  display: none;
}

.pf-mobile-submenu > summary::marker {
  content: "";
  display: none;
}

.pf-mobile-submenu > summary:hover {
  background: #f7f3ed;
  color: #9c6d1e;
}

/* Geöffnetes Untermenü */
.pf-mobile-submenu[open] > summary {
  background: #f7f3ed;
  color: #9c6d1e;
}

/* Runder Pfeil rechts */
.pf-mobile-arrow {
  display: grid;
  place-items: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background: #eee8dd;
  border-radius: 50%;
  color: #9c6d1e;
  font-size: 18px;
  line-height: 1;
  transition:
    transform 0.2s ease,
    background 0.2s ease,
    color 0.2s ease;
}

.pf-mobile-submenu[open] > summary .pf-mobile-arrow {
  background: #2f465a;
  color: #fff;
  transform: rotate(90deg);
}

/* Bereich mit den Unterseiten */
.pf-mobile-submenu-links {
  padding: 5px 0 8px;
  background: #faf8f4;
  border-top: 1px solid #eee8df;
}

/* Einzelne Unterseite */
.pf-mobile-menu nav .pf-mobile-submenu-links > a {
  position: relative;
  display: block;
  padding: 10px 12px 10px 29px;
  border-bottom: 0;
  color: #586976;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.45;
  text-decoration: none;
  transition:
    color 0.2s ease,
    background 0.2s ease,
    padding-left 0.2s ease;
}

/* Kleiner goldener Kreis vor den Unterseiten */
.pf-mobile-menu nav .pf-mobile-submenu-links > a::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 14px;
  width: 5px;
  height: 5px;
  border: 1px solid #b88a38;
  border-radius: 50%;
  transform: translateY(-50%);
}

/* Unterseite beim Darüberfahren */
.pf-mobile-menu nav .pf-mobile-submenu-links > a:hover {
  padding-left: 33px;
  background: #f3eee5;
  color: #9c6d1e;
}

/* Auf Tabletbreite wird nur Menüknopf, nicht der Header-Hinweis gezeigt */
@media (max-width: 1199.98px) {
  .pf-header-signature {
    display: none !important;
  }
}

/* Kleine Smartphones */
@media (max-width: 575px) {
  .pf-mobile-menu nav {
    right: -4px;
    width: calc(100vw - 24px);
    max-height: 70vh;
    padding: 10px 12px 12px;
  }

  .pf-mobile-menu nav > a,
  .pf-mobile-submenu > summary {
    padding-top: 12px;
    padding-bottom: 12px;
  }
}

/* ========================================================================== 
   06. STARTSEITE: TITELBEREICH
   Großes Aufmacherbild und zwei kleinere hervorgehobene Beiträge.
   ========================================================================== */

.pf-hero {
  border-bottom: 1px solid #e6dfd5;
}
.pf-lead-card {
  min-height: 520px;
  background: #2f465a;
}
.pf-lead-card > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.015);
}
.pf-image-shade {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(22, 33, 42, 0.88) 0%,
    rgba(27, 39, 49, 0.55) 48%,
    rgba(24, 34, 42, 0.1) 100%
  );
}
.pf-lead-copy {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 2;
  width: 78%;
  padding: 55px;
  color: white;
}
.pf-lead-copy h1 {
  color: white;
  font-family: "Crimson Text", serif;
  font-size: 49px;
  line-height: 1.03;
  font-weight: 700;
  margin: 14px 0 18px;
}
.pf-lead-copy p {
  color: rgba(255, 255, 255, 0.84);
  max-width: 610px;
  font-size: 16px;
}
.pf-kicker,
.pf-eyebrow {
  color: #a97926;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  font-weight: 900;
}
.pf-lead-copy .pf-kicker {
  display: inline-block;
  color: #fff;
  background: #b88a38;
  border-radius: 20px;
  padding: 6px 12px;
}
.pf-text-link {
  color: #9c6d1e;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.02em;
}
.pf-text-link.light {
  color: #fff;
}
.pf-feature-stack {
  display: grid;
  gap: 20px;
  height: 100%;
  grid-template-rows: repeat(2, 1fr);
}
.pf-mini-feature {
  display: grid;
  grid-template-columns: 44% 56%;
  overflow: hidden;
  border: 1px solid #e5ded5;
  box-shadow: 0 8px 24px rgba(40, 48, 54, 0.05);
}
.pf-mini-image {
  min-height: 220px;
  overflow: hidden;
}
.pf-mini-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.pf-mini-feature:hover img {
  transform: scale(1.04);
}
.pf-mini-copy {
  padding: 24px 22px;
  align-self: center;
}
.pf-mini-copy h2 {
  font-family: "Crimson Text", serif;
  font-size: 23px;
  line-height: 1.15;
  font-weight: 700;
  margin: 9px 0 17px;
}
.pf-mini-copy h2 a {
  color: #243542;
}

/* ========================================================================== 
   07. STARTSEITE: KARTEN UND BEITRAGSLISTEN
   Überschriften, Zielkarten und horizontale Beitragsvorschauen.
   ========================================================================== */

.pf-section-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 25px;
  margin-bottom: 33px;
  border-bottom: 1px solid #ded7cd;
  padding-bottom: 18px;
}
.pf-section-head.compact {
  margin-right: 0;
}
.pf-section-head h2 {
  font-family: "Crimson Text", serif;
  font-size: 39px;
  line-height: 1.1;
  font-weight: 700;
  margin: 5px 0 0;
}
.pf-section-head > a {
  color: #65717a;
  font-size: 13px;
  font-weight: 700;
  padding-bottom: 5px;
}
.pf-destination-card {
  height: 100%;
}
.pf-card-image {
  display: block;
  height: 235px;
}
.pf-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pf-card-body {
  padding: 22px 4px 0;
}
.pf-card-body h3 {
  font-family: "Crimson Text", serif;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.18;
  margin-bottom: 10px;
}
.pf-card-body p {
  color: #68757f;
  font-size: 14px;
  margin-bottom: 10px;
}

.pf-list-post {
  display: grid;
  grid-template-columns: 265px 1fr;
  overflow: hidden;
  border: 1px solid #e5ded5;
}
.pf-list-image {
  min-height: 220px;
  overflow: hidden;
}
.pf-list-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.pf-list-copy {
  padding: 28px 30px;
}
.pf-list-copy h3 {
  font-family: "Crimson Text", serif;
  font-size: 27px;
  line-height: 1.16;
  font-weight: 700;
  margin: 8px 0 10px;
}
.pf-list-copy h3 a {
  color: #243542;
}
.pf-list-copy p {
  color: #68757f;
  font-size: 14px;
}

/* ========================================================================== 
   08. SIDEBAR UND WIDGETS
   Einheitliche Karten, Autorenbox, Linklisten, Tippbox und Bild-Widgets.
   Die Sidebar-Breite wird oben über --pf-sidebar-width festgelegt.
   ========================================================================== */

.pf-sidebar .sidebar-widget {
  overflow: hidden;
  margin-bottom: 28px !important;
  padding: 26px;
  background: #fff;
  border: 1px solid var(--pf-border);
  border-radius: var(--pf-radius);
  box-shadow: 0 8px 24px rgba(39, 50, 59, 0.07);
}

.pf-sidebar h3 {
  margin: 0 0 12px;
  color: var(--pf-heading);
  font-family: var(--pf-font-heading);
  font-size: 26px;
  line-height: 1.15;
  font-weight: 700;
}

.pf-sidebar .sidebar-widget p {
  margin: 0 0 16px;
  color: var(--pf-muted);
  font-size: 13px;
  line-height: 1.7;
}

.pf-sidebar .widget-header-2 h3 {
  margin-bottom: 13px;
  padding-bottom: 13px;
  border-bottom: 1px solid var(--pf-border-soft);
}

.pf-author-avatar {
  display: grid;
  place-items: center;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #2f465a;
  color: #fff;
  font-family: "Crimson Text", serif;
  font-size: 34px;
  margin-bottom: 18px;
  box-shadow: 0 0 0 7px #eee8dd;
}

.pf-sidebar .widget_categories ul {
  margin: 0;
  padding: 0;
}

.pf-sidebar .widget_categories ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #eee8df;
  padding: 12px 0;
}
.pf-sidebar .widget_categories ul li:last-child {
  border: 0;
}
.pf-sidebar .widget_categories a {
  color: #40505b;
  font-size: 13px;
  line-height: 1.5;
}
.pf-sidebar .widget_categories a:hover {
  color: var(--pf-accent-dark);
}
.pf-sidebar .post-count {
  background: #eee8dd;
  color: #9c6d1e;
  min-width: 29px;
  height: 25px;
  display: grid;
  place-items: center;
  border-radius: 15px;
  font-size: 11px;
}
.pf-tip-box {
  background: #2f465a;
  color: rgba(255, 255, 255, 0.84);
  border: 0 !important;
}
.pf-tip-box h3 {
  color: #fff;
}
.pf-sidebar .pf-tip-box p {
  color: rgba(255, 255, 255, 0.84);
}
.pf-tip-box .pf-eyebrow {
  color: #d9b872;
}

/* Bild-Widget: Das Bild nutzt die komplette Kartenbreite. */
.pf-sidebar .pf-sidebar-feature {
  padding: 0;
}
.pf-sidebar-feature-image {
  display: block;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 16 / 10;
  background: #e9e5de;
}
.pf-sidebar-feature-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.pf-sidebar-feature:hover .pf-sidebar-feature-image img {
  transform: scale(1.035);
}
.pf-sidebar-feature-content {
  padding: 23px 25px 26px;
}
.pf-sidebar-feature-content .pf-eyebrow {
  display: block;
  margin-bottom: 8px;
}
.pf-sidebar .pf-sidebar-feature-content h3 {
  margin-bottom: 10px;
  font-size: 27px;
}
.pf-sidebar-feature-content .pf-text-link {
  display: inline-flex;
  margin-top: 2px;
  color: var(--pf-accent-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.pf-sidebar-feature-content .pf-text-link:hover {
  color: var(--pf-blue);
}
/* ========================================================================== 
   09. FOOTER UND EMPFEHLUNGEN
   Partnerkarten, Footer-Links, Copyright und Nach-oben-Button.
   ========================================================================== */

.pf-footer {
  background: #263b4d;
  color: rgba(255, 255, 255, 0.72);
}

.pf-recommendations {
  padding: 48px 0 42px;
  background: #203545;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

.pf-recommendation-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 35px;
  margin-bottom: 25px;
}

.pf-recommendation-head .pf-eyebrow {
  color: #d9b872;
}

.pf-recommendation-head h2 {
  margin: 5px 0 0;
  color: #fff;
  font-family: "Crimson Text", Georgia, serif;
  font-size: 34px;
  font-weight: 700;
}

.pf-footer .pf-recommendation-head p {
  max-width: 430px;
  color: rgba(255, 255, 255, 0.66);
  text-align: right;
}

.pf-recommendation-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
}

.pf-footer a.pf-recommendation-card {
  display: block;
  overflow: hidden;
  margin: 0;
  padding: 0;
  background: rgba(255, 255, 255, 0.055);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 8px;
  color: #fff;
  box-shadow: 0 8px 20px rgba(11, 24, 34, 0.13);
  transition:
    transform 0.2s ease,
    border-color 0.2s ease,
    background 0.2s ease;
}

.pf-footer a.pf-recommendation-card:hover {
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(217, 184, 114, 0.62);
  color: #fff;
}

/* Größere Bildfläche – zeigt mehr vom Motiv */
.pf-recommendation-image {
  display: block;
  height: 135px;
  overflow: hidden;
  background: #172a38;
}

.pf-recommendation-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.3s ease;
}

/* Nur noch sehr leichte Vergrößerung beim Überfahren */
.pf-recommendation-card:hover .pf-recommendation-image img {
  transform: scale(1.02);
}

.pf-recommendation-copy {
  display: block;
  min-height: 106px;
  padding: 16px 15px 17px;
}

.pf-recommendation-copy strong {
  display: block;
  margin-bottom: 7px;
  color: #fff;
  font-family: "Crimson Text", Georgia, serif;
  font-size: 20px;
  line-height: 1.1;
}

.pf-recommendation-copy > span {
  display: block;
  color: rgba(255, 255, 255, 0.72);
  font-size: 11px;
  line-height: 1.55;
}

.pf-recommendation-copy b {
  color: #d9b872;
  font-weight: 700;
}

.pf-footer p.pf-affiliate-note {
  max-width: none;
  margin-top: 17px;
  color: rgba(255, 255, 255, 0.48);
  font-size: 10px;
}

.pf-footer a.pf-back-to-top {
  position: fixed;
  right: 20px;
  bottom: 22px;
  z-index: 9999;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.48);
  border-radius: 50%;
  background: #b88a38;
  color: #fff;
  font-size: 22px;
  line-height: 1;
  box-shadow: 0 8px 24px rgba(25, 38, 47, 0.25);
  opacity: 0;
  visibility: hidden;
  transform: translateY(12px);
  transition:
    opacity 0.2s ease,
    visibility 0.2s ease,
    transform 0.2s ease,
    background 0.2s ease;
}

.pf-footer a.pf-back-to-top.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.pf-footer a.pf-back-to-top:hover {
  transform: translateY(-3px);
  background: #2f465a;
  color: #fff;
}

.pf-footer-main {
  padding-top: 68px;
  padding-bottom: 58px;
}

/* ==========================================================================
   UNTERER FOOTER OHNE ZWEITES LOGO
   ========================================================================== */

.pf-footer .pf-footer-navigation {
  display: flex;
  justify-content: center;
  padding: 28px 0 22px;
}

.pf-footer .pf-footer-navigation nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 10px 30px;
}

.pf-footer .pf-footer-navigation a,
.pf-footer .pf-footer-navigation .pf-cookie-settings {
  margin: 0;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: rgba(255, 255, 255, 0.82);
  font-family: inherit;
  font-size: 13px;
  line-height: 1.4;
  text-decoration: none;
  cursor: pointer;
}

.pf-footer .pf-footer-navigation a:hover,
.pf-footer .pf-footer-navigation .pf-cookie-settings:hover {
  color: #d9b872;
}

.pf-footer .pf-copyright {
  padding: 17px 0;
  text-align: center;
}

@media (max-width: 575px) {
  .pf-footer .pf-footer-navigation {
    padding: 23px 0 18px;
  }

  .pf-footer .pf-footer-navigation nav {
    gap: 7px 18px;
  }

  .pf-footer .pf-footer-navigation a,
  .pf-footer .pf-footer-navigation .pf-cookie-settings {
    font-size: 12px;
  }
}
}

.pf-footer p {
  max-width: 470px;
  margin: 0;
  font-size: 13px;
}

.pf-footer a {
  margin-left: 28px;
  color: #fff;
  font-size: 13px;
}

.pf-copyright {
  padding: 18px 0;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 12px;
}

/* Datenschutzeinstellungen im Footer */
.pf-footer .pf-cookie-settings {
  display: inline-block;
  margin: 0 0 0 28px;
  padding: 5px 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-family: inherit;
  font-size: 13px;
  line-height: inherit;
  cursor: pointer;
}

.pf-footer .pf-cookie-settings:hover {
  color: #d9b872;
}

/* Darstellung auf Smartphones */
@media (max-width: 767px) {
  .pf-footer .pf-cookie-settings {
    margin: 0 20px 0 0;
  }
}

/* ==========================================================================
   10. ARTIKEL: GRUNDAUFBAU
   Breadcrumb, 800-Pixel-Lesebereich, Artikelkarte und rechte Sidebar.
   ========================================================================== */

/* Äußerer Bereich des Breadcrumbs */
.pf-breadcrumb-shell.container {
  max-width: var(--pf-page-width);
  padding-top: 18px;
  padding-bottom: 0;
}

/* ==========================================================================
   BREADCRUMB
   Einheitlich ohne Kasten auf Desktop und Mobilgeräten.
   ========================================================================== */

.pf-breadcrumb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 7px;
  width: 100%;
  margin: 0;
  padding: 20px 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #7d878e;
  font-size: 12px;
  line-height: 1.5;
}

.pf-breadcrumb a {
  color: #4f6574;
  font-weight: 600;
  text-decoration: none;
}

.pf-breadcrumb a:hover {
  color: var(--pf-accent-dark, #9c6d1e);
}

.pf-breadcrumb > span[aria-hidden="true"] {
  color: var(--pf-accent, #b88a38);
}

.pf-breadcrumb > span[aria-current="page"] {
  color: #7d878e;
  font-weight: 400;
}

/* Auf Smartphones etwas kompakter */
@media (max-width: 767px) {
  .pf-breadcrumb {
    gap: 6px;
    padding: 14px 0 !important;
    font-size: 11px;
  }
}

/* Artikel beginnt näher unter dem Breadcrumb */
.pf-article-shell.container {
  max-width: var(--pf-page-width);
  padding-top: 22px;
  padding-bottom: 70px;
}

.pf-article-layout {
  display: grid;
  grid-template-columns:
    minmax(0, var(--pf-article-card-width))
    minmax(260px, var(--pf-sidebar-width));
  gap: 30px;
  align-items: start;
  justify-content: center;
}

.pf-article-main,
.pf-article-sidebar {
  min-width: 0;
}

.pf-article-card {
  padding: 50px 54px;
  background: #fff;
  border: 1px solid #e4ddd3;
  border-radius: 10px;
}

@media (max-width: 767px) {
  .pf-breadcrumb-shell.container {
    padding-top: 12px;
  }

  .pf-breadcrumb {
    padding: 8px 11px;
    font-size: 10px;
  }

  .pf-article-shell.container {
    padding-top: 15px;
  }
}

/* ========================================================================== 
   11. ARTIKEL: KOPFBEREICH, METADATEN UND BILDER
   Kategorie, H1, Autor/Datum/Bildquelle, Titelbild und Bildunterschriften.
   ========================================================================== */

.pf-article-header .pf-eyebrow {
  display: block;
  margin-bottom: 13px;
}
.pf-article-header h1 {
  font-family: "Crimson Text", Georgia, serif;
  font-size: 56px;
  line-height: 1.04;
  font-weight: 700;
  letter-spacing: -0.025em;
  margin-bottom: 22px;
}
/* ==========================================================================
   ARTIKELINFORMATIONEN
   Schlichte redaktionelle Zeile ohne Hintergrund und Rahmen.
   ========================================================================== */

.pf-article-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px 0;
  margin: 21px 0 30px;
  padding: 0 0 16px;
  background: transparent;
  border: 0;
  border-bottom: 1px solid #e4ddd3;
}

.pf-article-meta > span {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 24px;
  margin: 0;
  padding: 0 20px;
  border: 0;
  color: #6a7881;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none !important;
}

.pf-article-meta > span:first-child {
  padding-left: 0;
}

/* Feine Trennlinie zwischen den Angaben */
.pf-article-meta > span + span {
  border-left: 1px solid #ddd5ca;
}

/* Icons ohne Kreis und Hintergrund */
.pf-article-meta i {
  display: inline-block;
  margin: 0;
  padding: 0;
  background: transparent;
  color: #b18432;
  font-size: 14px;
  line-height: 1;
}

/* Name und Datum etwas kräftiger */
.pf-article-meta strong,
.pf-article-meta time {
  color: #40525f;
  font-weight: 600;
}

/* Smartphone */
@media (max-width: 767px) {
  .pf-article-meta {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
    margin: 18px 0 25px;
    padding-bottom: 14px;
  }

  .pf-article-meta > span {
    width: 100%;
    min-height: 22px;
    padding: 0;
    border-left: 0 !important;
  }
}
}
.pf-hero-figure {
  margin: 0 0 35px;
}
.pf-hero-figure img,
.pf-entry-content figure img {
  width: 100%;
  border-radius: 8px;
}
.pf-hero-figure figcaption,
.pf-entry-content figcaption {
  margin-top: 10px;
  padding: 0 18px;
  color: #747f86;
  font-family: "Noto Sans JP", Arial, sans-serif;
  font-size: 12px;
  line-height: 1.55;
  text-align: center;
}

/* ========================================================================== 
   12. ARTIKEL: TEXT UND ÜBERSCHRIFTEN
   Fließtext, Einleitung, H2/H3 und normale Abstände der Artikelbilder.
   ========================================================================== */

.pf-entry-content {
  font-family: "Noto Sans JP", Arial, sans-serif;
  color: #27323a;
  font-size: 16px;
  line-height: 1.75;
}

.pf-entry-content > p {
  font: inherit;
}

.pf-entry-content .lead {
  font-size: 18px;
  line-height: 1.72;
  color: #30424e;
}

.pf-entry-content h2 {
  scroll-margin-top: 85px;
  margin: 50px 0 18px;
  padding-top: 7px;
  font-family: "Crimson Text", Georgia, serif;
  font-size: 37px;
  line-height: 1.12;
  font-weight: 400;
  letter-spacing: -0.02em;
}

.pf-entry-content h2::before {
  content: "";
  display: block;
  width: 44px;
  height: 3px;
  margin-bottom: 17px;
  background: linear-gradient(
    90deg,
    #2f465a 0 31px,
    #c99a38 31px 44px
  );
}

.pf-entry-content h3 {
  font-family: "Crimson Text", Georgia, serif;
  font-size: 24px;
  line-height: 1.2;
  font-weight: 700;
}

.pf-entry-content figure {
  margin: 30px 0;
}

@media (max-width: 767px) {
  .pf-entry-content {
    font-size: 16px;
    line-height: 1.7;
  }

  .pf-entry-content .lead {
    font-size: 17px;
    line-height: 1.65;
  }

  .pf-entry-content h2 {
    margin-top: 40px;
    font-size: 31px;
    line-height: 1.15;
  }

  .pf-entry-content h3 {
    font-size: 22px;
  }
}

/* ========================================================================== 
   13. ARTIKEL: FAKTEN, LISTEN UND INFOBOXEN
   Faktenbox, Checklisten, nummerierte Listen, Info- und Hinweisboxen.
   ========================================================================== */

.pf-facts,
.pf-info-box,
.pf-highlight,
.pf-weight-box {
  margin: 32px 0;
  padding: 30px 34px;
}
.pf-facts {
  background: #2f465a;
  color: #fff;
}
.pf-facts h2 {
  color: #fff;
  margin: 0 0 20px;
  padding: 0;
}
.pf-facts h2::before,
.pf-article-toc h2::before,
.pf-gold-price-box h2::before {
  display: none;
}
.pf-facts ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 30px;
}
.pf-facts li {
  position: relative;
  padding: 10px 0 10px 21px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  font-family: "Noto Sans JP", sans-serif;
  font-size: 13px;
}
.pf-facts li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #e2c27c;
  font-weight: 900;
}
.pf-facts strong {
  color: #e2c27c;
}
/* ==========================================================================
   ARTIKELLISTEN
   UL mit Hakenkreisen und OL mit automatisch nummerierten Kreisen.
   ========================================================================== */

.pf-entry-content ul.pf-list,
.pf-entry-content ol.pf-list {
  display: block;
  margin: 25px 0 38px !important;
  padding: 0;
  list-style: none !important;
  background: transparent;
  border: 0;
  border-radius: 0;
}

/* Einzelne Listeneinträge */
.pf-entry-content .pf-list li {
  position: relative;
  margin: 0;
  padding: 13px 10px 13px 40px;
  border-bottom: 1px solid #e8e3db;
}

/* Obere Linie beim ersten Listeneintrag */
.pf-entry-content .pf-list li:first-child {
  border-top: 1px solid #e8e3db;
}

/* Browser-eigene Nummerierung der OL entfernen */
.pf-entry-content ol.pf-list > li {
  list-style: none !important;
}

.pf-entry-content ol.pf-list > li::marker {
  content: "";
  font-size: 0;
}

/* Hakenkreise der UL-Liste */
.pf-entry-content ul.pf-list li::before {
  content: "✓";
  position: absolute;
  left: 8px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #607d79;
  color: #fff;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  transform: translateY(-50%);
}

/* Automatische Nummerierung der OL-Liste */
.pf-entry-content ol.pf-list {
  counter-reset: gold-tip;
}

.pf-entry-content ol.pf-list li {
  counter-increment: gold-tip;
}

.pf-entry-content ol.pf-list li::before {
  content: counter(gold-tip);
  position: absolute;
  left: 8px;
  top: 50%;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #2f465a;
  color: #fff;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  transform: translateY(-50%);
}

/* Links innerhalb der Listen */
.pf-entry-content ul.pf-list li a,
.pf-entry-content ol.pf-list li a {
  color: #30465a;
  font-weight: 700;
  text-decoration: none;
}

.pf-entry-content ul.pf-list li a:hover,
.pf-entry-content ol.pf-list li a:hover {
  color: #9c6d1e;
}
.pf-info-box {
  background: #f7f2e8;
  border: 0;
  border-left: 4px solid #bd9137;
  color: #263846;
  border-radius: 0;
}
.pf-info-box::before,
.pf-highlight::before {
  display: none;
}
.pf-info-box h3,
.pf-highlight h3 {
  margin: 0 0 10px;
  font-family: "Crimson Text", Georgia, serif;
  font-size: 23px;
  font-weight: 700;
  color: #30465a;
}
.pf-highlight {
  background: #edf2f5;
  border: 0;
  border-left: 4px solid #30465a;
  border-radius: 0;
}
.pf-info-box p,
.pf-highlight p {
  margin: 0;
  font: inherit;
}
.pf-weight-box {
  background: #f4f1eb;
}
.pf-weight-box h3 {
  margin: 0 0 18px;
}
.pf-weight-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 9px;
}
.pf-weight-item {
  background: #fff;
  border: 1px solid #dfd8ce;
  border-radius: 6px;
  padding: 15px 8px;
  text-align: center;
}
.pf-weight-item span,
.pf-weight-item strong {
  display: block;
}
.pf-weight-item span {
  color: #9c6d1e;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 11px;
  font-weight: 900;
}
.pf-weight-item strong {
  color: #2f465a;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 12px;
  margin-top: 5px;
}

/* =======================================================
   Listen und Links innerhalb der Info-Box
   ======================================================= */

.pf-entry-content .pf-info-box ul {
  margin: 18px 0 20px;
  padding: 0;
  list-style: none !important;
}

.pf-entry-content .pf-info-box ul li {
  position: relative;
  margin: 0;
  padding: 10px 8px 10px 32px;
  border-bottom: 1px solid rgba(47, 70, 90, 0.13);
  list-style: none !important;
}

.pf-entry-content .pf-info-box ul li:first-child {
  border-top: 1px solid rgba(47, 70, 90, 0.13);
}

.pf-entry-content .pf-info-box ul li::marker {
  content: "";
}

.pf-entry-content .pf-info-box ul li::before {
  content: "✓" !important;
  position: absolute;
  top: 11px;
  left: 2px;
  display: grid !important;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--pf-blue);
  color: #fff;
  font-size: 10px;
  line-height: 1;
  font-weight: 900;
}

.pf-entry-content .pf-info-box ul li a {
  color: var(--pf-blue) !important;
  font-weight: 700;
  text-decoration: none !important;
}

.pf-entry-content .pf-info-box ul li a:hover {
  color: var(--pf-accent-dark) !important;
}

.pf-entry-content .pf-info-box ul + p {
  margin-top: 18px;
}

/* ========================================================================== 
   14. RELATED POSTS
   Drei thematisch passende Beitragskarten am Artikelende.
   ========================================================================== */

.pf-related-posts {
  margin-top: 54px;
  padding-top: 32px;
  border-top: 1px solid #ded7cd;
}
.pf-entry-content .pf-related-posts > h2 {
  margin: 3px 0 23px;
  padding: 0;
  font-size: 32px;
  font-weight: 700;
}
.pf-entry-content .pf-related-posts > h2::before {
  display: none;
}
.pf-related-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.pf-related-card {
  overflow: hidden;
  background: #fff;
  border: 1px solid #e1dad0;
  border-radius: 8px;
  box-shadow: 0 7px 18px rgba(39, 50, 59, 0.055);
}
.pf-related-image {
  display: block;
  height: 135px;
  overflow: hidden;
}
.pf-related-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0 !important;
  transition: transform 0.3s ease;
}
.pf-related-card:hover .pf-related-image img {
  transform: scale(1.035);
}
.pf-related-copy {
  padding: 17px 17px 19px;
}
.pf-related-copy > span {
  display: block;
  margin-bottom: 7px;
  color: #a97926;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.pf-entry-content .pf-related-copy h3 {
  margin: 0 0 9px;
  font-size: 20px;
  line-height: 1.16;
}
.pf-related-copy h3 a {
  color: #293b49;
}
.pf-related-copy h3 a:hover {
  color: #9c6d1e;
}
.pf-entry-content .pf-related-copy p {
  margin: 0;
  color: #68757f;
  font-size: 11px;
  line-height: 1.6;
}
.pf-article-side {
  position: sticky;
  top: 20px;
}

/* ========================================================================== 
   15. INHALTSVERZEICHNIS
   Zweispaltige Sprungnavigation mit automatisch nummerierten Kreisen.
   Nur auf längeren Artikeln verwenden.
   ========================================================================== */

.pf-article-toc {
  position: relative;
  overflow: hidden;
  margin: 36px 0 42px;
  padding: 31px 31px 27px;
  background: #f7f4ee;
  border: 1px solid #ddd5ca;
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(39, 50, 59, 0.06);
}
.pf-article-toc::before {
  content: "";
  position: absolute;
  top: 0;
  left: 31px;
  width: 58px;
  height: 3px;
  background: linear-gradient(90deg, #2f465a 0 42px, #c99a38 42px 58px);
}
.pf-article-toc .pf-eyebrow {
  display: block;
  margin-bottom: 5px;
}
.pf-article-toc h2 {
  margin: 0 0 19px;
  padding: 0;
  font-size: 29px;
  font-weight: 700;
  letter-spacing: -0.01em;
}
.pf-article-toc ol {
  margin: 0;
  padding: 0;
  list-style: none !important;
  counter-reset: toc-item;
  columns: 2;
  column-gap: 38px;
}
.pf-article-toc li {
  display: flex;
  align-items: center;
  gap: 11px;
  counter-increment: toc-item;
  break-inside: avoid;
  min-height: 49px;
  padding: 9px 0;
  border-bottom: 1px solid #e2dcd2;
}
.pf-article-toc li::marker {
  content: "";
}
.pf-article-toc li::before {
  content: counter(toc-item, decimal-leading-zero);
  position: static;
  display: grid;
  place-items: center;
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  border: 1px solid #d3b36d;
  border-radius: 50%;
  background: #fff;
  color: #9b6e21;
  font-size: 9px;
  font-weight: 900;
  line-height: 1;
}

.pf-article-toc a {
  display: block;
  color: #415460;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
}

.pf-article-toc a:hover {
  color: #9c6d1e;
}

/* ========================================================================== 
   16. BESONDERE GOLDPREIS-BOX
   Exklusive Call-to-Action-Box für den Artikel „Gold in Thailand“.
   ========================================================================== */

.pf-gold-price-box {
  scroll-margin-top: 85px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  margin: 48px 0 42px;
  padding: 28px 34px;
  background: linear-gradient(105deg, #24394a 0%, #536c82 100%);
  border-top: 2px solid #c79a3c;
  box-shadow: 0 10px 25px rgba(35, 50, 62, 0.16);
}
.pf-gold-price-copy > span {
  display: block;
  margin-bottom: 5px;
  color: #efc968;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}
.pf-gold-price-box h2 {
  color: #fff;
  margin: 0 0 3px;
  padding: 0;
  font-size: 29px;
  font-weight: 400;
  letter-spacing: -0.01em;
}
.pf-gold-price-box p {
  margin: 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 12px;
  line-height: 1.55;
}
.pf-gold-price-box > a {
  flex: 0 0 auto;
  display: inline-block;
  padding: 13px 18px;
  background: #d1aa4c;
  color: #172b3a;
  font-size: 10px;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.pf-gold-price-box > a:hover {
  background: #e0bc65;
  color: #172b3a;
}

/* ========================================================================== 
   17. WIEDERVERWENDBARE KOMPONENTEN UND STYLE GUIDE
   H4–H6, Zitate, Warnbox, Tabelle, Buttons, airport-box, CTA und FAQ.
   ========================================================================== */

.pf-entry-content h4,
.pf-entry-content h5,
.pf-entry-content h6 {
  font-family: var(--pf-font-heading);
  color: var(--pf-heading);
  font-weight: 700;
}
.pf-entry-content h4 {
  margin: 32px 0 12px;
  font-size: 22px;
}
.pf-entry-content h5 {
  margin: 26px 0 10px;
  font-size: 19px;
}
.pf-entry-content h6 {
  margin: 22px 0 8px;
  font-size: 16px;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}
/* =======================================================
   Links im Artikeltext
   ======================================================= */

.pf-entry-content p a:not(.pf-button):not(.cta-btn) {
  color: var(--pf-accent-dark);
  font-weight: 700;
  text-decoration: none;
  transition: color 0.2s ease;
}

.pf-entry-content p a:not(.pf-button):not(.cta-btn):hover {
  color: var(--pf-blue);
  text-decoration: none;
}


/* =======================================================
   Links innerhalb der Artikellisten
   ======================================================= */

.pf-entry-content ul.pf-list li a,
.pf-entry-content ol.pf-list li a {
  color: var(--pf-blue);
  font-weight: 700;
  text-decoration: none;
  transition: color 0.2s ease;
}

.pf-entry-content ul.pf-list li a:hover,
.pf-entry-content ol.pf-list li a:hover {
  color: var(--pf-accent-dark);
  text-decoration: none;
}


/* Tastaturbedienung */
.pf-entry-content a:focus-visible {
  outline: 2px solid var(--pf-accent);
  outline-offset: 3px;
  border-radius: 2px;
}
.pf-entry-content blockquote {
  margin: 32px 0;
  padding: 25px 30px;
  border-left: 4px solid var(--pf-blue);
  background: #eef2f4;
  color: #344955;
  font-family: var(--pf-font-heading);
  font-size: 23px;
  line-height: 1.45;
}
.pf-entry-content blockquote cite {
  display: block;
  margin-top: 12px;
  color: var(--pf-muted);
  font-family: var(--pf-font-body);
  font-size: 12px;
  font-style: normal;
}
.pf-warning-box {
  margin: 32px 0;
  padding: 28px 32px;
  border: 1px solid #dfc4bd;
  border-left: 4px solid #a95c4b;
  background: #fbf3f1;
  color: #4a3430;
}
.pf-warning-box h3 {
  margin: 0 0 10px;
  color: #824537;
}
.pf-warning-box p {
  margin: 0;
}
.pf-table-wrap {
  margin: 30px 0;
  overflow-x: auto;
  border: 1px solid var(--pf-border);
  border-radius: 8px;
}
.pf-table {
  width: 100%;
  margin: 0;
  border-collapse: collapse;
  background: #fff;
  font-size: 13px;
}
.pf-table th {
  padding: 14px 16px;
  background: var(--pf-blue);
  color: #fff;
  text-align: left;
}
.pf-table td {
  padding: 13px 16px;
  border-bottom: 1px solid var(--pf-border-soft);
}
.pf-table tr:last-child td {
  border-bottom: 0;
}
.pf-table tbody tr:nth-child(even) {
  background: #f8f6f1;
}
.pf-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 24px 0 34px;
}
.pf-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 11px 19px;
  border: 1px solid var(--pf-blue);
  border-radius: 5px;
  background: var(--pf-blue);
  color: #fff !important;
  font-size: 12px;
  font-weight: 800;
  text-decoration: none !important;
}
.pf-button:hover {
  border-color: var(--pf-accent);
  background: var(--pf-accent);
  color: #fff;
}
.pf-button.secondary {
  border-color: var(--pf-accent);
  background: var(--pf-accent);
}
.pf-button.outline {
  background: transparent;
  color: var(--pf-blue) !important;
}
.airport-box {
  margin: 32px 0;
  padding: 30px 34px;
  border: 1px solid var(--pf-border);
  border-top: 3px solid var(--pf-accent);
  background: #fff;
  box-shadow: 0 8px 22px rgba(39, 50, 59, 0.06);
}
.airport-box h2 {
  margin: 0 0 18px;
  padding: 0;
}
.airport-box h2::before {
  display: none;
}
.airport-facts {
  margin: 0;
  padding: 0;
  list-style: none;
}
.airport-facts li {
  display: flex;
  gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--pf-border-soft);
}
.airport-facts li:last-child {
  border-bottom: 0;
}
/* Links in der Faktenbox */
.airport-facts .item-content > a {
  display: inline-flex;
  align-items: center;
  padding: 6px 11px;
  border-radius: 5px;
  background: #ead49c;
  color: #172b3a !important;
  font-weight: 800;
  line-height: 1.4;
  text-decoration: none;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.airport-facts .item-content > a:hover,
.airport-facts .item-content > a:focus-visible {
  background: #d1aa4c;
  color: #172b3a !important;
  text-decoration: none;
}

.airport-facts .item-content > a:focus-visible {
  outline: 3px solid rgba(47, 70, 90, 0.3);
  outline-offset: 2px;
}
.airport-facts .label {
  display: inline-block;
  min-width: 145px;
  color: var(--pf-blue);
  font-weight: 800;
}

.airport-box .airport-facts li .item-content {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  align-items: start;
  gap: 18px;
}

.airport-box .airport-facts .label {
  display: block;
  min-width: 0;
}

@media (max-width: 767px) {
  .airport-box .airport-facts li .item-content {
    grid-template-columns: 1fr;
    gap: 5px;
  }
}

/* =======================================================
highlight-box.booking-cta
   ======================================================= */

.highlight-box.booking-cta {
  margin: 34px 0;
  padding: 30px 34px;
  background: linear-gradient(105deg, #24394a, #536c82);
  color: #fff;
}
.highlight-box.booking-cta h2 {
  margin: 0 0 10px;
  padding: 0;
  color: #fff;
}
.highlight-box.booking-cta h2::before {
  display: none;
}
.highlight-box.booking-cta p {
  color: rgba(255, 255, 255, 0.84);
}
.cta-btn.primary {
  display: inline-flex;
  padding: 12px 18px;
  background: #d1aa4c;
  color: #172b3a !important;
  font-size: 11px;
  font-weight: 900;
  text-transform: uppercase;
  text-decoration: none !important;
}

/* Kleiner Affiliate-Hinweis unter dem CTA-Button */
.highlight-box.booking-cta .cta-note {
  display: block;
  margin: 16px 0 0 !important;
  padding-top: 11px;
  border-top: 1px solid rgba(255, 255, 255, 0.16);
  color: rgba(255, 255, 255, 0.58) !important;
  font-size: 9px;
  line-height: 1.5;
  letter-spacing: 0.01em;
}
/* =======================================================
   Mietwagen: Versicherungsbox
   Ergänzung zur vorhandenen .highlight-box.booking-cta
   ======================================================= */

.pf-entry-content .highlight-box.booking-cta {
  border-top: 3px solid var(--pf-accent);
  border-radius: 0;
  box-shadow: 0 10px 26px rgba(35, 50, 62, 0.16);
}

.pf-entry-content .highlight-box.booking-cta h3 {
  margin: 0 0 14px;
  color: #fff;
  font-family: var(--pf-font-heading);
  font-size: 27px;
  line-height: 1.2;
  font-weight: 700;
}

.pf-entry-content .highlight-box.booking-cta .cta-text {
  margin: 0 0 18px;
}

.pf-entry-content .highlight-box.booking-cta .cta-benefits {
  margin: 18px 0 20px;
  padding: 0;
  list-style: none !important;
}

.pf-entry-content .highlight-box.booking-cta .cta-benefits li {
  position: relative;
  margin: 0;
  padding: 10px 0 10px 31px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.92);
  list-style: none !important;
}

.pf-entry-content .highlight-box.booking-cta .cta-benefits li::before {
  content: "✓";
  position: absolute;
  top: 10px;
  left: 0;
  display: grid;
  place-items: center;
  width: 19px;
  height: 19px;
  border-radius: 50%;
  background: #d1aa4c;
  color: #203545;
  font-size: 11px;
  font-weight: 900;
}

.pf-entry-content .highlight-box.booking-cta .cta-links {
  margin: 19px 0;
}

.pf-entry-content .highlight-box.booking-cta .cta-links a {
  color: #efc968;
  font-weight: 800;
  text-decoration: none;
}

.pf-entry-content .highlight-box.booking-cta .cta-links a:hover {
  color: #fff;
}

.pf-entry-content .highlight-box.booking-cta .cta-buttons {
  margin: 22px 0;
}

/* Drei kompakte Vorteile nebeneinander */

.pf-entry-content .highlight-box.booking-cta .cta-trust-icons {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 0 !important;
  overflow: hidden;
  margin: 22px 0 !important;
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 7px;
}

.pf-entry-content .highlight-box.booking-cta .cta-trust-icons span {
  position: relative;
  display: flex !important;
  align-items: center;
  gap: 10px;
  min-width: 0;
  min-height: 72px;
  padding: 13px 14px !important;
  background: transparent !important;
  border: 0 !important;
  border-right: 1px solid rgba(255, 255, 255, 0.16) !important;
  color: rgba(255, 255, 255, 0.92);
  font-size: 10px;
  line-height: 1.45;
}

.pf-entry-content .highlight-box.booking-cta
.cta-trust-icons span:last-child {
  border-right: 0 !important;
}

.pf-entry-content .highlight-box.booking-cta
.cta-trust-icons span::before {
  content: "✓" !important;
  position: static !important;
  display: grid !important;
  place-items: center;
  flex: 0 0 25px;
  width: 25px;
  height: 25px;
  margin: 0;
  border-radius: 50%;
  background: #d1aa4c;
  color: #203545;
  font-size: 12px;
  font-weight: 900;
}

.pf-entry-content .highlight-box.booking-cta
.cta-trust-icons i {
  display: none !important;
}

@media (max-width: 600px) {
  .pf-entry-content .highlight-box.booking-cta .cta-trust-icons {
    grid-template-columns: 1fr !important;
  }

  .pf-entry-content .highlight-box.booking-cta
  .cta-trust-icons span {
    min-height: 58px;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.16) !important;
  }

  .pf-entry-content .highlight-box.booking-cta
  .cta-trust-icons span:last-child {
    border-bottom: 0 !important;
  }
}

/* =======================================================
   faq
   ======================================================= */

.faq-accordion {
  margin: 30px 0;
  border-top: 1px solid var(--pf-border);
}
.faq-item {
  border-bottom: 1px solid var(--pf-border);
}
.faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  width: 100%;
  padding: 18px 0;
  border: 0;
  background: transparent;
  color: var(--pf-heading);
  font-family: var(--pf-font-heading);
  font-size: 21px;
  font-weight: 700;
  text-align: left;
  cursor: pointer;
}

.faq-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  padding: 0;
  border-radius: 50%;
  background: #eee8dd;
  color: var(--pf-accent-dark);
  font-family: Arial, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 1;
}

.faq-question[aria-expanded="true"] .faq-icon {
  background: var(--pf-blue);
  color: #fff;
  transform: rotate(45deg);
}

.faq-answer {
  display: none;
  padding: 0 44px 18px 0;
}
.faq-answer.is-open {
  display: block;
}
.faq-answer p {
  margin: 0;
}
.faq-item:last-child {
  border-bottom: 0;
}


.pf-style-section {
  padding: 34px 0 8px;
  border-bottom: 1px solid var(--pf-border-soft);
}
.pf-style-section:last-child {
  border-bottom: 0;
}
.pf-component-label {
  display: inline-block;
  margin-bottom: 12px;
  padding: 4px 9px;
  border-radius: 4px;
  background: #eee8dd;
  color: var(--pf-accent-dark);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}
.pf-color-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
  margin: 24px 0;
}
.pf-color-swatch {
  overflow: hidden;
  border: 1px solid var(--pf-border);
  border-radius: 7px;
  background: #fff;
}
.pf-color-swatch i {
  display: block;
  height: 72px;
}
.pf-color-swatch span {
  display: block;
  padding: 10px;
  color: var(--pf-muted);
  font-size: 10px;
}
.pf-image-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin: 30px 0;
}
.pf-image-grid figure {
  margin: 0;
}

/* ========================================================================== 
   18. RESPONSIVE ANPASSUNGEN
   1199 px: Sidebar unter dem Artikel
    991 px: Tablet-Layout
    767 px: Smartphone-Layout
    575 px: Kleine Smartphones
   ========================================================================== */

@media (max-width: 1199px) {
  .pf-recommendation-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .pf-article-layout {
    grid-template-columns: minmax(0, var(--pf-article-card-width));
  }
  .pf-article-main,
  .pf-article-sidebar {
    width: min(100%, var(--pf-article-card-width));
    margin-inline: auto;
  }
  .pf-article-side {
    position: static;
  }
}

/* Auf Tablets werden die Sidebar-Widgets zweispaltig unter dem Artikel gezeigt. */
@media (min-width: 768px) and (max-width: 1199px) {
  .pf-article-side {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: start;
  }
  .pf-sidebar .sidebar-widget {
    margin-bottom: 0 !important;
  }
}

@media (max-width: 991px) {
  .pf-recommendation-head {
    display: block;
  }
  .pf-footer .pf-recommendation-head p {
    margin-top: 10px;
    text-align: left;
  }
  .pf-recommendation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .pf-lead-card {
    min-height: 480px;
  }
  .pf-feature-stack {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: auto;
  }
  .pf-mini-feature {
    display: block;
  }
  .pf-mini-image {
    display: block;
    min-height: 190px;
    height: 190px;
  }
}

@media (max-width: 767px) {
  .pf-toplinks {
    display: none;
  }
  .pf-topline .container {
    justify-content: center !important;
  }
  .pf-logo-wrap img.logo {
    width: 190px;
  }
  .pf-recommendations {
    padding: 38px 0 34px;
  }
  .pf-recommendation-head h2 {
    font-size: 29px;
  }
  .pf-lead-card {
    min-height: 470px;
  }
  .pf-image-shade {
    background: linear-gradient(
      0deg,
      rgba(22, 33, 42, 0.92) 0%,
      rgba(27, 39, 49, 0.3) 82%
    );
  }
  .pf-lead-copy {
    width: 100%;
    padding: 30px;
  }
  .pf-lead-copy h1 {
    font-size: 36px;
  }
  .pf-feature-stack {
    display: block;
  }
  .pf-mini-feature {
    margin-bottom: 18px;
  }
  .pf-section-head {
    display: block;
  }
  .pf-section-head > a {
    display: inline-block;
    margin-top: 12px;
  }
  .pf-section-head h2 {
    font-size: 33px;
  }
  .pf-list-post {
    display: block;
  }
  .pf-list-image {
    display: block;
    min-height: 230px;
    height: 230px;
  }
  .pf-article-side {
    display: block;
  }
  .pf-sidebar .sidebar-widget {
    margin-bottom: 24px !important;
    padding: 22px;
  }
  
  .pf-sidebar .pf-sidebar-feature-content h3 {
  margin: 0 0 10px;
  font-size: 23px;
  line-height: 1.15;
}
  .pf-sidebar .pf-sidebar-feature {
    padding: 0;
  }
  .pf-sidebar-feature-content {
  padding: 19px 22px 22px;
}
  .pf-article-card {
    padding: 28px 22px;
  }
  .pf-article-header h1 {
    font-size: 39px;
  }
  .pf-article-meta {
    gap: 5px 14px;
    padding: 11px 0;
  }
  .pf-article-meta span {
    min-height: 22px;
    margin: 0;
    padding: 0;
  }
  .pf-article-meta span + span {
    border-left: 0;
    padding-left: 0;
  }
  .pf-entry-content {
    font-size: 15px;
  }
  .pf-entry-content .lead {
    font-size: 17px;
  }
  .pf-entry-content h2 {
    font-size: 31px;
  }
  .pf-facts ul {
    grid-template-columns: 1fr;
  }
  .pf-weight-grid {
    grid-template-columns: 1fr 1fr;
  }
  .pf-related-grid {
    grid-template-columns: 1fr;
  }
  .pf-related-card {
    display: grid;
    grid-template-columns: 125px 1fr;
  }
  .pf-related-image {
    height: 100%;
    min-height: 150px;
  }
  .pf-article-toc {
    padding: 24px 20px;
  }
  .pf-article-toc::before {
    left: 20px;
  }
  .pf-article-toc ol {
    columns: 1;
  }
  .pf-gold-price-box {
    display: block;
    padding: 26px 24px;
  }
  .pf-gold-price-box > a {
    margin-top: 18px;
  }
  .pf-footer a {
    margin: 0 20px 0 0;
    display: inline-block;
    padding: 5px 0;
  }
  .pf-color-grid {
    grid-template-columns: 1fr 1fr;
  }
  .pf-image-grid {
    grid-template-columns: 1fr;
  }
  .airport-facts .label {
    display: block;
    min-width: 0;
    margin-bottom: 2px;
  }
}

@media (max-width: 575px) {
  .pf-recommendation-grid {
    grid-template-columns: 1fr;
  }
  .pf-recommendation-card {
    display: grid !important;
    grid-template-columns: 120px 1fr;
  }
  .pf-recommendation-image {
    height: 100%;
    min-height: 112px;
  }
  .pf-recommendation-copy {
    min-height: 112px;
  }
}

/* =======================================================
   Sidebar: Produktempfehlungen
   ======================================================= */

.pf-sidebar .sidebar-widget.pf-shop-widget {
  overflow: hidden;
  padding: 0;
  background: #fff;
  border: 1px solid var(--pf-border);
  border-radius: var(--pf-radius);
  box-shadow: 0 8px 24px rgba(39, 50, 59, 0.07);
}

.pf-shop-header {
  padding: 25px 25px 20px;
  background: #f7f4ee;
  border-bottom: 1px solid var(--pf-border-soft);
}

.pf-shop-label {
  display: block;
  margin-bottom: 7px;
  color: var(--pf-accent-dark);
  font-size: 9px;
  line-height: 1.3;
  font-weight: 900;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.pf-sidebar .pf-shop-header h3 {
  position: relative;
  margin: 0 0 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--pf-border-soft);
  color: var(--pf-heading);
  font-family: var(--pf-font-heading);
  font-size: 26px;
  line-height: 1.12;
  font-weight: 700;
}

/* Kleine goldene Betonung auf der feinen Linie */
.pf-sidebar .pf-shop-header h3::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 38px;
  height: 2px;
  background: var(--pf-accent);
}

.pf-sidebar .pf-shop-header p {
  margin: 0;
  color: var(--pf-muted);
  font-size: 12px;
  line-height: 1.6;
}


/* Produktliste */

.pf-product-list {
  margin: 0;
  padding: 0;
  list-style: none !important;
}

.pf-product-list li {
  margin: 0;
  padding: 0;
  list-style: none !important;
  border-bottom: 1px solid var(--pf-border-soft);
}

.pf-product-list li::before,
.pf-product-list li::after {
  display: none !important;
  content: none !important;
}

.pf-product-list li:last-child {
  border-bottom: 0;
}

.pf-product-list li a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  width: 100%;
  padding: 15px 24px;
  color: var(--pf-heading);
  text-decoration: none;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    padding 0.2s ease;
}

.pf-product-list li a:hover {
  padding-left: 28px;
  background: #faf7f1;
  color: var(--pf-accent-dark);
}

.pf-product-copy {
  display: block;
  min-width: 0;
}

.pf-product-copy strong {
  display: block;
  color: var(--pf-blue);
  font-size: 13px;
  line-height: 1.4;
  font-weight: 800;
}

.pf-product-copy small {
  display: block;
  margin-top: 3px;
  color: var(--pf-muted);
  font-size: 10px;
  line-height: 1.5;
}

.pf-product-list li a:hover strong {
  color: var(--pf-accent-dark);
}

.pf-product-arrow {
  display: grid;
  place-items: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #eee8dd;
  color: var(--pf-accent-dark);
  font-size: 14px;
  font-weight: 900;
  transition:
    background 0.2s ease,
    color 0.2s ease,
    transform 0.2s ease;
}

.pf-product-list li a:hover .pf-product-arrow {
  background: var(--pf-blue);
  color: #fff;
  transform: translateX(2px);
}


/* Kleiner Affiliate-Hinweis */

.pf-sidebar .pf-shop-widget .pf-affiliate-note {
  margin: 0;
  padding: 14px 24px 17px;
  background: #faf9f6;
  border-top: 1px solid var(--pf-border-soft);
  color: #899198;
  font-size: 9px;
  line-height: 1.5;
}


/* Smartphone */

@media (max-width: 767px) {
  .pf-shop-header {
    padding: 22px 21px 18px;
  }

  .pf-product-list li a {
    padding: 14px 21px;
  }

  .pf-product-list li a:hover {
    padding-left: 21px;
  }

  .pf-sidebar .pf-shop-widget .pf-affiliate-note {
    padding: 13px 21px 16px;
  }
}

/* =======================================================
   Mietwagen: weiterführende Artikel und Linkgruppen
   ======================================================= */

.mietwagen-section {
  display: grid;
  gap: 25px;
  margin: 30px 0 38px;
}

.mietwagen-block {
  padding: 28px 30px;
  background: #faf8f4;
  border: 1px solid var(--pf-border);
  border-radius: 8px;
  box-shadow: 0 7px 18px rgba(39, 50, 59, 0.05);
}

.pf-entry-content .mietwagen-block h3 {
  margin: 0 0 12px;
  color: var(--pf-heading);
  font-size: 25px;
}

.pf-entry-content .mietwagen-block p {
  margin-top: 0;
}

.mietwagen-links {
  margin-top: 20px;
  border-top: 1px solid var(--pf-border-soft);
}

.mietwagen-links a {
  position: relative;
  display: block;
  margin: 0;
  padding: 13px 34px 13px 22px;
  border-bottom: 1px solid var(--pf-border-soft);
  color: var(--pf-blue);
  font-size: 13px;
  line-height: 1.55;
  font-weight: 700;
  text-decoration: none;
}

.mietwagen-links a::before {
  content: "›";
  position: absolute;
  top: 10px;
  left: 3px;
  color: var(--pf-accent);
  font-size: 21px;
  font-weight: 700;
}

.mietwagen-links a::after {
  content: "↗";
  position: absolute;
  top: 14px;
  right: 5px;
  color: #b6aa97;
  font-size: 10px;
}

.mietwagen-links a:hover {
  padding-left: 27px;
  background: #f6f2ea;
  color: var(--pf-accent-dark);
}

/* Affiliate-Erklärung am Artikelende */

.pf-affiliate-disclosure {
  display: block;
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid var(--pf-border-soft);
  color: #7d878e;
  font-size: 10px;
  line-height: 1.65;
}

/* ==========================================================================
   PREISTABELLEN
   Tabellen für Preise, Nebenkosten und Gebühren.
   ========================================================================== */

.pf-price-section {
  scroll-margin-top: 85px;
}

.pf-price-table-wrap {
  width: 100%;
  margin: 25px 0 38px;
  overflow-x: auto;
  background: #fff;
  border: 1px solid var(--pf-border);
  border-radius: 8px;
  box-shadow: 0 8px 22px rgba(39, 50, 59, 0.06);
}

.pf-price-table {
  width: 100%;
  min-width: 560px;
  margin: 0;
  border: 0;
  border-collapse: collapse;
  background: #fff;
  font-size: 13px;
}

.pf-price-table th {
  padding: 15px 18px;
  background: #2f465a;
  color: #fff;
  font-weight: 700;
  text-align: left;
}

.pf-price-table th:last-child {
  width: 155px;
  text-align: right;
}

.pf-price-table td {
  padding: 13px 18px;
  border-bottom: 1px solid #e8e3db;
  color: #34424d;
  line-height: 1.5;
}

.pf-price-table td:last-child {
  text-align: right;
  white-space: nowrap;
}

.pf-price-table tbody tr:nth-child(even) {
  background: #faf8f4;
}

.pf-price-table tbody tr:hover {
  background: #f6f0e5;
}

.pf-price-table tbody tr:last-child td {
  border-bottom: 0;
}

.pf-price-table .baht {
  display: inline-block;
  padding: 4px 9px;
  background: #f2e6c9;
  border-radius: 20px;
  color: #805913;
  font-weight: 800;
}

.pf-price-table a {
  color: #9c6d1e;
  font-weight: 700;
  text-decoration: none;
}

.pf-price-table a:hover {
  color: #2f465a;
}

@media (max-width: 767px) {
  .pf-price-table {
    font-size: 12px;
  }

  .pf-price-table th,
  .pf-price-table td {
    padding: 11px 13px;
  }
}

/* ==========================================================================
   AKTUELLER WECHSELKURS
   Nur für Seiten mit Baht- und Euro-Umrechnung.
   ========================================================================== */

.pf-rate-box {
  scroll-margin-top: 85px;
  margin: 32px 0 40px;
  padding: 28px 32px;
  background: linear-gradient(110deg, #24394a, #506a80);
  border-top: 3px solid #c99a38;
  color: #fff;
  box-shadow: 0 10px 28px rgba(29, 45, 57, 0.16);
}

.pf-rate-label {
  display: block;
  margin-bottom: 6px;
  color: #e2c27c;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.pf-entry-content .pf-rate-box h2 {
  margin: 0 0 12px;
  padding: 0;
  color: #fff;
  font-size: 27px;
  font-weight: 700;
}

.pf-entry-content .pf-rate-box h2::before {
  display: none;
}

.pf-rate-main {
  margin-bottom: 18px;
  color: #fff;
  font-family: var(--pf-font-heading);
  font-size: 23px;
  font-weight: 700;
}

.pf-rate-main small {
  display: block;
  margin-top: 4px;
  color: rgba(255, 255, 255, 0.62);
  font-family: var(--pf-font-body);
  font-size: 9px;
  font-weight: 400;
}

.pf-rate-list {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.pf-rate-list li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin: 0;
  padding: 11px 13px;
  background: rgba(255, 255, 255, 0.09);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: rgba(255, 255, 255, 0.82);
}

.pf-rate-list li::before {
  display: none !important;
}

.pf-rate-list strong {
  color: #e2c27c;
  white-space: nowrap;
}

.pf-rate-note {
  margin: 14px 0 0 !important;
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 9px;
  line-height: 1.5;
}

@media (max-width: 767px) {
  .pf-rate-box {
    padding: 24px 21px;
  }

  .pf-rate-list {
    grid-template-columns: 1fr;
  }
}

/* Breadcrumb mobil ohne Kasten */
@media (max-width: 767px) {

  .pf-breadcrumb-shell.container {
    padding-right: 22px;
    padding-left: 22px;
  }

  .pf-breadcrumb {
    display: flex;
    align-items: center;
    gap: 7px;
    margin: 0;
    padding: 14px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: 11px;
    white-space: nowrap;
  }
}

/* ==========================================================================
   ARTIKEL-META – DESKTOP UND MOBILE
   ========================================================================== */

.pf-article-meta {
  text-transform: none;
  letter-spacing: 0;
}

.pf-article-meta .pf-meta-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 24px;
  margin-right: 15px;
  padding-right: 15px;
  color: #6f7d87;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.3;
  white-space: nowrap;
}

.pf-article-meta .pf-meta-item + .pf-meta-item {
  padding-left: 15px;
  border-left: 1px solid #ddd5ca;
}

.pf-article-meta .pf-meta-label {
  margin: 0;
  padding: 0;
  color: #6f7d87;
  font-weight: 400;
}

.pf-article-meta .pf-meta-item i {
  flex: 0 0 auto;
  color: #b88a38;
  font-size: 14px;
}

.pf-article-meta .pf-meta-item time {
  color: #6f7d87;
  font-weight: 400;
}

/* Mobile Darstellung */
@media (max-width: 767px) {

  .pf-article-meta {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    margin: 20px 0;
    padding: 13px 0;
    overflow: visible;
    border-top: 1px solid #e4ddd3;
    border-bottom: 1px solid #e4ddd3;
    background: transparent;
  }

  .pf-article-meta .pf-meta-item {
    flex: 0 0 auto;
    width: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 10px;
  }

  .pf-article-meta .pf-meta-item + .pf-meta-item {
    padding-left: 0;
    border-left: 0;
  }

  .pf-article-meta .pf-meta-label {
    display: none;
  }

  .pf-article-meta .pf-meta-label--always {
    display: inline;
  }

  .pf-article-meta .pf-meta-item i {
    font-size: 13px;
  }

  /* Nur normale Artikelabsätze auf Smartphones größer */
  .pf-entry-content > p:not(.lead) {
    font-size: 17px;
    line-height: 1.68;
  }

  /* Kompaktere Abstände rund um Artikelbilder */
  .pf-hero-figure {
    margin-bottom: 22px;
  }

  .pf-entry-content figure {
    margin: 22px 0;
  }

  .pf-hero-figure figcaption,
  .pf-entry-content figcaption {
    margin-top: 7px;
  }
}

/* Google-AdSense-Anzeige */
.ads-wrapper {
  width: 100%;
  margin: 40px 0;
  padding: 12px 0;
  overflow: hidden;
  text-align: right;
  border-top: 1px solid #e7dfd2;
  border-bottom: 1px solid #e7dfd2;
}

.ads-label {
  display: block;
  margin-bottom: 10px;
  color: #8a8175;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.08em;
}