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

html,
body {
    width: 100%;
    height: 100%;
}

body {
    background:
        url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.09' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='400' height='400' filter='url(%23n)'/%3E%3C/svg%3E"),
        radial-gradient(ellipse 90% 55% at 28% 60%, rgba(42, 60, 82, 0.7) 0%, transparent 62%),
        radial-gradient(ellipse 60% 80% at 74% 30%, rgba(16, 28, 44, 0.6) 0%, transparent 58%),
        radial-gradient(ellipse 70% 50% at 55% 80%, rgba(10, 20, 34, 0.5) 0%, transparent 55%),
        radial-gradient(ellipse at 50% 42%, #263549 0%, #121f2d 52%, #080e18 100%);
    background-size: 400px 400px, auto, auto, auto, auto;
    background-blend-mode: soft-light, normal, normal, normal, normal;
    font-family:
        "Segoe UI",
        system-ui,
        -apple-system,
        sans-serif;
}

footer {
    position: relative;
    z-index: 1;
    width: 100%;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
    padding: 1rem 2rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    flex-wrap: wrap;
}

.footer-links {
    display: flex;
    gap: 1.5rem;
}

footer a,
.footer-copy {
    font-size: 0.75rem;
    color: rgba(255, 255, 255, 0.22);
    text-decoration: none;
    letter-spacing: 0.03em;
    transition: color 0.2s;
}

footer a:hover {
    color: rgba(255, 255, 255, 0.5);
}

.projects {
    display: flex;
    justify-content: center;
    gap: 1rem;
    margin-top: 2.5rem;
}

.project-link {
    display: inline-block;
    padding: 0.6em 1.4em;
    font-size: clamp(0.8rem, 1.8vw, 1rem);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-decoration: none;
    border: 1px solid rgba(212, 130, 90, 0.35);
    border-radius: 6px;
    color: rgba(212, 130, 90, 0.75);
    transition: border-color 0.2s, color 0.2s, background 0.2s;
}

.project-link:hover {
    border-color: rgba(212, 130, 90, 0.7);
    color: rgba(245, 212, 154, 0.95);
    background: rgba(212, 130, 90, 0.08);
}

.grad-text {
    background: linear-gradient(
        135deg,
        #f5d49a 0%,
        #d4825a 40%,
        #b86848 70%,
        #e09a70 100%
    );
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}