/* Era Soft — modern atmosphere + 21st.dev buttons */
:where(html.es-site) {
    --lux-radius: 9999px;
    --lux-ease: cubic-bezier(.22, 1, .36, 1);
}

.es-atmosphere,
.es-atmosphere * { pointer-events: none !important; }

.es-atmosphere__mesh {
    position: absolute;
    inset: -10%;
    background:
        radial-gradient(ellipse 70% 50% at 12% -10%, rgba(99, 102, 241, 0.18), transparent 52%),
        radial-gradient(ellipse 55% 45% at 92% 8%, rgba(56, 189, 248, 0.1), transparent 50%),
        radial-gradient(ellipse 50% 40% at 70% 100%, rgba(96, 165, 250, 0.08), transparent 55%),
        #0f172a;
}

.es-atmosphere__orb {
    position: absolute;
    border-radius: 9999px;
    filter: blur(70px);
    opacity: 0.55;
}

.es-atmosphere__orb--a {
    width: min(42rem, 70vw);
    height: min(42rem, 70vw);
    top: -18%;
    right: -12%;
    background: rgba(99, 102, 241, 0.16);
}

.es-atmosphere__orb--b {
    width: min(34rem, 60vw);
    height: min(34rem, 60vw);
    bottom: -16%;
    left: -10%;
    background: rgba(14, 165, 233, 0.1);
}

.es-atmosphere__grid {
    position: absolute;
    inset: 0;
    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 80% 70% at 50% 0%, #000 20%, transparent 78%);
}

.es-atmosphere__vignette {
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 75% 70% at 50% 40%, transparent 35%, rgba(15, 23, 42, 0.55) 100%);
}

.es-atmosphere__grain {
    position: absolute;
    inset: 0;
    opacity: 0.09;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

html.light .es-atmosphere__mesh {
    background:
        radial-gradient(ellipse 70% 50% at 10% -8%, rgba(99, 102, 241, 0.1), transparent 52%),
        radial-gradient(ellipse 50% 40% at 95% 0%, rgba(14, 165, 233, 0.08), transparent 48%),
        #f6f7f9;
}

html.light .es-atmosphere,
html.light .es-velaris-bg { background: #f6f7f9; }

html.light .es-atmosphere__orb--a { background: rgba(99, 102, 241, 0.1); }
html.light .es-atmosphere__orb--b { background: rgba(14, 165, 233, 0.08); }
html.light .es-atmosphere__grid {
    background-image:
        linear-gradient(rgba(15, 23, 42, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(15, 23, 42, 0.05) 1px, transparent 1px);
}
html.light .es-atmosphere__vignette {
    background: radial-gradient(ellipse 80% 70% at 50% 30%, transparent 40%, rgba(246, 247, 249, 0.75) 100%);
}
html.light .es-atmosphere__grain { opacity: 0.04; }

html.es-site .es-btn,
html.es-site .es-btn-primary,
html.es-site .es-btn-secondary,
html.es-site .es-btn-ghost,
html.es-site .es-btn-login,
html.es-site .es-btn-signup,
html.es-site .es-hero-btn-solid,
html.es-site .es-hero-btn-ghost,
html.es-site .es-icon-btn {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.75rem;
    padding: 0.55rem 1.15rem;
    border-radius: var(--lux-radius);
    font-size: 0.875rem;
    font-weight: 650;
    letter-spacing: -0.01em;
    line-height: 1;
    text-decoration: none;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
    transition: transform .25s var(--lux-ease), box-shadow .25s var(--lux-ease), background .25s ease, border-color .25s ease, color .25s ease, filter .25s ease;
}

html.es-site .es-btn-primary,
html.es-site .es-btn-signup,
html.es-site .es-hero-btn-solid,
html.es-site .es-auth-submit {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.14);
    background:
        linear-gradient(180deg, #fff 0%, #e4e4e7 100%) !important;
    color: #09090b !important;
    box-shadow:
        0 10px 28px rgba(0, 0, 0, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.7) !important;
}

html.es-site .es-btn-primary::after,
html.es-site .es-btn-signup::after,
html.es-site .es-hero-btn-solid::after,
html.es-site .es-auth-submit::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(115deg, transparent 20%, rgba(255,255,255,.5) 48%, transparent 72%);
    transform: translateX(-130%);
    animation: lux-shimmer 4.2s var(--lux-ease) infinite;
    pointer-events: none;
}

html.es-site .es-btn-primary > *,
html.es-site .es-btn-signup > *,
html.es-site .es-hero-btn-solid > *,
html.es-site .es-auth-submit > * {
    position: relative;
    z-index: 1;
}

html.es-site .es-btn-primary:hover,
html.es-site .es-btn-signup:hover,
html.es-site .es-hero-btn-solid:hover,
html.es-site .es-auth-submit:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow:
        0 16px 36px rgba(0, 0, 0, 0.34),
        inset 0 1px 0 rgba(255, 255, 255, 0.8) !important;
}

html.es-site .es-btn-primary:active,
html.es-site .es-btn-signup:active,
html.es-site .es-hero-btn-solid:active {
    transform: translateY(0);
}

html.es-site .es-btn-secondary,
html.es-site .es-btn-login,
html.es-site .es-hero-btn-ghost {
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #f4f4f5 !important;
    backdrop-filter: blur(16px);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

html.es-site .es-btn-secondary:hover,
html.es-site .es-btn-login:hover,
html.es-site .es-hero-btn-ghost:hover {
    transform: translateY(-2px);
    border-color: rgba(255, 255, 255, 0.36) !important;
    background: rgba(255, 255, 255, 0.12) !important;
    color: #fff !important;
}

html.es-site .es-btn-ghost {
    border: 1px solid transparent !important;
    background: transparent !important;
    color: inherit;
}

html.es-site .es-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.08) !important;
}

