/*--------------------------------------------------------------
# Firefly Theme - Premium Dark & Gold
# Elevated casual: dark, warm, appetizing, confident
# Designed for kebab/grill restaurants and similar food brands
--------------------------------------------------------------*/
:root {
    /* Firefly Brand Colors */
    --firefly-bg-primary: #111111;
    --firefly-bg-secondary: #1A1A1A;
    --firefly-bg-card: #222222;
    --firefly-bg-elevated: #2A2A2A;

    --firefly-gold: #D4A843;
    --firefly-gold-light: #E8C96A;
    --firefly-gold-dark: #B8922E;

    --firefly-text-primary: #FFFFFF;
    --firefly-text-secondary: #B0B0B0;
    --firefly-text-muted: #787878;

    --firefly-accent-red: #C0392B;
    --firefly-accent-green: #27AE60;

    --firefly-overlay: rgba(0, 0, 0, 0.65);
    --firefly-divider: rgba(212, 168, 67, 0.2);

    /* Shadows & Effects */
    --firefly-shadow-card: 0 4px 20px rgba(0, 0, 0, 0.4);
    --firefly-shadow-hover: 0 8px 32px rgba(0, 0, 0, 0.5);
    --firefly-shadow-gold-glow: 0 0 20px rgba(212, 168, 67, 0.15);
    --firefly-transition: all 0.3s cubic-bezier(0.25, 0.1, 0.25, 1);

    /* Spacing */
    --firefly-space-xs: 0.5rem;
    --firefly-space-sm: 1rem;
    --firefly-space-md: 1.5rem;
    --firefly-space-lg: 2rem;
    --firefly-space-xl: 3rem;
    --firefly-space-2xl: 4rem;
    --firefly-space-3xl: 6rem;

    /* Radius */
    --firefly-radius-sm: 4px;
    --firefly-radius-md: 8px;
    --firefly-radius-lg: 12px;
    --firefly-radius-xl: 16px;
    --firefly-radius-full: 9999px;

    /* Override main.css heading/text color variables */
    --heading-color: #D4A843;
    --default-color: #B0B0B0;
    --background-color: #111111;
    --surface-color: #222222;
    --accent-color: #D4A843;
    --accent-color-rgb: 212, 168, 67;
    --nav-color: #B0B0B0;
    --nav-hover-color: #D4A843;
    --nav-mobile-background-color: #111111;
    --nav-dropdown-background-color: #1A1A1A;
    --nav-dropdown-color: #B0B0B0;
    --nav-dropdown-hover-color: #D4A843;
}

/*--------------------------------------------------------------
# Global Styles
--------------------------------------------------------------*/
body {
    background-color: var(--firefly-bg-primary);
    color: var(--firefly-text-secondary);
    line-height: 1.7;
}

/*--------------------------------------------------------------
# Full-Width Section Layout
# The outer .website-section > .container wrapper from Preview.cshtml
# constrains sections to max-width 1200px. Override it so sections
# stretch edge-to-edge (backgrounds, hero, etc.) while inner
# containers still cap content width for readability.
--------------------------------------------------------------*/
.website-section > .container {
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.website-section {
    padding-left: 0;
    padding-right: 0;
}

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 {
    color: var(--firefly-gold);
    line-height: 1.3;
    margin-bottom: 1rem;
}

h1 {
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 700;
}

h2 {
    font-size: clamp(1.75rem, 3.5vw, 2.5rem);
    font-weight: 600;
}

h3 {
    font-size: clamp(1.25rem, 2vw, 1.5rem);
    font-weight: 600;
}

p {
    color: var(--firefly-text-secondary);
    line-height: 1.75;
}

.section-title {
    text-align: center;
    margin-bottom: 3rem;
    position: relative;
}

.section-title h2 {
    color: var(--firefly-text-primary);
}

.section-title p {
    color: var(--firefly-text-secondary);
    max-width: 650px;
    margin: 0 auto;
}

/*--------------------------------------------------------------
# Section Label (small gold uppercase labels)
--------------------------------------------------------------*/
.firefly-section-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--firefly-gold);
    font-weight: 600;
    margin-bottom: 0.75rem;
}

/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/* Override Bootstrap bg-light and navbar-light for dark theme */
.bg-light {
    background-color: var(--firefly-bg-primary) !important;
}

.navbar-light .navbar-nav .nav-link {
    color: var(--firefly-text-secondary) !important;
}

.navbar-light .navbar-nav .nav-link:hover,
.navbar-light .navbar-nav .nav-link.active {
    color: var(--firefly-gold) !important;
}

