        html, body {
              margin: 0;
              padding: 0;
              overflow-x: hidden; /* hide horizontal overflow */
            }
                    
        
        :root {
            /* Design Spec Colors */
            --dark-blue: #022366;
            --light-blue: #253EBB;
            --black: #000000;
            --white: #FFFFFF;

            /* Color from images for background */
            --bg-custom-blue: #b1d4e0;
        }

        /* --- Font Consistency --- */
        h1, h2, h3, h4, h5, h6 {
            font-family: 'Poppins';
        }
        
        body > main > section.hero-section > div > div > div.col-lg-5.p-5 > h1 {
            font-weight:500!important;
        }
        
        body, a, p {
            font-family:'Lato'!important;
        }
        
        /* hero section */
        
        .object-fit-cover {
  object-fit: cover;
  pointer-events: none;
}

.hero video {
  min-width: 100%;
  min-height: 100%;
}

.hero .btn {
  transition: all 0.3s ease;
}

.hero .btn-light:hover {
  background-color: transparent;
  color: #fff;
  border-color: #fff;
}

.hero .btn-dark:hover {
  background-color: transparent;
  color: #fff;
  border-color: #fff;
}

        
        /* --- Typography & General Styles --- */
        .logo-font {
            font-weight: 300;
            font-size: 1.75rem;
            letter-spacing: 3px;
            color: var(--black);
        }

        .section-padding {
            padding: 4.5rem 0;
        }

        .text-tracked {
            letter-spacing: 2px;
        }
        
        .card-title {
            margin-top:5px;
        }
        
        .fullwidth-img {
            width: 100%;
            padding-top: 56.25%; /* 16:9 aspect ratio (9/16 = 0.5625) */
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
            position: relative;
        }
        
        #fullwidth_img_1 {
            background-image: url('/assets/image/fullwidth1.webp');
        }
        
        #fullwidth_img_2 {
            background-image: url('/assets/image/fullwidth2.webp');
        }
        
        /* --- Custom Button Styles --- */
        .btn-custom-outline {
            border: 1px solid var(--black);
            border-radius: 0;
            padding: 0.5rem 2rem;
            background-color: transparent;
            color: var(--black);
            transition: all 0.3s ease;
        }

        .btn-custom-outline:hover {
            background-color: var(--black);
            color: var(--white);
        }
        
        .btn-dark-solid {
            border-radius: 0;
            background-color: var(--black);
            color: var(--white);
            padding: 0.5rem 2.5rem;
            border: 1px solid var(--black);
        }
        
        .btn-dark-solid:hover {
             background-color: #333;
             border-color: #333;
        }

        /* --- Header / Navigation --- */
        .navbar {
            padding: 1.5rem 0;
        }
        
        .navbar-nav .nav-link {
            font-size: 0.9rem;
            font-weight: 500;
            letter-spacing: 1px;
            margin: 0 0.75rem;
        }
        
        .maxwidth90 {
            max-width:90%!important;
        }
 
        /* --- Image Aspect Ratios --- */
        .img-square {
            aspect-ratio: 1 / 1;
            object-fit: cover;
            width: 100%;
        }

       /* --- Community/Find Us Section --- */
        .info-box {
            background-color: var(--bg-custom-blue);
            height: 100%;
        }
        
        .info-box .social-icons a {
            color: var(--black);
            font-size: 1.5rem;
            margin-right: 1rem;
        }
        
        /* --- Footer --- */
        footer {
            padding: 3rem 0;
            border-top: 2px solid #e0e0e0;
        }
        
        footer a, footer p {
            text-decoration: none;
            color: #555;
            font-size: 0.9rem;
            letter-spacing: 1px;
        }
        
        footer a:hover {
            color: var(--black);
        }

        footer h5 {
            font-weight: normal;
            letter-spacing: 1px;
            margin-bottom: 1rem;
            color: #999;
        }
        

.blog-article {
    max-width: 800px;
    margin: auto;
}

.author-info {
    background-color: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
}

.author-vignette {
    border-radius: 50%;
    width: 80px;
    height: 80px;
    object-fit: cover;
    margin-right: 20px;
}

.author-description {
    margin: 0;
    font-style: italic;
    color: var(--black);
}

.article-body h3 {
    color: var(--dark-blue);
    font-weight: 600;
}

