/*
Theme Name: Nanbenda Theme
Theme URI: https://nanbendatravels.com
Author: Nanbenda
Author URI: https://nanbendatravels.com
Description: Custom WordPress theme for Nanbenda E-Sevai & Air Travels.
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Tags: custom-theme, e-sevai, travel
Text Domain: nanbenda-theme
*/

:root {
    /* Brand Colors */
    --primary-blue: #0f172a;
    /* Navy Blue */
    --accent-blue: #3b82f6;
    /* Brighter Blue for highlights */
    --primary-green: #16a34a;
    --dark-text: #1e293b;
    --light-text: #64748b;
    --white: #ffffff;
    --light-bg: #f8fafc;

    /* Gradients */
    --gradient-hero: linear-gradient(135deg, #0f172a 0%, #1e293b 100%);
    --gradient-card: linear-gradient(135deg, #ffffff 0%, #f1f5f9 100%);

    /* Shadows */
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);

    /* Typography */
    --font-head: 'Poppins', sans-serif;
    --font-body: 'Roboto', sans-serif;
}

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

body {
    font-family: var(--font-body);
    color: var(--dark-text);
    background-color: var(--white);
    line-height: 1.6;
    overflow-x: hidden;
}

/* Specific Page Backgrounds */
body.bg-light {
    background: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 100%);
    /* Blue gradient */
    position: relative;
    min-height: 100vh;
}

.bg-white {
    background-color: white !important;
}

/* Subtle Pattern Overlay */
body.bg-light::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-image: radial-gradient(#94a3b8 1.5px, transparent 1.5px);
    background-size: 24px 24px;
    opacity: 0.1;
    z-index: -1;
    pointer-events: none;
}

/* Typography */
h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--font-head);
    color: var(--dark-text);
    margin-bottom: 1rem;
    font-weight: 700;
}

h1 {
    font-size: 3rem;
    line-height: 1.1;
}

h2 {
    font-size: 2.25rem;
    line-height: 1.2;
}

h3 {
    font-size: 1.5rem;
    line-height: 1.3;
}

p {
    margin-bottom: 1.5rem;
    color: var(--light-text);
    font-size: 1.05rem;
}

/* Spacing */
.section-padding {
    padding: 100px 0;
}

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

ul {
    list-style: none;
}

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

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

.section-padding {
    padding: 80px 0;
}

/* Utilities */
.flex-between {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

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

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

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

/* Buttons */
/* Buttons - Unified Dark Blue Theme */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 14px 32px;
    border-radius: 8px;
    /* Slight rounded corners */
    font-weight: 600;
    font-size: 1rem;
    font-family: var(--font-head);
    transition: all 0.3s ease;
    cursor: pointer;
    text-transform: capitalize;
    background-color: var(--primary-blue);
    color: white;
    border: none;
    box-shadow: var(--shadow-md);
}

.btn:hover {
    background-color: #1e293b;
    transform: translateY(-2px);
    box-shadow: var(--shadow-lg);
}

/* Specific variants mapped to the main theme, 
   but allowing subtle differentiation if absolutely needed, 
   otherwise strictly following the Dark Blue rule for main actions. */

.btn-green {
    /* WhatsApp usually requires Green, but if the user demanded strictly Dark Blue, we follow. 
       However, "WhatsApp Now" text implies the action. 
       Let's keep the standard main button as Dark Blue. 
       If we must change color for context, we override. 
       Relying on the user's "All buttons... Dark Blue" instruction effectively. */
    background-color: var(--primary-blue);
}

.btn-green:hover {
    background-color: #334155;
}

.btn-blue {
    background-color: var(--primary-blue);
}

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

.btn-outline-green:hover,
.btn-outline-blue:hover {
    background: var(--primary-blue);
    color: white;
}

/* Official WhatsApp Button Style */
.btn-whatsapp-real {
    background-color: #25D366 !important;
    /* Force Green */
    color: white !important;
    border: 1px solid #25D366 !important;
    font-weight: 600;
    transition: all 0.3s ease;
}

