@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Rubik+Mono+One&display=swap');

:root {
  --white-color: #fff;
  --black-color: #000;
 }

body {   font-family: "Inter", sans-serif; font-size: 18px; font-weight: 400; color: var(--black-color)000; overflow-x: hidden; background-color: var(--white-color); }

h2 {   font-family: "Anton", sans-serif; font-size: 80px; font-weight: normal; }
h3 { font-size: 42px; font-weight: normal; }
h4 {   font-family: "Anton", sans-serif; font-size: 38px; font-weight: normal; }

.Rubik-font {font-family: "Rubik Mono One", monospace;}
.Anton-font {font-family: 'Anton'; }

p.font-24 {    font-size: 24px;}
p.font-14 { font-size: 14px; }
p.font-12 { font-size: 12px; }

img { max-width: 100%; height: auto; }

.button-black-60 ,
.button-black-50 {
    background-color: var(--black-color);
    border-radius: 3px;
    color: var(--white-color) !important;
    text-decoration: none;
    line-height: 60px;
    padding: 0 30px;
    display: inline-block;
    font-size: 18px;
    font-weight: 500;
}
.button-black-60:hover, .button-black-50:hover {
    background-color: #333;
}
.button-black-50 {    line-height: 50px;    font-size: 16px;    font-weight: 400;}

