/* Optional hero only; no-hero introduction keeps its approved layout. */
.journal-home-hero { margin: 0; min-width: 0; }
.journal-home-hero .journal-intro { min-width: 0; }
.journal-home-hero-beside { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: var(--journal-space-24); align-items: start; }
.journal-home-hero-beside .journal-intro .wp-block-post-content,
.journal-home-hero-beside .journal-intro .wp-block-post-content:has(> .wp-block-image:first-child) { grid-template-columns: minmax(0, 1fr); }
.journal-home-hero-beside .journal-intro .wp-block-post-content > .wp-block-image:first-child { grid-column: 1; grid-row: auto; justify-self: start; }
.journal-home-hero-banner { display: grid; gap: var(--journal-space-24); }
.journal-home-main > .journal-home-posts + :is(.journal-intro, .journal-home-hero) { margin-block-start: var(--journal-home-section-gap); }
.journal-home-media-card .journal-card-media > a { display: block; width: 100%; height: 100%; }
.journal-home-media-card .journal-card-media img { object-fit: contain; background: var(--journal-tint); }
.journal-home-caption { font-size: .95rem; }
@media (max-width: 700px) {
    .journal-home-hero-beside { grid-template-columns: minmax(0, 1fr); }
}

/* Sparse sections keep normal card widths instead of enlarging one preview. */
.journal-home-posts .journal-grid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }

.journal-home-main > .journal-home-posts:first-child,
.journal-home-main > .screen-reader-text + .journal-home-posts { margin-block-start: 0; }

/* Photo/video captions are complete text, rather than article preview excerpts. */
.journal-home-media-card > p.journal-home-caption { display: block; overflow: visible; -webkit-line-clamp: unset; line-clamp: unset; }

