/* ==========================================================================
   Herzensweg Begleitung · Layout für Blogbeiträge, Version 2
   Vorlage von der Betreiberin am 15.09.2026 geliefert und hier übernommen.
   Angelehnt an die Landingpages (Titelbild über volle Breite, Farbbänder,
   Karten, Gellatio für kurze Zeilen), aber mit ruhiger Lesespalte.
   Wirkt nur auf Einzelbeiträge (body.single-post) im Theme Blocksy.
   Der Präfix #main setzt sich gegen Blocksy- und Elementor-Kit-Stile durch.
   ========================================================================== */

@font-face{
  font-family:'Gellatio';font-style:normal;font-weight:400;font-display:swap;
  src:url('/wp-content/uploads/2025/10/Gellatio-Regular.woff2') format('woff2'),
      url('/wp-content/uploads/2025/10/Gellatio-Regular.woff') format('woff');
}

/* 1 · Farben, Schrift, Maße ---------------------------------------------------- */
.single-post{
  --hw-nachtblau:#253A61;
  --hw-petrol:#335B6B;
  --hw-schiefer:#4F7884;
  --hw-graublau:#95BBBF;
  --hw-text:#3C3C3B;
  --hw-grau:#5B6770;
  --hw-sand:#FEF8EB;
  --hw-sand-linie:#EDDCB4;
  --hw-sonne:#F7BD3D;
  --hw-sonne-hell:#FBE3A6;
  --hw-salbei:#63ABA7;
  --hw-salbei-tinte:#35706C;
  --hw-nebel:#C8D5DC;
  --hw-nebel-hell:#EEF3F5;
  --hw-weiss:#FFFFFF;

  --hw-sans:'Quicksand',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --hw-hand:'Gellatio','Quicksand',cursive;

  --hw-lesebreite:42rem;
  --hw-breit:64rem;
  --hw-schatten-karte:0 14px 32px -20px rgba(37,58,97,.55);
}

/* 2 · Grundgerüst ---------------------------------------------------------------- */
.single-post #main{overflow-x:clip}
.single-post #main > [data-vertical-spacing*="top"]{padding-top:0}

/* 3 · Titelbild über die volle Breite -------------------------------------------- */
.single-post #main article.post > .ct-featured-image{
  position:relative;width:100vw;max-width:none;margin:0 0 0 calc(50% - 50vw);padding:0;
}
.single-post #main .ct-featured-image .ct-media-container{
  position:relative;height:clamp(15rem,8rem + 26vw,33rem);aspect-ratio:auto;overflow:hidden;
  border-radius:0;box-shadow:none;background:var(--hw-graublau);
}
.single-post #main .ct-featured-image .ct-media-container > img,
.single-post #main .ct-featured-image .ct-media-container > svg{
  display:block;width:100%!important;height:100%!important;aspect-ratio:auto!important;object-fit:cover;object-position:50% 45%;
}
.single-post #main .ct-featured-image .ct-media-container::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(37,58,97,.12) 0%,rgba(37,58,97,.2) 50%,rgba(37,58,97,.45) 100%);
}
.single-post #main .ct-featured-image figcaption{display:none}
.single-post #main article.post .ct-featured-image::after{
  content:none;position:absolute;left:50%;top:50%;z-index:2;transform:translate(-50%,-50%);
  font-family:var(--hw-hand);font-size:clamp(3.2rem,2rem + 5.5vw,6.5rem);font-weight:400;line-height:1;white-space:nowrap;
  color:var(--hw-weiss);text-shadow:0 2px 24px rgba(37,58,97,.45);pointer-events:none;
}
/* Schriftzug auf dem Bild je Kategorie. Weitere Kategorien nach demselben Muster. */
.single-post #main article.category-atemreisen .ct-featured-image::after{content:"Atemreisen"}

/* Titelbereich auf Sand */
.single-post #main .hero-section[data-type="type-1"]{
  position:relative;width:100%;max-width:none;margin:0;
  padding:clamp(2.5rem,1.75rem + 3vw,4.25rem) 0 clamp(1.75rem,1.25rem + 2vw,2.75rem);
  text-align:center;border-image:conic-gradient(var(--hw-sand) 0 0) fill 0 / / 0 100vmax;
}
.single-post #main .hero-section .entry-header{display:flex;flex-direction:column;align-items:center;max-width:52rem;margin:0 auto;padding:0}
.single-post #main .hero-section .ct-breadcrumbs{
  order:0;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.2rem 0;margin:0 0 1.1rem;padding:0;
  font-family:var(--hw-sans);font-size:.78rem;font-weight:700;line-height:1.4;letter-spacing:.12em;text-transform:uppercase;color:var(--hw-grau);
}
.single-post #main .hero-section .ct-breadcrumbs a{color:var(--hw-petrol);text-decoration:none}
.single-post #main .hero-section .ct-breadcrumbs a:hover{text-decoration:underline;text-decoration-color:var(--hw-sonne);text-decoration-thickness:2px;text-underline-offset:.25em}
.single-post #main .hero-section .ct-breadcrumbs .ct-separator{width:.45rem;height:.45rem;margin:0 .6rem;opacity:.55;vertical-align:middle}
.single-post #main .hero-section .ct-breadcrumbs > :last-child{display:none}
.single-post #main .hero-section .ct-breadcrumbs > :nth-last-child(2) .ct-separator{display:none}
.single-post #main .hero-section .page-title{
  order:1;margin:0;font-family:var(--hw-sans);font-weight:700;
  font-size:clamp(2rem,1.3rem + 2.8vw,3.3rem);line-height:1.12;letter-spacing:-.015em;color:var(--hw-nachtblau);text-wrap:balance;
}
.single-post #main .hero-section .page-description,
.single-post #main .hero-section .page-description.ct-hidden-sm{
  display:block!important;order:2;max-width:40rem;margin:1.25rem auto 0;
  font-family:var(--hw-sans);font-size:clamp(1.08rem,.98rem + .45vw,1.28rem);line-height:1.65;font-weight:500;color:var(--hw-petrol);text-wrap:pretty;
}
.single-post #main .hero-section .page-description p{margin:0}

