/* ============================================================
   digital-magazin.de — Prose / long-form typography
   For article bodies and content pages.
   Scoped under .dm-prose so it doesn't leak into chrome.
   ============================================================ */

/* “Auch interessant” — nutzt .dm-card--wp/.dm-card--side aus theme.css */
.dm-prose .dm-also-interesting{
  margin:40px 0;
  max-width:100%;
}
.dm-prose .dm-also-interesting__label{
  margin:0 0 12px;
  font-family:var(--dm-font-display);
  font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--dm-text-3);
}
.dm-prose .dm-card--embed.dm-card--wp{
  background:var(--dm-bg);
  border:1px solid var(--dm-line);
  border-radius:8px;
  box-shadow:none;
}
.dm-prose .dm-card--embed.dm-card--wp:hover{
  background:var(--dm-bg);
  border-color:var(--dm-line-strong);
  box-shadow:none;
}
.dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__link{
  padding:14px 16px;
  gap:14px;
  align-items:center;
  min-height:0;
}
.dm-prose .dm-card--embed .dm-card__body{
  padding:0;
}
.dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb{
  width:160px;
  flex:0 0 160px;
  min-height:0;
  height:auto;
  align-self:center;
  border-radius:6px;
  overflow:hidden;
}
.dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb.has-image{
  background:transparent;
  padding:0;
  color:inherit;
  display:flex;
  align-items:center;
  justify-content:center;
}
.dm-prose .dm-card--embed .dm-card__thumb.has-image::after{
  display:none;
}
.dm-prose .dm-card--embed .dm-card__thumb.dm-tile::after{
  display:none;
}
.dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb img,
.dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb .dm-card__img{
  position:static;
  inset:auto;
  width:100% !important;
  height:auto !important;
  max-width:100%;
  max-height:160px;
  object-fit:contain;
  object-position:center;
  display:block;
  border-radius:6px;
}
@media (max-width:640px){
  .dm-prose .dm-card--embed .dm-card__link{
    flex-direction:column;
    align-items:stretch;
    padding:12px;
    gap:12px;
  }
  .dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb{
    width:100%;
    flex:0 0 auto;
    align-self:stretch;
    aspect-ratio:16/9;
    min-height:0;
    max-height:none;
    border-radius:8px;
  }
  .dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb img,
  .dm-prose .dm-card.dm-card--embed.dm-card--side.dm-card--wp .dm-card__thumb .dm-card__img{
    width:100%;
    height:100%;
    max-height:none;
    object-fit:cover;
    object-position:center;
    border-radius:8px;
  }
}
.dm-prose .dm-also-interesting h3.dm-card__title{
  margin:0;
  font-size:17px;
  line-height:1.3;
  scroll-margin-top:0;
}
.dm-prose .dm-also-interesting .dm-card__meta{
  margin:0;
}

.dm-prose{
  font-family:var(--dm-font-body);
  font-size:18px;
  line-height:1.7;
  color:var(--dm-text-2);
  max-width:720px;
}
.dm-prose > *:first-child{margin-top:0}

.dm-prose p{margin:0 0 1.1em}
.dm-prose p:last-child{margin-bottom:0}
.dm-prose p strong{color:var(--dm-text);font-weight:700}
.dm-prose p em{color:var(--dm-text)}

.dm-prose .lede{
  font-size:22px;line-height:1.55;color:var(--dm-text);font-weight:400;
  margin-bottom:24px;
}

.dm-prose h2{
  margin:48px 0 1.25em;
  font-family:var(--dm-font-display);
  font-weight:800;
  font-size:30px;
  line-height:1.2;
  letter-spacing:-0.02em;
  color:var(--dm-text);
  scroll-margin-top:120px;
}
.dm-prose h3{
  margin:36px 0 1.15em;
  font-family:var(--dm-font-display);
  font-weight:700;
  font-size:22px;
  line-height:1.25;
  letter-spacing:-0.01em;
  color:var(--dm-text);
  scroll-margin-top:120px;
}
.dm-prose h4{
  margin:28px 0 1em;
  font-family:var(--dm-font-display);
  font-weight:700;
  font-size:17px;
  color:var(--dm-text);
}
.dm-prose h2 + p,
.dm-prose h3 + p,
.dm-prose h4 + p{margin-top:0}

