/* Controlled public layouts emitted by the PHP renderer and article editor. */
.preview-banner { padding: 12px var(--gutter, 18px); border-bottom: 1px solid var(--line, #2b3543); background: var(--card, #141b25); color: var(--accent, #8cbcff); font: 600 .82rem/1.5 system-ui, sans-serif; text-align: center; }
.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: 24px; }
.cta-row .button { margin-top: 0; }
.button.secondary { background: transparent; color: var(--ink); border-color: var(--line); }
.button.secondary:hover { color: var(--accent); border-color: var(--accent); background: var(--soft); }
.project-description > section { margin-bottom: 36px; }
.project-description > section > h3 { margin-top: 28px; }
.project-card:not(:has(.project-card__media)) { grid-template-columns: 1fr; }
.project-card:not(:has(.project-card__media)) .project-card__body { max-width: 800px; }
.development-hero__media.wrap { margin-inline: auto; }
.development-hero__media .image-note { justify-self: center; }
.journal-body > figure { min-width: 0; margin: 36px 0; padding: 20px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.journal-body > figure img { width: auto; max-width: 100%; height: auto; max-height: 680px; margin: 0 auto; object-fit: contain; }
.journal-body > figure figcaption { margin-top: 16px; color: var(--muted); font-size: .82rem; line-height: 1.7; }
.journal-body > figure figcaption p { margin: 12px 0 0; font-size: .94rem; line-height: 1.7; }
.journal-body .gallery { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 20px; width: 100%; min-width: 0; margin-block: 36px; }
.journal-body .gallery figure { min-width: 0; margin: 0; padding: 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--card); }
.journal-body .gallery img { width: auto; max-width: 100%; height: auto; max-height: 600px; margin: 0 auto; object-fit: contain; }
.journal-body .gallery figcaption { margin-top: 14px; color: var(--muted); font-size: .82rem; line-height: 1.7; }
.journal-body .gallery figcaption p { margin-top: 10px; font-size: .9rem; }
.journal-body figure.wide { width: 100%; }
.journal-body figure.wide img { width: 100%; }
.journal-body figure.image-note { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr); align-items: center; gap: 24px; width: 100%; margin: 36px 0; padding: 20px; border: 1px solid var(--line); }
.journal-body figure.image-note img { width: auto; max-width: 100%; height: auto; max-height: 600px; margin: 0 auto; object-fit: contain; }
.journal-body figure.image-note figcaption { min-width: 0; margin: 0; padding: 0; }
.journal-body figure.image-note figcaption p { color: var(--muted); font-size: .94rem; line-height: 1.75; }
@media (max-width: 700px) {
  .journal-body figure.image-note { grid-template-columns: 1fr; gap: 20px; }
  .journal-body .gallery { grid-template-columns: 1fr; gap: 20px; }
  .journal-body figure.image-note figcaption { padding-top: 16px; border-top: 1px solid var(--line); }
}
@media (max-width: 420px) {
  .journal-body > figure, .journal-body figure.image-note, .journal-body .gallery figure { padding: 16px; }
}