/* Big R Auto — shared presentation system.
   main.css and admin.css retain structural and interaction rules.
   All current brand, theme and public composition rules live here. */
.brand-image { display: block; position: relative; width: 156px; height: 58px; overflow: visible; flex-shrink: 0; background: transparent; }
.brand-image img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: 100%; object-fit: contain; object-position: left center; }
.brand-image .brand-on-dark { display:none; }
.brand-image .brand-on-light { display:block; }
.dark-mode .brand-image .brand-on-dark,.navbar .brand-on-dark,.site-footer .brand-on-dark,.admin-sidebar .brand-on-dark,.garage-nav .brand-on-dark { display:block; }
.dark-mode .brand-image .brand-on-light,.navbar .brand-on-light,.site-footer .brand-on-light,.admin-sidebar .brand-on-light,.garage-nav .brand-on-light { display:none; }
.public-page:not(.dark-mode) .navbar.scrolled .brand-on-dark { display:none; }
.public-page:not(.dark-mode) .navbar.scrolled .brand-on-light { display:block; }
.public-page .navbar:not(.scrolled) .brand-image,.site-footer .brand-image,.admin-sidebar .brand-image { background: transparent; }
.navbar .nav-inner,.navbar .container { padding-block: 10px; }
.site-footer .brand-image { width: 190px; height: 72px; }
.site-footer .brand-image img { object-position: left center; }
.sidebar-header { flex-direction: column; align-items: flex-start; gap: 4px; }
.admin-brand { display: inline-block; }
.filters-open .cookie-banner { visibility: hidden; }
.hero-photograph.hero-frame { opacity: 0; }
.editorial-hero .hero-photograph { transition: opacity 1.6s ease; opacity: 0; }
.editorial-hero .hero-photograph:first-child,.editorial-hero .hero-photograph.is-active { opacity: 1; }
.editorial-hero:has(.hero-frame) .hero-photograph:not(.is-active) { opacity: 0; }
.hero-motion-control { position: absolute; bottom: 70px; right: 40px; min-height: 44px; padding: 10px 16px; color: #fff; background: #11111380; border: 1px solid #ffffff55; border-radius: 4px; font-size: 11px; cursor: pointer; z-index: 2; }
.vehicle-media { position: relative; width: 100%; height: 100%; aspect-ratio: 8 / 5; background: var(--bg-tertiary); overflow: hidden; }
.vehicle-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover !important; object-position: center; padding: 0; opacity: 0; transition: opacity .3s; }
.vehicle-media.is-loaded img { opacity: 1; }
.vehicle-image-fallback { display: flex; height: 100%; min-height: 180px; align-items: center; justify-content: center; flex-direction: column; gap: 18px; background: radial-gradient(ellipse at center,var(--bg-primary),var(--bg-tertiary)); color: var(--text-secondary); }
.vehicle-image-fallback svg { width: 58%; max-width: 280px; height: auto; fill: none; stroke: currentColor; stroke-width: 1.4; opacity: .5; }
.vehicle-image-fallback span { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.vehicle-media.is-loaded .vehicle-image-fallback { visibility: hidden; }
.vehicle-media.is-loading::after { content: 'Loading vehicle photo…'; position: absolute; inset: auto 0 20px; text-align: center; font-size: 12px; background: var(--bg-tertiary); color: var(--text-secondary); }
.vehicle-detail-link { display: block; height: 100%; }
.detail-visual:has(.vehicle-gallery) { display:block; padding:0; overflow:hidden; }
.vehicle-gallery,.vehicle-gallery-main { width:100%; height:100%; }
.vehicle-gallery-main { position:relative; min-height:360px; }
.vehicle-gallery-main .vehicle-media { min-height:360px; }
.gallery-control { position:absolute; top:50%; z-index:2; width:44px; height:44px; transform:translateY(-50%); border:1px solid #fff6; border-radius:50%; background:#111b; color:#fff; font-size:28px; cursor:pointer; }
.gallery-prev { left:14px; }.gallery-next { right:14px; }
.vehicle-thumbnails { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; padding:10px; background:var(--bg-primary); }
.vehicle-thumbnails button { padding:0; border:2px solid transparent; border-radius:5px; overflow:hidden; background:none; cursor:pointer; }
.vehicle-thumbnails button[aria-current="true"] { border-color:var(--red); }
.vehicle-thumbnails img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; }
.car-card-actions .btn,.car-actions-v2 .car-btn-primary { width: 100%; }
.prototype-note,.booking-estimate { border: 1px solid var(--border-color); border-radius: 6px; padding: 16px 20px; margin: 0 0 22px; font-size: 13px; line-height: 1.6; color: var(--text-secondary); background: var(--bg-secondary); }
.booking-estimate { color: var(--text-primary); }
.account-help { margin-block: 20px; font-size: 13px; line-height: 1.7; }
.account-help summary { cursor: pointer; padding-block: 8px; }
.account-help a,.prototype-note a { text-decoration: underline; }
.editorial-break { margin-block: 48px; }
.editorial-break img { width: 100%; aspect-ratio: 2.6; object-fit: cover; display: block; }
.editorial-break figcaption { padding-top: 12px; font-size: 12px; color: var(--text-secondary); }
@media (max-width:600px) { .navbar .brand-image { width: 132px; height: 48px; } .hero-motion-control { bottom: 55px; right: 22px; } .editorial-break img { aspect-ratio: 1.4; } }
@media (prefers-reduced-motion: reduce) { .editorial-hero .hero-photograph { transition: none; } }
:root {
  --red: #ad202a; --red-dark: #901b23; --red-light: #ad202a;
  --blue: #45647b; --blue-mid: #45647b; --blue-light: #edf2f5; --blue-pale: #edf2f5;
  --black: #111113; --charcoal: #202023; --white: #fff;
  --bg-primary: #fff; --bg-secondary: #f6f5f2; --bg-tertiary: #eeedea;
  --text-primary: #202023; --text-secondary: #646469; --text-tertiary: #717177;
  --border-color: #dededc; --border: var(--border-color); --border-light: #eaeae7;
  --off-white: var(--bg-secondary); --grey-bg: var(--bg-secondary);
  --grey-dark: var(--text-primary); --grey-mid: var(--text-secondary); --grey-light: var(--text-tertiary);
  --color-surface: var(--bg-primary); --color-bg: var(--bg-secondary); --color-text: var(--text-primary);
  --color-muted: var(--text-secondary); --color-border: var(--border-color);
  --color-red: var(--red); --color-blue: var(--blue); --color-dark: var(--black);
  --surface-inverse: #111113; --text-inverse: #f9f9f7; --muted-inverse: #b8b8bd;
  --success: #365e45; --success-light: #eff5f0; --warning: #775e31; --warning-light: #f7f2e7;
  --error: #96303a; --error-light: #fcf0f1;
  --radius-sm: 4px; --radius: 6px; --radius-md: 8px; --radius-lg: 10px; --radius-xl: 12px;
  --shadow-sm: 0 2px 8px #11111305; --shadow-md: 0 8px 24px #1111130a;
  --shadow-lg: 0 16px 48px #11111314; --shadow-xl: 0 24px 60px #11111320;
  --shadow-red: none; --shadow-blue: none; --shadow-soft: var(--shadow-sm); --shadow-card: var(--shadow-md);
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-display: var(--font-sans); --max-width: 1240px; --sidebar-bg: #111113;
}
html.dark-mode, body.dark-mode {
  color-scheme: dark;
  --bg-primary: #1b1b1e; --bg-secondary: #131315; --bg-tertiary: #27272b;
  --text-primary: #f1f0ed; --text-secondary: #b2b2b8; --text-tertiary: #a0a0a6;
  --border-color: #343439; --border-light: #29292e;
  --blue: #a1bbcb; --blue-light: #242e35; --blue-pale: #242e35;
  --success: #a9c2b0; --success-light: #233229; --warning: #cfbd97; --warning-light: #342e22;
  --error: #e5afb5; --error-light: #3a2429;
  --shadow-sm: none; --shadow-md: 0 8px 24px #0002;
}
html { scroll-padding-top: 100px; }
body, body.dark-mode { background: var(--bg-primary); color: var(--text-primary); font-family: var(--font-sans); }
h1,h2,h3,h4,h5 { font-family: var(--font-sans); font-weight: 500; letter-spacing: -.035em; color: var(--text-primary); line-height: 1.15; }
button,input,select,textarea { font-family: inherit; }
a,button,input,select,textarea,[tabindex] { -webkit-tap-highlight-color: transparent; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 5px; }
.skip-link { position:fixed; top:10px; left:10px; z-index:5000; padding:12px 16px; background:#fff; color:#111; transform:translateY(-150%); }
.skip-link:focus { transform:none; }
[hidden] { display: none !important; }
.container,.section-inner { width: 100%; max-width: 1240px; margin-inline: auto; padding-inline: 40px; }
.section-pad,.section-wrapper { padding-block: 96px; }
.section-title,.section-heading { font-size: clamp(30px,3.4vw,46px); margin-bottom: 20px; font-weight: 500; letter-spacing: -.04em; line-height: 1.15; }
.section-heading.dark,.section-heading.light { color: var(--text-primary); }
.section-desc,.section-body,.muted-copy { color: var(--text-secondary); font-size: 15px; line-height: 1.85; }
.section-label,.section-eyebrow { color: var(--text-secondary); font-size: 10px; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 20px; }
.section-eyebrow::before { display: none; }
.btn,.nav-btn-book,.nav-btn-account,.btn-hero-primary,.btn-hero-secondary,.car-btn-primary,.car-btn-secondary,.btn-search-submit {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 46px; padding: 12px 22px; border: 1px solid transparent; border-radius: 4px;
  font-size: 12px; font-weight: 600; line-height: 1.3; letter-spacing: .015em;
  text-decoration: none; box-shadow: none; transition: background .2s, border-color .2s, color .2s;
}
.btn:hover,.car-card:hover { transform: none; }
.btn svg { width: 17px; height: 17px; }
.btn-red,.nav-btn-book,.btn-hero-primary,.car-btn-primary,.btn-search-submit { background: var(--red); color: #fff; }
.btn-red:hover,.nav-btn-book:hover,.btn-hero-primary:hover,.car-btn-primary:hover { background: var(--red-dark); box-shadow: none; }
.btn-blue,.btn-dark { background: var(--text-primary); color: var(--bg-primary); }
.btn-outline,.btn-outline-red,.btn-ghost,.car-btn-secondary { background: transparent; color: var(--text-primary); border-color: var(--border-color); }
.btn-outline:hover,.btn-outline-red:hover,.btn-ghost:hover,.car-btn-secondary:hover { background: var(--bg-tertiary); color: var(--text-primary); border-color: var(--text-tertiary); }
.btn:disabled,button:disabled { opacity: .48; cursor: not-allowed; transform: none; }
.btn-sm { min-height: 38px; padding: 9px 15px; }
.btn-lg { padding: 15px 26px; }
/* One continuous navbar, never a floating rounded panel. */
.navbar,.navbar.scrolled,body.dark-mode .navbar { position: fixed; inset: 0 0 auto; width: 100%; border: 0; border-radius: 0; box-shadow: none; background: #111113; z-index: 1000; transition: background .24s, border-color .24s; }
.public-page .navbar:not(.scrolled) { background: transparent; }
.public-page .navbar.scrolled { background: var(--bg-primary); border-bottom: 1px solid var(--border-color); }
.nav-inner,.navbar .container { max-width: 1440px; min-height: 88px; margin: auto; padding: 16px 40px; display: flex; align-items: center; gap: 28px; justify-content: space-between; }
.nav-logo { display: inline-flex; align-items: center; gap: 10px; flex-shrink: 0; }
.nav-logo-mark { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid currentColor; border-radius: 0; background: transparent; color: #fff; font: 600 15px var(--font-sans); box-shadow: none; }
.nav-logo-text { font: 600 14px var(--font-sans); letter-spacing: .1em; color: #fff; }
.nav-logo-text span { color: inherit; font-weight: 400; }
.nav-links { display: flex; gap: 30px; margin: 0 auto; }
.nav-links a { padding: 10px 0; color: #e6e6e8; font-size: 12px; font-weight: 400; border-radius: 0; background: none; }
.nav-links a.active,.nav-links a:hover { color: #fff; background: none; box-shadow: none; }
.nav-links a.active { font-weight: 600; border-bottom: 1px solid currentColor; }
.nav-actions { display: flex; align-items: center; gap: 16px; }
.nav-actions .btn-outline,.nav-btn-account { border: 0; color: #fff; background: none; padding-inline: 0; font-size: 12px; }
.nav-theme-toggle,.nav-icon-btn { display: grid; place-items: center; width: 36px; height: 36px; border: 0; background: none; color: #fff; cursor: pointer; }
.nav-theme-toggle svg,.nav-icon-btn svg { width: 18px; height: 18px; stroke-width: 1.6; }
.auth-shell { min-height:100svh; padding-bottom:72px; position:relative; isolation:isolate; background:#111 url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=1600&q=82') 42% center/cover no-repeat; }
.auth-shell::before { content:''; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#08090bf2 0%,#08090bc9 48%,#08090b99 100%); }
.auth-card { backdrop-filter:blur(12px); }
.auth-text-action { margin-top:14px; padding:0; border:0; background:none; color:var(--text-primary); text-decoration:underline; text-underline-offset:4px; cursor:pointer; }
.review-dialog { position:fixed; inset:0; z-index:2000; width:min(620px,calc(100% - 32px)); max-width:none; max-height:min(90vh,760px); margin:auto; padding:0; overflow:auto; border:1px solid var(--border-color); border-radius:var(--radius-md); background:var(--bg-primary); color:var(--text-primary); box-shadow:var(--shadow-lg); }
.review-dialog::backdrop { background:rgba(4,5,7,.78); backdrop-filter:blur(5px); }
body.review-modal-open { overflow:hidden; }
.review-dialog textarea { min-height:140px; resize:vertical; }.review-dialog .form-label { display:grid; gap:8px; margin:0; }
.review-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.review-rating { margin:18px 0; padding:0; border:0; }.review-rating legend { margin-bottom:8px; font-size:12px; font-weight:600; }
.testimonial-date { display:block; margin-top:6px; color:var(--text-secondary); font-size:11px; }
.star-rating { display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:5px; width:max-content; }
.star-rating input { position:absolute; opacity:0; pointer-events:none; }.star-rating label { color:var(--border-color); font-size:30px; line-height:1; cursor:pointer; transition:color .15s ease,transform .15s ease; }
.star-rating label:hover,.star-rating label:hover~label,.star-rating input:checked~label { color:#e6ad24; }.star-rating label:hover { transform:translateY(-1px); }.star-rating input:focus-visible+label { outline:2px solid var(--red); outline-offset:3px; }
@media(max-width:560px){.review-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 20px)}.review-form-grid{grid-template-columns:1fr}.review-dialog .modal-header,.review-dialog .modal-footer{padding-left:20px;padding-right:20px}.review-dialog .modal-body{padding-left:20px;padding-right:20px}}
@media(max-width:760px){.auth-shell{background-image:url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=900&q=78');background-position:55% center;background-attachment:scroll}.auth-card{padding:24px}.auth-panel h1{font-size:clamp(38px,12vw,54px)}}
.auth-card a[style*="var(--red)"] { color: var(--text-primary) !important; text-decoration: underline; text-underline-offset: 4px; }
.faq-search-wrapper { max-width: 680px; margin: 0 auto 32px; position: relative; }
.faq-search-input { width: 100%; padding: 14px 16px 14px 44px; }
.faq-search-icon { position: absolute; left: 14px; top: 50%; transform: translateY(-50%); color: var(--text-secondary); }
.cars-toolbar { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 24px; }
.sort-select { padding: 10px; }
.public-page .navbar.scrolled :is(.nav-logo-mark,.nav-logo-text,.nav-links a,.nav-actions .btn-outline,.nav-btn-account,.nav-theme-toggle,.nav-icon-btn) { color: var(--text-primary); }
.nav-hamburger { background: transparent; width: 40px; height: 40px; }
.nav-hamburger span { background: #fff; }
.public-page .navbar.scrolled .nav-hamburger span { background: var(--text-primary); }
.mobile-nav { display: none; }
/* Full-bleed editorial photography. Photos are atmosphere, not fleet inventory. */
.editorial-hero { position: relative; isolation: isolate; overflow: hidden; min-height: 600px; height: 74svh; max-height: 820px; display: flex; align-items: center; background: #242427; color: #fff; }
.editorial-hero-home { min-height: 720px; height: 94svh; max-height: 1080px; }
.hero-photograph { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center 58%; }
.hero-photograph { filter: saturate(.65); }
.editorial-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg,#08090bbd 0%,#08090b63 50%,#08090b20 100%),linear-gradient(180deg,#08090b88 0%,transparent 35%,#08090b55 100%); }
.hero-editorial-content { padding-block: 124px 80px; }
.hero-kicker { color: #dedee1; font-size: 10px; letter-spacing: .24em; margin-bottom: 26px; }
.editorial-hero h1 { color: #fff; font-size: clamp(46px,5.8vw,82px); font-weight: 400; letter-spacing: -.055em; line-height: 1.06; max-width: 740px; margin: 0 0 28px; }
.hero-editorial-copy { color: #e0e0e3; font-size: 15px; line-height: 1.8; max-width: 380px; }
.hero-editorial-actions { display: flex; align-items: center; gap: 30px; margin-top: 36px; }
.hero-text-link { color: #fff; display: inline-flex; align-items: center; gap: 12px; font-size: 12px; border-bottom: 1px solid #ffffff55; padding-block: 10px; }
.hero-text-link svg { width: 15px; height: 15px; }
.hero-caption { position: absolute; bottom: 28px; left: 50%; transform: translateX(-50%); display: flex; justify-content: space-between; font-size: 9px; letter-spacing: .16em; color: #ffffffbd; }
/* Fleet: image, name, facts, then two clear actions. */
.fleet-header { display: flex; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 40px; }
.fleet-header .section-body { max-width: 580px; }
.fleet-link { display: inline-flex; align-items: center; gap: 14px; flex-shrink: 0; color: var(--text-primary); font-size: 12px; border-bottom: 1px solid var(--border-color); padding-bottom: 8px; }
.cars-grid-v2,.cars-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; }
.cars-main .cars-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.car-card,.car-card-v2,body.dark-mode .car-card,body.dark-mode .car-card-v2 { background: var(--bg-primary); border: 0; border-radius: 0; box-shadow: none; overflow: visible; min-width: 0; display: flex; flex-direction: column; }
.car-img-wrap,.fleet-card-image,.car-card-img-placeholder { position: relative; height: auto; aspect-ratio: 16/10; overflow: hidden; background: var(--bg-tertiary); border-radius: 5px; }
.car-img-wrap img,.fleet-card-image img { width: 100%; height: 100%; object-fit: cover; }

.car-body-v2,.car-card-body { padding: 22px 0 0; display: flex; flex-direction: column; flex: 1; }
.car-name-v2,.car-card-name { color: var(--text-primary); font-family: inherit; font-size: 20px; font-weight: 500; letter-spacing: -.025em; line-height: 1.3; margin-bottom: 12px; }
.car-specs-v2,.car-card-spec { display: flex; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 14px; }
.car-spec-chip,.car-card-spec-item { font-size: 11px; color: var(--text-secondary); background: none; padding: 0; border-radius: 0; }
.car-desc-v2,.card-copy { font-size: 12px; line-height: 1.75; color: var(--text-secondary); margin-bottom: 22px; }
.car-footer-v2 { margin-top: auto; display: grid; gap: 20px; }
.car-price-v2,.car-card-price { color: var(--text-primary); display: flex; gap: 5px; align-items: baseline; border-top: 1px solid var(--border-color); padding-top: 18px; margin-top: auto; margin-bottom: 0; }
.car-price-v2 strong,.car-price-amount { color: inherit; font: 500 22px var(--font-sans); letter-spacing: -.03em; }
.car-price-v2 span,.car-price-unit { font-size: 11px; color: var(--text-secondary); }
.car-actions-v2,.car-card-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.car-card-actions { margin-top: 20px; }
.car-card-actions .btn { padding: 12px; }
.home-showcase-card .vehicle-detail-category { margin: 0 0 8px; }
.home-showcase-card .card-copy { margin-bottom: 0; }
.cars-main .car-card-body { padding-top: 18px; }
.cars-main .car-card-name { font-size: 22px; margin-bottom: 10px; }
.cars-main .car-card-spec { padding-bottom: 16px; border-bottom: 1px solid var(--border-color); }
.cars-main .car-card-price { border-top: 0; padding-top: 4px; }
.cars-main .empty-state { grid-column: 1 / -1; width: 100%; min-height: 320px; align-content: center; justify-items: center; text-align: center; padding: clamp(36px,7vw,72px); }
.cars-main .empty-state svg { width: 34px; height: 34px; color: var(--text-secondary); }
.cars-main .empty-state p { max-width: 480px; }
.car-badge-v2,.car-badge { position: absolute; top: 14px; left: 14px; padding: 5px 9px; border-radius: 3px; font-size: 9px; font-weight: 500; background: #fff; color: #28282a; }
.car-badge.available,.car-badge-v2.available { background: #f5f5f3; color: #323236; }
.car-badge.booked,.car-badge-v2.booked { background: #333337; color: #fff; }
.car-badge.featured,.car-badge-v2.tag { display: none; }
/* Editorial sections: quiet dividers rather than nested cards. */
.section-wrapper.bg-light,.section-wrapper.bg-surface,.section-wrapper.bg-surface-2,body.dark-mode .section-wrapper.bg-light { background: var(--bg-primary); }
.section-wrapper.bg-dark { background: var(--bg-secondary); }
.why-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 36px; margin-top: 48px; }
.why-card { padding-top: 26px; border-top: 1px solid var(--border-color); }
.why-icon { margin-bottom: 24px; color: var(--text-secondary); }
.why-card-title,.step-title { color: var(--text-primary); font-size: 15px; font-weight: 500; margin-bottom: 12px; }
.why-card-desc,.step-desc { color: var(--text-secondary); font-size: 12px; line-height: 1.85; }
.steps-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 100px; margin-top: 56px; align-items: center; }
.steps-list { display: grid; gap: 0; }
.step-item { display: flex; gap: 26px; padding: 23px 0; border-bottom: 1px solid var(--border-color); background: none; }
.step-num { font-size: 13px; font-weight: 400; color: var(--text-tertiary); padding-top: 1px; }
.steps-visual { position: relative; height: 540px; }
.steps-visual img { width: 100%; height: 100%; object-fit: cover; border-radius: 5px; }
.editorial-image-caption { position: absolute; bottom: 26px; left: 26px; color: #fff; font-size: 14px; text-shadow: 0 2px 8px #000; }
.testimonials-grid-v2 { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px; margin-top: 40px; }
.testimonial-v2 { padding-top: 24px; border-top: 1px solid var(--border-color); }
.t-stars-v2 { display: flex; gap: 4px; color: var(--text-secondary); }
.t-stars-v2 span::before { content: "★"; font-size: 12px; }
.t-text-v2 { font-size: 14px; line-height: 1.85; color: var(--text-primary); margin: 22px 0; }
.t-author-v2 { display: flex; align-items: center; gap: 12px; }
.t-avatar-v2 { width: 36px; height: 36px; border-radius: 50%; background: var(--bg-tertiary); display: grid; place-items: center; font-size: 11px; }
.t-name-v2 { color: var(--text-primary); font-size: 12px; font-weight: 600; }
.t-role-v2 { color: var(--text-secondary); font-size: 10px; }
.faq-wrap { max-width: 800px; margin: 42px auto 0; }
.faq-question-v2 { width: 100%; padding: 24px 0; display: flex; justify-content: space-between; align-items: center; gap: 24px; text-align: left; font-size: 15px; font-weight: 500; color: var(--text-primary); background: none; }
.faq-answer-v2 { display: none; padding-bottom: 24px; font-size: 13px; line-height: 1.85; color: var(--text-secondary); }
.faq-answer-v2.open { display: block; }
.faq-question-v2.open .faq-icon { transform: rotate(180deg); }
.testimonial-card-v2 { border-top: 1px solid var(--border-color); padding-top: 26px; }
.testimonial-stars,.testimonial-stars-v2 { color: var(--text-secondary); font-size: 13px; letter-spacing: 3px; }
.testimonial-quote,.testimonial-text-v2 { font-size: 15px; line-height: 1.8; color: var(--text-primary); margin-block: 20px; }
.testimonial-author-v2 { display: flex; gap: 12px; align-items: center; }
.testimonial-avatar-v2 { width: 36px; height: 36px; border-radius: 50%; background: var(--bg-tertiary); display: grid; place-items: center; font-size: 12px; }
.testimonial-name-v2 { font-size: 12px; font-weight: 600; } .testimonial-role-v2 { font-size: 11px; color: var(--text-secondary); }
.faq-list-v2 { max-width: 800px; margin: 40px auto 0; }
.faq-item,.faq-item-v2 { border: 0; border-bottom: 1px solid var(--border-color); border-radius: 0; box-shadow: none; background: var(--bg-primary); margin: 0; }
.faq-question { color: var(--text-primary); padding: 24px 0; background: none; font-size: 15px; font-weight: 500; }
.faq-answer { color: var(--text-secondary); font-size: 14px; }
.cta-section { background: var(--surface-inverse); color: #fff; padding: 100px 40px; text-align: center; }
.cta-inner { max-width: 800px; margin: auto; }
.cta-badge { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted-inverse); margin-bottom: 24px; }
.cta-badge svg { display: none; }
.cta-heading { color: #fff; font-size: clamp(36px,5vw,62px); font-weight: 400; }
.cta-sub { max-width: 440px; margin: 24px auto 30px; color: var(--muted-inverse); font-size: 14px; }
.cta-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 16px; }
.btn-hero-secondary { border-color: #ffffff55; color: #fff; background: transparent; }
.btn.is-processing { cursor:wait; opacity:.78; }
.btn.is-processing::before { content:''; display:inline-block; width:14px; height:14px; margin-right:8px; vertical-align:-2px; border:2px solid currentColor; border-right-color:transparent; border-radius:50%; animation:button-spin .65s linear infinite; }
@keyframes button-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce){.btn.is-processing::before{animation-duration:1.4s}}
button:disabled,.btn[aria-disabled="true"] { cursor:not-allowed; opacity:.62; }
.inline-loader { display:inline-block; width:18px; height:18px; margin-right:9px; vertical-align:-4px; border:2px solid var(--border-color); border-top-color:var(--red); border-radius:50%; animation:button-spin .7s linear infinite; }
.data-loading-state,.admin-loading-state { min-height:96px; display:flex; align-items:center; justify-content:center; color:var(--text-secondary); }
#carDetailPage[aria-busy="true"] { min-height:420px; opacity:.45; pointer-events:none; }
.public-page :is(.content-panel,.metric-card,.feature-strip-item,.value-card,.process-step) { background: transparent; border: 0; border-radius: 0; box-shadow: none; padding: 0; }
.vehicle-detail-panel { padding: clamp(8px,2vw,28px); }
.vehicle-detail-category { margin: 28px 0 8px; color: var(--text-secondary); font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.vehicle-detail-panel .section-title { margin-bottom: 14px; font-size: clamp(34px,4vw,54px); line-height: 1.02; }
.vehicle-availability { width: fit-content; margin-top: 20px; font-size: 12px; font-weight: 600; }
.vehicle-availability::before { content: ''; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: currentColor; }
.vehicle-availability.is-available { color: var(--success); }
.vehicle-availability.is-unavailable { color: var(--text-secondary); }
.vehicle-core-specs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin: 28px 0; border-block: 1px solid var(--border-color); }
.vehicle-core-specs div { padding: 18px 12px 18px 0; }
.vehicle-core-specs dt,.vehicle-rate span { color: var(--text-secondary); font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.vehicle-core-specs dd { margin-top: 6px; color: var(--text-primary); font-size: 15px; font-weight: 600; }
.vehicle-rate { display: grid; gap: 4px; margin-bottom: 26px; }
.vehicle-rate strong { color: var(--text-primary); font-size: clamp(28px,3vw,40px); font-weight: 500; letter-spacing: -.04em; }
.vehicle-rate small { color: var(--text-secondary); }
.vehicle-features { grid-template-columns: repeat(2,minmax(0,1fr)); }
.vehicle-detail-actions { align-items: center; margin-top: 28px; }
@media (max-width:560px) { .vehicle-core-specs,.vehicle-features { grid-template-columns: 1fr; } }
.public-page section[style*="var(--black)"] .btn-outline { color: #fff; border-color: #ffffff55; }
.public-page section[style*="var(--black)"] .btn-blue { background: #fff; color: #202023; }
.public-page section[style*="var(--black)"] .btn-outline:hover { background: #ffffff14; }
.public-page :is(.metric-card,.feature-strip-item,.value-card,.process-step) { border-top: 1px solid var(--border-color); padding-top: 26px; }
.public-page :is(.metric-card,.feature-strip-item,.value-card) p { color: var(--text-secondary); font-size: 14px; line-height: 1.85; }
.public-page :is(.metric-title,.feature-strip-title,.value-card h4,.process-step h4) { font-size: 19px; font-weight: 500; margin-bottom: 16px; color: var(--text-primary); }
.public-page :is(.metric-title,.feature-strip-item,.value-card,.contact-info-label) svg { color: var(--text-secondary) !important; width: 24px !important; height: 24px !important; }
.features-strip-grid { gap: 40px; }
.feature-strip-desc { color: var(--text-secondary); font-size: 14px; }
.story-grid { grid-template-columns: 1.2fr 1fr; gap: 100px; }
.metrics-grid { grid-template-columns: 1fr; gap: 28px; }
.contact-grid { grid-template-columns: .8fr 1.2fr; gap: 100px; }
.contact-info-item { margin-bottom: 28px; padding-bottom: 22px; border-bottom: 1px solid var(--border-color); }
.contact-info-value { font-size: 17px; color: var(--text-primary); }
.contact-location { border-top: 1px solid var(--border-color); margin-top: 60px; padding-top: 32px; }
.contact-location h2 { font-size: 30px; margin-bottom: 16px; }
.contact-location p { color: var(--text-secondary); }
/* Shared footer: one layout and link hierarchy on every page. */
.site-footer { color: var(--muted-inverse); background: var(--surface-inverse); padding-top: 80px; border-top: 1px solid #ffffff1c; }
.site-footer-top { display: grid; grid-template-columns: 2fr 1fr 1.2fr 1.2fr; gap: 52px; padding-bottom: 64px; }
.footer-wordmark { display: inline-flex; gap: 9px; align-items: baseline; color: #fff; font-size: 25px; font-weight: 600; letter-spacing: -.03em; }
.footer-wordmark span { font-size: 12px; font-weight: 400; letter-spacing: .2em; }
.site-footer-brand p { font-size: 12px; line-height: 1.9; margin: 20px 0; }
.footer-contact-link { display: inline-flex; align-items: center; gap: 16px; color: #fff; font-size: 12px; }
.footer-contact-link svg { width: 15px; height: 15px; }
.site-footer nav h2 { font-size: 10px; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; color: #fff; margin: 5px 0 24px; }
.site-footer nav a { display: block; width: fit-content; font-size: 12px; line-height: 1.6; margin-top: 14px; color: #b8b8bd; }
.site-footer a:hover { color: #fff; text-decoration: underline; text-underline-offset: 5px; }
.site-footer-bottom { display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid #ffffff1c; padding-block: 24px; font-size: 10px; color: #99999f; }
.site-footer-bottom span:last-child { letter-spacing: .12em; }
/* App surfaces and both themes. Inverse text is never a mutable surface token. */
.form-card,.auth-card,.dashboard-card,.legal-card,.table-card,.status-panel,.info-card,.policy-card,.modal { background: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-color); box-shadow: var(--shadow-sm); border-radius: var(--radius-md); }
.form-card { padding: 32px; }
.form-control,.filter-select,.sort-select,input:not([type=checkbox]):not([type=radio]),select,textarea { background: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-color); border-radius: 4px; min-width: 0; }
.form-label { color: var(--text-primary); font-size: 12px; }
.form-control:focus,input:focus,select:focus,textarea:focus { border-color: var(--red); box-shadow: 0 0 0 3px #ad202a12; outline-color: var(--red); }
.form-control::placeholder,input::placeholder,textarea::placeholder { color: var(--text-tertiary); }
.pill.success,.badge-approved,.badge-confirmed,.badge-available,.badge-active,.alert-success { color: var(--success); background: var(--success-light); }
.pill.warning,.badge-pending,.badge-awaiting { color: var(--warning); background: var(--warning-light); }
.pill.info,.badge-info,.badge-completed { color: var(--blue); background: var(--blue-light); }
.alert-error,.badge-rejected,.badge-suspended { color: var(--error); background: var(--error-light); }
.booking-step { background: var(--bg-secondary); color: var(--text-secondary); }
.booking-step.active,.payment-option.selected { background: var(--bg-primary); border-color: var(--red); color: var(--text-primary); box-shadow: inset 0 -2px var(--red); }
.booking-step.done,.file-upload-zone.uploaded { background: var(--success-light); color: var(--success); }
.file-upload-zone.upload-error { background: var(--error-light); border-color: var(--error); }
.terms-summary-icon { background: var(--bg-secondary); color: var(--text-secondary); }
.page-hero,.about-hero { background: var(--surface-inverse); }
.auth-panel :is(h1,p),.page-hero :is(h1,p) { color: #fff; }
.modal-overlay,.admin-modal-overlay { background: #08080bb3; backdrop-filter: blur(5px); }
.modal-close { color: var(--text-primary); background: var(--bg-secondary); }
.password-input-wrap { position: relative; }
.password-input-wrap input { padding-right: 48px; }
.password-toggle { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; display: grid; place-items: center; color: var(--text-secondary); background: none; }
.password-toggle svg { width: 18px; height: 18px; }
.empty-state { display: grid; gap: 12px; justify-items: start; padding: 24px; background: var(--bg-secondary); border-radius: 6px; }
.empty-state p { color: var(--text-secondary); }
.text-link { color: var(--text-primary); text-decoration: underline; text-underline-offset: 4px; font-size: 13px; display: inline-block; margin-top: 12px; }
.confirmation-summary { display: grid; gap: 18px; margin-top: 32px; }
.confirmation-summary > div { display: grid; gap: 5px; } .confirmation-summary span { color: var(--text-secondary); font-size: 12px; }
.toast { background: var(--surface-inverse); color: #fff; border-radius: 6px; }
.floating-whatsapp { position: fixed; right: 22px; bottom: 22px; width: 46px; height: 46px; display: grid; place-items: center; background: var(--surface-inverse); color: #fff; border: 1px solid #ffffff3d; border-radius: 50%; z-index: 300; box-shadow: var(--shadow-md); }
.floating-whatsapp span { display: none; }
.back-to-top { position: fixed; right: 22px; bottom: 80px; width: 40px; height: 40px; border: 1px solid var(--border-color); background: var(--bg-primary); color: var(--text-primary); border-radius: 50%; display: none; place-items: center; z-index: 299; }
.back-to-top.visible { display: grid; }
.cookie-banner { z-index: 1500; background: var(--bg-primary); color: var(--text-primary); border: 1px solid var(--border-color); box-shadow: var(--shadow-xl); }
.cookie-banner p { color: var(--text-secondary); }
.reveal,.reveal-ready,.fade-in,.slide-up { opacity: 1; transform: none; animation: none; }
.filters-mobile-trigger,.filters-mobile-header,.mobile-booking-bar { display: none; }
.cars-layout { grid-template-columns: 240px minmax(0,1fr); gap: 48px; }
.cars-sidebar { border-radius: 6px; background: var(--bg-secondary); box-shadow: none; padding: 24px; top: 112px; }
.filter-search { background: var(--bg-primary); width: 100%; }
.filter-search input { width: 100%; border: 0 !important; }
.cars-main { min-width: 0; }
.filter-btn { color: var(--text-secondary); background: var(--bg-primary); }
.filter-btn.active { color: var(--text-primary); border-color: var(--text-primary); background: var(--bg-primary); }
.admin-sidebar { background: var(--sidebar-bg); }
.sidebar-logo-mark { background: var(--red); color: #fff; }
.sidebar-logo-text,.sidebar-user-name,.sidebar-link.active { color: #fff; }
.sidebar-link { color: #b8b8bd; display: flex; align-items: center; gap: 12px; }
.sidebar-link svg { width: 17px; height: 17px; }
.sidebar-section-label,.sidebar-logo-sub,.sidebar-user-role { color: #a3a3a9; }
.sidebar-link.active { background: #ffffff0b; border-left: 2px solid var(--red); }
.admin-topbar,.admin-card,.stat-card,.mini-card,.settings-card,.verification-card,.admin-login-card,.admin-modal,.chart-placeholder { background: var(--bg-primary); color: var(--text-primary); border-color: var(--border-color); border-radius: 6px; box-shadow: var(--shadow-sm); }
.admin-main { min-width: 0; background: var(--bg-secondary); }
.admin-content,.admin-card,.admin-grid,.split-grid,.split-grid > * { min-width: 0; }
.split-grid { grid-template-columns: minmax(0,1.2fr) minmax(0,.8fr); }
.admin-grid,.verification-grid,.settings-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%,260px),1fr)); }
.admin-table-wrap { width: 100%; max-width: 100%; overflow-x: auto; }
.admin-table { min-width: 440px; }
.topbar-title,.admin-card-title,.stat-card-num { font-weight: 500; letter-spacing: -.03em; }
.mini-card p,.verification-card p,.settings-card p { line-height: 1.7; font-size: 13px; }
.topbar-actions { min-width: 0; }
.admin-topbar { border-radius: 0; }
.topbar-user-name,.stat-card-num { color: var(--text-primary); }
.stat-card-icon,.stat-icon-blue,.stat-icon-red,.stat-icon-green,.stat-icon-amber,.topbar-user-avatar,.sidebar-user-avatar { background: var(--bg-tertiary); color: var(--text-primary); }
.stat-card-change,.stat-card-change.down { color: var(--text-secondary); }
.admin-table th,.admin-table tbody tr:hover { background: var(--bg-secondary); color: var(--text-secondary); }
.admin-table td { color: var(--text-primary); }
.admin-theme-toggle,.topbar-icon-btn,.table-action-btn,.topbar-menu-btn { background: var(--bg-secondary); color: var(--text-primary); border: 1px solid var(--border-color); padding: 8px; border-radius: 4px; }
.chart-bars span,.progress-bar span { background: var(--red); }
.admin-login-shell { background: var(--surface-inverse); }
.not-found-shell { min-height: 100svh; background: var(--surface-inverse); color: #fff; padding: 48px; }
.not-found-content { padding-top: 100px; max-width: 680px; }
.not-found-content h1 { color: #fff; font-size: clamp(40px,6vw,80px); margin-bottom: 24px; }
.not-found-content p { margin-bottom: 32px; }
@media (max-width:1100px) {
  .nav-links { display: none; } .nav-hamburger { display: flex; margin-left: 0; }
  .nav-actions { margin-left: auto; } .nav-actions a { display: none; }
  .nav-actions [data-session-logout] { display:none; }
  body.mobile-menu-open,body.filters-open { overflow: hidden; }
  .mobile-nav { position: fixed; inset: 88px 0 0; z-index: 999; padding: 24px 32px; flex-direction: column; background: var(--surface-inverse); overflow-y: auto; }
  .mobile-nav.open { display: flex; }
  .mobile-nav a,.mobile-nav button { padding: 15px 0; font-size: 20px; color: #fff; text-align: left; background: none; border: 0; }
  .mobile-nav [data-auth] { font-size: 14px; border-top: 1px solid #ffffff22; margin-top: 14px; }
  .story-grid,.contact-grid { gap: 48px; } .steps-layout { gap: 48px; }
  .site-footer-top { gap: 32px; }
}
@media (max-width:1024px) {
  .split-grid { grid-template-columns: minmax(0,1fr); }
}
@media (max-width:900px) {
  .container,.section-inner { padding-inline: 28px; }
  .cars-grid-v2 { gap: 20px; }
  .why-grid { grid-template-columns: repeat(2,1fr); }
  .story-grid,.contact-grid { grid-template-columns: 1fr; }
  .cars-layout { grid-template-columns: 1fr; }
  .filters-mobile-trigger { display: inline-flex; margin-bottom: 24px; }
  .filters-mobile-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; }
  .filters-mobile-header button { background: var(--bg-primary); color: var(--text-primary); padding: 10px; }
  .cars-sidebar { position: fixed; inset: 0 0 0 auto; width: min(390px,100%); z-index: 1200; overflow-y: auto; visibility: hidden; transform: translateX(100%); transition: transform .2s,visibility .2s; }
  .cars-sidebar.open { visibility: visible; transform: translateX(0); box-shadow: -20px 0 80px #0005; }
  .site-footer-top { grid-template-columns: 1.5fr 1fr 1fr; }
  .site-footer-brand { grid-column: 1/-1; }
  .steps-visual { height: 480px; }
}
@media (max-width:600px) {
  .topbar-user-name { display: none; }
  .topbar-title { font-size: 18px; }
  .admin-topbar { gap: 10px; }
  .topbar-actions { gap: 6px; }
  .topbar-user { padding: 0; border: 0; }
  .topbar-user-avatar { width: 30px; height: 30px; }
  .container,.section-inner { padding-inline: 22px; }
  .nav-inner,.navbar .container { min-height: 74px; padding: 14px 20px; gap: 12px; }
  .nav-logo-text { font-size: 11px; } .nav-logo-mark { width: 30px; height: 30px; font-size: 13px; }
  .nav-actions { gap: 0; }
  .nav-theme-toggle,.nav-hamburger { min-width:44px; min-height:44px; }
  .page-hero .text-link { display:inline-flex; min-height:44px; align-items:center; padding:8px 0; color:inherit; font-weight:700; text-decoration:underline; text-underline-offset:4px; }
  input,select,textarea { font-size:16px; }
  .mobile-nav { top: 74px; }
  .editorial-hero { min-height: 580px; height: 80svh; }
  .editorial-hero-home { min-height: 660px; height: 94svh; }
  .hero-photograph { object-position: 62% center; }
  .hero-editorial-content { padding-block: 108px 74px; }
  .editorial-hero h1 { font-size: clamp(40px,11vw,60px); }
  .hero-editorial-copy { font-size: 13px; max-width: 280px; }
  .hero-editorial-actions { gap: 20px; align-items: flex-start; flex-wrap: wrap; }
  .hero-caption { bottom: 24px; font-size: 8px; gap: 24px; }
  .hero-caption span:last-child { text-align: right; }
  .section-pad,.section-wrapper { padding-block: 64px; }
  .fleet-header { align-items: flex-start; flex-direction: column; gap: 20px; }
  .cars-grid-v2,.cars-main .cars-grid,.cars-grid,.testimonials-grid-v2 { grid-template-columns: 1fr; gap: 40px; }
  .car-actions-v2,.car-card-actions { grid-template-columns: 1fr 1fr; }
  .why-grid { gap: 24px; }
  .steps-layout { grid-template-columns: 1fr; gap: 32px; margin-top: 32px; }
  .steps-visual { height: 390px; }
  .cta-section { padding: 64px 22px; }
  .site-footer { padding-top: 56px; }
  .site-footer-top { grid-template-columns: 1fr 1fr; gap: 32px 22px; padding-bottom: 40px; }
  .site-footer-bottom { flex-direction: column; gap: 12px; }
  .form-card { padding: 22px; }
  .form-row { grid-template-columns: 1fr; }
  .section-title[style] { font-size: 30px !important; }
  .booking-stepper { grid-template-columns: repeat(2,1fr); }
  .mobile-booking-bar { position: fixed; inset: auto 0 0; display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; background: var(--bg-primary); color: var(--text-primary); border-top: 1px solid var(--border-color); z-index: 850; }
  .mobile-booking-bar > div { display: grid; font-size: 13px; } .mobile-booking-bar span { color: var(--text-secondary); font-size: 10px; }
  body:has(.mobile-booking-bar) { padding-bottom: 76px; }
  body:has(.mobile-booking-bar) .floating-whatsapp { bottom: 94px; }
  .not-found-shell { padding: 28px; }
}
@media (max-width:600px) {
  .navbar .nav-inner,
  .navbar .container.nav-inner {
    display:grid;
    grid-template-columns:minmax(0,1fr) 44px 44px;
    align-items:center;
    width:100%;
    height:72px;
    min-height:72px;
    padding:8px 14px;
    gap:4px;
  }
  .navbar .nav-logo { min-width:0; justify-self:start; }
  .navbar .brand-image { width:118px; height:44px; }
  .navbar .nav-actions { display:grid; place-items:center; width:44px; height:44px; margin:0; gap:0; }
  .navbar .nav-actions > :not(.nav-theme-toggle):not(.nav-icon-btn) { display:none !important; }
  .navbar .nav-theme-toggle,
  .navbar .nav-icon-btn,
  .navbar .nav-hamburger { width:44px; height:44px; min-width:44px; min-height:44px; margin:0; padding:10px; }
  .navbar .nav-theme-toggle svg,
  .navbar .nav-icon-btn svg { width:18px; height:18px; }
  .navbar .nav-hamburger { align-items:center; justify-content:center; justify-self:end; }
  .navbar .nav-hamburger span { width:22px; }
  .mobile-nav { inset:72px 0 0; padding:12px 20px 24px; gap:0; }
  .mobile-nav a,
  .mobile-nav button { display:flex; align-items:center; width:100%; min-height:48px; padding:12px 4px; font-size:16px; line-height:1.35; }
  .mobile-nav [data-auth] { margin-top:8px; font-size:14px; }
  .mobile-nav .mobile-logout { border-top:0; margin-top:0; font-size:14px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}
