:root {
    --theme-50: #f5f3ff;
    --theme-rgb-50: 245, 243, 255;
    --theme-100: #ede9fe;
    --theme-rgb-100: 237, 233, 254;
    --theme-200: #ddd6fe;
    --theme-rgb-200: 221, 214, 254;
    --theme-300: #c4b5fd;
    --theme-rgb-300: 196, 181, 253;
    --theme-400: #a78bfa;
    --theme-rgb-400: 167, 139, 250;
    --theme-500: #8b5cf6;
    --theme-rgb-500: 139, 92, 246;
    --theme-600: #7c3aed;
    --theme-rgb-600: 124, 58, 237;
    --theme-700: #6d28d9;
    --theme-rgb-700: 109, 40, 217;
    --theme-800: #5b21b6;
    --theme-rgb-800: 91, 33, 182;
    --theme-900: #4c1d95;
    --theme-rgb-900: 76, 29, 149;
    --theme-950: #2e1065;
    --theme-rgb-950: 46, 16, 101;
    --theme-primary: #8b5cf6;
    --theme-primary-light: #ede9fe;
    --theme-primary-dark: #4c1d95;
    --theme-rgb-primary: 139, 92, 246;
    --theme-rgb-primary-light: 237, 233, 254;
    --theme-rgb-primary-dark: 76, 29, 149;
}

        /* Theme utilities */
        .theme-bg { background-color: #f11c4e; }
        .theme-bg-dark { background-color: var(--theme-800); }
        .theme-bg-darker { background-color: var(--theme-900); }
        .theme-bg-hover:hover { background-color: var(--theme-700); }
        .theme-text { color: #ea1b69; }
        .theme-text-light { color: var(--theme-400); }
        .theme-border { border-color: var(--theme-500); }
        .theme-border-light { border-color: var(--theme-400); }

        /* Header with theme gradient */
        .header-theme {
            background: linear-gradient(135deg, #dc1733 0%, var(--theme-800) 50%, #f34c4c 100%);
        }

        /* Button glow effect */
        .btn-glow {
            box-shadow: 0 4px 20px rgba(var(--theme-rgb-500), 0.5);
            transition: all 0.3s ease;
        }
        .btn-glow:hover {
            box-shadow: 0 8px 30px rgba(var(--theme-rgb-500), 0.7);
            transform: translateY(-3px);
        }

        /* WhatsApp button glow */
        .btn-whatsapp-glow {
            box-shadow: 0 4px 20px rgba(34, 197, 94, 0.5);
        }
        .btn-whatsapp-glow:hover {
            box-shadow: 0 8px 30px rgba(34, 197, 94, 0.7);
            transform: translateY(-3px);
        }

        /* Hero overlay with theme */
        .hero-overlay {
            background: linear-gradient(
                180deg,
                rgba(0, 0, 0, 0.4) 0%,
                rgba(var(--theme-rgb-900), 0.6) 50%,
                rgba(var(--theme-rgb-950), 0.9) 100%
            );
        }

        /* Decorative line */
        .theme-line {
            background: linear-gradient(90deg, transparent, var(--theme-500), transparent);
        }

        /* Text gradient */
        .text-gradient {
            background: linear-gradient(135deg, var(--theme-400) 0%, var(--theme-500) 50%, var(--theme-400) 100%);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        /* Animate hero elements */
        @keyframes fadeInUp {
            from {
                opacity: 0;
                transform: translateY(30px);
            }
            to {
                opacity: 1;
                transform: translateY(0);
            }
        }
        .animate-fade-in-up {
            animation: fadeInUp 0.8s ease-out forwards;
        }
        .delay-100 { animation-delay: 0.1s; }
        .delay-200 { animation-delay: 0.2s; }
        .delay-300 { animation-delay: 0.3s; }
        .delay-400 { animation-delay: 0.4s; }
        .delay-500 { animation-delay: 0.5s; }

        /* Pulse animation for CTA */
        @keyframes pulse-ring {
            0% { transform: scale(1); opacity: 1; }
            100% { transform: scale(1.5); opacity: 0; }
        }
        .pulse-ring::before {
            content: '';
            position: absolute;
            inset: -4px;
            border-radius: 9999px;
            border: 2px solid var(--theme-500);
            animation: pulse-ring 2s ease-out infinite;
        }

        /* Theme border gradient for decorative elements */
        .theme-border-gradient {
            background: linear-gradient(90deg, var(--theme-500), var(--theme-400));
        }

        /* Theme gradient backgrounds */
        .theme-gradient {
            background: linear-gradient(135deg, var(--theme-600) 0%, var(--theme-500) 100%);
        }
        .theme-gradient-dark {
            background: linear-gradient(135deg, var(--theme-900) 0%, var(--theme-800) 100%);
        }

        /* Theme ring for hover effects */
        .hover\:theme-ring:hover {
            --tw-ring-color: var(--theme-500);
            box-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
        }

        /* Theme gradient ring for circular images */
        .theme-gradient-ring {
            background: linear-gradient(135deg, var(--theme-500) 0%, var(--theme-400) 50%, var(--theme-600) 100%);
        }

        /* Theme subtle gradient for cards */
        .theme-gradient-subtle {
            background: linear-gradient(135deg, rgba(var(--theme-rgb-500), 0.05) 0%, rgba(var(--theme-rgb-500), 0.1) 100%);
        }
        .dark .theme-gradient-subtle {
            background: linear-gradient(135deg, rgba(var(--theme-rgb-500), 0.1) 0%, rgba(var(--theme-rgb-500), 0.15) 100%);
        }

        /* Theme background with opacity */
        .theme-bg\/10 {
            background-color: rgba(var(--theme-rgb-500), 0.1);
        }

        /* Slow spin animation for decorative rings */
        @keyframes spin-slow {
            from { transform: rotate(0deg); }
            to { transform: rotate(360deg); }
        }
        .animate-spin-slow {
            animation: spin-slow 20s linear infinite;
        }

        /* Hide scrollbar but allow scrolling */
        .hide-scrollbar {
            -ms-overflow-style: none;
            scrollbar-width: none;
        }
        .hide-scrollbar::-webkit-scrollbar {
            display: none;
        }

        /* Snap scroll utilities */
        .snap-x {
            scroll-snap-type: x mandatory;
        }
        .snap-mandatory {
            scroll-snap-type: x mandatory;
        }
        .snap-start {
            scroll-snap-align: start;
        }

        /* Hover theme background */
        .hover\:theme-bg:hover {
            background-color: var(--theme-600);
        }

        /* Border transparent on hover */
        .hover\:border-transparent:hover {
            border-color: transparent;
        }

        /* Tab Button Styles for Best Escorts Section */
        .tab-button.active-tab {
            background-color: #f30e0e;
            color: white;
            box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
        }
        .dark .tab-button.active-tab {
            background-color: var(--theme-600);
        }

        /* Line clamp utility */
        .line-clamp-2 {
            display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        /* Drop shadow utilities */
        .drop-shadow-lg {
            filter: drop-shadow(0 10px 8px rgb(0 0 0 / 0.04)) drop-shadow(0 4px 3px rgb(0 0 0 / 0.1));
        }

        /* Scale utilities for hover */
        .scale-90 {
            transform: scale(0.9);
        }
        .group-hover\:scale-100:hover,
        .group:hover .group-hover\:scale-100 {
            transform: scale(1);
        }

        /* Blur utilities */
        .blur-3xl {
            filter: blur(64px);
        }

        /* Aspect ratio 4/5 */
        .aspect-\[4\/5\] {
            aspect-ratio: 4 / 5;
        }

        /* Aspect ratio 16/10 for blog images */
        .aspect-\[16\/10\] {
            aspect-ratio: 16 / 10;
        }

        /* Line clamp 3 */
        .line-clamp-3 {
            display: -webkit-box;
            -webkit-line-clamp: 3;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }

        /* Theme focus ring for form inputs */
        .theme-focus-ring:focus {
            --tw-ring-color: var(--theme-500);
            --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
            --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
            box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
        }

        /* Group hover theme text */
        .group:hover .group-hover\:theme-text {
            color: var(--theme-500);
        }

        /* Blur 2xl */
        .blur-2xl {
            filter: blur(40px);
        }

        /* FAQ Section Styles */
        .faq-answer {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .faq-item.active .faq-answer {
            max-height: 500px;
        }

        .faq-icon {
            transition: transform 0.3s ease;
        }

        .rotate-180 {
            transform: rotate(180deg);
        }

        /* FAQ Active state - add theme border */
        .faq-item.active > div {
            border-color: var(--theme-500);
        }

        /* FAQ Number badge glow on active */
        .faq-item.active .faq-question span:first-child {
            box-shadow: 0 4px 14px -2px rgba(var(--theme-rgb-500), 0.5);
        }

        /* Footer Theme Gradient */
        .theme-gradient-footer {
            background: linear-gradient(180deg, #f30303 0%, var(--theme-800) 40%, #ea121c 100%);
        }

        /* Theme background with opacity for footer */
        .theme-bg\/20 {
            background-color: rgba(var(--theme-rgb-500), 0.2);
        }

        /* Width 2 for accent bar */
        .w-2 {
            width: 0.5rem;
        }

        /* Height 6 */
        .h-6 {
            height: 1.5rem;
        }

        /* Width/Height 12 for contact icons */
        .w-12 {
            width: 3rem;
        }
        .h-12 {
            height: 3rem;
        }

        /* Hover scale for contact icons */
        .group:hover .group-hover\:scale-110 {
            transform: scale(1.1);
        }

        /* Gray 950 for footer bottom */
        .bg-gray-950 {
            background-color: #030712;
        }
        .dark .dark\:bg-gray-950 {
            background-color: #030712;
        }

        /* Red 500 with opacity */
        .bg-red-500\/20 {
            background-color: rgba(239, 68, 68, 0.2);
        }

        /* Red border with opacity */
        .border-red-500\/30 {
            border-color: rgba(239, 68, 68, 0.3);
        }

        /* Text white with opacity */
        .text-white\/80 {
            color: rgba(255, 255, 255, 0.8);
        }

        /* Gap 10 */
        .gap-10 {
            gap: 2.5rem;
        }

        /* Footer Gradient Background - Theme Based */
        .footer-gradient {
            background: linear-gradient(180deg, #f30303 0%, var(--theme-800) 40%, #ea121c 100%);
        }

        /* Footer Contact Card */
        .footer-contact-card {
            display: flex;
            align-items: center;
            gap: 0.625rem;
            padding: 0.625rem 0.75rem;
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.08);
            border-radius: 0.625rem;
            transition: all 0.3s ease;
        }
        .footer-contact-card:hover {
            background: rgba(255, 255, 255, 0.1);
            border-color: rgba(255, 255, 255, 0.15);
            transform: translateY(-1px);
        }

        /* Footer Icon Box */
        .footer-icon-box {
            width: 2rem;
            height: 2rem;
            border-radius: 0.375rem;
            display: flex;
            align-items: center;
            justify-content: center;
            flex-shrink: 0;
            transition: transform 0.3s ease;
        }
        .group:hover .footer-icon-box {
            transform: scale(1.05);
        }

        /* Theme text light for hover */
        .group-hover\:theme-text-light {
            transition: color 0.3s ease;
        }
        .group:hover .group-hover\:theme-text-light {
            color: rgba(var(--theme-rgb-300), 1);
        }

        /* White/opacity utilities for footer */
        .text-white\/90 {
            color: rgba(255, 255, 255, 0.9);
        }
        .text-white\/80 {
            color: rgba(255, 255, 255, 0.8);
        }
        .text-white\/70 {
            color: rgba(255, 255, 255, 0.7);
        }
        .text-white\/60 {
            color: rgba(255, 255, 255, 0.6);
        }
        .text-white\/50 {
            color: rgba(255, 255, 255, 0.5);
        }
        .text-white\/40 {
            color: rgba(255, 255, 255, 0.4);
        }

        /* Width 1 for accent bar */
        .w-1 {
            width: 0.25rem;
        }

        /* Truncate utility */
        .truncate {
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }

        /* Min-width 0 */
        .min-w-0 {
            min-width: 0;
        }
        .border-white\/10 {
            border-color: rgba(255, 255, 255, 0.1);
        }
        .border-white\/20 {
            border-color: rgba(255, 255, 255, 0.2);
        }
        .bg-white\/10 {
            background-color: rgba(249, 125, 125, 0.1);
        }
        .bg-white\/20 {
            background-color: rgba(255, 255, 255, 0.2);
        }
        .hover\:bg-white\/20:hover {
            background-color: rgba(255, 255, 255, 0.2);
        }
        .bg-black\/30 {
            background-color: rgba(0, 0, 0, 0.3);
        }

        /* Red color utilities for 18+ badge */
        .text-red-400 {
            color: #f87171;
        }
        .bg-red-500\/20 {
            background-color: rgba(239, 68, 68, 0.2);
        }
        .border-red-500\/30 {
            border-color: rgba(239, 68, 68, 0.3);
        }

        /* Green utilities for WhatsApp */
        .bg-green-500 {
            background-color: #22c55e;
        }
        .hover\:bg-green-600:hover {
            background-color: #16a34a;
        }
        .group-hover\:text-green-400 {
            transition: color 0.3s ease;
        }
        .group:hover .group-hover\:text-green-400 {
            color: #4ade80;
        }

        /* Border bottom utility */
        .border-b-2 {
            border-bottom-width: 2px;
        }

        /* Aspect ratio utilities */
        .aspect-video {
            aspect-ratio: 16 / 9;
        }
        .aspect-\[21\/9\] {
            aspect-ratio: 21 / 9;
        }

        /* Transform utilities */
        .-translate-y-1\/2 {
            transform: translateY(-50%);
        }
        .translate-y-1\/2 {
            transform: translateY(50%);
        }
        .translate-x-1\/2 {
            transform: translateX(50%);
        }
        .-translate-x-1\/2 {
            transform: translateX(-50%);
        }
        .hover\:-translate-y-1:hover {
            transform: translateY(-0.25rem);
        }
        .group-hover\:translate-x-1:hover,
        .group:hover .group-hover\:translate-x-1 {
            transform: translateX(0.25rem);
        }

        /* Filter blur utilities */
        .blur-2xl {
            filter: blur(40px);
        }
        .filter {
            filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
        }

        /* Resize utility */
        .resize-none {
            resize: none;
        }

        /* Focus ring offset */
        .focus\:ring-offset-0:focus {
            --tw-ring-offset-width: 0px;
        }
        .focus\:ring-offset-2:focus {
            --tw-ring-offset-width: 2px;
        }

        /* Theme background with opacity for contact page */
        .theme-bg\/10 {
            background-color: rgba(var(--theme-rgb-500), 0.1);
        }

        /* Backdrop blur */
        .backdrop-blur-sm {
            backdrop-filter: blur(4px);
        }

        /* Width 96 */
        .w-96 {
            width: 24rem;
        }

        /* Width 72 */
        .w-72 {
            width: 18rem;
        }

        /* Height 96 */
        .h-96 {
            height: 24rem;
        }

        /* Height 72 */
        .h-72 {
            height: 18rem;
        }

        /* Flex shrink 0 */
        .flex-shrink-0 {
            flex-shrink: 0;
        }

        /* Width 1.5 */
        .w-1\.5 {
            width: 0.375rem;
        }

        /* Height 1.5 */
        .h-1\.5 {
            height: 0.375rem;
        }

        /* Padding top utilities */
        .pt-20 {
            padding-top: 5rem;
        }
        .pt-24 {
            padding-top: 6rem;
        }
        .pt-28 {
            padding-top: 7rem;
        }

        /* Padding bottom utilities */
        .pb-4 {
            padding-bottom: 1rem;
        }
        .pb-6 {
            padding-bottom: 1.5rem;
        }

        /* Width 3 */
        .w-3 {
            width: 0.75rem;
        }

        /* Height 3 */
        .h-3 {
            height: 0.75rem;
        }

        /* Gap utilities */
        .gap-3 {
            gap: 0.75rem;
        }
        .gap-5 {
            gap: 1.25rem;
        }

        /* Max width utilities */
        .max-w-3xl {
            max-width: 48rem;
        }
        .max-w-4xl {
            max-width: 56rem;
        }
        .max-w-xs {
            max-width: 20rem;
        }
        .max-w-2xl {
            max-width: 42rem;
        }
        .max-w-sm {
            max-width: 24rem;
        }

        /* Column span */
        .lg\:col-span-2 {
            grid-column: span 2 / span 2;
        }
        .lg\:col-span-3 {
            grid-column: span 3 / span 3;
        }

        /* Grid columns 5 for lg */
        @media (min-width: 1024px) {
            .lg\:grid-cols-5 {
                grid-template-columns: repeat(5, minmax(0, 1fr));
            }
        }

        /* Scale utilities */
        .scale-105 {
            transform: scale(1.05);
        }
        .group-hover\:scale-110:hover,
        .group:hover .group-hover\:scale-110 {
            transform: scale(1.1);
        }

        /* Line through */
        .line-through {
            text-decoration: line-through;
        }

        /* Width/Height 14 */
        .w-14 {
            width: 3.5rem;
        }
        .h-14 {
            height: 3.5rem;
        }

        /* Width/Height 16 */
        .w-16 {
            width: 4rem;
        }
        .h-16 {
            height: 4rem;
        }

        /* Height 0.5 */
        .h-0\.5 {
            height: 0.125rem;
        }

        /* Width 7 / Height 7 */
        .w-7 {
            width: 1.75rem;
        }
        .h-7 {
            height: 1.75rem;
        }

        /* Divide utilities */
        .divide-y > :not([hidden]) ~ :not([hidden]) {
            border-top-width: 1px;
        }
        .divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
            border-color: #f3f4f6;
        }
        .dark .dark\:divide-gray-700 > :not([hidden]) ~ :not([hidden]) {
            border-color: #374151;
        }

        /* Background clip text for gradient text */
        .bg-clip-text {
            -webkit-background-clip: text;
            background-clip: text;
        }
        .text-transparent {
            color: transparent;
        }

        /* Gradient utilities */
        .from-yellow-400 {
            --tw-gradient-from: #facc15;
        }
        .from-yellow-500 {
            --tw-gradient-from: #eab308;
        }
        .to-orange-500 {
            --tw-gradient-to: #f97316;
        }
        .bg-gradient-to-r {
            background-image: linear-gradient(to right, var(--tw-gradient-from), var(--tw-gradient-to));
        }
        .bg-gradient-to-br {
            background-image: linear-gradient(to bottom right, var(--tw-gradient-from), var(--tw-gradient-to));
        }

        /* Max width 5xl */
        .max-w-5xl {
            max-width: 64rem;
        }

        /* Text orange 500 */
        .text-orange-500 {
            color: #f97316;
        }

        /* Theme background 5% opacity */
        .theme-bg\/5 {
            background-color: rgba(var(--theme-rgb-500), 0.05);
        }

        /* Tracking wider/wide */
        .tracking-wide {
            letter-spacing: 0.025em;
        }
        .tracking-wider {
            letter-spacing: 0.05em;
        }

        /* Uppercase */
        .uppercase {
            text-transform: uppercase;
        }

        /* Green colors for dark mode */
        .dark .dark\:bg-green-900\/30 {
            background-color: rgba(20, 83, 45, 0.3);
        }
        .dark .dark\:text-green-400 {
            color: #4ade80;
        }
        .text-green-600 {
            color: #16a34a;
        }
        .bg-green-100 {
            background-color: #dcfce7;
        }

        /* Padding top 12 */
        .pt-12 {
            padding-top: 3rem;
        }

        /* Z-10 */
        .z-10 {
            z-index: 10;
        }

        /* Padding top 18 (4.5rem) */
        .pt-18 {
            padding-top: 4.5rem;
        }
        @media (min-width: 640px) {
            .sm\:pt-18 {
                padding-top: 4.5rem;
            }
        }

        /* Padding bottom 2 and 3 */
        .pb-2 {
            padding-bottom: 0.5rem;
        }
        .pb-3 {
            padding-bottom: 0.75rem;
        }
        @media (min-width: 640px) {
            .sm\:pb-3 {
                padding-bottom: 0.75rem;
            }
        }

        /* Padding y-2 */
        .py-2 {
            padding-top: 0.5rem;
            padding-bottom: 0.5rem;
        }

        /* Aspect ratio 4/3 */
        .aspect-\[4\/3\] {
            aspect-ratio: 4 / 3;
        }

        /* Scale x utilities */
        .scale-x-0 {
            transform: scaleX(0);
        }
        .group-hover\:scale-x-100:hover,
        .group:hover .group-hover\:scale-x-100 {
            transform: scaleX(1);
        }

        /* Origin left */
        .origin-left {
            transform-origin: left;
        }

        /* Margin top 0.5 */
        .mt-0\.5 {
            margin-top: 0.125rem;
        }

        /* Aspect ratio 3/4 for category cards */
        .aspect-\[3\/4\] {
            aspect-ratio: 3 / 4;
        }

        /* Theme text light for hover states */
        .theme-text-light {
            color: var(--theme-300);
        }
        .group-hover\:theme-text-light {
            transition: color 0.3s ease;
        }
        .group:hover .group-hover\:theme-text-light {
            color: var(--theme-300);
        }

        /* Padding 2.5 */
        .px-2\.5 {
            padding-left: 0.625rem;
            padding-right: 0.625rem;
        }

        /* Width/Height 3.5 */
        .w-3\.5 {
            width: 0.875rem;
        }
        .h-3\.5 {
            height: 0.875rem;
        }