.wpcf7 {max-width:100%;}
@media (max-width: 768px) {
  .reverse-mobile {
    display: flex;
    flex-direction: column-reverse;
  }
}
@media(min-width: 1024px) { /* desktop only */
    .sticky-product {
        position: sticky;
        top: 100px; /* adjust distance from top */
    }
/* Make WooCommerce single product image smaller and elegant */
.woocommerce div.product div.images img {
    width: 60%; /* adjust size: try 60%, 70%, or 80% */
    margin: 0 auto;
    display: block;
    border-radius: 12px; /* soft rounded corners */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); /* subtle depth */
}

/* Center image container and reduce spacing */
.woocommerce div.product div.images {
    text-align: center;
    margin-bottom: 2rem;
}

/* If gallery thumbnails look off, make them smaller too */
.woocommerce div.product div.thumbnails img {
    width: 70px;
    height: auto;
    border-radius: 8px;
}
/* === Clay Rose Top Banner (WhatsApp + Email only) === */
.header-t.desktop {
  background-color: #568EBF !important;  /* Blue */
  color: #FAF9F6 !important;             /* Warm White text */
}

/* Text and links inside the top banner */
.header-t.desktop a {
  color: #FAF9F6 !important;
  text-decoration: none !important;
  transition: color 0.3s ease;
}

/* Hover effect for soft warmth */
.header-t.desktop a:hover {
  color: #EDE8E0 !important;  /* Sage Beige hover */
}
/* === Top Banner Icons: White with Beige Hover === */
.header-t.desktop i,
.header-t.desktop svg {
  color: #FAF9F6 !important;  /* Warm White */
  fill: #FAF9F6 !important;
  transition: color 0.3s ease, fill 0.3s ease;
}

.header-t.desktop i:hover,
.header-t.desktop svg:hover {
  color: #EDE8E0 !important;  /* Sage Beige hover */
  fill: #EDE8E0 !important;
}
	/* Force PHONE + EMAIL icons to be light on the Clay Rose top bar */
.header-t.desktop .fa,
.header-t.desktop .fas,
.header-t.desktop .far,
.header-t.desktop .fal,
.header-t.desktop .fab,
.header-t.desktop .dashicons,
.header-t.desktop [class*="fa-"],
.header-t.desktop .icon,
.header-t.desktop .icon-phone,
.header-t.desktop .icon-envelope,
.header-t.desktop .fa-phone,
.header-t.desktop .fa-phone-alt,
.header-t.desktop .fa-whatsapp,
.header-t.desktop .fa-envelope,
.header-t.desktop .fa-envelope-open {
  color: #FAF9F6 !important;   /* Warm White */
}

/* If the theme uses pseudo-elements for those icons */
.header-t.desktop .fa-phone:before,
.header-t.desktop .fa-envelope:before,
.header-t.desktop .icon-phone:before,
.header-t.desktop .icon-envelope:before {
  color: #FAF9F6 !important;
}

/* If the icons are inline SVGs */
.header-t.desktop svg,
.header-t.desktop svg *,
.header-t.desktop .contact-item svg,
.header-t.desktop .contact-item svg * {
  fill: #FAF9F6 !important;
  stroke: #FAF9F6 !important;
}

/* Optional: ensure link color around icons stays light too */
.header-t.desktop a {
  color: #FAF9F6 !important;
}
/* ========== MAIN HEADER (NOT the top banner) ========== */
.main-header.desktop {
  background: #FAF9F6; /* Warm White */
  border-bottom: 1px solid #EDE8E0; /* Sage Beige */
  padding: 12px 0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.04);
}

/* Logo sizing */
.main-header.desktop .custom-logo-link img {
  max-height: 56px;
  transition: max-height .25s ease;
}

