/* ==========================================================================
   PIXIE MEDIA CSS - UNIFIED RESPONSIVE STYLESHEET
   Standard Breakpoints: 1919px, 1599px, 1439px, 1365px, 1279px, 1023px, 767px, 639px, 479px, 359px
   ========================================================================== */

/* ==========================================================================
   1919px
   ========================================================================== */
@media (max-width:1919px) {
    .custom-container { padding: 0px 130px; }
    .common-section { padding: 90px 0px; }
    .common-top-section { padding-top: 90px; }
    .common-bottom-section { padding-bottom: 90px; }

    .the-power-section .right-box .border-img {width: 85%;}
    .wellness-journey-section .content-box {left: 12%;}
    .common-blog-box .content-box h6 {font-size: 20px;}
    .common-blog-box {padding: 20px;}
	.common-blog-box .content-box h6 {height: 90px}
}

/* ==========================================================================
   1599px
   ========================================================================== */
@media (max-width:1599px) {
    .custom-container { padding: 0px 100px; }
    .common-section { padding: 85px 0px; }
    .common-top-section { padding-top: 85px; }
    .common-bottom-section { padding-bottom: 85px; }

    .empower-section .common-flex-box .left-box {padding: 40px 60px;}
    .empower-section .right-box .bottom-box .common-box {padding: 40px 0px 0px;gap: 30px;  width: 45%;}
    .pricing-section .common-grid .common-box h3 {font-size: 34px;}
    .title-box h2 {  font-size: 42px;}
    .stroy-section .right-box {padding: 70px;}
    .marquee-item {font-size: 30px;}
    .wellness-journey-section .content-box {left: 13%;}
    .wellness-journey-section .content-box h2 {font-size: 44px;}
    .client-say-section .item {padding: 30px;  gap: 20px;}
    .client-say-section .item p {font-size: 22px;}
    .client-say-section .item .client-box {padding: 10px;}
    .client-say-section .item svg {height: auto; width: 60px;}
    .title-box h2 {font-size: 40px;}


}

/* ==========================================================================
   1439px
   ========================================================================== */
@media (max-width:1439px) {
    .custom-container { padding: 0px 70px; }
    .common-section { padding: 80px 0px; }
    .common-top-section { padding-top: 80px; }
    .common-bottom-section { padding-bottom: 80px; }

    /* Header Nav Spacing */
/*    header .center-box .header-menu ul li a { padding: 30px 0px; }*/

    /* Banner sections across all pages */
    .banner-section .left-box { padding: 55px 35px 55px 60px; }
    .banner-section .title-box h1 { font-size: 52px; }
    .consultation-section .title-box h2 { font-size: 52px; }

    /* Arched Card Padding adjustments */
    .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { padding: 30px; }

    /* Contact Page */
    .contact-page .contact-form-section .common-flex-box { gap: 40px; }
    .contact-page .contact-img-box { max-width: 400px; padding: 55px 35px; }
    .contact-page .contact-img-box .border-circle { width: 260px; height: 330px; }
    .contact-page .contact-info-section { padding: 75px 0; }
    .contact-page .faq-section { padding: 80px 0 90px 0; }
    .contact-page .faq-grid { gap: 50px; }
    .our-services .common-box .top-box .icon-box h5 {font-size: 34px;}
    .our-services .common-box .top-box .icon-box svg {width: 70px;height: auto;}
    .title-box h2 {  font-size: 40px;}
    .step-process-section .common-box .img-box {width: 300px;height: 300px;}
    .step-process-section .common-box {gap: 30px;}

    .empower-section .right-box .bottom-box .common-box svg{width: 70px; height: auto;}
    .empower-section .right-box .bottom-box .common-box {gap: 20px;padding: 30px 0px 0px;}
    .pricing-section .common-grid .common-box h3 {font-size: 32px;}
    .pricing-section .common-grid .common-box span {font-size: 20px;}
    .marquee-item {font-size: 28px;}
    .wellness-journey-section .content-box {left: 14%;}
    .wellness-journey-section .content-box h2 {font-size: 42px;}
    .background-video {height: 600px;}
     .client-say-section .item .client-box span {font-size: 22px;}
     .client-say-section .item .client-box img {  width: 60px;}
     .client-say-section .item p {font-size: 20px; }
     .client-say-section .item.box p {height: 230px;}
     .client-say-section .owl-carousel {margin-bottom: 25px;}
     .common-blog-box .content-box h6   {height: 90px;}
	
}

/* ==========================================================================
   1365px
   ========================================================================== */