.navbar-light .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23D4A843' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e") !important;
}

.navbar {
    padding: 1rem 0;
    background: transparent;
    transition: var(--firefly-transition);
    border-bottom: 1px solid transparent;
    height: 72px;
}

.navbar.scrolled {
    background: var(--firefly-bg-primary);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom-color: var(--firefly-divider);
    padding: 0.75rem 0;
}

.navbar-brand {
    color: var(--firefly-gold) !important;
    font-weight: 600;
    font-size: 1.25rem;
    letter-spacing: 0.05em;
}

.navbar-nav .nav-link {
    font-size: 0.8rem;
    font-weight: 500;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--firefly-text-secondary) !important;
    margin: 0 1rem;
    padding: 0.5rem 0;
    position: relative;
    transition: var(--firefly-transition);
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active {
    color: var(--firefly-gold) !important;
}

.navbar-nav .nav-link.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 50%;
    transform: translateX(-50%);
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: var(--firefly-gold);
}

.navbar-toggler {
    border: none;
    padding: 0;
}

.navbar-toggler:focus {
    box-shadow: none;
}

.navbar-toggler-icon {
    width: 24px;
    height: 24px;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='%23D4A843' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

@media (max-width: 768px) {
    .navbar {
        height: 64px;
    }
    .navbar-collapse {
        background: var(--firefly-bg-primary);
        padding: 1.5rem;
        margin-top: 0.5rem;
        border-radius: var(--firefly-radius-md);
    }
    .navbar-nav .nav-link {
        font-size: 1rem;
        margin: 0;
        padding: 0.75rem 0;
    }
}

/*--------------------------------------------------------------
# Buttons
--------------------------------------------------------------*/
.btn {
    transition: var(--firefly-transition);
    font-weight: 600;
    font-size: 0.9375rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: var(--firefly-radius-sm);
}

.btn-primary,
.firefly-hero .btn-get-started {
    background: var(--firefly-gold);
    border-color: var(--firefly-gold);
    color: #111111;
    padding: 14px 32px;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.firefly-hero .btn-get-started:hover {
    background: var(--firefly-gold-light);
    border-color: var(--firefly-gold-light);
    color: #111111;
    transform: translateY(-2px);
    box-shadow: var(--firefly-shadow-gold-glow);
}

.btn-primary:active {
    background: var(--firefly-gold-dark);
    border-color: var(--firefly-gold-dark);
    transform: translateY(0);
}

.btn-outline-primary,
.firefly-hero .btn-outline-gold {
    background: transparent;
    border: 1.5px solid var(--firefly-gold);
    color: var(--firefly-gold);
    padding: 14px 32px;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active,
.firefly-hero .btn-outline-gold:hover {
    background: rgba(212, 168, 67, 0.1);
    border-color: var(--firefly-gold-light);
    color: var(--firefly-gold-light);
}

.btn-light {
    background: transparent;
    border: 1.5px solid rgba(255, 255, 255, 0.3);
    color: white;
}

.btn-light:hover {
    background: rgba(255, 255, 255, 0.1);
    color: white;
}

/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
.firefly-hero {
    min-height: 100vh;
    min-height: 100svh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
}

.firefly-hero-background {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    background-position: center 40%;
    z-index: 0;
}

.firefly-hero-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.75) 100%);
    z-index: 1;
}

.firefly-hero .hero-inner {
    position: relative;
    z-index: 2;
    text-align: center;
    max-width: 800px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.firefly-hero .hero-label {
    font-size: 0.8125rem;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: var(--firefly-gold);
    margin-bottom: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}

.firefly-hero .hero-label::before,
.firefly-hero .hero-label::after {
    content: '';
    width: 40px;
    height: 1px;
    background: var(--firefly-gold);
    opacity: 0.5;
}

.firefly-hero .firefly-hero-logo {
    display: flex;
    justify-content: center;
    margin-bottom: 1.5rem;
}

.firefly-hero .firefly-hero-logo img {
    max-height: 120px;
    width: auto;
    object-fit: contain;
}

.firefly-hero h1 {
    font-size: clamp(2.5rem, 5vw, 4rem);
    font-weight: 700;
    color: white;
    line-height: 1.2;
    max-width: 800px;
    margin: 0 auto 1.25rem;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.3);
}

.firefly-hero .hero-subtitle {
    font-size: clamp(1rem, 2vw, 1.25rem);
    color: var(--firefly-text-secondary);
    font-weight: 400;
    max-width: 600px;
    margin: 0 auto;
    line-height: 1.6;
}

