/* ============================================================
   Doxa Health and Wellness — custom fixes (via staging)
   ============================================================ */

/* ---- Logo ---- */
.wp-block-site-logo,
.wp-block-site-logo img { width: 112px !important; }
.header_con.header_con { padding-top: 10px !important; padding-bottom: 10px !important; }

/* ---- Desktop: slim contact band ---- */
@media (min-width: 901px) {
  .header_con .wp-block-group.alignwide > .wp-block-group {
    gap: 24px !important; margin: 0 !important; padding: 4px 12px !important;
  }
  .header_con .has-vivid-cyan-blue-to-vivid-purple-gradient-background.has-background { padding: 8px !important; }
  .header_con h5.wp-block-heading { margin: 0 0 2px !important; line-height: 1.2 !important; }
  .header_con p { line-height: 1.3 !important; }

  /* nav row: tighten so the 11 items sit on one line on wide screens */
  .header_nav { padding: 0 24px !important; }
  .header_nav2 { justify-content: space-between !important; align-items: center !important; }
  #header_navigtation { column-gap: 18px !important; row-gap: 4px !important; }
  #header_navigtation .wp-block-navigation-item__content { letter-spacing: .3px !important; font-size: 15px !important; }
  .book_btn { align-items: center !important; }
  .book_btn .wp-block-button__link { line-height: 1.7 !important; }
}

/* ---- Tablet & mobile: drop contact band, clean logo + nav header ---- */
@media (max-width: 900px) {
  /* Flex the template-part header itself: [logo] [.... hamburger + BOOK ONLINE ->] .
     One real row, no overlap -> taps cannot be intercepted. */
  header.wp-block-template-part {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    background: #fff !important;
  }
  header.wp-block-template-part > .doxa-header-shell { flex: 0 0 auto !important; }
  header.wp-block-template-part > .header_nav {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    border-top: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  .doxa-header-shell > .header_con {
    display: flex !important;
    justify-content: flex-start !important;
    padding: 8px 0 8px 16px !important;
    min-height: 0 !important;
  }
  .doxa-header-shell > .header_con > .wp-block-group.alignwide { display: none !important; }
  .doxa-header-shell .wp-block-site-logo,
  .doxa-header-shell .wp-block-site-logo img { width: 94px !important; }

  .header_nav2 {
    justify-content: flex-end !important;
    align-items: center !important;
    gap: 10px !important;
    padding: 8px 16px !important;
    min-height: 0 !important;
  }
  #header_navigtation { padding-right: 0 !important; flex: 0 0 auto !important; }
  .wp-block-navigation__responsive-container-open {
    width: 44px !important; height: 44px !important; padding: 0 !important;
    display: flex !important; align-items: center !important; justify-content: center !important;
  }

  .book_btn { padding-left: 0 !important; flex: 0 0 auto !important; width: auto !important; }
  .book_btn .wp-block-button,
  .book_btn .wp-block-button__link { width: auto !important; }
  .book_btn .wp-block-button__link {
    line-height: 1.4 !important; padding: 9px 16px !important;
    font-size: 13px !important; white-space: nowrap !important;
  }
}

/* ============================================================
   Intro splash — large logo, then fades to reveal the site
   (home page only)
   ============================================================ */
@media (prefers-reduced-motion: no-preference) {
  body.home::before,
  body.home::after {
    content: "";
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    pointer-events: none;
  }
  body.home::before {
    background: #ffffff;
    animation: doxa-splash-bg 2s ease forwards;
  }
  body.home::after {
    background: url("https://doxahealth.org/wp-content/uploads/2026/09/doxa-logo.png")
                center center / min(78vw, 420px) auto no-repeat;
    animation: doxa-splash-logo 2s ease forwards;
  }
  @keyframes doxa-splash-bg {
    0%, 55%  { opacity: 1; visibility: visible; }
    100%     { opacity: 0; visibility: hidden; }
  }
  @keyframes doxa-splash-logo {
    0%   { opacity: 0; transform: scale(.9); }
    20%  { opacity: 1; transform: scale(1); }
    55%  { opacity: 1; transform: scale(1); }
    100% { opacity: 0; transform: scale(1.03); visibility: hidden; }
  }
}

/* ============================================================
   Hero: original gradient pill button (now links to About Us);
   keep the headline readable over the photo
   ============================================================ */
.wp-block-cover h2.wp-block-heading {
  font-size: clamp(32px, 5.2vw, 48px) !important;
  font-weight: 700 !important;
  color: #ffffff !important;
  margin-top: 10px !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.5) !important;
}
/* gentle bottom scrim so the headline isn't fighting the busy image */
.wp-block-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(to top, rgba(0,0,0,.55) 0%, rgba(0,0,0,.18) 34%, rgba(0,0,0,0) 60%);
}
.wp-block-cover > .wp-block-cover__inner-container { position: relative; z-index: 2; }


/* ============================================================
   Titles: wrap between words, not mid-word (no "UNDERSTANDI / NG")
   ============================================================ */
.wp-block-post-title,
.wp-block-cover .wp-block-heading,
h1.wp-block-heading, h2.wp-block-heading {
  word-break: normal !important;
  overflow-wrap: break-word !important;
  hyphens: auto !important;
}
@media (max-width: 680px) {
  .wp-block-cover .wp-block-post-title {
    font-size: clamp(26px, 8vw, 42px) !important;
    line-height: 1.15 !important;
  }
}