/*
 * Eagles Way Healing — cleanup overrides.
 *
 * Defines the visual treatment for the two pieces of UI that replaced removed
 * the original CMS components:
 *
 *   .ewh-email-signup   — non-intrusive inline email capture that sits
 *                         immediately above the footer on every page,
 *                         taking the place of the old exit-intent and
 *                         two-step pop-up modals.
 *
 *   .ewh-social-bar     — a more prominent Facebook / Instagram / YouTube
 *                         row in the footer, replacing the removed
 *                         "Book a Healing Session" CTA. The icons are
 *                         enlarged and given accent backgrounds so they
 *                         read as the dominant footer element.
 *
 * Colors and spacing are taken directly from the vendor theme variables already
 * in use on the site (#474747 buttons, #f7f7f8 light background, system font
 * stack), so nothing about the brand palette or layout system changes.
 */

/* Visually-hidden labels used for screen readers only */
.ewh-email-signup .sr-only {
  position: absolute;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}

/* === Inline email capture ============================================== */
.ewh-email-signup {
  background-color: #f7f7f8;
  border-top: 1px solid #e6e6e9;
  padding: 60px 20px;
  font-family: "Cabin", sans-serif;
  color: #333;
}
.ewh-email-signup__inner {
  max-width: 720px;
  margin: 0 auto;
  text-align: center;
}
.ewh-email-signup h3 {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 28px;
  margin: 0 0 12px;
  color: #1f1f1f;
}
.ewh-email-signup p {
  font-size: 16px;
  line-height: 1.55;
  margin: 0 0 24px;
}
.ewh-email-signup__form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin: 0 0 16px;
}
.ewh-email-signup__form input.form-control {
  flex: 1 1 220px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #ACACAC;
  border-radius: 0 !important; /* match the global the original CMS override */
  background: #ffffff;
  font-size: 16px;
}
.ewh-email-signup__form button.form-btn {
  flex: 0 0 auto;
  padding: 12px 24px;
  background: #474747;
  color: #ffffff;
  border: 1px solid #474747;
  border-radius: 0;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  text-transform: none;
  letter-spacing: 0.4px;
}
.ewh-email-signup__form button.form-btn:hover {
  background: #2e2e2e;
  border-color: #2e2e2e;
}
.ewh-email-signup__note {
  font-size: 13px;
  color: #888;
  margin: 0;
}
@media (max-width: 540px) {
  .ewh-email-signup__form { flex-direction: column; }
  .ewh-email-signup__form button.form-btn { width: 100%; }
}

/* === Prominent social bar ============================================== */
.ewh-social-bar {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  padding: 20px 16px;
  margin: 0 auto;
  font-family: "Cabin", sans-serif;
}
.ewh-social-bar__label {
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.5px;
  text-transform: uppercase;
  color: inherit;
}
.ewh-social-bar__icon {
  width: 56px;
  height: 56px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #474747;
  color: #ffffff !important;
  font-size: 26px;
  line-height: 1;
  text-decoration: none !important;
  transition: transform 0.15s ease, background-color 0.15s ease;
}
.ewh-social-bar__icon:hover,
.ewh-social-bar__icon:focus {
  background-color: #2e91fc;
  transform: translateY(-2px);
}
.ewh-social-bar__icon .fab,
.ewh-social-bar__icon .fa,
.ewh-social-bar__icon .far,
.ewh-social-bar__icon .fas {
  width: 1em; height: 1em;
  background-color: transparent;
  /* recolor the inline-SVG icon to white so it reads on the dark circle */
  filter: brightness(0) invert(1);
}
@media (max-width: 540px) {
  .ewh-social-bar__icon { width: 48px; height: 48px; font-size: 22px; }
  .ewh-social-bar__label { width: 100%; text-align: center; }
}

/* === Video poster fallback ============================================
 * Restores a visible thumbnail image inside every Wistia video tile so the
 * card has meaningful content when the Wistia loader is initialising,
 * blocked, or unavailable. The Wistia player draws above this image once it
 * loads, so the user sees identical behaviour online. */
.kjb-video-responsive {
  position: relative;
  background: #1a1a1a;
}
.ewh-video-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 0;
  pointer-events: none;
  background: #1a1a1a;
}
.kjb-video-responsive .wistia_embed,
.kjb-video-responsive .wistia_responsive_padding {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* Click-to-play facade: keeps the static thumbnail visible on top of the
 * Wistia loader (which otherwise renders an empty "Video Thumbnail" box
 * when the video has no poster set). The user clicks anywhere on the tile
 * → the facade hides → the inline JS asks Wistia to play. */
.ewh-video-poster-wrap {
  position: absolute;
  inset: 0;
  z-index: 3;
  cursor: pointer;
  display: block;
  background: #1a1a1a;
  overflow: hidden;
}
.ewh-video-poster-wrap .ewh-video-poster {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
  z-index: 1;
}
.ewh-video-poster-wrap .ewh-video-play {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 78px;
  height: 56px;
  border-radius: 8px;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  pointer-events: none;
  transition: background-color 0.15s ease, transform 0.15s ease;
}
.ewh-video-poster-wrap:hover .ewh-video-play,
.ewh-video-poster-wrap:focus .ewh-video-play {
  background: rgba(0, 0, 0, 0.8);
  transform: translate(-50%, -50%) scale(1.06);
}
.ewh-video-poster-wrap .ewh-video-play::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  border-left: 18px solid #ffffff;
  border-top: 12px solid transparent;
  border-bottom: 12px solid transparent;
  margin-left: 4px;
}
.ewh-video-poster-wrap.ewh-video-played {
  display: none;
}
.ewh-video-poster-wrap:focus-visible {
  outline: 2px solid #2e91fc;
  outline-offset: 2px;
}

