/* ================================ */
/* CSS VARIABLES & ROOT STYLES */
/* ================================ */

:root {
    /* Color Variables */
    --primary-yellow: #FFD700;
    --primary-orange: #FF8C00;
    --primary-red: #9f1239;
    --secondary-red: #9f1239;
    --dark-bg: #0F0F0F;
    --card-bg: #1A1A1A;
    --text-light: #F5F5F5;
    --text-muted: #AAAAAA;
    
    /* Gradients */
    --gradient-primary: linear-gradient(135deg, #FFD700 0%, #FF8C00 100%);
    --gradient-red: linear-gradient(135deg, #9f1239 0%, #B22222 100%);
    --gradient-bg: linear-gradient(135deg, #1a1a1a 0%, #0a0a0a 100%);
    
    /* Spacing */
    --space-xs: 0.5rem;
    --space-sm: 1rem;
    --space-md: 1.5rem;
    --space-lg: 1rem;
    --space-xl: 3rem;
    
    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 20px;
    
    /* Shadows */
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.2);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.3);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.4);
    
    /* Transitions */
    --transition-fast: 150ms ease;
    --transition-normal: 300ms ease;
    --transition-slow: 500ms ease;
}

/* ================================ */
/* CSS RESET & BASE STYLES */
/* ================================ */

*,
*::before,
*::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: 'Poppins', sans-serif;
    color: var(--text-light);
    background: var(--dark-bg);
    line-height: 1.6;
    overflow-x: hidden;
    min-height: 100vh;
}

h1, h2, h3, h4, h5, h6 {
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: var(--space-md);
}

p {
    margin-bottom: var(--space-md);
}

a {
    text-decoration: none;
    color: inherit;
}

ul, ol {
    list-style: none;
}

img {
    max-width: 100%;
    height: auto;
    display: block;
}

button {
    cursor: pointer;
    border: none;
    background: none;
    font-family: inherit;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 var(--space-md);
}

section {
    padding: var(--space-xl) 0;
}

@media (max-width: 768px) {
    section {
        padding: var(--space-lg) 0;
    }
}

/* ================================ */
/* UTILITY CLASSES */
/* ================================ */

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.highlight {
    color: var(--primary-yellow);
}

.mt-1 { margin-top: var(--space-xs); }
.mt-2 { margin-top: var(--space-sm); }
.mt-3 { margin-top: var(--space-md); }
.mt-4 { margin-top: var(--space-lg); }
.mt-5 { margin-top: var(--space-xl); }

.mb-1 { margin-bottom: var(--space-xs); }
.mb-2 { margin-bottom: var(--space-sm); }
.mb-3 { margin-bottom: var(--space-md); }
.mb-4 { margin-bottom: var(--space-lg); }
.mb-5 { margin-bottom: var(--space-xl); }

.me-1 { margin-right: var(--space-xs); }
.me-2 { margin-right: var(--space-sm); }
.me-3 { margin-right: var(--space-md); }

/* ================================ */
/* BUTTON STYLES */
/* ================================ */

.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 14px 32px;
    background: var(--gradient-primary);
    color: #000;
    border: none;
    border-radius: var(--radius-md);
    font-family: 'Montserrat', sans-serif;
    font-weight: 700;
    font-size: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    cursor: pointer;
    transition: all var(--transition-normal);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.2);
    position: relative;
    overflow: hidden;
    z-index: 1;
    text-decoration: none;
}

.btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: var(--gradient-red);
    transition: left 0.4s ease;
    z-index: -1;
}

.btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 25px rgba(255, 215, 0, 0.3);
}

.btn:hover::before {
    left: 100%;
}

.btn span {
    position: relative;
    z-index: 1;
}

.btn-primary {
    background: var(--gradient-primary);
    color: #000;
}

.btn-secondary {
    background: var(--gradient-red);
    color: white;
}

.btn-outline {
    background: transparent;
    border: 2px solid var(--primary-yellow);
    color: var(--primary-yellow);
    box-shadow: none;
}

.btn-outline:hover {
    background: var(--gradient-primary);
    color: #000;
}

.btn-outline:hover::before {
    display: none;
}

.btn-sm {
    padding: 10px 20px;
    font-size: 0.9rem;
}

.btn-lg {
    padding: 18px 40px;
    font-size: 1.1rem;
}

/* ================================ */
/* HEADER STYLES */
/* ================================ */

.main-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
    background: rgb(21, 21, 21);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 215, 0, 0.1);
    transition: all var(--transition-normal);
}

.main-header.scrolled {
    box-shadow: var(--shadow-lg);
    background: rgba(0, 0, 0, 0.98);
}

.navbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 60px;
    position: relative;
}

/* Logo */
.logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 1.5rem;
    color: #ec3931;
    z-index: 1001;
    transition: transform var(--transition-normal);
}

.logo:hover {
    transform: scale(1.05);
}

.logo i {
    font-size: 1.8rem;
    color: #cf2d29;
}

/* Desktop Navigation */
.nav-menu {
    display: flex;
    align-items: center;
    gap: var(--space-lg);
    list-style: none;
}

.nav-item {
    position: relative;
}

.nav-link {
    text-decoration: none;
    color: #ffd700;
    font-weight: 500;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 8px 0;
    transition: all var(--transition-normal);
    position: relative;
}

.nav-link::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 0;
    height: 2px;
    background: var(--primary-yellow);
    transition: width var(--transition-normal);
}

.nav-link:hover,
.nav-link.active {
    color: #FFD700;
}

.nav-link:hover::after,
.nav-link.active::after {
    width: 100%;
}

/* Book Now Button */
.btn-book-now {
    background: #ec3931;
    color: #fff !important;
    padding: 10px 24px !important;
    border-radius: var(--radius-md);
    font-weight: 700 !important;
    margin-left: var(--space-sm);
    transition: all var(--transition-normal);
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.2);
}

.btn-book-now::after {
    display: none;
}

.btn-book-now:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
}

/* Hamburger Menu */
.hamburger {
    display: none;
    background: none;
    border: none;
    cursor: pointer;
    padding: 8px;
    z-index: 1001;
}

.hamburger .bar {
    display: block;
    width: 25px;
    height: 3px;
    margin: 5px 0;
    background: #fccd00;
    border-radius: 2px;
    transition: all var(--transition-normal);
}

/* Mobile Menu Overlay */
.mobile-nav-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    transition: all var(--transition-normal);
}

.mobile-nav-overlay.active {
    opacity: 1;
    visibility: visible;
}

/* Mobile Menu */
.mobile-menu {
    position: fixed;
    top: 0;
    right: -100%;
    width: 320px;
    height: 100%;
    background: var(--card-bg);
    z-index: 1000;
    transition: right 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    box-shadow: -5px 0 30px rgba(0, 0, 0, 0.5);
    display: flex;
    flex-direction: column;
}

.mobile-menu.active {
    right: 0;
}

.mobile-menu-content {
    flex: 1;
    padding: var(--space-lg);
    overflow-y: auto;
}

/* Mobile Menu Header */
.mobile-menu-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: var(--space-lg);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    margin-bottom: var(--space-lg);
}

.mobile-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    font-family: 'Montserrat', sans-serif;
    font-weight: 800;
    font-size: 1.3rem;
    color: var(--primary-yellow);
}

.mobile-logo i {
    font-size: 1.5rem;
    color: var(--primary-yellow);
}

.mobile-close {
    background: none;
    border: none;
    color: var(--text-light);
    font-size: 1.5rem;
    cursor: pointer;
    padding: 5px;
    transition: all var(--transition-normal);
}

.mobile-close:hover {
    color: var(--primary-yellow);
    transform: rotate(90deg);
}

/* Mobile Navigation */
.mobile-nav {
    list-style: none;
    margin-bottom: var(--space-xl);
}

.mobile-nav li {
    margin-bottom: var(--space-sm);
}

.mobile-nav-link {
    display: flex;
    align-items: center;
    gap: var(--space-sm);
    text-decoration: none;
    color: var(--text-light);
    padding: 10px;
    border-radius: var(--radius-md);
    transition: all var(--transition-normal);
    font-weight: 500;
}

.mobile-nav-link i {
    width: 20px;
    text-align: center;
    color: var(--primary-yellow);
    font-size: 1.1rem;
}

.mobile-nav-link:hover,
.mobile-nav-link.active {
    background: rgba(255, 215, 0, 0.1);
    color: var(--primary-yellow);
    transform: translateX(5px);
}

.btn-mobile-book {
    background: var(--gradient-primary);
    color: #000 !important;
    font-weight: 700 !important;
    margin-top: var(--space-sm);
    box-shadow: 0 4px 15px rgba(255, 215, 0, 0.2);
}

.btn-mobile-book:hover {
    transform: translateX(5px) !important;
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
}

/* Mobile Social Links */
.mobile-social {
    display: flex;
    justify-content: center;
    gap: var(--space-md);
    padding-top: var(--space-lg);
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.mobile-social-link {
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-light);
    text-decoration: none;
    transition: all var(--transition-normal);
}

.mobile-social-link:hover {
    background: var(--primary-yellow);
    color: #000;
    transform: translateY(-3px);
}

/* ================================ */
/* HERO SECTION */
/* ================================ */

.hero {
    height: 100vh;
    background: linear-gradient(rgba(15, 15, 15, 0.9), rgba(15, 15, 15, 0.9)), 
                url('https://images.unsplash.com/photo-1469474968028-56623f02e42e?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
    display: flex;
    align-items: center;
    padding-top: 80px;
}

.hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at 30% 20%, rgba(255, 215, 0, 0.1) 0%, transparent 50%),
                radial-gradient(circle at 70% 80%, rgba(255, 65, 54, 0.1) 0%, transparent 50%);
    z-index: 1;
}

.hero-content {
    position: relative;
    z-index: 2;
    width: 100%;
}

.hero-text {
    max-width: 800px;
    text-align: center;
    margin: 0 auto;
}

.hero-title {
    font-size: 3.5rem;
    margin-bottom: var(--space-md);
    color: var(--text-light);
    text-transform: uppercase;
    letter-spacing: 1px;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

.hero-title .highlight {
    color: var(--primary-yellow);
    position: relative;
    display: inline-block;
}

.hero-title .highlight::after {
    content: '';
    position: absolute;
    bottom: 5px;
    left: 0;
    width: 100%;
    height: 3px;
    background: var(--gradient-red);
    z-index: -1;
}

.hero-subtitle {
    font-size: 1.3rem;
    margin-bottom: var(--space-xl);
    color: var(--text-muted);
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.hero-btns {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
    flex-wrap: wrap;
}

/* ================================ */
/* QUICK STATS */
/* ================================ */

.quick-stats {
    background: var(--card-bg);
    padding: var(--space-lg) 0;
    position: relative;
}

.quick-stats::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(45deg, transparent 65%, rgba(255, 215, 0, 0.02) 65%, rgba(255, 65, 54, 0.02) 100%);
    pointer-events: none;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: var(--space-lg);
}

.stat-card {
    background: rgba(40, 40, 40, 0.9);
    border-radius: var(--radius-md);
    padding: var(--space-lg);
    display: flex;
    align-items: center;
    gap: var(--space-md);
    border: 1px solid rgba(255, 215, 0, 0.1);
    transition: all var(--transition-normal);
}

.stat-card:hover {
    transform: translateY(-5px);
    border-color: var(--primary-yellow);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.stat-icon {
    width: 70px;
    height: 70px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #000;
    font-size: 1.8rem;
    flex-shrink: 0;
}

.stat-content {
    flex: 1;
}

.stat-number {
    font-size: 2.5rem;
    font-weight: 800;
    color: var(--primary-yellow);
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 5px;
}

.stat-label {
    color: var(--text-muted);
    font-size: 0.9rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* ================================ */
/* SECTION HEADER */
/* ================================ */

.section-header {
    text-align: center;
    margin-bottom: var(--space-xl);
}

.section-title {
    font-size: 2.5rem;
    color: var(--text-light);
    margin-bottom: var(--space-sm);
    text-transform: uppercase;
    position: relative;
    display: inline-block;
}

.section-title .highlight {
    color: var(--primary-yellow);
}

.section-title::after {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(-50%);
    width: 80px;
    height: 3px;
    background: var(--gradient-red);
    border-radius: 2px;
}

.section-subtitle {
    color: var(--text-muted);
    font-size: 1.1rem;
    max-width: 600px;
    margin: 0 auto;
}

/* ================================ */
/* DESTINATION CARDS */
/* ================================ */

.destinations-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
    gap: var(--space-xl);
}

.destination-card {
    background: var(--card-bg);
    border-radius: var(--radius-md);
    overflow: hidden;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8),
                0 0 0 1px rgba(255, 215, 0, 0.1);
    border: 1px solid rgba(255, 215, 0, 0.15);
    transition: all var(--transition-normal);
    position: relative;
}

.destination-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.9),
                0 0 0 1px rgba(255, 215, 0, 0.2);
}

.destination-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-primary);
    z-index: 2;
}

.card-image {
    height: 250px;
    position: relative;
    overflow: hidden;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.5s ease;
}

.destination-card:hover .card-image img {
    transform: scale(1.05);
}

.card-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.destination-card:hover .card-overlay {
    opacity: 1;
}

.btn-view {
    background: var(--gradient-primary);
    color: #000;
    padding: 12px 24px;
    border-radius: var(--radius-md);
    text-decoration: none;
    font-weight: 600;
    text-transform: uppercase;
    font-family: 'Montserrat', sans-serif;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 8px;
    transition: all var(--transition-normal);
}

.btn-view:hover {
    transform: translateY(-2px);
    box-shadow: 0 5px 15px rgba(255, 215, 0, 0.3);
}

.card-content {
    padding: var(--space-lg);
}

.card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: var(--space-sm);
}

.card-title {
    font-size: 1.5rem;
    color: var(--primary-yellow);
    text-transform: uppercase;
    flex: 1;
}

.card-rating {
    color: var(--primary-yellow);
    font-size: 0.9rem;
    display: flex;
    gap: 2px;
}

.card-description {
    color: var(--text-muted);
    margin-bottom: var(--space-lg);
    font-size: 0.95rem;
    line-height: 1.6;
}

.card-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-top: var(--space-md);
    border-top: 1px solid rgba(255, 215, 0, 0.1);
}

.price {
    display: flex;
    align-items: baseline;
}

.currency {
    font-size: 1rem;
    color: var(--primary-yellow);
    font-weight: 600;
}

.amount {
    font-size: 2rem;
    color: var(--primary-yellow);
    font-weight: 800;
    font-family: 'Montserrat', sans-serif;
    margin: 0 2px;
}

.duration {
    font-size: 0.9rem;
    color: var(--text-muted);
}

/* ================================ */
/* FEATURES GRID */
/* ================================ */

.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--space-xl);
}

.feature-card {
    background: var(--card-bg);
    padding: var(--space-xl) var(--space-lg);
    border-radius: var(--radius-md);
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8),
                0 0 0 1px rgba(255, 215, 0, 0.1);
    border: 1px solid rgba(255, 215, 0, 0.15);
    transition: all var(--transition-normal);
    position: relative;
    overflow: hidden;
}

.feature-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.9),
                0 0 0 1px rgba(255, 215, 0, 0.2);
}

.feature-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: var(--gradient-primary);
}

.feature-icon {
    width: 80px;
    height: 80px;
    background: var(--gradient-primary);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto var(--space-lg);
    color: #000;
    font-size: 2rem;
    transition: all var(--transition-normal);
}

.feature-card:hover .feature-icon {
    transform: scale(1.1) rotate(5deg);
}

.feature-title {
    color: var(--primary-yellow);
    font-size: 1.3rem;
    margin-bottom: var(--space-sm);
    text-transform: uppercase;
}

.feature-description {
    color: var(--text-muted);
    font-size: 0.95rem;
}

/* ================================ */
/* CTA SECTION */
/* ================================ */

.cta-section {
    background: linear-gradient(rgba(15, 15, 15, 0.9), rgba(15, 15, 15, 0.9)), 
                url('https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80');
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    position: relative;
    text-align: center;
}

.cta-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: radial-gradient(circle at center, rgba(255, 215, 0, 0.1) 0%, transparent 70%);
    pointer-events: none;
}

.cta-content {
    position: relative;
    z-index: 2;
    max-width: 800px;
    margin: 0 auto;
}

.cta-title {
    font-size: 2.5rem;
    color: var(--primary-yellow);
    margin-bottom: var(--space-md);
    text-transform: uppercase;
}

.cta-subtitle {
    font-size: 1.2rem;
    color: var(--text-muted);
    margin-bottom: var(--space-xl);
}

.cta-btns {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
    flex-wrap: wrap;
}

/* ================================ */
/* FOOTER STYLES */
/* ================================ */

.main-footer {
    background: var(--card-bg);
    padding: 20px 0 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
    position: relative;
    overflow: hidden;
}

.main-footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--primary-yellow), transparent);
}

.footer-main {
    display: grid;
    grid-template-columns: 2fr 1fr 1.5fr;
    gap: 50px;
    margin-bottom: 30px;
    position: relative;
    z-index: 1;
}

/* Company Section */
.company-section {
    padding-right: 30px;
}

.footer-logo {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    margin-bottom: 20px;
    font-size: 1.8rem;
    font-weight: 800;
    color: var(--primary-yellow);
    font-family: 'Montserrat', sans-serif;
    transition: transform var(--transition-normal);
}

.footer-logo:hover {
    transform: translateX(5px);
}

.footer-logo i {
    font-size: 2rem;
    color: var(--primary-yellow);
}

.footer-logo img,
.footer-brand-icon {
    width: 46px;
    height: 46px;
    object-fit: contain;
    background: #fff;
    border-radius: 10px;
    padding: 4px;
    box-shadow: 0 8px 20px rgba(255, 215, 0, 0.15);
}

.footer-brand-text {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
}

.footer-brand-text span {
    font-size: 1.55rem;
    letter-spacing: .5px;
}

.footer-brand-text small {
    color: var(--text-muted);
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: .4px;
}

.company-description {
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.6;
    margin-bottom: 25px;
    max-width: 300px;
}

/* Social Links */
.social-links {
    display: flex;
    gap: 15px;
}

.social-icon {
    width: 36px;
    height: 36px;
    background: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    text-decoration: none;
    transition: all var(--transition-normal);
}

.social-icon:hover {
    background: var(--primary-yellow);
    color: #000;
    border-color: var(--primary-yellow);
    transform: translateY(-2px);
}

/* Footer Sections */
.footer-section {
    padding-top: 5px;
}

.footer-heading {
    color: var(--text-light);
    font-size: 1rem;
    font-weight: 600;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    position: relative;
    padding-bottom: 10px;
}

.footer-heading::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 30px;
    height: 2px;
    background: var(--primary-yellow);
}

/* Footer Links */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: 10px;
}

.footer-links a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.9rem;
    transition: all var(--transition-normal);
    display: inline-block;
}

.footer-links a:hover {
    color: var(--primary-yellow);
    transform: translateX(5px);
}

/* Contact Info */
.contact-info {
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    color: var(--text-muted);
    font-size: 0.9rem;
    line-height: 1.4;
}

.contact-item i {
    color: var(--primary-yellow);
    font-size: 0.9rem;
    margin-top: 2px;
    min-width: 16px;
}