.firefly-hero .hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
    margin-top: 2.5rem;
}

.firefly-hero .btn-get-started {
    background: var(--firefly-gold);
    border: 2px solid var(--firefly-gold);
    color: #111111;
    padding: 14px 32px;
    text-decoration: none;
    display: inline-block;
    transition: var(--firefly-transition);
    border-radius: var(--firefly-radius-sm);
    font-weight: 600;
    font-size: 0.9375rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.firefly-hero .btn-get-started:hover {
    background: var(--firefly-gold-light);
    border-color: var(--firefly-gold-light);
    transform: translateY(-2px);
    box-shadow: var(--firefly-shadow-gold-glow);
}

.firefly-hero .btn-outline-gold {
    background: rgba(212, 168, 67, 0.12);
    border: 2px solid var(--firefly-gold);
    color: var(--firefly-gold) !important;
    padding: 14px 32px;
    text-decoration: none !important;
    display: inline-block;
    transition: var(--firefly-transition);
    border-radius: var(--firefly-radius-sm);
    font-weight: 600;
    font-size: 0.9375rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.firefly-hero .btn-outline-gold:hover {
    background: rgba(212, 168, 67, 0.25);
    border-color: var(--firefly-gold-light);
    color: var(--firefly-gold-light) !important;
    transform: translateY(-2px);
    box-shadow: var(--firefly-shadow-gold-glow);
}

/* Hero scroll indicator */
.firefly-hero .hero-scroll-indicator {
    position: absolute;
    bottom: 2rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
}

.firefly-hero .hero-scroll-indicator a {
    color: var(--firefly-gold);
    opacity: 0.6;
    font-size: 1.5rem;
    animation: firefly-bounce 2s infinite;
    text-decoration: none;
}

@keyframes firefly-bounce {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(8px); }
}

@media (max-width: 767px) {
    .firefly-hero {
        min-height: 90vh;
        min-height: 90svh;
    }
    .firefly-hero .firefly-hero-logo img {
        max-height: 80px;
    }
    .firefly-hero h1 {
        font-size: 2rem;
    }
    .firefly-hero .hero-subtitle {
        font-size: 0.9375rem;
    }
    .firefly-hero .hero-buttons {
        flex-direction: column;
        gap: 0.75rem;
    }
    .firefly-hero .hero-buttons a {
        width: 100%;
        text-align: center;
    }
    .firefly-hero .hero-label::before,
    .firefly-hero .hero-label::after {
        display: none;
    }
    .firefly-hero .hero-scroll-indicator {
        display: none;
    }
}

/*--------------------------------------------------------------
# General Sections
--------------------------------------------------------------*/
section {
    padding: var(--firefly-space-3xl) 0;
    position: relative;
}

@media (max-width: 1024px) {
    section {
        padding: var(--firefly-space-2xl) 0;
    }
}

@media (max-width: 767px) {
    section {
        padding: var(--firefly-space-xl) 0;
    }
}

/* Alternating section backgrounds */
section:nth-child(odd) {
    background: var(--firefly-bg-primary);
}

section:nth-child(even) {
    background: var(--firefly-bg-secondary);
}

/*--------------------------------------------------------------
# About Section
--------------------------------------------------------------*/
.firefly-about {
    background: var(--firefly-bg-secondary);
}

.firefly-about .about-image-wrapper {
    position: relative;
    border-radius: var(--firefly-radius-lg);
    overflow: hidden;
    border: 2px solid var(--firefly-divider);
}

.firefly-about .about-image-wrapper img {
    width: 100%;
    height: auto;
    display: block;
}

.firefly-about .about-image-badge {
    position: absolute;
    bottom: -16px;
    right: -16px;
    background: var(--firefly-bg-card);
    color: var(--firefly-gold);
    padding: 8px 16px;
    border-radius: var(--firefly-radius-md);
    font-style: italic;
    font-size: 0.875rem;
    transform: rotate(-3deg);
    z-index: 3;
}

.firefly-about .firefly-section-label {
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: var(--firefly-gold);
    font-weight: 600;
    margin-bottom: 0.75rem;
}

.firefly-about h2 {
    color: var(--firefly-gold);
    margin-bottom: 1.5rem;
}

.firefly-about .about-content p {
    color: var(--firefly-text-secondary);
    line-height: 1.75;
    margin-bottom: 1rem;
}

.firefly-about .about-accent-line {
    font-style: italic;
    color: var(--firefly-gold);
    font-size: 1.125rem;
    margin-top: 1.5rem;
}

@media (max-width: 767px) {
    .firefly-about .about-image-wrapper {
        max-height: 300px;
        overflow: hidden;
        margin-bottom: 2rem;
    }
    .firefly-about .about-image-badge {
        bottom: auto;
        top: 12px;
        right: 12px;
    }
}

/*--------------------------------------------------------------
# Features Section
--------------------------------------------------------------*/
.firefly-features {
    background: var(--firefly-bg-primary);
}

.firefly-features .feature-box {
    background: var(--firefly-bg-card);
    border-radius: var(--firefly-radius-lg);
    padding: 2rem;
    border: 1px solid transparent;
    transition: var(--firefly-transition);
    height: 100%;
}

.firefly-features .feature-box:hover {
    border-color: var(--firefly-divider);
    box-shadow: var(--firefly-shadow-gold-glow);
    transform: translateY(-4px);
}

.firefly-features .feature-icon {
    width: 64px !important;
    height: 64px !important;
    border-radius: 50% !important;
    background: rgba(212, 168, 67, 0.1) !important;
    background-color: rgba(212, 168, 67, 0.1) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 1.25rem;
}

.firefly-features .feature-icon i {
    font-size: 1.5rem;
    color: var(--firefly-gold) !important;
    line-height: 1;
    display: flex;
    align-items: center;
    justify-content: center;
}

.firefly-features .feature-box h4 {
    font-size: 1.0625rem;
    font-weight: 600;
    color: var(--firefly-gold);
    margin-bottom: 0.75rem;
}

.firefly-features .feature-box p {
    font-size: 0.9375rem;
    color: var(--firefly-text-secondary);
    line-height: 1.65;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .firefly-features .feature-box {
        padding: 1.5rem;
    }
}

/*--------------------------------------------------------------
# Cards & Content Boxes (OfferItems / Menu)
--------------------------------------------------------------*/
.card {
    border: none;
    background: var(--firefly-bg-card);
    border-radius: var(--firefly-radius-lg);
    box-shadow: var(--firefly-shadow-card);
    transition: var(--firefly-transition);
    overflow: hidden;
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: var(--firefly-shadow-hover);
}

.card-body {
    padding: 1.5rem;
}

.card-title {
    color: var(--firefly-gold);
    font-weight: 600;
}

.card-text {
    color: var(--firefly-text-secondary);
    line-height: 1.65;
}

.card-img-top {
    transition: transform 0.4s ease;
}

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

/*--------------------------------------------------------------
# OfferItems Section (Menu Items)
--------------------------------------------------------------*/
.offerItems-section {
    background: var(--firefly-bg-secondary);
}

.offerItems-section .card {
    background: var(--firefly-bg-card);
    border: none;
}

.offerItems-section .price {
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--firefly-gold);
}

