/**
 * Launch Lab Studio - Theme Custom Stylesheet
 * Brand Identity Palette:
 * - Primary Deep Green:   #0E1A14
 * - Secondary Green:      #2F3E36
 * - Accent Gold:          #B8955A
 * - Background Light:     #F4F1EA (Warm Alabaster)
 * Full Support for Light Theme (Default) & Dark Theme (.dark-scheme)
 * Fonts: Playfair Display / Alexandria (Headings) & Poppins / Readex Pro (Body)
 * 100% Clean Modern Aesthetic - NO Emojis
 */

/* ==========================================================================
   1. CORE DESIGN TOKENS & DUAL-SCHEME VARIABLES
   ========================================================================== */
:root {
    /* Brand Gold Palette */
    --clb-color-primary: #B8955A;
    --lls-accent-gold: #B8955A;
    --lls-accent-gold-hover: #C8A66B;
    --lls-accent-gold-dark: #9E7E45;
    --lls-accent-gold-glow: rgba(184, 149, 90, 0.35);
    --lls-accent-gold-soft: rgba(184, 149, 90, 0.12);
    --lls-accent-gold-border: rgba(184, 149, 90, 0.28);

    /* Brand Forest Greens */
    --lls-primary-deep-green: #0E1A14;
    --lls-secondary-green: #2F3E36;

    /* Default Light Scheme Tokens (Warm Alabaster & White Cards) */
    --lls-bg: #F4F1EA;
    --lls-surface-card: #FFFFFF;
    --lls-surface-card-alt: #EBE7DE;
    --lls-border: rgba(184, 149, 90, 0.22);
    --lls-border-hover: rgba(184, 149, 90, 0.55);
    --lls-text-title: #0E1A14;
    --lls-text-body: #2F3E36;
    --lls-text-muted: #687970;
    --lls-input-bg: #FFFFFF;
    --lls-input-border: #D5CFC3;
    --lls-input-text: #0E1A14;

    /* Typography Tokens */
    --font-heading: 'Playfair Display', Georgia, 'Times New Roman', serif;
    --font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-arabic-heading: 'Alexandria', 'Playfair Display', sans-serif;
    --font-arabic-body: 'Readex Pro', 'Poppins', sans-serif;

    /* Metrics */
    --lls-radius-pill: 9999px;
    --lls-radius-card: 16px;
    --lls-radius-sm: 8px;
    --lls-spring: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Dark Scheme Token Overrides */
body.dark-scheme,
.dark-scheme {
    --lls-bg: #0E1A14;
    --lls-surface-card: #14221B;
    --lls-surface-card-alt: #0B1510;
    --lls-border: rgba(184, 149, 90, 0.22);
    --lls-border-hover: rgba(184, 149, 90, 0.6);
    --lls-text-title: #FFFFFF;
    --lls-text-body: #C8D6CF;
    --lls-text-muted: #9EAEA5;
    --lls-input-bg: #0B1510;
    --lls-input-border: rgba(184, 149, 90, 0.25);
    --lls-input-text: #F4F1EA;
}


.vc_row:not(.-nospace).portfolio-grid,
.vc_row:not(.-nospace).blog-posts,
.vc_row:not(.-nospace).archive-holder {
    padding-top: 20px !important;
    margin-top: 69px !important;
}
}

/* ==========================================================================
   2. BASE RESETS & DUAL-SCHEME TYPOGRAPHY
   ========================================================================== */
body {
    font-family: var(--font-body) !important;
    -webkit-font-smoothing: antialiased;
    margin: 0;
    transition: background-color 0.3s ease, color 0.3s ease;
}

/* --- LIGHT THEME (DEFAULT) --- */
body:not(.dark-scheme),
.light-scheme,
body:not(.dark-scheme) #page,
body:not(.dark-scheme) .site,
body:not(.dark-scheme) .site-content,
body:not(.dark-scheme) .site-content .page-container {
    background-color: var(--lls-bg) !important;
    color: var(--lls-text-body);
}

body:not(.dark-scheme) h1,
body:not(.dark-scheme) h2,
body:not(.dark-scheme) h3,
body:not(.dark-scheme) h4,
body:not(.dark-scheme) h5,
body:not(.dark-scheme) h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #0E1A14;
    letter-spacing: -0.015em;
    line-height: 1.25;
}

body:not(.dark-scheme) .section-title,
body:not(.dark-scheme) .project-headline,
body:not(.dark-scheme) .contact-main-title,
body:not(.dark-scheme) .projects-title,
body:not(.dark-scheme) .services-title {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #0E1A14;
    letter-spacing: -0.015em;
    line-height: 1.25;
}

/* --- DARK THEME (WHEN TOGGLED) --- */
body.dark-scheme,
.dark-scheme,
body.dark-scheme #page,
body.dark-scheme .site,
body.dark-scheme .site-content,
body.dark-scheme .site-content .page-container {
    background-color: #0E1A14 !important;
    color: #C8D6CF;
}

body.dark-scheme h1,
body.dark-scheme h2,
body.dark-scheme h3,
body.dark-scheme h4,
body.dark-scheme h5,
body.dark-scheme h6 {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: -0.015em;
    line-height: 1.25;
}

body.dark-scheme .section-title,
body.dark-scheme .project-headline,
body.dark-scheme .contact-main-title,
body.dark-scheme .projects-title,
body.dark-scheme .services-title {
    font-family: var(--font-heading);
    font-weight: 700;
    color: #FFFFFF;
    letter-spacing: -0.015em;
    line-height: 1.25;
}

