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

body {
    margin: 0;
    overflow-x: hidden;
    background: #f1f2f2;
    font-family: Arial, sans-serif;
}

html[lang="fa"] body {
    font-family: "Yekan Bakh", Tahoma, sans-serif;
}

body.is-splash-visible {
    overflow: hidden;
}

.site-content {
    position: relative;
    min-height: 100dvh;
    overflow: hidden;
    background: radial-gradient(circle at 50% 75%, #507064 0, #173d33 35%, #102d26 100%);
    color: #fff;
}

.page-intro {
    display: grid;
    min-height: 100dvh;
    align-content: center;
    padding: 8rem 5.5vw 4rem;
}

.page-intro p { margin: 0 0 1rem; color: #d8df36; font: 500 0.85rem Arial, sans-serif; letter-spacing: 0.18em; text-transform: uppercase; }
.page-intro h1 { max-width: 1000px; margin: 0; font: 600 clamp(3rem, 9vw, 8.5rem)/0.92 Arial, sans-serif; letter-spacing: -0.06em; }
html[lang="fa"] .page-intro p, html[lang="fa"] .page-intro h1 { font-family: "Yekan Bakh", Tahoma, sans-serif; letter-spacing: 0; }

.welcome-splash {
    position: fixed;
    z-index: 9999;
    inset: 0;
    display: grid;
    width: 100%;
    min-height: 100dvh;
    place-items: center;
    pointer-events: none;
}

.welcome-splash__panels {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
}

.welcome-splash__panel {
    min-width: 0;
    background: #9f001a;
    transform: translate3d(0, 0, 0);
    will-change: transform;
}

.welcome-splash.is-leaving .welcome-splash__panel {
    transform: translate3d(0, -101%, 0);
    transition: transform var(--splash-panel-duration, 230ms) cubic-bezier(0.76, 0, 0.24, 1);
    transition-delay: calc(var(--panel-index) * var(--splash-panel-delay, 90ms));
}

.welcome-splash__logo {
    position: relative;
    z-index: 1;
    width: min(68vw, 501px);
    height: auto;
    user-select: none;
    transition: opacity 120ms ease;
}

.welcome-splash.is-leaving .welcome-splash__logo {
    opacity: 0;
}

@media (max-width: 640px) {
    .welcome-splash__logo {
        width: min(72vw, 393px);
    }
}

@media (prefers-reduced-motion: reduce) {
    .welcome-splash.is-leaving .welcome-splash__panel {
        opacity: 0;
        transform: none;
        transition: opacity 150ms linear;
        transition-delay: 0ms;
    }
}