.offerItems-section .badge {
    background: var(--firefly-gold);
    color: #111111;
    font-weight: 600;
    letter-spacing: 0.08em;
    padding: 0.3rem 0.75rem;
    text-transform: uppercase;
    font-size: 0.625rem;
    border-radius: var(--firefly-radius-full);
}

/*--------------------------------------------------------------
# Services Section
--------------------------------------------------------------*/
.service-card {
    background: var(--firefly-bg-card);
    padding: 2rem;
    height: 100%;
    border-radius: var(--firefly-radius-lg);
    border: 1px solid transparent;
    transition: var(--firefly-transition);
}

.service-card:hover {
    border-color: var(--firefly-divider);
    box-shadow: var(--firefly-shadow-gold-glow);
}

.service-card h3,
.service-card h4 {
    color: var(--firefly-gold);
    font-weight: 600;
}

.service-card p {
    color: var(--firefly-text-secondary);
}

/*--------------------------------------------------------------
# Blog & Portfolio Sections
--------------------------------------------------------------*/
.blog-section .card,
.portfolio-section .card {
    background: var(--firefly-bg-card);
    border: none;
    overflow: hidden;
}

.blog-section .card-body,
.portfolio-section .card-body {
    padding: 1.5rem;
}

.blog-meta,
.portfolio-meta {
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--firefly-gold);
    margin-bottom: 0.5rem;
}

.portfolio-info {
    background: linear-gradient(to bottom, transparent 0%, rgba(0, 0, 0, 0.8) 100%);
    padding: 2rem;
}

.portfolio-info h4,
.portfolio-info p {
    color: white;
}

/*--------------------------------------------------------------
# Team Section
--------------------------------------------------------------*/
.team-member {
    text-align: center;
}

