body,html{margin:0px;font-family: "Barlow", sans-serif;}

@font-face {
  font-family: 'Neon';
  src: url('assets/font/neon-heavy-webfont.woff') format('woff'),
       url('assets/font/neon-heavy-webfont.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}


:root{
    
    --common-unit  : 0.0625rem;
	
	--banner-text:clamp(2rem, calc(4.6vw + var(--common-unit)) ,5.625rem);
	--sub-head-text:clamp(1.125rem, calc(1.35vw + var(--common-unit)) ,1.625rem);
	--sec-head-text:clamp(1.625rem, calc(2.6vw + var(--common-unit)) ,3.125rem);
   
    --f-60-30:clamp(1.875rem, calc(3.125vw + var(--common-unit)) ,3.75rem);
    --f-22-20:clamp(1.25rem, calc(1.145vw + var(--common-unit)) ,1.375rem);
  
    --header-height:100px;
}


html {
  scroll-behavior: smooth;
  /* reserve space for a fixed header (replace 80px with your header height) */
  scroll-padding-top: 100px;
}



p {
  margin: 0 !important;
  padding: 0 !important;color: #222223;line-height:1.5;

}
h1, h2, h3, h4, h5, h6 {
  margin: 0 !important;
  padding: 0 !important;
}

.thank-you{display: flex; min-height: 100vh; justify-content: center;position:relative; background-image: url(https://socialgrid.club/assets/img/banner-desktop.webp);   padding: 5%;
    padding-top: calc(5% + 100px); align-items: center; background-size: cover; box-sizing: border-box; width: 100%; }
.banner .content{    max-width: 1280px; width: 1280px; display: flex;box-sizing:border-box; justify-content: space-between;position:relative;
    gap: 5%;}
    
    
    .banner{display: flex; min-height: 100vh; justify-content: center;position:relative; 
 align-items: center; background-size: cover; box-sizing: border-box; width: 100%; padding:0;}
    
    .thank-you::before{    content: "";
    background: linear-gradient(174.6deg, #000000 14.63%, rgba(0, 0, 0, 0) 92.51%);
    display: flex;
    position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 0;top: 0;}

.banner h2.head,.thank-you h1{    font-size:var(--banner-text);
    color: #fff;
    line-height: 1.1;}

.banner .s-head{    font-size: 2rem;
    color: #fff;
    font-weight: 700;
    line-height: 1.2;}
.banner p{ font-size: 22px;
    color: #fff;
    font-weight: 500;
    line-height: 1.2;    padding-top: 10px !important;
}


header{display: flex;
    justify-content: space-between;
    align-items: center;
    position: fixed;
    top: 0;
    max-width: 100%;
    width: calc(100% - 10%);
    backdrop-filter: blur(25px);
    background-color: #e4e4e4;
    padding: 15px;
    border-radius: 0px 0px 8px 8px;
    box-sizing: border-box;
    margin: 0px 5%;z-index:9999;}

.cta-btn{background: #222223;
    padding: 15px;
    display: flex;
    align-items: center;
    gap: 13px;
    text-decoration: none;
    color: #fff;
    font-family: 'Neon';
    font-size: 1rem;}

.banner .round-btn{position: relative;
    max-width: 1280px;
    width: 100%;
    min-height: 200px;padding-top:80px;}


.banner .round-btn svg{    max-width: 190px;
    height: auto;
    margin-bottom: -50px;margin-left:-25px;}

h2.head,.sec-head{font-family: 'Neon' !important;}


.banner .right{display: flex;
    width: 100%;
    box-sizing: border-box;justify-content: flex-end;    align-items: center;}

.banner .right .register-form{    background: #222223;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    padding: 30px 15px;
    width: 100%;    flex-basis: 420px;}

.banner .right .register-form h2{    color: #F58021;
    font-weight: 500;
    text-align: center;
    line-height: 1.5;
    font-size: 1.5rem;}

.banner .right .register-form input,.banner .right .register-form select{background: #2C2C2C;
    outline: none;
    border: none;
    width: 100%;
    padding: 12px 10px;
    box-sizing: border-box;
    font-size: 1rem;
    font-weight: 400;color:#fff;}

.banner .right .register-form input::placeholder,.banner .right .register-form select::placeholder,input.color,.banner .right .register-form select{color: #868A8C !important;position:relative;
}

.banner .right .register-form select
{
    background-image: url(https://socialgrid.club/landing-page/social-grid/assets/img/select-arrow.png);
    background-repeat: no-repeat;
    background-position: 97% 50%;
    background-size: 17px;
}


input::placeholder::after {
  content: "*";
  color: red;
}

/* For select default option */
select option[disabled] {
  color: #868A8C; /* same as placeholder */
}
select option[disabled]::after {
  content: "*";
  color: red;
}

select {
  /* Remove default appearance */
  appearance: none;
  -webkit-appearance: none; /* Safari/Chrome */
  -moz-appearance: none; /* Firefox */
  
  /* Optional – remove default background */
  background: none;
  background-color: transparent;

  /* Optional – custom padding to make space for your own arrow */
  padding-right: 1rem;
}

/* For IE/Edge (old versions) */
select::-ms-expand {
  display: none;
}

.banner .right .register-form .s-btn{display: flex;justify-content: center;}
.banner .right .register-form .s-btn .pay-btn{    border: none;
    background: #fff;
    color: #222223;cursor:pointer;}


section{padding:5%;position:relative;}

section.clinic-section{    background-image: url(https://socialgrid.club/assets/img/2nd-sec-bg.png);
    background-size: cover;    display: flex
;padding:10% 5%;
    justify-content: center;}


section.clinic-section .p-left{    position: absolute;
    left: 3%;
    bottom: 15%;}

#locations{ background-image: url(https://socialgrid.club/assets/img/location-bg.png);}


section.amenities{
       background-image: url(https://socialgrid.club/assets/img/amenities-image.png);
    background-size: cover;    display: flex
;padding:10% 5%;
    justify-content: center;
    isolation: isolate;
    
}




.fixed{max-width: 1280px; width: 100%; display: flex;box-sizing:border-box;position:relative;gap:5%}


section.clinic-section div.fixed{
align-items: center;}


.sub-head{font-size:var(--sub-head-text);color: #222223;position:relative;display:flex;gap:8px;align-items: center;    font-weight: 500;    text-transform: uppercase;
}
.sub-head::before{content:"";background: #222223;    display: block;
    width: 18px;
    height: 18px;}


.sec-head{font-size:var(--sec-head-text);color: #222223}
section.clinic-section .left{
    display: flex;
    flex-direction: column;
    gap: 10px;
    box-sizing: border-box;}

 p{
color: #222223;font-size:1.125rem;position: relative;
    z-index: 1;}

.c-sec{
    display: flex;
    padding-top: 15px;    position: relative;
    z-index: 1;}

.video-banner {
    position: relative;
    width: 100%;
    min-height: 100vh;
    overflow: hidden;
    box-sizing: border-box;    justify-content: center;
    display: flex;padding-top:10%;
}

.video-banner__video {
  position: absolute;
  top: 50%;
  left: 50%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 0;
}

.video-banner::before{content:"";background: #00000066;position: absolute;
    left: 0;
    width: 100%;
    height: 100%;
    top: 0;
    z-index: 1;}


.video-content {
  position: relative;
  z-index: 1;max-width: 1280px; width: 1280px; display: flex;box-sizing:border-box;position:relative;gap:5%  ;  justify-content: space-between;
}

section.amenities{    display: flex;
    justify-content: center;}

.video-banner h2,.video-banner p{color:#fff;}

.video-banner .left{
display: flex;
    flex-direction: column;
    gap: 10px;}


section.amenities .fixed,.gallery .fixed{flex-direction: column;}


.header-section{
display: flex;
    flex-direction: row;
    gap: 5%;
    align-items: center;padding-bottom: 8%;}

.flex-50{display: flex;
    flex-direction: column;
    gap: 10px;
    flex-basis: 50%;}


 /*.amenities-row {*/
 /*              display: grid;*/
 /*   grid-template-columns: 1fr 1fr 1fr 1fr;*/
 /*   gap: 15px;*/
 /*       }*/
        .amenity {
           /*background: #222223;*/
padding: 15px;
    color: #fff;
    padding-top: 0;position:relative;min-height:310px;
        }
        

        
 .amenity::after{content:"";
background: #222223;
    position: absolute;
    left: 0;
    width: 100%;
    height: calc(100% - 100px);
    bottom: 0;
    z-index: 0;}
  .amenity img{position: relative;
    z-index: 1;width: 100%;
    height: auto;}
        
        .amenity-title{
            font-size: 1.25rem;
    font-weight: 600;position: relative;
    z-index: 1;
    padding-bottom: 5px;
    padding-top: 10px;}
    
    .amenity-desc{position: relative;
    z-index: 1;
 font-size: 18px;
    font-weight: 400;
    line-height: 1.5;
    }
        
.amenity-orange::after{content:"";
    background: #F58021 !important;}
        
        .amenity-orange {
           /*background: #F58021;*/
            color: #222223;
        }
        .amenity-orange .amenity-title {
            color: #222223;
        }
        .amenity-orange .amenity-desc {
            color: #222223;
        }


.gallery,.locations{background: #222223;    justify-content: center;
    display: flex;}

.gallery .sub-head, .gallery .sec-head,.gallery p,.locations .sec-head{color:#fff;}
.gallery .sub-head::before,.location .sub-head::before{background: #F58021;}

.gallery .cta-btn{
    background: #fff;
    color: #222223;}

.gallery .header-section{padding-bottom:4%;}

.gallery .custom-nav,.amenities .custom-nav{display: flex;
    gap: 10px;
    justify-content: flex-end;
    padding-top: 20px;}
.gallery .custom-nav button,.amenities .custom-nav button{
    background: transparent;cursor:pointer;
    border: none;}



.gallery .owl-carousel{position:relative;}
/*.gallery .owl-carousel::before{content: "";*/
/*    position: absolute;*/
/*    left: 0;*/
/*    display: flex*/
/*;*/
/*    width: 50px;*/
/*    height: 100%;*/
/*    top: 0;*/
/*    z-index: 1;*/
/*    background: linear-gradient(180deg, #222223 11.87%, rgba(0, 0, 0, 0) 100%);}*/
/*.gallery .owl-carousel::after{content: "";*/
/*    position: absolute;*/
/*    right: 0;*/
/*    display: flex*/
/*;*/
/*    width: 50px;*/
/*    height: 100%;*/
/*    top: 0;*/
/*    z-index: 1;*/
/*    background: linear-gradient(180deg, #222223 11.87%, rgba(0, 0, 0, 0) 100%);}*/


section{overflow:hidden;}


section.location{    display: flex;
    justify-content: center;   background-image: url(https://socialgrid.club/landing-page/social-grid/assets/img/line-bg.png);
    background-size: cover;}
section.location .fixed{flex-direction:column;}





section.terms-section{    display: flex;
    justify-content: center;   background-image: url(https://socialgrid.club/landing-page/social-grid/assets/img/t-and-c-bg.webp);
    background-size: cover;padding:10% 5%;}


section.contact-section{background-image: url(https://socialgrid.club/assets/img/contact-bg.png);    background-size: cover;}



section.location .locations-row{    display: flex;
    padding-top: 4%;
    gap: 4rem;}


section.location .location-card{
display: flex;flex-direction: column;
    gap: 1rem;flex-basis: 33.33%;}

section.location .location-card .location-header{    display: flex
;
    align-items: center;
    gap: 15px;position:relative;z-index:1;}

section.location .location-card .location-address{
    padding-bottom: 1rem;line-height:1.5;position:relative;z-index:1;}


section.terms-section .sec-head{color:#fff;}


section.terms-section .terms-content{max-width:900px;}

section.terms-section .terms-content ul{display: grid
;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    font-size: 1.125rem;
    color: #fff;
    line-height: 1.5;
    padding-left: 0;
    padding-top: 1rem;}

section.terms-section .terms-content ul li{display:flex;gap:10px;align-items:flex-start;}

section.terms-section .terms-content ul li::before{    content: "";
    background: #F58021;
    display: block;
    height: 16px;
    width: 16px;
    min-width: 16px;
    margin-top: 5px;}
section.terms-section{position:relative;}

section.terms-section::before{    content: "";
    background: linear-gradient(111deg, #222223 53.47%, rgba(0, 0, 0, 0) 100%);
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.amenity-orange img{border-bottom: 1px solid #fff;
    width: calc(100% + 30px);
    margin-left: -15px;}

.amenities .p-right,.location .p-right{    position: absolute;
    right: 3%;
    top: 20%;
    z-index: -1;
}

.amenities .b-left{    position: absolute;
    left: 3%;
    bottom: 50%;}


.gallery .p-left{    position: absolute;
    left: 2%;
    bottom: 45%;}

.gallery .b-right{    position: absolute;
    right: 2%;
    bottom: 16%;}

footer{  background: #222223;
    padding: 20px 5%;
    display: flex;
    justify-content: center;
    box-sizing: border-box;}


footer a{    display: flex
;
    align-items: center;
    gap: 16px;
    color: #222223;
    text-decoration: none;
    font-weight: 500;
}
.gallery .lines{    position: absolute;
    left: 0;
    bottom: 0;}
    
     section{
    background-repeat: no-repeat;}
    
    
.video-content .cta-btn{
        color: #222223;
    background: #fff;}
   
   
   .mobile{display:none !important;}
    
    
    .thank-you{min-height:90vh;}
     .thank-you .container{
       display: flex;
    flex-direction: column;
    gap: 0;    position: relative;
    z-index: 1;
    align-items: center;
    color: #fff; text-align: center;
     }
    
    
    .thank-you .cta-btn{color: #222223;
    background: #fff;}
    
    .thank-you .icon{padding-bottom:1rem;}
    
    section.banner{ position: relative;
  width: 100%;
  height: 100vh; /* full screen */
  overflow: hidden;}
    
    .video-banner video {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  object-fit: cover; /* IMPORTANT */
  transform: translate(-50%, -50%);
  z-index: -1;
}
      .hide{display:none !important;}
    
    
    
    header .header-cta{    display: flex;
    align-items: center;
    gap: 1.5rem;
    box-sizing: border-box;}
    
    header .header-cta .nav{display: flex;
    margin: 0;
    gap: 1.5rem;
    align-items: center;
    list-style: none;
    color: #222223;}
    
    header .header-cta .nav a{
    color: #222223;
    text-decoration: none;
    font-weight: 500;
    font-size: 18px;}
    
    
    
    
    
    
    .accordion {
     margin: 0px auto;
    width: 100%;
}

.accordion-item {
  border-bottom: 1px solid #333;
}

/* HEADER */
.accordion-header {
  width: 100%;
  background: #1b1b1b;
  color: #fff;
  padding: 18px 24px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border: none;
  cursor: pointer;
}

.accordion-header .title {
     font-weight: 600;
    display: flex;
    align-items: baseline;
    gap: 10px;
    font-size: 22px;
    color: #868686;
}

/* ARROW */
.accordion-header .arrow {
   transform: rotate(180deg);
}

.accordion-item.active .arrow {
  transform: rotate(0deg);
}

/* CONTENT (SMOOTH ANIMATION) */
.accordion-content {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows 0.45s ease;
  background: #111;
}

.accordion-item.active .accordion-content {
  grid-template-rows: 1fr;
}

.content-inner {
  overflow: hidden;
  padding: 0 24px 0px;
  color: #222223;background:#fff;
}


#locations p{color:#222223}


/* INNER CONTENT */
.sports {
  margin: 16px 0;
  line-height: 1.6;
}

.actions {
  display: flex;
  gap: 24px;
}

.actions a {
  color: #ff6a00;
  text-decoration: none;
  font-weight: 600;
}


 .accordion-item .content-inner .inner-title{    display: flex;
    gap: 8px;
    font-size: 22px;
    font-weight: 500;}

 .accordion-item .content-inner strong.available{
    font-weight: 600;
    font-size: 20px;
    border-bottom: 1px solid #B5B5B5;
    padding-bottom: 4px;}


 .accordion-item .content-inner p.sports{
    display: flex;
    flex-direction: column;
    gap: 15px;}
    
 .accordion-item .content-inner{ transition:0.5s all linear;   display:flex; gap: 2rem;    justify-content: space-between;}      
    
  .accordion-item.active .content-inner{    padding: 25px 24px 25px;}  
   
   
    .accordion-item.active .content-inner .cta-btn{padding-left:0px;}
    
    
    .accordion-item.active .title{opacity:0;}
    
    
    .flex-60{flex-basis:60%;}
    .flex-40{flex-basis:40%;}
    
    
    section.gal .flex-40{display: flex;
    flex-direction: column;
    gap: 20px;
    justify-content: flex-end;
    align-items: flex-end;}
    
    
    .gallery.gal .cta-btn {
    background: transparent;
    color: #fff;
}
    
    
    .contact-section {
  padding: 0px 0;
  background: #fff;
}

.contact-wrapper {
  max-width: 100%;
  margin: auto;
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 40px;
    align-items: flex-start;
}

/* Left panel */
.contact-info {
  background: #ff7a00;
  color: #fff;
  padding:10% 10% 10% 15%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.contact-info .sec-head {
  color: #fff;
    padding-bottom: 25px;
}

.contact-item {
  display: flex;
  align-items: center;
  margin-bottom: 15px;
  font-size: 16px;
}

.contact-item .icon {
  margin-right: 10px;
}

.contact-info a {
  color: #fff;
  text-decoration: none;    font-size: 24px;
    font-weight: 500;

}

/* Form */
.contact-form {
padding: 5%;
    max-width: 800px;;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

.form-group {
  display: flex;
  flex-direction: column;
  margin-bottom: 20px;
}

.form-group.full {
  grid-column: span 2;
}

.form-group label {
    font-size: 16px;
    margin-bottom: 6px;
    color: #222223;
    font-weight: 500;

}

.form-group input,
.form-group textarea {
     padding: 15px;
    font-size: 16px;
    outline: none;
    border: 1px solid #E0E0E0;
    border-radius: 2px;
    margin-top: 10px;
}

.form-group input::placeholder,
.form-group textarea::placeholder {color: #E0E0E0;font-size: 16px;font-weight:500;font-family: "Barlow", sans-serif;
}


.form-group textarea{font-family: "Barlow", sans-serif;}


.form-group textarea {
  resize: none;
  height: 80px;
}

.submit-btn {
  background: #111;
  color: #fff;
  border: none;
  padding: 12px 24px;
  font-size: 14px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.contact-form .s-btn{    align-items: flex-start;}


.submit-btn span {
  font-size: 16px;
}



footer p{    color: #fff;
    font-size: 0.8rem;
    position: relative;
    z-index: 1;}

footer .fixed{    justify-content: space-between}


.cta-btn{    outline: none;
    border: none;}


.privacy{    background: #000;
    display: flex;
    align-items: center;
    box-sizing: border-box;
    justify-content: center;}

.privacy .container{    max-width: 1280px;
    padding-top: 70px;    width: 100%;}

.privacy .container h1{    color: #fff;
    font-size: 40px;
    padding-bottom: 1.5rem !important;}

.privacy .container h2{    color: #fff;
    padding-bottom: 10px !important;    padding-top: 1rem !important;
}

.privacy .container p{    color: #fff;
    font-weight: 300;
    font-size: 1rem;    padding-bottom: 0.75rem !important;}


.privacy .container ul{
color: #fff;
    margin: 0;
    padding-left: 25px;    padding-bottom: 0.5rem;}


.privacy .container ul li{    font-size: 1rem;
    padding-bottom: 0.5rem;
    font-weight: 300;}


footer .privacy-footer{    color: #Fff;
    display: flex;
    gap: 10px;font-weight: 300;
    box-sizing: border-box;
}


footer .privacy-footer a{    color: #fff;
    font-size: 0.8rem;
    font-weight: 300;}


.inner-page.kormangala{
    background-image: url(assets/img/banner-image-kor.png);
    background-repeat: no-repeat;
    background-size: cover;
}


.inner-page.kormangala h2{font-size:var(--f-60-30) !important;line-height:1.4;}
#koramangala-listing{background-image:unset !important;}

.loc-img::before{display:none;}
#koramangala-listing .loc-img{gap: 1.5rem;}

#koramangala-listing .header-section{    border-bottom: 1px solid #D9D9D9;
    padding-bottom: 4%;}



#koramangala-listing .listing-row{    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 3rem;
      padding-top: 3%;
    width: 100%;
    border-bottom: 1px solid #D9D9D9;
    padding-bottom: 3%;}

#koramangala-listing .listing-row .item{    display: flex;
    flex-direction: column;
    gap: 1rem;
    box-sizing: border-box;}


#koramangala-listing .listing-row .item h3{font-size:var(--f-22-20);}
#koramangala-listing .listing-row .item h3::before{content: "";
    background: #F58021;
    display: block;
    width: 40px;
    height: 40px;    border-radius: 2px;}

#koramangala-listing .listing-row .item .i-head{display: flex;
    align-items: center;
    gap: 0.75rem;}


#koramangala-listing .listing-row .item .i-img{    width: 100%;
    height: auto;}
#koramangala-listing .listing-row .c-sec{padding-top:0px;}


#koramangala-listing .map-sec{    padding-top: 4rem;}
#koramangala-listing .map-sec p{padding-top:1.25rem !important;}

.inner-page .left{padding:5%;}


/* Responsive */
@media (max-width: 768px) {
  .contact-wrapper {
    grid-template-columns: 1fr;
  }

  .form-row {
    grid-template-columns: 1fr;
  }

  .form-group.full {
    grid-column: span 1;
  }
}

    
    
    
    
    
    @media screen and (max-width: 781px) {
        
        
        header{        padding: 10px 5%;
        margin: 0;
        background-color: #fff;
        border-radius: 0px;
        width: 100%;}
     
     
       header img.logo{max-width:63px;height:auto;}
       header .cta{display:none;}
        .banner .s-head{font-size:20px;}
      .banner p,p{    font-size: 16px;
    line-height: 1.5;}  
     
     .banner .content{flex-direction:column;    gap: 2rem;}
     .banner .round-btn{display:none;}
     
     .banner .right .register-form h2{font-size:22px;}
     .cta-btn{padding:10px;}
     section.clinic-section div.fixed {
    flex-direction: column;
    gap: 2rem;}
     
     .clinic-image img{width:100%;height:auto;}
     section.clinic-section {
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 100% 70%;
}
     .cta-btn img{max-width:21px;height:auto;}
     
        
    .video-content{    flex-direction: column;
  gap: 1.5rem;
    justify-content: flex-start;}    
    
        
   .video-content .img-container{    display: flex;
    align-items: center;
    justify-content: flex-end;
    position: relative;}
    .video-content .img-container img{max-width: 70px;
    height: auto;
    position: absolute;
    top: -70px;}    
        
     .video-banner{min-height:80vh;}   
        
        
    .header-section{    flex-direction: column;
    justify-content: flex-start;    gap: 1rem;}    
    .flex-50{width:100%;}    
    .amenities-row{gap:2.5rem;grid-template-columns: 1fr;}
        
        .amenities .b-left {
    left: unset;
    bottom: unset;
    top: 20px;
    right: 3%;
    max-width: 45px;
}



section.amenities .fixed{gap:1rem;}
.amenities .p-right{max-width:80px;top:40%;}

section.amenities{background-image:unset;}

section {
    padding: 10% 5%;}



.gallery .owl-carousel::before,.gallery .owl-carousel::after{display:none;}

.gallery .p-left,.gallery .b-right,.gallery .lines{display:none;}

section.amenities .fixed, .gallery .fixed {
    flex-direction: column;
    gap: 1rem;
}

.gallery .custom-nav{justify-content: space-between;        padding-top: 10px;}
.gallery .custom-nav button img{
    max-width: 50px;
    height: auto;}

section.location{background-size:contain;}
.sub-head::before{height:14px;width:14px;}

section.location .fixed {
    flex-direction: column;
    gap: 1.5rem;
}

section.location .locations-row {
    padding-top: 4%;
    gap: 2.5rem;
    flex-direction: column;
}

section.location .location-card .location-header{gap:10px;}
section.location .location-icon img{ 
    max-width: 30px;
    height: auto;}


section.terms-section .terms-content ul{    margin: 0;
    grid-template-columns: 1fr;
    gap: 1rem;
    font-size: 16px}



section.terms-section .terms-content ul li::before{width:14px;height:14px;}

.gallery .owl-carousel .owl-stage-outer{overflow:visible !important;}

/*.gallery .owl-carousel .owl-stage-outer .owl-stage{*/
/*    max-width: 80%;}*/




section.terms-section {
    min-height: 100vh;
    background-position: 65% 100%;
    background-size: cover;
    background-repeat: no-repeat;
}

section.terms-section::before{background: linear-gradient(180deg, #222223 11.87%, rgba(0, 0, 0, 0) 100%);}

footer .fixed{    flex-direction: column;
    gap: 1.5rem;}


footer .footer-icon img{max-width:32px;height:auto;}
footer a{gap:10px}

    footer .fixed {
        flex-direction: column;
        gap: 1rem;
    }
      
      
   .gallery{overflow:hidden;}   
      
      
      
      
      
   .mobile{display:flex !important;}   
      
    .mobile a{        background: #1b1b1b;
        position: unset;
        bottom: 0;
        color: #222223;
        width: 100%;
        justify-content: center;
        padding: 15px 0px;
        box-sizing: border-box;
        font-size: 1rem;
        font-weight: 600;
        z-index: 9999;
        gap: 0.5rem;
        display: flex;
        padding: 10px 15px;
        color: #fff;
        text-decoration: none;}  
      
  footer{padding-bottom:90px;}    
      
      
      header .header-cta .nav{position: fixed;
        left: 0;
        width: 100%;
        height: 100vh;
        background: #fff;
        top: 0;
        padding: 10% 5%;
        box-sizing: border-box;
        display: flex;
        flex-direction: column;
        align-items: baseline;
        transition: 0.5s all linear;
        transform: translateX(150vw);}
        
        
        header .header-cta .nav.open{transform: translateX(0vw);}
        
        
      
      #locations .header-section {
    align-items: baseline;
}
      
      .accordion-item .content-inner{flex-direction:column;        gap: 20px;}
        
        
    #locations .actions {
   
    flex-direction: column;
    gap: 0;
}    
        
        .accordion-header .title{font-size:20px;}
        
        
        #gallery .sec-head{padding-top:10px;}
        
        section.gal .flex-40 {
    gap: 10px;
    align-items: normal;
}
        
        
         #gallery  .c-sec{padding-top:0px;}
        
        .contact-info{    padding: 10% 5% 10% 5%;}
        
        .contact-info a{font-size:20px;}
        
        .form-row{gap:10px;}
        
        .contact-wrapper{gap:1rem;}
        
        
        footer .fixed {

        align-items: center;
    }
        
        
        footer p{text-align:center;}
            footer {
        padding-bottom: 20px;
    }
        
        
    section.contact-section{background-image:unset;}    
    
    .privacy .container h1 {
    font-size: 32px;
    padding-bottom: 0.75rem !important;
}


.privacy .container h2 {
    font-size: 1.25rem;
}
    
    .close-icon{display: flex;
    width: 100%;
    justify-content: end;
    box-sizing: border-box;}
    
    
    
    .inner-page{    height: unset !important;
    min-height: 80vh;}
    
    
    #koramangala-listing .loc-img {
    gap: 1rem;}
    
    
    #koramangala-listing .listing-row {
    grid-template-columns: 1fr;        border: unset;}
    
    
    #koramangala-listing .listing-row .item h3::before{height:30px;width:30px;}
    
    #koramangala-listing .map-sec {
    padding-top: 1rem;}
    
    
    .inner-page.kormangala h2 br,#koramangala-listing .map-sec p br{display:none;}
    .inner-page.kormangala{background-position:center;}
        
    }
    
    
    .tab-menu{
        display:none;
        flex-direction:row;
        gap:1rem;
        flex-wrap:wrap;
        margin: 0;
    }
    
    .appointment-page .tab-menu.active,  .schedule-page .tab-menu.active{
      display: flex;
  
    list-style: none;
   
    }
    
    body:has(.tab-menu.active) #studioyou-embed{
        padding-top:0 !important;
        
    }
    
    .tab-menu a{
       padding: .5rem 1rem 1.5rem 1rem;
        background: #FFF;
        color: #000;
        text-decoration: none;
        display: block;
        position:relative;
        text-align: center;
       
    }
    .tab-menu a.active::after {
        content: "";
        display: block;
        position: absolute;
        height: 2px;
        width: 100%;
        background: #000;
        bottom: 0;
        left: 0;
    }
    .tab-menu-row{
        display:flex;
        flex-direction:row;
        padding: calc(var(--header-height) + 2rem) 0 0;
        box-shadow: 0px 0px 4px 0px #0004;
        background: #FFF;
        margin-bottom: 1rem;
        position: sticky;
    top: 0;
        
    }
    
    
    
    .custom-select {
  position: relative;
  width: 250px;
  font-family: Arial;
}

.select-trigger {
    display: flex;
    cursor: pointer;
    background: #fff;
    border-radius: 6px;
    padding: .5rem 1rem;
    flex-direction: row;
    flex-wrap: nowrap;
    gap: 1rem;
    align-items: center;
    font-weight: 600;
        border-right: 2px solid #000;
    border-radius: 0;
    justify-content:center;
}
.select-trigger::after{
    content:url(https://socialgrid.club/assets/img/dropdown.png);
    display:block;
    
}

.options {
  display: none;
  position: absolute;
  width: 100%;
  border: 1px solid #ddd;
  border-radius: 6px;
  margin-top: 5px;
  list-style: none;
  padding: 0;
  background: white;
  box-shadow: 0 4px 10px rgba(0,0,0,0.1);
  z-index: 100;
}

.options li {
  padding: 10px;
  cursor: pointer;
  transition: 0.2s;
}

.options li:hover {
  background: #f0f0f0;
}

.options li.selected {
  background: #e3f2fd;
}

    
    
    
    
    
    
    
    @media screen and (max-width: 781px) {
       .tab-menu{
           gap:.5rem;
           padding-left:0;
       }
        .tab-menu a{
            padding: .5rem .75rem;
            display:block;
        }
        .appointment-page .tab-menu.active,  .schedule-page .tab-menu.active{
           margin-bottom: 0;
        
        }
        
        .tab-menu-row{
            flex-direction: column;padding-top:80px;
        }
        .custom-select{
            
            border-bottom: 2px solid #000;
            width: 100%;
        }
        .select-trigger {
            width:100%;
            box-sizing: border-box;
            border-right:none;
        }
        
        .has-submenu{flex-direction: column !important;        align-items: flex-start !important;}
        .submenu{        min-height: unset !important;
        border-radius: 0 !important;
        border: none !important;
        padding-left: 5px !important;}
    }