/* Footer Bottom */
.footer-bottom {
    padding-top: 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.footer-bottom-content {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px;
}

.copyright {
    color: #888;
    font-size: 0.85rem;
    margin: 0;
}

.legal-links {
    display: flex;
    align-items: center;
    gap: 15px;
}

.legal-links a {
    color: var(--text-muted);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color var(--transition-normal);
}

.legal-links a:hover {
    color: var(--primary-yellow);
}

.separator {
    color: #666;
    font-size: 0.8rem;
}

/* Back to Top */
.back-to-top {
    position: fixed;
    bottom: 30px;
    right: 30px;
    width: 44px;
    height: 44px;
    background: var(--primary-yellow);
    color: #000;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    cursor: pointer;
    z-index: 99;
    box-shadow: 0 4px 12px rgba(255, 215, 0, 0.2);
    transition: all var(--transition-normal);
    opacity: 0;
    visibility: hidden;
    transform: translateY(20px);
}

.back-to-top.visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.back-to-top:hover {
    background: #ffed4a;
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(255, 215, 0, 0.3);
}

/* ================================ */
/* RESPONSIVE DESIGN */
/* ================================ */

/* Tablet & Desktop Navigation */
@media (max-width: 1024px) {
    .nav-menu {
        gap: var(--space-md);
    }
    
    .footer-main {
        gap: 40px;
    }
}

/* Mobile Navigation (768px and below) */
@media (max-width: 768px) {
    /* Hide desktop menu */
    .nav-menu {
        display: none;
    }
    
    /* Show hamburger menu */
    .hamburger {
        display: block;
    }
    
    /* Hamburger animation when active */
    .hamburger.active .bar:nth-child(1) {
        transform: translateY(8px) rotate(45deg);
    }
    
    .hamburger.active .bar:nth-child(2) {
        opacity: 0;
    }
    
    .hamburger.active .bar:nth-child(3) {
        transform: translateY(-8px) rotate(-45deg);
    }
    
    /* Adjust header height for mobile */
    .navbar {
        height: 50px;
    }
    
    .logo {
        font-size: 1.3rem;
    }
    
    .logo i {
        font-size: 1.5rem;
    }
    
    /* Hero section adjustments */
    .hero-title {
        font-size: 2.3rem;
    }
    
    .hero-subtitle {
        font-size: 1.1rem;
    }
    
    .hero-btns {
        flex-direction: column;
        align-items: center;
    }
    
    .hero-btns .btn {
        width: 100%;
        max-width: 300px;
    }
    
    /* Stats grid adjustments */
    .stats-grid {
        grid-template-columns: repeat(2, 1fr);
    }
    
    /* Destination grid adjustments */
    .destinations-grid {
        grid-template-columns: 1fr;
    }
    
    /* Features grid adjustments */
    .features-grid {
        grid-template-columns: 1fr;
    }
    
    /* Footer mobile adjustments */
    .footer-main {
        grid-template-columns: 1fr;
        gap: 40px;
        text-align: center;
    }
    
    .company-section {
        padding-right: 0;
        padding-bottom: 40px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .footer-logo {
        justify-content: center;
    }
    
    .company-description {
        max-width: 400px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .social-links {
        justify-content: center;
    }
    
    .footer-heading::after {
        left: 50%;
        transform: translateX(-50%);
    }
    
    .footer-links {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }
    
    .footer-links li {
        margin-bottom: 0;
    }
    
    .contact-info {
        align-items: center;
        max-width: 250px;
        margin: 0 auto;
    }
    
    .contact-item {
        justify-content: center;
        text-align: center;
    }
    
    .footer-bottom-content {
        flex-direction: column;
        text-align: center;
        gap: 15px;
    }
    
    .legal-links {
        justify-content: center;
    }
    
    .back-to-top {
        bottom: 20px;
        right: 20px;
        width: 40px;
        height: 40px;
        font-size: 0.9rem;
    }
    
    /* Mobile menu adjustments */
    .mobile-menu {
        width: 100%;
        max-width: 320px;
    }
}

/* Small Mobile Devices (480px and below) */
@media (max-width: 480px) {
    .container {
        padding: 0 15px;
    }
    
    .navbar {
        height: 65px;
    }
    
    .logo {
        font-size: 1.2rem;
    }
    
    .logo i {
        font-size: 1.3rem;
    }
    
    /* Section adjustments */
    section {
        padding: var(--space-lg) 0;
    }
    
    .hero-title {
        font-size: 2rem;
    }
    
    .section-title {
        font-size: 1.8rem;
    }
    
    /* Stats grid adjustments */
    .stats-grid {
        grid-template-columns: 1fr;
    }
    
    /* Footer adjustments for small screens */
    .main-footer {
        padding: 40px 0 20px;
    }
    
    .footer-main {
        gap: 30px;
    }
    
    .footer-logo {
        font-size: 1.5rem;
    }
    
    .footer-logo i {
        font-size: 1.6rem;
    }
    
    .company-description {
        font-size: 0.85rem;
    }
    
    .footer-heading {
        font-size: 0.9rem;
        margin-bottom: 15px;
    }
    
    .footer-links a,
    .contact-item {
        font-size: 0.85rem;
    }
    
    .copyright {
        font-size: 0.8rem;
    }
    
    .legal-links a {
        font-size: 0.8rem;
    }
    
    /* Adjust mobile menu width for small screens */
    .mobile-menu {
        max-width: 280px;
    }
}

/* Extra Small Devices (320px and below) */
@media (max-width: 320px) {
    .container {
        padding: 0 10px;
    }
    
    .logo {
        font-size: 1.1rem;
    }
    
    .logo i {
        font-size: 1.2rem;
    }
    
    .mobile-menu {
        max-width: 260px;
    }
}

/* Animation for footer sections on mobile */
@media (max-width: 768px) {
    .footer-section {
        opacity: 0;
        transform: translateY(20px);
        animation: fadeInUp 0.5s ease forwards;
    }
    
    .footer-section:nth-child(1) { animation-delay: 0.1s; }
    .footer-section:nth-child(2) { animation-delay: 0.2s; }
    .footer-section:nth-child(3) { animation-delay: 0.3s; }
}

@keyframes fadeInUp {
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Print styles */
@media print {
    .main-header,
    .main-footer,
    .back-to-top,
    .mobile-menu,
    .hamburger {
        display: none !important;
    }
    
    body {
        color: #000;
        background: #fff;
    }
}

/* ===== Centralized CSS from header.php ===== */
/* ========== UPDATED HEADER CSS - DARK THEME WITH YELLOW ACCENTS ========== */
        
        /* Header Theme Colors */
        .main-header {
            background: rgba(5, 5, 5, 0.98) !important;
            border-bottom: 1px solid rgba(255, 215, 0, 0.25) !important;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
            position: fixed !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            z-index: 1000 !important;
        }

        /* Logo Gradient */
        .logo span {
            background: linear-gradient(135deg, #FFD700, #E6C200) !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent !important;
            background-clip: text !important;
        }

        /* Navigation Links - Dark Theme */
        .nav-link {
            color: #e0e0e0 !important;
            transition: all 0.3s ease !important;
        }

        .nav-link:hover {
            color: #FFD700 !important;
        }

        .nav-link.active {
            color: #FFD700 !important;
            font-weight: 600 !important;
        }

        .nav-link.active::after {
            background: #FFD700 !important;
        }

        /* Dropdown Menu - Dark Theme */
        .dropdown-menu {
            background: #111111 !important;
            border: 1px solid rgba(255, 215, 0, 0.25) !important;
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.4) !important;
            border-radius: 16px !important;
            padding: 8px 0 !important;
            min-width: 260px !important;
        }

        .dropdown-menu li {
            list-style: none !important;
        }

        .dropdown-menu a {
            color: #e0e0e0 !important;
            padding: 12px 20px !important;
            display: flex !important;
            align-items: center !important;
            gap: 12px !important;
            transition: all 0.3s ease !important;
            border-left: 2px solid transparent !important;
        }

        .dropdown-menu a i {
            color: #FFD700 !important;
            width: 24px !important;
        }

        .dropdown-menu a:hover {
            background: rgba(255, 215, 0, 0.1) !important;
            color: #FFD700 !important;
            border-left-color: #FFD700 !important;
            padding-left: 24px !important;
        }

        /* Dropdown Arrow Animation */
        .has-dropdown {
            position: relative !important;
        }

        .has-dropdown > a i {
            transition: transform 0.3s ease !important;
            font-size: 0.7rem !important;
        }

        .has-dropdown:hover > a i {
            transform: rotate(180deg) !important;
        }

        /* Login Button */
        .btn-book-now {
            background: linear-gradient(135deg, #FFD700, #E6C200) !important;
            color: #000 !important;
            border-radius: 50px !important;
            padding: 10px 24px !important;
            font-weight: 600 !important;
        }

        .btn-book-now:hover {
            transform: translateY(-2px) !important;
            box-shadow: 0 5px 20px rgba(255, 215, 0, 0.3) !important;
        }

        /* ========== MOBILE MENU STYLES - FULLY WORKING ========== */
        
        /* Hide desktop nav on mobile */
        @media (max-width: 992px) {
            .nav-menu {
                display: none !important;
            }
            .hamburger {
                display: flex !important;
            }
        }

        /* Hamburger Button */
        .hamburger {
            display: none;
            flex-direction: column;
            cursor: pointer;
            background: transparent;
            border: none;
            z-index: 1001;
            padding: 10px;
        }

        .hamburger .bar {
            width: 25px;
            height: 2px;
            background: #FFD700;
            margin: 3px 0;
            transition: 0.3s;
            border-radius: 2px;
        }

        /* Mobile Overlay */
        .mobile-nav-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.85);
            backdrop-filter: blur(5px);
            z-index: 1001;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }

        .mobile-nav-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        /* Mobile Menu Container */
        .mobile-menu {
            position: fixed;
            top: 0;
            right: -100%;
            width: 85%;
            max-width: 350px;
            height: 100vh;
            background: #0a0a0a;
            z-index: 1002;
            transition: right 0.35s ease;
            box-shadow: -5px 0 30px rgba(0, 0, 0, 0.5);
            border-left: 1px solid rgba(255, 215, 0, 0.25);
            overflow-y: auto;
        }

        .mobile-menu.active {
            right: 0;
        }

        .mobile-menu-content {
            padding: 20px;
            display: flex;
            flex-direction: column;
            min-height: 100%;
        }

        /* Mobile Header */
        .mobile-menu-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-bottom: 20px;
            border-bottom: 1px solid rgba(255, 215, 0, 0.15);
            margin-bottom: 20px;
        }

        .mobile-logo {
            display: flex;
            align-items: center;
            gap: 10px;
            text-decoration: none;
            font-size: 1.2rem;
            font-weight: 700;
        }

        .mobile-logo span {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            background-clip: text;
        }

        .mobile-close {
            background: rgba(255, 215, 0, 0.1);
            border: none;
            width: 40px;
            height: 40px;
            border-radius: 12px;
            color: #FFD700;
            font-size: 1.2rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .mobile-close:hover {
            background: #FFD700;
            color: #000;
        }

        /* Mobile Navigation Links */
        .mobile-nav {
            list-style: none;
            flex: 1;
            padding: 0;
            margin: 0;
        }

        .mobile-nav li {
            margin-bottom: 5px;
        }

        .mobile-nav-link {
            display: flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
            color: #e0e0e0;
            padding: 14px 16px;
            border-radius: 14px;
            transition: all 0.3s ease;
            font-weight: 500;
        }

        .mobile-nav-link i:first-child {
            width: 24px;
            color: #FFD700;
            font-size: 1.1rem;
        }

        .mobile-nav-link:hover {
            background: rgba(255, 215, 0, 0.1);
            color: #FFD700;
        }

        /* Mobile Dropdown - WORKING */
        .mobile-dropdown-item {
            position: relative;
        }

        .mobile-dropdown-toggle {
            justify-content: space-between;
            cursor: pointer;
        }

        .mobile-dropdown-toggle .dropdown-arrow {
            transition: transform 0.3s ease;
            font-size: 0.8rem;
            margin-left: auto;
        }

        .mobile-submenu {
            display: none;
            background: rgba(255, 215, 0, 0.05);
            border-radius: 14px;
            margin: 5px 0 10px 20px;
            overflow: hidden;
            border: 1px solid rgba(255, 215, 0, 0.1);
        }

        .mobile-submenu.show {
            display: block !important;
        }

        .mobile-submenu a {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 12px 16px 12px 40px;
            color: #cccccc;
            text-decoration: none;
            font-size: 0.85rem;
            transition: all 0.3s ease;
            border-left: 2px solid transparent;
        }

        .mobile-submenu a i {
            width: 22px;
            color: #FFD700;
        }

        .mobile-submenu a:hover {
            background: rgba(255, 215, 0, 0.1);
            color: #FFD700;
            border-left-color: #FFD700;
            padding-left: 45px;
        }

        /* Mobile Login Button */
        .btn-mobile-book {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            color: #000 !important;
            justify-content: center;
            margin-top: 10px;
        }

        .btn-mobile-book i {
            color: #000 !important;
        }

        /* Mobile Social Icons */
        .mobile-social {
            display: flex;
            gap: 15px;
            justify-content: center;
            padding-top: 25px;
            margin-top: 20px;
            border-top: 1px solid rgba(255, 215, 0, 0.15);
        }

        .mobile-social-link {
            width: 42px;
            height: 42px;
            background: rgba(255, 215, 0, 0.1);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #FFD700;
            text-decoration: none;
            transition: all 0.3s ease;
            font-size: 1.1rem;
        }

        .mobile-social-link:hover {
            background: #FFD700;
            color: #000;
            transform: translateY(-3px);
        }

        /* Scrollbar */
        .mobile-menu::-webkit-scrollbar {
            width: 4px;
        }
        .mobile-menu::-webkit-scrollbar-track {
            background: #1a1a1a;
        }
        .mobile-menu::-webkit-scrollbar-thumb {
            background: #FFD700;
            border-radius: 10px;
        }

        /* Logo Image */
        .logo img,
        .mobile-logo img {
            height: 42px;
            width: auto;
            object-fit: contain;
            display: block;
        }

        .mobile-logo img {
            height: 40px;
        }

        /* Desktop Dropdown Position */
        .nav-item.has-dropdown {
            position: relative;
        }

        .dropdown-menu {
            position: absolute;
            top: 100%;
            left: 0;
            opacity: 0;
            visibility: hidden;
            transform: translateY(10px);
            transition: all 0.3s ease;
            z-index: 1000;
        }

        .nav-item.has-dropdown:hover .dropdown-menu {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }


/* ===== Centralized CSS from web-development.php ===== */
/* ========== RESET & BASE ========== */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        body {
            font-family: 'Poppins', sans-serif;
            background: #0a0a0a;
            color: #e0e0e0;
            overflow-x: hidden;
        }

        .container {
            max-width: 1300px;
            margin: 0 auto;
            padding: 0 24px;
        }

        /* ========== HEADER DARK THEME ========== */
        .main-header {
            background: rgba(5, 5, 5, 0.98) !important;
            border-bottom: 1px solid rgba(255, 215, 0, 0.25) !important;
            box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3) !important;
            position: fixed !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            z-index: 1000 !important;
        }

        .navbar {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 16px 0;
        }

        /* Logo */
        .logo {
            display: flex;
            align-items: center;
            gap: 12px;
            text-decoration: none;
        }

        .logo img {
            height: 45px;
            width: auto;
            object-fit: contain;
        }

        .logo span {
            background: linear-gradient(135deg, #FFD700, #E6C200) !important;
            -webkit-background-clip: text !important;
            -webkit-text-fill-color: transparent !important;
            background-clip: text !important;
            font-size: 1.5rem;
            font-weight: 800;
            font-family: 'Montserrat', sans-serif;
        }

        /* Desktop Navigation */
        .nav-menu {
            display: flex;
            align-items: center;
            gap: 32px;
            list-style: none;
        }

        .nav-link {
            color: #e0e0e0 !important;
            text-decoration: none;
            font-weight: 500;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            gap: 6px;
        }

        .nav-link:hover {
            color: #FFD700 !important;
        }

        .nav-link.active {
            color: #FFD700 !important;
            font-weight: 600;
        }

        /* ========== ENHANCED MEGA DROPDOWN - MULTI COLUMN ========== */
        .nav-item.has-dropdown {
            position: relative;
        }

        /* Mega Dropdown Container */
        .mega-dropdown {
            position: absolute;
            top: 100%;
            left: -80px;
            width: 780px;
            background: #0f0f0f;
            border: 1px solid rgba(255, 215, 0, 0.3);
            border-radius: 20px;
            box-shadow: 0 25px 45px rgba(0, 0, 0, 0.6);
            opacity: 0;
            visibility: hidden;
            transform: translateY(12px);
            transition: all 0.3s ease;
            z-index: 1000;
            backdrop-filter: blur(8px);
        }

        .nav-item.has-dropdown:hover .mega-dropdown {
            opacity: 1;
            visibility: visible;
            transform: translateY(0);
        }

        .mega-dropdown-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 8px;
            padding: 20px 16px;
        }

        .mega-col {
            display: flex;
            flex-direction: column;
        }

        .mega-col-title {
            color: #FFD700;
            font-size: 0.75rem;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            font-weight: 700;
            padding: 8px 16px;
            border-bottom: 1px solid rgba(255, 215, 0, 0.2);
            margin-bottom: 8px;
        }

        .mega-dropdown a {
            display: flex;
            align-items: center;
            gap: 12px;
            padding: 10px 16px;
            color: #e0e0e0;
            text-decoration: none;
            font-size: 0.9rem;
            transition: all 0.25s ease;
            border-radius: 12px;
            margin: 2px 0;
        }

        .mega-dropdown a i {
            width: 28px;
            color: #FFD700;
            font-size: 1rem;
        }

        .mega-dropdown a:hover {
            background: rgba(255, 215, 0, 0.12);
            color: #FFD700;
            transform: translateX(5px);
        }

        /* Login Button */
        .btn-book-now {
            background: linear-gradient(135deg, #FFD700, #E6C200) !important;
            color: #000 !important;
            border-radius: 50px !important;
            padding: 8px 24px !important;
            font-weight: 700 !important;
            transition: 0.3s;
        }

        .btn-book-now:hover {
            transform: translateY(-2px);
            box-shadow: 0 5px 20px rgba(255, 215, 0, 0.3);
        }

        /* ========== MOBILE MENU STYLES ========== */
        @media (max-width: 992px) {
            .nav-menu {
                display: none !important;
            }
            .hamburger {
                display: flex !important;
            }
            .mega-dropdown {
                display: none;
            }
        }

        .hamburger {
            display: none;
            flex-direction: column;
            cursor: pointer;
            background: transparent;
            border: none;
            z-index: 1001;
            padding: 10px;
        }

        .hamburger .bar {
            width: 26px;
            height: 2px;
            background: #FFD700;
            margin: 3px 0;
            transition: 0.3s;
            border-radius: 2px;
        }

        .mobile-nav-overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.88);
            backdrop-filter: blur(6px);
            z-index: 1001;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
        }

        .mobile-nav-overlay.active {
            opacity: 1;
            visibility: visible;
        }

        .mobile-menu {
            position: fixed;
            top: 0;
            right: -100%;
            width: 85%;
            max-width: 360px;
            height: 100vh;
            background: #0a0a0a;
            z-index: 1002;
            transition: right 0.35s cubic-bezier(0.2, 0.9, 0.4, 1.1);
            box-shadow: -8px 0 35px rgba(0, 0, 0, 0.6);
            border-left: 1px solid rgba(255, 215, 0, 0.3);
            overflow-y: auto;
        }

        .mobile-menu.active {
            right: 0;
        }

        .mobile-menu-content {
            padding: 24px 20px 30px;
            display: flex;
            flex-direction: column;
            min-height: 100%;
        }

        .mobile-menu-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding-bottom: 20px;
            border-bottom: 1px solid rgba(255, 215, 0, 0.2);
            margin-bottom: 20px;
        }

        .mobile-logo {
            display: flex;
            align-items: center;
            gap: 10px;
            text-decoration: none;
            font-size: 1.2rem;
            font-weight: 700;
        }

        .mobile-logo img {
            height: 38px;
            width: auto;
        }

        .mobile-logo span {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }

        .mobile-close {
            background: rgba(255, 215, 0, 0.1);
            border: none;
            width: 42px;
            height: 42px;
            border-radius: 12px;
            color: #FFD700;
            font-size: 1.2rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: 0.2s;
        }

        .mobile-close:hover {
            background: #FFD700;
            color: #000;
        }

        .mobile-nav {
            list-style: none;
            flex: 1;
            padding: 0;
            margin: 0;
        }

        .mobile-nav li {
            margin-bottom: 6px;
        }

        .mobile-nav-link {
            display: flex;
            align-items: center;
            gap: 14px;
            text-decoration: none;
            color: #e0e0e0;
            padding: 14px 18px;
            border-radius: 16px;
            transition: all 0.25s ease;
            font-weight: 500;
            width: 100%;
            background: transparent;
            border: none;
            cursor: pointer;
        }

        .mobile-nav-link i:first-child {
            width: 26px;
            color: #FFD700;
            font-size: 1.1rem;
        }

        .mobile-nav-link:hover {
            background: rgba(255, 215, 0, 0.12);
            color: #FFD700;
        }

        .mobile-dropdown-item {
            position: relative;
        }

        .mobile-dropdown-toggle {
            justify-content: space-between;
        }

        .dropdown-arrow {
            transition: transform 0.3s ease;
            font-size: 0.75rem;
            margin-left: auto;
        }

        /* Enhanced Mobile Submenu - multi level but clean */
        .mobile-submenu {
            display: none;
            background: rgba(255, 215, 0, 0.04);
            border-radius: 18px;
            margin: 6px 0 12px 16px;
            border: 1px solid rgba(255, 215, 0, 0.12);
            overflow: hidden;
        }

        .mobile-submenu.show {
            display: block !important;
        }

        .mobile-submenu a {
            display: flex;
            align-items: center;
            gap: 14px;
            padding: 12px 16px 12px 42px;
            color: #cccccc;
            text-decoration: none;
            font-size: 0.88rem;
            transition: all 0.25s ease;
            border-left: 2px solid transparent;
        }

        .mobile-submenu a i {
            width: 24px;
            color: #FFD700;
        }

        .mobile-submenu a:hover {
            background: rgba(255, 215, 0, 0.1);
            color: #FFD700;
            border-left-color: #FFD700;
            padding-left: 50px;
        }

        .btn-mobile-book {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            color: #000 !important;
            justify-content: center;
            margin-top: 8px;
            font-weight: 700;
        }

        .btn-mobile-book i {
            color: #000 !important;
        }

        .mobile-social {
            display: flex;
            gap: 18px;
            justify-content: center;
            padding-top: 28px;
            margin-top: 20px;
            border-top: 1px solid rgba(255, 215, 0, 0.2);
        }

        .mobile-social-link {
            width: 44px;
            height: 44px;
            background: rgba(255, 215, 0, 0.1);
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #FFD700;
            text-decoration: none;
            transition: 0.25s;
        }

        .mobile-social-link:hover {
            background: #FFD700;
            color: #000;
            transform: translateY(-3px);
        }

        /* Spacer for fixed header */
        .header-spacer {
            height: 85px;
        }

        /* Hero Section */
        .hero {
            min-height: 85vh;
            display: flex;
            align-items: center;
            justify-content: center;
            text-align: center;
            background: radial-gradient(circle at 30% 20%, #111, #030303);
        }

        .hero h1 {
            font-size: 3.5rem;
            background: linear-gradient(135deg, #FFD700, #FFB347);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
        }


/* ===== Centralized CSS from contact.php ===== */
* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }

        html {
            scroll-behavior: smooth;
        }

        body {
            font-family: 'Inter', sans-serif;
            background: #0a0a0a;
            background-image: 
                radial-gradient(circle at 15% 30%, rgba(255, 215, 0, 0.06) 0%, transparent 50%),
                radial-gradient(circle at 85% 70%, rgba(255, 215, 0, 0.04) 0%, transparent 50%);
            overflow-x: hidden;
        }

        .container {
            max-width: 1400px;
            margin: 0 auto;
            padding: 0 5%;
        }

        @media (max-width: 768px) {
            .container {
                padding: 0 20px;
            }
        }

        /* ========== CONTACT HERO SECTION (Like Terms) ========== */
        .contact-hero {
            min-height: 280px;
            background: linear-gradient(135deg, rgba(5, 5, 5, 0.95) 0%, rgba(10, 10, 10, 0.92) 100%), 
                        url('https://images.unsplash.com/photo-1423666639041-f56000c27a9a?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80');
            background-size: cover;
            background-position: center;
            display: flex;
            align-items: center;
            text-align: center;
            position: relative;
            margin-top: 40px;
            border-bottom: 1px solid rgba(255, 215, 0, 0.2);
        }

        @media (max-width: 768px) {
            .contact-hero {
                min-height: 240px;
                margin-top: 70px;
            }
        }

        .contact-hero::before {
            content: '';
            position: absolute;
            width: 500px;
            height: 500px;
            background: rgba(255, 215, 0, 0.08);
            border-radius: 50%;
            filter: blur(120px);
            top: -200px;
            right: -120px;
        }

        .contact-hero::after {
            content: '';
            position: absolute;
            width: 420px;
            height: 420px;
            background: rgba(255, 215, 0, 0.1);
            border-radius: 50%;
            filter: blur(120px);
            bottom: -180px;
            left: -120px;
        }

        .contact-hero-content {
            position: relative;
            z-index: 2;
            width: 100%;
            padding: 45px 20px;
        }

        @media (max-width: 768px) {
            .contact-hero-content {
                padding: 35px 20px;
            }
        }

        .contact-hero-title {
            font-size: 3rem;
            color: #FFD700;
            margin-bottom: 0.8rem;
            text-transform: uppercase;
            letter-spacing: 2px;
            font-weight: 800;
        }

        @media (max-width: 768px) {
            .contact-hero-title {
                font-size: 2rem;
            }
        }

        .contact-hero-subtitle {
            font-size: 1rem;
            color: #cccccc;
            max-width: 600px;
            margin: 0 auto;
            line-height: 1.6;
        }

        /* ========== CONTACT SECTION (Like Terms Sections) ========== */
        .contact-section {
            padding: 60px 0;
        }

        @media (max-width: 768px) {
            .contact-section {
                padding: 40px 0;
            }
        }

        .contact-grid {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 40px;
        }

        @media (max-width: 992px) {
            .contact-grid {
                gap: 30px;
            }
        }

        @media (max-width: 768px) {
            .contact-grid {
                grid-template-columns: 1fr;
                gap: 30px;
            }
        }

        /* Contact Info Card - Like Terms Card */
        .contact-info-card {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.1);
            border-radius: 24px;
            padding: 35px;
            transition: all 0.3s ease;
        }

        @media (max-width: 768px) {
            .contact-info-card {
                padding: 25px;
            }
        }

        .contact-info-card:hover {
            transform: translateY(-5px);
            border-color: rgba(255, 215, 0, 0.25);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .info-title {
            color: #FFD700;
            font-size: 1.6rem;
            margin-bottom: 25px;
            font-weight: 700;
            display: flex;
            align-items: center;
            gap: 12px;
        }

        @media (max-width: 768px) {
            .info-title {
                font-size: 1.4rem;
                margin-bottom: 20px;
            }
        }

        .info-title i {
            font-size: 1.6rem;
        }

        .info-item {
            display: flex;
            align-items: flex-start;
            gap: 15px;
            margin-bottom: 22px;
        }

        .info-item i {
            width: 42px;
            height: 42px;
            background: rgba(255, 215, 0, 0.1);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #FFD700;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            flex-shrink: 0;
        }

        .info-item:hover i {
            background: #FFD700;
            color: #000;
        }

        .info-text h4 {
            color: #ffffff;
            font-size: 1rem;
            margin-bottom: 5px;
            font-weight: 600;
        }

        .info-text p, .info-text a {
            color: #cccccc;
            text-decoration: none;
            transition: color 0.3s ease;
            line-height: 1.5;
            font-size: 0.9rem;
        }

        .info-text a:hover {
            color: #FFD700;
        }

        /* Contact Form Card */
        .contact-form-card {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.1);
            border-radius: 24px;
            padding: 35px;
            transition: all 0.3s ease;
        }

        @media (max-width: 768px) {
            .contact-form-card {
                padding: 25px;
            }
        }

        .contact-form-card:hover {
            border-color: rgba(255, 215, 0, 0.25);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        .form-title {
            color: #FFD700;
            font-size: 1.6rem;
            margin-bottom: 25px;
            font-weight: 700;
        }

        @media (max-width: 768px) {
            .form-title {
                font-size: 1.4rem;
                margin-bottom: 20px;
            }
        }

        .form-group {
            margin-bottom: 18px;
        }

        .form-group input,
        .form-group select,
        .form-group textarea {
            width: 100%;
            padding: 12px 16px;
            background: #1a1a1a;
            border: 1px solid rgba(255, 215, 0, 0.15);
            border-radius: 12px;
            color: #ffffff;
            font-size: 0.9rem;
            transition: all 0.3s ease;
            font-family: 'Inter', sans-serif;
        }

        .form-group input:focus,
        .form-group select:focus,
        .form-group textarea:focus {
            outline: none;
            border-color: #FFD700;
            background: #222222;
        }

        .form-group textarea {
            resize: vertical;
            min-height: 100px;
        }

        .form-group input::placeholder,
        .form-group textarea::placeholder {
            color: #666666;
        }

        .submit-btn {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            color: #000;
            border: none;
            padding: 12px 28px;
            border-radius: 40px;
            font-size: 0.95rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            width: 100%;
            font-family: 'Inter', sans-serif;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }

        .submit-btn:hover {
            transform: translateY(-2px);
            box-shadow: 0 8px 20px rgba(255, 215, 0, 0.25);
            gap: 12px;
        }

        /* Service Areas Section - Like Terms */
        .service-areas {
            padding: 60px 0;
            background: #0a0a0a;
            border-top: 1px solid rgba(255, 215, 0, 0.1);
            border-bottom: 1px solid rgba(255, 215, 0, 0.1);
        }

        @media (max-width: 768px) {
            .service-areas {
                padding: 40px 0;
            }
        }

        .section-header {
            text-align: center;
            margin-bottom: 40px;
        }

        .section-header h2 {
            color: #FFD700;
            font-size: 2rem;
            margin-bottom: 12px;
            font-weight: 700;
        }

        @media (max-width: 768px) {
            .section-header h2 {
                font-size: 1.6rem;
            }
        }

        .section-header p {
            color: #cccccc;
            max-width: 600px;
            margin: 0 auto;
            line-height: 1.6;
            font-size: 0.9rem;
        }

        .areas-grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
        }

        @media (max-width: 992px) {
            .areas-grid {
                gap: 25px;
            }
        }

        @media (max-width: 768px) {
            .areas-grid {
                grid-template-columns: repeat(2, 1fr);
                gap: 20px;
            }
        }

        @media (max-width: 550px) {
            .areas-grid {
                grid-template-columns: 1fr;
            }
        }

        .area-card {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.1);
            border-radius: 20px;
            padding: 25px;
            text-align: center;
            transition: all 0.3s ease;
        }

        .area-card:hover {
            transform: translateY(-5px);
            border-color: rgba(255, 215, 0, 0.25);
            box-shadow: 0 15px 30px rgba(0, 0, 0, 0.3);
        }

        .area-icon {
            width: 65px;
            height: 65px;
            background: rgba(255, 215, 0, 0.1);
            border-radius: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            margin: 0 auto 18px;
            transition: all 0.3s ease;
        }

        .area-card:hover .area-icon {
            background: rgba(255, 215, 0, 0.2);
        }

        .area-icon i {
            font-size: 1.8rem;
            color: #FFD700;
        }

        .area-card h3 {
            color: #FFD700;
            font-size: 1.3rem;
            margin-bottom: 12px;
            font-weight: 700;
        }

        @media (max-width: 768px) {
            .area-card h3 {
                font-size: 1.2rem;
            }
        }

        .area-services {
            color: #cccccc;
            font-size: 0.8rem;
            line-height: 1.5;
            margin-bottom: 15px;
        }

        .area-status {
            display: inline-block;
            padding: 4px 14px;
            border-radius: 20px;
            font-size: 0.7rem;
            font-weight: 600;
            margin-top: 8px;
        }

        .status-active {
            background: rgba(255, 215, 0, 0.15);
            color: #FFD700;
        }

        .status-coming {
            background: rgba(255, 215, 0, 0.08);
            color: #888888;
        }

        .area-link {
            display: inline-flex;
            align-items: center;
            gap: 6px;
            color: #FFD700;
            text-decoration: none;
            margin-top: 12px;
            font-weight: 500;
            transition: all 0.3s ease;
            font-size: 0.85rem;
        }

        .area-link:hover {
            gap: 10px;
            color: #E6C200;
        }

        /* Locations Section */
        .locations-section {
            padding: 60px 0;
            background: #0a0a0a;
        }

        @media (max-width: 768px) {
            .locations-section {
                padding: 40px 0;
            }
        }

        .locations-content {
            text-align: center;
            max-width: 800px;
            margin: 0 auto;
        }

        .locations-content h2 {
            color: #FFD700;
            font-size: 1.8rem;
            margin-bottom: 20px;
            font-weight: 700;
        }

        @media (max-width: 768px) {
            .locations-content h2 {
                font-size: 1.5rem;
            }
        }

        .locations-badges {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            gap: 12px;
            margin: 30px 0;
        }

        .location-badge {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.2);
            border-radius: 40px;
            padding: 8px 22px;
            color: #cccccc;
            font-weight: 500;
            transition: all 0.3s ease;
            font-size: 0.85rem;
        }

        @media (max-width: 768px) {
            .location-badge {
                padding: 6px 16px;
                font-size: 0.8rem;
            }
        }

        .location-badge:hover {
            border-color: #FFD700;
            color: #FFD700;
            transform: translateY(-2px);
        }

        .locations-map {
            margin-top: 20px;
        }

        .locations-map p {
            color: #888888;
            font-size: 0.85rem;
        }

        /* Back to Top */
        .back-to-top {
            position: fixed;
            bottom: 30px;
            right: 30px;
            width: 45px;
            height: 45px;
            background: linear-gradient(135deg, #FFD700, #E6C200);
            color: #000;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            opacity: 0;
            visibility: hidden;
            transition: all 0.3s ease;
            z-index: 1000;
            box-shadow: 0 5px 15px rgba(255, 215, 0, 0.3);
        }

        @media (max-width: 768px) {
            .back-to-top {
                bottom: 20px;
                right: 20px;
                width: 40px;
                height: 40px;
            }
        }

        .back-to-top.show {
            opacity: 1;
            visibility: visible;
        }

        .back-to-top:hover {
            transform: translateY(-3px);
            box-shadow: 0 8px 20px rgba(255, 215, 0, 0.4);
        }

        /* Floating Social */
        .floating-social {
            position: fixed;
            left: 20px;
            bottom: 30px;
            display: flex;
            flex-direction: column;
            gap: 10px;
            z-index: 999;
        }

        @media (max-width: 768px) {
            .floating-social {
                left: 15px;
                bottom: 20px;
                gap: 8px;
            }
        }

        .floating-social a {
            width: 40px;
            height: 40px;
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.2);
            border-radius: 12px;
            display: flex;
            align-items: center;
            justify-content: center;
            color: #FFD700;
            font-size: 1rem;
            transition: all 0.3s ease;
            text-decoration: none;
        }

        @media (max-width: 768px) {
            .floating-social a {
                width: 35px;
                height: 35px;
                font-size: 0.9rem;
            }
        }

        .floating-social a:hover {
            background: #FFD700;
            color: #000;
            transform: translateX(5px);
        }


