/* width */
::-webkit-scrollbar {
    width: 5px;
}

/* Track */
::-webkit-scrollbar-track {
    border-radius: 10px;
}

/* Handle */
::-webkit-scrollbar-thumb {
    background: #f982a06e;
    border-radius: 10px;
}

.mochi-title {
    position: relative;
    background-image: url("../img/mochitsuki.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
.mochi-title::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0, 0, 0, 0.55);
    z-index: 1;
}

.book-button {
    background-color: #f982a0;
    color: white;
    padding: 10px 20px;
    border-radius: 5px;
    cursor: pointer;
}
.book-button:hover {
    background-color: #fa7697;
}
.bg-mochitsuki-button {
    background-color: #f982a0;
    font-weight: bold;
    color: white;
    border-radius: 5px;
    padding: 10px 20px;
}
.bg-mochitsuki-button:hover {
    background-color: #fa7697;
}
.bg-mochitsuki-primary {
    background-color: #fff2f2;
}
.bg-mochitsuki-secondary {
    background-color: #fdcfcf;
}
.bg-mochitsuki-tertiary {
    background-color: #ffadad;
}
.text-mochitsuki-primary {
    color: #f982a0ca;
}
.text-mochitsuki-secondary {
    color: #fdcfcf;
}
.navtext:hover {
    color: #f982a0ca;
}
.selected-tab {
    background-color: #fa7697;
}
.font-montserrat {
    font-family: "Montserrat", sans-serif;
}
.font-poppins {
    font-family: "Poppins", sans-serif;
}
.font-roboto {
    font-family: "Roboto", sans-serif;
}
.font-lato {
    font-family: "Lato", sans-serif;
}
.font-source {
    font-family: "Source Sans 3", sans-serif;
}

/* HEADER CSS */
.right--100 {
    right: -100%;
}
.px-20vw {
    padding-left: 20vw;
    padding-right: 20vw;
}
#mobileMenu {
    transition: right 0.2s;
}
header {
    transition: background-color 0.5s;
}
/*===========*/

.intro {
    transition: opacity 1s;
}
#mochi-text,
#japan-exp-text {
    transition: opacity 1s;
    opacity: 0;
}
.spacer {
    aspect-ratio: 900/100;
    width: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.wave1 {
    background-image: url("/assets/img/wave1.svg");
}
.wave2 {
    background-image: url("/assets/img/wave2.svg");
}
.wave3 {
    background-image: url("/assets/img/wave3.svg");
}
.dark-wave1 {
    background-image: url("/assets/img/dark-wave1.svg");
}
.dark-wave2 {
    background-image: url("/assets/img/dark-wave2.svg");
}
.no-bg {
    background-image: none;
}
.h-100 {
    height: 30rem;
}
#aup-title {
    height: 45vh;
}
#bp-title {
    height: 25vh;
}
.benefits-longcard1 {
    background-image: url("/assets/img/card-wave-bg.svg");
    background-size: cover;
    background-position: center;
}
.benefits-longcard2 {
    background-image: url("/assets/img/card-peaks-bg.svg");
    background-size: cover;
    background-position: center;
}
.benefits-squarecard1 {
    background-image: url("/assets/img/square-card-blur-bg.svg");
    background-size: cover;
    background-position: center;
}
.benefits-squarecard2 {
    background-image: url("/assets/img/square-card-blur-bg.svg");
    background-size: cover;
    background-position: center;
}

/* Animation CSS */
.animate {
    opacity: 0;
    transition: all 1s;
    filter: blur(5px);
    transform: translateX(-50%);
}
.animate__animated {
    opacity: 1;
    filter: blur(0);
    transform: translateX(0);
}
.service:nth-child(1) {
    transition-delay: 200ms;
}
.service:nth-child(2) {
    transition-delay: 400ms;
}
.service:nth-child(3) {
    transition-delay: 600ms;
}
.service:nth-child(4) {
    transition-delay: 800ms;
}
.animate_fade {
    opacity: 0;
    transition: all 1s;
}
.animate__fadeIn {
    opacity: 1;
}
.animate_fadeInUp {
    opacity: 0;
    transition: all 0.75s;
    filter: blur(5px);
    transform: translateY(15%);
}
.animate_Up {
    transition: all 0.75s;
    opacity: 0;
    transform: translateY(30%);
}
.animate__Up {
    opacity: 1;
    transform: translateY(0);
}
.animate_card_fadeInUp {
    opacity: 0;
    transition: all 0.25s;
    filter: blur(5px);
    transform: translateY(25%);
}
.animate_fadeInUp_benefits {
    opacity: 0;
    transition: all 0.75s;
    filter: blur(5px);
    transform: translateY(15%);
}
.animate__fadeInUp {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
}
.animate_fadeInUp:nth-child(2) {
    transition-delay: 100ms;
}

.animate_card_fadeInUp:nth-child(2) {
    transition-delay: 200ms;
}
.animate_card_fadeInUp:nth-child(3) {
    transition-delay: 400ms;
}

.animate_fadeInUp_benefits:nth-child(2) {
    transition-delay: 200ms;
}
.animate_fadeInUp_benefits:nth-child(3) {
    transition-delay: 300ms;
}
.animate_fadeInUp_benefits:nth-child(4) {
    transition-delay: 400ms;
}

/* about us section */
.bg-custom-pink {
    background-color: #f982a0ca;
}

.hover\:bg-custom-hover-pink:hover {
    background-color: #fa7697;
}