@media (max-width:1365px) {
    .custom-container { padding: 0px 50px; }
    .common-section { padding: 60px 0px; }
    .common-top-section { padding-top: 75px; }
    .common-bottom-section { padding-bottom: 75px; }
    .common-grid { gap: 28px; }
    header .common-grid { grid-template-columns: 140px auto 200px; }
    header .center-box .header-menu ul { gap: 24px; }
    header .center-box .header-menu ul li a { font-size: 17px; }
    .power-of-regulation-section .common-grid { grid-template-columns: 460px 1fr; gap: 30px; }
    .contact-page .contact-form-section .common-flex-box { gap: 30px; }
    .contact-page .contact-img-box { max-width: 360px; padding: 45px 30px; }
    .contact-page .contact-info-grid { grid-template-columns: auto; gap: 30px; }
    .contact-page .faq-grid { gap: 40px; }

    .banner-section .title-box h1 {font-size: 46px;}
    .banner-section .title-box span {margin-bottom: 20px;}
    .banner-section .title-box {width: 100%;}
    .our-services .common-box .top-box .icon-box h5 {font-size: 30px;}
    .our-services .common-box {gap: 50px;}
    .wellness-journey-section .content-box {left: 15%;}
    .wellness-journey-section .play-pause-btn {width: 80px;height: 80px;}
    .wellness-journey-section .content-box {left: 15.8%;}
    .wellness-journey-section .content-box h2 {font-size: 40px;width: 51%;}
}

/* ==========================================================================
   1279px (Desktop-to-Tablet Navigation Boundary)
   ========================================================================== */
