@import url('https://fonts.googleapis.com/css2?family=Kufam:wght@400;700;800&display=swap');

/* ── Global reset & helper styles ────────────────────────────────── */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
    /* اجعل Kufam هو الخط الأساسي مع خطوط احتياطية */
    font-family: "Kufam", "IBM Plex Sans", "Segoe UI", Tahoma, sans-serif;
}

html, body {
    height: 100%;
}

body {
    /* Purple–blue radial/linear blend similar to your image */

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: #fff;
}

/* ── Logo ─────────────────────────────────────────────────────────── */
.logo {
    width: 50%;          /* adjust as needed */
    margin-bottom: 2rem;
}

/* ── Blob-shaped frame behind the text ────────────────────────────── */


/* ── Main heading ─────────────────────────────────────────────────── */
h1 {
    font-size: clamp(2.5rem, 8vw, 6rem);
    font-weight: 800;
    color: #fff;
    text-shadow:
        0 2px 4px rgba(0, 0, 0, 0.4),
        0 10px 20px rgba(0, 0, 0, 0.15);
}

.gradient {
	width: 100vw;
	height: 100vh;
	background: linear-gradient(334deg, #6b97f7, #7525e2, #f7137e);
	background-size: 180% 180%;
	animation: gradient-animation 6s ease infinite;
}

@keyframes gradient-animation {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}