/* Stack and center logo/title/tagline on tablet & mobile */
@media (max-width: 1024px) {
  .ast-site-identity {
    display: block !important;
    text-align: center !important;
  }
  .ast-site-identity .site-logo-img,
  .ast-site-identity .custom-logo-link {
    display: block !important;
    margin: 0 auto !important;
  }
  .ast-site-identity .site-title,
  .ast-site-identity .site-description {
    display: block !important;
    text-align: center !important;
    margin-top: 6px;
  }
}

/* (Optional) hide the tagline on small phones for a cleaner header */
@media (max-width: 480px) {
  .ast-site-identity .site-description {
    display: none !important;
  }
}
/* Tablet & Mobile: stack and center logo + title + tagline */
@media (max-width: 1024px) {
  .ast-site-identity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  /* Keep the logo a sane size */
  .ast-site-identity .custom-logo-link img,
  .ast-site-identity .site-logo-img img {
    max-width: 120px !important; /* tweak 90–130px if you want */
    height: auto !important;
  }

  /* Stop vertical/sideways text and weird wrapping */
  .ast-site-identity .site-title,
  .ast-site-identity .site-description {
    writing-mode: horizontal-tb !important;
    transform: none !important;
    white-space: normal !important;
    word-break: normal !important;
    display: block !important;
    text-align: center !important;
    max-width: 100% !important;
    margin-top: 4px !important;
    line-height: 1.25 !important;
  }

  .ast-site-identity .site-title a {
    display: inline-block !important;
  }
}

/* Optional: hide tagline on very small phones for a cleaner header */
@media (max-width: 380px) {
  .ast-site-identity .site-description { display: none !important; }
}
/* Astra mobile/tablet: force logo + title/tagline to stack and stay horizontal */
@media (max-width: 1024px) {
  /* Astra adds this class at the breakpoint */
  .ast-header-break-point .ast-site-identity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  /* Keep logo sane size */
  .ast-header-break-point .site-logo-img img,
  .ast-header-break-point .custom-logo-link img {
    max-width: 120px !important;
    height: auto !important;
  }

  /* Wrap correctly + kill any vertical writing mode/rotations */
  .ast-header-break-point .site-title,
  .ast-header-break-point .site-title a,
  .ast-header-break-point .site-description {
    writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    transform: none !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    hyphens: manual !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    line-height: 1.25 !important;
    margin-top: 6px !important;
    letter-spacing: normal !important;
  }

  /* Ensure wrapper isn't constraining width */
  .ast-header-break-point .ast-site-title-wrap {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
}

/* Optional: hide tagline on very small phones for cleaner header */
@media (max-width: 380px) {
  .ast-header-break-point .site-description { display: none !important; }
}
/* Force site title + tagline horizontal on mobile */
@media (max-width: 768px) {
  .site-branding {
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: center;
  }
  .site-title,
  .site-description {
    display: inline-block !important;
    margin: 0 5px !important;
    white-space: nowrap !important;
  }
}
/* Clean mobile header (phones): keep only a small, centered logo + hamburger */
@media (max-width: 480px) {
  /* Hide title & tagline */
  .ast-header-break-point .site-title,
  .ast-header-break-point .site-description {
    display: none !important;
  }

  /* Center the logo and keep it modest */
  .ast-header-break-point .ast-site-identity,
  .ast-header-break-point .site-branding {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }
  .ast-header-break-point .custom-logo-link img,
  .ast-header-break-point .site-logo-img img {
    max-width: 120px !important; /* tweak 90–130 if you want */
    height: auto !important;
  }
}
/* === MOBILE/TABLET BRANDING FIX (Astra) === */
/* For Astra's mobile/tablet header breakpoint, force clean stack + kill vertical text */
@media (max-width: 1024px) {
  body.ast-header-break-point #masthead .site-branding,
  body.ast-header-break-point .ast-site-identity {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  /* Keep logo sane and centered */
  body.ast-header-break-point .custom-logo-link img,
  body.ast-header-break-point .site-logo-img img {
    max-width: 120px !important; /* tweak 90–130px if you want */
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
  }

  /* HARD-STOP any vertical/rotated text on title/tagline */
  body.ast-header-break-point #masthead .site-title,
  body.ast-header-break-point #masthead .site-title a,
  body.ast-header-break-point #masthead .site-description {
    writing-mode: horizontal-tb !important;
    -webkit-writing-mode: horizontal-tb !important;
    text-orientation: mixed !important;
    transform: none !important;
    rotate: initial !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
    line-height: 1.25 !important;
    margin-top: 6px !important;
    letter-spacing: normal !important;
  }

  /* Make sure the wrapper doesn't constrain width/alignment */
  body.ast-header-break-point #masthead .ast-site-title-wrap {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
  }
}

/* (Optional) Hide tagline on very small phones for a cleaner header */
@media (max-width: 380px) {
  body.ast-header-break-point #masthead .site-description {
    display: none !important;
  }
}
/* FINAL MOBILE SAFETY NET: hide title & tagline on phones, keep tidy logo */
@media (max-width: 544px) {
  body.ast-header-break-point #masthead .site-title,
  body.ast-header-break-point #masthead .site-description {
    display: none !important;
    visibility: hidden !important;
  }

  body.ast-header-break-point .ast-site-identity,
  body.ast-header-break-point .site-branding {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
  }

  body.ast-header-break-point .custom-logo-link img,
  body.ast-header-break-point .site-logo-img img {
    max-width: 120px !important; /* tweak 90–130 if you want */
    height: auto !important;
    display: block !important;
    margin: 0 auto !important;
  }
}
@media (max-width: 544px) {
  body.ast-header-break-point #masthead .site-title * { display: none !important; }
  body.ast-header-break-point #masthead .site-description * { display: none !important; }
}
.chronological-stories .wp-block-post {
  display: flex;
  flex-direction: column;
}

.chronological-stories {
  order: 1 !important;
}

.chronological-stories .wp-block-post {
  order: initial !important;
}
/* --- Poopsicles: custom prev/next labels; hide Astra's built-in labels --- */

/* Hide Astra's built-in uppercase or default labels */
.post-navigation .nav-previous a .ast-pagination-direction,
.post-navigation .nav-next a .ast-pagination-direction,
.post-navigation .nav-previous a .nav-subtitle,
.post-navigation .nav-next a .nav-subtitle,
.post-navigation .nav-previous a .ast-label,
.post-navigation .nav-next a .ast-label,
.post-navigation .nav-previous a > span:first-child,
.post-navigation .nav-next a > span:first-child {
  display: none !important;
}

/* Inject custom labels */
.post-navigation .nav-previous a::before {
  content: "← Previous adventure";
  display: block;
  font-size: 0.85em;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25em;
}

.post-navigation .nav-next a::before {
  content: "Next disaster →";
  display: block;
  font-size: 0.85em;
  color: #666;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.25em;
}