/* === Bottom inline course signup ======================================
 * Replaces the removed bottom 'EAGLES WAY HEALING' heading + paragraph and
 * the leftover 'Free Meditation' card with one calm email-capture block.
 * Visual register matches the existing site: same heading typography, the
 * theme's form-control + form-btn classes, the brand's neutral palette. */
.ewh-course-signup {
  max-width: 720px;
  margin: 0 auto;
  padding: 40px 20px 20px;
  text-align: center;
  font-family: "Cabin", sans-serif;
  color: #333;
}
.ewh-course-signup__heading {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 32px;
  letter-spacing: 0.6px;
  margin: 0 0 24px;
  color: #1f1f1f;
}
.ewh-course-signup__lede,
.ewh-course-signup__invitation {
  font-size: 17px;
  line-height: 1.65;
  margin: 0 auto 20px;
  max-width: 640px;
}
.ewh-course-signup__invitation {
  color: #555;
}
.ewh-course-signup__form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin: 8px 0 14px;
}
.ewh-course-signup__form input.form-control {
  flex: 1 1 220px;
  min-width: 0;
  padding: 12px 14px;
  border: 1px solid #ACACAC;
  border-radius: 0 !important;
  background: #ffffff;
  font-size: 16px;
}
.ewh-course-signup__form button.form-btn {
  flex: 0 0 auto;
  padding: 12px 26px;
  background: #474747;
  color: #ffffff;
  border: 1px solid #474747;
  border-radius: 0;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: 0.4px;
}
.ewh-course-signup__form button.form-btn:hover {
  background: #2e2e2e;
  border-color: #2e2e2e;
}
.ewh-course-signup__note {
  font-size: 13px;
  color: #888;
  margin: 6px 0 0;
}
.ewh-course-signup .sr-only {
  position: absolute;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0);
  white-space: nowrap; border: 0;
}
@media (max-width: 540px) {
  .ewh-course-signup__form { flex-direction: column; }
  .ewh-course-signup__form button.form-btn { width: 100%; }
}

/* === Final UX polish ===================================================
 * Three small overrides to fix the issues spotted on the live build:
 *  1. The homepage hero section renders too tall because the original
 *     padding totaled 410px of vertical space; cap it to a more
 *     proportionate window.
 *  2. The bottom email-signup block needs to be centered horizontally and
 *     have breathing room around it so the Sender embed doesn't look
 *     squashed against the closing copy.
 *  3. The Sender embed renders a wide form by default; constrain it so
 *     it sits inside the existing column gutters and reads as a calm,
 *     intentional element rather than a pop-up. */

/* 1. Hero + forest sections: keep the original parallax effect (full-size
 *    background image with `background-attachment: fixed`, scrolling past
 *    a fixed viewing window) but cap the viewing window so the band doesn't
 *    dominate above the fold. The two sections share the same window size
 *    so the rhythm reads as uniform.
 *    Window size = ~15% larger than the previous tightened pass:
 *      min 437px, max 598px, padding 127/127. */
#section-1642543175262,
#section-1642544046811 {
  background-size: auto !important;     /* full-size original image */
  background-repeat: no-repeat !important;
  overflow: hidden;
}
#section-1642543175262 .sizer,
#section-1642544046811 .sizer {
  padding-top: 90px !important;
  padding-bottom: 90px !important;
  min-height: 300px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
@media (min-width: 768px) {
  #section-1642543175262,
  #section-1642544046811 {
    background-attachment: fixed !important;
    background-size: cover !important;
    background-position: center !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    box-sizing: border-box !important;
    overflow: hidden;
  }
  /* The Kajabi header is positioned with class `header--overlay`: it
   * sits ON TOP of the first section, eating ~90px of the rocks photo's
   * visible opening. The forest section has no header above it, so its
   * full height is exposed. To make the two visible windows match, the
   * rocks section is enlarged by the header height. */
  #section-1642543175262,
  #section-1642543175262 > .section,
  #section-1642543175262 .sizer {
    height: 560px !important;
    min-height: 560px !important;
    max-height: 560px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
  /* And we shift the rocks photo's content down so the visible band
   * (below the overlay header) is centered. */
  #section-1642543175262 {
    background-position: center 40% !important;
  }
  /* Forest section keeps the original 470px window — its visible
   * opening lines up with the 560 - 90 = 470px exposed by the rocks. */
  #section-1642544046811,
  #section-1642544046811 > .section,
  #section-1642544046811 .sizer {
    height: 470px !important;
    min-height: 470px !important;
    max-height: 470px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }
}

