/* Responsive overrides for inline styles that block Vortala CSS media queries */
/* These use !important to override React inline styles at mobile breakpoints */

.latest-post-label {
  display: inline-block;
  margin-bottom: 18px;
  padding: 10px 18px;
  background: #f2f2f2;
  border: 1px solid #ddd;
  color: #555;
  font-family: Mulish, sans-serif;
  font-size: 15px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.family-focus-intro {
  display: flex;
  align-items: center;
  gap: 50px;
}

.family-focus-copy {
  flex: 0 0 430px;
}

.family-focus-hero-image {
  flex: 0 0 629px;
  max-width: 629px !important;
  min-width: 0;
  width: 629px !important;
  height: auto;
}

.family-focus-divider {
  clear: both;
  margin: 34px 0;
  border: 0;
  border-top: 1px dotted #bbb;
}

.family-focus-member {
  display: grid;
  grid-template-columns: 300px 1fr;
  align-items: center;
  gap: 70px;
}

.family-focus-member img {
  display: block;
  width: 300px;
  height: 300px;
  object-fit: cover;
}

.home div#containing_wrap #wrap::after {
  pointer-events: none;
}

.home-mobile-intro {
  display: none;
}

@media screen and (max-width: 1280px) {
  .home-mobile-intro {
    display: block;
    box-sizing: border-box;
    max-width: 620px;
    margin: 28px auto 42px;
    color: #333;
    font-family: Mulish, muli, sans-serif;
  }

  .home-mobile-intro h1 {
    margin: 0 0 16px;
    font-family: "Playfair Display", playfair_display, Georgia, serif;
    font-size: clamp(34px, 6.8vw, 56px);
    font-weight: 900;
    line-height: 1.08;
  }

  .home-mobile-intro h2 {
    margin: 0 0 18px;
    font-family: "Playfair Display", playfair_display, Georgia, serif;
    font-size: clamp(24px, 4.2vw, 34px);
    font-weight: 900;
    line-height: 1.18;
  }

  .home-mobile-intro p {
    margin: 0;
    font-size: 18px;
    line-height: 1.5;
  }

  .home-mobile-intro + h2.h1 {
    margin-top: 0;
  }
}

@media screen and (min-width: 961px) and (max-width: 1280px) {
  .home #header_wrap {
    height: auto !important;
    padding: 20px 0 !important;
    background: #eee !important;
  }

  .home #header_wrap::before {
    content: none !important;
    display: none !important;
  }

  .home #header_wrap .n-a-p {
    display: none !important;
  }

  .home #logo {
    float: none !important;
    max-width: 100%;
    margin: 10px auto !important;
    text-align: center;
    position: relative;
  }

  .home #premium_wrap {
    margin: 0 auto;
    padding: 0;
  }

  .home #premium_wrap .mobile-only {
    display: block !important;
  }

  .home .premium_content {
    box-sizing: border-box;
    max-width: 660px !important;
    margin: 0 auto;
    padding: 30px 15px !important;
  }

  .home .premium_content > img.mobile-only {
    width: min(100%, 620px) !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  .home .premium_content p {
    max-width: 620px;
  }

  .home .premium_side_banners {
    max-width: 660px;
    margin: 0 auto;
    text-align: center;
  }

  .home .bsides {
    float: none !important;
    display: inline-block;
    vertical-align: top;
    width: calc(45% - 20px) !important;
    height: auto;
    margin: 10px !important;
  }

  .home .bsides img {
    max-width: 100% !important;
    margin: 0 !important;
  }
}

@media screen and (max-width: 600px) {
  .home-mobile-intro {
    margin: 24px auto 36px;
  }

  .home-mobile-intro h1 {
    font-size: 32px;
  }

  .home-mobile-intro h2 {
    font-size: 21px;
  }

  .home-mobile-intro p {
    font-size: 16px;
  }
}

/* WordPress uses size-full for original image size; Tailwind's .size-full would stretch it. */
.entry-content img.size-full {
  width: auto !important;
  height: auto !important;
}

.page-meet-our-team .entry-content img.wp-image-5650,
.page-meet-our-team .entry-content img.wp-image-5649,
.page-meet-our-team .entry-content img.wp-image-5648,
.page-meet-our-team .entry-content img.wp-image-4352,
.page-meet-our-team .entry-content img.wp-image-4346,
.page-meet-our-team .entry-content img.wp-image-5530,
.page-meet-our-team .entry-content img.wp-image-5527 {
  width: 325px !important;
  height: 325px !important;
  max-width: 100% !important;
  box-sizing: content-box;
}