.article-body p {
    line-height: 1.6;
    color: var(--black);
}

.nav-tabs .nav-link {
    color: var(--dark-blue);
    border: 1px solid transparent;
}

.nav-tabs .nav-link.active {
    color: var(--light-blue);
    background-color: var(--white);
    border-color: #dee2e6 #dee2e6 var(--white);
}

.tab-content {
    border: 1px solid #dee2e6;
    border-top: none;
    padding: 20px;
    border-radius: 0 0 5px 5px;
}

.full-width-container {
    max-width:initial!important;
    margin:0!important;
    padding:0!important;
}

.best-in-mtl-section * {
    color:black!important;
    text-decoration:none!important;
}

.tm-overall {
    display:none!important;
}

div[isafter="true"] {
    display:none!important;
}

#pilates {
    padding-bottom:0!important;
}

#contactus {
    background-color:#022366!important;
}

@media (min-width:600px) {
    #contact-us {
        padding:10rem 0!important;
    }
}


@media (max-width:900px) {
    
    #section_2 {
        padding-bottom:0!important;
    }
    
    .nav-link {
        text-align:center;
    }
    
    #navbarNav > div {
        justify-content:center;
    }
    
    .maxwidth90 {
        max-width:100%!important;
    }
    
    #contactus {
            padding-bottom: 0;
    }
    
    .hide-mobile {
        display:none!important;
    }
    
    #gyrotonic > div:nth-child(1) > img {
        height:100%!important;
    }
    
}



@media (max-width:600px) {
        .navbar>.container {
        justify-content:center!important;
    }
}





/* masonry css grid-based */

#contactus {
    padding-bottom:40px!important;
}

.section-padding {
            padding: 80px 0 0 0!important;
        }

        .gallery-section {
            background-color: #f8f9fa;
        }

        .masonry-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            grid-auto-rows: 200px;
            gap: 20px;
            padding: 20px 0;
        }

        .gallery-item {
            position: relative;
            overflow: hidden;
            border-radius: 8px;
            cursor: pointer;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }

        .gallery-item:hover {
            transform: translateY(-5px);
            box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
        }

        .gallery-item img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            transition: transform 0.5s ease;
        }

        .gallery-item:hover img {
            transform: scale(1.1);
        }

        /* Grid sizing for different ratios */
        .gallery-item.square {
            grid-row: span 2;
        }

        .gallery-item.landscape {
            grid-column: span 2;
            grid-row: span 2;
        }

        .gallery-item.portrait {
            grid-row: span 3;
        }

        /* Overlay effect */
        .gallery-item::after {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(2, 35, 102, 0.3);
            opacity: 0;
            transition: opacity 0.3s ease;
        }

        .gallery-item:hover::after {
            opacity: 1;
        }

        /* Lightbox modal */
        .lightbox-modal {
            display: none;
            position: fixed;
            z-index: 9999;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.95);
            align-items: center;
            justify-content: center;
        }

        .lightbox-modal.active {
            display: flex;
        }

        .lightbox-content {
            max-width: 90%;
            max-height: 90%;
            object-fit: contain;
        }

        .lightbox-close {
            position: absolute;
            top: 30px;
            right: 40px;
            font-size: 40px;
            color: white;
            cursor: pointer;
            transition: color 0.3s ease;
        }

        .lightbox-close:hover {
            color: #ddd;
        }

        .lightbox-nav {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            font-size: 50px;
            color: white;
            cursor: pointer;
            padding: 20px;
            user-select: none;
            transition: color 0.3s ease;
        }

        .lightbox-nav:hover {
            color: #ddd;
        }

        .lightbox-prev {
            left: 20px;
        }

        .lightbox-next {
            right: 20px;
        }
        


        @media (max-width: 768px) {
            .masonry-grid {
                grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
                grid-auto-rows: 150px;
                gap: 10px;
            }

            .gallery-item.landscape {
                grid-column: span 2;
                grid-row: span 2;
            }

            .gallery-item.portrait {
                grid-row: span 2;
            }

            .gallery-item.square {
                grid-row: span 1;
            }

    }


[data-elfsight-app-lazy] {
        height: 344px !important;
        margin-top: 50px;
}

#gyrokinesis > div:nth-child(1) > img {
    border-radius: 50%;
    max-width: 60% !important;
    margin: 61px 0 61px 20%;
}

