@font-face {
    font-family: "Inter";
    src: url("../fonts/Inter-latin-ext.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
    font-family: "Inter";
    src: url("../fonts/Inter-latin.woff2") format("woff2");
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
    font-family: "Glitch Demo";
    src: url("../fonts/Glitch-Demo.ttf") format("truetype");
    font-style: normal;
    font-weight: 400;
    font-display: swap;
}

:root {
    color: #ffffff;
    background: #080503;
    font-family: "Inter", Arial, sans-serif;
    font-synthesis: none;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    min-height: 100%;
    background: #080503;
}

body {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    background: #080503;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

img {
    display: block;
}

.coming-soon {
    position: relative;
    isolation: isolate;
    display: flex;
    min-height: 100vh;
    min-height: 100svh;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: linear-gradient(
        180deg,
        #080503 0%,
        #0b0a08 55%,
        #120b03 100%
    );
}

.coming-soon__glow {
    position: absolute;
    z-index: -1;
    left: 50%;
    max-width: none;
    pointer-events: none;
    transform: translateX(-50%);
    user-select: none;
}

.coming-soon__glow--top {
    top: -440px;
    width: 1420px;
    height: 960px;
}

.coming-soon__glow--bottom {
    bottom: -500px;
    width: 1800px;
    height: 1180px;
}

.coming-soon__glow--core {
    bottom: -300px;
    width: 1180px;
    height: 780px;
}

.coming-soon__content {
    position: relative;
    z-index: 1;
    display: flex;
    width: 100%;
    flex: 0 0 auto;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 120px 80px;
    text-align: center;
}

.coming-soon__logo {
    width: 250.038px;
    height: 74.629px;
    flex: 0 0 auto;
}

.coming-soon__title {
    width: 100%;
    margin: 0;
    color: #ffffff;
    font-size: 56px;
    font-weight: 700;
    letter-spacing: -1.5px;
    line-height: 64px;
    overflow-wrap: break-word;
}

.coming-soon__title span {
    color: #ff4e08;
    font-family: "Glitch Demo", "Inter", Arial, sans-serif;
    font-weight: 400;
}

.coming-soon__message {
    width: 100%;
    margin: 0;
    color: #a3a3a8;
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    overflow-wrap: break-word;
}

.coming-soon__email {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: #ffffff;
    font-size: 24px;
    font-weight: 600;
    line-height: normal;
    text-decoration: none;
}

.coming-soon__email img {
    width: 20px;
    height: 20px;
    flex: 0 0 auto;
}

.coming-soon__email:focus-visible {
    border-radius: 4px;
    outline: 2px solid #ff4e08;
    outline-offset: 6px;
}

@media (max-width: 900px) {
    .coming-soon__content {
        padding-right: 32px;
        padding-left: 32px;
    }

    .coming-soon__title {
        font-size: clamp(40px, 6vw, 56px);
        letter-spacing: -1.1px;
        line-height: 1.14;
    }
}

@media (max-width: 600px) {
    .coming-soon__content {
        gap: 24px;
        padding: 56px 20px;
    }

    .coming-soon__logo {
        width: 200px;
        height: auto;
    }

    .coming-soon__title {
        max-width: 520px;
        font-size: 36px;
        letter-spacing: -0.8px;
        line-height: 1.16;
    }

    .coming-soon__message {
        max-width: 360px;
        font-size: 18px;
        line-height: 26px;
    }

    .coming-soon__email {
        font-size: 20px;
    }
}

@media (max-height: 560px) {
    .coming-soon__content {
        gap: 20px;
        padding-top: 36px;
        padding-bottom: 36px;
    }

    .coming-soon__logo {
        width: 180px;
        height: auto;
    }

    .coming-soon__title {
        font-size: 32px;
        letter-spacing: -0.6px;
        line-height: 38px;
    }

    .coming-soon__message {
        font-size: 17px;
        line-height: 24px;
    }

    .coming-soon__email {
        font-size: 19px;
    }
}
/* Motion */
.coming-soon__glow {
    transform-origin: center;
    will-change: opacity, transform;
}

.coming-soon__glow--top {
    animation: top-haze-drift 14s ease-in-out infinite alternate;
}

.coming-soon__glow--bottom {
    animation: bottom-glow-breathe 11s ease-in-out infinite alternate;
}

.coming-soon__glow--core {
    animation: bottom-core-breathe 8s ease-in-out infinite alternate-reverse;
}

.coming-soon__logo {
    animation: logo-reveal 900ms cubic-bezier(0.22, 1, 0.36, 1) 100ms backwards;
}

.coming-soon__title {
    animation: content-reveal 800ms cubic-bezier(0.22, 1, 0.36, 1) 260ms backwards;
}

.coming-soon__typing-break {
    display: none;
}

.coming-soon__typing {
    display: inline-flex;
    width: 4.65em;
    align-items: baseline;
    justify-content: flex-start;
    overflow: visible;
    text-align: left;
    vertical-align: baseline;
    white-space: nowrap;
}

.coming-soon__accent {
    position: relative;
    display: inline-block;
    flex: 0 0 auto;
}

.coming-soon__accent::before,
.coming-soon__accent::after {
    content: attr(data-text);
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
}

.coming-soon__accent::before {
    color: #ff7540;
    text-shadow: -2px 0 rgba(255, 255, 255, 0.5);
    clip-path: inset(0 0 56% 0);
}

.coming-soon__accent::after {
    color: #d93a00;
    text-shadow: 2px 0 rgba(255, 78, 8, 0.5);
    clip-path: inset(52% 0 12% 0);
}

.coming-soon__accent.is-glitching {
    animation: accent-glitch 360ms steps(1, end) both;
}

.coming-soon__accent.is-glitching::before {
    animation: glitch-slice-left 360ms steps(1, end) both;
}

.coming-soon__accent.is-glitching::after {
    animation: glitch-slice-right 360ms steps(1, end) both;
}

.coming-soon__cursor {
    display: inline-block;
    width: 2px;
    height: 0.82em;
    flex: 0 0 auto;
    align-self: center;
    margin-left: 5px;
    border-radius: 2px;
    background: #ff4e08;
    box-shadow: 0 0 12px rgba(255, 78, 8, 0.5);
    transform: translateY(0.04em);
    animation: caret-blink 760ms steps(1, end) infinite;
}

.coming-soon__message {
    animation: content-reveal 800ms cubic-bezier(0.22, 1, 0.36, 1) 410ms backwards;
}

.coming-soon__email {
    animation: content-reveal 800ms cubic-bezier(0.22, 1, 0.36, 1) 560ms backwards;
    transition: transform 240ms ease, text-shadow 240ms ease;
}

.coming-soon__email img {
    transition: transform 240ms ease;
}

@media (hover: hover) {
    .coming-soon__email:hover {
        transform: translateY(-2px);
        text-shadow: 0 0 24px rgba(255, 78, 8, 0.38);
    }

    .coming-soon__email:hover img {
        transform: scale(1.08) translateX(-1px);
    }
}

@keyframes logo-reveal {
    from {
        opacity: 0;
        transform: translateY(16px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

@keyframes content-reveal {
    from {
        opacity: 0;
        transform: translateY(14px);
    }

    to {
        opacity: 1;
        transform: translateY(0);
    }
}

@keyframes top-haze-drift {
    from {
        opacity: 0.84;
        transform: translateX(-50%) translateY(-4px) scale(0.985);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(8px) scale(1.025);
    }
}

@keyframes bottom-glow-breathe {
    from {
        opacity: 0.82;
        transform: translateX(-50%) translateY(6px) scale(0.98);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(-10px) scale(1.035);
    }
}

@keyframes bottom-core-breathe {
    from {
        opacity: 0.78;
        transform: translateX(-50%) translateY(8px) scale(0.97);
    }

    to {
        opacity: 1;
        transform: translateX(-50%) translateY(-6px) scale(1.045);
    }
}

@keyframes caret-blink {
    0%,
    46% {
        opacity: 1;
    }

    47%,
    100% {
        opacity: 0;
    }
}

@keyframes accent-glitch {
    0%,
    20%,
    46%,
    72%,
    100% {
        transform: translate(0);
    }

    24% {
        transform: translate(-1px, 1px);
    }

    34% {
        transform: translate(1px, -1px);
    }

    62% {
        transform: translate(1px, 0);
    }
}

@keyframes glitch-slice-left {
    0%,
    20%,
    46%,
    72%,
    100% {
        opacity: 0;
        transform: translate(0);
    }

    24% {
        opacity: 0.72;
        transform: translate(-4px, -1px);
    }

    34% {
        opacity: 0.5;
        transform: translate(3px, 1px);
    }

    62% {
        opacity: 0.58;
        transform: translate(-2px, 0);
    }
}

@keyframes glitch-slice-right {
    0%,
    26%,
    54%,
    78%,
    100% {
        opacity: 0;
        transform: translate(0);
    }

    30% {
        opacity: 0.62;
        transform: translate(4px, 1px);
    }

    42% {
        opacity: 0.44;
        transform: translate(-3px, -1px);
    }

    68% {
        opacity: 0.52;
        transform: translate(2px, 0);
    }
}

@media (max-width: 600px) {
    .coming-soon__typing-break {
        display: initial;
    }

    .coming-soon__typing {
        margin-top: 0.08em;
    }
}

@media (max-width: 420px) {
    .coming-soon__title {
        font-size: 34px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .coming-soon__glow,
    .coming-soon__logo,
    .coming-soon__title,
    .coming-soon__accent,
    .coming-soon__accent::before,
    .coming-soon__accent::after,
    .coming-soon__cursor,
    .coming-soon__message,
    .coming-soon__email {
        animation: none;
    }

    .coming-soon__logo,
    .coming-soon__title,
    .coming-soon__message,
    .coming-soon__email {
        opacity: 1;
        transform: none;
    }

    .coming-soon__accent::before,
    .coming-soon__accent::after,
    .coming-soon__cursor {
        display: none;
    }

    .coming-soon__email,
    .coming-soon__email img {
        transition: none;
    }
}