:root {
    --primary: #4f46e5;
    --primary-light: #818cf8;
    --accent: #f59e0b;
    --dark: #0f172a;
    --light: #f8fafc;

    /* Per-site accent: remap all teal-* utility classes to the site's colour family. */
    --color-teal-50:  var(--color-indigo-50);
    --color-teal-100: var(--color-indigo-100);
    --color-teal-200: var(--color-indigo-200);
    --color-teal-300: var(--color-indigo-300);
    --color-teal-400: var(--color-indigo-400);
    --color-teal-500: var(--color-indigo-500);
    --color-teal-600: var(--color-indigo-600);
    --color-teal-700: var(--color-indigo-700);
    --color-teal-800: var(--color-indigo-800);
    --color-teal-900: var(--color-indigo-900);
    --color-teal-950: var(--color-indigo-950);

    /* Per-site corner radius personality (overrides Tailwind radius utilities site-wide). */
    --radius-lg: 0.25rem;
    --radius-xl: 0.375rem;
    --radius-2xl: 0.5rem;
    --radius-3xl: 0.75rem;
}
body {
    font-family: 'Work Sans', system-ui, -apple-system, sans-serif;
    color: #334155;
    line-height: 1.6;
}
.hero-gradient {
    background: linear-gradient(135deg, rgba(15, 23, 42, 0.88) 0%, rgba(79, 70, 229, 0.75) 100%);
}
.glass-card {
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}
.feature-icon {
    width: 56px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 16px;
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: white;
    font-size: 22px;
}
.btn-primary {
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: white;
    padding: 14px 32px;
    border-radius: 12px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all 0.3s ease;
    border: none;
    cursor: pointer;
}
.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px -8px rgba(79, 70, 229, 0.4);
}
.section-title {
    font-size: 2.25rem;
    font-weight: 800;
    color: var(--dark);
    line-height: 1.2;
}
@media (max-width: 768px) {
    .section-title { font-size: 1.75rem; }
}
.car-card {
    transition: all 0.3s ease;
    border: 1px solid #e2e8f0;
}
.car-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 48px -12px rgba(0, 0, 0, 0.12);
    border-color: var(--primary-light);
}
.price-tag {
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.testimonial-card {
    background: white;
    border-radius: 20px;
    padding: 32px;
    box-shadow: 0 4px 24px -4px rgba(0, 0, 0, 0.06);
}
.footer-link {
    color: #94a3b8;
    transition: color 0.2s;
}
.footer-link:hover {
    color: white;
}
[x-cloak] { display: none !important; }
.site-logo {
    height: 52px;
    max-height: 52px;
    width: auto;
    max-width: 200px;
    object-fit: contain;
    display: block;
}
.search-cigarette,
.highlight-container,
.vehicles-grid,
.search__buttons,
.search__results {
    display: none !important;
}
.landing-hero { background: #1e293b; color: #fff; padding: 4rem 2rem; text-align: center; }
.landing-hero h1 { margin: 0 0 1rem; font-size: 2.5rem; }
.landing-hero p { margin: 0; opacity: 0.9; }
.landing-content { max-width: 800px; margin: 2rem auto; padding: 0 2rem; }
.landing-nav ul { list-style: none; padding: 1rem 2rem; margin: 0; display: flex; gap: 1rem; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.landing-nav a { text-decoration: none; color: var(--primary); font-weight: 500; }
.landing-footer { text-align: center; padding: 2rem; color: #64748b; border-top: 1px solid #e2e8f0; }

/* ─── Nav responsive breakpoints ─────────────────────────────────────── */
/* Logo: visible by default, hidden between 1100-1300px, shown again above 1300px */
.nav-container { width: 100%; }   /* burger visible → full width */
.nav-logo { display: flex; }
/* Desktop menu: hidden below 1100px */
.nav-menu { display: none; }
/* Contact info block: hidden below 1500px */
.nav-info { display: none; }
/* Burger: visible below 1100px */
.nav-burger { display: inline-flex; }
/* Mobile dropdown: hidden below 1100px (shown via Alpine x-show) */

@media (min-width: 1100px) {
    .nav-container { width: max-content; } /* burger hidden → shrink to content */
    .nav-menu { display: flex; }
    .nav-burger { display: none; }
    .nav-mobile-panel { display: none !important; }
    .nav-logo { display: none; }
}
@media (min-width: 1300px) {
    .nav-logo { display: flex; }
}
@media (min-width: 1500px) {
    .nav-info { display: flex; }
}

/* ─── Car filter pills – wrap blocks, not text ─────────────────────────── */
.car-search-widget .flex-wrap {
    flex-wrap: wrap !important;
    overflow-x: visible !important;
}
/* ─── Responsive utility classes missing from per-site compiled Tailwind ────── */
/* sm: ≥ 640px */
@media (min-width: 640px) {
    .sm\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sm\:p-7  { padding: 1.75rem; }
    .sm\:p-8  { padding: 2rem; }
    .sm\:px-6 { padding-left: 1.5rem; padding-right: 1.5rem; }
    .sm\:text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
    .sm\:text-4xl { font-size: 2.25rem;  line-height: 2.5rem; }
    .sm\:text-base { font-size: 1rem; line-height: 1.5rem; }
    .sm\:text-lg   { font-size: 1.125rem; line-height: 1.75rem; }
}

/* md: ≥ 768px */
@media (min-width: 768px) {
    .md\:block          { display: block; }
    .md\:flex           { display: flex; }
    .md\:hidden         { display: none; }
    .md\:col-span-2     { grid-column: span 2 / span 2; }
    .md\:flex-row       { flex-direction: row; }
    .md\:grid-cols-2    { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .md\:grid-cols-3    { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .md\:items-center   { align-items: center; }
    .md\:items-end      { align-items: flex-end; }
    .md\:justify-between{ justify-content: space-between; }
}

/* lg: ≥ 1024px */
@media (min-width: 1024px) {
    .lg\:col-span-3     { grid-column: span 3 / span 3; }
    .lg\:gap-12         { gap: 3rem; }
    .lg\:grid-cols-2    { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .lg\:grid-cols-3    { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .lg\:grid-cols-4    { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .lg\:grid-cols-\[1\.2fr\,0\.9fr\,1\.05fr\] { grid-template-columns: 1.2fr 0.9fr 1.05fr; }
    .lg\:pt-12          { padding-top: 3rem; }
    .lg\:px-8           { padding-left: 2rem; padding-right: 2rem; }
    .lg\:text-5xl       { font-size: 3rem; line-height: 1; }
}

/* xl: ≥ 1280px */
@media (min-width: 1280px) {
    .xl\:grid-cols-4    { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ─── Missing opacity / dark-shade utilities ────────────────────────────────── */
.bg-slate-950          { background-color: #020617; }
.bg-slate-900\/70      { background-color: rgba(15, 23, 42, 0.70); }
.bg-slate-900\/90      { background-color: rgba(15, 23, 42, 0.90); }
.bg-white\/5           { background-color: rgba(255,255,255,0.05); }
.bg-white\/10          { background-color: rgba(255,255,255,0.10); }
.bg-white\/95          { background-color: rgba(255,255,255,0.95); }
.bg-white\/\[0\.03\]   { background-color: rgba(255,255,255,0.03); }
.bg-black\/40          { background-color: rgba(0,0,0,0.40); }
.bg-teal-400\/10       { background-color: rgba(59,130,246,0.10); }
.bg-cyan-400\/10       { background-color: rgba(34,211,238,0.10); }
.border-white\/10      { border-color: rgba(255,255,255,0.10); }
.border-teal-400\/30   { border-color: rgba(59,130,246,0.30); }
.text-white\/80        { color: rgba(255,255,255,0.80); }
.text-teal-600\/70     { color: rgba(30,64,175,0.70); }
.shadow-slate-900\/10  { --tw-shadow-color: rgba(15,23,42,0.10); }
.shadow-teal-500\/20   { --tw-shadow-color: rgba(59,130,246,0.20); }
.shadow-teal-500\/25   { --tw-shadow-color: rgba(59,130,246,0.25); }
.hover\:bg-teal-400\/10:hover       { background-color: rgba(59,130,246,0.10); }
.hover\:bg-black\/60:hover          { background-color: rgba(0,0,0,0.60); }
.hover\:border-teal-400\/30:hover   { border-color: rgba(59,130,246,0.30); }
.hover\:border-teal-400\/40:hover   { border-color: rgba(59,130,246,0.40); }
.hover\:shadow-slate-200\/50:hover  { --tw-shadow-color: rgba(226,232,240,0.50); }
.focus\:ring-teal-500\/20:focus     { --tw-ring-color: rgba(59,130,246,0.20); }
.text-\[11px\]         { font-size: 11px; line-height: 1.5; }
.tracking-\[0\.22em\]  { letter-spacing: 0.22em; }
.tracking-\[0\.24em\]  { letter-spacing: 0.24em; }
.group-hover\:translate-x-0\.5 { --tw-translate-x: 0.125rem; }

/* ─── Language selector: limit height and make scrollable ───────────────────── */
[x-show="open"][class*="min-w-56"],
[class*="min-w-56"][class*="max-h-96"] {
    max-height: 320px !important;
    overflow-y: auto !important;
}/* --- Arbitrary-value utilities missing from the compiled Tailwind subset ---
   The per-site subset only emits z-10..z-50 and a fixed set of sizes. These [..] values are
   used by the language modal, image lightbox, footer and car cards, so without them the modal
   has no z-index (gets overlapped) and bottom sheets have no max-height. Keep in sync with
   templates; see build-rental-site skill ("compiled subset") notes. */
.z-\[60\]{z-index:60}
.z-\[100\]{z-index:100}
.z-\[9999\]{z-index:9999}
.z-\[10000\]{z-index:10000}
.max-h-\[60vh\]{max-height:60vh}
.max-h-\[80vh\]{max-height:80vh}
.max-h-\[85vh\]{max-height:85vh}
.max-h-\[90vh\]{max-height:90vh}
.min-h-\[40px\]{min-height:40px}
.min-w-\[160px\]{min-width:160px}
.min-w-\[200px\]{min-width:200px}
.max-w-\[200px\]{max-width:200px}
.text-\[10px\]{font-size:10px;line-height:1.2}
.text-\[11px\]{font-size:11px;line-height:1.3}
.text-\[15px\]{font-size:15px}
.tracking-\[0\.14em\]{letter-spacing:.14em}
.tracking-\[0\.22em\]{letter-spacing:.22em}
.tracking-\[0\.24em\]{letter-spacing:.24em}
.scale-\[0\.99\]{scale:.99}
.w-\[min\(92vw\,34rem\)\]{width:min(92vw,34rem)}

/* === Supplement: utilities used by authored content but absent from the compiled subset (anti-empty-padding). Generated from a Tailwind v4.3 compile of the authored pages. === */
.bg-emerald-50{background-color:var(--color-emerald-50)}
.bg-slate-200{background-color:var(--color-slate-200)}
.bg-slate-300{background-color:var(--color-slate-300)}
.bg-slate-50\/70{background-color:#f8fafcb3}
.bg-slate-900\/60{background-color:#0f172b99}
.border-collapse{border-collapse:collapse}
.border-emerald-100{border-color:var(--color-emerald-100)}
.border-slate-700{border-color:var(--color-slate-700)}
.border-teal-200\/80{border-color:#bfdbfecc}
.border-teal-500{border-color:var(--color-teal-500)}
.cursor-zoom-in{cursor:zoom-in}
.cursor-zoom-out{cursor:zoom-out}
.divide-slate-100>:not([hidden])~:not([hidden]){border-color:var(--color-slate-100)}
.flex-none{flex:none}
.font-normal{--tw-font-weight:var(--font-weight-normal);font-weight:var(--font-weight-normal)}
.from-slate-50{--tw-gradient-from:var(--color-slate-50);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}
.from-teal-50{--tw-gradient-from:var(--color-teal-50);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}
.gap-0\.5{gap:calc(var(--spacing) * .5)}
.group-hover\:bg-teal-100:is(:where(.group):hover *){background-color:var(--color-teal-100)}
.group-hover\:rotate-12:is(:where(.group):hover *){rotate:12deg}
.group-hover\:text-teal-600:is(:where(.group):hover *){color:var(--color-teal-600)}
.group-hover\:text-teal-700:is(:where(.group):hover *){color:var(--color-teal-700)}
.h-96{height:calc(var(--spacing) * 96)}
.h-auto{height:auto}
.hover\:bg-slate-800:hover{background-color:var(--color-slate-800)}
.hover\:bg-teal-700:hover{background-color:var(--color-teal-700)}
.hover\:border-slate-200:hover{border-color:var(--color-slate-200)}
.hover\:border-teal-300:hover{border-color:var(--color-teal-300)}
.hover\:border-teal-400:hover{border-color:var(--color-teal-400)}
.hover\:border-teal-500:hover{border-color:var(--color-teal-500)}
.hover\:border-teal-500\/30:hover{border-color:#3b82f64d}
.hover\:scale-105:hover{--tw-scale-x:105%;--tw-scale-y:105%;--tw-scale-z:105%;scale:var(--tw-scale-x) var(--tw-scale-y)}
.hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}
.hover\:text-slate-700:hover{color:var(--color-slate-700)}
.leading-6{--tw-leading:calc(var(--spacing) * 6);line-height:calc(var(--spacing) * 6)}
.line-clamp-2{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}
.max-w-3xl{max-width:var(--container-3xl)}
.max-w-5xl{max-width:var(--container-5xl)}
.mb-2\.5{margin-bottom:calc(var(--spacing) * 2.5)}
.mb-7{margin-bottom:calc(var(--spacing) * 7)}
.ml-0\.5{margin-left:calc(var(--spacing) * .5)}
.mt-5{margin-top:calc(var(--spacing) * 5)}
.my-6{margin-block:calc(var(--spacing) * 6)}
.my-8{margin-block:calc(var(--spacing) * 8)}
.origin-top-right{transform-origin:100% 0}
.p-7{padding:calc(var(--spacing) * 7)}
.pb-1{padding-bottom:calc(var(--spacing) * 1)}
.pb-20{padding-bottom:calc(var(--spacing) * 20)}
.pb-5{padding-bottom:calc(var(--spacing) * 5)}
.pl-6{padding-left:calc(var(--spacing) * 6)}
.pt-0{padding-top:calc(var(--spacing) * 0)}
.pt-16{padding-top:calc(var(--spacing) * 16)}
.pt-5{padding-top:calc(var(--spacing) * 5)}
.px-7{padding-inline:calc(var(--spacing) * 7)}
.py-5{padding-block:calc(var(--spacing) * 5)}
.right-4{right:calc(var(--spacing) * 4)}
.ring-1{--tw-ring-shadow:var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}
.ring-inset{--tw-ring-inset:inset}
.ring-slate-900\/5{--tw-ring-color:#0f172b0d}
.rounded-t-3xl{border-top-left-radius:var(--radius-3xl);border-top-right-radius:var(--radius-3xl)}
.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}
.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a), 0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)}
.shadow-slate-900\/20{--tw-shadow-color:#0f172b33}
.shadow-teal-500\/10{--tw-shadow-color:#3b82f61a}
@media (min-width:640px){.sm\:p-12{padding:calc(var(--spacing) * 12)}}
@media (min-width:640px){.sm\:px-12{padding-inline:calc(var(--spacing) * 12)}}
@media (min-width:640px){.sm\:py-16{padding-block:calc(var(--spacing) * 16)}}
.text-cyan-300{color:var(--color-cyan-300)}
.text-emerald-700{color:var(--color-emerald-700)}
.text-slate-200{color:var(--color-slate-200)}
.text-slate-900{color:var(--color-slate-900)}
.text-teal-200{color:var(--color-teal-200)}
.text-teal-50{color:var(--color-teal-50)}
.text-teal-900{color:var(--color-teal-900)}
.text-teal-950{color:var(--color-teal-950)}
.to-emerald-50{--tw-gradient-to:var(--color-emerald-50);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}
.to-slate-100{--tw-gradient-to:var(--color-slate-100);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position), var(--tw-gradient-from) var(--tw-gradient-from-position), var(--tw-gradient-to) var(--tw-gradient-to-position))}
.top-4{top:calc(var(--spacing) * 4)}
.w-1\/2{width:50%}
.w-1\/3{width:33.3333%}
.w-1\/4{width:25%}
.w-2\/3{width:66.6667%}

/* minimal typography for legal/prose pages (no @tailwindcss/typography plugin installed) */
.prose{color:var(--color-slate-600);max-width:65ch;line-height:1.75}
.prose-slate{--tw-prose-body:var(--color-slate-600)}
.prose :where(h2):not(.not-prose *){color:var(--color-slate-900);font-weight:700;font-size:1.25rem;margin-top:2rem;margin-bottom:.75rem}
.prose :where(h3):not(.not-prose *){color:var(--color-slate-900);font-weight:600;font-size:1.075rem;margin-top:1.5rem;margin-bottom:.5rem}
.prose :where(p):not(.not-prose *){margin-top:0;margin-bottom:1rem}
.prose :where(ul,ol):not(.not-prose *){margin:1rem 0;padding-left:1.5rem;list-style:revert}
.prose :where(li):not(.not-prose *){margin:.35rem 0}
.prose :where(a):not(.not-prose *){color:var(--color-teal-700);text-decoration:underline}
.prose :where(strong):not(.not-prose *){color:var(--color-slate-900);font-weight:600}
.prose :where(table):not(.not-prose *){width:100%;border-collapse:collapse;margin:1.25rem 0}
.prose :where(th,td):not(.not-prose *){border:1px solid var(--color-slate-200);padding:.5rem .75rem;text-align:left}

/* LocalRent WL booking script: keep ONLY the booking modal (#spa__modal). Hide the app's inline
   white-label search UI (<lr-whitelabel>) — it duplicates our own car-search section and drives a
   runaway ResizeObserver growth loop (the mrc_wl container ballooned to thousands of nodes). The
   booking modal is a sibling, so booking is unaffected (verified: same navigation on click). */
[id^="mrc_wl_"], lr-whitelabel { display: none !important; }

/* Car-search loading states (per-site loader_style: skeleton/shimmer/spinner/dots; uses --primary) */
.lr-skel{background:#e2e8f0;position:relative;overflow:hidden}
.lr-skel--img{height:11rem;width:100%}
.lr-skel--line{height:.8rem;border-radius:5px}
.lr-skel--btn{height:2rem;border-radius:7px}
.lr-skel-card{border:1px solid #f1f5f9;border-radius:1rem;background:#fff;overflow:hidden}
.lr-skel-body{padding:1.15rem;display:flex;flex-direction:column;gap:.6rem}
.lr-loader--skeleton .lr-skel{animation:lr-pulse 1.5s ease-in-out infinite}
@keyframes lr-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.lr-loader--shimmer .lr-skel::after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.65),transparent);animation:lr-shimmer 1.4s infinite}
@keyframes lr-shimmer{100%{transform:translateX(100%)}}
.lr-spinner{width:46px;height:46px;border-radius:50%;border:4px solid #e2e8f0;border-top-color:var(--primary,#4f46e5);animation:lr-spin .8s linear infinite}
@keyframes lr-spin{to{transform:rotate(360deg)}}
.lr-dots{display:inline-flex;gap:9px}
.lr-dots span{width:13px;height:13px;border-radius:50%;background:var(--primary,#4f46e5);animation:lr-bounce 1.2s infinite both}
.lr-dots span:nth-child(2){animation-delay:.18s}
.lr-dots span:nth-child(3){animation-delay:.36s}
@keyframes lr-bounce{0%,80%,100%{transform:scale(.45);opacity:.5}40%{transform:scale(1);opacity:1}}