html.es-site .es-icon-btn {
    width: 2.75rem;
    min-width: 2.75rem;
    padding: 0;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.08);
    color: inherit;
    backdrop-filter: blur(16px);
}

html.es-site .es-icon-btn:hover {
    transform: translateY(-1px);
    border-color: rgba(255, 255, 255, 0.28);
    background: rgba(255, 255, 255, 0.12);
}

html.es-site .es-btn-primary:focus-visible,
html.es-site .es-btn-secondary:focus-visible,
html.es-site .es-btn-ghost:focus-visible,
html.es-site .es-btn-login:focus-visible,
html.es-site .es-btn-signup:focus-visible,
html.es-site .es-hero-btn-solid:focus-visible,
html.es-site .es-hero-btn-ghost:focus-visible,
html.es-site .es-icon-btn:focus-visible,
html.es-site .es-theme-item:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.18), 0 0 0 6px rgba(255, 255, 255, 0.08) !important;
}

@keyframes lux-shimmer {
    0%, 58% { transform: translateX(-130%); }
    78%, 100% { transform: translateX(130%); }
}

.es-auth-tools {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    z-index: 40;
    display: flex;
    align-items: center;
    gap: 0.45rem;
}
.es-auth-tools .es-auth-close { position: static !important; }

.es-theme { position: relative; }
.es-theme .es-icon-btn { display: grid; place-items: center; }
.es-theme-icon {
    grid-area: 1 / 1;
    transition: transform .35s var(--lux-ease), opacity .35s ease;
}
html.dark .es-theme-icon--sun { opacity: 0; transform: rotate(-90deg) scale(.4); }
html.dark .es-theme-icon--moon { opacity: 1; transform: none; }
html.light .es-theme-icon--moon { opacity: 0; transform: rotate(90deg) scale(.4); }
html.light .es-theme-icon--sun { opacity: 1; transform: none; }

.es-theme-menu {
    display: none;
    position: absolute;
    top: calc(100% + 0.45rem);
    right: 0;
    z-index: 70;
    min-width: 10.5rem;
    padding: 0.35rem;
    border-radius: 1rem;
    border: 1px solid rgba(255,255,255,.14);
    background: rgba(7, 16, 12, 0.88);
    box-shadow: 0 18px 40px rgba(0,0,0,.28);
    backdrop-filter: blur(20px);
    pointer-events: none;
}
.es-theme-menu.is-open {
    display: block;
    pointer-events: auto;
}
.es-theme-menu:not(.is-open) {
    display: none !important;
    pointer-events: none !important;
}

