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

html,
body {
    margin: 0;
    padding: 0;
}

body {
    font-family:
        "DIN Next LT Arabic",
        "DINNextLTArabic",
        "Segoe UI",
        Tahoma,
        Arial,
        sans-serif;
}

/* الصفحة الرئيسية */
.scps-coming-soon {
    min-height: 100vh;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    gap: clamp(20px, 3.5vh, 36px);

    padding:
        clamp(24px, 6vw, 64px)
        clamp(16px, 6vw, 48px);

    text-align: center;

    font-family:
        "DIN Next LT Arabic",
        "DINNextLTArabic",
        system-ui,
        sans-serif;

    line-height: 1.7;

    color: #184f48;

    background:
        linear-gradient(
            180deg,
            #ffffff 0%,
            #f2faf9 45%,
            #d9efec 100%
        );

    position: relative;
    overflow: hidden;
}

/* شبكة الخلفية */
.scps-coming-soon__grid {
    position: absolute;
    inset: 0;

    pointer-events: none;

    background-image:
        linear-gradient(
            rgba(42, 157, 143, 0.12) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(42, 157, 143, 0.12) 1px,
            transparent 1px
        );

    background-size: 56px 56px;

    animation: scpsGrid 7s linear infinite;

    -webkit-mask-image:
        radial-gradient(
            ellipse 90% 80% at 50% 40%,
            transparent 30%,
            rgba(0, 0, 0, 0.9) 100%
        );

    mask-image:
        radial-gradient(
            ellipse 90% 80% at 50% 40%,
            transparent 30%,
            rgba(0, 0, 0, 0.9) 100%
        );
}

/* العلامة المائية أعلى الصفحة */
.scps-coming-soon__watermark {
    position: absolute;

    top: -8vmin;
    inset-inline-end: -6vmin;

    width: 42vmin;

    opacity: 0.06;

    pointer-events: none;
}

/* الشعار الرئيسي */
.scps-coming-soon__logo {
    width: clamp(150px, 26vw, 230px);
    height: auto;
}

/* النص الرئيسي */
.scps-coming-soon__content {
    display: flex;
    flex-direction: column;

    gap: 14px;

    max-width: 680px;

    align-items: center;
}

/* شارة ترقبوا */
.scps-coming-soon__badge {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    padding: 8px 20px;

    border-radius: 999px;

    background: rgba(42, 157, 143, 0.12);

    border: 1px solid rgba(42, 157, 143, 0.4);

    color: #1f7a6f;

    font-size: clamp(13px, 2vw, 15px);

    font-weight: 500;
}

/* العنوان */
.scps-coming-soon__title {
    margin: 0;

    font-size: clamp(30px, 6vw, 56px);

    font-weight: 800;

    line-height: 1.2;

    color: #184f48;
}

/* الوصف */
.scps-coming-soon__description {
    margin: 0;

    font-size: clamp(15px, 2.4vw, 19px);

    line-height: 1.7;

    color: rgba(24, 79, 72, 0.75);
}

/* التواصل */
.scps-coming-soon__contact {
    display: flex;
    flex-wrap: wrap;

    align-items: center;
    justify-content: center;

    gap: 8px;

    font-size: clamp(13px, 2vw, 15px);

    color: rgba(24, 79, 72, 0.6);
}

.scps-coming-soon__email {
    color: #2a9d8f;

    font-weight: 500;

    text-decoration: none;
}

.scps-coming-soon__email:hover {
    color: #184f48;
}

/* حركة الشبكة كما في المصدر */
@keyframes scpsGrid {
    from {
        background-position: 0 0;
    }

    to {
        background-position: 56px 56px;
    }
}

/* تقليل الحركة للمستخدم الذي يفضل ذلك */
@media (prefers-reduced-motion: reduce) {
    .scps-coming-soon__grid {
        animation: none;
    }
}

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

body {
    font-family: 'DinNextRegular', Tahoma, Arial, sans-serif;
}

.scps-form {
    margin: 0;
    padding: 0;
    width: 100%;
    min-height: 100vh;
}