#post-363 #wp_flex_gallery {
  width: min(425px, calc(100vw - 111px)) !important;
  max-width: min(425px, calc(100vw - 111px)) !important;
}

#post-363 #wp_flex_gallery img.post-image {
  width: 100% !important;
  height: auto !important;
}

/* Homepage hero: line-level backing appears only at desktop widths where copy overlaps the photo. */
@media screen and (min-width: 961px) and (max-width: 1500px) {
  .home #header_wrap .hero-text-pill {
    padding: 0.02em 0.12em 0.05em;
    border: 1px solid rgba(255, 255, 255, 0.72);
    border-radius: 8px;
    background: rgba(255, 255, 255, 0.74);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
  }

  .home #header_wrap .n-a-p p .hero-text-pill {
    background: rgba(255, 255, 255, 0.68);
  }
}

.event-promo-banner {
  position: relative;
  z-index: 8000;
  box-sizing: border-box;
  padding: 10px 40px 10px 20px;
  background: #fff;
  color: #d81468;
  font-family: Mulish, muli, sans-serif;
  font-size: 20px;
  line-height: 1.2;
  text-align: center;
}

@media screen and (min-width: 961px) {
  .event-promo-banner {
    min-height: 43px;
    padding-top: 7px;
    padding-bottom: 8px;
  }
}

body.banner-active .nav-utility.sticky-top {
  position: relative;
}

body.banner-active #containing_wrap {
  margin-top: 0;
}

.event-promo-message {
  display: inline;
  max-width: calc(100% - 44px);
  min-width: 0;
}

.event-promo-primary {
  display: inline;
  min-width: 0;
}

.event-promo-icon {
  display: inline-flex;
  align-items: flex-end;
  gap: 2px;
  margin-right: 8px;
  color: #d81468;
  font-size: 25px;
  line-height: 1;
  vertical-align: -0.15em;
}

.event-promo-icon i {
  line-height: 1;
}

.event-promo-icon-secondary {
  color: #f2a5c8;
  font-size: 0.9em;
}

.event-promo-primary strong {
  min-width: 0;
}

.event-promo-title,
.event-promo-tail strong {
  font-weight: 700;
}

.event-promo-tail {
  display: inline-block;
  white-space: nowrap;
}

.event-promo-message a,
.event-promo-message a:visited {
  color: #d81468 !important;
  text-decoration: none;
}

.event-promo-link {
  display: inline-block;
  padding: 0 15px;
  font-weight: 700;
  white-space: nowrap;
}

.event-promo-close {
  position: absolute;
  top: 6px;
  right: 20px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #d81468;
  font: 700 28px/1 Mulish, sans-serif;
  cursor: pointer;
}

.blog_subscribe_form {
  text-align: center;
}

.blog_subscribe_form .blog-subscribe-open.button,
.blog-subscribe-modal-form .blog-subscribe-submit.button {
  display: block;
  width: min(calc(100% - 40px), 690px);
  margin: 0 auto;
  border: 0;
  border-radius: 6px;
  background: #ff850b !important;
  color: #fff !important;
  font-family: Mulish, muli, sans-serif;
  font-size: 18px;
  font-weight: 900;
  line-height: 1.2;
  padding: 17px 28px;
  text-align: center;
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color 0.15s ease;
}

.blog_subscribe_form .blog-subscribe-open.button:hover,
.blog_subscribe_form .blog-subscribe-open.button:focus,
.blog-subscribe-modal-form .blog-subscribe-submit.button:hover,
.blog-subscribe-modal-form .blog-subscribe-submit.button:focus {
  background: #e9651f !important;
}

.blog-subscribe-modal-form .blog-subscribe-submit.button:disabled {
  cursor: wait;
  opacity: 0.72;
}

.blog-subscribe-modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 9000;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 24px;
  background: rgba(0, 0, 0, 0.62);
}

.blog-subscribe-modal {
  position: relative;
  box-sizing: border-box;
  width: min(100%, 520px);
  padding: 28px 30px 30px;
  border: 8px solid rgba(225, 225, 225, 0.55);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.32);
  color: #333;
  font-family: Mulish, muli, sans-serif;
  text-align: left;
}

.blog-subscribe-modal h2 {
  margin: 0 42px 22px 0;
  color: #333;
  font-family: Mulish, muli, sans-serif;
  font-size: 28px;
  font-weight: 900;
  line-height: 1.2;
}

.blog-subscribe-modal-close {
  position: absolute;
  top: 9px;
  right: 14px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #d81468;
  font: 700 32px/1 Mulish, sans-serif;
  cursor: pointer;
}

