
/* Variables */

html {font-size: 16px;}

/* Colors */
:root {
  --novo-green-120: rgb(74, 140, 101);
  --novo-green-100: rgb(93, 161, 121);
  --novo-green-70: rgb(130, 189, 154);
  --novo-beige-100: rgb(236, 218, 188);
  --novo-beige-70: rgb(247, 236, 218);
  --novo-yellow-100: rgb(236, 218, 188);
  --black-100: rgb(26, 26, 26);
  --black-60: rgb(127, 127, 127);
  --black-40: rgb(210, 210, 210);
  --black-30: rgb(236, 236, 236);
  --black-10: rgb(248, 248, 248);
  --black-00: rgb(255, 255, 255);
}

/* Font sizes */
:root {
  /* 0.52 */

  /* 14px - 16px */
  --fs-x-mini: calc(clamp(0.875rem, 0.156vw + 0.813rem, 1rem));

  /* 16px - 20px */
  --fs-mini: calc(clamp(1rem, 0.312vw + 0.875rem, 1.25rem));

  /* 18px - 24px */
  --fs-small: calc(clamp(1.125rem, 0.468vw + 0.938rem, 1.5rem));

  /* 26px - 42px */
  --fs-medium: calc(clamp(1.625rem, 1.249vw + 1.126rem, 2.625rem));

  /* 32px - 66px */
  --fs-large: calc(clamp(2rem, 2.654vw + 0.94rem, 4.125rem));

  /* 40px - 76px */
  --fs-x-large: calc(clamp(2.5rem, 2.81vw + 1.378rem, 4.75rem));

  /* 60px - 100px */
  --fs-xx-large: calc(clamp(3.75rem, 3.123vw + 2.503rem, 6.25rem));
}

/* Line height */
:root {
  --lh-small: 100%; 
  --lh-medium: 110%; 
  --lh-large: 130%; 
  --lh-x-large: 150%; 
  --lh-xx-large: 210%; 
}

/* Font weights */
:root {
  --fw-extralight: 300; 
  --fw-light: 300; 
  --fw-regular: 400; 
  --fw-medium: 500;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-extrabold: 800;
  --fw-black: 900;
}

/* Margins */
:root {
/* 0.52 */

  /* 2px - 4px */
  --sp-x-mini: calc(clamp(0.125rem, 0.156vw + 0.063rem, 0.25rem));

  /* 4px - 8px */
  --sp-mini: calc(clamp(0.25rem, 0.312vw + 0.125rem, 0.5rem));

  /* 8px - 16px */
  --sp-small: calc(clamp(0.5rem, 0.625vw + 0.251rem, 1rem));

  /* 12px - 24px */
  --sp-medium: calc(clamp(0.75rem, 0.937vw + 0.376rem, 1.5rem));

  /* 24px - 48px */
  --sp-large: calc(clamp(1.5rem, 1.874vw + 0.752rem, 3rem));

  /* 48px - 96px */
  --sp-x-large: calc(clamp(3rem, 3.747vw + 1.504rem, 6rem));

  /* 65px - 130px */
  --sp-xx-large: calc(clamp(4.063rem, 5.074vw + 2.036rem, 8.125rem));
}

/* Shortcommands */
.ta-ll {text-align: left;}
.ta-lc {text-align: left;}
.ta-lr {text-align: left;}
.ta-cc {text-align: center;}
.ta-cl {text-align: center;}
.ta-cr {text-align: center;}
.ta-rl {text-align: right;}
.ta-rc {text-align: right;}
.ta-rr {text-align: right;}






/* Media Queries - X-Large 1440px -> ---------- */
@media screen and (min-width: 90.01em) {



}

/* Media Queries - Large 1024px -> 1440px --- */
@media screen and (max-width: 90em) {

  

}

/* Media Queries - Medium 800px -> 1024px --- */
@media screen and (max-width: 64em) {

  

}

/* Media Queries - Small 640px -> 800px --- */
@media screen and (max-width: 50em) {



}


/* Media Queries - X-Small -> 640px ----------- */
@media screen and (max-width: 40em) {

  /* Shortcommands */

  .ta-ll {text-align: left;}
  .ta-lc {text-align: center;}
  .ta-lr {text-align: right;}
  .ta-cc {text-align: center;}
  .ta-cl {text-align: left;}
  .ta-cr {text-align: right;}
  .ta-rl {text-align: left;}
  .ta-rc {text-align: center;}
  .ta-rr {text-align: right;}

}