/* Freak Strong — global app theme */

:root {
    --fs-bg: #131313;
    --fs-surface: #1f2020;
    --fs-surface-low: #1b1c1c;
    --fs-surface-high: #2a2a2a;
    --fs-lime: #CCFF00;
    --fs-lime-deep: #B2E000;
    --fs-lime-neon: #E8FF6B;
    --fs-lime-ink: #141a00;
    --fs-glow: 0 0 14px rgba(204, 255, 0, 0.7), 0 0 34px rgba(204, 255, 0, 0.38), 0 0 70px rgba(204, 255, 0, 0.16);
    --fs-glow-strong: 0 0 18px rgba(204, 255, 0, 0.95), 0 0 46px rgba(204, 255, 0, 0.55), 0 0 90px rgba(232, 255, 107, 0.3);
    --fs-glow-soft: 0 0 12px rgba(204, 255, 0, 0.45), 0 0 26px rgba(204, 255, 0, 0.2);
    --fs-white: #ffffff;
    --fs-text: #e4e2e1;
    --fs-muted: #c8c6c5;
    --fs-muted-2: #bab8b7;
    --fs-border: rgba(255, 255, 255, 0.1);
    --fs-error: #ffb4ab;
    --fs-display: 'Archivo Black', 'Anton', Impact, sans-serif;
    --fs-body: 'Hanken Grotesk', sans-serif;
    --fs-label: 'JetBrains Mono', monospace;
}

[x-cloak] { display: none !important; }

/* Brand wordmark: FREAK (white) + STRONG (neon lime) */
.fs-brand-lockup {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    min-width: 0;
    vertical-align: middle;
}

.fs-brand-mark {
    display: block;
    flex-shrink: 0;
    object-fit: cover;
    background: #000;
}

.fs-wordmark {
    font-family: var(--fs-display);
    font-weight: 400;
    letter-spacing: -0.03em;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
}

h1.fs-wordmark {
    overflow: visible;
    max-width: 100%;
    box-sizing: border-box;
}

.fs-wordmark .fs-freak {
    color: var(--fs-white);
}

.fs-wordmark .fs-strong {
    color: var(--fs-lime);
    text-shadow: 0 0 8px rgba(255, 255, 255, 0.35), 0 0 16px rgba(204, 255, 0, 0.8), 0 0 38px rgba(204, 255, 0, 0.45);
    transition: color 0.25s ease, text-shadow 0.35s ease, filter 0.35s ease;
}

a:hover .fs-wordmark .fs-strong,
.fs-wordmark:hover .fs-strong {
    color: var(--fs-lime-neon);
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.6), 0 0 22px rgba(204, 255, 0, 1), 0 0 46px rgba(204, 255, 0, 0.7), 0 0 84px rgba(232, 255, 107, 0.4);
    filter: brightness(1.15);
}

.font-brand {
    font-family: var(--fs-display);
    font-weight: 400;
    font-size: 1.15rem;
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

.font-label {
    font-family: var(--fs-label);
}

.font-display {
    font-family: var(--fs-display);
    letter-spacing: -0.03em;
    text-transform: uppercase;
}

/* Shared mobile nav — identical Archivo Black on home + store/client */
.fs-mobile-nav-link {
    display: block;
    font-family: var(--fs-display);
    font-size: 1.75rem;
    line-height: 1.15;
    font-weight: 400;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: var(--fs-lime-ink);
    padding: 0.7rem 0;
}

.fs-mobile-nav-cta {
    display: inline-flex;
    width: 100%;
    justify-content: center;
    align-items: center;
    margin-top: 1rem;
    padding: 1rem 1.25rem;
    font-family: var(--fs-display);
    font-size: 1.25rem;
    line-height: 1.1;
    font-weight: 400;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    background: var(--fs-lime-ink);
    color: var(--fs-lime);
}

/* ---------- Theme remaps (legacy gray/blue utility classes) ---------- */
body.fs-theme {
    background-color: var(--fs-bg) !important;
    background-image:
        radial-gradient(ellipse 80% 50% at 10% -10%, rgba(204, 255, 0, 0.11), transparent 55%),
        radial-gradient(ellipse 50% 35% at 90% 10%, rgba(232, 255, 107, 0.07), transparent 50%),
        radial-gradient(ellipse 60% 40% at 100% 0%, rgba(255, 255, 255, 0.03), transparent 50%);
    background-attachment: fixed;
    color: var(--fs-text);
}

body.fs-theme .min-h-screen.bg-gray-50 {
    background-color: var(--fs-bg) !important;
}

body.fs-theme .text-gray-900,
body.fs-theme .text-gray-800,
body.fs-theme .text-gray-700 {
    color: var(--fs-text) !important;
}

body.fs-theme .text-gray-600,
body.fs-theme .text-gray-500,
body.fs-theme .text-gray-400 {
    color: var(--fs-muted-2) !important;
}

body.fs-theme .border-gray-200,
body.fs-theme .border-gray-300,
body.fs-theme .divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
    border-color: var(--fs-border) !important;
}

/* Primary = red */
body.fs-theme .bg-primary,
body.fs-theme .bg-blue-500,
body.fs-theme .bg-blue-600 {
    background-color: var(--fs-lime) !important;
    color: var(--fs-lime-ink) !important;
}

body.fs-theme .hover\:bg-blue-700:hover,
body.fs-theme .hover\:bg-blue-600:hover,
body.fs-theme .hover\:bg-blue-500:hover {
    background-color: #B2E000 !important;
    color: var(--fs-lime-ink) !important;
    filter: brightness(1.05);
}