.single-post #main .hero-section .entry-meta{
  order:3;display:grid;grid-template-columns:auto auto auto;
  grid-template-areas:"bild name name" "bild datum kategorie";
  justify-content:center;align-items:center;column-gap:0;row-gap:.05rem;
  margin:2rem 0 0;padding:0;list-style:none;text-align:left;
  font-family:var(--hw-sans);font-size:.95rem;font-weight:500;line-height:1.35;text-transform:none;letter-spacing:0;color:var(--hw-grau);
}
.single-post #main .hero-section .entry-meta > li{margin:0;padding:0;list-style:none}
.single-post #main .hero-section .entry-meta > li::before,
.single-post #main .hero-section .entry-meta > li::after{content:none!important;display:none!important}
.single-post #main .hero-section .entry-meta > .meta-author{display:contents}
.single-post #main .hero-section .entry-meta .ct-media-container-static{
  grid-area:bild;display:block;width:3rem;height:3rem;margin-right:.85rem;text-decoration:none;
  border-radius:50%;overflow:hidden;box-shadow:0 0 0 3px var(--hw-weiss);
}
.single-post #main .hero-section .entry-meta .ct-media-container-static img{display:block;width:100%!important;height:100%!important;object-fit:cover}
.single-post #main .hero-section .entry-meta .ct-meta-element-author{grid-area:name;align-self:end;font-weight:700;color:var(--hw-nachtblau);text-decoration:none}
.single-post #main .hero-section .entry-meta .ct-meta-element-author:hover{color:var(--hw-petrol)}
.single-post #main .hero-section .entry-meta > .meta-date{grid-area:datum;align-self:start}
.single-post #main .hero-section .entry-meta > .meta-categories{grid-area:kategorie;align-self:start;margin-left:.3em}
.single-post #main .hero-section .entry-meta > .meta-categories::before{content:"in"!important;display:inline!important;margin-right:.3em}
.single-post #main .hero-section .entry-meta > .meta-categories a{color:var(--hw-petrol);font-weight:600;text-decoration:none}

/* 4 · Lesetext -------------------------------------------------------------------- */
.single-post #main .entry-content{
  --wp--style--global--content-size:var(--hw-lesebreite);
  --wp--style--global--wide-size:var(--hw-breit);
  max-width:none;
  font-family:var(--hw-sans);font-size:1.125rem;line-height:1.8;font-weight:500;color:var(--hw-text);
}
.single-post #main .entry-content > *,
.single-post #main .entry-content .elementor > .e-con > .e-con-inner > .elementor-element{max-width:var(--hw-lesebreite);margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:1.35rem}
.single-post #main .entry-content > .alignwide,
.single-post #main .entry-content .elementor > .e-con.alignwide > .e-con-inner{max-width:var(--hw-breit)}
.single-post #main .entry-content > .alignfull,
.single-post #main .entry-content .elementor > .e-con.alignfull > .e-con-inner{max-width:none}
.single-post #main .entry-content > p,
.single-post #main .entry-content .elementor-widget-container > p{text-wrap:pretty}
.single-post #main .entry-content strong,
.single-post #main .entry-content b{font-weight:700;color:var(--hw-nachtblau)}

.single-post #main .entry-content h2:not(.elementor-heading-title){
  margin-top:clamp(3.25rem,2.4rem + 2.6vw,4.75rem);margin-bottom:1rem;
  font-family:var(--hw-sans);font-weight:600;font-size:clamp(1.6rem,1.22rem + 1.3vw,2.2rem);
  line-height:1.22;letter-spacing:-.01em;color:var(--hw-petrol);text-wrap:balance;scroll-margin-top:7rem;
}
.single-post #main .entry-content h3:not(.elementor-heading-title){
  margin-top:2.25rem;margin-bottom:.5rem;
  font-family:var(--hw-sans);font-weight:700;font-size:clamp(1.15rem,1.05rem + .4vw,1.32rem);
  line-height:1.35;letter-spacing:0;color:var(--hw-nachtblau);text-wrap:balance;scroll-margin-top:7rem;
}
.single-post #main .entry-content h4:not(.elementor-heading-title){margin-top:1.75rem;margin-bottom:.35rem;font-family:var(--hw-sans);font-size:1.05rem;font-weight:700;color:var(--hw-nachtblau)}
.single-post #main .entry-content > :first-child,
.single-post #main .entry-content .elementor > .e-con:first-child > .e-con-inner > .elementor-element:first-child{margin-top:0}

.single-post #main .entry-content a:not([class]){
  color:var(--hw-petrol);font-weight:600;background-image:none;
  text-decoration-line:underline;text-decoration-color:var(--hw-sonne);text-decoration-thickness:2px;text-underline-offset:.24em;
  transition:color .2s ease,text-decoration-color .2s ease;
}
.single-post #main .entry-content a:not([class]):hover{color:var(--hw-nachtblau);text-decoration-color:var(--hw-petrol)}
.single-post #main .entry-content a:focus-visible,
.single-post #main .entry-content summary:focus-visible{outline:3px solid var(--hw-sonne);outline-offset:3px;border-radius:6px}

.single-post #main .entry-content > ul:not([class]),
.single-post #main .entry-content .elementor-widget-container > ul:not([class]),
.single-post #main .entry-content > ol:not([class]),
.single-post #main .entry-content .elementor-widget-container > ol:not([class]){padding-left:0;list-style:none}
.single-post #main .entry-content > ul:not([class]) > li,
.single-post #main .entry-content .elementor-widget-container > ul:not([class]) > li{position:relative;margin:0 0 .5rem;padding-left:1.5rem}
.single-post #main .entry-content > ul:not([class]) > li::before,
.single-post #main .entry-content .elementor-widget-container > ul:not([class]) > li::before{
  content:"";position:absolute;left:.2rem;top:calc(.9em - .22rem);width:.44rem;height:.44rem;border-radius:50%;background:var(--hw-salbei);
}
.single-post #main .entry-content > ol:not([class]),
.single-post #main .entry-content .elementor-widget-container > ol:not([class]){counter-reset:hw-liste}
.single-post #main .entry-content > ol:not([class]) > li,
.single-post #main .entry-content .elementor-widget-container > ol:not([class]) > li{position:relative;margin:0 0 .6rem;padding-left:2.1rem;counter-increment:hw-liste}
.single-post #main .entry-content > ol:not([class]) > li::before,
.single-post #main .entry-content .elementor-widget-container > ol:not([class]) > li::before{content:counter(hw-liste) ".";position:absolute;left:0;top:0;min-width:1.6rem;font-weight:700;color:var(--hw-petrol)}

.single-post #main .entry-content mark{
  color:inherit;font-weight:600;padding:0 .12em;border-radius:3px;
  background:linear-gradient(to bottom,transparent 56%,rgba(247,189,61,.55) 56%);
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
}
.single-post #main .entry-content > blockquote:not([class]),
.single-post #main .entry-content .elementor-widget-container > blockquote:not([class]){
  margin-top:2rem;margin-bottom:2rem;padding:.2rem 0 .2rem 1.5rem;border:0;border-left:3px solid var(--hw-sonne);background:none;
  font-size:1.2rem;line-height:1.6;font-weight:600;color:var(--hw-petrol);
}
.single-post #main .entry-content > blockquote:not([class]) p,
.single-post #main .entry-content .elementor-widget-container > blockquote:not([class]) p{margin:0 0 .5rem}
.single-post #main .entry-content img{height:auto;border-radius:10px}
.single-post #main .entry-content > figure,
.single-post #main .entry-content .elementor-widget-container > figure,
.single-post #main .entry-content > .wp-block-image,
.single-post #main .entry-content .elementor-widget-container > .wp-block-image{margin-top:2.25rem;margin-bottom:2.25rem}
.single-post #main .entry-content figcaption{margin-top:.65rem;font-size:.9rem;line-height:1.5;color:var(--hw-grau);text-align:center}
.single-post #main .entry-content > hr,
.single-post #main .entry-content .elementor-widget-container > hr{
  width:4.5rem;height:1rem;margin:3.5rem auto;border:0;opacity:1;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 16'%3E%3Cpath d='M3 8Q9.5 2 16 8T29 8T42 8T55 8T68 8' fill='none' stroke='%23F7BD3D' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}

