:root {
    color-scheme: light;
    font-family: "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
    font-synthesis: none;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    --ink: #142b4d;
    --muted: #72829b;
    --blue: #1766ce;
}

* { box-sizing: border-box; }

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

body {
    min-height: 100vh;
    color: var(--ink);
    background:
        radial-gradient(ellipse at 50% 43%, rgba(226, 237, 255, .58), transparent 42%),
        radial-gradient(ellipse at 12% 90%, rgba(255, 239, 236, .4), transparent 28%),
        #f8faff;
}

.launch-page { display: flex; min-height: 100vh; flex-direction: column; padding: 0 clamp(22px, 7vw, 100px); }
.launch-header { display: flex; width: min(1240px, 100%); min-height: 94px; align-items: center; margin-inline: auto; }
.launch-header img { display: block; width: 142px; height: auto; }

.launch-center {
    display: flex;
    width: min(680px, 100%);
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: center;
    padding: 16px 0 76px;
    text-align: center;
    animation: center-arrive .7s ease both;
}

.launch-art { display: block; width: clamp(285px, 38vw, 420px); height: auto; margin: 0 0 3px; overflow: visible; }
.launch-eyebrow { margin: 0 0 10px; color: #3675c2; font-size: 10px; font-weight: 700; letter-spacing: .25em; }
.launch-center h1 { margin: 0; color: var(--ink); font-size: clamp(39px, 5.5vw, 58px); font-weight: 600; letter-spacing: -.045em; line-height: 1.15; text-wrap: balance; }
.launch-description { max-width: 450px; margin: 14px 0 0; color: var(--muted); font-size: 14px; line-height: 1.8; text-wrap: balance; }
html[dir="rtl"] .launch-center h1 { letter-spacing: 0; }
html[dir="rtl"] .launch-eyebrow { letter-spacing: .12em; }

@keyframes center-arrive { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 600px) {
    .launch-page { padding-inline: 22px; }
    .launch-header { min-height: 78px; }
    .launch-header img { width: 126px; }
    .launch-center { padding: 0 0 55px; }
    .launch-art { width: min(100%, 370px); margin-bottom: 1px; }
    .launch-center h1 { font-size: clamp(38px, 10vw, 49px); }
    .launch-description { max-width: 360px; margin-top: 11px; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; }
}

body.launch-coming-soon {
    display: flow-root;
    color: var(--company-text, #15345d);
    background: var(--company-blue-soft, #edf5ff);
    font-family: "Plus Jakarta Sans", "Segoe UI", Arial, sans-serif;
}

.launch-coming-page {
    display: flex;
    min-height: calc(100vh - 48px);
    min-height: calc(100svh - 48px);
    flex-direction: column;
    margin: 24px;
    padding: 0 clamp(24px, 5vw, 74px) 30px;
    border: 1px solid var(--company-line, #dce8f7);
    border-radius: 3px;
    background: #fff;
    animation: coming-arrive .85s ease both;
}

.launch-coming-header {
    display: flex;
    min-height: 82px;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    border-bottom: 1px solid var(--company-line, #dce8f7);
    color: var(--company-blue-dark, #123767);
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .21em;
    line-height: 1.7;
}

.launch-coming-header span:last-child {
    color: var(--company-muted, #657a96);
    font-size: 8px;
}

.launch-coming-center {
    display: flex;
    width: min(900px, 100%);
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    align-self: center;
    padding: 16px 0 25px;
    text-align: center;
}

.launch-coming-art {
    display: block;
    width: clamp(290px, 35vw, 430px);
    max-width: 100%;
    height: auto;
    margin-bottom: 4px;
    overflow: visible;
}

.launch-coming-soon .launch-coming-center h1 {
    margin: 0;
    color: var(--company-blue-dark, #123767);
    font-family: "Playfair Display", Georgia, "Times New Roman", serif;
    font-size: clamp(35px, 4.3vw, 60px);
    font-weight: 400;
    letter-spacing: -.045em;
    line-height: 1.18;
    text-wrap: balance;
}

.launch-coming-description {
    max-width: 530px;
    margin: 17px 0 0;
    color: var(--company-muted, #657a96);
    font-size: 13px;
    line-height: 1.85;
    text-wrap: balance;
}

.launch-coming-note {
    display: inline-flex;
    min-height: 33px;
    align-items: center;
    justify-content: center;
    gap: 9px;
    margin: 24px 0 0;
    padding: 0 19px;
    border: 1px solid var(--company-line, #dce8f7);
    border-radius: 999px;
    color: var(--company-blue, #075bc8);
    background: var(--company-blue-subtle, #f6faff);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .2em;
}

.launch-coming-note span {
    width: 5px;
    height: 5px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--company-blue, #075bc8);
    animation: launch-status 4s ease-in-out infinite;
}

.hourglass-ground-end { stop-color: var(--company-blue-soft, #edf5ff); }
.hourglass-backdrop-ring { stroke: var(--company-line, #dce8f7); }
.hourglass-cap { fill: var(--company-blue-dark, #123767); }
.hourglass-turn {
    transform-box: view-box;
    transform-origin: 0 0;
    animation: hourglass-turn 16s cubic-bezier(.65, 0, .35, 1) infinite;
}
.hourglass-upper-sand {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    animation: hourglass-upper-sand 16s linear infinite;
}
.hourglass-lower-sand {
    clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%);
    animation: hourglass-lower-sand 16s linear infinite;
}
.hourglass-stream-down {
    animation: hourglass-flow-down 16s linear infinite, hourglass-grains .55s linear infinite;
}
.hourglass-stream-up {
    opacity: 0;
    animation: hourglass-flow-up 16s linear infinite, hourglass-grains .55s linear infinite;
}

html[dir="rtl"] .launch-coming-soon { font-family: "Cairo", "Segoe UI", Arial, sans-serif; }
html[dir="rtl"] .launch-coming-center h1 { font-family: "Cairo", "Segoe UI", Arial, sans-serif; letter-spacing: 0; }
html[dir="rtl"] .launch-coming-header,
html[dir="rtl"] .launch-coming-note { letter-spacing: 0; }

@keyframes coming-arrive {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes hourglass-turn {
    0%, 42% { transform: rotate(0deg); }
    50%, 92% { transform: rotate(180deg); }
    100% { transform: rotate(360deg); }
}
@keyframes hourglass-upper-sand {
    0%, 92%, 100% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    42%, 50% { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); }
    50.01% { clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
}
@keyframes hourglass-lower-sand {
    0% { clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%); }
    42%, 50% { clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); }
    92%, 100% { clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); }
}
@keyframes hourglass-flow-down {
    0%, 1%, 42%, 100% { opacity: 0; }
    3%, 40% { opacity: 1; }
}
@keyframes hourglass-flow-up {
    0%, 51%, 92%, 100% { opacity: 0; }
    53%, 90% { opacity: 1; }
}
@keyframes hourglass-grains { to { stroke-dashoffset: -14; } }
@keyframes launch-status {
    0%, 100% { opacity: .55; }
    50% { opacity: 1; }
}

@media (max-width: 600px) {
    .launch-coming-page { min-height: calc(100svh - 24px); margin: 12px; padding: 0 19px 28px; }
    .launch-coming-header { min-height: 67px; gap: 15px; font-size: 7px; letter-spacing: .13em; }
    .launch-coming-header span:last-child { max-width: 90px; font-size: 6px; text-align: end; }
    .launch-coming-center { padding: 22px 0 16px; }
    .launch-coming-art { width: min(100%, 360px); }
    .launch-coming-soon .launch-coming-center h1 { font-size: clamp(34px, 8.5vw, 45px); }
    .launch-coming-description { max-width: 320px; margin-top: 15px; font-size: 12px; }
    .launch-coming-note { margin-top: 22px; }
}

@media (max-height: 760px) and (min-width: 601px) {
    .launch-coming-page { min-height: calc(100svh - 32px); margin: 16px; padding-bottom: 16px; }
    .launch-coming-header { min-height: 62px; }
    .launch-coming-center { padding-block: 10px; }
    .launch-coming-art { width: min(38vh, 330px); margin-bottom: 0; }
    .launch-coming-soon .launch-coming-center h1 { font-size: 43px; }
    .launch-coming-description { margin-top: 12px; }
    .launch-coming-note { margin-top: 18px; }
}

@media (prefers-reduced-motion: reduce) {
    .launch-coming-page, .hourglass-turn, .hourglass-upper-sand, .hourglass-lower-sand,
    .hourglass-stream, .launch-coming-note span { animation: none; }
    .hourglass-upper-sand { clip-path: polygon(0 30%, 100% 30%, 100% 100%, 0 100%); }
    .hourglass-lower-sand { clip-path: polygon(0 65%, 100% 65%, 100% 100%, 0 100%); }
    .hourglass-stream-down { opacity: 1; }
}