/* 2. Centre the bottom course signup and give it room around it. */
#ewh-course-signup-block {
  width: 100%;
  max-width: 720px;
  margin: 60px auto !important;
  padding: 0 20px !important;
  text-align: center;
  float: none !important;
  clear: both;
}
#ewh-course-signup-block .ewh-course-signup {
  margin: 0 auto;
  padding: 0;
}
#ewh-course-signup-block .ewh-course-signup h2 {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 32px;
  letter-spacing: 0.6px;
  margin: 0 0 18px;
  color: #1f1f1f;
  text-align: center;
}
#ewh-course-signup-block .ewh-course-signup p {
  font-size: 17px;
  line-height: 1.65;
  margin: 0 auto 16px;
  max-width: 640px;
  text-align: center;
}

/* 3. Constrain the Sender embed itself so it doesn't blow past the column
 *    or render with aggressive default styling. */
#ewh-course-signup-block .sender-form-field {
  max-width: 480px;
  margin: 24px auto 0 !important;
  text-align: center !important;
}
#ewh-course-signup-block .sender-form-field iframe,
#ewh-course-signup-block .sender-form-field form,
#ewh-course-signup-block .sender-form-field input,
#ewh-course-signup-block .sender-form-field button {
  max-width: 100% !important;
  font-family: "Cabin", sans-serif !important;
}

/* The closing "Let us guide you" copy now sits ABOVE the signup. Give it a
 * comfortable lower margin so it doesn't crowd the heading. */
#block-1677044803200 {
  margin-bottom: 40px !important;
}

/* === Single feature video tile (replacing the 4-tile testimonial row) ====
 * The original Kajabi grid put four small videos side-by-side; we now show
 * just one wider tile so the page mirrors the live site. Reuses the existing
 * .kjb-video-responsive 16:9 box and the click-to-play facade. */
.ewh-feature-video {
  width: 100%;
  max-width: 880px;
  margin: 50px auto 30px !important;
  padding: 0 20px;
  float: none !important;
  display: block;
}
.ewh-feature-video .video,
.ewh-feature-video .kjb-video-container {
  margin: 0;
  padding: 0;
}

/* === Learn More button — calmer rendering ============================
 * Sentence case, no shadow, no hover-lift. A slightly softer eagle teal
 * that reads as a brand accent rather than a primary CTA. */
.ewh-learn-more-row {
  margin: 32px auto 8px !important;
  width: 100%;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  text-align: center !important;
}
.ewh-learn-more,
a.ewh-learn-more {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  margin: 0 auto !important;
  padding: 13px 30px;
  background-color: #5DAFB6 !important;
  color: #ffffff !important;
  border: 1px solid #5DAFB6;
  border-radius: 4px;
  font-family: "Cabin", sans-serif;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0.2px;
  text-transform: none;
  text-decoration: none !important;
  cursor: pointer;
  box-shadow: none;
  transition: background-color 0.15s ease, border-color 0.15s ease;
}
.ewh-learn-more:hover,
.ewh-learn-more:focus,
a.ewh-learn-more:hover,
a.ewh-learn-more:focus {
  background-color: #4F9DA3 !important;
  border-color: #4F9DA3;
  color: #ffffff !important;
}

/* === Tighten the gap below the testimonials section so the page flows ====
 * The original Kajabi padding-bottom on the testimonials section is 250px on
 * desktop, which leaves a long pale band before the next section's colour
 * change. Bring it down to ~80px so the rhythm is uniform. */
#section-1642544317343 .sizer {
  padding-bottom: 80px !important;
}
@media (min-width: 768px) {
  #section-1642544317343 .sizer {
    padding-bottom: 80px !important;
  }
}

/* === About-page signup wrapper =========================================
 * Make sure the signup section reads as a full-width block above the footer
 * (stripping the col-12 float that was causing the footer to sit beside it). */
#ewh-course-signup-block {
  display: block;
  width: 100%;
  clear: both;
  float: none;
}

/* === Contact-page copy =================================================
 * Centers the email-us message vertically inside the col-5 block so it
 * reads balanced beside the practitioner photo on the left. Uses the same
 * Cabin/Chivo type stack as the rest of the site. */
#block-1682389681533 .block {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ewh-contact-copy {
  font-family: "Cabin", sans-serif;
  text-align: center;
  max-width: 460px;
  padding: 24px 16px;
  margin: 0 auto;
}
.ewh-contact-copy p {
  font-size: 18px;
  line-height: 1.7;
  color: #1f1f1f;
  margin: 0 0 16px;
}
.ewh-contact-copy p:last-child {
  margin-bottom: 0;
  color: #555;
}
.ewh-contact-copy a {
  color: #474747;
  font-weight: 700;
  text-decoration: underline;
  word-break: break-word;
}
.ewh-contact-copy a:hover,
.ewh-contact-copy a:focus {
  color: #2e91fc;
}
@media (max-width: 767px) {
  #block-1682389681533 .block {
    height: auto;
    padding: 32px 0;
  }
  .ewh-contact-copy p { font-size: 17px; }
}

/* ====================================================================
 * MOBILE & RESPONSIVE PASS
 * --------------------------------------------------------------------
 * All rules below are scoped to phone / tablet-portrait viewports
 * (max-width: 767px and max-width: 540px). The desktop layout is
 * untouched — these overrides exist only to fix mobile usability,
 * spacing, readability, and stacking issues.
 * ==================================================================== */