/* 5 · Farbbänder über die volle Breite ------------------------------------------- */
/* Klassisch geschriebene Beitraege: die Farbflaeche entsteht ueber den
   border-image-Ueberstand, weil ein <div> im Textfluss sonst nicht ueber die
   Lesespalte hinauskommt. */
.single-post #main .entry-content > .hw-band{
  --hw-band-grund:var(--hw-sand);
  position:relative;max-width:none;
  margin-top:clamp(3.25rem,2.4rem + 2.6vw,4.75rem);margin-bottom:clamp(3.25rem,2.4rem + 2.6vw,4.75rem);
  padding:clamp(2.75rem,2rem + 3vw,4.5rem) 0;
  border-image:conic-gradient(var(--hw-band-grund) 0 0) fill 0 / / 0 100vmax;
}
/* Mit Elementor gebaute Beitraege brauchen den Trick nicht. Der Container
   traegt die Farbe nativ ueber background_background:"classic" und einen
   globalen Verweis, genau wie auf /hormonschnelltest/ oder /atemreisen/ -
   die DOM-Kette ist dieselbe, geprueft. Polsterung kommt ebenfalls von
   Elementor (75 px, mobil 50/25), deshalb hier kein padding und kein margin. */
.single-post #main .entry-content .elementor > .e-con.hw-band{
  position:relative;max-width:none;margin-top:0;margin-bottom:0;
}
.single-post #main .entry-content > .hw-band--start,
.single-post #main .entry-content .elementor > .e-con.hw-band--start{margin-top:0;padding-top:.25rem}
.single-post #main .entry-content > .hw-band--petrol,
.single-post #main .entry-content .elementor > .e-con.hw-band--petrol{--hw-band-grund:var(--hw-petrol);color:var(--hw-weiss)}
.single-post #main .entry-content .hw-band > *{max-width:var(--hw-lesebreite);margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:1.35rem}
.single-post #main .entry-content .hw-band > .alignwide{max-width:var(--hw-breit)}
.single-post #main .entry-content .hw-band > :last-child{margin-bottom:0}
.single-post #main .entry-content .hw-band:not(.hw-band--start) > p,
.single-post #main .entry-content .hw-band:not(.hw-band--start) .elementor-widget-container > p{max-width:38rem;margin-left:auto;margin-right:auto;text-align:center;text-wrap:pretty}
.single-post #main .entry-content .hw-band h2{margin-top:0;margin-bottom:1.1rem;text-align:center}
.single-post #main .entry-content .hw-band > p.hw-band__zierzeile,
.single-post #main .entry-content .hw-band .elementor-widget-container > p.hw-band__zierzeile{margin-left:auto;margin-right:auto;
  max-width:var(--hw-lesebreite);margin-bottom:.45rem;
  font-family:var(--hw-hand);font-size:clamp(2.5rem,1.6rem + 3.4vw,3.9rem);font-weight:400;line-height:1.15;
  color:var(--hw-petrol);text-align:center;text-wrap:balance;
}
.single-post #main .entry-content .hw-band--petrol > p.hw-band__zierzeile,
.single-post #main .entry-content .hw-band--petrol .elementor-widget-container > p.hw-band__zierzeile,
.single-post #main .entry-content .hw-band--petrol h2,
.single-post #main .entry-content .hw-band--petrol strong{color:var(--hw-weiss)}
.single-post #main .entry-content .hw-band--petrol a:not([class]){color:var(--hw-weiss);text-decoration-color:var(--hw-sonne)}

/* 6 · Kurz gesagt ---------------------------------------------------------------- */
.single-post #main .entry-content .hw-kurz{
  position:relative;margin-top:1.75rem;margin-bottom:1.25rem;
  padding:2.4rem clamp(1.25rem,.75rem + 2vw,2.1rem) 1.6rem;
  background:var(--hw-weiss);border:1px solid var(--hw-sand-linie);border-radius:12px;box-shadow:var(--hw-schatten-karte);
}
.single-post #main .entry-content .hw-kurz::before{
  content:"Kurz gesagt";position:absolute;top:0;left:clamp(1.1rem,.6rem + 2vw,1.85rem);
  transform:translateY(-50%) rotate(-3deg);transform-origin:left center;
  font-family:var(--hw-hand);font-size:2.5rem;font-weight:400;line-height:1;color:var(--hw-petrol);
}
.single-post #main .entry-content .hw-kurz__antwort{margin:0;font-size:1.15rem;line-height:1.7}
.single-post #main .entry-content .hw-kurz__antwort strong{font-weight:600;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-kurz__fakten{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem 1.5rem;
  list-style:none;margin:1.4rem 0 0;padding:1.3rem 0 0;border-top:1px dashed var(--hw-sand-linie);
}
.single-post #main .entry-content .hw-kurz__fakten li{position:relative;margin:0;padding:0 0 0 2rem;font-size:.98rem;line-height:1.45;color:var(--hw-text)}
.single-post #main .entry-content .hw-kurz__fakten li::before{
  content:"";position:absolute;left:0;top:.05rem;width:1.4rem;height:1.4rem;border-radius:0;background:var(--hw-icon) no-repeat center/contain;
}
.single-post #main .entry-content .hw-kurz__fakten strong{display:block;font-size:.88rem;font-weight:700;color:var(--hw-petrol)}
.single-post #main .entry-content .hw-fakt--dauer{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5V12l3 2'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-fakt--rahmen{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18V5.5l11-2.5v12.5'/%3E%3Ccircle cx='6.5' cy='18' r='2.5'/%3E%3Ccircle cx='17.5' cy='15.5' r='2.5'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-fakt--ort{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21s-6.5-5.8-6.5-11a6.5 6.5 0 0 1 13 0c0 5.2-6.5 11-6.5 11z'/%3E%3Ccircle cx='12' cy='10' r='2.3'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-fakt--vorwissen{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8.3 12.4 2.5 2.5 5-5.2'/%3E%3C/svg%3E")}