/* ===== Centralized CSS from privacy.php ===== */
html{
            scroll-behavior:smooth;
        }

        body{
            font-family:'Inter',sans-serif;
            background: #0a0a0a;
            background-image: 
                radial-gradient(circle at 15% 30%, rgba(255, 215, 0, 0.06) 0%, transparent 50%),
                radial-gradient(circle at 85% 70%, rgba(255, 215, 0, 0.04) 0%, transparent 50%);
            overflow-x:hidden;
        }

        .playfair{
            font-family:'Playfair Display', serif;
        }

        /* HERO - DARK THEME WITH YELLOW ACCENT */

        .hero-radial{
            background: 
                radial-gradient(circle at top left, #1a1a1a 0%, #0d0d0d 45%, #000000 100%);
            position:relative;
            overflow:hidden;
            border-bottom: 1px solid rgba(255, 215, 0, 0.2);
        }

        .hero-radial::before{
            content:'';
            position:absolute;
            width:500px;
            height:500px;
            background:rgba(255, 215, 0, 0.08);
            border-radius:50%;
            filter:blur(120px);
            top:-200px;
            right:-120px;
        }

        .hero-radial::after{
            content:'';
            position:absolute;
            width:420px;
            height:420px;
            background:rgba(255, 215, 0, 0.1);
            border-radius:50%;
            filter:blur(120px);
            bottom:-180px;
            left:-120px;
        }

        /* SECTION CARD - DARK THEME */

        .term-section{
            transition:all .3s ease;
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.1);
        }

        .term-section:hover{
            transform:translateY(-5px);
            box-shadow: 0 20px 50px rgba(0,0,0,.5);
            background: #141414;
            border-color: rgba(255, 215, 0, 0.25);
        }

        /* LEGAL BOX - DARK THEME */

        .legal-notice{
            background: #0a0a0a;
            border-left: 6px solid #FFD700;
            border: 1px solid rgba(255, 215, 0, 0.15);
        }

        .legal-text{
            line-height:1.9;
        }

        /* TABLE - DARK THEME */

        .privacy-table{
            width:100%;
            border-collapse:collapse;
            overflow:hidden;
            border-radius:18px;
            margin-top:25px;
        }

        .privacy-table th{
            background: #1a1a1a;
            color: #FFD700;
            text-align:left;
            padding:16px;
            font-size:.9rem;
            border-bottom: 2px solid #FFD700;
        }

        .privacy-table td{
            padding:16px;
            border-bottom:1px solid rgba(255, 215, 0, 0.08);
            color: #cccccc;
            background: #0f0f0f;
        }

        .privacy-table tr:nth-child(even) td{
            background: #0a0a0a;
        }

        .privacy-table tr:hover td{
            background: #1a1a1a;
        }

        /* TOC - DARK THEME */

        .toc-link{
            transition:all .25s ease;
            color: #cccccc;
        }

        .toc-link:hover{
            transform:translateX(5px);
            color:#FFD700;
        }

        /* BUTTON */

        .premium-btn{
            transition:all .3s ease;
        }

        .premium-btn:hover{
            transform:translateY(-3px);
            box-shadow: 0 15px 35px rgba(255, 215, 0, 0.25);
        }

        /* SCROLL BAR */

        ::-webkit-scrollbar{
            width:8px;
        }

        ::-webkit-scrollbar-track{
            background:#1a1a1a;
        }

        ::-webkit-scrollbar-thumb{
            background:#FFD700;
            border-radius:20px;
        }

        ::-webkit-scrollbar-thumb:hover{
            background:#E6C200;
        }

        /* MOBILE */

        @media(max-width:768px){

            .privacy-table{
                display:block;
                overflow-x:auto;
            }

        }

        /* Text Colors for Dark Theme */
        .text-dark-main{
            color: #e0e0e0;
        }

        .text-dark-secondary{
            color: #aaaaaa;
        }

        .bg-dark-card{
            background: #111111;
        }

        .border-dark{
            border-color: rgba(255, 215, 0, 0.1);
        }

        /* Highlight Box */
        .highlight-box {
            background: rgba(255, 215, 0, 0.05);
            border-left: 5px solid #FFD700;
            padding: 20px 28px;
            margin: 25px 32px;
            border-radius: 16px;
            color: #e0e0e0;
        }
        .highlight-box strong {
            color: #FFD700;
        }

        /* Contact Privacy */
        .contact-privacy {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            padding: 50px 35px;
            border-radius: 20px;
            text-align: center;
            margin: 25px 32px 32px 32px;
            color: #000000;
        }
        .contact-privacy h3, .contact-privacy p {
            color: #000000;
        }
        .contact-privacy .btn {
            background: #000000;
            color: #FFD700;
        }
        .contact-privacy .btn:hover {
            background: #1a1a1a;
            color: #FFD700;
        }

        /* Section Title */
        .section-title {
            color: #FFD700;
        }
        .section-title .section-number {
            background: rgba(255, 215, 0, 0.1);
            color: #FFD700;
            border: 1px solid rgba(255, 215, 0, 0.2);
        }

        /* Section Content */
        .section-content {
            color: #cccccc;
        }
        .section-content h4 {
            color: #ffffff;
        }

        /* TOC */
        .toc {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.15);
        }
        .toc-title {
            color: #FFD700;
        }

        /* Back to Top */
        .back-to-top-section {
            background: #FFD700;
            color: #000000;
        }
        .back-to-top-section:hover {
            background: #E6C200;
        }


