/*
 * pages.css — OLLMH Child Theme
 * Page-specific styles: home, features, departments, news, staff, clinic, ward, gallery, events, search, 404, FAQ, contact, application, single layouts.
 */

/* Home hero — WardWatch-style content overlay on slideshow background */
.ollmh-hero {
  position: relative;
  background: var(--color-primary);
  color: var(--color-text-white);
  min-height: 70vh;
  padding: calc(var(--spacing-unit) * 3.5) 0;
  overflow: hidden;
  display: flex;
  align-items: stretch;
}

/* Background slideshow layer — fills the hero, sits behind everything */
.ollmh-hero-slideshow {
  position: absolute;
  inset: 0;
  z-index: 0;
}
.ollmh-hero-slideshow .xslider-wrap {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.ollmh-hero-slideshow .xslider-wrap .slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  background-color: var(--color-primary);
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.ollmh-hero-slideshow .xslider-wrap .slide.active {
  opacity: 1;
  position: absolute;
  inset: 0;
}

/* Dark gradient overlay — kept light and bottom-weighted so the image stays
   clear everywhere. The old 105deg ramp put a 78%-opaque navy stop right in
   the top-left corner, which read as a blue blur over the photo. */
.ollmh-hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(180deg,
    rgba(0, 18, 60, 0.08) 0%,
    rgba(7, 17, 46, 0.20) 55%,
    rgba(0, 18, 60, 0.45) 100%);
}

/* Hero inner — content centered on the hero's vertical midpoint so the
   CTA ("Actions") row sits on the same line as the ‹ › slider arrows.
   Hero padding is symmetric and the inner box has no vertical padding,
   so the content centre and the 50% arrow line coincide exactly. */
.ollmh-hero-inner {
  position: relative;
  z-index: 2;
  max-width: var(--container-width);
  width: 100%;
  margin: 0 auto;
  padding: 0 var(--spacing-unit);
  display: grid;
  grid-template-columns: 1fr;
  gap: calc(var(--spacing-unit) * 3);
  align-items: center;
  flex: 1;
  min-height: 100%;
}

/* Hero content (centered) */
.ollmh-hero-content { max-width: 720px; margin: 0 auto; text-align: center; }
.ollmh-hero-title {
  margin: 0 0 0.6em;
  font-family: var(--font-heading);
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 800;
  line-height: 1.1;
  color: var(--color-text-white);
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
}
.ollmh-hero-highlight {
  color: var(--color-accent-gold);
}
.ollmh-hero-subtitle {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.65;
  margin: 0 0 calc(var(--spacing-unit) * 1.5);
  opacity: 0.95;
  max-width: 560px;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.25);
}
.ollmh-hero-cta {
  display: flex;
  gap: var(--spacing-unit);
  flex-wrap: nowrap;
  justify-content: center;
}
.ollmh-hero-cta .btn { font-size: var(--fs-large); white-space: nowrap; }
.ollmh-hero-cta .btn-lg { padding: 0.7em 1.6em; }

/* Outline button variant for dark hero background */
.ollmh-hero-btn-outline {
  background: transparent;
  color: var(--color-text-white);
  border-color: rgba(255, 255, 255, 0.6);
}
.ollmh-hero-btn-outline:hover {
  background: var(--color-accent-gold);
  color: var(--color-primary-dark);
  border-color: var(--color-accent-gold);
}

/* Bouncy chevron scroll indicator — centred on the hero (which shares
   hero-inner's centre line) and parked just below the hero-inner box rather
   than in the bottom-right corner. Vertical maths: the hero's bottom padding
   is 3.5 units and the chevron is 1.5 units tall, so a 1.5-unit offset leaves
   a 0.5-unit gap under hero-inner. The centring is done with left:50% +
   transform (not left/right + text-align) so the hit area stays icon-sized;
   the bounce keyframes translate from -50% so they don't cancel it. */
.ollmh-hero-scroll {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: calc(var(--spacing-unit) * 1.5);
  z-index: 3;
  color: rgba(255, 255, 255, 0.85);
  font-size: 1.5rem;
  line-height: 1;
  text-decoration: none;
  transition: color 0.25s ease;
  animation: ollmh-hero-scroll-bounce 2s ease-in-out infinite;
}
.ollmh-hero-scroll:hover,
.ollmh-hero-scroll:focus-visible {
  color: #ffffff;
  text-decoration: none;
}
@keyframes ollmh-hero-scroll-bounce {
  0%, 100% { transform: translate(-50%, 0); }
  50% { transform: translate(-50%, 8px); }
}
@media (max-width: 991.98px) {
  .ollmh-hero-scroll { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .ollmh-hero-scroll { animation: none; }
}

/* Hero stats (right column) — 2×2 glassmorphism grid */
.ollmh-hero-stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-unit);
  text-align: center;
}
.ollmh-stat {
  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: calc(var(--spacing-unit) * 1.1);
  border-radius: 8px;
  border: 1px solid rgba(255, 255, 255, 0.2);
  min-width: 130px;
  transition: transform 0.2s ease, background 0.2s ease;
}
.ollmh-stat:hover {
  transform: translateY(-3px);
  background: rgba(255, 255, 255, 0.15);
}
.ollmh-stat-number {
  display: block;
  font-size: 2.25rem;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 0.35em;
  color: var(--color-accent-gold);
}
.ollmh-stat-label {
  font-size: var(--fs-small);
  opacity: 0.9;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  line-height: 1.3;
}

/* Slideshow controls — bounded chevrons are the only pager now that the dot
   strip has been removed. Inset from the viewport edges so the arrows line
   up with the footer's floating corner buttons (accessibility = 24px from
   the left edge, Back to Top = 24px from the right edge; 16px on mobile). */
.ollmh-hero .xslider-nav {
  z-index: 3;
  padding: 0 24px;
}
.ollmh-hero .xslider-nav .xslider-prev,
.ollmh-hero .xslider-nav .xslider-next {
  appearance: none;
  -webkit-appearance: none;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  margin: 0;
  border: 1px solid rgba(255, 255, 255, 0.45);
  border-radius: 50%;
  background: rgba(0, 18, 60, 0.45);
  color: #fff;
  font-family: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  text-decoration: none;
  transition: background 0.2s ease, border-color 0.2s ease;
}
.ollmh-hero .xslider-nav .xslider-prev:hover,
.ollmh-hero .xslider-nav .xslider-next:hover {
  background: var(--color-primary-button);
  border-color: var(--color-primary-button);
}
.ollmh-hero .xslider-nav .xslider-prev:focus-visible,
.ollmh-hero .xslider-nav .xslider-next:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}
/* Mobile: smaller chevrons + tighter edge inset. Must come after the base
   button rule above — same specificity, so source order decides the winner. */
@media (max-width: 768px) {
  .ollmh-hero .xslider-nav {
    padding: 0 16px;
  }
  .ollmh-hero .xslider-nav .xslider-prev,
  .ollmh-hero .xslider-nav .xslider-next {
    width: 36px;
    height: 36px;
    font-size: 18px;
  }
}

/* Feature blocks grid */
.feature-blocks {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: calc(var(--spacing-unit) * 1.25);
  margin: 0 0 calc(var(--spacing-unit) * 2);
}
.feature-block {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  padding: var(--spacing-unit);
  text-align: center;
  transition: box-shadow 0.15s ease, transform 0.15s ease;
}
.feature-block:hover { box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08); transform: translateY(-2px); }
.feature-block .feature-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  margin: 0 0 0.75em;
  border-radius: 50%;
  background: var(--color-bg-dropdown);
  color: var(--color-primary);
  font-size: 24px;
}
.feature-block .feature-icon svg { width: 28px; height: 28px; fill: currentColor; }
.feature-block h3 { margin: 0 0 0.4em; font-size: var(--fs-h3); color: var(--color-primary-heading); }
.feature-block p { margin: 0 0 0.5em; font-size: var(--fs-body); color: var(--color-text-body); }
.feature-block .feature-link { font-size: var(--fs-small); font-weight: 700; }

/* Department columns */
.department-columns {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: calc(var(--spacing-unit) * 1.25);
  margin: 0 0 calc(var(--spacing-unit) * 2);
}
.department-column {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  overflow: hidden;
}
.department-column .dept-thumb { display: block; width: 100%; height: 160px; object-fit: cover; }
.department-column .dept-body { padding: var(--spacing-unit); }
.department-column h3 { margin: 0 0 0.4em; font-size: var(--fs-h3); color: var(--color-primary-heading); }
.department-column h3 a { color: inherit; text-decoration: none; }
.department-column h3 a:hover { color: var(--color-nav-hover); }
.department-column .dept-desc { font-size: var(--fs-body); margin: 0 0 0.5em; }
.department-column .dept-phone { font-size: var(--fs-small); color: var(--color-text-muted); }

/* News scroller section */
.news-scroller-section {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: calc(var(--spacing-unit) * 1.5);
  margin: 0 0 calc(var(--spacing-unit) * 2);
  align-items: start;
}
.news-scroller-section .news-main h2 { color: var(--color-primary-heading); }
.news-scroller-section .news-list { list-style: none; margin: 0; padding: 0; }
.news-scroller-section .news-list li {
  padding: 0.75em 0;
  border-bottom: 1px solid var(--color-border-light);
}
.news-scroller-section .news-list li:last-child { border-bottom: none; }
.news-scroller-section .news-date { font-size: var(--fs-tiny); color: var(--color-text-muted); display: block; }

/* Staff grid */
.staff-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: calc(var(--spacing-unit) * 1.25);
  margin: 0 0 calc(var(--spacing-unit) * 2);
}
.staff-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  padding: var(--spacing-unit);
  text-align: center;
}
.staff-card .staff-photo {
  width: 96px;
  height: 96px;
  border-radius: 50%;
  object-fit: cover;
  margin: 0 auto 0.6em;
  display: block;
  border: 3px solid var(--color-bg-dropdown);
}
.staff-card h4 { margin: 0 0 0.2em; font-size: var(--fs-medium); color: var(--color-primary-heading); }
.staff-card .staff-role { font-size: var(--fs-small); color: var(--color-text-muted); margin: 0 0 0.3em; }
.staff-card .staff-dept { font-size: var(--fs-tiny); color: var(--color-link); }

/* Clinic schedule table */
.clinic-schedule { margin: 0 0 calc(var(--spacing-unit) * 2); }
.clinic-schedule .ollmh-table th { white-space: nowrap; }
.clinic-schedule .clinic-time { font-weight: 700; color: var(--color-primary); }
.clinic-schedule .clinic-closed { color: var(--color-inline-red); font-weight: 700; }

/* Ward status table */
.ward-status { margin: 0 0 calc(var(--spacing-unit) * 2); }
.ward-status .ward-open { color: #2e7d32; font-weight: 700; }
.ward-status .ward-limited { color: var(--color-inline-orange); font-weight: 700; }
.ward-status .ward-closed { color: var(--color-inline-red); font-weight: 700; }

/* Gallery grid */
.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  gap: 0.75em;
  margin: 0 0 calc(var(--spacing-unit) * 2);
}
.gallery-grid .gallery-item {
  position: relative;
  overflow: hidden;
  border-radius: var(--border-radius);
  border: 1px solid var(--color-border);
  background: var(--color-bg-white);
}
.gallery-grid .gallery-item a { display: block; }
.gallery-grid .gallery-item img {
  width: 100%;
  height: 140px;
  object-fit: cover;
  display: block;
  transition: transform 0.2s ease;
}
.gallery-grid .gallery-item:hover img { transform: scale(1.04); }
.gallery-grid .gallery-caption {
  padding: 0.4em 0.6em;
  font-size: var(--fs-tiny);
  color: var(--color-text-muted);
}

/* Event listing */
.event-listing { list-style: none; margin: 0 0 calc(var(--spacing-unit) * 2); padding: 0; }
.event-listing li {
  display: flex;
  gap: 1em;
  padding: 1em;
  margin: 0 0 0.75em;
  background: var(--color-bg-white);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  align-items: flex-start;
}
.event-listing .event-date {
  flex: 0 0 64px;
  text-align: center;
  padding: 0.5em;
  background: var(--gradient-primary-button);
  color: var(--color-text-white);
  border-radius: var(--border-radius);
  font-family: var(--font-heading);
}
.event-listing .event-date .day { display: block; font-size: var(--fs-h3); font-weight: 700; line-height: 1; }
.event-listing .event-date .month { display: block; font-size: var(--fs-tiny); text-transform: uppercase; }
.event-listing .event-body { flex: 1 1 auto; min-width: 0; }
.event-listing .event-body h4 { margin: 0 0 0.3em; font-size: var(--fs-medium); }
.event-listing .event-body h4 a { color: var(--color-primary-heading); text-decoration: none; }
.event-listing .event-body h4 a:hover { color: var(--color-nav-hover); }
.event-listing .event-meta { font-size: var(--fs-small); color: var(--color-text-muted); }

/* Search results */
.search-results .search-result {
  padding: 1em 0;
  border-bottom: 1px solid var(--color-border-light);
}
.search-results .search-result:last-child { border-bottom: none; }
.search-results .search-result h3 { margin: 0 0 0.3em; font-size: var(--fs-xlarge); }
.search-results .search-result h3 a { color: var(--color-primary-heading); text-decoration: none; }
.search-results .search-result h3 a:hover { color: var(--color-nav-hover); }
.search-results .search-result .search-excerpt { font-size: var(--fs-body); color: var(--color-text-body); margin: 0 0 0.3em; }
.search-results .search-result .search-url { font-size: var(--fs-small); color: var(--color-text-muted); }
.search-results .search-form { margin: 0 0 calc(var(--spacing-unit) * 1.5); }
.search-results .search-form input[type="search"] { max-width: 480px; }

/* 404 page */
.error404 .error-page {
  text-align: center;
  padding: calc(var(--spacing-unit) * 3) 0;
}
.error404 .error-page .error-code {
  font-family: var(--font-heading);
  font-size: 72px;
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1;
  margin: 0 0 0.25em;
}
.error404 .error-page h1 { font-size: var(--fs-h2); color: var(--color-primary-heading); }
.error404 .error-page .error-actions { margin-top: 1.5em; display: flex; gap: 0.75em; justify-content: center; flex-wrap: wrap; }
.error404 .error-page .search-form { max-width: 420px; margin: 1.5em auto 0; }

/* FAQ accordion */
.faq-accordion { margin: 0 0 calc(var(--spacing-unit) * 2); }
.faq-accordion .faq-item {
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  margin: 0 0 0.5em;
  background: var(--color-bg-white);
  overflow: hidden;
}
.faq-accordion .faq-question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75em;
  width: 100%;
  padding: 0.85em 1em;
  background: transparent;
  border: none;
  text-align: left;
  font-family: var(--font-heading);
  font-size: var(--fs-medium);
  font-weight: 700;
  color: var(--color-primary-heading);
  cursor: pointer;
}
.faq-accordion .faq-question:hover { color: var(--color-nav-hover); }
.faq-accordion .faq-question .faq-toggle {
  flex: 0 0 auto;
  font-size: var(--fs-large);
  color: var(--color-nav-blue);
  transition: transform 0.2s ease;
}
.faq-accordion .faq-item.open .faq-toggle { transform: rotate(45deg); }
.faq-accordion .faq-answer {
  display: none;
  padding: 0 1em 1em;
  font-size: var(--fs-body);
  color: var(--color-text-body);
}
.faq-accordion .faq-item.open .faq-answer { display: block; }
.faq-accordion .faq-answer > *:last-child { margin-bottom: 0; }

/* Contact page */
.contact-page { margin: 0 0 calc(var(--spacing-unit) * 2); }
.contact-page .contact-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(var(--spacing-unit) * 1.5);
  margin: 0 0 calc(var(--spacing-unit) * 1.5);
}
.contact-page .contact-info h3 { color: var(--color-primary-heading); font-size: var(--fs-h3); }
.contact-page .contact-info .info-item {
  display: flex;
  gap: 0.6em;
  padding: 0.5em 0;
  border-bottom: 1px solid var(--color-border-light);
  font-size: var(--fs-body);
}
.contact-page .contact-info .info-item:last-child { border-bottom: none; }
.contact-page .contact-info .info-label { font-weight: 700; color: var(--color-primary); flex: 0 0 90px; }
.contact-page .contact-map {
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
  overflow: hidden;
  min-height: 320px;
  background: var(--color-bg-light);
}
.contact-page .contact-map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }

/* Application form multi-step */
.application-form { margin: 0 0 calc(var(--spacing-unit) * 2); }
.application-form .step-indicator {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  margin: 0 0 calc(var(--spacing-unit) * 1.25);
  padding: 0;
  list-style: none;
}
.application-form .step-indicator li {
  display: flex;
  align-items: center;
  gap: 0.4em;
  padding: 0.4em 0.8em;
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  background: var(--color-bg-light);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
}
.application-form .step-indicator li.active {
  color: var(--color-text-white);
  background: var(--gradient-primary-button);
  border-color: var(--color-primary-button);
  font-weight: 700;
}
.application-form .step-indicator li.complete {
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.application-form .step-pane { display: none; }
.application-form .step-pane.active { display: block; }
.application-form .step-actions {
  display: flex;
  justify-content: space-between;
  gap: 0.75em;
  margin-top: calc(var(--spacing-unit) * 1.25);
  padding-top: var(--spacing-unit);
  border-top: 1px solid var(--color-border-light);
}

/* Single layouts */
.single-news .entry-header,
.single-event .entry-header,
.single-department .entry-header,
.single-staff .entry-header { margin: 0 0 calc(var(--spacing-unit) * 1.25); }

.single-news .entry-meta,
.single-event .entry-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 1em;
  font-size: var(--fs-small);
  color: var(--color-text-muted);
  padding: 0.5em 0;
  border-bottom: 1px solid var(--color-border-light);
  margin: 0 0 var(--spacing-unit);
}
.single-news .featured-image,
.single-event .featured-image,
.single-department .featured-image {
  margin: 0 0 var(--spacing-unit);
  border-radius: var(--border-radius);
  overflow: hidden;
}
.single-news .featured-image img,
.single-event .featured-image img,
.single-department .featured-image img { display: block; width: 100%; }

.single-department .dept-details {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: var(--spacing-unit);
  margin: 0 0 calc(var(--spacing-unit) * 1.5);
}
.single-department .dept-detail-item {
  padding: var(--spacing-unit);
  background: var(--color-bg-light);
  border: 1px solid var(--color-border);
  border-radius: var(--border-radius);
}
.single-department .dept-detail-item h4 { margin: 0 0 0.3em; font-size: var(--fs-small); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.04em; }
.single-department .dept-detail-item p { margin: 0; font-size: var(--fs-medium); color: var(--color-primary-heading); font-weight: 700; }

.single-staff .staff-profile {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: calc(var(--spacing-unit) * 1.5);
  margin: 0 0 calc(var(--spacing-unit) * 1.5);
  align-items: start;
}
.single-staff .staff-profile .staff-photo-large {
  width: 100%;
  border-radius: var(--border-radius);
  border: 4px solid var(--color-bg-dropdown);
  display: block;
}
.single-staff .staff-profile .staff-bio h1 { font-size: var(--fs-h2); color: var(--color-primary-heading); }
.single-staff .staff-profile .staff-role { font-size: var(--fs-medium); color: var(--color-nav-blue); margin: 0 0 0.75em; }
.single-staff .staff-meta { list-style: none; margin: 0 0 var(--spacing-unit); padding: 0; }
.single-staff .staff-meta li { padding: 0.4em 0; border-bottom: 1px solid var(--color-border-light); font-size: var(--fs-body); }
.single-staff .staff-meta li:last-child { border-bottom: none; }
.single-staff .staff-meta .meta-label { font-weight: 700; color: var(--color-primary); }

/* ============================================================
   Contact Page — Wardwatch-style design adapted to OLLMH brand
   ============================================================ */

/* Page header banner — sharp moving slideshow background (matches homepage
   hero approach, but shorter height since contact is a "lesser" page) */
.ollmh-page-header {
  background: var(--color-primary);
  color: var(--color-text-white);
  min-height: 280px;
  padding: 3rem 0 2.5rem;
  position: relative;
  text-align: center;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Slideshow layer — same approach as homepage hero (no blur, sharp images) */
.ollmh-page-header-slideshow {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
}
.ollmh-blur-slide {
  position: absolute;
  inset: 0;
  background-size: cover;
  background-position: center center;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}
.ollmh-blur-slide.active { opacity: 1; }
/* Dark gradient overlay — similar to homepage hero but more uniform since
   the contact page text is centered (not left-aligned like the hero) */
.ollmh-page-header-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(135deg,
    rgba(0, 26, 85, 0.88) 0%,
    rgba(7, 17, 46, 0.82) 50%,
    rgba(0, 26, 85, 0.88) 100%);
  pointer-events: none;
}
.ollmh-page-header-inner {
  position: relative;
  z-index: 2;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 1.5rem;
}
.ollmh-page-breadcrumb {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: rgba(255, 255, 255, 0.2);
  padding: 0.25rem 1rem;
  border-radius: 50px;
  font-size: 0.78125rem;
  font-weight: 600;
  margin: 0 auto 1rem;
  text-transform: uppercase;
  letter-spacing: 1px;
  width: fit-content;
  color: rgba(255, 255, 255, 0.7);
}
.ollmh-page-breadcrumb a {
  color: var(--color-text-white);
  text-decoration: none;
  text-underline-offset: 4px;
}
.ollmh-page-breadcrumb a:hover { text-decoration: underline; }
.ollmh-page-breadcrumb .ollmh-breadcrumb-sep { color: rgba(255, 255, 255, 0.4); }
.ollmh-page-title {
  font-family: var(--font-heading);
  font-size: 2.5rem;
  font-weight: 700;
  margin: 0 0 1rem;
  color: var(--color-text-white);
  line-height: 1.2;
}
.ollmh-page-subtitle {
  font-size: 1.125rem;
  opacity: 0.9;
  margin: 0;
  color: var(--color-text-white);
  line-height: 1.6;
}

/* Contact container */
.ollmh-contact-container {
  background: #f8fafc;
  padding: 0;
}
.ollmh-contact-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 3rem 1.5rem;
}

/* 2-column grid: Form (left, wider) + Info stack (right).
   Uses a 1.5fr / 1fr split (mirrors the EduFin / EduN contact-page layout)
   so the form has room to breathe and does not crowd the info cards.
   Stacks to a single column at tablet and below (see responsive.css). */
.ollmh-contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
  margin-bottom: 4rem;
  align-items: start;
}
/* Form column — white card wrapping the header + plugin form */
.ollmh-contact-form-col {
  background: var(--color-bg-white);
  padding: 1.5rem;
  border-radius: 16px;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
  min-width: 0;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-contact-form-col:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
/* Info stack — right column */
.ollmh-contact-info-stack {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}

/* Row 1: Emergency + Call Us side by side (2 columns within the right stack) */
.ollmh-info-row-2col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.25rem;
  min-width: 0;
}
.ollmh-info-row-2col .ollmh-info-card {
  /* Cards in the 2-col row have no hover lift (keeps them aligned) */
  margin: 0;
  min-width: 0;
  overflow: hidden;
}