/* 7 · Inhaltsverzeichnis --------------------------------------------------------- */
.single-post #main .entry-content .hw-inhalt{margin-top:0;margin-bottom:0}
.single-post #main .entry-content .hw-inhalt details{padding:0 1rem;background:var(--hw-weiss);border:1px solid var(--hw-sand-linie);border-radius:10px}
.single-post #main .entry-content .hw-inhalt summary{
  display:flex;align-items:center;gap:.8rem;padding:1rem .25rem;cursor:pointer;list-style:none;
  font-size:1.05rem;font-weight:700;line-height:1.3;color:var(--hw-nachtblau);
}
.single-post #main .entry-content .hw-inhalt summary::-webkit-details-marker{display:none}
.single-post #main .entry-content .hw-inhalt summary::before{
  content:"";flex:none;width:1.3rem;height:1.3rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M9 6.5h11M9 12h11M9 17.5h7'/%3E%3Ccircle cx='4.5' cy='6.5' r='.9' fill='%23335B6B'/%3E%3Ccircle cx='4.5' cy='12' r='.9' fill='%23335B6B'/%3E%3Ccircle cx='4.5' cy='17.5' r='.9' fill='%23335B6B'/%3E%3C/svg%3E") no-repeat center/contain;
}
.single-post #main .entry-content .hw-inhalt summary span{margin-left:auto;font-size:.9rem;font-weight:600;color:var(--hw-grau)}
.single-post #main .entry-content .hw-inhalt summary::after{
  content:"";flex:none;width:.55rem;height:.55rem;margin:0 .35rem 0 .4rem;
  border-right:2px solid var(--hw-petrol);border-bottom:2px solid var(--hw-petrol);
  transform:translateY(-25%) rotate(45deg);transition:transform .2s ease;
}
.single-post #main .entry-content .hw-inhalt details[open] summary::after{transform:translateY(25%) rotate(-135deg)}
.single-post #main .entry-content .hw-inhalt ol{list-style:none;margin:0;padding:.1rem .25rem 1.25rem 2.35rem;columns:2 15rem;column-gap:2.5rem}
.single-post #main .entry-content .hw-inhalt li{break-inside:avoid;margin:0;padding:.3rem 0;font-size:1rem;line-height:1.45}
.single-post #main .entry-content .hw-inhalt a{color:var(--hw-text);font-weight:600;text-decoration:none;background:none}
.single-post #main .entry-content .hw-inhalt a:hover{color:var(--hw-petrol);text-decoration:underline;text-decoration-color:var(--hw-sonne);text-decoration-thickness:2px;text-underline-offset:.22em}

/* 8 · Tabellen ------------------------------------------------------------------- */
.single-post #main .entry-content .hw-tabelle,
.single-post #main .entry-content > figure.wp-block-table,
.single-post #main .entry-content .elementor-widget-container > figure.wp-block-table{overflow-x:auto;margin-top:1.5rem;margin-bottom:2rem}
.single-post #main .entry-content table{width:100%;margin:0;border:0;border-collapse:separate;border-spacing:0;font-size:1rem;line-height:1.5}
.single-post #main .entry-content th,
.single-post #main .entry-content td{padding:.85rem .95rem;border:0;border-bottom:1px solid var(--hw-nebel);text-align:left;vertical-align:top;background:none}
.single-post #main .entry-content thead th,
.single-post #main .entry-content thead td{padding-top:.75rem;padding-bottom:.75rem;border-bottom:2px solid var(--hw-petrol);font-size:.98rem;font-weight:700;color:var(--hw-nachtblau)}
.single-post #main .entry-content tbody th{font-weight:700;color:var(--hw-petrol);white-space:nowrap}
.single-post #main .entry-content tbody tr:last-child > *{border-bottom:0}
.single-post #main .entry-content .hw-tabelle table{table-layout:fixed}
.single-post #main .entry-content .hw-tabelle thead tr > :first-child{width:22%}
.single-post #main .entry-content .hw-tabelle tr > :last-child{background:var(--hw-sand)}
.single-post #main .entry-content .hw-tabelle thead tr > :last-child{border-radius:10px 10px 0 0}
.single-post #main .entry-content .hw-tabelle tbody tr:last-child > :last-child{border-radius:0 0 10px 10px}

/* 9 · Hinweis zur Sicherheit ----------------------------------------------------- */
.single-post #main .entry-content .hw-hinweis{
  position:relative;margin-top:1.5rem;margin-bottom:2rem;padding:1.4rem 1.5rem 1.35rem 4.1rem;
  background:var(--hw-weiss);border:1px solid var(--hw-sonne-hell);border-left:4px solid var(--hw-sonne);border-radius:4px 10px 10px 4px;
}
.single-post #main .entry-content .hw-hinweis::before{
  content:"";position:absolute;left:1.2rem;top:1.35rem;width:1.8rem;height:1.8rem;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'%3E%3Ccircle cx='14' cy='14' r='14' fill='%23F7BD3D'/%3E%3Crect x='12.7' y='12.2' width='2.6' height='8.4' rx='1.3' fill='%23253A61'/%3E%3Ccircle cx='14' cy='8.3' r='1.65' fill='%23253A61'/%3E%3C/svg%3E") no-repeat center/contain;
}
.single-post #main .entry-content .hw-hinweis__titel{margin:0 0 .75rem;font-size:1.05rem;font-weight:700;line-height:1.45;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-hinweis ul{list-style:none;margin:0 0 .9rem;padding:0;columns:2 13rem;column-gap:2rem}
.single-post #main .entry-content .hw-hinweis li{position:relative;break-inside:avoid;margin:0 0 .3rem;padding-left:1.05rem;font-size:1rem;line-height:1.5}
.single-post #main .entry-content .hw-hinweis li::before{content:"";position:absolute;left:0;top:.62em;width:.38rem;height:.38rem;border-radius:50%;background:var(--hw-sonne)}
.single-post #main .entry-content .hw-hinweis > p:last-child{margin:0;font-size:.95rem;line-height:1.55;color:var(--hw-grau)}

/* 10 · Ablauf als Schrittfolge --------------------------------------------------- */
.single-post #main .entry-content .hw-ablauf{list-style:none;margin-top:1.75rem;margin-bottom:2rem;padding:0;counter-reset:hw-schritt}
.single-post #main .entry-content .hw-ablauf > li{position:relative;margin:0;padding:0 0 1.75rem 3.5rem;counter-increment:hw-schritt}
.single-post #main .entry-content .hw-ablauf > li::before{
  content:counter(hw-schritt);position:absolute;left:0;top:.05rem;z-index:1;
  display:grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:50%;
  background:var(--hw-sand);border:2px solid var(--hw-sonne);
  font-size:.95rem;font-weight:700;line-height:1;color:var(--hw-nachtblau);
}
.single-post #main .entry-content .hw-ablauf > li::after{content:"";position:absolute;left:calc(1.15rem - 1px);top:2.35rem;bottom:.1rem;width:2px;border-radius:2px;background:var(--hw-sonne-hell)}
.single-post #main .entry-content .hw-ablauf > li:last-child{padding-bottom:0}
.single-post #main .entry-content .hw-ablauf > li:last-child::after{content:none}
.single-post #main .entry-content .hw-ablauf h3{margin:.3rem 0 .35rem;font-size:1.15rem}
.single-post #main .entry-content .hw-ablauf p{margin:0}