.button-white {    background-color: var(--white-color);    color: var(--black-color) !important;}
.button-white:hover {    background-color: #ffcd18;}

a.link-underline {    text-decoration: underline;    font-size: 18px;    color: var(--black-color);}
.container-fluid {    padding-left: 50px;    padding-right: 50px;}

/*site header*/ 
header.site-header .container-fluid {    display: flex;    align-items: center;}
header.site-header .header-right {    margin-left: auto;}
nav.navigation ul.main-menu {    display: flex;    align-items: center;    gap: 74px;    margin: 0;    padding: 0;    list-style: none;}
nav.navigation ul.main-menu a {    text-decoration: none;    color: var(--black-color);    text-transform: capitalize;    font-weight: 500;}
nav.navigation {    margin-left: 74px;}
header.site-header {    background-color: var(--white-color);    box-shadow: 0 4px 13.5px rgba(0,0,0,.25);    padding: 15px 0;      font-size: 16px;      position: relative;z-index: 9;}
a.signin-header {    color: var(--black-color);    font-weight: 500;    padding: 0 35px;    line-height: 50px;    display: inline-block;    border-radius: 3px;}
a.signin-header:hover {    background-color: #f7f7f7;}
/*site header end*/ 


/*hero design*/
.hero-common {   width: 100%; position: relative;  border-bottom: 34px solid black }
.location-hero-box {
    display: inline-block;
    background-color: var(--white-color);
    border-radius: 23px;
    padding: 46px;
    width: 370px;
    max-width: 100%;
    box-shadow: 0 0 8.29px rgba(0,0,0,.25);
    position: absolute;
    left: 250px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 9;
}
.location-hero-box h4 {    text-transform: uppercase;    line-height: 106%;    margin: 0 0 15px 0;}
form.location-hero {    font-size: 16px;    font-weight: 400;}
form.location-hero input {    background-color:  var(--white-color); color: var(--black-color) !important; height: 50px;    width: 100%;    display: inline-block;    border: 1px solid var(--black-color);    border-radius: 3px;    box-shadow: none;    padding: 0 10px 0 40px;    font-weight: 400; outline: none;}
.location-field {    position: relative;    display: inline-block;    width: 100%;}
.location-field svg {    position: absolute;    left: 15px;    top: 14px;}
button.search-button {    width: 100%;    margin-top: 20px;    border: 0;    font-size: 18px;}
form.location-hero label {    margin-bottom: 6px;}
.next-section-btn {    position: absolute;    bottom: -59px;    left: 0;    right: 0;    text-align: center;}


.hero-image-1 {height: calc(100vh - 114px);    width: 100%; overflow: hidden; vertical-align: middle;}
.hero-inner, .hero-inner img { height: 100%;    width: 100%;       object-fit: cover;}
.hero-text-01 {    position: absolute;    top: 50%;    transform: translateY(-50%);    right: 15%;    text-align: center;}
.hero-text-01 h1 {    font-size: 100px;    letter-spacing: -5px;    line-height: 90px;    margin-bottom: 30px; transition: transform .3s ease;}
.hero-text-01 h1 span {    font-size: 120px;    letter-spacing: normal;}
.hero-text-01 h1:hover { transform: rotateX(5deg) rotateY(-5deg); }

.hero-pic-01 {  animation: zoomHero 12s ease-in-out infinite;  overflow-x: hidden;}
@keyframes zoomHero {
  0% {    transform: scale(1);  }
  50% {    transform: scale(1.13); /* Zoom In */  }
  100% {    transform: scale(1); /* Zoom Out */  }
}

@media (min-width: 768px) and (max-width: 2500px) {
.hero-text-01 h1 {    font-size: 5vw;    letter-spacing: -0.3vw;    line-height: 5vw;    margin-bottom: 2vw;}
.hero-text-01 h1 span {    font-size: 5.8vw;    letter-spacing: normal;}
.hero-text-01 p {    font-size: 1vw;}	
}
@media (max-width: 1199px) {
.location-hero-box {    left: 30px;}
}
@media (min-width: 768px) and (max-width: 991px) {
  
.hero-text-01 {    right: 5%;}
.hero-text-01 h1 {    font-size: 6vw;    line-height: 6vw;}
.hero-text-01 h1 span {    font-size: 6.7vw;}
.hero-text-01 p {    font-size: 1.5vw;}
}
.break_line{
  width: 56%;
}
 .ga_bar_remove{
        border-bottom: 0px solid black;
  }
   .next-section-btn-green{
    display: none !important;
  }
@media (max-width: 767px) {
  .ga_bar_remove{
        border-bottom: 0px solid black;
  }
  .break_line{
  width: 100%;
}
  .hero-text-03 h4{
    font-size: 19px !important;
    font-weight: 300 !important;
  }
  .next-section-btn{
    display: none !important;
  }
  .next-section-btn-green{
    display: inline !important;
  }
  .next-section-btn-show{
    display: inline !important;
    top:100% !important;
            transform: translatey(-50%);
  }
    .hero-image-1 { min-height: 100vh; }
	.hero-inner ,	 .hero-inner img {    position: relative;    display: inline-block;    vertical-align: middle;}
.location-hero-box {
    position: static;
    background-color: #CAFE48;
    border-radius: 0;
    box-shadow: none;
    transform: none;
    width: 100%;
    min-height: calc(100vh - 60px);
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: center;
    text-align: center;
}
img.form-dotpic {    width: 90px;    margin-bottom: 25px;}
.location-hero-box h4 {    margin-bottom: 40px;}
form.location-hero input {    border: 0;    box-shadow: 2px 2px  6px  rgba(0,0,0,16%);}
button.search-button {    margin-top: 30px;}
.hero-text-01 {    left: 0;    right: 0;    padding: 0 30px;}
.hero-text-01 h1 {    font-size: 56px;    line-height: 50px;}
.hero-text-01 h1 span {    font-size: 60px;}
.hero-text-01 p {    line-height: normal;    font-weight: 500;    font-size: 18px;}
.hero-text-01 p br {    display: none;}
}
/*hero design*/


.lefthand-gaint {    background-color: #3EB3FF;    padding: 50px 0;}
.venu-col {    display: inline-block;    float: right;    position: relative;    margin-right: 30px;}
.venu-col img ,.got-af-menu::before, .got-af-menu::after  {    animation: spin 150s linear infinite;    transform-origin: center;}

@keyframes spin {
  from {    transform: rotate(0deg);  }
  to {    transform: rotate(360deg);  }
}
.venu-col h2 {    font-size: 87px;        text-align: center;    letter-spacing: -5px;    line-height: 80px;    position: absolute;    top: 50%;    transform: translateY(-50%);}
.venu-col h2 span {    font-size: 93px;    letter-spacing: normal;}

.container-1000 {    max-width: 1000px;}

.sober-story h2 span {    font-size: 60px;}
.sober-story h2 {    line-height: 60px;    margin-bottom: 15px;}
.sober-story h6 {    background-color: var(--black-color);    display: inline-block;    color: var(--white-color);    padding: 5px 10px;    font-size: 16px;    font-weight: 500;    letter-spacing: normal;    margin-bottom: 15px;}
.sober-story {    padding-top: 130px;    padding-bottom: 100px;}
.sober-story-pic {    padding-right: 20px;    display: inline-block;    width: 100%;}

.report-box {    display: flex;    align-items: center;    gap: 30px;}
.percent-report {    font-size: 100px;    line-height: 90px;    letter-spacing: -8px;}
.percent-report sup {    top: -29px;    font-size: 60px;}
.club-report {    display: flex;    justify-content: flex-end;    width: 100%;    position: relative;}
.report-box {    display: flex;    align-items: center;    gap: 30px;    padding-right: 100px;    padding-left: 60px;    padding-bottom: 10px;    padding-top: 40px;z-index: 10;}
.club-report img {    position: absolute;    right: 0;    bottom: 0;    z-index: 0;}

.got-af-menu span.Anton-font {    display: block;    font-size: 78px;}
.got-af-menu h3 {    line-height: 57px;}
.got-af-menu {    background: #0018CB;    color: var(--white-color);    padding: 60px 0;    position: relative;    overflow: hidden;}
.got-af-menu::before ,
.got-af-menu::after {
    content: "";
    display: inline-block;
    width: 450px;
    height: 450px;
    background: url("../images/pink-star-circle.svg");
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: -160px;
    left: -14px;
}
.got-af-menu::after {    left: auto;    right: -90px;    top: auto;    bottom: -190px;}
.got-af-menu .container {    position: relative;    z-index: 9;}
.got-af-menu p {    max-width: 450px;}


.partner-with {    display: flex;    align-items: center;    justify-content: center;    width: 100%;    background-color: var(--black-color);    padding: 10px 0;    gap: 30px;}
.partner-with a {    color: var(--white-color);}


/* site footer */
.footer-left h2.Rubik-font {    font-size: 57px;    letter-spacing: -4px;}
.footer-left h2.Anton-font {    margin: 0;    line-height: 70px;}
form.newsletter {    display: flex;    align-items: flex-start;    width: 100%;    margin-bottom: 25px;    margin-top: 20px;}
form.newsletter input[type="email"] {    border: 0;    border-bottom: 1px solid var(--black-color);    border-radius: 0;    box-shadow: none;    outline: none;    height: 45px;    width: calc(100% - 170px);    margin-right: auto;}
button.subscribe-btn {    border: 1px solid var(--black-color);    background-color: var(--white-color);    border-radius: 3px;    line-height: 45px;    padding: 0 18px;}
button.subscribe-btn:hover {    background-color: var(--black-color);    color: var(--white-color);}
footer.site-footer {    padding: 60px 0 60px 0;}
.footer-right {    max-width: 500px;    margin-left: auto;}
.footer-gallery {    display: flex;    align-items: center;    gap: 20px;    margin-bottom: 50px;}
.footer-gallery img { width: 104px; height: 104px; object-fit: cover; }
ul.footer-links {    display: inline-block;    width: 100%;    padding: 0;    margin: 0;}
ul.footer-links li { list-style: none; padding: 0px; margin: 0px; }
ul.footer-links a {    display: inline-block;    width: 100%;    color: var(--black-color);    text-decoration: none;    margin-bottom: 15px;}
ul.footer-links a:hover {    text-decoration: underline;}
.footer-socials strong {    font-weight: 600;    display: block;    margin-bottom: 15px;}
.footer-socials a {    display: flex;    align-items: center;    gap: 10px;    color: var(--black-color);    text-decoration: none;    margin-bottom: 15px;}
.footer-socials svg {
    width: 22px;
    height: 22px;
}
/* site footer end*/

.be-hero {    background-color: #FFCD18;    text-align: center;    padding: 20px 20px 80px 20px;}
.double-section {    padding: 60px 0;}
.double-text {    max-width: 311px;    margin: 0 auto;}
.be-hero-title { min-height: 500px;    display: flex;    align-items: center;    justify-content: center;  width: 100%;    text-align: center;    position: relative; }
.be-hero-title img {    position: absolute;    top: 50%;    transform: translateY(-50%);    left: 0;    right: 0;    margin: 0 auto;}
.be-hero-title h2 {    font-size: 100px;    line-height: 120px;    position: relative;}
.be-hero-title h2 span {    font-size: 180px;}
.be-hero-title.spill-hero-title span {    font-size: 140px;}
.be-hero.spill-hero {    background: url("../images/spill.jpg");    background-size: cover;    background-position: center center;}

.double-text p {    margin-bottom: 30px;}


.menu-toggle ,
.hide-desktop ,
.close-menu,.show-mobile-dark {display: none;}

.mobile-logo-dark, .mobile-logo-light { display: none; }
.mobile-logo-dark, .mobile-logo-light { width: 150px; }

.got-af-menu h3 strong {    font-weight: normal;}

.next-sec-btn{   
    display: none;
}


@media (max-width: 1399px) {
h2 {    font-size: 70px;}
.venu-col h2 {    font-size: 80px;}
.venu-col h2 span {    font-size: 84px;}
h3 {    font-size: 36px;}
.got-af-menu span.Anton-font {    font-size: 70px;}
.footer-left h2.Rubik-font {    font-size: 48px;    letter-spacing: -3px;}
.be-hero-title h2 {    font-size: 85px;    line-height: 115px;}
.be-hero-title h2 span {    font-size: 162px;}
.be-hero-title.spill-hero-title span {    font-size: 126px;}

}

@media (max-width: 1199px) {
h2 {    font-size: 60px;}
h3 {    font-size: 30px;}
.got-af-menu span.Anton-font {    font-size: 60px;}
.footer-gallery img {    height: auto;    aspect-ratio: 1/1;    width: calc(25% - 15px);}
}

@media (max-width: 991px) {
nav.navigation ul.main-menu {    gap: 50px;}
.button-black-60, .button-black-50 {    line-height: 50px;    padding: 0 20px;    font-size: 16px;}
.be-hero-title h2 {    font-size: 61px;    line-height: 80px;}
.be-hero-title h2 span {    font-size: 115px;}
.be-hero-title.spill-hero-title span {    font-size: 86px;}
.be-hero-title {    min-height: 350px;}
.venu-col h2 {    font-size: 65px;    line-height: 63px;}
.venu-col h2 span {    font-size: 70px;}
body {    font-size: 16px;}
h3 {    font-size: 22px;}
.got-af-menu span.Anton-font {    font-size: 48px;}
.got-af-menu h3 {    line-height: 40px;}
.footer-right {    max-width: 100%;    margin-top: 60px;}
}

@media (max-width: 767px) {
.container, .container-sm {    max-width: 100%; width: 375px;    padding-left: 30px;    padding-right: 30px;}
.double-section .container {
    width: 100%;
}

.double-section {    padding: 0;}
.double-section .container, .double-section .container .row ,
.double-section .col-sm-12 {    margin: 0;    padding: 0;}
.double-text a.button-black-60 {    width: 100%;}

.header-right {    display: none;}

.be-hero-title h2 span {    display: block;}
.be-hero-title img {    width: 220px;}
.be-hero {    min-height: 100vh;    display: flex;    flex-direction: column;    justify-content: center;}

.venu-col {    margin: 0 auto;    display: block;    width: 100%;    text-align: center;}
.venu-col h2 {    font-size: 55px;    line-height: 54px;}
.venu-col h2 span {    font-size: 57px;}
.venu-col img {    width: 240px;}

.lefthand-gaint {    min-height: 100vh;    display: flex;    align-items: center;}
.lefthand-col { text-align: center; }
.lefthand-col h2 {    text-align: center;    font-size: 46px;    letter-spacing: normal;    margin-top: 20px;}
.lefthand-col p br {    display: none;}
.lefthand-col a.button-black-60 {    max-width: 300px;    width: 100%;}

.sober-story {    padding: 40px 0px;}
.sober-story-pic {    padding: 0;    margin-bottom: 30px;}
.sober-story h2 span {    font-size: 40px;    display: block;    margin-top: 10px;}
.sober-story h2 {    line-height: 40px;    margin-bottom: 15px;}
.sober-story h6 {    padding: 3px 10px;    font-size: 13px;}
.sober-story p.font-24 {    font-weight: 700;    line-height: normal;    font-size: 22px;}
.sober-story-pic img {
    width: 100%;
}

.report-box {
    flex-direction: column;
    text-align: center;
    padding: 0 0;
    width: 100%;
    gap: 0;
    background: url("../images/yellow-report-mobile.svg");
    background-position: center 10px;
    background-size: 94% 100%;
    background-repeat: no-repeat;
    padding-top: 30px;
    z-index: 10 !important;
}
.percent-report {    font-size: 80px;}
.percent-report sup {    font-size: 50px;}
.club-report img {    display: none;}
p.font-14 {    font-size: 12px;}
.report-data p {    margin: 0;    line-height: normal;}
.report-data p.font-14 {    margin-top: 5px;    margin-bottom: 15px;}
.partner-with {    flex-direction: column;    padding: 20px 30px;}
.partner-with a {
    background-color: var(--white-color);
    border-radius: 3px;
    color: var(--black-color);
    text-decoration: none;
    line-height: 50px;
    padding: 0 30px;
    display: inline-block;
    font-size: 16px;
    font-weight: 500;
    width: 100%;
    text-align: center;
    max-width: 315px;
}
.partner-with img {    width: 70px;}

footer.site-footer {    padding: 40px 0 50px 0;}
.footer-left h2.Anton-font {    line-height: 45px;    font-size: 44px;}
.footer-left h2.Rubik-font {    font-size: 29px;    letter-spacing: -3px;    margin-bottom: 30px;}
button.subscribe-btn {    font-size: 0;    border: 0;    position: absolute;    right: 0;    top: 0;    padding: 0;    background-color: transparent;}
form.newsletter input[type="email"] {    width: 100%;    border-bottom-width: 2px;}

button.subscribe-btn span {    font-size: 19px;}
form.newsletter {    position: relative;    margin-bottom: 12px;}
.footer-left p.font-12 {    color: #959393;    font-size: 10px;    line-height: normal;}
.footer-menu, .footer-socials {    width: 50%;}
.footer-socials strong {    display: none;}

.container-fluid {    padding-left: 30px;    padding-right: 30px;}
button.menu-toggle {    display: inline-block;    background-color: transparent;    border: 0;    margin-left: auto;}
button.menu-toggle svg {    width: 29px;    height: 30px;}
img.hide-mobile {    display: none;}
 /* img.show-mobile {    display: block;    }
img.show-mobile {    display: none;     }  */

.mobile-logo-light {    display: block; }
.mobile-logo-dark {    display: none; }

/* @media (prefers-color-scheme: dark) {1
  .sitelogo{filter: invert(0);}
img.show-mobile-dark {    display: block;    width: 140px;}
img.show-mobile {    display: none;     width: 140px;}
} */

nav.navigation {
    position: fixed;
    top: 0;
    left: -400px;
    background-color: var(--white-color);
    height: 100%;
    margin: 0;
    width: 300px;
    box-shadow: 0 0 80px rgba(0,0,0,.25);
    padding: 40px;
    transition: 0.3s;
}
nav.navigation.menu-open {
    left: 0;
}
nav.navigation ul.main-menu {
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
}
nav.navigation .header-right {
    display: block;
    border-top: 1px solid #ddd;
    margin-top: 40px;
    padding-top: 10px;
    width: 100%;
}
nav.navigation .header-right a {
    width: 100%;
    text-align: center;
    margin-bottom: 10px;
}
span.close-menu {
    display: inline-block;
    position: absolute;
    right: 0;
    top: 0;
    padding: 0px 10px;
    font-size: 34px;
    font-weight: 300;
    transform: rotate(45deg);
    line-height: 50px;
    cursor: pointer;
}

.got-af-menu {
    min-height: 100vh;
    display: flex;
    align-items: center;
    text-align: center;
}
.got-af-menu a.button-black-60.button-white {
    width: 100%;
    margin-top: 20px;
}
.got-af-menu h3 {
    font-size: 32px;
}
.hide-desktop {
    display: block;
}
.hide-mobile {
    display: none;
}
.got-af-menu h3 strong {
    font-size: 50px;
}
.got-af-menu span.Anton-font {
    font-size: 80px;
    line-height: 69px;
}
span.Rubik-font.got-menu {
    font-size: 56px;
    line-height: 60px;
}
.got-heading {
    margin-bottom: 50px;
}
.got-af-menu::after {
    left: auto;
    right: auto;
    bottom: -280px;
    margin: 0 auto;
    display: block;
    width: 380px;
}
.got-af-menu::before {
    left: -200px;
    width: 400px;
    top: -120px;
}
.got-af-menu .container {
    max-width: 375px;
}
.footer-socials svg {
    width: 20px;
    height: 20px;
}
}

 .manifesto-section h2 {
  forced-color-adjust: none;
}
body {
  background-color: var(--white-color);
  color: var(--black-color);
}
form.newsletter input[type="email"]{
    background-color: var(--white-color);
  color: var(--black-color);
}
.double-section, .sober-story,.club-report,.site-footer{
    background-color: var(--white-color);
}

@media (prefers-color-scheme: dark) {
  .page-main{
    background-color: white;
    color: black;
  }
  .site-header ,nav.navigation ul.main-menu a,.signin-header,.adult-drink-strip{
    /* background-color: #000; */
    color: white !important;
 }
 .site-footer {
  background-color: #222 !important;
  color: white;
 }
 .subscribe-btn{
  background-color: white !important;
  color: #222;
 }
 a.signin-header:hover {    background-color: black;}
 .manifesto-section {
  color: #222 !important ;
 }
 ul.footer-links a ,.footer-socials a, .ga-rubik-font{
    color: white !important ;
 }
 .location-hero-box {    background-color: #f7f7f7 !important; }
 @media (max-width: 767px) {
    .location-hero-box {
        background-color: #CAFE48 !important;
        /* color: var(--white-color); */
        text-align: center !important;
    }
}
/* :root {
  --white-color: #000 ;
  --black-color: #f7f7f7;
 } */
 
 /* .got-af-menu {color: var(--black-color);}
 .report-box  , .hero-text-01 {color: var(--white-color);} */
/* 
 .lefthand-gaint {    background-color: #3EB3FF;    color: var(--white-color);}

.button-black-60, .button-black-50  { filter: invert(1); }
.button-black-60:hover, .button-black-50:hover {color: var(--black-color); background-color:  var(--black-color) ; } */

/* .button-white:hover ,
button.search-button { background-color: var(--black-color)!important; color: var(--white-color) !important; filter: inherit !important; }
.location-field svg { filter: invert(1); } */

/* .be-hero {    background-color: #FFCD18;    color: var(--white-color);   }
.partner-with { background-color: #111;    color: var(--black-color) !important;}
.partner-with a {  color: var(--black-color) !important;} */

/* .footer-socials svg {    filter: invert(1);} */
/* .sitelogo {    filter: invert(1);}
@media (max-width: 767px) {
  .sitelogo {    filter: invert(0);}
} */
.header-right a.join-btn {    filter: none !important;}
.header-right a.signin-header:hover {   color: var(--white-color) !important;}
header.site-header {    background-color: #222;}
/* .partner-with a{
    background-color: #fff !important;
    color: #000 !important;
}  */
}

@media (max-width: 767px) {
  
.hero-cards-images-03{
  padding-top: 10px !important;
}
    .hero-text-03 {
      bottom: 1% !important ;
    }
/* .location-hero-box {    background-color: #CAFE48;   color: var(--white-color);} */

/* form.location-hero input { background-color:  var(--black-color); color: var(--white-color) !important; } */
.location-field svg {    filter: none;}
/* button.search-button { background-color: var(--white-color)!important; color: var(--black-color) !important; } */
button.menu-toggle   { 
  /* filter: invert(1);  */
  font-size: 30px;
}
button.subscribe-btn{
  /* line-height: 35px; */
  max-height: 10px;
  padding-right: 10px;
}

.next-sec-btn{
    display: block;
   animation: updown 2s ease-in-out infinite alternate;
   position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    bottom: 28px;
}
}
@keyframes updown {
  0% {
    transform: translateY(0); /* Start position (bottom) */
  }
  100% {
    transform: translateY(-20px); /* End position (top) */
  }
}




.search-wrapper {
  position: relative;
  width: 520px;
}

.search-box {
  display: flex;
  align-items: center;
  background: white;
  border-radius: 10px;
  padding: 12px 14px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.search-box input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 16px;
  padding: 0 10px;
}

.search-icon {
  font-size: 18px;
  color: #999;
}

.clear-icon {
  cursor: pointer;
  color: #999;
  font-size: 18px;
}

.dropdown-card {
  position: absolute;
  top: 60px;
  width: 100%;
  background: white;
  border-radius: 10px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
  overflow-x: scroll;
  z-index: 1000;
}

.dropdown-item {
  padding: 14px 16px;
  cursor: pointer;
}

.dropdown-item:hover {
  background: #f6f6f6;
}

.place-name {
  font-weight: 600;
  font-size: 15px;
  color: #111;
}

.place-address {
  font-size: 13px;
  color: #6b7280;
  margin-top: 4px;
}
.zero-05{
    display: inline;
    vertical-align: middle;
}
img, svg, video, canvas, audio, iframe, embed, object{
    display: inline;
}

.page-loader {
  position: fixed;
  inset: 0;
  background: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 9999;
}

.spinner {
  width: 48px;
  height: 48px;
  border: 4px solid #ddd;
  border-top: 4px solid #000;
  border-radius: 50%;
  animation: spin 0.9s linear infinite;
}

@keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.card-content,.about-story,.transformation-section{
    color:black;
}
.menu-toggle{
  color: --black-color;
}
.find{
   text-decoration: underline;
}
@media (min-width: 300px) and (max-width: 390px) {
  .footer-left h2.Rubik-font {
    font-size: 27px !important;
  }
  .ga_width_100{
    width: 100vw !important;
}

    .subheading-mobile-05 {
      bottom: 30px !important;
    }
}

/* Default = Light mode */
.logo-light {
  display: block;
}

.logo-dark {
  display: none;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  .logo-light {
    display: none;
  }

  .logo-dark {
    display: block;
  }
    .social-icon-dark{
  display: block;
}
.social-icon-light{
  display: none;
}

}
.logo-dark ,.logo-light{
  width: 98px;
}
.social-icon-dark{
  display: none;
}
.social-icon-light{
  display: block;
}
@media (prefers-color-scheme: dark) and (max-width: 767px) {

  .mobile-logo-dark {
    display: block !important;
  }

  .mobile-logo-light {
    display: none !important;
  }
       nav.navigation ul.main-menu a,.signin-header,.close-menu {
        /* background-color: #000; */
        color: black !important;
    }
}
#email{
  padding: 10px;
}

/* .footer-gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr); 
  gap: 12px;
}


.footer-gallery .instagram-media {
  max-width: 100% !important;
  min-width: auto !important;
  width: 100% !important;
} */

.social-icon-light,.social-icon-dark{
width: 30px;
}