/* Container */
.child-project-container {
    max-width: 1240px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* ==========================================================================
   3. LUXURY BRAND GOLD BUTTONS (#B8955A - GOLD CAPSULE / PILL)
   High contrast, crystal clear readability (#0E1A14 text on #B8955A gold)
   ========================================================================== */
.lls-btn-pill,
a.lls-btn-pill,
.child-btn-primary,
button.child-btn-primary,
.submit-contact-btn,
button.submit-contact-btn,
#contact-submit-btn,
.header-button a,
.header-nav .btn-primary,
.site-header .button,
.overlay-action-btn,
.page-numbers.current,
.page-numbers span.current {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.65rem !important;
    padding: 0.85rem 1.85rem !important;
    border-radius: var(--lls-radius-pill) !important;
    background: #B8955A !important;
    background-color: #B8955A !important;
    color: #0E1A14 !important;
    -webkit-text-fill-color: #0E1A14 !important;
    font-family: var(--font-body) !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    border: 1px solid #B8955A !important;
    box-shadow: 0 4px 18px rgba(184, 149, 90, 0.35) !important;
    transition: all 0.28s var(--lls-spring) !important;
    cursor: pointer !important;
}

.lls-btn-pill:hover,
a.lls-btn-pill:hover,
.child-btn-primary:hover,
button.child-btn-primary:hover,
.submit-contact-btn:hover,
button.submit-contact-btn:hover,
#contact-submit-btn:hover,
.header-button a:hover,
.header-nav .btn-primary:hover,
.site-header .button:hover,
.overlay-action-btn:hover {
    background: #C8A66B !important;
    background-color: #C8A66B !important;
    color: #0E1A14 !important;
    -webkit-text-fill-color: #0E1A14 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 25px rgba(184, 149, 90, 0.5) !important;
}

/* Secondary / Outline Button */
.child-btn-outline {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 0.6rem !important;
    padding: 0.85rem 1.75rem !important;
    border-radius: var(--lls-radius-pill) !important;
    font-family: var(--font-body) !important;
    font-weight: 600 !important;
    font-size: 0.92rem !important;
    letter-spacing: 0.03em !important;
    background: transparent !important;
    border: 1px solid #B8955A !important;
    color: #B8955A !important;
    text-decoration: none !important;
    transition: all 0.25s var(--lls-spring) !important;
}

.child-btn-outline:hover {
    background: #B8955A !important;
    color: #0E1A14 !important;
    -webkit-text-fill-color: #0E1A14 !important;
    box-shadow: 0 4px 16px rgba(184, 149, 90, 0.35) !important;
    transform: translateY(-2px) !important;
}

/* Button Circle Arrow Icon (Dark Pill Inside Gold Capsule) */
.lls-btn-pill .btn-circle-arrow,
.submit-contact-btn .btn-circle-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    background: #0E1A14;
    color: #B8955A;
    transition: all 0.3s var(--lls-spring);
}

.lls-btn-pill:hover .btn-circle-arrow,
.submit-contact-btn:hover .btn-circle-arrow {
    transform: translateX(4px);
    background: #0E1A14;
    color: #FFFFFF;
}

[dir="rtl"] .lls-btn-pill:hover .btn-circle-arrow,
[dir="rtl"] .submit-contact-btn:hover .btn-circle-arrow {
    transform: translateX(-4px) rotate(180deg);
}

/* ==========================================================================
   4. GLASS & SURFACE CARDS (LIGHT & DARK SCHEME)
   ========================================================================== */
.child-glass-card,
.launchlab-contact-wrapper,
.project-meta-grid,
.project-showcase-card,
.launchlab-service-card,
.blog-card,
.post-item,
.ohio-card,
article.post,
.project-share-card,
.nav-prev,
.nav-next {
    border-radius: var(--lls-radius-card);
    transition: all 0.35s var(--lls-spring);
}

/* Light Scheme Cards (Pure Crisp White on Warm Alabaster) */
body:not(.dark-scheme) .child-glass-card,
body:not(.dark-scheme) .launchlab-contact-wrapper,
body:not(.dark-scheme) .project-meta-grid,
body:not(.dark-scheme) .project-showcase-card,
body:not(.dark-scheme) .launchlab-service-card,
body:not(.dark-scheme) .blog-card,
body:not(.dark-scheme) .post-item,
body:not(.dark-scheme) .ohio-card,
body:not(.dark-scheme) article.post,
body:not(.dark-scheme) .project-share-card,
body:not(.dark-scheme) .nav-prev,
body:not(.dark-scheme) .nav-next {
    background: #FFFFFF !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    box-shadow: 0 10px 30px -10px rgba(14, 26, 20, 0.07), 0 2px 8px -2px rgba(14, 26, 20, 0.04) !important;
}

body:not(.dark-scheme) .child-glass-card:hover,
body:not(.dark-scheme) .project-showcase-card:hover,
body:not(.dark-scheme) .launchlab-service-card:hover,
body:not(.dark-scheme) .blog-card:hover,
body:not(.dark-scheme) .post-item:hover,
body:not(.dark-scheme) article.post:hover,
body:not(.dark-scheme) .nav-prev:hover,
body:not(.dark-scheme) .nav-next:hover {
    border-color: rgba(184, 149, 90, 0.55) !important;
    box-shadow: 0 20px 40px -15px rgba(184, 149, 90, 0.2), 0 4px 14px rgba(14, 26, 20, 0.06) !important;
}

/* Dark Scheme Cards (Deep Forest Green Surface) */
body.dark-scheme .child-glass-card,
body.dark-scheme .launchlab-contact-wrapper,
body.dark-scheme .project-meta-grid,
body.dark-scheme .project-showcase-card,
body.dark-scheme .launchlab-service-card,
body.dark-scheme .blog-card,
body.dark-scheme .post-item,
body.dark-scheme .ohio-card,
body.dark-scheme article.post,
body.dark-scheme .project-share-card,
body.dark-scheme .nav-prev,
body.dark-scheme .nav-next {
    background: #14221B !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    box-shadow: 0 20px 40px -15px rgba(0, 0, 0, 0.6) !important;
}

body.dark-scheme .child-glass-card:hover,
body.dark-scheme .project-showcase-card:hover,
body.dark-scheme .launchlab-service-card:hover,
body.dark-scheme .blog-card:hover {
    border-color: rgba(184, 149, 90, 0.6) !important;
    box-shadow: 0 24px 48px -15px rgba(0, 0, 0, 0.7), 0 0 30px -5px rgba(184, 149, 90, 0.3) !important;
}

/* ==========================================================================
   5. BRAND BADGES, TAGS & STATUS INDICATORS (#B8955A)
   ========================================================================== */
.sub-badge,
.status-indicator,
.cat-pill,
.post-badge,
.post-tag-pill,
.post-tags a,
.service-chip-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.35rem 0.95rem;
    border-radius: var(--lls-radius-pill);
    background: rgba(184, 149, 90, 0.12) !important;
    color: #B8955A !important;
    border: 1px solid rgba(184, 149, 90, 0.28) !important;
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    text-decoration: none !important;
    transition: all 0.2s ease;
}

.sub-badge:hover,
.post-badge:hover,
.post-tags a:hover {
    background: #B8955A !important;
    color: #0E1A14 !important;
}

.status-indicator {
    padding: 0.35rem 0.85rem;
    margin-bottom: 1rem;
}

.status-text {
    font-size: 0.78rem;
    font-weight: 700;
    color: #B8955A !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.pulse-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #B8955A !important;
    box-shadow: 0 0 0 0 rgba(184, 149, 90, 0.7);
    animation: goldPulse 2s infinite;
}

@keyframes goldPulse {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(184, 149, 90, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 8px rgba(184, 149, 90, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(184, 149, 90, 0);
    }
}

/* ==========================================================================
   6. CONTACT US FORM WIDGET (LIGHT & DARK SCHEME)
   ========================================================================== */
.launchlab-contact-wrapper {
    padding: 2.75rem 2.25rem;
    position: relative;
    border-radius: 20px;
}

.contact-header-block {
    margin-bottom: 2rem;
}

.contact-main-title {
    font-size: 1.85rem;
    font-weight: 700;
    margin: 0 0 0.5rem 0;
    line-height: 1.25;
}

.contact-sub-title {
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0;
}

body:not(.dark-scheme) .contact-main-title {
    color: #0E1A14 !important;
}

body:not(.dark-scheme) .contact-sub-title {
    color: #4B5E54 !important;
}

body.dark-scheme .contact-main-title {
    color: #FFFFFF !important;
}

body.dark-scheme .contact-sub-title {
    color: #9EAEA5 !important;
}

/* Interactive Form Layout */
.launchlab-interactive-form {
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
}

.form-grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 600px) {
    .form-grid-2col {
        grid-template-columns: 1fr;
    }
}

.form-group {
    display: flex;
    flex-direction: column;
    gap: 0.45rem;
}

.form-label {
    font-size: 0.85rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

body:not(.dark-scheme) .form-label {
    color: #0E1A14 !important;
}

body.dark-scheme .form-label {
    color: #F4F1EA !important;
}

.form-label .required {
    color: #B8955A !important;
}

.input-icon-wrap {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
}

.input-icon,
.launchlab-contact-wrapper .input-icon {
    position: absolute;
    left: 1.15rem !important;
    right: auto !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    color: #B8955A !important;
    pointer-events: none;
    z-index: 5 !important;
}

[dir="rtl"] .input-icon,
[dir="rtl"] .launchlab-contact-wrapper .input-icon {
    left: auto !important;
    right: 1.15rem !important;
}

/* Inputs in Light & Dark Modes */
.form-input,
.launchlab-contact-wrapper input.form-input,
.launchlab-contact-wrapper select.form-input,
.launchlab-contact-wrapper .form-input {
    width: 100% !important;
    padding: 0.95rem 1.15rem 0.95rem 3.25rem !important;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 0.95rem;
    outline: none;
    transition: all 0.25s var(--lls-spring);
    box-sizing: border-box !important;
}

[dir="rtl"] .form-input,
[dir="rtl"] .launchlab-contact-wrapper input.form-input,
[dir="rtl"] .launchlab-contact-wrapper select.form-input,
[dir="rtl"] .launchlab-contact-wrapper .form-input {
    padding: 0.95rem 3.25rem 0.95rem 1.15rem !important;
    text-align: right !important;
}

/* Light Scheme Inputs */
body:not(.dark-scheme) .form-input {
    background: #FFFFFF !important;
    border: 1px solid #D5CFC3 !important;
    color: #0E1A14 !important;
}

body:not(.dark-scheme) .form-input:focus {
    border-color: #B8955A !important;
    background: #FFFFFF !important;
    box-shadow: 0 0 0 3px rgba(184, 149, 90, 0.2) !important;
}

body:not(.dark-scheme) .form-input::placeholder {
    color: #8C9890 !important;
}

/* Dark Scheme Inputs */
body.dark-scheme .form-input {
    background: #0B1510 !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    color: #F4F1EA !important;
}

body.dark-scheme .form-input:focus {
    border-color: #B8955A !important;
    background: #14221B !important;
    box-shadow: 0 0 0 3px rgba(184, 149, 90, 0.3) !important;
}

body.dark-scheme .form-input::placeholder {
    color: #6B7B72 !important;
}

/* Custom Select Dropdown Arrow */
.form-select {
    appearance: none;
    cursor: pointer;
    background-image: url("data:image/svg+xml,%3Csvg width='12' height='8' viewBox='0 0 12 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' stroke='%23B8955A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
}

[dir="rtl"] .form-select {
    background-position: left 1rem center;
}

body:not(.dark-scheme) .form-select option {
    background: #FFFFFF;
    color: #0E1A14;
}

body.dark-scheme .form-select option {
    background: #14221B;
    color: #F4F1EA;
}

.form-textarea {
    resize: vertical;
    min-height: 100px;
    padding-left: 1rem;
}

[dir="rtl"] .form-textarea {
    padding-right: 1rem;
    padding-left: 1rem;
}

/* Submit Contact Button */
.submit-contact-btn {
    width: 100%;
    padding: 1.05rem 1.75rem !important;
    font-size: 0.98rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
    text-transform: uppercase !important;
    margin-top: 0.75rem;
}

/* Confirmation Success Card */
.form-success-card {
    text-align: center;
    padding: 2.25rem 1.5rem;
    animation: fadeInScale 0.4s var(--lls-spring);
}

@keyframes fadeInScale {
    from {
        opacity: 0;
        transform: scale(0.96);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.success-gold-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 68px;
    height: 68px;
    border-radius: 50%;
    background: rgba(184, 149, 90, 0.15) !important;
    border: 2px solid #B8955A !important;
    color: #B8955A !important;
    margin-bottom: 1.25rem;
    box-shadow: 0 0 25px rgba(184, 149, 90, 0.35) !important;
    animation: goldPulse 2.5s infinite;
}

.success-title {
    font-size: 1.4rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    font-family: var(--font-heading) !important;
}

body:not(.dark-scheme) .success-title {
    color: #0E1A14 !important;
}

body.dark-scheme .success-title {
    color: #FFFFFF !important;
}

.success-desc {
    font-size: 0.95rem;
    line-height: 1.7;
    max-width: 480px;
    margin: 0 auto 1.75rem auto;
}

body:not(.dark-scheme) .success-desc {
    color: #2F3E36 !important;
}

body.dark-scheme .success-desc {
    color: #C8D6CF !important;
}

.success-actions-row {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
}

.success-wa-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.6rem;
    padding: 0.85rem 1.75rem;
    border-radius: var(--lls-radius-pill);
    background: #25D366;
    color: #FFFFFF !important;
    font-weight: 700;
    font-size: 0.92rem;
    text-decoration: none !important;
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
    transition: all 0.25s var(--lls-spring);
    width: 100%;
    max-width: 380px;
}

.success-wa-btn:hover {
    background: #20BA59;
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(37, 211, 102, 0.45);
}

.success-reset-btn {
    background: transparent;
    border: none;
    color: var(--lls-text-muted);
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: underline;
    transition: color 0.2s ease;
    padding: 0.4rem;
}

.success-reset-btn:hover {
    color: #B8955A !important;
}

/* Compact Concierge Strip */
.compact-concierge-strip {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.75rem;
    margin-top: 1.5rem;
    padding-top: 1.25rem;
    border-top: 1px solid var(--lls-border);
}

.concierge-tag {
    font-size: 0.76rem;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

body:not(.dark-scheme) .concierge-tag {
    color: #687970 !important;
}

body.dark-scheme .concierge-tag {
    color: #9EAEA5 !important;
}

.concierge-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.85rem;
    border-radius: var(--lls-radius-pill);
    font-size: 0.8rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: all 0.2s var(--lls-spring);
}

body:not(.dark-scheme) .concierge-chip {
    background: #FFFFFF !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    color: #0E1A14 !important;
}

body.dark-scheme .concierge-chip {
    background: #0B1510 !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    color: #F4F1EA !important;
}

.concierge-chip.-wa {
    color: #25D366 !important;
}

.concierge-chip.-wa:hover {
    background: rgba(37, 211, 102, 0.12) !important;
    border-color: #25D366 !important;
}

.concierge-chip.-phone:hover {
    background: rgba(184, 149, 90, 0.15) !important;
    border-color: #B8955A !important;
    color: #B8955A !important;
}

.concierge-location {
    font-size: 0.76rem;
    font-weight: 500;
}

body:not(.dark-scheme) .concierge-location {
    color: #687970 !important;
}

body.dark-scheme .concierge-location {
    color: #9EAEA5 !important;
}

/* ==========================================================================
   7. PROJECTS SHOWCASE WIDGET
   ========================================================================== */
.launchlab-projects-showcase-section {
    width: 100%;
    margin-bottom: 4rem;
}

.projects-section-header {
    text-align: center;
    margin-bottom: 2.5rem;
}

.projects-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    margin: 0.5rem 0;
    line-height: 1.2;
}

.projects-desc {
    font-size: 1.05rem;
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.6;
}

body:not(.dark-scheme) .projects-desc {
    color: #2F3E36 !important;
}

body.dark-scheme .projects-desc {
    color: #9EAEA5 !important;
}

/* ==========================================================================
   UNIFIED LUXURY FILTER HUB (Merged Categories + Sliding Country Bar)
   ========================================================================== */
.projects-filter-bar-wrapper {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-bottom: 2.75rem;
    box-sizing: border-box;
    padding: 0 0.5rem;
}

.projects-unified-filter-hub {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.75rem;
    width: 100%;
    max-width: 1060px;
    padding: 0.9rem 1.25rem;
    border-radius: 26px;
    box-sizing: border-box;
    transition: all 0.3s ease;
}

/* Light scheme unified hub */
body:not(.dark-scheme) .projects-unified-filter-hub {
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(184, 149, 90, 0.22);
    box-shadow: 0 10px 32px rgba(184, 149, 90, 0.08), 0 2px 6px rgba(0, 0, 0, 0.02);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
}

/* Dark scheme unified hub */
body.dark-scheme .projects-unified-filter-hub {
    background: rgba(14, 26, 20, 0.65);
    border: 1px solid rgba(184, 149, 90, 0.2);
    box-shadow: 0 12px 38px rgba(0, 0, 0, 0.3);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

/* Fine Gold Divider between Category & Country tiers */
.filter-hub-divider {
    width: 92%;
    max-width: 680px;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(184, 149, 90, 0.28), transparent);
    margin: 0.15rem 0;
}

/* Tiers */
.filter-tier-categories,
.filter-tier-countries {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
}

.filter-country-slider-container {
    width: 100%;
    position: relative;
    display: flex;
    justify-content: center;
    min-width: 0;
}

/* Scroll Tracks */
.projects-filter-scroll-container {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0.35rem 0.5rem;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.projects-filter-scroll-container::-webkit-scrollbar {
    display: none;
    width: 0;
    height: 0;
}

/* Desktop layout: centered wrap */
@media (min-width: 992px) {
    .projects-filter-scroll-container {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* Tablet layout */
@media (max-width: 991px) and (min-width: 769px) {
    .projects-filter-scroll-container {
        justify-content: flex-start;
        width: 100%;
    }
}

/* Base Filter Pill Button */
.filter-pill-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.52rem;
    padding: 0.58rem 1.25rem;
    border-radius: var(--lls-radius-pill, 9999px);
    font-size: 0.82rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    white-space: nowrap;
    flex-shrink: 0;
    line-height: 1.2;
    outline: none;
    -webkit-tap-highlight-color: transparent;
    transition: all 0.22s var(--lls-spring, cubic-bezier(0.16, 1, 0.3, 1));
}

/* Specific styling for Country Pills */
.filter-country-pill {
    padding: 0.48rem 1.15rem;
    font-size: 0.8rem;
    gap: 0.5rem;
}

/* Light scheme button styles */
body:not(.dark-scheme) .filter-pill-btn {
    background: #FFFFFF !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    color: #2F3E36 !important;
    -webkit-text-fill-color: #2F3E36 !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.03);
}

body:not(.dark-scheme) .filter-pill-btn:hover {
    color: #0E1A14 !important;
    -webkit-text-fill-color: #0E1A14 !important;
    border-color: #B8955A !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(184, 149, 90, 0.18);
}

/* Dark scheme button styles */
body.dark-scheme .filter-pill-btn {
    background: #14221B !important;
    border: 1px solid rgba(184, 149, 90, 0.2) !important;
    color: #C8D6CF !important;
    -webkit-text-fill-color: #C8D6CF !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
}

body.dark-scheme .filter-pill-btn:hover {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    border-color: #B8955A !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(184, 149, 90, 0.28);
}

/* Mobile Experience & Smooth Country Sliding ("وخلي ف موبيل ممكن يسليد ويختار بلد") */
@media (max-width: 768px) {
    .projects-filter-bar-wrapper {
        margin-bottom: 1.85rem;
        padding: 0 0.35rem;
    }
    .projects-unified-filter-hub {
        padding: 0.65rem 0.45rem;
        border-radius: 20px;
        gap: 0.55rem;
    }
    .filter-tier-categories .projects-filter-scroll-container {
        justify-content: flex-start;
        flex-wrap: nowrap;
        padding: 0.25rem 0.5rem;
        gap: 0.45rem;
    }
    .filter-tier-categories .filter-pill-btn {
        padding: 0.48rem 0.95rem !important;
        font-size: 0.78rem !important;
    }
    /* Dedicated Swipe Slider for Countries on Mobile */
    .filter-country-slider-container {
        position: relative;
        /* Smooth Edge Gradient Mask to clearly indicate horizontal swiping */
        mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
        -webkit-mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
    }
    .filter-country-slider-container .filter-country-track {
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        padding: 0.35rem 1.15rem;
        gap: 0.5rem;
        scroll-snap-type: x mandatory;
        scroll-padding: 0 1rem;
    }
    .filter-country-pill {
        scroll-snap-align: center;
        padding: 0.45rem 0.95rem !important;
        font-size: 0.78rem !important;
        gap: 0.42rem !important;
    }
}

body.dark-scheme .filter-pill-btn:hover {
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    border-color: #B8955A !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(184, 149, 90, 0.28);
}

/* Active Filter Pill - Consistent height and padding, no layout jump */
.filter-pill-btn.is-active,
body:not(.dark-scheme) .filter-pill-btn.is-active,
body.dark-scheme .filter-pill-btn.is-active {
    background: #B8955A !important;
    background-color: #B8955A !important;
    color: #0E1A14 !important;
    -webkit-text-fill-color: #0E1A14 !important;
    border: 1px solid #B8955A !important;
    box-shadow: 0 4px 16px rgba(184, 149, 90, 0.38) !important;
    font-weight: 700 !important;
    transform: translateY(-1px);
}

.filter-pill-btn svg {
    flex-shrink: 0;
    transition: stroke 0.25s ease;
    stroke: currentColor;
}

.filter-pill-btn.is-active svg {
    stroke: #0E1A14 !important;
}

/* Count badge inside filter buttons (e.g. All Works count) */
.filter-count-badge,
.filter-code-badge:not(:has(.filter-flag-img)) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 22px;
    height: 18px;
    padding: 0 6px;
    border-radius: 9999px;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 18px;
    transition: all 0.2s ease;
    flex-shrink: 0;
    border: none !important;
}

body:not(.dark-scheme) .filter-pill-btn:not(.is-active) .filter-count-badge,
body:not(.dark-scheme) .filter-pill-btn:not(.is-active) .filter-code-badge:not(:has(.filter-flag-img)) {
    background: rgba(14, 26, 20, 0.08) !important;
    color: #2F3E36 !important;
    -webkit-text-fill-color: #2F3E36 !important;
}

body.dark-scheme .filter-pill-btn:not(.is-active) .filter-count-badge,
body.dark-scheme .filter-pill-btn:not(.is-active) .filter-code-badge:not(:has(.filter-flag-img)) {
    background: rgba(255, 255, 255, 0.12) !important;
    color: #E0EAE5 !important;
    -webkit-text-fill-color: #E0EAE5 !important;
}

.filter-pill-btn.is-active .filter-count-badge,
.filter-pill-btn.is-active .filter-code-badge:not(:has(.filter-flag-img)) {
    background: #0E1A14 !important;
    color: #FFFFFF !important;
    -webkit-text-fill-color: #FFFFFF !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

/* Flag wrapper & img in Country buttons */
.filter-flag-wrap,
.filter-code-badge:has(.filter-flag-img) {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    flex-shrink: 0;
}

.filter-flag-img {
    width: 22px;
    height: 15px;
    object-fit: cover;
    border-radius: 3px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.22);
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Flag image in card badges */
.card-flag-img {
    width: 18px;
    height: 12px;
    object-fit: cover;
    border-radius: 2px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
    display: inline-block;
    vertical-align: middle;
    flex-shrink: 0;
}

.filter-globe-icon {
    display: inline-block;
    vertical-align: middle;
    color: inherit;
    flex-shrink: 0;
}

/* Projects Cards Grid (4 Columns Layout Matching Reference Design) */
.launchlab-projects-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.4rem;
    width: 100%;
}

@media (max-width: 1200px) {
    .launchlab-projects-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 1.25rem;
    }
}

@media (max-width: 900px) {
    .launchlab-projects-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.15rem;
    }
}

@media (max-width: 600px) {
    .launchlab-projects-grid {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
}

/* Individual Showcase Card */
.project-showcase-card {
    border-radius: 18px;
    overflow: hidden;
    position: relative;
    background: #FFFFFF !important;
    border: 1px solid rgba(0, 0, 0, 0.06) !important;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04) !important;
    transition: transform 0.35s var(--lls-spring), box-shadow 0.35s var(--lls-spring), border-color 0.35s ease;
    display: flex;
    flex-direction: column;
}

.project-showcase-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 16px 36px -6px rgba(0, 0, 0, 0.1) !important;
    border-color: rgba(184, 149, 90, 0.45) !important;
}