.btn-whatsapp-real:hover {
    background-color: #128C7E !important;
    /* Darker Green on Hover */
    border-color: #128C7E !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

/* Top Bar */
.top-bar {
    background: #0f172a;
    color: white;
    padding: 8px 0;
    font-size: 0.9rem;
}

/* Community Sticky Bar */
.community-bar {
    background: #064e3b;
    /* Deep Green */
    color: white;
    padding: 10px 0;
    font-size: 0.95rem;
    position: sticky;
    top: 0;
    z-index: 1100;
    /* Higher than navbar */
    border-bottom: 1px solid #059669;
}

.community-bar p {
    margin-bottom: 0;
    color: white;
    font-weight: 500;
}

.community-bar i {
    margin-right: 8px;
    font-size: 1.1rem;
}

.btn-community-join {
    background: #25D366;
    /* WhatsApp Bright Green */
    color: white;
    padding: 6px 18px;
    border-radius: 50px;
    text-decoration: none;
    font-weight: 600;
    font-size: 0.85rem;
    transition: all 0.3s ease;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    white-space: nowrap;
}

.btn-community-join:hover {
    background: white;
    color: #25D366;
    transform: translateY(-1px);
}

.btn-community-join i {
    margin-right: 0;
    font-size: 0.8rem;
}

/* Mobile Responsive for Community Bar */
@media (max-width: 600px) {
    .community-bar .container {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }

    .community-bar p {
        font-size: 0.85rem;
    }
}

/* News Ticker Styling */
.news-ticker-wrap {
    background: #1e293b;
    /* Dark Slate */
    color: white;
    border-bottom: 1px solid #334155;
    padding: 0;
    height: 40px;
    overflow: hidden;
    position: relative;
    z-index: 1090;
}

.news-ticker-wrap .container {
    height: 100%;
    padding: 0 15px;
    /* Ensure alignment */
}

.ticker-content {
    display: flex;
    align-items: center;
    height: 100%;
}

.ticker-label {
    background: #dc2626;
    /* Red for attention */
    color: white;
    font-weight: 700;
    font-size: 0.85rem;
    padding: 0 15px;
    height: 100%;
    display: flex;
    align-items: center;
    margin-right: 0;
    clip-path: polygon(0 0, 100% 0, 90% 100%, 0% 100%);
    /* Slight slant */
    padding-right: 25px;
    flex-shrink: 0;
}

.ticker-move-container {
    flex-grow: 1;
    overflow: hidden;
    position: relative;
    height: 100%;
    display: flex;
    align-items: center;
}

.ticker-move {
    display: inline-block;
    white-space: nowrap;
    animation: ticker 40s linear infinite;
    /* Slowed down slightly for readability */
    padding-left: 0;
    /* REMOVED 100% PADDING FOR INSTANT SHOW */
}

.t-item {
    display: inline-block;
    padding: 0 40px;
    /* Increased padding */
    font-size: 0.9rem;
    color: #e2e8f0;
}

.t-item b {
    color: #fbbf24;
    /* Amber for highlights */
}

@keyframes ticker {
    0% {
        transform: translate3d(0, 0, 0);
    }

    100% {
        transform: translate3d(-100%, 0, 0);
    }
}

/* Mobile Ticker Adjustment */
@media (max-width: 600px) {
    .ticker-label {
        font-size: 0.7rem;
        padding: 0 10px;
        padding-right: 20px;
    }

    .t-item {
        font-size: 0.8rem;
    }
}

.auth-badges .badge {
    margin-right: 15px;
    font-size: 0.85rem;
    opacity: 0.9;
}

.contact-mini a {
    color: white;
    font-weight: 500;
}

/* Navigation Bar */
.navbar {
    background: #ffffff;
    /* White background */
    padding: 15px 0;
    position: sticky;
    top: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    /* Subtle shadow for separation */
}

.logo {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--primary-blue);
    /* Keep brand color for logo */
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: 10px;
}

.nav-links {
    list-style: none;
    display: flex;
    gap: 25px;
}

.nav-links a {
    text-decoration: none;
    color: #334155;
    /* Dark text for links */
    font-weight: 500;
    transition: color 0.3s ease;
    font-size: 1rem;
}

.nav-links a:hover {
    color: var(--accent-blue);
}

/* Mobile Toggle */
.mobile-toggle {
    display: none;
    background: none;
    border: none;
    color: #334155;
    /* Dark icon */
    font-size: 1.5rem;
    cursor: pointer;
}