/* Constrain width + side padding */
.main-header.desktop .container,
.main-header.desktop .inner-wrap {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* Primary nav links */
.main-header.desktop .main-navigation a {
  color: #3C7451; /* Deep Forest Green */
  font-weight: 500;
  letter-spacing: .3px;
  text-decoration: none;
  position: relative;
  transition: color .2s ease;
}

/* Spacing between menu items */
.main-header.desktop .main-navigation .menu > li {
  margin: 0 18px;
}

/* Hover/active color + animated underline */
.main-header.desktop .main-navigation a:hover,
.main-header.desktop .main-navigation .current-menu-item > a {
  color: #568EBF; /* Calm Blue */
}
.main-header.desktop .main-navigation a::after {
  content: "";
  position: absolute;
  left: 0; bottom: -6px;
  width: 0; height: 2px;
  background: #568EBF; /* Calm Blue */
  transition: width .25s ease;
}
.main-header.desktop .main-navigation a:hover::after,
.main-header.desktop .main-navigation .current-menu-item > a::after {
  width: 100%;
}

/* Header CTA button (right) */
.main-header.desktop .header-button a {
  background: #568EBF;   /* Calm Blue */
  color: #FFFFFF;
  padding: 10px 18px;
  border-radius: 8px;
  font-weight: 600;
  text-decoration: none !important;
  transition: background .2s ease, transform .05s ease;
}
.main-header.desktop .header-button a:hover {
  background: #3C7451; /* Forest Green */
}
.main-header.desktop .header-button a:active {
  transform: translateY(1px);
}

/* Dropdown menus */
.main-header.desktop .main-navigation .sub-menu {
  background: #FAF9F6; /* Warm White */
  border: 1px solid #EDE8E0;
}
.main-header.desktop .main-navigation .sub-menu a {
  color: #3C7451;
}
.main-header.desktop .main-navigation .sub-menu a:hover {
  color: #568EBF;
}

/* ========== STICKY HEADER ========== */
.sticky-header .main-header.desktop {
  box-shadow: 0 8px 16px rgba(0,0,0,0.08);
  padding: 8px 0;
}
.sticky-header .main-header.desktop .custom-logo-link img {
  max-height: 46px;
}

/* ========== MOBILE MENU ========== */
.mobile-menu .menu-toggle,
.mobile-menu .menu-toggle .bar {
  color: #3C7451; /* hamburger color */
  fill: #3C7451;
  transition: color .2s ease;
}
.mobile-menu .menu-toggle:hover { color: #568EBF; }

.mobile-menu .menu-wrapper {
  background: #FAF9F6; /* panel background */
  border-top: 1px solid #EDE8E0;
}
.mobile-menu .menu-wrapper a {
  color: #3C7451;
  font-weight: 500;
}
.mobile-menu .menu-wrapper a:hover {
  color: #568EBF;
}

/* Optional: tighten vertical spacing on very small screens */
@media (max-width: 480px) {
  .main-header.desktop { padding: 10px 0; }
  .main-header.desktop .custom-logo-link img { max-height: 48px; }
}
/* Center logo + tagline stack in header */
.site-branding {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  width: 100%;
}

.site-branding .site-logo {
  margin: 0 auto;
}

.site-branding .site-title,
.site-branding .site-description {
  margin: 0;
  text-align: center;
}
/* === Tagline color & typography === */
.site-description {
  color: #2C2C2C !important;   /* Forest Green for readability */
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: 0.3px;
  font-weight: 400;
}
/* === Make the Header Menu Font Bolder === */
.main-header.desktop .main-navigation a,
.main-header .menu a,
.header-menu a,
.navbar a {
  font-weight: 700 !important;  /* try 700 if you want more emphasis */
  font-family: 'Nunito Sans', sans-serif;
  letter-spacing: 0.3px;
  text-transform: none;
}
/* === Dropdown Menu Hover / Active Color Fix === */
.main-header.desktop .main-navigation .sub-menu a:hover,
.main-header.desktop .main-navigation .sub-menu li:hover > a,
.main-header.desktop .main-navigation .sub-menu .current-menu-item > a {
  background-color: #B9806B !important;  /* Clay Rose background */
  color: #FAF9F6 !important;              /* Warm White text */
}

/* Optional: add a slight transition for smoothness */
.main-header.desktop .main-navigation .sub-menu a {
  transition: background-color 0.25s ease, color 0.25s ease;
}
/* === Remove dash / strikethrough from main menu items === */
.main-header.desktop .main-navigation a::before,
.main-header.desktop .main-navigation a::after {
  content: none !important; /* removes the line element the theme adds */
}

/* === Clean, elegant hover underline === */
.main-header.desktop .main-navigation a {
  position: relative;
  color: #3C7451; /* Forest Green */
  text-decoration: none;
  transition: color 0.3s ease;
}

.main-header.desktop .main-navigation a:hover,
.main-header.desktop .main-navigation .current-menu-item > a {
  color: #568EBF; /* Calm Blue on hover */
}

.main-header.desktop .main-navigation a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -5px;
  width: 0;
  height: 2px;
  background-color: #568EBF; /* Calm Blue underline */
  transition: width 0.3s ease;
}

.main-header.desktop .main-navigation a:hover::after,
.main-header.desktop .main-navigation .current-menu-item > a::after {
  width: 100%;
}
/* === Final Aikya About Section Layout === */
#text-10.widget_text .textwidget {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 40px;
  flex-wrap: wrap;
  text-align: left !important;
}