/* --- Tablet portrait + phone (≤ 767px) -------------------------------- */
@media (max-width: 767px) {

  /* 1. Hero + forest parallax windows.
   *    `background-attachment: fixed` is unreliable on iOS Safari, so we
   *    use `scroll` on mobile. We also reduce the window height — the
   *    desktop 470px reads too tall on a portrait phone — and use
   *    `background-size: cover` so the image fills the window cleanly. */
  #section-1642543175262,
  #section-1642544046811 {
    background-attachment: scroll !important;
    background-size: cover !important;
    background-position: center !important;
    height: 300px !important;
    min-height: 300px !important;
    max-height: 300px !important;
    overflow: hidden;
  }
  #section-1642543175262 > .section,
  #section-1642544046811 > .section,
  #section-1642543175262 .sizer,
  #section-1642544046811 .sizer {
    height: 300px !important;
    min-height: 300px !important;
    max-height: 300px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  /* 2. Single feature video tile — let it fill the column on mobile;
   *    the desktop col-8 + offset-2 reads as too narrow on a phone. */
  .ewh-feature-video {
    margin: 30px auto 20px !important;
    padding: 0 12px !important;
    max-width: 100%;
    /* Override the col-8 / offset-2 so it spans the column */
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 3. EAGLES WAY HEALING signup heading — keep the same family + weight
   *    but a touch smaller so a long word like "EAGLES" doesn't overflow
   *    on 320–375px viewports. Body copy stays readable. */
  #ewh-course-signup-block {
    margin: 32px auto !important;
    padding: 0 18px !important;
  }
  #ewh-course-signup-block .ewh-course-signup h2,
  .ewh-course-signup h2 {
    font-size: 26px !important;
    line-height: 1.25;
    letter-spacing: 0.4px;
  }
  #ewh-course-signup-block .ewh-course-signup p,
  .ewh-course-signup p {
    font-size: 16px !important;
    line-height: 1.6;
    margin-bottom: 14px !important;
  }

  /* 4. Sender form — keep it inside the column, never wider than the
   *    available width, and cap the input/button height so it reads as
   *    a calm static form rather than a corporate widget. */
  #ewh-course-signup-block .sender-form-field {
    max-width: 100% !important;
    width: 100%;
    margin: 18px auto 0 !important;
    padding: 0 !important;
  }
  .sender-form-field iframe,
  .sender-form-field form {
    max-width: 100% !important;
    width: 100% !important;
  }

  /* 5. Learn More button — full-width-ish hit area, slightly tighter
   *    padding so the button reads chunky but not enormous. */
  .ewh-learn-more-row { margin-top: 24px !important; }
  .ewh-learn-more,
  a.ewh-learn-more {
    padding: 13px 28px !important;
    font-size: 15px !important;
    letter-spacing: 0.4px !important;
  }

  /* 6. EAGLES WAY HEALING heading on the homepage hero band that sits
   *    between the two parallax windows. Reduce the over-large desktop
   *    heading on small screens. */
  #section-1642543855757 h2 {
    font-size: 28px !important;
    line-height: 1.25;
  }
  /* And the body paragraph beneath it gets a sensible line length. */
  #section-1642543855757 p {
    font-size: 16px;
    line-height: 1.6;
    padding-left: 8px;
    padding-right: 8px;
  }

  /* 7. About-page video tiles + healer cards. Theme stacks columns by
   *    default on mobile; we just make sure spacing isn't cramped and
   *    that cards don't sit shoulder-to-shoulder against the viewport. */
  .block-type--video,
  .block-type--card,
  .block-type--text,
  .block-type--image {
    margin-top: 14px !important;
    margin-bottom: 14px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
  }
  .ewh-feature-video .kjb-video-container,
  .ewh-feature-video .kjb-video-responsive {
    margin: 0 !important;
  }

  /* 8. Bottom-of-page testimonial section — closer rhythm on mobile. */
  #section-1642544317343 .sizer {
    padding-top: 30px !important;
    padding-bottom: 40px !important;
  }
  /* And drop the desktop section-1642544587855 padding to something
   * sensible on mobile so the signup doesn't sit flush against the
   * preceding row of testimonial avatars. */
  #section-1642544587855 .sizer {
    padding-top: 20px !important;
    padding-bottom: 30px !important;
  }

  /* 9. Contact page — let the photo + text columns stack at full width
   *    rather than try to squeeze the col-4 / col-5 split. The theme's
   *    own breakpoints already do most of the work; we just make sure
   *    the horizontal padding stays comfortable. */
  #block-1682394603702,
  #block-1683607772474,
  #block-1682389681533 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 12px !important;
  }
  #block-1682389681533 .block { padding: 24px 4px !important; }

  /* 10. Footer link list + social bar.
   *     Stack the link list comfortably; centre the social row; keep the
   *     icons one row but a touch smaller so three of them fit on a 320px
   *     screen with margin to breathe. */
  .footer .link-list,
  .footer .link-list__links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px 14px;
    padding: 0 8px;
  }
  .footer .link-list__link {
    font-size: 14px !important;
    margin: 4px 6px !important;
  }
  .ewh-social-bar {
    flex-direction: column;
    gap: 12px;
    padding: 16px 12px;
  }
  .ewh-social-bar__label {
    width: 100%;
    text-align: center;
    font-size: 16px;
  }
  .ewh-social-bar__icon {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }
  /* Footer copyright row */
  .footer .copyright {
    display: block;
    text-align: center;
    padding: 12px 16px 18px;
    font-size: 12px;
  }

  /* 11. Header / nav typography. The Kajabi default is 24px on mobile —
   *     fine, just a slight tightening so the two header links don't
   *     wrap awkwardly on the smallest phones. */
  .header__content--desktop .link-list__link,
  .header__content--mobile .link-list__link {
    font-size: 18px !important;
    margin: 6px 8px !important;
  }
  .header__block--logo .logo__image {
    max-width: 220px !important;
    width: auto !important;
    height: auto !important;
  }
}

