@keyframes aurora-float-1 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1) rotate(0deg); }
    33% { transform: translate3d(40px, -30px, 0) scale(1.12) rotate(6deg); }
    66% { transform: translate3d(-25px, 25px, 0) scale(0.94) rotate(-4deg); }
}
@keyframes aurora-float-2 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50% { transform: translate3d(-45px, -35px, 0) scale(1.15); }
}
.aurora-blob-1 {
    animation: aurora-float-1 16s ease-in-out infinite;
}
.aurora-blob-2 {
    animation: aurora-float-2 20s ease-in-out infinite;
}

@keyframes float-slow {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-9px); }
}
@keyframes float-delayed {
    0%, 100% { transform: translateY(0px); }
    50% { transform: translateY(-7px); }
}
.ui-float {
    animation: float-slow 5.5s ease-in-out infinite;
}
.ui-float-delayed {
    animation: float-delayed 6.5s ease-in-out 1.5s infinite;
}

@keyframes thread-flow {
    0% { stroke-dashoffset: 300; }
    100% { stroke-dashoffset: 0; }
}
.animate-thread {
    stroke-dasharray: 14 10;
    animation: thread-flow 10s linear infinite;
}

@keyframes marquee-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.animate-marquee {
    display: flex;
    width: max-content;
    animation: marquee-scroll 38s linear infinite;
}
.animate-marquee:hover {
    animation-play-state: paused;
}

.text-gradient-no {
    background: linear-gradient(105deg, #284436 0%, #48785b 42%, #e07638 82%, #e2543d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.text-gradient-light {
    background: linear-gradient(105deg, #ffffff 0%, #b5ebd0 50%, #f7b785 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.stage-3d {
    perspective: 1400px;
}
.card-3d {
    transform-style: preserve-3d;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
    will-change: transform;
}
.depth-layer-1 {
    transform: translateZ(28px);
}
.depth-layer-2 {
    transform: translateZ(48px);
}

.spotlight-card {
    position: relative;
    overflow: hidden;
}
.spotlight-card::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(
        520px circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
        rgba(107, 168, 137, 0.16),
        transparent 45%
    );
    opacity: 0;
    transition: opacity 0.35s ease;
    pointer-events: none;
    z-index: 1;
}
.spotlight-card:hover::before {
    opacity: 1;
}

.noise-overlay {
    background-image: url("../img/noise-overlay.2520d873fe50.svg");
}

.hero-top-gradient {
    background-color: #f8fafc;
    background-image:
        radial-gradient(ellipse 60% 45% at 15% 0%, rgba(252, 236, 208, 0.55), transparent 70%),
        radial-gradient(ellipse 60% 45% at 85% 0%, rgba(219, 240, 228, 0.55), transparent 70%),
        linear-gradient(180deg, #ffffff 0%, #fdfbf7 35%, #f6faf7 72%, #f8fafc 100%);
    background-repeat: no-repeat;
}

.reveal-section {
    opacity: 0;
    filter: blur(8px);
    transform: translateY(36px) scale(0.98);
    transition:
        opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
        filter 0.9s cubic-bezier(0.16, 1, 0.3, 1),
        transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
}
.reveal-section.is-visible {
    opacity: 1;
    filter: blur(0px);
    transform: translateY(0) scale(1);
}

.landing-header-pill {
    position: relative;
    width: 100%;
    max-width: 80rem;
    height: 4rem;
    padding-left: 1rem;
    padding-right: 1rem;
    border-radius: 9999px;
    transform: translate3d(0, 0, 0);
    will-change: max-width, height, padding, transform;
    transition:
        max-width 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        height 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        padding 0.55s cubic-bezier(0.22, 1, 0.36, 1),
        transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
}
.landing-header-pill::before {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background-color: rgba(255, 255, 255, 0.90);
    border: 1px solid rgba(220, 211, 190, 0.9);
    box-shadow: 0 14px 34px -10px rgba(25, 52, 39, 0.12);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.landing-header-pill.is-scrolled {
    max-width: 54rem;
    height: 3.15rem;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    transform: translate3d(0, -4px, 0);
}
.landing-header-pill.is-scrolled::before {
    opacity: 1;
}
.landing-header-scale-left {
    position: relative;
    z-index: 1;
    transform-origin: left center;
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}
.landing-header-scale-right {
    position: relative;
    z-index: 1;
    transform-origin: right center;
    transition: transform 0.55s cubic-bezier(0.22, 1, 0.36, 1);
    will-change: transform;
}
.landing-header-pill.is-scrolled .landing-header-scale-left {
    transform: scale(0.91);
}
.landing-header-pill.is-scrolled .landing-header-scale-right {
    transform: scale(0.91);
}