.blog-subscribe-modal-close:hover,
.blog-subscribe-modal-close:focus {
  color: #9d104b;
}

.blog-subscribe-modal-form .field {
  margin-bottom: 14px;
}

.blog-subscribe-modal-form label {
  color: #333;
  font-family: Mulish, muli, sans-serif;
  font-weight: 700;
}

.blog-subscribe-modal-form input[type='text'],
.blog-subscribe-modal-form input[type='email'],
.blog-subscribe-modal-form input[type='tel'] {
  box-sizing: border-box;
  width: 100%;
  min-height: 52px;
  border: 1px solid #d6d6d6;
  border-radius: 6px;
  color: #333;
  font-family: Mulish, muli, sans-serif;
  font-size: 18px;
  padding: 12px 16px;
}

.blog-subscribe-error,
.blog-subscribe-success {
  margin: 0 0 14px;
  border-radius: 6px;
  font-size: 15px;
  line-height: 1.35;
  padding: 10px 12px;
}

.blog-subscribe-error {
  background: #fff1f1;
  color: #9f1d1d;
}

.blog-subscribe-success {
  background: #eef8ec;
  color: #1b6f2a;
}

.blog-entry-photo.blog-video-entry-photo a {
  position: relative;
  display: block;
  overflow: hidden;
  background: #f2f2f2;
}

.blog-entry-photo.blog-video-entry-photo .blog-image {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.blog-video-play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.18);
  pointer-events: none;
}

.blog-video-play::before {
  content: "";
  width: 62px;
  height: 62px;
  border: 5px solid rgba(255, 255, 255, 0.9);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.3);
  box-shadow: 0 1px 8px rgba(0, 0, 0, 0.2);
}

.blog-video-play::after {
  content: "";
  position: absolute;
  margin-left: 6px;
  width: 0;
  height: 0;
  border-top: 16px solid transparent;
  border-bottom: 16px solid transparent;
  border-left: 24px solid rgba(255, 255, 255, 0.95);
}