/* --- Small phones (≤ 540px) ----------------------------------------- */
@media (max-width: 540px) {
  /* Tighter body copy padding so wrapped paragraphs don't kiss the edge */
  body, body main { font-size: 15px; }

  /* The feature video gets a little more breathing room */
  .ewh-feature-video {
    margin-top: 22px !important;
    margin-bottom: 14px !important;
  }

  /* EAGLES WAY HEALING signup — smallest phones get the most compact step */
  #ewh-course-signup-block .ewh-course-signup h2,
  .ewh-course-signup h2 {
    font-size: 24px !important;
  }
  /* Hero / forest windows can shrink a bit further on narrow phones */
  #section-1642543175262,
  #section-1642544046811,
  #section-1642543175262 > .section,
  #section-1642544046811 > .section,
  #section-1642543175262 .sizer,
  #section-1642544046811 .sizer {
    height: 260px !important;
    min-height: 260px !important;
    max-height: 260px !important;
  }
  /* Footer social icons even more compact on narrowest phones */
  .ewh-social-bar__icon {
    width: 40px;
    height: 40px;
    font-size: 16px;
  }
  /* Contact-page email link can break across lines on tiny phones */
  .ewh-contact-copy a { font-size: 16px; }
}

/* ============================================================
 * VISUAL-REFINEMENT PASS  — restrained polish, no redesign.
 * Each rule is keyed to an item from the designer review.
 * ============================================================ */

/* (#3) Hero photo grey wash removed.  The forest section never had
 *      one — equalising both for tonal consistency. */
#section-1642543175262 .section__overlay,
#section-1642544046811 .section__overlay {
  background-color: transparent !important;
}

/* (#2) Cream band between the two parallax windows: more breath top
 *      and bottom so the page reads as three quiet beats rather than
 *      two photos squashing the heading + paragraph. */
#section-1642543855757 .sizer {
  padding-top: 60px !important;
  padding-bottom: 70px !important;
}
@media (max-width: 767px) {
  #section-1642543855757 .sizer {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
  }
}

/* (#6) Outer signup heading slightly smaller — the inner Sender form
 *      already has its own "Free Healing Course" h2, so the outer block
 *      now reads as a soft introduction. */
#ewh-course-signup-block .ewh-course-signup h2,
.ewh-course-signup h2 {
  font-size: 24px !important;
  font-weight: 600 !important;
  letter-spacing: 0.3px !important;
}

/* (#7) Tighten the gap between the testimonial row and the signup band
 *      so the two healer-image areas read as one extended thought. */
#section-1642544317343 .sizer {
  padding-bottom: 40px !important;
}
@media (min-width: 768px) {
  #section-1642544317343 .sizer {
    padding-bottom: 40px !important;
  }
}

/* (#10) Wistia / play-button overlay: tinted to the eagle teal at
 *       30% opacity, with a clean white triangle. Lower-key than the
 *       previous solid-black box. */
.ewh-video-poster-wrap .ewh-video-play {
  background-color: rgba(80, 168, 176, 0.35) !important;
  border-radius: 50% !important;
  width: 64px !important;
  height: 64px !important;
}
.ewh-video-poster-wrap:hover .ewh-video-play,
.ewh-video-poster-wrap:focus .ewh-video-play {
  background-color: rgba(80, 168, 176, 0.55) !important;
  transform: translate(-50%, -50%) scale(1.04);
}
.ewh-video-poster-wrap .ewh-video-play::before {
  border-left: 16px solid #ffffff;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  margin-left: 4px;
}

/* (#11) Body copy bumped to 16px for more breath. Paragraphs everywhere
 *       inherit; existing 14px theme rules win where present, but our
 *       body baseline sets the relaxed tone. */
body, body main { font-size: 16px; line-height: 1.6; }

/* (#12) Lede paragraphs constrained to a comfortable measure (~56ch). */
#ewh-course-signup-block .ewh-course-signup p,
.ewh-course-signup p {
  max-width: 56ch !important;
  font-size: 17px !important;
  line-height: 1.65 !important;
}

/* (#13) Brand-colour threading: links / focus / social-icon hover all
 *       use the eagle teal so the page reads as one palette. */