/* ===== Centralized CSS from terms.php ===== */
html{
            scroll-behavior:smooth;
        }

        body{
            font-family:'Inter',sans-serif;
            background: #0a0a0a;
            background-image: 
                radial-gradient(circle at 15% 30%, rgba(255, 215, 0, 0.06) 0%, transparent 50%),
                radial-gradient(circle at 85% 70%, rgba(255, 215, 0, 0.04) 0%, transparent 50%);
            overflow-x:hidden;
        }

        .playfair{
            font-family:'Playfair Display', serif;
        }

        /* HERO - DARK THEME WITH YELLOW ACCENT */
        .hero-radial{
            background: 
                radial-gradient(circle at top left, #1a1a1a 0%, #0d0d0d 45%, #000000 100%);
            position:relative;
            overflow:hidden;
            border-bottom: 1px solid rgba(255, 215, 0, 0.2);
        }

        .hero-radial::before{
            content:'';
            position:absolute;
            width:500px;
            height:500px;
            background:rgba(255, 215, 0, 0.08);
            border-radius:50%;
            filter:blur(120px);
            top:-200px;
            right:-120px;
        }

        .hero-radial::after{
            content:'';
            position:absolute;
            width:420px;
            height:420px;
            background:rgba(255, 215, 0, 0.1);
            border-radius:50%;
            filter:blur(120px);
            bottom:-180px;
            left:-120px;
        }

        /* SECTION CARD - DARK THEME */
        .term-section{
            transition:all .3s ease;
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.1);
        }

        .term-section:hover{
            transform:translateY(-5px);
            box-shadow: 0 20px 50px rgba(0,0,0,.5);
            background: #141414;
            border-color: rgba(255, 215, 0, 0.25);
        }

        /* LEGAL BOX - DARK THEME */
        .legal-notice{
            background: #0a0a0a;
            border-left: 6px solid #FFD700;
            border: 1px solid rgba(255, 215, 0, 0.15);
        }

        .legal-text{
            line-height:1.9;
        }

        /* TABLE - DARK THEME */
        .terms-table{
            width:100%;
            border-collapse:collapse;
            overflow:hidden;
            border-radius:18px;
            margin-top:25px;
        }

        .terms-table th{
            background: #1a1a1a;
            color: #FFD700;
            text-align:left;
            padding:16px;
            font-size:.9rem;
            border-bottom: 2px solid #FFD700;
        }

        .terms-table td{
            padding:16px;
            border-bottom:1px solid rgba(255, 215, 0, 0.08);
            color: #cccccc;
            background: #0f0f0f;
        }

        .terms-table tr:nth-child(even) td{
            background: #0a0a0a;
        }

        .terms-table tr:hover td{
            background: #1a1a1a;
        }

        /* TOC - DARK THEME */
        .toc-link{
            transition:all .25s ease;
            color: #cccccc;
        }

        .toc-link:hover{
            transform:translateX(5px);
            color:#FFD700;
        }

        /* BUTTON */
        .premium-btn{
            transition:all .3s ease;
        }

        .premium-btn:hover{
            transform:translateY(-3px);
            box-shadow: 0 15px 35px rgba(255, 215, 0, 0.25);
        }

        /* SCROLL BAR */
        ::-webkit-scrollbar{
            width:8px;
        }

        ::-webkit-scrollbar-track{
            background:#1a1a1a;
        }

        ::-webkit-scrollbar-thumb{
            background:#FFD700;
            border-radius:20px;
        }

        ::-webkit-scrollbar-thumb:hover{
            background:#E6C200;
        }

        /* MOBILE */
        @media(max-width:768px){
            .terms-table{
                display:block;
                overflow-x:auto;
            }
        }

        /* Text Colors for Dark Theme */
        .text-dark-main{
            color: #e0e0e0;
        }

        .text-dark-secondary{
            color: #aaaaaa;
        }

        .bg-dark-card{
            background: #111111;
        }

        .border-dark{
            border-color: rgba(255, 215, 0, 0.1);
        }

        /* Highlight Box */
        .highlight-box {
            background: rgba(255, 215, 0, 0.05);
            border-left: 5px solid #FFD700;
            padding: 20px 28px;
            margin: 25px 32px;
            border-radius: 16px;
            color: #e0e0e0;
        }
        .highlight-box strong {
            color: #FFD700;
        }

        /* Contact Terms */
        .contact-terms {
            background: linear-gradient(135deg, #FFD700, #E6C200);
            padding: 50px 35px;
            border-radius: 20px;
            text-align: center;
            margin: 25px 32px 32px 32px;
            color: #000000;
        }
        .contact-terms h3, .contact-terms p {
            color: #000000;
        }
        .contact-terms .btn {
            background: #000000;
            color: #FFD700;
        }
        .contact-terms .btn:hover {
            background: #1a1a1a;
            color: #FFD700;
        }

        /* Section Title */
        .section-title {
            color: #FFD700;
        }
        .section-title .section-number {
            background: rgba(255, 215, 0, 0.1);
            color: #FFD700;
            border: 1px solid rgba(255, 215, 0, 0.2);
        }

        /* Section Content */
        .section-content {
            color: #cccccc;
        }
        .section-content h4 {
            color: #ffffff;
        }

        /* TOC */
        .toc {
            background: #111111;
            border: 1px solid rgba(255, 215, 0, 0.15);
        }
        .toc-title {
            color: #FFD700;
        }

        /* Back to Top */
        .back-to-top-section {
            background: #FFD700;
            color: #000000;
        }
        .back-to-top-section:hover {
            background: #E6C200;
        }


/* ===== Centralized CSS from about.php ===== */
html{
            scroll-behavior:smooth;
        }

        body{
            font-family:'Inter',sans-serif;
            background:
            linear-gradient(
                135deg,
                #f8fafc 0%,
                #ffffff 40%,
                #fff5f5 100%
            );
            overflow-x:hidden;
        }

        .playfair{
            font-family:'Playfair Display', serif;
        }

        /* HERO */

        .hero-radial{
            background:
            radial-gradient(
                circle at top left,
                #2d2d44 0%,
                #1e1e2f 45%,
                #12121d 100%
            );

            position:relative;
            overflow:hidden;
        }

        .hero-radial::before{
            content:'';
            position:absolute;
            width:500px;
            height:500px;
            background:rgba(255,255,255,.04);
            border-radius:50%;
            filter:blur(120px);
            top:-200px;
            right:-120px;
        }

        .hero-radial::after{
            content:'';
            position:absolute;
            width:420px;
            height:420px;
            background:rgba(209,43,44,.18);
            border-radius:50%;
            filter:blur(120px);
            bottom:-180px;
            left:-120px;
        }

        /* SECTION CARD */

        .term-section{
            transition:all .3s ease;
        }

        .term-section:hover{
            transform:translateY(-5px);

            box-shadow:
            0 20px 50px rgba(0,0,0,.08);

            background:#fffdfd;
        }

        /* LEGAL BOX */

        .legal-notice{
            background:#111827;
            border-left:6px solid #9f1239;
        }

        .legal-text{
            line-height:1.9;
        }

        /* TABLE */

        .privacy-table{
            width:100%;
            border-collapse:collapse;
            overflow:hidden;
            border-radius:18px;
            margin-top:25px;
        }

        .privacy-table th{
            background:#111827;
            color:#fff;
            text-align:left;
            padding:16px;
            font-size:.9rem;
        }

        .privacy-table td{
            padding:16px;
            border-bottom:1px solid #eee;
            color:#444;
        }

        .privacy-table tr:nth-child(even){
            background:#fafafa;
        }

        .privacy-table tr:hover{
            background:#fff1f1;
        }

        /* TOC */

        .toc-link{
            transition:all .25s ease;
        }

        .toc-link:hover{
            transform:translateX(5px);
            color:#9f1239;
        }

        /* BUTTON */

        .premium-btn{
            transition:all .3s ease;
        }

        .premium-btn:hover{
            transform:translateY(-3px);
            box-shadow:
            0 15px 35px rgba(159,18,57,.25);
        }

        /* SCROLL BAR */

        ::-webkit-scrollbar{
            width:8px;
        }

        ::-webkit-scrollbar-thumb{
            background:#9f1239;
            border-radius:20px;
        }

        /* MOBILE */

        @media(max-width:768px){

            .privacy-table{
                display:block;
                overflow-x:auto;
            }

        }


/* ===== Centralized CSS from experience.php ===== */
/* ========== PREMIUM DESIGN - ENHANCED VERSION ========== */
    
    /* Hero Section Premium */
    .exp-hero {
        height: 60vh;
        background: linear-gradient(135deg, rgba(10, 10, 15, 0.95), rgba(20, 20, 30, 0.92)), 
                    url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?auto=format&fit=crop&w=1920&q=80');
        background-size: cover;
        background-position: center;
        background-attachment: fixed;
        display: flex;
        align-items: center;
        text-align: center;
        margin-top: 80px;
        position: relative;
        overflow: hidden;
    }
    
    .exp-hero::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle, rgba(255,215,0,0.08) 0%, transparent 70%);
        animation: rotate 30s linear infinite;
    }
    
    @keyframes rotate {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }
    
    .exp-hero-content h1 {
        font-size: 4.5rem;
        font-weight: 800;
        background: linear-gradient(135deg, #FFD700 0%, #FFA500 50%, #FFD700 100%);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        text-shadow: 0 0 30px rgba(255,215,0,0.3);
        animation: fadeInUp 0.8s ease;
    }
    
    .exp-hero-content p {
        font-size: 1.3rem;
        animation: fadeInUp 0.8s ease 0.2s both;
    }
    
    @keyframes fadeInUp {
        from {
            opacity: 0;
            transform: translateY(30px);
        }
        to {
            opacity: 1;
            transform: translateY(0);
        }
    }
    
    /* Premium Counter Section */
    .exp-counter-section {
        background: linear-gradient(135deg, #0f0f1a 0%, #1a1a2e 100%);
        padding: var(--space-xl) 0;
        margin-top: -50px;
        position: relative;
        z-index: 10;
        border-radius: 30px;
        margin-bottom: var(--space-xl);
        box-shadow: 0 20px 40px rgba(0,0,0,0.4), inset 0 1px 0 rgba(255,255,255,0.05);
    }
    
    .counter-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
        gap: var(--space-lg);
        text-align: center;
    }
    
    .counter-item {
        padding: var(--space-lg);
        background: rgba(255,255,255,0.03);
        border-radius: 20px;
        backdrop-filter: blur(10px);
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        border: 1px solid rgba(255,215,0,0.1);
    }
    
    .counter-item:hover {
        transform: translateY(-10px) scale(1.02);
        border-color: rgba(255,215,0,0.4);
        box-shadow: 0 20px 40px rgba(0,0,0,0.3);
        background: rgba(255,215,0,0.05);
    }
    
    .counter-number {
        font-size: 3.5rem;
        font-weight: 800;
        background: linear-gradient(135deg, #FFD700, #FFA500);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        margin-bottom: var(--space-xs);
        font-family: 'Poppins', sans-serif;
    }
    
    .counter-label {
        color: var(--text-muted);
        font-size: 1rem;
        text-transform: uppercase;
        letter-spacing: 2px;
        font-weight: 500;
    }
    
    /* Experience Cards Premium */
    .exp-showcase {
        padding: var(--space-xl) 0;
    }
    
    .exp-card {
        background: linear-gradient(135deg, rgba(30,30,42,0.9) 0%, rgba(20,20,30,0.95) 100%);
        border-radius: 24px;
        padding: var(--space-lg);
        margin-bottom: var(--space-lg);
        border: 1px solid rgba(255,215,0,0.1);
        transition: all 0.4s ease;
        backdrop-filter: blur(10px);
        position: relative;
        overflow: hidden;
    }
    
    .exp-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255,215,0,0.1), transparent);
        transition: left 0.6s ease;
    }
    
    .exp-card:hover::before {
        left: 100%;
    }
    
    .exp-card:hover {
        transform: translateY(-8px);
        border-color: var(--primary-yellow);
        box-shadow: 0 25px 50px rgba(0,0,0,0.5);
    }
    
    .exp-card h3 {
        color: var(--primary-yellow);
        margin-bottom: var(--space-md);
        font-size: 1.6rem;
        display: flex;
        align-items: center;
        gap: 12px;
    }
    
    .exp-card h3 i {
        font-size: 2rem;
        background: linear-gradient(135deg, #FFD700, #FFA500);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }
    
    /* Facebook Journey Section - Premium Timeline */
    .facebook-journey-section {
        background: linear-gradient(180deg, #0a0a0f 0%, #0f0f1a 100%);
        padding: var(--space-xl) 0;
        border-radius: 40px;
        margin: var(--space-xl) 0;
        position: relative;
        overflow: hidden;
    }
    
    .facebook-journey-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 1px;
        background: linear-gradient(90deg, transparent, #FFD700, transparent);
    }
    
    .journey-timeline {
        position: relative;
        max-width: 1000px;
        margin: 0 auto;
    }
    
    .journey-timeline::before {
        content: '';
        position: absolute;
        left: 140px;
        top: 0;
        bottom: 0;
        width: 3px;
        background: linear-gradient(180deg, #FFD700, #FFA500, #FFD700);
        border-radius: 3px;
        box-shadow: 0 0 10px rgba(255,215,0,0.5);
    }
    
    .journey-item {
        display: flex;
        gap: var(--space-lg);
        margin-bottom: var(--space-xl);
        position: relative;
        opacity: 0;
        transform: translateX(-30px);
        transition: all 0.6s ease;
    }
    
    .journey-item.visible {
        opacity: 1;
        transform: translateX(0);
    }
    
    .journey-year {
        min-width: 120px;
        text-align: right;
        font-size: 2rem;
        font-weight: 800;
        background: linear-gradient(135deg, #FFD700, #FFA500);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        padding-right: var(--space-lg);
        position: relative;
    }
    
    .journey-year::after {
        content: '';
        position: absolute;
        right: -8px;
        top: 50%;
        width: 16px;
        height: 16px;
        background: #FFD700;
        border-radius: 50%;
        transform: translateY(-50%);
        box-shadow: 0 0 15px #FFD700;
        border: 3px solid #0a0a0f;
    }
    
    /* Facebook Post Card Premium */
    .facebook-post-card {
        flex: 1;
        background: linear-gradient(135deg, #1a1a2a 0%, #151520 100%);
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid rgba(255,215,0,0.15);
        transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        margin-left: 30px;
        box-shadow: 0 10px 30px rgba(0,0,0,0.3);
    }
    
    .facebook-post-card:hover {
        transform: translateY(-8px) scale(1.02);
        border-color: #FFD700;
        box-shadow: 0 25px 45px rgba(0,0,0,0.4), 0 0 20px rgba(255,215,0,0.1);
    }
    
    .fb-post-header {
        display: flex;
        align-items: center;
        gap: 15px;
        padding: 18px 22px;
        background: rgba(255,255,255,0.03);
        border-bottom: 1px solid rgba(255,215,0,0.1);
    }
    
    .fb-avatar {
        width: 52px;
        height: 52px;
        border-radius: 50%;
        background: linear-gradient(135deg, #FFD700, #FFA500);
        display: flex;
        align-items: center;
        justify-content: center;
        color: #000;
        font-size: 1.6rem;
        box-shadow: 0 5px 15px rgba(255,215,0,0.3);
    }
    
    .fb-info h4 {
        color: white;
        font-size: 1.1rem;
        margin-bottom: 4px;
        font-weight: 600;
    }
    
    .fb-info p {
        color: #8a8a9a;
        font-size: 0.8rem;
        display: flex;
        align-items: center;
        gap: 8px;
    }
    
    .fb-post-img {
        width: 100%;
        height: auto;
        max-height: 400px;
        object-fit: cover;
        object-position: top;
        transition: transform 0.5s ease;
    }
    
    .facebook-post-card:hover .fb-post-img {
        transform: scale(1.02);
    }
    
    .fb-post-content {
        padding: 20px 22px;
    }
    
    .fb-post-text {
        color: #e0e0e0;
        line-height: 1.6;
        margin-bottom: 15px;
        font-size: 1rem;
    }
    
    .fb-post-text strong {
        color: #FFD700;
    }
    
    .fb-hashtags {
        color: #FFD700;
        font-size: 0.85rem;
        letter-spacing: 0.5px;
    }
    
    .fb-post-stats {
        display: flex;
        gap: 25px;
        padding: 12px 22px;
        border-top: 1px solid rgba(255,255,255,0.05);
        border-bottom: 1px solid rgba(255,255,255,0.05);
        color: #8a8a9a;
        font-size: 0.85rem;
    }
    
    .fb-post-stats span {
        display: flex;
        align-items: center;
        gap: 8px;
        transition: all 0.3s ease;
        cursor: default;
    }
    
    .fb-post-stats span:hover {
        color: #FFD700;
    }
    
    .fb-post-link {
        padding: 14px 22px;
        display: flex;
        align-items: center;
        gap: 10px;
        color: #FFD700;
        text-decoration: none;
        font-size: 0.95rem;
        font-weight: 500;
        transition: all 0.3s ease;
    }
    
    .fb-post-link:hover {
        background: rgba(255,215,0,0.1);
        gap: 15px;
        color: white;
    }
    
    /* Facebook Follow Card Premium */
    .facebook-page-follow {
        background: linear-gradient(135deg, #1a1a2e 0%, #0f0f1a 100%);
        text-align: center;
        padding: var(--space-xl);
        border-radius: 30px;
        margin-top: var(--space-xl);
        border: 1px solid rgba(255,215,0,0.2);
        position: relative;
        overflow: hidden;
    }
    
    .fb-icon-large {
        font-size: 4rem;
        background: linear-gradient(135deg, #1877f2, #0d6efd);
        border-radius: 50%;
        padding: 20px;
        margin-bottom: 25px;
        display: inline-block;
        box-shadow: 0 10px 30px rgba(24,119,242,0.3);
        transition: all 0.3s ease;
    }
    
    .facebook-page-follow:hover .fb-icon-large {
        transform: scale(1.1);
        box-shadow: 0 15px 40px rgba(24,119,242,0.5);
    }
    
    .btn-facebook {
        background: linear-gradient(135deg, #1877f2, #0d6efd);
        color: white;
        border: none;
        padding: 14px 35px;
        font-size: 1.1rem;
        font-weight: 600;
        border-radius: 50px;
        transition: all 0.3s ease;
        box-shadow: 0 5px 15px rgba(24,119,242,0.3);
    }
    
    .btn-facebook:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 25px rgba(24,119,242,0.4);
        background: linear-gradient(135deg, #0d6efd, #1877f2);
    }
    
    .achievement-badge {
        display: inline-block;
        background: rgba(255,215,0,0.15);
        border: 1px solid rgba(255,215,0,0.3);
        border-radius: 50px;
        padding: 5px 15px;
        font-size: 0.8rem;
        color: #FFD700;
        margin-top: 10px;
    }
    
    /* Responsive */
    @media (max-width: 768px) {
        .journey-timeline::before {
            left: 30px;
        }
        
        .journey-item {
            flex-direction: column;
        }
        
        .journey-year {
            text-align: left;
            padding-left: 30px;
            margin-bottom: 10px;
        }
        
        .journey-year::after {
            left: 22px;
            right: auto;
        }
        
        .facebook-post-card {
            margin-left: 30px;
        }
        
        .exp-hero-content h1 {
            font-size: 2.5rem;
        }
        
        .counter-number {
            font-size: 2.5rem;
        }
        
        .fb-post-img {
            max-height: 250px;
        }
    }


/* ===== Centralized CSS from siwan.php ===== */
/* ==============================================
       PREMIUM MODERN DESIGN - SIWAN & CHHAPRA, BIHAR PAGE
       ============================================== */
    
    /* CSS Variables */
    :root {
        --primary: #FFD700;
        --primary-dark: #E6BE00;
        --primary-glow: rgba(255, 215, 0, 0.3);
        --dark: #0A0A0F;
        --dark-card: #11111A;
        --dark-lighter: #1A1A2E;
        --text-light: #FFFFFF;
        --text-muted: #A0A0B0;
        --gradient-gold: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
        --gradient-dark: linear-gradient(135deg, #0A0A0F 0%, #1A1A2E 100%);
        --gradient-card: linear-gradient(135deg, #11111A 0%, #1A1A2E 100%);
        --shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.3);
        --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.4);
        --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.5);
        --shadow-gold: 0 0 30px rgba(255, 215, 0, 0.2);
        --border-radius: 20px;
        --border-radius-lg: 30px;
    }

    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    body {
        background: var(--dark);
        color: var(--text-light);
    }

    /* ========== HERO SECTION ========== */
    .hero-local {
        position: relative;
        min-height: 80vh;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 120px 0 80px;
        overflow: hidden;
        background: var(--gradient-dark);
    }

    .hero-local-bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .hero-local-bg .circle {
        position: absolute;
        border-radius: 50%;
        background: radial-gradient(circle, var(--primary-glow) 0%, transparent 70%);
        filter: blur(60px);
    }

    .circle-1 { width: 400px; height: 400px; top: -200px; right: -100px; }
    .circle-2 { width: 300px; height: 300px; bottom: -100px; left: -100px; }
    .circle-3 { width: 200px; height: 200px; top: 50%; left: 50%; transform: translate(-50%, -50%); }

    .hero-local-content {
        position: relative;
        z-index: 2;
        max-width: 900px;
        margin: 0 auto;
    }

    .hero-local h1 {
        font-size: 3.5rem;
        font-weight: 800;
        line-height: 1.2;
        margin-bottom: 20px;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .hero-local .highlight-text {
        color: var(--primary);
        background: none;
        -webkit-background-clip: unset;
        background-clip: unset;
    }

    .hero-local .lead {
        font-size: 1.2rem;
        color: var(--text-muted);
        margin-bottom: 30px;
        line-height: 1.6;
    }

    /* Buttons */
    .btn-group-local {
        display: flex;
        gap: 20px;
        justify-content: center;
        flex-wrap: wrap;
        margin-bottom: 40px;
    }

    .btn-local {
        padding: 14px 35px;
        border-radius: 50px;
        font-weight: 600;
        font-size: 1rem;
        transition: all 0.3s ease;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 10px;
    }

    .btn-primary-local {
        background: var(--gradient-gold);
        color: #000;
        box-shadow: 0 5px 20px rgba(255, 215, 0, 0.3);
    }

    .btn-primary-local:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 30px rgba(255, 215, 0, 0.4);
        color: #000;
    }

    .btn-outline-local {
        border: 2px solid var(--primary);
        color: var(--primary);
        background: transparent;
    }

    .btn-outline-local:hover {
        background: var(--primary);
        color: #000;
        transform: translateY(-3px);
    }

    /* Location Tags */
    .location-tags {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .location-tag {
        background: rgba(255, 215, 0, 0.1);
        border: 1px solid rgba(255, 215, 0, 0.2);
        padding: 8px 20px;
        border-radius: 50px;
        font-size: 0.9rem;
        color: var(--primary);
        transition: all 0.3s ease;
    }

    .location-tag:hover {
        background: rgba(255, 215, 0, 0.2);
        transform: translateY(-2px);
    }

    /* ========== STATS SECTION ========== */
    .stats-section {
        padding: 60px 0;
        background: linear-gradient(180deg, var(--dark) 0%, var(--dark-card) 100%);
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        text-align: center;
    }

    .stat-card {
        background: var(--gradient-card);
        padding: 30px 20px;
        border-radius: var(--border-radius);
        border: 1px solid rgba(255, 215, 0, 0.1);
        transition: all 0.3s ease;
    }

    .stat-card:hover {
        transform: translateY(-5px);
        border-color: var(--primary);
        box-shadow: var(--shadow-gold);
    }

    .stat-number {
        font-size: 3rem;
        font-weight: 800;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        margin-bottom: 10px;
    }

    .stat-label {
        color: var(--text-muted);
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    /* ========== SERVICES SECTION ========== */
    .services-section {
        padding: 80px 0;
        background: var(--dark-card);
    }

    .section-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .section-badge {
        display: inline-block;
        background: rgba(255, 215, 0, 0.1);
        color: var(--primary);
        padding: 5px 15px;
        border-radius: 50px;
        font-size: 0.8rem;
        margin-bottom: 15px;
    }

    .section-title {
        font-size: 2.5rem;
        font-weight: 700;
        margin-bottom: 15px;
    }

    .section-title span {
        color: var(--primary);
    }

    .section-subtitle {
        color: var(--text-muted);
        max-width: 600px;
        margin: 0 auto;
    }

    .services-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 30px;
    }

    .service-card {
        background: var(--gradient-card);
        border-radius: var(--border-radius);
        padding: 35px 30px;
        transition: all 0.4s ease;
        border: 1px solid rgba(255, 215, 0, 0.1);
        position: relative;
        overflow: hidden;
    }

    .service-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.05), transparent);
        transition: left 0.5s ease;
    }

    .service-card:hover::before {
        left: 100%;
    }

    .service-card:hover {
        transform: translateY(-8px);
        border-color: var(--primary);
        box-shadow: var(--shadow-lg);
    }

    .service-icon {
        width: 70px;
        height: 70px;
        background: rgba(255, 215, 0, 0.1);
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 25px;
    }

    .service-icon i {
        font-size: 2.5rem;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .service-card h3 {
        font-size: 1.5rem;
        margin-bottom: 15px;
    }

    .service-card p {
        color: var(--text-muted);
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .service-link {
        color: var(--primary);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-weight: 500;
        transition: gap 0.3s ease;
    }

    .service-link:hover {
        gap: 12px;
    }

    /* ========== WHY US SECTION ========== */
    .whyus-section {
        padding: 80px 0;
        background: var(--dark);
    }

    .whyus-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 50px;
        align-items: center;
    }

    .whyus-content h2 {
        font-size: 2.5rem;
        margin-bottom: 20px;
    }

    .whyus-list {
        list-style: none;
        margin-top: 30px;
    }

    .whyus-list li {
        display: flex;
        align-items: center;
        gap: 15px;
        margin-bottom: 20px;
        padding: 15px;
        background: var(--dark-card);
        border-radius: 15px;
        transition: all 0.3s ease;
    }

    .whyus-list li:hover {
        transform: translateX(10px);
        background: var(--dark-lighter);
    }

    .whyus-list li i {
        width: 45px;
        height: 45px;
        background: rgba(255, 215, 0, 0.1);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.3rem;
        color: var(--primary);
    }

    .whyus-list li span {
        flex: 1;
    }

    .whyus-list li strong {
        color: var(--primary);
    }

    .whyus-image {
        border-radius: var(--border-radius-lg);
        overflow: hidden;
        box-shadow: var(--shadow-lg);
    }

    .whyus-image img {
        width: 100%;
        height: auto;
        transition: transform 0.5s ease;
    }

    .whyus-image:hover img {
        transform: scale(1.05);
    }

    /* ========== CONTACT SECTION ========== */
    .contact-section {
        padding: 80px 0;
        background: linear-gradient(135deg, var(--dark-card) 0%, var(--dark) 100%);
    }

    .contact-card {
        background: var(--gradient-card);
        border-radius: var(--border-radius-lg);
        padding: 50px;
        text-align: center;
        border: 1px solid rgba(255, 215, 0, 0.2);
        position: relative;
        overflow: hidden;
    }

    .contact-card::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle, rgba(255, 215, 0, 0.05) 0%, transparent 70%);
    }

    .contact-card h2 {
        font-size: 2.2rem;
        margin-bottom: 15px;
        position: relative;
        z-index: 1;
    }

    .contact-card .phone-number {
        font-size: 3rem;
        font-weight: 800;
        color: var(--primary);
        margin: 20px 0;
        letter-spacing: 2px;
        position: relative;
        z-index: 1;
    }

    .contact-buttons {
        display: flex;
        gap: 20px;
        justify-content: center;
        flex-wrap: wrap;
        position: relative;
        z-index: 1;
    }

    .btn-call {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
    }

    .btn-whatsapp {
        background: linear-gradient(135deg, #25D366, #128C7E);
        color: white;
    }

    .contact-note {
        margin-top: 25px;
        color: var(--text-muted);
        position: relative;
        z-index: 1;
    }

    /* ========== FAQ SECTION ========== */
    .faq-section {
        padding: 80px 0;
        background: var(--dark-card);
    }

    .faq-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
        gap: 25px;
        max-width: 1000px;
        margin: 0 auto;
    }

    .faq-item {
        background: var(--gradient-card);
        border-radius: 16px;
        padding: 25px;
        border-left: 4px solid var(--primary);
        transition: all 0.3s ease;
    }

    .faq-item:hover {
        transform: translateX(5px);
        box-shadow: var(--shadow-md);
    }

    .faq-item h4 {
        font-size: 1.2rem;
        margin-bottom: 12px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .faq-item h4 i {
        color: var(--primary);
    }

    .faq-item p {
        color: var(--text-muted);
        line-height: 1.6;
        padding-left: 30px;
    }

    /* ========== CTA SECTION ========== */
    .cta-local {
        padding: 60px 0;
        background: var(--gradient-gold);
        text-align: center;
    }

    .cta-local h3 {
        font-size: 2rem;
        color: #000;
        margin-bottom: 15px;
    }

    .cta-local p {
        color: #1a1a1a;
        margin-bottom: 25px;
        font-size: 1.1rem;
    }

    .btn-dark-local {
        background: #000;
        color: var(--primary);
        padding: 14px 40px;
        border-radius: 50px;
        text-decoration: none;
        font-weight: 600;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        transition: all 0.3s ease;
    }

    .btn-dark-local:hover {
        transform: translateY(-3px);
        background: #1a1a1a;
        color: var(--primary);
    }

    /* ========== FLOATING BUTTONS ========== */
    .floating-buttons {
        position: fixed;
        bottom: 30px;
        right: 30px;
        display: flex;
        flex-direction: column;
        gap: 15px;
        z-index: 1000;
    }

    .float-btn {
        width: 55px;
        height: 55px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        transition: all 0.3s ease;
        box-shadow: var(--shadow-md);
        text-decoration: none;
    }

    .float-btn:hover {
        transform: scale(1.1);
    }

    .float-call {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
    }

    .float-wa {
        background: linear-gradient(135deg, #25D366, #128C7E);
        color: white;
    }

    /* ========== RESPONSIVE ========== */
    @media (max-width: 992px) {
        .hero-local h1 { font-size: 2.5rem; }
        .stats-grid { grid-template-columns: repeat(2, 1fr); }
        .whyus-grid { grid-template-columns: 1fr; }
        .services-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
        .faq-grid { grid-template-columns: 1fr; }
        .contact-card .phone-number { font-size: 2rem; }
    }

    @media (max-width: 768px) {
        .hero-local h1 { font-size: 1.8rem; }
        .section-title { font-size: 1.8rem; }
        .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
        .stat-card { padding: 20px 15px; }
        .stat-number { font-size: 2rem; }
        .contact-card { padding: 30px 20px; }
        .contact-card .phone-number { font-size: 1.5rem; }
        .floating-buttons { bottom: 20px; right: 20px; }
        .float-btn { width: 45px; height: 45px; font-size: 1.2rem; }
    }

    @media (max-width: 480px) {
        .stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
        .stat-card { padding: 15px 10px; }
        .stat-number { font-size: 1.5rem; }
        .stat-label { font-size: 0.7rem; }
        .btn-group-local .btn-local { padding: 10px 20px; font-size: 0.9rem; }
    }


/* ===== Centralized CSS from gopalganj.php ===== */
/* ==============================================
       PREMIUM MODERN DESIGN - GOPALGANJ & MIRGANJ PAGE
       ============================================== */
    
    /* CSS Variables */
    :root {
        --primary: #FFD700;
        --primary-dark: #E6BE00;
        --primary-glow: rgba(255, 215, 0, 0.3);
        --dark: #0A0A0F;
        --dark-card: #11111A;
        --dark-lighter: #1A1A2E;
        --text-light: #FFFFFF;
        --text-muted: #A0A0B0;
        --gradient-gold: linear-gradient(135deg, #FFD700 0%, #FFA500 100%);
        --gradient-dark: linear-gradient(135deg, #0A0A0F 0%, #1A1A2E 100%);
        --gradient-card: linear-gradient(135deg, #11111A 0%, #1A1A2E 100%);
        --shadow-sm: 0 4px 20px rgba(0, 0, 0, 0.3);
        --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.4);
        --shadow-lg: 0 20px 50px rgba(0, 0, 0, 0.5);
        --shadow-gold: 0 0 30px rgba(255, 215, 0, 0.2);
        --border-radius: 20px;
        --border-radius-lg: 30px;
    }

    * {
        margin: 0;
        padding: 0;
        box-sizing: border-box;
    }

    body {
        background: var(--dark);
        color: var(--text-light);
    }

    /* ========== HERO SECTION ========== */
    .hero-local {
        position: relative;
        min-height: 80vh;
        display: flex;
        align-items: center;
        justify-content: center;
        text-align: center;
        padding: 120px 0 80px;
        overflow: hidden;
        background: var(--gradient-dark);
    }

    .hero-local-bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .hero-local-bg .circle {
        position: absolute;
        border-radius: 50%;
        background: radial-gradient(circle, var(--primary-glow) 0%, transparent 70%);
        filter: blur(60px);
    }

    .circle-1 { width: 400px; height: 400px; top: -200px; right: -100px; }
    .circle-2 { width: 300px; height: 300px; bottom: -100px; left: -100px; }
    .circle-3 { width: 200px; height: 200px; top: 50%; left: 50%; transform: translate(-50%, -50%); }

    .hero-local-content {
        position: relative;
        z-index: 2;
        max-width: 900px;
        margin: 0 auto;
    }

    .hero-local h1 {
        font-size: 3.5rem;
        font-weight: 800;
        line-height: 1.2;
        margin-bottom: 20px;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .hero-local .highlight-text {
        color: var(--primary);
        background: none;
        -webkit-background-clip: unset;
        background-clip: unset;
    }

    .hero-local .lead {
        font-size: 1.2rem;
        color: var(--text-muted);
        margin-bottom: 30px;
        line-height: 1.6;
    }

    /* Buttons */
    .btn-group-local {
        display: flex;
        gap: 20px;
        justify-content: center;
        flex-wrap: wrap;
        margin-bottom: 40px;
    }

    .btn-local {
        padding: 14px 35px;
        border-radius: 50px;
        font-weight: 600;
        font-size: 1rem;
        transition: all 0.3s ease;
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 10px;
    }

    .btn-primary-local {
        background: var(--gradient-gold);
        color: #000;
        box-shadow: 0 5px 20px rgba(255, 215, 0, 0.3);
    }

    .btn-primary-local:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 30px rgba(255, 215, 0, 0.4);
        color: #000;
    }

    .btn-outline-local {
        border: 2px solid var(--primary);
        color: var(--primary);
        background: transparent;
    }

    .btn-outline-local:hover {
        background: var(--primary);
        color: #000;
        transform: translateY(-3px);
    }

    /* Location Tags */
    .location-tags {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 12px;
    }

    .location-tag {
        background: rgba(255, 215, 0, 0.1);
        border: 1px solid rgba(255, 215, 0, 0.2);
        padding: 8px 20px;
        border-radius: 50px;
        font-size: 0.9rem;
        color: var(--primary);
        transition: all 0.3s ease;
    }

    .location-tag:hover {
        background: rgba(255, 215, 0, 0.2);
        transform: translateY(-2px);
    }

    /* ========== STATS SECTION ========== */
    .stats-section {
        padding: 60px 0;
        background: linear-gradient(180deg, var(--dark) 0%, var(--dark-card) 100%);
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 30px;
        text-align: center;
    }

    .stat-card {
        background: var(--gradient-card);
        padding: 30px 20px;
        border-radius: var(--border-radius);
        border: 1px solid rgba(255, 215, 0, 0.1);
        transition: all 0.3s ease;
    }

    .stat-card:hover {
        transform: translateY(-5px);
        border-color: var(--primary);
        box-shadow: var(--shadow-gold);
    }

    .stat-number {
        font-size: 3rem;
        font-weight: 800;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
        margin-bottom: 10px;
    }

    .stat-label {
        color: var(--text-muted);
        font-size: 0.9rem;
        text-transform: uppercase;
        letter-spacing: 1px;
    }

    /* ========== SERVICES SECTION ========== */
    .services-section {
        padding: 80px 0;
        background: var(--dark-card);
    }

    .section-header {
        text-align: center;
        margin-bottom: 50px;
    }

    .section-badge {
        display: inline-block;
        background: rgba(255, 215, 0, 0.1);
        color: var(--primary);
        padding: 5px 15px;
        border-radius: 50px;
        font-size: 0.8rem;
        margin-bottom: 15px;
    }

    .section-title {
        font-size: 2.5rem;
        font-weight: 700;
        margin-bottom: 15px;
    }

    .section-title span {
        color: var(--primary);
    }

    .section-subtitle {
        color: var(--text-muted);
        max-width: 600px;
        margin: 0 auto;
    }

    .services-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(350px, 1fr));
        gap: 30px;
    }

    .service-card {
        background: var(--gradient-card);
        border-radius: var(--border-radius);
        padding: 35px 30px;
        transition: all 0.4s ease;
        border: 1px solid rgba(255, 215, 0, 0.1);
        position: relative;
        overflow: hidden;
    }

    .service-card::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 215, 0, 0.05), transparent);
        transition: left 0.5s ease;
    }

    .service-card:hover::before {
        left: 100%;
    }

    .service-card:hover {
        transform: translateY(-8px);
        border-color: var(--primary);
        box-shadow: var(--shadow-lg);
    }

    .service-icon {
        width: 70px;
        height: 70px;
        background: rgba(255, 215, 0, 0.1);
        border-radius: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 25px;
    }

    .service-icon i {
        font-size: 2.5rem;
        background: var(--gradient-gold);
        -webkit-background-clip: text;
        background-clip: text;
        color: transparent;
    }

    .service-card h3 {
        font-size: 1.5rem;
        margin-bottom: 15px;
    }

    .service-card p {
        color: var(--text-muted);
        line-height: 1.6;
        margin-bottom: 20px;
    }

    .service-link {
        color: var(--primary);
        text-decoration: none;
        display: inline-flex;
        align-items: center;
        gap: 8px;
        font-weight: 500;
        transition: gap 0.3s ease;
    }

    .service-link:hover {
        gap: 12px;
    }

    /* ========== WHY US SECTION ========== */
    .whyus-section {
        padding: 80px 0;
        background: var(--dark);
    }

    .whyus-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 50px;
        align-items: center;
    }

    .whyus-content h2 {
        font-size: 2.5rem;
        margin-bottom: 20px;
    }

    .whyus-list {
        list-style: none;
        margin-top: 30px;
    }

    .whyus-list li {
        display: flex;
        align-items: center;
        gap: 15px;
        margin-bottom: 20px;
        padding: 15px;
        background: var(--dark-card);
        border-radius: 15px;
        transition: all 0.3s ease;
    }

    .whyus-list li:hover {
        transform: translateX(10px);
        background: var(--dark-lighter);
    }

    .whyus-list li i {
        width: 45px;
        height: 45px;
        background: rgba(255, 215, 0, 0.1);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.3rem;
        color: var(--primary);
    }

    .whyus-list li span {
        flex: 1;
    }

    .whyus-list li strong {
        color: var(--primary);
    }

    .whyus-image {
        border-radius: var(--border-radius-lg);
        overflow: hidden;
        box-shadow: var(--shadow-lg);
    }

    .whyus-image img {
        width: 100%;
        height: auto;
        transition: transform 0.5s ease;
    }

    .whyus-image:hover img {
        transform: scale(1.05);
    }

    /* ========== CONTACT SECTION ========== */
    .contact-section {
        padding: 80px 0;
        background: linear-gradient(135deg, var(--dark-card) 0%, var(--dark) 100%);
    }

    .contact-card {
        background: var(--gradient-card);
        border-radius: var(--border-radius-lg);
        padding: 50px;
        text-align: center;
        border: 1px solid rgba(255, 215, 0, 0.2);
        position: relative;
        overflow: hidden;
    }

    .contact-card::before {
        content: '';
        position: absolute;
        top: -50%;
        left: -50%;
        width: 200%;
        height: 200%;
        background: radial-gradient(circle, rgba(255, 215, 0, 0.05) 0%, transparent 70%);
    }

    .contact-card h2 {
        font-size: 2.2rem;
        margin-bottom: 15px;
        position: relative;
        z-index: 1;
    }

    .contact-card .phone-number {
        font-size: 3rem;
        font-weight: 800;
        color: var(--primary);
        margin: 20px 0;
        letter-spacing: 2px;
        position: relative;
        z-index: 1;
    }

    .contact-buttons {
        display: flex;
        gap: 20px;
        justify-content: center;
        flex-wrap: wrap;
        position: relative;
        z-index: 1;
    }

    .btn-call {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
    }

    .btn-whatsapp {
        background: linear-gradient(135deg, #25D366, #128C7E);
        color: white;
    }

    .contact-note {
        margin-top: 25px;
        color: var(--text-muted);
        position: relative;
        z-index: 1;
    }

    /* ========== FAQ SECTION ========== */
    .faq-section {
        padding: 80px 0;
        background: var(--dark-card);
    }

    .faq-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(450px, 1fr));
        gap: 25px;
        max-width: 1000px;
        margin: 0 auto;
    }

    .faq-item {
        background: var(--gradient-card);
        border-radius: 16px;
        padding: 25px;
        border-left: 4px solid var(--primary);
        transition: all 0.3s ease;
    }

    .faq-item:hover {
        transform: translateX(5px);
        box-shadow: var(--shadow-md);
    }

    .faq-item h4 {
        font-size: 1.2rem;
        margin-bottom: 12px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .faq-item h4 i {
        color: var(--primary);
    }

    .faq-item p {
        color: var(--text-muted);
        line-height: 1.6;
        padding-left: 30px;
    }

    /* ========== CTA SECTION ========== */
    .cta-local {
        padding: 60px 0;
        background: var(--gradient-gold);
        text-align: center;
    }

    .cta-local h3 {
        font-size: 2rem;
        color: #000;
        margin-bottom: 15px;
    }

    .cta-local p {
        color: #1a1a1a;
        margin-bottom: 25px;
        font-size: 1.1rem;
    }

    .btn-dark-local {
        background: #000;
        color: var(--primary);
        padding: 14px 40px;
        border-radius: 50px;
        text-decoration: none;
        font-weight: 600;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        transition: all 0.3s ease;
    }

    .btn-dark-local:hover {
        transform: translateY(-3px);
        background: #1a1a1a;
        color: var(--primary);
    }

    /* ========== FLOATING BUTTONS ========== */
    .floating-buttons {
        position: fixed;
        bottom: 30px;
        right: 30px;
        display: flex;
        flex-direction: column;
        gap: 15px;
        z-index: 1000;
    }

    .float-btn {
        width: 55px;
        height: 55px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 1.5rem;
        transition: all 0.3s ease;
        box-shadow: var(--shadow-md);
        text-decoration: none;
    }

    .float-btn:hover {
        transform: scale(1.1);
    }

    .float-call {
        background: linear-gradient(135deg, #007bff, #0056b3);
        color: white;
    }

    .float-wa {
        background: linear-gradient(135deg, #25D366, #128C7E);
        color: white;
    }

    /* ========== RESPONSIVE ========== */
    @media (max-width: 992px) {
        .hero-local h1 { font-size: 2.5rem; }
        .stats-grid { grid-template-columns: repeat(2, 1fr); }
        .whyus-grid { grid-template-columns: 1fr; }
        .services-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
        .faq-grid { grid-template-columns: 1fr; }
        .contact-card .phone-number { font-size: 2rem; }
    }

    @media (max-width: 768px) {
        .hero-local h1 { font-size: 1.8rem; }
        .section-title { font-size: 1.8rem; }
        .stats-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
        .stat-card { padding: 20px 15px; }
        .stat-number { font-size: 2rem; }
        .contact-card { padding: 30px 20px; }
        .contact-card .phone-number { font-size: 1.5rem; }
        .floating-buttons { bottom: 20px; right: 20px; }
        .float-btn { width: 45px; height: 45px; font-size: 1.2rem; }
    }

    @media (max-width: 480px) {
        .stats-grid { grid-template-columns: 1fr 1fr; gap: 10px; }
        .stat-card { padding: 15px 10px; }
        .stat-number { font-size: 1.5rem; }
        .stat-label { font-size: 0.7rem; }
        .btn-group-local .btn-local { padding: 10px 20px; font-size: 0.9rem; }
    }


/* ===== Centralized CSS from packages.php ===== */
.packages-hero {
        min-height: 60vh;
        background: linear-gradient(rgba(15, 15, 15, 0.88), rgba(15, 15, 15, 0.92)),
                    url('https://images.unsplash.com/photo-1557838923-2985c318be48?auto=format&fit=crop&w=1920&q=80');
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;
        text-align: center;
        position: relative;
        margin-top: 80px;
        padding: 70px 0;
    }

    .packages-hero-title {
        font-size: 3.4rem;
        color: var(--primary-yellow);
        text-transform: uppercase;
        letter-spacing: 1px;
        margin-bottom: 18px;
    }

    .packages-hero-subtitle {
        font-size: 1.25rem;
        color: #ddd;
        max-width: 850px;
        margin: 0 auto;
    }

    .marketing-highlight {
        background: linear-gradient(135deg, #1a1a1a, #2c2c2c);
        border-top: 3px solid var(--primary-yellow);
        border-bottom: 3px solid var(--primary-yellow);
        padding: 55px 20px;
        text-align: center;
    }

    .marketing-highlight h2 {
        color: var(--primary-yellow);
        margin-bottom: 15px;
        text-transform: uppercase;
    }

    .marketing-highlight p {
        font-size: 1.1rem;
        color: #ddd;
        max-width: 850px;
        margin: 0 auto 22px;
    }

    .marketing-points {
        display: flex;
        justify-content: center;
        gap: 22px;
        flex-wrap: wrap;
        margin: 25px 0;
    }

    .marketing-points div {
        background: rgba(255,255,255,0.06);
        border: 1px solid rgba(255,215,0,0.18);
        padding: 14px 18px;
        border-radius: var(--radius-md);
        color: #fff;
        font-weight: 600;
    }

    .packages-section {
        padding: 90px 0;
    }

    .packages-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
        gap: 35px;
    }

    .package-card {
        background: var(--card-bg);
        border-radius: var(--radius-md);
        overflow: hidden;
        box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8);
        transition: all 0.3s ease;
        border: 1px solid rgba(255, 215, 0, 0.15);
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .package-card:hover {
        transform: translateY(-10px);
        border-color: var(--primary-yellow);
        box-shadow: 0 25px 80px rgba(0, 0, 0, 0.9);
    }

    .package-image {
        height: 220px;
        overflow: hidden;
    }

    .package-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s ease;
    }

    .package-card:hover .package-image img {
        transform: scale(1.06);
    }

    .package-content {
        padding: 26px;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
    }

    .package-title {
        font-size: 1.35rem;
        color: var(--primary-yellow);
        text-transform: uppercase;
        margin-bottom: 12px;
        line-height: 1.3;
    }

    .package-description {
        color: var(--text-muted);
        line-height: 1.7;
        margin-bottom: 24px;
        flex-grow: 1;
    }

    .package-features {
        margin-bottom: 24px;
    }

    .package-features li {
        color: #ddd;
        font-size: 0.92rem;
        margin-bottom: 9px;
    }

    .package-features li i {
        color: var(--primary-yellow);
        margin-right: 8px;
    }

    .btn-card {
        display: block;
        width: fit-content;
        margin: 0 auto;
        padding: 14px 32px;
        background: var(--gradient-primary);
        color: #000;
        font-weight: 700;
        border-radius: 50px;
        text-decoration: none;
        transition: all 0.3s ease;
        text-align: center;
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .btn-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 10px 30px rgba(255, 215, 0, 0.4);
    }

    .custom-cta {
        text-align: center;
        margin: 75px 0 10px;
        padding: 42px 25px;
        border: 1px solid rgba(255,215,0,0.25);
        border-radius: var(--radius-md);
        background: linear-gradient(135deg, #1a1a1a, #111);
    }

    .custom-cta h2 {
        color: var(--primary-yellow);
        text-transform: uppercase;
    }

    .custom-cta p {
        color: var(--text-muted);
        max-width: 750px;
        margin: 15px auto 28px;
    }

    @media(max-width:768px) {
        .packages-hero-title {
            font-size: 2.2rem;
        }

        .packages-hero-subtitle {
            font-size: 1rem;
        }

        .packages-grid {
            grid-template-columns: 1fr;
        }
    }


/* ===== Centralized CSS from index.php ===== */
.hero {
        min-height: 100vh;
        background:
            linear-gradient(rgba(10,10,10,0.78), rgba(10,10,10,0.94)),
            url('https://images.unsplash.com/photo-1557838923-2985c318be48?auto=format&fit=crop&w=1920&q=80');
        background-size: cover;
        background-position: center;
        display: flex;
        align-items: center;
        padding-top: 80px;
    }

    .hero-text {
        max-width: 900px;
        margin: auto;
        text-align: center;
    }

    .hero-badge {
        display: inline-block;
        padding: 8px 18px;
        border: 1px solid rgba(255,215,0,0.35);
        border-radius: 50px;
        color: var(--primary-yellow);
        margin-bottom: 22px;
        font-weight: 600;
        background: rgba(255,215,0,0.08);
    }

    .hero-title {
        font-size: 4rem;
        color: #fff;
        text-transform: uppercase;
        letter-spacing: 2px;
        line-height: 1.1;
        margin-bottom: 22px;
    }

    .hero-title .highlight {
        color: var(--primary-yellow);
    }

    .hero-subtitle {
        font-size: 1.25rem;
        color: #ddd;
        max-width: 820px;
        margin: 0 auto 35px;
    }

    .business-types {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 12px;
        margin-top: 35px;
    }

    .business-types span {
        padding: 10px 18px;
        background: rgba(255,255,255,0.08);
        border: 1px solid rgba(255,215,0,0.15);
        border-radius: 30px;
        color: #eee;
        font-weight: 500;
    }

    .quick-stats {
        background: var(--card-bg);
        padding: 80px 0;
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
        gap: 22px;
        text-align: center;
    }

    .stat-card {
        background: rgba(30,30,30,0.95);
        padding: 15px 18px;
        border-radius: var(--radius-md);
        border: 1px solid rgba(255,215,0,0.15);
        transition: 0.3s ease;
    }

    .stat-card:hover {
        transform: translateY(-8px);
        border-color: var(--primary-yellow);
        box-shadow: 0 18px 40px rgba(0,0,0,0.5);
    }

    .stat-icon {
        font-size: 1.5rem;
        color: var(--primary-yellow);
        margin-bottom: 12px;
    }

    .stat-number {
        font-size: 1.5rem;
        color: var(--primary-yellow);
        margin-bottom: 8px;
    }

    .stat-label {
        color: var(--text-muted);
        text-transform: uppercase;
        font-size: 0.9rem;
        letter-spacing: 0.8px;
    }

    .promo-strip {
        background: linear-gradient(135deg, #1b1b1b, #2d2d2d);
        padding: 70px 0;
        border-top: 3px solid var(--primary-yellow);
        border-bottom: 3px solid var(--primary-yellow);
        text-align: center;
    }

    .promo-strip h2 {
        color: var(--primary-yellow);
        font-size: 2.2rem;
        margin-bottom: 15px;
        text-transform: uppercase;
    }

    .promo-strip p {
        max-width: 900px;
        margin: 0 auto 25px;
        color: #ddd;
        font-size: 1.15rem;
    }

    .promo-points {
        display: flex;
        justify-content: center;
        flex-wrap: wrap;
        gap: 15px;
    }

    .promo-points div {
        background: rgba(255,255,255,0.07);
        border: 1px solid rgba(255,215,0,0.18);
        padding: 14px 22px;
        border-radius: var(--radius-md);
        font-weight: 600;
    }

    .featured-services {
        padding: 100px 0;
    }

    .services-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
        gap: 30px;
    }

    .service-card {
        background: var(--card-bg);
        border-radius: var(--radius-md);
        overflow: hidden;
        border: 1px solid rgba(255,215,0,0.12);
        box-shadow: 0 20px 60px rgba(0,0,0,0.65);
        transition: 0.3s ease;
    }

    .service-card:hover {
        transform: translateY(-12px);
        border-color: var(--primary-yellow);
    }

    .service-image {
        height: 220px;
        overflow: hidden;
    }

    .service-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: 0.5s ease;
    }

    .service-card:hover img {
        transform: scale(1.08);
    }

    .service-content {
        padding: 26px;
    }

    .service-title {
        color: var(--primary-yellow);
        font-size: 1.25rem;
        text-transform: uppercase;
        margin-bottom: 12px;
    }

    .service-content p {
        color: var(--text-muted);
        margin-bottom: 20px;
    }

    .btn-card {
        color: var(--primary-yellow);
        font-weight: 700;
        text-transform: uppercase;
    }

    .why-choose-us {
        background: var(--card-bg);
        padding: 100px 0;
    }

    .why-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
        gap: 30px;
        margin-top: 45px;
    }

    .why-box {
        background: rgba(30,30,30,0.95);
        padding: 35px 25px;
        border-radius: var(--radius-md);
        border: 1px solid rgba(255,215,0,0.14);
        text-align: center;
        transition: 0.3s ease;
    }

    .why-box:hover {
        transform: translateY(-8px);
        border-color: var(--primary-yellow);
    }

    .why-box i {
        font-size: 3rem;
        color: var(--primary-yellow);
        margin-bottom: 20px;
    }

    .why-box h3 {
        color: #fff;
        font-size: 1.2rem;
        margin-bottom: 12px;
    }

    .cta-section {
        text-align: center;
    }

    @media(max-width:768px) {
        .hero-title { font-size: 2.5rem; }
        .hero-subtitle { font-size: 1rem; }
        .promo-strip h2 { font-size: 1.6rem; }
    }


/* ===== Final Centralized Header / Dropdown Enhancement ===== */
body { padding-top: 78px; }
.main-header { background: rgba(5,5,5,.98); border-bottom: 1px solid rgba(255,215,0,.25); box-shadow: 0 4px 20px rgba(0,0,0,.3); position: fixed; top:0; left:0; right:0; z-index:1000; }
.logo img,.mobile-logo img{height:42px;width:auto;object-fit:contain;display:block}.mobile-logo img{height:40px}.logo span,.mobile-logo span{background:linear-gradient(135deg,#FFD700,#E6C200);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-item.has-dropdown{position:relative}.has-dropdown>a i{transition:transform .3s ease;font-size:.7rem}.has-dropdown:hover>a i{transform:rotate(180deg)}
.mega-menu-parent{position:relative}.mega-dropdown{position:absolute;top:100%;left:50%;transform:translate(-50%,12px);width:min(760px,92vw);background:#111;border:1px solid rgba(255,215,0,.25);border-radius:18px;padding:18px;box-shadow:0 20px 44px rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:all .28s ease;z-index:1000}.mega-menu-parent:hover .mega-dropdown,.mega-menu-parent:focus-within .mega-dropdown{opacity:1;visibility:visible;transform:translate(-50%,0)}.mega-dropdown-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.mega-col{padding:8px}.mega-col h4{font-size:.85rem;color:#FFD700;margin:0 0 10px;text-transform:uppercase;letter-spacing:.8px}.mega-col a{display:flex;align-items:center;gap:10px;color:#e8e8e8;padding:11px 12px;border-radius:12px;transition:all .25s ease}.mega-col a i{color:#FFD700;width:20px}.mega-col a:hover{background:rgba(255,215,0,.1);color:#FFD700;transform:translateX(4px)}
.dropdown-menu{position:absolute;top:100%;left:0;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .3s ease;z-index:1000;background:#111;border:1px solid rgba(255,215,0,.25);box-shadow:0 20px 40px rgba(0,0,0,.4);border-radius:16px;padding:8px 0;min-width:260px}.nav-item.has-dropdown:hover .dropdown-menu{opacity:1;visibility:visible;transform:translateY(0)}.dropdown-menu a{color:#e0e0e0;padding:12px 20px;display:flex;align-items:center;gap:12px;transition:all .3s ease;border-left:2px solid transparent}.dropdown-menu a i{color:#FFD700;width:24px}.dropdown-menu a:hover{background:rgba(255,215,0,.1);color:#FFD700;border-left-color:#FFD700;padding-left:24px}.btn-book-now{background:linear-gradient(135deg,#FFD700,#E6C200);color:#000!important;border-radius:50px;padding:10px 24px;font-weight:600}.btn-book-now:hover{transform:translateY(-2px);box-shadow:0 5px 20px rgba(255,215,0,.3)}
.mobile-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);backdrop-filter:blur(5px);z-index:1001;opacity:0;visibility:hidden;transition:all .3s ease}.mobile-nav-overlay.active{opacity:1;visibility:visible}.mobile-menu{position:fixed;top:0;right:-100%;width:85%;max-width:350px;height:100vh;background:#0a0a0a;z-index:1002;transition:right .35s ease;box-shadow:-5px 0 30px rgba(0,0,0,.5);border-left:1px solid rgba(255,215,0,.25);overflow-y:auto}.mobile-menu.active{right:0}.mobile-menu-content{padding:20px;display:flex;flex-direction:column;min-height:100%}.mobile-menu-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:20px;border-bottom:1px solid rgba(255,215,0,.15);margin-bottom:20px}.mobile-close{background:rgba(255,215,0,.1);width:40px;height:40px;border-radius:12px;color:#FFD700;font-size:1.2rem;display:flex;align-items:center;justify-content:center}.mobile-close:hover{background:#FFD700;color:#000}.mobile-nav-link{display:flex;align-items:center;gap:12px;color:#e0e0e0;padding:14px 16px;border-radius:14px;transition:all .3s ease;font-weight:500}.mobile-nav-link i:first-child{width:24px;color:#FFD700;font-size:1.1rem}.mobile-nav-link:hover,.mobile-nav-link.active{background:rgba(255,215,0,.1);color:#FFD700}.mobile-dropdown-toggle{justify-content:space-between;cursor:pointer}.mobile-dropdown-toggle .dropdown-arrow{transition:transform .3s ease;font-size:.8rem;margin-left:auto}.mobile-dropdown-toggle.open .dropdown-arrow{transform:rotate(180deg)}.mobile-submenu{display:none;background:rgba(255,215,0,.05);border-radius:14px;margin:5px 0 10px 20px;overflow:hidden;border:1px solid rgba(255,215,0,.1)}.mobile-submenu.show{display:block}.mobile-submenu a{display:flex;align-items:center;gap:12px;padding:12px 16px 12px 38px;color:#ccc;font-size:.86rem;transition:all .3s ease;border-left:2px solid transparent}.mobile-submenu a i{width:22px;color:#FFD700}.mobile-submenu a:hover{background:rgba(255,215,0,.1);color:#FFD700;border-left-color:#FFD700;padding-left:44px}.btn-mobile-book{background:linear-gradient(135deg,#FFD700,#E6C200);color:#000!important;justify-content:center;margin-top:10px}.btn-mobile-book i{color:#000!important}.mobile-social{display:flex;gap:15px;justify-content:center;padding-top:25px;margin-top:20px;border-top:1px solid rgba(255,215,0,.15)}.mobile-social-link{width:42px;height:42px;background:rgba(255,215,0,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#FFD700;transition:all .3s ease;font-size:1.1rem}.mobile-social-link:hover{background:#FFD700;color:#000;transform:translateY(-3px)}.hamburger{display:none;flex-direction:column;cursor:pointer;background:transparent;border:0;z-index:1001;padding:10px}.hamburger .bar{width:25px;height:2px;background:#FFD700;margin:3px 0;transition:.3s;border-radius:2px}.menu-open{overflow:hidden}
@media(max-width:992px){.nav-menu{display:none!important}.hamburger{display:flex!important}.mega-dropdown{display:none!important}}@media(max-width:768px){body{padding-top:70px}.mega-dropdown-grid{grid-template-columns:1fr}}

/* ===== Hyper Era AI Ready Update: single column service dropdown ===== */
.service-menu-parent{position:relative}.single-column-dropdown{position:absolute;top:100%;left:50%;transform:translate(-50%,12px);width:285px;background:rgba(8,8,10,.98);border:1px solid rgba(255,215,0,.28);border-radius:16px;padding:10px;box-shadow:0 22px 48px rgba(0,0,0,.48);opacity:0;visibility:hidden;transition:all .25s ease;z-index:1000}.service-menu-parent:hover .single-column-dropdown,.service-menu-parent:focus-within .single-column-dropdown{opacity:1;visibility:visible;transform:translate(-50%,0)}.single-column-dropdown a{display:flex;align-items:center;gap:12px;color:#f5f5f5;padding:12px 13px;border-radius:12px;font-weight:600;transition:all .22s ease}.single-column-dropdown a i{width:20px;color:#FFD700;text-align:center}.single-column-dropdown a:hover{background:linear-gradient(90deg,rgba(255,215,0,.14),rgba(255,255,255,.04));color:#FFD700;transform:translateX(4px)}@media(max-width:992px){.single-column-dropdown{display:none!important}}

/* ===== AI Ready Website Sections ===== */
.ai-section{padding:85px 0;background:#080808;color:#fff;position:relative;overflow:hidden}.ai-section:nth-of-type(even){background:#101010}.ai-kicker{display:inline-flex;gap:8px;align-items:center;padding:8px 14px;border:1px solid rgba(255,215,0,.35);border-radius:999px;color:#FFD700;background:rgba(255,215,0,.08);font-weight:700;margin-bottom:14px}.ai-title{font-size:clamp(2rem,4vw,3.3rem);line-height:1.1;margin:0 0 14px;color:#fff}.ai-subtitle{max-width:850px;color:#d8d8d8;font-size:1.05rem;line-height:1.8}.ai-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:38px}.ai-card{background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.1);border-radius:22px;padding:26px;box-shadow:0 18px 45px rgba(0,0,0,.28);transition:.25s ease}.ai-card:hover{transform:translateY(-7px);border-color:rgba(255,215,0,.45)}.ai-card i{width:52px;height:52px;border-radius:16px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#FFD700,#ff3b30);color:#070707;font-size:1.35rem;margin-bottom:16px}.ai-card h3{margin:0 0 10px;color:#fff;font-size:1.15rem}.ai-card p{color:#cfcfcf;line-height:1.7;margin:0}.ai-steps{counter-reset:step;display:grid;gap:16px;margin-top:34px}.ai-step{counter-increment:step;display:grid;grid-template-columns:58px 1fr;gap:16px;align-items:start;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:18px;padding:18px}.ai-step:before{content:counter(step);width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#FFD700;color:#000;font-weight:900}.ai-step h3{margin:0 0 6px;color:#fff}.ai-step p{margin:0;color:#d5d5d5;line-height:1.7}.ai-cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:28px}.sticky-whatsapp{position:fixed;right:18px;bottom:88px;z-index:999;background:#25D366;color:#fff;border-radius:999px;padding:13px 18px;font-weight:800;box-shadow:0 14px 35px rgba(37,211,102,.35);display:flex;align-items:center;gap:9px}.sticky-whatsapp:hover{color:#fff;transform:translateY(-3px)}.ai-chatbot-box{position:fixed;right:18px;bottom:22px;z-index:999;background:#111;border:1px solid rgba(255,215,0,.35);color:#fff;border-radius:18px;padding:12px 14px;box-shadow:0 14px 35px rgba(0,0,0,.4);max-width:255px}.ai-chatbot-box strong{display:block;color:#FFD700;margin-bottom:6px}.ai-chatbot-box small{color:#ddd}.faq-wrap{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:30px}.faq-item{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:18px}.faq-item h3{font-size:1rem;color:#FFD700;margin:0 0 8px}.faq-item p{margin:0;color:#ddd;line-height:1.7}.portfolio-meta{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px;margin-top:15px}.portfolio-meta span{background:rgba(255,215,0,.1);border:1px solid rgba(255,215,0,.2);border-radius:12px;padding:9px;color:#eee;font-size:.9rem}@media(max-width:600px){.ai-section{padding:58px 0}.ai-step{grid-template-columns:1fr}.sticky-whatsapp{left:12px;right:12px;justify-content:center}.ai-chatbot-box{display:none}}

/* ===== Final homepage original design restore and gap fix ===== */
html, body { margin: 0; }
body { padding-top: 60px !important; }
.main-header .navbar { height: 60px; }
.hero {
    min-height: calc(100vh - 60px) !important;
    height: auto !important;
    background:
        linear-gradient(rgba(10,10,10,0.78), rgba(10,10,10,0.94)),
        url('https://images.unsplash.com/photo-1557838923-2985c318be48?auto=format&fit=crop&w=1920&q=80') !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: scroll !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-top: 0 !important;
    margin-top: 0 !important;
    text-align: center !important;
}
.hero-text { max-width: 900px !important; margin: auto !important; text-align: center !important; }
.hero-badge { display: inline-block; padding: 8px 18px; border: 1px solid rgba(255,215,0,0.35); border-radius: 50px; color: var(--primary-yellow); margin-bottom: 22px; font-weight: 600; background: rgba(255,215,0,0.08); }
.hero-title { font-size: clamp(2.5rem, 6vw, 4rem) !important; color: #fff !important; text-transform: uppercase; letter-spacing: 2px; line-height: 1.1; margin-bottom: 22px; }
.hero-title .highlight { color: var(--primary-yellow) !important; }
.hero-subtitle { font-size: 1.25rem; color: #ddd; max-width: 820px; margin: 0 auto 35px; }
.business-types { display: flex; justify-content: center; flex-wrap: wrap; gap: 12px; margin-top: 35px; }
.business-types span { padding: 10px 18px; background: rgba(255,255,255,0.08); border: 1px solid rgba(255,215,0,0.15); border-radius: 30px; color: #eee; font-weight: 500; }
.quick-stats { background: var(--card-bg); padding: 80px 0; }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 22px; text-align: center; }
.stat-card { background: rgba(30,30,30,0.95); padding: 15px 18px; border-radius: var(--radius-md); border: 1px solid rgba(255,215,0,0.15); transition: 0.3s ease; }
.stat-card:hover { transform: translateY(-8px); border-color: var(--primary-yellow); box-shadow: 0 18px 40px rgba(0,0,0,0.5); }
.stat-icon { font-size: 1.5rem; color: var(--primary-yellow); margin-bottom: 12px; }
.stat-number { font-size: 1.5rem; color: var(--primary-yellow); margin-bottom: 8px; }
.stat-label { color: var(--text-muted); text-transform: uppercase; font-size: 0.9rem; letter-spacing: 0.8px; }
.promo-strip { background: linear-gradient(135deg, #1b1b1b, #2d2d2d); padding: 70px 0; border-top: 3px solid var(--primary-yellow); border-bottom: 3px solid var(--primary-yellow); text-align: center; }
.promo-strip h2 { color: var(--primary-yellow); font-size: 2.2rem; margin-bottom: 15px; text-transform: uppercase; }
.promo-strip p { max-width: 900px; margin: 0 auto 25px; color: #ddd; font-size: 1.15rem; }
.promo-points { display: flex; justify-content: center; flex-wrap: wrap; gap: 15px; }
.promo-points div { background: rgba(255,255,255,0.07); border: 1px solid rgba(255,215,0,0.18); padding: 14px 22px; border-radius: var(--radius-md); font-weight: 600; color:#fff; }
.why-choose-us { background: var(--card-bg); padding: 100px 0; }
.why-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 30px; margin-top: 45px; }
.why-box { background: rgba(30,30,30,0.95); padding: 35px 25px; border-radius: var(--radius-md); border: 1px solid rgba(255,215,0,0.14); text-align: center; transition: 0.3s ease; }
.why-box:hover { transform: translateY(-8px); border-color: var(--primary-yellow); }
.why-box i { font-size: 3rem; color: var(--primary-yellow); margin-bottom: 20px; }
.why-box h3 { color: #fff; font-size: 1.2rem; margin-bottom: 12px; }
.why-box p { color: var(--text-muted); }
.cta-section { text-align: center; }
/* Services dropdown: single column only */
.single-column-dropdown { display: block; grid-template-columns: 1fr !important; width: 285px !important; }
.single-column-dropdown a { width: 100%; }
@media(max-width:768px) { body { padding-top: 60px !important; } .hero { min-height: calc(100vh - 60px) !important; } .hero-subtitle { font-size: 1rem; } .promo-strip h2 { font-size: 1.6rem; } }

/* ===== Final fixes: mobile submenu + inner page design ===== */
.main-header + .inner-page,
.main-header + .legal-page,
.main-header + .about-page { margin-top: 0; }

.mobile-dropdown-toggle { cursor: pointer; user-select: none; }
.mobile-submenu { display: none; }
.mobile-submenu.show { display: block !important; }
.mobile-nav-link.mobile-dropdown-toggle { width: 100%; }

.service-dropdown.single-column-dropdown {
    width: 280px;
    grid-template-columns: 1fr !important;
}
.service-dropdown.single-column-dropdown a { white-space: nowrap; }

.inner-hero {
    position: relative;
    padding: 72px 0 38px;
    text-align: center;
    background: radial-gradient(circle at top left, rgba(255,215,0,.16), transparent 32%), radial-gradient(circle at bottom right, rgba(159,18,57,.16), transparent 36%), var(--gradient-bg);
    overflow: hidden;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
.inner-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px), linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px);
    background-size: 42px 42px;
    opacity: .25;
}
.inner-hero .container { position: relative; z-index: 1; }
.inner-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 9px 16px;
    border-radius: 50px;
    background: rgba(255,215,0,.12);
    border: 1px solid rgba(255,215,0,.28);
    color: var(--primary-yellow);
    font-weight: 700;
    font-size: .86rem;
    letter-spacing: .5px;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.inner-title {
    font-size: clamp(2.2rem, 5vw, 4.5rem);
    color: #fff;
    margin-bottom: 16px;
    text-transform: uppercase;
}
.inner-subtitle {
    max-width: 820px;
    color: var(--text-muted);
    font-size: 1.05rem;
    margin: 0 auto;
}

.content-page {
    padding: 60px 0;
    background: var(--dark-bg);
}
.content-grid {
    display: grid;
    grid-template-columns: 280px 1fr;
    gap: 28px;
    align-items: start;
}
.content-card,
.side-card,
.value-card,
.process-card {
    background: linear-gradient(145deg, rgba(26,26,26,.98), rgba(16,16,16,.98));
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-lg);
}
.side-card { padding: 22px; position: sticky; top: 96px; }
.side-card h3 { color: #fff; font-size: 1.1rem; margin-bottom: 14px; }
.side-card a {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--text-muted);
    padding: 10px 0;
    border-bottom: 1px solid rgba(255,255,255,.06);
    font-size: .95rem;
}
.side-card a:last-child { border-bottom: 0; }
.side-card a:hover { color: var(--primary-yellow); }
.content-card { padding: 34px; margin-bottom: 24px; }
.content-card h2 { color: #fff; font-size: 1.65rem; margin-bottom: 16px; }
.content-card h3 { color: var(--primary-yellow); font-size: 1.15rem; margin: 20px 0 10px; }
.content-card p,
.content-card li { color: var(--text-muted); line-height: 1.85; }
.content-card ul { list-style: none; margin: 14px 0 0; }
.content-card li { position: relative; padding-left: 26px; margin-bottom: 10px; }
.content-card li::before {
    content: '\f00c';
    font-family: 'Font Awesome 6 Free';
    font-weight: 900;
    position: absolute;
    left: 0;
    top: 2px;
    color: var(--primary-yellow);
    font-size: .85rem;
}
.notice-box {
    padding: 18px 20px;
    border-radius: 16px;
    background: rgba(255,215,0,.09);
    border: 1px solid rgba(255,215,0,.22);
    color: #f4e9a3;
    margin: 20px 0;
}
.value-grid,
.process-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
}
.value-card,
.process-card { padding: 24px; }
.value-card i,
.process-card i { color: var(--primary-yellow); font-size: 2rem; margin-bottom: 16px; }
.value-card h3,
.process-card h3 { color: #fff; font-size: 1.1rem; margin-bottom: 10px; }
.value-card p,
.process-card p { color: var(--text-muted); margin-bottom: 0; }
.cta-strip {
    margin-top: 30px;
    padding: 30px;
    border-radius: var(--radius-xl);
    background: var(--gradient-primary);
    color: #111;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
}
.cta-strip h2 { color: #111; margin-bottom: 6px; }
.cta-strip p { color: #1c1c1c; margin-bottom: 0; }
.cta-strip .btn { background: #111; color: #fff; box-shadow: none; }

@media (max-width: 992px) {
    .content-grid { grid-template-columns: 1fr; }
    .side-card { position: static; }
    .value-grid,
    .process-grid { grid-template-columns: 1fr; }
    .cta-strip { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 768px) {
    .inner-hero { padding: 58px 0 30px; text-align: center; }
    .content-page { padding: 34px 0; }
    .content-card { padding: 22px; }
}


/* Compact centered inner page hero for Privacy, Terms and About */
.legal-page .inner-hero,
.about-page .inner-hero {
    padding-top: 70px;
    padding-bottom: 36px;
    text-align: center;
}
.legal-page .inner-badge,
.about-page .inner-badge {
    margin-left: auto;
    margin-right: auto;
}
.legal-page .inner-title,
.about-page .inner-title {
    font-size: clamp(2rem, 4.2vw, 3.4rem);
    margin-bottom: 10px;
}
@media (max-width: 768px) {
    .legal-page .inner-hero,
    .about-page .inner-hero {
        padding-top: 52px;
        padding-bottom: 28px;
    }
}

/* =========================================================
   HYPER ERA FINAL NAVIGATION + FONT UPDATE
   Added to keep original design but improve readability,
   Services dropdown, mobile submenu, and whole-site typography.
   ========================================================= */
:root {
    --font-main: "Segoe UI", "Inter", "Roboto", "Helvetica Neue", Arial, sans-serif;
    --font-heading: "Segoe UI", "Inter", "Roboto", "Helvetica Neue", Arial, sans-serif;
    --nav-surface: rgba(12, 12, 12, 0.98);
    --nav-border: rgba(255, 215, 0, 0.22);
    --nav-glow: 0 22px 55px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 215, 0, 0.08);
}

html, body,
button, input, textarea, select,
.nav-link, .mobile-nav-link,
.footer, .footer *, .service-card, .service-card *, .page-content, .page-content * {
    font-family: var(--font-main) !important;
    letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6,
.logo span, .mobile-logo span,
.section-title, .hero-title, .page-title h1 {
    font-family: var(--font-heading) !important;
    letter-spacing: -0.035em;
}

/* Desktop Services dropdown: clean single-column premium menu */
.service-menu-parent {
    position: relative !important;
}

.service-menu-parent > .nav-link {
    position: relative;
    padding: 10px 0;
}

.service-menu-parent > .nav-link i {
    font-size: 0.78rem;
    transition: transform 0.25s ease, color 0.25s ease;
}

.service-menu-parent:hover > .nav-link i,
.service-menu-parent:focus-within > .nav-link i {
    transform: rotate(180deg);
    color: #FFD700;
}

.service-dropdown.single-column-dropdown {
    position: absolute !important;
    top: calc(100% + 14px) !important;
    left: 50% !important;
    width: 285px !important;
    min-width: 285px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    padding: 12px !important;
    margin: 0 !important;
    background: linear-gradient(180deg, rgba(22,22,22,0.99), rgba(8,8,8,0.99)) !important;
    border: 1px solid var(--nav-border) !important;
    border-radius: 18px !important;
    box-shadow: var(--nav-glow) !important;
    backdrop-filter: blur(14px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate(-50%, 12px) scale(0.98) !important;
    transform-origin: top center !important;
    transition: opacity 0.22s ease, visibility 0.22s ease, transform 0.22s ease !important;
    z-index: 9999 !important;
}

.service-dropdown.single-column-dropdown::before {
    content: "";
    position: absolute;
    top: -8px;
    left: 50%;
    width: 14px;
    height: 14px;
    background: rgba(22, 22, 22, 0.99);
    border-left: 1px solid var(--nav-border);
    border-top: 1px solid var(--nav-border);
    transform: translateX(-50%) rotate(45deg);
}

.service-dropdown.single-column-dropdown::after {
    content: "Services";
    display: block;
    order: -1;
    padding: 7px 10px 10px;
    margin-bottom: 4px;
    color: #FFD700;
    font-size: 0.72rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    border-bottom: 1px solid rgba(255, 215, 0, 0.14);
}

.service-menu-parent:hover .service-dropdown.single-column-dropdown,
.service-menu-parent:focus-within .service-dropdown.single-column-dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, 0) scale(1) !important;
}

.service-dropdown.single-column-dropdown a {
    width: 100% !important;
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 12px 13px !important;
    color: #f1f1f1 !important;
    font-size: 0.94rem !important;
    font-weight: 650 !important;
    line-height: 1.2 !important;
    border-radius: 13px !important;
    border: 1px solid transparent !important;
    background: transparent !important;
    transition: transform 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease !important;
}

.service-dropdown.single-column-dropdown a i {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #0b0b0b !important;
    background: linear-gradient(135deg, #FFD700, #FF9F1C) !important;
    border-radius: 10px !important;
    font-size: 0.95rem !important;
    box-shadow: 0 8px 20px rgba(255, 159, 28, 0.18) !important;
}

.service-dropdown.single-column-dropdown a span {
    display: block !important;
    white-space: nowrap !important;
}

.service-dropdown.single-column-dropdown a:hover,
.service-dropdown.single-column-dropdown a:focus {
    color: #FFD700 !important;
    background: rgba(255, 215, 0, 0.10) !important;
    border-color: rgba(255, 215, 0, 0.22) !important;
    transform: translateX(5px) !important;
    outline: none !important;
}

/* Mobile services submenu: working single column list */
@media (max-width: 992px) {
    .service-dropdown.single-column-dropdown {
        display: none !important;
    }

    .mobile-submenu {
        margin: 8px 0 14px 12px !important;
        padding: 8px !important;
        border-radius: 18px !important;
        background: linear-gradient(180deg, rgba(255, 215, 0, 0.055), rgba(255, 255, 255, 0.025)) !important;
        border: 1px solid rgba(255, 215, 0, 0.14) !important;
    }

    .mobile-submenu.show {
        display: flex !important;
        flex-direction: column !important;
        gap: 5px !important;
    }

    .mobile-submenu a {
        display: flex !important;
        align-items: center !important;
        gap: 12px !important;
        padding: 12px 13px !important;
        border-radius: 13px !important;
        color: #f1f1f1 !important;
        font-weight: 650 !important;
        font-size: 0.94rem !important;
        border-left: 0 !important;
    }

    .mobile-submenu a i {
        width: 32px !important;
        height: 32px !important;
        min-width: 32px !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        border-radius: 10px !important;
        color: #111 !important;
        background: linear-gradient(135deg, #FFD700, #FF9F1C) !important;
    }

    .mobile-submenu a:hover,
    .mobile-submenu a:focus {
        background: rgba(255, 215, 0, 0.11) !important;
        color: #FFD700 !important;
        padding-left: 13px !important;
        outline: none !important;
    }
}


/* ===== Final fix: Services dropdown working on desktop + mobile ===== */
.service-menu-parent { position: relative !important; }
.service-desktop-toggle {
    border: 0 !important;
    background: transparent !important;
    cursor: pointer !important;
    font: inherit !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    color: #FFD700 !important;
    text-transform: uppercase !important;
}
.service-desktop-toggle::after { display: none !important; }
.service-menu-parent::after {
    content: "";
    position: absolute;
    left: -18px;
    right: -18px;
    top: 100%;
    height: 18px;
    display: block;
}
.service-dropdown.single-column-dropdown {
    top: calc(100% + 8px) !important;
    left: 50% !important;
    width: 300px !important;
    min-width: 300px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translate(-50%, 8px) scale(.98) !important;
    z-index: 10050 !important;
}
.service-menu-parent:hover > .service-dropdown.single-column-dropdown,
.service-menu-parent:focus-within > .service-dropdown.single-column-dropdown,
.service-menu-parent.dropdown-open > .service-dropdown.single-column-dropdown {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translate(-50%, 0) scale(1) !important;
}
.service-menu-parent.dropdown-open > .service-desktop-toggle i,
.service-menu-parent:hover > .service-desktop-toggle i,
.service-menu-parent:focus-within > .service-desktop-toggle i {
    transform: rotate(180deg) !important;
}
.service-dropdown.single-column-dropdown a {
    display: flex !important;
    width: 100% !important;
    align-items: center !important;
    justify-content: flex-start !important;
    text-align: left !important;
    text-decoration: none !important;
}
@media (max-width: 992px) {
    .nav-menu { display: none !important; }
    .hamburger { display: flex !important; }
    .service-dropdown.single-column-dropdown { display: none !important; }
    .mobile-dropdown-toggle {
        width: 100% !important;
        user-select: none !important;
        -webkit-tap-highlight-color: transparent !important;
    }
    .mobile-dropdown-toggle.open {
        background: rgba(255, 215, 0, 0.12) !important;
        color: #FFD700 !important;
    }
    .mobile-submenu { display: none !important; }
    .mobile-submenu.show {
        display: flex !important;
        flex-direction: column !important;
        gap: 6px !important;
        max-height: 600px !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
}


/* ===== Mobile Services dropdown final fix ===== */
.mobile-dropdown-toggle {
    border: 0;
    outline: 0;
    font-family: inherit;
    text-align: left;
}
.mobile-link-left {
    display: inline-flex;
    align-items: center;
    gap: 14px;
}
.mobile-link-left i {
    width: 26px;
    color: #FFD700;
    font-size: 1.1rem;
}
@media (max-width: 992px) {
    .mobile-submenu { display: none !important; }
    .mobile-submenu.show {
        display: flex !important;
        flex-direction: column !important;
    }
    .mobile-dropdown-toggle.open .dropdown-arrow {
        transform: rotate(180deg) !important;
    }
}


/* =========================================================
   Hyper Era Update: Compact Services Dropdown + Experience Fix
   ========================================================= */

/* Desktop services dropdown: less padding, less margin, neat compact look */
.service-dropdown.single-column-dropdown,
.single-column-dropdown {
    width: 255px !important;
    padding: 6px !important;
    border-radius: 12px !important;
    gap: 0 !important;
}

.single-column-dropdown a,
.service-dropdown.single-column-dropdown a {
    padding: 8px 10px !important;
    margin: 2px 0 !important;
    gap: 8px !important;
    border-radius: 8px !important;
    font-size: 0.92rem !important;
    line-height: 1.25 !important;
}

.single-column-dropdown a i,
.service-dropdown.single-column-dropdown a i {
    width: 18px !important;
    font-size: 0.92rem !important;
}

/* Mobile services expand: compact spacing */
.mobile-dropdown-item {
    margin: 0 !important;
}

.mobile-nav-link.mobile-dropdown-toggle {
    padding: 10px 14px !important;
    margin-bottom: 2px !important;
}

.mobile-submenu {
    margin: 3px 0 5px 12px !important;
    padding: 4px 0 4px 10px !important;
    border-left: 2px solid rgba(255, 215, 0, 0.35) !important;
}

.mobile-submenu a {
    padding: 8px 10px !important;
    margin: 1px 0 !important;
    gap: 8px !important;
    border-radius: 8px !important;
    font-size: 0.9rem !important;
    line-height: 1.25 !important;
}

.mobile-submenu a i {
    width: 17px !important;
    font-size: 0.9rem !important;
}

/* Experience Facebook Journey visibility fix:
   Earlier cards were hidden until JS added .visible; this fallback keeps content visible. */
.facebook-journey-section .journey-item {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

.facebook-journey-section {
    display: block !important;
    visibility: visible !important;
}

.facebook-post-card,
.fb-post-img,
.fb-post-content,
.fb-post-header {
    visibility: visible !important;
}

/* Better mobile layout for Facebook Journey */
@media (max-width: 768px) {
    .service-dropdown.single-column-dropdown,
    .single-column-dropdown {
        width: 100% !important;
    }

    .facebook-journey-section {
        padding: 34px 0 !important;
        border-radius: 20px !important;
        margin: 32px 0 !important;
    }

    .facebook-journey-section .section-header {
        margin-bottom: 22px !important;
    }

    .journey-timeline::before {
        left: 18px !important;
    }

    .journey-item {
        gap: 8px !important;
        margin-bottom: 26px !important;
    }

    .journey-year {
        font-size: 1.35rem !important;
        padding-left: 36px !important;
        margin-bottom: 4px !important;
    }

    .journey-year::after {
        left: 10px !important;
        width: 14px !important;
        height: 14px !important;
    }

    .facebook-post-card {
        margin-left: 34px !important;
        border-radius: 16px !important;
    }

    .fb-post-header {
        padding: 12px 14px !important;
        gap: 10px !important;
    }

    .fb-avatar {
        width: 42px !important;
        height: 42px !important;
        font-size: 1.2rem !important;
    }

    .fb-post-content {
        padding: 14px !important;
    }

    .fb-post-text {
        font-size: 0.92rem !important;
        line-height: 1.55 !important;
    }

    .fb-post-stats {
        padding: 10px 14px !important;
        gap: 14px !important;
        flex-wrap: wrap !important;
    }

    .fb-post-link {
        padding: 12px 14px !important;
        font-size: 0.9rem !important;
    }
}


/* =========================================================
   HYPER ERA FULL LIGHT THEME UPDATE
   Clean white/red/black professional theme. Dark theme removed.
   ========================================================= */
:root{
    --primary-yellow:#9f1239 !important;
    --primary-orange:#b91c1c !important;
    --primary-red:#9f1239 !important;
    --secondary-red:#7f1d1d !important;
    --dark-bg:#ffffff !important;
    --card-bg:#ffffff !important;
    --text-light:#111827 !important;
    --text-muted:#5b6472 !important;
    --gradient-primary:linear-gradient(135deg,#9f1239 0%,#b91c1c 100%) !important;
    --gradient-red:linear-gradient(135deg,#9f1239 0%,#7f1d1d 100%) !important;
    --gradient-bg:linear-gradient(135deg,#ffffff 0%,#f8fafc 100%) !important;
    --shadow-sm:0 2px 10px rgba(17,24,39,.06) !important;
    --shadow-md:0 8px 24px rgba(17,24,39,.08) !important;
    --shadow-lg:0 18px 45px rgba(17,24,39,.12) !important;
    --shadow-xl:0 24px 70px rgba(17,24,39,.15) !important;
}
html,body{background:#ffffff !important;color:#111827 !important;}
body{background-image:linear-gradient(180deg,#ffffff 0%,#f8fafc 45%,#ffffff 100%) !important;}
section{background-color:#ffffff;color:#111827;}
p,.section-subtitle,.card-description,.feature-description,.stat-label,.company-description,.footer-links a,.contact-item,.copyright,.legal-links a{color:#5b6472 !important;}
h1,h2,h3,h4,h5,h6,.section-title{color:#111827 !important;}
.highlight,.section-title .highlight{color:#9f1239 !important;}

/* Header - Light Premium */
.main-header,.main-header.scrolled{background:rgba(255,255,255,.96) !important;border-bottom:1px solid rgba(159,18,57,.12) !important;box-shadow:0 8px 30px rgba(17,24,39,.08) !important;backdrop-filter:blur(14px) !important;-webkit-backdrop-filter:blur(14px) !important;}
.logo span,.mobile-logo span{background:none !important;-webkit-background-clip:initial !important;background-clip:initial !important;-webkit-text-fill-color:#9f1239 !important;color:#9f1239 !important;font-weight:900 !important;}
.nav-link{color:#111827 !important;}
.nav-link:hover,.nav-link.active{color:#9f1239 !important;}
.nav-link::after,.nav-link.active::after{background:#9f1239 !important;}
.btn-book-now,.btn-mobile-book{background:linear-gradient(135deg,#9f1239,#7f1d1d) !important;color:#fff !important;box-shadow:0 8px 24px rgba(159,18,57,.22) !important;}
.btn-book-now:hover,.btn-mobile-book:hover{box-shadow:0 12px 30px rgba(159,18,57,.28) !important;}
.hamburger .bar{background:#9f1239 !important;}

/* Desktop Services Dropdown */
.service-dropdown.single-column-dropdown,.single-column-dropdown,.dropdown-menu,.mega-dropdown{background:#ffffff !important;border:1px solid rgba(159,18,57,.16) !important;box-shadow:0 22px 55px rgba(17,24,39,.15) !important;}
.service-dropdown.single-column-dropdown::before{background:#fff !important;border-left:1px solid rgba(159,18,57,.16) !important;border-top:1px solid rgba(159,18,57,.16) !important;}
.service-dropdown.single-column-dropdown::after{display:none !important;}
.service-dropdown.single-column-dropdown a,.single-column-dropdown a,.dropdown-menu a,.mega-dropdown a{color:#111827 !important;background:transparent !important;}
.service-dropdown.single-column-dropdown a i,.single-column-dropdown a i,.dropdown-menu a i,.mega-dropdown a i{color:#9f1239 !important;}
.service-dropdown.single-column-dropdown a:hover,.service-dropdown.single-column-dropdown a:focus,.single-column-dropdown a:hover,.dropdown-menu a:hover,.mega-dropdown a:hover{background:#fff5f5 !important;color:#9f1239 !important;}

/* Mobile Menu - Light */
.mobile-nav-overlay{background:rgba(17,24,39,.42) !important;}
.mobile-menu{background:#ffffff !important;border-left:1px solid rgba(159,18,57,.14) !important;box-shadow:-10px 0 40px rgba(17,24,39,.18) !important;}
.mobile-menu-header{border-bottom:1px solid rgba(159,18,57,.12) !important;}
.mobile-close{background:#fff5f5 !important;color:#9f1239 !important;}
.mobile-close:hover{background:#9f1239 !important;color:#fff !important;}
.mobile-nav-link{color:#111827 !important;background:transparent !important;}
.mobile-nav-link i:first-child,.mobile-nav-link i,.mobile-submenu a i{color:#9f1239 !important;}
.mobile-nav-link:hover,.mobile-nav-link.active,.mobile-dropdown-toggle.open{background:#fff5f5 !important;color:#9f1239 !important;}
.mobile-submenu{background:#fff7f7 !important;border:1px solid rgba(159,18,57,.14) !important;border-left:2px solid rgba(159,18,57,.35) !important;}
.mobile-submenu a{color:#374151 !important;background:transparent !important;}
.mobile-submenu a:hover,.mobile-submenu a:focus{background:#fff5f5 !important;color:#9f1239 !important;border-left-color:#9f1239 !important;}
.mobile-social{border-top:1px solid rgba(159,18,57,.12) !important;}
.mobile-social-link{background:#fff5f5 !important;color:#9f1239 !important;}
.mobile-social-link:hover{background:#9f1239 !important;color:#fff !important;}

/* Main hero and CTA */
.hero{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,241,242,.9)),url('https://images.unsplash.com/photo-1469474968028-56623f02e42e?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80') !important;background-size:cover !important;background-position:center !important;}
.hero-overlay{background:radial-gradient(circle at 20% 20%,rgba(159,18,57,.12),transparent 45%),radial-gradient(circle at 80% 80%,rgba(255,107,53,.10),transparent 45%) !important;}
.hero-title{color:#111827 !important;text-shadow:none !important;}
.hero-title .highlight{color:#9f1239 !important;}
.hero-title .highlight::after{background:rgba(159,18,57,.16) !important;}
.hero-subtitle{color:#374151 !important;}
.cta-section{background:linear-gradient(135deg,rgba(255,255,255,.92),rgba(255,247,247,.9)),url('https://images.unsplash.com/photo-1520250497591-112f2f40a3f4?ixlib=rb-4.0.3&auto=format&fit=crop&w=1920&q=80') !important;background-size:cover !important;background-position:center !important;}
.cta-title{color:#111827 !important;}.cta-subtitle{color:#5b6472 !important;}
.cta-section::before{background:radial-gradient(circle at center,rgba(159,18,57,.10) 0%,transparent 70%) !important;}

/* Buttons */
.btn,.btn-primary,.submit-btn{background:linear-gradient(135deg,#9f1239,#7f1d1d) !important;color:#fff !important;box-shadow:0 10px 26px rgba(159,18,57,.22) !important;}
.btn::before{background:linear-gradient(135deg,#111827,#374151) !important;}
.btn-outline{background:#fff !important;border:2px solid #9f1239 !important;color:#9f1239 !important;box-shadow:none !important;}
.btn-outline:hover{background:#9f1239 !important;color:#fff !important;}

/* Cards/Sections */
.quick-stats,.service-areas,.locations-section,.exp-showcase,.milestone-timeline{background:#f8fafc !important;}
.stat-card,.destination-card,.feature-card,.contact-info-card,.contact-form-card,.term-section,.area-card,.location-badge,.legal-notice,.exp-card,.milestone-content{background:#ffffff !important;border:1px solid rgba(17,24,39,.08) !important;box-shadow:0 14px 38px rgba(17,24,39,.08) !important;color:#111827 !important;}
.stat-card:hover,.destination-card:hover,.feature-card:hover,.contact-info-card:hover,.contact-form-card:hover,.term-section:hover,.area-card:hover,.exp-card:hover{border-color:rgba(159,18,57,.24) !important;box-shadow:0 20px 50px rgba(17,24,39,.12) !important;background:#ffffff !important;}
.stat-icon,.feature-icon,.area-icon,.info-item i,.back-to-top{background:linear-gradient(135deg,#9f1239,#7f1d1d) !important;color:#fff !important;}
.stat-number,.card-title,.feature-title,.info-title,.form-title,.area-card h3,.locations-content h2,.section-header h2,.milestone-year,.counter-number,.counter-label{color:#9f1239 !important;background:none !important;-webkit-text-fill-color:#9f1239 !important;}
.card-overlay{background:rgba(17,24,39,.55) !important;}
.card-footer{border-top:1px solid rgba(17,24,39,.08) !important;}
.currency,.amount,.area-link,.fb-hashtags{color:#9f1239 !important;}

/* Forms */
.form-group input,.form-group select,.form-group textarea,input,select,textarea{background:#ffffff !important;border:1px solid rgba(17,24,39,.16) !important;color:#111827 !important;}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus,input:focus,select:focus,textarea:focus{border-color:#9f1239 !important;box-shadow:0 0 0 4px rgba(159,18,57,.10) !important;outline:none !important;}
.form-group input::placeholder,.form-group textarea::placeholder{color:#9ca3af !important;}

/* Tables/legal */
.privacy-table th{background:#fff5f5 !important;color:#9f1239 !important;}.privacy-table td{background:#ffffff !important;color:#374151 !important;border-color:rgba(17,24,39,.08) !important;}
.hero-radial,.contact-hero{background:linear-gradient(135deg,rgba(255,255,255,.93),rgba(255,241,242,.92)) !important;border-bottom:1px solid rgba(159,18,57,.14) !important;}
.hero-radial::before,.hero-radial::after,.contact-hero::before,.contact-hero::after{background:rgba(159,18,57,.08) !important;}
.contact-hero-title{color:#9f1239 !important;}.contact-hero-subtitle{color:#5b6472 !important;}

/* Footer - light professional */
.main-footer{background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;border-top:1px solid rgba(17,24,39,.08) !important;box-shadow:0 -12px 40px rgba(17,24,39,.05) !important;}
.main-footer::before,.footer-heading::after{background:linear-gradient(90deg,#9f1239,#b91c1c) !important;}
.footer-logo,.footer-heading,.footer-brand-text span{color:#111827 !important;}
.footer-brand-text small{color:#9f1239 !important;}
.footer-brand-icon,.footer-logo img{background:#fff !important;border:1px solid rgba(159,18,57,.12) !important;box-shadow:0 10px 25px rgba(159,18,57,.12) !important;}
.social-icon{background:#fff5f5 !important;border:1px solid rgba(159,18,57,.12) !important;color:#9f1239 !important;}
.social-icon:hover{background:#9f1239 !important;color:#fff !important;border-color:#9f1239 !important;}
.contact-item i{color:#9f1239 !important;}.footer-bottom{border-top:1px solid rgba(17,24,39,.08) !important;}
.legal-links a:hover,.footer-links a:hover{color:#9f1239 !important;}
.separator{color:#cbd5e1 !important;}

/* Floating social/location */
.floating-social a{background:#ffffff !important;border:1px solid rgba(159,18,57,.16) !important;color:#9f1239 !important;box-shadow:0 8px 18px rgba(17,24,39,.08) !important;}
.floating-social a:hover{background:#9f1239 !important;color:#fff !important;}
.location-badge:hover{border-color:#9f1239 !important;color:#9f1239 !important;}
.status-active{background:#fff5f5 !important;color:#9f1239 !important;}.status-coming{background:#f1f5f9 !important;color:#64748b !important;}

/* Make old yellow accents red throughout common components */
[style*="#FFD700"],[style*="#ffd700"]{border-color:rgba(159,18,57,.18);}
@media(max-width:768px){
    .main-header{background:#ffffff !important;}
    .mobile-menu{max-width:340px !important;}
    .footer-main{border:0 !important;}
    .company-section{border-bottom:1px solid rgba(17,24,39,.08) !important;}
}

/* =========================================================
   FINAL LIGHT THEME SECTION FIXES - HERO IMAGE, PROMO, WHY CHOOSE
   ========================================================= */
:root{
    --he-red:#9f1239;
    --he-red-dark:#7f1d1d;
    --he-orange:#b91c1c;
    --he-black:#111827;
    --he-text:#374151;
    --he-muted:#64748b;
    --he-bg:#ffffff;
    --he-soft:#f8fafc;
    --he-soft-red:#fff5f5;
    --he-border:rgba(17,24,39,.09);
    --he-red-border:rgba(159,18,57,.18);
}

/* Common light visibility for all pages */
body,
section,
.main-content{
    background-color:var(--he-bg) !important;
    color:var(--he-black) !important;
}
.section-title,
.section-header h2,
h1,h2,h3,h4,h5,h6{
    color:var(--he-black) !important;
    text-shadow:none !important;
}
p,
.section-subtitle,
.card-description,
.feature-description,
.service-card p,
.why-box p,
.stat-label{
    color:var(--he-text) !important;
}
.highlight,
.section-title .highlight{
    color:var(--he-red) !important;
    -webkit-text-fill-color:var(--he-red) !important;
}

/* Home hero with image */
.home-business-hero{
    min-height:calc(100vh - 80px) !important;
    height:auto !important;
    padding:130px 0 80px !important;
    background:
        radial-gradient(circle at 10% 15%, rgba(159,18,57,.12), transparent 32%),
        radial-gradient(circle at 90% 80%, rgba(255,107,53,.10), transparent 35%),
        linear-gradient(135deg,#ffffff 0%,#fff7f7 48%,#f8fafc 100%) !important;
    background-attachment:scroll !important;
    overflow:hidden;
}
.hero-layout{
    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
    align-items:center;
    gap:55px;
    width:100%;
}
.home-business-hero .hero-text{
    max-width:680px !important;
    text-align:left !important;
    margin:0 !important;
}
.hero-badge{
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:10px 18px;
    margin-bottom:20px;
    border-radius:999px;
    background:#fff;
    border:1px solid var(--he-red-border);
    color:var(--he-red);
    box-shadow:0 10px 28px rgba(159,18,57,.10);
    font-size:.9rem;
    font-weight:700;
}
.home-business-hero .hero-title{
    color:var(--he-black) !important;
    font-size:clamp(2.35rem,4.5vw,4.8rem) !important;
    line-height:1.05 !important;
    letter-spacing:-1.2px !important;
    text-transform:none !important;
    margin-bottom:18px !important;
}
.home-business-hero .hero-subtitle{
    max-width:650px !important;
    margin-left:0 !important;
    margin-right:0 !important;
    margin-bottom:28px !important;
    color:var(--he-text) !important;
    font-size:1.12rem !important;
}
.home-business-hero .hero-btns{
    justify-content:flex-start !important;
    gap:14px !important;
}
.btn-secondary,
.home-business-hero .btn-secondary{
    background:#ffffff !important;
    color:var(--he-red) !important;
    border:2px solid var(--he-red) !important;
    box-shadow:0 10px 22px rgba(17,24,39,.07) !important;
}
.btn-secondary:hover,
.home-business-hero .btn-secondary:hover{
    background:var(--he-red) !important;
    color:#ffffff !important;
    transform:translateY(-2px);
}
.home-business-hero .business-types{
    justify-content:flex-start !important;
    margin-top:28px !important;
    gap:10px !important;
}
.home-business-hero .business-types span,
.business-types span{
    background:#ffffff !important;
    color:var(--he-black) !important;
    border:1px solid var(--he-red-border) !important;
    box-shadow:0 8px 20px rgba(17,24,39,.06) !important;
}
.hero-visual{
    position:relative;
    min-height:420px;
}
.hero-image-card{
    position:relative;
    border-radius:30px;
    overflow:hidden;
    background:#fff;
    border:1px solid rgba(159,18,57,.16);
    box-shadow:0 30px 75px rgba(17,24,39,.16);
    transform:rotate(1deg);
}
.hero-image-card::before{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 45%,rgba(17,24,39,.45));
    z-index:1;
}
.hero-image-card img{
    width:100%;
    height:470px;
    object-fit:cover;
    display:block;
}
.hero-image-badge{
    position:absolute;
    z-index:2;
    display:flex;
    align-items:center;
    gap:9px;
    padding:12px 16px;
    border-radius:16px;
    background:rgba(255,255,255,.94);
    color:var(--he-black);
    border:1px solid rgba(255,255,255,.7);
    box-shadow:0 14px 32px rgba(17,24,39,.16);
    font-weight:800;
    backdrop-filter:blur(10px);
}
.hero-image-badge i{color:var(--he-red);}
.top-badge{top:22px;left:22px;}
.bottom-badge{right:22px;bottom:22px;}

/* Complete Digital Marketing & Promotion - light professional */
.promo-strip{
    background:
        radial-gradient(circle at top left, rgba(159,18,57,.10), transparent 32%),
        linear-gradient(135deg,#ffffff 0%,#fff5f5 50%,#f8fafc 100%) !important;
    color:var(--he-black) !important;
    border-top:1px solid var(--he-red-border) !important;
    border-bottom:1px solid var(--he-red-border) !important;
    padding:78px 0 !important;
    text-align:center !important;
}
.promo-strip h2{
    color:var(--he-black) !important;
    -webkit-text-fill-color:var(--he-black) !important;
    font-size:clamp(1.8rem,3vw,2.8rem) !important;
    text-transform:none !important;
    margin-bottom:15px !important;
}
.promo-strip h2::after,
.promo-strip .section-title::after{
    background:linear-gradient(90deg,var(--he-red),var(--he-orange)) !important;
}
.promo-strip p{
    max-width:900px !important;
    color:var(--he-text) !important;
    font-size:1.08rem !important;
    line-height:1.8 !important;
}
.promo-points{
    display:grid !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:16px !important;
    margin-top:30px !important;
}
.promo-points div{
    background:#ffffff !important;
    color:var(--he-black) !important;
    border:1px solid var(--he-red-border) !important;
    border-radius:18px !important;
    padding:18px 16px !important;
    font-weight:800 !important;
    box-shadow:0 14px 35px rgba(17,24,39,.08) !important;
    transition:.25s ease !important;
}
.promo-points div:hover{
    transform:translateY(-6px);
    border-color:rgba(159,18,57,.34) !important;
    box-shadow:0 20px 45px rgba(17,24,39,.12) !important;
}

/* Why choose section - remove dark cards and fix text visibility */
.why-choose-us{
    background:var(--he-bg) !important;
    padding:90px 0 !important;
    color:var(--he-black) !important;
}
.why-grid{
    display:grid !important;
    grid-template-columns:repeat(auto-fit,minmax(250px,1fr)) !important;
    gap:24px !important;
    margin-top:42px !important;
}
.why-box{
    background:#ffffff !important;
    color:var(--he-black) !important;
    border:1px solid var(--he-border) !important;
    border-radius:22px !important;
    padding:32px 24px !important;
    text-align:center !important;
    box-shadow:0 16px 40px rgba(17,24,39,.08) !important;
    position:relative;
    overflow:hidden;
}
.why-box::before{
    content:'';
    position:absolute;
    inset:0 0 auto 0;
    height:5px;
    background:linear-gradient(90deg,var(--he-red),var(--he-orange));
}
.why-box:hover{
    transform:translateY(-8px) !important;
    border-color:var(--he-red-border) !important;
    box-shadow:0 24px 55px rgba(17,24,39,.13) !important;
}
.why-box i{
    width:76px;
    height:76px;
    border-radius:22px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:var(--he-soft-red) !important;
    color:var(--he-red) !important;
    font-size:2.2rem !important;
    margin-bottom:20px !important;
}
.why-box h3{
    color:var(--he-black) !important;
    font-size:1.25rem !important;
    margin-bottom:12px !important;
}
.why-box p{
    color:var(--he-text) !important;
    margin-bottom:0 !important;
}

/* Force old dark section/card leftovers across service pages to light */
.service-card,
.feature-card,
.area-card,
.stat-card,
.exp-card,
.facebook-post-card,
.milestone-content,
.contact-info-card,
.contact-form-card,
.package-card,
.pricing-card,
.term-section,
.policy-card,
.info-card{
    background:#ffffff !important;
    color:var(--he-black) !important;
    border-color:var(--he-border) !important;
    box-shadow:0 14px 38px rgba(17,24,39,.08) !important;
}
.service-card h3,
.feature-card h3,
.area-card h3,
.stat-card h3,
.exp-card h3,
.package-card h3,
.pricing-card h3,
.info-card h3{
    color:var(--he-black) !important;
}
.service-card p,
.feature-card p,
.area-card p,
.exp-card p,
.package-card p,
.pricing-card p,
.info-card p{
    color:var(--he-text) !important;
}
.quick-stats,
.services-section,
.features-section,
.packages-section,
.exp-showcase,
.milestone-timeline,
.service-areas{
    background:var(--he-soft) !important;
}

@media(max-width:992px){
    .hero-layout{
        grid-template-columns:1fr;
        gap:34px;
    }
    .home-business-hero .hero-text{
        text-align:center !important;
        margin:0 auto !important;
    }
    .home-business-hero .hero-subtitle{
        margin-left:auto !important;
        margin-right:auto !important;
    }
    .home-business-hero .hero-btns,
    .home-business-hero .business-types{
        justify-content:center !important;
    }
    .hero-visual{min-height:auto;}
    .hero-image-card{
        max-width:620px;
        margin:0 auto;
        transform:none;
    }
    .hero-image-card img{height:360px;}
    .promo-points{grid-template-columns:repeat(2,minmax(0,1fr)) !important;}
}
@media(max-width:576px){
    .home-business-hero{
        padding:95px 0 45px !important;
        min-height:auto !important;
    }
    .hero-badge{
        font-size:.76rem;
        padding:8px 12px;
        justify-content:center;
    }
    .home-business-hero .hero-title{
        font-size:2.15rem !important;
    }
    .home-business-hero .hero-subtitle{
        font-size:.98rem !important;
        line-height:1.7 !important;
    }
    .hero-image-card{
        border-radius:22px;
    }
    .hero-image-card img{height:260px;}
    .hero-image-badge{
        font-size:.78rem;
        padding:9px 11px;
        border-radius:12px;
    }
    .top-badge{top:12px;left:12px;}
    .bottom-badge{right:12px;bottom:12px;}
    .promo-strip{padding:52px 0 !important;}
    .promo-points{grid-template-columns:1fr !important;}
    .promo-points div{padding:15px !important;}
    .why-choose-us{padding:58px 0 !important;}
    .why-box{padding:28px 20px !important;}
}

/* =========================================================
   FINAL UPDATE: Light page theme + image hero backgrounds
   For Terms, About, Privacy and Contact pages
   ========================================================= */
:root {
    --he-red: #9f1239;
    --he-red-dark: #7f1d1d;
    --he-soft-red: #fff5f5;
    --he-ink: #111827;
    --he-muted: #4b5563;
    --he-border: #e5e7eb;
    --he-card: #ffffff;
}

.legal-page.inner-page,
.about-page.inner-page,
.privacy-page.inner-page {
    background: #f8fafc;
}

.legal-page .inner-hero,
.about-page .inner-hero,
.privacy-page .inner-hero,
.contact-hero {
    min-height: 360px;
    padding: 94px 0 64px !important;
    display: flex;
    align-items: center;
    text-align: center;
    background-image:
        linear-gradient(135deg, rgba(17, 24, 39, .82), rgba(185, 28, 28, .72)),
        url('https://images.unsplash.com/photo-1552664730-d307ca884978?auto=format&fit=crop&w=1920&q=80') !important;
    background-size: cover !important;
    background-position: center !important;
    background-attachment: fixed;
    border-bottom: 0 !important;
    overflow: hidden;
}

.about-page .inner-hero {
    background-image:
        linear-gradient(135deg, rgba(17, 24, 39, .82), rgba(220, 38, 38, .66)),
        url('https://images.unsplash.com/photo-1522071820081-009f0129c71c?auto=format&fit=crop&w=1920&q=80') !important;
}

.privacy-page .inner-hero {
    background-image:
        linear-gradient(135deg, rgba(17, 24, 39, .82), rgba(220, 38, 38, .66)),
        url('https://images.unsplash.com/photo-1563986768609-322da13575f3?auto=format&fit=crop&w=1920&q=80') !important;
}

.contact-hero {
    background-image:
        linear-gradient(135deg, rgba(17, 24, 39, .82), rgba(220, 38, 38, .66)),
        url('https://images.unsplash.com/photo-1516321318423-f06f85e504b3?auto=format&fit=crop&w=1920&q=80') !important;
}

.legal-page .inner-hero::before,
.about-page .inner-hero::before,
.privacy-page .inner-hero::before,
.contact-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 20% 25%, rgba(255,255,255,.18), transparent 26%),
                linear-gradient(90deg, rgba(255,255,255,.12) 1px, transparent 1px),
                linear-gradient(rgba(255,255,255,.10) 1px, transparent 1px);
    background-size: auto, 48px 48px, 48px 48px;
    opacity: .35;
    pointer-events: none;
}

.legal-page .inner-hero::after,
.about-page .inner-hero::after,
.privacy-page .inner-hero::after,
.contact-hero::after {
    content: '';
    position: absolute;
    width: 520px;
    height: 520px;
    right: -220px;
    bottom: -260px;
    background: rgba(255,255,255,.16);
    border-radius: 50%;
    filter: blur(12px);
}

.inner-hero .container,
.contact-hero .container,
.contact-hero-content {
    position: relative;
    z-index: 2;
}

.inner-badge {
    background: rgba(255,255,255,.18) !important;
    border: 1px solid rgba(255,255,255,.35) !important;
    color: #fff !important;
    box-shadow: 0 15px 35px rgba(0,0,0,.18);
}

.inner-title,
.contact-hero-title {
    color: #fff !important;
    text-shadow: 0 8px 24px rgba(0,0,0,.35);
    letter-spacing: .5px;
}

.inner-subtitle,
.contact-hero-subtitle {
    color: rgba(255,255,255,.92) !important;
    max-width: 860px;
}

.hero-meta-pill {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 12px 18px;
    border-radius: 999px;
    background: rgba(255,255,255,.16);
    border: 1px solid rgba(255,255,255,.28);
    color: #fff;
    font-weight: 700;
    box-shadow: 0 14px 30px rgba(0,0,0,.16);
}
.hero-meta-pill span { opacity: .6; }

.legal-content-light,
.content-page,
.contact-section,
.service-areas,
.locations-section {
    background: linear-gradient(180deg, #ffffff 0%, #f8fafc 55%, #fff7f7 100%) !important;
}

.content-card,
.side-card,
.value-card,
.process-card,
.contact-info-card,
.contact-form-card,
.area-card,
.locations-content {
    background: #ffffff !important;
    border: 1px solid rgba(220, 38, 38, .10) !important;
    box-shadow: 0 18px 45px rgba(15,23,42,.08) !important;
    color: var(--he-ink) !important;
}

.side-card h3,
.content-card h2,
.content-card h3,
.value-card h3,
.process-card h3,
.contact-info-card h2,
.contact-form-card h2,
.area-card h3,
.locations-content h2 {
    color: var(--he-ink) !important;
}

.content-card p,
.content-card li,
.value-card p,
.process-card p,
.side-card a,
.contact-info-card p,
.contact-info-card a,
.contact-form-card label,
.area-services,
.locations-content p {
    color: var(--he-muted) !important;
}

.side-card a {
    border-bottom: 1px solid #f1f5f9 !important;
}
.side-card a:hover,
.content-card h3,
.value-card i,
.process-card i,
.info-item i,
.area-icon,
.location-badge i {
    color: var(--he-red) !important;
}

.content-card li::before {
    color: var(--he-red) !important;
}

.notice-box,
.light-notice {
    background: #fff5f5 !important;
    border: 1px solid #fecaca !important;
    color: #7f1d1d !important;
}

.terms-premium-page .terms-layout {
    grid-template-columns: 300px 1fr;
    gap: 30px;
}

.legal-toc-card {
    border-top: 5px solid var(--he-red) !important;
}

.legal-toc-card h3 {
    display: flex;
    align-items: center;
    gap: 10px;
}

.terms-main-content .content-card {
    position: relative;
    overflow: hidden;
    padding: 36px 36px 34px 36px;
}

.legal-section-card::before,
.important-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    background: linear-gradient(180deg, var(--he-red), #fb7185);
}

.section-count {
    display: inline-flex;
    width: 46px;
    height: 46px;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: var(--he-soft-red);
    color: var(--he-red);
    border: 1px solid #fecaca;
    font-weight: 900;
    margin-bottom: 16px;
}

.important-card {
    background: linear-gradient(135deg, #ffffff 0%, #fff5f5 100%) !important;
    border-color: #fecaca !important;
}

.terms-feature-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
    margin-top: 22px;
}

.terms-feature-grid div {
    padding: 18px;
    border-radius: 18px;
    background: #f8fafc;
    border: 1px solid #e5e7eb;
}

.terms-feature-grid i {
    display: block;
    color: var(--he-red);
    font-size: 1.6rem;
    margin-bottom: 10px;
}

.terms-feature-grid strong {
    display: block;
    color: var(--he-ink);
    margin-bottom: 6px;
}

.terms-feature-grid span {
    color: var(--he-muted);
    font-size: .92rem;
    line-height: 1.6;
}

.terms-contact-row {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    margin-top: 18px;
}

.terms-contact-row a {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 12px 16px;
    border-radius: 999px;
    background: var(--he-red);
    color: #fff !important;
    text-decoration: none;
    font-weight: 700;
    box-shadow: 0 10px 20px rgba(159,18,57,.20);
}

.contact-section .form-group input,
.contact-section .form-group select,
.contact-section .form-group textarea {
    background: #ffffff !important;
    color: var(--he-ink) !important;
    border: 1px solid #e5e7eb !important;
}

.contact-section .form-group input:focus,
.contact-section .form-group select:focus,
.contact-section .form-group textarea:focus {
    border-color: var(--he-red) !important;
    box-shadow: 0 0 0 4px rgba(159,18,57,.08) !important;
}

.submit-btn,
.area-link,
.cta-strip .btn {
    background: var(--he-red) !important;
    color: #fff !important;
    border: 0 !important;
}

.service-areas .section-header h2,
.service-areas .section-header p {
    color: var(--he-ink) !important;
}

.location-badge {
    background: #fff !important;
    border: 1px solid #fecaca !important;
    color: var(--he-red) !important;
}

@media (max-width: 992px) {
    .terms-premium-page .terms-layout,
    .content-grid { grid-template-columns: 1fr !important; }
    .terms-feature-grid { grid-template-columns: 1fr; }
    .legal-page .inner-hero,
    .about-page .inner-hero,
    .privacy-page .inner-hero,
    .contact-hero { background-attachment: scroll; min-height: 310px; }
}

@media (max-width: 768px) {
    .legal-page .inner-hero,
    .about-page .inner-hero,
    .privacy-page .inner-hero,
    .contact-hero {
        padding: 74px 0 42px !important;
        min-height: 285px;
    }
    .terms-main-content .content-card { padding: 26px 22px; }
    .hero-meta-pill { flex-direction: column; border-radius: 22px; gap: 5px; }
    .hero-meta-pill span { display: none; }
    .terms-contact-row a { width: 100%; justify-content: center; }
}

/* =========================================================
   FINAL UPDATE: contact icons, packages colors, web-development page, experience gap
   ========================================================= */
:root{
    --he-red:#9f1239;
    --he-red-dark:#7f1d1d;
    --he-ink:#111827;
    --he-muted:#5b6472;
    --he-soft:#f8fafc;
    --he-soft-red:#fff5f5;
    --he-border:rgba(17,24,39,.09);
}

/* remove extra gap below header on Experience page */
.exp-hero{
    margin-top:0 !important;
    min-height:520px !important;
    height:auto !important;
    padding:74px 0 70px !important;
    background-attachment:scroll !important;
}
.exp-hero-content h1{margin-top:0 !important;}
@media(max-width:768px){
    .exp-hero{min-height:380px !important;padding:55px 0 45px !important;}
}

/* Contact Get in Touch icon visibility fix */
.contact-info-card .info-title i,
.contact-form-card .form-title i,
.contact-info-card .info-item > i{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    opacity:1 !important;
    visibility:visible !important;
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:14px !important;
    background:linear-gradient(135deg,var(--he-red),var(--he-red-dark)) !important;
    color:#ffffff !important;
    font-size:1.05rem !important;
    line-height:1 !important;
    text-align:center !important;
    box-shadow:0 10px 22px rgba(159,18,57,.20) !important;
}
.contact-info-card .info-title i,
.contact-form-card .form-title i{
    width:38px !important;
    height:38px !important;
    min-width:38px !important;
    font-size:1rem !important;
}
.contact-info-card .info-item > i.fas,
.contact-info-card .info-title i.fas,
.contact-form-card .form-title i.fas{
    font-family:"Font Awesome 6 Free" !important;
    font-weight:900 !important;
}
.contact-info-card .info-item > i.fab{
    font-family:"Font Awesome 6 Brands" !important;
    font-weight:400 !important;
}
.contact-info-card .info-item{
    align-items:flex-start !important;
    gap:14px !important;
    padding:14px !important;
    border-radius:18px !important;
    background:#ffffff !important;
    border:1px solid #eef2f7 !important;
    margin-bottom:14px !important;
}
.contact-info-card .info-item:hover{
    border-color:#fecaca !important;
    background:#fff7f7 !important;
}
.contact-info-card .info-text h4{color:var(--he-ink) !important;}
.contact-info-card .info-text p,
.contact-info-card .info-text a{color:var(--he-muted) !important;}

/* Packages page light/red professional color correction */
.packages-hero{
    margin-top:0 !important;
    min-height:430px !important;
    padding:90px 0 75px !important;
    background:linear-gradient(135deg,rgba(255,255,255,.94),rgba(255,241,242,.92)),url('https://images.unsplash.com/photo-1557838923-2985c318be48?auto=format&fit=crop&w=1920&q=80') center/cover no-repeat !important;
    border-bottom:1px solid rgba(159,18,57,.12) !important;
}
.packages-hero-title{
    color:var(--he-ink) !important;
    -webkit-text-fill-color:var(--he-ink) !important;
    text-shadow:none !important;
}
.packages-hero-subtitle{color:var(--he-muted) !important;}
.marketing-highlight{
    background:linear-gradient(135deg,#ffffff 0%,#fff7f7 52%,#f8fafc 100%) !important;
    border-top:1px solid #fecaca !important;
    border-bottom:1px solid #fecaca !important;
    box-shadow:inset 0 1px 0 #fff !important;
}
.marketing-highlight h2{color:var(--he-ink) !important;}
.marketing-highlight p{color:var(--he-muted) !important;}
.marketing-points div{
    background:#ffffff !important;
    color:var(--he-ink) !important;
    border:1px solid rgba(159,18,57,.14) !important;
    box-shadow:0 12px 28px rgba(17,24,39,.07) !important;
}
.packages-section{background:linear-gradient(180deg,#ffffff 0%,#f8fafc 55%,#ffffff 100%) !important;}
.package-card{
    background:#ffffff !important;
    border:1px solid rgba(17,24,39,.08) !important;
    box-shadow:0 18px 45px rgba(17,24,39,.08) !important;
}
.package-card:hover{
    border-color:rgba(159,18,57,.24) !important;
    box-shadow:0 24px 60px rgba(17,24,39,.12) !important;
}
.package-title{color:var(--he-red) !important;}
.package-description,
.package-features li{color:var(--he-muted) !important;}
.package-features li i{color:var(--he-red) !important;}
.btn-card{
    background:linear-gradient(135deg,var(--he-red),var(--he-red-dark)) !important;
    color:#ffffff !important;
    box-shadow:0 12px 28px rgba(159,18,57,.20) !important;
}
.custom-cta{
    background:linear-gradient(135deg,#fff7f7 0%,#ffffff 100%) !important;
    border:1px solid #fecaca !important;
    box-shadow:0 20px 45px rgba(17,24,39,.08) !important;
}
.custom-cta h2{color:var(--he-ink) !important;}
.custom-cta p{color:var(--he-muted) !important;}

/* WHY CHOOSE / common grid sections visibility fix across website */
.why-choose,
.why-choose-section,
.features-section,
.choose-section,
.benefits-section{
    background:linear-gradient(180deg,#ffffff 0%,#f8fafc 100%) !important;
    color:var(--he-ink) !important;
}
.why-choose .section-title,
.why-choose-section .section-title,
.features-section .section-title,
.choose-section .section-title,
.benefits-section .section-title,
.why-choose h2,
.why-choose-section h2,
.features-section h2,
.choose-section h2,
.benefits-section h2{
    color:var(--he-ink) !important;
    -webkit-text-fill-color:var(--he-ink) !important;
}
.why-choose .feature-card,
.why-choose-section .feature-card,
.choose-section .feature-card,
.benefits-section .feature-card,
.why-card,
.choose-card,
.benefit-card{
    background:#ffffff !important;
    color:var(--he-ink) !important;
    border:1px solid rgba(17,24,39,.08) !important;
    box-shadow:0 16px 38px rgba(17,24,39,.08) !important;
}
.why-choose .feature-card h3,
.why-choose-section .feature-card h3,
.choose-card h3,
.why-card h3,
.benefit-card h3{color:var(--he-ink) !important;}
.why-choose .feature-card p,
.why-choose-section .feature-card p,
.choose-card p,
.why-card p,
.benefit-card p{color:var(--he-muted) !important;}

/* Web Development page light theme */
.he-service-hero,
.webdev-hero{
    background:linear-gradient(135deg,#ffffff 0%,#fff5f5 48%,#f8fafc 100%) !important;
    color:var(--he-ink) !important;
    padding:84px 0 70px !important;
    border-bottom:1px solid rgba(159,18,57,.12) !important;
}
.webdev-hero-grid{
    display:grid;
    grid-template-columns:1.08fr .92fr;
    gap:42px;
    align-items:center;
}
.webdev-hero-image{
    border-radius:30px;
    overflow:hidden;
    box-shadow:0 25px 60px rgba(17,24,39,.14);
    border:8px solid #fff;
    position:relative;
}
.webdev-hero-image::after{
    content:'';
    position:absolute;
    inset:0;
    background:linear-gradient(135deg,rgba(159,18,57,.10),transparent 60%);
    pointer-events:none;
}
.webdev-hero-image img{width:100%;height:440px;object-fit:cover;display:block;}
.ai-section{
    background:#ffffff !important;
    color:var(--he-ink) !important;
}
.ai-section:nth-of-type(even){background:#f8fafc !important;}
.ai-kicker{
    background:#fff5f5 !important;
    border:1px solid #fecaca !important;
    color:var(--he-red) !important;
}
.ai-title{
    color:var(--he-ink) !important;
    -webkit-text-fill-color:var(--he-ink) !important;
}
.ai-subtitle{color:var(--he-muted) !important;}
.ai-grid{align-items:stretch;}
.ai-card,
.faq-item,
.ai-step,
.webdev-process-card{
    background:#ffffff !important;
    color:var(--he-ink) !important;
    border:1px solid rgba(17,24,39,.08) !important;
    box-shadow:0 16px 40px rgba(17,24,39,.08) !important;
}
.ai-card:hover,
.faq-item:hover,
.webdev-process-card:hover{
    border-color:rgba(159,18,57,.22) !important;
    box-shadow:0 24px 58px rgba(17,24,39,.12) !important;
}
.ai-card i{
    background:linear-gradient(135deg,var(--he-red),var(--he-red-dark)) !important;
    color:#ffffff !important;
}
.ai-card h3,
.ai-step h3,
.faq-item h3{color:var(--he-ink) !important;}
.ai-card p,
.ai-step p,
.faq-item p{color:var(--he-muted) !important;}
.webdev-split-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:34px;
    align-items:start;
}
.webdev-check-list{display:grid;gap:12px;margin-top:24px;}
.webdev-check-list div{
    display:flex;
    gap:10px;
    align-items:flex-start;
    padding:13px 15px;
    background:#fff;
    border:1px solid #eef2f7;
    border-radius:14px;
    color:var(--he-muted);
}
.webdev-check-list i{color:var(--he-red);margin-top:3px;}
.webdev-process-card{padding:30px;border-radius:26px;}
.webdev-process-card h3{color:var(--he-ink);margin-bottom:18px;}
.webdev-process-card h3 i{color:var(--he-red);}
.webdev-process-card ol{padding-left:22px;margin:0;}
.webdev-process-card li{color:var(--he-muted);line-height:1.75;margin-bottom:12px;}
.webdev-process-card strong{color:var(--he-ink);}
.webdev-cta-box{text-align:center;}
@media(max-width:900px){
    .webdev-hero-grid,
    .webdev-split-grid{grid-template-columns:1fr;}
    .webdev-hero-image img{height:300px;}
}
@media(max-width:600px){
    .he-service-hero,.webdev-hero{padding:54px 0 45px !important;}
    .webdev-hero-image{border-radius:22px;border-width:5px;}
    .webdev-hero-image img{height:240px;}
}


/* =========================================================
   FINAL COMPACT HEIGHT + DARK MAROON BRAND COLOR UPDATE
   User request: height kaam karo + red thoda dark in all pages
========================================================= */
:root{
    --primary-red:#9f1239 !important;
    --secondary-red:#7f1d1d !important;
    --he-red:#9f1239 !important;
    --he-red-dark:#7f1d1d !important;
    --gradient-red:linear-gradient(135deg,#9f1239 0%,#7f1d1d 100%) !important;
}
.highlight,
.section-title .highlight,
.hero-title .highlight,
.packages-hero-title span,
.ai-kicker,
.webdev-check-list i,
.contact-info-item i,
.footer-contact i{
    color:#9f1239 !important;
}
.btn-primary,
.btn-red,
.cta-btn,
.submit-btn,
.package-btn,
.hero-btns .btn-primary,
.hero-btns .btn:first-child,
.btn-facebook:not(.no-brand),
.mobile-toggle span,
.nav-toggle span{
    background:linear-gradient(135deg,#9f1239,#7f1d1d) !important;
    border-color:#9f1239 !important;
    color:#ffffff !important;
}
a:hover,
.nav-link:hover,
.dropdown-menu a:hover,
.mobile-menu a:hover{
    color:#9f1239 !important;
}
/* Compact hero/section heights across all important pages */
.hero,
.home-business-hero{
    min-height:560px !important;
    height:auto !important;
    padding:96px 0 58px !important;
}
.inner-hero,
.contact-hero,
.page-hero,
.packages-hero,
.he-service-hero,
.webdev-hero,
.hero-local,
.hero-radial,
.exp-hero{
    min-height:auto !important;
    height:auto !important;
    padding-top:74px !important;
    padding-bottom:50px !important;
    margin-top:70px !important;
}
.exp-hero{padding-top:68px !important;padding-bottom:44px !important;}
.contact-hero-content{padding:28px 18px !important;}
.hero-title,.page-hero-title,.contact-hero-title,.packages-hero-title,.exp-hero-content h1{
    margin-top:0 !important;
    margin-bottom:14px !important;
    line-height:1.08 !important;
}
.hero-subtitle,.page-hero-subtitle,.contact-hero-subtitle,.packages-hero-subtitle,.exp-hero-content p{
    margin-bottom:18px !important;
}
section,
.ai-section,
.exp-showcase,
.facebook-journey-section,
.milestone-timeline,
.cta-section,
.contact-section,
.packages-section,
.services-section,
.why-choose,
.why-choose-section{
    padding-top:54px !important;
    padding-bottom:54px !important;
}
.exp-counter-section{
    padding-top:36px !important;
    padding-bottom:36px !important;
    margin-top:-28px !important;
    margin-bottom:44px !important;
}
.section-header{margin-bottom:32px !important;}
.card,.feature-card,.choose-card,.why-card,.ai-card,.service-card,.package-card,.exp-card{
    border-top-color:rgba(159,18,57,.22) !important;
}
@media(max-width:768px){
    .hero,.home-business-hero{min-height:auto !important;padding:84px 0 42px !important;}
    .inner-hero,.contact-hero,.page-hero,.packages-hero,.he-service-hero,.webdev-hero,.hero-local,.hero-radial,.exp-hero{
        padding-top:54px !important;
        padding-bottom:34px !important;
        margin-top:62px !important;
    }
    section,.ai-section,.exp-showcase,.facebook-journey-section,.milestone-timeline,.cta-section,.contact-section,.packages-section,.services-section,.why-choose,.why-choose-section{
        padding-top:38px !important;
        padding-bottom:38px !important;
    }
    .hero-title,.page-hero-title,.contact-hero-title,.packages-hero-title,.exp-hero-content h1{font-size:2.05rem !important;}
}


/* ===== FINAL UPDATE: SOCIAL LINK VERSION + HEADER GAP FIX ===== */
html, body { margin-top:0 !important; }
body { padding-top:60px !important; }
.main-header { height:60px !important; }
.main-header .navbar { height:60px !important; min-height:60px !important; }
.hero,.home-business-hero,.inner-hero,.contact-hero,.page-hero,.packages-hero,.he-service-hero,.webdev-hero,.hero-local,.hero-radial,.exp-hero{
    margin-top:0 !important;
    height:auto !important;
    min-height:auto !important;
    padding-top:42px !important;
    padding-bottom:38px !important;
}
.home-business-hero{padding-top:46px !important;padding-bottom:44px !important;}
.exp-hero{padding-top:40px !important;padding-bottom:34px !important;}
@media(max-width:768px){
    body{padding-top:60px !important;}
    .hero,.home-business-hero,.inner-hero,.contact-hero,.page-hero,.packages-hero,.he-service-hero,.webdev-hero,.hero-local,.hero-radial,.exp-hero{
        margin-top:0 !important;
        padding-top:30px !important;
        padding-bottom:28px !important;
    }
}