body.dark-scheme .project-showcase-card {
    background: #14221B !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4) !important;
}

body.dark-scheme .project-showcase-card:hover {
    border-color: rgba(184, 149, 90, 0.6) !important;
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.6), 0 0 25px -5px rgba(184, 149, 90, 0.25) !important;
}

.project-showcase-card.is-hidden {
    display: none;
}

.card-clickable-area {
    text-decoration: none !important;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
    width: 100%;
}

/* Card Media / Image */
.card-media-wrap {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 10;
    overflow: hidden;
    background: #EBE7DE;
}

body.dark-scheme .card-media-wrap {
    background: #0B1510;
}

.project-card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.6s var(--lls-spring);
}

.project-showcase-card:hover .project-card-img {
    transform: scale(1.04);
}

/* Hide glass hover overlay to keep image clean and visible */
.card-glass-hover-overlay {
    display: none !important;
}

.country-flag-badge {
    position: absolute;
    top: 1rem;
    left: 1rem;
    z-index: 3;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.35rem 0.8rem;
    border-radius: var(--lls-radius-pill);
    background: rgba(14, 26, 20, 0.85);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(184, 149, 90, 0.3);
    color: #B8955A;
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.category-tag-pill {
    position: absolute;
    bottom: 1rem;
    left: 1rem;
    z-index: 3;
    padding: 0.3rem 0.75rem;
    border-radius: 6px;
    background: rgba(47, 62, 54, 0.95);
    backdrop-filter: blur(8px);
    color: #F4F1EA;
    font-size: 0.75rem;
    font-weight: 600;
    border: 1px solid rgba(184, 149, 90, 0.25);
}

/* Card Information Area */
.card-info-wrap {
    padding: 1.25rem 1.4rem 1.5rem;
    display: flex;
    flex-direction: column;
    flex: 1;
    justify-content: flex-start;
}

.card-header-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
}

.card-project-title {
    font-size: 1.15rem;
    font-weight: 700;
    margin: 0;
    line-height: 1.3;
    transition: color 0.25s ease;
    flex: 1;
}

body:not(.dark-scheme) .card-project-title {
    color: #0E1A14 !important;
}

body.dark-scheme .card-project-title {
    color: #FFFFFF !important;
}

.project-showcase-card:hover .card-project-title {
    color: #B8955A !important;
}

/* Warm Golden Circular Arrow Button */
.card-circle-arrow-btn {
    width: 36px;
    height: 36px;
    min-width: 36px;
    border-radius: 50%;
    background-color: #CCA36E;
    color: #0E1A14;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: transform 0.3s var(--lls-spring), background-color 0.3s ease, color 0.3s ease;
}

.card-circle-arrow-btn svg {
    display: block;
    width: 16px;
    height: 16px;
    stroke: currentColor;
    transition: transform 0.3s var(--lls-spring);
}

.project-showcase-card:hover .card-circle-arrow-btn {
    transform: translateX(4px);
    background-color: #B8955A;
    color: #FFFFFF;
}

/* RTL Arrow Support */
[dir="rtl"] .project-showcase-card:hover .card-circle-arrow-btn,
body.rtl .project-showcase-card:hover .card-circle-arrow-btn {
    transform: translateX(-4px);
}

[dir="rtl"] .card-circle-arrow-btn svg,
body.rtl .card-circle-arrow-btn svg {
    transform: rotate(180deg);
}

/* Excerpt / Tagline */
.card-project-excerpt {
    font-size: 0.88rem;
    line-height: 1.45;
    margin: 0.45rem 0 0 0;
    font-weight: 400;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

body:not(.dark-scheme) .card-project-excerpt {
    color: #64748B !important;
}

body.dark-scheme .card-project-excerpt {
    color: #9EAEA5 !important;
}

/* ==========================================================================
   8. SERVICES SHOWCASE WIDGET
   ========================================================================== */
.launchlab-services-showcase-section {
    width: 100%;
    margin-bottom: 4rem;
}

.services-header-wrap {
    text-align: center;
    margin-bottom: 2.75rem;
}

.services-title {
    font-size: clamp(2rem, 4vw, 3rem);
    font-weight: 800;
    margin: 0.5rem 0;
}

.services-desc {
    font-size: 1.05rem;
    max-width: 680px;
    margin: 0 auto;
    line-height: 1.6;
}

body:not(.dark-scheme) .services-desc {
    color: #2F3E36 !important;
}

body.dark-scheme .services-desc {
    color: #9EAEA5 !important;
}

.launchlab-services-grid {
    display: grid;
    gap: 1.75rem;
}

.launchlab-services-grid.grid-cols-2 {
    grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
}

.launchlab-services-grid.grid-cols-3 {
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
}

@media (max-width: 640px) {

    .launchlab-services-grid.grid-cols-2,
    .launchlab-services-grid.grid-cols-3 {
        grid-template-columns: 1fr;
    }
}

.launchlab-service-card {
    padding: 2.5rem 2rem;
    display: flex;
    flex-direction: column;
    border-radius: 16px;
    position: relative;
}

.launchlab-service-card:hover {
    transform: translateY(-8px);
}

.card-top-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 1.6rem;
}

.service-glow-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 58px;
    height: 58px;
    border-radius: 12px;
    background: rgba(184, 149, 90, 0.12) !important;
    color: #B8955A !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    transition: all 0.3s ease;
}

.launchlab-service-card:hover .service-glow-icon {
    background: #B8955A !important;
    color: #0E1A14 !important;
    box-shadow: 0 8px 20px rgba(184, 149, 90, 0.4) !important;
    transform: scale(1.05);
}

.service-name {
    font-size: 1.45rem;
    font-weight: 700;
    margin: 0 0 0.75rem 0;
    line-height: 1.3;
    transition: color 0.2s ease;
}

body:not(.dark-scheme) .service-name {
    color: #0E1A14 !important;
}

body.dark-scheme .service-name {
    color: #FFFFFF !important;
}

.launchlab-service-card:hover .service-name {
    color: #B8955A !important;
}

.service-summary {
    font-size: 0.95rem;
    line-height: 1.6;
    margin: 0 0 1.5rem 0;
}

body:not(.dark-scheme) .service-summary {
    color: #2F3E36 !important;
}

body.dark-scheme .service-summary {
    color: #9EAEA5 !important;
}

.service-features-list {
    list-style: none;
    padding: 0;
    margin: 0 0 2rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}

.service-features-list li {
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.9rem;
    font-weight: 500;
}

body:not(.dark-scheme) .service-features-list li {
    color: #2F3E36 !important;
}

body.dark-scheme .service-features-list li {
    color: #C8D6CF !important;
}

.service-action-footer {
    margin-top: auto;
    padding-top: 1.25rem;
    border-top: 1px solid var(--lls-border);
}

.service-interactive-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.85rem 1.25rem;
    border-radius: 8px;
    font-family: var(--font-body);
    font-size: 0.88rem;
    font-weight: 600;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: all 0.25s var(--lls-spring);
}

body:not(.dark-scheme) .service-interactive-btn {
    background: #F4F1EA !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    color: #0E1A14 !important;
}

body.dark-scheme .service-interactive-btn {
    background: #0B1510 !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    color: #F4F1EA !important;
}

.service-interactive-btn:hover {
    background: #B8955A !important;
    border-color: #B8955A !important;
    color: #0E1A14 !important;
    box-shadow: 0 4px 14px rgba(184, 149, 90, 0.35) !important;
}