/* Tabbed Hours card */
.ollmh-hours-tabs-card {
  padding: 0 !important;
  overflow: hidden;
}
.ollmh-hours-tabs {
  display: flex;
  border-bottom: 2px solid #e5e7eb;
}
.ollmh-hours-tab {
  flex: 1;
  padding: 1rem 1.25rem;
  background: #f8fafc;
  border: none;
  border-bottom: 3px solid transparent;
  font-size: 0.95rem;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: inherit;
}
.ollmh-hours-tab i { font-size: 0.95rem; }
.ollmh-hours-tab:hover {
  color: var(--color-primary-button);
  background: #f1f5f9;
}
.ollmh-hours-tab.active {
  color: var(--color-primary-button);
  background: var(--color-bg-white);
  border-bottom-color: var(--color-primary-button);
}
.ollmh-hours-tab-content {
  padding: 1.5rem;
}
.ollmh-hours-panel {
  display: none;
}
.ollmh-hours-panel.active {
  display: block;
}
.ollmh-hours-panel .ollmh-hours-row:last-child {
  margin-bottom: 0;
}

/* Follow Us card — full width of right column */
.ollmh-follow-card .ollmh-social-follow .ollmh-social-links {
  margin-left: 2.375rem;
  max-width: none;
}
.ollmh-follow-card .ollmh-social-follow {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-top: 0.75rem;
}
/* Boxed icon matching the Call Us / Email Us mini-card style, with hover fill.
   The Follow Us card wraps its icon in a .ollmh-info-card-icon span. */
.ollmh-follow-card .ollmh-info-card-icon {
  margin-top: 0;
  line-height: 1;
}
.ollmh-follow-card:hover .ollmh-info-card-icon {
  background: var(--color-primary-button);
  color: var(--color-bg-white);
}

/* WhatsApp direct-message link — a subtle pill that sits below the
   social icons grid, aligned under the "Stay" word in the card header.
   Green WhatsApp icon + muted text + arrow; turns green on hover. */
.ollmh-whatsapp-text-link {
  display: inline-flex !important;
  align-items: center;
  align-self: flex-start;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 400;
  color: #64748b;
  text-decoration: none;
  transition: all 0.25s ease;
  padding: 0.5rem 0.875rem;
  margin: 0;
  margin-left: 2.375rem;
  border: 1px solid #e2e8f0;
  border-radius: 2rem;
  background: #f8fafc;
  line-height: 1.4;
}
.ollmh-whatsapp-text-link:hover {
  color: #25D366;
  border-color: #25D366;
  background: rgba(37, 211, 102, 0.06);
  text-decoration: none;
  transform: translateY(-1px);
}
.ollmh-whatsapp-text-link > span {
  flex: 1;
}
/* WhatsApp brand icon (first child) */
.ollmh-whatsapp-text-link > i.fa-whatsapp {
  font-size: 1rem;
  color: #25D366;
  flex-shrink: 0;
}
/* Arrow icon (last child) */
.ollmh-whatsapp-text-link > i.fa-arrow-right {
  font-size: 0.6875rem;
  color: #94a3b8;
  flex-shrink: 0;
  transition: transform 0.25s ease, color 0.25s ease;
}
.ollmh-whatsapp-text-link:hover > i.fa-arrow-right {
  color: #25D366;
  transform: translateX(3px);
}

/* Form column header — icon + title + intro (mirrors the info-card header
   rhythm so the form card visually matches the Call Us / Hours / Follow Us
   cards on the right). */
.ollmh-contact-card-header {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  margin-bottom: 1.5rem;
}
.ollmh-contact-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(0, 100, 205, 0.08);
  color: var(--color-primary-button);
  font-size: 1.25rem;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.ollmh-contact-card-header:hover .ollmh-contact-card-icon {
  background: var(--color-primary-button);
  color: var(--color-bg-white);
}
.ollmh-contact-card-titles { display: flex; flex-direction: column; }
.ollmh-contact-form-col h2 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0 0 0.25rem;
}
.ollmh-contact-form-intro {
  font-size: 0.9rem;
  color: #64748b;
  margin: 0;
}
/* The plugin form fills the column width */
.ollmh-contact-form-body .ollmh-contact-form { max-width: none; margin: 0; }

/* ── Contact form fields — mirrors the EduFin contact form exactly ──────
   Padding, 1px border, 0.375rem radius, 1rem font, and the blue focus
   ring all match EduFin's .edufin-contact-form input/textarea rules. */
.ollmh-contact-form .ollmh-contact-field {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  margin-bottom: 1rem;
}
.ollmh-contact-form .ollmh-contact-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
.ollmh-contact-form .required { color: #ef4444; }
.ollmh-contact-form .ollmh-contact-field > label {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-heading);
  margin: 0;
}
.ollmh-contact-form input:not([type="checkbox"]),
.ollmh-contact-form textarea {
  width: 100%;
  padding: 0.7rem 0.85rem;
  font-family: inherit;
  font-size: 1rem;
  border: 1px solid #f3f4f6;
  border-radius: 0.375rem;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-contact-form input:focus,
.ollmh-contact-form textarea:focus {
  outline: none;
  border-color: #1e40af;
  box-shadow: 0 0 0 3px rgba(30, 64, 175, 0.12);
}
.ollmh-contact-form textarea {
  resize: vertical;
  min-height: 120px;
}
/* Field-level error text (from forms.js) */
.ollmh-contact-form .ollmh-field-error {
  color: #ef4444;
  font-size: 0.82rem;
  min-height: 0;
}
.ollmh-contact-form .ollmh-field-error:empty { display: none; }

/* intlTelInput — international phone field with country flag dropdown.
   Mirrors EduFin's .edufin-contact-form .iti rules so the flag selector,
   dial code, and country list match the EduFin treatment. */
.ollmh-contact-form .iti { width: 100%; }
.ollmh-contact-form .iti .iti__flag {
  background-image: url('https://cdn.jsdelivr.net/npm/intl-tel-input@18.2.1/build/img/flags.png');
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .ollmh-contact-form .iti .iti__flag {
    background-image: url('https://cdn.jsdelivr.net/npm/intl-tel-input@18.2.1/build/img/flags@2x.png');
  }
}
.ollmh-contact-form .iti--separate-dial-code .iti__selected-flag {
  background-color: transparent;
  padding-left: 0.85rem;
}
.ollmh-contact-form .iti__selected-flag:hover,
.ollmh-contact-form .iti__selected-flag:focus {
  background-color: rgba(30, 64, 175, 0.06);
}
.ollmh-contact-form .iti--separate-dial-code .iti__selected-dial-code {
  margin-left: 0.4rem;
  font-size: 0.9rem;
  color: var(--color-text-heading);
  font-weight: 600;
}
.ollmh-contact-form .iti__country-list {
  border-radius: 0.375rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  border: 1px solid #f3f4f6;
  max-height: 280px;
}
.ollmh-contact-form .iti__country {
  padding: 0.5rem 0.75rem;
  font-size: 0.85rem;
}
.ollmh-contact-form .iti__highlight {
  background-color: rgba(30, 64, 175, 0.08);
}
.ollmh-contact-form .iti__dial-code {
  color: #6b7280;
}
.ollmh-contact-form .iti input[type="tel"] { width: 100%; }

/* ── Consent checkbox + agreement text — matches the comment form's
   #commentform .ollmh-checkbox-label / .comment-form-cookies-consent
   exactly: 0.8rem font, #6b7280 color, 1.5 line-height, custom 16px
   checkbox, 0.75rem bottom margin, and the disclaimer-link tooltip.
   --ollmh-consent-indent is the checkbox width (16px) + flex gap (0.6rem);
   everything below the checkbox (Turnstile + Send button) is offset by
   this amount so it aligns with the START of the agreement text. */
.ollmh-contact-form .ollmh-consent-field { margin: 0 0 0.75rem; }
.ollmh-contact-form {
  --ollmh-consent-indent: calc(16px + 0.6rem);
}

/* Turnstile field — override the .ollmh-contact-field flex-column + 1rem
   margin so it matches the plain-div layout used by the comment form
   (.ollmh-turnstile-field-comments) and event form (.ollmh-field
   .ollmh-turnstile-field): a simple block. Indented by --ollmh-consent-indent
   so the widget aligns with the agreement text start. */
.ollmh-contact-form .ollmh-turnstile-field {
  display: block;
  flex-direction: initial;
  gap: 0;
  margin: 1rem 0 0;
  padding-left: var(--ollmh-consent-indent);
}
.ollmh-contact-form .ollmh-turnstile-field .cf-turnstile {
  min-height: 65px;
}
.ollmh-contact-form .ollmh-consent-field .ollmh-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6b7280;
  line-height: 1.5;
  margin: 0;
}
.ollmh-contact-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin: 0;
  margin-top: 0.15rem;
  padding: 0;
  border: 2px solid #94a3b8;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  position: relative;
  display: inline-block;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.ollmh-contact-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:hover {
  border-color: var(--color-primary-button, #005a9c);
}
.ollmh-contact-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:checked {
  background: var(--color-primary-button, #005a9c);
  border-color: var(--color-primary-button, #005a9c);
}
.ollmh-contact-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%) rotate(45deg);
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  display: block;
}
.ollmh-consent-text a {
  color: var(--color-primary-button, #005a9c);
  font-weight: 600;
  text-decoration: underline;
  text-decoration-color: rgba(0, 90, 156, 0.45);
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  transition: color 0.2s ease, text-decoration-color 0.2s ease;
  position: relative;
}
.ollmh-consent-text a:hover {
  color: #003d6b;
  text-decoration-color: var(--color-primary-button, #005a9c);
}
.ollmh-consent-text a:focus { outline: none; }
/* Styled tooltip on the Privacy Policy / Terms links (data-tooltip) */
.ollmh-consent-text a::after {
  content: '';
  position: absolute;
  bottom: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(4px);
  background: #1a1a2e;
  color: #fff;
  border: 1px solid #2f2f58;
  border-radius: 6px;
  padding: 5px 9px;
  font-size: 11px;
  font-weight: 400;
  white-space: nowrap;
  line-height: 1.4;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease, transform 0.2s ease;
  z-index: 30;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.35);
}
.ollmh-consent-text a:hover::after,
.ollmh-consent-text a:focus::after {
  content: attr(data-tooltip);
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

/* ── Submit button — matches the comment form's .ollmh-comment-submit and
   the event form's .ollmh-event-reg-submit style exactly: gradient, 1px
   border, 8px radius, brightness+lift hover, auto-width (NOT full-width)
   so it sits inline like the "Post Comment" button. */
.ollmh-contact-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.625rem 1.5rem !important;
  font-family: inherit;
  font-size: 0.9375rem !important;
  font-weight: 600;
  line-height: 1.2;
  background: var(--gradient-primary-button) !important;
  color: var(--color-text-white) !important;
  border: 1px solid var(--color-primary-button) !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 100, 205, 0.25) !important;
  cursor: pointer;
  text-decoration: none;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
.ollmh-contact-submit:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 100, 205, 0.3) !important;
}
.ollmh-contact-submit:active {
  filter: brightness(0.95);
  transform: translateY(0);
}
.ollmh-contact-submit:disabled,
.ollmh-contact-submit[aria-disabled="true"] {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  transform: none !important;
}
/* Form actions row — the Send Message button is offset by
   --ollmh-consent-indent (checkbox width + gap = 16px + 0.6rem) so its
   left edge aligns directly underneath the START of the agreement
   checkbox text, matching the Turnstile widget above it. */
.ollmh-contact-form .ollmh-form-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 1rem;
  margin-top: 0;
  padding-left: var(--ollmh-consent-indent);
}
.ollmh-contact-form .ollmh-form-spinner {
  border-top-color: var(--color-primary-button, #005a9c);
}

/* Info cards section (right column) */
.ollmh-contact-info-section {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  min-width: 0;
}
.ollmh-info-card {
  background: var(--color-bg-white);
  padding: 1.5rem;
  border-radius: 12px;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  min-width: 0;
  overflow: hidden;
}
.ollmh-info-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}
.ollmh-info-card-header {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  margin-bottom: 0.75rem;
}
.ollmh-info-card-header > i {
  font-size: 1.5rem;
  color: var(--color-primary-button);
  flex-shrink: 0;
  line-height: 1.125rem;
  margin-top: 0.125rem;
}
/* Boxed icon span (Follow Us card) — matches the form/mini-card icon style */
.ollmh-info-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(0, 100, 205, 0.08);
  color: var(--color-primary-button);
  font-size: 1.25rem;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.ollmh-info-card:hover .ollmh-info-card-icon {
  background: var(--color-primary-button);
  color: var(--color-bg-white);
}
.ollmh-info-card-titles { display: flex; flex-direction: column; }
.ollmh-info-card h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0 0 0.25rem;
}
.ollmh-info-card-titles > p {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
}
.ollmh-info-card > p {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0 0 0.75rem;
}
.ollmh-info-card-content {
  font-size: 0.9375rem;
  color: #475569;
  margin: 0;
  line-height: 1.6;
  padding-left: 2.375rem;
  overflow-wrap: break-word;
}
.ollmh-info-card a:not(.ollmh-whatsapp-btn):not(.ollmh-whatsapp-text-link):not(.ollmh-social-link) {
  display: block;
  color: var(--color-primary-button);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.95rem;
  margin-bottom: 0.25rem;
  padding-left: 2.375rem;
  overflow-wrap: break-word;
  word-break: break-word;
}
/* Phone numbers always show an underline (they're actionable tel: links) */
.ollmh-info-card a[href^="tel:"] {
  text-decoration: underline;
  text-underline-offset: 4px;
  text-decoration-thickness: 1px;
}
.ollmh-info-card a:not(.ollmh-whatsapp-text-link):not(.ollmh-social-link):hover { text-decoration: underline; }

/* Mini contact cards — minimalist Call Us / Email Us.
   The entire card is a single link; icon + label + value stacked.
   Adapted from the edufin-wordpress contact page design. */
.ollmh-contact-mini-card {
  padding: 0 !important;
}
.ollmh-mini-card-link {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 1.25rem !important;
  text-decoration: none !important;
  color: inherit !important;
  transition: all 0.2s ease;
  height: 100%;
  box-sizing: border-box;
}
.ollmh-mini-card-link:hover {
  text-decoration: none !important;
}
.ollmh-mini-card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(0, 100, 205, 0.08);
  color: var(--color-primary-button);
  font-size: 1.25rem;
  flex-shrink: 0;
  transition: all 0.2s ease;
}
.ollmh-mini-card-link:hover .ollmh-mini-card-icon {
  background: var(--color-primary-button);
  color: var(--color-bg-white);
}
.ollmh-mini-card-body {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}
.ollmh-mini-card-label {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-muted);
}
.ollmh-mini-card-value {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-primary-heading);
  overflow-wrap: break-word;
  word-break: break-word;
}
.ollmh-mini-card-link:hover .ollmh-mini-card-value {
  color: var(--color-primary-button);
}

/* Emergency card — red accent for the 24/7 emergency + ambulance card */
.ollmh-info-card-emergency {
  border-left: 4px solid #fca5a5;
}
.ollmh-info-card-emergency .ollmh-info-card-header > i {
  color: #fca5a5;
}
.ollmh-emergency-phone {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  color: #fca5a5 !important;
  font-weight: 700;
  font-size: 1.05rem !important;
  padding-left: 2.375rem;
}
.ollmh-emergency-phone:hover { text-decoration: underline; }
.ollmh-ambulance-phone {
  display: flex !important;
  align-items: center;
  gap: 0.5rem;
  color: #fca5a5 !important;
  font-weight: 600;
  font-size: 0.9rem !important;
  padding-left: 2.375rem;
}
.ollmh-ambulance-phone:hover { text-decoration: underline; }

/* Hours rows inside info cards */
.ollmh-hours-row {
  font-size: 0.9rem;
  color: #475569;
  line-height: 1.5;
  margin: 0 0 0.75rem;
  padding-left: 2.375rem;
  overflow-wrap: break-word;
}
.ollmh-hours-row:last-child { margin-bottom: 0; }
.ollmh-hours-row strong { color: var(--color-text-heading); }

/* Quick Actions section */
.ollmh-quick-actions {
  margin-top: 4rem;
  text-align: center;
}
.ollmh-quick-actions h2 {
  font-size: 2rem;
  color: var(--color-text-heading);
  margin: 0 0 0.75rem;
}
.ollmh-quick-actions-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}
.ollmh-quick-action-card {
  background: var(--color-bg-white);
  padding: 2rem 1.5rem;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
  text-decoration: none;
  text-align: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-quick-action-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  text-decoration: none;
}
.ollmh-quick-action-card > i {
  font-size: 2rem;
  color: var(--color-primary-button);
  margin-bottom: 0.5rem;
}
.ollmh-quick-action-card h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0;
}
.ollmh-quick-action-card p {
  font-size: 0.875rem;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
}

/* Social links — fixed-size tiles with flex-wrap for scalability.
   Any number of icons wraps cleanly to the next row. */
.ollmh-social-follow { margin-top: 0.75rem; }
.ollmh-social-follow .ollmh-social-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 0;
  margin-left: 2.375rem;
  padding: 0;
}
.ollmh-follow-card .ollmh-social-follow .ollmh-social-links {
  margin-left: 2.375rem;
  display: grid;
  grid-template-columns: repeat(5, 44px);
  justify-content: start;
}
.ollmh-social-link {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  color: #64748b !important;
  text-decoration: none;
  transition: all 0.2s ease;
  font-size: 1.25rem;
  border: 1px solid rgba(0, 0, 0, 0.06);
  line-height: 1;
  box-sizing: border-box;
  padding: 0 !important;
  margin: 0 !important;
  position: relative;
}
.ollmh-social-link:visited {
  color: #64748b !important;
}
.ollmh-social-link:hover {
  color: #fff !important;
  transform: translateY(-2px);
  text-decoration: none !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}