/* Hero Section (Light Theme) */
.hero-section {
    background: #f8fafc;
    /* Very light slate background */
    padding: 80px 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

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

.hero-content h1 {
    font-size: 2.8rem;
    font-weight: 700;
    color: #1e293b;
    /* Dark slate text */
    margin-bottom: 20px;
    line-height: 1.2;
}

.hero-content h2 {
    font-size: 1.3rem;
    font-weight: 500;
    color: #475569;
    /* Medium slate text */
    margin-bottom: 30px;
    line-height: 1.6;
}

/* Primary Button (WhatsApp Green) */
.btn-green {
    background: #25D366;
    /* WhatsApp Green */
    color: white;
    box-shadow: 0 4px 15px rgba(37, 211, 102, 0.3);
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-green:hover {
    background: #128C7E;
    /* Darker Green on hover */
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(37, 211, 102, 0.4);
    color: white;
}

.btn-outline-green {
    background: transparent;
    border: 2px solid #25D366;
    color: #25D366;
    text-decoration: none;
    transition: all 0.3s ease;
}

.btn-outline-green:hover {
    background: #25D366;
    color: white;
}

.btn-large {
    padding: 16px 40px;
    font-size: 1.2rem;
    border-radius: 50px;
}

/* Hero Mobile Responsive */
@media (max-width: 768px) {
    .hero-section {
        padding: 80px 0;
    }

    .hero h1 {
        font-size: 2.2rem;
    }

    .hero h2 {
        font-size: 1.1rem;
    }

    .btn-large {
        width: 100%;
        justify-content: center;
    }
}

/* Service Cards */
.services-split {
    background: white;
}

/* Service Cards */
.service-card {
    background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%) !important;
    border-radius: 16px;
    border: 1px solid #e2e8f0;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: all 0.4s ease;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    height: 100%;
}

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

.card-image {
    height: 240px;
    overflow: hidden;
}

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

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

.card-content {
    padding: 32px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.icon-box {
    width: 56px;
    height: 56px;
    border-radius: 12px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.5rem;
    margin-bottom: 24px;
}

.icon-green {
    background: #dcfce7;
    color: var(--primary-green);
}

.icon-blue {
    background: #dbeafe;
    color: var(--primary-blue);
}

.card-content h3 {
    font-size: 1.5rem;
    margin-bottom: 16px;
    color: var(--dark-text);
}

.card-content .service-list {
    margin-bottom: auto;
    color: var(--light-text);
    font-size: 0.95rem;
    line-height: 1.6;
}

.card-content .btn {
    margin-top: 24px;
    align-self: flex-start;
}

/* Why Choose Us */
.grid-2-bias-left {
    display: grid;
    grid-template-columns: 0.8fr 1.2fr;
    gap: 50px;
    align-items: center;
}

.map-container {
    position: relative;
    background: #e2e8f0;
    border-radius: 20px;
    padding: 20px;
    min-height: 400px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.map-img {
    opacity: 1;
    max-height: 350px;
    filter: saturate(3) contrast(1.2) brightness(1.05);
    transition: filter 0.3s;
}

.map-img:hover {
    filter: saturate(3.5) contrast(1.25) brightness(1.1);
}

/* Pin styles removed */

.map-caption {
    text-align: center;
    margin-top: 15px;
    font-weight: 600;
    color: var(--light-text);
}

.features-list h2 {
    font-size: 2.5rem;
    margin-bottom: 30px;
}

.feature-item {
    display: flex;
    gap: 20px;
    margin-bottom: 30px;
}

.f-icon {
    width: 60px;
    height: 60px;
    background: white;
    box-shadow: var(--shadow-sm);
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2rem;
    color: var(--primary-blue);
    flex-shrink: 0;
}

.f-text h4 {
    font-size: 1.1rem;
    margin-bottom: 5px;
}

.f-text p {
    color: var(--light-text);
    font-size: 0.95rem;
}

/* Payment Section */
.payment-section {
    background: white;
}

.payment-methods {
    display: flex;
    gap: 20px;
    margin-top: 30px;
    flex-wrap: wrap;
}

.payment-methods span {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 20px;
    background: #f1f5f9;
    border-radius: 10px;
    font-weight: 500;
    font-size: 0.9rem;
}

.pay-card {
    background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%) !important;
    border: 1px solid #e2e8f0;
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    max-width: 350px;
    margin: 0 auto;
    box-shadow: var(--shadow-lg);
}

.gpay-logo {
    font-size: 3rem;
    color: var(--dark-text);
    margin-bottom: 20px;
}

.qr-img {
    width: 200px;
    height: 200px;
    margin: 0 auto 15px;
    object-fit: contain;
    border-radius: 10px;
    background: #f1f5f9;
}

/* Service Coverage Banner */
/* Service Coverage Banner */
.coverage-banner {
    background: #f1f5f9;
    /* Light Gray */
    color: #1e293b;
    /* Dark Text */
    padding: 60px 0;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}

.coverage-content {
    max-width: 800px;
    margin: 0 auto;
}

.coverage-icon {
    font-size: 3rem;
    color: var(--primary-blue);
    /* Navy Blue Icon */
    margin-bottom: 20px;
}

.coverage-banner h2 {
    font-size: 2.2rem;
    margin-bottom: 15px;
    color: #0f172a;
}

.coverage-banner p {
    font-size: 1.1rem;
    color: #475569;
    margin-bottom: 30px;
}

.support-check {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    background: #ffffff;
    padding: 12px 25px;
    border-radius: 50px;
    border: 1px solid #cbd5e1;
    font-size: 1rem;
    text-decoration: none;
    color: #475569;
    /* Dark Gray Text */
    transition: all 0.3s ease;
    cursor: pointer;
    position: relative;
    z-index: 10;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.05);
}

.support-check:hover {
    background: #f8fafc;
    transform: translateY(-2px);
    border-color: #94a3b8;
    color: #1e293b;
}

.support-check i {
    color: #25D366;
    font-size: 1.3rem;
}

/* Visual Rules Flight */
.visual-rules-flight {
    background: #f0f9ff;
    text-align: center;
}

.visual-rules-flight h2 {
    margin-bottom: 40px;
}

.visual-card {
    background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%) !important;
    border-radius: 20px;
    padding: 15px;
    box-shadow: var(--shadow-sm);
}

.visual-card img {
    border-radius: 15px;
    width: 100%;
    height: 200px;
    object-fit: cover;
    margin-bottom: 15px;
}

.visual-card p {
    font-weight: 600;
    color: var(--dark-text);
}