.btn-arrow-wrap {
    display: flex;
    align-items: center;
    transition: transform 0.25s ease;
}

.service-interactive-btn:hover .btn-arrow-wrap {
    transform: translateX(4px);
}

[dir="rtl"] .service-interactive-btn:hover .btn-arrow-wrap {
    transform: translateX(-4px) rotate(180deg);
}

/* ==========================================================================
   9. SINGLE PROJECT DETAILS PAGE ENHANCEMENTS
   ========================================================================== */
.child-project-single-wrapper {
    min-height: 100vh;
    padding-bottom: 5rem;
    position: relative;
    overflow-x: hidden;
}

body:not(.dark-scheme) .child-project-single-wrapper {
    background-color: var(--lls-bg) !important;
    color: #2F3E36 !important;
}

body.dark-scheme .child-project-single-wrapper {
    background-color: #0E1A14 !important;
    color: #C8D6CF !important;
}

.project-hero-section {
    padding-top: 3.5rem;
    padding-bottom: 2.5rem;
}

/* Top Navigation / Breadcrumbs */
.project-top-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
    margin-bottom: 2rem;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid var(--lls-border);
}

.back-link {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    color: #B8955A !important;
    font-size: 0.9rem;
    font-weight: 600;
    text-decoration: none !important;
    transition: transform 0.25s var(--lls-spring), color 0.2s ease;
}

.back-link:hover {
    color: #C8A66B !important;
    transform: translateX(-4px);
}

[dir="rtl"] .back-link:hover {
    transform: translateX(4px);
}

.project-categories-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

/* Hero Content */
.hero-content {
    margin-bottom: 2.5rem;
}

.project-headline {
    font-size: clamp(2.2rem, 5vw, 3.8rem);
    font-weight: 800;
    line-height: 1.2;
    margin: 0 0 1rem 0;
    letter-spacing: -0.02em;
}

body:not(.dark-scheme) .project-headline {
    color: #0E1A14 !important;
}

body.dark-scheme .project-headline {
    color: #FFFFFF !important;
}

:lang(ar) .project-headline,
[dir="rtl"] .project-headline {
    font-family: var(--font-arabic-heading) !important;
    line-height: 1.35;
}

.project-lead {
    font-size: 1.2rem;
    max-width: 820px;
    line-height: 1.7;
    margin: 0;
}

body:not(.dark-scheme) .project-lead {
    color: #2F3E36 !important;
}

body.dark-scheme .project-lead {
    color: #9EAEA5 !important;
}

/* Key Specs Meta Grid */
.project-meta-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 1.5rem;
    padding: 2rem 2.5rem;
    border-radius: 16px;
}

.meta-col {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}

.meta-col.-action {
    display: flex;
    align-items: flex-start;
    justify-content: center;
}

.meta-label {
    font-size: 0.76rem;
    color: #B8955A !important;
    text-transform: uppercase;
    letter-spacing: 0.09em;
    font-weight: 700;
}

.meta-value {
    font-size: 1.15rem;
    font-weight: 600;
}

body:not(.dark-scheme) .meta-value {
    color: #0E1A14 !important;
}

body.dark-scheme .meta-value {
    color: #FFFFFF !important;
}

/* Featured Image Banner */
.project-featured-banner {
    margin: 2.5rem 0 4rem;
}

.banner-inner {
    border-radius: 20px;
    overflow: hidden;
    border: 1px solid var(--lls-border);
    box-shadow: 0 20px 50px -15px rgba(14, 26, 20, 0.15);
}

body.dark-scheme .banner-inner {
    box-shadow: 0 30px 70px -15px rgba(0, 0, 0, 0.7), 0 0 40px -10px rgba(184, 149, 90, 0.25);
}

.featured-banner-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    transition: transform 0.8s var(--lls-spring);
}

.banner-inner:hover .featured-banner-img {
    transform: scale(1.02);
}

/* Project Body & Content */
.project-body-section {
    padding: 2rem 0 5rem;
}

.project-content-grid {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 3.5rem;
    align-items: start;
}

@media (max-width: 1024px) {
    .project-content-grid {
        grid-template-columns: 1fr;
    }
}

.content-block {
    margin-bottom: 4rem;
}

.content-section-title {
    font-size: clamp(1.8rem, 3.5vw, 2.4rem);
    font-weight: 700;
    margin: 0 0 1.75rem 0;
    position: relative;
    padding-bottom: 0.75rem;
}

body:not(.dark-scheme) .content-section-title {
    color: #0E1A14 !important;
}

body.dark-scheme .content-section-title {
    color: #FFFFFF !important;
}

.content-section-title::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 60px;
    height: 3px;
    background: #B8955A;
    border-radius: 2px;
}

[dir="rtl"] .content-section-title::after {
    left: auto;
    right: 0;
}

/* Prose Styling */
.prose-content {
    font-size: 1.05rem;
    line-height: 1.85;
}

body:not(.dark-scheme) .prose-content {
    color: #2F3E36 !important;
}

body:not(.dark-scheme) .prose-content p {
    color: #2F3E36 !important;
}

body:not(.dark-scheme) .prose-content strong,
body:not(.dark-scheme) .prose-content b {
    color: #0E1A14 !important;
}

body.dark-scheme .prose-content {
    color: #C8D6CF !important;
}

body.dark-scheme .prose-content p {
    color: #C8D6CF !important;
}

body.dark-scheme .prose-content strong,
body.dark-scheme .prose-content b {
    color: #FFFFFF !important;
}

.prose-content h2,
.prose-content h3,
.prose-content h4 {
    color: #B8955A !important;
    margin-top: 2rem;
    margin-bottom: 1rem;
    font-weight: 700;
}

.prose-content ul,
.prose-content ol {
    margin: 1.5rem 0;
    padding-left: 1.5rem;
}

[dir="rtl"] .prose-content ul,
[dir="rtl"] .prose-content ol {
    padding-left: 0;
    padding-right: 1.5rem;
}

.prose-content li {
    margin-bottom: 0.65rem;
}

body:not(.dark-scheme) .prose-content li {
    color: #2F3E36 !important;
}

body.dark-scheme .prose-content li {
    color: #C8D6CF !important;
}

/* Sidebar & Sticky Share Card */
.sidebar-sticky-wrap {
    position: sticky;
    top: 6rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.project-share-card {
    padding: 1.5rem 1.75rem;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.share-title {
    font-size: 0.88rem;
    font-weight: 600;
}

body:not(.dark-scheme) .share-title {
    color: #2F3E36 !important;
}

body.dark-scheme .share-title {
    color: #9EAEA5 !important;
}

.share-buttons {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.share-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(184, 149, 90, 0.12);
    border: 1px solid rgba(184, 149, 90, 0.28);
    color: #B8955A;
    text-decoration: none !important;
    transition: all 0.25s var(--lls-spring);
}

.share-btn:hover {
    background: #B8955A;
    color: #0E1A14 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 14px rgba(184, 149, 90, 0.35);
}

/* Related Projects Section */
.related-projects-section {
    padding: 5rem 0;
    border-top: 1px solid var(--lls-border);
}

body:not(.dark-scheme) .related-projects-section {
    background: #EBE7DE !important;
}

body.dark-scheme .related-projects-section {
    background: #0B1510 !important;
}

/* Prev / Next Project Bar */
.project-navigation-bar {
    padding: 3rem 0;
    border-top: 1px solid var(--lls-border);
}

body:not(.dark-scheme) .project-navigation-bar {
    background: #F4F1EA !important;
}

body.dark-scheme .project-navigation-bar {
    background: #0E1A14 !important;
}

.nav-links-inner {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem;
}

@media (max-width: 640px) {
    .nav-links-inner {
        grid-template-columns: 1fr;
    }
}

.nav-prev,
.nav-next {
    padding: 1.5rem 2rem;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
    text-decoration: none !important;
    border-radius: 14px;
}

.nav-prev:hover,
.nav-next:hover {
    transform: translateY(-3px);
    border-color: #B8955A !important;
    box-shadow: 0 10px 25px -5px rgba(184, 149, 90, 0.3) !important;
}

.nav-next {
    text-align: right;
}

[dir="rtl"] .nav-next {
    text-align: left;
}

[dir="rtl"] .nav-prev {
    text-align: right;
}

.nav-direction {
    font-size: 0.8rem;
    color: #B8955A !important;
    text-transform: uppercase;
    font-weight: 700;
    letter-spacing: 0.05em;
}

.nav-title {
    font-size: 1.15rem;
    font-family: var(--font-heading);
    font-weight: 600;
}

body:not(.dark-scheme) .nav-title {
    color: #0E1A14 !important;
}

body.dark-scheme .nav-title {
    color: #FFFFFF !important;
}

/* ==========================================================================
   10. BLOG & EDITORIAL ARCHIVE
   ========================================================================== */
.blog-posts-grid,
.blog-listing,
.posts-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
    gap: 2.25rem;
    margin: 3rem 0;
}

@media (max-width: 640px) {

    .blog-posts-grid,
    .blog-listing,
    .posts-grid {
        grid-template-columns: 1fr;
    }
}

.blog-card,
.post-item,
.ohio-card,
article.post {
    padding: 2.25rem 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}

.blog-card:hover,
.post-item:hover,
article.post:hover {
    transform: translateY(-6px);
}

.post-meta,
.post-date,
.entry-date {
    font-size: 0.82rem;
    font-weight: 500;
    margin-bottom: 0.75rem;
    letter-spacing: 0.02em;
}

body:not(.dark-scheme) .post-meta,
body:not(.dark-scheme) .post-date,
body:not(.dark-scheme) .entry-date {
    color: #687970 !important;
}

body.dark-scheme .post-meta,
body.dark-scheme .post-date,
body.dark-scheme .entry-date {
    color: #9EAEA5 !important;
}

.post-title,
.entry-title,
article.post h2,
article.post h3 {
    font-family: var(--font-heading) !important;
    font-size: 1.45rem;
    font-weight: 700;
    line-height: 1.35;
    margin: 0 0 1rem 0;
    transition: color 0.25s ease;
}

body:not(.dark-scheme) .post-title,
body:not(.dark-scheme) .entry-title,
body:not(.dark-scheme) article.post h2,
body:not(.dark-scheme) article.post h3 {
    color: #0E1A14;
}

body.dark-scheme .post-title,
body.dark-scheme .entry-title,
body.dark-scheme article.post h2,
body.dark-scheme article.post h3 {
    color: #FFFFFF;
}

.post-title a,
.entry-title a {
    color: inherit !important;
    text-decoration: none !important;
}

.blog-card:hover .post-title,
.post-item:hover .entry-title a {
    color: #B8955A !important;
}

/* Read More Link */
.read-more-link,
a.read-more {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: #B8955A !important;
    text-decoration: none !important;
    margin-top: auto;
    padding-top: 1.25rem;
    transition: transform 0.25s var(--lls-spring), color 0.2s ease;
}

.read-more-link svg,
a.read-more svg {
    transition: transform 0.25s var(--lls-spring);
}

.read-more-link:hover,
a.read-more:hover {
    color: #C8A66B !important;
}

.read-more-link:hover svg,
a.read-more:hover svg {
    transform: translateX(5px);
}

[dir="rtl"] .read-more-link:hover svg,
[dir="rtl"] a.read-more:hover svg {
    transform: translateX(-5px) rotate(180deg);
}

/* Pagination */
.pagination,
.ohio-pagination,
.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin: 3.5rem 0 2rem;
    list-style: none;
    padding: 0;
}

.page-numbers a,
.page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 42px;
    height: 42px;
    padding: 0 0.5rem;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none !important;
    transition: all 0.25s ease;
}

body:not(.dark-scheme) .page-numbers a,
body:not(.dark-scheme) .page-numbers span {
    background: #FFFFFF !important;
    border: 1px solid rgba(184, 149, 90, 0.25) !important;
    color: #2F3E36 !important;
}

body:not(.dark-scheme) .page-numbers a:hover {
    border-color: #B8955A !important;
    color: #B8955A !important;
    transform: translateY(-2px);
}

body.dark-scheme .page-numbers a,
body.dark-scheme .page-numbers span {
    background: #14221B !important;
    border: 1px solid rgba(184, 149, 90, 0.22) !important;
    color: #C8D6CF !important;
}

body.dark-scheme .page-numbers a:hover {
    border-color: #B8955A !important;
    color: #B8955A !important;
    transform: translateY(-2px);
}

/* ==========================================================================
   11. HEADER & NAVIGATION OVERRIDES
   ========================================================================== */