.ollmh-social-link:active {
  transform: translateY(0);
}
.ollmh-social-link:focus {
  text-decoration: none !important;
}
.ollmh-social-link:focus-visible {
  outline: 2px solid var(--ollmh-share-color, #005a9c);
  outline-offset: 2px;
}
.ollmh-social-link i {
  pointer-events: none;
  color: #64748b !important;
  font-size: 1.25rem !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
}
.ollmh-social-link:hover i {
  color: #fff !important;
}
/* Default state — light gray, matching event share buttons.
   On hover each platform transitions to its brand color. */
.ollmh-social-link { background: #f1f5f9; }
.ollmh-social-link:hover { background: var(--ollmh-share-color, #005a9c); }

/* Per-platform brand colors (same hex values as the event share buttons) */
.ollmh-social-facebook  { --ollmh-share-color: #1877F2; }
.ollmh-social-twitter   { --ollmh-share-color: #000000; }
.ollmh-social-instagram { --ollmh-share-color: #E4405F; }
.ollmh-social-youtube   { --ollmh-share-color: #FF0000; }
.ollmh-social-tiktok    { --ollmh-share-color: #000000; }
.ollmh-social-linkedin  { --ollmh-share-color: #0A66C2; }
.ollmh-social-telegram  { --ollmh-share-color: #26A5E4; }
.ollmh-social-threads   { --ollmh-share-color: #000000; }
.ollmh-social-snapchat  { --ollmh-share-color: #FFFC00; }
.ollmh-social-snapchat:hover,
.ollmh-social-snapchat:hover i { color: #000000 !important; }
.ollmh-social-whatsapp  { --ollmh-share-color: #25D366; }

/* Section badge */
.ollmh-section-badge {
  display: inline-block;
  background: rgba(0, 26, 85, 0.08);
  color: var(--color-primary);
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  padding: 0.5rem 1rem;
  border-radius: 2rem;
  margin-bottom: 1rem;
}

/* Visit Us section */
.ollmh-visit-section {
  margin-top: 4rem;
  text-align: center;
}
.ollmh-visit-section h2 {
  font-size: 2rem;
  color: var(--color-text-heading);
  margin: 0 0 0.75rem;
  text-align: center;
}
.ollmh-section-subtitle {
  font-size: 1rem;
  color: #64748b;
  margin: 0 0 2rem;
  text-align: center;
}

/* Unified Visit Us card — outer container with a smooth hover lift.
   Inside it, the map and the Address/Contact/Hours details are each
   styled as their own individual card, smartly gapped. */
.ollmh-visit-card {
  background: var(--color-bg-white);
  border-radius: 16px;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
  text-align: left;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-visit-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* Map card — its own individual card with border + rounded corners */
.ollmh-visit-map-card {
  line-height: 0;
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-visit-map-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.ollmh-visit-map-card iframe {
  border-radius: 0;
  width: 100%;
  display: block;
}

/* Address / Contact / Hours — grid of individual cards below the map */
.ollmh-map-details {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  text-align: center;
}
.ollmh-visit-detail-card {
  background: #f8fafc;
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1.5rem 1rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-visit-detail-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  background: var(--color-bg-white);
}
.ollmh-detail-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 10px;
  background: rgba(0, 100, 205, 0.08);
  color: var(--color-primary-button);
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-bottom: 0.75rem;
  transition: all 0.2s ease;
}
.ollmh-visit-detail-card:hover .ollmh-detail-icon {
  background: var(--color-primary-button);
  color: var(--color-bg-white);
}
.ollmh-detail-label {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--color-primary);
  margin-bottom: 0.5rem;
}
.ollmh-detail-value {
  font-size: 0.9rem;
  color: #374151;
  line-height: 1.6;
  margin: 0;
}
address.ollmh-detail-value { font-style: normal; }
.ollmh-detail-value a { color: #374151; text-decoration: none; }
.ollmh-detail-value a:hover { color: var(--color-primary-button); text-decoration: underline; text-underline-offset: 4px; }

/* Form fields, consent checkbox, and submit button are styled above under
   the .ollmh-contact-form scope (mirroring the EduFin contact form). The
   old unscoped .ollmh-form-field / .ollmh-checkmark / .ollmh-contact-submit
   rules from the inline form were removed when the page switched to the
   OLLMH Forms plugin. */

/* Success message */
.ollmh-success-message {
  text-align: center;
  padding: 3rem 2rem;
}
.ollmh-success-message i {
  font-size: 4rem;
  color: var(--color-primary-button);
  margin-bottom: 1.5rem;
}
.ollmh-success-message h2 {
  font-size: 2rem;
  color: var(--color-text-heading);
  margin: 0 0 1rem;
}
.ollmh-success-message p {
  font-size: 1.125rem;
  color: #64748b;
  margin: 0 0 2rem;
}

/* Error message */
.ollmh-error-message {
  background: #fef2f2;
  border: 2px solid #ef4444;
  color: #ef4444;
  padding: 1rem;
  border-radius: 8px;
  margin-bottom: 1.5rem;
}

/* ============================================================
   HOME PAGE — Modern landing page sections
   ============================================================ */

/* ── In Focus Promo Strip ─────────────────────────────────────────────── */
.ollmh-home-infocus {
  padding: 2.5rem 16px;
  background: #f8fafc;
}
.ollmh-home-infocus-inner {
  max-width: var(--container-width);
  margin: 0 auto;
}
.ollmh-home-infocus-header {
  text-align: center;
  margin-bottom: 1.5rem;
}
.ollmh-home-infocus-header h2 {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.5rem 0 0;
}
.ollmh-home-infocus-header p {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0.5rem 0 0;
}
.ollmh-home-infocus-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
.ollmh-home-infocus-card {
  position: relative;
  display: block;
  border-radius: 12px;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  text-decoration: none;
}
.ollmh-home-infocus-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0, 26, 85, 0.2);
}
.ollmh-home-infocus-card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}
.ollmh-home-infocus-card:hover img { transform: scale(1.05); }
.ollmh-home-infocus-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,26,85,0.2) 0%, rgba(0,26,85,0.85) 100%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 1.25rem;
  color: #fff;
}
.ollmh-home-infocus-overlay h3 {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  margin: 0 0 0.25rem;
}
.ollmh-home-infocus-overlay p {
  font-size: 0.8rem;
  margin: 0 0 0.5rem;
  opacity: 0.9;
}
.ollmh-home-infocus-link {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-accent-gold);
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
}
.ollmh-home-infocus-featured {
  outline: 3px solid var(--color-accent-gold);
  outline-offset: -3px;
}
.ollmh-home-infocus-badge {
  display: inline-block;
  background: var(--color-accent-gold);
  color: var(--color-primary-heading);
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  margin-bottom: 0.5rem;
  align-self: flex-start;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}
@media (max-width: 768px) {
  .ollmh-home-infocus-grid { grid-template-columns: 1fr; }
}

/* ── Homepage Tabbed Intro ────────────────────────────────────────────── */
.ollmh-home-tabs {
  margin-top: 0.5rem;
}
.ollmh-home-tab-buttons {
  display: flex;
  flex-wrap: nowrap;
  justify-content: center;
  gap: 0;
  border-bottom: 3px solid #e2e8f0;
  margin-bottom: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.ollmh-home-tab-buttons::-webkit-scrollbar { height: 4px; }
.ollmh-home-tab-buttons::-webkit-scrollbar-track { background: transparent; }
.ollmh-home-tab-buttons::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
.ollmh-home-tab-btn {
  padding: 12px 20px;
  background: none;
  border: none;
  border-bottom: 3px solid transparent;
  margin-bottom: -3px;
  font-family: var(--font-body);
  font-size: 0.875rem;
  font-weight: 600;
  color: #64748b;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  flex-shrink: 0;
}
.ollmh-home-tab-btn:hover { color: var(--color-primary-heading); background: #f1f5f9; }
.ollmh-home-tab-btn.active {
  color: var(--color-primary-button);
  border-bottom-color: var(--color-primary-button);
  background: rgba(0, 100, 205, 0.05);
}
.ollmh-home-tab-btn i { font-size: 0.85em; }
.ollmh-home-tab-content {
  padding: 2rem 0 0;
}
.ollmh-home-tab-panel { display: none; }
.ollmh-home-tab-panel.active { display: block; }

/* Tab panel layout — dedicated grid for homepage tabs.
   align-items: stretch makes the image column fill the full row
   height (driven by the text column), and object-fit: cover on the
   img (set globally below) crops the image to fill that height
   without distortion. */
.ollmh-home-tab-panel .ollmh-about-overview-inner {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 2rem;
  align-items: stretch;
}
.ollmh-home-tab-panel .ollmh-about-overview-content {
  padding: 2rem;
}
.ollmh-home-tab-panel .ollmh-about-overview-image {
  min-height: 280px;
  height: 100%;
}
.ollmh-home-tab-panel h3 {
  font-family: var(--font-heading);
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.75rem;
}
.ollmh-home-tab-panel .ollmh-about-lead {
  font-size: 0.95rem;
  line-height: 1.65;
  margin: 0 0 0.75rem;
}
.ollmh-home-tab-panel .ollmh-about-overview-content > p {
  font-size: 0.9rem;
  line-height: 1.65;
  margin: 0 0 0.75rem;
}
.ollmh-home-tab-panel .btn { margin-top: 0.5rem; }

.ollmh-home-motto {
  font-size: 1.1rem;
  font-style: italic;
  color: var(--color-primary-button);
  font-weight: 600;
  border-left: 4px solid var(--color-accent-gold);
  padding-left: 1rem;
  margin: 0 0 1rem;
}
.ollmh-home-mv-mini {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin: 0 0 1rem;
}
.ollmh-home-mv-mini-card {
  background: #f1f5f9;
  border-radius: 8px;
  padding: 0.75rem 1rem;
  font-size: 0.85rem;
  color: #475569;
}
.ollmh-home-mv-mini-card strong { color: var(--color-primary-heading); }
.ollmh-home-values-inline {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin: 0 0 1rem;
}
.ollmh-home-value-inline-item {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
}
.ollmh-home-value-inline-item > i {
  font-size: 1.25rem;
  color: var(--color-primary-button);
  flex-shrink: 0;
  margin-top: 2px;
}
.ollmh-home-value-inline-item strong {
  display: block;
  font-size: 0.95rem;
  color: var(--color-primary-heading);
  margin-bottom: 0.2rem;
}
.ollmh-home-value-inline-item p {
  font-size: 0.85rem;
  color: #64748b;
  margin: 0;
}

/* Core Values accordion (single-expand) — used in the Structure & Core
   Values tab on the home page. Mirrors the FAQ accordion styling. */
.ollmh-values-accordion {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin: 0 0 1rem;
}
.ollmh-values-accordion-item {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  box-shadow: 0 1px 6px rgba(0, 26, 85, 0.05);
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.ollmh-values-accordion-item.is-open {
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.1);
}
.ollmh-values-accordion-header {
  width: 100%;
  background: none;
  border: none;
  padding: 0.85rem 1rem;
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  transition: background 0.15s ease;
}
.ollmh-values-accordion-header:hover { background: #f8fafc; }
.ollmh-values-accordion-header:focus-visible {
  outline: 2px solid var(--color-primary-button);
  outline-offset: -2px;
}
.ollmh-values-accordion-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-values-accordion-title > i {
  color: var(--color-primary-button);
  font-size: 1rem;
  flex-shrink: 0;
}
.ollmh-values-accordion-icon {
  font-size: 0.8rem;
  color: var(--color-primary-button);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.ollmh-values-accordion-item.is-open .ollmh-values-accordion-icon {
  transform: rotate(180deg);
}
.ollmh-values-accordion-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 1rem;
}
.ollmh-values-accordion-item.is-open .ollmh-values-accordion-content {
  padding-bottom: 1rem;
}
.ollmh-values-accordion-content p {
  margin: 0;
  font-size: 0.85rem;
  line-height: 1.6;
  color: #475569;
}

/* International Attachment Programme tab — email (mailto) links get a
   hover underline with a 4px vertical offset, matching the codebase's
   established link-hover treatment. */
#ollmh-tab-attachment a[href^="mailto:"]:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Responsive: tablet → stack image below content */
@media (max-width: 1024px) {
  .ollmh-home-tab-panel .ollmh-about-overview-inner {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .ollmh-home-tab-panel .ollmh-about-overview-image {
    max-width: 500px;
    margin: 0 auto;
    min-height: 220px;
  }
}

/* Responsive: mobile → smaller tabs, tighter spacing */
@media (max-width: 768px) {
  .ollmh-home-tab-btn { padding: 10px 14px; font-size: 0.8rem; }
  .ollmh-home-tab-content { padding: 1.5rem 0 0; }
  .ollmh-home-tab-panel .ollmh-about-overview-content { padding: 1.5rem; }
  .ollmh-home-tab-panel h3 { font-size: 1.2rem; }
  .ollmh-home-tab-panel .ollmh-about-lead { font-size: 0.9rem; }
  .ollmh-home-tab-panel .ollmh-about-overview-image {
    min-height: 180px;
  }
}

/* Responsive: very small phones → icon-only tabs */
@media (max-width: 480px) {
  .ollmh-home-tab-btn {
    padding: 10px 12px;
    font-size: 0.75rem;
  }
  .ollmh-home-tab-btn i { font-size: 1em; }
  .ollmh-home-tab-panel .ollmh-about-overview-content { padding: 1.25rem; }
}

/* ── Homepage News Tags ───────────────────────────────────────────────── */
.ollmh-home-news-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  color: #fff;
  font-size: 0.7rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  z-index: 1;
}

/* ── Homepage Quick Links ─────────────────────────────────────────────── */
.ollmh-home-quick-links {
  padding: 3rem 16px;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
  color: #fff;
}
.ollmh-home-quick-links-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}
.ollmh-home-quick-link {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.5rem 1.25rem;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 14px;
  text-decoration: none;
  color: #fff;
  transition: background 0.25s ease, transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
  position: relative;
  overflow: hidden;
  min-height: 80px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.15);
}
.ollmh-home-quick-link::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.2) 0%, transparent 60%);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
.ollmh-home-quick-link:hover {
  background: rgba(255, 255, 255, 0.25);
  border-color: var(--color-accent-gold);
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35), 0 0 0 1px var(--color-accent-gold);
  text-decoration: none;
}
.ollmh-home-quick-link:hover::before { opacity: 1; }

/* Icon circle */
.ollmh-home-quick-link-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  border: 2px solid rgba(255, 255, 255, 0.3);
  transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s ease;
}
.ollmh-home-quick-link-icon i {
  font-size: 1.25rem;
  color: var(--color-accent-gold);
  line-height: 1;
}
.ollmh-home-quick-link:hover .ollmh-home-quick-link-icon {
  background: rgba(255, 255, 255, 0.3);
  border-color: var(--color-accent-gold);
  transform: scale(1.08);
}

/* Body text */
.ollmh-home-quick-link-body {
  flex: 1 1 auto;
  min-width: 0;
}
.ollmh-home-quick-link-body h3 {
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0 0 0.15rem;
  color: #fff;
  line-height: 1.2;
}
.ollmh-home-quick-link-body p {
  font-size: 0.8rem;
  margin: 0;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.4;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Arrow indicator */
.ollmh-home-quick-link-arrow {
  flex-shrink: 0;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.6);
  transition: transform 0.25s ease, color 0.25s ease;
}
.ollmh-home-quick-link:hover .ollmh-home-quick-link-arrow {
  transform: translateX(4px);
  color: var(--color-accent-gold);
}

/* Emergency card — distinct red accent */
.ollmh-home-quick-link-emergency {
  background: rgba(220, 38, 38, 0.35);
  border-color: rgba(248, 113, 113, 0.5);
}
.ollmh-home-quick-link-emergency::before {
  background: linear-gradient(135deg, rgba(248,113,113,0.25) 0%, transparent 60%);
}
.ollmh-home-quick-link-emergency:hover {
  background: rgba(220, 38, 38, 0.5);
  border-color: #fca5a5;
  box-shadow: 0 8px 28px rgba(220, 38, 38, 0.4), 0 0 0 1px #fca5a5;
}
.ollmh-home-quick-link-emergency .ollmh-home-quick-link-icon {
  background: rgba(248, 113, 113, 0.3);
  border-color: rgba(248, 113, 113, 0.5);
}
.ollmh-home-quick-link-emergency .ollmh-home-quick-link-icon i {
  color: #fca5a5;
}
.ollmh-home-quick-link-emergency:hover .ollmh-home-quick-link-icon {
  background: rgba(248, 113, 113, 0.4);
  border-color: #fca5a5;
}
.ollmh-home-quick-link-emergency .ollmh-home-quick-link-body p {
  white-space: normal;
  color: #fee2e2;
  font-weight: 600;
}

/* Responsive */
@media (max-width: 1024px) {
  .ollmh-home-quick-links-inner { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .ollmh-home-quick-links { padding: 2rem 12px; }
  .ollmh-home-quick-links-inner { grid-template-columns: 1fr; gap: 0.75rem; }
  .ollmh-home-quick-link { padding: 1.25rem 1rem; min-height: 64px; }
  .ollmh-home-quick-link-icon { width: 42px; height: 42px; }
  .ollmh-home-quick-link-icon i { font-size: 1.1rem; }
  .ollmh-home-quick-link-body h3 { font-size: 0.9rem; }
  .ollmh-home-quick-link-body p { font-size: 0.75rem; }
}

/* Shared section header */
.ollmh-home-section-header {
  text-align: center;
  max-width: 640px;
  margin: 0 auto 1.25rem;
}
.ollmh-home-section-header h2 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.75rem 0 0.5rem;
}
.ollmh-home-section-header p {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
}

/* --- Welcome Section --- */
.ollmh-home-welcome {
  padding: 4rem 1.5rem;
  background: var(--color-bg-white);
}
@media (min-width: 993px) {
  .ollmh-home-welcome { scroll-margin-top: 5rem; }
}
.ollmh-home-welcome-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  gap: 0;
  align-items: stretch;
}
.ollmh-home-welcome-content h2 {
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.75rem 0 1rem;
  line-height: 1.2;
}
.ollmh-home-welcome-lead {
  font-size: 1rem;
  color: #475569;
  line-height: 1.7;
  margin: 0 0 1.5rem;
}
.ollmh-home-welcome-features {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.875rem;
  margin-bottom: 1.75rem;
}
.ollmh-home-feature-item {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary-heading);
}
.ollmh-home-feature-item i {
  font-size: 1.125rem;
  color: var(--color-primary-button);
  flex-shrink: 0;
}
.ollmh-home-welcome-cta {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ollmh-home-welcome-image img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 26, 85, 0.12);
}

/* --- Mission & Vision Strip --- */
.ollmh-home-mv-strip {
  background: var(--color-primary);
  padding: 2.5rem 1.5rem;
}
.ollmh-home-mv-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
}
.ollmh-home-mv-card {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  color: var(--color-text-white);
}
.ollmh-home-mv-card > i {
  font-size: 1.75rem;
  color: var(--color-accent-gold);
  flex-shrink: 0;
  margin-top: 0.125rem;
}
.ollmh-home-mv-card h3 {
  font-size: 0.875rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-accent-gold);
  margin: 0 0 0.375rem;
}
.ollmh-home-mv-card p {
  font-size: 0.875rem;
  line-height: 1.6;
  color: rgba(255, 255, 255, 0.85);
  margin: 0;
}

/* --- By The Numbers / Stats Section --- */
.ollmh-home-stats {
  background: linear-gradient(135deg, var(--color-primary-dark) 0%, var(--color-primary) 50%, var(--color-primary-dark) 100%);
  padding: 4rem 1.5rem;
  position: relative;
  overflow: hidden;
}
.ollmh-home-stats::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -10%;
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(74, 158, 255, 0.08) 0%, transparent 70%);
  pointer-events: none;
}
.ollmh-home-stats-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  position: relative;
}
.ollmh-home-stats-header {
  text-align: center;
  margin-bottom: 2.5rem;
}
.ollmh-home-stats-header h2 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text-white);
  margin: 0.75rem 0 0;
}
.ollmh-home-stats-header p {
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.8);
  margin: 0.5rem 0 0;
}
.ollmh-home-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}
.ollmh-home-stat-item {
  text-align: center;
  padding: 1.5rem 1rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.05);
  border: 1px solid rgba(255, 255, 255, 0.08);
  transition: transform 0.25s ease, background 0.25s ease, border-color 0.25s ease;
}
.ollmh-home-stat-item:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 221, 71, 0.3);
}
.ollmh-home-stat-item:hover .ollmh-home-stat-icon {
  background: rgba(255, 221, 71, 0.25);
  border-color: var(--color-accent-gold);
}
.ollmh-home-stat-icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 221, 71, 0.15);
  border: 2px solid rgba(255, 221, 71, 0.4);
}
.ollmh-home-stat-icon i {
  font-size: 1.75rem;
  color: var(--color-accent-gold);
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}
.ollmh-home-stat-number {
  font-size: 2.25rem;
  font-weight: 800;
  color: var(--color-text-white);
  line-height: 1;
  margin-bottom: 0.375rem;
  font-variant-numeric: tabular-nums;
}
.ollmh-home-stat-suffix {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-accent-gold);
}
.ollmh-home-stat-label {
  font-size: 0.8125rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-white);
  margin-bottom: 0.25rem;
}
.ollmh-home-stat-desc {
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.6);
  line-height: 1.4;
}

/* --- Departments Showcase --- */
.ollmh-home-departments {
  padding: 4rem 1.5rem;
  background: var(--color-bg-white);
}
/* Cards reuse the Event Calendar tile classes (.ollmh-event-card,
   .ollmh-event-card-image / -body / -read-more, .ollmh-card-label) so the
   homepage departments stay in lockstep with /events/ tiles: 12px-radius white
   tile that lifts 4px on hover, 200px media head with an uppercase label pill,
   body with title + tagline, and a "View Department" read-more whose arrow
   slides right on hover. Only the grid itself is department-specific — it uses
   the same auto-fill track sizing as .ollmh-events-grid, so both sections
   break to the same column counts at every width. */
.ollmh-home-dept-grid {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
}

/* --- Medical School CTA --- */
.ollmh-home-medical-cta {
  padding: 4rem 1.5rem;
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
}
.ollmh-home-medical-cta-inner {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 3rem;
  align-items: center;
}
.ollmh-home-medical-cta-content h2 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text-white);
  margin: 0.75rem 0 1rem;
}
.ollmh-home-medical-cta-content > p {
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.6;
  margin: 0 0 1.25rem;
}
.ollmh-section-badge-light {
  background: rgba(255, 255, 255, 0.15);
  color: var(--color-text-white);
}
.ollmh-home-medical-cta-programs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem 1.25rem;
  margin-bottom: 1.5rem;
}
.ollmh-home-medical-cta-programs span {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.9);
}
.ollmh-home-medical-cta-programs i {
  color: #4ade80;
  font-size: 0.75rem;
}
.ollmh-home-medical-cta-image img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
}

/* --- Core Values --- */
.ollmh-home-values {
  padding: 4rem 1.5rem;
  background: #f8fafc;
}
.ollmh-home-values-grid {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem;
}
.ollmh-home-value-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1.75rem;
  text-align: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-home-value-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
}
.ollmh-home-value-card i {
  font-size: 2rem;
  color: var(--color-primary-button);
  margin-bottom: 0.875rem;
  display: block;
}
.ollmh-home-value-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.5rem;
}
.ollmh-home-value-card p {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Testimonials --- */
.ollmh-home-testimonials {
  padding: 4rem 1.5rem;
  background: var(--color-bg-white);
}
.ollmh-home-testimonials-grid {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem;
}
.ollmh-home-testimonial-card {
  background: #f8fafc;
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-home-testimonial-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
}
.ollmh-home-testimonial-icon {
  font-size: 1.5rem;
  color: var(--color-primary-button);
  margin-bottom: 1rem;
  opacity: 0.3;
}
.ollmh-home-testimonial-quote {
  margin: 0 0 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #334155;
  font-style: italic;
  flex: 1;
}
.ollmh-home-testimonial-divider {
  height: 1px;
  background: var(--color-border-light);
  margin: 0 0 0.75rem;
}
.ollmh-home-testimonial-author {
  display: block;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  font-style: normal;
}
.ollmh-home-testimonial-role {
  display: block;
  font-size: 0.8125rem;
  color: var(--color-primary-button);
  margin-top: 0.15rem;
}
.ollmh-home-testimonial-location {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  color: #94a3b8;
}
.ollmh-home-testimonial-location i {
  font-size: 0.7rem;
  color: var(--color-primary-button);
}
.ollmh-home-testimonial-date {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 0.2rem;
}
.ollmh-home-testimonial-date i {
  font-size: 0.7rem;
  color: var(--color-primary-button);
}
/* Author row — left side (avatar + name/role) and right side
   (location + date) on opposite ends, sitting below the divider. */
.ollmh-home-testimonial-author-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.ollmh-home-testimonial-author-left {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  min-width: 0;
}
.ollmh-home-testimonial-author-right {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  text-align: right;
  flex-shrink: 0;
}
.ollmh-home-testimonial-author-info {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
/* Avatar — circular. Two variants: a real photo (featured image) or a
   gradient circle with the person's initials. 48px on desktop, 40px on
   small screens (see responsive.css). */
.ollmh-home-testimonial-avatar {
  flex: 0 0 auto;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ollmh-home-testimonial-avatar-img-wrap {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
}
.ollmh-testimonial-avatar-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ollmh-home-testimonial-avatar-initials {
  background: var(--gradient-primary-button, linear-gradient(135deg, #005a9c, #003c6e));
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1;
  text-transform: uppercase;
  user-select: none;
}

/* --- Our Partners in Healthcare --- */
.ollmh-home-partners {
  padding: 4rem 1.5rem;
  background: #f8fafc;
}
.ollmh-home-partners-grid {
  max-width: var(--container-width);
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
}
.ollmh-home-partner-logo {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1rem 1.5rem;
  min-width: 140px;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-home-partner-logo:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
}
.ollmh-home-partner-logo a {
  display: flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  width: 100%;
  height: 100%;
}
/* Suppress the global a:hover/a:focus underline on the partner link. */
.ollmh-home-partner-logo a:hover,
.ollmh-home-partner-logo a:focus {
  text-decoration: none;
}
.ollmh-home-partner-logo img {
  max-width: 120px;
  max-height: 60px;
  width: auto;
  height: auto;
  object-fit: contain;
}
/* Fallback layout when a partner has no logo — acronym badge only.
   The full name is available via the native title tooltip on hover. */
.ollmh-home-partner-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.ollmh-home-partner-initials {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 48px;
  min-height: 48px;
  padding: 0.5rem 0.75rem;
  border-radius: 12px;
  background: var(--gradient-primary-button, linear-gradient(135deg, #005a9c, #003c6e));
  color: #fff;
  font-size: 1.1rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  line-height: 1;
  text-transform: uppercase;
  user-select: none;
  cursor: help;
  transition: transform 0.2s ease;
}
.ollmh-home-partner-logo:hover .ollmh-home-partner-initials {
  transform: scale(1.05);
}

/* --- View All / View More buttons (departments, news, testimonials, partners)
   Standardized to match the hero's "Apply to Medical School" outline button:
   same dimensions (btn-lg + hero padding), same interaction pattern
   (transparent → gold fill on hover), and arrow-slide animation. --- */
.ollmh-home-show-more-wrap {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}
.ollmh-home-show-more-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7em 1.6em;
  font-size: var(--fs-large);
  font-weight: 700;
  font-family: var(--font-body);
  text-decoration: none;
  color: var(--color-primary-button);
  background: transparent;
  border: 1px solid var(--color-primary-button);
  border-radius: var(--border-radius);
  cursor: pointer;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease, transform 0.15s ease;
}
.ollmh-home-show-more-btn:hover {
  background: var(--color-accent-gold);
  color: var(--color-primary-dark);
  border-color: var(--color-accent-gold);
  text-decoration: none;
}
.ollmh-home-show-more-btn:active {
  transform: scale(0.97);
}
.ollmh-home-show-more-btn i {
  font-size: 0.85em;
  transition: transform 0.25s ease;
}
.ollmh-home-show-more-btn:hover i {
  transform: translateX(3px);
}

/* --- Partners archive grid (larger cards than homepage) --- */
.ollmh-partners-archive-grid {
  gap: 1.5rem;
}
.ollmh-partners-archive-grid .ollmh-home-partner-logo {
  min-width: 180px;
  min-height: 100px;
  padding: 1.25rem 1.75rem;
}
.ollmh-partners-archive-grid .ollmh-home-partner-logo img {
  max-width: 150px;
  max-height: 70px;
}
.ollmh-partners-archive-grid .ollmh-home-partner-initials {
  min-width: 56px;
  min-height: 56px;
  font-size: 1.25rem;
}

/* --- News & Updates --- */
.ollmh-home-news {
  padding: 4rem 1.5rem;
  background: var(--color-bg-white);
}
.ollmh-home-news-grid {
  max-width: var(--container-width);
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem;
}
.ollmh-home-news-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.ollmh-home-news-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.1);
  text-decoration: none;
}
.ollmh-home-news-card:hover h3,
.ollmh-home-news-card:hover p,
.ollmh-home-news-card:hover .ollmh-home-news-read {
  text-decoration: none;
}
.ollmh-home-news-img {
  position: relative; /* anchors the .ollmh-card-label category pill (top-right) */
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.ollmh-home-news-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.ollmh-home-news-card:hover .ollmh-home-news-img img {
  transform: scale(1.05);
}
.ollmh-home-news-body {
  padding: 1.25rem;
}
.ollmh-home-news-body h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.5rem;
}
.ollmh-home-news-body p {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.5;
  margin: 0 0 0.75rem;
}
.ollmh-home-news-read {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-primary-button);
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
}
.ollmh-home-news-read i {
  font-size: 0.6875rem;
  transition: transform 0.25s ease;
}
.ollmh-home-news-card:hover .ollmh-home-news-read i {
  transform: translateX(4px);
}
.ollmh-home-news-footer {
  text-align: center;
  margin-top: 2rem;
}

/* --- Final CTA — background image with blur overlay for depth & readability --- */
.ollmh-home-final-cta {
  position: relative;
  padding: 5rem 1.5rem;
  text-align: center;
  overflow: hidden;
}
/* Background image layer — blurred for subtle depth behind the content */
.ollmh-home-final-cta-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url('../images/original/slideshow/InpatientA.jpg');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  filter: blur(4px);
  transform: scale(1.08); /* prevent blurred edge gaps */
}
/* Dark gradient overlay — sits above the blurred image, below the content.
   Ensures white text remains readable against any background image. */
.ollmh-home-final-cta-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(135deg,
    rgba(0, 26, 85, 0.88) 0%,
    rgba(7, 17, 46, 0.82) 100%);
}
.ollmh-home-final-cta-inner {
  position: relative;
  z-index: 2;
  max-width: 760px;
  margin: 0 auto;
}
.ollmh-home-final-cta h2 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text-white);
  margin: 0 0 0.75rem;
}
.ollmh-home-final-cta p {
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.9);
  line-height: 1.6;
  margin: 0 0 1.75rem;
}
.ollmh-home-final-cta-buttons {
  display: flex;
  gap: 0.75rem;
  justify-content: center;
  flex-wrap: wrap;
}
.ollmh-home-final-cta-buttons .btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  /* Match hero CTA button dimensions exactly */
  padding: 0.7em 1.6em;
  font-size: var(--fs-large);
}
.ollmh-home-final-cta-buttons .btn i {
  font-size: 1.1em;
}
/* Emergency button — warm red accent to signal urgency */
.ollmh-home-final-cta .ollmh-cta-btn-emergency {
  background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%);
  border-color: #b91c1c;
}
.ollmh-home-final-cta .ollmh-cta-btn-emergency:hover {
  background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%);
  border-color: #dc2626;
}
.ollmh-home-final-cta .btn-outline {
  border-color: rgba(255, 255, 255, 0.4);
  color: var(--color-text-white);
}
.ollmh-home-final-cta .btn-outline:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: var(--color-text-white);
}