/* 11 · Die drei Atemreisen als Karten -------------------------------------------- */
.single-post #main .entry-content .hw-wege{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;margin-top:2.25rem;margin-bottom:2.25rem;padding:0}
.single-post #main .entry-content .hw-weg{
  --hw-karte-grund:var(--hw-graublau);--hw-karte-text:var(--hw-nachtblau);
  display:flex;flex-direction:column;align-items:center;text-align:center;
  padding:2.1rem 1.5rem 1.75rem;border:0;border-radius:10px;
  background:var(--hw-karte-grund);color:var(--hw-karte-text);box-shadow:var(--hw-schatten-karte);
}
.single-post #main .entry-content .hw-weg::before{
  content:"";flex:none;width:5.5rem;height:5.5rem;margin-bottom:1.15rem;border-radius:50%;
  background:var(--hw-weiss) var(--hw-welle) no-repeat center/62% auto;box-shadow:0 8px 18px -10px rgba(37,58,97,.5);
}
.single-post #main .entry-content .hw-weg--sanft{--hw-welle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cpath d='M7.5 20Q15 14 22.5 20T37.5 20T52.5 20' fill='none' stroke='%2363ABA7' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-weg--mittel{--hw-karte-grund:var(--hw-schiefer);--hw-karte-text:var(--hw-weiss);--hw-welle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cpath d='M7.5 20Q15 4 22.5 20T37.5 20T52.5 20' fill='none' stroke='%234F7884' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-weg--kraeftig{--hw-karte-grund:var(--hw-petrol);--hw-karte-text:var(--hw-weiss);--hw-welle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 40'%3E%3Cpath d='M7.5 20Q15 -10 22.5 20T37.5 20T52.5 20' fill='none' stroke='%23253A61' stroke-width='3.5' stroke-linecap='round'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-weg h3{margin:0 0 .8rem;font-family:var(--hw-hand);font-weight:400;font-size:clamp(1.95rem,1.6rem + 1vw,2.4rem);line-height:1.12;letter-spacing:0;color:inherit}
.single-post #main .entry-content .hw-weg p{margin:0 0 .9rem;font-size:1rem;line-height:1.65;color:inherit}
.single-post #main .entry-content .hw-weg .hw-weg__notiz{margin:auto 0 0;padding-top:.6rem;font-size:.92rem;font-weight:700;line-height:1.45;color:inherit}

/* 12 · Begriffskarten ------------------------------------------------------------ */
.single-post #main .entry-content .hw-begriffe{display:grid;grid-template-columns:repeat(auto-fit,minmax(13.5rem,1fr));gap:1rem;margin-top:2rem;margin-bottom:2.25rem;padding:0}
.single-post #main .entry-content .hw-begriff{
  display:block;margin:0;padding:1.6rem 1.35rem 1.5rem;border:0;border-radius:10px;
  background:var(--hw-sand);text-align:center;box-shadow:0 14px 30px -18px rgba(0,0,0,.6);
}
.single-post #main .entry-content .hw-begriff h3{margin:0 0 .7rem;font-family:var(--hw-hand);font-weight:400;font-size:clamp(1.8rem,1.5rem + .9vw,2.15rem);line-height:1.12;letter-spacing:0;color:var(--hw-petrol)}
.single-post #main .entry-content .hw-begriff p{margin:0;font-size:.98rem;line-height:1.65;color:var(--hw-grau)}
.single-post #main .entry-content .hw-begriff--eigen{background:var(--hw-weiss);box-shadow:inset 0 0 0 3px var(--hw-sonne),0 14px 30px -18px rgba(0,0,0,.6)}

/* 13 · Online oder vor Ort ------------------------------------------------------- */
.single-post #main .entry-content .hw-vergleich{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:1.75rem;margin-bottom:2rem;padding:0}
.single-post #main .entry-content .hw-vergleich__seite{padding:0 0 0 1.75rem;border-left:1px solid var(--hw-nebel)}
.single-post #main .entry-content .hw-vergleich__seite:first-child{padding:0 1.75rem 0 0;border-left:0}
.single-post #main .entry-content .hw-vergleich h3{display:flex;align-items:center;gap:.6rem;margin:0 0 .85rem;font-size:1.2rem}
.single-post #main .entry-content .hw-vergleich h3::before{content:"";flex:none;width:1.5rem;height:1.5rem;background:var(--hw-icon) no-repeat center/contain}
.single-post #main .entry-content .hw-vergleich__seite--online{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='5' width='16' height='11' rx='1.5'/%3E%3Cpath d='M2.5 19.5h19'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-vergleich__seite--vorort{--hw-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23335B6B' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 10.5 12 4l8 6.5V20a1 1 0 0 1-1 1h-4.5v-6h-5v6H5a1 1 0 0 1-1-1z'/%3E%3C/svg%3E")}
.single-post #main .entry-content .hw-vergleich ul{list-style:none;margin:0;padding:0}
.single-post #main .entry-content .hw-vergleich li{position:relative;margin:0 0 .6rem;padding-left:1.15rem;font-size:1rem;line-height:1.6}
.single-post #main .entry-content .hw-vergleich li::before{content:"";position:absolute;left:0;top:.66em;width:.4rem;height:.4rem;border-radius:50%;background:var(--hw-salbei)}
.single-post #main .entry-content .hw-vergleich__fehlt{margin:1.1rem 0 .45rem;font-size:.98rem;font-weight:700;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-vergleich__fehlt + ul li::before{background:transparent;box-shadow:inset 0 0 0 1.5px var(--hw-grau)}

/* 14 · Checkliste ---------------------------------------------------------------- */
.single-post #main .entry-content .hw-checkliste{margin-top:1.5rem;margin-bottom:2rem}
.single-post #main .entry-content .hw-checkliste__titel{margin:0 0 .8rem;font-weight:700;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-checkliste ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.75rem 1.75rem;list-style:none;margin:0;padding:0}
.single-post #main .entry-content .hw-checkliste li{position:relative;margin:0;padding-left:2.1rem;font-size:1.02rem;line-height:1.55}
.single-post #main .entry-content .hw-checkliste li::before{
  content:"";position:absolute;left:0;top:.05rem;width:1.5rem;height:1.5rem;border-radius:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23335B6B'%3E%3Ccircle cx='12' cy='12' r='4.6'/%3E%3Cpath d='M12 1.5l1.3 3.2h-2.6zM12 22.5l-1.3-3.2h2.6zM1.5 12l3.2-1.3v2.6zM22.5 12l-3.2 1.3v-2.6zM4.6 4.6l3.2 1.4-1.8 1.8zM19.4 19.4l-3.2-1.4 1.8-1.8zM4.6 19.4l1.4-3.2 1.8 1.8zM19.4 4.6l-1.4 3.2-1.8-1.8z'/%3E%3C/svg%3E") no-repeat center/contain;
}

/* 15 · Hervorgehobene Sätze in Handschrift --------------------------------------- */
.single-post #main .entry-content .hw-zitat{position:relative;max-width:38rem;margin-top:3rem;margin-bottom:3rem;padding:0 0 2rem;border:0;background:none;text-align:center}
.single-post #main .entry-content .hw-zitat::before{content:none;display:none}
.single-post #main .entry-content .hw-zitat::after{
  content:"";position:absolute;left:50%;bottom:0;width:4.5rem;height:1rem;transform:translateX(-50%);
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 72 16'%3E%3Cpath d='M3 8Q9.5 2 16 8T29 8T42 8T55 8T68 8' fill='none' stroke='%23F7BD3D' stroke-width='2.5' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
.single-post #main .entry-content .hw-zitat p{margin:0;font-family:var(--hw-hand);font-size:clamp(2.1rem,1.45rem + 2.6vw,3.2rem);font-weight:400;line-height:1.22;letter-spacing:0;color:var(--hw-petrol);text-wrap:balance}