.reminder-badge {
    height: 200px;
    background: linear-gradient(135deg, #0f172a 0%, #334155 100%);
    border-radius: 15px;
    color: white;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 20px;
    margin-bottom: 15px;
}

.rb-row {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 15px;
    font-size: 1rem;
}

.rb-row i {
    color: #38bdf8;
    width: 20px;
}

/* Footer - Premium Dark */
.footer {
    background: #0f172a;
    /* Darkest Navy */
    color: #94a3b8;
    padding: 80px 0 40px;
    border-top: 1px solid #1e293b;
}

.footer-content {
    display: grid;
    grid-template-columns: 1.5fr 1fr 1fr;
    gap: 40px;
}

.footer-brand h3 {
    color: white;
    margin-bottom: 15px;
}

.auth-text {
    font-size: 0.9rem;
    color: #cbd5e1;
}

.footer-address p {
    margin-bottom: 10px;
}

.footer-phone {
    color: #fff;
    font-weight: 600;
    font-size: 1.1rem;
}

.footer-legal {
    text-align: right;
}

.legal-small {
    font-size: 0.75rem;
    margin-bottom: 10px;
    opacity: 0.7;
}



/* Responsive */
@media (max-width: 960px) {

    .hero-content,
    .grid-2,
    .grid-2-bias-left {
        grid-template-columns: 1fr;
    }

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

    .hero {
        padding: 60px 0;
        text-align: center;
    }

    .hero-text h1 {
        font-size: 2.5rem;
    }

    .hero-text p {
        margin: 0 auto 30px;
    }

    .trust-badges-row {
        justify-content: center;
        flex-wrap: wrap;
    }

    .cta-group {
        justify-content: center;
    }

    .nav-links {
        display: none;
        /* simple hide for now */
    }

    .mobile-toggle {
        display: block;
    }

    .footer-content {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-legal {
        text-align: center;
    }

    .map-container {
        order: 2;
    }

    .features-list {
        order: 1;
    }

    /* Mobile adjustments for E-Sevai grid */
    .services-grid-box {
        grid-template-columns: 1fr !important;
        /* Stack on mobile */
    }
}


/* ----------------------------------------------------------------- */
/* E-SEVAI SERVICES PAGE SPECIFIC STYLES (PREMIUM OVERHAUL) */
/* ----------------------------------------------------------------- */

.page-header {
    background: var(--primary-blue);
    background: linear-gradient(135deg, #0f172a 0%, #0056b3 100%);
    color: white;
    padding: 60px 0;
    margin-bottom: 50px;
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.page-header h1 {
    margin-bottom: 10px;
    background: linear-gradient(to right, #ffffff, #e0f2fe);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-weight: 800;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

.page-header p {
    color: #e2e8f0;
    font-size: 1.1rem;
    font-weight: 500;
}

/* 3-Column Grid with Max Width */
.services-grid-box {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
    max-width: 1000px;
    margin: 0 auto;
    position: relative;
    z-index: 2;
}

/* Premium Card Design with FULL Gradient Border */
.s-item-card {
    background: white;
    padding: 35px 20px;
    border-radius: 20px;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: var(--dark-text);

    /* Full Gradient Border Logic */
    border: 3px solid transparent;
    background:
        linear-gradient(white, white) padding-box,
        linear-gradient(135deg, #16a34a 0%, #0056b3 100%) border-box;

    box-shadow: var(--card-shadow);
    position: relative;
    overflow: hidden;
}

/* Remove Top Accent Strip */
.s-item-card::after {
    display: none;
}

/* Hover Effect */
.s-item-card:hover {
    transform: translateY(-12px) scale(1.02);
    /* Make shadow play nicely with transparency trick */
    box-shadow: 0 25px 50px -12px rgba(0, 86, 179, 0.25);
}

/* Image Wrapper */
.s-img-wrap {
    width: 140px;
    height: 140px;
    margin-bottom: 25px;
    background: #ffffff;
    border-radius: 15px;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    /* Soft internal shadow */
    box-shadow: inset 0 2px 6px rgba(0, 0, 0, 0.06);
    border: 1px solid #f1f5f9;
}

.s-img-wrap img {
    width: 90%;
    height: 90%;
    object-fit: contain;
    transition: transform 0.5s ease;
}

.s-item-card:hover .s-img-wrap img {
    transform: scale(1.1);
}

.s-item-card h3 {
    font-size: 1.2rem;
    margin-bottom: 15px;
    font-weight: 700;
}

.action-text {
    color: var(--primary-blue);
    font-weight: 600;
    font-size: 0.95rem;
    display: flex;
    align-items: center;
    gap: 8px;
    background: #f0f9ff;
    padding: 8px 16px;
    border-radius: 20px;
    transition: background 0.3s;
}

.s-item-card:hover .action-text {
    background: var(--primary-blue);
    color: white;
}

/* MODAL STYLES */
.modal-overlay {
    display: none;
    /* Hidden by default */
    position: fixed;
    z-index: 2000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6);
    /* Black w/ opacity */
    backdrop-filter: blur(5px);
    justify-content: center;
    align-items: center;
    animation: fadeIn 0.3s;
}

.modal-content {
    background-color: #fefefe;
    padding: 40px;
    border-radius: 20px;
    width: 90%;
    max-width: 600px;
    position: relative;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    animation: slideUp 0.3s;
    max-height: 90vh;
    overflow-y: auto;
}

.close-modal {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
    transition: color 0.3s;
}

.close-modal:hover {
    color: #000;
}

.modal-title {
    font-size: 1.8rem;
    color: var(--primary-blue);
    margin-bottom: 20px;
    border-bottom: 2px solid #f1f5f9;
    padding-bottom: 10px;
}

.doc-section {
    margin-bottom: 20px;
}

.doc-section h4 {
    font-size: 1.1rem;
    color: var(--primary-green);
    margin-bottom: 10px;
}

.doc-list {
    list-style: disc;
    padding-left: 20px;
    color: var(--dark-text);
}

.doc-list li {
    margin-bottom: 5px;
}

.modal-apply-btn {
    display: block;
    width: 100%;
    padding: 15px;
    background: #25D366;
    color: white;
    text-align: center;
    border-radius: 10px;
    font-weight: 700;
    font-size: 1.1rem;
    margin-top: 30px;
    transition: background 0.3s;
}

.modal-apply-btn:hover {
    background: #128C7E;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}

@keyframes slideUp {
    from {
        transform: translateY(20px);
        opacity: 0;
    }

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


/* Floating WhatsApp Button */
.float-wa {
    position: fixed;
    width: 60px;
    height: 60px;
    bottom: 30px;
    right: 30px;
    background-color: #25d366;
    color: #FFF;
    border-radius: 50px;
    text-align: center;
    font-size: 30px;
    box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.3);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
}

.float-wa:hover {
    background-color: #128C7E;
    transform: scale(1.1);
    box-shadow: 2px 2px 15px rgba(0, 0, 0, 0.4);
}



.my-float {
    margin-top: 1px;
}

/* ----------------------------------------------------------------- */
/* FLIGHT SERVICES PAGE SPECIFIC STYLES */
/* ----------------------------------------------------------------- */

.header-blue {
    background: linear-gradient(135deg, #0056b3 0%, #0ea5e9 100%);
}

.flight-card {
    /* Extending s-item-card styles */
    min-height: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.flight-route-icon {
    font-size: 3rem;
    color: var(--primary-blue);
    margin-bottom: 20px;
    background: #e0f2fe;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.flight-desc {
    color: var(--light-text);
    margin-bottom: 20px;
    font-size: 0.95rem;
}

.btn-book-wa {
    display: flex;
    align-items: center;
    gap: 8px;
    background: #25D366;
    color: white;
    padding: 10px 20px;
    border-radius: 25px;
    text-decoration: none;
    font-weight: 600;
    transition: background 0.3s;
    margin-top: auto;
}

.btn-book-wa:hover {
    background: #1fab52;
}


.flight-img-container {
    width: 100%;
    height: 180px;
    border-radius: 15px;
    overflow: hidden;
    position: relative;
    margin-bottom: 20px;
    box-shadow: var(--shadow-sm);
}

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

.flight-card:hover .flight-img-container img {
    transform: scale(1.1);
}

.offer-ribbon {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #FF0000;
    color: white;
    padding: 5px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    z-index: 10;
}

/* AI CHATBOT STYLES */
#ai-chat-toggle {
    position: fixed;
    bottom: 20px;
    left: 20px;
    /* Aligned to Left */
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, #0056b3, #00c6ff);
    color: white;
    border: none;
    border-radius: 50%;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3);
    cursor: pointer;
    z-index: 1000;
    font-size: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

#ai-chat-toggle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
}

#ai-chat-toggle:hover {
    transform: scale(1.1);
    box-shadow: 0 0 20px rgba(0, 198, 255, 0.6);
    /* Glow Effect */
}

#ai-chat-toggle.hidden {
    transform: scale(0);
    opacity: 0;
    pointer-events: none;
}

.notification-dot {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 12px;
    height: 12px;
    background: #ff0000;
    border-radius: 50%;
    border: 2px solid white;
}

/* Tooltip Popup */
#ai-tooltip {
    position: fixed;
    bottom: 90px;
    right: 20px;
    /* Moved to Right */
    left: auto;
    background: white;
    color: #1e293b;
    padding: 8px 12px;
    border-radius: 10px;
    border-bottom-right-radius: 2px;
    /* Point to right corner */
    border-bottom-left-radius: 10px;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.15);
    font-size: 13px;
    font-weight: 600;
    z-index: 999;
    white-space: nowrap;
    animation: floatTooltip 2s infinite ease-in-out;
    pointer-events: none;
    opacity: 1;
    transition: opacity 0.3s;
}

/* Hide tooltip when chat is active (handled via JS class toggling ideally, or adjacent selector if HTML allows) */
/* Since widget is active via JS, we can just hide this via JS too, or use CSS if structure permits. 
   Structure: widget, tooltip, button. 
   If widget.active, we want tooltip hidden. But specific sibling selector might be tricky if not direct.
   Simplest: Add .hidden to tooltip in JS. 
   BUT for now, let's just let it float or handle via simple CSS if possible.
*/

@keyframes floatTooltip {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-5px);
    }
}

#ai-chat-widget {
    position: fixed;
    bottom: 90px;
    left: 20px;
    /* Aligned to Left */
    width: 320px;
    background: white;
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    z-index: 1000;
    overflow: hidden;
    transform: translateY(20px);
    opacity: 0;
    visibility: hidden;
    transition: all 0.3s ease;
    display: flex;
    flex-direction: column;
}

