.elementor-kit-6{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-color-7000012:#FD6B01;--e-global-color-cfa637f:#013765;--e-global-color-15dd460:#C0CDE6;--e-global-color-8eb6571:#FFFCFA;--e-global-color-0618d21:#4A90E2;--e-global-color-711b748:#FFD8B1;--e-global-color-faedd14:#F5F7FA;--e-global-color-1df2b25:#2E2E2E;--e-global-color-fd9960c:#F9FAFA;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-6 e-page-transition{background-color:#FFBC7D;}.elementor-kit-6 h1{color:var( --e-global-color-cfa637f );font-size:32px;font-weight:700;}.elementor-kit-6 h2{color:var( --e-global-color-cfa637f );font-family:"Roboto", Sans-serif;font-size:18px;font-weight:600;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.site-header .site-branding{flex-direction:column;align-items:stretch;}.site-header{padding-inline-end:0px;padding-inline-start:0px;}.site-footer .site-branding{flex-direction:column;align-items:stretch;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS */.page-header{
	display:none;
}

/* ==== FINAL SOAP BUBBLE HERO – PURE CSS ONLY ==== */
.soap-bubble-hero {
    position: relative;    background: linear-gradient(135deg, #e0f7fa 0%, #b2ebf2 30%, #80deea 70%, #4dd0e1 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

/* Generate 37 bubbles using ::before/::after + empty spans (b1–b35) */
.soap-bubble-hero::before,
.soap-bubble-hero::after,
.soap-bubble-hero .b1,.soap-bubble-hero .b2,.soap-bubble-hero .b3,.soap-bubble-hero .b4,
.soap-bubble-hero .b5,.soap-bubble-hero .b6,.soap-bubble-hero .b7,.soap-bubble-hero .b8,
.soap-bubble-hero .b9,.soap-bubble-hero .b10,.soap-bubble-hero .b11,.soap-bubble-hero .b12,
.soap-bubble-hero .b13,.soap-bubble-hero .b14,.soap-bubble-hero .b15,.soap-bubble-hero .b16,
.soap-bubble-hero .b17,.soap-bubble-hero .b18,.soap-bubble-hero .b19,.soap-bubble-hero .b20,
.soap-bubble-hero .b21,.soap-bubble-hero .b22,.soap-bubble-hero .b23,.soap-bubble-hero .b24,
.soap-bubble-hero .b25,.soap-bubble-hero .b26,.soap-bubble-hero .b27,.soap-bubble-hero .b28,
.soap-bubble-hero .b29,.soap-bubble-hero .b30,.soap-bubble-hero .b31,.soap-bubble-hero .b32,
.soap-bubble-hero .b33,.soap-bubble-hero .b34,.soap-bubble-hero .b35 {
    content: "";
    position: absolute;
    bottom: -200px;
    border-radius: 50%;
    background: radial-gradient(circle at 30% 30%, rgba(255,255,255,0.95), rgba(255,255,255,0.1));
    box-shadow: 
        inset -20px -20px 40px rgba(255,255,255,0.7),
        0 0 40px rgba(255,255,255,0.5);
    animation: float-up linear infinite;
    opacity: 0.7;
}

/* 37 bubbles with realistic size & position variety */
.soap-bubble-hero::before   {width:180px;height:180px;left:8%;  animation-duration:28s;animation-delay:0s;}
.soap-bubble-hero::after    {width:220px;height:220px;left:78%; animation-duration:32s;animation-delay:3s;}

.soap-bubble-hero .b1  {width:40px; height:40px;  left:15%; animation-duration:18s; animation-delay:2s;}
.soap-bubble-hero .b2  {width:120px;height:120px; left:25%; animation-duration:25s; animation-delay:6s;}
.soap-bubble-hero .b3  {width:80px; height:80px;  left:5%;  animation-duration:20s; animation-delay:10s;}
.soap-bubble-hero .b4  {width:200px;height:200px; left:55%; animation-duration:35s; animation-delay:1s;}
.soap-bubble-hero .b5  {width:60px; height:60px;  left:70%; animation-duration:16s; animation-delay:8s;}
.soap-bubble-hero .b6  {width:250px;height:250px; left:35%; animation-duration:38s; animation-delay:5s;}
.soap-bubble-hero .b7  {width:100px;height:100px; left:90%; animation-duration:22s; animation-delay:12s;}
.soap-bubble-hero .b8  {width:150px;height:150px; left:45%; animation-duration:30s; animation-delay:4s;}
.soap-bubble-hero .b9  {width:30px; height:30px;  left:82%; animation-duration:15s; animation-delay:14s;}
.soap-bubble-hero .b10 {width:170px;height:170px; left:18%; animation-duration:27s; animation-delay:7s;}
.soap-bubble-hero .b11 {width:90px; height:90px;  left:62%; animation-duration:24s; animation-delay:9s;}
.soap-bubble-hero .b12 {width:210px;height:210px; left:3%;  animation-duration:40s; animation-delay:2s;}
.soap-bubble-hero .b13 {width:70px; height:70px;  left:48%; animation-duration:19s; animation-delay:11s;}
.soap-bubble-hero .b14 {width:140px;height:140px; left:75%; animation-duration:26s; animation-delay:5s;}
.soap-bubble-hero .b15 {width:50px; height:50px;  left:30%; animation-duration:17s; animation-delay:13s;}
.soap-bubble-hero .b16 {width:190px;height:190px; left:85%; animation-duration:33s; animation-delay:0s;}
.soap-bubble-hero .b17 {width:110px;height:110px; left:22%; animation-duration:23s; animation-delay:16s;}
.soap-bubble-hero .b18 {width:230px;height:230px; left:60%; animation-duration:37s; animation-delay:4s;}
.soap-bubble-hero .b19 {width:45px; height:45px;  left:40%; animation-duration:14s; animation-delay:18s;}
.soap-bubble-hero .b20 {width:165px;height:165px; left:12%; animation-duration:29s; animation-delay:6s;}
.soap-bubble-hero .b21 {width:95px; height:95px;  left:68%; animation-duration:21s; animation-delay:10s;}
.soap-bubble-hero .b22 {width:205px;height:205px; left:50%; animation-duration:34s; animation-delay:3s;}
.soap-bubble-hero .b23 {width:75px; height:75px;  left:28%; animation-duration:20s; animation-delay:15s;}
.soap-bubble-hero .b24 {width:240px;height:240px; left:80%; animation-duration:39s; animation-delay:8s;}
.soap-bubble-hero .b25 {width:55px; height:55px;  left:95%; animation-duration:16s; animation-delay:12s;}
.soap-bubble-hero .b26 {width:130px;height:130px; left:38%; animation-duration:28s; animation-delay:5s;}
.soap-bubble-hero .b27 {width:105px;height:105px; left:20%; animation-duration:24s; animation-delay:17s;}
.soap-bubble-hero .b28 {width:185px;height:185px; left:65%; animation-duration:31s; animation-delay:2s;}
.soap-bubble-hero .b29 {width:65px; height:65px;  left:10%; animation-duration:18s; animation-delay:19s;}
.soap-bubble-hero .b30 {width:215px;height:215px; left:42%; animation-duration:36s; animation-delay:7s;}
.soap-bubble-hero .b31 {width:85px; height:85px;  left:88%; animation-duration:22s; animation-delay:11s;}
.soap-bubble-hero .b32 {width:160px;height:160px; left:32%; animation-duration:27s; animation-delay:4s;}
.soap-bubble-hero .b33 {width:35px; height:35px;  left:72%; animation-duration:15s; animation-delay:20s;}
.soap-bubble-hero .b34 {width:195px;height:195px; left:25%; animation-duration:32s; animation-delay:9s;}
.soap-bubble-hero .b35 {width:115px;height:115px; left:58%; animation-duration:25s; animation-delay:13s;}

/* Floating animation */
@keyframes float-up {
    0%   { transform: translateY(0) translateX(0) rotate(0deg);    opacity: 0; }
    15%  { opacity: 0.8; }
    85%  { opacity: 0.6; }
    100% { transform: translateY(-1500px) translateX(120px) rotate(360deg); opacity: 0; }
}

/* Gentle side drift – alternates left/right */
.soap-bubble-hero .b1,.b3,.b5,.b7,.b9,.b11,.b13,.b15,.b17,.b19,
.soap-bubble-hero .b21,.b23,.b25,.b27,.b29,.b31,.b33,.b35,
.soap-bubble-hero::before { animation: float-up 20s linear infinite, drift-left 16s ease-in-out infinite; }

.soap-bubble-hero .b2,.b4,.b6,.b8,.b10,.b12,.b14,.b16,.b18,.b20,
.soap-bubble-hero .b22,.b24,.b26,.b28,.b30,.b32,.b34,
.soap-bubble-hero::after { animation: float-up 20s linear infinite, drift-right 18s ease-in-out infinite; }

@keyframes drift-left  { 0%,100% { transform: translateX(0); }    50% { transform: translateX(-100px); } }
@keyframes drift-right { 0%,100% { transform: translateX(0); }    50% { transform: translateX(100px); } }/* End custom CSS */