/* ============================================================
   ABOUT US PAGES — Shared styles for About, Leadership,
   History, and Careers pages
   ============================================================ */

/* --- Overview Section (two-column: text + image) --- */
.ollmh-about-overview {
  margin-bottom: 3rem;
}
.ollmh-about-overview-inner {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 3rem;
  align-items: stretch;
}
.ollmh-about-overview-content {
  background: #fff;
  border: 1px solid rgba(0, 26, 85, 0.08);
  border-radius: 16px;
  padding: 2.5rem;
  box-shadow: 0 4px 20px rgba(0, 26, 85, 0.06);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.ollmh-about-overview-content h2 {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.75rem 0 1rem;
  line-height: 1.2;
}
.ollmh-about-lead {
  font-size: 1rem;
  color: #475569;
  line-height: 1.7;
  margin: 0 0 1rem;
}
.ollmh-about-overview-content > p {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0 0 1rem;
}
.ollmh-about-overview-image {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0, 26, 85, 0.12);
  display: flex;
  align-items: center;
}
.ollmh-about-overview-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* --- Rotating Image (auto crossfade between 2+ images) ---
   Used on Careers, Philosophy of Care, and About Leadership pages.
   The first image stays in-flow to establish the container height;
   subsequent images are absolutely positioned overlays that crossfade. */
.ollmh-rotating-image {
  position: relative;
}
.ollmh-rotating-img {
  display: block;
  opacity: 0;
  transition: opacity 1.5s ease-in-out;
}
.ollmh-rotating-img.active {
  opacity: 1;
}
.ollmh-rotating-img:first-child {
  position: relative;
}
.ollmh-rotating-img + .ollmh-rotating-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Full-width variant when there is no image (cross-links / CTA sections) */
.ollmh-about-overview-full .ollmh-about-overview-inner {
  grid-template-columns: 1fr;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 1.5rem;
  text-align: center;
}
.ollmh-about-overview-full .ollmh-about-overview-content {
  text-align: center;
}
.ollmh-about-overview-full .ollmh-about-overview-content > p:last-child {
  margin-top: 0.5rem;
}
.ollmh-about-overview-full .ollmh-about-overview-content .btn {
  margin: 0.25rem;
}
/* On single post / news pages the page background is white, so the white
   overview card would blend in. Add a gray section background to make the
   card stand out — matches the look on archive/listing pages where the
   card sits inside .ollmh-contact-container (#f8fafc).
   When .ollmh-featured-cta is present and --ollmh-featured-bg is set, the
   featured image replaces the gray background (see below). */
.ollmh-single-news-page .ollmh-about-overview-full,
.ollmh-single-post-page .ollmh-about-overview-full,
.ollmh-single-event-page .ollmh-about-overview-full,
.ollmh-single-gallery-page .ollmh-about-overview-full {
  background: #f8fafc;
  padding: 3rem 0;
  margin-bottom: 0;
  border-top: 1px solid #e2e8f0;
}

/* ── Featured-image CTA cards ───────────────────────────────────────
   Both the bottom "Continue Reading" section (.ollmh-featured-cta) and
   the sidebar "Explore More" card (.ollmh-sidebar-explore-card) use the
   post's featured image as a background, set via the --ollmh-featured-bg
   CSS custom property (injected in PHP). A dark overlay ensures text
   readability. The two cards adapt to their containers:
     • Bottom card: full-width section, centered 800px card on top of
       the image with a semi-transparent dark overlay.
     • Sidebar card: 320px column, image fills the widget with a
       stronger overlay and white text. */

/* Bottom "Continue Reading" — full-width featured image background */
.ollmh-featured-cta {
  position: relative;
  background-image: var(--ollmh-featured-bg, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border-top: none;
}
.ollmh-featured-cta-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(0, 26, 85, 0.82) 0%, rgba(0, 90, 156, 0.72) 100%);
  z-index: 0;
}
.ollmh-featured-cta .ollmh-about-overview-inner {
  position: relative;
  z-index: 1;
}
.ollmh-featured-cta-content {
  background: rgba(255, 255, 255, 0.97);
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: 0 8px 32px rgba(0, 26, 85, 0.25);
}
.ollmh-featured-cta-content .ollmh-section-badge {
  background: var(--color-primary-button, #005a9c);
  color: #fff;
}
.ollmh-featured-cta-content h2 {
  color: var(--color-primary-heading, #001a55);
}
.ollmh-featured-cta-content .ollmh-about-lead {
  color: #475569;
}

/* Sidebar "Explore More" — compact featured image card */
.ollmh-sidebar-explore-card {
  position: relative;
  overflow: hidden;
  background-image: var(--ollmh-featured-bg, none);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: 1px solid rgba(0, 26, 85, 0.12);
}
.ollmh-sidebar-explore-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(160deg, rgba(0, 26, 85, 0.88) 0%, rgba(0, 90, 156, 0.78) 100%);
  z-index: 0;
}
.ollmh-sidebar-explore-body {
  position: relative;
  z-index: 1;
  padding: 1.25rem;
  text-align: center;
}
.ollmh-sidebar-explore-card .ollmh-sidebar-widget-title {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.3);
}
.ollmh-sidebar-explore-text {
  color: rgba(255, 255, 255, 0.85);
}
.ollmh-sidebar-explore-btn {
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(4px);
}
.ollmh-sidebar-explore-btn:hover {
  background: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.5);
}

/* Responsive — featured CTA cards */
@media (max-width: 768px) {
  .ollmh-featured-cta { padding: 2rem 0; }
  .ollmh-featured-cta-content { padding: 1.5rem; }
  .ollmh-sidebar-explore-body { padding: 1rem; }
}

/* Location action buttons — flex layout keeps the buttons from touching */
.ollmh-about-location-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.75rem;
  margin-top: 1rem;
}

/* --- Mission/Vision/Motto Cards --- */
.ollmh-about-mv-section {
  margin-bottom: 3rem;
}
.ollmh-about-mv-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}
.ollmh-about-mv-grid--two {
  grid-template-columns: repeat(2, 1fr);
}
.ollmh-about-mv-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 2rem 1.5rem;
  text-align: center;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.05);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-about-mv-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.1);
}
.ollmh-about-mv-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 100, 205, 0.1);
}
.ollmh-about-mv-icon i {
  font-size: 1.5rem;
  color: var(--color-primary-button);
}
.ollmh-about-mv-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.5rem;
}
.ollmh-about-mv-card p {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Core Values Grid --- */
.ollmh-about-values {
  margin-bottom: 3rem;
}
.ollmh-about-values-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem;
}
.ollmh-about-value-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1.75rem;
  text-align: center;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-about-value-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
}
.ollmh-about-value-icon {
  width: 56px;
  height: 56px;
  margin: 0 auto 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 100, 205, 0.1);
}
.ollmh-about-value-icon i {
  font-size: 1.5rem;
  color: var(--color-primary-button);
}
.ollmh-about-value-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.5rem;
}
.ollmh-about-value-card p {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- Quick Info Cards Grid --- */
.ollmh-about-info {
  margin-bottom: 3rem;
}
.ollmh-about-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem;
}
.ollmh-about-info .ollmh-info-card {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
.ollmh-about-info .ollmh-info-card .btn {
  align-self: flex-start;
  margin-top: auto;
}
/* Next intake date badge on programme cards (medical school page). */
.ollmh-prog-next-intake {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  color: var(--color-primary-button, #005a9c);
  background: rgba(0, 90, 156, 0.06);
  border-radius: 6px;
  padding: 0.5rem 0.75rem;
  margin: 0;
}
.ollmh-prog-next-intake i {
  color: var(--color-primary-button, #005a9c);
  flex-shrink: 0;
}
.ollmh-prog-next-intake strong {
  font-weight: 600;
}

/* --- Leadership Grid --- */
.ollmh-leadership-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-bottom: 3rem;
}
.ollmh-leader-card {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-leader-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.1);
}
.ollmh-leader-photo {
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: #f1f5f9;
}
.ollmh-leader-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ollmh-leader-photo-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}
.ollmh-leader-photo-placeholder i {
  font-size: 3rem;
  color: #cbd5e1;
}
.ollmh-leader-body {
  padding: 1.25rem;
}
.ollmh-leader-body h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.25rem;
}
.ollmh-leader-role {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-primary-button);
  margin: 0 0 0.625rem;
}
.ollmh-leader-bio {
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0 0 0.75rem;
}
.ollmh-leader-bio p { margin: 0 0 0.5rem; }
.ollmh-leader-bio p:last-child { margin-bottom: 0; }
.ollmh-leader-contact {
  display: flex;
  gap: 0.5rem;
}
.ollmh-leader-contact a {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  color: var(--color-primary-button);
  text-decoration: none;
  font-size: 0.875rem;
  transition: background 0.2s ease, color 0.2s ease;
}
.ollmh-leader-contact a:hover {
  background: var(--color-primary-button);
  color: var(--color-text-white);
}

/* --- Board Section (two-column: content + image) --- */
.ollmh-about-board {
  margin-bottom: 2rem;
}
.ollmh-about-board-card {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2.5rem;
  align-items: center;
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 2.5rem;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.05);
}
.ollmh-about-board-content h3 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.75rem 0 1rem;
}
.ollmh-about-board-content > p {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.7;
  margin: 0 0 1rem;
}
.ollmh-about-board-image img {
  width: 100%;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.1);
}
.ollmh-about-board-image.ollmh-rotating-image {
  overflow: hidden;
  border-radius: 12px;
}
.ollmh-about-apply-steps {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem;
}
.ollmh-about-apply-steps li {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: 0.875rem;
  color: #475569;
  margin-bottom: 0.625rem;
}
.ollmh-about-apply-steps i {
  color: var(--color-primary-button);
  font-size: 1rem;
  flex-shrink: 0;
}

/* --- Job Vacancy Single --- */
.ollmh-job-meta-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin: 1.25rem 0 1.5rem;
}
.ollmh-job-meta-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 600;
  background: rgba(0, 26, 85, 0.08);
  color: var(--color-primary, #001A55);
  border: 1px solid rgba(0, 26, 85, 0.15);
}
.ollmh-job-meta-badge i {
  font-size: 0.875rem;
  color: var(--color-primary-button);
}
.ollmh-job-meta-badge-deadline {
  background: rgba(201, 162, 39, 0.12);
  color: #8a6d10;
  border-color: rgba(201, 162, 39, 0.3);
}
.ollmh-job-meta-badge-deadline i {
  color: #c9a227;
}

.ollmh-job-detail-wrap {
  max-width: 920px;
  margin: 0 auto;
}

/* Intro paragraph with icon */
.ollmh-job-detail-intro {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.5rem 1.75rem;
  background: rgba(0, 26, 85, 0.03);
  border-radius: 12px;
  border-left: 4px solid var(--color-primary, #001A55);
  margin-bottom: 1.75rem;
}
.ollmh-job-detail-intro-icon {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  background: var(--color-primary, #001A55);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  color: #fff;
}
.ollmh-job-detail-intro p {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.7;
  color: #334155;
  padding-top: 0.25rem;
}

/* Two-column grid for Requirements + Responsibilities */
.ollmh-job-detail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1.5rem;
}

.ollmh-job-detail-card {
  background: #fff;
  border-radius: 12px;
  padding: 1.75rem;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.06);
  border: 1px solid rgba(0, 26, 85, 0.08);
}
.ollmh-job-detail-card-req {
  border-top: 4px solid #c9a227;
}
.ollmh-job-detail-card-res {
  border-top: 4px solid var(--color-primary, #001A55);
}

.ollmh-job-detail-card-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
  padding-bottom: 0.875rem;
  border-bottom: 1px solid rgba(0, 26, 85, 0.08);
}
.ollmh-job-detail-card-header i {
  font-size: 1.25rem;
}
.ollmh-job-detail-card-req .ollmh-job-detail-card-header i {
  color: #c9a227;
}
.ollmh-job-detail-card-res .ollmh-job-detail-card-header i {
  color: var(--color-primary, #001A55);
}
.ollmh-job-detail-card-header h3 {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-primary, #001A55);
}

.ollmh-job-detail-card ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ollmh-job-detail-card li {
  position: relative;
  padding-left: 1.5rem;
  font-size: 0.875rem;
  line-height: 1.65;
  color: #475569;
  margin-bottom: 0.625rem;
}
.ollmh-job-detail-card li:last-child {
  margin-bottom: 0;
}
.ollmh-job-detail-card li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.5rem;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
}
.ollmh-job-detail-card-req li::before {
  background: #c9a227;
}
.ollmh-job-detail-card-res li::before {
  background: var(--color-primary, #001A55);
}

@media (max-width: 768px) {
  .ollmh-job-detail-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .ollmh-job-detail-intro {
    padding: 1rem 1.25rem;
    gap: 0.75rem;
  }
  .ollmh-job-detail-intro-icon {
    width: 2.25rem;
    height: 2.25rem;
    font-size: 1rem;
  }
  .ollmh-job-detail-card {
    padding: 1.25rem;
  }
  .ollmh-job-meta-badges {
    gap: 0.5rem;
  }
  .ollmh-job-meta-badge {
    font-size: 0.75rem;
    padding: 0.4rem 0.75rem;
  }
}

/* --- Jobs Pagination --- */
.ollmh-jobs-pagination {
  margin-top: 2rem;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 0.25rem;
}
.ollmh-jobs-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary, #001A55);
  background: #fff;
  border: 1px solid rgba(0, 26, 85, 0.12);
  text-decoration: none;
  transition: all 0.2s ease;
}
.ollmh-jobs-pagination .page-numbers:hover {
  background: rgba(0, 26, 85, 0.06);
  border-color: rgba(0, 26, 85, 0.25);
  text-decoration: none;
}
.ollmh-jobs-pagination .page-numbers.current {
  background: var(--color-primary-button, #001A55);
  color: #fff;
  border-color: var(--color-primary-button, #001A55);
}
.ollmh-jobs-pagination .page-numbers.current:hover {
  background: var(--color-primary-button, #001A55);
}
.ollmh-jobs-pagination .page-numbers.prev,
.ollmh-jobs-pagination .page-numbers.next {
  padding: 0 0.875rem;
}
.ollmh-jobs-pagination .page-numbers.dots {
  border: none;
  background: transparent;
  min-width: auto;
  padding: 0 0.25rem;
}
.ollmh-jobs-pagination .page-numbers.dots:hover {
  background: transparent;
}

@media (max-width: 768px) {
  .ollmh-jobs-pagination {
    justify-content: center;
  }
  .ollmh-jobs-pagination .page-numbers {
    min-width: 2rem;
    height: 2rem;
    font-size: 0.8125rem;
  }
}

/* --- News Pagination Row (record count + page links) --- */
.ollmh-news-pagination-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 1rem;
  margin-top: 2rem;
}
.ollmh-news-pagination-row .ollmh-jobs-pagination {
  margin-top: 0; /* reset — the row handles spacing */
}
.ollmh-news-record-count {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.85rem;
  font-weight: 500;
  color: var(--color-text-heading, #1d2327);
  background: var(--color-bg-white, #fff);
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.4rem 0.85rem;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
  white-space: nowrap;
}
.ollmh-news-record-count i {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.8rem;
}

/* --- Timeline --- */
.ollmh-about-timeline-section {
  margin-bottom: 3rem;
}
.ollmh-about-timeline {
  position: relative;
  max-width: 800px;
  margin: 0 auto;
  padding-left: 2.5rem;
}
.ollmh-about-timeline::before {
  content: '';
  position: absolute;
  left: 20px;
  top: 0;
  bottom: 0;
  width: 2px;
  background: linear-gradient(to bottom, var(--color-primary-button), var(--color-border-light));
}
.ollmh-about-timeline-item {
  position: relative;
  margin-bottom: 2rem;
}
.ollmh-about-timeline-item:last-child {
  margin-bottom: 0;
}
.ollmh-about-timeline-marker {
  position: absolute;
  left: -2.5rem;
  top: 0;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--color-bg-white);
  border: 2px solid var(--color-primary-button);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}
.ollmh-about-timeline-marker i {
  font-size: 1rem;
  color: var(--color-primary-button);
}
.ollmh-about-timeline-content {
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  padding: 1.25rem 1.5rem;
  box-shadow: 0 2px 8px rgba(0, 26, 85, 0.04);
}
.ollmh-about-timeline-year {
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary-button);
}
.ollmh-about-timeline-content h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0.375rem 0 0.5rem;
}
.ollmh-about-timeline-content p {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0;
}

/* --- History Gallery --- */
.ollmh-about-history-gallery {
  margin-bottom: 2rem;
}
.ollmh-about-history-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1rem;
}
.ollmh-about-history-img {
  aspect-ratio: 4 / 3;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 26, 85, 0.08);
}
.ollmh-about-history-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.ollmh-about-history-img:hover img {
  transform: scale(1.05);
}

/* --- Intro section (shared) --- */
.ollmh-about-intro {
  margin-bottom: 2rem;
}

/* --- Philosophy of Care: Motto Hero --- */
.ollmh-philosophy-motto {
  margin-bottom: 3rem;
  padding: 3rem 2rem;
  background: linear-gradient(135deg, var(--color-primary-button, #1a5276), var(--color-primary-dark, #0a3d62));
  border-radius: 16px;
  text-align: center;
  color: #fff;
  position: relative;
  overflow: hidden;
}
.ollmh-philosophy-motto::before {
  content: '';
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255,255,255,0.06) 0%, transparent 60%);
  pointer-events: none;
}
.ollmh-philosophy-motto-inner {
  position: relative;
  z-index: 1;
  max-width: 800px;
  margin: 0 auto;
}
.ollmh-philosophy-motto-inner .fas {
  font-size: 1.5rem;
  opacity: 0.4;
  margin: 0 0.5rem;
}
.ollmh-philosophy-motto-inner h2 {
  font-size: clamp(1.5rem, 4vw, 2.5rem);
  font-style: italic;
  font-weight: 600;
  line-height: 1.4;
  margin: 1rem 0;
  color: #fff;
}

/* --- OLLMH Outlook Gallery Grid --- */
.ollmh-outlook-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1.5rem;
  margin-bottom: 2rem;
}
.ollmh-outlook-gallery-item {
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 26, 85, 0.08);
  background: #fff;
  transition: box-shadow 0.3s ease, transform 0.3s ease;
}
.ollmh-outlook-gallery-item:hover {
  box-shadow: 0 8px 28px rgba(0, 26, 85, 0.15);
  transform: translateY(-4px);
}
.ollmh-outlook-gallery-item img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.ollmh-outlook-gallery-item:hover img {
  transform: scale(1.05);
}
.ollmh-outlook-gallery-item figcaption {
  padding: 0.75rem 1rem;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-primary-dark, #0a3d62);
  text-align: center;
  border-top: 1px solid rgba(0, 26, 85, 0.06);
}

/* ── Gallery Archive — Album Cards ───────────────────────────────────── */
.ollmh-gallery-albums-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1.5rem;
  /* Match the news/events grids so the sort bar dropdowns are clearly
     separated from the album cards. Previously this was missing, which
     left the cards touching the sort bar. */
  margin-top: 1.5rem;
  margin-bottom: 2rem;
}
.ollmh-gallery-album-card {
  display: flex;
  flex-direction: column;
  text-decoration: none;
  color: inherit;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.06);
  border: 1px solid rgba(0, 26, 85, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-gallery-album-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.12);
  text-decoration: none;
}
/* Shared blue top-right card label.
   Used by gallery, news, and event cards to surface a short categorical
   label (location, tag, or category) directly on the thumbnail. Each card
   type supplies its own fallback text via PHP so a label is always present
   even when the underlying meta is missing, keeping the card grid visually
   consistent. */