.team-member img {
    border-radius: var(--firefly-radius-lg);
    margin-bottom: 1.25rem;
    transition: var(--firefly-transition);
}

.team-member:hover img {
    box-shadow: var(--firefly-shadow-gold-glow);
}

.team-member h4 {
    color: var(--firefly-text-primary);
    font-weight: 600;
}

.team-member .position {
    color: var(--firefly-gold);
    font-size: 0.875rem;
}

/*--------------------------------------------------------------
# Testimonials Section
--------------------------------------------------------------*/
.firefly-testimonials {
    background: var(--firefly-bg-secondary);
}

.firefly-testimonials .testimonial-item {
    background: var(--firefly-bg-card);
    border-radius: var(--firefly-radius-lg);
    padding: 2rem;
    height: 100%;
    border: 1px solid var(--firefly-border);
    transition: var(--firefly-transition);
    position: relative;
    display: flex;
    flex-direction: column;
}

.firefly-testimonials .testimonial-item::before {
    content: "\201C";
    position: absolute;
    top: 1rem;
    right: 1.5rem;
    font-size: 4rem;
    font-family: Georgia, serif;
    color: var(--firefly-gold);
    opacity: 0.15;
    line-height: 1;
}

.firefly-testimonials .testimonial-item:hover {
    border-color: var(--firefly-gold);
    box-shadow: 0 4px 25px rgba(212, 168, 67, 0.15);
    transform: translateY(-4px);
}

/* Gold stars */
.firefly-testimonials .bi-star-fill {
    color: var(--firefly-gold) !important;
    font-size: 1rem;
}

.firefly-testimonials .bi-star {
    color: rgba(212, 168, 67, 0.3) !important;
    font-size: 1rem;
}

.firefly-testimonials .stars {
    gap: 0.2rem;
}

/* Testimonial text */
.firefly-testimonials .testimonial-content {
    color: var(--firefly-text-secondary);
    font-style: italic;
    line-height: 1.75;
    font-size: 0.9375rem;
    margin-bottom: 1.5rem;
    flex-grow: 1;
}

/* Client info - name and company */
.firefly-testimonials .client-info h4,
.firefly-testimonials .client-info h6 {
    color: var(--firefly-text-primary) !important;
    font-size: 0.95rem;
    font-weight: 600;
    margin-bottom: 0.15rem;
}

.firefly-testimonials .client-info p,
.firefly-testimonials .client-info span,
.firefly-testimonials .client-info small {
    color: var(--firefly-text-muted);
    font-size: 0.8rem;
}

/* Avatar - gold ring */
.firefly-testimonials .testimonial-avatar {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(212, 168, 67, 0.12);
    border: 2px solid var(--firefly-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    color: var(--firefly-gold);
    font-weight: 700;
    flex-shrink: 0;
}

.firefly-testimonials .client-img {
    width: 44px;
    height: 44px;
    object-fit: cover;
    border-radius: 50%;
    border: 2px solid var(--firefly-gold);
}

/*--------------------------------------------------------------
# CTA Section
--------------------------------------------------------------*/
.firefly-cta {
    background: var(--firefly-bg-primary);
    position: relative;
    overflow: hidden;
}

.firefly-cta::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 600px;
    height: 600px;
    background: radial-gradient(circle, rgba(212, 168, 67, 0.05) 0%, transparent 70%);
    pointer-events: none;
}

.firefly-cta h2 {
    color: var(--firefly-gold);
    font-size: clamp(1.75rem, 3vw, 2.5rem);
}

.firefly-cta p {
    color: var(--firefly-text-secondary);
    font-size: 1rem;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.firefly-cta .cta-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    justify-content: center;
    margin-top: 2rem;
}

.firefly-cta .btn-cta-primary {
    background: var(--firefly-gold);
    border: 2px solid var(--firefly-gold);
    color: #111111;
    padding: 14px 32px;
    text-decoration: none;
    border-radius: var(--firefly-radius-sm);
    font-weight: 600;
    font-size: 0.9375rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    transition: var(--firefly-transition);
}

.firefly-cta .btn-cta-primary:hover {
    background: var(--firefly-gold-light);
    border-color: var(--firefly-gold-light);
    transform: translateY(-2px);
    box-shadow: var(--firefly-shadow-gold-glow);
}

@media (max-width: 767px) {
    .firefly-cta h2 {
        font-size: 1.75rem;
    }
    .firefly-cta .cta-buttons {
        flex-direction: column;
    }
    .firefly-cta .cta-buttons a {
        width: 100%;
        text-align: center;
    }
}