.es-theme-item {
    display: flex;
    width: 100%;
    align-items: center;
    gap: 0.55rem;
    min-height: 2.4rem;
    padding: 0.4rem 0.7rem;
    border: 0;
    border-radius: 0.75rem;
    background: transparent;
    color: #ecfdf5;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
}

.es-theme-item:hover { background: rgba(255, 255, 255, 0.08); }

html.light .es-theme-menu {
    border-color: rgba(15, 23, 42, 0.08);
    background: rgba(255, 255, 255, 0.94);
    box-shadow: 0 18px 40px rgba(15, 23, 42, 0.1);
}
html.light .es-theme-item { color: #0f172a; }
html.light .es-theme-item:hover { background: rgba(24, 24, 27, 0.06); }

html.light .es-brand-light-only { display: none !important; }
html.dark .es-brand-dark-only { display: none !important; }

/* ——— Light / day mode ——— */
html.light body.es-site,
html.light body.es-velaris {
    --es-brand: #18181b;
    --es-brand-dark: #0f172a;
    --es-brand-soft: #f4f4f5;
    --es-ink: #18181b;
    --es-muted: #52525b;
    --es-bg: #f6f7f9;
    --es-surface: rgba(255, 255, 255, 0.8);
    --es-border: rgba(24, 24, 27, 0.1);
    --es-footer: #0f172a;
    color: #18181b !important;
}

html.light .es-velaris-bg { background: #f6f7f9; }

html.light body.es-site,
html.light body.es-velaris.es-grid-bg {
    background-color: #f6f7f9 !important;
}

html.light .es-btn-primary,
html.light .es-btn-signup,
html.light .es-hero-btn-solid,
html.light .es-auth-submit {
    background: linear-gradient(135deg, #22d3ee 0%, #3b82f6 100%) !important;
    color: #042f2e !important;
    border-color: transparent;
    box-shadow: 0 10px 24px rgba(9, 9, 11, 0.18) !important;
}

html.light body.es-velaris .es-topbar {
    background: rgba(255, 255, 255, 0.55) !important;
    color: #334155 !important;
    border-bottom-color: rgba(15, 23, 42, 0.06);
}

html.light body.es-velaris .es-topbar a { color: #334155; }
html.light body.es-velaris .es-topbar a:hover,
html.light body.es-velaris .es-topbar .text-white { color: #09090b !important; }
html.light body.es-velaris .es-topbar .text-white\/30 { color: rgba(15, 23, 42, 0.2) !important; }

html.light body.es-velaris .es-site-header {
    background: rgba(255, 255, 255, 0.72) !important;
    border-bottom-color: rgba(15, 23, 42, 0.08) !important;
}

html.light body.es-velaris .es-btn-ghost { color: #334155; }
html.light body.es-velaris .es-btn-ghost:hover {
    background: rgba(24, 24, 27, 0.06) !important;
    color: #18181b;
}

html.light body.es-velaris .es-btn-secondary,
html.light body.es-velaris .es-btn-login,
html.light body.es-velaris .es-hero-btn-ghost {
    border-color: rgba(24, 24, 27, 0.12) !important;
    background: rgba(255, 255, 255, 0.78) !important;
    color: #18181b !important;
}

html.light body.es-velaris .es-btn-secondary:hover,
html.light body.es-velaris .es-btn-login:hover,
html.light body.es-velaris .es-hero-btn-ghost:hover {
    background: #fff !important;
    color: #09090b !important;
}

html.light .es-icon-btn {
    border-color: rgba(15, 23, 42, 0.1);
    background: rgba(255, 255, 255, 0.75);
    color: #0f172a;
}

html.light body.es-velaris .es-hero-cinematic h1,
html.light body.es-velaris .es-hero-copy h1,
html.light body.es-velaris .es-section-title,
html.light body.es-velaris .es-page-title,
html.light body.es-velaris h1,
html.light body.es-velaris h2,
html.light body.es-velaris h3,
html.light body.es-velaris .text-white,
html.light body.es-velaris .text-slate-900,
html.light body.es-velaris .font-semibold.text-slate-900 {
    color: #18181b !important;
    -webkit-text-fill-color: #18181b;
    background: none !important;
}

html.light body.es-velaris .es-hero-lead,
html.light body.es-velaris .es-section-lead,
html.light body.es-velaris .es-page-lead,
html.light body.es-velaris .text-white\/70,
html.light body.es-velaris .text-slate-600,
html.light body.es-velaris .text-slate-500,
html.light body.es-velaris .text-slate-400 {
    color: #334155 !important;
}

html.light body.es-velaris .es-velaris-badge,
html.light body.es-velaris .es-hero-pills li {
    border-color: rgba(24, 24, 27, 0.1);
    background: rgba(255, 255, 255, 0.72);
    color: #3f3f46;
}

html.light body.es-velaris .es-hero-stage--velaris {
    border-color: rgba(24, 24, 27, 0.08);
    background: rgba(255, 255, 255, 0.42) !important;
    box-shadow: 0 24px 60px rgba(24, 24, 27, 0.06) !important;
}

html.light body.es-velaris .es-metric,
html.light body.es-velaris .es-step-card,
html.light body.es-velaris .es-card-service,
html.light body.es-velaris .es-catalog-card,
html.light body.es-velaris .es-table-shell,
html.light body.es-velaris .es-catalog-table,
html.light body.es-velaris .es-glass,
html.light body.es-velaris .es-section-card {
    background: rgba(255, 255, 255, 0.78) !important;
    border-color: rgba(24, 24, 27, 0.08) !important;
    color: #0f172a;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
}

html.light body.es-velaris .es-metric strong { color: #18181b; }
html.light body.es-velaris .es-metric span { color: #71717a; }
html.light body.es-velaris .es-hero-chip {
    background: rgba(255, 255, 255, 0.7);
    border-color: rgba(24, 24, 27, 0.08);
}
html.light body.es-velaris .es-hero-chip h3,
html.light body.es-velaris .es-hero-price-row span { color: #52525b; }
html.light body.es-velaris .es-hero-price-row strong { color: #18181b; }

html.light body.es-velaris .es-table th { color: #64748b; }
html.light body.es-velaris .es-table td { color: #334155; border-bottom-color: rgba(15, 23, 42, 0.06); }
html.light body.es-velaris .es-table tbody tr:nth-child(even) { background: rgba(244, 244, 245, 0.65); }
html.light body.es-velaris .es-table tbody tr:hover { background: rgba(228, 228, 231, 0.7); }

html.light body.es-velaris .es-mobile-nav {
    background: rgba(255, 255, 255, 0.94) !important;
    border-color: rgba(15, 23, 42, 0.08) !important;
}
html.light body.es-velaris .es-mobile-nav a { color: #0f172a !important; }

html.light body.es-velaris .es-prose-list { color: #334155; }
html.light body.es-velaris footer.es-footer-wave {
    background: #0f172a !important;
    color: #a1a1aa;
}

html.light body.es-velaris .es-dock {
    background: #fff;
    border-color: rgba(24, 24, 27, 0.08);
}
html.light body.es-velaris .es-dock-item { color: #334155; }

html.light body.es-velaris .es-input,
html.light body.es-velaris input,
html.light body.es-velaris textarea,
html.light body.es-velaris select {
    background: #fff;
    border-color: rgba(15, 23, 42, 0.12);
    color: #0f172a;
}

html.dark .es-auth-modal,
html.dark .es-auth-modal--page,
html.dark .es-auth-pane,
html.dark .es-auth-actions {
    background: #18181b !important;
    color: #fafafa !important;
}
html.dark .es-auth-title { color: #fafafa !important; }
html.dark .es-auth-lead,
html.dark .es-auth-kicker,
html.dark .es-auth-hint,
html.dark .es-auth-switch,
html.dark .es-auth-label,
html.dark .es-auth-check,
html.dark .es-auth-link,
html.dark .es-auth-link-strong,
html.dark .es-auth-eye {
    color: #a1a1aa !important;
}
html.dark .es-auth-input,
html.dark .es-auth-input--plain,
html.dark .es-auth-pane input,
html.dark .es-auth-pane textarea,
html.dark .es-auth-pane select {
    background: #27272a !important;
    border-color: #3f3f46 !important;
    color: #fafafa !important;
}
html.dark .es-auth-input::placeholder,
html.dark .es-auth-pane input::placeholder {
    color: #71717a !important;
}
html.dark .es-auth-pill {
    background: #27272a !important;
    border-color: #3f3f46 !important;
    color: #e4e4e7 !important;
}
html.dark .es-auth-pill.is-on {
    background: #3f3f46 !important;
    border-color: #a1a1aa !important;
    color: #fafafa !important;
}
html.dark .es-auth-close {
    background: #27272a !important;
    border-color: #3f3f46 !important;
    color: #fafafa !important;
}

html.light .es-auth-modal,
html.light .es-auth-modal--page,
html.light .es-auth-pane,
html.light .es-auth-actions {
    background: #ffffff !important;
    color: #18181b !important;
}
html.light .es-auth-title { color: #18181b !important; }
html.light .es-auth-lead,
html.light .es-auth-kicker,
html.light .es-auth-hint,
html.light .es-auth-switch,
html.light .es-auth-label,
html.light .es-auth-check,
html.light .es-auth-link,
html.light .es-auth-link-strong,
html.light .es-auth-eye {
    color: #52525b !important;
}
html.light .es-auth-input,
html.light .es-auth-input--plain,
html.light .es-auth-pane input,
html.light .es-auth-pane textarea,
html.light .es-auth-pane select {
    background: #f4f4f5 !important;
    border-color: #e4e4e7 !important;
    color: #18181b !important;
}
html.light .es-auth-input::placeholder,
html.light .es-auth-pane input::placeholder {
    color: #71717a !important;
}
html.light .es-auth-pill {
    background: #f4f4f5 !important;
    border-color: #e4e4e7 !important;
    color: #3f3f46 !important;
}
html.light .es-auth-pill.is-on {
    background: #18181b !important;
    border-color: #18181b !important;
    color: #fff !important;
}
html.light .es-auth-close {
    background: #fff !important;
    border-color: #e4e4e7 !important;
    color: #18181b !important;
}

.es-auth-tools {
    pointer-events: auto;
}
.es-auth-tools .es-auth-close {
    position: static !important;
}
.es-header-actions {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    flex-shrink: 0;
    position: relative;
    z-index: 6;
}
.es-theme {
    position: relative;
    z-index: 8;
    flex-shrink: 0;
    pointer-events: auto;
}
.es-theme .es-icon-btn {
    position: relative;
    z-index: 9;
    pointer-events: auto !important;
}

@media (max-width: 1023px) {
    .es-fab-stack { z-index: 20; }
    .es-site-header { z-index: 60; }
    .es-header-actions { z-index: 70; }
}

@media (prefers-reduced-motion: reduce) {
    html.es-site .es-btn-primary::after,
    html.es-site .es-btn-signup::after,
    html.es-site .es-hero-btn-solid::after,
    html.es-site .es-auth-submit::after { display: none; }
    html.es-site .es-btn-primary,
    html.es-site .es-btn-secondary,
    html.es-site .es-icon-btn { transition: none; }
}

@media (max-width: 640px) {
    html.es-site .es-btn-primary,
    html.es-site .es-btn-secondary,
    html.es-site .es-btn-signup,
    html.es-site .es-hero-btn-solid,
    html.es-site .es-hero-btn-ghost { width: auto; }
}

/* lux-ui display:inline-flex otherwise beats Tailwind `hidden` */
html.es-site .hidden { display: none !important; }
@media (min-width: 640px) {
    html.es-site .sm\:block { display: block !important; }
    html.es-site .sm\:flex { display: flex !important; }
    html.es-site .sm\:inline-flex { display: inline-flex !important; }
}
@media (min-width: 768px) {
    html.es-site .md\:inline-flex { display: inline-flex !important; }
    html.es-site .md\:inline { display: inline !important; }
}
@media (min-width: 1024px) {
    html.es-site .lg\:flex { display: flex !important; }
    html.es-site .lg\:inline-flex { display: inline-flex !important; }
}
@media (min-width: 1280px) {
    html.es-site .xl\:flex { display: flex !important; }
    html.es-site .xl\:inline { display: inline !important; }
    html.es-site .xl\:inline-flex { display: inline-flex !important; }
    html.es-site .xl\:hidden { display: none !important; }
}