/*---------------ROOT ELEMENTS---------------*/
@import url("https://use.typekit.net/cvi6wra.css");

:root {
  --ofwhite-color: #eeeae5;
  --darkGray-color: #b3adad;
  --lightGray-color: #e2dede;
  --main-black-color: #0a0a0a;
  --error-color: #cc8888;
  --border: 1px solid rgba(0,0,0,0.9);
  --main-font: "neue-haas-grotesk-display", sans-serif;
  --signature-font: "stix-two-text", serif;
  --main-transition: all 0.3s ease-in-out;
}



/*---------------GLOBAL ELEMENTS---------------*/
*{font-family:var(--main-font); color:var(--main-black-color);}
ul, li{margin:0px; padding:0px; list-style:none;}
p{margin:0px; text-wrap:balance;}

/*Interactive*/
a{color:var(--main-black-color); text-decoration:none; transition:var(--main-transition);}
a:hover{color:var(--main-black-color);}

input{border:var(--border); background:transparent; padding-left:50px; outline:none !important;}
input::placeholder{color:var(--main-black-color);}

button{font-family:var(--main-font); text-align:center !important; text-transform:uppercase; letter-spacing:1px; font-size:12px; height:35px; border-radius: 0px;}
button.black{color:var(--lightGray-color); background-color:var(--main-black-color); border:0px;}
button.transparent{color:var(--main-black-color); border:var(--border); background-color:transparent;}
select{appearance: none; -webkit-appearance: none; -moz-appearance: none; height:30px; border: var(--border); border-radius: 0px; font-family:var(--main-font); text-align:center !important; text-transform:uppercase; letter-spacing:1px; font-size:12px; color:var(--main-black-color); cursor: pointer; background-color:transparent;}

select.glass{background:rgba(246, 242, 237, 0.1); backdrop-filter: blur(7px) brightness(1) url(#displace); -webkit-backdrop-filter: blur(7px);}
select:focus {outline: none;}

/*Transitions*/
.fade-in {opacity: 0; transform: translateY(50px); transition: opacity 0.75s ease, transform 0.5s ease;}
.fade-in-later {opacity: 0; transform: translateY(100px); transition: all 1s ease; transition-delay:0.5s;}
.fade-in.visible,.fade-in-later.visibleLater {opacity: 1; transform: translateY(0);}

h1{font-size:50px;}
h1.signature{font-family:var(--signature-font); letter-spacing:-2.5px;}


/*---------------BOOTSTRAP FIXES / CHANGES---------------*/
.container {max-width:none;}
.flex-container {display: flex;}
.auto{flex:auto; flex-basis: fit-content;}
.row.custom-gutter {--bs-gutter-x: 12px; --bs-gutter-y: 12px;}
.row.custom-gutter-small {--bs-gutter-x: 6px; --bs-gutter-y: 6px;}
.row.custom-gutter-large {--bs-gutter-x: 48px; --bs-gutter-y: 48px;}



/*---------------BODY---------------*/
body{background-color:var(--ofwhite-color);}


/*---------------HEADER + FOOTER---------------*/
header, footer {position:fixed; width:calc(100% - 30px); margin:0px 0px 0px 15px; z-index:99;}


/*Header*/
header {top:0px; height:50px; padding-top:5px; background-color:var(--ofwhite-color);}
header h1{text-align:center;}


/*Footer*/
footer {bottom:0px; padding-bottom:15px; background-color:var(--ofwhite-color);}
footer .support {text-align:right;}