:root {
  --darkGreen: #233F24;
  --lightGreen: #BDDBBF;
  --purple: #661DA1;
  --chocolate: #542633;
  --orange: #FC6B38;
  --yellow: #F0E62D;
  --pink: #F66CE1;
  --blueMagenta: #B6B4FF;
  --melon: #F2BBAA;
  --brown: #8E6A2E;
  --white: #FFFFFF;
  --black: #000000;
}
main h1,
main h2,
main h3,
main h4,
main h5,
main h6 {
  font-family: 'Gasoek One', sans-serif;
}
main p,
main span,
main li,
main a,
.button {
  font-family: 'Instrument Serif', serif !important;
  color: var(--black) !important;
}

main .button:not(.signup-button) {
  border-color: var(--darkGreen) !important;
}
main .button:hover {
  border-color: var(--lightGreen) !important;
}

body.brand--joia .pattern--perola.bottom-left:before,
body.brand--joia .pattern--perola.bottom-right:before,
body.brand--joia .pattern--perola.top-left:before,
body.brand--joia .pattern--perola.top-right:before,
body.brand--joia .pattern--perola pattern.bottom-left:before,
body.brand--joia .pattern--perola pattern.bottom-right:before,
body.brand--joia .pattern--perola pattern.top-left:before,
body.brand--joia .pattern--perola pattern.top-right:before {
  background-image: url('/wp-content/uploads/2025/09/Perola-block@4x-scaled.png') !important;
}
/* .sp-form.perola label {
  text-transform: unset !important;
  color: var(--lightGreen) !important;
}
.sp-form.perola {
  background: var(--darkGreen) !important;
}
.sp-form.perola p {
  color: var(--lightGreen) !important;
}
.sp-form.perola .sp-button {
  background-color: var(--lightGreen) !important;
  color: var(--darkGreen) !important;
}
.sp-form.perola .span {
  color: var(--lightGreen) !important;
} */
/*to be re-enabled at a later date*/
#module-1 {
  display: none !important;
}

main .embed-code {
  padding: 0;
}
#hero-section span {
  color: var(--darkGreen) !important;
}
#bar-wrap-1-1 {
  max-width: 100%;
  padding: 0;
}
.container {
  overflow: hidden;
}
.col-gallery {
  object-fit: cover;
}
@media (min-width: 1360px) {
  .col-gallery {
    width: 25%;
  }
}
@media (max-width: 1359px) and (min-width: 576px) {
  .col-gallery {
    width: 50%;
  }
}
@media (max-width: 568px) {
  .col-gallery {
    width: 100%;
  }
}
@media (min-width: 576px) {
  #module-1 .container,
  main .embed-code .container {
    max-width: 100%;
    padding: 0;
  }
}
#module-2 {
  display: none;
}
div:has(> div#bar-wrap-1-1) {
  padding: 0 !important;
}
#header-bar {
  background-color: rgba(189, 219, 191, 0.85) !important;
}
#header-bar.scrolling {
  background-color: var(--lightGreen) !important;
}
#header-bar:before {
  background: unset;
}
#header-bar .button {
  color: #000 !important;
  border-color: #000 !important;
}
#header-bar .hamburger span,
#header-bar .hamburger span:before,
#header-bar .hamburger span:after {
  background: #000;
}
.four-col-gallery {
  display: flex;
  flex-flow: row wrap;
  min-height: 500px;
}
.col-12 {
  padding: 0;
}
.signup-section.perola {
  background-color: var(--darkGreen) !important;
}
.signup-section.perola p {
  color: var(--white) !important;
}
.signup-section.perola .button {
  color: var(--white) !important;
}
.signup-section.perola .button:hover {
  color: var(--melon) !important;
  border-color: var(--melon) !important;
}
.top-footer {
  background: var(--darkGreen) !important;
}
.bottom-footer {
  background: var(--lightGreen) !important;
}
.bottom-footer p,
.bottom-footer a {
  color: var(--darkGreen) !important;
}
#module-1 .second-column p {
  color: var(--black);
}
.dark-overlay {
  display: none;
}
#header-bar #logo-wrap img {
  filter: invert(1);
}
#header-bar .logo-wrap {
  max-width: 170px;
}
#header-bar.scrolling .logo-wrap {
  max-width: 70px;
}
#module-1 .second-column .button {
  color: var(--darkGreen);
  border-color: var(--darkGreen);
  background: white;
}
#module-1 .second-column .button:hover {
  color: var(--melon);
  border-color: var(--melon);
}
@media (min-width: 811px) {
  #module-1 {
    display: flex;
    background: url(https://joiabattersea.staging.tempurl.host/wp-content/uploads/2025/09/cocktail_bar_2x.png);
    background-size: contain;
    background-repeat: no-repeat;
  }
  #module-1 .second-column {
    position: relative;
    overflow: hidden;
    align-content: center;
    background: url(https://joiabattersea.staging.tempurl.host/wp-content/uploads/2025/09/Mask-Group-2.png);
    background-repeat: no-repeat;
    background-size: 300px;
    background-position: bottom right;
  }
  #module-1 .second-column .txt-container,
  #module-1 .second-column .flex-row-container {
    padding: 30px 100px 0px 100px;
  }
}
@media (max-width: 810px) {
  #module-1 {
    display: flex;
    background: url(https://joiabattersea.staging.tempurl.host/wp-content/uploads/2025/09/cocktail_bar_2x.png);
    background-size: contain;
    background-repeat: no-repeat;
    flex-flow: column;
  }
  #module-1 .second-column {
    position: relative;
    overflow: hidden;
    align-content: center;
    background: url(https://joiabattersea.staging.tempurl.host/wp-content/uploads/2025/09/Mask-Group-2.png);
    background-repeat: no-repeat;
    background-size: 300px;
    background-position: bottom right;
  }
  #module-1 .second-column .txt-container,
  #module-1 .second-column .flex-row-container {
    padding: 20px 40px;
  }
}
@media (max-width: 767px) {
  .page-hero--image .container {
    background-color: var(--darkGreen) !important;
  }
  #header-bar .logo-wrap {
    max-width: 110px;
  }
}