/* ── Transitions ──────────────────────────────────────────── */
:root {
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --duration: 500ms;
}

/* ── Noise texture ───────────────────────────────────────── */
.noise {
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.015'/%3E%3C/svg%3E");
    background-repeat: repeat;
    background-size: 256px 256px;
}

/* ── Aurora blobs (boosted) ──────────────────────────────── */
.aurora-blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(120px);
    will-change: transform;
}

.aurora-blob--1 {
    width: 750px;
    height: 750px;
    background: rgba(99, 102, 241, 0.18);
    top: -15%;
    left: -10%;
    animation: aurora1 22s ease-in-out infinite alternate;
}

.aurora-blob--2 {
    width: 650px;
    height: 650px;
    background: rgba(6, 182, 212, 0.13);
    bottom: -15%;
    right: -10%;
    animation: aurora2 26s ease-in-out infinite alternate;
}

.aurora-blob--3 {
    width: 600px;
    height: 600px;
    background: rgba(139, 92, 246, 0.11);
    top: 35%;
    left: 45%;
    animation: aurora3 20s ease-in-out infinite alternate;
}

@keyframes aurora1 {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(20vw, 12vh) scale(1.2); }
    66%  { transform: translate(8vw, 25vh) scale(1.05); }
    100% { transform: translate(14vw, 5vh) scale(1.15); }
}

@keyframes aurora2 {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(-15vw, -18vh) scale(1.15); }
    66%  { transform: translate(-8vw, -8vh) scale(1.1); }
    100% { transform: translate(-12vw, -14vh) scale(1.05); }
}

@keyframes aurora3 {
    0%   { transform: translate(0, 0) scale(1); }
    33%  { transform: translate(-12vw, 12vh) scale(1.25); }
    66%  { transform: translate(8vw, -8vh) scale(0.9); }
    100% { transform: translate(-4vw, 6vh) scale(1.1); }
}

/* ── Hero word ───────────────────────────────────────────── */
.hero-word {
    position: relative;
}

/* Responsive hero font size */
.hero-size {
    font-size: clamp(64px, 18vw, 90px);
}

@media (min-width: 640px) {
    .hero-size {
        font-size: clamp(80px, 15vw, 240px);
    }
}

/* Individual letter entrance */
.hero-letter {
    display: inline-block;
    opacity: 0;
    filter: blur(20px);
    transform: translateY(30px);
}

.hero-letter.revealed {
    opacity: 1;
    filter: blur(0);
    transform: translateY(0);
    transition: opacity 600ms var(--ease-out-expo),
                filter 600ms var(--ease-out-expo),
                transform 600ms var(--ease-out-expo);
}

/* Faster reveal on mobile */
@media (max-width: 639px) {
    .hero-letter.revealed {
        transition-duration: 400ms;
    }
}

/* "linkr" gradient letters */
.hero-letter--gradient {
    background: linear-gradient(to right, #6366F1, #06B6D4);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

/* Underline on hover */
.hero-underline {
    height: 2px;
    width: 0;
    background: linear-gradient(to right, #6366F1, #06B6D4);
    border-radius: 1px;
    transition: width var(--duration) var(--ease-out-expo);
}

.hero-word:hover ~ .hero-underline,
.hero-word:hover + .hero-underline {
    width: 100%;
}

/* Gradient shift on hover for linkr letters */
.hero-word:hover .hero-letter--gradient {
    filter: hue-rotate(15deg) brightness(1.15);
    transition: filter var(--duration) var(--ease-out-expo);
}

/* ── Typewriter cursor ───────────────────────────────────── */
.typewriter-cursor {
    animation: blink 1s steps(1) infinite;
    color: #6366F1;
    font-weight: 500;
}

@keyframes blink {
    0%, 100% { opacity: 1; }
    50%      { opacity: 0; }
}

/* ── Status dot pulse ────────────────────────────────────── */
.status-dot {
    animation: pulse-dot 2s ease-in-out infinite;
}

@keyframes pulse-dot {
    0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); }
    50%      { opacity: 0.7; box-shadow: 0 0 0 4px rgba(16, 185, 129, 0); }
}

/* ── Cascade entrance ────────────────────────────────────── */
.cascade-item {
    opacity: 0;
    transform: translateY(20px);
}

.cascade-item.visible {
    opacity: 1;
    transform: translateY(0);
    transition: opacity var(--duration) var(--ease-out-expo),
                transform var(--duration) var(--ease-out-expo);
}

/* ── Form ────────────────────────────────────────────────── */
.form-email:focus + .form-submit {
    color: #6366F1;
}

/* Autofill */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #020617 inset;
    -webkit-text-fill-color: #F8FAFC;
    caret-color: #F8FAFC;
}

/* ── Scrollbar ───────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(99, 102, 241, 0.2); border-radius: 3px; }

/* ── Transition utility ──────────────────────────────────── */
.duration-400 {
    transition-duration: 400ms;
    transition-timing-function: var(--ease-out-expo);
}