#ai-chat-widget.active {
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
}

#chat-header {
    background: linear-gradient(135deg, #0056b3, #00c6ff);
    color: white;
    padding: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.chat-title {
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 8px;
}

#close-chat {
    background: none;
    border: none;
    color: white;
    font-size: 18px;
    cursor: pointer;
}

#chat-body {
    padding: 20px;
    background: #f8fafc;
    min-height: 250px;
    max-height: 500px;
    overflow-y: auto;
}

.chat-message {
    background: white;
    padding: 12px;
    border-radius: 12px;
    border-bottom-left-radius: 2px;
    margin-bottom: 20px;
    font-size: 0.95rem;
    color: #334155;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
    line-height: 1.5;
}

.chat-options {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.chat-btn {
    background: white;
    border: 1px solid #e2e8f0;
    padding: 10px 15px;
    border-radius: 8px;
    text-align: left;
    cursor: pointer;
    transition: all 0.2s;
    font-size: 0.9rem;
    color: #1e293b;
    display: block;
    width: 100%;
}

.chat-btn:hover {
    background: #e0f2fe;
    border-color: #0056b3;
    color: #0056b3;
}

.link-btn {
    text-align: center;
    text-decoration: none;
    background: #f0f9ff;
    font-weight: 600;
}

/* Float WA to Right (Default/Restored) */
.float-wa {
    right: 20px !important;
    left: auto !important;
    /* Reset left */
    bottom: 20px !important;
}

.fade-in {
    animation: fadeIn 0.3s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(5px);
    }

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

/* Chat Input Area */
#chat-input-area {
    padding: 10px;
    border-top: 1px solid #e2e8f0;
    display: flex;
    gap: 10px;
    background: white;
}

