/* ============================================
   ALIEN THEME
   ============================================ */

body[data-theme="alien"] {
    --primary-color: #22c55e;
    --secondary-color: #84cc16;
    --accent-color: #14b8a6;
    --text-dark: #dcfce7;
    --text-light: #bbf7d0;
    --text-muted: #86efac;
    --light-bg: #10251a;
    --white: #041109;
    --border-color: #166534;
}

body[data-theme="alien"] .navbar {
    box-shadow: 0 2px 10px rgba(34, 197, 94, 0.18);
}

body[data-theme="alien"] .hero {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.12), rgba(20, 184, 166, 0.08));
}

body[data-theme="alien"] .who-its-for,
body[data-theme="alien"] .about-sean,
body[data-theme="alien"] .contact {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.07), rgba(132, 204, 22, 0.04));
}

body[data-theme="alien"] .how-sessions-work,
body[data-theme="alien"] .faq {
    background: linear-gradient(135deg, rgba(20, 184, 166, 0.06), rgba(34, 197, 94, 0.05));
}

body[data-theme="alien"] .card:hover,
body[data-theme="alien"] .faq-item.active {
    box-shadow: 0 10px 30px rgba(34, 197, 94, 0.2);
}

body[data-theme="alien"] .avatar-placeholder {
    background: linear-gradient(135deg, rgba(34, 197, 94, 0.18), rgba(20, 184, 166, 0.16));
}

body[data-theme="alien"] .theme-backdrop {
    opacity: 1;
}

body[data-theme="alien"] .theme-layer-atmosphere {
    inset: 0;
    background:
        radial-gradient(circle at 18% 18%, rgba(132, 204, 22, 0.18), transparent 22%),
        radial-gradient(circle at 82% 14%, rgba(20, 184, 166, 0.16), transparent 24%),
        radial-gradient(circle at 50% 86%, rgba(34, 197, 94, 0.13), transparent 34%),
        linear-gradient(115deg, rgba(132, 204, 22, 0.05), transparent 42%, rgba(20, 184, 166, 0.05));
}

body[data-theme="alien"] .theme-layer-edge {
    top: 17vh;
    width: min(24vw, 260px);
    height: min(44vh, 380px);
    border-radius: 52% 48% 60% 40% / 42% 44% 56% 58%;
    background:
        radial-gradient(ellipse at 50% 32%, rgba(187, 247, 208, 0.16), transparent 26%),
        radial-gradient(ellipse at 50% 58%, rgba(34, 197, 94, 0.38), rgba(6, 78, 59, 0.78) 68%, rgba(3, 24, 13, 0.9));
    box-shadow:
        0 0 42px rgba(34, 197, 94, 0.18),
        inset 0 -26px 36px rgba(3, 24, 13, 0.42);
    opacity: 0.72;
    animation: alienPeek 9s ease-in-out infinite;
}

body[data-theme="alien"] .theme-layer-edge-left {
    left: max(-180px, -13vw);
    transform: rotate(8deg);
}

body[data-theme="alien"] .theme-layer-edge-right {
    right: max(-180px, -13vw);
    transform: rotate(-8deg);
    animation-delay: -3s;
}

body[data-theme="alien"] .theme-eye {
    width: clamp(34px, 5vw, 68px);
    height: clamp(54px, 8vw, 104px);
    border-radius: 52% 48% 54% 46% / 58% 58% 42% 42%;
    background:
        radial-gradient(ellipse at 48% 44%, rgba(187, 247, 208, 0.18), transparent 0 12%),
        radial-gradient(ellipse at 50% 54%, rgba(1, 12, 8, 0.98) 0 58%, rgba(20, 184, 166, 0.34) 62%, transparent 72%);
    box-shadow: 0 0 18px rgba(20, 184, 166, 0.22);
    animation: alienBlink 7s ease-in-out infinite;
}

body[data-theme="alien"] .eye-left-1 {
    top: 32%;
    right: 28%;
    --eye-tilt: -17deg;
    transform: rotate(var(--eye-tilt));
}

body[data-theme="alien"] .eye-left-2 {
    top: 34%;
    right: 9%;
    --eye-tilt: -9deg;
    transform: rotate(var(--eye-tilt));
    animation-delay: 0.12s;
}

body[data-theme="alien"] .eye-right-1 {
    top: 32%;
    left: 28%;
    --eye-tilt: 17deg;
    transform: rotate(var(--eye-tilt));
    animation-delay: -2.4s;
}

body[data-theme="alien"] .eye-right-2 {
    top: 34%;
    left: 9%;
    --eye-tilt: 9deg;
    transform: rotate(var(--eye-tilt));
    animation-delay: -2.28s;
}

body[data-theme="alien"] .theme-layer-bottom {
    top: 18vh;
    left: -18vw;
    width: clamp(130px, 18vw, 230px);
    height: clamp(54px, 7vw, 86px);
    border-radius: 50%;
    background:
        radial-gradient(ellipse at 50% 0%, rgba(187, 247, 208, 0.8) 0 16%, rgba(34, 197, 94, 0.42) 17% 35%, transparent 36%),
        radial-gradient(ellipse at 50% 62%, rgba(220, 252, 231, 0.6) 0 6%, transparent 7% 14%, rgba(34, 197, 94, 0.66) 15% 28%, rgba(3, 24, 13, 0.88) 70%);
    box-shadow: 0 0 38px rgba(34, 197, 94, 0.26);
    opacity: 0.64;
    animation: ufoCruise 19s linear infinite;
}

body[data-theme="alien"] .theme-layer-bottom::before {
    content: "";
    position: absolute;
    left: 18%;
    right: 18%;
    top: -28%;
    height: 58%;
    border-radius: 50% 50% 18% 18%;
    background: radial-gradient(ellipse at 50% 24%, rgba(220, 252, 231, 0.75), rgba(20, 184, 166, 0.28) 62%, transparent 70%);
}

body[data-theme="alien"] .theme-layer-bottom::after {
    content: "";
    position: absolute;
    left: 30%;
    right: 30%;
    top: 62%;
    height: 18vh;
    background: linear-gradient(to bottom, rgba(132, 204, 22, 0.18), transparent);
    clip-path: polygon(35% 0, 65% 0, 100% 100%, 0 100%);
    filter: blur(6px);
}

body[data-theme="alien"] .theme-layer-bottom .theme-eye {
    display: none;
}

@keyframes alienPeek {
    0%, 100% {
        opacity: 0.56;
        translate: 0 0;
    }
    45% {
        opacity: 0.76;
        translate: 0 -1vh;
    }
}

@keyframes alienBlink {
    0%, 88%, 100% {
        transform: scaleY(1) rotate(var(--eye-tilt, 0deg));
    }
    92%, 94% {
        transform: scaleY(0.08) rotate(var(--eye-tilt, 0deg));
    }
}

@keyframes ufoCruise {
    0% {
        transform: translate3d(-10vw, 0, 0) rotate(-2deg);
    }
    45% {
        transform: translate3d(58vw, 5vh, 0) rotate(3deg);
    }
    100% {
        transform: translate3d(118vw, -3vh, 0) rotate(-2deg);
    }
}

@media (max-width: 768px) {
    body[data-theme="alien"] .theme-layer-edge {
        width: 190px;
        height: 290px;
        opacity: 0.5;
    }
}