/* Focused refinements: hero, search, photo galleries and readable side panels. */
.hero-note { width:260px; font-size:21px; line-height:1.65; top:18px; right:22px; padding:0 7px 5px; transform:rotate(-6deg); text-align:center; }
.hero-note span { display:block; white-space:nowrap; }
.hero-highlights { width:48%; max-width:580px; grid-template-columns:1fr 1fr; gap:13px 20px; bottom:24px; font-size:12px; }
.hero-highlights li { white-space:nowrap; gap:9px; }
.hero-highlights [data-icon] { width:29px; height:29px; background:#fff0b5; color:#997300; }
.hero-badge { padding:13px 17px; gap:12px; background:#ffffffed; border:1px solid #d8ece0; border-radius:15px; box-shadow:0 8px 22px #163c2412; }
.hero-badge>[data-icon] { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:#e3f5e9; color:#16864e; }
.hero-badge .icon { color:#16864e; width:25px; height:25px; font-size:25px; }
.hero-badge strong { display:block; font-size:12px; font-weight:750; }
.hero-badge small { display:block; margin-top:3px; font-size:10px; color:#65736a; font-weight:500; }
.marketplace-layout { grid-template-columns:minmax(0,1fr) 285px; gap:22px; }
.marketplace-main .search-panel { padding:20px; border:1px dashed #cbd3df; border-radius:18px; box-shadow:0 7px 24px #21345007; grid-template-columns:1fr 1.15fr .9fr 1.35fr; gap:15px 12px; background:#fff; }
.marketplace-main .search-panel .field label,.marketplace-main .price-field legend { font-size:11px; color:#5c6575; margin-bottom:7px; font-weight:600; }
.marketplace-main .field select { min-height:44px; border-radius:10px; background:#f8f9fb; font-size:12px; padding:10px; }
.marketplace-main .price-box { background:#f8f9fb; border-radius:10px; }
.marketplace-main .price-box input { background:transparent; min-height:42px; font-size:12px; padding-left:10px; }
.marketplace-main .price-box:focus-within { border-color:#cba500; box-shadow:0 0 0 3px #ffcc0020; }
.marketplace-main .switch-label { grid-column:1 / 3; margin:0; justify-content:flex-start; flex-direction:row-reverse; justify-self:start; font-size:12px; gap:10px; }
.marketplace-main .switch-label>span:first-child { font-size:12px; }
.marketplace-main .search-submit { grid-column:3 / 5; margin:0; min-height:44px; border-radius:10px; font-size:14px; }
.marketplace-main .switch-label input:checked+.switch { background:#199a60; }
.marketplace-main h2 { font-size:20px; }
.sidebar-card { padding:20px; border-radius:17px; background:white; }
.sidebar-card h2 { font-size:19px; }
.sidebar-subtitle { font-size:12px; margin:5px 0 10px; }
.fleet-row { gap:12px; padding:15px 0; }
.fleet-mark { width:46px; height:46px; border-radius:12px; }
.fleet-copy strong { font-size:13px; line-height:1.45; }
.fleet-copy small { font-size:12px; color:#606b7b; margin-top:5px; }
.sidebar-button { min-height:41px; font-size:12px; margin-top:12px; }
.sidebar-demo { font-size:10px; margin-top:10px; }
.jobs-card h2 { font-size:16px; font-weight:750; line-height:1.55; }
.jobs-intro { gap:14px; margin:17px 0 12px; }
.jobs-intro p { font-size:13px; line-height:1.75; }
.jobs-intro [data-icon] { display:grid; place-items:center; flex-shrink:0; width:46px; height:46px; border-radius:12px; background:#fff5cf; }
.jobs-intro [data-icon] .icon { width:28px; height:28px; font-size:28px; color:#dca600; }
.car-photo { aspect-ratio:4 / 3; isolation:isolate; overflow:hidden; touch-action:pan-y; }
.photo-open { width:100%; height:100%; padding:0; position:absolute; inset:0; background:#e8ecf0; }
.photo-open img { width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }

.photo-caption { position:absolute; bottom:0; left:0; right:0; min-height:38px; display:flex; align-items:center; justify-content:space-between; gap:6px; padding:12px 10px 8px; background:linear-gradient(transparent,#0009); color:#fff; pointer-events:none; font-size:9px; }
.photo-dots { display:flex; align-items:center; gap:0; pointer-events:auto; }
.photo-dot { display:grid; place-items:center; width:22px; height:22px; padding:0; }
.photo-dot:before { content:''; width:5px; height:5px; border-radius:50%; background:#ffffff70; }
.photo-dot[aria-pressed="true"]:before { background:white; width:7px; height:7px; }
.photo-count { font-size:10px; font-variant-numeric:tabular-nums; }
.photo-arrow { position:absolute; top:52%; transform:translateY(-50%); width:28px; height:34px; display:grid; place-items:center; border-radius:9px; background:#15203070; color:white; opacity:0; transition:opacity .15s; }
.photo-arrow.previous { left:7px; }
.photo-arrow.next { right:7px; }
.photo-arrow .icon { width:12px; height:12px; font-size:12px; }
.photo-arrow.previous .icon { transform:rotate(90deg); }
.photo-arrow.next .icon { transform:rotate(-90deg); }
.car-photo:hover .photo-arrow,.car-photo:focus-within .photo-arrow { opacity:1; }
.favorite-button { padding:0; place-items:center; width:34px; height:34px; top:9px; right:9px; background:#13202ad9; border:1px solid #ffffff40; box-shadow:0 2px 8px #0002; z-index:3; color:white; }
.favorite-button:hover { background:#13202a; }
.favorite-button .fa-heart::before,.favorites-toggle .fa-heart::before { opacity:0; }
.favorite-button .fa-heart::after,.favorites-toggle .fa-heart::after { color:transparent; opacity:1; -webkit-text-stroke:1.6px currentColor; }
.favorite-button .fa-heart::after { -webkit-text-stroke-color:white; }
.favorites-toggle .fa-heart::after { -webkit-text-stroke-color:#263240; }
.favorite-button[aria-pressed="true"] { background:#fff; border-color:#fff; }
.favorite-button[aria-pressed="true"] .fa-heart::after { color:#e23f54; -webkit-text-stroke-color:#e23f54; }
.favorite-button[aria-pressed="true"] .icon { color:#e23f54; }
.marketplace-main .availability { top:10px; left:10px; bottom:auto; font-size:9px; padding:4px 7px; background:#158b50; color:white; box-shadow:0 2px 7px #0001; }
.marketplace-main .availability:before { background:white; }
.marketplace-main .car-body { padding:13px; }
.marketplace-main .car-body h3 { font-size:18px; }
.marketplace-main .car-meta { font-size:11px; }
.marketplace-main .car-tags span { font-size:10px; }
.marketplace-main .car-conditions { font-size:11px; }
.marketplace-main .car-actions .button { font-size:11px; min-height:40px; }
@media(min-width:1051px) and (max-width:1399px) {
  .marketplace-main .car-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .marketplace-layout { grid-template-columns:minmax(0,1fr) 270px; gap:18px; }
  .marketplace-main .section-heading { align-items:flex-start; flex-wrap:wrap; }
  .marketplace-main h2 { font-size:19px; }
  .sidebar-card { padding:17px; }
}
@media(max-width:1050px) {
  .marketplace-layout { grid-template-columns:1fr; }
  .hero-note { width:220px; font-size:18px; }
  .hero-highlights { left:10px; width:48%; font-size:11px; gap:12px 9px; bottom:18px; }
  .hero-highlights li { gap:6px; white-space:normal; }
  .hero-badge { bottom:20px; padding:10px 13px; }
  .hero-badge strong { font-size:11px; }
  .hero-badge small { font-size:9px; }
  .marketplace-main .search-panel { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media(max-width:650px) {
  .hero h1 { font-size:32px; }
  .hero-inner { height:660px; }
  .hero-highlights { top:290px; bottom:auto; left:8px; width:calc(100% - 16px); font-size:11px; gap:12px 9px; }
  .hero-note { top:375px; right:8px; width:210px; font-size:17px; line-height:1.65; }
  .hero-badge { bottom:10px; padding:10px 12px; }
  .hero-badge>[data-icon] { width:34px; height:34px; border-radius:10px; }
  .hero-badge .icon { font-size:22px; width:22px; height:22px; }
  .marketplace-main .search-panel { grid-template-columns:repeat(2,minmax(0,1fr)); padding:17px; gap:16px 12px; }
  .marketplace-main .switch-label { grid-column:1 / -1; }
  .marketplace-main .search-submit { grid-column:1 / -1; min-height:46px; }
  .marketplace-main .section-heading { gap:12px; }
  .car-photo { aspect-ratio:4 / 3; }
  .photo-arrow { opacity:1; width:32px; height:36px; }
  .photo-caption { font-size:11px; }
  .marketplace-main .car-body { padding:16px; }
  .marketplace-main .car-body h3 { font-size:22px; }
  .marketplace-main .car-meta,.marketplace-main .car-conditions { font-size:12px; }
  .marketplace-main .car-actions .button { min-height:44px; font-size:12px; }
  .fleet-copy strong { font-size:14px; }
}
@media(prefers-reduced-motion:reduce) { .photo-open img,.photo-arrow { transition:none; } }

.favorite-button .icon { width:22px; height:22px; font-size:20px; line-height:1; margin:0; }
.car-body h3 a:hover { color:inherit; }


.car-body { position:relative; }
.car-body h3 a::after { content:''; position:absolute; inset:0; z-index:1; border-radius:0 0 14px 14px; }
.car-body h3 a:focus-visible::after { outline:3px solid #215cf4; outline-offset:-3px; }
.car-body .car-actions { position:relative; z-index:2; }
.favorite-button { display:grid; align-items:center; justify-items:center; padding:0!important; line-height:1; }
.favorite-button .icon { display:grid; place-items:center; width:22px; height:22px; line-height:1; }
.favorite-button .icon::before,.favorite-button .icon::after { position:static; grid-area:1/1; margin:0; padding:0; line-height:1; }
#modal.catalog-photo-modal { width:min(980px,94vw); max-width:94vw; padding:18px; overflow:auto; }
.catalog-photo-modal #modal-title { font-size:20px; padding-right:40px; }
.catalog-photo-stage { position:relative; margin-top:16px; border-radius:12px; overflow:hidden; background:#16212c; }
.catalog-photo-stage img { width:100%; height:min(65vh,640px); object-fit:contain; }
.catalog-photo-stage button { position:absolute; top:50%; transform:translateY(-50%); width:42px; height:42px; border-radius:50%; background:white; color:#182330; display:grid; place-items:center; }
.catalog-prev { left:12px; }.catalog-next { right:12px; }
.catalog-prev .icon { transform:rotate(90deg); }.catalog-next .icon { transform:rotate(-90deg); }
.catalog-photo-bottom { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:14px; }
.catalog-photo-count { color:#657183; font-size:13px; }
.catalog-photo-modal #close-modal { color:#172330; background:#f0f2f5; border-radius:50%; }
@media(max-width:550px){#modal.catalog-photo-modal{padding:12px}.catalog-photo-modal #modal-title{font-size:17px}.catalog-photo-stage img{height:auto;max-height:65vh}.catalog-photo-bottom .button{font-size:11px}}

/* Photo and body hover feedback, without moving the card or recoloring its title. */
.car-card { transition:border-color .2s ease, box-shadow .2s ease; }
.car-body h3 a { color:inherit; }
.photo-open img { transform:scale(1); transform-origin:center; transition:transform .35s ease; }
@media(hover:hover) and (pointer:fine) {
  .photo-open:hover img { transform:scale(1.055); }
  .car-card:has(.car-body:hover) { border-color:#d6b84d; box-shadow:0 8px 24px #182c4014; }
}
.car-card:has(.car-body :focus-visible) { border-color:#d6b84d; box-shadow:0 8px 24px #182c4014; }
@media(prefers-reduced-motion:reduce) {
  .car-card,.photo-open img { transition:none; }
  .photo-open:hover img { transform:none; }
}
.photo-dots { min-width:0; overflow:hidden; }
.photo-dot { flex:0 0 17px; width:17px; }
/* Homepage brand identities and rental steps */
.brand-tile { min-height:142px; padding:20px 8px; gap:10px; transition:background .2s,border-color .2s,box-shadow .2s; }
.brand-tile img { width:72px; height:44px; object-fit:contain; display:block; margin-bottom:4px; }
.brand-tile strong,.brand-tile:nth-child(n) strong { font-size:13px; letter-spacing:0; }
.brand-tile:hover { box-shadow:0 6px 20px #182b4510; }
.steps-intro { margin:8px 0 0; color:#66758b; font-size:14px; }
#how-it-works .steps-grid { gap:16px; }
#how-it-works .steps-grid article { position:relative; display:block; padding:24px; border:1px solid #e2e7ee; border-radius:18px; background:linear-gradient(145deg,#fff,#fbfcfe); }
#how-it-works .step-icon { width:48px; height:48px; border-radius:14px; background:#fff2bd; color:#9d7900; margin-bottom:22px; }
#how-it-works .step-icon .icon { font-size:24px; width:28px; height:28px; }
#how-it-works .steps-grid b { position:absolute; right:22px; top:25px; font-size:25px; color:#d2d9e3; font-weight:700; }
#how-it-works .steps-grid h3 { font-size:16px; line-height:1.5; margin:0 0 9px; }
#how-it-works .steps-grid p { font-size:13px; line-height:1.8; margin:0; color:#637187; }
#how-it-works .steps-grid article:last-child .step-icon { color:#159666; background:#e2f5eb; }
@media(max-width:1000px) { #how-it-works .steps-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .brand-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:540px) { #how-it-works .section-heading { align-items:flex-start; gap:12px; } #how-it-works .section-heading .text-link { font-size:11px; white-space:nowrap; } #how-it-works .steps-grid { grid-template-columns:1fr; } #how-it-works .steps-grid article { padding:20px 20px 20px 86px; min-height:132px; } #how-it-works .step-icon { position:absolute; left:20px; top:22px; width:46px; height:46px; } #how-it-works .steps-grid b { position:static; display:block; font-size:12px; color:#9d7900; margin-bottom:5px; } .brand-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .brand-tile { min-height:138px; } }
@media(max-width:650px) {
 input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea { font-size:16px; }
 .gallery-arrow,.favorite-button { min-width:40px; min-height:40px; }
}

@media(min-width:1001px){.brand-grid{grid-template-columns:repeat(6,minmax(0,1fr));}}

#brand-grid{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:12px;padding:3px 2px 10px;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior-x:contain}
#brand-grid .brand-tile{flex:0 0 154px;min-height:138px}
.developer-credit img{width:24px;height:24px;object-fit:contain;display:block}
@media(max-width:540px){#brand-grid .brand-tile{flex-basis:142px}}

#brand-grid::-webkit-scrollbar{display:none;width:0;height:0}

#brand-grid .brand-tile .brand-count{display:inline-flex;align-items:center;justify-content:center;border-radius:20px;background:#fff3bf;color:#765a00;padding:3px 9px;font-size:11px;font-weight:700;line-height:1.4}

.tariff-filter{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;margin:0 0 22px;padding:3px 0}.tariff-filter::-webkit-scrollbar{display:none}.tariff-option{flex:1 0 108px;display:flex;flex-direction:column;align-items:center;gap:8px;padding:12px 7px;background:#fff;border:1px solid #e1e6ee;border-radius:14px;color:#10243b;text-decoration:none;font-size:12px}.tariff-option.selected{background:#fff8d8;border-color:#e4b400;box-shadow:inset 0 0 0 1px #e4b400}.tariff-option img,.tariff-choice img{object-fit:contain;width:100px;height:56px}.tariff-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.tariff-picker{border:0;padding:0;margin:12px 0}.tariff-picker p{font-size:12px;color:#738297}.tariff-choice{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:16px 8px;border:1px solid #dde4ee;border-radius:12px;cursor:pointer;font-size:12px}.tariff-choice input{position:absolute;top:9px;right:9px;width:18px;height:18px;accent-color:#bf9200}.tariff-choice:has(input:checked){background:#fff8d8;border-color:#d7a700}.tariff-tags{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.tariff-tags span{padding:7px 12px;border-radius:20px;background:#fff3bf;color:#735600}.listing-tariffs{margin:20px 0}.listing-tariffs small{color:#758296}@media(max-width:540px){.tariff-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.tariff-option{flex:0 0 108px}}

.benefits .benefit-illustration{display:block;width:96px;height:96px;object-fit:contain;margin:0 auto 12px}@media(max-width:540px){.benefits .benefit-illustration{width:80px;height:80px}}

/* Illustrated steps keep the text on a calm, opaque lower surface. */
#how-it-works .steps-grid article { min-height:260px; padding:24px; background-color:#fffaf0; background-image:linear-gradient(to bottom,transparent 20%,rgba(255,252,245,.88) 48%,#fffcf5 70%),var(--step-art); background-size:cover; background-position:center top; }
#how-it-works .steps-grid article:nth-child(1) { --step-art:url('../images/steps/search.webp'); }
#how-it-works .steps-grid article:nth-child(2) { --step-art:url('../images/steps/compare.webp'); }
#how-it-works .steps-grid article:nth-child(3) { --step-art:url('../images/steps/contact.webp'); }
#how-it-works .steps-grid article:nth-child(4) { --step-art:url('../images/steps/start.webp'); }
#how-it-works .steps-grid .step-icon { visibility:hidden; margin-bottom:48px; }
#how-it-works .steps-grid b { left:24px;right:auto;color:#896800; }
#how-it-works .steps-grid h3 { color:#10253e; }
#how-it-works .steps-grid p { color:#465870; }
@media(max-width:540px) { #how-it-works .steps-grid article { padding:118px 22px 22px;min-height:250px;background-size:cover; } #how-it-works .steps-grid b {position:absolute;top:24px;font-size:25px;} }
