:root {

    /* Fonts */
    --defaultFontFamily: "Roboto Condensed", sans-serif;

    --fw-light: 300;
    --fw-regular: 400;
    --fw-medium: 500;
    --fw-semi-bold: 600;
    --fw-bold: 700;
 
    --neutral-100:#fff;
    --neutral-200:#ddddd8;
    --neutral-300:#ded8d3;
    --neutral-400:#b9c5cc;
    --neutral-900:#000;

    --primary-300:#72534c;
    --primary-400:#5a2b2e;
    --primary-500:#81343e;

    /* Default */
    --transition-default: all 0.3s ease-out;

    /* Layout */
    --container-padding:1rem;
    --header-height:100px;
    
    /* Fonts */
    --fs-base:1rem;

    --fs-level1-title:24px;
    --fs-level2-title: 24px;
    --fs-level3-title: 20px;

    --fs-para-xlarge:28px;
    --fs-para-large:24px;
}


.level-1-title {font-family:var(--defaultFontFamily); font-weight:var(--fw-light); font-size:var(--fs-level1-title); line-height:1.1; letter-spacing:.2rem;}
.level-2-title {font-family:var(--defaultFontFamily); font-weight:var(--fw-light); font-size:var(--fs-level2-title); line-height:1.1; letter-spacing:.1rem;}
.level-3-title {font-family:var(--defaultFontFamily); margin-top:.5rem; font-weight:var(--fw-regular); font-size:var(--fs-level3-title); line-height:1.1; letter-spacing:.1rem;}
.level-2-title strong {font-weight:var(--fw-medium) !important;}
.body-xl {font-size:var(--fs-para-xlarge); line-height:1.4;}
.body-lg {font-size:var(--fs-para-large); line-height:1.4;}
.visually-hidden {position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

@media (min-width:576px) {

   :root {
      --fs-level1-title: 34px;
      --fs-level2-title: 34px;
   }

}

@media (min-width:768px) {

   :root {
      --fs-base: 1.25rem;
      --fs-level1-title: 48px;
      --fs-level2-title: 48px;
   }

}

/* -------------------------
   Titles and fonts sizes
------------------------- 
.level-1-title {font-family:var(--titleFontFamily); font-weight:var(--fw-regular); font-size:var(--fs-level1-title); line-height:1.1;}
.level-2-title {font-family:var(--titleFontFamily); font-weight:var(--fw-regular); font-size:var(--fs-level2-title); line-height:1.1;}
.level-3-title,
.level-3-title button {font-family:var(--titleFontFamily); font-weight:var(--fw-regular); font-size:var(--fs-level2-title); line-height:1.1; color:var(--primary-700);}

.para-xl {font-size:var(--fs-para-large);}
.para-lg {font-size:var(--fs-para-medium);}


@media (min-width:768px) {
  :root {
    --border-radius-lg:140px;
  }
  .level-1-title {font-size:var(--fs-level1-title-medium);}
  .level-2-title {font-size:var(--fs-level2-title-medium);}
  .level-3-title,
  .level-3-title button {font-size:var(--fs-level2-title-medium);}
  .para-xl {font-size:var(--fs-para-xlarge);}
  .para-lg {font-size:var(--fs-para-large);}
}

@media (min-width:1024px) {
  .level-1-title {font-size:var(--fs-level1-title-large);}
  .level-2-title {font-size:var(--fs-level2-title-large);}
  .level-3-title,
  .level-3-title button {font-size:var(--fs-level2-title-large);}
}
*/

/* -------------------------
   Images
------------------------- */
.img-fit {object-fit:cover; width:100%; height:100%;}


/* -------------------------
   Button & Links
------------------------- */
.btn {padding:6px 1rem; border:1px solid var(--neutral-100); font-weight:var(--fw-regular); min-width:140px; color:var(--neutral-100); border:none; border-radius:20px; font-size:1rem; text-decoration:none;  display:inline-block; white-space:nowrap; text-decoration:none; border:1px solid var(--neutral-100); position:relative;}
.btn::after {content:''; width:20px; height:20px; background:url(/images/icon-arrow.svg) no-repeat 50% 100%; background-size:contain; position:absolute; bottom:50%; right:1rem; transform:translateX(-50%); rotate:-90deg; transform-origin:center; transition:right .3s ease-out;}
.btn:hover::after {right:.35rem}
.btn:hover {background:#ffffff50;}



/* -------------------------
   Padding & Margins
------------------------- */
.pt-0 {padding-top:0 !important;}
.pt-1 {padding-top:1rem !important;}
.pt-2 {padding-top:2rem !important;}
.pt-3 {padding-top:3rem !important;}
.pt-4 {padding-top:4rem !important;}
.pt-5 {padding-top:5rem !important;}

.pb-0 {padding-bottom:0 !important;}
.pb-1 {padding-bottom:1rem !important;}
.pb-2 {padding-bottom:2rem !important;}
.pb-3 {padding-bottom:3rem !important;}
.pb-4 {padding-bottom:4rem !important;}
.pb-5 {padding-bottom:5rem !important;}

.mt-0 {margin-top:0 !important;}
.mt-1 {margin-top:1rem !important;}
.mt-2 {margin-top:2rem !important;}
.mt-3 {margin-top:3rem !important;}
.mt-4 {margin-top:4rem !important;}
.mt-5 {margin-top:5rem !important;}

.mb-0 {margin-bottom:0 !important;}
.mb-1 {margin-bottom:1rem !important;}
.mb-2 {margin-bottom:2rem !important;}
.mb-3 {margin-bottom:3rem !important;}
.mb-4 {margin-bottom:4rem !important;}
.mb-5 {margin-bottom:5rem !important;}


/* -------------------------
   Containers
------------------------- */
.container {width:min(100%, 1340px); margin:0 auto; padding:0 var(--container-padding);}
section {padding:80px 0; overflow-x: clip;}

@media (min-width:768px) {
   :root {
      --container-padding:2rem;
   }
}







/* -------------------------
   Error Page
------------------------- */