#user-input {
    flex: 1;
    padding: 10px;
    border: 1px solid #cbd5e1;
    border-radius: 20px;
    outline: none;
    font-family: inherit;
    font-size: 0.9rem;
}

#user-input:focus {
    border-color: #0056b3;
}

#send-btn {
    background: #0056b3;
    color: white;
    border: none;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    cursor: pointer;
    transition: background 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}

#send-btn:disabled,
#user-input:disabled {
    background: #f1f5f9;
    color: #94a3b8;
    cursor: not-allowed;
}

#send-btn:hover:not(:disabled) {
    background: #004494;
}

/* BLOG PAGE STYLES */
.blog-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}

.blog-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
    transition: transform 0.3s ease;
    border: 1px solid #f1f5f9;
}

.blog-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.1);
}

.blog-img {
    height: auto;
    overflow: hidden;
    position: relative;
}

.blog-img img {
    width: 100%;
    height: auto;
    object-fit: contain;
}

.blog-date {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 0.8rem;
    font-weight: 500;
}

.blog-content {
    padding: 25px;
}

.blog-tag {
    display: inline-block;
    padding: 4px 10px;
    background: #e0f2fe;
    color: #0056b3;
    border-radius: 5px;
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 10px;
}

.blog-card h3 {
    font-family: 'Outfit', sans-serif;
    font-size: 1.2rem;
    color: #1e293b;
    margin-bottom: 10px;
}

.blog-card p {
    color: #64748b;
    font-size: 0.95rem;
    line-height: 1.6;
    margin-bottom: 20px;
}

.share-options {
    border-top: 1px solid #f1f5f9;
    padding-top: 15px;
    display: flex;
    align-items: center;
    gap: 10px;
}

.share-options span {
    font-size: 0.9rem;
    color: #94a3b8;
    font-weight: 600;
}

.share-btn {
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    text-decoration: none;
    font-size: 14px;
    transition: transform 0.2s;
}

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

.share-btn.wa {
    background: #25D366;
}

.share-btn.fb {
    background: #1877F2;
}

.share-btn.tw {
    background: #1DA1F2;
}

/* NEWS TICKER STYLES */
.news-ticker-wrap {
    background: #000;
    color: white;
    padding: 8px 0;
    font-size: 0.9rem;
    overflow: hidden;
    position: relative;
    z-index: 10;
    min-height: 38px;
    /* Instant feel prevention of layout shift */
}

.news-ticker-wrap .container {
    display: flex;
    align-items: center;
}

.ticker-label {
    background: #ef4444;
    /* Red Label */
    padding: 2px 10px;
    border-radius: 4px;
    font-weight: 700;
    margin-right: 15px;
    white-space: nowrap;
    z-index: 20;
}

.ticker-container {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.ticker-move {
    display: inline-block;
    white-space: nowrap;
    animation: tickerScroll 40s linear infinite;
}

.ticker-move:hover {
    animation-play-state: paused;
}

.t-item {
    margin-right: 50px;
    display: inline-block;
}

@keyframes tickerScroll {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(-100%);
    }
}

@media (max-width: 768px) {
    .ticker-label {
        font-size: 0.8rem;
        padding: 2px 5px;
    }

    .t-item {
        font-size: 0.85rem;
    }
}

/* TESTIMONIAL STYLES */
.testimonial-grid {
    gap: 30px;
}