/*--------------------------------------------------------------
# Price List CTA Section - Standout
--------------------------------------------------------------*/
.firefly-pricelist-cta {
    position: relative;
    overflow: hidden;
    padding: 4rem 0;
    background: linear-gradient(135deg, rgba(212, 168, 67, 0.12) 0%, rgba(17, 17, 17, 0.95) 50%, rgba(212, 168, 67, 0.08) 100%);
    border-top: 2px solid var(--firefly-gold);
    border-bottom: 2px solid var(--firefly-gold);
}

.firefly-pricelist-cta-glow {
    position: absolute;
    top: -50%;
    left: -20%;
    width: 60%;
    height: 200%;
    background: radial-gradient(ellipse, rgba(212, 168, 67, 0.08) 0%, transparent 70%);
    pointer-events: none;
    z-index: 1;
}

.firefly-pricelist-heading {
    font-family: var(--firefly-font-heading);
    font-size: clamp(1.75rem, 3vw, 2.5rem);
    font-weight: 700;
    color: var(--firefly-gold) !important;
    margin-bottom: 0.75rem;
    letter-spacing: -0.02em;
}

.firefly-pricelist-subheading {
    color: var(--firefly-text-secondary);
    font-size: 1.05rem;
    line-height: 1.6;
    margin-bottom: 0;
    max-width: 500px;
}

.firefly-pricelist-btn {
    display: inline-flex;
    align-items: center;
    padding: 1rem 2.5rem;
    font-size: 1.1rem;
    font-weight: 600;
    letter-spacing: 0.03em;
    color: var(--firefly-bg-primary) !important;
    background: linear-gradient(135deg, var(--firefly-gold) 0%, var(--firefly-gold-light) 100%);
    border: none;
    border-radius: 6px;
    box-shadow: 0 4px 20px rgba(212, 168, 67, 0.3), 0 0 40px rgba(212, 168, 67, 0.1);
    transition: all 0.3s ease;
    text-decoration: none;
}

.firefly-pricelist-btn:hover {
    color: var(--firefly-bg-primary) !important;
    background: linear-gradient(135deg, var(--firefly-gold-light) 0%, var(--firefly-gold) 100%);
    transform: translateY(-2px);
    box-shadow: 0 6px 30px rgba(212, 168, 67, 0.45), 0 0 60px rgba(212, 168, 67, 0.15);
}

@media (max-width: 767px) {
    .firefly-pricelist-cta {
        padding: 3rem 0;
        text-align: center;
    }
    .firefly-pricelist-subheading {
        max-width: 100%;
        margin: 0 auto 1.5rem;
    }
    .firefly-pricelist-cta .text-md-end {
        text-align: center !important;
    }
    .firefly-pricelist-btn {
        width: 100%;
        justify-content: center;
    }
}

/*--------------------------------------------------------------
# FAQ Section
--------------------------------------------------------------*/
.faq-section {
    background: var(--firefly-bg-secondary);
}

.faq-section .faq-section-title {
    color: var(--firefly-text-primary);
}

.faq-section .faq-section-subtitle {
    color: var(--firefly-text-secondary);
}

.faq-section .faq-accordion .accordion-item {
    background: transparent;
    border: none;
    margin-bottom: 0.75rem;
}

.faq-section .faq-accordion .accordion-button {
    background: var(--firefly-bg-card);
    border: 1px solid transparent;
    border-radius: var(--firefly-radius-md) !important;
    color: var(--firefly-text-primary);
    font-weight: 500;
    padding: 1.25rem 3rem 1.25rem 1.5rem;
    box-shadow: none;
    transition: var(--firefly-transition);
}

.faq-section .faq-accordion .accordion-button:hover {
    border-color: var(--firefly-divider);
}

.faq-section .faq-accordion .accordion-button:not(.collapsed) {
    background: var(--firefly-gold);
    color: #111111;
    border-color: var(--firefly-gold);
    box-shadow: 0 8px 24px rgba(212, 168, 67, 0.2);
}

.faq-section .faq-accordion .accordion-button::before {
    background: var(--firefly-gold);
}

.faq-section .faq-accordion .accordion-button::after {
    color: var(--firefly-text-muted);
}

.faq-section .faq-accordion .accordion-button:not(.collapsed)::after {
    color: #111111;
}

.faq-section .faq-accordion .accordion-body {
    background: var(--firefly-bg-card);
    border: 1px solid var(--firefly-divider);
    border-top: none;
    color: var(--firefly-text-secondary);
    border-radius: 0 0 var(--firefly-radius-md) var(--firefly-radius-md);
}

