/* -------- Fonts -------- */

@font-face {
    font-display: swap;
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 400;
    src: url("../lib/playfair/playfair-display-v28-latin-regular.woff2") format("woff2");
}
@font-face {
    font-display: swap;
    font-family: "Playfair Display";
    font-style: normal;
    font-weight: 600;
    src: url("../lib/playfair/playfair-display-v28-latin-600.woff2") format("woff2");
}
@font-face {
    font-display: swap;
    font-family: "Playfair Display";
    font-style: italic;
    font-weight: 400;
    src: url("../lib/playfair/playfair-display-v28-latin-italic.woff2") format("woff2");
}
@font-face {
  font-display: swap;
  font-family: "Gravitas One";
  font-style: normal;
  font-weight: 400;
  src: url("../lib/gravitas-one/gravitas-one-v20-latin-regular.woff2") format("woff2");
}

/* -------- Layout -------- */

body {
    font-family: "Playfair Display", serif;
    padding: 0;
    margin: 0;
    max-width: 960px;
    margin: auto;
    background-color: #ffcd32;;
}

main {
    background-color: #ededed;
    position: relative;
    overflow: clip;
}

.backdrop {
    background-color: #ededed;
}

.card img {
    padding-left: 0.3em;
    padding-right: 0.3em;
}

.card .collapse.show {
    position: relative;
    z-index: 100;
}

.logos {
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

.logos img {
    max-height: 80px;
}

dl {
    margin-block-end: 0;
}

#faq .accordion-button:not(.collapsed) {
    background-color: #ffcd32;
}

.icon-link {
    align-items: baseline;
}

.alert > .bi {
    width: 2em;
    height: 2em;
}

/* -------- Header -------- */

header {
    max-height: 100vh;
    max-width: 960px;
    position: relative;
    height: min(105vw, 1060px);
    border: 0;
    padding: 0;
    z-index: 0;
    background: url("../img/bg.jpg");
    background-position-y: bottom;
    background-size: cover;
}

header .scroll {
    position: absolute;
    width: 100%;
    top: 100px;
    bottom: 150px;
}

header .title-wrap {
    position: sticky;
    top: 2em;
    z-index: 10;
}

header .title-center {
    position: absolute;
    left: 50%;
    transform: translate(-50%, 0);
    white-space: nowrap;
}

.title {
    font-family: "Gravitas One", serif;
    position: relative;
    height: min(10vw, 100px);
    background-color: #ffcd32;
    color: #000;
    font-size: min(3vw, 2em);
    line-height: min(10vw, 100px);
    padding-left: 1em;
    padding-right: 1em;
}

.title::before {
    content: "";
    position: absolute;
    background: url("../img/banner-left.svg");
    background-repeat: no-repeat;
    background-size: contain;
    height: min(10vw, 100px);
    width: 100%;
    z-index: -1;
    background-position-x: left;
    left: max(-4.5vw,-43px);
    top: min(1.2vw, 13px);
}

.title::after {
    content: "";
    position: absolute;
    background: url("../img/banner-right.svg");
    background-repeat: no-repeat;
    background-size: contain;
    height: min(10vw, 100px);
    width: 100%;
    z-index: -1;
    background-position-x: right;
    right: max(-4.5vw,-43px);
    top: min(1.2vw, 13px);
}

.tagline {
    position: absolute;
    bottom: -50px;
    color: #fff;
    font-family: "Gravitas One", serif;
    padding-left: 1em;
    padding-right: 1em;
    font-size: min(75px, 6vw);
    text-align: center;
    text-shadow: 0px 0px 0.25em #000;
}

/* -------- Navigation -------- */

.navigation {
    background-color: #ededed;
    margin-bottom: -1px;
    height: 0;
    flex-wrap: wrap;
    max-width: 960px;
}

.navigation .container-fluid {
    background-color: #ededed;
    padding-top: 0.2em;
    padding-bottom: 0.2em;
}

.navigation.sticky .container-fluid,
.navigation.expanded .container-fluid {
    border-bottom: 1px solid var(--bs-body-color);
}

.navigation.sticky {
    position: fixed;
}

.navbar-brand {
    visibility: hidden;
}

.navigation.sticky .navbar-brand {
    visibility: visible;
}

.navigation a.active {
    font-weight: bold;
}

.navbar {
    padding-top: 0;
    padding-bottom: 0;
}

.navbar-toggler,
.navbar-toggler-icon {
    border: none;
}

/* -------- Audio -------- */

.audio {
    display: flex;
    position: relative;
}

.audio .controls {
    display: flex;
}