.review-card {
    background: linear-gradient(135deg, #ecfdf5 0%, #e0f2fe 100%) !important;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #f1f5f9;
    transition: transform 0.3s;
}

.review-card:hover {
    transform: translateY(-5px);
}

.stars {
    color: #fbbf24;
    font-size: 1.2rem;
    margin-bottom: 15px;
    letter-spacing: 2px;
}

.review-text {
    font-style: italic;
    color: #475569;
    margin-bottom: 20px;
    line-height: 1.6;
}

.reviewer strong {
    display: block;
    color: #1e293b;
    font-size: 1.1rem;
}

.reviewer span {
    font-size: 0.9rem;
    color: #94a3b8;
}

/* LEGAL FOOTER LINKS */
.legal-links {
    font-size: 0.9rem;
    color: #94a3b8;
    margin-bottom: 10px;
}

.legal-links a {
    color: #64748b;
    text-decoration: none;
    transition: color 0.3s;
}

/* =========================================
   RESPONSIVE & ACCESSIBILITY STYLES
   ========================================= */

/* Accessibility Base */
html {
    font-size: 16px;
    /* Base for REM */
}

@media (max-width: 768px) {

    /* 1. Layout & Typography */
    .grid-2,
    .grid-3,
    .grid-4 {
        grid-template-columns: 1fr !important;
        gap: 20px;
    }

    h1 {
        font-size: 2rem !important;
    }

    h2 {
        font-size: 1.75rem !important;
    }

    h3 {
        font-size: 1.5rem !important;
    }

    .container {
        padding: 0 15px;
    }

    .section-padding {
        padding: 50px 0;
    }

    /* 2. Navigation (Hamburger) */
    .navbar .flex-between {
        flex-wrap: wrap;
        /* Allow wrapping */
    }

    .nav-links {
        display: none;
        flex-direction: column;
        width: 100%;
        position: absolute;
        top: 70px;
        left: 0;
        background: white;
        padding: 20px;
        box-shadow: 0 10px 15px rgba(0, 0, 0, 0.1);
        z-index: 1000;
        border-top: 1px solid #f1f5f9;
        text-align: center;
    }

    .nav-links.active {
        display: flex;
    }

    .nav-links li {
        margin: 15px 0;
    }

    .mobile-toggle {
        display: block !important;
        font-size: 1.5rem;
        cursor: pointer;
        padding: 10px;
    }

    /* 3. Hero Section */
    .hero {
        padding: 100px 0 50px;
        /* More top padding for nav */
        text-align: center;
        background-position: center;
    }

    .hero h1 {
        font-size: 2.2rem !important;
    }

    .hero p {
        font-size: 1rem !important;
    }

    /* 4. Touch Targets & Buttons */
    .btn,
    button,
    .chat-btn {
        min-height: 48px;
        /* Accessible touch target */
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* 5. Modules */
    .flight-card,
    .service-box,
    .service-box-clean {
        margin-bottom: 15px;
    }

    .modal-content {
        margin: 20% auto;
        /* More margin on mobile */
        width: 90%;
        padding: 20px;
    }

    .whatsapp-float {
        bottom: 80px;
        /* Above AI bot */
        right: 20px;
    }

    #ai-chat-widget {
        width: 90% !important;
        right: 5% !important;
        bottom: 80px !important;
        left: 5% !important;
    }

    /* Hide decorative/large visuals on super small screens if needed */
    .payment-visual img {
        max-width: 80%;
        margin: 0 auto;
        display: block;
    }
}

/* Specific Larger Touch for Elderly (Any Device) */
body {
    -webkit-text-size-adjust: 100%;
}

/* ----------------------------------------------------------------- */
/* CONVERSION FEATURES (STICKY FOOTER & EXIT INTENT) */
/* ----------------------------------------------------------------- */



/* 2. Exit Intent Popup */
.exit-intent-modal {
    display: none;
    /* Hidden by default */
    align-items: center;
    justify-content: center;
}

.exit-icon {
    font-size: 3rem;
    color: var(--primary-blue);
    margin-bottom: 15px;
    animation: bounce 2s infinite;
}

@keyframes bounce {

    0%,
    20%,
    50%,
    80%,
    100% {
        transform: translateY(0);
    }

    40% {
        transform: translateY(-10px);
    }

    60% {
        transform: translateY(-5px);
    }
}

.tiny-text {
    font-size: 0.8rem;
    color: #94a3b8;
    margin-top: 15px;
    cursor: pointer;
    text-decoration: underline;
}

.full-width {
    width: 100%;
    justify-content: center;
}

/* ----------------------------------------------------------------- */
/* KNOWLEDGE HUB (BLOG) STYLES */
/* ----------------------------------------------------------------- */
.header-purple {
    background: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    color: white;
}

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

.blog-card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: transform 0.3s;
    border: 1px solid #e2e8f0;
}

.blog-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
}

.blog-img {
    height: 200px;
    position: relative;
    background: #f8fafc;
}

.blog-img img {
    width: 100%;
    height: 100%;
}

.cat-tag {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0, 0, 0, 0.7);
    color: white;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.8rem;
    font-weight: 500;
}

.blog-content {
    padding: 25px;
}

.blog-content h3 {
    font-size: 1.25rem;
    margin-bottom: 10px;
    line-height: 1.4;
}