.faq-section .faq-accordion .accordion-button:not(.collapsed) + .accordion-collapse .accordion-body {
    border-color: rgba(212, 168, 67, 0.2);
    background: rgba(212, 168, 67, 0.03);
}

.faq-section .faq-icon {
    background: rgba(212, 168, 67, 0.1);
    color: var(--firefly-gold);
}

.faq-section .accordion-button:not(.collapsed) .faq-icon {
    background: rgba(17, 17, 17, 0.2);
    color: #111111;
}

/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/
.contact-section {
    background: var(--firefly-bg-primary);
}

/* Form wrapper - dark card instead of white */
.contact-section .contact-form {
    background: var(--firefly-bg-card) !important;
    border: 1px solid var(--firefly-border);
    box-shadow: none !important;
}

.contact-section .contact-form h2 {
    color: var(--firefly-gold) !important;
}

/* Form inputs */
.contact-section .form-control,
.contact-section .form-select {
    background-color: var(--firefly-bg-secondary) !important;
    border: 1px solid var(--firefly-divider) !important;
    color: var(--firefly-text-primary) !important;
    border-radius: var(--firefly-radius-md);
    padding: 0.75rem 1rem;
}

.contact-section .form-control:focus,
.contact-section .form-select:focus {
    border-color: var(--firefly-gold) !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 168, 67, 0.15) !important;
    background-color: var(--firefly-bg-secondary) !important;
    color: var(--firefly-text-primary) !important;
}

.contact-section .form-control::placeholder {
    color: var(--firefly-text-muted) !important;
}

.contact-section label {
    color: var(--firefly-text-secondary);
}

/* Submit button - prominent gold */
.contact-section .btn-primary,
.homepage-contact .btn-primary {
    background: linear-gradient(135deg, var(--firefly-gold) 0%, var(--firefly-gold-light) 100%) !important;
    border: none !important;
    color: var(--firefly-bg-primary) !important;
    font-weight: 600 !important;
    font-size: 1rem !important;
    padding: 0.85rem 2rem !important;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    border-radius: 6px;
    box-shadow: 0 4px 15px rgba(212, 168, 67, 0.25);
    transition: all 0.3s ease !important;
}

.contact-section .btn-primary:hover,
.homepage-contact .btn-primary:hover {
    background: linear-gradient(135deg, var(--firefly-gold-light) 0%, var(--firefly-gold) 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 25px rgba(212, 168, 67, 0.4) !important;
    color: var(--firefly-bg-primary) !important;
}

/* Contact info text */
.contact-section .text-muted {
    color: var(--firefly-text-secondary) !important;
}

.contact-section a {
    color: var(--firefly-gold);
}

.contact-section a:hover {
    color: var(--firefly-gold-light);
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
footer {
    background: var(--firefly-bg-card);
    border-top: 2px solid var(--firefly-gold);
    color: var(--firefly-text-secondary);
    padding-top: 3rem;
}

/* Company name in footer */
footer h5,
footer h6,
footer .footer-heading {
    color: var(--firefly-gold) !important;
    font-size: 1rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    margin-bottom: 1.25rem;
}

/* Footer description text */
footer p {
    color: var(--firefly-text-secondary);
    line-height: 1.7;
}

/* Footer links - gold color */
footer a {
    color: var(--firefly-gold);
    text-decoration: none;
    transition: color 0.3s ease;
    font-size: 0.9rem;
}

footer a:hover {
    color: var(--firefly-gold-light);
}

/* Footer icons next to contact info */
footer i.bi {
    color: var(--firefly-gold) !important;
}

/* Navigation button in footer - gold outline */
footer .btn-outline-secondary,
footer .btn-outline-primary,
footer .btn {
    border-color: var(--firefly-gold) !important;
    color: var(--firefly-gold) !important;
    background: transparent !important;
}

footer .btn:hover {
    background: rgba(212, 168, 67, 0.1) !important;
    color: var(--firefly-gold-light) !important;
}

/* Social links - gold circles */
footer .social-links a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--firefly-gold);
    color: var(--firefly-gold);
    font-size: 1.1rem;
    transition: all 0.3s ease;
}

footer .social-links a:hover {
    color: var(--firefly-bg-primary);
    border-color: var(--firefly-gold);
    background: var(--firefly-gold);
}

/* Opening hours in footer - day names gold */
footer table,
footer .opening-hours {
    color: var(--firefly-text-secondary);
}