.community-talks-check-heading,
.partner-check-heading {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.community-talks-check-heading svg,
.partner-check-heading svg {
  flex: 0 0 auto;
  margin-top: 0.1em;
  color: #d81368;
}

.community-talks-check-heading span,
.partner-check-heading span {
  min-width: 0;
}

.page-partner-with-us .partner-with-us-image {
  float: right;
  width: 425px !important;
  height: 425px !important;
  max-width: 46% !important;
  margin: 0 0 32px 52px !important;
  border-radius: 50%;
  object-fit: cover;
  box-sizing: border-box;
}

.page-partner-with-us .co21 {
  max-width: 560px;
  margin: 28px 0 42px;
}

.page-partner-with-us .partner-check-heading {
  clear: none;
}

.page-partner-with-us .nb51 {
  clear: both;
  margin-top: 36px;
  padding: 34px 42px;
}

.page-partner-with-us .nb51 .bldr_cta {
  margin-top: 20px;
}

.page-bring-a-friend-day .bring-friend-image {
  width: 350px !important;
  height: 350px !important;
  max-width: 40% !important;
  border-radius: 50%;
  object-fit: cover;
  box-sizing: border-box;
}

@media screen and (max-width: 600px) {
  .page-meet-our-team .entry-content img.wp-image-5650,
  .page-meet-our-team .entry-content img.wp-image-5649,
  .page-meet-our-team .entry-content img.wp-image-5648,
  .page-meet-our-team .entry-content img.wp-image-4352,
  .page-meet-our-team .entry-content img.wp-image-4346,
  .page-meet-our-team .entry-content img.wp-image-5530,
  .page-meet-our-team .entry-content img.wp-image-5527 {
    width: min(325px, calc(100vw - 50px)) !important;
    height: auto !important;
  }
}

/* Gallery containers: inline maxWidth: 425px overflows on phones */
@media screen and (max-width: 600px) {
  .event-promo-banner {
    min-height: 89px;
    padding: 9px 46px;
    font-size: 16px;
    text-align: center;
  }

  .event-promo-message {
    display: inline;
    max-width: none;
    text-align: center;
  }

  .event-promo-primary {
    display: inline;
    max-width: 100%;
  }

  .event-promo-icon {
    font-size: 25px;
  }

  .event-promo-primary strong {
    line-height: 1.25;
    text-align: center;
  }

  .event-promo-link {
    margin-left: 0;
    padding: 0 8px;
  }

  .community-talks-check-heading,
  .partner-check-heading {
    gap: 9px;
  }

  .community-talks-check-heading svg,
  .partner-check-heading svg {
    width: 32px;
    height: 32px;
  }

  .page-partner-with-us .partner-with-us-image,
  .page-bring-a-friend-day .bring-friend-image {
    float: none !important;
    display: block !important;
    width: min(100%, 350px) !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 auto 24px !important;
  }

  .page-partner-with-us .co21 {
    max-width: none;
  }

  .page-partner-with-us .nb51 {
    padding: 24px 20px;
  }

  .wp_flex_gallery {
    max-width: 100% !important;
    max-height: none !important;
    float: none !important;
    margin: 0 auto 20px !important;
  }

  /* Float wrappers around galleries */
  .entry-content > div[style*="float"] {
    float: none !important;
    width: 100% !important;
  }

  /* Doctor images on bio pages */
  .entry-content img[style*="float"] {
    float: none !important;
    display: block !important;
    margin: 0 auto 20px !important;
    max-width: 80% !important;
    width: auto !important;
  }

  .entry-content img.alignleft.rounded,
  .entry-content img.alignright.rounded {
    float: none !important;
    display: block !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 auto 20px !important;
    box-sizing: border-box;
  }

  .entry-content .column.one_half,
  .entry-content .column.one_third,
  .entry-content .column.two_thirds,
  .entry-content .column.one_fourth,
  .entry-content .column.three_fourths {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  .entry-content h3 > .fa-li {
    position: static !important;
    display: inline-block !important;
    width: auto !important;
    margin-right: 10px !important;
  }

  /* Footer Google Maps: 730px height is excessive on mobile */
  #map {
    height: 350px !important;
  }

  /* Techniques comparison table: 500px wide overflows 375px viewport */
  .tech-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
  }

  /* Footer schema div: overflows 10px on every page */
  .footer_schema,
  .footer_schema > div {
    max-width: 100% !important;
    overflow: hidden;
    box-sizing: border-box;
  }

  /* Blog first post overflow fix */
  .blogposts .post {
    overflow: hidden;
    max-width: 100%;
  }
  .blogposts .blog-entry-photo,
  .blogposts .blog-post-info {
    max-width: 100%;
    overflow: hidden;
  }
  .blogposts .more-link,
  .blogposts .entry-date {
    display: inline-block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Tab labels overflow: meet-the-doctors and new-patient-center */
  .nav-tabs:not(.service-nav-tabs) {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 2px;
    max-width: 100%;
  }
  .nav-tabs:not(.service-nav-tabs) label {
    font-size: 12px !important;
    padding: 8px 6px !important;
    white-space: nowrap;
    flex: 1 1 auto;
    text-align: center;
    min-width: 0;
  }

  .family-focus-intro {
    display: flex;
    flex-direction: column;
    gap: 18px;
  }

  .family-focus-hero-image {
    order: -1;
    flex: 0 1 auto;
    max-width: 100% !important;
    width: 100% !important;
  }

  .family-focus-member {
    display: block;
  }

  .family-focus-member img {
    margin: 0 auto 20px !important;
    max-width: 300px !important;
    width: 100% !important;
    height: auto;
  }
}

/* Tablet adjustments */
@media screen and (max-width: 768px) {
  #map {
    height: 450px !important;
  }

  .entry-content .column.one_half,
  .entry-content .column.one_third,
  .entry-content .column.two_thirds,
  .entry-content .column.one_fourth,
  .entry-content .column.three_fourths {
    max-width: 100% !important;
    margin-right: 0 !important;
    box-sizing: border-box;
  }

  .tech-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* Footer: keep stacked tablet/mobile layout centered and align office hours. */
@media screen and (max-width: 960px) {
  li#text-6 {
    box-sizing: border-box;
    padding: 46px 24px 54px !important;
  }

  li#text-6 .textwidget {
    max-width: 760px;
    margin: 0 auto;
    text-align: center;
  }

  li#text-6 .column.one_third,
  li#text-6 .column.one_third.last {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 30px !important;
    text-align: center !important;
  }

  li#text-6 .column.one_third > a {
    display: block;
    text-align: center;
  }

  li#text-6 img {
    display: block !important;
    width: min(78vw, 345px) !important;
    height: auto !important;
    margin: 0 auto 22px !important;
  }

  li#text-6 h3,
  li#text-6 h3.p-text,
  li#text-6 .p-text {
    text-align: center !important;
  }

  li#text-6 .office_hours_full {
    width: min(100%, 560px) !important;
    margin: 6px auto 0 !important;
    text-align: left;
  }

  li#text-6 .office_hours_full .fullRow {
    display: grid !important;
    grid-template-columns: 74px minmax(128px, 1fr) minmax(128px, 1fr);
    column-gap: 26px;
    align-items: center;
    width: 100% !important;
    min-height: 44px;
    height: auto !important;
    float: none !important;
    clear: both;
    text-align: left !important;
  }

  li#text-6 .office_hours_full .fullRow > div {
    width: auto !important;
    height: auto !important;
    float: none !important;
    padding: 0 !important;
    text-align: left !important;
  }

  li#text-6 .office_hours_full .headerRow {
    min-height: 34px;
  }

  li#text-6 .office_hours_full .headerRow > div {
    font-weight: 900;
  }

  li#text-6 .office_hours_full .partHoursJointCol {
    grid-column: 2 / span 2;
    justify-self: start;
  }
}

