/* ════════════════════════════════════════════════════════════════════
   Zairent-mirror — fresh, self-contained Home clone (Sayara brand colours).
   Layout/spacing/interactions mirror zairent.webflow.io; own images + copy.
   Palette: amber #fdcc02 + ink #1a1a1a. No dependency on the old theme CSS.
   ════════════════════════════════════════════════════════════════════ */
@import url("https://fonts.googleapis.com/css2?family=Raleway:wght@400;500;600;700;800&display=swap");

:root{
  --amber:#f8c02a; --amber-d:#e0a800; --navy:#0c3675; --ink:#0c3675; --text:#2b3140; --ink-2:#163e7e;
  --blue:#0c3675; --blue-2:#16498f; --blue-d:#0a2c5e;
  --muted:#7a8499; --section:#f5f7fb; --card:#ffffff; --line:#e7e9f0;
  --disp:"Raleway",system-ui,sans-serif;
  --body:"Raleway",system-ui,-apple-system,Segoe UI,sans-serif;
  --ease:cubic-bezier(.22,.8,.2,1); --r:18px;
}
*{box-sizing:border-box}
.zm{margin:0;font-family:var(--body);color:var(--text);line-height:1.6;background:#fff;overflow-x:hidden;-webkit-font-smoothing:antialiased;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.zm img{max-width:100%;display:block}
.zm a{text-decoration:none;color:inherit}
.zm h1,.zm h2,.zm h3,.zm h4{font-family:var(--disp);font-weight:600;color:var(--ink);margin:0;line-height:1.08;letter-spacing:-.01em}
/* ── FLUID TYPE — 1920px reference (H1 72 / H2 56 / H3 52 / H4 42 / H5 32 / H6 24 / p 20),
   linear scale 360px(mobile floor) → 1920px → 3440px(cap). Below 1920 shrinks, above 1920 grows. ── */
:root{
  --zm-fs-h1:clamp(24px,calc(12.91px + 3.08vw),120px);
  --zm-fs-h2:clamp(24px,calc(16.62px + 2.05vw),88px);
  --zm-fs-h3:clamp(22px,calc(17.54px + 1.79vw),80px);
  --zm-fs-h4:clamp(20px,calc(19.85px + 1.15vw),60px);
  --zm-fs-h5:clamp(18px,calc(14.77px + 0.90vw),46px);
  --zm-fs-h6:clamp(16px,calc(14.15px + 0.51vw),32px);
  --zm-fs-p:clamp(14px,calc(12.61px + 0.39vw),26px);
}
.zm h1{font-size:var(--zm-fs-h1)}
.zm h2{font-size:var(--zm-fs-h2)}
.zm h3{font-size:var(--zm-fs-h3)}
.zm h4{font-size:var(--zm-fs-h4)}
.zm h5{font-size:var(--zm-fs-h5)}
.zm h6{font-size:var(--zm-fs-h6)}
.zm{font-size:var(--zm-fs-p)}
.zm .wrap{max-width:1240px;margin-inline:auto;padding:0 24px}
.zm .eyebrow{display:inline-block;color:var(--amber-d);font-weight:600;letter-spacing:.12em;text-transform:uppercase;font-size:.78rem;margin-bottom:14px}
.zm .eyebrow--dash::before,.zm .eyebrow--dash::after{display:none}
.zm .sec-head{text-align:center;max-width:680px;margin:0 auto 48px}
.zm .sec-head h2{font-size:var(--zm-fs-h2)}
/* unified single section heading (even style, amber = old eyebrow colour) */
.zm .zm-shead{font-size:var(--zm-fs-h2);color:var(--amber-d);font-weight:800;text-transform:none;line-height:1.14;margin:0}
.zm .btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;border-radius:40px;padding:14px 26px;transition:transform .2s var(--ease),background .25s,color .25s,box-shadow .25s;cursor:pointer;border:0;font-family:var(--body)}
.zm .btn--ink{background:var(--ink);color:var(--amber)}
.zm .btn--ink:hover{background:var(--amber);color:var(--ink);transform:translateY(-2px)}
.zm .btn--amber{background:var(--amber);color:var(--ink)}
.zm .btn--amber:hover{background:var(--ink);color:var(--amber);transform:translateY(-2px)}
.zm .btn--ghost{background:transparent;border:1.5px solid var(--ink);color:var(--ink)}
.zm .btn--ghost:hover{background:var(--ink);color:#fff}

/* ── BUTTON HOVER COVERAGE — added 2026-06-16 — every clickable element gets a hover state ── */
.zm-burger:hover{color:var(--amber)}
.zm-cbx__btn{transition:color .2s var(--ease)}
.zm-cbx__btn:hover .zm-cbx__val{color:var(--ink)}
.zm-cbx__btn:hover .zm-cbx__chev{color:var(--amber-d)}
.zm-step{transition:background .25s var(--ease)}
.zm-step:hover .zm-step__num{box-shadow:0 0 0 2px var(--amber);transform:scale(1.06)}
.zm-step:hover .zm-step__c h3{color:var(--amber-d)}
.zm-revc__card{transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.zm-revc__card:hover{transform:translateY(-4px);box-shadow:0 24px 50px rgba(12,54,117,.18)}
.zm-topbar__s a{transition:color .2s var(--ease),transform .2s var(--ease)}
.zm-topbar__s a:hover{color:var(--amber);transform:translateY(-1px)}
.zm-news__more .btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(248,192,42,.35)}

/* ── scroll-reveal (fade-up on scroll) ── */
.zm [data-rv]{opacity:0;transform:translateY(34px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.zm [data-rv].in{opacity:1;transform:none}
.zm [data-rv-d="1"]{transition-delay:.08s}.zm [data-rv-d="2"]{transition-delay:.16s}
.zm [data-rv-d="3"]{transition-delay:.24s}.zm [data-rv-d="4"]{transition-delay:.32s}
@media (prefers-reduced-motion:reduce){.zm [data-rv]{opacity:1;transform:none;transition:none}}

/* ════ TOP CONTACT BAR (ezHire) ════ */
.zm-topbar{background:var(--navy);color:#dfe6f2;font-size:.85rem;position:relative;z-index:210;font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1,"tnum" 1}
.zm-topbar__in{max-width:1320px;margin-inline:auto;padding:9px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.zm-topbar a{color:#dfe6f2;transition:color .2s}.zm-topbar a:hover{color:var(--amber)}
.zm-topbar__l{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.zm-topbar__l>a{display:inline-flex!important;align-items:center;min-height:28px;white-space:nowrap}
.zm-topbar__l span{display:inline-flex;align-items:center;gap:7px;white-space:nowrap;min-height:28px}
.zm-topbar__l i{color:var(--amber)}
/* suppress Chrome/Safari auto-phone-detection highlight */
.zm-topbar a[x-apple-data-detectors],.zm-topbar a[href^="tel"]{background:none!important;color:inherit!important}
.zm-topbar__s{display:flex;gap:15px}.zm-topbar__s a{font-size:.95rem}

/* ════ HEADER — transparent nav over hero (ezHire) ════ */
.zm-header{position:absolute;top:0;left:0;right:0;z-index:200;animation:zmNavIn .7s var(--ease) both}
/* Release hero's overflow:hidden ONLY while the Rent-a-Car dropdown is open,
   so the mega-menu can drop down past the hero without being clipped.
   Ken-Burns banner stays clipped at all other times. */
.zm-hero:has(.zm-nav-item:hover, .zm-nav-item:focus-within){overflow:visible}
@keyframes zmNavIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
.zm-nav{max-width:1320px;margin-inline:auto;padding:24px;display:flex;align-items:center;gap:24px}
.zm-logo{display:flex;align-items:center;gap:10px;font-family:var(--disp);font-weight:800;font-size:1.7rem;color:#fff;letter-spacing:-.5px}
.zm-logo i{color:var(--amber);font-size:1.5rem}
.zm-menu{display:flex;gap:28px;margin-left:34px;align-items:center}
.zm-menu>a,.zm-nav-link{font-weight:600;font-size:.86rem;letter-spacing:.03em;text-transform:uppercase;color:#fff;transition:color .2s;display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.zm-menu>a .fa-chevron-down,.zm-nav-link .fa-chevron-down{font-size:.58rem;opacity:.85;transition:transform .3s var(--ease)}
.zm-menu>a:hover,.zm-menu>a.active,.zm-nav-link:hover,.zm-nav-item:hover .zm-nav-link,.zm-nav-link.active{color:var(--amber)}
/* ── smooth dropdown menus ── */
.zm-nav-item{position:relative}
.zm-nav-item:hover .zm-nav-link .fa-chevron-down{transform:rotate(180deg)}
.zm-dd{position:absolute;top:100%;left:50%;transform:translate(-50%,12px);min-width:250px;background:#fff;border-radius:16px;box-shadow:0 26px 64px rgba(12,54,117,.20);padding:10px;margin-top:16px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .3s var(--ease),transform .3s var(--ease),visibility .3s;z-index:220}
.zm-dd::before{content:"";position:absolute;top:-18px;left:0;right:0;height:18px}
.zm-dd::after{content:"";position:absolute;top:-7px;left:50%;transform:translateX(-50%) rotate(45deg);width:14px;height:14px;background:#fff;border-radius:3px}
.zm-nav-item:hover .zm-dd,.zm-nav-item:focus-within .zm-dd{opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0)}
.zm-dd a{display:flex;align-items:flex-start;gap:12px;padding:10px 14px;border-radius:11px;color:var(--ink);font-size:.84rem;font-weight:700;text-transform:none;letter-spacing:0;white-space:nowrap;transition:background .2s var(--ease)}
.zm-dd a i{width:34px;height:34px;border-radius:9px;background:var(--section);color:var(--amber-d);display:grid;place-items:center;font-size:.92rem;flex:none;transition:background .25s,color .25s}
.zm-dd a span{display:flex;flex-direction:column;line-height:1.25}
.zm-dd a small{font-weight:500;font-size:.74rem;color:var(--muted);margin-top:2px}
.zm-dd a:hover{background:var(--section)}
.zm-dd a:hover i{background:var(--ink);color:var(--amber)}
/* ── mega menu (Rent a Car) ── */
.zm-mega{position:absolute;top:100%;left:0;margin-top:16px;width:740px;max-width:calc(100vw - 48px);background:#fff;border-radius:20px;box-shadow:0 32px 74px rgba(12,54,117,.22);padding:22px;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(14px);transition:opacity .34s var(--ease),transform .34s var(--ease),visibility .34s;z-index:220;display:grid;grid-template-columns:1fr 1fr 252px;gap:6px 24px}
.zm-mega::before{content:"";position:absolute;top:-18px;left:0;right:0;height:18px}
.zm-mega::after{content:"";position:absolute;top:-7px;left:48px;transform:rotate(45deg);width:14px;height:14px;background:#fff;border-radius:3px}
.zm-nav-item:hover .zm-mega,.zm-nav-item:focus-within .zm-mega{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.zm-mega>*{opacity:0;transform:translateY(10px);transition:opacity .3s var(--ease),transform .3s var(--ease)}
.zm-nav-item:hover .zm-mega>*{opacity:1;transform:none}
.zm-nav-item:hover .zm-mega>*:nth-child(1){transition-delay:.06s}
.zm-nav-item:hover .zm-mega>*:nth-child(2){transition-delay:.13s}
.zm-nav-item:hover .zm-mega>*:nth-child(3){transition-delay:.2s}
.zm-mega__col h5{font-size:.7rem;text-transform:uppercase;letter-spacing:.09em;color:var(--muted);font-weight:700;margin:6px 12px 6px}
.zm-mega__col a{display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:12px;color:var(--ink);font-weight:700;font-size:.85rem;text-transform:none;letter-spacing:0;transition:background .22s var(--ease),transform .22s var(--ease)}
.zm-mega__col a i{width:36px;height:36px;border-radius:10px;background:var(--section);color:var(--amber-d);display:grid;place-items:center;font-size:.92rem;flex:none;transition:background .25s,color .25s}
.zm-mega__col a span{display:flex;flex-direction:column;line-height:1.22}
.zm-mega__col a small{font-weight:500;font-size:.72rem;color:var(--muted);margin-top:1px}
.zm-mega__col a:hover{background:var(--section);transform:translateX(3px)}
.zm-mega__col a:hover i{background:var(--ink);color:var(--amber)}
.zm-mega__feat{position:relative;border-radius:16px;overflow:hidden;min-height:236px;display:flex;align-items:flex-end;color:#fff}
.zm-mega__feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.zm-mega__feat:hover img{transform:scale(1.08)}
.zm-mega__feat::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(11,28,58,.55) 45%,rgba(11,28,58,.95))}
.zm-mega__featc{position:relative;z-index:2;padding:18px}
.zm-mega__featc .eb{display:inline-block;background:var(--amber);color:var(--ink);font-size:.62rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;padding:4px 10px;border-radius:20px;margin-bottom:10px}
.zm-mega__featc h4{color:#fff;font-size:1.04rem;margin-bottom:12px;line-height:1.2}
.zm-mega__featc .cta{display:inline-flex;align-items:center;gap:8px;background:#fff;color:var(--ink);font-weight:700;font-size:.78rem;padding:9px 15px;border-radius:30px;transition:background .25s,gap .25s}
.zm-mega__featc .cta:hover{background:var(--amber);gap:11px}

/* ════ Rent-a-Car DB mega: Brands + Locations + Car Types + Categories + Rent Type ════
   5 columns; each shows up to 10 items + a "View All" link. Shared by home + about. */
.zm-mega.zm-mega--about{width:min(1080px,calc(100vw - 224px));grid-template-columns:1.45fr 1fr 1fr 1fr 1fr;gap:2px 0;padding:22px 14px;border:1px solid var(--line);box-shadow:0 18px 48px rgba(12,54,117,.14),0 3px 10px rgba(12,54,117,.07)}
.zm-mega--about::after{display:none} /* full border already frames the panel — drop the mis-aligned caret */
/* equal-level columns with an effective divider between each; stretch keeps dividers full-height */
.zm-mega--about>*{padding:0 16px;display:flex;flex-direction:column}
.zm-mega--about>*:not(:last-child){border-right:1px solid var(--line)}
.zm-nav-item:hover .zm-mega--about>*:nth-child(4){transition-delay:.26s}
.zm-nav-item:hover .zm-mega--about>*:nth-child(5){transition-delay:.33s}
.zm-mega--about h5{font-size:.68rem;text-transform:uppercase;letter-spacing:.09em;color:#5f6a80;font-weight:800;margin:2px 0 11px;padding:0 10px}
/* Brand block (10 logos + names + view all) */
.zm-amega-brands{min-width:0}
.zm-abrand-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.zm-mega--about .zm-abrand{display:flex;align-items:center;gap:8px;padding:7px 8px;border-radius:11px;color:var(--ink);font-weight:700;font-size:.8rem;min-width:0;opacity:0;transform:translateY(9px) scale(.96);transition:opacity .3s var(--ease),transform .3s var(--ease),background .2s var(--ease)}
.zm-mega--about .zm-abrand,.zm-mega--about .zm-abrand__name{color:var(--ink)}
.zm-nav-item:hover .zm-abrand,.zm-nav-item:focus-within .zm-abrand,.zm-nav-item:focus-within .zm-mega--about>*{opacity:1;transform:none}
.zm-nav-item:hover .zm-abrand:nth-child(1){transition-delay:.12s}
.zm-nav-item:hover .zm-abrand:nth-child(2){transition-delay:.15s}
.zm-nav-item:hover .zm-abrand:nth-child(3){transition-delay:.18s}
.zm-nav-item:hover .zm-abrand:nth-child(4){transition-delay:.21s}
.zm-nav-item:hover .zm-abrand:nth-child(5){transition-delay:.24s}
.zm-nav-item:hover .zm-abrand:nth-child(6){transition-delay:.27s}
.zm-nav-item:hover .zm-abrand:nth-child(7){transition-delay:.30s}
.zm-nav-item:hover .zm-abrand:nth-child(8){transition-delay:.33s}
.zm-nav-item:hover .zm-abrand:nth-child(9){transition-delay:.36s}
.zm-nav-item:hover .zm-abrand:nth-child(10){transition-delay:.39s}
.zm-abrand:hover{background:var(--section);transform:translateY(-1px)}
.zm-abrand__logo{width:34px;height:27px;border-radius:8px;background:#fff;border:1px solid var(--line);display:grid;place-items:center;flex:none;overflow:hidden}
.zm-abrand__logo img{max-width:26px;max-height:19px;object-fit:contain}
.zm-abrand__name{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Link columns (Locations / Car Types / Categories / Rent Type) */
.zm-mega--about .zm-acol{display:flex;flex-direction:column;min-width:0}
.zm-mega--about .zm-acol>a{display:block;padding:7px 10px;border-radius:9px;color:var(--text);font-weight:600;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .2s var(--ease),color .2s,transform .2s var(--ease)}
.zm-mega--about .zm-acol>a:hover{background:var(--section);color:var(--navy);transform:translateX(3px)}
/* "View All" — pinned to the BOTTOM of each column so all five align (high specificity to beat .zm-acol>a) */
.zm-mega--about .zm-amega-all,
.zm-mega--about .zm-acol>a.zm-amega-all{display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding:9px 10px;border-radius:9px;color:var(--amber-d);font-weight:800;font-size:.8rem;white-space:nowrap;transform:none;transition:gap .2s var(--ease),color .2s,background .2s var(--ease)}
.zm-mega--about .zm-amega-all:hover,
.zm-mega--about .zm-acol>a.zm-amega-all:hover{background:rgba(224,168,0,.10);color:var(--navy);gap:11px;transform:none}
.zm-mega--about .zm-amega-all i{font-size:.72rem;transition:transform .2s var(--ease)}
.zm-mega--about .zm-amega-all:hover i{transform:translateX(3px)}
/* Keyboard focus rings (the panel already reveals on :focus-within) */
.zm-nav-link:focus-visible{outline:2px solid #fff;outline-offset:4px;border-radius:8px}
.zm-mega--about .zm-abrand:focus-visible,
.zm-mega--about .zm-acol>a:focus-visible,
.zm-mega--about .zm-amega-all:focus-visible{outline:2px solid var(--amber);outline-offset:2px;border-radius:9px}

/* Narrow desktops: tighten the mega + let long location names wrap instead of clipping */
@media(max-width:1180px){
  .zm-mega.zm-mega--about{grid-template-columns:1.3fr 1fr 1fr 1fr 1fr;padding:18px 8px}
  .zm-mega--about>*{padding:0 11px}
  .zm-mega--about .zm-acol>a{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.3}
}
@media(max-width:980px){.zm-dd,.zm-mega{display:none}}
.zm-nav__r{display:flex;align-items:center;gap:16px;margin-left:auto}
.zm-flags{display:flex;gap:6px}
.zm-flags span{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:.95rem;background:rgba(255,255,255,.16)}
.zm-login{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:600;font-size:.95rem;transition:color .2s}
.zm-login:hover{color:var(--amber)}
.zm-burger{display:none;background:none;border:0;font-size:1.5rem;color:#fff;cursor:pointer}
/* Auth links inside mobile panel — hidden on desktop (panel is never .is-open at >992px) */
.zm-mob-auth{display:none}

/* ════ HERO — dark landscape (ezHire) ════ */
.zm-hero{position:relative;min-height:540px;display:flex;align-items:center;overflow:hidden;color:#fff;background:#0c2148}
.zm-hero__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.zm-hero::after{content:"";position:absolute;inset:0;background:rgba(12,33,72,.74);z-index:1}
.zm-hero__in{position:relative;z-index:3;max-width:1320px;margin-inline:auto;padding:150px 24px 80px;width:100%}
.zm-hero__in>div{max-width:100%!important}
.zm-hero h1{font-size:var(--zm-fs-h1);font-weight:800;line-height:1.05;color:#fff}
.zm-hero h1 b{display:block;font-weight:800}
.zm-hero__sub{margin:18px 0 0;font-size:1.18rem;color:#cdd7ea;font-weight:500}
/* search bar (overlaps the section below) */
.zm-search{position:relative;z-index:5;max-width:1280px;margin:-36px auto 0;background:#fff;border-radius:16px;box-shadow:0 30px 60px rgba(0,0,0,.22);display:flex;align-items:stretch;padding:8px;text-align:left;color:var(--text)}
.zm-field{flex:1;display:flex;flex-direction:column;justify-content:center;gap:4px;padding:14px 26px;min-width:0;position:relative}
.zm-field+.zm-field::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:1px;background:var(--line)}
.zm-field__lbl{font-size:.78rem;font-weight:600;color:var(--text)}
.zm-field__v{display:flex;align-items:center;gap:10px;font-size:1rem;color:#444c5e;font-weight:500;width:100%}
.zm-field__v>i:first-child{color:var(--amber-d);flex:none}
.zm-field.is-open{background:var(--section)}
.zm-field.is-open::after{content:"";position:absolute;left:8px;right:8px;top:6px;bottom:6px;border-radius:12px;background:var(--section);z-index:-1}
/* ── combobox trigger (car type, location) ── */
.zm-cbx__btn{background:none;border:0;padding:0;font-family:var(--body);text-align:left;cursor:pointer;color:#444c5e}
.zm-cbx__val{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zm-cbx__val.is-placeholder{color:#9aa3b2}
.zm-cbx__chev{margin-left:auto;font-size:.72rem;color:var(--muted);transition:transform .3s var(--ease);flex:none}
.zm-cbx.is-open .zm-cbx__chev{transform:rotate(180deg);color:var(--amber-d)}
/* ── shared dropdown panel ── */
.zm-cbx__panel{position:absolute;top:calc(100% + 12px);left:6px;right:6px;background:#fff;border-radius:14px;box-shadow:0 26px 64px rgba(12,54,117,.22);border:1px solid var(--line);padding:8px;z-index:60;opacity:0;visibility:hidden;transform:translateY(12px) scale(.985);transform-origin:top center;transition:opacity .26s var(--ease),transform .26s var(--ease),visibility .26s;max-height:340px;display:flex;flex-direction:column}
.zm-cbx.is-open .zm-cbx__panel,.zm-ac.is-open .zm-ac__panel{opacity:1;visibility:visible;transform:none}
.zm-cbx__search{display:flex;align-items:center;gap:9px;padding:10px 12px;background:var(--section);border-radius:10px;margin-bottom:6px;flex:none}
.zm-cbx__search i{color:var(--muted);font-size:.85rem}
.zm-cbx__search input{flex:1;min-width:0;border:0;background:transparent;outline:0;font-family:var(--body);font-size:.92rem;color:var(--ink)}
.zm-cbx__list,.zm-ac__list{list-style:none;margin:0;padding:0;overflow-y:auto;flex:1}
.zm-cbx__opt,.zm-ac__opt{display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;font-size:.9rem;color:var(--ink);font-weight:600;cursor:pointer;transition:background .15s var(--ease);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.zm-cbx__opt>i,.zm-ac__opt>i{color:var(--amber-d);font-size:.85rem;width:18px;text-align:center;flex:none}
.zm-cbx__opt:hover,.zm-cbx__opt.is-active,.zm-ac__opt:hover,.zm-ac__opt.is-active{background:var(--section)}
.zm-cbx__opt.is-sel{color:var(--amber-d)}
.zm-cbx__opt.is-sel::after{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;margin-left:auto;font-size:.76rem;color:var(--amber-d)}
.zm-ac__opt b{color:var(--amber-d);font-weight:800}
.zm-cbx__empty,.zm-ac__state{padding:14px 13px;color:var(--muted);font-size:.86rem;text-align:center}
.zm-ac__spin{display:inline-block;width:14px;height:14px;border:2px solid var(--line);border-top-color:var(--amber-d);border-radius:50%;animation:zmSpin .6s linear infinite;vertical-align:-2px;margin-right:7px}
@keyframes zmSpin{to{transform:rotate(360deg)}}
/* ── autocomplete input + clear ── */
.zm-ac__input{flex:1;min-width:0;border:0;background:transparent;outline:0;font-family:var(--body);font-size:1rem;font-weight:500;color:var(--ink)}
.zm-ac__input::placeholder{color:#9aa3b2;font-weight:500}
.zm-ac__clear{background:var(--line);border:0;width:22px;height:22px;border-radius:50%;color:var(--muted);cursor:pointer;display:grid;place-items:center;font-size:.7rem;flex:none;transition:background .2s,color .2s}
.zm-ac__clear:hover{background:var(--ink);color:#fff}
/* ── search button (icon + loading) ── */
.zm-search__btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:9px}
.zm-search__btn.is-loading{pointer-events:none}
.zm-search__btn.is-loading>*{visibility:hidden}
.zm-search__btn.is-loading::after{content:"";position:absolute;width:18px;height:18px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:zmSpin .6s linear infinite}
.zm-cbx__opt[hidden],.zm-ac__clear[hidden],.zm-cbx__empty[hidden],.zm-ac__state[hidden]{display:none}
.zm-search__btn{align-self:stretch;background:var(--navy);color:#fff;border:0;border-radius:12px;padding:0 42px;font-weight:700;font-size:1rem;cursor:pointer;font-family:var(--body);transition:background .25s var(--ease),color .25s var(--ease),transform .2s var(--ease),box-shadow .25s;white-space:nowrap}
.zm-search__btn:hover{background:var(--amber);color:var(--navy);transform:translateY(-2px);box-shadow:0 12px 26px rgba(248,192,42,.35)}

/* ════ WHY CHOOSE US — phone (image swaps per reason) + auto-advancing 4-step rail ════ */
.zm-why{padding:96px 0;background:#fff;overflow:hidden}
.zm-why__title{text-align:center;font-size:var(--zm-fs-h2);color:var(--ink);font-weight:700;margin-bottom:58px}
.zm-hl{background:var(--ink);color:#fff;padding:2px 18px;border-radius:12px;display:inline-block;line-height:1.25}
.zm-why__g{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:64px;align-items:center;max-width:1120px;margin-inline:auto}

/* phone mockup (left) — full-bleed image card that cross-fades per active reason */
.zm-phone-wrap{display:flex;justify-content:center}
.zm-phone{width:100%;background:transparent;border-radius:24px;padding:0;box-shadow:0 30px 64px rgba(12,54,117,.22)}
@keyframes zmFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-14px)}}
.zm-phone__screen{position:relative;background:#fff;border-radius:24px;overflow:hidden;min-height:400px}
.zm-phone__notch{display:none}
.zm-phone__slide{position:absolute;inset:0;opacity:0;transform:scale(1.04);transition:opacity .65s var(--ease),transform .9s var(--ease);pointer-events:none}
.zm-phone__slide.on{opacity:1;transform:none;pointer-events:auto}
.zm-phone__slide img{width:100%;height:100%;object-fit:cover}
.zm-phone__cap2{position:absolute;left:0;right:0;bottom:0;padding:90px 22px 26px;background:linear-gradient(transparent,rgba(11,28,58,.45) 40%,rgba(11,28,58,.94));color:#fff}
.zm-phone__cap2 .tag{display:inline-flex;align-items:center;gap:7px;background:var(--amber);color:var(--ink);font-weight:700;font-size:.7rem;padding:5px 12px;border-radius:30px;margin-bottom:11px;text-transform:uppercase;letter-spacing:.05em}
.zm-phone__cap2 h4{color:#fff;font-size:1.24rem;font-weight:700;margin-bottom:5px;line-height:1.15}
.zm-phone__cap2 p{color:rgba(255,255,255,.84);font-size:.86rem;line-height:1.4}

/* step rail (right) — active driven */
.zm-timeline{position:relative;padding:6px 0 6px 4px}
.zm-timeline__line{position:absolute;left:23px;top:30px;bottom:34px;width:3px;background:var(--line);border-radius:3px;overflow:hidden}
.zm-timeline__fill{position:absolute;inset:0 auto auto 0;width:100%;height:0;background:linear-gradient(var(--ink),var(--blue-2));transition:height .7s var(--ease)}
.zm-step{display:flex;gap:24px;padding-bottom:30px;position:relative;cursor:pointer}
.zm-step:last-child{padding-bottom:0}
.zm-step__num{width:42px;height:42px;border-radius:50%;background:#fff;color:var(--muted);font-weight:700;font-size:1rem;display:grid;place-items:center;flex:none;box-shadow:0 0 0 2px var(--line);z-index:2;position:relative;transition:box-shadow .45s var(--ease),background .45s var(--ease),color .45s var(--ease),transform .45s var(--ease)}
.zm-step.is-done .zm-step__num{color:var(--ink);box-shadow:0 0 0 2px var(--ink)}
.zm-step.is-active .zm-step__num{background:var(--ink);color:#fff;box-shadow:0 0 0 5px rgba(12,54,117,.16);transform:scale(1.08)}
.zm-step__c{padding-top:7px;transition:opacity .35s var(--ease)}
.zm-step:not(.is-active):not(.is-done) .zm-step__c{opacity:.62}
.zm-step__c h3{font-family:var(--disp);font-weight:700;font-size:1.16rem;color:var(--ink);text-transform:uppercase;letter-spacing:.01em;margin-bottom:7px;transition:color .35s}
.zm-step.is-active .zm-step__c h3{color:var(--amber-d)}
.zm-step__c p{color:var(--muted);font-size:.97rem;max-width:44ch;line-height:1.55}

@media (max-width:880px){.zm-why{padding:70px 0}.zm-why__g{grid-template-columns:1fr;gap:44px;max-width:560px}.zm-phone-wrap{padding:40px 0}}
@media (max-width:520px){.zm-phone{width:100%;max-width:340px}.zm-step{gap:18px}.zm-step__c p{font-size:.92rem}}

/* ════ BROWSE — by Category (left) + by Type (right), vertical auto-sliders ════ */
.zm-browse{padding:96px 0;background:var(--section);overflow:hidden}
.zm-browse__head{text-align:center;max-width:680px;margin:0 auto 46px}
.zm-browse__g{display:grid;grid-template-columns:1fr 1fr;gap:30px;max-width:1040px;margin-inline:auto}
.zm-browse__t{font-size:1.35rem;color:var(--ink);margin-bottom:22px;text-align:center;font-weight:700}
.zm-vslider{height:350px;padding:0 14px;overflow:hidden;position:relative;cursor:grab;-webkit-mask-image:linear-gradient(180deg,transparent,#000 11%,#000 89%,transparent);mask-image:linear-gradient(180deg,transparent,#000 11%,#000 89%,transparent)}
.zm-vslider::-webkit-scrollbar{display:none}
.zm-vslider.zm-grabbing{cursor:grabbing;scroll-behavior:auto;user-select:none}
.zm-vslider.zm-grabbing a{pointer-events:none}
.zm-vtrack{display:flex;flex-direction:column;gap:16px;will-change:transform}
.zm-vcard{display:flex;align-items:center;gap:16px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px;color:var(--ink);transition:box-shadow .3s var(--ease),border-color .3s,transform .3s var(--ease)}
.zm-vcard:hover{border-color:var(--amber);box-shadow:0 14px 30px rgba(12,54,117,.14);transform:translateX(3px)}
.zm-vcard__img{width:104px;height:74px;border-radius:12px;overflow:hidden;flex:none;background:var(--section)}
.zm-vcard__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.zm-vcard:hover .zm-vcard__img img{transform:scale(1.08)}
.zm-vcard__t{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.zm-vcard__t h4{font-size:1.05rem;font-weight:700;color:var(--ink);white-space:nowrap}
.zm-vcard__t small{color:var(--muted);font-size:.82rem;margin-top:2px}
.zm-vcard__go{margin-left:auto;width:34px;height:34px;border-radius:50%;background:var(--section);color:var(--ink);display:grid;place-items:center;font-size:.78rem;flex:none;transition:background .25s,color .25s,transform .25s}
.zm-vcard:hover .zm-vcard__go{background:var(--ink);color:var(--amber);transform:translateX(2px)}
@media (prefers-reduced-motion:reduce){.zm-vtrack{animation:none}.zm-vslider{overflow-y:auto}}
@media (max-width:760px){.zm-browse{padding:70px 0}.zm-browse__g{grid-template-columns:1fr;max-width:460px;gap:36px}.zm-vslider{height:330px}}

/* ════ WHY CHOOSE US — alternating image/content rows ════ */
.zm-why{padding:96px 0;background:#fff;overflow:hidden}
.zm-whyrows{display:flex;flex-direction:column;gap:64px;max-width:1080px;margin:0 auto}
.zm-whyrow{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.zm-whyrow.is-rev .zm-whyrow__img{order:2}
.zm-whyrow__img{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:4/3;box-shadow:0 30px 60px rgba(12,54,117,.14)}
.zm-whyrow__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.zm-whyrow:hover .zm-whyrow__img img{transform:scale(1.05)}
.zm-whyrow__badge{position:absolute;top:18px;left:18px;background:var(--amber);color:var(--ink);font-weight:800;font-size:1.05rem;width:48px;height:48px;border-radius:14px;display:grid;place-items:center;box-shadow:0 8px 20px rgba(12,54,117,.18)}
.zm-whyrow__ico{width:56px;height:56px;border-radius:16px;background:var(--section);color:var(--amber-d);display:grid;place-items:center;font-size:1.4rem;margin-bottom:20px}
.zm-whyrow__c h3{font-size:clamp(1.4rem,2.4vw,1.95rem);color:var(--ink);margin-bottom:14px}
.zm-whyrow__c p{color:var(--muted);margin-bottom:20px;line-height:1.6}
.zm-whyrow__list{list-style:none;display:flex;flex-direction:column;gap:11px;margin:0;padding:0}
.zm-whyrow__list li{display:flex;align-items:center;gap:11px;color:var(--ink);font-weight:600;font-size:.96rem}
.zm-whyrow__list i{color:var(--amber-d);font-size:1rem}
@media (max-width:820px){.zm-whyrows{gap:44px;max-width:520px}.zm-whyrow{grid-template-columns:1fr;gap:24px}.zm-whyrow.is-rev .zm-whyrow__img{order:0}}

/* WHY CHOOSE US — centered head + bento grid */
.zm-eyebrow--pill{border:1px solid var(--line);border-radius:30px;padding:7px 18px;color:var(--ink);background:#fff}
.zm-accent{color:var(--amber-d)}
.zm-why__bento{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1120px;margin:0 auto}
.zm-bento{background:var(--section);border:1px solid var(--line);border-radius:20px;padding:32px 28px;color:var(--ink);transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .35s var(--ease),border-color .35s var(--ease),color .35s var(--ease)}
.zm-bento:hover{transform:translateY(-6px);box-shadow:0 28px 56px rgba(12,54,117,.28);background:linear-gradient(160deg,var(--blue-2) 0%,var(--navy) 100%);border-color:transparent;color:#fff}
.zm-bento__ico{width:54px;height:54px;border-radius:50%;border:1.5px solid var(--line);display:grid;place-items:center;font-size:1.3rem;color:var(--ink);margin-bottom:22px;transition:border-color .35s,color .35s}
.zm-bento:hover .zm-bento__ico{border-color:var(--amber);color:var(--amber)}
.zm-bento h3{font-size:1.32rem;color:var(--ink);margin-bottom:12px;line-height:1.2;transition:color .35s}
.zm-bento:hover h3{color:#fff}
.zm-bento p{color:var(--muted);font-size:.95rem;line-height:1.6;transition:color .35s}
.zm-bento:hover p{color:rgba(255,255,255,.85)}
.zm-bento--tall{grid-column:3;grid-row:1 / span 2;display:flex;flex-direction:column}
.zm-bento--wide{grid-column:1 / span 2;grid-row:2}
.zm-bento__cta{margin-top:auto;align-self:flex-start}
.zm-bento__cta:hover{background:#fff!important;color:var(--ink)!important}
@media (max-width:880px){.zm-why__bento{grid-template-columns:1fr 1fr}.zm-bento--tall{grid-column:auto;grid-row:auto}.zm-bento--wide{grid-column:1 / -1;grid-row:auto}}
@media (max-width:560px){.zm-why__bento{grid-template-columns:1fr}.zm-bento--wide{grid-column:auto}}

/* ════ BROWSE BY LOCATION — image cards ════ */
.zm-loc{display:none;padding:96px 0;background:#fff}
.zm-loc__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.zm-loc__card{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3.1;display:flex;align-items:flex-end;color:#fff;box-shadow:0 16px 40px rgba(12,54,117,.10);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.zm-loc__card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.zm-loc__card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent,rgba(11,28,58,.2) 45%,rgba(11,28,58,.9))}
.zm-loc__card:hover{transform:translateY(-6px);box-shadow:0 28px 60px rgba(12,54,117,.22)}
.zm-loc__card:hover img{transform:scale(1.08)}
.zm-loc__o{position:relative;z-index:2;padding:22px;width:100%}
.zm-loc__o h3{color:#fff;font-size:1.4rem;margin-bottom:6px}
.zm-loc__o span{display:inline-flex;align-items:center;gap:8px;font-size:.9rem;color:rgba(255,255,255,.92);font-weight:600}
.zm-loc__o span .fa-arrow-right{margin-left:3px;transition:transform .3s var(--ease)}
.zm-loc__card:hover .fa-arrow-right{transform:translateX(4px)}
@media (max-width:900px){.zm-loc__grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.zm-loc{padding:70px 0}.zm-loc__grid{grid-template-columns:1fr;max-width:400px;margin-inline:auto}}

/* ════ HOW IT WORKS — customer/vendor tabs (reuses phone + rail styles) ════ */
.zm-hiw{padding:96px 0;background:var(--section);overflow:hidden}
.zm-hiw__tabs{display:flex;justify-content:center;gap:10px;margin-bottom:34px}
.zm-hiw__tab{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1px solid var(--line);color:var(--ink);font-weight:700;font-size:.95rem;padding:12px 26px;border-radius:40px;cursor:pointer;transition:background .25s var(--ease),color .25s,border-color .25s,transform .2s var(--ease);font-family:var(--body)}
.zm-hiw__tab:hover{border-color:var(--ink);transform:translateY(-1px)}
.zm-hiw__tab i{color:var(--amber-d);transition:color .25s}
.zm-hiw__tab.active{background:var(--ink);color:#fff;border-color:var(--ink)}
.zm-hiw__tab.active i{color:var(--amber)}
.zm-hiw__panel{display:none}
.zm-hiw__panel.is-active{display:block;animation:zmHiwFade .5s var(--ease)}
@keyframes zmHiwFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.zm-hiw .zm-why__g{max-width:1120px;margin-inline:auto}

/* ════ PICK YOUR CAR FOR EACH OCCASION (ezHire) ════ */
.zm-pick{padding:90px 0 80px;text-align:center}
.zm-pick h2{font-size:clamp(1.8rem,3.4vw,2.6rem);color:var(--navy);margin-bottom:30px;font-weight:800}
.zm-occ{display:none;background:#fff;border:1px solid var(--line);border-radius:50px;padding:6px;gap:4px;margin-bottom:34px;box-shadow:0 10px 30px rgba(12,54,117,.06);flex-wrap:wrap;justify-content:center}
.zm-occ button{background:none;border:1.5px solid transparent;border-radius:40px;padding:9px 24px;cursor:pointer;font-family:var(--body);transition:all .2s var(--ease);line-height:1.2}
.zm-occ button b{display:block;font-size:1rem;font-weight:700;color:var(--navy);transition:color .2s}
.zm-occ button small{font-size:.72rem;color:var(--muted)}
.zm-occ button.active{border-color:var(--navy);box-shadow:0 4px 12px rgba(12,54,117,.1)}
.zm-occ button:hover{border-color:var(--navy);box-shadow:0 4px 12px rgba(12,54,117,.1)}
.zm-occ button:hover b{color:var(--navy)}
.zm-chips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:36px}
.zm-chip{padding:9px 22px;border-radius:40px;border:0;background:#eef1f6;color:var(--text);font-weight:600;cursor:pointer;font-family:var(--body);transition:all .2s}
.zm-chip:hover{background:var(--navy);color:#fff}
.zm-chip.active{background:var(--navy);color:#fff}
.zm-pick__track{display:flex;gap:24px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;scroll-padding-inline:6px;padding:6px 4px 16px;scrollbar-width:none;text-align:left}
.zm-pick__track::-webkit-scrollbar{display:none}
.zm-pcard{position:relative;flex:0 0 min(360px,82%);scroll-snap-align:start;background:#f5f7fb;border:1px solid var(--line);border-radius:18px;padding:26px 24px 24px;color:var(--ink);overflow:visible;transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease)}
.zm-pcard__badge{position:absolute;top:14px;left:14px;z-index:2;background:var(--amber);color:var(--ink);font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.05em;padding:5px 11px;border-radius:30px;box-shadow:0 6px 16px rgba(12,54,117,.2)}
.zm-pcard__cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;margin-top:18px;width:100%;background:var(--navy);border:0;color:#fff!important;font-weight:700;font-size:.9rem;padding:12px 16px;border-radius:12px;box-shadow:0 8px 18px rgba(12,54,117,.18);transition:background .3s var(--ease),color .3s var(--ease),transform .25s var(--ease),box-shadow .3s var(--ease),gap .25s}
.zm-pcard:hover .zm-pcard__cta{background:var(--amber);color:var(--ink)!important;box-shadow:0 10px 24px rgba(248,192,42,.42)}
.zm-pcard__cta:hover{transform:translateY(-2px);gap:12px}
.zm-pcard__cta i{transition:transform .25s var(--ease)}
.zm-pcard__cta:hover i{transform:translateX(3px)}
/* drag cursor + modern hover (image zoom) */
.zm-pick__track{cursor:grab}
.zm-pick__track.zm-grabbing{cursor:grabbing;scroll-behavior:auto;user-select:none}
.zm-pick__track.zm-grabbing a{pointer-events:none}
.zm-pcard__img img{transition:transform .55s var(--ease)}
.zm-pcard:hover .zm-pcard__img img{transform:scale(1.07)}
.zm-pcard:hover{transform:translateY(-10px) scale(1.012);box-shadow:0 34px 66px rgba(12,54,117,.38);background:linear-gradient(160deg,var(--blue-2) 0%,var(--navy) 100%);border-color:transparent;color:#fff}
.zm-pcard::after{content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;box-shadow:0 0 0 0 rgba(248,192,42,0);transition:box-shadow .4s var(--ease)}
.zm-pcard:hover::after{box-shadow:0 0 0 2px var(--amber)}
.zm-pcard__img{position:relative}
.zm-pcard__img::before{content:"";position:absolute;top:0;left:-70%;width:55%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.5),transparent);transform:skewX(-18deg);z-index:1;opacity:0;pointer-events:none}
.zm-pcard:hover .zm-pcard__img::before{animation:zmShine .9s var(--ease) .04s}
@keyframes zmShine{0%{left:-70%;opacity:0}12%{opacity:1}100%{left:130%;opacity:0}}
.zm-pcard__img{height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;border-radius:12px;overflow:hidden;background:rgba(12,54,117,.06);transition:background .3s}
.zm-pcard:hover .zm-pcard__img{background:rgba(255,255,255,.08)}
.zm-pcard__img img{width:100%;height:100%;object-fit:cover}
.zm-pcard__img-link{display:block;text-decoration:none}
.zm-pcard__title-link{color:inherit;text-decoration:none}
.zm-pcard__title-link:hover{color:var(--amber)}
.zm-pcard h3{color:var(--ink);font-size:1.3rem;font-weight:700;margin-bottom:18px;transition:color .3s}
.zm-pcard:hover h3{color:#fff}
.zm-pcard__prices{display:flex;margin-bottom:20px}
.zm-pcard__pr{flex:1;border-right:1px solid rgba(12,54,117,.14);padding:0 14px;transition:border-color .3s}
.zm-pcard__pr:first-child{padding-left:0}
.zm-pcard:hover .zm-pcard__pr{border-color:rgba(255,255,255,.18)}
.zm-pcard__pr:last-child{border-right:0}
.zm-pcard__pr small{display:block;color:var(--muted);font-size:.78rem;margin-bottom:3px;transition:color .3s}
.zm-pcard:hover .zm-pcard__pr small{color:#b9c6e0}
.zm-pcard__pr{container-type:inline-size;position:relative}
.zm-pcard__pr b{font-size:1rem;color:var(--ink);transition:color .3s;white-space:nowrap;display:block;cursor:help}
/* ── REUSABLE TOOLTIP — works on any element with [data-tip="…"]. Navy capsule, amber-d shadow, fades up. ── */
.zm [data-tip]{position:relative}
.zm [data-tip]::before,
.zm [data-tip]::after{position:absolute;left:50%;bottom:calc(100% + 10px);opacity:0;pointer-events:none;transition:opacity .22s var(--ease),transform .22s var(--ease);z-index:90}
.zm [data-tip]::before{content:attr(data-tip);transform:translate(-50%,4px);background:var(--ink);color:#fff;font-size:.78rem;font-weight:600;letter-spacing:.01em;line-height:1.2;padding:8px 12px;border-radius:8px;white-space:nowrap;box-shadow:0 12px 28px rgba(12,54,117,.32);font-family:var(--body);text-transform:none}
.zm [data-tip]::after{content:"";bottom:calc(100% + 4px);transform:translate(-50%,4px) rotate(45deg);width:8px;height:8px;background:var(--ink);box-shadow:2px 2px 4px rgba(12,54,117,.12)}
.zm [data-tip]:hover::before,.zm [data-tip]:focus-visible::before,
.zm [data-tip]:hover::after,.zm [data-tip]:focus-visible::after{opacity:1;transform:translate(-50%,0) rotate(0)}
.zm [data-tip]:hover::after,.zm [data-tip]:focus-visible::after{transform:translate(-50%,0) rotate(45deg)}
@container (max-width:80px){.zm-pcard__pr b{font-size:.88rem}}
@container (max-width:64px){.zm-pcard__pr b{font-size:.78rem}}
.zm-pcard:hover .zm-pcard__pr b{color:var(--amber)}
.zm-pcard__specs{display:flex;justify-content:space-between;gap:8px;border-top:1px solid rgba(12,54,117,.14);padding-top:16px;transition:border-color .3s}
.zm-pcard:hover .zm-pcard__specs{border-color:rgba(255,255,255,.18)}
.zm-pcard__sp{display:flex;flex-direction:column;align-items:center;text-align:center;flex:1;min-width:0}
.zm-pcard__sp i{width:40px;height:40px;border-radius:50%;background:rgba(12,54,117,.07);color:var(--ink);display:grid;place-items:center;margin:0 auto 7px;font-size:.95rem;transition:background .3s,color .3s}
.zm-pcard:hover .zm-pcard__sp i{background:rgba(255,255,255,.14);color:#fff}
.zm-pcard__sp span{font-size:.74rem;color:var(--muted);transition:color .3s}
.zm-pcard:hover .zm-pcard__sp span{color:#cdd7ea}
.zm-pick__see{display:inline-flex;align-items:center;gap:9px;background:var(--navy);color:#fff!important;border-radius:40px;padding:14px 34px;font-weight:700;margin-top:30px;box-shadow:0 10px 24px rgba(12,54,117,.22);transition:background .25s var(--ease),color .25s var(--ease),transform .2s var(--ease),box-shadow .25s var(--ease),gap .25s}
.zm-pick__see:hover{background:var(--amber);color:var(--ink)!important;transform:translateY(-3px);box-shadow:0 14px 30px rgba(248,192,42,.42);gap:12px}
.zm-pick__see i{transition:transform .25s var(--ease)}
.zm-pick__see:hover i{transform:translateX(4px)}

/* ════ slider dots (shared by Pick) ════ */
.zm-dots{display:flex;gap:9px;justify-content:center;margin-top:18px}
.zm-dot{width:11px;height:11px;border-radius:50%;background:#d4d8e2;border:0;cursor:pointer;transition:background .2s,width .2s}
.zm-dot.active{background:var(--ink);width:26px;border-radius:40px}

/* ════ TESTIMONIALS — 3D coverflow slider on a navy brand band (high contrast, glass cards) ════ */
.zm-test{position:relative;padding:96px 0;overflow:hidden;background:linear-gradient(180deg,#0a2c5e 0%,rgba(11,32,66,.62) 30%,rgba(11,32,66,.58) 60%,#0a2c5e 100%),url('../images/banner/sayara-hero.jpg') center/cover no-repeat #0a2c5e}
.zm-test .wrap{position:relative;z-index:1}
.zm-test .sec-head h2{color:#fff}
.zm-test .eyebrow{color:var(--amber)}
.zm-revc{position:relative;max-width:1100px;margin:50px auto 0;perspective:1600px}
.zm-revc__stage{position:relative;height:340px;transform-style:preserve-3d;transition:transform .25s ease-out}
.zm-revc__card{position:absolute;top:0;left:50%;width:min(440px,86vw);margin-left:calc(min(440px,86vw) / -2);min-height:300px;background:rgba(8,22,52,.42);border:1px solid rgba(255,255,255,.16);border-radius:20px;padding:36px 34px;box-shadow:0 30px 64px rgba(4,16,40,.55);backdrop-filter:blur(13px);-webkit-backdrop-filter:blur(13px);transition:transform .55s var(--ease),opacity .55s var(--ease),background .4s,border-color .4s;cursor:pointer;display:flex;flex-direction:column;will-change:transform}
.zm-revc__card[data-state="active"]{background:rgba(8,22,52,.62);border-color:rgba(248,192,42,.7)}
.zm-revc__card[data-state="hidden"]{opacity:0;pointer-events:none}
.zm-revc__stars{color:var(--amber);letter-spacing:3px;font-size:1.05rem;margin-bottom:16px}
.zm-revc__card p{color:rgba(255,255,255,.92);font-size:1.08rem;line-height:1.7;margin:0 0 22px;font-weight:500;flex:1}
.zm-revc__who{display:flex;align-items:center;gap:13px}
.zm-revc__av{width:50px;height:50px;border-radius:50%;background:var(--amber);color:var(--navy);display:grid;place-items:center;font-weight:700;font-size:1.1rem;flex:none;overflow:hidden}
.zm-revc__av img{width:100%;height:100%;object-fit:cover}
.zm-revc__who b{display:block;color:#fff;font-size:1rem}
.zm-revc__who small{color:rgba(255,255,255,.6);font-size:.85rem}
.zm-revc__nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:36px}
.zm-revc__btn{width:48px;height:48px;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.08);color:#fff;display:grid;place-items:center;cursor:pointer;font-size:.95rem;transition:background .25s var(--ease),color .25s,border-color .25s,transform .2s var(--ease)}
.zm-revc__btn:hover{background:var(--amber);color:var(--navy);border-color:var(--amber);transform:translateY(-2px)}
.zm-revc__dots{display:flex;gap:8px;align-items:center}
.zm-revc__dot{width:11px;height:11px;border-radius:50%;background:rgba(255,255,255,.3);border:0;cursor:pointer;transition:background .2s,width .2s}
.zm-revc__dot.is-active{width:26px;border-radius:40px;background:var(--amber)}
@media (prefers-reduced-motion:reduce){.zm-revc__card,.zm-revc__stage{transition:none}}

/* ════ NEWS ════ */
.zm-news{padding:80px 0}
.zm-news__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.zm-news__more{text-align:center;margin-top:46px}
.zm-news__more .btn i{transition:transform .25s var(--ease)}
.zm-news__more .btn:hover i{transform:translateX(4px)}
.zm-nc{background:#fff;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);transition:transform .3s var(--ease),box-shadow .3s}
.zm-nc:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(0,0,0,.10)}
.zm-nc__media{height:210px;overflow:hidden}
.zm-nc__media img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.zm-nc:hover .zm-nc__media img{transform:scale(1.06)}
.zm-nc__b{padding:22px}
.zm-nc__meta{display:flex;gap:14px;color:var(--muted);font-size:.82rem;margin-bottom:10px}
.zm-nc__b h3{font-size:1.18rem;line-height:1.3}
.zm-nc__b h3 a:hover{color:var(--amber-d)}

/* ════ CTA ════ */
.zm-cta{padding:0 0 90px}
.zm-cta__panel{position:relative;border-radius:26px;overflow:hidden;min-height:360px;display:flex;align-items:center;box-shadow:0 30px 70px rgba(12,54,117,.22)}
.zm-cta__panel img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* readable navy overlay (dark on the text side, fading to reveal the car) */
.zm-cta__panel::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,var(--ink) 0%,rgba(12,54,117,.97) 52%,rgba(12,54,117,.78) 74%,rgba(12,54,117,.38) 100%)}
/* car-rental pattern: subtle repeating car silhouettes over the navy area */
.zm-cta__panel::after{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='132' height='74' viewBox='0 0 132 74'%3E%3Cg fill='%23ffffff' fill-opacity='0.06'%3E%3Cpath d='M8 44 L22 44 Q26 28 42 26 L52 16 Q56 12 64 12 L86 12 Q95 12 100 21 L107 34 Q118 35 120 45 L120 48 Q120 51 116 51 L108 51 A10 10 0 0 0 86 51 L52 51 A10 10 0 0 0 30 51 L11 51 Q8 51 8 47 Z'/%3E%3Ccircle cx='41' cy='52' r='8'/%3E%3Ccircle cx='97' cy='52' r='8'/%3E%3C/g%3E%3C/svg%3E");background-size:132px 74px;-webkit-mask-image:linear-gradient(100deg,#000 0%,#000 52%,transparent 84%);mask-image:linear-gradient(100deg,#000 0%,#000 52%,transparent 84%)}
.zm-cta__b{position:relative;z-index:2;padding:54px;max-width:600px}
.zm-cta__b .eyebrow{color:var(--amber)}
.zm-cta__b h2{font-size:var(--zm-fs-h2);color:#fff}
.zm-cta__b p{color:rgba(255,255,255,.85);margin:14px 0 26px;max-width:46ch}

/* ════ FOOTER — Zairent-exact (spacing 80/40, subscribe card 60-72-60-40 r12, link hover translateX(7px) 0.5s) ════ */
.zm-foot{background:var(--section);color:var(--muted);padding:80px 0 40px}
.zm-news-bar{background:#fff;border-radius:12px;display:flex;align-items:center;justify-content:space-between;gap:60px;flex-wrap:wrap;padding:60px 72px 60px 40px}
.zm-news-bar__l{display:flex;flex-direction:column;gap:18px;max-width:430px}
.zm-news-bar .zm-logo{color:var(--ink)}
.zm-news-bar p{color:var(--ink);margin:0;font-size:var(--zm-fs-p);line-height:1.5}
.zm-news-bar__form{display:flex;gap:10px;flex:0 1 440px;min-width:280px}
.zm-news-bar input{flex:1;border:0;border-radius:50px;padding:14px 25px;outline:0;font-family:var(--body);background:var(--section);font-size:.95rem;transition:box-shadow .25s}
.zm-news-bar input:focus{box-shadow:0 0 0 2px var(--blue) inset}
.zm-sub{background:var(--blue);color:#fff;border:0;border-radius:50px;padding:14px 32px;font-weight:600;cursor:pointer;font-family:var(--body);transition:background .25s var(--ease),transform .2s var(--ease),box-shadow .25s}
.zm-sub:hover{background:var(--amber);color:var(--navy);transform:translateY(-2px);box-shadow:0 12px 26px rgba(248,192,42,.35)}
.zm-foot__cols{display:flex;justify-content:space-between;flex-wrap:wrap;gap:40px;padding-top:70px}
.zm-foot__cols>div{display:flex;flex-direction:column;flex:1 1 0;min-width:0}
.zm-foot h4{font-family:var(--disp);color:var(--ink);font-size:var(--zm-fs-h6);font-weight:700;margin-bottom:26px;text-transform:capitalize}
.zm-foot__cols a{display:block;color:var(--muted);font-size:var(--zm-fs-p);line-height:1.5;margin-bottom:23px;transition:color .5s var(--ease),transform .5s var(--ease)}
.zm-foot__cols a:last-child{margin-bottom:0}
.zm-foot__cols a:hover{color:var(--amber);transform:translateX(7px)}
.zm-foot__viewall{color:var(--amber)!important;font-weight:600;display:inline-flex;align-items:center;gap:6px}
.zm-fcol2{display:flex;gap:40px}
.zm-fcol2>div{display:flex;flex-direction:column}
.zm-contact a,.zm-contact span{display:flex;align-items:flex-start;gap:13px;margin-bottom:20px;overflow-wrap:break-word;word-break:break-word;min-width:0}
.zm-contact i{width:36px;height:36px;border-radius:50%;background:var(--amber);color:var(--ink);display:grid;place-items:center;flex:none;font-size:.85rem;margin-top:-2px;transition:transform .5s var(--ease)}
.zm-contact a:hover i{transform:scale(1.08)}
.zm-foot__bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;border-top:1px solid var(--line);margin-top:60px;padding-top:30px;font-size:.95rem;color:var(--muted)}
.zm-soc{display:flex;gap:10px}
.zm-soc a{width:40px;height:40px;border-radius:50%;background:#fff;border:1px solid rgba(0,0,0,.1);display:grid;place-items:center;color:var(--ink);transition:all .3s var(--ease)}
.zm-soc a:hover{background:var(--amber);color:var(--ink);border-color:var(--amber);transform:translateY(-3px)}

/* ════ RESPONSIVE ════ */
@media (max-width:992px){
  /* Hide desktop menu row; burger appears */
  .zm-menu{display:none}
  .zm-nav__r .btn{display:none}
  .zm-burger{display:block;margin-left:auto}
  /* Anchor the absolutely-positioned mobile panel to the nav (not a far ancestor)
     so left:16/right:16 stay symmetric */
  .zm-nav{position:relative}
  .zm-news__grid{grid-template-columns:repeat(2,1fr)}
  .zm-foot__cols{justify-content:flex-start;gap:40px 60px}
  .zm-foot__cols>div{flex:1 1 40%}
  .zm-search{flex-wrap:wrap}.zm-field{flex:1 1 40%}.zm-field+.zm-field{border-left:0}

  /* ── Mobile menu panel (opened via .is-open class, toggled by JS) ──
     Anchored below the nav (absolute — NOT fixed: .zm-header keeps a transform
     from its entrance animation, which would trap a fixed panel in the header
     box). max-height keeps the whole panel on-screen; the page behind is locked
     (html.zm-noscroll) and overscroll-behavior:contain stops the scroll from
     "falling through" to the page — so every item down to Contact Us scrolls
     into view inside the panel. */
  .zm-menu.is-open{
    display:flex;
    flex-direction:column;
    align-items:stretch;  /* override the desktop .zm-menu align-items:center so column children fill width (matching Rent a Car) */
    margin:0;            /* reset desktop margin-left:34px so left:16 stays symmetric */
    position:absolute;
    top:100%;
    left:16px;
    right:16px;
    background:var(--navy);
    border-radius:14px;
    padding:16px 16px 28px;  /* extra bottom so the last "View All Cars" link has breathing room inside the navy bg */
    gap:0;
    z-index:1000;
    max-height:calc(100vh - 96px);
    max-height:calc(100dvh - 96px);  /* dvh = real visible height on iOS (toolbars excluded) so the bottom items (Super Cars / View All) aren't clipped below the fold */
    overflow-y:auto;
    overscroll-behavior:contain;    /* don't chain the scroll to the page */
    box-shadow:0 24px 60px rgba(0,0,0,.35);
    -webkit-overflow-scrolling:touch;
  }
  /* While the menu is open, lift the whole header stacking context above every
     page section so the panel can never be overlapped by the hero search card. */
  html.zm-noscroll .zm-header{z-index:1000}
  /* Lock the page behind the open menu (class toggled by JS) */
  html.zm-noscroll, html.zm-noscroll body{overflow:hidden}

  /* Top-level links inside the open panel — full width + centered label,
     matching the Rent a Car nav-link so the row hover state spans the
     whole panel width consistently across every item. */
  .zm-menu.is-open > a,
  .zm-menu.is-open > .zm-nav-item > .zm-nav-link{
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:.95rem;
    font-weight:600;
    padding:12px 14px;
    border-radius:10px;
    border-bottom:1px solid rgba(255,255,255,.08);
    transition:background .2s;
    text-transform:none;
    letter-spacing:0;
    cursor:pointer;
  }
  .zm-menu.is-open > a:last-child,
  .zm-menu.is-open > .zm-nav-item:last-child > .zm-nav-link{border-bottom:0}
  .zm-menu.is-open > a:hover,
  .zm-menu.is-open > .zm-nav-item > .zm-nav-link:hover{background:rgba(255,255,255,.10)}

  /* Rent a Car nav-item: accordion toggle. It's full-width (unlike the other
     content-width links) so center its label to match the rest. */
  .zm-menu.is-open .zm-nav-item{position:static;width:100%}
  .zm-menu.is-open > .zm-nav-item > .zm-nav-link{justify-content:center}

  /* Chevron rotates when accordion is open */
  .zm-menu.is-open .zm-nav-item.is-mob-open > .zm-nav-link .fa-chevron-down{transform:rotate(180deg)}

  /* Mobile mega: override absolute desktop panel → inline accordion block */
  .zm-menu.is-open .zm-mega.zm-mega--about{
    display:none; /* hidden until accordion opened */
    position:static;
    width:100%;
    max-width:100%;
    grid-template-columns:1fr 1fr;   /* Locations | Car Types, then Categories | Rent Type */
    gap:12px 16px;
    padding:12px 0 12px 14px;        /* equal top & bottom gap */
    margin-top:0;
    box-shadow:none;
    border:0;
    border-left:2px solid rgba(255,255,255,.2);
    border-radius:0;
    background:transparent;
    opacity:1;
    visibility:visible;
    transform:none;
    pointer-events:auto;
  }
  .zm-menu.is-open .zm-nav-item.is-mob-open .zm-mega.zm-mega--about{display:grid}

  /* Car Brands (logo grid) spans the full width; the 4 link groups pair up 2-per-row */
  .zm-menu.is-open .zm-mega--about .zm-amega-brands{
    grid-column:1 / -1;
    border-bottom:1px solid rgba(255,255,255,.08);
    padding-bottom:12px;
    margin-bottom:2px;
  }
  .zm-menu.is-open .zm-mega--about > *{
    padding:0;
    border-right:0;
    border-bottom:0;
    margin-bottom:0;
    opacity:1;
    transform:none;
  }

  /* Column headings */
  .zm-menu.is-open .zm-mega--about h5{
    color:var(--amber);
    font-size:.72rem;
    padding:8px 0 4px;
    margin:0 0 4px;
  }
  /* First heading flush to the top so the inside top gap == the inside bottom gap */
  .zm-menu.is-open .zm-mega--about .zm-amega-brands h5{padding-top:0}

  /* Brand grid: 2 columns of compact items */
  .zm-menu.is-open .zm-abrand-grid{grid-template-columns:1fr 1fr;gap:4px}
  .zm-menu.is-open .zm-abrand{
    color:#fff;
    font-size:.8rem;
    padding:6px 8px;
    opacity:1;
    transform:none;
  }
  .zm-menu.is-open .zm-abrand__logo{width:28px;height:22px}
  .zm-menu.is-open .zm-abrand__logo img{max-width:22px;max-height:16px}
  .zm-menu.is-open .zm-abrand__name{color:#fff}

  /* Link columns: compact stacked links */
  .zm-menu.is-open .zm-acol > a{
    color:rgba(255,255,255,.85);
    font-size:.84rem;
    padding:6px 4px;
    border-radius:6px;
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
    transition:color .2s;
  }
  .zm-menu.is-open .zm-acol > a:hover{color:var(--amber);background:transparent;transform:none}

  /* View All links */
  .zm-menu.is-open .zm-amega-all,
  .zm-menu.is-open .zm-acol > a.zm-amega-all{
    color:var(--amber);
    font-size:.8rem;
    padding:6px 4px;
    margin-top:2px;
  }

  /* Auth links: hidden inside the panel — Log In / Register already live in the
     top bar next to the logo, so the in-panel pair is redundant. */
  .zm-menu.is-open .zm-mob-auth{
    display:none;
    gap:10px;
    width:100%;             /* panel is align-items:center, so stretch the auth row ourselves */
    align-self:stretch;
    padding:14px 0 4px;
    margin-top:6px;
  }
  /* The last nav link already draws the divider above the auth row — drop its
     border so we don't get a double line, and let the auth row sit flush. */
  .zm-menu.is-open .zm-mob-auth a{
    flex:1;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:6px;
    white-space:nowrap;       /* keep "Log In" on one line (was wrapping to Log / In) */
    text-align:center;
    color:#fff;
    font-weight:700;
    font-size:.9rem;
    padding:12px 14px;  /* ≥44px tap target */
    border-radius:10px;
    background:rgba(255,255,255,.10);
    transition:background .2s;
  }
  .zm-menu.is-open .zm-mob-auth a:first-child{background:var(--amber);color:var(--navy)}
  .zm-menu.is-open .zm-mob-auth a:hover{background:rgba(255,255,255,.2)}
  .zm-menu.is-open .zm-mob-auth a:first-child:hover{background:var(--amber-d)}
}
@media (max-width:640px){
  .zm-news__grid{grid-template-columns:1fr;max-width:420px;margin-inline:auto}
  .zm-foot__cols>div{flex:1 1 100%}
  .zm-news-bar{padding:36px 28px}
  .zm-field{flex:1 1 100%}
  .zm-hero{padding-top:120px}
}

/* ════ Uniform section rhythm — equal top & bottom gap on every content section ════
   Overrides the scattered per-section values (90/80, 80, 0/90 …) with one cadence:
   96px desktop, 70px ≤880px. padding-block touches only top/bottom, so each section
   keeps its own horizontal padding/background. */
.zm-pick,.zm-why,.zm-browse,.zm-loc,.zm-hiw,.zm-news,.zm-test,.zm-cta{padding-block:96px}
.zm-hiw{padding-block:72px}
@media (max-width:880px){
  .zm-pick,.zm-why,.zm-browse,.zm-loc,.zm-hiw,.zm-news,.zm-test,.zm-cta{padding-block:70px}
  .zm-revc__stage{height:400px}
}

/* ════════════════════════════════════════════════════════════════════
   COMPREHENSIVE RESPONSIVE OVERHAUL — 2026-06-16
   Covers 360px → 3440px (1920px desktop reference untouched).
   ════════════════════════════════════════════════════════════════════ */

/* ── 1. CRITICAL: Contain the Pick-car horizontal scroll track ──────
   WITHOUT width:100% the flex container tries to stretch to fit all
   18+ cards → body scrollWidth > clientWidth → 24px horizontal overflow
   at 390px and every other viewport. overflow-x:auto only clips if the
   track itself is bounded. */
.zm-pick__track{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
}

/* ── 2. Prevent any stray inline-flex / absolute from escaping .zm ──
   Belt-and-braces body containment. */
.zm{
  overflow-x:clip; /* clip (not hidden) so position:sticky still works */
}

/* ════ SMALL MOBILE (360–576px) ════ */
@media (max-width:576px){

  /* Wrap padding: slightly tighter on very small phones */
  .zm .wrap{padding:0 16px}

  /* Top contact bar: show phone + email; hide the WhatsApp promo and the social
     icons (social still live in the footer) so the two contacts fit without wrapping */
  .zm-topbar__l a:last-child{display:none}
  .zm-topbar__s{display:none}
  .zm-topbar{font-size:.78rem}
  .zm-topbar__in{padding:7px 16px;gap:10px;justify-content:center}
  .zm-topbar__l{gap:14px;justify-content:center;width:100%}

  /* Nav: tighter horizontal padding */
  .zm-nav{padding:14px 16px}

  /* Hero: tighter min-height + less top padding so headline sits higher.
     Reset the older ≤640 `.zm-hero{padding-top:120px}` — the inner padding alone
     clears the absolute header, so we don't stack both. */
  .zm-hero{min-height:420px;padding-top:0}
  .zm-hero__in{padding:100px 16px 48px}
  .zm-hero__sub{font-size:1rem;margin-top:10px}

  /* Search bar: stack all fields vertically, full-width button */
  .zm-search{padding:8px;gap:0;border-radius:14px;margin-top:-28px}
  .zm-field{flex:1 1 100%;padding:12px 16px}
  .zm-field+.zm-field::before{display:none}
  .zm-search__btn{width:100%;border-radius:10px;padding:14px;justify-content:center;margin-top:4px;align-self:auto}

  /* Pick Your Car: tighter section padding, chips wrap */
  .zm-chips{gap:8px}
  .zm-chip{padding:8px 16px;font-size:.88rem}
  .zm-pick__track{gap:16px;padding:6px 0 16px}
  .zm-pcard{flex:0 0 min(300px,85vw);padding:18px 16px 16px}
  /* Tighten card image — was 120px, reduce to 90px on mobile */
  .zm-pcard__img{height:90px;margin-bottom:8px}
  .zm-pcard h3{font-size:1.08rem;margin-bottom:12px}
  .zm-pcard__prices{gap:0;margin-bottom:12px}
  .zm-pcard__pr{padding:0 8px}
  .zm-pcard__pr:first-child{padding-left:0}
  .zm-pcard__pr b{font-size:.88rem}
  /* Specs row: smaller icons */
  .zm-pcard__specs{padding-top:10px}
  .zm-pcard__sp i{width:32px;height:32px;font-size:.8rem;margin-bottom:4px}
  .zm-pcard__sp span{font-size:.68rem}
  /* CTA button */
  .zm-pcard__cta{padding:10px 12px;font-size:.85rem;margin-top:12px}

  /* Explore Fleet: single column on small mobile */
  .zm-browse__g{grid-template-columns:1fr;gap:32px}
  .zm-vslider{height:300px}

  /* Why choose us bento: single column */
  .zm-why__bento{grid-template-columns:1fr}
  .zm-bento--tall{grid-column:auto;grid-row:auto}
  .zm-bento--wide{grid-column:auto;grid-row:auto}
  .zm-bento{padding:24px 20px}

  /* Why rows (phone+rail): collapse to column — phone on top, steps below */
  .zm-why__g{grid-template-columns:1fr;gap:28px;max-width:100%}
  /* Phone mockup: ensure it has explicit height so absolute slides fill it */
  .zm-phone-wrap{display:block;width:100%;padding:0}
  .zm-phone{max-width:100%;border-radius:16px;width:100%}
  .zm-phone__screen{
    min-height:260px;
    height:260px;   /* explicit height — absolute slides need a sized parent */
    position:relative; /* ensure stacking context for absolute children */
    display:block;
    overflow:hidden;
  }
  /* Slides: absolute fill — already set globally but reaffirm for mobile */
  .zm-phone__slide{position:absolute;inset:0;width:100%;height:100%}
  .zm-phone__slide img{width:100%;height:100%;object-fit:cover;display:block}
  .zm-step{gap:16px}
  .zm-step__c h3{font-size:1rem}
  .zm-step__c p{font-size:.88rem}
  .zm-timeline{padding-left:0}
  .zm-timeline__line{left:20px}

  /* How It Works tabs: stack on very small */
  .zm-hiw__tabs{flex-direction:column;align-items:center;gap:8px}
  .zm-hiw__tab{width:100%;max-width:280px;justify-content:center}

  /* Blog grid: single column */
  .zm-news__grid{grid-template-columns:1fr;max-width:100%;margin-inline:auto}

  /* Testimonials: reduce stage height, card width */
  .zm-revc__stage{height:auto;min-height:340px}
  .zm-revc__card{width:min(320px,90vw);margin-left:calc(min(320px,90vw) / -2);padding:26px 22px}
  .zm-revc__card p{font-size:.95rem}

  /* CTA panel: stack content */
  .zm-cta__panel{min-height:auto;flex-direction:column}
  .zm-cta__b{padding:36px 24px;max-width:100%}

  /* Footer news-bar: fully stacked */
  .zm-news-bar{flex-direction:column;gap:24px;padding:28px 20px;text-align:center}
  .zm-news-bar__l{align-items:center;max-width:100%}
  .zm-news-bar__form{flex-direction:column;flex:1 1 auto;min-width:0;width:100%}
  .zm-news-bar__form input{border-radius:10px;padding:12px 18px}
  .zm-sub{border-radius:10px;padding:12px 24px}

  /* Footer columns on mobile: Menu + Quick Links share the top row;
     Pages and Contact Info span the full width below. */
  .zm-foot__cols{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:30px 24px;
    padding-top:36px;
  }
  .zm-foot__cols>div{width:auto}
  .zm-foot__cols>div:nth-child(1){grid-column:1;grid-row:1}        /* Quick Links  */
  .zm-foot__cols>div:nth-child(3){grid-column:2;grid-row:1}        /* Car Cats     */
  .zm-foot__cols>div:nth-child(2){grid-column:1;grid-row:2}         /* Car Types    */
  .zm-foot__cols>div:nth-child(4){grid-column:2;grid-row:2}         /* Locations    */
  .zm-foot__cols>div:nth-child(5){grid-column:1 / -1;grid-row:3}   /* Contact Info */
  .zm-foot h4{font-size:1.1rem;margin-bottom:14px}
  .zm-foot__cols a{margin-bottom:12px;font-size:.9rem}
  /* Pages: two even sub-columns filling the full width (no right-side gap) */
  .zm-fcol2{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}
  .zm-foot__bottom{flex-direction:column;align-items:flex-start;gap:10px;margin-top:32px;padding-top:18px}
  .zm-foot{padding:48px 0 26px}

  /* Browse by location: 1 col */
  .zm-loc__grid{grid-template-columns:1fr;max-width:100%}
}

/* ════ NARROW MOBILE (≤ 390px — 360/375/390px phones) ════ */
@media (max-width:390px){
  /* keep BOTH phone + email visible even on the narrowest phones */
  .zm-topbar__s{display:none} /* social icons off */
  .zm-hero{min-height:400px}
  .zm-hero__in{padding-top:80px;padding-bottom:40px}
  .zm-pcard{flex:0 0 88vw} /* fill almost full width — cleaner 1-at-a-time swipe */
  .zm-pcard__pr b{font-size:.92rem}
  .zm-revc__card{width:88vw;margin-left:calc(88vw / -2);padding:22px 18px}
  .zm-news-bar{padding:24px 16px}
  .zm-hiw__tab{font-size:.88rem;padding:10px 18px}
}

/* ════ TABLET PORTRAIT (577–767px) ════ */
@media (min-width:577px) and (max-width:767px){
  .zm .wrap{padding:0 20px}
  .zm-hero{padding-top:0}  /* neutralize legacy ≤640 padding-top:120 stacking */
  .zm-hero__in{padding:140px 20px 70px}
  .zm-search{flex-wrap:wrap;padding:8px}
  .zm-field{flex:1 1 48%}
  .zm-field+.zm-field::before{display:none}
  .zm-search__btn{flex:1 1 100%;border-radius:10px;padding:14px;justify-content:center;align-self:auto}
  .zm-pcard{flex:0 0 min(340px,78%)}
  .zm-browse__g{grid-template-columns:1fr;gap:32px}
  .zm-vslider{height:310px}
  .zm-why__bento{grid-template-columns:1fr 1fr}
  .zm-bento--tall{grid-column:auto;grid-row:auto}
  .zm-bento--wide{grid-column:1 / -1;grid-row:auto}
  .zm-news__grid{grid-template-columns:1fr 1fr}
  .zm-loc__grid{grid-template-columns:1fr 1fr}
  .zm-news-bar{flex-direction:column;gap:24px;padding:32px 28px;text-align:center}
  .zm-news-bar__l{align-items:center;max-width:100%}
  .zm-news-bar__form{flex:1 1 auto;min-width:0;width:100%;flex-direction:column}
  .zm-news-bar__form input{border-radius:10px;padding:12px 18px}
  .zm-sub{border-radius:10px;padding:12px 24px}
  /* Footer cols: clean 2-column grid on small tablets */
  .zm-foot__cols{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:28px 32px;
    padding-top:44px;
  }
  .zm-foot__cols>div{flex:unset}
  .zm-foot h4{font-size:1.15rem;margin-bottom:18px}
  .zm-foot__cols a{margin-bottom:12px;font-size:.88rem}
  /* Car Types col has many links — span full width so it breathes */
  .zm-foot__cols>div:nth-child(2){grid-column:1 / -1}
  /* Contact Info always full-width on narrow tablets */
  .zm-foot__cols>div:nth-child(5){grid-column:1 / -1}
  .zm-fcol2{gap:24px}
  .zm-foot{padding:60px 0 32px}
  .zm-foot__bottom{flex-direction:column;align-items:flex-start;gap:12px;margin-top:36px;padding-top:18px}
  .zm-cta__b{padding:40px 30px}
}

/* ════ TABLET LANDSCAPE (768–1023px) ════ */
@media (min-width:768px) and (max-width:1023px){
  .zm .wrap{padding:0 24px}
  .zm-hero__in{padding:150px 24px 80px}
  .zm-search{flex-wrap:wrap;padding:8px}
  .zm-field{flex:1 1 48%}
  .zm-field+.zm-field::before{display:none}
  .zm-search__btn{flex:1 1 100%;border-radius:10px;padding:14px;justify-content:center;align-self:auto}
  .zm-pcard{flex:0 0 min(340px,72%)}
  .zm-browse__g{grid-template-columns:1fr 1fr;gap:24px}
  .zm-vslider{height:330px}
  .zm-why__bento{grid-template-columns:1fr 1fr}
  .zm-bento--tall{grid-column:auto;grid-row:auto}
  .zm-bento--wide{grid-column:1 / -1;grid-row:auto}
  .zm-news__grid{grid-template-columns:1fr 1fr 1fr}
  .zm-loc__grid{grid-template-columns:1fr 1fr}
  .zm-news-bar{gap:32px;padding:40px 36px}
  .zm-news-bar__form{flex:0 1 360px}
  /* 3-col grid: row1 = Quick Links | Car Types | Car Categories
                 row2 = Locations (col1) | Contact Info (col2-3) */
  .zm-foot__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 32px}
  .zm-foot__cols>div{flex:unset;min-width:0}
  .zm-foot__cols>div:nth-child(1){grid-column:1;grid-row:1}
  .zm-foot__cols>div:nth-child(2){grid-column:2;grid-row:1}
  .zm-foot__cols>div:nth-child(3){grid-column:3;grid-row:1}
  .zm-foot__cols>div:nth-child(4){grid-column:1;grid-row:2}
  .zm-foot__cols>div:nth-child(5){grid-column:2 / span 2;grid-row:2}
  .zm-foot h4{font-size:1.15rem}
  .zm-foot{padding:70px 0 36px}
  .zm-why__g{gap:44px;max-width:100%}
  .zm-phone-wrap{display:block;width:100%;padding:0}
  .zm-phone{width:100%}
  .zm-phone__screen{min-height:360px;height:360px;position:relative;display:block;overflow:hidden}
  .zm-phone__slide{position:absolute;inset:0;width:100%;height:100%}
  .zm-phone__slide img{width:100%;height:100%;object-fit:cover;display:block}
  .zm-cta__b{padding:44px 40px}
}

/* ════ LAPTOP 1024–1279px ════ */
@media (min-width:1024px) and (max-width:1279px){
  .zm .wrap{padding:0 24px}
  .zm-hero__in{padding:160px 24px 90px}
  .zm-why__g{gap:48px;max-width:100%}
  .zm-whyrows{max-width:100%}
  .zm-pcard{flex:0 0 min(320px,30%)}
  .zm-browse__g{max-width:100%}
  .zm-news-bar{padding:50px 48px 50px 36px}
  .zm-foot{padding:74px 0 38px}
  .zm-foot__cols{gap:28px 32px}
  .zm-foot__cols>div{flex:1 1 0;min-width:0}
}

/* ════ LAPTOP 1280–1439px ════ */
@media (min-width:1280px) and (max-width:1439px){
  .zm .wrap{padding:0 28px}
  .zm-hero__in{padding:160px 28px 90px}
  .zm-pcard{flex:0 0 min(340px,28%)}
  .zm-browse__g{max-width:960px}
  .zm-news-bar{padding:54px 60px 54px 40px}
}

/* ════ LAPTOP/SMALL DESKTOP 1440–1599px ════ */
@media (min-width:1440px) and (max-width:1599px){
  .zm .wrap{padding:0 32px}
  .zm-hero__in{max-width:1320px;padding:170px 32px 100px}
  .zm-pcard{flex:0 0 min(360px,26%)}
  .zm-news-bar{padding:58px 68px 58px 44px}
}

/* ════ LARGE DESKTOP 1600–1919px (NAV LOCKED — do not change nav font/CTA sizes) ════ */
@media (min-width:1600px) and (max-width:1919px){
  .zm .wrap{max-width:1360px;padding:0 36px}
  .zm-nav{max-width:1360px;padding:28px 36px}
  .zm-topbar__in{max-width:1360px;padding:9px 36px}
  .zm-hero__in{max-width:1360px;padding:180px 36px 110px}
  .zm-pcard{flex:0 0 min(380px,24%)}
  .zm-news-bar{padding:62px 72px 62px 48px}
  .zm-why__g{max-width:1200px}
  .zm-why__bento{max-width:1200px}
  .zm-browse__g{max-width:1080px}
  .zm-revc{max-width:1160px}
}

/* ════ QHD 2560px+ ════ */
@media (min-width:2000px){
  /* Cap all content to prevent 2560-wide empty bands */
  .zm .wrap{max-width:1440px;padding:0 48px}
  .zm-nav{max-width:1440px;padding:30px 48px}
  .zm-topbar__in{max-width:1440px;padding:10px 48px}
  .zm-hero__in{max-width:1440px;padding:200px 48px 120px}
  .zm-hero__in>div{max-width:820px}

  /* Sections: increase padding for breathing room */
  .zm-pick,.zm-why,.zm-browse,.zm-loc,.zm-hiw,.zm-news,.zm-test,.zm-cta{padding-block:112px}
  .zm-hiw{padding-block:90px}

  /* Hero height: keep proportional */
  .zm-hero{min-height:640px}

  /* Pick track: let cards be a touch wider */
  .zm-pcard{flex:0 0 min(420px,22%)}

  /* Browse by fleet */
  .zm-browse__g{max-width:1160px}
  .zm-vslider{height:400px}

  /* Why bento */
  .zm-why__bento{max-width:1280px}
  .zm-bento{padding:40px 34px}

  /* Why rows (phone+rail) */
  .zm-why__g{max-width:1200px}
  .zm-phone__screen{min-height:480px}

  /* Testimonials */
  .zm-revc{max-width:1260px}
  .zm-revc__card{width:min(500px,86vw);margin-left:calc(min(500px,86vw) / -2)}

  /* News */
  .zm-news__grid{max-width:1440px;margin-inline:auto}

  /* CTA */
  .zm-cta__panel{min-height:420px}
  .zm-cta__b{padding:72px;max-width:680px}

  /* Footer news-bar */
  .zm-news-bar{padding:72px 88px 72px 56px}
  .zm-news-bar__form{flex:0 1 480px}
  .zm-foot{padding:100px 0 52px}
  .zm-foot h4{font-size:1.7rem}
  .zm-foot__cols a{font-size:1.05rem}
}

/* ════ ULTRAWIDE 3440px ════ */
@media (min-width:3000px){
  .zm .wrap{max-width:1600px;padding:0 60px}
  .zm-nav{max-width:1600px;padding:32px 60px}
  .zm-topbar__in{max-width:1600px;padding:10px 60px}
  .zm-hero__in{max-width:1600px;padding:220px 60px 140px}
  .zm-hero__in>div{max-width:900px}
  .zm-hero{min-height:740px}

  .zm-pick,.zm-why,.zm-browse,.zm-loc,.zm-hiw,.zm-news,.zm-test,.zm-cta{padding-block:128px}
  .zm-hiw{padding-block:104px}

  .zm-pcard{flex:0 0 min(460px,20%)}
  .zm-browse__g{max-width:1300px}
  .zm-vslider{height:440px}
  .zm-why__bento{max-width:1440px}
  .zm-why__g{max-width:1360px}
  .zm-phone__screen{min-height:540px}
  .zm-revc{max-width:1440px}
  .zm-revc__card{width:min(560px,86vw);margin-left:calc(min(560px,86vw) / -2)}
  .zm-cta__panel{min-height:480px}
  .zm-cta__b{padding:90px;max-width:760px}
  .zm-news-bar{padding:80px 100px 80px 64px}
  .zm-news-bar__form{flex:0 1 540px}
  .zm-foot{padding:120px 0 60px}
}

/* ════ SEARCH BAR: mobile full-stack override (≤576px already handled above,
   but this block ensures the search btn always has a proper tap target) ════ */
@media (max-width:767px){
  .zm-search__btn{min-height:48px}  /* ≥44px tap target */
  .zm-hiw__tab{min-height:48px}
  .zm-chip{min-height:44px}  /* WCAG AA min tap target */
  .zm-sub{min-height:48px}
}

/* ════ TOPBAR: hide completely on very small screens to save vertical space ════ */
@media (max-width:360px){
  .zm-topbar{display:none}
  .zm-hero__in{padding-top:90px}
}