@media (max-width:1279px) {
    header a { padding: 0; }
    .custom-container { padding: 0px 40px; }
    .common-section { padding: 75px 0px; }
    .common-top-section { padding-top: 75px; }
    .common-bottom-section { padding-bottom: 75px; }

    /* Header & Navigation Architecture */
    header { padding: 14px 0px; position: relative; z-index: 1000; }
    header .header { position: static; }
    body.menu-open header { position: fixed; top: 0; left: 0; right: 0; width: 100%; z-index: 10000; }
    header .right-box { display: none; }
    header .logo-box a img, header .log-box a img { width: 95px; max-width: 100%; height: auto; }
    header .center-box { display: flex; align-items: center; }

    /* Hamburger Menu Button */
    .menu-box { display: flex; flex-direction: column; justify-content: center; cursor: pointer; z-index: 10001; padding: 8px 0; outline: none; }
    .menu-box a { display: block; outline: none; }
    .menu-box span { height: 3px; width: 30px; background: #333333; display: block; margin-bottom: 6px; border-radius: 2px; transition: all 0.3s ease; }
    .menu-box span:last-child { margin-bottom: 0; }

    /* Hamburger to X Animation */
    .menu-open .menu-box a span:first-child { transform: translateY(9px) rotate(45deg); background: #855E38; }
    .menu-open .menu-box a span:nth-child(2) { opacity: 0; transform: scaleX(0); }
    .menu-open .menu-box a span:last-of-type { transform: translateY(-9px) rotate(-45deg); background: #855E38; }
    body.menu-open { overflow: hidden; }

    /* Mobile Navigation Drawer */
    header .center-box .inner-box { position: absolute; top: 100%; left: 0; right: 0; width: 100%; height: 100vh; max-height: calc(100vh - 100%); background-color: #212529; z-index: 9999; overflow-y: auto; -webkit-overflow-scrolling: touch; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(-10px); transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease; padding: 16px 0 24px; box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35); }
    .menu-open header .center-box .inner-box { opacity: 1; visibility: visible; pointer-events: auto; transform: translateY(0); }
    header .center-box nav.header-menu { display: block; width: 100%; }
    header .center-box .header-menu ul { display: flex; flex-direction: column; width: 100%; gap: 0; padding: 0; margin: 0; }
    header .center-box .header-menu ul li { display: block; width: 100%; }
    header .center-box .header-menu ul li a { display: block; color: #FFFFFF; padding: 14px 30px; font-size: 18px; font-weight: 500; text-align: left; border-bottom: 1px solid rgba(255, 255, 255, 0.08); transition: all 0.25s ease; }
    header .center-box .header-menu ul li a:after { content: none; }
    header .center-box .header-menu ul li a:hover, header .center-box .header-menu ul li a.active { color: #B78D61; background: rgba(255, 255, 255, 0.04); padding-left: 36px; }
    header .center-box .header-menu ul li a.common-btn { display: inline-flex; margin: 20px 30px 0; width: auto; max-width: calc(100% - 60px); border-bottom: none; background-color: #855E38; color: #FFFFFF; border-radius: 12px; padding: 12px 24px; text-align: center; }
    header .center-box .header-menu ul li a.common-btn:hover { background-color: #956A3F; padding-left: 24px; color: #FFFFFF; }

    /* Submenu / Dropdown Support */
    header .center-box .header-menu ul li.dropdown.open .dropdown-menu { display: block; opacity: 1; position: relative; left: 0; width: 100%; max-width: 100%; padding-left: 25px; background: transparent; }
    .dropdown-menu { display: none; }
    header .center-box .header-menu ul li a.dropdown-toggle { display: flex; justify-content: space-between; }

    /* Banner across pages */
    .banner-section .left-box { padding: 50px 35px 50px 45px; }
    .banner-section .title-box { width: 90%; }
    .banner-section .title-box h1 { font-size: 46px; }
    .title-box h2 { font-size: 42px; }

    /* Services cards at 1279px: 2 columns */
    .our-services .common-grid { grid-template-columns: repeat(3, 1fr); gap: 25px; }
/*    .our-services .common-box:last-child { grid-column: span 2; max-width: 520px; margin: 0 auto; width: 100%; }*/
    .our-services .common-box { padding: 25px; gap: 30px; }
    .our-services .common-box .top-box .icon-box h5 { font-size: 34px; }

    /* Pricing Section at 1279px */
   /* .pricing-section .common-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; }
    .pricing-section .common-grid .common-box.book-appoinment { grid-column: span 2; max-width: 520px; margin: 0 auto; width: 100%; }
*/
.pricing-section .common-grid {gap: 25px;}

    /* Power of regulation section */
    .power-of-regulation-section .common-grid { grid-template-columns: 420px 1fr; gap: 30px; }
    .power-of-regulation-section .left-box img { max-width: 100%; height: auto; }

    /* Services page items */
    .services-page .services-item .title-box h2 { font-size: 40px; }
    .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { padding: 30px; }

    /* Contact Page */
    .contact-page .contact-form-section .left-box { width: 40%; }
    .contact-page .contact-form-section .right-box { width: 60%; }
    .contact-page .contact-img-box { max-width: 350px; padding: 45px 25px; }
    .contact-page .contact-info-grid { gap: 30px; }
    .contact-page .faq-grid { grid-template-columns: 40% 1fr; gap: 35px; }
/*    .contact-page .faq-left .title-box h2 { font-size: 38px; }*/
    .banner-section .title-box h1 {font-size: 34px;}
    .banner-section .left-box {width: 54%;}
    .title-box span {padding: 6px 20px;font-size: 16px;  gap: 5px;}
    .title-box h2 {font-size: 34px;}
    .our-services .common-box .top-box .icon-box h5 {font-size: 26px;}
    .our-services .common-box .top-box .icon-box {gap: 15px;}
    .our-services .common-box .top-box .icon-box svg {width: 60px;}
    .power-of-regulation-section .left-box img.circle-img {right: -15px;}
    .step-process-section .common-box .img-box {width: 250px;height: 250px;}
    .step-process-section .common-box .img-box span {padding: 5px 15px;}
    .title-box {margin-bottom: 40px;}
    .step-process-section .common-box .content-box {gap: 15px;}
    .step-process-section .common-box .content-box h4 {font-size: 24px;}
    .step-process-section .common-box .content-box p {width: 85%;}
    footer .top-footer {gap: 15px;}
    footer .top-footer button.common-btn {padding: 10px 30px;margin-left: 10px;}
    footer .top-footer form {flex-wrap: wrap;}
    footer .top-footer form input {width: 68%;padding: 10px 20px;}
    footer .top-footer .left-box {padding-right: 15px;}

    .wellness-journey-section .content-box {left: 11.8%;}
    .wellness-journey-section .content-box h2 {font-size: 34px;width: 53%;}
    .wellness-journey-section::after {left: 160px;}
    .marquee-item {font-size: 22px;}
    .marquee-section {padding: 20px 0;}
    .client-say-section .item {    padding: 25px;}
    .client-say-section .item svg {width: 50px;}
    .the-power-section .right-box .circle-img {width: 80px;top: 73px;}
    .pricing-section .common-grid .common-box h3 {font-size: 26px;}
    .pricing-section .common-grid .common-box h3 sub {font-size: 28px;}
    .pricing-section .common-grid .common-box.book-appoinment {gap: 15px;}
    .stroy-section .right-box .circle-img {width: 100px;  top: 7%;}
    .empower-section .common-flex-box .left-box .circle-img {right: 5%;width: 100px;}
    .services-page .services-item .title-box p {font-size: 16px;}
    footer .top-footer .left-box ul li a {font-size: 17px;}
    footer .top-footer .left-box ul li {padding-left: 22px;}
    footer .top-footer .left-box ul {gap: 16px;}
    .services-page .services-item .title-box h2 {font-size: 32px;}
    .common-blog-box .content-box h6 {font-size: 18px;}
    .common-blog-box .common-btn {font-size: 16px;}
    .common-blog-box .common-btn span {width: 30px;height: 30px;  border-radius: 7px;}
      .common-blog-box .common-btn span svg {width: 20px;height: auto;}
      .contact-page .faq-contact-info {  margin-top: 30px;} 
      .tarieven-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.common-blog-box .content-box h6 {height: 108px;}
}

/* ==========================================================================
   1023px (Tablet Stacking & Natural Reflow)
   ========================================================================== */
@media (max-width:1023px) {
    header .logo-box a img, header .log-box a img { width: 85px; }
    .custom-container { padding: 0px 30px; }
    .common-section { padding: 70px 0px; }
    .common-top-section { padding-top: 70px; }
    .common-bottom-section { padding-bottom: 70px; }

    /* Global Banner Stacking */
/*    .banner-section { flex-direction: column; }*/
/*    .banner-section .left-box, .banner-section .right-box { width: 100%; }*/
    .banner-section .left-box { padding: 50px 30px; }
    .banner-section .right-box img { height: 380px; width: 100%; object-fit: cover; display: block; }
    .banner-section .title-box { width: 100%; margin-bottom: 20px;}
    .banner-section .title-box h1 { font-size: 30px; }
    .title-box span {font-size: 14px;    padding: 6px 15px;}
    .title-box h2 { font-size: 32px; }
    .banner-section .left-box {width: 56%;}


    /* All 2-Column Sections Reflow to 1 Column Stack */
    .common-grid, .power-of-regulation-section .common-grid { grid-template-columns: 1fr; gap: 40px; }

    /* 3-Column Grids adapt to 2 Columns */
    .our-services .common-grid { grid-template-columns: repeat(2, 1fr); gap: 25px; }
    .step-process-section .common-grid { grid-template-columns: repeat(3, 1fr); gap: 30px; }
/*    .step-process-section .common-box:last-child { grid-column: span 2; max-width: 440px; margin: 0 auto; }*/
    .step-process-section .common-box .img-box { width: 270px; height: 270px; }
    .pricing-section .common-grid { grid-template-columns: minmax(0, 1fr); max-width: 520px; margin: 0 auto; gap: 25px; }
    .pricing-section .common-grid .common-box.book-appoinment { grid-column: span 1; max-width: 100%; margin: 0; }

    /* About Us Sections: The Power & Empower */
    .the-power-section .common-flex-box, .empower-section .common-flex-box, .inner-blog-section .common-flex-box, .stroy-section .common-flex-box { flex-direction: column; gap: 40px; }
    .the-power-section .left-box, .the-power-section .right-box, .empower-section .left-box, .empower-section .right-box, .inner-blog-section .inner-blog-hero-left, .inner-blog-section .right-box, .stroy-section .left-box, .stroy-section .right-box { width: 100%; }

    /* Signature Arched Image Containers Centered */
    .the-power-section .right-box, .empower-section .left-box, .power-of-regulation-section .left-box, .stroy-section .right-box, .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { max-width: 400px; width: 100%; margin: 0 auto; position: relative; display: flex; justify-content: center; align-items: center; }
    .the-power-section .right-box img, .empower-section .left-box img, .power-of-regulation-section .left-box img, .stroy-section .right-box img, .services-page .healing-section .left-box img, .services-page .reading-section .right-box img, .services-page .kaartlegging-section .left-box img, .inner-blog-section .right-box img { max-width: 100%; height: auto; display: block; position: relative; z-index: 2; }
    .power-of-regulation-section .left-box .border, .empower-section .left-box .border, .services-page .healing-section .left-box .border, .services-page .reading-section .right-box .border, .services-page .kaartlegging-section .left-box .border, .inner-blog-section .right-box .border { position: absolute; inset: 0; left: 14%; bottom: 5%; top: 8%; right: 10%; pointer-events: none; }
    .circle-img, .the-power-section .right-box .circle-img, .empower-section .left-box .circle-img, .power-of-regulation-section .left-box .circle-img, .stroy-section .right-box .circle-img, .services-page .healing-section .left-box .circle-img, .services-page .reading-section .right-box .circle-img, .services-page .kaartlegging-section .left-box .circle-img, .inner-blog-section .right-box .circle-img { width: 95px; height: 95px; right: 8%; top: 8%; position: absolute; z-index: 2; }

    /* Consultation Section */
    .consultation-section .custom-container { flex-direction: column; text-align: center; gap: 30px; }
    .consultation-section .title-box h2 { font-size: 46px; }

    /* Wellness Journey Video Section */
    .wellness-journey-section .background-video { height: 480px; }
    .wellness-journey-section:after { display: none; }
    .wellness-journey-section .content-box { left: 30px; right: 30px; gap: 35px; width: auto; }
    .wellness-journey-section .content-box h2 { font-size: 34px; width: 65%; }

    /* Testimonial Slider */
    .client-say-section { overflow: hidden; }
    .client-say-section .item { padding: 30px; }
    .client-say-section .item p { font-size: 19px; line-height: 1.6; height: 150px !important; margin-bottom: 30px; }
    .client-say-section .item .client-box { width: calc(100% - 40px); bottom: -40px; }

    /* Services Page Items: Text First, Image Second */
    .services-page .services-item .common-flex-box { flex-direction: column; gap: 40px; }
    .services-page .services-item.reading-section .common-flex-box { flex-direction: column-reverse; }
    .services-page .healing-section .left-box, .services-page .healing-section .right-box, .services-page .reading-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .services-page .kaartlegging-section .right-box { width: 100%; }

    /* Latest Blogs */
    .latest-blog-section .common-grid { grid-template-columns: repeat(2, 1fr); gap: 25px; }

    /* Contact Page */
    .contact-page .contact-form-section .common-flex-box { flex-direction: column; gap: 40px; }
    .contact-page .contact-form-section .left-box, .contact-page .contact-form-section .right-box { width: 100%; }
    .contact-page .contact-img-box { max-width: 400px; width: 100%; margin: 0 auto; padding: 50px 30px; }
    .contact-page .contact-info-grid { grid-template-columns: 1fr; gap: 35px; }
    .contact-page .contact-map img { min-height: 300px; max-height: 400px; }
    .contact-page .faq-grid { grid-template-columns: 1fr; gap: 40px; }
    .contact-page .faq-left .title-box p { max-width: 100%; }

    /* Footer Stacking */
    footer .top-footer { flex-direction: column; align-items: flex-start; gap: 40px; padding: 50px 0 35px 0; }
    footer .top-footer .left-box { border-right: none; border-bottom: 1px solid rgba(255, 255, 255, 0.16); padding-bottom: 35px; width: 100%; }
    footer .top-footer .right-box { width: 100%; align-items: flex-start; }
    footer .bottom-footer { flex-direction: column; gap: 20px; text-align: center; padding: 25px 0; }
    footer .bottom-footer .center-box ul { flex-wrap: wrap; justify-content: center; gap: 14px 24px; }
footer .top-footer .left-box, footer .top-footer .right-box {padding: 0;}
footer .top-footer .left-box {padding-bottom: 20px;}

 .pricing-section .common-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 25px; max-width: 100%;}
    .pricing-section .common-grid .common-box.book-appoinment { grid-column: span 2; max-width: 100%; margin: 0 auto; width: 100%; }

    .the-power-section .common-flex-box {flex-direction: column-reverse;gap: 30px;}
    .empower-section .common-flex-box .left-box,.empower-section .common-flex-box .right-box {width: 100%;}
    .wellness-journey-section .play-pause-btn svg {width: 26px;height: auto;}
    .client-say-section .item .client-box img {width: 45px;}
    .client-say-section .item .client-box span {    font-size: 18px;}
    .common-blog-box .content-box h6 {height: 81px;}
    .banner-section.main-banner-section .left-box .title-box {margin-bottom: 20px !important;}
   
    .contact-page .contact-detail-box {padding: 20px;  border-radius: 18px;}
    .contact-page .contact-detail-box h6 {font-size: 20px;}
    .contact-page .contact-detail-box a {font-size: 22px;}
     .contact-page .contact-detail-box .contact-icon {padding: 10px;border-radius: 18px;} 
      .contact-page .contact-detail-box .contact-icon svg {width: 30px;height: auto;}
      .contact-page .contact-details {  gap: 20px;}
      .contact-page .faq-left .title-box h2 { margin-bottom: 20px; } 
      .tarieven-grid { grid-template-columns: 1fr; max-width: 520px; margin: 0 auto; }
}

/* ==========================================================================
   767px (Mobile Landscape / Large Phones)
   ========================================================================== */
@media (max-width:767px) {
    .custom-container { padding: 0px 24px; }
    .common-section { padding: 65px 0px; }
    .common-top-section { padding-top: 65px; }
    .common-bottom-section { padding-bottom: 65px; }

    /* Typography Hierarchy Maintained */
    .title-box { margin-bottom: 35px; }
    h2, .title-box h2 { font-size: 32px; line-height: 1.25; margin-bottom: 16px; }
    h3 { font-size: 26px; }
    p { font-size: 16px; line-height: 1.7; }

    /* Header */
    header .logo-box a img, header .log-box a img { width: 80px; }
    header .center-box .header-menu ul li a { padding: 13px 24px; font-size: 17px; }
    header .center-box .header-menu ul li a.common-btn { margin: 16px 24px 0; max-width: calc(100% - 48px); }

    /* Global Banner */
    .banner-section .left-box { padding: 40px 24px; }
/*    .banner-section .title-box h1 { font-size: 34px; line-height: 1.25; }*/
    .banner-section .right-box img { height: 290px; }

    /* All Multi-Column Grids stack to 1 column on mobile */
    .our-services .common-grid { grid-template-columns: 1fr; gap: 24px; }
    .our-services .common-box:last-child { grid-column: span 1; max-width: 100%; }
    .our-services .common-box { padding: 25px; gap: 20px; }
    .our-services .common-box .top-box .icon-box h5 { font-size: 24px; }
    .step-process-section .common-grid {gap: 20px; padding:7px; }
    .step-process-section .common-box:last-child { grid-column: span 1; max-width: 100%; }
    .step-process-section .common-box .img-box { width: 250px; height: 250px; }
    .step-process-section .common-box .content-box p { width: 90%; }
    .pricing-section .common-grid { grid-template-columns: minmax(0, 1fr); gap: 24px; max-width: 100%; }
    .pricing-section .common-grid .common-box { padding: 28px 24px; }
    .pricing-section .common-grid .common-box h3 { font-size: 38px; }
    .pricing-section .common-grid .common-box h3 sub { font-size: 22px; }

    /* Empower Section Mission Box */
    .empower-section .bottom-box { flex-direction: column; gap: 20px; }
    .empower-section .bottom-box .common-box { flex-direction: row; gap: 20px; align-items: center; width: 100%; padding-top: 20px; }
    .empower-section .bottom-box .common-box svg { width: 64px; height: 64px; flex-shrink: 0; }
    .empower-section .bottom-box .border { display: none; }

    /* Arched image containers */
    .the-power-section .right-box, .empower-section .left-box, .power-of-regulation-section .left-box, .stroy-section .right-box, .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { max-width: 350px; padding: 20px; }
    .circle-img, .the-power-section .right-box .circle-img, .empower-section .left-box .circle-img, .power-of-regulation-section .left-box .circle-img, .stroy-section .right-box .circle-img, .services-page .healing-section .left-box .circle-img, .services-page .reading-section .right-box .circle-img, .services-page .kaartlegging-section .left-box .circle-img, .inner-blog-section .right-box .circle-img { width: 85px; height: 85px; }

    /* Wellness Journey Video */
    .wellness-journey-section .background-video { height: 380px; }
    .wellness-journey-section .content-box { flex-direction: column; text-align: center; justify-content: center; left: 20px; right: 20px; gap: 24px; width: auto; }
    .wellness-journey-section .content-box h2 { font-size: 28px; width: 100%; }
    .wellness-journey-section .play-pause-btn { width: 78px; height: 78px; margin: 0 auto; }

    /* Latest Blogs */
    .latest-blog-section .common-grid { gap: 20px; }

    /* Contact Page */
    .contact-page .contact-form .form-row { flex-direction: column; gap: 20px; }
    .contact-page .contact-img-box { max-width: 340px; padding: 40px 24px; }

    /* Footer Form Stack */
/*    footer .top-footer form { flex-direction: column; align-items: stretch; width: 100%; gap: 14px; }*/
    footer .top-footer form input { width: 75%; }
/*    footer .top-footer form .common-btn, footer .top-footer button.common-btn, footer .top-footer form button.common-btn { justify-content: center; width: 100% !important; margin-left: 0 !important; }*/
    footer .copy-right { flex-direction: column; gap: 12px; text-align: center; }

    .title-box h2 {font-size: 26px;}
    footer .top-footer h5 {font-size: 20px;}
    footer .top-footer .left-box, footer .top-footer .right-box {gap: 20px;}
    .banner-section .right-box {display: none;}
    .banner-section .left-box {width: 100%;}
    .banner-section .left-box {padding: 50px 24px;}
    .power-of-regulation-section .left-box img.circle-img {right: 0; top: 64px;}
    .power-of-regulation-section {background: #faf8f2;}
    .common-grid, .power-of-regulation-section .common-grid {gap: 20px;}
    .common-section {padding: 40px 0; }
    .common-bottom-section {padding-bottom: 40px;}
     .common-top-section {padding-top: 40px;}
       .power-of-regulation-section {padding: 40px 0;}
       .client-say-section .item svg {width: 35px;}
       .client-say-section .item p {font-size: 18px; height: 170px !important;}
       .client-say-section .owl-carousel {padding:0 20px;    margin-bottom: 11px;}
       .services-page .services-item .title-box h2 {    font-size: 28px;}
       .services-page .services-item .common-flex-box {    gap: 20px;}
      .common-blog-box  {gap: 20px;}
      .inner-blog-section-heading {font-size: 22px;}
      .contact-page .contact-details {    flex-wrap: wrap;}
      .contact-page .faq-left .title-box h2 { margin-bottom: 15px; }
      .contact-page .faq-contact-info {  margin-top: 30px;}
      .tarieven-grid {    max-width: 100%;gap: 20px;}
       .tarieven-item { padding: 18px 20px; align-items: flex-start; }
    .tarieven-name { font-size: 18px; }
    .tarieven-price { font-size: 20px; }
	.common-blog-box .content-box h6 {height: 108px}
}

/* ==========================================================================
   639px (Mid Mobile)
   ========================================================================== */
@media (max-width:639px) {
    .banner-section .title-box h1 { font-size: 32px; }
    .title-box h2 { font-size: 30px; }
    .banner-section .right-box img { height: 260px; }
    .our-services .common-box { padding: 26px 20px; gap: 35px; }
    .client-say-section .item { padding: 28px 20px; }
    .client-say-section .item .client-box { bottom: -35px; padding: 12px 16px; width: calc(100% - 24px); }
    .client-say-section .item .client-box img { width: 60px; border-radius: 16px; }
    .client-say-section .item .client-box span { font-size: 20px; }
    .client-say-section .item p { font-size: 17px; }
    .pricing-section .common-box { padding: 26px 20px; }
    footer .top-footer form input {width: 100%;}
    footer .top-footer button.common-btn {margin: 0 auto; margin-top: 15px;}
    footer .top-footer .right-box ul li a {width: 80%;}
    footer .copy-right p, .copy-right span, .copy-right span a {font-size: 14px;}
    footer .copy-right {gap: 5px;}
    footer .bottom-footer .center-box ul li a {font-size: 16px;}
    footer .bottom-footer .center-box ul {gap: 10px;}
    footer .bottom-footer .center-box ul li {padding-left: 20px;}
    header .center-box .header-menu ul li a {padding: 10px 24px;font-size: 16px;}
    header .center-box .header-menu ul li a.common-btn {margin: 10px 24px 0;}
    footer .top-footer .right-box ul li a{font-size: 16px;}
    #backToTop svg.icon__arrow-up {width: 25px;height: 25px;}
    #backToTop {width: 40px;height: 40px;  bottom: 100px;}
    .common-section {padding: 30px 0; }
    .common-bottom-section {padding-bottom: 30px;}
      .common-top-section {padding-top: 30px;}
      footer .top-footer {gap: 0;}
      .power-of-regulation-section {padding: 30px 0;}
      footer .top-footer .left-box ul {flex-wrap: wrap;}
      footer .top-footer .left-box ul {gap: 11px;}
      .services-page .services-item .title-box h2 {    font-size: 24px;}
       .step-process-section .common-grid { grid-template-columns: 1fr;  }
           .latest-blog-section .common-grid { grid-template-columns: 1fr; }
 .inner-blog-section-heading {font-size: 20px;}
 .contact-page .contact-info-grid {display: flex;flex-direction: column;}
   .contact-page .faq-contact-info .faq-msg-email {font-size: 18px;}
   .contact-page .faq-contact-info {  margin-top: 20px;}
	.common-blog-box .content-box h6 {height: auto;}
}

/* ==========================================================================
   479px (Standard Mobile: 480px - 360px)
   ========================================================================== */
@media (max-width:479px) {
    .custom-container { padding: 0px 20px; }
  /*  .common-section { padding: 60px 0px; }
    .common-top-section { padding-top: 60px; }
    .common-bottom-section { padding-bottom: 60px; }*/
    header .logo-box a img, header .log-box a img { width: 76px; }
    .banner-section .left-box { padding: 35px 20px; }
    .banner-section .title-box h1 { font-size: 28px; }
    .banner-section .right-box img { height: 230px; }
    h2, .title-box h2 { font-size: 22px; }
    h3 { font-size: 20px; }
    p { font-size: 14px; }
    .title-box span, .heading-box span { padding: 6px 15px; font-size: 14px; }

    /* Services cards */
    .our-services .common-box { padding: 24px 18px; gap: 30px; }
    .our-services .common-box .top-box .icon-box { gap: 16px; }
    .our-services .common-box .top-box .icon-box h5 { font-size: 26px; }
    .our-services .common-box .top-box .icon-box span svg { width: 58px; height: 58px; }

    /* Arched images */
    .the-power-section .right-box, .empower-section .left-box, .power-of-regulation-section .left-box, .stroy-section .right-box, .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { max-width: 100%;padding: 20px; }
    .circle-img, .the-power-section .right-box .circle-img, .empower-section .left-box .circle-img, .power-of-regulation-section .left-box .circle-img, .stroy-section .right-box .circle-img, .services-page .healing-section .left-box .circle-img, .services-page .reading-section .right-box .circle-img, .services-page .kaartlegging-section .left-box .circle-img, .inner-blog-section .right-box .circle-img { width: 75px; height: 75px; }

    /* Step process */
    .step-process-section .common-box .img-box { width: 230px; height: 230px; }
    .step-process-section .common-box .img-box span { padding: 6px 18px; font-size: 14px; }
    .step-process-section .common-box .content-box h4 { font-size: 24px; }

    /* Pricing */
    .pricing-section .common-grid .common-box, .pricing-section .common-box { padding: 24px 18px; }
    .pricing-section .common-grid .common-box h3, .pricing-section .common-box h3 { font-size: 32px; }
    .pricing-section .common-grid .common-box h3 sub, .pricing-section .common-box h3 sub { font-size: 18px; }

    /* Contact page */
    .contact-page .contact-img-box { max-width: 310px; padding: 35px 20px; }
    .contact-page .contact-detail-box { padding: 16px; gap: 14px; }
    .contact-page .contact-detail-box .contact-icon { padding: 9px; border-radius: 9px; }
    .contact-page .faq-accordion-header { padding: 18px 20px; }
    .contact-page .faq-accordion-header .faq-q { font-size: 16px; }
    .contact-page .faq-accordion-body { padding: 0 20px 20px 20px; font-size: 15px; }
    .common-btn {padding: 10px 15px;  font-size: 14px;}
    .contact-page .contact-detail-box .contact-icon svg {  width: 22px;}
    .contact-page .contact-detail-box a {font-size: 16px;}
    .contact-page .contact-detail-box h6 {font-size: 16px;}
    .contact-page .faq-accordion-header .faq-icon svg {width: 10px;height: 10px;}
    .contact-page .faq-accordion-header .faq-icon {width: 25px;height: 25px;}
    .contact-page .faq-contact-info .faq-msg-email {font-size: 16px;}
}

/* ==========================================================================
   359px (Compact Mobile: 360px - 320px)
   ========================================================================== */
@media (max-width:359px) {
    .custom-container { padding: 0px 15px; }
    .common-section { padding: 55px 0px; }
    .common-top-section { padding-top: 55px; }
    .common-bottom-section { padding-bottom: 55px; }
    header .logo-box a img, header .log-box a img { width: 70px; }
    .banner-section .left-box { padding: 28px 15px; }
    .banner-section .title-box h1 { font-size: 26px; }
    .banner-section .right-box img { height: 200px; }
    h2, .title-box h2 { font-size: 24px; }
    p { font-size: 15px; line-height: 1.65; }
    .our-services .common-box .top-box .icon-box h5 { font-size: 23px; }
    .step-process-section .common-box .img-box { width: 200px; height: 200px; }
    .step-process-section .common-box .content-box h4 { font-size: 22px; }
    .pricing-section .common-grid .common-box h3, .pricing-section .common-box h3 { font-size: 28px; }
    .the-power-section .right-box, .empower-section .left-box, .power-of-regulation-section .left-box, .stroy-section .right-box, .services-page .healing-section .left-box, .services-page .reading-section .right-box, .services-page .kaartlegging-section .left-box, .inner-blog-section .right-box { max-width: 280px; padding: 30px 20px; }
    .circle-img, .the-power-section .right-box .circle-img, .empower-section .left-box .circle-img, .power-of-regulation-section .left-box .circle-img, .stroy-section .right-box .circle-img, .services-page .healing-section .left-box .circle-img, .services-page .reading-section .right-box .circle-img, .services-page .kaartlegging-section .left-box .circle-img, .inner-blog-section .right-box .circle-img { width: 65px; height: 65px; }
    .contact-page .contact-img-box { max-width: 275px; padding: 28px 16px; }
    .contact-page .contact-detail-box h6 { font-size: 18px; }
    .contact-page .contact-detail-box a { font-size: 18px; }
    .contact-page .faq-accordion-header .faq-q { font-size: 16px; }
    footer .top-footer h5 { font-size: 20px; }
    footer .top-footer .right-box ul li a { font-size: 16px; }
    footer .bottom-footer .center-box ul li a { font-size: 15px; }
    footer .copy-right p, footer .copy-right span, footer .copy-right span a { font-size: 14px; }
}