:root {
    --font-body: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo, sans-serif;
    --color-text: #ffffff;
    --color-muted: rgba(255, 255, 255, 0.72);
    --color-line: rgba(255, 255, 255, 0.28);
    --brand-accent: #c9b896;
    --brand-shadow: rgba(0, 0, 0, 0.45);
}

* {
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
    margin: 0;
}

body {
    min-height: 100vh;
    overflow: hidden;
    font-family: var(--font-body);
    color: var(--color-text);
    background-color: #0b0b0d;
    background-image: var(--coming-bg-pc, url("/assets/images/coming-pc.webp"));
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.store-aqualism {
    --brand-accent: #7cc7d8;
}

.store-is-real {
    --brand-accent: #d8c99b;
}

.store-reserve-aoyama {
    --brand-accent: #c7aa7a;
}

.store-yo-in {
    --brand-accent: #b8a4c9;
}

.coming-soon {
    position: relative;
    z-index: 2;
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 32px;
    text-align: center;
}

.coming-soon__content {
    width: min(100%, 680px);
    text-shadow: 0 18px 48px var(--brand-shadow);
}

.coming-soon__eyebrow,
.coming-soon__domain {
    margin: 0;
    color: var(--color-muted);
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0.28em;
    line-height: 1.8;
    text-transform: uppercase;
}

.coming-soon__title {
    margin: 20px 0 14px;
    font-size: clamp(44px, 8vw, 104px);
    font-weight: 200;
    letter-spacing: 0.08em;
    line-height: 1;
    text-transform: uppercase;
}

.coming-soon__message {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    margin: 0 0 22px;
    padding: 0 18px;
    border-top: 1px solid var(--color-line);
    border-bottom: 1px solid var(--color-line);
    color: var(--brand-accent);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0.34em;
    line-height: 1.4;
    text-transform: uppercase;
}

@media (max-width: 767px) {
    body {
        background-image: var(--coming-bg-sp, url("/assets/images/coming-sp.webp"));
    }

    .coming-soon {
        padding: 24px;
    }

    .coming-soon__eyebrow,
    .coming-soon__domain {
        font-size: 11px;
        letter-spacing: 0.22em;
    }

    .coming-soon__title {
        margin-top: 18px;
        font-size: clamp(38px, 15vw, 72px);
        letter-spacing: 0.05em;
    }

    .coming-soon__message {
        padding: 0 14px;
        font-size: 12px;
        letter-spacing: 0.24em;
    }
}