/*
Theme Name: Betheme Child
Theme URI: https://themes.muffingroup.com/betheme
Author: Muffin group
Author URI: https://muffingroup.com
Description: Child Theme for Betheme
Template: betheme
Version: 2.0.2
*/

/* ============================================
   Always Health Centre - Design System
   Base: 8px grid | Scale: 1.250 (Major Third)
   Primary: #00682d | Dark text: #1a1a1a
   ============================================ */

/* --- Hero Section Overlay for Text Readability --- */
/* Injected real DOM element via JS — CSS pseudo-elements unreliable inside SR7 custom elements */
.ah-hero-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    background: linear-gradient(
        to bottom,
        rgba(0, 35, 18, 0.62) 0%,
        rgba(0, 35, 18, 0.52) 35%,
        rgba(0, 35, 18, 0.48) 60%,
        rgba(0, 35, 18, 0.40) 80%,
        rgba(0, 35, 18, 0.25) 100%
    ) !important;
    z-index: 1 !important;
    pointer-events: none !important;
}

/* --- RevSlider Text Shadow for extra readability --- */
sr7-module .rs-layer {
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45), 0 0 12px rgba(0, 0, 0, 0.2) !important;
}



/* ============================================
   Always Health Centre - Service Pages Design System
   ============================================ */
.elementor-widget-text-editor h6 {
    color: #1a1a1a !important;
    font-weight: 700 !important;
    font-size: 16px !important;
    letter-spacing: 1.5px !important;
}

/* Fix: Ensure all body text has sufficient contrast */
.elementor-widget-text-editor p {
    color: #333333 !important;
    line-height: 1.7 !important;
}

/* Exception: Middle green card (febd70b) keeps white text */
.elementor-element-febd70b .elementor-widget-text-editor h6,
.elementor-element-febd70b .elementor-widget-text-editor p,
.elementor-element-febd70b .elementor-widget-text-editor h4 {
    color: #ffffff !important;
}

/* --- Spacing Fixes --- */

/* Fix: "Advanced Therapeutic Solutions" title too close to image below */
.elementor-element-ec3c93f {
    margin-bottom: 40px !important;
}

/* General section spacing - 8px grid system */
.elementor-section {
    /* Ensure minimum padding between sections */
}

/* Fix: Heading-to-content spacing */
.elementor-widget-text-editor + .elementor-widget-image,
.elementor-widget-heading + .elementor-widget-image {
    margin-top: 32px !important;
}

/* --- Button Contrast Fixes --- */

/* Ensure button borders have good contrast */
.elementor-widget-button .elementor-button {
    border-color: #1a3c34 !important;
    color: #1a3c34 !important;
    transition: all 0.3s ease !important;
}

.elementor-widget-button .elementor-button:hover {
    background-color: #00682d !important;
    border-color: #00682d !important;
    color: #ffffff !important;
}

/* --- Sticky Header Logo Visibility --- */
#Top_bar.is-sticky .logo img {
    /* White logo on green sticky header - already good */
}


/* ===== APPENDED 2026-06-11: Service Page Design System ===== */
/* ============================================
   Always Health Centre — Service Page Design System
   画眼计划 DOS: 8px grid | 1.250 Major Third | Recipe B (Professional Trust)
   Primary #00682d | Emphasis #00574f | Text #1a1a1a / #333
   Scope: .page-id-325 (Physiotherapy) + reusable .ah-* service classes
   ============================================ */

