:root {
      --bg-color: #F8FAFC;
      --card-bg: #FFFFFF;
      --card-border: #E2E8F0;
      --accent-green: #10B981;
      --accent-green-hover: #059669;
      --accent-blue: #3B82F6;
      --accent-blue-hover: #1D4ED8;
      --danger-color: #EF4444;
      --text-white: #0F172A;
      --text-gray: #64748B;
      --text-secondary: #475569;
      --border-hover: #CBD5E1;
      --surface-1: #F8FAFC;
      --surface-2: #F1F5F9;
      --nav-active-bg: #0F172A;
      --nav-active-text: #FFFFFF;
      --font-main: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      --shadow-sm: 0 1px 3px rgba(0,0,0,0.05);
      --shadow-md: 0 4px 20px -2px rgba(0, 0, 0, 0.05);
      --shadow-lg: 0 10px 25px -5px rgba(0, 0, 0, 0.08);
      --glass-bg: rgba(255, 255, 255, 0.85);
    }

    :root[data-theme="dark"] {
      --bg-color: #0B1220;
      --card-bg: #1E293B;
      --card-border: #334155;
      --text-white: #F1F5F9;
      --text-gray: #94A3B8;
      --text-secondary: #CBD5E1;
      --border-hover: #475569;
      --surface-1: #17233A;
      --surface-2: #1E293B;
      --nav-active-bg: #F1F5F9;
      --nav-active-text: #0F172A;
      --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
      --shadow-md: 0 4px 20px -2px rgba(0,0,0,0.5);
      --shadow-lg: 0 10px 25px -5px rgba(0,0,0,0.6);
      --glass-bg: rgba(15, 23, 42, 0.85);
    }

    * { box-sizing: border-box; margin: 0; padding: 0; font-family: var(--font-main); }
    body { background-color: var(--bg-color); color: var(--text-white); display: flex; justify-content: center; line-height: 1.5; min-height: 100vh; transition: background-color 0.35s ease, color 0.35s ease; }
    .app-container { width: 100%; max-width: 1100px; padding: 20px 16px; }

    /* Smooth theme transition across all themeable surfaces */
    .header, .card, .badge, .cat-btn, .input-field, .select-field, .textarea-field,
    .calc-container, .price-tier-box, .checkbox-item, .calc-summary, .route-matcher-card,
    .route-chip, .faq-item, .faq-answer, .map-container, .admin-card, .metric-box,
    .admin-table th, .admin-table td, .add-review-card, .review-card, .lang-switcher,
    .lang-btn, .spec-item, .nav-btn, .hamburger-btn, .nav-wrapper, .theme-toggle-btn,
    .lightbox-content {
      transition: background-color 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease;
    }

    /* Header & Navigation with Glassmorphism */
    .header { 
      display: flex; justify-content: space-between; align-items: center; 
      margin-bottom: 24px; flex-wrap: wrap; gap: 16px; 
      border-bottom: 1px solid var(--card-border); padding: 16px 20px; 
      background: var(--glass-bg); backdrop-filter: blur(12px);
      border-radius: 16px; box-shadow: var(--shadow-sm); position: sticky; top: 10px; z-index: 100;
    }
    .logo { font-size: 22px; font-weight: 800; letter-spacing: -0.5px; cursor: pointer; user-select: none; transition: transform 0.2s; display: flex; align-items: center; gap: 10px; }
    .logo:hover { transform: scale(1.02); }
    .logo span { color: var(--accent-green); }
    .logo-img { height: 36px; width: auto; max-width: 140px; object-fit: contain; border-radius: 6px; display: block; }
    .logo-text { line-height: 1.1; }
    @media (max-width: 480px) {
      .logo-img { height: 28px; }
      .logo-text { font-size: 16px; }
    }

    .nav-wrapper { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; flex: 1; justify-content: flex-end; }
    .header-controls { display: flex; align-items: center; gap: 10px; }

    .nav-links { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
    .nav-btn { background: none; border: none; color: var(--text-gray); font-size: 14px; font-weight: 600; cursor: pointer; padding: 8px 14px; border-radius: 10px; transition: all 0.2s ease; }
    .nav-btn:hover { color: var(--text-white); background: rgba(127, 127, 127, 0.08); }
    .nav-btn.active { color: var(--nav-active-text); background: var(--nav-active-bg); box-shadow: var(--shadow-sm); }

    /* Hamburger toggle (mobile only) */
    .hamburger-btn { display: none; background: var(--surface-2); border: 1px solid var(--card-border); color: var(--text-white); width: 40px; height: 40px; border-radius: 10px; font-size: 18px; cursor: pointer; align-items: center; justify-content: center; }

    /* Theme toggle */
    .theme-toggle-btn { background: var(--surface-2); border: 1px solid var(--card-border); width: 38px; height: 38px; border-radius: 10px; cursor: pointer; font-size: 16px; display: flex; align-items: center; justify-content: center; transition: all 0.2s; }
    .theme-toggle-btn:hover { border-color: var(--border-hover); }

    /* Language Switcher with Modern Badges & Flags */
    .lang-switcher { display: flex; align-items: center; gap: 4px; background: var(--surface-2); padding: 4px; border-radius: 12px; border: 1px solid var(--card-border); }
    .lang-btn { background: none; border: none; color: var(--text-gray); font-size: 13px; font-weight: 700; cursor: pointer; padding: 6px 10px; border-radius: 8px; display: flex; align-items: center; gap: 6px; transition: all 0.2s; }
    .lang-btn.active { color: var(--text-white); background: var(--card-bg); box-shadow: 0 1px 3px rgba(0,0,0,0.1); }
    .flag-icon { width: 18px; height: 13px; border-radius: 2px; object-fit: cover; box-shadow: 0 1px 2px rgba(0,0,0,0.1); }

    @media (max-width: 768px) {
      .hamburger-btn { display: flex; }
      .nav-wrapper {
        display: none;
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        width: 100%;
        position: absolute;
        top: 100%;
        left: 0;
        margin-top: 10px;
        background: var(--card-bg);
        border: 1px solid var(--card-border);
        border-radius: 16px;
        padding: 16px;
        box-shadow: var(--shadow-lg);
        z-index: 200;
      }
      .nav-wrapper.open { display: flex; animation: fadeIn 0.25s ease; }
      .nav-links { flex-direction: column; align-items: stretch; }
      .nav-btn { text-align: left; width: 100%; }
      .header-controls { justify-content: space-between; width: 100%; }
    }


    .page-section { display: block; animation: fadeIn 0.3s ease-in-out; }
    .page-section.hidden, .hidden { display: none !important; }

    @keyframes fadeIn {
      from { opacity: 0; transform: translateY(6px); }
      to { opacity: 1; transform: translateY(0); }
    }

    .hero { margin-bottom: 24px; text-align: left; }
    .hero h1 { font-size: 34px; margin-bottom: 8px; line-height: 1.2; font-weight: 800; letter-spacing: -0.5px; }
    .hero p { color: var(--text-gray); font-size: 15px; }

    .badges { display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 24px 0; }
    .badge { background: var(--card-bg); border: 1px solid var(--card-border); padding: 8px 14px; border-radius: 20px; font-size: 13px; color: var(--accent-green-hover); font-weight: 700; box-shadow: var(--shadow-sm); display: flex; align-items: center; gap: 6px; }

    .controls-bar { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }
    @media (min-width: 768px) { .controls-bar { flex-direction: row; justify-content: space-between; align-items: center; } }

    .search-sort-group { display: flex; gap: 10px; flex-wrap: wrap; width: 100%; }
    @media (min-width: 768px) { .search-sort-group { width: auto; } }

    .input-field, .select-field, .textarea-field { background: var(--card-bg); border: 1px solid var(--card-border); color: var(--text-white); padding: 10px 14px; border-radius: 12px; font-size: 14px; outline: none; transition: all 0.2s; width: 100%; box-shadow: var(--shadow-sm); }
    .input-field:focus, .select-field:focus, .textarea-field:focus { border-color: var(--accent-green); box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.15); }

    .categories { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; }
    .cat-btn { background: var(--card-bg); border: 1px solid var(--card-border); color: var(--text-gray); padding: 8px 16px; border-radius: 12px; font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; transition: all 0.2s; box-shadow: var(--shadow-sm); }
    .cat-btn:hover { color: var(--text-white); border-color: var(--border-hover); }
    .cat-btn.active { background: var(--accent-green); color: #FFFFFF; border-color: var(--accent-green); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.25); }

    .content-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media (min-width: 768px) { .content-grid { grid-template-columns: repeat(3, 1fr); } }

    /* Modern Card UI */
    .card { background: var(--card-bg); border-radius: 20px; padding: 18px; border: 1px solid var(--card-border); display: flex; flex-direction: column; justify-content: space-between; transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); box-shadow: var(--shadow-md); position: relative; overflow: hidden; }
    .card:hover { transform: translateY(-6px); border-color: var(--border-hover); box-shadow: var(--shadow-lg); }
    
    .image-container { position: relative; width: 100%; height: 190px; margin-bottom: 14px; overflow: hidden; border-radius: 14px; }
    .driver-mode-badge {
      position: absolute; top: 10px; right: 10px; z-index: 5;
      padding: 5px 10px; border-radius: 999px; font-size: 11px; font-weight: 700;
      backdrop-filter: blur(4px); box-shadow: var(--shadow-sm); white-space: nowrap;
      color: #fff;
    }
    .driver-mode-badge.only-driver { background: rgba(217, 119, 6, 0.92); }
    .driver-mode-badge.self-drive { background: rgba(16, 122, 87, 0.9); }
    .lightbox-disclaimer {
      font-size: 12.5px; line-height: 1.5; color: var(--text-gray); font-style: italic;
      background: var(--surface-2); border-left: 3px solid var(--accent-blue);
      padding: 10px 12px; border-radius: 8px; margin: 4px 0 14px 0;
    }
    .lightbox-disclaimer:empty { display: none; }
    .card-image { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 0.4s; display: block; background: var(--surface-1); }
    .image-container { height: clamp(175px, 30vw, 230px); aspect-ratio: 16 / 10; }
    .admin-image-manager { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; margin-top: 10px; }
    .admin-image-item { position: relative; aspect-ratio: 16 / 10; border: 1px solid var(--card-border); border-radius: 10px; overflow: hidden; background: var(--surface-1); }
    .admin-image-manager { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:12px; margin-top:10px; }
    .admin-image-manager .admin-image-item { position:relative; aspect-ratio:4/3; border:1px solid var(--card-border); border-radius:12px; overflow:hidden; background:var(--surface-1); }
    .admin-image-manager .admin-image-item img { width:100%; height:100%; object-fit:cover; display:block; }
    .admin-image-manager .admin-image-actions { position:absolute; inset:auto 7px 7px 7px; display:flex; gap:6px; justify-content:space-between; }
    .admin-image-manager .admin-image-actions button { border:0; border-radius:8px; padding:6px 8px; font-size:11px; font-weight:800; cursor:pointer; background:rgba(15,23,42,.86); color:#fff; }
    .admin-image-manager .admin-image-actions .danger { background:rgba(220,38,38,.92); }
    .admin-image-manager .admin-image-main { position:absolute; top:7px; left:7px; padding:4px 7px; border-radius:999px; background:rgba(16,185,129,.95); color:#fff; font-size:10px; font-weight:800; }
    .admin-image-manager .admin-image-kind { position:absolute; top:7px; right:7px; padding:4px 7px; border-radius:999px; background:rgba(15,23,42,.78); color:#fff; font-size:10px; }
    .booking-status { display:inline-flex; align-items:center; gap:5px; padding:4px 8px; border-radius:999px; font-size:11px; font-weight:800; }
    .booking-status.pending { background:rgba(245,158,11,.14); color:#B45309; }
    .booking-status.confirmed { background:rgba(16,185,129,.14); color:#047857; }
    .booking-status.rejected, .booking-status.cancelled { background:rgba(239,68,68,.14); color:#B91C1C; }
    .booking-status.completed { background:rgba(59,130,246,.14); color:#1D4ED8; }
    .admin-table-wrap { overflow-x:auto; }
    .responsive-car-image { width:100%; height:100%; object-fit:cover; display:block; }
    @media (max-width: 700px) {
      .admin-card { padding:18px 14px; }
      .admin-metrics { grid-template-columns:repeat(2,1fr); }
      .form-grid-2,.form-grid-3,.form-grid-4 { grid-template-columns:1fr; }
      .admin-image-manager { grid-template-columns:repeat(2,minmax(0,1fr)); }
      .admin-table { min-width:760px; }
      .floating-wa { bottom:78px; right:16px; }
    }

    .admin-image-item img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .admin-image-remove { position: absolute; top: 6px; right: 6px; width: 28px; height: 28px; border: 0; border-radius: 50%; background: rgba(220,38,38,.92); color: #fff; cursor: pointer; font-weight: 800; line-height: 28px; }
    .admin-image-type { position: absolute; left: 6px; bottom: 6px; max-width: calc(100% - 12px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 3px 7px; border-radius: 6px; background: rgba(0,0,0,.65); color: #fff; font-size: 10px; }
    @media (max-width: 600px) { .image-container { height: 210px; } .admin-image-manager { grid-template-columns: repeat(2, minmax(0,1fr)); } }
    .card:hover .card-image { transform: scale(1.04); }
    .carousel-btn { position: absolute; top: 50%; transform: translateY(-50%); background: rgba(0,0,0,0.6); backdrop-filter: blur(4px); color: white; border: none; width: 32px; height: 32px; border-radius: 50%; cursor: pointer; font-size: 12px; display: flex; align-items: center; justify-content: center; transition: background 0.2s; }
    .carousel-btn:hover { background: rgba(0,0,0,0.8); }
    .carousel-btn.left { left: 8px; }
    .carousel-btn.right { right: 8px; }

    .card-title { font-size: 18px; font-weight: 800; margin-bottom: 6px; letter-spacing: -0.3px; }
    .card-desc { color: var(--text-gray); font-size: 13px; margin-bottom: 14px; line-height: 1.4; }

    .specs-box { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 14px; font-size: 12px; color: var(--text-gray); border-top: 1px dashed var(--card-border); border-bottom: 1px dashed var(--card-border); padding: 10px 0; }
    .spec-item { display: flex; align-items: center; gap: 4px; background: var(--surface-2); padding: 4px 8px; border-radius: 8px; font-weight: 600; color: var(--text-secondary); }

    .price-tier-box { background: var(--surface-1); padding: 10px 12px; border-radius: 12px; border: 1px solid var(--card-border); margin-bottom: 14px; font-size: 12px; }
    .price-tier-row { display: flex; justify-content: space-between; margin-bottom: 3px; }
    .price-tier-row span.val { font-weight: 700; color: var(--text-white); }

    .card-footer { display: flex; flex-direction: column; gap: 10px; }
    .card-footer-actions { display: flex; justify-content: space-between; align-items: center; gap: 8px; }

    /* Car Comparison feature */
    .compare-check-label { display: flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; color: var(--text-gray); cursor: pointer; user-select: none; }
    .compare-check-label input { width: 15px; height: 15px; accent-color: var(--accent-blue); cursor: pointer; }

    /* Share button */
    .share-btn {
      display: inline-flex; align-items: center; justify-content: center;
      width: 32px; height: 32px; border-radius: 50%; border: 1px solid var(--card-border);
      background: var(--surface-1); color: var(--text-gray); cursor: pointer;
      transition: background 0.2s, color 0.2s, transform 0.2s; flex-shrink: 0;
    }
    .share-btn:hover { background: var(--accent-blue); color: #fff; transform: translateY(-1px); border-color: var(--accent-blue); }
    .share-btn svg { width: 15px; height: 15px; }

    /* Toast notification (used by the share/copy-link fallback) */
    .toast-notification {
      position: fixed; left: 50%; bottom: 28px; transform: translateX(-50%) translateY(20px);
      background: #1F2937; color: #fff; padding: 12px 20px; border-radius: 12px;
      font-size: 13.5px; font-weight: 600; box-shadow: 0 8px 24px rgba(0,0,0,0.25);
      display: flex; align-items: center; gap: 8px; z-index: 9999;
      opacity: 0; pointer-events: none; transition: opacity 0.25s ease, transform 0.25s ease;
      max-width: 90vw; text-align: center;
    }
    .toast-notification.show { opacity: 1; transform: translateX(-50%) translateY(0); }

    /* Success modal (booking voucher generated) */
    .success-modal-overlay {
      position: fixed; inset: 0; background: rgba(0,0,0,0.55); z-index: 9998;
      display: flex; align-items: center; justify-content: center; padding: 20px;
    }
    .success-modal-overlay.hidden { display: none; }
    .success-modal-box {
      background: var(--card-bg); border-radius: 20px; padding: 32px 28px; max-width: 380px; width: 100%;
      text-align: center; box-shadow: var(--shadow-md);
    }
    .success-modal-checkmark {
      width: 64px; height: 64px; border-radius: 50%; background: rgba(16,185,129,0.12);
      display: flex; align-items: center; justify-content: center; margin: 0 auto 16px;
      font-size: 32px; color: var(--accent-green);
    }
    .success-modal-box h3 { font-size: 19px; font-weight: 800; margin-bottom: 8px; }
    .success-modal-box p { font-size: 13.5px; color: var(--text-gray); margin-bottom: 20px; line-height: 1.5; }

    .compare-bar {
      position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%);
      background: var(--nav-active-bg); color: var(--nav-active-text);
      padding: 12px 18px; border-radius: 14px; box-shadow: var(--shadow-lg);
      display: flex; align-items: center; gap: 16px; z-index: 300;
      font-size: 14px; font-weight: 700;
    }
    .compare-bar .btn-action { padding: 8px 14px; font-size: 13px; }

    .compare-modal-content { max-width: 900px; width: 95%; }
    .compare-table-wrap { overflow-x: auto; }
    .compare-table { width: 100%; border-collapse: collapse; }
    .compare-table th, .compare-table td { padding: 10px 14px; text-align: left; border-bottom: 1px solid var(--card-border); white-space: nowrap; }
    .compare-table th:first-child, .compare-table td:first-child { color: var(--text-gray); font-weight: 600; white-space: nowrap; }
    .compare-table img { width: 120px; height: 75px; object-fit: cover; border-radius: 10px; }
    .compare-table .compare-remove-btn { background: none; border: none; color: var(--danger-color); cursor: pointer; font-size: 12px; font-weight: 700; margin-top: 6px; }

    .btn-action { background: linear-gradient(135deg, #10B981 0%, #059669 100%); color: #FFFFFF; border: none; padding: 12px 16px; border-radius: 12px; font-weight: 700; font-size: 14px; cursor: pointer; transition: all 0.2s; text-align: center; text-decoration: none; display: inline-block; box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2); }
    .btn-action:hover { opacity: 0.95; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(16, 185, 129, 0.3); }

    /* Calculator Modern Design */
    .calc-container { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 28px; max-width: 800px; margin: 0 auto; box-shadow: var(--shadow-md); }
    .calc-grid { display: grid; grid-template-columns: 1fr; gap: 24px; }
    @media (min-width: 768px) { .calc-grid { grid-template-columns: 1fr 1fr; } }
    .calc-group { display: flex; flex-direction: column; gap: 8px; }
    .checkbox-group { display: flex; flex-direction: column; gap: 12px; margin-top: 10px; }
    .checkbox-item { display: flex; align-items: center; gap: 10px; font-size: 14px; cursor: pointer; background: var(--surface-1); padding: 8px 12px; border-radius: 10px; border: 1px solid var(--card-border); transition: background 0.2s; }
    .checkbox-item:hover { background: var(--surface-2); }
    .calc-summary { background: var(--surface-1); border-radius: 16px; padding: 20px; margin-top: 24px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; border: 1px solid var(--card-border); }
    .total-price { font-size: 32px; font-weight: 800; color: var(--accent-green); }

    /* Floating WhatsApp Button Widget */
    .floating-wa { position: fixed; bottom: 24px; right: 24px; background: #25D366; color: white; width: 56px; height: 56px; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 25px rgba(37, 211, 102, 0.4); text-decoration: none; font-size: 28px; z-index: 1000; transition: all 0.3s; }
    .floating-wa:hover { transform: scale(1.1); box-shadow: 0 12px 30px rgba(37, 211, 102, 0.6); }

    .route-matcher-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 24px; margin-bottom: 24px; box-shadow: var(--shadow-md); }
    .route-selector { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
    .route-chip { background: var(--surface-2); border: 1px solid var(--card-border); color: var(--text-white); padding: 10px 16px; border-radius: 12px; font-size: 13px; font-weight: 600; cursor: pointer; transition: all 0.2s; }
    .route-chip.active { background: var(--accent-green); color: #FFFFFF; font-weight: 700; border-color: var(--accent-green); box-shadow: 0 4px 12px rgba(16, 185, 129, 0.2); }
    .recommendation-box { margin-top: 16px; padding: 16px; background: rgba(16, 185, 129, 0.08); border-left: 4px solid var(--accent-green); border-radius: 10px; font-size: 14px; font-weight: 600; }

    .faq-list { display: flex; flex-direction: column; gap: 12px; max-width: 800px; margin: 0 auto; }
    .faq-item { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; overflow: hidden; box-shadow: var(--shadow-sm); transition: border 0.2s; }
    .faq-question { padding: 18px 20px; font-size: 15px; font-weight: 700; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
    .faq-answer { padding: 0 20px 18px 20px; color: var(--text-gray); font-size: 14px; display: none; line-height: 1.6; }
    .faq-item.active { border-color: var(--accent-green); }
    .faq-item.active .faq-answer { display: block; }

    .map-container { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 24px; max-width: 800px; margin: 0 auto; box-shadow: var(--shadow-md); }
    .map-frame { width: 100%; height: 380px; border: none; border-radius: 14px; margin-top: 14px; }

    .admin-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 28px; max-width: 900px; margin: 0 auto 30px auto; box-shadow: var(--shadow-md); }
    .admin-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--card-border); margin-bottom: 20px; }
    .admin-title { font-size: 20px; font-weight: 800; display: flex; align-items: center; gap: 8px; }
    
    .admin-metrics { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 24px; }
    .metric-box { background: var(--surface-1); border: 1px solid var(--card-border); border-radius: 14px; padding: 16px; text-align: center; }
    .metric-value { font-size: 26px; font-weight: 800; color: var(--accent-blue); }
    .metric-label { font-size: 12px; color: var(--text-gray); margin-top: 4px; font-weight: 600; }

    .admin-nav-tabs { display: flex; gap: 10px; border-bottom: 1px solid var(--card-border); margin-bottom: 20px; flex-wrap: wrap; }
    .admin-tab-btn { padding: 10px 16px; border: none; background: none; font-size: 14px; font-weight: 700; color: var(--text-gray); cursor: pointer; border-bottom: 2px solid transparent; }
    .admin-tab-btn.active { color: var(--accent-blue); border-bottom-color: var(--accent-blue); }

    .admin-form { display: flex; flex-direction: column; gap: 16px; }
    .form-grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .form-grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
    .form-grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }

    .admin-table { width: 100%; border-collapse: collapse; margin-top: 16px; }
    .admin-table th, .admin-table td { border: 1px solid var(--card-border); padding: 12px; text-align: left; font-size: 13px; }
    .admin-table th { background: var(--surface-1); font-weight: 700; }
    
    .btn-edit { background: var(--accent-blue); color: white; border: none; padding: 6px 12px; border-radius: 8px; cursor: pointer; transition: background 0.2s; }
    .btn-edit:hover { background: var(--accent-blue-hover); }
    .btn-delete { background: var(--danger-color); color: white; border: none; padding: 6px 12px; border-radius: 8px; cursor: pointer; }
    .btn-delete:hover { background: #dc2626; }

    .add-review-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 24px; margin-bottom: 30px; box-shadow: var(--shadow-md); }
    .review-form { display: grid; grid-template-columns: 1fr; gap: 14px; margin-top: 14px; }
    @media (min-width: 768px) { .review-form-row { display: grid; grid-template-columns: 1fr 1fr 140px; gap: 12px; } }
    .review-card { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 16px; padding: 18px; display: flex; flex-direction: column; gap: 10px; box-shadow: var(--shadow-sm); }
    .reviewer-name { font-weight: 800; font-size: 15px; }
    .reviewer-country { font-size: 12px; color: var(--text-gray); }
    .stars { color: #F59E0B; font-size: 14px; }

    .img-preview-box { display: flex; gap: 8px; margin-top: 8px; flex-wrap: wrap; }
    .img-preview-box img { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; border: 1px solid var(--card-border); }

    .tour-gallery { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); gap: 8px; margin-top: 12px; }
    .tour-gallery img { width: 100%; height: 70px; object-fit: cover; border-radius: 8px; }

    .footer { text-align: center; color: var(--text-gray); font-size: 13px; margin-top: 50px; padding: 24px 0; border-top: 1px solid var(--card-border); }

    /* Lightbox / Modal */
    .lightbox-trigger { cursor: pointer; }
    .lightbox-overlay { position: fixed; inset: 0; background: rgba(15,23,42,0.75); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; z-index: 2000; padding: 20px; animation: fadeIn 0.2s ease; }
    .lightbox-overlay.hidden { display: none; }
    .lightbox-content { background: var(--card-bg); border-radius: 20px; max-width: 900px; width: 100%; max-height: 90vh; overflow-y: auto; position: relative; box-shadow: var(--shadow-lg); display: grid; grid-template-columns: 1fr; }
    @media (min-width: 768px) { .lightbox-content { grid-template-columns: 1fr 1fr; max-height: 85vh; } }
    .lightbox-close { position: absolute; top: 14px; right: 14px; background: rgba(0,0,0,0.55); color: white; border: none; width: 34px; height: 34px; border-radius: 50%; font-size: 16px; cursor: pointer; z-index: 10; }
    .lightbox-image-wrap { position: relative; height: 260px; background: #000; }
    @media (min-width: 768px) { .lightbox-image-wrap { height: 100%; min-height: 420px; } }
    .lightbox-image-wrap img { width: 100%; height: 100%; object-fit: cover; border-radius: 20px 20px 0 0; }
    @media (min-width: 768px) { .lightbox-image-wrap img { border-radius: 20px 0 0 20px; } }
    .lightbox-details { padding: 24px; display: flex; flex-direction: column; gap: 10px; }
    .lightbox-details h2 { font-size: 22px; font-weight: 800; }

    /* ===== WhatsApp Booking Button ===== */
    .btn-whatsapp {
      display: inline-flex; align-items: center; justify-content: center; gap: 8px;
      background: #25D366; color: #FFFFFF; border: none; padding: 12px 18px;
      border-radius: 12px; font-weight: 700; font-size: 14px; cursor: pointer;
      text-decoration: none; box-shadow: 0 4px 14px rgba(37, 211, 102, 0.35);
      transition: filter 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
      width: 100%; white-space: nowrap;
    }
    .btn-whatsapp:hover { filter: brightness(1.08); transform: translateY(-1px) scale(1.015); box-shadow: 0 8px 20px rgba(37, 211, 102, 0.45); }
    .btn-whatsapp:active { transform: translateY(0) scale(0.98); }
    .btn-whatsapp svg { width: 20px; height: 20px; flex-shrink: 0; fill: #FFFFFF; }
    .btn-whatsapp span { line-height: 1; }
    @media (max-width: 480px) { .btn-whatsapp { padding: 12px 14px; font-size: 13.5px; } }

    /* ===== Location Picker ===== */
    .location-picker-box { background: var(--surface-1); border: 1px solid var(--card-border); border-radius: 14px; padding: 14px; margin-top: 14px; }
    .location-fee-note { font-size: 12px; color: var(--accent-blue); font-weight: 600; margin-top: 8px; display: none; }
    .location-fee-note.show { display: block; }
    .mini-map-frame { width: 100%; height: 200px; border: none; border-radius: 12px; margin-top: 12px; }

    /* ===== Weather & Travel Info Widget ===== */
    .weather-widget { background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 20px; padding: 22px; margin-bottom: 24px; box-shadow: var(--shadow-md); }
    .weather-widget-header { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
    .weather-widget-header h3 { font-size: 17px; font-weight: 800; }
    .weather-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
    @media (min-width: 768px) { .weather-grid { grid-template-columns: repeat(4, 1fr); } }
    .weather-city-card { background: var(--surface-1); border: 1px solid var(--card-border); border-radius: 14px; padding: 14px; text-align: center; }
    .weather-city-name { font-size: 13px; font-weight: 700; margin-bottom: 6px; }
    .weather-icon { font-size: 26px; margin-bottom: 4px; }
    .weather-temp { font-size: 20px; font-weight: 800; }
    .weather-desc { font-size: 11px; color: var(--text-gray); margin-top: 2px; text-transform: capitalize; }
    .road-status-banner { margin-top: 14px; padding: 12px 16px; background: rgba(245, 158, 11, 0.12); border-left: 4px solid #F59E0B; border-radius: 10px; font-size: 13px; font-weight: 700; color: #B45309; display: flex; align-items: center; gap: 8px; }
    :root[data-theme="dark"] .road-status-banner { color: #FBBF24; }

    /* ===== Reviews Upgrade ===== */
    .reviews-summary-bar { display: flex; align-items: center; gap: 18px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 18px; padding: 20px 24px; margin-bottom: 24px; box-shadow: var(--shadow-md); flex-wrap: wrap; }
    .reviews-avg-score { font-size: 40px; font-weight: 800; color: var(--accent-green); line-height: 1; }
    .reviews-avg-stars { color: #F59E0B; font-size: 18px; letter-spacing: 2px; }
    .reviews-avg-count { font-size: 13px; color: var(--text-gray); font-weight: 600; }
    .star-select { display: flex; gap: 4px; }
    .star-select .star-choice { font-size: 26px; cursor: pointer; color: var(--card-border); transition: color 0.15s, transform 0.15s; user-select: none; }
    .star-select .star-choice:hover { transform: scale(1.15); }
    .star-select .star-choice.selected { color: #F59E0B; }
    .verified-badge { background: rgba(16, 185, 129, 0.12); color: var(--accent-green-hover); font-size: 11px; font-weight: 700; padding: 3px 9px; border-radius: 20px; display: inline-flex; align-items: center; gap: 4px; }
    .review-meta-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; flex-wrap: wrap; }
    .review-date { font-size: 11px; color: var(--text-gray); margin-top: 2px; }
    .verified-checkbox-row { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; }

    /* ===== Route Timeline (Tour Detail) ===== */
    .route-timeline { margin-top: 16px; display: flex; flex-direction: column; }
    .timeline-stop { display: flex; gap: 12px; position: relative; padding-bottom: 22px; }
    .timeline-stop:last-child { padding-bottom: 0; }
    .timeline-marker { display: flex; flex-direction: column; align-items: center; }
    .timeline-dot { width: 14px; height: 14px; border-radius: 50%; background: var(--accent-green); box-shadow: 0 0 0 4px rgba(16,185,129,0.15); flex-shrink: 0; margin-top: 3px; }
    .timeline-line { width: 2px; flex: 1; background: var(--card-border); margin-top: 2px; }
    .timeline-stop:last-child .timeline-line { display: none; }
    .timeline-content { flex: 1; }
    .timeline-stop-name { font-weight: 700; font-size: 14px; }
    .timeline-stop-meta { font-size: 12px; color: var(--text-gray); margin-top: 2px; display: flex; gap: 10px; flex-wrap: wrap; }

    /* ===== Recently Viewed Strip ===== */
    .recently-viewed-section { margin-top: 40px; }
    .recently-viewed-section h3 { font-size: 16px; font-weight: 800; margin-bottom: 12px; }
    .recently-viewed-strip { display: flex; gap: 14px; overflow-x: auto; padding-bottom: 8px; scroll-snap-type: x proximity; }
    .rv-card { flex: 0 0 auto; width: 160px; background: var(--card-bg); border: 1px solid var(--card-border); border-radius: 14px; overflow: hidden; cursor: pointer; box-shadow: var(--shadow-sm); transition: transform 0.2s, box-shadow 0.2s; scroll-snap-align: start; }
    .rv-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); }
    .rv-card img { width: 100%; height: 90px; object-fit: cover; }
    .rv-card-body { padding: 8px 10px; }
    .rv-card-title { font-size: 12px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .rv-card-type { font-size: 10px; color: var(--text-gray); margin-top: 2px; }
  
    /* 2026 UX upgrade */
    .availability-search{max-width:1050px;margin:-8px auto 24px;padding:16px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:18px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr 1fr auto;gap:12px;align-items:end}
    .availability-search label,.advanced-filters label{font-size:11px;font-weight:800;color:var(--text-gray);display:block;margin-bottom:5px}
    .availability-result{grid-column:1/-1;font-size:12px;font-weight:700;min-height:18px}
    .advanced-filters{max-width:1200px;margin:0 auto 18px;padding:12px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px;display:grid;grid-template-columns:repeat(5,minmax(120px,1fr));gap:10px}
    .availability-pill{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;padding:5px 9px;border-radius:999px;background:rgba(16,185,129,.12);color:#059669;margin:4px 0 8px}
    .availability-pill.unavailable{background:rgba(239,68,68,.12);color:#dc2626}
    .card-price-lead{display:flex;align-items:end;justify-content:space-between;gap:10px;margin:10px 0}.card-price-lead strong{font-size:24px}.card-price-lead small{color:var(--text-gray)}
    .trust-strip{max-width:1100px;margin:18px auto 28px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.trust-item{padding:16px;background:var(--card-bg);border:1px solid var(--card-border);border-radius:14px}.trust-item strong{display:block;margin-bottom:4px}.trust-item span{font-size:12px;color:var(--text-gray)}
    .admin-booking-tools{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 14px}.admin-booking-tools>*{min-width:150px}
    @media(max-width:800px){.availability-search{grid-template-columns:1fr}.advanced-filters{grid-template-columns:1fr 1fr}.trust-strip{grid-template-columns:1fr}.availability-result{grid-column:1}.card-price-lead strong{font-size:21px}}

    .privacy-choice { position:fixed; z-index:1200; left:16px; right:16px; bottom:16px; max-width:520px; padding:18px; border-radius:12px; background:var(--card-bg); color:var(--text-white); box-shadow:0 12px 36px #0005; border:1px solid var(--card-border); }
    .privacy-choice p { margin:0 0 12px; line-height:1.5; }
    .privacy-choice button { margin-right:8px; min-height:44px; padding:8px 14px; border:1px solid var(--card-border); border-radius:7px; cursor:pointer; }

/* 2026 interface refinement */
:root { --shadow:0 10px 30px rgba(15,23,42,.06); }
.availability-search { max-width:1200px; box-shadow:var(--shadow-sm); }
.trust-strip { grid-template-columns:repeat(2,1fr); }
.admin-card { max-width:1200px; border:1px solid var(--card-border); box-shadow:var(--shadow); }
.admin-intro,.field-help { color:var(--text-gray); font-size:13px; line-height:1.5; margin:6px 0 12px; }
.admin-nav-tabs { display:flex; overflow-x:auto; gap:6px; scrollbar-width:thin; }
.admin-tab-btn { white-space:nowrap; }
.admin-metrics { gap:12px; }
.metric-box { border:1px solid var(--card-border); border-radius:14px; }
.admin-form label,.calendar-form label { display:block; font-size:12px; font-weight:700; color:var(--text-secondary); }
.calendar-panel { padding:20px; margin:18px 0 22px; border:1px solid var(--card-border); border-radius:16px; background:var(--surface-1); }
.calendar-panel h3 { margin:0; }
.calendar-form { display:grid; grid-template-columns:1.3fr repeat(2,1fr) 1.3fr auto; gap:10px; align-items:end; margin:16px 0; }
.calendar-form .btn-action { min-height:44px; }
.blocks-list { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:8px; margin:10px 0; }
.block-row { display:flex; gap:10px; justify-content:space-between; align-items:center; padding:11px 12px; border:1px solid var(--card-border); border-radius:10px; background:var(--card-bg); }
.block-row small { display:block; color:var(--text-gray); margin-top:3px; }
.block-row em { font-size:11px; color:var(--text-gray); }
.admin-table-wrap { overflow-x:auto; }
@media(max-width:950px){.calendar-form{grid-template-columns:repeat(2,minmax(0,1fr))}.calendar-form button{grid-column:1/-1}}
@media(max-width:600px){.calendar-form{grid-template-columns:1fr}.calendar-panel{padding:14px}.trust-strip{grid-template-columns:1fr}.admin-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Public site redesign: stronger hierarchy, quieter cards, generous mobile spacing. */
:root {
  --bg-color:#F5F7F5; --surface-1:#F5F7F5; --surface-2:#EAF0EC;
  --accent-green:#087E63; --accent-green-hover:#066B55;
  --text-white:#152C27; --text-gray:#657970; --text-secondary:#3F5B51;
  --card-border:#DFE8E2; --border-hover:#B9D4C7;
  --shadow-sm:0 2px 6px rgba(21,44,39,.04);
  --shadow-md:0 12px 36px rgba(21,44,39,.055);
  --shadow-lg:0 20px 48px rgba(21,44,39,.1);
}
:root[data-theme="dark"] { --accent-green:#27BA8B; --accent-green-hover:#25A984; }
body { line-height:1.55; }
.app-container { max-width:1280px; padding:22px clamp(16px,3vw,40px) 50px; }
.header { border-radius:20px; padding:14px 22px; margin-bottom:24px; box-shadow:0 8px 30px rgba(21,44,39,.055); }
.logo { letter-spacing:-.04em; }
.logo-text { font-size:20px; }
.nav-btn { font-size:13px; border-radius:9px; }
#page-cars .hero { position:relative; overflow:hidden; border-radius:28px 28px 0 0; margin:0; padding:clamp(30px,5vw,64px) clamp(24px,5vw,64px) 74px; color:#fff; background:radial-gradient(circle at 84% 15%,rgba(97,212,163,.23),transparent 32%),linear-gradient(115deg,#12372D 0%,#0B5443 57%,#12765B 100%); }
#page-cars .hero:after { content:""; position:absolute; width:320px; height:320px; right:-72px; bottom:-220px; border:1px solid rgba(255,255,255,.18); border-radius:50%; box-shadow:0 0 0 58px rgba(255,255,255,.025),0 0 0 116px rgba(255,255,255,.02); pointer-events:none; }
#page-cars .hero h1 { max-width:680px; font-size:clamp(34px,4.4vw,62px); line-height:1.07; letter-spacing:-.055em; margin:13px 0 16px; color:#fff; }
#page-cars .hero p { max-width:610px; color:#DAEDE2; font-size:clamp(14px,1.3vw,17px); line-height:1.6; }
.hero-eyebrow,.section-kicker { display:inline-block; letter-spacing:.15em; font-size:11px; font-weight:800; }
.hero-eyebrow { color:#B1ECD2; }
#page-cars .badges { margin:26px 0 0; gap:8px; position:relative; z-index:1; }
#page-cars .badge { background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.17); box-shadow:none; color:#F4FFF7; font-size:11px; padding:7px 11px; backdrop-filter:blur(8px); }
.availability-search { position:relative; z-index:2; max-width:none; margin:-35px 18px 34px; padding:20px; background:var(--card-bg); border:1px solid var(--card-border); border-radius:20px; box-shadow:0 18px 40px rgba(17,56,43,.12); grid-template-columns:1fr 1fr auto; gap:14px; }
.availability-search label { font-size:12px; color:var(--text-secondary); }
.availability-search .input-field { min-height:48px; }
.availability-search .btn-action { min-height:48px; padding-inline:24px; white-space:nowrap; }
.availability-result { color:var(--text-secondary); }
.controls-bar { align-items:center; margin-bottom:12px; }
.categories { gap:5px; }
.cat-btn { box-shadow:none; padding:9px 14px; border-radius:999px; }
.cat-btn.active { box-shadow:none; }
.search-sort-group { max-width:410px; flex-wrap:nowrap; }
.search-sort-group .input-field { min-width:0; flex:1; }
.search-sort-group .select-field { max-width:165px; }
.filter-disclosure { margin:0 0 32px; border-bottom:1px solid var(--card-border); }
.filter-disclosure summary { list-style:none; cursor:pointer; color:var(--text-secondary); font-size:13px; font-weight:800; padding:10px 2px 15px; width:max-content; }
.filter-disclosure summary::-webkit-details-marker { display:none; }
.filter-disclosure summary:before { content:"+"; display:inline-grid; place-items:center; width:22px; height:22px; background:var(--surface-2); border-radius:50%; margin-right:8px; }
.filter-disclosure[open] summary:before { content:"−"; }
.filter-disclosure summary span { color:var(--text-gray); font-weight:500; margin-left:8px; }
.advanced-filters { max-width:none; margin:0 0 16px; box-shadow:none; padding:16px; }
.fleet-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin:6px 0 20px; }
.fleet-heading h2 { letter-spacing:-.04em; font-size:clamp(24px,2.5vw,34px); line-height:1.2; }
.fleet-heading p { color:var(--text-gray); font-size:13px; max-width:280px; text-align:right; }
.section-kicker { color:var(--accent-green-hover); margin-bottom:7px; }
.content-grid { gap:20px; }
.card { border-radius:20px; padding:10px 10px 16px; box-shadow:var(--shadow-sm); transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease; }
.card:hover { transform:translateY(-4px); box-shadow:var(--shadow-md); }
.card .image-container { height:auto; aspect-ratio:16/10; border-radius:14px; margin:0 0 14px; }
.card-title,.card-desc,.specs-box,.card-price-lead,.availability-pill { margin-left:8px; margin-right:8px; }
.card-title { font-size:18px; line-height:1.35; margin-bottom:5px; }
.card-desc { color:var(--text-gray); font-size:12px; line-height:1.55; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-bottom:12px; }
.specs-box { border:0; padding:4px 0; margin-bottom:8px; gap:5px; }
.spec-item { font-size:11px; padding:5px 7px; border-radius:7px; }
.card-price-lead { padding:12px 0 7px; border-top:1px solid var(--card-border); margin-top:12px; align-items:center; }
.card-price-lead strong { font-size:27px; letter-spacing:-.04em; color:var(--text-white); }
.price-suffix { font-size:12px; font-weight:600; color:var(--text-gray); letter-spacing:0; margin-left:3px; }
.card-availability-dot { color:var(--accent-green-hover); background:rgba(8,126,99,.09); padding:5px 9px; border-radius:999px; font-size:11px; font-weight:700; }
.card-footer { padding:0 8px; }
.card-footer-actions { padding:0 0 5px; }
.card .btn-whatsapp { border-radius:10px; min-height:44px; box-shadow:none; background:#0A8065; }
.card .btn-whatsapp:hover { background:#066B55; }
.trust-strip { margin:32px auto 12px; max-width:none; }
.trust-item { box-shadow:none; padding:18px; }
.tour-gallery { display:none; }
.btn-action { border-radius:10px; }
.input-field:focus-visible,.select-field:focus-visible,.btn-action:focus-visible,.cat-btn:focus-visible,.nav-btn:focus-visible,.filter-disclosure summary:focus-visible { outline:3px solid rgba(18,160,116,.45); outline-offset:2px; }
.admin-image-manager .admin-image-actions { flex-wrap:wrap; justify-content:flex-start; }
.admin-image-manager .admin-image-actions button { min-width:25px; min-height:28px; }
@media(max-width:900px) {
  .availability-search { grid-template-columns:1fr 1fr; }
  .availability-search .btn-action { grid-column:1/-1; }
  .content-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .controls-bar { align-items:stretch; }
  .search-sort-group { max-width:none; }
}
@media(max-width:640px) {
  .app-container { padding:10px 12px 34px; }
  .header { top:6px; padding:12px 14px; margin-bottom:14px; }
  .logo-text { font-size:16px; }
  #page-cars .hero { border-radius:20px 20px 0 0; padding:32px 20px 62px; }
  #page-cars .hero h1 { font-size:36px; }
  #page-cars .badges { gap:6px; margin-top:22px; }
  #page-cars .badge { font-size:10px; padding:6px 9px; }
  .availability-search { margin:-28px 10px 25px; padding:16px; grid-template-columns:1fr; gap:12px; }
  .availability-search .btn-action { grid-column:auto; width:100%; }
  .categories { overflow:auto; flex-wrap:nowrap; padding-bottom:4px; scrollbar-width:none; }
  .categories::-webkit-scrollbar { display:none; }
  .cat-btn { min-height:42px; }
  .search-sort-group { flex-wrap:nowrap; }
  .search-sort-group .select-field { max-width:135px; font-size:12px; }
  .filter-disclosure summary span { display:none; }
  .advanced-filters { grid-template-columns:1fr 1fr; gap:10px; }
  .fleet-heading { align-items:start; margin-bottom:16px; }
  .fleet-heading p { display:none; }
  .content-grid { grid-template-columns:1fr; gap:14px; }
  /* Keep the entire vehicle in view on narrow screens. */
  .card .image-container { aspect-ratio:4/3; background:var(--surface-1); }
  .card .card-image { object-fit:contain; transform:none; }
  .card:hover .card-image { transform:none; }
  .floating-wa { width:50px; height:50px; right:16px; bottom:16px; }
}
@media(prefers-reduced-motion:reduce) { .card,.card:hover,.card-image,.btn-action { transition:none; transform:none; } }

/* Vehicle detail: preserve the whole photograph and show its direct link. */
.card-detail-link { display:inline-flex; align-items:center; gap:6px; align-self:start; padding:5px 0 8px; color:var(--accent-green-hover); font-size:12px; font-weight:800; text-decoration:none; }
.card-detail-link:hover { text-decoration:underline; }
.vehicle-detail { max-width:min(1240px,96vw); width:100%; max-height:min(88vh,850px); grid-template-columns:minmax(0,1.13fr) minmax(390px,.87fr); border-radius:24px; overflow:hidden; }
.vehicle-detail .lightbox-image-wrap { width:100%; min-width:0; height:auto; min-height:0; background:#18211E; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.vehicle-detail .lightbox-image-wrap img { display:block; min-width:0; max-width:100%; width:100%; height:100%; max-height:min(88vh,850px); object-fit:contain; object-position:center; border-radius:0; }
.vehicle-detail .lightbox-details { box-sizing:border-box; width:100%; min-width:0; max-width:100%; padding:clamp(18px,2vw,28px); overflow-y:auto; min-height:0; gap:12px; }
.vehicle-detail .lightbox-details h2 { font-size:clamp(23px,2.3vw,32px); letter-spacing:-.04em; line-height:1.2; padding-right:24px; }
.vehicle-detail .lightbox-details .card-desc { margin:0; display:block; overflow-wrap:anywhere; font-size:14px; line-height:1.65; }
.vehicle-detail .lightbox-details .specs-box { margin:0; padding:0; }
.vehicle-detail .price-tier-box { padding:15px 17px; margin:0; border-radius:12px; }
.vehicle-detail .price-tier-row { font-size:13px; padding:3px 0; }
.vehicle-detail .lightbox-close { z-index:10; width:42px; height:42px; right:15px; top:15px; }
.vehicle-detail .carousel-btn { width:40px; height:40px; font-size:15px; }
.vehicle-detail .photo-count { position:absolute; left:50%; bottom:16px; transform:translateX(-50%); background:rgba(0,0,0,.63); color:white; border-radius:99px; padding:5px 12px; font-size:12px; font-weight:700; }
.detail-link-row { display:flex; align-items:center; gap:12px; justify-content:space-between; padding:12px 14px; border:1px solid var(--card-border); background:var(--surface-1); border-radius:12px; min-width:0; }
.detail-link-row > div { min-width:0; }
.detail-link-row span { display:block; font-size:11px; color:var(--text-gray); font-weight:700; margin-bottom:2px; }
.detail-link-row a { display:block; font-size:12px; font-weight:700; color:var(--accent-green-hover); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.detail-link-row button { white-space:nowrap; padding:9px 11px; background:var(--surface-2); color:var(--text-white); border:1px solid var(--card-border); }
.detail-link-row button:hover { background:var(--card-border); }
.vehicle-detail .lightbox-actions { display:flex; gap:10px; align-items:stretch; min-width:0; }
.vehicle-detail .lightbox-actions .btn-whatsapp { flex:1 1 auto; min-width:0; }
.vehicle-detail .lightbox-actions .share-btn { flex:0 0 48px; }
.vehicle-detail .detail-link-row,.vehicle-detail .price-tier-box,.vehicle-detail .booking-confirmation-note { max-width:100%; box-sizing:border-box; }
@media(max-width:760px) {
  .lightbox-overlay { padding:10px; }
  .vehicle-detail { grid-template-columns:minmax(0,1fr); grid-template-rows:auto auto; max-width:calc(100vw - 20px); max-height:calc(100vh - 20px); max-height:calc(100dvh - 20px); border-radius:18px; overflow-x:hidden; overflow-y:auto; }
  .vehicle-detail .lightbox-image-wrap { display:block; height:auto; min-height:0; }
  .vehicle-detail .lightbox-image-wrap img { display:block; min-width:0; max-width:100%; width:100%; height:auto; max-height:50vh; max-height:50dvh; object-fit:contain; }
  .vehicle-detail .lightbox-details { overflow:visible; padding:20px; gap:13px; }
  .vehicle-detail .lightbox-close { top:10px; right:10px; }
}

.currency-control { display:flex; align-items:center; gap:7px; font-size:12px; color:var(--text-gray); font-weight:700; white-space:nowrap; }
.currency-control select { background:var(--card-bg); color:var(--text-white); border:1px solid var(--card-border); border-radius:10px; min-height:38px; padding:6px 10px; font:inherit; cursor:pointer; }
.currency-control select:focus-visible { outline:3px solid rgba(18,160,116,.45); }
.currency-note { color:var(--text-gray); font-size:11px; margin:-20px 20px 24px; }
.rates-credit a { color:var(--text-gray); font-size:11px; }
.standalone-detail { width:min(1200px,94vw); margin:26px auto; }
.standalone-back,.standalone-more { display:inline-block; margin:0 0 18px; color:var(--accent-green-hover); font-weight:700; text-decoration:none; }
.standalone-layout { display:grid; grid-template-columns:1.15fr 1fr; background:var(--card-bg); border-radius:22px; overflow:hidden; border:1px solid var(--card-border); box-shadow:var(--shadow-md); }
.standalone-photo { min-height:480px; display:flex; align-items:center; justify-content:center; background:#18211e; }
.standalone-photo img { display:block; width:100%; max-height:650px; object-fit:contain; }
.standalone-copy { padding:clamp(22px,4vw,52px); display:flex; flex-direction:column; gap:16px; justify-content:center; }
.standalone-copy h1 { font-size:clamp(28px,3vw,44px); line-height:1.15; }
.standalone-copy p { color:var(--text-gray); }
.standalone-copy .standalone-price { font-weight:800; font-size:26px; color:var(--text-white); }
@media(max-width:760px) { .standalone-layout{grid-template-columns:1fr}.standalone-photo{min-height:280px}.standalone-copy{padding:24px}.currency-control span{display:none}.currency-note{margin:-16px 10px 22px}.header-controls{gap:6px} }

/* Car review and booking clarity */
.car-rating-badge { position:absolute; z-index:6; top:10px; left:10px; display:inline-flex; align-items:center; gap:4px; padding:7px 10px; border-radius:10px; background:rgba(20,30,34,.88); color:#fff; font-size:14px; font-weight:800; box-shadow:0 2px 10px rgba(0,0,0,.22); pointer-events:none; }
.car-rating-badge small { font-size:11px; font-weight:600; color:#e4e8e7; }
.car-rating-badge.unrated { background:rgba(20,30,34,.7); }
.card-key-specs { border:0; padding:5px 0; margin-bottom:8px; }
.card-price-note { font-size:11px; max-width:105px; text-align:right; line-height:1.4; color:var(--text-gray); }
.booking-steps { display:flex; gap:12px; align-items:center; flex-wrap:wrap; padding:18px 20px; border:1px solid var(--card-border); background:var(--card-bg); border-radius:16px; margin:20px 0; color:var(--text-secondary); font-size:13px; }
.booking-steps strong { color:var(--text-white); margin-right:8px; }
.booking-steps span { flex:1 1 170px; }
.booking-confirmation-note { font-size:12px; line-height:1.5; padding:11px 13px; border-radius:10px; background:var(--surface-1); color:var(--text-gray); }
.lightbox-reviews-btn { align-self:start; background:none; border:0; padding:4px 0; color:var(--accent-green-hover); font:inherit; font-size:13px; font-weight:800; cursor:pointer; text-align:left; }
.lightbox-reviews-btn:hover { text-decoration:underline; }
.review-car-label { display:block; margin:12px 0 6px; font-size:13px; font-weight:700; color:var(--text-secondary); }
.review-car-filter { width:auto; max-width:330px; margin-bottom:18px; }
.review-car-name { color:var(--accent-green-hover); font-size:12px; font-weight:700; margin-top:3px; }
.standalone-rating { color:var(--accent-green-hover) !important; font-size:17px; font-weight:800; }
.admin-review-car { max-width:180px; margin-top:5px; font-size:11px; padding:5px; }
.fleet-status { padding:12px 15px; margin:0 0 18px; border-radius:10px; background:#fff5df; color:#664313; font-size:13px; line-height:1.5; border:1px solid #f6d88d; }
.fleet-status[hidden] { display:none; }
:root[data-theme="dark"] .fleet-status { background:#392a17; color:#ffe6b1; border-color:#70531b; }
.card a.image-container { display:block; }
.star-select button.star-choice { background:none; border:0; padding:0 2px; font-family:inherit; }
.star-select button.star-choice:focus-visible,.lightbox-reviews-btn:focus-visible { outline:2px solid var(--accent-green); outline-offset:3px; }
@media(max-width:640px) { .booking-steps { gap:8px; padding:16px; } .booking-steps strong,.booking-steps span { flex-basis:100%; } .review-car-filter { width:100%; max-width:none; } }
.promo-box { margin-top:20px; padding:16px; border:1px solid var(--border-color,#dbe6e1); border-radius:14px; }
.promo-box label { display:block; font-weight:700; margin-bottom:8px; }
.promo-entry { display:flex; gap:8px; align-items:stretch; }
.promo-entry .input-field { min-width:0; flex:1; text-transform:uppercase; }
.promo-entry .btn-action { width:auto; margin:0; }
.promo-box .field-help { margin:8px 0 0; min-height:1.3em; }
.promo-admin-form { display:flex; gap:12px; align-items:end; flex-wrap:wrap; margin:16px 0; }
.promo-admin-form label { flex:1 1 145px; font-size:13px; }
.promo-admin-form .input-field,.promo-admin-form .select-field { display:block; width:100%; margin-top:5px; }
.promo-admin-form .promo-enabled { flex:0 1 105px; padding-bottom:12px; }
.promo-admin-form .btn-action { flex:0 1 auto; width:auto; }
.promo-admin-list { display:grid; gap:8px; margin-top:12px; }
.promo-admin-row { display:flex; align-items:center; flex-wrap:wrap; gap:10px; padding:12px; border:1px solid var(--border-color,#dbe6e1); border-radius:12px; }
.promo-admin-row span { margin-right:auto; }
@media(max-width:480px) { .promo-entry { flex-wrap:wrap; } .promo-entry .btn-action { flex:1 0 100%; } }
/* Social profiles and Google Business review invitation */
.social-links { display:flex; justify-content:center; flex-wrap:wrap; gap:10px; margin-bottom:20px; }
.social-link { display:inline-flex; align-items:center; gap:8px; padding:9px 13px; border:1px solid var(--card-border,#dce6e3); border-radius:999px; color:var(--text-white); text-decoration:none; font-size:13px; font-weight:700; transition:transform .2s,border-color .2s; }
.social-link:hover { transform:translateY(-2px); border-color:var(--accent-green); }
.social-link svg { width:18px; height:18px; flex:none; }
.social-link:focus-visible,.review-prompt a:focus-visible,.review-prompt button:focus-visible { outline:3px solid var(--accent-green); outline-offset:3px; }
.review-prompt { position:fixed; inset:0; z-index:1400; display:flex; justify-content:center; align-items:center; padding:20px; background:rgba(12,24,28,.68); }
.review-prompt.hidden { display:none; }
.review-prompt-card { position:relative; width:min(100%,390px); max-height:calc(100vh - 40px); overflow:auto; padding:30px 24px 24px; border-radius:22px; background:var(--card-bg,#fff); color:var(--text-white,#152a27); text-align:center; box-shadow:0 20px 70px #0005; }
.review-prompt-card h2 { margin:6px 22px 10px; font-size:22px; line-height:1.3; }
.review-prompt-card p { margin:0 0 15px; color:var(--text-gray); font-size:14px; line-height:1.5; }
.review-prompt-close { position:absolute; top:10px; right:13px; border:0; background:transparent; color:inherit; font-size:30px; cursor:pointer; }
.review-prompt-qr { display:inline-flex; background:white; border-radius:12px; padding:8px; margin:2px auto 14px; }
.review-prompt-qr img { width:132px; height:132px; object-fit:contain; image-rendering:pixelated; }
.review-prompt-action { display:block; width:100%; box-sizing:border-box; text-decoration:none; }
.review-prompt-later { margin-top:12px; border:0; background:transparent; color:var(--text-gray); font-size:14px; cursor:pointer; }
@media(max-width:480px) { .social-link { flex:1 1 42%; justify-content:center; } }
/* Vehicle finder: a focused mobile search sheet based on the supplied reference. */
.finder-launch { display:inline-flex; align-items:center; justify-content:center; gap:10px; margin-top:22px; padding:14px 22px; border:0; border-radius:14px; background:#278343; color:white; font-size:16px; font-weight:800; cursor:pointer; box-shadow:0 8px 20px #0b613333; }
.finder-launch svg,.finder-submit svg { width:21px; height:21px; }
.finder-launch:hover,.finder-submit:hover { background:#206d38; }
.finder-launch:focus-visible,.finder-panel button:focus-visible,.finder-panel select:focus-visible,.finder-panel input:focus-visible { outline:3px solid #278343; outline-offset:2px; }
.finder-overlay { position:fixed; inset:0; z-index:1300; display:flex; align-items:center; justify-content:center; padding:24px; background:#0e1714c7; backdrop-filter:blur(7px); }
.finder-overlay.hidden { display:none; }
.finder-panel { width:min(100%,480px); max-height:calc(100vh - 40px); overflow:auto; background:#f7f9f5; border-radius:30px; box-shadow:0 22px 65px #0005; color:#203a2c; }
.finder-top { display:flex; align-items:center; justify-content:space-between; padding:22px 26px; border-bottom:1px solid #e2e9e1; }
.finder-top h2 { font-size:27px; line-height:1.3; }
.finder-close { border:0; background:none; color:inherit; font-size:32px; line-height:1; cursor:pointer; }
.finder-form { display:grid; gap:14px; padding:22px 26px 26px; }
.finder-field { display:flex; align-items:center; gap:14px; min-height:98px; padding:14px 19px; border:1px solid #dae3d8; border-radius:21px; background:#fff; box-shadow:0 7px 18px #233b2110; cursor:pointer; }
.finder-icon { display:grid; place-items:center; width:48px; height:48px; flex:none; border-radius:50%; color:#278343; background:#eaf4ec; border:2px solid #d6ecdc; box-shadow:0 2px 6px #0001; }
.finder-icon svg { width:24px; height:24px; }
.finder-field-body { display:grid; gap:2px; flex:1; min-width:0; }
.finder-field-body > span { color:#718277; font-size:12px; font-weight:800; letter-spacing:.03em; }
.finder-field select,.finder-field input { width:100%; min-width:0; padding:0; border:0; background:transparent; color:#223b2e; font-size:17px; font-weight:600; outline:none; }
.finder-field select { appearance:none; cursor:pointer; }
.finder-chevron { font-size:30px; color:#708679; line-height:1; }
.finder-error { color:#bb2424; font-size:13px; font-weight:700; }
.finder-submit { display:flex; align-items:center; justify-content:center; gap:16px; min-height:66px; margin-top:8px; border:0; border-radius:18px; color:#fff; background:#278343; font-size:20px; font-weight:800; cursor:pointer; box-shadow:0 8px 18px #0b613321; }
@media(max-width:560px) { .finder-overlay { padding:14px; align-items:center; } .finder-panel { max-height:calc(100dvh - 28px); border-radius:27px; } .finder-top { padding:18px 20px; } .finder-form { padding:19px 20px 22px; gap:12px; } .finder-field { min-height:84px; padding:10px 14px; } .finder-top h2 { font-size:25px; } }
@media(max-height:620px) { .finder-overlay { align-items:flex-start; } .finder-field { min-height:72px; } .finder-form { gap:8px; } }
/* Fast Rent Georgia brand refresh: editorial automotive lines, restrained emerald and champagne. */
.app-container { max-width:1180px; }
.header { border:1px solid var(--card-border); border-radius:20px; padding:12px 18px; box-shadow:0 10px 32px #1028220d; }
.logo { gap:11px; text-decoration:none; }
.logo-img { width:45px; height:45px; max-width:45px; border-radius:12px; }
.logo-text { display:flex; flex-direction:column; gap:2px; font-size:19px; letter-spacing:-.05em; color:var(--text-white); white-space:nowrap; }
.logo-text > span { color:#188b68; }
.logo-text small { font-size:8px; font-weight:800; letter-spacing:.19em; color:var(--text-gray); }
.header .nav-btn.active { background:#123b31; color:#fff; }
#page-cars .hero { isolation:isolate; min-height:405px; padding:clamp(32px,5vw,60px) clamp(24px,5vw,64px) 92px; border-radius:26px; background:radial-gradient(ellipse at 90% 90%,#185344 0%,transparent 52%),linear-gradient(124deg,#0c211d 0%,#12372f 68%,#19463a 100%); box-shadow:0 18px 40px #10282225; }
#page-cars .hero:after { content:none; }
#page-cars .hero:before { content:""; position:absolute; inset:0; z-index:-1; opacity:.43; background:repeating-linear-gradient(106deg,transparent 0,transparent 118px,#c8ddc80c 119px,#c8ddc80c 120px); pointer-events:none; }
#page-cars .hero > :not(.hero-car-art) { position:relative; z-index:1; }
#page-cars .hero h1 { max-width:640px; font-size:clamp(40px,4.9vw,68px); line-height:1.04; letter-spacing:-.055em; text-wrap:balance; }
#page-cars .hero p { max-width:575px; color:#d2e6dc; line-height:1.6; }
#page-cars .hero-eyebrow { color:#e0c38e; letter-spacing:.19em; }
#page-cars .badge { border:1px solid #e6f4e22e; background:#fff1; backdrop-filter:blur(8px); color:#f8fff9; }
.hero-car-art { position:absolute; z-index:0; right:-30px; bottom:8px; width:min(62%,670px); height:auto; color:#d7c194; opacity:.34; filter:drop-shadow(0 14px 22px #040f0b); pointer-events:none; }
.finder-feature { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px 30px; align-items:center; margin:-46px 20px 22px; padding:24px 28px; border:1px solid #e4ebe2; border-radius:22px; background:var(--card-bg); box-shadow:0 15px 35px #0a251c20; }
.finder-feature-copy h2 { font-size:clamp(23px,3vw,31px); line-height:1.2; letter-spacing:-.04em; color:var(--text-white); margin:4px 0 5px; }
.finder-feature-copy p { font-size:13px; color:var(--text-gray); }
.finder-feature-kicker { color:#188b68; font-size:10px; font-weight:800; letter-spacing:.14em; }
.finder-feature-steps { grid-column:1; display:flex; flex-wrap:wrap; gap:6px 18px; color:var(--text-gray); font-size:11px; font-weight:700; }
.finder-feature-steps span { display:inline-flex; align-items:center; gap:6px; }
.finder-feature-steps b { color:#c1965e; font-size:11px; }
.finder-feature .finder-launch { grid-column:2; grid-row:1/3; min-height:82px; min-width:240px; margin:0; border-radius:15px; background:#12845f; font-size:17px; box-shadow:0 8px 18px #11845f38; }
.finder-feature .finder-launch:hover { background:#0b7050; }
.finder-feature .finder-launch svg { width:22px; height:22px; }
.fleet-search-state { display:flex; align-items:center; gap:10px; margin:0 20px 20px; padding:11px 16px; border-radius:12px; background:#e9f6ef; color:#145a3c; font-size:13px; font-weight:700; }
.fleet-search-state[hidden] { display:none; }
.fleet-search-state-icon { color:#13a579; }
.fleet-search-state .availability-result { margin:0; padding:0; background:none; border:0; color:inherit; }
:root[data-theme="dark"] .finder-feature { border-color:var(--card-border); }
:root[data-theme="dark"] .fleet-search-state { background:#173c30; color:#d5f9e3; }
@media(max-width:800px) { .finder-feature { grid-template-columns:1fr; } .finder-feature .finder-launch { grid-column:1; grid-row:auto; min-height:65px; width:100%; } .finder-feature-steps { grid-row:2; } .hero-car-art { width:73%; bottom:5px; opacity:.2; } }
@media(max-width:640px) { .header { padding:10px 12px; } .logo-img { width:39px; height:39px; } .logo-text { font-size:15px; } .logo-text small { font-size:7px; } #page-cars .hero { min-height:365px; border-radius:22px; padding:37px 25px 78px; } #page-cars .hero h1 { font-size:clamp(35px,9vw,48px); } #page-cars .badges { max-width:300px; } .hero-car-art { width:100%; right:-19%; bottom:2px; opacity:.16; } .finder-feature { margin:-38px 12px 18px; padding:19px; gap:14px; } .finder-feature-steps { gap:6px 10px; font-size:10px; } .finder-feature .finder-launch { min-width:0; min-height:60px; } .fleet-search-state { margin:0 12px 18px; } }
/* Three primary contact networks stay visible beside the brand in the header. */
.header-social { display:flex; align-items:center; gap:7px; margin-right:4px; }
.header-social-link { width:36px; height:36px; border:1px solid var(--card-border); border-radius:11px; color:#14865f; background:var(--surface-1); display:grid; place-items:center; text-decoration:none; transition:background .2s,color .2s,transform .2s; }
.header-social-link:hover { background:#168760; color:#fff; transform:translateY(-2px); }
.header-social-link:focus-visible { outline:3px solid #168760; outline-offset:2px; }
.header-social-link svg { width:17px; height:17px; }
@media(max-width:920px) { .header { gap:8px; } .header-social { margin-left:auto; } .header .nav-wrapper { order:4; } }
@media(max-width:420px) { .header-social { gap:4px; } .header-social-link { width:32px; height:32px; border-radius:9px; } .logo-text { font-size:13px; } .logo-text small { font-size:6.5px; } .logo-img { width:34px; height:34px; } .hamburger-btn { width:36px; height:36px; } }

/* Closing invitation: custom illustration, moving landscape and roadside markings. */
.road-cta { position:relative; isolation:isolate; overflow:hidden; display:grid; grid-template-columns:1fr 1.05fr; align-items:center; min-height:350px; margin:64px 0 24px; padding:42px clamp(28px,5vw,70px); border-radius:30px; color:#f7f8ee; background:linear-gradient(112deg,#0c2924 4%,#14513f 62%,#157459 100%); box-shadow:0 18px 36px #0b30252b; }
.road-cta-glow { position:absolute; inset:-70% -30% -65% 25%; z-index:-1; border-radius:50%; background:radial-gradient(circle,#50be9250 0%,#52bf9520 28%,transparent 62%); animation:road-glow 11s ease-in-out infinite alternate; }
.road-cta-copy { position:relative; z-index:3; max-width:510px; }
.road-cta-overline { display:block; margin-bottom:15px; color:#dac797; font-size:11px; font-weight:800; letter-spacing:.19em; }
.road-cta h2 { margin:0 0 15px; font-size:clamp(32px,4.2vw,55px); line-height:1.07; letter-spacing:-.055em; text-wrap:balance; }
.road-cta p { max-width:380px; margin:0 0 27px; color:#d7e9de; font-size:clamp(14px,1.55vw,18px); line-height:1.6; }
.road-cta-button { display:inline-flex; align-items:center; gap:23px; min-height:52px; padding:0 21px; border:1px solid #ecd6aa; border-radius:12px; background:#f4e8cd; color:#153b31; font-size:15px; font-weight:800; cursor:pointer; transition:transform .2s,background .2s; }
.road-cta-button:after { content:'↗'; font-size:22px; line-height:1; }
.road-cta-button:hover { transform:translateY(-3px); background:#fff4dc; }
.road-cta-button:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.road-cta-scene { position:relative; align-self:stretch; min-height:250px; overflow:hidden; }
.road-cta-hills { position:absolute; inset:12% -40% 12% -18%; opacity:.55; background:radial-gradient(ellipse 27% 34% at 29% 59%,#73b18d75 0 99%,transparent 100%),radial-gradient(ellipse 34% 46% at 74% 54%,#509a7775 0 99%,transparent 100%); animation:road-hills 16s ease-in-out infinite alternate; }
.road-cta-car { position:absolute; z-index:2; left:50%; bottom:27px; width:min(100%,520px); transform:translateX(-50%); animation:road-car 2.5s ease-in-out infinite; filter:drop-shadow(0 13px 12px #09292055); }
.road-cta-car svg { display:block; width:100%; height:auto; }
.road-cta-lane { position:absolute; bottom:3px; left:-100%; width:300%; height:4px; background:repeating-linear-gradient(90deg,#e6d7af 0 55px,transparent 55px 108px); opacity:.8; animation:road-lane 1.35s linear infinite; }
@keyframes road-car { 0%,100% { transform:translate(-50%,0) rotate(-.3deg); } 50% { transform:translate(-50%,-5px) rotate(.35deg); } }
@keyframes road-lane { to { transform:translateX(-108px); } }
@keyframes road-glow { to { transform:translate(-12%,9%) scale(1.14); } }
@keyframes road-hills { to { transform:translateX(-9%); } }
@media(max-width:760px) { .road-cta { grid-template-columns:1fr; margin:42px 0 20px; padding:37px 26px 14px; border-radius:23px; } .road-cta-scene { min-height:215px; margin-top:10px; } .road-cta-car { bottom:23px; width:min(100%,410px); } }
@media(prefers-reduced-motion:reduce) { .road-cta-glow,.road-cta-hills,.road-cta-car,.road-cta-lane { animation:none; } }

/* Calm emerald finder, with controls sized for narrow mobile screens. */
.finder-overlay { padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom)); background:rgba(8,25,21,.76); }
.finder-panel { width:min(100%,470px); border:1px solid #dae5da; border-radius:24px; background:#f8faf7; box-shadow:0 28px 70px #06171080; }
.finder-top { padding:18px 22px; border-bottom:1px solid #e3eae3; }
.finder-top h2 { margin:0; color:#17372d; font-size:clamp(23px,5.5vw,28px); letter-spacing:-.04em; }
.finder-form { gap:10px; padding:20px 22px 22px; }
.finder-field { gap:12px; min-height:75px; padding:10px 14px; border-color:#d9e5dc; border-radius:15px; box-shadow:none; }
.finder-field:focus-within { border-color:#198463; box-shadow:0 0 0 3px #19846322; }
.finder-icon { width:38px; height:38px; color:#147c5b; background:#eaf4ee; border:0; box-shadow:none; }
.finder-icon svg { width:21px; height:21px; }
.finder-field-body > span { color:#63796c; font-size:11px; letter-spacing:.08em; }
.finder-field select,.finder-field input { max-width:100%; font-size:clamp(13px,3.8vw,16px); color:#17372d; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.finder-chevron { display:none; }
.finder-submit { min-height:58px; border-radius:14px; background:#127b5b; font-size:17px; box-shadow:none; }
.finder-submit:hover { background:#0b694e; }
.finder-launch:focus-visible,.finder-panel button:focus-visible,.finder-panel select:focus-visible,.finder-panel input:focus-visible { outline-color:#167d5e; }
@media(max-width:560px) { .finder-panel { max-height:calc(100dvh - 24px); border-radius:20px; } .finder-top { padding:15px 17px; } .finder-form { padding:15px 17px 18px; gap:9px; } .finder-field { min-height:68px; padding:8px 10px; } .finder-icon { width:34px; height:34px; } }

/* Quote calculator has a clear sequence and a distinct promo area. */
#page-calc .calc-container { max-width:1050px; padding:clamp(14px,2vw,26px); background:var(--surface-1); border-radius:24px; box-shadow:var(--shadow-sm); }
#page-calc .calc-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:16px; align-items:stretch; }
#page-calc .calc-card { padding:clamp(18px,2.4vw,28px); background:var(--card-bg); border:1px solid var(--card-border); border-radius:19px; min-width:0; }
#page-calc .calc-card-heading { display:flex; align-items:flex-start; gap:12px; margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--card-border); }
#page-calc .calc-step { display:grid; flex:none; place-items:center; width:36px; height:36px; border-radius:10px; background:#173f34; color:#f5dfb4; font-size:12px; font-weight:800; }
#page-calc .calc-card-heading h2 { margin:0 0 3px; color:var(--text-white); font-size:clamp(18px,2vw,23px); line-height:1.2; }
#page-calc .calc-card-heading p { margin:0; color:var(--text-gray); font-size:12px; line-height:1.4; }
#page-calc .calc-group > label,#page-calc .location-picker-box > label { font-size:12px!important; font-weight:800; color:var(--text-white); }
#page-calc .calc-group > .input-field,#page-calc .calc-group > .select-field,#page-calc .location-picker-box .select-field { min-width:0; width:100%; min-height:46px; }
#page-calc .calc-duration { display:inline-flex; align-items:center; gap:7px; margin:14px 0 0!important; padding:9px 12px; border-radius:10px; background:var(--surface-1); }
#page-calc .location-picker-box { margin-top:18px; padding:17px; border-radius:14px; background:var(--surface-1); border:1px solid var(--card-border); }
#page-calc .checkbox-item { min-height:44px; padding:10px 12px; }
#page-calc .promo-box { margin-top:24px; padding:20px; border:1px solid #b7d8c7; border-left:4px solid #148861; border-radius:15px; background:linear-gradient(135deg,#eff9f2,#f9fbf6); color:#193c30; }
#page-calc .promo-header { display:flex; gap:11px; align-items:center; margin-bottom:14px; }
#page-calc .promo-symbol { display:grid; flex:none; place-items:center; width:38px; height:38px; border-radius:10px; background:#1a7657; color:#fff; font-weight:900; }
#page-calc .promo-header label { display:block; margin:0 0 2px; color:#17372c; font-size:16px; }
#page-calc .promo-header p { margin:0; color:#537366; font-size:12px; line-height:1.4; }
#page-calc .promo-entry { display:flex; flex-wrap:nowrap; gap:8px; }
#page-calc .promo-entry .input-field { flex:1; min-width:0; background:#fff; }
#page-calc .promo-entry .btn-action { flex:none; width:auto; min-width:85px; background:#167b59; }
#page-calc .promo-box .field-help { overflow-wrap:anywhere; color:#255941; }
#page-calc .calc-details { margin-top:16px; }
#page-calc .calc-summary { margin-top:16px; padding:22px; border-color:#b6d2c1; background:var(--card-bg); }
#page-calc .calc-summary > div:last-child { width:100%; }
#page-calc .calc-summary button { min-height:46px; }
:root[data-theme="dark"] #page-calc .promo-box { background:#17372d; border-color:#326c51; color:#f1f8f2; }
:root[data-theme="dark"] #page-calc .promo-header label { color:#f1f8f2; }
:root[data-theme="dark"] #page-calc .promo-header p,:root[data-theme="dark"] #page-calc .promo-box .field-help { color:#bed9c8; }
@media(max-width:760px) { #page-calc .calc-grid { grid-template-columns:1fr; } #page-calc .calc-summary > div:last-child { display:grid!important; grid-template-columns:1fr; } #page-calc .calc-summary button { justify-content:center; width:100%!important; } }
@media(max-width:400px) { #page-calc .promo-entry { flex-wrap:wrap; } #page-calc .promo-entry .btn-action { flex:1 0 100%; } }

.floating-wa { width:58px; height:58px; background:#15845e; border:2px solid #fff; box-shadow:0 8px 25px #103e2d55; font-size:0; }
.floating-wa svg { width:29px; height:29px; }
.floating-wa:hover { background:#0f6d4e; box-shadow:0 10px 25px #103e2d77; }
.floating-wa:focus-visible { outline:3px solid #e9c888; outline-offset:3px; }
@media(max-width:640px) { .floating-wa { width:54px; height:54px; right:16px; bottom:max(16px,env(safe-area-inset-bottom)); } }