.ollmh-card-label {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 2;
  background: var(--color-primary-button, #0064CD);
  color: #fff;
  font-size: 0.7rem;
  font-weight: 600;
  padding: 0.3rem 0.75rem;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  max-width: calc(100% - 1.5rem);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  box-shadow: 0 2px 6px rgba(0, 26, 85, 0.25);
  pointer-events: none;
}
.ollmh-card-label i {
  margin-right: 0.3rem;
  font-size: 0.7rem;
}

.ollmh-gallery-album-cover {
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.ollmh-gallery-album-cover img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.ollmh-gallery-album-card:hover .ollmh-gallery-album-cover img {
  transform: scale(1.05);
}
.ollmh-gallery-album-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0, 26, 85, 0.5) 0%, transparent 60%);
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  padding: 0.75rem;
  opacity: 0;
  transition: opacity 0.25s ease;
}
.ollmh-gallery-album-card:hover .ollmh-gallery-album-overlay {
  opacity: 1;
}
.ollmh-gallery-album-overlay i {
  font-size: 1.5rem;
  color: #fff;
  background: rgba(0, 26, 85, 0.7);
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ollmh-gallery-album-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}
.ollmh-gallery-album-body h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading, #102041);
  margin: 0;
  line-height: 1.4;
}
.ollmh-gallery-album-body > p {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.5;
  margin: 0;
  flex: 1;
}
.ollmh-gallery-album-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  font-size: 0.75rem;
  color: #94a3b8;
  margin-top: 0.5rem;
}
.ollmh-gallery-album-meta span {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.2rem 0.55rem;
  border-radius: 50px;
  background: #f1f5f9;
  transition: background 0.2s ease, color 0.2s ease;
  cursor: default;
}
.ollmh-gallery-album-meta span:hover {
  background: var(--color-primary-button, #0064CD);
  color: #fff;
}
.ollmh-gallery-album-meta span:hover i {
  color: #fff;
}
.ollmh-gallery-album-meta i {
  color: var(--color-primary-button, #0064CD);
  font-size: 0.75rem;
  transition: color 0.2s ease;
}
.ollmh-gallery-album-read-more {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.875rem;
  font-weight: 600;
  margin-top: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ollmh-gallery-album-card:hover .ollmh-gallery-album-read-more i {
  transform: translateX(4px);
  transition: transform 0.2s ease;
}

/* Gallery empty state */
.ollmh-gallery-empty {
  text-align: center;
  padding: 3rem 1.5rem;
  color: #94a3b8;
}
.ollmh-gallery-empty i {
  font-size: 3rem;
  color: rgba(0, 26, 85, 0.15);
  margin-bottom: 1rem;
}
.ollmh-gallery-empty h3 {
  font-size: 1.25rem;
  color: var(--color-primary-heading, #102041);
  margin: 0 0 0.5rem;
}
.ollmh-gallery-empty p {
  margin: 0;
}

/* ── Gallery Lightbox — Photo Details Popup ──────────────────────────── */
.gallery-lightbox {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
}
.gallery-lightbox.is-open {
  display: flex;
}
.gallery-lightbox .lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.92);
  backdrop-filter: blur(4px);
}

/* Modal container — centered card with image + details panel */
.gallery-lightbox .lightbox-modal {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(1100px, 94vw);
  max-height: 92vh;
  background: #fff;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.5);
}

/* Close button — floats top-right of modal */
.gallery-lightbox .lightbox-close {
  position: absolute;
  top: 0.75rem;
  right: 0.75rem;
  z-index: 10;
  width: 2.5rem;
  height: 2.5rem;
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  color: #1e293b;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  transition: background 0.2s ease, transform 0.2s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.gallery-lightbox .lightbox-close:hover {
  background: #fff;
  transform: scale(1.08);
}

/* Body — two-column: image left, details right */
.gallery-lightbox .lightbox-body {
  display: grid;
  grid-template-columns: 1fr 340px;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}

/* Image column */
.gallery-lightbox .lightbox-image-wrap {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #0f172a;
  min-height: 300px;
  overflow: hidden;
}
.gallery-lightbox .lightbox-figure {
  margin: 0;
  max-width: 100%;
  max-height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.gallery-lightbox .lightbox-image {
  max-width: 100%;
  max-height: 70vh;
  object-fit: contain;
  display: block;
}

/* Prev / Next nav buttons — float over image */
.gallery-lightbox .lightbox-prev,
.gallery-lightbox .lightbox-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  width: 3rem;
  height: 3rem;
  background: rgba(255, 255, 255, 0.15);
  border: none;
  border-radius: 50%;
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  transition: background 0.2s ease, transform 0.2s ease;
  backdrop-filter: blur(4px);
}
.gallery-lightbox .lightbox-prev:hover,
.gallery-lightbox .lightbox-next:hover {
  background: rgba(255, 255, 255, 0.3);
  transform: translateY(-50%) scale(1.08);
}
.gallery-lightbox .lightbox-prev { left: 1rem; }
.gallery-lightbox .lightbox-next { right: 1rem; }

/* Details panel — right sidebar */
.gallery-lightbox .lightbox-details {
  display: flex;
  flex-direction: column;
  padding: 1.5rem;
  overflow-y: auto;
  background: #fff;
}
.gallery-lightbox .lightbox-details-header {
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e2e8f0;
}
.gallery-lightbox .lightbox-counter {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary-button, #005a9c);
  background: rgba(0, 90, 156, 0.1);
  padding: 0.25rem 0.6rem;
  border-radius: 999px;
  margin-bottom: 0.5rem;
}
.gallery-lightbox .lightbox-photo-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1e293b;
  margin: 0;
  line-height: 1.4;
}

/* Meta rows — album, photographer, location, date */
.gallery-lightbox .lightbox-details-meta {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.gallery-lightbox .lightbox-meta-row {
  display: flex;
  gap: 0.75rem;
  align-items: flex-start;
  font-size: 0.875rem;
  color: #475569;
  line-height: 1.5;
}
.gallery-lightbox .lightbox-meta-row i {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.9rem;
  margin-top: 0.2rem;
  flex-shrink: 0;
}
.gallery-lightbox .lightbox-meta-row strong {
  color: #1e293b;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  display: block;
  margin-bottom: 0.1rem;
}

/* Caption */
.gallery-lightbox .lightbox-caption {
  font-size: 0.9rem;
  line-height: 1.6;
  color: #475569;
  margin: 0 0 1.25rem;
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid var(--color-primary-button, #005a9c);
}

/* Actions — download + share */
.gallery-lightbox .lightbox-details-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
}
.gallery-lightbox .lightbox-download {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 1rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border-radius: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  text-decoration: none;
  transition: background 0.2s ease, transform 0.2s ease;
}
.gallery-lightbox .lightbox-download:hover {
  background: #004a82;
  transform: translateY(-1px);
  text-decoration: none;
  color: #fff;
}
.gallery-lightbox .lightbox-share {
  display: flex;
  gap: 0.4rem;
  flex-wrap: wrap;
}
.gallery-lightbox .lightbox-share-btn {
  width: 36px;
  height: 36px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #f1f5f9;
  border-radius: 50%;
  color: #64748b;
  font-size: 0.9rem;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
}
.gallery-lightbox .lightbox-share-btn:hover {
  background: var(--ollmh-share-color, #005a9c);
  color: #fff;
  transform: translateY(-2px);
  text-decoration: none;
}
.gallery-lightbox .lightbox-share-btn:visited {
  color: #64748b;
}
.gallery-lightbox .lightbox-share-btn:visited:hover {
  color: #fff;
}

/* Thumbnail strip — horizontal scroll */
.gallery-lightbox .lightbox-thumbs-wrap {
  margin-top: auto;
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
}
.gallery-lightbox .lightbox-thumbs {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding-bottom: 0.25rem;
  scrollbar-width: thin;
  scrollbar-color: #cbd5e1 transparent;
}
.gallery-lightbox .lightbox-thumbs::-webkit-scrollbar {
  height: 5px;
}
.gallery-lightbox .lightbox-thumbs::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 999px;
}
.gallery-lightbox .lightbox-thumb {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border: 2px solid transparent;
  border-radius: 8px;
  overflow: hidden;
  cursor: pointer;
  padding: 0;
  background: #f1f5f9;
  transition: border-color 0.2s ease, transform 0.2s ease;
}
.gallery-lightbox .lightbox-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.gallery-lightbox .lightbox-thumb:hover {
  transform: translateY(-2px);
}
.gallery-lightbox .lightbox-thumb.is-active {
  border-color: var(--color-primary-button, #005a9c);
}

body.lightbox-open {
  overflow: hidden;
}

/* ── Responsive — Lightbox ──────────────────────────────────────────── */
@media (max-width: 900px) {
  .gallery-lightbox .lightbox-modal {
    width: 96vw;
    max-height: 94vh;
  }
  .gallery-lightbox .lightbox-body {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
  .gallery-lightbox .lightbox-image-wrap {
    min-height: 200px;
    max-height: 50vh;
  }
  .gallery-lightbox .lightbox-image {
    max-height: 48vh;
  }
  .gallery-lightbox .lightbox-details {
    padding: 1rem;
  }
}

@media (max-width: 768px) {
  .ollmh-gallery-albums-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
  .gallery-lightbox .lightbox-prev,
  .gallery-lightbox .lightbox-next {
    width: 2.25rem;
    height: 2.25rem;
  }
  .gallery-lightbox .lightbox-prev { left: 0.5rem; }
  .gallery-lightbox .lightbox-next { right: 0.5rem; }
  .gallery-lightbox .lightbox-close {
    width: 2rem;
    height: 2rem;
    font-size: 0.9rem;
  }
  .gallery-lightbox .lightbox-thumb {
    width: 44px;
    height: 44px;
  }
}

@media (max-width: 480px) {
  .gallery-lightbox .lightbox-details-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .gallery-lightbox .lightbox-download {
    justify-content: center;
  }
  .gallery-lightbox .lightbox-share {
    justify-content: center;
  }
}

/* ── Application Form Wizard ──────────────────────────────────────────── */
/* Override the plugin's forms.css to match our theme's design system. */

.ollmh-application-wrap {
  --ollmh-primary: var(--color-primary-button);
  --ollmh-primary-dark: var(--color-primary);
  --ollmh-error: #c0392b;
  --ollmh-success: #1e8449;
  --ollmh-radius: 12px;
  --ollmh-border: #e2e8f0;

  max-width: 100%;
  margin: 0;
}

/* Progress bar — match our blue gradient */
.ollmh-step-progress {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.06);
  margin-bottom: 2rem;
}
.ollmh-step-progress li {
  background: #f1f5f9;
  color: #64748b;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.85rem 0.5rem;
  border-right: 1px solid #e2e8f0;
}
.ollmh-step-progress li:last-child { border-right: none; }
.ollmh-step-progress li::before {
  width: 1.6em;
  height: 1.6em;
  line-height: 1.6em;
  border-radius: 50%;
  background: #cbd5e1;
  color: #fff;
  font-weight: 700;
  margin-right: 0.5rem;
  font-size: 0.8rem;
}
.ollmh-step-progress li.is-active {
  background: var(--gradient-primary-button);
  color: #fff;
}
.ollmh-step-progress li.is-active::before {
  background: #fff;
  color: var(--color-primary-button);
}
.ollmh-step-progress li.is-complete {
  background: #dbeafe;
  color: var(--color-primary);
}
.ollmh-step-progress li.is-complete::before {
  background: var(--color-primary-button);
  color: #fff;
}

/* Form container */
.ollmh-application-form {
  max-width: 100%;
  font-family: var(--font-body);
}

/* intlTelInput — international phone field with country flag dropdown.
   Mirrors the .ollmh-contact-form .iti rules so the flag selector,
   dial code, and country list match the contact/event form treatment. */
.ollmh-application-form .iti { width: 100%; }
.ollmh-application-form .iti .iti__flag {
  background-image: url('https://cdn.jsdelivr.net/npm/intl-tel-input@18.2.1/build/img/flags.png');
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .ollmh-application-form .iti .iti__flag {
    background-image: url('https://cdn.jsdelivr.net/npm/intl-tel-input@18.2.1/build/img/flags@2x.png');
  }
}
.ollmh-application-form .iti--separate-dial-code .iti__selected-flag {
  background-color: transparent;
  padding-left: 0.85rem;
}
.ollmh-application-form .iti__selected-flag:hover,
.ollmh-application-form .iti__selected-flag:focus {
  background-color: rgba(30, 64, 175, 0.06);
}
.ollmh-application-form .iti--separate-dial-code .iti__selected-dial-code {
  margin-left: 0.4rem;
  font-size: 0.9rem;
  color: var(--color-text-heading);
  font-weight: 600;
}
.ollmh-application-form .iti__country-list {
  border-radius: 0.375rem;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  border: 1px solid #f3f4f6;
  max-height: 280px;
}
.ollmh-application-form .iti__country {
  padding: 0.5rem 0.75rem;
  font-size: 0.85rem;
}
.ollmh-application-form .iti__highlight {
  background-color: rgba(30, 64, 175, 0.08);
}
.ollmh-application-form .iti__dial-code {
  color: #6b7280;
}
.ollmh-application-form .iti input[type="tel"] { width: 100%; }

/* Fieldsets — style like our cards */
.ollmh-step fieldset {
  border: none;
  border-radius: 12px;
  padding: 2rem;
  margin-bottom: 1.5rem;
  background: var(--color-bg-white);
  box-shadow: 0 2px 16px rgba(0, 26, 85, 0.06);
}
.ollmh-step legend {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.1rem;
  padding: 0 0 0.75rem 0;
  margin-bottom: 1rem;
  color: var(--color-primary-heading);
  border-bottom: 2px solid var(--color-primary-button);
  width: 100%;
  display: block;
}

/* Inputs — match our theme styling */
.ollmh-field > label {
  font-weight: 600;
  font-size: 0.9rem;
  color: var(--color-primary-heading);
  margin-bottom: 0.4rem;
}
.ollmh-field .required { color: #dc2626; }

.ollmh-field input[type="text"],
.ollmh-field input[type="email"],
.ollmh-field input[type="tel"],
.ollmh-field input[type="number"],
.ollmh-field input[type="date"],
.ollmh-field input[type="file"],
.ollmh-field select,
.ollmh-field textarea {
  width: 100%;
  padding: 0.7rem 0.9rem;
  border: 1.5px solid #e2e8f0;
  border-radius: 8px;
  background: #f8fafc;
  font-size: 0.95rem;
  font-family: var(--font-body);
  color: var(--color-primary-heading);
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

/* Custom chevron for <select> dropdowns — replaces the native arrow with
   an SVG chevron positioned with comfortable spacing from the right edge.
   The .is-open class (toggled by JS) flips the chevron to point up and
   turns it blue when the dropdown is active. */
.ollmh-field select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 2.5rem;
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 0.85rem center;
  background-size: 1rem;
  cursor: pointer;
}
.ollmh-field select::-ms-expand { display: none; }
.ollmh-field select.is-open {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23005a9c' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='18 15 12 9 6 15'/%3E%3C/svg%3E");
}
.ollmh-field input:focus,
.ollmh-field select:focus,
.ollmh-field textarea:focus {
  border-color: var(--color-primary-button);
  box-shadow: 0 0 0 3px rgba(0, 100, 205, 0.12);
  background: #fff;
  outline: none;
}
.ollmh-field input::placeholder,
.ollmh-field textarea::placeholder { color: #94a3b8; }

/* Grid layouts */
.ollmh-form-grid-2,
.ollmh-form-grid-3,
.ollmh-form-grid-4 { gap: 1.25rem; }

/* Buttons — match our theme buttons */
.ollmh-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.75rem 2rem;
  border: 1px solid transparent;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 700;
  font-family: var(--font-heading);
  cursor: pointer;
  transition: filter 0.15s ease, opacity 0.15s ease, transform 0.15s ease;
  text-align: center;
  text-decoration: none;
  box-shadow: var(--shadow-button);
}
.ollmh-btn-primary {
  background: var(--gradient-primary-button);
  color: var(--color-text-white);
  border-color: var(--color-primary-button);
}
.ollmh-btn-primary:hover {
  filter: brightness(1.08);
  color: var(--color-text-white);
  transform: translateY(-1px);
}
.ollmh-btn-primary:active { filter: brightness(0.95); transform: translateY(0); }
.ollmh-btn-secondary {
  background: #f1f5f9;
  color: var(--color-primary-heading);
  border-color: #e2e8f0;
  box-shadow: none;
}
.ollmh-btn-secondary:hover {
  background: #e2e8f0;
  color: var(--color-primary-heading);
}
.ollmh-btn:disabled,
.ollmh-btn[disabled] { opacity: 0.6; cursor: not-allowed; transform: none; }

.ollmh-form-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding: 0 0 1.5rem;
}
.ollmh-step-actions { justify-content: space-between; }

/* Spinner */
.ollmh-form-spinner {
  border: 2px solid rgba(0, 100, 205, 0.2);
  border-top-color: var(--color-primary-button);
}

/* Messages */
.ollmh-message {
  border-radius: 8px;
  font-weight: 500;
}
.ollmh-message.is-success {
  background: #ecfdf5;
  color: #065f46;
  border: 1px solid #a7f3d0;
}
.ollmh-message.is-error {
  background: #fef2f2;
  color: #991b1b;
  border: 1px solid #fecaca;
}

/* Field errors */
.ollmh-field-error { color: #dc2626; font-size: 0.82rem; }
.ollmh-field.has-error input,
.ollmh-field.has-error select,
.ollmh-field.has-error textarea {
  border-color: #dc2626;
  background: #fef2f2;
}

/* Checkbox */
.ollmh-checkbox {
  font-weight: 400;
  font-size: 0.95rem;
  color: var(--color-primary-heading);
  gap: 0.6rem;
}
.ollmh-checkbox input { width: 1.1rem; height: 1.1rem; accent-color: var(--color-primary-button); }

/* Upload fields */
.ollmh-upload-field input[type="file"] {
  padding: 0.6rem 0.9rem;
  border: 1.5px dashed #cbd5e1;
  background: #f8fafc;
  border-radius: 8px;
}
.ollmh-upload-field input[type="file"]:focus {
  border-color: var(--color-primary-button);
  border-style: solid;
}
.ollmh-upload-progress::-webkit-progress-value { background: var(--gradient-primary-button); }
.ollmh-upload-progress::-moz-progress-bar { background: var(--color-primary-button); }

/* Review summary — accordion (categorised, single-expand) */
.ollmh-review-accordion {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin: 0;
}
.ollmh-review-accordion-item {
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.ollmh-review-accordion-item.is-open {
  box-shadow: 0 2px 8px rgba(0, 26, 85, 0.06);
}
.ollmh-review-accordion-header {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.85rem 1rem;
  background: none;
  border: none;
  font-size: 0.95rem;
  font-weight: 700;
  font-family: var(--font-heading);
  color: var(--color-primary-heading);
  text-align: left;
  cursor: pointer;
  transition: background 0.15s ease;
}
.ollmh-review-accordion-header:hover { background: #f8fafc; }
.ollmh-review-accordion-header:focus-visible {
  outline: 2px solid var(--color-primary-button);
  outline-offset: -2px;
}
.ollmh-review-accordion-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-review-accordion-title > i {
  color: var(--color-primary-button);
  font-size: 0.95rem;
  flex-shrink: 0;
}
.ollmh-review-accordion-icon {
  font-size: 0.8rem;
  color: #64748b;
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.ollmh-review-accordion-item.is-open .ollmh-review-accordion-icon {
  transform: rotate(180deg);
  color: var(--color-primary-button);
}
.ollmh-review-accordion-body {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 1rem;
}
.ollmh-review-accordion-item.is-open .ollmh-review-accordion-body {
  padding-bottom: 1rem;
}

.ollmh-review-list {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 0.6rem 1.5rem;
  margin: 0;
  font-size: 0.95rem;
}
.ollmh-review-list dt {
  font-weight: 700;
  color: var(--color-primary-heading);
  font-family: var(--font-heading);
}
.ollmh-review-list dd {
  margin: 0;
  color: #475569;
}

/* Turnstile */
.ollmh-turnstile-field { margin: 1.5rem 0; }

/* Responsive — stack grids on tablet */
@media (max-width: 768px) {
  .ollmh-step fieldset { padding: 1.25rem; }
  .ollmh-form-grid-2,
  .ollmh-form-grid-3,
  .ollmh-form-grid-4 {
    grid-template-columns: 1fr;
  }
  .ollmh-step-progress { flex-direction: column; }
  .ollmh-step-progress li {
    text-align: left;
    border-right: none;
    border-bottom: 1px solid #e2e8f0;
  }
  .ollmh-step-progress li:last-child { border-bottom: none; }
  .ollmh-form-actions { padding: 0 0 1.25rem; }
}

/* ── Legal Page Content ───────────────────────────────────────────────── */
.ollmh-legal-content {
  max-width: 800px;
  margin: 0 auto;
  font-size: 0.95rem;
  line-height: 1.7;
  color: #334155;
}
.ollmh-legal-content h2 {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 2rem 0 0.75rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #e2e8f0;
}
.ollmh-legal-content h2:first-child { margin-top: 0; }
.ollmh-legal-content h3 {
  font-family: var(--font-heading);
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 1.5rem 0 0.5rem;
}
.ollmh-legal-content p { margin: 0 0 1rem; }
.ollmh-legal-content ul,
.ollmh-legal-content ol {
  margin: 0 0 1rem 1.5rem;
  padding: 0;
}
.ollmh-legal-content li { margin-bottom: 0.4rem; }
.ollmh-legal-content a {
  color: var(--color-primary-button);
  text-decoration: underline;
  font-weight: 500;
}
.ollmh-legal-content a:hover { color: var(--color-nav-hover); }
.ollmh-legal-cross-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  justify-content: center;
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid #e2e8f0;
}

/* ── FAQ Accordion ────────────────────────────────────────────────────── */
.ollmh-faq-category {
  margin-bottom: 2rem;
}
.ollmh-faq-category-title {
  font-family: var(--font-heading);
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 1rem;
  padding: 0.75rem 1rem;
  background: #f1f5f9;
  border-radius: 8px;
  border-left: 4px solid var(--color-primary-button);
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-faq-category-title i { color: var(--color-primary-button); }
.ollmh-faq-item {
  background: var(--color-bg-white);
  border-radius: 8px;
  margin-bottom: 0.75rem;
  box-shadow: 0 1px 6px rgba(0, 26, 85, 0.05);
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.ollmh-faq-item.is-open {
  box-shadow: 0 2px 12px rgba(0, 26, 85, 0.1);
}
.ollmh-faq-question {
  width: 100%;
  background: none;
  border: none;
  padding: 1rem 1.25rem;
  font-size: 0.95rem;
  font-weight: 600;
  font-family: var(--font-body);
  color: var(--color-primary-heading);
  text-align: left;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  transition: background 0.15s ease;
}
.ollmh-faq-question:hover { background: #f8fafc; }
.ollmh-faq-question:focus-visible {
  outline: 2px solid var(--color-primary-button);
  outline-offset: -2px;
}
.ollmh-faq-icon {
  font-size: 0.8rem;
  color: var(--color-primary-button);
  transition: transform 0.2s ease;
  flex-shrink: 0;
}
.ollmh-faq-item.is-open .ollmh-faq-icon { transform: rotate(180deg); }
.ollmh-faq-answer {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 1.25rem;
}
.ollmh-faq-item.is-open .ollmh-faq-answer { padding-bottom: 1rem; }
.ollmh-faq-answer p {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
  line-height: 1.6;
  color: #475569;
}
.ollmh-faq-answer p:last-child { margin-bottom: 0; }
.ollmh-faq-answer a {
  color: var(--color-primary-button);
  text-decoration: underline;
  font-weight: 500;
}
.ollmh-faq-answer ul {
  margin: 0.5rem 0 0.5rem 1.5rem;
  font-size: 0.9rem;
  color: #475569;
}
.ollmh-faq-answer li { margin-bottom: 0.3rem; }

/* ── Events Grid & Cards ──────────────────────────────────────────── */
.ollmh-events-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.ollmh-event-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-white);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-decoration: none;
  color: inherit;
}
.ollmh-event-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  text-decoration: none;
}
.ollmh-event-card-image {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: #f1f5f9;
}
.ollmh-event-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ollmh-event-card-no-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #1e3a5f, #2563eb);
  color: #fff;
  font-size: 3rem;
}
.ollmh-event-card-category {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  background: rgba(255, 255, 255, 0.95);
  color: #1e3a5f;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ollmh-event-card-date-badge {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border-radius: 8px;
  padding: 0.5rem 0.75rem;
  text-align: center;
  line-height: 1.2;
  min-width: 56px;
}
.ollmh-event-card-day {
  display: block;
  font-size: 1.5rem;
  font-weight: 700;
}
.ollmh-event-card-month {
  display: block;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.ollmh-event-card-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}
.ollmh-event-card-body h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0;
  line-height: 1.4;
}
.ollmh-event-card-body > p {
  font-size: 0.875rem;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
  flex: 1;
}
.ollmh-event-card-meta {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.5rem;
}
.ollmh-event-card-meta-item {
  font-size: 0.8rem;
  color: #64748b;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.2rem 0.55rem;
  border-radius: 50px;
  background: #f1f5f9;
  transition: background 0.2s ease, color 0.2s ease;
  cursor: default;
  align-self: flex-start;
}
.ollmh-event-card-meta-item:hover {
  background: var(--color-primary-button, #0064CD);
  color: #fff;
}
.ollmh-event-card-meta-item:hover i {
  color: #fff;
}
.ollmh-event-card-meta-item i {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.85rem;
  transition: color 0.2s ease;
}
.ollmh-event-card-read-more {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.875rem;
  font-weight: 600;
  margin-top: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ollmh-event-card:hover .ollmh-event-card-read-more i {
  transform: translateX(4px);
  transition: transform 0.2s ease;
}

/* ── Event Detail (single) ────────────────────────────────────────── */
.ollmh-event-detail-meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.ollmh-event-detail-meta-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid var(--color-primary-button, #005a9c);
}
.ollmh-event-detail-meta-item > i {
  font-size: 1.25rem;
  color: var(--color-primary-button, #005a9c);
  margin-top: 0.125rem;
}
.ollmh-event-detail-meta-item > div {
  display: flex;
  flex-direction: column;
}
.ollmh-event-detail-meta-item strong {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #94a3b8;
}
.ollmh-event-detail-meta-item span {
  font-size: 0.9375rem;
  color: var(--color-text-heading);
  font-weight: 500;
}
.ollmh-event-content-wrap {
  background: transparent;
  padding: 0;
  box-shadow: none;
  margin-top: 0;
}
.ollmh-event-content {
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
}
.ollmh-event-content p { margin: 0 0 1rem; }
.ollmh-event-content h2,
.ollmh-event-content h3 { margin: 1.5rem 0 0.75rem; }
.ollmh-event-registration-cta {
  margin-top: 1.5rem;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.75rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-event-registration-cta:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}

/* ── News Grid & Cards ────────────────────────────────────────────── */

/* Sort bar — per-page selector on the left, sort selector on the right. */
.ollmh-news-sort-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.5rem;
  /* Generous bottom margin keeps the dropdowns visually separated from the
     card grid below. The card grids also carry their own margin-top, so
     the two combine to give consistent breathing room across the gallery,
     news, and events archives. */
  margin-bottom: 1.5rem;
}
.ollmh-news-sort-form {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--color-bg-white, #fff);
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  padding: 0.4rem 0.7rem;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
}
.ollmh-news-sort-label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-text-heading, #1d2327);
  white-space: nowrap;
  margin: 0;
}
.ollmh-news-sort-label i { color: var(--color-primary-button, #005a9c); font-size: 0.8rem; }
.ollmh-news-sort-select {
  font-family: inherit;
  font-size: 0.85rem;
  color: var(--color-text-heading, #1d2327);
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  padding: 0.3rem 0.6rem;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-news-sort-select:hover { border-color: var(--color-primary-button, #005a9c); }
.ollmh-news-sort-select:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.12);
}
.ollmh-news-sort-go {
  font-size: 0.8rem;
  padding: 0.3rem 0.8rem;
  border-radius: 6px;
  border: 1px solid var(--color-primary-button, #005a9c);
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  cursor: pointer;
}

.ollmh-news-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
  margin-top: 1.5rem;
}
.ollmh-news-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-white);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  text-decoration: none;
  color: inherit;
}
.ollmh-news-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  text-decoration: none;
}
.ollmh-news-card-image {
  position: relative;
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: #f1f5f9;
}
.ollmh-news-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ollmh-news-card-no-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #0f766e, #14b8a6);
  color: #fff;
  font-size: 3rem;
}
.ollmh-news-card-category {
  position: absolute;
  top: 0.75rem;
  left: 0.75rem;
  background: rgba(255, 255, 255, 0.95);
  color: #0f766e;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ollmh-news-card-media-badge {
  position: absolute;
  bottom: 0.75rem;
  right: 0.75rem;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.3rem 0.75rem;
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}
.ollmh-news-card-media-badge i { font-size: 0.9rem; }
.ollmh-news-card-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  flex: 1;
}
.ollmh-news-card-body h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0;
  line-height: 1.4;
}
.ollmh-news-card-body > p {
  font-size: 0.875rem;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
  flex: 1;
}
/* Tag chips displayed on each news card (replaces the old category badge). */
.ollmh-news-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.25rem;
}
.ollmh-news-card-tag {
  font-size: 0.72rem;
  font-weight: 500;
  color: #005a9c;
  background: rgba(0, 90, 156, 0.08);
  padding: 0.15rem 0.55rem;
  border-radius: 50px;
  line-height: 1.4;
  white-space: nowrap;
  transition: background 0.2s ease, color 0.2s ease;
  cursor: default;
}
.ollmh-news-card-tag:hover {
  background: var(--color-primary-button, #0064CD);
  color: #fff;
}
.ollmh-news-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.ollmh-news-card-meta-item {
  font-size: 0.8rem;
  color: #64748b;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.2rem 0.55rem;
  border-radius: 50px;
  background: #f1f5f9;
  transition: background 0.2s ease, color 0.2s ease;
  cursor: default;
}
.ollmh-news-card-meta-item:hover {
  background: var(--color-primary-button, #0064CD);
  color: #fff;
}
.ollmh-news-card-meta-item:hover i {
  color: #fff;
}
.ollmh-news-card-meta-item i {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.85rem;
  transition: color 0.2s ease;
}
.ollmh-news-card-media-indicator { color: #0f766e; }
.ollmh-news-card-media-indicator i { color: #0f766e; }
.ollmh-news-card-meta-item.ollmh-news-card-media-indicator:hover {
  background: var(--color-primary-button, #0064CD);
  color: #fff;
}
.ollmh-news-card-meta-item.ollmh-news-card-media-indicator:hover i {
  color: #fff;
}
.ollmh-news-card-read-more {
  color: var(--color-primary-button, #005a9c);
  font-size: 0.875rem;
  font-weight: 600;
  margin-top: 0.5rem;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.ollmh-news-card:hover .ollmh-news-card-read-more i {
  transform: translateX(4px);
  transition: transform 0.2s ease;
}

/* ── News Detail (single) ─────────────────────────────────────────── */
.ollmh-news-detail-meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 1rem;
  margin-top: 1.5rem;
}
.ollmh-news-detail-meta-item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem;
  background: #f8fafc;
  border-radius: 8px;
  border-left: 3px solid #0f766e;
}
.ollmh-news-detail-meta-item > i {
  font-size: 1.25rem;
  color: #0f766e;
  margin-top: 0.125rem;
}
.ollmh-news-detail-meta-item > div {
  display: flex;
  flex-direction: column;
}
.ollmh-news-detail-meta-item strong {
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #94a3b8;
}
.ollmh-news-detail-meta-item span {
  font-size: 0.9375rem;
  color: var(--color-text-heading);
  font-weight: 500;
}
.ollmh-news-content-wrap {
  background: var(--color-bg-white);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  margin-top: 1rem;
}
.ollmh-news-content {
  font-size: 1rem;
  line-height: 1.7;
  color: #334155;
}
.ollmh-news-content p { margin: 0 0 1rem; }
.ollmh-news-content h2,
.ollmh-news-content h3 { margin: 1.5rem 0 0.75rem; }
.ollmh-news-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 1rem 0;
}
.ollmh-news-footer {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e2e8f0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.ollmh-news-footer-tags {
  flex: 1;
  min-width: 200px;
}
.ollmh-news-footer-tags strong {
  color: var(--color-text-heading);
  font-size: 0.875rem;
}
.ollmh-news-footer-share {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.625rem;
}
.ollmh-news-footer-share-label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-text-heading);
  display: flex;
  align-items: center;
  gap: 0.375rem;
}
.ollmh-news-footer-share .ollmh-event-share-buttons {
  justify-content: flex-end;
}
.ollmh-news-tags a {
  display: inline-block;
  background: #f1f5f9;
  color: #0f766e;
  font-size: 0.8rem;
  padding: 0.25rem 0.75rem;
  border-radius: 50px;
  text-decoration: none;
  margin: 0.2rem;
  transition: background 0.2s ease;
}
.ollmh-news-tags a:hover {
  background: #e2e8f0;
}

/* ── Post Navigation ──────────────────────────────────────────────── */
.ollmh-news-post-nav {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.ollmh-news-post-nav-prev,
.ollmh-news-post-nav-next {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  text-decoration: none;
  padding: 1rem 1.25rem;
  background: #f1f5f9;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  flex: 1;
  min-width: 200px;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}
.ollmh-news-post-nav-prev:visited,
.ollmh-news-post-nav-next:visited {
  text-decoration: none;
}
.ollmh-news-post-nav-prev:hover,
.ollmh-news-post-nav-next:hover {
  background: #fff;
  border-color: var(--color-primary-button, #005a9c);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 90, 156, 0.12);
  text-decoration: none;
}
.ollmh-news-post-nav-prev:active,
.ollmh-news-post-nav-next:active {
  transform: translateY(0);
}
.ollmh-news-post-nav-prev:focus,
.ollmh-news-post-nav-next:focus {
  text-decoration: none;
}
.ollmh-news-post-nav-prev:focus-visible,
.ollmh-news-post-nav-next:focus-visible {
  outline: 2px solid var(--color-primary-button, #005a9c);
  outline-offset: 2px;
}
.ollmh-news-post-nav-next { text-align: right; }
.ollmh-news-post-nav-label {
  font-size: 0.75rem;
  color: var(--color-primary-button, #005a9c);
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: 600;
}
.ollmh-news-post-nav-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--color-text-heading);
}
.ollmh-news-comments-wrap {
  background: var(--color-bg-white);
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  margin-top: 1rem;
}

/* ── Single News Article — Two-Column Layout (EduFin pattern) ──────── */
.ollmh-single-news-page,
.ollmh-single-post-page,
.ollmh-single-event-page,
.ollmh-single-gallery-page { background: #fff; }

/* Article Container — wraps the article layout + back nav, providing
   max-width and horizontal padding (mirrors EduFin's .edufin-container). */
.ollmh-article-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 1.5rem;
}

/* Article Layout (Two-Column) */
.ollmh-article-layout {
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 2.5rem;
  padding: 1rem 0 3rem;
  align-items: start;
}
.ollmh-article-main { min-width: 0; }
.ollmh-article-sidebar { position: sticky; top: 2rem; }

/* Featured Image */
.ollmh-article-featured-image {
  width: 100%;
  margin: 0 0 1.5rem;
  padding: 0;
}
.ollmh-article-featured-image img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Article Meta Bar */
.ollmh-article-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 1.5rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e2e8f0;
}
.ollmh-article-meta i { color: #94a3b8; }
.ollmh-article-meta-author a {
  color: var(--color-primary-button, #005a9c);
  font-weight: 600;
  text-decoration: none;
}
.ollmh-article-meta-author a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ollmh-article-meta-category a {
  color: var(--color-primary-button, #005a9c);
  font-weight: 600;
  text-decoration: none;
}
.ollmh-article-meta-category a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ollmh-article-meta-comments a {
  color: #64748b;
  text-decoration: none;
}
.ollmh-article-meta-comments a:hover { color: var(--color-primary-button, #005a9c); text-decoration: underline; text-underline-offset: 4px; }
.ollmh-article-meta-venue { color: #64748b; }
.ollmh-article-meta-venue i { color: #ef4444; }
.ollmh-article-meta-time {
  color: #94a3b8;
  font-size: 0.8125rem;
}
.ollmh-article-meta-photos { color: #0f766e; font-weight: 600; }
.ollmh-article-meta-photos i { color: #0f766e; }
.ollmh-article-meta-photographer { color: #64748b; }
.ollmh-article-meta-updated {
  font-style: italic;
  color: #94a3b8;
  font-size: 0.8125rem;
}
.ollmh-article-meta-updated time { font-style: normal; }
.ollmh-article-meta-sep { color: #cbd5e1; }
.ollmh-article-meta-media { color: #0f766e; font-weight: 600; }
.ollmh-article-meta-media i { color: #0f766e; }

/* Article Content */
.ollmh-article-content-wrap { padding: 0; }
.ollmh-article-content {
  line-height: 1.8;
  font-size: 1.05rem;
  color: #334155;
}
.ollmh-article-content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #0f172a;
  margin: 2rem 0 1rem;
}
.ollmh-article-content h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
  margin: 1.5rem 0 0.75rem;
}
.ollmh-article-content p { margin-bottom: 1.25rem; }
.ollmh-article-content ul,
.ollmh-article-content ol { margin-bottom: 1.25rem; padding-left: 1.5rem; }
.ollmh-article-content li { margin-bottom: 0.5rem; }
.ollmh-article-content blockquote {
  border-left: 4px solid var(--color-primary-button, #005a9c);
  padding: 1rem 1.5rem;
  margin: 1.5rem 0;
  background: #eff6ff;
  border-radius: 0 8px 8px 0;
  font-style: italic;
  color: #1e3a8a;
}
.ollmh-article-content a {
  color: var(--color-primary-button, #005a9c);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.ollmh-article-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* Article Footer: Tags + Share */
.ollmh-article-footer {
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e2e8f0;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
.ollmh-article-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}
.ollmh-article-tags-label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b;
}
.ollmh-article-tags-none {
  font-size: 0.8rem;
  font-weight: 500;
  color: #94a3b8;
  font-style: italic;
}
.ollmh-article-tags a {
  display: inline-block;
  padding: 0.3rem 0.75rem;
  background: #f1f5f9;
  color: #475569;
  font-size: 0.8rem;
  font-weight: 600;
  border-radius: 9999px;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}
.ollmh-article-tags a:hover {
  background: var(--color-primary-button, #005a9c);
  color: #fff;
}
.ollmh-article-share {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}
.ollmh-share-label {
  font-size: 0.85rem;
  font-weight: 600;
  color: #64748b;
}
.ollmh-share-icons {
  display: flex;
  gap: 0.5rem;
  flex-wrap: wrap;
}
.ollmh-share-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #f1f5f9;
  color: #475569;
  font-size: 1rem;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: background 0.2s, color 0.2s, transform 0.2s;
}
.ollmh-share-icon:hover {
  background: var(--ollmh-share-color, var(--color-primary-button, #005a9c));
  color: #fff;
  transform: translateY(-2px);
  text-decoration: none;
}
.ollmh-share-icon i { pointer-events: none; }

/* Post Navigation */
.ollmh-post-navigation {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
  margin-top: 2.5rem;
  padding-top: 2rem;
  border-top: 1px solid #e2e8f0;
  align-items: stretch;
}
.ollmh-post-nav-prev,
.ollmh-post-nav-next {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  padding: 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  height: 100%;
}
.ollmh-post-nav-prev:hover,
.ollmh-post-nav-next:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  text-decoration: none;
}
.ollmh-post-nav-next {
  text-align: right;
  flex-direction: row-reverse;
}
.ollmh-post-nav-empty {
  border: 1px dashed transparent;
  opacity: 0;
  visibility: hidden;
}
.ollmh-post-nav-thumb {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 8px;
  overflow: hidden;
}
.ollmh-post-nav-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ollmh-post-nav-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1e3a8a, #3b82f6);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.ollmh-post-nav-info {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}
.ollmh-post-nav-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary-button, #005a9c);
}
.ollmh-post-nav-title {
  font-size: 0.9rem;
  font-weight: 600;
  color: #334155;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Comments Section */
.ollmh-comments-section {
  margin-top: 3rem;
  padding-top: 2rem;
  border-top: 2px solid #f1f5f9;
}
.ollmh-comments-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 1.5rem;
}
.ollmh-comment-list {
  list-style: none;
  padding: 0;
  margin: 0 0 2.5rem;
}
.ollmh-comment-list .comment {
  padding: 1.25rem 0;
  border-bottom: 1px solid #f1f5f9;
}
.ollmh-comment-list .comment:last-child { border-bottom: none; }
.ollmh-no-comments {
  color: #94a3b8;
  font-size: 0.9rem;
  margin: 0 0 2rem;
}

/* Comment Form */
.ollmh-comment-form-wrap {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.75rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-comment-form-wrap:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.ollmh-comment-form-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 1.25rem;
}
.ollmh-comment-notes {
  font-size: 0.85rem;
  color: #64748b;
  margin: 0 0 1rem;
}
.ollmh-logged-in-as {
  font-size: 0.85rem;
  color: #64748b;
  margin: 0 0 1rem;
}
.ollmh-logged-in-as a {
  color: var(--color-primary-button, #005a9c);
  text-decoration: none;
}
.ollmh-logged-in-as a:hover { text-decoration: underline; text-underline-offset: 4px; }
.ollmh-comment-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}
.ollmh-comment-form-field { margin-bottom: 0.75rem; }
.ollmh-comment-input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 1rem;
  background: #fff;
  box-sizing: border-box;
  transition: border-color 0.2s;
}
.ollmh-comment-input:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.1);
}
.ollmh-comment-textarea {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  font-size: 1rem;
  background: #fff;
  box-sizing: border-box;
  resize: vertical;
  transition: border-color 0.2s;
}
.ollmh-comment-textarea:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.1);
}
/* Comment submit — mirrors the .btn .btn-primary "Home" button from the
   Continue Reading card (gradient + brightness hover) with the rounded
   corners and lift-on-hover feel of the footer newsletter / Contact Us
   buttons.  !important needed to override the higher-specificity
   .ollmh-comment-form-submit .btn rules below. */
.ollmh-comment-submit {
  background: var(--gradient-primary-button) !important;
  color: var(--color-text-white) !important;
  border: 1px solid var(--color-primary-button) !important;
  padding: 0.625rem 1.5rem !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 100, 205, 0.25) !important;
  cursor: pointer;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
.ollmh-comment-submit:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 100, 205, 0.3) !important;
}
.ollmh-comment-submit:active {
  filter: brightness(0.95);
  transform: translateY(0);
}
.ollmh-comment-submit:disabled,
.ollmh-comment-submit[aria-disabled="true"] {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
}

/* Comment consent checkbox — the standard WordPress "Save my name, email,
   and website" cookies-consent checkbox (#wp-comment-cookies-consent),
   relabeled to also cover Privacy Policy / Terms & Conditions consent.
   Same .ollmh-checkbox-label and .ollmh-consent-text classes as the contact
   form so shared CSS applies. Rendered via the comment_form_default_fields
   filter (see ollmh_comment_cookies_consent_field() in functions.php). */
.comment-form-cookies-consent .required { color: #ef4444; }
.comment-form-cookies-consent { margin-bottom: 0.75rem; }
#commentform .ollmh-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6b7280;
  line-height: 1.5;
}
#commentform .ollmh-checkbox-label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin: 0;
  margin-top: 0.15rem;
  padding: 0;
  border: 2px solid #94a3b8;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  position: relative;
  display: inline-block;
  transition: border-color 0.2s ease, background 0.2s ease;
}
#commentform .ollmh-checkbox-label input[type="checkbox"]:hover {
  border-color: var(--color-primary-button, #005a9c);
}
#commentform .ollmh-checkbox-label input[type="checkbox"]:checked {
  background: var(--color-primary-button, #005a9c);
  border-color: var(--color-primary-button, #005a9c);
}
#commentform .ollmh-checkbox-label input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%) rotate(45deg);
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  display: block;
}
/* The .ollmh-consent-text and .ollmh-disclaimer-link styles are already
   defined globally (not scoped to .ollmh-contact-form) so the comment
   form inherits the same link + tooltip treatment as the contact form. */

/* Logged-in comment consent notice — plain text, no checkbox. Mirrors the
   merged checkbox layout (margin/font/color) so the two states look
   consistent. The notice text is wrapped in .ollmh-consent-text (same as the
   cookie checkbox label) so the links inherit the global .ollmh-consent-text a
   treatment — color, underline, text-underline-offset: 4px, and the
   data-tooltip ::after tooltip — identical to the checkbox form. */
.ollmh-comment-consent-notice {
  margin: 0 0 0.75rem;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6b7280;
  line-height: 1.5;
}
.ollmh-comment-consent-notice .required { color: #ef4444; }

/* Sidebar Widgets */
.ollmh-sidebar-widget {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 1.25rem;
  margin-bottom: 1.5rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-sidebar-widget:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
}
.ollmh-sidebar-widget-title {
  font-size: 0.9rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #0f172a;
  margin: 0 0 1rem;
  padding-bottom: 0.6rem;
  border-bottom: 2px solid var(--color-primary-button, #005a9c);
}

/* Sidebar: Related Posts */
.ollmh-sidebar-related {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 600px;
  overflow-y: auto;
}
.ollmh-sidebar-related li { margin-bottom: 0.85rem; }
.ollmh-sidebar-related li:last-child { margin-bottom: 0; }
.ollmh-sidebar-related a {
  display: flex;
  gap: 0.65rem;
  text-decoration: none;
  color: inherit;
  align-items: flex-start;
}
.ollmh-sidebar-related-thumb {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  border-radius: 8px;
  overflow: hidden;
}
.ollmh-sidebar-related-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ollmh-sidebar-related-initials {
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #1e3a8a, #3b82f6);
  color: #fff;
  font-size: 1.1rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.ollmh-sidebar-related-info {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.ollmh-sidebar-related-title {
  font-size: 0.82rem;
  font-weight: 600;
  color: #1e293b;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ollmh-sidebar-related-meta { font-size: 0.72rem; color: #94a3b8; }
.ollmh-sidebar-related a:hover .ollmh-sidebar-related-title {
  color: var(--color-primary-button, #005a9c);
}
.ollmh-sidebar-related-more {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.82rem;
  font-weight: 700;
  color: var(--color-primary-button, #005a9c);
  text-decoration: none;
  margin-top: 0.85rem;
  text-underline-offset: 4px;
}
.ollmh-sidebar-related-more:hover { text-decoration: none; }
.ollmh-sidebar-related-more:hover .ollmh-sidebar-related-more-text {
  text-decoration: underline;
  text-underline-offset: 4px;
}

/* Sidebar: Recent Comments */
.ollmh-sidebar-comments {
  list-style: none;
  padding: 0;
  margin: 0;
  max-height: 500px;
  overflow-y: auto;
}
.ollmh-sidebar-comments li {
  padding: 0.6rem 0;
  border-bottom: 1px solid #e2e8f0;
}
.ollmh-sidebar-comments li:last-child { border-bottom: none; }
.ollmh-sidebar-comments a {
  display: flex;
  gap: 0.65rem;
  text-decoration: none;
  color: inherit;
  align-items: flex-start;
}
.ollmh-sidebar-comment-avatar {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  overflow: hidden;
}
.ollmh-sidebar-comment-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}
.ollmh-sidebar-comment-body {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
  flex: 1;
}
.ollmh-sidebar-comment-author {
  font-size: 0.8rem;
  font-weight: 700;
  color: #1e293b;
}
.ollmh-sidebar-comment-text {
  font-size: 0.75rem;
  color: #64748b;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.ollmh-sidebar-comments a:hover .ollmh-sidebar-comment-author {
  color: var(--color-primary-button, #005a9c);
}

/* Sidebar: Explore More card — base layout (colors/overlay handled by
   the featured-image CTA rules above via --ollmh-featured-bg) */
.ollmh-sidebar-explore-card { text-align: center; }
.ollmh-sidebar-explore-text {
  font-size: 0.8rem;
  line-height: 1.5;
  margin: 0 0 1rem;
}
.ollmh-sidebar-explore-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1.25rem;
  color: #fff;
  font-size: 0.85rem;
  font-weight: 700;
  border-radius: 8px;
  text-decoration: none;
  transition: background 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}
.ollmh-sidebar-explore-btn:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  text-decoration: none;
}
.ollmh-sidebar-explore-btn:hover .ollmh-sidebar-explore-btn-text {
  text-decoration: underline;
  text-underline-offset: 4px;
}
.ollmh-news-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
  padding: 0 0.4rem;
  background: rgba(255, 255, 255, 0.25);
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  border-radius: 9999px;
  margin-left: 0.4rem;
}

/* Media Player Section (within article layout) */
.ollmh-article-media-section { margin-bottom: 2rem; }

/* Responsive — Single News Article */
@media (max-width: 1024px) {
  .ollmh-article-layout { grid-template-columns: 1fr; }
  .ollmh-article-sidebar { position: static; }
}
@media (max-width: 768px) {
  .ollmh-article-container { padding: 0 1rem; }
  .ollmh-article-featured-image { margin-bottom: 1rem; }
  .ollmh-article-content-wrap { padding: 0.5rem 0 2rem; }
  .ollmh-post-navigation { grid-template-columns: 1fr; }
  .ollmh-post-nav-next { text-align: left; flex-direction: row; }
  .ollmh-comment-form-row { grid-template-columns: 1fr; }
}

/* ── Media Player ─────────────────────────────────────────────────── */
.ollmh-media-player-wrap {
  background: var(--color-bg-white);
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  margin-top: 1rem;
}
.ollmh-media-player {
  width: 100%;
  border-radius: 8px;
  overflow: hidden;
  background: #000;
}
.ollmh-media-player-video {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
}
.ollmh-media-player-video iframe,
.ollmh-media-player-video video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
}
.ollmh-media-player-audio {
  background: linear-gradient(135deg, #0f766e, #14b8a6);
  padding: 1.5rem;
}
.ollmh-audio-player-inner {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.ollmh-audio-player-icon {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.75rem;
  color: #fff;
  flex-shrink: 0;
}
.ollmh-audio-player-info {
  flex: 1;
  min-width: 200px;
}
.ollmh-audio-player-info h4 {
  color: #fff;
  font-size: 1.125rem;
  margin: 0 0 0.25rem;
}
.ollmh-audio-player-info p {
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.875rem;
  margin: 0;
}
.ollmh-audio-player-inner audio {
  width: 100%;
  min-width: 250px;
  margin-top: 0.5rem;
}
.ollmh-media-player-controls {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
}
.ollmh-media-replay-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border: none;
  padding: 0.5rem 1.25rem;
  border-radius: 50px;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.1s ease;
}
.ollmh-media-replay-btn:hover {
  background: #004a82;
  transform: scale(1.02);
}
.ollmh-media-replay-btn:active { transform: scale(0.98); }
.ollmh-media-status {
  font-size: 0.8rem;
  color: #94a3b8;
}

/* ── Empty State ──────────────────────────────────────────────────── */
.ollmh-gallery-empty {
  text-align: center;
  padding: 3rem 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
  margin-top: 1.5rem;
}
.ollmh-gallery-empty > i {
  font-size: 3rem;
  color: #cbd5e1;
  margin-bottom: 1rem;
}
.ollmh-gallery-empty h3 {
  font-size: 1.25rem;
  color: var(--color-text-heading);
  margin: 0 0 0.5rem;
}
.ollmh-gallery-empty p {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 768px) {
  .ollmh-events-grid,
  .ollmh-news-grid,
  .ollmh-home-dept-grid {
    grid-template-columns: 1fr;
  }
  .ollmh-news-sort-bar { margin-top: 1rem; flex-direction: column; align-items: stretch; }
  .ollmh-news-sort-form { width: 100%; }
  .ollmh-news-sort-select { flex: 1; }
  .ollmh-news-pagination-row { flex-direction: column; align-items: center; gap: 0.75rem; }
  .ollmh-news-record-count { width: 100%; justify-content: center; }
  .ollmh-event-detail-meta,
  .ollmh-news-detail-meta {
    grid-template-columns: 1fr;
  }
  .ollmh-audio-player-inner {
    flex-direction: column;
    align-items: flex-start;
  }
  .ollmh-news-post-nav {
    flex-direction: column;
  }
  .ollmh-news-post-nav-next {
    text-align: left;
  }
  .ollmh-news-footer {
    flex-direction: column;
    gap: 1rem;
  }
  .ollmh-news-footer-share {
    align-items: flex-start;
  }
  .ollmh-news-footer-share .ollmh-event-share-buttons {
    justify-content: flex-start;
  }
}

/* ── Comments Section ─────────────────────────────────────────────── */
.ollmh-comments {
  margin-top: 1rem;
}
.ollmh-comments-header {
  text-align: center;
  margin-bottom: 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 2px solid #e2e8f0;
}
.ollmh-comments-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0 0 0.5rem;
}
.ollmh-comments-subtitle {
  font-size: 0.9375rem;
  color: #64748b;
  margin: 0;
}
.ollmh-comment-list {
  list-style: none;
  padding: 0;
  margin: 0 0 2rem;
}
.ollmh-comment-list .children {
  list-style: none;
  padding-left: 3.5rem;
  margin-top: 1.5rem;
  border-left: 2px solid #e2e8f0;
  padding-top: 0.5rem;
}
.ollmh-comment-list .children .ollmh-comment-inner {
  background: #f8fafc;
}
.ollmh-comment {
  margin-bottom: 1.5rem;
}
.ollmh-comment-inner {
  display: flex;
  gap: 1rem;
  background: var(--color-bg-white);
  border-radius: 12px;
  padding: 1.25rem;
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.04);
  transition: box-shadow 0.2s ease;
}
.ollmh-comment-inner:hover {
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}
.ollmh-comment-avatar {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--color-primary-button, #005a9c);
  display: flex;
  align-items: center;
  justify-content: center;
}
.ollmh-comment-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ollmh-comment-initials {
  color: #fff;
  font-size: 1.125rem;
  font-weight: 700;
  text-transform: uppercase;
}
.ollmh-comment-body {
  flex: 1;
  min-width: 0;
}
.ollmh-comment-header {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
}
.ollmh-comment-author {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--color-text-heading);
}
.ollmh-comment-badge {
  display: inline-block;
  background: #0f766e;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.1rem 0.5rem;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.ollmh-comment-date {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-left: auto;
}
.ollmh-comment-date a {
  color: inherit;
  text-decoration: none;
}
.ollmh-comment-date a:hover {
  text-decoration: underline;
}
.ollmh-comment-content {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #334155;
}
.ollmh-comment-content p {
  margin: 0 0 0.5rem;
}
.ollmh-comment-content p:last-child {
  margin-bottom: 0;
}
.ollmh-comment-pending {
  background: #fef3c7;
  color: #92400e;
  padding: 0.5rem 0.75rem;
  border-radius: 6px;
  font-size: 0.8rem;
  margin-bottom: 0.75rem;
}
.ollmh-comment-actions {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-top: 0.75rem;
  padding-top: 0.75rem;
  border-top: 1px solid #f1f5f9;
}
.ollmh-comment-reply a,
.ollmh-comment-edit a {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--color-primary-button, #005a9c);
  text-decoration: none;
  transition: color 0.2s ease;
}
.ollmh-comment-reply a:hover,
.ollmh-comment-edit a:hover {
  color: #004a82;
  text-decoration: underline;
}
.ollmh-no-comments {
  text-align: center;
  padding: 2rem;
  color: #64748b;
  font-size: 0.9375rem;
  background: #f8fafc;
  border-radius: 12px;
  margin-bottom: 2rem;
}

/* ── Comment Form ─────────────────────────────────────────────────── */
.ollmh-comment-form-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0 0 1rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #e2e8f0;
}
.ollmh-comment-form-title i {
  color: var(--color-primary-button, #005a9c);
  margin-right: 0.5rem;
}
.ollmh-cancel-reply a {
  font-size: 0.8rem;
  font-weight: 500;
  color: #dc2626;
  text-decoration: none;
}
.ollmh-cancel-reply a:hover {
  text-decoration: underline;
}
.ollmh-comment-notes {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-bottom: 1rem;
}
.ollmh-comment-notes .required {
  color: #dc2626;
}
.ollmh-comment-logged-in,
.ollmh-comment-must-login {
  font-size: 0.875rem;
  color: #475569;
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border-radius: 8px;
  margin-bottom: 1rem;
}
.ollmh-comment-logged-in a,
.ollmh-comment-must-login a {
  color: var(--color-primary-button, #005a9c);
  text-decoration: underline;
}
.ollmh-comment-form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ollmh-comment-form-row {
  display: flex;
  gap: 1rem;
  flex-wrap: wrap;
}
.ollmh-comment-form-row .ollmh-comment-form-field {
  flex: 1;
  min-width: 200px;
}
.ollmh-comment-form-field {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.ollmh-comment-form-field label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-heading);
}
.ollmh-comment-form-field label .required {
  color: #dc2626;
}
.ollmh-comment-form-field input[type="text"],
.ollmh-comment-form-field input[type="email"],
.ollmh-comment-form-field input[type="url"] {
  padding: 0.625rem 0.875rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  font-size: 0.9375rem;
  color: #334155;
  background: #fff;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-comment-form-field input:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.1);
}
.ollmh-comment-form-comment textarea {
  padding: 0.875rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  font-size: 0.9375rem;
  color: #334155;
  background: #fff;
  resize: vertical;
  min-height: 120px;
  line-height: 1.6;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-comment-form-comment textarea:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.1);
}
.ollmh-comment-form-submit {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.ollmh-comment-form-submit .btn {
  padding: 0.625rem 1.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  border: 1px solid var(--color-primary-button);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 100, 205, 0.25);
  cursor: pointer;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-comment-form-submit .btn:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 100, 205, 0.3);
}
.ollmh-comment-form-submit .btn:active {
  filter: brightness(0.95);
  transform: translateY(0);
}

/* ── Comment Pagination ───────────────────────────────────────────── */
.ollmh-comments-pagination {
  display: flex;
  justify-content: space-between;
  padding: 1rem 0;
  margin-top: 1rem;
  border-top: 1px solid #e2e8f0;
}
.ollmh-comments-nav-prev a,
.ollmh-comments-nav-next a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary-button, #005a9c);
  text-decoration: none;
}
.ollmh-comments-nav-prev a:hover,
.ollmh-comments-nav-next a:hover {
  text-decoration: underline;
}

/* ── Enhanced Media Player Controls ───────────────────────────────── */
.ollmh-media-player-wrap {
  position: relative;
}
.ollmh-media-player-controls {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #e2e8f0;
}
.ollmh-media-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border: none;
  padding: 0.5rem 1rem;
  border-radius: 50px;
  font-size: 0.8rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.2s ease, transform 0.1s ease;
  min-width: 40px;
  min-height: 36px;
}
.ollmh-media-btn:hover {
  background: #004a82;
  transform: scale(1.03);
}
.ollmh-media-btn:active {
  transform: scale(0.97);
}
.ollmh-media-btn:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  transform: none;
}
.ollmh-media-btn-secondary {
  background: #64748b;
}
.ollmh-media-btn-secondary:hover {
  background: #475569;
}
.ollmh-media-replay-btn {
  background: #0f766e;
}
.ollmh-media-replay-btn:hover {
  background: #0d5d56;
}
.ollmh-media-progress-wrap {
  flex: 1;
  min-width: 150px;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-media-progress-bar {
  flex: 1;
  height: 6px;
  background: #e2e8f0;
  border-radius: 50px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
}
.ollmh-media-progress-filled {
  height: 100%;
  background: var(--color-primary-button, #005a9c);
  border-radius: 50px;
  width: 0%;
  transition: width 0.1s linear;
}
.ollmh-media-time {
  font-size: 0.75rem;
  color: #64748b;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.ollmh-media-volume-wrap {
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.ollmh-media-volume-slider {
  width: 80px;
  height: 4px;
  -webkit-appearance: none;
  appearance: none;
  background: #e2e8f0;
  border-radius: 50px;
  outline: none;
  cursor: pointer;
}
.ollmh-media-volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 14px;
  height: 14px;
  background: var(--color-primary-button, #005a9c);
  border-radius: 50%;
  cursor: pointer;
}
.ollmh-media-volume-slider::-moz-range-thumb {
  width: 14px;
  height: 14px;
  background: var(--color-primary-button, #005a9c);
  border-radius: 50%;
  cursor: pointer;
  border: none;
}
.ollmh-media-speed-select {
  padding: 0.3rem 0.5rem;
  border: 1px solid #cbd5e1;
  border-radius: 6px;
  font-size: 0.75rem;
  color: #334155;
  background: #fff;
  cursor: pointer;
}
.ollmh-media-status {
  font-size: 0.8rem;
  color: #94a3b8;
  margin-left: auto;
}
.ollmh-media-divider {
  width: 1px;
  height: 24px;
  background: #e2e8f0;
}

/* ── Responsive Comments & Media ──────────────────────────────────── */
@media (max-width: 768px) {
  .ollmh-comment-list .children {
    padding-left: 1.5rem;
  }
  .ollmh-comment-inner {
    flex-direction: column;
    gap: 0.75rem;
  }
  .ollmh-comment-avatar {
    width: 40px;
    height: 40px;
  }
  .ollmh-comment-date {
    margin-left: 0;
    width: 100%;
  }
  .ollmh-comment-form-row {
    flex-direction: column;
  }
  .ollmh-media-progress-wrap {
    order: 10;
    width: 100%;
    flex-basis: 100%;
  }
  .ollmh-media-status {
    margin-left: 0;
    width: 100%;
    text-align: center;
  }
  .ollmh-media-volume-wrap {
    display: none;
  }
}

/* ── Single Event: Two-Column Layout ──────────────────────────────── */
.ollmh-event-layout {
  display: grid;
  grid-template-columns: 1fr 340px;
  gap: 2rem;
  padding: 1rem 0 3rem;
  align-items: start;
}

/* Main Content Column */
.ollmh-event-main {
  min-width: 0;
}

/* Featured Image Hero */
.ollmh-event-hero-image {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  margin-bottom: 2rem;
  aspect-ratio: 16 / 7;
  background: #f1f5f9;
}
.ollmh-event-hero-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ollmh-event-hero-category {
  position: absolute;
  top: 1rem;
  left: 1rem;
  background: rgba(255, 255, 255, 0.95);
  color: #1e3a5f;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.35rem 1rem;
  border-radius: 50px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  backdrop-filter: blur(4px);
}
.ollmh-event-hero-status {
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0.35rem 1rem;
  border-radius: 50px;
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  backdrop-filter: blur(4px);
}
.ollmh-event-hero-status i { font-size: 0.5rem; }
.ollmh-event-status-upcoming {
  background: rgba(34, 197, 94, 0.95);
  color: #fff;
}
.ollmh-event-status-live {
  background: rgba(239, 68, 68, 0.95);
  color: #fff;
  animation: ollmh-pulse 1.5s infinite;
}
.ollmh-event-status-past {
  background: rgba(100, 116, 139, 0.95);
  color: #fff;
}
@keyframes ollmh-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.7; }
}

/* Event Sections */
.ollmh-event-section {
  margin-bottom: 2.5rem;
}
.ollmh-event-section-header {
  margin-bottom: 1.25rem;
}
.ollmh-event-section-header h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0.5rem 0 0;
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.ollmh-event-section-header h2 i {
  color: var(--color-primary-button, #005a9c);
  font-size: 1.25rem;
}
.ollmh-event-lead {
  font-size: 1.0625rem;
  line-height: 1.6;
  color: #475569;
  margin: 0 0 1.25rem;
  font-style: italic;
  border-left: 3px solid var(--color-primary-button, #005a9c);
  padding-left: 1rem;
}

/* Enhanced Event Content */
.ollmh-event-content-wrap {
  background: transparent;
  padding: 0;
  box-shadow: none;
  border-top: none;
}
.ollmh-event-content {
  font-size: 1rem;
  line-height: 1.8;
  color: #334155;
}
.ollmh-event-content > p:first-child {
  font-size: 1.0625rem;
  color: #1e293b;
}
.ollmh-event-content p { margin: 0 0 1.25rem; }
.ollmh-event-content h2,
.ollmh-event-content h3 {
  margin: 2rem 0 1rem;
  font-weight: 700;
  color: var(--color-text-heading);
  position: relative;
  padding-left: 1.25rem;
}
.ollmh-event-content h2 {
  font-size: 1.375rem;
}
.ollmh-event-content h3 {
  font-size: 1.1875rem;
}
.ollmh-event-content h2::before,
.ollmh-event-content h3::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 70%;
  background: var(--color-primary-button, #005a9c);
  border-radius: 50px;
}
.ollmh-event-content ul,
.ollmh-event-content ol {
  margin: 0 0 1.5rem;
  padding-left: 0;
  list-style: none;
}
.ollmh-event-content ul li,
.ollmh-event-content ol li {
  position: relative;
  padding: 0.625rem 0 0.625rem 2.25rem;
  border-bottom: 1px solid #f1f5f9;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #334155;
}
.ollmh-event-content ul li::before {
  content: '\f00c';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', 'FontAwesome';
  font-weight: 900;
  position: absolute;
  left: 0.5rem;
  top: 0.75rem;
  color: #16a34a;
  font-size: 0.875rem;
}
.ollmh-event-content ol {
  counter-reset: ollmh-counter;
}
.ollmh-event-content ol li::before {
  counter-increment: ollmh-counter;
  content: counter(ollmh-counter);
  position: absolute;
  left: 0;
  top: 0.5rem;
  width: 1.75rem;
  height: 1.75rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
}
.ollmh-event-content ol li {
  padding-left: 2.75rem;
  padding-top: 0.875rem;
  padding-bottom: 0.875rem;
}
.ollmh-event-content blockquote {
  margin: 1.5rem 0;
  padding: 1.25rem 1.5rem;
  background: linear-gradient(135deg, #f0f9ff, #e0f2fe);
  border-left: 4px solid var(--color-primary-button, #005a9c);
  border-radius: 0 12px 12px 0;
  font-style: italic;
  color: #1e3a5f;
}
.ollmh-event-content blockquote p {
  margin: 0;
  font-size: 1.0625rem;
}
.ollmh-event-content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 1rem 0;
}

/* Countdown Timer */
.ollmh-event-countdown-section {
  background: linear-gradient(135deg, #1e3a5f, #2563eb);
  border-radius: 14px;
  padding: 2rem;
  margin-bottom: 2.5rem;
  box-shadow: 0 4px 20px rgba(30, 58, 95, 0.25);
}
.ollmh-event-countdown-section .ollmh-event-section-header h2,
.ollmh-event-countdown-section .ollmh-section-badge {
  color: #fff;
}
.ollmh-event-countdown-section .ollmh-section-badge {
  background: rgba(255, 255, 255, 0.2);
}
.ollmh-event-countdown-section .ollmh-event-section-header h2 i {
  color: #fbbf24;
}
.ollmh-event-countdown {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1.5rem;
  flex-wrap: wrap;
}
.ollmh-countdown-unit {
  display: flex;
  flex-direction: column;
  align-items: center;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 12px;
  padding: 1.25rem 1rem;
  min-width: 90px;
  backdrop-filter: blur(10px);
}
.ollmh-countdown-number {
  font-size: 2.5rem;
  font-weight: 800;
  color: #fff;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
.ollmh-countdown-label {
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.8);
  text-transform: uppercase;
  letter-spacing: 1px;
  margin-top: 0.5rem;
}
.ollmh-countdown-sep {
  font-size: 2rem;
  color: rgba(255, 255, 255, 0.4);
  font-weight: 700;
}
.ollmh-event-countdown-done {
  text-align: center;
  color: #fff;
  font-size: 1.25rem;
  font-weight: 700;
  padding: 1rem;
}
.ollmh-event-countdown-done i {
  color: #fbbf24;
  margin-right: 0.5rem;
}

/* Registration Section */
.ollmh-event-register-section .ollmh-event-registration-cta {
  margin-top: 1.5rem;
}

/* Event registration form — layout */
.ollmh-event-reg-wrap {
  padding: 0;
}
.ollmh-event-registration-form {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
/* Zero out the .ollmh-field margin-bottom from forms.css — the form's
   flex gap handles vertical spacing between rows. */
.ollmh-event-registration-form .ollmh-field { margin-bottom: 0; }
/* Honeypot — positioned absolutely, must not participate in flex layout */
.ollmh-event-registration-form .ollmh-hp-field { position: absolute; }

/* Event details summary card (shown above the form) — keeps its
   distinctive blue tint but uses the same border radius (8px) and
   border color family as the comment form inputs. */
.ollmh-event-reg-details {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem;
  background: linear-gradient(135deg, #eff6ff, #f0f9ff);
  border-radius: 8px;
  border: 1px solid #e2e8f0;
}
.ollmh-event-reg-details-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
}
.ollmh-event-reg-details-body { flex: 1; min-width: 0; }
.ollmh-event-reg-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--color-primary-heading, #001a55);
  margin: 0 0 0.4rem;
}
.ollmh-event-reg-date,
.ollmh-event-reg-venue {
  font-size: 0.85rem;
  color: #64748b;
  margin: 0.15rem 0;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
.ollmh-event-reg-date i,
.ollmh-event-reg-venue i {
  color: var(--color-primary-button, #005a9c);
  flex-shrink: 0;
}

/* Two-column field rows */
.ollmh-event-reg-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

/* intlTelInput — phone field width override (same as contact form) */
.ollmh-event-registration-form .iti { width: 100%; }
.ollmh-event-registration-form .iti__dial-code { color: #64748b; }
.ollmh-event-registration-form .iti input[type="tel"] { width: 100%; }

/* Event registration inputs — match the comment form's computed styling:
   white background, 1px #cbd5e1 border, 8px radius, 0.625rem 0.875rem
   padding, 0.9375rem font-size.  Overrides the shared .ollmh-field
   defaults. */
.ollmh-event-registration-form .ollmh-field input[type="text"],
.ollmh-event-registration-form .ollmh-field input[type="email"],
.ollmh-event-registration-form .ollmh-field input[type="tel"],
.ollmh-event-registration-form .ollmh-field input[type="number"] {
  padding: 0.625rem 0.875rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  font-size: 0.9375rem;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.ollmh-event-registration-form .ollmh-field input:focus {
  outline: none;
  border-color: var(--color-primary-button, #005a9c);
  box-shadow: 0 0 0 3px rgba(0, 90, 156, 0.1);
  background: #fff;
}
.ollmh-event-registration-form .ollmh-field input::placeholder {
  color: #94a3b8;
}
.ollmh-event-registration-form .ollmh-field > label {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text-heading);
  margin-bottom: 0.4rem;
}

/* Consent checkbox — matches the comment form's #commentform .ollmh-checkbox-label:
   0.8rem font, 400 weight, #6b7280 color, 1.5 line-height, custom 16px checkbox.
   Uses .ollmh-consent-field in the selector to beat the higher-specificity
   .ollmh-field > label rule (0,2,1) from both pages.css and forms.css. */
.ollmh-event-registration-form .ollmh-consent-field { margin: 0; }
.ollmh-event-registration-form .ollmh-consent-field .ollmh-checkbox-label {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  cursor: pointer;
  font-size: 0.8rem;
  font-weight: 400;
  color: #6b7280;
  line-height: 1.5;
  margin-bottom: 0;
}
.ollmh-event-registration-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin: 0;
  margin-top: 0.15rem;
  padding: 0;
  border: 2px solid #94a3b8;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  position: relative;
  display: inline-block;
  transition: border-color 0.2s ease, background 0.2s ease;
}
.ollmh-event-registration-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:hover {
  border-color: var(--color-primary-button, #005a9c);
}
.ollmh-event-registration-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:checked {
  background: var(--color-primary-button, #005a9c);
  border-color: var(--color-primary-button, #005a9c);
}
.ollmh-event-registration-form .ollmh-consent-field .ollmh-checkbox-label input[type="checkbox"]:checked::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%) rotate(45deg);
  width: 4px;
  height: 8px;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  display: block;
}

/* Submit button — matches the comment form's .ollmh-comment-submit style:
   gradient, 1px border, 8px radius, brightness+lift hover. */
.ollmh-event-registration-form .ollmh-form-actions {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
}
.ollmh-event-reg-submit {
  background: var(--gradient-primary-button) !important;
  color: var(--color-text-white) !important;
  border: 1px solid var(--color-primary-button) !important;
  padding: 0.625rem 1.5rem !important;
  font-size: 0.9375rem !important;
  font-weight: 600 !important;
  border-radius: 8px !important;
  box-shadow: 0 2px 8px rgba(0, 100, 205, 0.25) !important;
  cursor: pointer;
  transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
}
.ollmh-event-reg-submit:hover {
  filter: brightness(1.08);
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(0, 100, 205, 0.3) !important;
}
.ollmh-event-reg-submit:active {
  filter: brightness(0.95);
  transform: translateY(0);
}
.ollmh-event-reg-submit:disabled,
.ollmh-event-reg-submit[aria-disabled="true"] {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  transform: none !important;
}
.ollmh-event-registration-form .ollmh-form-spinner {
  border-top-color: var(--color-primary-button, #005a9c);
}

/* ── Event Sidebar ────────────────────────────────────────────────── */
.ollmh-event-sidebar {
  position: sticky;
  top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}
.ollmh-event-sidebar-card {
  background: var(--color-bg-white);
  border-radius: 14px;
  padding: 1.5rem;
  box-shadow: 0 2px 16px rgba(0, 0, 0, 0.06);
}
.ollmh-event-sidebar-card-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-heading);
  margin: 0 0 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid #e2e8f0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
.ollmh-event-sidebar-card-title i {
  color: var(--color-primary-button, #005a9c);
}

/* Event Info List */
.ollmh-event-info-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.ollmh-event-info-row {
  display: flex;
  gap: 0.875rem;
  align-items: flex-start;
  padding-bottom: 1rem;
  border-bottom: 1px solid #f1f5f9;
}
.ollmh-event-info-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
.ollmh-event-info-icon {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: linear-gradient(135deg, #dbeafe, #bfdbfe);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-primary-button, #005a9c);
  font-size: 1.125rem;
}
.ollmh-event-info-text {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  min-width: 0;
}
.ollmh-event-info-text strong {
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  color: #94a3b8;
  font-weight: 600;
}
.ollmh-event-info-text span {
  font-size: 0.9375rem;
  color: var(--color-text-heading);
  font-weight: 500;
  line-height: 1.4;
}
.ollmh-event-info-text span a {
  color: var(--color-primary-button, #005a9c);
  text-decoration: none;
}
.ollmh-event-info-text span a:hover {
  text-decoration: underline;
}
.ollmh-event-info-time {
  font-size: 0.8125rem !important;
  color: #64748b !important;
  font-weight: 400 !important;
}

/* Add to Calendar */
.ollmh-event-add-calendar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  width: 100%;
  margin-top: 1.25rem;
  padding: 0.625rem 1rem;
  background: var(--color-primary-button, #005a9c);
  color: #fff;
  border-radius: 10px;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
}
.ollmh-event-add-calendar:visited {
  color: #fff;
}
.ollmh-event-add-calendar:hover {
  background: #004a82;
  transform: translateY(-1px);
  text-decoration: none;
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 90, 156, 0.3);
}
.ollmh-event-add-calendar:active {
  transform: translateY(0);
  background: #003d6e;
  color: #fff;
}
.ollmh-event-add-calendar:focus {
  color: #fff;
  text-decoration: none;
}
.ollmh-event-add-calendar:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(0, 90, 156, 0.4);
}

/* Quick Actions */
.ollmh-event-quick-actions {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}
.ollmh-event-quick-action-btn {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  background: #f8fafc;
  border-radius: 10px;
  text-decoration: none;
  color: var(--color-text-heading);
  font-size: 0.875rem;
  font-weight: 600;
  transition: background 0.2s ease, transform 0.1s ease, box-shadow 0.2s ease;
  border: 1px solid #e2e8f0;
}
.ollmh-event-quick-action-btn:visited {
  color: var(--color-text-heading);
}
.ollmh-event-quick-action-btn:hover {
  background: #f1f5f9;
  transform: translateX(4px);
  text-decoration: none;
  color: var(--color-text-heading);
}
.ollmh-event-quick-action-btn:active {
  transform: translateX(2px);
}
.ollmh-event-quick-action-btn:focus {
  text-decoration: none;
}
.ollmh-event-quick-action-btn:focus-visible {
  outline: 2px solid var(--color-primary-button, #005a9c);
  outline-offset: 2px;
}
.ollmh-event-quick-action-btn i {
  color: var(--color-primary-button, #005a9c);
  font-size: 1rem;
  width: 20px;
  text-align: center;
}
.ollmh-event-qa-primary {
  background: linear-gradient(135deg, var(--color-primary-button, #005a9c), #0078d4);
  color: #fff;
  border-color: transparent;
}
.ollmh-event-qa-primary:visited {
  color: #fff;
}
.ollmh-event-qa-primary:hover {
  background: linear-gradient(135deg, #004a82, #006abe);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 90, 156, 0.3);
}
.ollmh-event-qa-primary:active {
  background: linear-gradient(135deg, #003d6e, #005a9c);
  transform: translateX(2px);
}
.ollmh-event-qa-primary:focus {
  color: #fff;
  text-decoration: none;
}
.ollmh-event-qa-primary:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(0, 90, 156, 0.4);
}
.ollmh-event-qa-primary i {
  color: #fff;
}

/* Share Buttons */
.ollmh-event-share-buttons {
  display: flex;
  gap: 0.625rem;
  flex-wrap: wrap;
}
.ollmh-event-share-btn {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  background: #f1f5f9;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.125rem;
  color: #64748b;
  text-decoration: none;
  transition: all 0.2s ease;
}
.ollmh-event-share-btn:hover {
  background: var(--ollmh-share-color, #005a9c);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  text-decoration: none;
}
.ollmh-event-share-btn:visited {
  color: #64748b;
}
.ollmh-event-share-btn:visited:hover {
  color: #fff;
}
.ollmh-share-copy-btn {
  border: none;
  cursor: pointer;
  font-family: inherit;
}
.ollmh-share-copy-btn:focus-visible {
  outline: 2px solid var(--ollmh-share-color, #005a9c);
  outline-offset: 2px;
}

/* Related Events */
.ollmh-event-related-section {
  margin-top: 3rem;
  margin-bottom: 3rem;
  padding-top: 2rem;
  border-top: 1px solid #e2e8f0;
}
.ollmh-event-related-section .ollmh-home-section-header {
  text-align: center;
  margin-bottom: 2rem;
}

/* ── Responsive ───────────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .ollmh-event-layout {
    grid-template-columns: 1fr;
  }
  .ollmh-event-sidebar {
    position: static;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .ollmh-event-sidebar-card {
    flex: 1;
    min-width: 280px;
  }
}
@media (max-width: 768px) {
  .ollmh-event-layout {
    gap: 1.5rem;
  }
  .ollmh-event-sidebar {
    flex-direction: column;
  }
  .ollmh-countdown-unit {
    min-width: 70px;
    padding: 1rem 0.75rem;
  }
  .ollmh-countdown-number {
    font-size: 1.75rem;
  }
  .ollmh-countdown-sep {
    display: none;
  }
  .ollmh-event-hero-image {
    aspect-ratio: 16 / 9;
  }
  .ollmh-event-reg-row { grid-template-columns: 1fr; }
  .ollmh-event-reg-details { flex-direction: column; gap: 0.75rem; }
}

/* ──────────────────────────────────────────────────────────────────
   Community Programs — archive & single
   ────────────────────────────────────────────────────────────────── */

.ollmh-community-programs-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem;
  margin-bottom: 3rem;
}

.ollmh-program-card {
  display: flex;
  flex-direction: column;
  background: var(--color-bg-white);
  border: 1px solid var(--color-border-light);
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.ollmh-program-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.12);
  border-color: var(--color-primary-button);
}

.ollmh-program-card:hover,
.ollmh-program-card:hover h3,
.ollmh-program-card:hover p,
.ollmh-program-card:hover .ollmh-program-card-link {
  text-decoration: none;
}

.ollmh-program-card-image {
  aspect-ratio: 16 / 10;
  overflow: hidden;
  background: #f1f5f9;
}

.ollmh-program-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.ollmh-program-card:hover .ollmh-program-card-image img {
  transform: scale(1.05);
}

.ollmh-program-card-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #eef2f7, #dde4ed);
}

.ollmh-program-card-placeholder i {
  font-size: 3rem;
  color: #94a3b8;
}

.ollmh-program-card-body {
  padding: 1.25rem;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.ollmh-program-card-body h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--color-primary-heading);
  margin: 0 0 0.5rem;
  line-height: 1.4;
}

.ollmh-program-card-body > p {
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
  margin: 0 0 1rem;
  flex: 1;
}

.ollmh-program-card-link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--color-primary-button);
  transition: gap 0.2s ease;
}

.ollmh-program-card:hover .ollmh-program-card-link {
  gap: 0.625rem;
}

.ollmh-programs-pagination {
  display: flex;
  justify-content: center;
  margin: 1rem 0 3rem;
}

.ollmh-programs-pagination .page-numbers {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 0.75rem;
  margin: 0 2px;
  border: 1px solid var(--color-border-light);
  border-radius: 6px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-primary-heading);
  text-decoration: none;
  transition: all 0.2s ease;
}

.ollmh-programs-pagination .page-numbers:hover,
.ollmh-programs-pagination .page-numbers.current {
  background: var(--color-primary-button);
  border-color: var(--color-primary-button);
  color: #fff;
}

/* Responsive */
@media (max-width: 768px) {
  .ollmh-community-programs-grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 1rem;
  }
}

@media (max-width: 480px) {
  .ollmh-community-programs-grid {
    grid-template-columns: 1fr;
  }
}

/* ── 404 Page ─────────────────────────────────────────────────────── */

.ollmh-404-illustration {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background: linear-gradient(135deg, var(--color-primary, #001a55) 0%, var(--color-primary-dark, #07112e) 100%);
  border-radius: 16px;
  padding: 3rem 2rem;
  min-height: 280px;
  color: #fff;
  text-align: center;
}

.ollmh-404-illustration i {
  font-size: 3rem;
  color: var(--color-accent-gold, #ffdd47);
  opacity: 0.85;
}

.ollmh-404-code {
  font-size: 4rem;
  font-weight: 800;
  color: var(--color-accent-gold, #ffdd47);
  letter-spacing: 0.05em;
  line-height: 1;
  font-family: var(--font-heading, Georgia, serif);
}

.ollmh-404-search {
  margin: 1.5rem 0;
}

.ollmh-404-search .search-form {
  display: flex;
  gap: 0.5rem;
  max-width: 480px;
}

.ollmh-404-search .search-field {
  flex: 1;
  padding: 0.65rem 1rem;
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 8px;
  font-size: 0.95rem;
}

.ollmh-404-search .search-field:focus {
  outline: none;
  border-color: var(--color-primary-button, #0064cd);
  box-shadow: 0 0 0 3px rgba(0, 100, 205, 0.12);
}

.ollmh-quick-link-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-decoration: none;
  cursor: pointer;
}

.ollmh-quick-link-card:hover {
  transform: none;
  box-shadow: none;
  text-decoration: none;
}

.ollmh-quick-link-card:hover h3 {
  color: var(--color-primary-button, #0064cd);
}

/* ── Search Results Page ──────────────────────────────────────────── */

.ollmh-search-results-info {
  background: var(--color-bg-white, #fff);
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 12px;
  padding: 1rem 1.5rem;
  margin-bottom: 2rem;
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.ollmh-search-results-info i {
  font-size: 1.25rem;
  color: var(--color-primary-button, #0064cd);
}

.ollmh-search-results-info strong {
  color: var(--color-primary-heading, #001a55);
}

.ollmh-search-result-card {
  background: var(--color-bg-white, #fff);
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.25rem;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  display: flex;
  gap: 1.25rem;
  align-items: flex-start;
}

.ollmh-search-result-card:hover {
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
  transform: translateY(-2px);
}

.ollmh-search-result-thumb {
  flex-shrink: 0;
  width: 120px;
  height: 120px;
  border-radius: 8px;
  overflow: hidden;
}

.ollmh-search-result-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ollmh-search-result-body {
  flex: 1;
  min-width: 0;
}

.ollmh-search-result-body h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-primary-heading, #001a55);
  margin: 0 0 0.5rem;
}

.ollmh-search-result-body h3 a {
  color: inherit;
  text-decoration: none;
}

.ollmh-search-result-body h3 a:hover {
  color: var(--color-primary-button, #0064cd);
}

.ollmh-search-result-meta {
  font-size: 0.78rem;
  color: #64748b;
  margin-bottom: 0.5rem;
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.ollmh-search-result-excerpt {
  font-size: 0.9rem;
  color: #475569;
  line-height: 1.6;
}

.ollmh-search-no-results {
  text-align: center;
  padding: 3rem 2rem;
}

.ollmh-search-no-results i {
  font-size: 3rem;
  color: var(--color-primary-button, #0064cd);
  margin-bottom: 1rem;
  opacity: 0.6;
}

.ollmh-search-no-results .ollmh-404-search {
  max-width: 480px;
  margin: 1.5rem auto 0;
}

.ollmh-search-pagination {
  margin-top: 2rem;
  display: flex;
  justify-content: center;
}

.ollmh-search-pagination .page-numbers {
  display: inline-block;
  padding: 0.5rem 0.9rem;
  margin: 0 0.15rem;
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 6px;
  text-decoration: none;
  color: var(--color-primary-heading, #001a55);
  font-size: 0.9rem;
  transition: all 0.2s ease;
}

.ollmh-search-pagination .page-numbers:hover,
.ollmh-search-pagination .page-numbers.current {
  background: var(--color-primary-button, #0064cd);
  border-color: var(--color-primary-button, #0064cd);
  color: #fff;
}

/* ── Generic Page (page.php) ──────────────────────────────────────── */

.ollmh-generic-page-content {
  background: var(--color-bg-white, #fff);
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 12px;
  padding: 2.5rem;
}

.ollmh-generic-page-content .ollmh-page-featured-image {
  width: 100%;
  border-radius: 12px;
  margin-bottom: 2rem;
  max-height: 400px;
  object-fit: cover;
}

/* ── Blog/Posts Listing (home.php) ────────────────────────────────── */

.ollmh-blog-listing-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 1.5rem;
}

.ollmh-blog-card {
  background: var(--color-bg-white, #fff);
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  display: flex;
  flex-direction: column;
}

.ollmh-blog-card:hover {
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
  transform: translateY(-3px);
}

.ollmh-blog-card-image {
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.ollmh-blog-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.ollmh-blog-card:hover .ollmh-blog-card-image img {
  transform: scale(1.05);
}

.ollmh-blog-card-body {
  padding: 1.5rem;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.ollmh-blog-card-date {
  font-size: 0.78rem;
  color: #64748b;
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.ollmh-blog-card-body h3 {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-primary-heading, #001a55);
  margin: 0 0 0.5rem;
}

.ollmh-blog-card-body h3 a {
  color: inherit;
  text-decoration: none;
}

.ollmh-blog-card-body h3 a:hover {
  color: var(--color-primary-button, #0064cd);
}

.ollmh-blog-card-excerpt {
  font-size: 0.88rem;
  color: #475569;
  line-height: 1.6;
  flex: 1;
}

.ollmh-blog-card-link {
  margin-top: 1rem;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--color-primary-button, #0064cd);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
}

.ollmh-blog-card-link:hover {
  gap: 0.6rem;
}

.ollmh-blog-pagination {
  margin-top: 2.5rem;
  display: flex;
  justify-content: center;
}

.ollmh-blog-pagination .page-numbers {
  display: inline-block;
  padding: 0.5rem 0.9rem;
  margin: 0 0.15rem;
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 6px;
  text-decoration: none;
  color: var(--color-primary-heading, #001a55);
  font-size: 0.9rem;
  transition: all 0.2s ease;
}

.ollmh-blog-pagination .page-numbers:hover,
.ollmh-blog-pagination .page-numbers.current {
  background: var(--color-primary-button, #0064cd);
  border-color: var(--color-primary-button, #0064cd);
  color: #fff;
}

/* ── Generic Archive Fallback ─────────────────────────────────────── */

.ollmh-archive-fallback-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 1.5rem;
}

.ollmh-archive-fallback-card {
  background: var(--color-bg-white, #fff);
  border: 1px solid var(--color-border-light, #e2e8f0);
  border-radius: 12px;
  overflow: hidden;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
  text-decoration: none;
  display: flex;
  flex-direction: column;
}

.ollmh-archive-fallback-card:hover {
  box-shadow: 0 6px 20px rgba(0, 26, 85, 0.08);
  transform: translateY(-3px);
}

.ollmh-archive-fallback-card-image {
  width: 100%;
  height: 180px;
  overflow: hidden;
}

.ollmh-archive-fallback-card-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ollmh-archive-fallback-card-body {
  padding: 1.25rem;
  flex: 1;
}

.ollmh-archive-fallback-card-body h3 {
  font-size: 1.05rem;
  font-weight: 700;
  color: var(--color-primary-heading, #001a55);
  margin: 0 0 0.4rem;
}

.ollmh-archive-fallback-card-body p {
  font-size: 0.85rem;
  color: #475569;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 768px) {
  .ollmh-search-result-card {
    flex-direction: column;
  }

  .ollmh-search-result-thumb {
    width: 100%;
    height: 160px;
  }

  .ollmh-generic-page-content {
    padding: 1.5rem;
  }

  .ollmh-404-search .search-form {
    flex-direction: column;
  }
}

/* ── Single Gallery Album — Two-Column Layout ───────────────────────
   Mirrors the single-event layout: featured image hero, album overview,
   photo grid, tags + share, post navigation, and a sidebar with album
   details, quick actions, share, and an explore card. The two-column
   grid (.ollmh-event-layout) and sidebar card styles are shared with
   the event template; only gallery-specific tweaks live here. */

/* Sidebar "Explore More" card — the event sidebar uses
   .ollmh-event-sidebar-card-title (larger, normal-case) instead of the
   news sidebar's .ollmh-sidebar-widget-title. Ensure the title renders
   white over the featured-image background like the news variant. */
.ollmh-event-sidebar .ollmh-sidebar-explore-card .ollmh-event-sidebar-card-title {
  color: #fff;
  border-bottom-color: rgba(255, 255, 255, 0.3);
}
.ollmh-event-sidebar .ollmh-sidebar-explore-card .ollmh-event-sidebar-card-title i {
  color: #fff;
}

/* Photo grid section — give the gallery grid breathing room and a
   subtle top divider so it reads as its own block within the main
   column. */
.ollmh-gallery-photo-section {
  padding-top: 1.5rem;
  margin-top: 0.5rem;
  border-top: 1px solid #f1f5f9;
}
.ollmh-gallery-photo-grid {
  margin-top: 1rem;
}

/* Photo grid — responsive card layout. Items use a uniform aspect
   ratio so the grid looks tidy at every breakpoint. Each item has a
   hover overlay with a "view" icon to signal clickability. */
.ollmh-single-gallery-page .gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 1rem;
  margin: 0;
}
.ollmh-single-gallery-page .gallery-grid .gallery-item {
  position: relative;
  margin: 0;
  border-radius: 12px;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  background: #f8fafc;
  cursor: pointer;
  transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.ollmh-single-gallery-page .gallery-grid .gallery-item:hover {
  box-shadow: 0 8px 24px rgba(0, 26, 85, 0.15);
  transform: translateY(-3px);
}
.ollmh-single-gallery-page .gallery-grid .gallery-item img {
  width: 100%;
  height: 200px;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}
.ollmh-single-gallery-page .gallery-grid .gallery-item:hover img {
  transform: scale(1.06);
}
/* Hover overlay with view icon */
.ollmh-single-gallery-page .gallery-grid .gallery-item::after {
  content: '\f00e';
  font-family: 'Font Awesome 6 Free', 'Font Awesome 5 Free', 'FontAwesome';
  font-weight: 900;
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.5rem;
  background: rgba(0, 26, 85, 0.45);
  opacity: 0;
  transition: opacity 0.25s ease;
  pointer-events: none;
}
.ollmh-single-gallery-page .gallery-grid .gallery-item:hover::after {
  opacity: 1;
}
/* Caption shown on the thumbnail (if present) */
.ollmh-single-gallery-page .gallery-grid .gallery-caption {
  padding: 0.5rem 0.75rem;
  font-size: 0.8rem;
  color: #475569;
  background: #f8fafc;
  border-top: 1px solid #e2e8f0;
}

/* Responsive — photo grid scales down cleanly */
@media (max-width: 1024px) {
  .ollmh-single-gallery-page .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 0.875rem;
  }
  .ollmh-single-gallery-page .gallery-grid .gallery-item img {
    height: 170px;
  }
}
@media (max-width: 768px) {
  .ollmh-single-gallery-page .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 0.75rem;
  }
  .ollmh-single-gallery-page .gallery-grid .gallery-item img {
    height: 140px;
  }
  .ollmh-single-gallery-page .gallery-grid .gallery-item::after {
    font-size: 1.1rem;
  }
}
@media (max-width: 480px) {
  .ollmh-single-gallery-page .gallery-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }
  .ollmh-single-gallery-page .gallery-grid .gallery-item img {
    height: 120px;
  }
}