/* 16 · Wer schreibt -------------------------------------------------------------- */
.single-post #main .entry-content .hw-autor{
  display:grid;grid-template-columns:auto 1fr;column-gap:1.5rem;row-gap:.15rem;align-items:center;
  margin-top:2.5rem;margin-bottom:2rem;padding:1.75rem 0;border-top:1px solid var(--hw-nebel);border-bottom:1px solid var(--hw-nebel);
}
.single-post #main .entry-content .hw-autor__foto{grid-row:span 3;width:6rem;height:6rem;margin:0;border-radius:50%;object-fit:cover;object-position:50% 25%;box-shadow:0 0 0 5px var(--hw-sand)}
.single-post #main .entry-content .hw-autor__name{margin:0;font-family:var(--hw-hand);font-size:2.5rem;font-weight:400;line-height:1;color:var(--hw-petrol)}
.single-post #main .entry-content .hw-autor__rolle{margin:0;font-size:.95rem;font-weight:700;line-height:1.4;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-autor__text{margin:.35rem 0 0;font-size:1rem;line-height:1.65}

/* 17 · Abschlussband ------------------------------------------------------------- */
.single-post #main .entry-content .hw-abschluss__text{font-size:clamp(1.15rem,1rem + .6vw,1.4rem);line-height:1.6;font-weight:500;color:var(--hw-weiss)}
.single-post #main .entry-content .hw-band > .hw-abschluss__text,
.single-post #main .entry-content .hw-band .elementor-widget-container > .hw-abschluss__text{margin-bottom:1.75rem}
.single-post #main .entry-content .hw-abschluss__aktionen{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem}
.single-post #main .entry-content .hw-knopf{
  display:inline-flex;align-items:center;justify-content:center;min-height:2.9rem;padding:.7rem 1.4rem;
  border:2px solid var(--hw-sonne);border-radius:6px;background:var(--hw-sonne);
  font-family:var(--hw-sans);font-size:1rem;font-weight:600;line-height:1.2;color:var(--hw-nachtblau);text-decoration:none;
  box-shadow:0 6px 14px -6px rgba(0,0,0,.4);transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease;
}
.single-post #main .entry-content .hw-knopf:hover{background:#FFD066;border-color:#FFD066;color:var(--hw-nachtblau);transform:translateY(-1px)}
.single-post #main .entry-content .hw-knopf--hell{background:transparent;border-color:rgba(255,255,255,.7);color:var(--hw-weiss);box-shadow:none}
.single-post #main .entry-content .hw-knopf--hell:hover{background:rgba(255,255,255,.12);border-color:var(--hw-weiss);color:var(--hw-weiss)}
.single-post #main .entry-content .hw-band--petrol .hw-knopf:focus-visible{outline-color:var(--hw-weiss)}

/* 18 · Häufige Fragen. .opt-faq bleibt, sie speist das FAQ-Schema ---------------- */
.single-post #main .entry-content > .opt-faq,
.single-post #main .entry-content .elementor-widget-container > .opt-faq{margin-top:1rem;margin-bottom:2rem;border-top:1px solid var(--hw-nebel)}
.single-post #main .entry-content .opt-faq details{margin:0;border:0;border-bottom:1px solid var(--hw-nebel);border-radius:0;background:none;overflow:visible}
.single-post #main .entry-content .opt-faq summary{
  position:relative;padding:1.1rem 3.25rem 1.1rem 0;cursor:pointer;list-style:none;background:none;
  font-size:1.08rem;font-weight:700;line-height:1.45;color:var(--hw-nachtblau);
}
.single-post #main .entry-content .opt-faq summary::-webkit-details-marker{display:none}
.single-post #main .entry-content .opt-faq summary::after{
  content:"";position:absolute;right:.25rem;top:50%;width:2rem;height:2rem;margin-top:-1rem;border:0;border-radius:50%;transform:none;
  background:var(--hw-sand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23335B6B' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M8 3v10M3 8h10'/%3E%3C/svg%3E") no-repeat center/.85rem;
  transition:transform .25s ease,background-color .25s ease;
}
.single-post #main .entry-content .opt-faq summary:hover{color:var(--hw-petrol)}
.single-post #main .entry-content .opt-faq details[open] summary::after{transform:rotate(45deg);background-color:var(--hw-sonne-hell)}
.single-post #main .entry-content .opt-faq details > p{margin:-.15rem 0 0;padding:0 3.25rem 1.25rem 0;font-size:1.02rem;line-height:1.75}

/* 19 · Weiterlesen --------------------------------------------------------------- */
.single-post #main .entry-content > .hw-weiterlesen,
.single-post #main .entry-content .elementor-widget-container > .hw-weiterlesen{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1rem;list-style:none;margin-top:1rem;padding:0;background:none;border-radius:0}
.single-post #main .entry-content .hw-weiterlesen li{margin:0;padding:0}
.single-post #main .entry-content .hw-weiterlesen li::before{content:none}
.single-post #main .entry-content .hw-weiterlesen a{
  display:block;height:100%;padding:1.35rem 1.4rem 1.45rem;border-radius:10px;background:var(--hw-sand);
  font-size:1rem;font-weight:500;line-height:1.5;color:var(--hw-text);text-decoration:none;
  box-shadow:0 10px 24px -18px rgba(37,58,97,.6);transition:background-color .2s ease;
}
.single-post #main .entry-content .hw-weiterlesen strong{display:block;margin-bottom:.3rem;font-size:1.12rem;font-weight:700;line-height:1.35;color:var(--hw-nachtblau)}
.single-post #main .entry-content .hw-weiterlesen a:hover{background:#FBEFD0}
.single-post #main .entry-content .hw-weiterlesen a:hover strong{text-decoration:underline;text-decoration-color:var(--hw-sonne);text-decoration-thickness:2px;text-underline-offset:.2em}

