.blog-card-image{aspect-ratio:16/9;background:#e8f1ef;display:grid;place-items:center}
.blog-card-image img{object-fit:contain;background:#e8f1ef}
.blog-card.is-featured .blog-card-image{aspect-ratio:16/9;min-height:0}
.blog-card-footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;width:100%;margin-top:auto;padding-top:.75rem;border-top:1px solid #e0e9e7}
.blog-view-count{display:inline-flex;align-items:center;gap:.35rem;color:#657b7d;font-size:.75rem;font-weight:700}
.blog-card-engagement{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .8rem}.blog-comment-count{display:inline-flex;align-items:center;gap:.35rem;color:#657b7d;font-size:.75rem;font-weight:700}
.blog-article-cover{aspect-ratio:16/9;display:grid;place-items:center;position:relative;background:#e8f1ef}
.blog-article-cover img{width:100%;height:100%;max-height:none;object-fit:contain}
.blog-article-cover figcaption{position:absolute;right:0;bottom:0;max-width:80%;background:rgba(255,255,255,.9);border-radius:6px 0 0 0}
.blog-article-footer{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;padding:1rem 1.25rem;border-top:1px solid #dce7e4;color:#607779;font-size:.75rem}
.blog-article-footer span{display:inline-flex;align-items:center;gap:.4rem}.blog-article-footer i{color:#168170}.blog-article-footer strong{color:#183f43}
@media(min-width:700px){.blog-article-footer{padding:1.15rem 2rem}}
@media(max-width:699.98px){.blog-card-footer{align-items:flex-end}.blog-card-engagement{display:grid;gap:.25rem}.blog-article-cover figcaption{max-width:100%}}

/* Einheitliche Steuerelemente in der öffentlichen Blog-Filterleiste. */
.blog-filter-panel form{--blog-filter-control-height:48px}
.blog-filter-panel form>.blog-search-field,
.blog-filter-panel form>.blog-park-filter,
.blog-filter-panel form>label:not(.blog-search-field),
.blog-filter-panel form>.btn{height:var(--blog-filter-control-height);min-height:var(--blog-filter-control-height)}
.blog-filter-panel form>.blog-search-field>.form-control,
.blog-filter-panel form>label:not(.blog-search-field)>.form-select,
.blog-filter-panel form>.blog-park-filter>.blog-park-filter-toggle{width:100%;height:100%;min-height:0}
.blog-filter-panel form>.btn{width:100%}
.blog-filter-panel form>.btn{display:inline-flex;align-items:center;justify-content:center;padding-block:0}

.blog-comments{margin-top:1rem;padding:1rem;border:1px solid #d2e0dd;border-radius:8px;background:#fff}.blog-comments-head{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}.blog-comments-head h2{display:flex;align-items:center;gap:.45rem;margin:.15rem 0;font-size:1.35rem}.blog-comments-head h2 span{display:inline-grid;min-width:1.75rem;height:1.75rem;padding:0 .35rem;place-items:center;border-radius:999px;background:#e0f3ec;color:#116b5d;font-size:.75rem}.blog-comments-head p{margin:0;color:#607779}.blog-comment-form{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:.75rem;padding:1rem;border:1px solid #cfe0db;border-radius:8px;background:#f5faf8}.blog-comment-form label{display:grid;gap:.35rem}.blog-comment-form label>span{font-weight:800}.blog-comment-form label small{color:#6a7f80;text-align:right}.blog-comment-form .btn{grid-column:2;justify-self:end}.blog-comment-avatar{display:grid;width:2.75rem;height:2.75rem;overflow:hidden;place-items:center;flex:0 0 auto;border-radius:50%;background:#d9f1e8;color:#0b5f53;text-decoration:none;font-size:.75rem;font-weight:900}.blog-comment-avatar img{width:100%;height:100%;object-fit:cover}.blog-comment-list{display:grid;gap:0;margin:1rem 0 0;padding:0;list-style:none}.blog-comment-list>li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:.75rem;padding:1rem 0;border-top:1px solid #dce7e4}.blog-comment-content{min-width:0}.blog-comment-content header{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}.blog-comment-content header a{display:flex;align-items:baseline;gap:.35rem;min-width:0;color:#143d41;text-decoration:none}.blog-comment-content header small,.blog-comment-content time{color:#718385;font-size:.75rem}.blog-comment-content p{margin:.45rem 0 0;color:#29484c;line-height:1.55;overflow-wrap:anywhere}.blog-comment-remove button{display:grid;width:2rem;height:2rem;place-items:center;border:0;border-radius:6px;background:transparent;color:#758889}.blog-comment-remove button:hover,.blog-comment-remove button:focus-visible{background:#fff0ed;color:#b54835}.blog-comments-empty{display:grid;justify-items:center;gap:.25rem;padding:2rem 1rem;color:#607779;text-align:center}.blog-comments-empty i{font-size:1.5rem;color:#238173}.blog-comments-empty p{margin:0}.blog-comments-empty strong{color:#173f43}
@media(min-width:700px){.blog-comments{padding:1.5rem 2rem}}
@media(max-width:699.98px){.blog-comments-head{display:grid}.blog-comments-head .btn{width:100%}.blog-comment-form{grid-template-columns:auto minmax(0,1fr);padding:.8rem}.blog-comment-form .blog-comment-avatar{width:2.35rem;height:2.35rem}.blog-comment-form label{grid-column:2}.blog-comment-form .btn{grid-column:1/-1;width:100%}.blog-comment-list>li{grid-template-columns:auto minmax(0,1fr)}.blog-comment-remove{position:absolute;right:0;top:.65rem}.blog-comment-content header{display:grid;padding-right:2rem}.blog-comment-content header a{display:grid;gap:0}.blog-comment-content time{margin-top:.15rem}}

/* Der Artikel nutzt die volle Inhaltsbreite. Park- und Attraktionsbezug folgen
   als eigener Kontextbereich nach dem redaktionellen Text. */
.blog-article-layout{display:block}
.blog-article-body{width:100%;max-width:980px;margin-inline:auto}
.blog-article-aside{position:static;display:grid;grid-template-columns:minmax(0,1fr);gap:.8rem;padding:1rem 1.25rem 1.25rem;border-top:1px solid #dce7e4;background:#fbfdfc}
.blog-article-aside>section{min-width:0;margin:0}
@media(min-width:700px){.blog-article-aside{grid-template-columns:repeat(2,minmax(0,1fr));padding:1.25rem 2rem 2rem}.blog-article-aside>:only-child{grid-column:1/-1}}
@media(min-width:1050px){.blog-article-layout{display:block}.blog-article-aside{position:static;top:auto;padding:1.4rem 2rem 2rem}}


/* Blog-Kommentare: kompakte Feed-Optik mit Antworten, Likes und Emoji-Composer. */
.blog-comments { margin-top: 1rem; padding: 1rem; }
.blog-comments-head { margin-bottom: .65rem; }
.blog-comment-form { grid-template-columns: auto minmax(0,1fr); gap: .55rem; padding: .7rem 0; border: 0; border-top: 1px solid #e0e9e6; border-radius: 0; background: transparent; }
.blog-comment-compose { display: grid; min-width: 0; gap: .35rem; }
.blog-comment-input-row { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: end; gap: .42rem; }
.blog-comment-input-row textarea { width: 100%; min-height: 2.75rem; max-height: 8.25rem; padding: .62rem .72rem; resize: none; border: 1px solid #c8dcd4; border-radius: 8px; background: #fff; color: #173c40; outline: 0; font-size: .84rem; line-height: 1.4; }
.blog-comment-input-row textarea:focus { border-color: #7fb6a2; box-shadow: 0 0 0 3px rgba(47,112,98,.08); }
.blog-comment-tool,.blog-comment-send { display: grid; width: 2.75rem; height: 2.75rem; place-items: center; padding: 0; border: 1px solid #cbded6; border-radius: 8px; background: #f3f8f6; color: #315b56; }
.blog-comment-send { border-color: #2f7062; background: #2f7062; color: #fff; }
.blog-comment-reply-context { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .38rem .5rem; border-radius: 6px; background: #eaf6f1; color: #416a61; font-size: .75rem; }
.blog-comment-reply-context[hidden] { display: none; }
.blog-comment-reply-context button { display: grid; width: 1.65rem; height: 1.65rem; place-items: center; border: 0; border-radius: 50%; background: transparent; color: inherit; }
.blog-comment-list { gap: .5rem; margin-top: .65rem; }
.blog-comment-list>li { grid-template-columns: auto minmax(0,1fr); gap: .5rem; padding: 0; border: 0; }
.blog-comment-list>li.is-reply { margin-left: 2.8rem; }
.blog-comment-list .blog-comment-avatar { width: 2.35rem; height: 2.35rem; }
.blog-comment-main { min-width: 0; }
.blog-comment-bubble { padding: .58rem .72rem; border: 1px solid #e0ebe7; border-radius: 8px; background: #f2f7f5; }
.blog-comment-bubble header a { display: flex; flex-wrap: wrap; align-items: baseline; gap: .15rem .4rem; color: #173e42; text-decoration: none; }
.blog-comment-bubble header strong { font-size: .78rem; }
.blog-comment-bubble header small { color: #718582; font-size: .75rem; font-weight: 600; }
.blog-comment-bubble p { margin: .22rem 0 0; color: #29484c; font-size: .76rem; line-height: 1.45; overflow-wrap: anywhere; }
.blog-comment-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .12rem; margin-top: .12rem; padding-left: .15rem; }
.blog-comment-actions form { margin: 0; }
.blog-comment-actions button,.blog-comment-actions>span { display: inline-flex; min-height: 1.8rem; align-items: center; gap: .25rem; padding: .18rem .42rem; border: 0; border-radius: 5px; background: transparent; color: #59736e; font-size: .75rem; font-weight: 800; }
.blog-comment-actions button:hover { background: #edf5f2; color: #244f48; }
.blog-comment-actions button.is-active { color: #b43e48; }
.blog-comment-actions b { font-size: inherit; }
.blog-comment-remove button { width: auto; height: auto; color: #7b625f; }
.blog-comment-emoji-control .community-emoji-picker { bottom: calc(100% + .5rem); left: 0; }
@media(max-width:699.98px){
  .blog-comments { padding: .85rem .75rem; }
  .blog-comment-form { grid-template-columns: auto minmax(0,1fr); padding: .65rem 0; }
  .blog-comment-list>li.is-reply { margin-left: 1.65rem; }
  .blog-comment-tool,.blog-comment-send { width: 2.6rem; height: 2.6rem; }
  .blog-comment-input-row textarea { min-height: 2.6rem; }
}

/* Ausklappbare Inhalte und Prompt-Sammlung */
.blog-article-body details.blog-accordion {
  margin: 1.15rem 0;
  border: 1px solid #c9ded7;
  border-radius: 10px;
  background: #f6faf8;
  overflow: hidden;
}
.blog-article-body details.blog-accordion > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .8rem;
  min-height: 3.1rem;
  padding: .78rem 1rem;
  color: #123b3f;
  font-weight: 850;
  cursor: pointer;
  list-style: none;
}
.blog-article-body details.blog-accordion > summary::-webkit-details-marker { display: none; }
.blog-article-body details.blog-accordion > summary::after {
  flex: 0 0 auto;
  color: #2f7062;
  content: '+';
  font-size: 1.25rem;
  font-weight: 500;
  line-height: 1;
}
.blog-article-body details.blog-accordion[open] > summary {
  border-bottom: 1px solid #d7e6e0;
  background: #edf7f3;
}
.blog-article-body details.blog-accordion[open] > summary::after { content: '−'; }
.blog-accordion-body { padding: .9rem 1rem 1rem; }
.blog-accordion-body > :first-child { margin-top: 0; }
.blog-accordion-body > :last-child { margin-bottom: 0; }
.blog-article-body details.blog-prompt { border-color: #bad8cc; background: #f4faf7; }
.blog-article-body .blog-prompt-text {
  margin: .2rem 0 .8rem;
  padding: .9rem 1rem;
  overflow-x: auto;
  border: 1px solid #d2e5dd;
  border-radius: 8px;
  background: #fff;
  color: #173c40;
  font: .9rem/1.65 ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.blog-article-body .blog-prompt-text code { font: inherit; }
.blog-prompt-copy {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .4rem;
  min-height: 2.35rem;
  padding: .5rem .75rem;
  border: 1px solid #9ecbbb;
  border-radius: 7px;
  background: #e8f5ef;
  color: #176451;
  font: inherit;
  font-size: .8rem;
  font-weight: 850;
  cursor: pointer;
  transition: background .16s ease, border-color .16s ease, color .16s ease;
}
.blog-prompt-copy:hover,.blog-prompt-copy:focus-visible { border-color: #6cac98; background: #d9efe5; color: #0e4d40; }
.blog-prompt-copy.is-copied { border-color: #2f8d70; background: #2f8d70; color: #fff; }
@media(max-width:699.98px){
  .blog-article-body details.blog-accordion > summary { padding-inline: .8rem; }
  .blog-accordion-body { padding-inline: .8rem; }
  .blog-article-body .blog-prompt-text { font-size: .82rem; }
}

/* Prompt-Showcases: Ergebnis und kopierbaren Prompt als eine klare Einheit
   darstellen, statt Bilder und Accordions lose im Artikel zu verteilen. */
.blog-prompt-showcase {
  margin: 2rem 0;
  padding: 1.25rem;
  border: 1px solid #c9ded7;
  border-radius: 16px;
  background: linear-gradient(145deg, #f7fbf9 0%, #eef7f3 100%);
  box-shadow: 0 8px 24px rgba(21, 67, 62, .06);
}
.blog-prompt-heading { margin-bottom: 1rem; }
.blog-prompt-kicker,
.blog-prompt-result-label {
  display: block;
  color: #2f806f;
  font-size: .72rem;
  font-weight: 900;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.blog-prompt-heading h3 {
  margin: .25rem 0 .45rem;
  color: #123b3f;
  font-size: clamp(1.15rem, 2vw, 1.45rem);
  line-height: 1.2;
}
.blog-prompt-heading p { margin: 0; color: #466967; line-height: 1.55; }
.blog-prompt-layout {
  display: grid;
  grid-template-columns: minmax(210px, .78fr) minmax(0, 1.22fr);
  align-items: start;
  gap: 1rem;
}
.blog-prompt-result-wrap { min-width: 0; }
.blog-prompt-result-label { margin: 0 0 .45rem .15rem; letter-spacing: .06em; }
.blog-prompt-showcase figure.blog-prompt-result {
  margin: 0;
  overflow: hidden;
  border: 1px solid #d0e2dc;
  border-radius: 12px;
  background: #fff;
}
.blog-prompt-showcase figure.blog-prompt-result img {
  display: block;
  width: 100%;
  max-height: 30rem;
  object-fit: contain;
  background: #e8f2ef;
}
.blog-prompt-showcase figure.blog-prompt-result figcaption { padding: .55rem .7rem; }
.blog-prompt-panel { min-width: 0; }
.blog-prompt-panel details.blog-accordion { margin: 1.35rem 0 0; background: #fff; }
.blog-prompt-panel .blog-accordion-body { padding: .85rem; }
.blog-prompt-panel .blog-prompt-text { max-height: 24rem; overflow: auto; }
@media(max-width:699.98px){
  .blog-prompt-showcase { margin: 1.5rem 0; padding: .9rem; border-radius: 12px; }
  .blog-prompt-layout { grid-template-columns: 1fr; gap: .8rem; }
  .blog-prompt-panel details.blog-accordion { margin-top: 0; }
  .blog-prompt-showcase figure.blog-prompt-result img { max-height: 34rem; }
}