body.fs-theme .text-primary,
body.fs-theme .text-blue-600,
body.fs-theme .text-blue-500,
body.fs-theme .text-blue-700,
body.fs-theme .text-blue-800 {
    color: var(--fs-lime) !important;
}

body.fs-theme .border-primary,
body.fs-theme .border-blue-500,
body.fs-theme .border-b-2.border-blue-500 {
    border-color: var(--fs-lime) !important;
}

body.fs-theme .ring-primary,
body.fs-theme .focus\:ring-primary:focus,
body.fs-theme .focus\:ring-blue-500:focus,
body.fs-theme .focus\:border-primary:focus,
body.fs-theme .focus\:border-blue-500:focus {
    --tw-ring-color: var(--fs-lime) !important;
    border-color: var(--fs-lime) !important;
}

body.fs-theme .bg-blue-50,
body.fs-theme .bg-blue-100,
body.fs-theme .hover\:bg-blue-50:hover,
body.fs-theme .hover\:bg-gray-50:hover,
body.fs-theme .hover\:bg-gray-100:hover {
    background-color: var(--fs-surface-high) !important;
}

body.fs-theme .hover\:text-gray-700:hover,
body.fs-theme .hover\:text-gray-800:hover,
body.fs-theme .hover\:text-gray-900:hover {
    color: var(--fs-lime) !important;
}

body.fs-theme .hover\:border-gray-300:hover {
    border-color: rgba(204, 255, 0, 0.4) !important;
}