.audio .controls .bi {
    height: 2em;
    width: 2em;
    cursor: pointer;
}

.audio .controls .bi:hover {
    background-color: #eeeeee;
    border-radius: 0.5em;
}

.audio .pause {
    display: none;
}

.audio .bi-restart {
    padding: 0.25em;
}

.audio .progress-box {
    display: flex;
    flex: 1;
    align-items: center;
    padding-left: 1em;
    padding-right: 1em;
    cursor: pointer;
}

.audio .progress {
    width: 100%;
    height: 2em;
    border: 1px solid #000000;
    background-color: transparent;
}

.audio .progress:hover {
    background-color: #eeeeee;
}

.audio .progress .slider {
    background-color: #333333;
}

.audio .current {
    margin-left: 1em;
}

.audio .progress-text {
    width: 3em;
    display: flex;
    align-items: center;
}

/* -------- Icons -------- */

.bi::before {
    display: inline-block;
    vertical-align: -0.125em;
    content: "";
    background-repeat: no-repeat;
    background-size: contain;
    width: 100%;
    height: 100%;
}

.bi.bi-pdf::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2M9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z'/><path d='M4.603 14.087a.8.8 0 0 1-.438-.42c-.195-.388-.13-.776.08-1.102.198-.307.526-.568.897-.787a7.7 7.7 0 0 1 1.482-.645 20 20 0 0 0 1.062-2.227 7.3 7.3 0 0 1-.43-1.295c-.086-.4-.119-.796-.046-1.136.075-.354.274-.672.65-.823.192-.077.4-.12.602-.077a.7.7 0 0 1 .477.365c.088.164.12.356.127.538.007.188-.012.396-.047.614-.084.51-.27 1.134-.52 1.794a11 11 0 0 0 .98 1.686 5.8 5.8 0 0 1 1.334.05c.364.066.734.195.96.465.12.144.193.32.2.518.007.192-.047.382-.138.563a1.04 1.04 0 0 1-.354.416.86.86 0 0 1-.51.138c-.331-.014-.654-.196-.933-.417a5.7 5.7 0 0 1-.911-.95 11.7 11.7 0 0 0-1.997.406 11.3 11.3 0 0 1-1.02 1.51c-.292.35-.609.656-.927.787a.8.8 0 0 1-.58.029m1.379-1.901q-.25.115-.459.238c-.328.194-.541.383-.647.547-.094.145-.096.25-.04.361q.016.032.026.044l.035-.012c.137-.056.355-.235.635-.572a8 8 0 0 0 .45-.606m1.64-1.33a13 13 0 0 1 1.01-.193 12 12 0 0 1-.51-.858 21 21 0 0 1-.5 1.05zm2.446.45q.226.245.435.41c.24.19.407.253.498.256a.1.1 0 0 0 .07-.015.3.3 0 0 0 .094-.125.44.44 0 0 0 .059-.2.1.1 0 0 0-.026-.063c-.052-.062-.2-.152-.518-.209a4 4 0 0 0-.612-.053zM8.078 7.8a7 7 0 0 0 .2-.828q.046-.282.038-.465a.6.6 0 0 0-.032-.198.5.5 0 0 0-.145.04c-.087.035-.158.106-.196.283-.04.192-.03.469.046.822q.036.167.09.346z'/></svg>");
}

.bi.bi-warn::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z'/></svg>");
}

.bi.bi-zip::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M5 7.5a1 1 0 0 1 1-1h1a1 1 0 0 1 1 1v.938l.4 1.599a1 1 0 0 1-.416 1.074l-.93.62a1 1 0 0 1-1.11 0l-.929-.62a1 1 0 0 1-.415-1.074L5 8.438zm2 0H6v.938a1 1 0 0 1-.03.243l-.4 1.598.93.62.929-.62-.4-1.598A1 1 0 0 1 7 8.438z'/><path d='M14 4.5V14a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2h5.5zm-3 0A1.5 1.5 0 0 1 9.5 3V1h-2v1h-1v1h1v1h-1v1h1v1H6V5H5V4h1V3H5V2h1V1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V4.5z'/></svg>");
}

.bi.bi-music::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M11 6.64a1 1 0 0 0-1.243-.97l-1 .25A1 1 0 0 0 8 6.89v4.306A2.6 2.6 0 0 0 7 11c-.5 0-.974.134-1.338.377-.36.24-.662.628-.662 1.123s.301.883.662 1.123c.364.243.839.377 1.338.377s.974-.134 1.338-.377c.36-.24.662-.628.662-1.123V8.89l2-.5z'/><path d='M14 14V4.5L9.5 0H4a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2M9.5 3A1.5 1.5 0 0 0 11 4.5h2V14a1 1 0 0 1-1 1H4a1 1 0 0 1-1-1V2a1 1 0 0 1 1-1h5.5z'/></svg>");
}

