/* Scoped, reversible spacing and type refinements for the reviewed public pages. */

/* Homepage: restore a clear hierarchy within the existing hero artwork. */
body.home .hero-h1-col .hero-h1-top {
  font-family: var(--ff-heading);
  font-size: clamp(1.125rem, 1.8vw, 1.375rem) !important;
  font-weight: 600 !important;
}

body.home .hero-h1-col .hero-h1-bridge {
  font-family: var(--ff-heading);
  font-size: clamp(1.375rem, 2.2vw, 1.75rem) !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  white-space: normal !important;
}

body.home .hero-h1-col .hero-h1-hero,
body.home .hero-h1-col .hero-h1-hero .ff-display {
  font-family: var(--ff-heading) !important;
  font-size: clamp(2.75rem, 4vw, 3.25rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}

body.home .hero-subtitle {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
}

body.home .section {
  padding-top: 64px;
  padding-bottom: 64px;
}

body.home .section-sm {
  padding-top: 40px;
  padding-bottom: 40px;
}

body.home .hp-storybooks-section h2,
body.home .hp-how-section h2,
body.home .hp-parents-section h2 {
  font-family: var(--ff-heading);
  font-size: clamp(1.75rem, 2.8vw, 2.125rem) !important;
  line-height: 1.2;
}

/* Hero profiles, including David: let the content determine the banner height. */
.hero-profile-banner {
  min-height: min(80vh, 700px);
}

.hero-profile-content {
  gap: 40px;
  padding-top: 112px;
  padding-bottom: 64px;
}

.hero-profile-name {
  font-family: var(--ff-heading);
  font-size: clamp(2.75rem, 4vw, 3.25rem);
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: 0;
}

.hero-profile-bio,
.hero-story-body {
  max-width: 68ch;
  line-height: 1.7;
}

.hero-story-body {
  font-size: 17px;
}

.hero-profile-portrait img {
  height: min(52vw, 460px);
}

.hero-profile-banner + .hero-profile-gradient-divider + .section {
  padding-top: 64px;
  padding-bottom: 64px;
}

/* Free Downloads: make the resource grid easier to scan without changing its art. */
.ff-refine-downloads .page-header {
  padding-top: 136px;
  padding-bottom: 64px;
}

.ff-refine-downloads .page-header h1 {
  font-family: var(--ff-heading);
  font-size: clamp(2.75rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.14;
}

.ff-refine-downloads .page-header p {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
}

.ff-refine-downloads .ffd-downloads-section,
.ff-refine-downloads .popular-downloads-section {
  padding-top: 64px !important;
  padding-bottom: 64px !important;
}

.ff-refine-downloads .ffd-downloads-head {
  margin-bottom: 28px !important;
}

.ff-refine-downloads .ffd-downloads-head h2,
.ff-refine-downloads .ffd-why-head h2 {
  font-family: var(--ff-heading);
  font-size: clamp(1.75rem, 2.8vw, 2.125rem) !important;
  line-height: 1.2;
}

.ff-refine-downloads .ffd-search-filter {
  margin-bottom: 36px !important;
}

.ff-refine-downloads .ffd-category-filter {
  margin-bottom: 36px !important;
}

.ff-refine-downloads .ffd-grid {
  gap: 24px;
}

.ff-refine-downloads .ffd-card-image {
  aspect-ratio: 4 / 3;
  max-height: 260px;
}

.ff-refine-downloads .ffd-card-image img {
  object-fit: contain;
}

.ff-refine-downloads .ffd-card-body {
  padding: 20px;
  gap: 14px;
}

.ff-refine-downloads .ffd-btn {
  min-height: 44px;
}

/* Parent Edit: keep the reading type and narrow the measure. */
.pe-archive-header {
  padding-top: 136px;
  padding-bottom: 64px;
}

.pe-archive-header h1 {
  font-family: var(--ff-heading);
  font-size: clamp(2.75rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.14;
}

.pe-archive-header p {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
}

.pe-hero-img {
  min-height: 300px;
}

.pe-hero-body {
  padding: 30px;
}

.pe-hero-excerpt {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
}

.ff-refine-parent-article .cc-single-header {
  padding-top: 136px;
  padding-bottom: 72px;
}

.ff-refine-parent-article .cc-single-header-content h1 {
  font-family: var(--ff-heading);
  font-size: clamp(2.75rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.15;
}

.ff-refine-parent-article .cc-single-layout {
  gap: 40px;
}

.ff-refine-parent-article .cc-single-content {
  max-width: 70ch;
  font-size: 17px;
  line-height: 1.75;
}

.ff-refine-parent-article .cc-content-block {
  margin-bottom: 36px;
  padding-top: 36px;
  padding-bottom: 32px;
}

.ff-refine-parent-article .cc-content-block > h2 {
  font-family: var(--ff-heading);
  font-size: clamp(1.75rem, 2.8vw, 2.125rem);
  font-weight: 700;
}

/* Divine Dispatch: preserve the verse treatment while shortening its reading header. */
.dd-hero {
  min-height: 580px;
  padding-top: 112px;
  padding-bottom: 72px;
}

.dd-hero-inner {
  gap: 40px;
}

.dd-hero h1 {
  font-family: var(--ff-heading);
  font-size: clamp(2.75rem, 4vw, 3.25rem);
  font-weight: 700;
  line-height: 1.12;
}

.dd-hero-art {
  width: min(100%, 380px);
  justify-self: center;
}

.dd-content-section {
  padding-top: 64px;
  padding-bottom: 64px;
}

.dd-content {
  max-width: 68ch;
  font-size: 17px;
  line-height: 1.7;
}

.dd-content h2 {
  font-family: var(--ff-heading);
  font-size: clamp(1.75rem, 2.8vw, 2.125rem);
  line-height: 1.2;
}

@media (min-width: 1025px) {
  .footer-grid--compact {
    grid-template-columns: 1.2fr 1fr 1fr 1fr;
  }
}

@media (max-width: 768px) {
  body.home .hero-h1-col .hero-h1-hero,
  body.home .hero-h1-col .hero-h1-hero .ff-display {
    font-size: clamp(2rem, 8.8vw, 2.25rem) !important;
  }

  body.home .hero-h1-col .hero-h1-bridge {
    font-size: clamp(1.25rem, 5.5vw, 1.5rem) !important;
  }

  body.home .section,
  .hero-profile-banner + .hero-profile-gradient-divider + .section {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  body.home .section-sm {
    padding-top: 36px;
    padding-bottom: 36px;
  }

  .hero-profile-banner {
    min-height: 0;
  }

  .hero-profile-content {
    gap: 24px;
    padding-top: 112px;
    padding-bottom: 48px;
  }

  .hero-profile-name {
    font-size: clamp(2rem, 8.8vw, 2.25rem);
  }

  .ff-refine-downloads .page-header,
  .pe-archive-header,
  .ff-refine-parent-article .cc-single-header {
    padding-top: 112px;
    padding-bottom: 48px;
  }

  .ff-refine-downloads .page-header h1,
  .pe-archive-header h1,
  .ff-refine-parent-article .cc-single-header-content h1 {
    font-size: clamp(2rem, 8.8vw, 2.25rem);
  }

  .ff-refine-downloads .ffd-downloads-section,
  .ff-refine-downloads .popular-downloads-section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
  }

  .ff-refine-downloads .ffd-downloads-head h2,
  .ff-refine-downloads .ffd-why-head h2,
  .ff-refine-parent-article .cc-content-block > h2 {
    font-size: clamp(1.75rem, 7vw, 2rem) !important;
  }

  .ff-refine-downloads .ffd-card-image {
    max-height: 250px;
  }

  .ff-refine-downloads .ffd-card-body {
    padding: 20px;
  }

  .pe-hero-img {
    min-height: 200px;
  }

  .pe-hero-body {
    padding: 22px;
  }

  .ff-refine-parent-article .cc-single-layout {
    gap: 28px;
  }

  .ff-refine-parent-article .cc-content-block {
    margin-bottom: 28px;
    padding-top: 28px;
    padding-bottom: 28px;
  }

  .dd-hero {
    min-height: 0;
    padding-top: 104px;
    padding-bottom: 52px;
  }

  .dd-hero-inner {
    gap: 28px;
  }

  .dd-hero h1 {
    font-size: clamp(2rem, 8.8vw, 2.25rem);
  }

  .dd-hero-art {
    width: min(100%, 340px);
  }

  .dd-content-section {
    padding-top: 48px;
    padding-bottom: 48px;
  }

  .dd-content h2 {
    font-size: clamp(1.75rem, 7vw, 2rem);
  }
}

@media (max-width: 640px) {
  body.home .hero-content .hero-img-wrap {
    width: min(72vw, 220px) !important;
    max-width: 220px !important;
  }

  body.home .hero-content .hero-img-wrap img {
    height: min(62vw, 200px) !important;
    max-height: 200px !important;
  }
}

/* Parent Edit archive: virtue first, search last, equal desktop columns. */
@media (min-width: 1025px) {
  .pe-archive-header .hm-search-section > .container:has(> .archive-need-start) {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
    align-items: center;
  }
  .pe-archive-header .hm-search-section > .container > * {
    grid-column: 1 / -1;
  }
  .pe-archive-header .hm-search-section > .container > .archive-need-start,
  .pe-archive-header .hm-search-section > .container > .hm-search-form {
    grid-column: auto;
    min-width: 0;
    width: 100%;
    margin: 0;
  }
  .pe-archive-header .hm-search-section .shop-need-finder {
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
  }
  .pe-archive-header .hm-search-section .shop-need-finder.has-selection {
    grid-template-columns: minmax(0, 1fr) auto auto;
  }
  .pe-archive-header .hm-search-section .shop-need-finder.has-selection .shop-need-label {
    grid-column: 1 / -1;
  }
  .pe-archive-header .hm-search-section .shop-need-select-wrap,
  .pe-archive-header .hm-search-section .hm-search-input-wrap {
    min-width: 0;
  }
  .pe-archive-header .hm-search-section .shop-need-label {
    padding-left: 0;
  }
  .pe-archive-header .hm-search-section .shop-need-status {
    padding-left: 12px;
    padding-right: 12px;
  }
}
@media (min-width: 1025px) and (max-width: 1200px) {
  .pe-archive-header .hm-search-section .shop-need-finder {
    grid-template-columns: minmax(0, 1fr) auto;
  }
  .pe-archive-header .hm-search-section .shop-need-label {
    grid-column: 1 / -1;
  }
}

/* Broader introductions on blog landing pages; article reading widths stay intact. */
.pe-archive-header .container > h1 + p,
.cc-archive-header .container > h1 + p,
.hm-header .container > h1 + p {
  max-width: 880px !important;
}

/* Simplified Parent Edit introduction, approved after the wider-intro trial. */
.pe-archive-header {
  padding-bottom: 40px;
}
.pe-archive-header .container > h1 + .pe-archive-intro {
  max-width: 740px !important;
  margin: 0 auto;
  line-height: 1.65;
  text-wrap: balance;
}
.pe-archive-header .pe-archive-audience {
  margin: 18px auto 0;
  font-size: 14px;
  line-height: 1.6;
  color: var(--ff-brand-yellow);
  font-style: italic;
  font-weight: 400;
}
.pe-archive-header .hm-search-section {
  padding-top: 24px;
}
@media (max-width: 768px) {
  .pe-archive-header { padding-bottom: 32px; }
}

/* Keep archive controls above the decorative header layers and bottom divider. */
.pe-archive-header .hm-search-section {
  position: relative;
  z-index: 2;
  padding-top: 32px;
  padding-bottom: 0;
  text-align: left;
  background: transparent;
}

/* Softer emphasis for the Dispatch practical-resource heading. */
.dd-sidebar .dd-free-card h3 {
  color: var(--ff-brand-yellow);
  font-weight: 500;
}

/* Keep the divider on Today’s Dispatch, not the following article title. */
.dd-content > #dispatch-content + h2::after {
  display: none;
}

/* Let the Hero Mission verse card overlap its header divider like Dispatches. */
.hm-mission-hero + .hm-verse-section {
  margin-top: -54px;
  padding-top: 0;
  background: transparent;
}

/* Archive dropdowns: omit decorative totals and give the select their space. */
.pe-archive-header .hm-search-section .shop-need-status {
  display: none;
}
@media (min-width: 1025px) {
  .pe-archive-header .hm-search-section .shop-need-finder {
    grid-template-columns: auto minmax(0, 1fr);
  }
  .pe-archive-header .hm-search-section .shop-need-finder.has-selection {
    grid-template-columns: minmax(0, 1fr) auto;
  }
}
@media (min-width: 1025px) and (max-width: 1200px) {
  .pe-archive-header .hm-search-section .shop-need-finder:not(.has-selection) {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Desktop footer: keep groups distinct, with links close to their headings. */
@media (min-width: 1025px) {
  .footer .footer-col-title { margin-bottom: 10px; }
  .footer .footer-col ul { gap: 0; }
  .footer .footer-col ul > li + li { margin-top: 11px; }
  .footer .footer-col ul > .footer-menu-heading { margin-top: 26px; margin-bottom: 0; }
  .footer .footer-col ul > .footer-menu-heading:first-child { margin-top: 0; }
  .footer .footer-col ul > .footer-menu-heading + li { margin-top: 4px; }
  .footer .footer-logo { line-height: 1; }
}

/* Requested display font for the three footer navigation headings. */
.footer .footer-col-title {
  font-family: var(--ff-display);
  font-weight: 400;
  font-size: 24px;
  line-height: 1.2;
  color: #fff;
}

/* Faith Force Daily: fixed, one-line Telegram invitation. */
.ff-telegram-banner {
  position: fixed;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 900;
  min-height: 44px;
  padding: 0 max(12px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(12px, env(safe-area-inset-left));
  background: #111b30;
}

.ff-telegram-banner__link {
  display: flex;
  width: 100%;
  align-items: center;
  justify-content: center;
  gap: 7px;
  min-height: 44px;
  color: #fff;
  font-size: clamp(12px, 3.35vw, 15px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.01em;
  text-decoration: none;
  white-space: nowrap;
}

.ff-telegram-banner__badge {
  flex: 0 0 auto;
  padding: 4px 6px;
  border-radius: 3px;
  background: var(--ff-brand-yellow, #e2c57b);
  color: #111b30;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.ff-telegram-banner__text {
  flex: 0 1 auto;
}

.ff-telegram-banner__link:hover {
  color: var(--ff-brand-yellow, #e2c57b);
}

.ff-telegram-banner__link:focus-visible {
  outline: 3px solid #fff;
  outline-offset: -4px;
}

.ff-telegram-banner-spacer {
  height: calc(44px + env(safe-area-inset-bottom));
}

@media print {
  .ff-telegram-banner,
  .ff-telegram-banner-spacer {
    display: none;
  }
}