/* Soft status tints on dark */
body.fs-theme .bg-green-100 { background-color: rgba(16, 185, 129, 0.18) !important; }
body.fs-theme .text-green-800,
body.fs-theme .text-green-700 { color: #6ee7b7 !important; }
body.fs-theme .bg-red-100,
body.fs-theme .bg-red-50 { background-color: rgba(239, 68, 68, 0.15) !important; }
body.fs-theme .text-red-800,
body.fs-theme .text-red-700,
body.fs-theme .text-red-600 { color: #fca5a5 !important; }
body.fs-theme .hover\:text-red-800:hover,
body.fs-theme .hover\:bg-red-50:hover { color: #fecaca !important; background-color: rgba(239, 68, 68, 0.12) !important; }
body.fs-theme .bg-yellow-100,
body.fs-theme .bg-yellow-50 { background-color: rgba(245, 158, 11, 0.15) !important; }
body.fs-theme .text-yellow-800,
body.fs-theme .text-yellow-700 { color: #fcd34d !important; }
body.fs-theme .bg-orange-100 { background-color: rgba(249, 115, 22, 0.15) !important; }
body.fs-theme .text-orange-600 { color: #fdba74 !important; }
body.fs-theme .bg-purple-100 { background-color: rgba(204, 255, 0, 0.12) !important; }
body.fs-theme .text-purple-600 { color: var(--fs-lime) !important; }

body.fs-theme .border-yellow-400 { border-color: #fbbf24 !important; }
body.fs-theme .border-red-400 { border-color: #f87171 !important; }
body.fs-theme .border-l-4.border-blue-500 { border-color: var(--fs-lime) !important; }

/* Form controls */
body.fs-theme input:not([type="checkbox"]):not([type="radio"]),
body.fs-theme select,
body.fs-theme textarea {
    background-color: var(--fs-surface-high) !important;
    color: var(--fs-text) !important;
    border-color: var(--fs-border) !important;
}

body.fs-theme input::placeholder,
body.fs-theme textarea::placeholder {
    color: #8a8887 !important;
}

body.fs-theme table thead,
body.fs-theme .bg-gray-50 th {
    background-color: var(--fs-surface-low) !important;
}

/* Cards / panels — kill leftover white surfaces */
body.fs-theme .rounded-lg,
body.fs-theme .rounded-md,
body.fs-theme .rounded-xl,
body.fs-theme .sm\:rounded-md,
body.fs-theme .sm\:rounded-lg {
    border-radius: 0 !important;
}

body.fs-theme .bg-white,
body.fs-theme .bg-gray-50,
body.fs-theme [class*="bg-white"] {
    background-color: var(--fs-surface) !important;
    color: var(--fs-text);
}

body.fs-theme .shadow,
body.fs-theme .shadow-sm,
body.fs-theme .shadow-md,
body.fs-theme .shadow-lg {
    box-shadow: none !important;
    border: 1px solid var(--fs-border);
}

/* Accent icons that were white-on-blue */
body.fs-theme .bg-blue-500 svg,
body.fs-theme .bg-primary svg {
    color: var(--fs-lime-ink) !important;
}

body.fs-theme .bg-green-500 { background-color: #10b981 !important; }
body.fs-theme .bg-yellow-500 { background-color: #f59e0b !important; }
body.fs-theme .bg-red-500 { background-color: #ef4444 !important; }

/* Soft tint panels (alerts / nested rows) */
body.fs-theme .bg-green-50,
body.fs-theme .bg-emerald-50 { background-color: rgba(16, 185, 129, 0.12) !important; }
body.fs-theme .bg-purple-50 { background-color: rgba(204, 255, 0, 0.08) !important; }
body.fs-theme .text-green-600 { color: #6ee7b7 !important; }
body.fs-theme .text-blue-600,
body.fs-theme .text-blue-700 { color: var(--fs-lime) !important; }

/* Auth pages */
body.fs-theme .fs-auth-card {
    background: var(--fs-surface);
    border: 1px solid var(--fs-border);
}

/* ---------- FullCalendar (dark + lime) ---------- */
.fs-calendar,
.fc {
    font-family: inherit;
    color: var(--fs-text);
    background: transparent !important;
    --fc-border-color: var(--fs-border);
    --fc-page-bg-color: transparent;
    --fc-neutral-bg-color: var(--fs-surface-low);
    --fc-today-bg-color: rgba(204, 255, 0, 0.08);
    --fc-now-indicator-color: var(--fs-lime);
}

.fs-calendar-shell {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

.fc .fc-view-harness,
.fc .fc-scrollgrid,
.fc .fc-scrollgrid-section-body > td,
.fc .fc-timegrid-body,
.fc .fc-daygrid-body {
    background: var(--fs-surface) !important;
}

.fc .fc-toolbar {
    gap: 0.75rem 1rem;
    margin-bottom: 1rem !important;
    flex-wrap: wrap;
}

.fc .fc-toolbar-title {
    color: var(--fs-text);
    font-family: var(--fs-display);
    font-weight: 400;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    font-size: clamp(1rem, 4.2vw, 1.35rem) !important;
    line-height: 1.15;
}

.fc-theme-standard td,
.fc-theme-standard th,
.fc-theme-standard .fc-scrollgrid {
    border-color: var(--fs-border) !important;
}

.fc .fc-col-header-cell,
.fc .fc-daygrid-day,
.fc .fc-timegrid-slot,
.fc .fc-timegrid-axis,
.fc .fc-list-day-cushion {
    background-color: var(--fs-surface-low) !important;
}

.fc .fc-col-header-cell {
    padding: 0.35rem 0.15rem !important;
    vertical-align: middle !important;
}

.fc .fc-col-header-cell-cushion {
    display: flex !important;
    justify-content: center !important;
    padding: 0.2rem 0 !important;
    min-height: 2.75rem;
    color: var(--fs-muted) !important;
}

.fs-fc-dayhead {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 0.15rem;
    line-height: 1.1;
    white-space: nowrap;
}

.fs-fc-dow {
    font-family: var(--fs-label);
    font-size: 0.65rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--fs-muted);
}

.fs-fc-dom {
    font-family: var(--fs-display);
    font-size: 0.95rem;
    color: var(--fs-text);
    letter-spacing: -0.02em;
}

.fc .fc-day-today .fs-fc-dom {
    color: var(--fs-lime);
}

.fc .fc-timegrid-slot-label-cushion,
.fc .fc-daygrid-day-number {
    color: var(--fs-muted) !important;
}

.fc .fc-timegrid-slot-label {
    font-size: 0.7rem !important;
    vertical-align: middle !important;
}

.fc .fc-timegrid-slot {
    height: 2.35rem !important;
}

.fc .fc-day-today {
    background-color: rgba(204, 255, 0, 0.08) !important;
}

.fc .fc-timegrid-now-indicator-line {
    border-color: var(--fs-lime) !important;
    border-width: 2px !important;
}

.fc .fc-timegrid-now-indicator-arrow {
    border-top-color: var(--fs-lime) !important;
    border-bottom-color: var(--fs-lime) !important;
}

/* Outline by default; filled when active */
.fc-button,
.fc .fc-button-primary {
    background: transparent !important;
    border: 1px solid var(--fs-lime) !important;
    color: var(--fs-lime) !important;
    border-radius: 0 !important;
    text-transform: uppercase;
    font-family: var(--fs-label);
    font-size: 0.7rem !important;
    font-weight: 700;
    letter-spacing: 0.08em;
    box-shadow: none !important;
    padding: 0.45rem 0.7rem !important;
}

.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active {
    background: var(--fs-lime) !important;
    color: var(--fs-lime-ink) !important;
    border-color: var(--fs-lime) !important;
    box-shadow: var(--fs-glow-soft) !important;
}

.fc-button:hover,
.fc .fc-button-primary:hover,
.fc-button:focus,
.fc .fc-button-primary:focus {
    background: rgba(204, 255, 0, 0.12) !important;
    color: var(--fs-lime-neon) !important;
    border-color: var(--fs-lime-neon) !important;
    box-shadow: none !important;
}

.fc .fc-button-primary:not(:disabled).fc-button-active:hover {
    background: #B2E000 !important;
    color: var(--fs-lime-ink) !important;
}

.fc-button:disabled,
.fc .fc-button-primary:disabled {
    opacity: 0.35 !important;
}

.fc .fc-button-group {
    display: inline-flex !important;
    align-items: stretch !important;
    gap: 0 !important;
}

.fc .fc-prev-button,
.fc .fc-next-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-width: 2.75rem !important;
    min-height: 2.75rem !important;
    padding: 0 !important;
    line-height: 1 !important;
    background: var(--fs-lime) !important;
    border-color: var(--fs-lime) !important;
    color: var(--fs-lime-ink) !important;
}

.fc .fc-prev-button:hover,
.fc .fc-next-button:hover {
    background: #B2E000 !important;
    color: var(--fs-lime-ink) !important;
    border-color: #B2E000 !important;
}

.fc .fc-prev-button .fc-icon,
.fc .fc-next-button .fc-icon {
    font-family: var(--fs-display) !important;
    font-size: 0 !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    width: auto !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    speak: none;
    margin: 0 !important;
}

.fc .fc-prev-button .fc-icon::before,
.fc .fc-icon-chevron-left::before {
    content: '‹' !important;
    font-family: var(--fs-display), Impact, sans-serif !important;
    font-size: 2.15rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    display: block;
    transform: translateY(-0.05em);
}

.fc .fc-next-button .fc-icon::before,
.fc .fc-icon-chevron-right::before {
    content: '›' !important;
    font-family: var(--fs-display), Impact, sans-serif !important;
    font-size: 2.15rem !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    display: block;
    transform: translateY(-0.05em);
}

.fc-today-button,
.fc .fc-today-button {
    background: transparent !important;
    color: var(--fs-lime) !important;
    border: 1px solid var(--fs-lime) !important;
}

.fc-today-button:hover,
.fc .fc-today-button:hover {
    background: rgba(204, 255, 0, 0.12) !important;
}

.fc-event {
    border-radius: 0 !important;
    border: none !important;
}

.slot-available {
    background-color: rgba(16, 185, 129, 0.25);
    border-color: #10B981;
}

.slot-booked {
    background-color: rgba(204, 255, 0, 0.25);
    border-color: var(--fs-lime);
}

.slot-attended {
    background-color: rgba(239, 68, 68, 0.25);
    border-color: #EF4444;
}

.slot-blocked {
    background-color: #3a3a3a !important;
    background-image: repeating-linear-gradient(-45deg, #4a4a4a, #4a4a4a 5px, #3a3a3a 5px, #3a3a3a 10px) !important;
    border-color: #555 !important;
    color: white !important;
}

.fc-event.blocked-event {
    background-color: #3a3a3a !important;
    background-image: repeating-linear-gradient(-45deg, #4a4a4a, #4a4a4a 5px, #3a3a3a 5px, #3a3a3a 10px) !important;
    border-color: #555 !important;
    color: white !important;
}

.fc-event.blocked-event .fc-event-title {
    color: white !important;
    font-weight: 600;
}

@media (max-width: 768px) {
    .fc .fc-toolbar {
        flex-direction: column;
        align-items: stretch;
        gap: 0.65rem;
    }

    .fc .fc-toolbar-chunk {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 0.35rem;
    }

    .fc .fc-toolbar-title {
        text-align: center;
        width: 100%;
    }

    .fs-calendar-shell .fc .fc-timeGridWeek-view .fc-scrollgrid,
    .fs-calendar-shell .fc .fc-timeGridDay-view .fc-scrollgrid {
        min-width: 52rem;
    }

    .fs-fc-dow { font-size: 0.6rem; }
    .fs-fc-dom { font-size: 0.85rem; }

    .fc .fc-timegrid-axis {
        width: 3rem !important;
        min-width: 3rem !important;
    }

    .fc .fc-timegrid-slot-label-cushion {
        font-size: 0.65rem !important;
        padding: 0 0.2rem !important;
    }
}

@media (min-width: 769px) {
    .fs-calendar-shell .fc .fc-timeGridWeek-view .fc-col-header-cell,
    .fs-calendar-shell .fc .fc-timeGridWeek-view .fc-timegrid-col {
        min-width: 5.5rem;
    }
}

/* Flatpickr dark */
.flatpickr-calendar {
    background: var(--fs-surface) !important;
    box-shadow: 0 10px 40px rgba(0,0,0,.5) !important;
    border: 1px solid var(--fs-border) !important;
}
.flatpickr-months .flatpickr-month,
.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-weekdays,
span.flatpickr-weekday,
.flatpickr-day {
    color: var(--fs-text) !important;
    fill: var(--fs-text) !important;
    background: transparent !important;
}
.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
    background: var(--fs-lime) !important;
    border-color: var(--fs-lime) !important;
    color: var(--fs-lime-ink) !important;
}
.flatpickr-day:hover {
    background: var(--fs-surface-high) !important;
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: #0e0e0e; }
::-webkit-scrollbar-thumb { background: #3a3a3a; }
::-webkit-scrollbar-thumb:hover { background: #4a4a4a; }

@keyframes spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}
.animate-spin { animation: spin 1s linear infinite; }

@keyframes modalSlideIn {
    0% { transform: scale(0.96) translateY(-12px); opacity: 0; }
    100% { transform: scale(1) translateY(0); opacity: 1; }
}

.form-input:focus {
    box-shadow: 0 0 0 3px rgba(204, 255, 0, 0.2);
}

.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.25rem 0.75rem;
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: 0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

.status-available { background-color: rgba(16,185,129,.2); color: #6ee7b7; }
.status-pending { background-color: rgba(245,158,11,.2); color: #fcd34d; }
.status-confirmed { background-color: rgba(204, 255, 0,.15); color: var(--fs-lime); }
.status-attended { background-color: rgba(16,185,129,.2); color: #6ee7b7; }
.status-no-show { background-color: rgba(239,68,68,.2); color: #fca5a5; }
.status-cancelled { background-color: rgba(255,255,255,.08); color: #bab8b7; }
.status-blocked { background-color: rgba(255,255,255,.08); color: #9ca3af; }

@media (max-width: 768px) {
    .fc-toolbar {
        flex-direction: column;
        gap: 1rem;
    }
    .fc-toolbar-chunk {
        display: flex;
        justify-content: center;
    }
}

/* ---------- Neon lime glow + hover motion ---------- */
@keyframes fsNeonPulse {
    0%, 100% {
        text-shadow: 0 0 7px rgba(255, 255, 255, 0.3), 0 0 15px rgba(204, 255, 0, 0.7), 0 0 34px rgba(204, 255, 0, 0.35);
    }
    50% {
        text-shadow: 0 0 11px rgba(255, 255, 255, 0.55), 0 0 26px rgba(204, 255, 0, 1), 0 0 54px rgba(204, 255, 0, 0.6), 0 0 92px rgba(232, 255, 107, 0.3);
    }
}

@keyframes fsGlowPulse {
    0%, 100% { box-shadow: 0 0 14px rgba(204, 255, 0, 0.5), 0 0 30px rgba(204, 255, 0, 0.22); }
    50% { box-shadow: 0 0 26px rgba(204, 255, 0, 0.85), 0 0 54px rgba(232, 255, 107, 0.42); }
}

/* Irregular neon outline flicker (sign-in titles, outline CTAs) */
@keyframes fsNeonOutlineFlicker {
    0%, 17%, 19%, 46%, 48%, 69%, 71%, 91%, 100% {
        opacity: 1;
        border-color: var(--fs-lime);
        box-shadow:
            0 0 0 1px rgba(204, 255, 0, 0.55),
            0 0 12px rgba(204, 255, 0, 0.55),
            0 0 28px rgba(204, 255, 0, 0.28);
        color: var(--fs-lime);
        text-shadow: 0 0 8px rgba(204, 255, 0, 0.55);
    }
    18% {
        opacity: 0.55;
        border-color: rgba(204, 255, 0, 0.35);
        box-shadow: 0 0 0 1px rgba(204, 255, 0, 0.2), 0 0 4px rgba(204, 255, 0, 0.2);
        text-shadow: none;
    }
    47% {
        opacity: 0.22;
        border-color: rgba(204, 255, 0, 0.18);
        box-shadow: none;
        text-shadow: none;
    }
    70% {
        opacity: 0.7;
        border-color: var(--fs-lime-neon);
        box-shadow:
            0 0 0 1px rgba(232, 255, 107, 0.45),
            0 0 10px rgba(204, 255, 0, 0.4);
        color: var(--fs-lime-neon);
    }
    92%, 93.2% {
        opacity: 0.35;
        border-color: rgba(204, 255, 0, 0.28);
        box-shadow: 0 0 4px rgba(204, 255, 0, 0.2);
    }
    92.6% {
        opacity: 1;
        border-color: var(--fs-lime-neon);
        box-shadow:
            0 0 0 1px rgba(255, 255, 255, 0.35),
            0 0 16px rgba(204, 255, 0, 0.9),
            0 0 36px rgba(204, 255, 0, 0.45);
        color: var(--fs-lime-neon);
        text-shadow:
            0 0 6px rgba(255, 255, 255, 0.45),
            0 0 14px rgba(204, 255, 0, 0.85);
    }
}

/* Text drawn as neon stroke (titles like SIGN IN / Your Limits) */
@keyframes fsTextStrokeFlicker {
    0%, 18%, 20%, 47%, 49%, 70%, 72%, 92%, 100% {
        opacity: 1;
        -webkit-text-stroke-color: var(--fs-lime);
        filter:
            drop-shadow(0 0 4px rgba(204, 255, 0, 0.95))
            drop-shadow(0 0 10px rgba(204, 255, 0, 0.75))
            drop-shadow(0 0 22px rgba(204, 255, 0, 0.45));
    }
    19% {
        opacity: 0.35;
        -webkit-text-stroke-color: rgba(204, 255, 0, 0.35);
        filter: drop-shadow(0 0 2px rgba(204, 255, 0, 0.25));
    }
    48% {
        opacity: 0.15;
        -webkit-text-stroke-color: rgba(204, 255, 0, 0.2);
        filter: none;
    }
    71% {
        opacity: 0.55;
        -webkit-text-stroke-color: var(--fs-lime-neon);
        filter:
            drop-shadow(0 0 3px rgba(232, 255, 107, 0.6))
            drop-shadow(0 0 8px rgba(204, 255, 0, 0.4));
    }
    93%, 94% {
        opacity: 0.25;
        -webkit-text-stroke-color: rgba(204, 255, 0, 0.3);
        filter: drop-shadow(0 0 2px rgba(204, 255, 0, 0.2));
    }
    93.5% {
        opacity: 1;
        -webkit-text-stroke-color: var(--fs-lime-neon);
        filter:
            drop-shadow(0 0 6px rgba(255, 255, 255, 0.5))
            drop-shadow(0 0 14px rgba(204, 255, 0, 0.9))
            drop-shadow(0 0 28px rgba(204, 255, 0, 0.55));
    }
}

.fs-wordmark .fs-strong {
    animation: fsNeonPulse 3.2s ease-in-out infinite;
}

.fs-wordmark.hero-brand-in .fs-strong,
h1.fs-wordmark .fs-strong,
.fs-hero__wordmark .fs-strong {
    text-shadow: var(--fs-glow);
    animation: fsNeonPulse 2.8s ease-in-out infinite;
}

/* —— Home hero: mobile / tablet sets, desktop vw —— */
.fs-hero {
    /* Mobile */
    --fs-hero-pad-top: 6.5rem;
    --fs-hero-pad-bottom: 4.5rem;
    --fs-hero-mark: clamp(2.85rem, 16vw, 3.75rem);
    --fs-hero-brand: clamp(1.85rem, 8.2vw, 2.65rem);
    --fs-hero-tag: clamp(1.85rem, 8vw, 2.5rem);
    --fs-hero-body: 1.05rem;
    --fs-hero-cta: 0.9rem;
    --fs-hero-btn-y: 1rem;
    --fs-hero-btn-x: 1.4rem;
    --fs-hero-gap-mark: 0.7rem;
    --fs-hero-gap-brand: 1.4rem;
    --fs-hero-gap-tag: 1.2rem;
    --fs-hero-gap-lede: 1.75rem;
    --fs-hero-lede-max: 36rem;
}

.fs-hero__inner {
    padding-top: var(--fs-hero-pad-top);
    padding-bottom: var(--fs-hero-pad-bottom);
    box-sizing: border-box;
    max-width: 80rem; /* 1280 — matches site container until wide breakpoints */
    width: 100%;
}

.fs-hero__grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    column-gap: clamp(0.75rem, 1.5vw, 1.5rem);
    width: 100%;
}

.fs-hero__copy {
    grid-column: 1 / -1;
    max-width: none;
    min-width: 0;
}

.fs-hero__brand {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--fs-hero-gap-mark);
    margin-bottom: var(--fs-hero-gap-brand);
    min-width: 0;
}

.fs-hero__mark {
    width: var(--fs-hero-mark);
    height: var(--fs-hero-mark);
    flex-shrink: 0;
}

.fs-hero__wordmark {
    display: block;
    margin: 0;
    font-size: var(--fs-hero-brand);
    line-height: 0.9;
    letter-spacing: -0.04em;
    white-space: nowrap;
    min-width: 0;
}

.fs-hero__tagline {
    display: flex;
    flex-direction: column;
    gap: 0.1em;
    margin: 0 0 var(--fs-hero-gap-tag);
    font-size: var(--fs-hero-tag);
    line-height: 0.95;
    letter-spacing: -0.02em;
}

.fs-hero__tagline-solid {
    color: var(--fs-text);
}

.fs-hero__lede {
    margin: 0 0 var(--fs-hero-gap-lede);
    max-width: var(--fs-hero-lede-max);
    font-size: var(--fs-hero-body);
    line-height: 1.55;
}

.fs-hero__cta {
    display: flex;
    flex-direction: column-reverse;
    gap: 0.75rem;
    width: 100%;
}

.fs-hero__btn {
    font-size: var(--fs-hero-cta);
    line-height: 1.1;
    letter-spacing: -0.02em;
    padding: var(--fs-hero-btn-y) var(--fs-hero-btn-x);
    width: 100%;
    text-align: center;
}

/* Tablet */
@media (min-width: 640px) {
    .fs-hero {
        --fs-hero-pad-top: 7rem;
        --fs-hero-pad-bottom: 5rem;
        --fs-hero-mark: clamp(4rem, 11vw, 5.5rem);
        --fs-hero-brand: clamp(2.6rem, 6.5vw, 4.25rem);
        --fs-hero-tag: clamp(2.25rem, 5.2vw, 3.25rem);
        --fs-hero-body: 1.15rem;
        --fs-hero-cta: 1.05rem;
        --fs-hero-btn-y: 1.15rem;
        --fs-hero-btn-x: 2rem;
        --fs-hero-gap-mark: 1rem;
        --fs-hero-gap-brand: 1.7rem;
        --fs-hero-gap-tag: 1.4rem;
        --fs-hero-gap-lede: 2rem;
        --fs-hero-lede-max: 40rem;
    }

    .fs-hero__cta {
        flex-direction: row;
        flex-wrap: wrap;
        width: auto;
    }

    .fs-hero__btn {
        width: auto;
        min-width: 12rem;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .fs-hero {
        --fs-hero-mark: 9vw;
        --fs-hero-brand: 5.8vw;
        --fs-hero-tag: 4.6vw;
        --fs-hero-body: 1.85vw;
        --fs-hero-cta: 1.7vw;
        --fs-hero-btn-y: 1.6vw;
        --fs-hero-btn-x: 2.8vw;
        --fs-hero-gap-mark: 1.2vw;
        --fs-hero-gap-brand: 2.2vw;
        --fs-hero-gap-tag: 1.6vw;
        --fs-hero-gap-lede: 2.2vw;
        --fs-hero-lede-max: 55vw;
    }
}

/* Desktop — vw type, locked to site container grid */
@media (min-width: 1024px) {
    .fs-hero {
        --fs-hero-pad-top: 7.5vw;
        --fs-hero-pad-bottom: 5vw;
        --fs-hero-mark: 6.2vw;
        --fs-hero-brand: 4.4vw;
        --fs-hero-tag: 3.2vw;
        --fs-hero-body: 1.2vw;
        --fs-hero-cta: 1.25vw;
        --fs-hero-btn-y: 1.2vw;
        --fs-hero-btn-x: 2.4vw;
        --fs-hero-gap-mark: 1.1vw;
        --fs-hero-gap-brand: 1.8vw;
        --fs-hero-gap-tag: 1.35vw;
        --fs-hero-gap-lede: 2vw;
        --fs-hero-lede-max: 100%;
    }

    .fs-hero__copy {
        grid-column: 1 / span 8;
    }

    .fs-hero__lede {
        line-height: 1.5;
    }

    .fs-hero__cta {
        gap: 1.1vw;
    }

    .fs-hero__btn {
        min-width: 12vw;
    }

    .fs-hero__tagline-stroke,
    .fs-hero__tagline .text-stroke {
        -webkit-text-stroke-width: 0.12vw;
    }
}

/* Wide desktops — scale UP for impact (not down) */
@media (min-width: 1600px) {
    .fs-hero {
        --fs-hero-mark: clamp(6.25rem, 6.5vw, 8rem);
        --fs-hero-brand: clamp(4.5rem, 4.85vw, 6rem);
        --fs-hero-tag: clamp(3.25rem, 3.55vw, 4.5rem);
        --fs-hero-body: clamp(1.15rem, 1.25vw, 1.4rem);
        --fs-hero-cta: clamp(1.15rem, 1.3vw, 1.45rem);
        --fs-hero-btn-y: clamp(1.1rem, 1.25vw, 1.4rem);
        --fs-hero-btn-x: clamp(2.1rem, 2.5vw, 2.9rem);
        --fs-hero-gap-mark: 1.15vw;
        --fs-hero-gap-brand: 1.9vw;
        --fs-hero-gap-tag: 1.45vw;
        --fs-hero-gap-lede: 2.1vw;
    }

    .fs-hero__inner {
        max-width: min(92vw, 90rem); /* wider than default 1280 container */
        padding-left: max(3vw, 48px);
        padding-right: max(3vw, 48px);
    }

    .fs-hero__copy {
        grid-column: 1 / span 8;
    }

    .fs-hero__btn {
        min-width: 13vw;
    }
}

/* 1920+ — hero type with more presence */
@media (min-width: 1920px) {
    .fs-hero {
        --fs-hero-pad-top: 6.5vw;
        --fs-hero-pad-bottom: 4.5vw;
        --fs-hero-mark: clamp(7.25rem, 7.4vw, 9.5rem);
        --fs-hero-brand: clamp(5.25rem, 5.4vw, 7rem);
        --fs-hero-tag: clamp(3.75rem, 4vw, 5.25rem);
        --fs-hero-body: clamp(1.25rem, 1.35vw, 1.55rem);
        --fs-hero-cta: clamp(1.25rem, 1.4vw, 1.6rem);
        --fs-hero-btn-y: clamp(1.2rem, 1.35vw, 1.55rem);
        --fs-hero-btn-x: clamp(2.4rem, 2.8vw, 3.25rem);
        --fs-hero-gap-mark: 1.35vw;
        --fs-hero-gap-brand: 2.1vw;
        --fs-hero-gap-tag: 1.6vw;
        --fs-hero-gap-lede: 2.3vw;
    }

    .fs-hero__inner {
        max-width: min(90vw, 96rem); /* ~1536px */
        padding-left: max(4vw, 56px);
        padding-right: max(4vw, 56px);
    }

    .fs-hero__copy {
        grid-column: 1 / span 9;
    }

    .fs-hero__tagline-stroke,
    .fs-hero__tagline .text-stroke {
        -webkit-text-stroke-width: 0.16vw;
    }

    .fs-hero__btn {
        min-width: 14vw;
    }
}

@media (prefers-reduced-motion: reduce) {
    .fs-hero .hero-kenburns {
        animation: none !important;
    }
}

/* Neon stroke titles */
.fs-neon-text,
.text-stroke {
    -webkit-text-stroke: 1.75px var(--fs-lime);
    color: transparent;
    -webkit-text-fill-color: transparent;
    paint-order: stroke fill;
    text-shadow: none;
    filter:
        drop-shadow(0 0 4px rgba(204, 255, 0, 0.95))
        drop-shadow(0 0 10px rgba(204, 255, 0, 0.75))
        drop-shadow(0 0 22px rgba(204, 255, 0, 0.45));
    animation: fsTextStrokeFlicker 4.2s linear infinite;
}

/* Primary solid buttons — neon edge + lift */
body.fs-theme a.bg-primary-fixed,
body.fs-theme a.bg-primary-container,
body.fs-theme button.bg-primary-fixed,
body.fs-theme .bg-primary-fixed[type="submit"],
body.fs-theme button.bg-primary,
.fs-neon-btn {
    transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
                box-shadow 0.28s ease,
                filter 0.22s ease,
                background-color 0.22s ease !important;
    box-shadow: 0 0 0 1px rgba(204, 255, 0, 0.5), var(--fs-glow-soft);
}

body.fs-theme a.bg-primary-fixed:hover,
body.fs-theme a.bg-primary-container:hover,
body.fs-theme button.bg-primary-fixed:hover,
body.fs-theme .bg-primary-fixed[type="submit"]:hover,
body.fs-theme button.bg-primary:hover,
.fs-neon-btn:hover {
    transform: translateY(-3px) scale(1.03);
    filter: brightness(1.14) saturate(1.1);
    box-shadow: var(--fs-glow-strong) !important;
}

body.fs-theme a.bg-primary-fixed:active,
body.fs-theme a.bg-primary-container:active,
body.fs-theme button.bg-primary-fixed:active,
.fs-neon-btn:active {
    transform: translateY(0) scale(0.98);
    box-shadow: var(--fs-glow-soft) !important;
}

/* Outline / ghost CTAs — live neon border flicker */
body.fs-theme a.border-primary-fixed:not(.fs-neon-btn),
body.fs-theme .border-2.border-primary-fixed:not(.fs-neon-btn),
.fs-neon-outline,
.fs-neon-flicker {
    color: var(--fs-lime);
    border-color: var(--fs-lime);
    box-shadow: 0 0 0 1px rgba(204, 255, 0, 0.35), var(--fs-glow-soft);
    animation: fsNeonOutlineFlicker 5.4s linear infinite;
    transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
                background-color 0.22s ease,
                color 0.22s ease !important;
}

body.fs-theme a.border-primary-fixed:hover,
body.fs-theme .border-2.border-primary-fixed:hover,
.fs-neon-outline:hover,
.fs-neon-flicker:hover {
    animation: none;
    transform: translateY(-2px);
    opacity: 1 !important;
    color: var(--fs-lime-ink) !important;
    background-color: var(--fs-lime) !important;
    border-color: var(--fs-lime) !important;
    box-shadow: var(--fs-glow) !important;
    text-shadow: none !important;
}

/* Compact header / nav outline chips */
.fs-neon-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.45rem 0.95rem;
    border: 1.5px solid var(--fs-lime);
    color: var(--fs-lime);
    font-family: var(--fs-label);
    font-weight: 700;
    font-size: 0.75rem;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    background: transparent;
    animation: fsNeonOutlineFlicker 5.4s linear infinite;
    transition: transform 0.22s cubic-bezier(0.16, 1, 0.3, 1),
                background-color 0.2s ease,
                color 0.2s ease !important;
}

.fs-neon-chip:hover {
    animation: none;
    opacity: 1 !important;
    transform: translateY(-2px);
    background: var(--fs-lime) !important;
    color: var(--fs-lime-ink) !important;
    box-shadow: var(--fs-glow) !important;
    text-shadow: none !important;
}

/* Accent text links */
body.fs-theme a.text-primary-fixed,
body.fs-theme .hover\:text-primary-fixed {
    transition: color 0.2s ease, text-shadow 0.25s ease, filter 0.2s ease;
}

body.fs-theme a.text-primary-fixed:hover,
body.fs-theme a:hover.text-primary-fixed {
    color: var(--fs-lime-neon) !important;
    text-shadow: 0 0 10px rgba(204, 255, 0, 0.85), 0 0 24px rgba(204, 255, 0, 0.45);
}

/* Filled lime hover CTAs — ink text for contrast */
body.fs-theme a.hover\:bg-primary-fixed:hover,
body.fs-theme a.hover\:text-on-primary-fixed:hover,
.fs-neon-outline.hover\:bg-primary-fixed:hover {
    color: var(--fs-lime-ink) !important;
    text-shadow: none !important;
}

/* Cards / panels that use primary borders */
body.fs-theme .hover\:border-primary-fixed,
.card-hover-border {
    transition: border-color 0.28s ease, box-shadow 0.28s ease, transform 0.28s ease !important;
}

.card-hover-border:hover {
    border-color: var(--fs-lime) !important;
    box-shadow: 0 0 0 1px rgba(204, 255, 0, 0.5), var(--fs-glow);
    transform: translateY(-4px);
}

/* Form focus neon ring */
body.fs-theme input:focus,
body.fs-theme select:focus,
body.fs-theme textarea:focus,
.form-input:focus {
    border-color: var(--fs-lime) !important;
    box-shadow: 0 0 0 3px rgba(204, 255, 0, 0.3), var(--fs-glow-soft) !important;
    outline: none;
}

/* Prefer-reduced-motion */
@media (prefers-reduced-motion: reduce) {
    .fs-wordmark .fs-strong,
    h1.fs-wordmark .fs-strong,
    .fs-hero__wordmark .fs-strong,
    .fs-neon-text,
    .text-stroke,
    .fs-hero__tagline-stroke,
    .fs-neon-outline,
    .fs-neon-flicker,
    .fs-neon-chip,
    body.fs-theme a.border-primary-fixed,
    body.fs-theme .border-2.border-primary-fixed {
        animation: none !important;
        opacity: 1 !important;
    }
    body.fs-theme a.bg-primary-fixed:hover,
    body.fs-theme a.bg-primary-container:hover,
    body.fs-theme button.bg-primary-fixed:hover,
    .fs-neon-btn:hover,
    .card-hover-border:hover,
    .fs-neon-outline:hover,
    .fs-neon-chip:hover {
        transform: none;
    }
}

/* —— Image lightbox / gallery —— */
body.fs-lightbox-lock {
    overflow: hidden;
    position: fixed;
    left: 0;
    right: 0;
    width: 100%;
}

.fs-lightbox-backdrop {
    background: rgba(8, 8, 8, 0.92);
    backdrop-filter: blur(6px);
}

.fs-lightbox-nav {
    width: 2.75rem;
    height: 2.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    line-height: 1;
    color: var(--fs-lime);
    border: 2px solid rgba(204, 255, 0, 0.45);
    background: rgba(19, 19, 19, 0.85);
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.fs-lightbox-nav:hover {
    border-color: var(--fs-lime);
    background: rgba(204, 255, 0, 0.12);
    box-shadow: var(--fs-glow-soft);
}

.fs-lightbox-stage {
    background: radial-gradient(ellipse at center, rgba(42, 42, 42, 0.55) 0%, transparent 70%);
}

.fs-lightbox-thumbs {
    scrollbar-width: thin;
    scrollbar-color: rgba(204, 255, 0, 0.4) transparent;
}

.fs-lightbox-thumb {
    width: 3.25rem;
    height: 3.25rem;
    padding: 0.2rem;
    border: 2px solid rgba(255, 255, 255, 0.12);
    background: rgba(31, 32, 32, 0.95);
    cursor: pointer;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fs-lightbox-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}

.fs-lightbox-thumb.is-active,
.fs-lightbox-thumb:hover {
    border-color: var(--fs-lime);
    box-shadow: var(--fs-glow-soft);
}

.fs-gallery-trigger {
    cursor: zoom-in;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.fs-gallery-trigger:hover {
    border-color: rgba(204, 255, 0, 0.55) !important;
    box-shadow: var(--fs-glow-soft);
}