/* Header in Light Mode */
body:not(.dark-scheme) header#masthead,
body:not(.dark-scheme) .site-header {
    background-color: rgba(244, 241, 234, 0.94) !important;
    border-bottom: 1px solid rgba(184, 149, 90, 0.2) !important;
}

body:not(.dark-scheme) .main-navigation a,
body:not(.dark-scheme) .nav-menu a,
body:not(.dark-scheme) .header-nav a {
    color: #0E1A14 !important;
    font-family: var(--font-body);
    font-weight: 600;
    font-size: 0.95rem;
    transition: color 0.2s ease;
}

body:not(.dark-scheme) .main-navigation a:hover,
body:not(.dark-scheme) .nav-menu a:hover,
body:not(.dark-scheme) .header-nav a:hover,
body:not(.dark-scheme) .main-navigation .current-menu-item>a {
    color: #B8955A !important;
}

/* Header in Dark Mode */
body.dark-scheme header#masthead,
body.dark-scheme .site-header {
    background-color: rgba(14, 26, 20, 0.94) !important;
    border-bottom: 1px solid rgba(184, 149, 90, 0.2) !important;
}

body.dark-scheme .main-navigation a,
body.dark-scheme .nav-menu a,
body.dark-scheme .header-nav a {
    color: #FFFFFF !important;
    font-family: var(--font-body);
    font-weight: 500;
    font-size: 0.95rem;
    transition: color 0.2s ease;
}

body.dark-scheme .main-navigation a:hover,
body.dark-scheme .nav-menu a:hover,
body.dark-scheme .header-nav a:hover,
body.dark-scheme .main-navigation .current-menu-item>a {
    color: #B8955A !important;
}

/* Glass blur effect on header background via pseudo-element so it NEVER traps position:fixed children */
header#masthead::before {
    content: "";
    position: absolute;
    inset: 0;
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    z-index: -1;
    pointer-events: none;
}

/* Ensure no containing block or blur when mobile menu is active */
body.menu-overlay-active header#masthead::before,
header#masthead:has(.menu-slide-in-overlay.visible)::before {
    display: none !important;
}