/* ---- Eyebrow / Pretitle (13px, 0.1em, uppercase) ---- */
.ah-eyebrow{
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:.1em !important;
  text-transform:uppercase !important;
  color:#00682d !important;
  margin:0 0 8px !important;
  line-height:1.5 !important;
}
.ah-eyebrow-light{ color:#9fd9b8 !important; }

/* ---- Headings bound to modular scale ---- */
.ah-h2{
  font-size:31px !important;        /* page main headline — was 39, lowered for harmony */
  font-weight:700 !important;
  line-height:1.25 !important;
  letter-spacing:-.01em !important;
  color:#1a1a1a !important;
  margin:0 0 16px !important;
  max-width:20ch;
}
.ah-h3{
  font-size:25px !important;        /* section titles — was 31, lowered for harmony (25→20→16 = 1.25 chain) */
  font-weight:600 !important;
  line-height:1.4 !important;
  letter-spacing:-.005em !important;
  color:#1a1a1a !important;
  margin:0 0 12px !important;
}
/* Lead paragraph — bridges title(25) → body(16) at 20px so adjacent ratio stays 1.25 */
.ah-lead p:first-child,
.ah-readable.ah-lead-text{
  font-size:20px !important;
  line-height:1.6 !important;
  color:#2a2a2a !important;
  font-weight:400 !important;
}
.ah-h3-light{ color:#ffffff !important; }
.ah-center{ text-align:center !important; }

/* ---- Body copy ---- */
.page-id-325 .elementor-widget-text-editor p{
  font-size:16px !important;
  line-height:1.7 !important;
  color:#333333 !important;
}
.ah-lead p{ font-size:16px !important; }
.ah-readable{ max-width:65ch; margin-left:auto !important; margin-right:auto !important; }

/* ---- Section heads ---- */
.ah-sec-head{ max-width:760px; margin:0 auto !important; }
.ah-sec-head .ah-readable{ margin-top:8px !important; }

/* ---- Intro image ---- */
.ah-rounded-img img{
  border-radius:12px !important;
  box-shadow:0 10px 15px rgba(0,0,0,.1) !important;
  width:100% !important;
  object-fit:cover !important;
}
.ah-intro-col-text{ padding-right:32px !important; }

/* ---- Treatment cards (4-col grid) ---- */
.ah-card{
  background:#ffffff !important;
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  padding:32px !important;
  height:100% !important;
  transition:transform .3s cubic-bezier(.25,.46,.45,.94), box-shadow .3s cubic-bezier(.25,.46,.45,.94) !important;
  border-top:3px solid #00682d !important;
}
.ah-card:hover{
  transform:translateY(-4px) !important;
  box-shadow:0 10px 25px rgba(0,0,0,.1) !important;
}
.ah-card-title{
  font-size:20px !important;        /* --text-lg / H6 scale */
  font-weight:600 !important;
  line-height:1.35 !important;
  color:#1a1a1a !important;
  margin:0 0 12px !important;
}
.ah-card-text{ font-size:16px !important; line-height:1.7 !important; color:#333 !important; margin:0 !important; }
.ah-grid-col{ padding:0 12px !important; margin-bottom:24px !important; }

/* ---- Checklist (conditions / why) ---- */
.ah-check{ list-style:none !important; margin:0 !important; padding:0 !important; }
.ah-check li{
  position:relative !important;
  padding:0 0 0 36px !important;
  margin:0 0 16px !important;
  font-size:16px !important;
  line-height:1.6 !important;
  color:#333 !important;
}
.ah-check li:before{
  content:"" !important;
  position:absolute !important;
  left:0 !important; top:2px !important;
  width:20px !important; height:20px !important;
  border-radius:9999px !important;
  background:#00682d !important;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/></svg>") center/14px no-repeat !important;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path fill='white' d='M9 16.17 4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/></svg>") center/14px no-repeat !important;
}
.ah-check-light li{ color:#eaf4ee !important; }
.ah-check-light li:before{ background:#9fd9b8 !important; }
.ah-cond-col{ padding:0 16px !important; }

/* ---- Feature cards (insurance) ---- */
.ah-feature{
  background:#f3f8f5 !important;
  border-radius:12px !important;
  padding:40px !important;
  height:100% !important;
  border-left:4px solid #00682d !important;
}
.ah-feature-title{
  font-size:20px !important;
  font-weight:600 !important;
  line-height:1.35 !important;
  color:#1a1a1a !important;
  margin:0 0 12px !important;
}
.ah-feat-col{ padding:0 16px !important; }

/* ---- Why-choose emphasis band (green) ---- */
.ah-sec-why .ah-why-inner{ max-width:880px; margin:0 auto !important; }
.ah-why-grid{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:16px 32px !important;
  max-width:720px !important;
  margin:32px auto 0 !important;
  text-align:left !important;
}
.ah-why-foot{ color:#cfe8da !important; font-size:16px !important; margin-top:32px !important; max-width:60ch; margin-left:auto; margin-right:auto; }

/* ---- Responsive ---- */
@media (max-width:1024px){
  .ah-why-grid{ grid-template-columns:1fr 1fr !important; }
}
@media (max-width:767px){
  .ah-h2{ font-size:31px !important; }
  .ah-h3{ font-size:25px !important; }
  .ah-intro-col-text{ padding-right:0 !important; }
  .ah-why-grid{ grid-template-columns:1fr !important; gap:16px !important; }
  .ah-card{ padding:24px !important; }
  .ah-feature{ padding:24px !important; }
}
@media (prefers-reduced-motion: reduce){
  .ah-card{ transition-duration:.01ms !important; }
}

/* Physio intro image — robust page-scoped target (css_classes key unreliable) */
.page-id-325 .ah-intro-col-img .elementor-widget-image img{
  border-radius:12px !important;
  box-shadow:0 10px 15px rgba(0,0,0,.1) !important;
  width:100% !important;
}

/* Physio green band — fix eyebrow contrast + closing line breathing room */
.ah-sec-why .ah-eyebrow-light{ color:#b9e6cc !important; }   /* raise contrast on dark green */
.ah-sec-why .ah-why-foot{ margin-bottom:0 !important; padding-top:8px !important; }
.ah-sec-why .ah-why-inner{ padding:8px 0 !important; }

/* Physio body weight + lead bridge — robust page-scoped (widget css_classes unreliable) */
.page-id-325 .elementor-widget-text-editor p{ font-size:16px !important; font-weight:400 !important; color:#333 !important; line-height:1.7 !important; }
/* First intro paragraph acts as 20px lead, bridging 25px title -> 16px body */
.page-id-325 .ah-intro-col-text .elementor-widget-text-editor:nth-of-type(2) p:first-child{
  font-size:20px !important; line-height:1.6 !important; color:#2a2a2a !important;
}

/* ============================================================
   HOME PAGE (post 67) typography refinement
   Apply approved service-page modular scale; tame oversized
   serif headings + lift tiny body/card text. CSS-only, scoped.
   ============================================================ */
/* Big serif section headings: 60px -> 39px (text-3xl), smoother ramp */
.page-id-67 .elementor-widget-text-editor h3,
.page-id-67 .elementor-widget-heading h3{
  font-size:39px !important;
  line-height:1.25 !important;
  font-weight:600 !important;
  letter-spacing:-.01em !important;
  word-break:normal !important;
}
/* H2 (icons/section) keep moderate */
.page-id-67 .elementor-widget-text-editor h2{
  font-size:31px !important;
  line-height:1.3 !important;
}
/* H4 used as lead/intro + service card titles: 24px -> bring into scale */
.page-id-67 .elementor-widget-text-editor h4{
  font-size:25px !important;
  line-height:1.4 !important;
  font-weight:600 !important;
}
/* Eyebrow labels (H6) keep readable */
.page-id-67 .elementor-widget-text-editor h6{
  font-size:13px !important;
  letter-spacing:.14em !important;
  line-height:1.5 !important;
}
/* Body text: lift to 16px / comfortable line-height */
.page-id-67 .elementor-widget-text-editor p,
.page-id-67 .elementor-widget-text-editor li{
  font-size:16px !important;
  line-height:1.7 !important;
}
/* Responsive: scale down big headings on mobile */
@media(max-width:767px){
  .page-id-67 .elementor-widget-text-editor h3,
  .page-id-67 .elementor-widget-heading h3{ font-size:31px !important; }
  .page-id-67 .elementor-widget-text-editor h2{ font-size:25px !important; }
  .page-id-67 .elementor-widget-text-editor h4{ font-size:20px !important; }
}

/* Home: the "Range of Services" intro sentence is mis-marked as <h4>.
   Render it as a readable lead paragraph, not a heading. */
.page-id-67 .elementor-element-ce23db0 h4{
  font-size:20px !important;
  line-height:1.6 !important;
  font-weight:400 !important;
  font-family:"DM Sans",sans-serif !important;
  color:#243b35 !important;
  max-width:62ch;
  margin-left:auto; margin-right:auto;
}

/* Specialized Treatments section: reduce description text size and weight */
.page-id-67 .elementor-element-6a3e2f1 h4,
.page-id-67 .elementor-element-6a3e2f1 .elementor-widget-text-editor h4,
.page-id-67 .elementor-element-6a3e2f1 .elementor-heading-title{
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.7 !important;
}

/* Custom Orthotics section: same treatment */
.page-id-67 .elementor-element-7b8c3d2 h4,
.page-id-67 .elementor-element-7b8c3d2 .elementor-widget-text-editor h4,
.page-id-67 .elementor-element-7b8c3d2 .elementor-heading-title{
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.7 !important;
}

/* Generic: all H4 descriptions in Specialized Treatments section */
.page-id-67 .elementor-widget-text-editor h4{
  font-size:16px !important;
  font-weight:400 !important;
  line-height:1.7 !important;
}

/* ============================================
   DROPDOWN MEGA MENU — BeTheme Split Menu override
   Horizontal multi-column layout, aligned to container
   Updated: Max | 2026-06-22
   ============================================ */

/* Ensure header container provides positioning context */
#Top_bar,
#Header{
  position:relative;
}

/* Menu wrapper: limit width to container and center */
#menu{
  position:relative;
  max-width:1580px;
  margin:0 auto;
}

/* Parent li: static positioning so submenu positions relative to #menu */
#menu .menu-item-has-children,
.menu-main-menu .menu-item-has-children{
  position:static !important;
}

/* Submenu container — horizontal mega menu style */
#menu .sub-menu,
.menu-main-menu .sub-menu,
#menu .menu-item-has-children .sub-menu{
  display:none !important;
  position:absolute !important;
  top:100% !important;
  left:0 !important;
  right:auto !important;
  min-width:720px !important;
  background:#fff !important;
  border-radius:12px !important;
  box-shadow:0 12px 40px rgba(0,40,30,0.12) !important;
  padding:24px 32px !important;
  margin:0 !important;
  list-style:none !important;
  z-index:9999 !important;
  grid-template-columns:repeat(3, 1fr) !important;
  gap:8px 24px !important;
  transform:none !important;
  box-sizing:border-box !important;
}

/* Show on hover */
#menu .menu-item-has-children:hover > .sub-menu,
.menu-main-menu .menu-item-has-children:hover > .sub-menu,
#menu .menu-item-has-children:hover > .sub-menu{
  display:grid !important;
}

/* Submenu items — horizontal card style */
#menu .sub-menu li,
.menu-main-menu .sub-menu li{
  padding:0;
  margin:0;
  border:none;
}

#menu .sub-menu li a,
.menu-main-menu .sub-menu li a{
  display:block;
  padding:12px 16px;
  color:#1a1a1a !important;
  font-size:14px;
  font-weight:500;
  text-decoration:none;
  border-radius:8px;
  transition:background .2s ease, color .2s ease;
  white-space:nowrap;
}

/* Hover state — mint green bg */
#menu .sub-menu li a:hover,
.menu-main-menu .sub-menu li a:hover{
  background:#e6f4ef;
  color:#00682d !important;
}

/* Active/current page */
#menu .sub-menu li.current-menu-item a,
.menu-main-menu .sub-menu li.current-menu-item a{
  color:#00682d !important;
  font-weight:600;
  background:#e6f4ef;
}

/* Small arrow indicator on parent */
#menu .menu-item-has-children > a::after,
.menu-main-menu .menu-item-has-children > a::after{
  content:" ▾";
  font-size:10px;
  margin-left:4px;
  opacity:0.6;
}

/* Responsive: stack to single column on mobile */
@media(max-width:767px){
  #menu .sub-menu,
  .menu-main-menu .sub-menu{
    min-width:280px;
    grid-template-columns:1fr;
  }
}

/* ============================================================
   Insurance Coverage page (post 57): "Most Treatments Covered"
   Card styling — matches homepage card appearance
   (border, gap, radius, emoji size) while keeping descriptions
   ============================================================ */

/* Card columns: add gap, border, radius, padding */
.elementor-57 .elementor-element-s2_c1 .elementor-widget-wrap,
.elementor-57 .elementor-element-s2_c2 .elementor-widget-wrap,
.elementor-57 .elementor-element-s2_c3 .elementor-widget-wrap{
  margin:0 15px !important;
  border:1px solid #1a3c34 !important;
  border-radius:15px !important;
  padding:35px 30px !important;
}

/* Emoji icons: scale up to match homepage (31px) */
.elementor-57 .elementor-element-s2_c1_emoji img,
.elementor-57 .elementor-element-s2_c2_emoji img,
.elementor-57 .elementor-element-s2_c3_emoji img{
  width:31px !important;
  height:31px !important;
}

/* Card column titles: H6 eyebrow style — keep 13px but ensure consistent weight */
.elementor-57 .elementor-element-s2_c1_content h6,
.elementor-57 .elementor-element-s2_c2_content h6,
.elementor-57 .elementor-element-s2_c3_content h6{
  font-size:13px !important;
  font-weight:600 !important;
  letter-spacing:.16em !important;
  text-transform:uppercase !important;
  color:#00574F !important;
  margin:0 0 12px !important;
  line-height:1.4 !important;
}

/* Card subtitle: H4 — keep at 20px for readability with description */
.elementor-57 .elementor-element-s2_c1_content h4,
.elementor-57 .elementor-element-s2_c2_content h4,
.elementor-57 .elementor-element-s2_c3_content h4{
  font-size:20px !important;
  font-weight:500 !important;
  line-height:1.4 !important;
  color:#1a3c34 !important;
  margin:0 0 16px !important;
}

/* Description paragraph inside cards */
.elementor-57 .elementor-element-s2_c1_content p,
.elementor-57 .elementor-element-s2_c2_content p,
.elementor-57 .elementor-element-s2_c3_content p{
  font-size:15px !important;
  line-height:1.7 !important;
  color:#5d726b !important;
  margin:0 0 20px !important;
}

/* CTA buttons on cards: ensure consistent styling */
.elementor-57 .elementor-element-s2_c1_btn .elementor-button,
.elementor-57 .elementor-element-s2_c2_btn .elementor-button,
.elementor-57 .elementor-element-s2_c3_btn .elementor-button{
  border-radius:6px !important;
  font-weight:600 !important;
  font-size:16px !important;
}

/* ============================================================
   Insurance Coverage page (post 57): Middle card (s2_c2)
   Dark green background — force ALL text to white for contrast
   ============================================================ */

/* Middle card container: white text override */
.elementor-57 .elementor-element-s2_c2 .elementor-widget-wrap,
.elementor-57 .elementor-element-s2_c2 .elementor-widget-wrap *{
  color:#ffffff !important;
}

/* Middle card H6 eyebrow: white */
.elementor-57 .elementor-element-s2_c2_content h6{
  color:#ffffff !important;
}

/* Middle card H4 subtitle: white */
.elementor-57 .elementor-element-s2_c2_content h4{
  color:#ffffff !important;
}

/* Middle card description paragraph: white */
.elementor-57 .elementor-element-s2_c2_content p{
  color:#ffffff !important;
}

/* Middle card CTA button: white text + white border */
.elementor-57 .elementor-element-s2_c2_btn .elementor-button{
  color:#ffffff !important;
  border-color:#ffffff !important;
  background-color:transparent !important;
}
.elementor-57 .elementor-element-s2_c2_btn .elementor-button:hover{
  background-color:#ffffff !important;
  color:#1a3c34 !important;
}