.bi.bi-play::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='m11.596 8.697-6.363 3.692c-.54.313-1.233-.066-1.233-.697V4.308c0-.63.692-1.01 1.233-.696l6.363 3.692a.802.802 0 0 1 0 1.393'/></svg>");
}

.bi.bi-loading::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M8 0a5.53 5.53 0 0 0-3.594 1.342c-.766.66-1.321 1.52-1.464 2.383C1.266 4.095 0 5.555 0 7.318 0 9.366 1.708 11 3.781 11H7.5V5.5a.5.5 0 0 1 1 0V11h4.188C14.502 11 16 9.57 16 7.773c0-1.636-1.242-2.969-2.834-3.194C12.923 1.999 10.69 0 8 0m-.354 15.854a.5.5 0 0 0 .708 0l3-3a.5.5 0 0 0-.708-.708L8.5 14.293V11h-1v3.293l-2.146-2.147a.5.5 0 0 0-.708.708z'/></svg>");
}

.bi.bi-pause::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M5.5 3.5A1.5 1.5 0 0 1 7 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5m5 0A1.5 1.5 0 0 1 12 5v6a1.5 1.5 0 0 1-3 0V5a1.5 1.5 0 0 1 1.5-1.5'/></svg>");
}

.bi.bi-restart::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path fill-rule='evenodd' d='M8 3a5 5 0 1 1-4.546 2.914.5.5 0 0 0-.908-.417A6 6 0 1 0 8 2z'/><path d='M8 4.466V.534a.25.25 0 0 0-.41-.192L5.23 2.308a.25.25 0 0 0 0 .384l2.36 1.966A.25.25 0 0 0 8 4.466'/></svg>");
}

.bi.bi-pinterest::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M8 0a8 8 0 0 0-2.915 15.452c-.07-.633-.134-1.606.027-2.297.146-.625.938-3.977.938-3.977s-.239-.479-.239-1.187c0-1.113.645-1.943 1.448-1.943.682 0 1.012.512 1.012 1.127 0 .686-.437 1.712-.663 2.663-.188.796.4 1.446 1.185 1.446 1.422 0 2.515-1.5 2.515-3.664 0-1.915-1.377-3.254-3.342-3.254-2.276 0-3.612 1.707-3.612 3.471 0 .688.265 1.425.595 1.826a.24.24 0 0 1 .056.23c-.061.252-.196.796-.222.907-.035.146-.116.177-.268.107-1-.465-1.624-1.926-1.624-3.1 0-2.523 1.834-4.84 5.286-4.84 2.775 0 4.932 1.977 4.932 4.62 0 2.757-1.739 4.976-4.151 4.976-.811 0-1.573-.421-1.834-.919l-.498 1.902c-.181.695-.669 1.566-.995 2.097A8 8 0 1 0 8 0'/></svg>");
}

.bi.bi-spotify::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M8 0a8 8 0 1 0 0 16A8 8 0 0 0 8 0m3.669 11.538a.5.5 0 0 1-.686.165c-1.879-1.147-4.243-1.407-7.028-.77a.499.499 0 0 1-.222-.973c3.048-.696 5.662-.397 7.77.892a.5.5 0 0 1 .166.686m.979-2.178a.624.624 0 0 1-.858.205c-2.15-1.321-5.428-1.704-7.972-.932a.625.625 0 0 1-.362-1.194c2.905-.881 6.517-.454 8.986 1.063a.624.624 0 0 1 .206.858m.084-2.268C10.154 5.56 5.9 5.419 3.438 6.166a.748.748 0 1 1-.434-1.432c2.825-.857 7.523-.692 10.492 1.07a.747.747 0 1 1-.764 1.288'/></svg>");
}

.bi.bi-envelope::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='currentColor' viewBox='0 0 16 16'><path d='M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z'/></svg>");
}

.bi.bi-envelope.light::before {
    background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23fff' viewBox='0 0 16 16'><path d='M.05 3.555A2 2 0 0 1 2 2h12a2 2 0 0 1 1.95 1.555L8 8.414.05 3.555ZM0 4.697v7.104l5.803-3.558L0 4.697ZM6.761 8.83l-6.57 4.027A2 2 0 0 0 2 14h12a2 2 0 0 0 1.808-1.144l-6.57-4.027L8 9.586l-1.239-.757Zm3.436-.586L16 11.801V4.697l-5.803 3.546Z'/></svg>");
}