body:not(.dark-scheme) .header-wrap,
body.dark-scheme .header-wrap {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* ==========================================================================
   11.1 DESKTOP & TABLET HEADER NAVIGATION (Screens > 768px)
   Restore 100% Native Horizontal Menu for Desktop & Tablet
   ========================================================================== */
@media screen and (min-width: 769px) {
    .header:not(.-mobile) .slide-in-overlay,
    .header:not(.-mobile) .slide-in-overlay.menu-slide-in-overlay,
    .site-header:not(.-mobile) .slide-in-overlay,
    .nav:not(.-mobile) .slide-in-overlay {
        position: static !important;
        top: auto !important;
        left: auto !important;
        right: auto !important;
        bottom: auto !important;
        width: auto !important;
        height: 100% !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        display: block !important;
        overflow: visible !important;
        z-index: auto !important;
        background: transparent !important;
        transition: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .header:not(.-mobile) .slide-in-overlay .overlay,
    .site-header:not(.-mobile) .slide-in-overlay .overlay {
        display: none !important;
    }

    .header:not(.-mobile) .slide-in-overlay .close-bar,
    .site-header:not(.-mobile) .slide-in-overlay .close-bar {
        display: none !important;
    }

    .header:not(.-mobile) .slide-in-overlay .holder,
    .site-header:not(.-mobile) .slide-in-overlay .holder {
        position: static !important;
        top: auto !important;
        left: auto !important;
        bottom: auto !important;
        right: auto !important;
        width: auto !important;
        max-width: none !important;
        height: 100% !important;
        background-color: transparent !important;
        box-shadow: none !important;
        border: none !important;
        padding: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        overflow: visible !important;
        transform: none !important;
        opacity: 1 !important;
        transition: none !important;
    }

    .header:not(.-mobile) .slide-in-overlay #mega-menu-wrap,
    .header:not(.-mobile) .slide-in-overlay .nav-container,
    .site-header:not(.-mobile) .slide-in-overlay .nav-container {
        height: 100% !important;
        display: flex !important;
        align-items: center !important;
        margin: 0 !important;
        width: auto !important;
    }

    .header:not(.-mobile) .slide-in-overlay .menu,
    .site-header:not(.-mobile) .slide-in-overlay .menu {
        display: flex !important;
        flex-direction: row !important;
        align-items: stretch !important;
        gap: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
        height: 100% !important;
    }

    .header:not(.-mobile) .slide-in-overlay .menu > li,
    .site-header:not(.-mobile) .slide-in-overlay .menu > li {
        display: inline-flex !important;
        align-items: center !important;
        height: 100% !important;
        border-bottom: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .header:not(.-mobile) .slide-in-overlay .menu > li > a,
    .site-header:not(.-mobile) .slide-in-overlay .menu > li > a {
        display: inline-flex !important;
        align-items: center !important;
        height: 100% !important;
        padding: 0 16px !important;
        font-size: 0.95rem !important;
        font-weight: 600 !important;
        background: transparent !important;
        border-radius: 0 !important;
    }

    .header:not(.-mobile) .slide-in-overlay .holder .copyright,
    .site-header:not(.-mobile) .slide-in-overlay .holder .copyright {
        display: none !important;
    }

    .header:not(.-mobile) .slide-in-overlay select.lang-dropdown,
    .site-header:not(.-mobile) .slide-in-overlay select.lang-dropdown {
        display: none !important;
    }
}

/* ==========================================================================
   11.2 MOBILE NAVIGATION DRAWER (Screens <= 768px ONLY)
   Luxury sliding drawer tailored exclusively for mobile devices
   ========================================================================== */
@media screen and (max-width: 768px) {
    /* Main Overlay Container */
    .slide-in-overlay.menu-slide-in-overlay,
    .header.-mobile .slide-in-overlay.menu-slide-in-overlay,
    .is-mobile-menu .slide-in-overlay.menu-slide-in-overlay,
    .nav .slide-in-overlay.menu-slide-in-overlay {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        z-index: 9999999 !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
        transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
        overflow: hidden !important;
        display: block !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* When Active / Visible */
    .slide-in-overlay.menu-slide-in-overlay.visible,
    .header.-mobile .slide-in-overlay.menu-slide-in-overlay.visible,
    .is-mobile-menu .slide-in-overlay.menu-slide-in-overlay.visible,
    body.menu-overlay-active .slide-in-overlay.menu-slide-in-overlay {
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        display: block !important;
    }

    /* Fullscreen Backdrop Blur & Dimming */
    .slide-in-overlay.menu-slide-in-overlay .overlay {
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100vw !important;
        height: 100vh !important;
        height: 100dvh !important;
        background: rgba(14, 26, 20, 0.72) !important;
        backdrop-filter: blur(6px) !important;
        -webkit-backdrop-filter: blur(6px) !important;
        z-index: 1 !important;
        cursor: pointer !important;
    }

    /* Luxury Drawer Panel (.holder) */
    .slide-in-overlay.menu-slide-in-overlay .holder {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        bottom: 0 !important;
        height: 100% !important;
        height: 100vh !important;
        height: 100dvh !important;
        width: min(85vw, 360px) !important;
        max-width: 100vw !important;
        z-index: 2 !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        background-color: #FFFFFF !important;
        border-right: 1px solid rgba(184, 149, 90, 0.25) !important;
        box-shadow: 10px 0 35px rgba(0, 0, 0, 0.25) !important;
        padding: 80px 24px 36px 24px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        transform: translateX(-100%) !important;
        opacity: 0 !important;
        transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.25s ease !important;
    }

    /* Dark mode drawer background */
    .dark-scheme .slide-in-overlay.menu-slide-in-overlay .holder {
        background-color: #0E1A14 !important;
        border-right: 1px solid rgba(184, 149, 90, 0.35) !important;
        box-shadow: 10px 0 45px rgba(0, 0, 0, 0.7) !important;
    }

    /* Drawer open transition */
    .slide-in-overlay.menu-slide-in-overlay.visible .holder,
    body.menu-overlay-active .slide-in-overlay.menu-slide-in-overlay .holder {
        transform: translateX(0) !important;
        opacity: 1 !important;
    }

    /* RTL Arabic Drawer on Mobile: Slides in from the RIGHT */
    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .holder,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .holder,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .holder {
        left: auto !important;
        right: 0 !important;
        border-right: none !important;
        border-left: 1px solid rgba(184, 149, 90, 0.25) !important;
        box-shadow: -10px 0 35px rgba(0, 0, 0, 0.25) !important;
        transform: translateX(100%) !important;
        text-align: right !important;
    }

    [dir="rtl"] .dark-scheme .slide-in-overlay.menu-slide-in-overlay .holder,
    body.rtl.dark-scheme .slide-in-overlay.menu-slide-in-overlay .holder,
    html[lang="ar"].dark-scheme .slide-in-overlay.menu-slide-in-overlay .holder {
        border-left: 1px solid rgba(184, 149, 90, 0.35) !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay.visible .holder,
    body.rtl .slide-in-overlay.menu-slide-in-overlay.visible .holder,
    body.rtl.menu-overlay-active .slide-in-overlay.menu-slide-in-overlay .holder,
    html[lang="ar"].menu-overlay-active .slide-in-overlay.menu-slide-in-overlay .holder {
        transform: translateX(0) !important;
    }

    /* Top Close Bar */
    .slide-in-overlay.menu-slide-in-overlay .close-bar {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        width: min(85vw, 360px) !important;
        max-width: 100vw !important;
        height: 70px !important;
        z-index: 10 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 0 20px !important;
        background: transparent !important;
        border-bottom: 1px solid rgba(184, 149, 90, 0.15) !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .close-bar,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .close-bar,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .close-bar {
        left: auto !important;
        right: 0 !important;
        flex-direction: row-reverse !important;
    }

    /* Close button - Elegant Circular Gold Badge */
    .slide-in-overlay.menu-slide-in-overlay .close-bar button[data-js="close-popup"],
    .slide-in-overlay.menu-slide-in-overlay .close-bar .icon-button.-overlay-button {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
        border-radius: 50% !important;
        background: rgba(184, 149, 90, 0.12) !important;
        border: 1px solid rgba(184, 149, 90, 0.4) !important;
        color: #B8955A !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        cursor: pointer !important;
        transition: all 0.25s ease !important;
        padding: 0 !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .close-bar button[data-js="close-popup"]:hover,
    .slide-in-overlay.menu-slide-in-overlay .close-bar .icon-button.-overlay-button:hover {
        background: #B8955A !important;
        color: #0E1A14 !important;
        transform: rotate(90deg) scale(1.06);
    }

    .slide-in-overlay.menu-slide-in-overlay .close-bar button[data-js="close-popup"] svg,
    .slide-in-overlay.menu-slide-in-overlay .close-bar button[data-js="close-popup"] i {
        width: 16px !important;
        height: 16px !important;
        stroke: currentColor !important;
        fill: currentColor !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .close-bar .icon-button.search-global {
        width: 40px !important;
        height: 40px !important;
        min-width: 40px !important;
        min-height: 40px !important;
        border-radius: 50% !important;
        background: rgba(184, 149, 90, 0.08) !important;
        color: #B8955A !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        border: 1px solid rgba(184, 149, 90, 0.25) !important;
    }

    /* Hide rotated social bar in mobile drawer */
    .slide-in-overlay.menu-slide-in-overlay > .social-bar,
    .slide-in .slide-in-overlay > .social-bar,
    .is-mobile-menu .slide-in-overlay > .social-bar {
        display: none !important;
    }

    /* Links container inside mobile drawer */
    .slide-in-overlay.menu-slide-in-overlay #mega-menu-wrap,
    .slide-in-overlay.menu-slide-in-overlay .nav-container {
        width: 100% !important;
        margin-top: 10px !important;
        margin-bottom: 24px !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .menu {
        list-style: none !important;
        padding: 0 !important;
        margin: 0 !important;
        display: flex !important;
        flex-direction: column !important;
        gap: 2px !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .menu > li {
        list-style: none !important;
        border-bottom: 1px solid rgba(184, 149, 90, 0.12) !important;
        padding: 2px 0 !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .menu > li > a {
        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 12px 8px !important;
        font-size: 1.1rem !important;
        font-weight: 600 !important;
        letter-spacing: normal !important;
        color: #0E1A14 !important;
        text-decoration: none !important;
        border-radius: 6px !important;
        transition: all 0.2s ease !important;
    }

    .dark-scheme .slide-in-overlay.menu-slide-in-overlay .menu > li > a {
        color: #FFFFFF !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .menu > li > a:hover,
    .slide-in-overlay.menu-slide-in-overlay .menu > li.current-menu-item > a,
    .slide-in-overlay.menu-slide-in-overlay .menu > li.current-menu-ancestor > a {
        color: #B8955A !important;
        background: rgba(184, 149, 90, 0.08) !important;
        padding-left: 14px !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .menu > li > a,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .menu > li > a,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .menu > li > a {
        text-align: right !important;
        font-family: var(--font-arabic-heading, 'Alexandria', sans-serif) !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .menu > li > a:hover,
    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .menu > li.current-menu-item > a,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .menu > li > a:hover,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .menu > li.current-menu-item > a,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .menu > li > a:hover,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .menu > li.current-menu-item > a {
        padding-left: 8px !important;
        padding-right: 14px !important;
    }

    /* Submenus in Mobile Drawer */
    .slide-in-overlay.menu-slide-in-overlay .sub-menu {
        list-style: none !important;
        padding: 6px 0 6px 14px !important;
        margin: 0 !important;
        display: none;
        border-left: 2px solid rgba(184, 149, 90, 0.3) !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .sub-menu,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .sub-menu,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .sub-menu {
        padding: 6px 14px 6px 0 !important;
        border-left: none !important;
        border-right: 2px solid rgba(184, 149, 90, 0.3) !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .menu-item-has-children.active > .sub-menu,
    .slide-in-overlay.menu-slide-in-overlay .menu-item-has-children.sub-menu-active > .sub-menu {
        display: block !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .sub-menu li a {
        padding: 7px 10px !important;
        font-size: 0.96rem !important;
        font-weight: 500 !important;
        color: rgba(14, 26, 20, 0.8) !important;
        display: block !important;
        transition: color 0.2s ease !important;
    }

    .dark-scheme .slide-in-overlay.menu-slide-in-overlay .sub-menu li a {
        color: rgba(255, 255, 255, 0.75) !important;
    }

    .slide-in-overlay.menu-slide-in-overlay .sub-menu li a:hover,
    .slide-in-overlay.menu-slide-in-overlay .sub-menu li.current-menu-item > a {
        color: #B8955A !important;
    }

    /* Drawer Footer & Language */
    .slide-in-overlay.menu-slide-in-overlay .holder .copyright {
        margin-top: auto !important;
        padding-top: 18px !important;
        border-top: 1px solid rgba(184, 149, 90, 0.15) !important;
        font-size: 0.82rem !important;
        color: rgba(14, 26, 20, 0.6) !important;
        line-height: 1.5 !important;
    }

    .dark-scheme .slide-in-overlay.menu-slide-in-overlay .holder .copyright {
        color: rgba(255, 255, 255, 0.5) !important;
    }

    [dir="rtl"] .slide-in-overlay.menu-slide-in-overlay .holder .copyright,
    body.rtl .slide-in-overlay.menu-slide-in-overlay .holder .copyright,
    html[lang="ar"] .slide-in-overlay.menu-slide-in-overlay .holder .copyright {
        text-align: right !important;
        font-family: var(--font-arabic-body, 'Readex Pro', sans-serif) !important;
    }

    .slide-in-overlay.menu-slide-in-overlay select.lang-dropdown {
        margin-top: 12px !important;
        padding: 8px 16px !important;
        border-radius: 20px !important;
        border: 1px solid rgba(184, 149, 90, 0.3) !important;
        background-color: rgba(184, 149, 90, 0.08) !important;
        color: #B8955A !important;
        font-weight: 600 !important;
        font-size: 0.85rem !important;
        cursor: pointer !important;
        outline: none !important;
        display: inline-block !important;
        width: auto !important;
    }

    /* Body Scroll Lock when Mobile Menu is Open */
    body.menu-overlay-active,
    html.menu-overlay-active {
        overflow: hidden !important;
        touch-action: none !important;
    }
}

/* ==========================================================================
   12. LIGHTBOX & MASONRY GALLERY
   ========================================================================== */
.child-masonry-gallery {
    column-count: 1;
    column-gap: 1.25rem;
    width: 100%;
}

@media (min-width: 640px) {
    .child-masonry-gallery {
        column-count: 2;
    }
}

@media (min-width: 992px) {
    .child-masonry-gallery {
        column-count: 3;
    }
}

.gallery-item-wrap {
    break-inside: avoid;
    margin-bottom: 1.25rem;
    border-radius: 14px;
    overflow: hidden;
    cursor: zoom-in;
    position: relative;
    border: 1px solid var(--lls-border);
    transition: transform 0.3s var(--lls-spring), border-color 0.3s ease;
}

.gallery-item-wrap:hover {
    transform: scale(0.985);
    border-color: #B8955A;
}

.gallery-thumb-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    border-radius: 14px;
}

.child-gallery-modal {
    position: fixed;
    inset: 0;
    z-index: 999999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease;
}

.child-gallery-modal.is-active {
    opacity: 1;
    pointer-events: auto;
}

.modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(14, 26, 20, 0.94);
    backdrop-filter: blur(28px);
    -webkit-backdrop-filter: blur(28px);
    cursor: zoom-out;
}

.modal-stage {
    position: relative;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    padding: 2rem;
    cursor: zoom-out;
}

.modal-image {
    max-width: 92vw;
    max-height: 88vh;
    border-radius: 16px;
    box-shadow: 0 30px 70px -15px rgba(0, 0, 0, 0.8), 0 0 40px -10px rgba(184, 149, 90, 0.3);
    border: 1px solid rgba(184, 149, 90, 0.25);
    object-fit: contain;
}

.modal-close-btn {
    position: absolute;
    top: 1.5rem;
    right: 1.5rem;
    z-index: 20;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(14, 26, 20, 0.7);
    border: 1px solid rgba(184, 149, 90, 0.3);
    color: #B8955A;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: all 0.2s ease;
}

.modal-close-btn:hover {
    background: #B8955A;
    border-color: #B8955A;
    color: #0E1A14;
    transform: scale(1.08);
}

/* ==========================================================================
   13. COMPREHENSIVE ARABIC & RTL STYLING (TRANSLATEPRESS INTEGRATION)
   Supports: html[lang="ar"], html[dir="rtl"], body.rtl, body.translatepress-ar
   Fonts: Alexandria (Headings & Accents), Readex Pro (Body & UI)
   ========================================================================== */

/* Typography & Layout Direction */
:lang(ar),
html[lang="ar"],
html[dir="rtl"],
body.rtl,
body.translatepress-ar,
[dir="rtl"] {
    direction: rtl !important;
    text-align: right;
}

/* Headings in Arabic (Alexandria) */
:lang(ar) h1,
:lang(ar) h2,
:lang(ar) h3,
:lang(ar) h4,
:lang(ar) h5,
:lang(ar) h6,
html[lang="ar"] h1,
html[lang="ar"] h2,
html[lang="ar"] h3,
html[lang="ar"] h4,
html[lang="ar"] h5,
html[lang="ar"] h6,
body.rtl h1,
body.rtl h2,
body.rtl h3,
body.rtl h4,
body.rtl h5,
body.rtl h6,
body.translatepress-ar h1,
body.translatepress-ar h2,
body.translatepress-ar h3,
body.translatepress-ar h4,
body.translatepress-ar h5,
body.translatepress-ar h6,
[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5,
[dir="rtl"] h6,
[dir="rtl"] .project-headline,
[dir="rtl"] .contact-main-title,
[dir="rtl"] .projects-title,
[dir="rtl"] .services-title,
[dir="rtl"] .service-name,
[dir="rtl"] .card-project-title,
[dir="rtl"] .post-title,
[dir="rtl"] .entry-title,
[dir="rtl"] .nav-title,
[dir="rtl"] .success-title {
    font-family: var(--font-arabic-heading, 'Alexandria', 'Playfair Display', sans-serif) !important;
    letter-spacing: 0 !important;
    line-height: 1.4 !important;
}

/* Body & UI Text in Arabic (Readex Pro) */
:lang(ar) body,
:lang(ar) p,
:lang(ar) span,
:lang(ar) a,
:lang(ar) input,
:lang(ar) select,
:lang(ar) textarea,
:lang(ar) label,
html[lang="ar"] body,
html[lang="ar"] p,
html[lang="ar"] span,
html[lang="ar"] a,
html[lang="ar"] input,
html[lang="ar"] select,
html[lang="ar"] textarea,
html[lang="ar"] label,
body.rtl,
body.rtl p,
body.rtl span,
body.rtl a,
body.rtl input,
body.rtl select,
body.rtl textarea,
body.rtl label,
body.translatepress-ar,
body.translatepress-ar p,
body.translatepress-ar span,
body.translatepress-ar a,
body.translatepress-ar input,
body.translatepress-ar select,
body.translatepress-ar textarea,
body.translatepress-ar label,
[dir="rtl"] p,
[dir="rtl"] .project-lead,
[dir="rtl"] .prose-content,
[dir="rtl"] .contact-sub-title,
[dir="rtl"] .projects-desc,
[dir="rtl"] .services-desc,
[dir="rtl"] .service-summary,
[dir="rtl"] .card-project-excerpt,
[dir="rtl"] .form-label,
[dir="rtl"] .form-input,
[dir="rtl"] .form-textarea,
[dir="rtl"] .form-select,
[dir="rtl"] .concierge-tag,
[dir="rtl"] .concierge-location,
[dir="rtl"] .post-meta,
[dir="rtl"] .meta-value {
    font-family: var(--font-arabic-body, 'Readex Pro', 'Poppins', sans-serif) !important;
    letter-spacing: 0 !important;
}

[dir="rtl"] .prose-content {
    line-height: 2 !important;
}

[dir="rtl"] .prose-content p {
    line-height: 2 !important;
    text-align: right !important;
}

/* Arabic Buttons (Alexandria Bold) */
[dir="rtl"] .lls-btn-pill,
[dir="rtl"] a.lls-btn-pill,
[dir="rtl"] .child-btn-primary,
[dir="rtl"] button.child-btn-primary,
[dir="rtl"] .submit-contact-btn,
[dir="rtl"] .header-button a,
[dir="rtl"] .site-header .button,
[dir="rtl"] .filter-pill-btn,
[dir="rtl"] .service-interactive-btn,
[dir="rtl"] .sub-badge,
[dir="rtl"] .cat-pill,
[dir="rtl"] .status-text,
[dir="rtl"] .nav-direction {
    font-family: var(--font-arabic-heading, 'Alexandria', sans-serif) !important;
    letter-spacing: 0 !important;
    font-weight: 700 !important;
}

/* Form Inputs & Field Mirroring in RTL */
[dir="rtl"] .input-icon {
    right: 1.15rem !important;
    left: auto !important;
}

[dir="rtl"] .form-input {
    padding: 0.95rem 3.1rem 0.95rem 1.15rem !important;
    text-align: right !important;
}

[dir="rtl"] .form-textarea {
    padding: 0.95rem 1.15rem !important;
    text-align: right !important;
}

[dir="rtl"] .form-select {
    background-position: left 1.15rem center !important;
    padding-right: 3.1rem !important;
    padding-left: 2rem !important;
    text-align: right !important;
}

[dir="rtl"] .form-label {
    text-align: right !important;
}

/* Button Circles and Arrow Inversion in RTL */
[dir="rtl"] .lls-btn-pill .btn-circle-arrow,
[dir="rtl"] .submit-contact-btn .btn-circle-arrow,
[dir="rtl"] .service-interactive-btn .btn-arrow-wrap,
[dir="rtl"] .read-more-link svg,
[dir="rtl"] a.read-more svg {
    transform: rotate(180deg) !important;
}

[dir="rtl"] .lls-btn-pill:hover .btn-circle-arrow,
[dir="rtl"] .submit-contact-btn:hover .btn-circle-arrow {
    transform: translateX(-4px) rotate(180deg) !important;
}

[dir="rtl"] .service-interactive-btn:hover .btn-arrow-wrap {
    transform: translateX(-4px) rotate(180deg) !important;
}

[dir="rtl"] .read-more-link:hover svg,
[dir="rtl"] a.read-more:hover svg {
    transform: translateX(-5px) rotate(180deg) !important;
}

/* Back Link in RTL */
[dir="rtl"] .back-link svg {
    transform: rotate(180deg) !important;
}

[dir="rtl"] .back-link:hover {
    transform: translateX(4px) !important;
}

/* Single Project Specs & Content Block in RTL */
[dir="rtl"] .meta-col {
    text-align: right !important;
    align-items: flex-start !important;
}

[dir="rtl"] .meta-col.-action {
    align-items: flex-start !important;
}

[dir="rtl"] .content-section-title {
    text-align: right !important;
}

[dir="rtl"] .content-section-title::after {
    right: 0 !important;
    left: auto !important;
}

[dir="rtl"] .prose-content ul,
[dir="rtl"] .prose-content ol {
    padding-right: 1.5rem !important;
    padding-left: 0 !important;
}

/* Features List Bullet in RTL */
[dir="rtl"] .service-features-list li,
body.rtl .service-features-list li,
html[lang="ar"] .service-features-list li {
    flex-direction: row !important;
    text-align: right !important;
    gap: 0.65rem !important;
}

[dir="rtl"] .service-features-list li .check-icon,
body.rtl .service-features-list li .check-icon,
html[lang="ar"] .service-features-list li .check-icon {
    margin-left: 0.5rem !important;
    margin-right: 0 !important;
}

/* Nav Direction in Project Single Bar */
[dir="rtl"] .nav-prev {
    text-align: right !important;
}

[dir="rtl"] .nav-next {
    text-align: left !important;
}

/* Modal Close Button in RTL */
[dir="rtl"] .modal-close-btn {
    left: 1.5rem !important;
    right: auto !important;
}

/* Country Flag Badges in RTL */
[dir="rtl"] .country-flag-badge {
    left: auto !important;
    right: 1rem !important;
}

[dir="rtl"] .category-tag-pill {
    left: auto !important;
    right: 1rem !important;
}

/* ==========================================================================
   13.1 ARABIC (RTL) DESKTOP & TABLET HEADER ALIGNMENT
   ========================================================================== */
body.rtl .site-header,
[dir="rtl"] .site-header,
html[lang="ar"] .site-header {
    direction: rtl !important;
}

body.rtl .site-header .header-wrap-inner,
[dir="rtl"] .site-header .header-wrap-inner,
html[lang="ar"] .site-header .header-wrap-inner {
    direction: rtl !important;
}

body.rtl .header .nav .menu,
[dir="rtl"] .header .nav .menu,
html[lang="ar"] .header .nav .menu {
    direction: rtl !important;
    text-align: right !important;
}

body.rtl .header .nav .menu > li > a,
[dir="rtl"] .header .nav .menu > li > a,
html[lang="ar"] .header .nav .menu > li > a {
    font-family: var(--font-arabic-heading, 'Alexandria', sans-serif) !important;
    letter-spacing: normal !important;
}

/* Dropdown Submenus on Desktop in RTL */
body.rtl .header:not(.-mobile) .menu li > ul,
[dir="rtl"] .header:not(.-mobile) .menu li > ul,
html[lang="ar"] .header:not(.-mobile) .menu li > ul {
    right: 0 !important;
    left: auto !important;
    text-align: right !important;
    direction: rtl !important;
}

body.rtl .header:not(.-mobile) .menu li > ul > li a,
[dir="rtl"] .header:not(.-mobile) .menu li > ul > li a,
html[lang="ar"] .header:not(.-mobile) .menu li > ul > li a {
    text-align: right !important;
    font-family: var(--font-arabic-body, 'Readex Pro', sans-serif) !important;
    letter-spacing: normal !important;
}

body.rtl .header:not(.-mobile) .menu li > ul .has-submenu-icon,
[dir="rtl"] .header:not(.-mobile) .menu li > ul .has-submenu-icon,
html[lang="ar"] .header:not(.-mobile) .menu li > ul .has-submenu-icon {
    margin-right: 0 !important;
    margin-left: var(--clb-spacer-2) !important;
    transform: rotate(180deg) scale(0.75) !important;
}

/* ==========================================================================
   13.2 ARABIC (RTL) PROJECTS & SERVICES WIDGETS ALIGNMENT
   ========================================================================== */
body.rtl .projects-header-wrap,
[dir="rtl"] .projects-header-wrap,
html[lang="ar"] .projects-header-wrap,
body.rtl .services-header-wrap,
[dir="rtl"] .services-header-wrap,
html[lang="ar"] .services-header-wrap {
    text-align: right !important;
    align-items: flex-start !important;
    direction: rtl !important;
}

body.rtl .projects-filter-bar-wrapper,
[dir="rtl"] .projects-filter-bar-wrapper,
html[lang="ar"] .projects-filter-bar-wrapper {
    direction: rtl !important;
    justify-content: flex-start !important;
}

body.rtl .projects-showcase-grid,
[dir="rtl"] .projects-showcase-grid,
html[lang="ar"] .projects-showcase-grid,
body.rtl .services-grid,
[dir="rtl"] .services-grid,
html[lang="ar"] .services-grid {
    direction: rtl !important;
}

body.rtl .project-showcase-card,
[dir="rtl"] .project-showcase-card,
html[lang="ar"] .project-showcase-card,
body.rtl .service-card,
[dir="rtl"] .service-card,
html[lang="ar"] .service-card {
    text-align: right !important;
    direction: rtl !important;
}

body.rtl .card-info-row,
[dir="rtl"] .card-info-row,
html[lang="ar"] .card-info-row {
    direction: rtl !important;
    text-align: right !important;
}

body.rtl .card-circle-arrow-btn svg,
[dir="rtl"] .card-circle-arrow-btn svg,
html[lang="ar"] .card-circle-arrow-btn svg,
body.rtl .service-circle-arrow svg,
[dir="rtl"] .service-circle-arrow svg,
html[lang="ar"] .service-circle-arrow svg {
    transform: rotate(180deg) !important;
}

body.rtl .project-showcase-card:hover .card-circle-arrow-btn,
[dir="rtl"] .project-showcase-card:hover .card-circle-arrow-btn,
html[lang="ar"] .project-showcase-card:hover .card-circle-arrow-btn {
    transform: translateX(-4px) !important;
}

/* ==========================================================================
   13.3 ARABIC (RTL) FOOTER ALIGNMENT (Columns 1-4)
   ========================================================================== */
body.rtl .site-footer,
[dir="rtl"] .site-footer,
html[lang="ar"] .site-footer {
    direction: rtl !important;
    text-align: right !important;
}

body.rtl .site-footer .widget,
[dir="rtl"] .site-footer .widget,
html[lang="ar"] .site-footer .widget,
body.rtl .site-footer .widget-title,
[dir="rtl"] .site-footer .widget-title,
html[lang="ar"] .site-footer .widget-title,
body.rtl .site-footer h4,
[dir="rtl"] .site-footer h4,
html[lang="ar"] .site-footer h4,
body.rtl .site-footer h5,
[dir="rtl"] .site-footer h5,
html[lang="ar"] .site-footer h5,
body.rtl .site-footer p,
[dir="rtl"] .site-footer p,
html[lang="ar"] .site-footer p {
    text-align: right !important;
    font-family: var(--font-arabic-heading, 'Alexandria', sans-serif) !important;
}

body.rtl .site-footer ul,
[dir="rtl"] .site-footer ul,
html[lang="ar"] .site-footer ul {
    padding-right: 0 !important;
    padding-left: 0 !important;
    text-align: right !important;
    list-style: none !important;
}

body.rtl .site-footer ul li,
[dir="rtl"] .site-footer ul li,
html[lang="ar"] .site-footer ul li,
body.rtl .site-footer ul li a,
[dir="rtl"] .site-footer ul li a,
html[lang="ar"] .site-footer ul li a {
    text-align: right !important;
    font-family: var(--font-arabic-body, 'Readex Pro', sans-serif) !important;
}

body.rtl .site-footer-copyright,
[dir="rtl"] .site-footer-copyright,
html[lang="ar"] .site-footer-copyright {
    direction: rtl !important;
    text-align: right !important;
}

/* Universal Cursive Arabic letter-spacing fix */
body.rtl *,
[dir="rtl"] *,
html[lang="ar"] *,
body.translatepress-ar * {
    letter-spacing: normal !important;
}

/* ==========================================================================
   ELEMENTOR FREEDOM: Allow user to freely change text & heading colors in Elementor
   ========================================================================== */
.elementor-element .elementor-heading-title,
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-element [class*="elementor-heading"],
.elementor-element [class*="elementor-"] {
    /* Ensures Elementor color and typography choices cascade cleanly without theme blocking */
}

/* ==========================================================================
   INVERTED FOOTER SCHEME (Opposite of Active Theme Scheme)
   Light Site => Luxury Deep Green Footer (#0E1A14)
   Dark Site  => Warm Alabaster Light Footer (#F4F1EA)
   ========================================================================== */

/* 1. When Site is in LIGHT SCHEME -> Footer is LUXURY DEEP DARK */
body:not(.dark-scheme) .site-footer,
body:not(.dark-scheme) #colophon,
body:not(.dark-scheme) footer.site-footer,
body:not(.dark-scheme) #page .site-footer,
body:not(.dark-scheme) .site-footer.clb__light_section,
body:not(.dark-scheme) .site-footer.clb__dark_section,
body:not(.dark-scheme) .site-footer-copyright {
    background-color: #0E1A14 !important;
    background: #0E1A14 !important;
    color: #C8D6CF !important;
}

body:not(.dark-scheme) .site-footer .page-container,
body:not(.dark-scheme) .site-footer .widgets,
body:not(.dark-scheme) .site-footer .widgets-column,
body:not(.dark-scheme) .site-footer-copyright .holder {
    background-color: transparent !important;
    background: transparent !important;
}

body:not(.dark-scheme) .site-footer h1,
body:not(.dark-scheme) .site-footer h2,
body:not(.dark-scheme) .site-footer h3,
body:not(.dark-scheme) .site-footer h4,
body:not(.dark-scheme) .site-footer h5,
body:not(.dark-scheme) .site-footer h6,
body:not(.dark-scheme) .site-footer .widget-title,
body:not(.dark-scheme) .site-footer .title,
body:not(.dark-scheme) .site-footer .heading {
    color: #FFFFFF !important;
}

body:not(.dark-scheme) .site-footer p,
body:not(.dark-scheme) .site-footer span,
body:not(.dark-scheme) .site-footer li,
body:not(.dark-scheme) .site-footer .widgets,
body:not(.dark-scheme) .site-footer .textwidget {
    color: #C8D6CF !important;
}

body:not(.dark-scheme) .site-footer a,
body:not(.dark-scheme) .site-footer .widgets a,
body:not(.dark-scheme) .site-footer li a {
    color: #C8D6CF !important;
    transition: color 0.25s ease;
}

body:not(.dark-scheme) .site-footer a:hover,
body:not(.dark-scheme) .site-footer .widgets a:hover,
body:not(.dark-scheme) .site-footer li a:hover {
    color: #B8955A !important;
}

body:not(.dark-scheme) .site-footer-text p {
    color: rgba(255, 255, 255, 0.05) !important;
}

body:not(.dark-scheme) .site-footer-copyright {
    background-color: #08100C !important;
    border-top: 1px solid rgba(184, 149, 90, 0.2) !important;
    color: #9EAEA5 !important;
}

body:not(.dark-scheme) .site-footer-copyright a {
    color: #B8955A !important;
}

body:not(.dark-scheme) .site-footer .scroll-top .icon-button {
    background-color: #16271F !important;
    color: #B8955A !important;
    border: 1px solid rgba(184, 149, 90, 0.3) !important;
}

/* 2. When Site is in DARK SCHEME -> Footer is WARM ALABASTER LIGHT */
body.dark-scheme .site-footer,
body.dark-scheme #colophon,
body.dark-scheme .site-footer.clb__dark_section,
body.dark-scheme .site-footer.clb__light_section {
    background-color: #F4F1EA !important;
    color: #2F3E36 !important;
}

body.dark-scheme .site-footer .page-container {
    background-color: transparent !important;
}

body.dark-scheme .site-footer h1,
body.dark-scheme .site-footer h2,
body.dark-scheme .site-footer h3,
body.dark-scheme .site-footer h4,
body.dark-scheme .site-footer h5,
body.dark-scheme .site-footer h6,
body.dark-scheme .site-footer .widget-title,
body.dark-scheme .site-footer .title,
body.dark-scheme .site-footer .heading {
    color: #0E1A14 !important;
}

body.dark-scheme .site-footer p,
body.dark-scheme .site-footer span,
body.dark-scheme .site-footer li,
body.dark-scheme .site-footer .widgets,
body.dark-scheme .site-footer .textwidget {
    color: #2F3E36 !important;
}

body.dark-scheme .site-footer a,
body.dark-scheme .site-footer .widgets a,
body.dark-scheme .site-footer li a {
    color: #2F3E36 !important;
    transition: color 0.25s ease;
}

body.dark-scheme .site-footer a:hover,
body.dark-scheme .site-footer .widgets a:hover,
body.dark-scheme .site-footer li a:hover {
    color: #B8955A !important;
}

body.dark-scheme .site-footer-text p {
    color: rgba(14, 26, 20, 0.06) !important;
}

body.dark-scheme .site-footer-copyright {
    background-color: #EBE7DE !important;
    border-top: 1px solid rgba(47, 62, 54, 0.15) !important;
    color: #4B5E54 !important;
}

body.dark-scheme .site-footer-copyright a {
    color: #B8955A !important;
}

body.dark-scheme .site-footer .scroll-top .icon-button {
    background-color: #FFFFFF !important;
    color: #0E1A14 !important;
    border: 1px solid rgba(184, 149, 90, 0.3) !important;
}

/* ==========================================================================
   4. Launch Lab Studio - Luxury Client Reviews & Smart Image Masks
   ========================================================================== */

.launchlab-testimonials-section {
    position: relative;
    width: 100%;
    margin: 3.5rem 0;
    padding: 1rem 0;
}

.testimonials-header-block {
    text-align: center;
    max-width: 760px;
    margin: 0 auto 3rem auto;
}

.testimonials-trust-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.4rem 1rem;
    border-radius: var(--lls-radius-pill);
    background: rgba(184, 149, 90, 0.12);
    border: 1px solid rgba(184, 149, 90, 0.3);
    color: #B8955A;
    font-size: 0.8rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 1.25rem;
}

.testimonials-trust-badge .trust-stars-icon {
    display: flex;
    align-items: center;
}

.testimonials-main-title {
    font-family: var(--lls-font-serif, 'Playfair Display', Georgia, serif);
    font-size: clamp(2rem, 3.5vw, 2.75rem);
    font-weight: 700;
    color: #0E1A14;
    line-height: 1.2;
    margin: 0 0 1rem 0;
    letter-spacing: -0.01em;
}

body.dark-scheme .testimonials-main-title {
    color: #F4F1EA !important;
}

.testimonials-sub-desc {
    font-size: 1.05rem;
    line-height: 1.65;
    color: #556B61;
    margin: 0 auto;
}

body.dark-scheme .testimonials-sub-desc {
    color: #9EAEA5 !important;
}

/* Grids and Carousel Track */
.testimonials-grid-wrapper {
    display: grid;
    gap: 1.75rem;
    width: 100%;
}

.testimonials-grid-wrapper.grid-3-col {
    grid-template-columns: repeat(3, 1fr);
}

.testimonials-grid-wrapper.grid-2-col {
    grid-template-columns: repeat(2, 1fr);
}

@media (max-width: 991px) {

    .testimonials-grid-wrapper.grid-3-col,
    .testimonials-grid-wrapper.grid-2-col {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 680px) {

    .testimonials-grid-wrapper.grid-3-col,
    .testimonials-grid-wrapper.grid-2-col {
        grid-template-columns: 1fr;
    }
}

/* Carousel Track & Slider */
.testimonials-carousel-wrapper {
    position: relative;
    width: 100%;
    overflow: hidden;
}

.testimonials-track {
    display: flex;
    gap: 1.75rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    padding: 1rem 0.5rem 2rem 0.5rem;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
}

.testimonials-track::-webkit-scrollbar {
    display: none;
}

.testimonials-track .carousel-slide {
    flex: 0 0 calc(33.333% - 1.2rem);
    min-width: 320px;
    scroll-snap-align: start;
}

@media (max-width: 1024px) {
    .testimonials-track .carousel-slide {
        flex: 0 0 calc(50% - 1rem);
    }
}

@media (max-width: 640px) {
    .testimonials-track .carousel-slide {
        flex: 0 0 100%;
        min-width: 100%;
    }
}

/* Carousel Navigation Controls */
.testimonials-nav-bar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1.25rem;
    margin-top: 1.5rem;
}

.testimonial-arrow-btn {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #FFFFFF;
    border: 1px solid rgba(184, 149, 90, 0.35);
    color: #0E1A14;
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
}

body.dark-scheme .testimonial-arrow-btn {
    background: #14221B;
    border-color: rgba(184, 149, 90, 0.3);
    color: #F4F1EA;
}

.testimonial-arrow-btn:hover {
    background: #B8955A !important;
    border-color: #B8955A !important;
    color: #0E1A14 !important;
    transform: scale(1.08);
    box-shadow: 0 6px 20px rgba(184, 149, 90, 0.4);
}

.testimonials-dots-container {
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.testimonial-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgba(184, 149, 90, 0.3);
    cursor: pointer;
    transition: all 0.3s ease;
}

.testimonial-dot.is-active {
    width: 24px;
    border-radius: 4px;
    background: #B8955A;
}

/* Luxury Testimonial Card */
.launchlab-testimonial-card {
    position: relative;
    background: #FFFFFF;
    border: 1px solid rgba(184, 149, 90, 0.22);
    border-radius: 18px;
    padding: 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.04);
    transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: hidden;
}

body.dark-scheme .launchlab-testimonial-card {
    background: #121E18 !important;
    border-color: rgba(184, 149, 90, 0.22) !important;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.35) !important;
}

.launchlab-testimonial-card:hover {
    transform: translateY(-6px);
    border-color: rgba(184, 149, 90, 0.6) !important;
    box-shadow: 0 20px 45px rgba(184, 149, 90, 0.15) !important;
}

/* Card Ambient Glow */
.card-ambient-glow {
    position: absolute;
    top: -50px;
    right: -50px;
    width: 140px;
    height: 140px;
    border-radius: 50%;
    background: radial-gradient(circle, rgba(184, 149, 90, 0.12) 0%, transparent 70%);
    pointer-events: none;
    transition: opacity 0.4s ease;
}

.launchlab-testimonial-card:hover .card-ambient-glow {
    opacity: 0.9;
}

/* Review Header: Image + Meta */
.review-client-header {
    display: flex;
    align-items: center;
    gap: 1.15rem;
    margin-bottom: 1.25rem;
}

/* ==========================================================================
   Smart Masks for Client Photos & Review Screenshots
   ========================================================================== */

.review-image-frame {
    position: relative;
    flex-shrink: 0;
    transition: all 0.35s ease;
}

.masked-image-container {
    overflow: hidden;
    background: #0E1A14;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.4s cubic-bezier(0.16, 1, 0.3, 1);
}

.masked-client-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.4s ease;
}

.launchlab-testimonial-card:hover .masked-client-photo {
    transform: scale(1.08);
}

.masked-avatar-initials {
    font-size: 1.25rem;
    font-weight: 700;
    color: #B8955A;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* 1. Mask Type: Squircle (Organic modern rounded rectangle) */
.mask-type-squircle .masked-image-container {
    width: 68px;
    height: 68px;
    border-radius: 20px;
    border: 2px solid #B8955A;
    box-shadow: 0 4px 16px rgba(184, 149, 90, 0.28);
}

/* 2. Mask Type: Crest / Shield (Geometric executive badge) */
.mask-type-crest {
    filter: drop-shadow(0 4px 12px rgba(184, 149, 90, 0.35));
}

.mask-type-crest .masked-image-container {
    width: 70px;
    height: 74px;
    clip-path: polygon(50% 0%, 96% 22%, 96% 78%, 50% 100%, 4% 78%, 4% 22%);
    border: 2px solid transparent;
}

/* 3. Mask Type: Circle (Floating halo with dual ring) */
.mask-type-circle .masked-image-container {
    width: 68px;
    height: 68px;
    border-radius: 50%;
    border: 2px solid #B8955A;
    box-shadow: 0 0 0 3px rgba(184, 149, 90, 0.25), 0 6px 18px rgba(0, 0, 0, 0.15);
}

/* 4. Mask Type: Mockup (Screenshot / Social Review Window) */
.mask-type-mockup {
    background: #14221B;
    border: 1px solid rgba(184, 149, 90, 0.4);
    border-radius: 12px;
    padding: 4px;
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.25);
    width: 82px;
}

.review-mockup-topbar {
    display: flex;
    align-items: center;
    gap: 3px;
    padding: 3px 4px 4px 4px;
    border-bottom: 1px solid rgba(184, 149, 90, 0.2);
    margin-bottom: 3px;
}

.mockup-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.mockup-dot.red {
    background: #E06C75;
}

.mockup-dot.yellow {
    background: #E5C07B;
}

.mockup-dot.green {
    background: #98C379;
}

.mockup-title-bar {
    display: none;
}

.mask-type-mockup .masked-image-container {
    width: 100%;
    height: 52px;
    border-radius: 6px;
}

/* Verified Gold Shield Badge */
.client-verified-shield {
    position: absolute;
    bottom: -3px;
    right: -3px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #B8955A;
    border: 2px solid #0E1A14;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35);
    z-index: 2;
}

/* Client Meta Info */
.review-client-meta {
    flex-grow: 1;
    min-width: 0;
}

.client-name {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0E1A14;
    margin: 0 0 0.25rem 0;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.dark-scheme .client-name {
    color: #FFFFFF !important;
}

.client-position {
    font-size: 0.82rem;
    color: #556B61;
    margin: 0 0 0.4rem 0;
    line-height: 1.35;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

body.dark-scheme .client-position {
    color: #A2B2A9 !important;
}

.client-pos-sep {
    color: #B8955A;
    margin: 0 0.3rem;
}

.client-company {
    font-weight: 600;
    color: #B8955A;
}

.client-location-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.75rem;
    color: #7B8F84;
}

.review-flag-icon {
    width: 18px;
    height: 12px;
    border-radius: 2px;
    object-fit: cover;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}

.review-source-label {
    font-weight: 600;
    letter-spacing: 0.02em;
}

/* Star Ratings */
.review-rating-stars {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    margin-bottom: 1rem;
}

.star-svg {
    transition: transform 0.2s ease;
}

.review-rating-stars .rating-number {
    font-size: 0.8rem;
    font-weight: 700;
    color: #B8955A;
    margin-left: 0.4rem;
}

/* Quote Body */
.review-quote-body {
    position: relative;
    padding-top: 0.25rem;
    flex-grow: 1;
}

.quote-watermark-icon {
    position: absolute;
    top: -12px;
    right: 0;
    color: rgba(184, 149, 90, 0.15);
    pointer-events: none;
}

.review-text-content {
    font-size: 0.95rem;
    line-height: 1.65;
    color: #2F3E36;
    margin: 0;
    font-style: italic;
    position: relative;
    z-index: 1;
}

body.dark-scheme .review-text-content {
    color: #C8D6CF !important;
}

/* ==========================================================================
   Hero Featured Review Spotlight Card
   ========================================================================== */

.launchlab-featured-review-card {
    background: #FFFFFF;
    border: 1px solid rgba(184, 149, 90, 0.3);
    border-radius: 24px;
    padding: 3rem;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

body.dark-scheme .launchlab-featured-review-card {
    background: #121E18 !important;
    border-color: rgba(184, 149, 90, 0.35) !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.4) !important;
}

.featured-review-grid {
    display: grid;
    grid-template-columns: 160px 1fr;
    gap: 2.5rem;
    align-items: center;
}

@media (max-width: 768px) {
    .featured-review-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .featured-image-col {
        display: flex;
        justify-content: center;
    }

    .review-rating-stars {
        justify-content: center;
    }

    .featured-author-meta {
        justify-content: center !important;
    }
}

.featured-frame.mask-type-crest .masked-image-container {
    width: 140px;
    height: 150px;
}

.featured-frame.mask-type-squircle .masked-image-container {
    width: 130px;
    height: 130px;
    border-radius: 30px;
}

.featured-quote {
    font-family: var(--lls-font-serif, 'Playfair Display', Georgia, serif);
    font-size: clamp(1.2rem, 2.2vw, 1.55rem);
    line-height: 1.55;
    color: #0E1A14;
    margin: 1.25rem 0 1.75rem 0;
    font-style: italic;
    border: none;
    padding: 0;
}

body.dark-scheme .featured-quote {
    color: #F4F1EA !important;
}

.featured-author-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1.5rem;
    border-top: 1px solid rgba(184, 149, 90, 0.2);
    padding-top: 1.25rem;
}

.featured-name {
    font-size: 1.2rem;
    font-weight: 700;
    color: #0E1A14;
    margin: 0 0 0.25rem 0;
}

body.dark-scheme .featured-name {
    color: #FFFFFF !important;
}

.featured-role {
    font-size: 0.9rem;
    color: #B8955A;
    margin: 0;
    font-weight: 600;
}

.featured-country-tag {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 0.85rem;
    color: #7B8F84;
}

.featured-country-tag .review-flag-img {
    width: 24px;
    height: 16px;
    border-radius: 3px;
    object-fit: cover;
}