.dm-prose a{
  color:color-mix(in srgb,var(--dm-text-2) 72%,var(--dm-accent-700));
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:.15em;
  transition:color 180ms ease;
}
.dm-prose a:hover{color:var(--dm-accent-600)}
.dm-prose :is(.dm-card,.dm-also-interesting) a{
  color:inherit;
  text-decoration:none;
}

.dm-prose ul,.dm-prose ol{padding-left:24px;margin:0}
.dm-prose li{margin:0 0 6px}
.dm-prose li::marker{color:var(--dm-accent)}

.dm-prose blockquote{
  position:relative;
  margin:32px 0;
  padding:28px 24px 22px;
  border:1px solid color-mix(in srgb, var(--dm-line) 85%, transparent);
  border-radius:10px;
  background-color:var(--dm-bg-elev);
  background-image:radial-gradient(
    circle at 1px 1px,
    color-mix(in srgb, var(--dm-text) 6%, transparent) 1px,
    transparent 0
  );
  background-size:16px 16px;
  font-family:var(--dm-font-body);
  font-weight:400;
  font-size:clamp(15px, 1.8vw, 18px);
  line-height:1.6;
  letter-spacing:0;
  color:var(--dm-text-2);
  font-style:italic;
}
.dm-prose blockquote::before{
  content:"\201C";
  position:absolute;
  top:6px;
  left:16px;
  font-family:var(--dm-font-display);
  font-size:40px;
  line-height:1;
  font-weight:700;
  font-style:normal;
  color:color-mix(in srgb, var(--dm-accent) 18%, transparent);
  pointer-events:none;
  user-select:none;
}
.dm-prose blockquote > :first-child{margin-top:0}
.dm-prose blockquote p:last-child{margin-bottom:0}
.dm-prose blockquote cite{
  display:block;margin-top:16px;
  font-family:var(--dm-font-body);font-weight:500;font-style:normal;
  font-size:14px;color:var(--dm-text-3);letter-spacing:0.02em;
}
.dm-prose blockquote cite::before{content:"\2014\00a0"}

.dm-prose code{
  font-family:var(--dm-font-mono);
  font-size:0.9em;
  background:var(--dm-surface-2);
  color:var(--dm-text);
  padding:2px 6px;
  border-radius:4px;
}
.dm-prose pre{
  font-family:var(--dm-font-mono);
  font-size:14px;
  line-height:1.6;
  background:var(--dm-surface-2);
  border:1px solid var(--dm-line);
  border-radius:8px;
  padding:18px 20px;
  overflow-x:auto;
  margin:24px 0;
  color:var(--dm-text);
}
.dm-prose pre code{background:transparent;padding:0;color:inherit;font-size:14px}

.dm-prose hr{
  border:0;border-top:1px solid var(--dm-line);
  margin:48px 0;
}

/* ---------- Tables (scroll + borders) ---------- */
.dm-prose .dm-table-wrap,
.dm-prose figure.wp-block-table,
.dm-prose figure.dm-table-scroll{
  display:block;
  width:100%;
  max-width:100%;
  margin:32px 0;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
  border:1px solid var(--dm-line);
  border-radius:8px;
  background:var(--dm-bg-elev);
  box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--dm-bg) 40%, transparent);
}

.dm-prose .dm-table-wrap:focus-visible,
.dm-prose figure.wp-block-table:focus-visible,
.dm-prose figure.dm-table-scroll:focus-visible{
  outline:2px solid var(--dm-accent);
  outline-offset:2px;
}

.dm-prose .dm-table-wrap > table,
.dm-prose figure.wp-block-table > table,
.dm-prose figure.dm-table-scroll > table{
  width:max-content;
  min-width:100%;
  margin:0;
  border-collapse:collapse;
  border-spacing:0;
  font-family:var(--dm-font-body);
  font-size:15px;
  line-height:1.5;
  color:var(--dm-text-2);
  background:transparent;
}

.dm-prose table th,
.dm-prose table td{
  border:1px solid var(--dm-line);
  padding:10px 14px;
  vertical-align:top;
  text-align:left;
}

.dm-prose table th{
  font-family:var(--dm-font-display);
  font-weight:700;
  font-size:14px;
  color:var(--dm-text);
  background:var(--dm-surface-2);
}