/* Left: text */
#text-10.widget_text .about-text {
  flex: 1 1 50%;
  max-width: 50%;
  order: 1;
}

/* Right: video */
#text-10.widget_text .about-video {
  flex: 1 1 45%;
  max-width: 45%;
  order: 2;
}

/* Keep video full width inside its column */
#text-10.widget_text .about-video iframe,
#text-10.widget_text .about-video video {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: 8px;
}

/* Responsive */
@media (max-width: 768px) {
  #text-10.widget_text .textwidget {
    flex-direction: column;
    text-align: center !important;
  }

  #text-10.widget_text .about-text,
  #text-10.widget_text .about-video {
    max-width: 100%;
  }
Featured Image Opacity on pages
}
.page-header::before,
.single-page-header::before,
.post-header::before {
    background-color: transparent !important;
    opacity: 0 !important;
}
/* Move hero banner text to bottom */
.banner-caption {
  position: absolute;
  bottom: 6%;     /* adjust up/down (0–10%) */
  top: auto;
  transform: none;
  text-align: center;   /* or left/right if you prefer */
  width: 100%;
}

.banner-caption .banner-content {
  background: rgba(0, 0, 0, 0.35); /* optional soft overlay for contrast */
  padding: 20px 30px;
  border-radius: 10px;
  display: inline-block;
}
/* Move the hero banner CTA button lower */
.banner-wrap .banner-link {
  position: relative;
  top: 250px; /* adjust this value — higher number moves it further down */
}

/* Optional: adjust for mobile so it doesn’t get too close to the bottom edge */
@media (max-width: 768px) {
  .banner-wrap .banner-link {
    top: 20px;
  }
}
/* Move banner CTA button to right side */
.banner-wrap .banner-link {
  position: absolute;
  right: 10%;     /* distance from right edge – adjust value */
  top: 60%;       /* distance from top – tweak to sit nicely on image */
  transform: translateY(-50%);
}
/* Move only the main banner title lower */
.banner-wrap .banner-title {
  position: absolute !important;
  bottom: 6% !important;   /* lower number = closer to edge, try 6% if you want it really low */
  top: auto !important;
  left: 10%;                /* adjust to 15% or 20% if you want it more centered */
  transform: none !important;
  text-align: center;         /* or center if you prefer */
  z-index: 3;
  width: 80%;               /* ensures it doesn’t wrap weirdly */
}

/* Ensure the whole banner area allows absolute positioning */
.banner-wrap {
  position: relative;
}
/* --- Force hover effect for CTA button --- */
.banner-wrap .banner-link:hover,
.banner-wrap a.banner-link:hover,
.banner-wrap .banner-link:focus {
  background-color: #3c7451 !important;  /* your Aikya green */
  color: #ffffff !important;              /* white text */
  border-color: #ffffff !important;       /* border matches background */
  transition: all 0.3s ease !important;
  text-decoration: none !important;
}
/* Fix default Gutenberg form field text + background */
.wp-block-contact-form input,
.wp-block-contact-form textarea,
.wp-block-jetpack-contact-form input,
.wp-block-jetpack-contact-form textarea,
.wp-block-form input,
.wp-block-form textarea {
    color: #000 !important;
    background-color: #fff !important;
    border-color: #333 !important;
}

.wp-block-form input::placeholder,
.wp-block-form textarea::placeholder {
    color: #777 !important;
}

/* Make ALL Jetpack / Gutenberg checkboxes visible and clickable */
input[type="checkbox"].wp-block-jetpack-option,
input[type="checkbox"].grunion-field {
  appearance: checkbox !important;
  -webkit-appearance: checkbox !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  position: relative !important;
  z-index: 1000 !important;
  accent-color: #111 !important; /* visible tick */
}

/* Make their text labels visible and clickable */
input[type="checkbox"].wp-block-jetpack-option + label,
input[type="checkbox"].grunion-field + label,
label[for^="g9062-iunderstand"] {
  color: #111 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}
/* Hide original Jetpack heading More Podcast */
.jp-relatedposts-headline {
    visibility: hidden;
    position: relative;
}

/* Insert new heading */
.jp-relatedposts-headline::after {
    content: "More Reflections";
    visibility: visible;
    position: absolute;
    left: 0;
    top: 0;
    font-style: normal;
}