/* Optional media sections use the existing card tokens and container. */
.journal-media-open { display: block; position: relative; width: 100%; height: 100%; padding: 0; border: 0; background: var(--journal-tint); cursor: pointer; }
.journal-media-action { position: absolute; inset: auto 12px 12px auto; background: var(--journal-teal); color: white; border-radius: 6px; padding: 4px 12px; }
.journal-carousel { min-width: 0; }
.journal-carousel-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 48px) / 3); gap: var(--journal-space-24); overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; padding-block: 4px 12px; position: relative; }
.journal-carousel-track > article { scroll-snap-align: start; min-width: 0; }
.journal-carousel-controls, .journal-lightbox-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; }
.journal-carousel-controls { margin-top: var(--journal-space-16); }
.journal-carousel button, .journal-lightbox button { min-height: 44px; min-width: 44px; padding: 6px 12px; border: 1px solid var(--journal-rule); border-radius: 6px; background: var(--journal-surface); color: var(--journal-teal); cursor: pointer; }
.journal-carousel button:disabled, .journal-lightbox button:disabled { opacity: .45; cursor: default; }
.journal-home-media-card button:focus-visible, .journal-carousel :focus-visible, .journal-lightbox :focus-visible { outline: 3px solid var(--journal-gold); outline-offset: 3px; }
.journal-lightbox { width: min(960px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--journal-rule); border-radius: 12px; color: var(--journal-ink); background: var(--journal-surface); }
.journal-lightbox::backdrop { background: rgb(12 32 35 / 80%); }
.journal-lightbox-shell { padding: var(--journal-space-24); }
.journal-lightbox [data-media-close] { float: right; margin-left: 12px; }
.journal-lightbox h2 { font-size: 1.5rem; line-height: 1.5; margin: 0 0 16px; }
.journal-lightbox [data-media-stage] { clear: both; }
.journal-lightbox img { display: block; max-width: 100%; max-height: 65dvh; width: auto; height: auto; margin: auto; object-fit: contain; }
.journal-lightbox video, .journal-lightbox iframe, .journal-inline-player video, .journal-inline-player iframe { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #111; }
.journal-lightbox [data-media-caption] { margin-block: 16px; }
.journal-inline-player { margin-top: 12px; }
.journal-carousel-controls[hidden], .journal-lightbox [hidden] { display: none; }
@media (max-width: 1000px) { .journal-carousel-track { grid-auto-columns: calc((100% - 24px) / 2); } }
@media (max-width: 600px) { .journal-carousel-track { grid-auto-columns: 100%; } .journal-lightbox-shell { padding: var(--journal-space-16); } }
@media (prefers-reduced-motion: reduce) { .journal-carousel-track { scroll-behavior: auto; } }


/* Hero image height is reserved; captions remain in normal document flow. */
.journal-hero-slider { min-width: 0; --hero-height: 460px; }
.journal-hero-height-compact { --hero-height: 320px; }
.journal-hero-height-tall { --hero-height: 600px; }
.journal-hero-slider .journal-carousel-track { grid-auto-columns: 100%; gap: 0; padding: 0; border-radius: 12px; }
.journal-hero-slide { min-width: 0; margin: 0; scroll-snap-align: start; overflow: hidden; border-radius: 12px; background: var(--journal-tint); }
.journal-hero-slide > img { display: block; width: 100%; height: var(--hero-height); object-fit: cover; }
.journal-hero-slide > figcaption { padding: var(--journal-space-24); }
.journal-hero-slide figcaption h2 { font-size: clamp(1.5rem, 2.4vw, 2rem); line-height: 1.5; margin: 0; }
.journal-hero-slide figcaption p { margin: var(--journal-space-12) 0 0; }
.journal-hero-caption { font-size: .9rem; color: var(--journal-muted); }
@media (max-width: 1000px) { .journal-hero-slider { --hero-height: 350px; } .journal-hero-height-compact { --hero-height: 260px; } .journal-hero-height-tall { --hero-height: 460px; } }
@media (max-width: 600px) { .journal-hero-slider { --hero-height: 280px; } .journal-hero-height-compact { --hero-height: 220px; } .journal-hero-height-tall { --hero-height: 360px; } .journal-hero-slide > figcaption { padding: var(--journal-space-16); } }
/* Gallery/lightbox navigation overlays media, never captions or playback controls. */
.journal-carousel:not([data-home-hero]) { position: relative; }
.journal-carousel:not([data-home-hero]) [data-slide-prev], .journal-carousel:not([data-home-hero]) [data-slide-next], .journal-lightbox-controls > button { position: absolute; top: var(--carousel-media-centre, 50%); transform: translateY(-50%); width: 44px; height: 44px; padding: 0; border: 1px solid rgb(255 255 255 / 50%); border-radius: 6px; color: #fff; background: rgb(13 32 35 / 75%); font-size: 1.3rem; z-index: 2; }
.journal-carousel:not([data-home-hero]) [data-slide-prev] { left: 32px; }
.journal-carousel:not([data-home-hero]) [data-slide-next] { right: 32px; }
.journal-carousel:not([data-home-hero]) .journal-carousel-controls button:disabled, .journal-lightbox-controls > button:disabled { opacity: 1; color: #c4cece; cursor: default; }
.journal-lightbox-media { position: relative; }
.journal-lightbox-controls { position: absolute; inset: 0; margin: 0; pointer-events: none; }
.journal-lightbox-controls > button { top: 50%; pointer-events: auto; }
.journal-lightbox-controls [data-media-prev] { left: var(--lightbox-arrow-left, 12px); }
.journal-lightbox-controls [data-media-next] { right: var(--lightbox-arrow-right, 12px); }

/* Hero uses one full-width slide and one overlaid control set; captions stay below. */
.journal-hero-slider { position:relative; }
.journal-hero-slider .journal-carousel-track { scrollbar-width:none; align-items:start; }
.journal-hero-slide[inert] > figcaption { display:none; }
.journal-hero-slider .journal-carousel-track::-webkit-scrollbar { display:none; }
.journal-hero-slider .journal-carousel-controls { margin:0; }
.journal-hero-slider [data-slide-prev], .journal-hero-slider [data-slide-next], .journal-carousel [data-slide-play] { width:44px; height:44px; padding:0; border:1px solid rgb(255 255 255 / 50%); border-radius:6px; background:rgb(13 32 35 / 75%); color:#fff; font-size:1.3rem; }
.journal-hero-slider [data-slide-prev], .journal-hero-slider [data-slide-next] { position:absolute; top:calc(var(--hero-height) / 2); transform:translateY(-50%); z-index:2; }
.journal-hero-slider [data-slide-prev] { left:12px; }
.journal-hero-slider [data-slide-next] { right:12px; }
.journal-hero-slider [data-slide-play] { position:absolute; top:calc(var(--hero-height) - 56px); right:12px; z-index:2; }
.journal-carousel [data-slide-play] svg { width:22px; height:22px; fill:currentColor; vertical-align:middle; }

/* Photo controls occupy the media overlay only; there is no lower control row. */
[data-home-section="photos"] .journal-carousel-controls { position:absolute; inset:0; margin:0; padding:0; pointer-events:none; }
[data-home-section="photos"] .journal-carousel-controls > button { pointer-events:auto; }
[data-home-section="photos"] .journal-carousel [data-slide-play] { position:absolute; top:calc(var(--carousel-media-bottom) - 56px); right:32px; z-index:2; }
[data-home-section="photos"] .journal-carousel .journal-media-action { left:12px; right:auto; }
