/**
 * Landing (Home) — layout, motion & ambient (Home only).
 */
.home-page {
    position: relative;
    overflow: hidden;
    text-align: center;
}

/* --- Ambient orbs --- */
.home-page__ambient {
    position: absolute;
    inset: -20% -10% -10% -10%;
    pointer-events: none;
    z-index: 0;
}

.home-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(48px);
    opacity: 0.55;
    mix-blend-mode: screen;
    will-change: transform;
}

.home-orb--a {
    width: min(42vw, 22rem);
    height: min(42vw, 22rem);
    left: 12%;
    top: 18%;
    background: radial-gradient(circle at 30% 30%, rgba(120, 170, 255, 0.55), transparent 68%);
    animation: home-orb-drift-a 18s ease-in-out infinite;
}

.home-orb--b {
    width: min(50vw, 26rem);
    height: min(50vw, 26rem);
    right: 5%;
    bottom: 12%;
    background: radial-gradient(circle at 60% 50%, rgba(80, 120, 220, 0.45), rgba(40, 70, 140, 0.2) 55%, transparent 72%);
    animation: home-orb-drift-b 22s ease-in-out infinite;
}

.home-orb--c {
    width: min(36vw, 18rem);
    height: min(36vw, 18rem);
    left: 50%;
    top: 48%;
    background: radial-gradient(circle, rgba(160, 210, 255, 0.35), transparent 65%);
    animation: home-orb-drift-c 14s ease-in-out infinite;
}

@keyframes home-orb-drift-a {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    33% {
        transform: translate(8%, -6%) scale(1.06);
    }
    66% {
        transform: translate(-5%, 4%) scale(0.96);
    }
}

@keyframes home-orb-drift-b {
    0%,
    100% {
        transform: translate(0, 0) scale(1);
    }
    40% {
        transform: translate(-10%, -8%) scale(1.08);
    }
    70% {
        transform: translate(6%, 10%) scale(0.94);
    }
}

@keyframes home-orb-drift-c {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
    }
    50% {
        transform: translate(-48%, -56%) scale(1.12);
    }
}

/* --- Soft vignette grid pulse --- */
.home-page__grid {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 0;
    opacity: 0.35;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
    background-size: 56px 56px;
    mask-image: radial-gradient(ellipse 75% 65% at 50% 45%, black 15%, transparent 75%);
    animation: home-grid-breathe 10s ease-in-out infinite;
}

@keyframes home-grid-breathe {
    0%,
    100% {
        opacity: 0.28;
    }
    50% {
        opacity: 0.42;
    }
}

/* --- Hero glow orbs (legacy + second layer) --- */
.home-glow {
    position: absolute;
    border-radius: 50%;
    pointer-events: none;
    z-index: 0;
}

.home-glow--primary {
    width: min(90vw, 28rem);
    height: min(90vw, 28rem);
    left: 50%;
    top: 42%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(91, 140, 255, 0.28) 0%, transparent 62%);
    filter: blur(44px);
    animation: home-glow-pulse 6s ease-in-out infinite;
}

.home-glow--secondary {
    width: min(70vw, 20rem);
    height: min(70vw, 20rem);
    left: 50%;
    top: 48%;
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(130, 180, 255, 0.15) 0%, transparent 55%);
    filter: blur(32px);
    animation: home-glow-pulse 6s ease-in-out infinite 0.8s reverse;
}

@keyframes home-glow-pulse {
    0%,
    100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.85;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.12);
        opacity: 1;
    }
}

/* --- Decorative ring --- */
.home-page__ring {
    position: absolute;
    left: 50%;
    top: 44%;
    width: min(78vw, 24rem);
    height: min(78vw, 24rem);
    transform: translate(-50%, -50%);
    border-radius: 50%;
    border: 1px solid rgba(255, 255, 255, 0.07);
    pointer-events: none;
    z-index: 0;
    animation: home-ring-spin 48s linear infinite;
    box-shadow:
        inset 0 0 60px rgba(91, 140, 255, 0.06),
        0 0 80px rgba(20, 40, 90, 0.35);
}

@keyframes home-ring-spin {
    from {
        transform: translate(-50%, -50%) rotate(0deg);
    }
    to {
        transform: translate(-50%, -50%) rotate(360deg);
    }
}

.home-page__ring::after {
    content: "";
    position: absolute;
    inset: 12%;
    border-radius: 50%;
    border: 1px dashed rgba(255, 255, 255, 0.06);
    animation: home-ring-spin 32s linear infinite reverse;
}

/* --- Hero content --- */
.home-hero {
    position: relative;
    z-index: 1;
    max-width: 36rem;
}

.home-title {
    margin: 0 0 1.75rem;
    font-size: clamp(2.25rem, 6vw, 3.25rem);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    background: linear-gradient(
        125deg,
        #ffffff 0%,
        #c8d7f5 35%,
        #a8c4ff 55%,
        rgba(200, 215, 245, 0.88) 100%
    );
    background-size: 220% 220%;
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    animation:
        home-title-rise 1.05s cubic-bezier(0.22, 1, 0.36, 1) both,
        home-title-gradient 12s ease-in-out infinite 0.4s;
}

@keyframes home-title-rise {
    from {
        opacity: 0;
        transform: translateY(36px);
        filter: blur(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
        filter: blur(0);
    }
}

@keyframes home-title-gradient {
    0%,
    100% {
        background-position: 0% 40%;
    }
    50% {
        background-position: 100% 60%;
    }
}

/* Home-only CTA enhancements */
.home-page .home-cta {
    position: relative;
    overflow: hidden;
    animation: home-cta-rise 1s cubic-bezier(0.22, 1, 0.36, 1) 0.22s both;
}

@keyframes home-cta-rise {
    from {
        opacity: 0;
        transform: translateY(24px) scale(0.96);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.home-page .home-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    left: -120%;
    pointer-events: none;
    background: linear-gradient(
        105deg,
        transparent 0%,
        transparent 40%,
        rgba(255, 255, 255, 0.35) 50%,
        transparent 58%,
        transparent 100%
    );
    transform: skewX(-18deg);
    opacity: 0;
    transition: opacity 0.35s ease;
}

.home-page .home-cta:hover::before {
    opacity: 1;
    animation: home-cta-shine 1.1s ease forwards;
}

@keyframes home-cta-shine {
    from {
        left: -120%;
    }
    to {
        left: 120%;
    }
}

.home-page .home-cta:hover {
    box-shadow:
        0 18px 48px rgba(0, 24, 72, 0.55),
        0 0 0 1px rgba(91, 140, 255, 0.35),
        0 0 40px rgba(91, 140, 255, 0.22),
        inset 0 1px 0 rgba(255, 255, 255, 0.28);
}

/* Respect user preference */
@media (prefers-reduced-motion: reduce) {
    .home-page .home-orb,
    .home-page .home-page__grid,
    .home-page .home-glow,
    .home-page .home-page__ring,
    .home-page .home-page__ring::after,
    .home-page .home-title,
    .home-page .home-cta,
    .home-page .home-cta:hover::before {
        animation: none !important;
        transition: none !important;
    }

    .home-page .home-title {
        opacity: 1;
        transform: none;
        filter: none;
        background-position: 50% 50%;
    }

    .home-page .home-cta {
        opacity: 1;
        transform: none;
    }

    .home-page .home-cta::before {
        display: none;
    }
}
