/* Radiran A/C — measured airflow motion for shared public-facing heroes. */

@keyframes radiran-home-grid-drift {
    from { background-position: 0 0, 0 0, 34px 59px, 34px 59px, 0 0; }
    to { background-position: 68px 118px, 68px 118px, 102px 177px, 102px 177px, 68px 118px; }
}

@keyframes radiran-hero-grid-drift {
    from { background-position: 0 0, 0 0; }
    to {
        background-position:
            var(--hero-grid-step, 54px) var(--hero-grid-step, 54px),
            var(--hero-grid-step, 54px) var(--hero-grid-step, 54px);
    }
}

@keyframes radiran-hero-ring-forward {
    to { transform: rotate(360deg); }
}

@keyframes radiran-hero-ring-reverse {
    to { transform: rotate(-360deg); }
}

@keyframes radiran-hero-mark-pulse {
    0%, 100% { opacity: .78; }
    50% { opacity: 1; }
}

@keyframes radiran-orbit-breathe {
    0%, 100% {
        opacity: .82;
        box-shadow: 0 0 2rem rgba(18, 219, 195, .07), inset 0 0 2rem rgba(18, 219, 195, .035);
    }
    50% {
        opacity: 1;
        box-shadow: 0 0 2.6rem rgba(18, 219, 195, .12), inset 0 0 2.2rem rgba(18, 219, 195, .065);
    }
}

@keyframes radiran-guide-breathe {
    0%, 100% { opacity: .54; }
    50% { opacity: .82; }
}

@keyframes radiran-status-signal {
    0%, 100% { opacity: .72; box-shadow: 0 0 .45rem currentColor; }
    50% { opacity: 1; box-shadow: 0 0 .8rem currentColor; }
}

@keyframes radiran-verify-signal {
    0%, 100% { opacity: .78; box-shadow: 0 0 0 6px rgba(18, 219, 195, .1), 0 0 14px rgba(18, 219, 195, .52); }
    50% { opacity: 1; box-shadow: 0 0 0 8px rgba(18, 219, 195, .04), 0 0 19px rgba(18, 219, 195, .72); }
}

/* Home: drift only the drafting field and ambient light; orbit nodes stay untouched. */
.hero--radiran .hero__hex-field {
    animation: radiran-home-grid-drift 118s linear infinite;
    pointer-events: none;
}

.hero--radiran .hero__ambient--teal { animation-duration: 19s; }
.hero--radiran .hero__ambient--gold { animation-duration: 25s; }
.hero--radiran .orbit--primary { animation: radiran-orbit-breathe 17s ease-in-out infinite; }
.hero--radiran .orbit--guide { animation: radiran-guide-breathe 21s ease-in-out infinite; }
.hero--radiran .orbit-readout i { animation: radiran-status-signal 4.2s ease-in-out infinite; }

/* Shared standard, directory, profile, and panel heroes. */
.page-hero {
    --hero-motion-rgb: 18, 219, 195;
    position: relative;
    isolation: isolate;
}

.page-hero--catalog,
.page-hero--partners { --hero-motion-rgb: 40, 184, 239; }
.page-hero--about,
.page-hero--contact { --hero-motion-rgb: 220, 169, 79; }
.page-hero--projects { --hero-motion-rgb: 18, 219, 195; }
.page-hero--panel { --hero-motion-rgb: 18, 219, 195; }

.page-hero__grid,
.auth-page__visual-grid,
.verify-hero__grid {
    --hero-grid-step: 54px;
    animation: radiran-hero-grid-drift 96s linear infinite;
    pointer-events: none;
}

.auth-page__visual-grid { --hero-grid-step: 3rem; }

.page-hero__grid {
    --hero-grid-step: 54px;
    --hero-motion-rgb: 18, 219, 195;
    overflow: hidden;
}

.page-hero--catalog .page-hero__grid,
.page-hero--partners .page-hero__grid { --hero-motion-rgb: 40, 184, 239; }
.page-hero--about .page-hero__grid,
.page-hero--contact .page-hero__grid { --hero-motion-rgb: 220, 169, 79; }

.page-hero__grid::before,
.page-hero__grid::after,
.verify-hero__grid::before,
.verify-hero__grid::after {
    content: '';
    position: absolute;
    top: -38%;
    inset-inline-end: clamp(1rem, 9vw, 9rem);
    width: clamp(16rem, 36vw, 32rem);
    aspect-ratio: 1;
    border: 1px dashed rgba(var(--hero-motion-rgb, 18, 219, 195), .15);
    border-radius: 50%;
    box-shadow: 0 0 0 1.25rem rgba(var(--hero-motion-rgb, 18, 219, 195), .018), inset 0 0 2.8rem rgba(var(--hero-motion-rgb, 18, 219, 195), .035);
    pointer-events: none;
    animation: radiran-hero-ring-forward 92s linear infinite;
}

.page-hero__grid::after,
.verify-hero__grid::after {
    top: -21%;
    inset-inline-end: clamp(3rem, 14vw, 12rem);
    width: clamp(11rem, 27vw, 23rem);
    border-style: solid;
    border-color: rgba(220, 169, 79, .12);
    box-shadow: 0 0 0 .8rem rgba(220, 169, 79, .014);
    animation-name: radiran-hero-ring-reverse;
    animation-duration: 76s;
}

.page-hero--about .page-hero__grid::before,
.page-hero--contact .page-hero__grid::before { border-color: rgba(220, 169, 79, .18); }

.page-hero__visual .visual-icon {
    animation: radiran-hero-mark-pulse 7.5s ease-in-out infinite;
}

/* Auth visuals keep their existing orbit, with a slower technical grid. */
.auth-page__visual { --hero-motion-rgb: 18, 219, 195; }
.auth-page__visual::before { animation-duration: 58s; }

/* Verification keeps the existing inline layout and gives its grid a calm signal. */
.verify-hero { --hero-motion-rgb: 220, 169, 79; }
.verify-hero__grid { --hero-grid-step: 52px; }
.verify-hero__kicker::after { animation: radiran-verify-signal 4.8s ease-in-out infinite; }

/* Restrained color cues remain decorative and do not alter text contrast. */
html[data-theme='light'] .page-hero__grid::before,
html[data-theme='light'] .page-hero__grid::after,
html[data-theme='light'] .verify-hero__grid::before,
html[data-theme='light'] .verify-hero__grid::after { opacity: .58; }

@media (max-width: 640px) {
    .page-hero__grid,
    .auth-page__visual-grid,
    .verify-hero__grid { animation-duration: 124s; }

    .page-hero__grid::before,
    .verify-hero__grid::before {
        top: -30%;
        inset-inline-end: -2.5rem;
        width: 17rem;
    }

    .page-hero__grid::after,
    .verify-hero__grid::after {
        top: -12%;
        inset-inline-end: 3.5rem;
        width: 12rem;
    }

    .hero--radiran .hero__hex-field { opacity: .3; }
}

@media (max-width: 360px) {
    .page-hero__grid::after,
    .verify-hero__grid::after { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    .hero--radiran .hero__hex-field,
    .hero--radiran .hero__ambient,
    .hero--radiran .orbit--primary,
    .hero--radiran .orbit--guide,
    .hero--radiran .orbit-readout i,
    .page-hero__grid,
    .page-hero__grid::before,
    .page-hero__grid::after,
    .page-hero__visual .visual-icon,
    .auth-page__visual::before,
    .auth-page__visual-grid,
    .verify-hero__grid,
    .verify-hero__grid::before,
    .verify-hero__grid::after,
    .verify-hero__kicker::after { animation: none !important; }
}