.scps-coming-soon {
    position: relative;
    overflow: hidden;
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: clamp(20px, 3.5vh, 36px);
    padding: clamp(24px, 6vw, 64px) clamp(16px, 6vw, 48px);
    box-sizing: border-box;
    text-align: center;
    color: #184f48;
    background: linear-gradient( 180deg, #ffffff 0%, #f2faf9 45%, #d9efec 100% );
}

.scps-coming-soon__grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background-image: linear-gradient( rgba(42, 157, 143, 0.12) 1px, transparent 1px ), linear-gradient( 90deg, rgba(42, 157, 143, 0.12) 1px, transparent 1px );
    background-size: 56px 56px;
    animation: scpsGrid 7s linear infinite;
    -webkit-mask-image: radial-gradient( ellipse 90% 80% at 50% 40%, transparent 30%, rgba(0, 0, 0, .9) 100% );
    mask-image: radial-gradient( ellipse 90% 80% at 50% 40%, transparent 30%, rgba(0, 0, 0, .9) 100% );
}

.scps-coming-soon__watermark {
    position: absolute;
    top: -8vmin;
    inset-inline-end: -6vmin;
    width: 42vmin;
    height: auto;
    opacity: .045;
    pointer-events: none;
    user-select: none;
}

.scps-coming-soon__logo {
    position: relative;
    display: block;
    width: clamp(150px, 26vw, 230px);
    max-height: 160px;
    object-fit: contain;
    height: auto;
}

.scps-coming-soon__content {
    position: relative;
    width: min(100%, 680px);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 14px;
}

.scps-coming-soon__badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 20px;
    border-radius: 999px;
    background: rgba(42, 157, 143, .12);
    border: 1px solid rgba(42, 157, 143, .4);
    color: #1f7a6f;
    font-family: 'DinNextMedium';
    font-size: clamp(13px, 2vw, 15px);
}

.scps-coming-soon__title {
    margin: 0;
    color: #184f48;
    font-family: 'DinNextBold';
    font-size: clamp(30px, 6vw, 56px);
    font-weight: normal;
    line-height: 1.25;
}

.scps-coming-soon__description {
    margin: 0;
    color: rgba(24, 79, 72, .78);
    font-family: 'DinNextRegular';
    font-size: clamp(16px, 2.4vw, 20px);
    line-height: 1.8;
}

.scps-coming-soon__sub-description {
    margin: -4px 0 0;
    color: rgba(24, 79, 72, .58);
    font-family: 'DinNextRegular';
    font-size: clamp(14px, 2vw, 17px);
    line-height: 1.7;
}

.scps-coming-soon__social {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
}

    .scps-coming-soon__social a {
        width: 42px;
        height: 42px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        border: 1px solid rgba(42, 157, 143, .25);
        background: rgba(255, 255, 255, .58);
        color: #278f83;
        text-decoration: none;
        font-size: 19px;
        transition: transform .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
    }

        .scps-coming-soon__social a:hover {
            transform: translateY(-3px);
            background: #2a9d8f;
            border-color: #2a9d8f;
            color: #ffffff;
        }

.scps-coming-soon__credit {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    direction: ltr;
    color: rgba(24, 79, 72, .45);
    font-family: Arial, sans-serif;
    font-size: 11px;
}

    .scps-coming-soon__credit a {
        color: rgba(31, 122, 111, .70);
        text-decoration: none;
    }

        .scps-coming-soon__credit a:hover {
            color: #184f48;
        }

@keyframes scpsGrid {

    from {
        background-position: 0 0;
    }

    to {
        background-position: 56px 56px;
    }
}

@media (max-width: 576px) {

    .scps-coming-soon {
        gap: 20px;
        padding: 30px 18px;
    }

    .scps-coming-soon__logo {
        width: 160px;
        max-height: 120px;
    }

    .scps-coming-soon__watermark {
        width: 55vmin;
    }

    .scps-coming-soon__social a {
        width: 39px;
        height: 39px;
        font-size: 17px;
    }
}

@media (prefers-reduced-motion: reduce) {

    .scps-coming-soon__grid {
        animation: none;
    }
}