.dm-prose table thead th{
  border-bottom-width:2px;
  border-bottom-color:color-mix(in srgb, var(--dm-line) 120%, var(--dm-text-3));
}

.dm-prose table tbody tr:nth-child(even) td{
  background:color-mix(in srgb, var(--dm-surface-2) 40%, transparent);
}

.dm-prose table caption{
  caption-side:bottom;
  padding:10px 14px;
  font-size:14px;
  font-style:italic;
  color:var(--dm-text-3);
  text-align:left;
}

.dm-prose figure.wp-block-table figcaption,
.dm-prose .wp-block-table + figcaption{
  margin-top:10px;
  padding:0 2px;
  font-size:14px;
  color:var(--dm-text-3);
  font-style:italic;
  line-height:1.5;
  border:0;
  background:transparent;
}

/* Striped block style (Gutenberg) */
.dm-prose .wp-block-table.is-style-stripes tbody tr:nth-child(odd) td{
  background:color-mix(in srgb, var(--dm-surface-2) 55%, transparent);
}
.dm-prose .wp-block-table.is-style-stripes tbody tr:nth-child(even) td{
  background:transparent;
}

@media (max-width:640px){
  .dm-prose .dm-table-wrap,
  .dm-prose figure.wp-block-table,
  .dm-prose figure.dm-table-scroll{
    margin:24px -4px;
    width:calc(100% + 8px);
    max-width:calc(100% + 8px);
    border-radius:6px;
  }

  .dm-prose .dm-table-wrap > table,
  .dm-prose figure.wp-block-table > table,
  .dm-prose figure.dm-table-scroll > table{
    font-size:14px;
  }

  .dm-prose table th,
  .dm-prose table td{
    padding:8px 10px;
  }
}

.dm-prose figure{margin:32px 0;max-width:100%}
.dm-prose :is(img,.wp-block-image img,figure img){
  width:100%;max-width:100%;height:auto;display:block;
  object-fit:contain;object-position:center;border-radius:8px;
}
.dm-prose figure .dm-tile{
  width:100%;border-radius:8px;display:block;
  aspect-ratio:unset;padding:14px 16px;
}
.dm-prose .wp-block-image{margin:32px 0;max-width:100%}
.dm-prose .wp-block-image.alignwide,
.dm-prose .wp-block-image.alignfull{
  max-width:100%;
}
.dm-prose figcaption{
  margin-top:10px;font-size:14px;color:var(--dm-text-3);
  font-family:var(--dm-font-body);font-style:italic;line-height:1.5;
}

/* ---------- Callout / Hinweisbox ---------- */
.dm-callout{
  margin:32px 0;padding:20px 22px;
  background:var(--dm-surface-2);
  border-left:3px solid var(--dm-accent);
  border-radius:6px;
}
.dm-callout__label{
  display:inline-block;
  font-family:var(--dm-font-display);
  font-weight:700;font-size:11px;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--dm-accent);
  margin-bottom:6px;
}
.dm-callout p{font-size:16px;color:var(--dm-text-2);margin:0}
.dm-callout p + p{margin-top:8px}

.dm-callout--info  { border-left-color:var(--dm-info) }
.dm-callout--info  .dm-callout__label{ color:var(--dm-info) }
.dm-callout--warn  { border-left-color:var(--dm-warning) }
.dm-callout--warn  .dm-callout__label{ color:var(--dm-warning) }
.dm-callout--danger{ border-left-color:var(--dm-danger) }
.dm-callout--danger.dm-callout__label{ color:var(--dm-danger) }

/* ---------- Pull quote (larger, centred) ---------- */
.dm-pullquote{
  margin:48px -24px;
  padding:32px 24px;
  border-top:1px solid var(--dm-line);
  border-bottom:1px solid var(--dm-line);
  font-family:var(--dm-font-display);
  font-weight:800;
  font-size:36px;
  line-height:1.15;
  letter-spacing:-0.02em;
  color:var(--dm-text);
  text-align:left;
}
.dm-pullquote::before{
  content:"„";color:var(--dm-accent);margin-right:0;
  display:inline-block;line-height:0;vertical-align:-0.06em;
}
.dm-pullquote::after{
  content:"\""; color:var(--dm-accent);
}
@media (max-width:720px){
  .dm-pullquote{margin:32px 0;font-size:26px}
}