/* 20 · Tablet und Smartphone ----------------------------------------------------- */
@media (max-width:860px){
  .single-post #main .entry-content .hw-band > .hw-wege,
  .single-post #main .entry-content .hw-band .elementor-widget-container > .hw-wege{grid-template-columns:1fr;max-width:30rem}
}
@media (max-width:689.98px){
  .single-post #main .entry-content{font-size:1.0625rem;line-height:1.75}
  .single-post #main .hero-section .page-description,
  .single-post #main .hero-section .page-description.ct-hidden-sm{margin-top:1.1rem}
  .single-post #main .entry-content .hw-kurz__antwort{font-size:1.05rem}
  .single-post #main .entry-content .hw-hinweis{padding:1.25rem 1.15rem 1.2rem}
  .single-post #main .entry-content .hw-hinweis::before{position:static;display:block;margin-bottom:.7rem}
  .single-post #main .entry-content .hw-vergleich{grid-template-columns:1fr}
  .single-post #main .entry-content .hw-vergleich__seite,
  .single-post #main .entry-content .hw-vergleich__seite:first-child{padding:0;border-left:0}
  .single-post #main .entry-content .hw-vergleich__seite + .hw-vergleich__seite{margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--hw-nebel)}
  .single-post #main .entry-content .hw-autor{column-gap:1rem}
  .single-post #main .entry-content .hw-autor__foto{grid-row:span 2;width:4.75rem;height:4.75rem}
  .single-post #main .entry-content .hw-autor__name{font-size:2.1rem}
  .single-post #main .entry-content .hw-autor__text{grid-column:1 / -1;margin-top:1rem}
  .single-post #main .entry-content .hw-inhalt ol{padding-left:.25rem;columns:1}
  .single-post #main .entry-content .opt-faq details > p{padding-right:0}
  .single-post #main .entry-content .hw-tabelle thead tr > :first-child{width:27%}
  .single-post #main .entry-content .hw-tabelle :is(th,td){padding:.7rem .55rem;font-size:.92rem;-webkit-hyphens:auto;hyphens:auto;overflow-wrap:anywhere}
  .single-post #main .entry-content .hw-tabelle tbody th{white-space:normal}
}
@media (max-width:480px){
  .single-post #main .entry-content .hw-inhalt summary span{display:none}
}

/* 21 · Bewegung nur auf Wunsch --------------------------------------------------- */
@media (prefers-reduced-motion:no-preference){html:has(> body.single-post){scroll-behavior:smooth}}
@media (prefers-reduced-motion:reduce){.single-post #main *{transition:none!important}}

/* ==========================================================================
   22 · Nachtrag der Umsetzung, 15.09.2026
   Zwei Lücken, die beim Einbau aufgefallen sind. Die Vorlage darüber ist
   unverändert; hier steht nur, was fehlte. Original gesichert unter
   ~/beitrags-master.css.vorlage-original.bak
   ========================================================================== */

/* a) Die Umbruchregel für die drei Karten hing an .hw-band > .hw-wege.
      Ein hw-wege AUSSERHALB eines Farbbands blieb damit auf dem Telefon
      dreispaltig. Jetzt bricht es überall um. */
@media (max-width:860px){
  .single-post #main .entry-content .hw-wege{grid-template-columns:1fr;max-width:30rem}
}

/* b) Die vier Eckdaten in „Kurz gesagt" standen fest in zwei Spalten, ohne
      Umbruchregel. Auf schmalen Geräten drängen sich Symbol, fette Zeile und
      Text nebeneinander. Unter 420 px bekommt jede Angabe eine eigene Zeile. */
@media (max-width:420px){
  .single-post #main .entry-content .hw-kurz__fakten{grid-template-columns:1fr;gap:.85rem}
}

/* c) Lesebreite und Schriftgröße, 16.09.2026.
      Gewünscht war ein breiterer Textbereich. Breiter allein wäre schlechter
      gewesen: gemessen an Quicksand 500 gegen den echten Beitragstext ist die
      mittlere Zeichenbreite 0,4732 em. Bei 42 rem und 1,125 rem Schrift trug
      eine Zeile damit bereits 79 Zeichen — empfohlen sind 45 bis 75. Reines
      Verbreitern auf 46 rem hätte 86 Zeichen ergeben.
      Deshalb wächst die Schrift mit: 46 rem bei 1,25 rem ergibt 78 Zeichen,
      also einen um 10 % breiteren und um 11 % größeren Textblock bei
      unveränderter Zeilenlänge. */
.single-post{
  --hw-lesebreite:75rem;
  --hw-breit:84rem;
}
.single-post #main .entry-content{
  font-size:1.25rem;
}
@media (max-width:689.98px){
  .single-post #main .entry-content{font-size:1.125rem;line-height:1.75}
}

/* 23 · Elementor-Ebene, 16.09.2026 ------------------------------------------------
   Die Abschnitte 1 bis 22 sprechen den Inhalt als direktes Kind von
   .entry-content an. Das stimmt für klassisch geschriebene Beiträge. Wird ein
   Beitrag mit Elementor gebaut, schiebt sich die Kette

       .elementor > .e-con > .elementor-element > .elementor-widget-container

   dazwischen und sämtliche Direktkind-Regeln laufen ins Leere. Am Musterbeitrag
   gemessen betraf das die Lesespalte, die Listenpunkte und alle vier Farbbänder.
   Die Selektoren oben tragen deshalb jeweils ihr Gegenstück. Hier steht nur,
   was in der klassischen Fassung kein Gegenstück hat. Keine neuen Farben,
   keine neuen Maße — es werden dieselben Merkmale verwendet. */

/* Die Elementor-Hülle bekäme über ".entry-content > *" die Lesebreite und
   würde damit die Bänder einsperren. Die Breite tragen die Widgets. */
.single-post #main .entry-content > .elementor{max-width:none;margin-left:0;margin-right:0}

/* Elementor-Container sind Flex-Boxen mit eigenem Abstand und eigener
   Innenpolsterung aus dem Kit. Beides würde zum Rhythmus der Vorlage
   hinzukommen. Der Abstand steht in der Vorlage, nicht im Container. */
.single-post #main .entry-content .elementor > .e-con{
  --content-width:var(--hw-lesebreite);--gap:0px;--row-gap:0px;--column-gap:0px;row-gap:0;column-gap:0;padding:0;
}
.single-post #main .entry-content .elementor > .e-con > .e-con-inner > .elementor-element:last-child{margin-bottom:0}

/* In einer Flex-Box fallen benachbarte Außenabstände nicht mehr zusammen.
   Ohne Ausgleich addierte sich der Fußabstand des vorigen Widgets von 1,35 rem
   auf den Kopfabstand der Überschrift, statt in ihm aufzugehen. Deshalb trägt
   hier das Widget den Abstand und die Überschrift selbst keinen. */
.single-post #main .entry-content .elementor-widget-heading .elementor-heading-title{margin-top:0;margin-bottom:0}
.single-post #main .entry-content .elementor > .e-con > .e-con-inner > .elementor-widget-heading{
  margin-top:calc(clamp(3.25rem,2.4rem + 2.6vw,4.75rem) - 1.35rem);margin-bottom:1rem;
}
.single-post #main .entry-content .elementor > .e-con:first-child > .e-con-inner > .elementor-widget-heading:first-child,
.single-post #main .entry-content .elementor > .e-con.hw-band > .e-con-inner > .elementor-widget-heading{margin-top:0}

/* Der Sprunganker des Inhaltsverzeichnisses sitzt jetzt am Widget, nicht mehr
   an der Überschrift. Der Absatz zur festen Kopfzeile muss mitwandern. */
.single-post #main .entry-content .elementor-widget-heading[id]{scroll-margin-top:7rem}