footer table td:first-child,
footer table th:first-child {
    color: var(--firefly-gold) !important;
    font-weight: 600;
}

footer table td,
footer table th {
    color: var(--firefly-text-secondary) !important;
    border-color: var(--firefly-divider) !important;
}

/* Footer bottom bar - gold company name */
footer .footer-bottom {
    border-top: 1px solid rgba(212, 168, 67, 0.2);
    padding-top: 1.5rem;
    margin-top: 2rem;
    font-size: 0.85rem;
    color: var(--firefly-text-muted);
}

footer .footer-bottom strong,
footer .footer-bottom b {
    color: var(--firefly-gold);
}

/*--------------------------------------------------------------
# Gallery Section
--------------------------------------------------------------*/
.gallery-section {
    background: var(--firefly-bg-primary);
}

/* Fix image orientation from EXIF data and crop to fill */
.gallery-section img {
    border-radius: var(--firefly-radius-lg);
    transition: var(--firefly-transition);
    image-orientation: from-image;
}

.gallery-section .gallery-item-image img {
    object-fit: cover !important;
    image-orientation: from-image;
}

.gallery-section img:hover {
    transform: scale(1.02);
    box-shadow: var(--firefly-shadow-hover);
}

/* Section subtitle - visible on dark background */
.gallery-section .text-muted {
    color: var(--firefly-text-secondary) !important;
    font-size: 1.05rem;
}

/* Gallery captions - gold, centered, bordered, rounded */
.gallery-section .gallery-caption {
    text-align: center !important;
    padding: 0.6rem 1rem;
    margin-top: 0.75rem !important;
    border: 1px solid var(--firefly-gold);
    border-radius: 8px;
    background: rgba(212, 168, 67, 0.08);
}

.gallery-section .gallery-caption p {
    color: var(--firefly-gold) !important;
    font-size: 0.95rem !important;
    font-weight: 600;
    margin: 0;
}

/* Gallery item hover glow */
.gallery-section .gallery-item {
    border-radius: var(--firefly-radius-lg);
    overflow: hidden;
    border: 1px solid var(--firefly-border);
    transition: all 0.3s ease;
}

.gallery-section .gallery-item:hover {
    border-color: var(--firefly-gold);
    box-shadow: 0 4px 20px rgba(212, 168, 67, 0.15);
}

/* Override the blue overlay on hover */
.gallery-section .gallery-item::after {
    background: rgba(212, 168, 67, 0.6) !important;
}

/*--------------------------------------------------------------
# Scroll-to-Top Button
--------------------------------------------------------------*/
.scroll-top {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--firefly-bg-card);
    color: var(--firefly-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: var(--firefly-shadow-card);
    transition: var(--firefly-transition);
    z-index: 999;
}

.scroll-top:hover {
    background: var(--firefly-gold);
    color: #111111;
}

@media (max-width: 767px) {
    .scroll-top {
        bottom: 16px;
        right: 16px;
        width: 44px;
        height: 44px;
    }
}

/*--------------------------------------------------------------
# Product Cards (E-commerce)
--------------------------------------------------------------*/
.product-card {
    background: var(--firefly-bg-card);
    border-radius: var(--firefly-radius-lg);
    border: 1px solid transparent;
    transition: var(--firefly-transition);
}

.product-card:hover {
    border-color: var(--firefly-divider);
    box-shadow: var(--firefly-shadow-gold-glow);
}

.product-price {
    color: var(--firefly-gold);
    font-weight: 700;
}

/*--------------------------------------------------------------
# Focus States (Accessibility)
--------------------------------------------------------------*/
*:focus-visible {
    outline: 2px solid var(--firefly-gold);
    outline-offset: 2px;
}

button:focus:not(:focus-visible),
a:focus:not(:focus-visible) {
    outline: none;
}

/*--------------------------------------------------------------
# Utility Classes
--------------------------------------------------------------*/
.text-gold {
    color: var(--firefly-gold) !important;
}

.bg-firefly-card {
    background-color: var(--firefly-bg-card) !important;
}

.bg-firefly-secondary {
    background-color: var(--firefly-bg-secondary) !important;
}

.border-firefly-divider {
    border-color: var(--firefly-divider) !important;
}

/*--------------------------------------------------------------
# Responsive Overrides
--------------------------------------------------------------*/
@media (max-width: 767px) {
    h1 { font-size: 2rem; }
    h2 { font-size: 1.5rem; }

    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

@media (min-width: 768px) and (max-width: 1024px) {
    .container {
        padding-left: 2rem;
        padding-right: 2rem;
    }
}