@media screen and (max-width: 460px) {
  li#text-6 {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  li#text-6 .office_hours_full .fullRow {
    grid-template-columns: 54px minmax(104px, 1fr) minmax(104px, 1fr);
    column-gap: 12px;
  }
}

/* Homepage services: keep the original circle language, with a better narrow layout. */
#banner-5975 section {
  scroll-margin-top: 24px;
}

.service-mobile-dropdown {
  display: none;
}

@media screen and (max-width: 960px) {
  div#banner-5975 .tabbed-content {
    display: block !important;
  }

  div#banner-5975 .service-nav-tabs {
    --service-circle-size: clamp(118px, 28vw, 220px);
    --service-circle-gap: clamp(8px, 2.5vw, 22px);
    display: grid !important;
    grid-template-columns: repeat(3, var(--service-circle-size));
    grid-template-areas:
      "prenatal . pediatric"
      ". chiro ."
      "massage . laser";
    gap: var(--service-circle-gap);
    justify-content: center;
    justify-items: center;
    align-items: center;
    width: 100% !important;
    max-width: 720px !important;
    margin: 0 auto 34px;
    padding-bottom: 0 !important;
  }

  div#banner-5975 .service-nav-tabs input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
  }

  div#banner-5975 .service-nav-tabs label {
    width: var(--service-circle-size) !important;
    height: var(--service-circle-size) !important;
    min-height: 0;
    aspect-ratio: 1;
    border-radius: 50% !important;
    padding: 10px !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    line-height: 1.18 !important;
  }

  div#banner-5975 .service-nav-tabs label strong {
    font-size: clamp(16px, 4.2vw, 30px) !important;
    line-height: 1.05 !important;
  }

  div#banner-5975 .service-nav-tabs label:nth-of-type(1) {
    grid-area: chiro;
  }

  div#banner-5975 .service-nav-tabs label:nth-of-type(2) {
    grid-area: prenatal;
  }

  div#banner-5975 .service-nav-tabs label:nth-of-type(3) {
    grid-area: pediatric;
    margin: 0 !important;
  }

  div#banner-5975 .service-nav-tabs label:nth-of-type(4) {
    grid-area: massage;
  }

  div#banner-5975 .service-nav-tabs label:nth-of-type(5) {
    grid-area: laser;
  }

  div#banner-5975 .service-desktop-panel {
    display: none !important;
  }

  div#banner-5975 .service-mobile-dropdown {
    display: block;
    max-width: 720px;
    margin: 0 auto;
    padding-top: 8px;
    text-align: left;
  }

  div#banner-5975 .service-mobile-dropdown h2 {
    margin-top: 0;
  }

  div#banner-5975 .service-mobile-dropdown h2 {
    font-size: clamp(34px, 8vw, 58px) !important;
    line-height: 1.08 !important;
  }
}

@media screen and (max-width: 600px) {
  div#banner-5975 .service-nav-tabs {
    --service-circle-size: min(74vw, 292px);
    display: grid !important;
    grid-template-columns: var(--service-circle-size);
    grid-template-areas:
      "chiro"
      "prenatal"
      "pediatric"
      "massage"
      "laser";
    gap: 24px;
    max-width: 100% !important;
    margin-bottom: 34px;
  }

  div#banner-5975 .service-nav-tabs label strong {
    font-size: clamp(30px, 9vw, 46px) !important;
  }
}

/* About Us / New Patient Center: the .overlap-wrap heading box uses position:relative; top:-70px
   to overlap the bottom of the image on desktop (intentional). On mobile the image is short, so the
   -70px pull collides the "Regulating Your Body's Function" heading onto the image edge. Neutralize the
   upward pull on small screens so the heading sits cleanly below the image. Desktop (>768px) is untouched. */
@media screen and (max-width: 768px) {
  .overlap-wrap {
    top: 0;
    margin-top: 12px;
  }
}