/*
Theme Name: JojoAdim
Template: hello-elementor
Version: 1.0
*/

:root {
  --brand: #50c878;
  --brand-2: #FFCE1B;
  --text: #1E1E1E;
  --muted: #64748b;
  --bg: #ffffff;

  --font-sans: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}

h1, h2, h3, h4, h5, span {
  font-family: "Concrette M", system-ui, -apple-system, sans-serif;
}

.elementor h1,
.elementor h2,
.elementor h3,
.elementor h4,
.elementor h5,
.elementor .elementor-heading-title,
.elementor-icon-list-text {
  font-family: "Concrette M", system-ui, -apple-system, sans-serif !important;
}

h6, body, .elementor-button-text, .e-n-menu-title-text {
  font-family: "Gilroy", system-ui, -apple-system, sans-serif;
}

@font-face {
  font-family: "Concrette M";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/ConcretteM/ConcretteM-TRIAL-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Concrette M";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/ConcretteM/ConcretteM-TRIAL-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Concrette M";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/ConcretteM/ConcretteM-TRIAL-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Gilroy (ttf) */
@font-face {
  font-family: "Gilroy";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/gilroy-family/Gilroy-Light.ttf") format("truetype");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/gilroy-family/Gilroy-Regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/gilroy-family/Gilroy-Medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/gilroy-family/Gilroy-Bold.ttf") format("truetype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Gilroy";
  src: url("/wp-content/themes/JojoAdim/assets/fonts/gilroy-family/Gilroy-Heavy.ttf") format("truetype");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/*Hero Section text*/

#hero-header {
  background: linear-gradient(95.17deg, #FFCE1B 0%, #50C878 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
}

#hero-text{
    color: #FFFFFF;
}

a {
    color: #50C878;
}

/*Popup customisations*/
.lodging{
  background-color: #ffffff;
}

.lodging, #lodging p{
  font-family: "Gilroy";
}

.lodging-options .elementor-price-table .elementor-price-table__header{
  background: #FFF0B9;
}

.lodging-options .elementor-button{
  background-color: #000;
  border-radius: 6px;
  color: #fff;
  display: inline-block;
  fill: #fff;
}

.lodging-options .elementor-button:hover{
  background-color: #50C878;
  color: #000;
}

/* =========================
   RESPONSIVE TYPOGRAPHY (REM)
   ========================= */

/* Base (Desktop) */
:root{
  --h1: 4rem;        
  --h2: 3rem;        
  --h3: 2.25rem;     
  --h4: 1.75rem;    
  --h5: 1.375rem;    
  --h6: 1.125rem;   

  --p: 1rem;     
  --small: 0.875rem; 

  --lh-tight: 1;
  --lh-normal: 1.5;
}

/* Headings */
.elementor h1,
.elementor .elementor-heading-title.h1 {
  font-size: var(--h1);
  line-height: var(--lh-tight);
}

.elementor h2,
.elementor .elementor-heading-title.h2 {
  font-size: var(--h2);
  line-height: var(--lh-tight);
}

.elementor h3,
.elementor .elementor-heading-title.h3 {
  font-size: var(--h3);
  line-height: var(--lh-tight);
}

.elementor h4,
.elementor .elementor-heading-title.h4 {
  font-size: var(--h4);
  line-height: 1.2;
}

.elementor h5,
.elementor .elementor-heading-title.h5 {
  font-size: var(--h5);
  line-height: 1.25;
}

.elementor h6,
.elementor .elementor-heading-title.h6 {
  font-size: var(--h6);
  line-height: 1.3;
}

/* Paragraphs */
.elementor p,
.elementor .elementor-widget-text-editor,
.elementor .elementor-widget-text-editor p {
  font-size: var(--p);
  line-height: var(--lh-normal);
}

/* Small text */
.elementor small,
.elementor .text-small {
  font-size: var(--small);
  line-height: 1.4;
}


/* =========================
   TABLET (≤1024px)
   ========================= */
@media (max-width: 64rem){ 
  :root{
    --h1: 3rem;        
    --h2: 2.375rem;    
    --h3: 1.875rem;    
    --h4: 1.5rem;      
    --h5: 1.25rem;     
    --h6: 1rem;        

    --p: 1rem;         
    --small: 0.8125rem;
  }
}


/* =========================
   MOBILE (≤480px)
   ========================= */
@media (max-width: 30rem){ 

  :root{
    --h1: 2.25rem;     
    --h2: 1.875rem;    
    --h3: 1.5rem;      
    --h4: 1.25rem;    
    --h5: 1.125rem;    
    --h6: 0.9375rem;   

    --p: 0.9375rem;    
    --small: 0.75rem;  
  }

  .elementor h1,
  .elementor h2,
  .elementor h3,
  .elementor .elementor-heading-title{
    word-break: break-word;
  }
}