@font-face {
    font-family: "Caslon Pro";
    src: url("/font/CaslonPro-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Suisse Int' l";
    src: url("/font/SuisseIntl-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

/*
@font-face {
    font-family: "Suisse Int' l";
    src: url("../font/SuisseIntl-Book.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
 */

@font-face {
    font-family: "Suisse Int' l";
    src: url("/font/SuisseIntl-Light.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Suisse Int' l";
    src: url("/font/SuisseIntl-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Suisse Int' l";
    src: url("/font/SuisseIntl-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: "Suisse Int' l";
    src: url("/font/SuisseIntl-Thin.ttf") format("truetype");
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

:root {
    --pink: #E1C9C6;
    --orange: #EA5B1B;
    --orange-dark: #BB4711;
}

.container {
    max-width: 1140px;
}

.bg-main {
    background-color: var(--pink);
}

.bg-img {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.text-orange {
    color: var(--orange);
}

.link-orange {
    color: var(--orange) !important;
    -webkit-text-decoration-color: var(--orange) !important;
    text-decoration-color: var(--orange) !important;
}

.link-orange-hover:hover,
.link-orange-hover.active {
    color: var(--orange) !important;
}

.border-orange {
    border-color: var(--orange) !important;
}

.btn-orange {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--orange);
    --bs-btn-border-color: var(--orange);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--orange-dark);
    --bs-btn-hover-border-color: var(--orange-dark);
    --bs-btn-focus-shadow-rgb: 130, 138, 145;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--orange-dark);
    --bs-btn-active-border-color: var(--orange-dark);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: var(--orange);
    --bs-btn-disabled-border-color: var(--orange);
}

.btn-outline-orange,
.btn-outline-orange-hover:hover {
    --bs-btn-color: var(--orange);
    --bs-btn-border-color: var(--orange);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--orange);
    --bs-btn-hover-border-color: var(--orange);
    --bs-btn-focus-shadow-rgb: 108, 117, 125;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--orange);
    --bs-btn-active-border-color: var(--orange);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--orange);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--orange);
    --bs-gradient: none;
}

.el-square {
    aspect-ratio: 1 / 1;
}

@media (max-width: 768px) {
    .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}

@media (min-width: 768px) {
    .position-md-absolute {
        position: absolute;
    }

    .bottom-md-0 {
        bottom: 0;
    }
}

@media (min-width: 992px) {
    .position-lg-absolute {
        position: absolute;
    }
}

.animate,
.animate *,
[animation-hover] {
    transition: all .2s ease-in-out;
}

[animation-hover="zoom"] {
    width: 100%;
    height: 100%;

    position: relative;
    top: 0;
    left: 0;
}

[animation-hover="zoom"]:hover {
    width: 110%;
    height: 110%;

    top: -5%;
    left: -5%;
}

.quote::before {
    content: "“";
}

.quote::after {
    content: "”";
}

/*
* {
    font-family: "Wingdings 3";
}
 */

body {
    font-family: "Suisse Int' l", sans-serif;
}

.display-3,
.fs-4,
.fs-4 *,
p {
    font-family: "Suisse Int' l", sans-serif;
    background-color: transparent;
}

.fs-1,
.fs-1 *,
.fs-2,
.fs-2 *,
.fs-3,
.fs-3 *,
.font-caslon {
    font-family: "Caslon Pro", sans-serif;
    background-color: transparent;
}

.display-3 {
    line-height: 1;
}

/* Navbar */
#navbar-logo img {
    width: 200px;
}

.navbar-scrolled #navbar-logo {
    justify-content: start !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.navbar-scrolled #navbar-logo img {
    width: 150px;
}

.navbar-menu-open .menu-toggle-container {
    right: 1rem !important;
}

.menu-toggle {
    position: relative;
    z-index: 2;

    width: 40px;
    height: 40px;

    cursor: pointer;
}

.navbar-menu-open .menu-toggle {
    transform: rotate(45deg);
}

.menu-toggle::before {
    content: "";

    position: absolute;
    bottom: 50%;
    right: 50%;

    border-color: rgba(var(--bs-dark-rgb), var(--bs-border-opacity));
    border-style: solid;
    border-width: 0 1px 1px 0;

    width: 20px;
    height: 20px;
}

.menu-toggle::after {
    content: "";

    position: absolute;
    top: calc(50% - 1px);
    left: calc(50% - 1px);

    border-color: rgba(var(--bs-dark-rgb), var(--bs-border-opacity));
    border-style: solid;
    border-width: 1px 0 0 1px;

    width: 20px;
    height: 20px;
}

.menu-content {
    margin-left: -36px;
    width: calc(100% + (36px * 2));
}

@media (min-width: 768px) {
    .menu-content {
        margin-left: 0;
        width: 100%;
        /*
        margin-left: -1rem;
        width: calc(100% + 2rem);
        */
    }
}

.menu-content,
.menu-backdrop,
.age-content,
.age-backdrop {
    visibility: hidden;
}

.navbar-menu-open .menu-content,
.navbar-menu-open .menu-backdrop,
.age-modal-open .age-content,
.age-modal-open .age-backdrop {
    visibility: visible;
}

/* Modal */
.fade-sm {
    transition-duration: 0.5s;
}

.modal-backdrop.show {
    opacity: .75 !important;
}

/* Icons */
.i-icon {
    content: "";

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    display: block;
    width: 40px;
    height: 40px;
}

.i-eye {
    background-image: url("/img/icon/eye.svg");
}

.i-plus {
    background-image: url("/img/icon/plus.svg");
}

.i-minus {
    background-image: url("/img/icon/minus.svg");
}

.i-arrow {
    background-image: url("/img/icon/arrow.svg");
}

.i-arrow-down {
    background-image: url("/img/icon/arrow.svg");
    transform: rotate(90deg);
}

.i-arrow-left {
    background-image: url("/img/icon/arrow.svg");
    transform: rotate(180deg);
}

.i-arrow-right{
    background-image: url("/img/icon/arrow.svg");
}

.i-instagram {
    background-image: url("/img/icon/instagram.svg");

    width: 20px;
    height: 20px;
}

.i-facebook {
    background-image: url("/img/icon/facebook.svg");
    background-size: auto 100%;

    width: 20px;
    height: 20px;
}

.i-phone {
    background-image: url("/img/icon/phone.svg");

    width: 20px;
    height: 20px;
}

.i-mail {
    background-image: url("/img/icon/mail.svg");
    background-size: 100% auto;

    width: 20px;
    height: 20px;
}

.i-bottle {
    background-image: url("/img/icon/bottle.svg");
    background-size: auto 100%;

    width: 20px;
}

.i-bottle-label {
    background-image: url("/img/icon/bottle-label.svg");
    background-size: auto 100%;

    width: 20px;
}

/* Image gallery */
.splide__arrow {
    background-color: var(--pink);
    width: unset;
    height: unset;
}

#image-modal [role="button"]:hover,
#image-modal [role="button"]:hover {
    opacity: .9;
}

#image-modal [role="button"],
#image-modal [role="button"] {
    opacity: .7;
}

#image-modal [role="button"]:hover,
#image-modal [role="button"]:hover {
    opacity: .9;
}

[src=""] {
    display: none;
}