main a:not([class]) {
  color: #5DAFB6;
}
main a:not([class]):hover,
main a:not([class]):focus {
  color: #4F9DA3;
}
.ewh-social-bar__icon:hover,
.ewh-social-bar__icon:focus {
  background-color: #5DAFB6 !important;
}
:focus-visible {
  outline: 2px solid #5DAFB6;
  outline-offset: 2px;
}
/* Recolour the contact-page email link to match the threaded teal. */
.ewh-contact-copy a {
  color: #4F9DA3;
}
.ewh-contact-copy a:hover,
.ewh-contact-copy a:focus {
  color: #3D8388;
}

/* (#14) Mary feature video: symmetric vertical margins. */
.ewh-feature-video {
  margin: 40px auto !important;
}

/* (#16) h3/h4 line-height bumped from theme default 1.2 → 1.3 so
 *       multi-line headings (e.g. "Experience the Power of Eagles
 *       Way Healing") breathe. */
h3, h4, .h3, .h4 { line-height: 1.3; }

/* (#17) Brand mark gets letter-spacing so the all-caps register breathes.
 *       Applied only to the hero brand-mark heading on the home page. */
#section-1642543855757 h2,
#section-1642543855757 h1 {
  letter-spacing: 0.08em;
}

/* (SEO #1) Visually-hidden H1 for crawler hierarchy without changing
 *           any rendered visual on the page. */
.ewh-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ============================================================
 * Healing Courses page
 * ============================================================
 * Informational layout only — no pricing, no checkout, no CTAs.
 * Visual register matches the rest of the site (Cabin/Chivo,
 * neutral palette, calm rhythm). Mirrors the .ewh-course-signup
 * spacing so the page reads as part of the same family. */
.ewh-courses-section {
  width: 100%;
  max-width: 1100px;
  margin: 0 auto;
  padding: 36px 24px;
  font-family: "Cabin", sans-serif;
  color: #333;
}
.ewh-courses-intro {
  padding-top: 60px;
  text-align: center;
  max-width: 720px;
}
.ewh-courses-title {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 32px;
  letter-spacing: 0.4px;
  color: #1f1f1f;
  margin: 0 0 24px;
}
.ewh-courses-lede {
  font-size: 17px;
  line-height: 1.65;
  margin: 0 auto 18px;
  max-width: 56ch;
}
.ewh-courses-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 28px;
  margin-top: 12px;
}
@media (min-width: 768px) {
  .ewh-courses-grid {
    grid-template-columns: 1fr 1fr;
    gap: 36px;
  }
}
.ewh-course-card {
  display: flex;
  flex-direction: column;
  background: #ffffff;
  border: 1px solid #ececec;
}
.ewh-course-card__media {
  width: 100%;
  aspect-ratio: 3 / 2;
  overflow: hidden;
  background: #f0f0f0;
}
.ewh-course-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.ewh-course-card__body {
  padding: 22px 24px 28px;
}
.ewh-course-card__title {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 22px;
  line-height: 1.3;
  letter-spacing: 0.2px;
  color: #1f1f1f;
  margin: 0 0 12px;
}
.ewh-course-card__lede {
  font-size: 16px;
  line-height: 1.6;
  margin: 0 0 12px;
  color: #444;
}
.ewh-course-card__body-text {
  font-size: 15.5px;
  line-height: 1.65;
  margin: 0;
  color: #555;
}
@media (max-width: 767px) {
  .ewh-courses-section { padding: 24px 16px; }
  .ewh-courses-intro   { padding-top: 36px; }
  .ewh-courses-title   { font-size: 26px; letter-spacing: 0.3px; }
  .ewh-courses-lede    { font-size: 16px; }
  .ewh-course-card__body { padding: 18px 18px 22px; }
  .ewh-course-card__title { font-size: 20px; }
  .ewh-course-card__lede,
  .ewh-course-card__body-text { font-size: 15px; }
}

/* === Header nav spacing — uniform across all pages ===================
 * Every page except index.html carried an inline Kajabi "Custom CSS" rule
 * that added 20px horizontal margin to each header link and underlined
 * them on hover. The homepage was missing those two rules, so its nav
 * tabs sat tighter than every other page. Moving them into the global
 * stylesheet makes the spacing identical on all pages and is the single
 * source of truth going forward. */
.header__content--desktop .link-list__link {
  margin-left: 20px !important;
  margin-right: 20px !important;
}
.header a.link-list__link:hover {
  text-decoration: underline !important;
}

/* ============================================================
 * LINKS PAGE  (links.html)
 * ============================================================
 * A dedicated, conversion-oriented page surfacing the three
 * channels in order of priority: social, podcast platforms, RSS.
 * Visual register matches the rest of the site (Cabin/Chivo,
 * eagle teal accent #5DAFB6, calm neutral palette) but adds a
 * soft earthy gradient in the hero and platform-card hover lifts
 * so the page reads as intentional and premium. */

.ewh-links-main {
  display: block;
  background: #f7f7f8;   /* same neutral cream as the rest of the site */
  padding-bottom: 60px;
}

/* ----- Hero ------------------------------------------------------------ */
/* Full-width photo banner (matches the original /booking page hero). */
.ewh-links-hero {
  position: relative;
  background: #f7f7f8;
  padding: 0;
}
.ewh-links-hero__inner {
  position: relative;
  width: 100%;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 80px 24px;
  box-sizing: border-box;
  overflow: hidden;
}
.ewh-links-hero__media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
  background: transparent;
}
.ewh-links-hero__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
/* Hero is image-only — no overlay text, no dark wash. */
@media (min-width: 768px) {
  .ewh-links-hero__inner { min-height: 470px; padding: 0; }
}
@media (max-width: 540px) {
  .ewh-links-hero__inner { min-height: 280px; padding: 0; }
}