/* Häufige Fragen als Karten. Ersetzt die Haarlinien-Liste von vorher.
   Ausgangslage: Frage 1,08 rem, Antwort 1,02 rem — beide KLEINER als der
   Fließtext mit 1,25 rem. Dadurch wirkte der wichtigste Bereich des Beitrags
   wie ein Anhang. Die Größen sind jetzt am Lesetext ausgerichtet.

   Auszeichnung von Elementor 4: details.e-n-accordion-item mit
   summary.e-n-accordion-item-title, darin ein span für die Frage und eines für
   das Plus-/Minus-Zeichen. Keine neue Farbe — alles aus Abschnitt 1. */
.single-post #main .entry-content .elementor-widget-n-accordion .e-n-accordion,
.single-post #main .entry-content .elementor-widget-nested-accordion .e-n-accordion{
  display:flex;flex-direction:column;gap:.8rem;
}
.single-post #main .entry-content .e-n-accordion-item{
  border:1px solid var(--hw-sand-linie);border-radius:12px;background:var(--hw-weiss);
  box-shadow:var(--hw-schatten-karte);
  transition:border-color .2s ease,background-color .2s ease;
}
.single-post #main .entry-content .e-n-accordion-item:hover{border-color:var(--hw-nebel)}
.single-post #main .entry-content .e-n-accordion-item[open]{
  background:var(--hw-nebel-hell);border-color:var(--hw-nebel);
}
.single-post #main .entry-content .e-n-accordion-item-title{
  display:flex;align-items:center;gap:1rem;
  padding:1.2rem 1.4rem;cursor:pointer;list-style:none;
}
.single-post #main .entry-content .e-n-accordion-item-title::-webkit-details-marker{display:none}
.single-post #main .entry-content .e-n-accordion-item-title-header{flex:1 1 auto;min-width:0}
.single-post #main .entry-content h3.e-n-accordion-item-title-text{
  margin:0;font-family:var(--hw-sans);font-size:1.2rem;font-weight:600;line-height:1.4;
  color:var(--hw-petrol);text-wrap:pretty;
}
.single-post #main .entry-content .e-n-accordion-item[open] h3.e-n-accordion-item-title-text{color:var(--hw-nachtblau)}

/* Das Plus sitzt in einem ruhigen Kreis und wechselt beim Öffnen auf Sonne —
   dasselbe Signal wie im klassischen FAQ-Block in Abschnitt 18. */
.single-post #main .entry-content .e-n-accordion-item-title-icon{
  flex:0 0 auto;display:grid;place-items:center;width:2.1rem;height:2.1rem;
  border-radius:50%;background:var(--hw-nebel-hell);transition:background-color .2s ease;
}
.single-post #main .entry-content .e-n-accordion-item[open] .e-n-accordion-item-title-icon{background:var(--hw-sonne-hell)}
.single-post #main .entry-content .e-n-accordion-item-title-icon svg{
  width:.8rem;height:.8rem;fill:var(--hw-petrol);
}
.single-post #main .entry-content .e-n-accordion-item-title:focus-visible{
  outline:3px solid var(--hw-sonne);outline-offset:3px;border-radius:12px;
}
.single-post #main .entry-content .e-n-accordion-item > .e-con{padding:0 1.4rem 1.3rem}
.single-post #main .entry-content .e-n-accordion-item p{
  margin:0 0 .8rem;font-size:1.1rem;line-height:1.75;color:var(--hw-text);
}
.single-post #main .entry-content .e-n-accordion-item p:last-child{margin-bottom:0}

@media (max-width:689.98px){
  .single-post #main .entry-content .e-n-accordion-item-title{padding:1rem 1.1rem;gap:.75rem}
  .single-post #main .entry-content h3.e-n-accordion-item-title-text{font-size:1.08rem}
  .single-post #main .entry-content .e-n-accordion-item > .e-con{padding:0 1.1rem 1.1rem}
  .single-post #main .entry-content .e-n-accordion-item p{font-size:1.02rem}
}

/* 24 · Lesebreite auf Layoutbreite, 16.09.2026 ------------------------------------
   Auf Wunsch des Betreibers steht die Textspalte jetzt auf 1200 px und damit auf
   derselben Breite wie das übrige Layout (Blocksy: --theme-normal-container-max-width).

   Gemessen an Quicksand 500 mit der am echten Beitragstext ausgezählten mittleren
   Zeichenbreite von 0,4732 em trägt eine Zeile damit rund 127 Zeichen. Empfohlen
   sind 45 bis 75. Das ist eine bewusste Entscheidung und hier festgehalten, damit
   es später niemand für ein Versehen hält.

   Wer die Zeile kürzen will, ohne die Spalte zu verschmälern, erhöht die Schrift:
   24 px ergibt 106 Zeichen, 26 px ergibt 97, 32 px ergibt 79.

   --hw-breit wächst mit auf 84rem, damit „alignwide" weiterhin breiter ist als der
   Lesetext und nicht schmaler. */

/* 25 · Bausteine der Seite, 16.09.2026 -------------------------------------------
   Beiträge nutzen ab jetzt die Elementor-Bausteine, die die Seite ohnehin führt:
   button-Widgets statt <a class="hw-knopf">, heading-Widgets mit der Typografie
   des Kits (h2 „Secondary Gellatio" 2,1 em, h3 „Subtitle Gellatio" 1,8 em, Farbe
   primary), Bänder über den nativen Containerhintergrund, Akkordeon mit denselben
   globalen Verweisen wie /hormonschnelltest/ und /detox/.

   Der Gewinn: all das hängt über __globals__ am Kit. Ändert jemand dort eine
   Farbe oder eine Schrift, wandern die Beiträge mit. Handgeschriebenes HTML tut
   das nicht — das war der eigentliche Grund für den Umbau.

   Deshalb stehen die Schriftregeln für h2/h3/h4 oben unter
   :not(.elementor-heading-title): sie gelten weiter für klassisch geschriebene
   Beiträge, treten aber beiseite, wo ein heading-Widget steht.

   Die Abstände der Überschriften bleiben in Abschnitt 23, weil sie am Widget
   hängen und nicht an der Schrift. */

/* Der Knopf im Fließtext soll nicht gegen die Lesespalte kämpfen. */
.single-post #main .entry-content .elementor-widget-button{margin-top:.5rem}
.single-post #main .entry-content .elementor-widget-button .elementor-button{text-decoration:none}


/* 27 · Mitte im Band, 16.09.2026 ------------------------------------------------
   Im klassischen Beitrag zentrierte ".hw-band > *" jedes direkte Kind. Unter
   Elementor sind die direkten Kinder die Widgets, der eigentliche Absatz liegt
   eine Ebene tiefer im .elementor-widget-container. Die Breitenbegrenzung von
   38 rem griff deshalb, die automatischen Seitenränder nicht — der Block stand
   linksbündig in der 1200 px breiten Spalte, nur der Text darin war zentriert.
   Das sah aus wie ein Satzfehler und war einer. */
.single-post #main .entry-content .e-con.hw-band > .e-con-inner{
  align-items:center;
}
.single-post #main .entry-content .e-con.hw-band > .e-con-inner > .elementor-element{
  width:100%;
}