.excerpt {
    font-size: 0.95rem;
    color: var(--light-text);
    margin-bottom: 15px;
}

.key-points {
    margin-bottom: 20px;
}

.key-points li {
    font-size: 0.9rem;
    color: #475569;
    margin-bottom: 5px;
}

.key-points i {
    color: var(--primary-green);
    margin-right: 8px;
}

.btn-read-wa {
    display: block;
    text-align: center;
    background: #f1f5f9;
    color: var(--primary-blue);
    padding: 10px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 0.9rem;
    transition: background 0.3s;
}

.btn-read-wa:hover {
    background: var(--primary-blue);
    color: white;
}

/* --- Breadcrumbs --- */
.nanbenda-breadcrumb {
    padding: 15px 20px;
    background-color: #f8f9fa;
    margin-bottom: 20px;
    border-radius: 8px;
    font-size: 0.95rem;
    color: #6c757d;
    font-weight: 500;
}

.nanbenda-breadcrumb a {
    color: #0d6efd;
    text-decoration: none;
    transition: color 0.3s;
}

.nanbenda-breadcrumb a:hover {
    color: #0a58ca;
    text-decoration: underline;
}

.nanbenda-breadcrumb .separator {
    margin: 0 8px;
    color: #adb5bd;
}

/* ----------------------------------------------------------------- */
/* CHATBOT POSITIONING (RIGHT SIDE) */
/* ----------------------------------------------------------------- */
#ai-chat-widget,
#ai-chat-toggle {
    right: 30px !important;
    left: auto !important;
    bottom: 30px !important;
}

#ai-chat-widget {
    position: fixed;
    width: 350px;
    background: white;
    border-radius: 15px;
    box-shadow: 0 5px 25px rgba(0, 0, 0, 0.15);
    z-index: 9999;
    display: none;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid #e2e8f0;
}

#ai-chat-toggle {
    position: fixed;
    background: white;
    border: none;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
    z-index: 10000;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: transform 0.3s;
}

#ai-chat-toggle:hover {
    transform: scale(1.1);
}

#ai-chat-toggle img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 50%;
    padding: 6px;
    /* Ensuring it fits well within the 60px button */
    display: block;
}

#ai-chat-widget.active {
    display: flex;
}

/* Mobile Adjustments for Chatbot */
@media (max-width: 768px) {
    #ai-chat-widget {
        width: 90% !important;
        right: 5% !important;
        left: 5% !important;
        bottom: 80px !important;
        /* Above sticky bar */
    }

    #ai-chat-toggle {
        bottom: 80px !important;
        right: 20px !important;
    }
}

/* ENFORCE RIGHT POSITION - Added by AI */
body #ai-chat-widget,
body #ai-chat-toggle {
    left: auto !important;
    right: 20px !important;
    bottom: 20px !important;
}

/* Hide any remaining WhatsApp Floats */
.whatsapp-float,
.float-wa {
    display: none !important;
}

/* About Page Image Constraint */
.about-image img {
    max-height: 350px !important;
    object-fit: cover !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    display: block !important;
}

/* ----------------------------------------------------------------- */
/* E-SEVAI PREMIUM GRID OVERHAUL (FORCED ATTRACTIVE GRADIENTS) */
/* ----------------------------------------------------------------- */
/* Targetting ALL user requested grids: 
   - Service Cards
   - Pay Card (GPay)
   - Visual/Flight Cards
   - Review Cards (Happy Customers)
   - Contact Info Box (Visit Us)
   - Map Box 
*/

.service-card,
.pay-card,
.visual-card,
.review-card,
.contact-info-box,
.map-box {
    background: linear-gradient(135deg, #dbeafe 0%, #dcfce7 100%) !important;
    /* Vibrant Blue to Green by default */
    border: 1px solid #7dd3fc !important;
    border-radius: 20px !important;
    box-shadow: 0 10px 25px -5px rgba(14, 165, 233, 0.2) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s ease !important;
    overflow: hidden;
    position: relative;
    z-index: 1;
}

/* Add a subtle top highlight for 3D effect */
.service-card::before,
.pay-card::before,
.visual-card::before,
.review-card::before,
.contact-info-box::before,
.map-box::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.9), transparent);
    z-index: 2;
}

/* Stronger Hover Effect */
.service-card:hover,
.pay-card:hover,
.visual-card:hover,
.review-card:hover,
.contact-info-box:hover,
.map-box:hover {
    transform: translateY(-8px) !important;
    box-shadow: 0 25px 50px -12px rgba(14, 165, 233, 0.4) !important;
    background: linear-gradient(135deg, #bfdbfe 0%, #bbf7d0 100%) !important;
    /* Even denser Blue/Green on hover */
    border-color: #38bdf8 !important;
}

/* Specific Padding/Layout Fixes for Contact Boxes since they were raw divs */
.contact-info-box,
.map-box {
    padding: 30px !important;
    height: 100%;
    display: block;
}

/* Ensure Map Inner is Clean */
.map-box div {
    background: white !important;
    /* Reset inner placeholder background if any */
    border-radius: 15px;
    overflow: hidden;
    box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.05);
}