/* Title band beneath the hero — matches the homepage cream-band pattern.
 * Sits flat on #f7f7f8 so the hero photo and the title read as two
 * separate beats. */
.ewh-links-titleband {
  background: #f7f7f8;
  padding: 60px 24px 40px;
  text-align: center;
}
.ewh-links-titleband__inner { max-width: 720px; margin: 0 auto; }
.ewh-links-titleband__title {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 42px;
  letter-spacing: 0.4px;
  color: #1f1f1f;
  margin: 0 0 16px;
}
.ewh-links-titleband__lede {
  font-family: "Cabin", sans-serif;
  font-size: 18px;
  line-height: 1.65;
  color: #555;
  margin: 0 auto;
  max-width: 560px;
}
@media (max-width: 540px) {
  .ewh-links-titleband { padding: 40px 18px 28px; }
  .ewh-links-titleband__title { font-size: 32px; }
  .ewh-links-titleband__lede  { font-size: 16px; }
}

/* Light-brown band: from the Follow Along section through the RSS section,
 * use the same #e4d6cd warm neutral the original Kajabi theme used on the
 * Course Collection + Success Stories sections (consistent with the rest
 * of the site). The footer keeps its own background untouched. */
.ewh-links-section--social,
.ewh-links-section--podcast,
.ewh-links-section--rss {
  background: #e4d6cd;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 24px !important;
  padding-right: 24px !important;
  padding-top: 60px;
  padding-bottom: 60px;
  box-sizing: border-box;
}
.ewh-links-section--social > .ewh-links-section__header,
.ewh-links-section--podcast > .ewh-links-section__header,
.ewh-links-section--rss > .ewh-links-section__header,
.ewh-links-section--social > .ewh-social-grid,
.ewh-links-section--podcast > .ewh-podcast-grid {
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}
.ewh-links-section--rss .ewh-rss-details {
  max-width: 700px;
  margin: 0 auto;
}
/* So the bottom of the brown band sits flush against the footer */
.ewh-links-section--rss { padding-bottom: 80px; }
.ewh-links-main { padding-bottom: 0; }


/* (the mid-page anchor sub-nav rule has been removed) */

/* ----- Section container ---------------------------------------------- */
.ewh-links-section {
  max-width: 980px;
  margin: 0 auto;
  padding: 60px 24px 20px;
  font-family: "Cabin", sans-serif;
}
.ewh-links-section__header {
  text-align: center;
  margin: 0 auto 32px;
  max-width: 560px;
}
.ewh-links-section__header h2 {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 28px;
  letter-spacing: 0.3px;
  margin: 0 0 10px;
  color: #1f1f1f;
}
.ewh-links-section__header p {
  font-size: 16px;
  line-height: 1.65;
  color: #555;
  margin: 0;
}

/* ----- Platform cards (shared) ---------------------------------------- */
.ewh-platform-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 22px;
  background: #ffffff;
  border: 1px solid #ececec;
  border-radius: 16px;
  text-decoration: none !important;
  color: #1f1f1f !important;
  transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease;
  overflow: hidden;
  isolation: isolate;
}
.ewh-platform-card:hover,
.ewh-platform-card:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px -12px rgba(31, 31, 31, 0.18);
  border-color: #d8d8d8;
}
.ewh-platform-card__icon {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #ffffff;
  background: #888;
}
.ewh-platform-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.ewh-platform-card__name {
  font-family: "Chivo", sans-serif;
  font-weight: 700;
  font-size: 16px;
  color: #1f1f1f;
}
.ewh-platform-card__cta {
  font-size: 13px;
  color: #6f6f6f;
}
.ewh-platform-card__arrow {
  flex: 0 0 auto;
  color: #b5b5b5;
  font-size: 14px;
  transition: transform 0.18s ease, color 0.18s ease;
}
.ewh-platform-card:hover .ewh-platform-card__arrow,
.ewh-platform-card:focus-visible .ewh-platform-card__arrow {
  transform: translateX(3px);
  color: #5DAFB6;
}

/* ----- Social section: larger cards, 3-up grid ----------------------- */
.ewh-social-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
@media (min-width: 720px) {
  .ewh-social-grid {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 18px;
  }
}
.ewh-platform-card--lg {
  padding: 24px 26px;
  border-radius: 18px;
  flex-direction: row;
}
.ewh-platform-card--lg .ewh-platform-card__icon {
  width: 56px;
  height: 56px;
  font-size: 26px;
  border-radius: 14px;
}
.ewh-platform-card--lg .ewh-platform-card__name {
  font-size: 18px;
}
.ewh-platform-card--lg .ewh-platform-card__cta {
  font-size: 14px;
  margin-top: 2px;
}

/* ----- Podcast grid (smaller, denser) ------------------------------- */
.ewh-podcast-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
}
@media (min-width: 480px) {
  .ewh-podcast-grid { grid-template-columns: 1fr 1fr; }
}
@media (min-width: 820px) {
  .ewh-podcast-grid { grid-template-columns: 1fr 1fr 1fr; }
}

/* ----- Per-platform icon backgrounds (subtle brand cues) ----------- */
.ewh-platform--instagram .ewh-platform-card__icon {
  background: linear-gradient(45deg, #f09433, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
}
.ewh-platform--youtube .ewh-platform-card__icon,
.ewh-platform--ytmusic .ewh-platform-card__icon { background: #FF0000; }
.ewh-platform--facebook .ewh-platform-card__icon { background: #1877F2; }
.ewh-platform--spotify .ewh-platform-card__icon { background: #1DB954; }
.ewh-platform--apple .ewh-platform-card__icon { background: #9933CC; }
.ewh-platform--amazon .ewh-platform-card__icon { background: #232F3E; }
.ewh-platform--pocketcasts .ewh-platform-card__icon { background: #F43E37; }
.ewh-platform--podcastaddict .ewh-platform-card__icon { background: #F4842C; }
.ewh-platform--iheart .ewh-platform-card__icon { background: #C6002B; }
.ewh-platform--castbox .ewh-platform-card__icon { background: #F55B23; }
.ewh-platform--goodpods .ewh-platform-card__icon { background: #FFD93D; color: #1f1f1f; }

/* ----- RSS section (tertiary, collapsible) ------------------------- */
.ewh-links-section--rss {
  max-width: 700px;
  padding-top: 24px;
}
.ewh-rss-details {
  background: #ffffff;
  border: 1px solid #ececec;
  border-radius: 14px;
  padding: 0;
  overflow: hidden;
  font-family: "Cabin", sans-serif;
}
.ewh-rss-details > summary {
  list-style: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 22px;
  font-size: 15px;
  color: #1f1f1f;
  transition: background-color 0.15s ease;
}
.ewh-rss-details > summary::-webkit-details-marker { display: none; }
.ewh-rss-details > summary:hover { background: #fafafa; }
.ewh-rss-summary__icon {
  width: 34px; height: 34px; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #f3a52d; color: #ffffff; font-size: 14px;
}
.ewh-rss-summary__title { flex: 1; font-weight: 600; letter-spacing: 0.2px; }
.ewh-rss-summary__chevron { color: #888; transition: transform 0.18s ease; }
.ewh-rss-details[open] .ewh-rss-summary__chevron { transform: rotate(180deg); }
.ewh-rss-body { padding: 0 22px 22px; color: #4a4a4a; }
.ewh-rss-body p {
  margin: 0 0 12px;
  font-size: 14px;
  line-height: 1.65;
  color: #6f6f6f;
}
.ewh-rss-row {
  display: flex;
  gap: 10px;
  align-items: stretch;
  flex-wrap: wrap;
}
.ewh-rss-row code {
  flex: 1 1 220px;
  min-width: 0;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 13px;
  padding: 10px 12px;
  background: #f4f4f5;
  border: 1px solid #e5e5e5;
  border-radius: 8px;
  color: #1f1f1f;
  word-break: break-all;
}
.ewh-rss-copy {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: #5DAFB6;
  color: #ffffff;
  border: 1px solid #5DAFB6;
  border-radius: 8px;
  font-family: "Cabin", sans-serif;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color 0.15s ease;
}
.ewh-rss-copy:hover, .ewh-rss-copy:focus { background: #4F9DA3; border-color: #4F9DA3; }

/* ----- Back-to-top button ------------------------------------------ */
.ewh-back-to-top {
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #5DAFB6;
  color: #ffffff;
  border: none;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 8px 18px -6px rgba(31, 31, 31, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 20;
  transition: background-color 0.15s ease, transform 0.18s ease;
}
.ewh-back-to-top:hover, .ewh-back-to-top:focus { background: #4F9DA3; transform: translateY(-2px); }
.ewh-back-to-top[hidden] { display: none; }

/* ----- Fade-in on load (progressive enhancement) ------------------- */
.ewh-js .ewh-links-hero,
.ewh-js .ewh-links-section {
  animation: ewh-fade-up 0.6s ease-out both;
}
.ewh-js .ewh-links-section { animation-delay: 0.05s; }
.ewh-js #listen { animation-delay: 0.10s; }
.ewh-js #rss { animation-delay: 0.15s; }
@keyframes ewh-fade-up {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .ewh-js .ewh-links-hero,
  .ewh-js .ewh-links-section { animation: none; }
}

/* ----- Mobile refinements ------------------------------------------ */
@media (max-width: 540px) {
  .ewh-links-hero { padding: 50px 18px 36px; }
  .ewh-links-hero__media { width: 144px; height: 144px; margin-bottom: 22px; }
  .ewh-links-hero__title { font-size: 32px; }
  .ewh-links-hero__lede { font-size: 16px; }
  
  .ewh-links-section { padding: 36px 16px 12px; }
  .ewh-links-section__header h2 { font-size: 24px; }
  .ewh-platform-card,
  .ewh-platform-card--lg { padding: 14px 16px; gap: 12px; }
  .ewh-platform-card--lg .ewh-platform-card__icon {
    width: 44px; height: 44px; font-size: 20px;
  }
  .ewh-platform-card--lg .ewh-platform-card__name { font-size: 16px; }
}