/* ============================================================
 AEROTRANSFER - Premium Luxury Website
 Complete Design System & Section Styles
 ============================================================ */

/* Custom Properties */

:root {
 /* Colors - softened slightly from near-pure-black to a warmer charcoal;
 still a dark luxury palette, just not flat/harsh black. */
 --black: #121214;
 --obsidian: #17171a;
 --obsidian-light: #1e1e22;
 --surface: #232326;
 --warm-white: #F7F7F7;
 --gold: #C8A44D;
 --gold-hover: #d4b462;
 --gold-muted: rgba(200, 164, 77, 0.15);
 --soft-gray: #999999;
 --medium-gray: #666666;
 --border: rgba(255, 255, 255, 0.08);
 --border-gold: rgba(200, 164, 77, 0.3);

 /* Light surface - used for the booking widget and a handful of other
 sections where a warm, soft light background reads better than dark.
 Deliberately not stark white: a warm sand/cream, not #FFFFFF, for
 section backgrounds; pure white is reserved for cards sitting on top
 of that cream, giving a soft layered look rather than a flat wash. */
 --light-bg: #F3EEE3;
 --light-bg-alt: #EAE2D0;
 --booking-surface: #FFFFFF;
 --booking-surface-alt: #FAF8F4;
 --booking-text: #1C1C1C;
 --booking-text-soft: #6B6B6B;
 --booking-border: rgba(28, 28, 28, 0.10);
 --booking-shadow: 0 20px 50px rgba(20, 16, 8, 0.10);

 /* Typography */
 --font-serif: 'Playfair Display', 'Georgia', 'Times New Roman', serif;
 --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

 /* Type Scale */
 --text-display: clamp(3.2rem, 7vw, 7.5rem);
 --text-h1: clamp(2.4rem, 5vw, 5rem);
 --text-h2: clamp(2rem, 3.5vw, 3.5rem);
 --text-h3: clamp(1.4rem, 2vw, 2rem);
 --text-h4: clamp(1.1rem, 1.4vw, 1.35rem);
 --text-body: clamp(0.95rem, 1.1vw, 1.1rem);
 --text-small: clamp(0.8rem, 0.9vw, 0.9rem);
 --text-caption: 0.75rem;

 /* Spacing */
 --section-gap: clamp(100px, 14vh, 180px);
 --container-max: 1360px;
 --container-wide: 1600px;
 --container-pad: clamp(24px, 5vw, 80px);

 /* Easing */
 --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
 --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
 --ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);

 /* Transitions */
 --t-fast: 0.3s var(--ease-out);
 --t-medium: 0.5s var(--ease-out);
 --t-slow: 0.8s var(--ease-out);

 /* Layout */
 --nav-height: 80px;
 --radius: 4px;
 --radius-lg: 8px;
}


/* Reset & Base */

*,
*::before,
*::after {
 margin: 0;
 padding: 0;
 box-sizing: border-box;
}

html {
 font-size: 16px;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: grayscale;
 text-rendering: optimizeLegibility;
 scroll-behavior: auto; /* Lenis handles smooth scroll */
}

html.lenis, html.lenis body {
 height: auto;
}

.lenis.lenis-smooth {
 scroll-behavior: auto !important;
}

.lenis.lenis-smooth [data-lenis-prevent] {
 overscroll-behavior: contain;
}

html {
 overscroll-behavior-y: none;
}

body {
 font-family: var(--font-sans);
 font-size: var(--text-body);
 font-weight: 300;
 line-height: 1.7;
 color: var(--warm-white);
 background-color: var(--black);
 overflow-x: hidden;
 overscroll-behavior-y: none;
}

::selection {
 background-color: var(--gold);
 color: var(--black);
}

img {
 max-width: 100%;
 height: auto;
 display: block;
}

a {
 color: inherit;
 text-decoration: none;
 transition: color var(--t-fast);
}

button {
 font-family: inherit;
 cursor: pointer;
 border: none;
 background: none;
 color: inherit;
}

ul, ol {
 list-style: none;
}

input, textarea, select {
 font-family: inherit;
 font-size: inherit;
 color: inherit;
 background: none;
 border: none;
 outline: none;
}

/* Safety default for SVG icons so no icon or star ever renders as a solid black blob */
svg {
 max-width: 100%;
 max-height: 100%;
}
.why__item-icon svg,
.trust-strip__icon svg,
.service-card__arrow svg,
.view-all svg,
.btn svg {
 width: 28px;
 height: 28px;
 fill: none;
 stroke: currentColor;
 stroke-width: 1.5;
 stroke-linecap: round;
 stroke-linejoin: round;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
 width: 6px;
}

::-webkit-scrollbar-track {
 background: var(--black);
}

::-webkit-scrollbar-thumb {
 background: rgba(200, 164, 77, 0.3);
 border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
 background: var(--gold);
}


/* Typography */

h1, h2, h3, h4, h5, h6 {
 font-family: var(--font-serif);
 font-weight: 400;
 line-height: 1.15;
 letter-spacing: -0.01em;
}

h1 { font-size: var(--text-h1); }
h2 { font-size: var(--text-h2); }
h3 { font-size: var(--text-h3); }
h4 { font-size: var(--text-h4); }

.text-display {
 font-family: var(--font-serif);
 font-size: var(--text-display);
 font-weight: 400;
 line-height: 1.05;
 letter-spacing: -0.02em;
}

.text-label {
 font-family: var(--font-sans);
 font-size: var(--text-caption);
 font-weight: 400;
 letter-spacing: 0.2em;
 text-transform: uppercase;
 color: var(--gold);
}

.text-serif {
 font-family: var(--font-serif);
}

.text-sans {
 font-family: var(--font-sans);
}

p {
 color: var(--soft-gray);
 max-width: 600px;
}


/* Layout */

.container {
 width: 100%;
 max-width: var(--container-max);
 margin: 0 auto;
 padding: 0 var(--container-pad);
}

.container--wide {
 max-width: var(--container-wide);
}

section {
 position: relative;
 padding: var(--section-gap) 0;
}

.section-divider {
 width: 60px;
 height: 1px;
 background: var(--gold);
 margin: 0 auto;
 opacity: 0.5;
}

/* Reveal animations are handled by GSAP.
 Content is visible by default for accessibility and no-JS fallback.
 GSAP sets initial hidden state via gsap.set() before animating. */


/* Buttons */

.btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 10px;
 font-family: var(--font-sans);
 font-size: var(--text-small);
 font-weight: 400;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 padding: 16px 40px;
 border-radius: var(--radius);
 transition: all var(--t-medium);
 position: relative;
 overflow: hidden;
 white-space: nowrap;
}

.btn::before {
 content: '';
 position: absolute;
 inset: 0;
 background: rgba(255, 255, 255, 0.05);
 transform: translateY(100%);
 transition: transform var(--t-medium);
}

.btn:hover::before {
 transform: translateY(0);
}

.btn--primary {
 background: linear-gradient(135deg, #dfc27d 0%, #C8A44D 50%, #af8b33 100%);
 color: #000000;
 font-weight: 600;
 border: 1px solid rgba(255, 230, 160, 0.4);
 box-shadow: 0 4px 20px rgba(200, 164, 77, 0.25);
 z-index: 1;
}

.btn--primary:hover {
 background: linear-gradient(135deg, #f3db98 0%, #dfb658 50%, #c49d40 100%);
 color: #000000;
 transform: translateY(-3px) scale(1.02);
 box-shadow: 0 12px 35px rgba(200, 164, 77, 0.55), 0 0 20px rgba(235, 209, 147, 0.4);
 border-color: rgba(255, 245, 200, 0.85);
}

.btn--primary::before {
 display: none;
}

.btn--primary::after {
 content: '';
 position: absolute;
 top: 0;
 left: -100%;
 width: 60%;
 height: 100%;
 background: linear-gradient(
 90deg,
 transparent,
 rgba(255, 255, 255, 0.65),
 transparent
 );
 transform: skewX(-25deg);
 transition: left 0.65s cubic-bezier(0.23, 1, 0.32, 1);
 z-index: 2;
 pointer-events: none;
}

.btn--primary:hover::after {
 left: 140%;
}

.btn--outline {
 background: transparent;
 color: var(--warm-white);
 border: 1px solid var(--border);
}

.btn--outline:hover {
 border-color: var(--gold);
 color: var(--gold);
 transform: translateY(-2px);
}

.btn--small {
 padding: 12px 28px;
 font-size: var(--text-caption);
}

.btn--icon {
 width: 52px;
 height: 52px;
 padding: 0;
 border-radius: 50%;
 border: 1px solid var(--border);
}

.btn--icon:hover {
 border-color: var(--gold);
 background: var(--gold-muted);
}

.btn--icon svg {
 width: 18px;
 height: 18px;
}


/* Navigation */

.nav {
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 z-index: 1000;
 height: var(--nav-height);
 display: flex;
 align-items: center;
 transition: background var(--t-medium), border-color var(--t-medium), backdrop-filter var(--t-medium);
 border-bottom: 1px solid transparent;
}

.nav.is-scrolled {
 background: rgba(9, 9, 9, 0.92);
 backdrop-filter: blur(20px);
 -webkit-backdrop-filter: blur(20px);
 border-bottom-color: var(--border);
}

.nav__inner {
 display: flex;
 align-items: center;
 justify-content: space-between;
 width: 100%;
 max-width: var(--container-wide);
 margin: 0 auto;
 padding: 0 var(--container-pad);
}

.nav__logo {
 font-family: var(--font-serif);
 font-size: 1.15rem;
 font-weight: 400;
 letter-spacing: 0.25em;
 text-transform: uppercase;
 color: var(--warm-white);
 white-space: nowrap;
 transition: color var(--t-fast);
}

.nav__logo span {
 color: var(--gold);
 font-weight: 600;
}

.nav__links {
 display: flex;
 align-items: center;
 gap: 40px;
}

.nav__link {
 font-size: 0.82rem;
 font-weight: 500;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: #eaeaea;
 position: relative;
 padding: 6px 0;
 text-shadow: 0 2px 12px rgba(0, 0, 0, 0.95);
 transition: color var(--t-fast);
}

.nav__link::after {
 content: '';
 position: absolute;
 bottom: -2px;
 left: 0;
 width: 0;
 height: 1px;
 background: var(--gold);
 transition: width var(--t-medium);
}

.nav__link:hover,
.nav__link.is-active {
 color: var(--gold);
 text-shadow: 0 0 16px rgba(200, 164, 77, 0.7);
}

.nav__link:hover::after,
.nav__link.is-active::after {
 width: 100%;
}

/* --- Special Premium Navigation Link (e.g. Niagara Tour) --- */
.nav__link.nav__link--special,
.nav__mobile-links a.nav__mobile-link--special {
 color: var(--gold);
 text-shadow: 0 0 10px rgba(200, 164, 77, 0.3);
}
.nav__link.nav__link--special:hover,
.nav__mobile-links a.nav__mobile-link--special:hover {
 text-shadow: 0 0 16px rgba(200, 164, 77, 0.8);
}

.nav__cta {
 margin-left: 20px;
}

/* Mobile Menu Toggle */
.nav__toggle {
 display: none;
 flex-direction: column;
 gap: 6px;
 padding: 8px;
 cursor: pointer;
 z-index: 1001;
}

.nav__toggle span {
 display: block;
 width: 24px;
 height: 1px;
 background: var(--warm-white);
 transition: all var(--t-fast);
 transform-origin: center;
}

.nav__toggle.is-open span:nth-child(1) {
 transform: rotate(45deg) translate(5px, 5px);
}

.nav__toggle.is-open span:nth-child(2) {
 opacity: 0;
}

.nav__toggle.is-open span:nth-child(3) {
 transform: rotate(-45deg) translate(5px, -5px);
}

/* Mobile Menu Overlay */
.nav__mobile {
 position: fixed;
 inset: 0;
 background: var(--black);
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 gap: 32px;
 opacity: 0;
 visibility: hidden;
 transition: all var(--t-medium);
 z-index: 999;
}

.nav__mobile.is-open {
 opacity: 1;
 visibility: visible;
}

.nav__mobile-links {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 24px;
}

.nav__mobile-links a {
 font-size: var(--text-h3);
 font-family: var(--font-serif);
 letter-spacing: 0.08em;
 color: var(--warm-white);
 text-decoration: none;
 transition: color var(--t-fast);
}

.nav__mobile-links a:hover,
.nav__mobile-links a.is-active {
 color: var(--gold);
}

.nav__mobile-contact {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 12px;
 margin-top: 24px;
}

.nav__mobile-phone {
 color: var(--gold);
 font-size: 1.25rem;
 font-weight: 600;
 text-decoration: none;
}

.nav__mobile-hours {
 color: var(--soft-gray);
 font-size: 0.9rem;
}


/* Luxury Cinematic Preloader */
.preloader {
 position: fixed;
 inset: 0;
 background: #090909;
 z-index: 10000;
 display: flex;
 align-items: center;
 justify-content: center;
 transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.8s ease;
}

.preloader.is-finished {
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
}

.preloader__inner {
 display: flex;
 flex-direction: column;
 align-items: center;
 text-align: center;
 gap: 16px;
}

.preloader__logo {
 font-family: var(--font-serif);
 font-size: clamp(2rem, 4vw, 3.2rem);
 color: var(--warm-white);
 letter-spacing: 0.25em;
 font-weight: 400;
}

.preloader__logo span {
 color: var(--gold);
}

.preloader__tagline {
 font-family: var(--font-sans);
 font-size: 0.72rem;
 letter-spacing: 0.35em;
 color: var(--soft-gray);
 margin-bottom: 16px;
}

.preloader__bar-wrap {
 width: 220px;
 height: 2px;
 background: rgba(255, 255, 255, 0.1);
 border-radius: 4px;
 overflow: hidden;
}

.preloader__bar {
 width: 0%;
 height: 100%;
 background: linear-gradient(90deg, #dfc27d, #C8A44D, #af8b33);
 box-shadow: 0 0 12px rgba(200, 164, 77, 0.6);
 transition: width 0.1s linear;
}

/* Custom Mouse Follower Aura */
.cursor-dot,
.cursor-aura {
 position: fixed;
 top: 0;
 left: 0;
 pointer-events: none;
 z-index: 99999;
 transform: translate(-50%, -50%);
 transition: opacity 0.3s ease;
 will-change: transform;
}

.cursor-dot {
 width: 8px;
 height: 8px;
 background: var(--gold);
 border-radius: 50%;
 box-shadow: 0 0 10px rgba(200, 164, 77, 0.8);
}

.cursor-aura {
 width: 40px;
 height: 40px;
 border: 1px solid rgba(200, 164, 77, 0.5);
 border-radius: 50%;
 transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.2s ease, border-color 0.2s ease;
}

.cursor-aura.is-hovering {
 transform: translate(-50%, -50%) scale(1.6);
 background: rgba(200, 164, 77, 0.12);
 border-color: rgba(255, 225, 140, 0.8);
 box-shadow: 0 0 20px rgba(200, 164, 77, 0.3);
}

@media (hover: none) and (pointer: coarse) {
 .cursor-dot,
 .cursor-aura {
 display: none !important;
 }
}

/* Hero */

.hero {
 position: relative;
 min-height: 100vh;
 min-height: 100dvh; /* iOS Safari: 100vh includes the collapsed-toolbar height,
 so the hero renders taller than what's actually visible, adding extra
 scroll distance on the page. 100dvh tracks the real visible viewport. */
 min-height: calc(var(--vh, 1vh) * 100); /* --vh is set from window.innerHeight in
 header.php and kept in sync on resize/orientationchange -- more reliable than
 dvh alone, which can lag a frame behind the address bar's show/hide animation
 and briefly expose the section below the hero. */
 display: flex;
 align-items: flex-end;
 padding: 0;
 overflow: hidden;
}

.hero__bg {
 position: absolute;
 inset: 0;
 z-index: 0;
}

.hero__bg img {
 width: 100%;
 height: 100%;
 object-fit: cover;
 object-position: center 38%;
 transform: scale(1.03);
 transition: transform 1.5s var(--ease-out);
}

.hero.is-loaded .hero__bg img {
 transform: scale(1);
}

.hero__overlay {
 position: absolute;
 inset: 0;
 background:
 radial-gradient(ellipse at 25% 75%, rgba(200, 164, 77, 0.16) 0%, transparent 55%),
 linear-gradient(180deg,
 rgba(9, 9, 9, 0.90) 0%,
 rgba(9, 9, 9, 0.75) 15%,
 rgba(9, 9, 9, 0.15) 45%,
 rgba(9, 9, 9, 0.45) 75%,
 rgba(9, 9, 9, 0.96) 100%
 );
 z-index: 1;
}

.hero__content {
 position: relative;
 z-index: 2;
 width: 100%;
 padding: 0 var(--container-pad) clamp(60px, 10vh, 120px);
 max-width: var(--container-wide);
 margin: 0 auto;
}

.hero__badge {
 display: inline-flex;
 align-items: center;
 gap: 10px;
 padding: 8px 20px;
 border-radius: 100px;
 background: rgba(25, 25, 25, 0.65);
 border: 1px solid rgba(200, 164, 77, 0.45);
 backdrop-filter: blur(12px);
 font-size: 0.75rem;
 letter-spacing: 0.16em;
 font-weight: 600;
 color: var(--warm-white);
 margin-bottom: 28px;
 box-shadow: 0 10px 30px rgba(0, 0, 0, 0.6);
}

.hero__badge-dot {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: var(--gold);
 box-shadow: 0 0 10px var(--gold);
 animation: badgePulse 2s infinite ease-in-out;
}

@keyframes badgePulse {
 0%, 100% { transform: scale(1); opacity: 1; }
 50% { transform: scale(1.3); opacity: 0.65; }
}

.hero__title {
 font-family: var(--font-serif);
 font-size: var(--text-display);
 font-weight: 400;
 line-height: 1.05;
 letter-spacing: -0.02em;
 color: var(--warm-white);
 margin-bottom: 24px;
 max-width: 900px;
 text-shadow: 0 8px 30px rgba(0, 0, 0, 0.7), 0 2px 10px rgba(0, 0, 0, 0.8);
}

.hero__title em,
.hero__title-highlight {
 font-style: italic;
 color: var(--gold);
 text-shadow: 0 4px 12px rgba(0,0,0,0.5);
}

.hero__subtitle {
 font-family: var(--font-sans);
 font-size: var(--text-h4);
 font-weight: 600;
 color: var(--white);
 margin-bottom: 48px;
 max-width: 580px;
 line-height: 1.6;
 text-shadow: 0 4px 16px rgba(0, 0, 0, 0.9), 0 1px 4px rgba(0, 0, 0, 1);
}

.hero__actions {
 display: flex;
 gap: 16px;
 flex-wrap: wrap;
}

.hero__actions--secondary {
 margin-top: 4px;
}

.hero__secondary-link {
 color: rgba(255, 255, 255, 0.75);
 font-size: 0.85rem;
 text-decoration: underline;
 text-underline-offset: 3px;
 transition: color var(--t-fast);
}

.hero__secondary-link:hover {
 color: var(--gold);
}

/* Hero Quick-Start Bar - the compact, booking-first entry point that lives
 inside the existing cinematic hero without altering its layout/imagery.
 Deliberately a light card (vs. the dark hero) so it reads as the start
 of the new, lighter booking experience. */
.hero-quickstart {
 display: flex;
 align-items: stretch;
 gap: 10px;
 width: 100%;
 max-width: 720px;
 background: var(--booking-surface);
 border-radius: 100px;
 padding: 8px 8px 8px 24px;
 box-shadow: 0 20px 50px rgba(0, 0, 0, 0.45);
}

.hero-quickstart__field {
 display: flex;
 align-items: center;
 flex: 2 1 220px;
 border-right: 1px solid var(--booking-border);
 padding-right: 16px;
}

.hero-quickstart__field--narrow {
 flex: 1 1 120px;
}

.hero-quickstart__field:last-of-type {
 border-right: none;
}

.hero-quickstart__field input {
 width: 100%;
 border: none;
 background: transparent;
 color: var(--booking-text);
 font-family: var(--font-sans);
 font-size: 0.9rem;
 padding: 10px 0;
}

.hero-quickstart__field input::placeholder {
 color: var(--booking-text-soft);
}

.hero-quickstart__field input:focus {
 outline: none;
}

.hero-quickstart__submit {
 flex: 0 0 auto;
 border-radius: 100px !important;
 padding: 14px 28px !important;
 white-space: nowrap;
}

@media (max-width: 768px) {
 .hero-quickstart {
 flex-wrap: wrap;
 border-radius: 20px;
 padding: 16px;
 gap: 12px;
 }
 .hero-quickstart__field {
 flex: 1 1 100%;
 border-right: none;
 border-bottom: 1px solid var(--booking-border);
 padding-right: 0;
 padding-bottom: 8px;
 }
 .hero-quickstart__field--narrow {
 flex: 1 1 calc(50% - 6px);
 }
 .hero-quickstart__submit {
 flex: 1 1 100%;
 width: 100%;
 }
}

.hero__stats {
 display: flex;
 align-items: center;
 gap: 36px;
 margin-top: 56px;
 padding-top: 36px;
 border-top: 1px solid rgba(255, 255, 255, 0.12);
 flex-wrap: wrap;
}

.hero__stat-item {
 display: flex;
 flex-direction: column;
 gap: 4px;
}

.hero__stat-value {
 font-family: var(--font-serif);
 font-size: 1.8rem;
 font-weight: 600;
 color: var(--gold);
 line-height: 1;
}

.hero__stat-label {
 font-size: 0.72rem;
 color: var(--soft-gray);
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

.hero__stat-divider {
 width: 1px;
 height: 36px;
 background: rgba(255, 255, 255, 0.12);
}

@media (max-width: 768px) {
 .hero__stats {
 gap: 20px;
 }
 .hero__stat-divider {
 display: none;
 }
 .hero__stat-item {
 width: 45%;
 }
}

.hero__scroll {
 position: absolute;
 bottom: 32px;
 left: 50%;
 transform: translateX(-50%);
 z-index: 2;
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 8px;
 opacity: 0.4;
 transition: opacity var(--t-fast);
}

.hero__scroll:hover {
 opacity: 0.8;
}

.hero__scroll span {
 font-size: var(--text-caption);
 letter-spacing: 0.2em;
 text-transform: uppercase;
}

.hero__scroll-line {
 width: 1px;
 height: 40px;
 background: linear-gradient(180deg, var(--gold), transparent);
 animation: scrollPulse 2s ease-in-out infinite;
}

@keyframes scrollPulse {
 0%, 100% { opacity: 0.3; transform: scaleY(0.6); }
 50% { opacity: 1; transform: scaleY(1); }
}


/* Booking-First Widget Section (Homepage) */
.booking-first {
 padding: clamp(70px, 9vh, 110px) 0;
 background: var(--obsidian);
}

.booking-first .container {
 max-width: 720px;
}

.booking-first .booking-card {
 margin-top: 8px;
}


/* Trust Strip (Landing Page Luxury Banner) */
.trust-strip {
 display: flex;
 align-items: center;
 justify-content: space-around;
 flex-wrap: wrap;
 gap: 24px;
 padding: 32px var(--container-pad);
 background: rgba(18, 18, 18, 0.85);
 border-top: 1px solid var(--border-gold);
 border-bottom: 1px solid var(--border-gold);
 backdrop-filter: blur(10px);
 -webkit-backdrop-filter: blur(10px);
 margin: 0 auto;
}

.trust-strip__item {
 display: flex;
 align-items: center;
 gap: 16px;
}

.trust-strip__icon {
 width: 48px;
 height: 48px;
 border-radius: 50%;
 background: rgba(200, 164, 77, 0.08);
 border: 1px solid var(--border-gold);
 display: flex;
 align-items: center;
 justify-content: center;
 color: var(--gold);
 flex-shrink: 0;
 transition: all var(--t-fast);
}

.trust-strip__item:hover .trust-strip__icon {
 background: rgba(200, 164, 77, 0.18);
 transform: translateY(-2px);
 box-shadow: 0 4px 15px rgba(200, 164, 77, 0.2);
}

.trust-strip__icon svg {
 width: 22px;
 height: 22px;
 fill: none !important;
 stroke: var(--gold) !important;
 stroke-width: 2px;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.trust-strip__label {
 font-family: var(--font-sans);
 font-size: var(--text-small);
 font-weight: 500;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--warm-white);
}

@media (max-width: 768px) {
 .trust-strip {
 justify-content: flex-start;
 padding: 24px 20px;
 gap: 20px;
 }
 .trust-strip__item {
 width: 100%;
 }
}


/* Trust Section (Reviews) - light variant 
 One of a few deliberately-chosen light breaks in an otherwise dark
 site - reviews and trust content read better on a soft, warm
 background than stark dark or stark white. Everything here is scoped
 under .trust-section so the shared .why__header/.why__grid class names
 don't leak into the (still-dark) .why section further down the page. */

.trust-section {
 background: var(--light-bg);
}

.trust-section .why__header .text-label {
 color: var(--gold-hover);
}

.trust-section .why__header h2 {
 color: var(--booking-text);
}

.trust-section .why__header p {
 color: var(--booking-text-soft);
}

.trust-section .why__grid {
 gap: 32px;
 margin-top: 48px;
 background: transparent;
 border: none;
 border-radius: 0;
 overflow: visible;
}

.trust-section .trust-item {
 padding: 32px;
 background: var(--booking-surface);
 border: 1px solid transparent;
 border-radius: var(--radius-lg);
 transition: transform var(--t-medium), border-color var(--t-medium), box-shadow var(--t-medium);
}

.trust-section .trust-item:hover {
 transform: translateY(-5px);
 border-color: rgba(200, 164, 77, 0.35);
 box-shadow: 0 16px 32px rgba(28, 28, 28, 0.08);
}

.trust-section .trust-item__icon {
 margin-bottom: 24px;
 display: inline-flex;
 align-items: center;
 justify-content: center;
 width: 48px;
 height: 48px;
 border-radius: 50%;
 background: rgba(200, 164, 77, 0.12);
 color: var(--gold-hover);
}

.trust-section .trust-item__title {
 color: var(--booking-text);
 font-size: 1.25rem;
 margin-bottom: 12px;
 font-family: var(--font-serif);
}

.trust-section .trust-item__desc {
 color: var(--booking-text-soft);
 font-size: 0.95rem;
 line-height: 1.6;
}

.trust-section .review-card {
 border-color: rgba(200, 164, 77, 0.25);
 display: flex;
 flex-direction: column;
 justify-content: space-between;
}

.trust-section .review-card__stars {
 display: flex;
 gap: 4px;
 margin-bottom: 16px;
}

.trust-section .review-card__text {
 color: var(--booking-text);
 font-size: 1rem;
 line-height: 1.6;
 font-style: italic;
 margin-bottom: 24px;
}

.trust-section .review-card__author {
 display: flex;
 align-items: center;
 gap: 12px;
}

.trust-section .review-card__avatar {
 width: 40px;
 height: 40px;
 border-radius: 50%;
 background: var(--light-bg-alt);
 display: flex;
 align-items: center;
 justify-content: center;
 font-weight: bold;
 color: var(--gold-hover);
}

.trust-section .review-card__name {
 color: var(--booking-text);
 font-weight: 600;
 font-size: 0.95rem;
}

.trust-section .review-card__source {
 display: flex;
 align-items: center;
 gap: 6px;
 font-size: 0.8rem;
 color: var(--booking-text-soft);
 font-family: var(--font-sans);
}


/* Brand Intro */

.intro {
 padding: var(--section-gap) 0;
 text-align: center;
}

.intro__label {
 margin-bottom: 40px;
}

.intro__heading {
 font-size: var(--text-h1);
 max-width: 900px;
 margin: 0 auto 40px;
 line-height: 1.2;
}

.intro__heading em {
 font-style: italic;
 color: var(--gold);
}

.intro__text {
 font-size: var(--text-body);
 line-height: 1.9;
 color: var(--soft-gray);
 max-width: 640px;
 margin: 0 auto 60px;
}

.intro__pillars {
 display: flex;
 justify-content: center;
 gap: clamp(40px, 6vw, 100px);
 flex-wrap: wrap;
}

.intro__pillar {
 text-align: center;
}

.intro__pillar-value {
 font-family: var(--font-serif);
 font-size: var(--text-h2);
 color: var(--gold);
 line-height: 1;
 margin-bottom: 8px;
}

.intro__pillar-label {
 font-size: var(--text-caption);
 letter-spacing: 0.15em;
 text-transform: uppercase;
 color: var(--soft-gray);
}


/* Services */

.services {
 padding-top: var(--section-gap);
 padding-bottom: 0;
}

.services__header {
 text-align: center;
 margin-bottom: clamp(60px, 10vh, 120px);
}

.services__header h2 {
 margin-bottom: 20px;
}

.services__header p {
 margin: 0 auto;
}

/* Individual Service Blocks */
.service-block {
 padding: clamp(60px, 10vh, 120px) 0;
 border-top: 1px solid var(--border);
}

.service-block:last-child {
 border-bottom: 1px solid var(--border);
}

/* Layout variant: Split (text left, details right) */
.service-block--split .service-block__inner {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: clamp(40px, 6vw, 100px);
 align-items: start;
}

.service-block__number {
 font-family: var(--font-serif);
 font-size: var(--text-caption);
 color: var(--gold);
 letter-spacing: 0.15em;
 margin-bottom: 20px;
 display: block;
}

.service-block__title {
 font-size: var(--text-h2);
 margin-bottom: 20px;
 line-height: 1.15;
}

.service-block__desc {
 color: var(--soft-gray);
 margin-bottom: 32px;
 line-height: 1.8;
 max-width: 480px;
}

.service-block__features {
 display: flex;
 flex-direction: column;
 gap: 16px;
}

.service-block__feature {
 display: flex;
 align-items: center;
 gap: 16px;
 font-size: var(--text-small);
 color: var(--soft-gray);
}

.service-block__feature::before {
 content: '';
 width: 20px;
 height: 1px;
 background: var(--gold);
 flex-shrink: 0;
}

.service-block__cta {
 margin-top: 40px;
}

/* Layout variant: Full-width centered */
.service-block--centered {
 text-align: center;
}

.service-block--centered .service-block__desc {
 margin-left: auto;
 margin-right: auto;
}

.service-block--centered .service-block__features {
 flex-direction: row;
 flex-wrap: wrap;
 justify-content: center;
 gap: 12px 32px;
}

.service-block--centered .service-block__cta {
 display: flex;
 justify-content: center;
}

/* Layout variant: Staggered (offset grid) */
.service-block--stagger .service-block__inner {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: clamp(40px, 6vw, 100px);
 align-items: start;
}

.service-block--stagger .service-block__right {
 padding-top: clamp(40px, 6vh, 80px);
}

/* Layout variant: Minimal row */
.service-block--minimal {
 padding: clamp(40px, 6vh, 80px) 0;
}

.service-block--minimal .service-block__inner {
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 40px;
 flex-wrap: wrap;
}

.service-block--minimal .service-block__title {
 font-size: var(--text-h3);
 margin-bottom: 0;
}

.service-block--minimal .service-block__features {
 flex-direction: row;
 gap: 24px;
 flex-wrap: wrap;
}


/* Fleet */

.fleet {
 padding: var(--section-gap) 0;
 overflow: hidden;
}

.fleet__header {
 text-align: center;
 margin-bottom: clamp(60px, 10vh, 120px);
}

.fleet__header h2 {
 margin-bottom: 20px;
}

.fleet__header p {
 margin: 0 auto;
}

/* 3D REPEATER GALLERY (REFERENCE TEMPLATE COVERFLOW) */
.fleet__showcase {
 position: relative;
 max-width: 1400px;
 margin: 50px auto 0;
 padding: 20px 16px 40px;
 min-height: 860px; /* Reduced from 1040px to fit button better */
 perspective: 1400px;
}

/* 3D Stage where vehicle images sit */
.fleet__vehicle {
 position: absolute;
 top: 160px;
 left: 50%;
 width: 100%;
 max-width: 600px; /* Reduced from 680px */
 margin-left: -300px; /* Half of max-width */
 z-index: 1;
 pointer-events: none;
 transition: all 0.4s cubic-bezier(0.2, 0.8, 0.2, 1); /* Sped up from 0.75s */
 will-change: transform, opacity;
}

/* The 3D Image Card */
.fleet__vehicle-image,
.fleet__image-wrap {
 position: relative;
 border-radius: var(--radius-lg);
 overflow: hidden;
 background: var(--obsidian);
 aspect-ratio: 16/10;
 box-shadow: 0 25px 60px rgba(0, 0, 0, 0.7);
 border: 1px solid rgba(255, 255, 255, 0.12);
 transition: all 0.5s ease;
}

.fleet__vehicle-image a,
.fleet__image-wrap a {
 aspect-ratio: auto !important; /* Overrides the inline 16/9 constraint */
 width: 100% !important;
 height: 100% !important;
 display: block !important;
}

.fleet__vehicle-image img,
.fleet__image-wrap img {
 width: 100% !important;
 height: 100% !important;
 object-fit: contain !important; /* Forces the entire car to be visible without ANY zooming or cropping */
 object-position: center bottom !important; /* Anchors the car to the bottom */
 transition: transform 1s var(--ease-out);
 -webkit-user-drag: none;
 user-select: none;
 pointer-events: none;
}

/* 3D Repeater Positions (Fanned Out in Perspective) */

/* Center Active Card */
.fleet__vehicle.repeater-center {
 z-index: 100;
 transform: translate3d(0, 0, 80px) rotateY(0deg) scale(1.06);
 opacity: 1;
 pointer-events: auto;
}

.fleet__vehicle.repeater-center .fleet__vehicle-image {
 border: 2px solid var(--gold);
 box-shadow: 0 25px 70px rgba(200, 164, 77, 0.35);
}

/* 1 Step Left */
.fleet__vehicle.repeater-left-1 {
 z-index: 90;
 transform: translate3d(-310px, 0, -50px) rotateY(30deg) scale(0.86);
 opacity: 0.82;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.65);
}

/* 1 Step Right */
.fleet__vehicle.repeater-right-1 {
 z-index: 90;
 transform: translate3d(310px, 0, -50px) rotateY(-30deg) scale(0.86);
 opacity: 0.82;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.65);
}

/* 2 Steps Left */
.fleet__vehicle.repeater-left-2 {
 z-index: 80;
 transform: translate3d(-540px, 0, -160px) rotateY(42deg) scale(0.72);
 opacity: 0.52;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.45);
}

/* 2 Steps Right */
.fleet__vehicle.repeater-right-2 {
 z-index: 80;
 transform: translate3d(540px, 0, -160px) rotateY(-42deg) scale(0.72);
 opacity: 0.52;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.45);
}

/* 3 Steps Left / Right (Far Background) */
.fleet__vehicle.repeater-left-3 {
 z-index: 70;
 transform: translate3d(-680px, 0, -260px) rotateY(50deg) scale(0.6);
 opacity: 0.25;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.3);
}

.fleet__vehicle.repeater-right-3 {
 z-index: 70;
 transform: translate3d(680px, 0, -260px) rotateY(-50deg) scale(0.6);
 opacity: 0.25;
 pointer-events: auto;
 cursor: pointer;
 filter: brightness(0.3);
}

/* Hidden Background (Prevents Wrap-around Flying Glitch) */
.fleet__vehicle.repeater-hidden {
 z-index: 0;
 transform: translate3d(0, 0, -400px) scale(0.4);
 opacity: 0;
 pointer-events: none;
}

/* Hover effect on repeater side cards */
.fleet__vehicle.repeater-left-1:hover,
.fleet__vehicle.repeater-right-1:hover,
.fleet__vehicle.repeater-left-2:hover,
.fleet__vehicle.repeater-right-2:hover {
 filter: brightness(0.9);
 opacity: 0.95;
}

/* AROUND-THE-IMAGE LUXURY HUD SHOWCASE */
.fleet__vehicle-info {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 opacity: 0;
 pointer-events: none;
 transition: opacity 0.6s ease;
 z-index: 120;
}

.fleet__vehicle.repeater-center .fleet__vehicle-info {
 opacity: 1;
 pointer-events: auto;
}

/* 1. NAME AT TOP (Floating cleanly above the center 3D image with ample breathing room) */
.fleet__vehicle-info .text-label {
 position: absolute;
 top: -125px;
 left: 0;
 right: 0;
 text-align: center;
 font-size: 0.78rem;
 letter-spacing: 0.25em;
 color: var(--gold);
 margin: 0;
 text-transform: uppercase;
}

.fleet__vehicle-info .fleet__vehicle-name {
 position: absolute;
 top: -90px;
 left: 0;
 right: 0;
 text-align: center;
 font-family: var(--font-serif);
 font-size: clamp(2rem, 3.6vw, 2.8rem);
 font-weight: 400;
 color: var(--warm-white);
 margin: 0;
 text-shadow: 0 10px 30px rgba(0, 0, 0, 0.85);
}

/* 2. INFORMATION AT SIDES (Floating completely OUTSIDE the Left and Right of the car image) */

/* LEFT SIDE: Flanking far left outside the car image */
.fleet__vehicle-info .fleet__specs {
 position: absolute;
 right: calc(100% + 40px);
 top: 15px;
 width: 300px;
 display: flex;
 gap: 14px;
 margin: 0;
}

.fleet__vehicle-info .fleet__spec {
 flex: 1;
 padding: 14px;
 background: rgba(16, 16, 16, 0.94);
 border: 1px solid rgba(200, 164, 77, 0.25);
 border-radius: var(--radius-lg);
 text-align: center;
 box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
 transition: border-color var(--t-fast);
}

.fleet__vehicle-info .fleet__spec:hover {
 border-color: var(--gold);
}

.fleet__vehicle-info .fleet__spec-value {
 font-family: var(--font-serif);
 font-size: 1.45rem;
 color: var(--gold);
 line-height: 1.1;
 margin-bottom: 4px;
}

.fleet__vehicle-info .fleet__spec-label {
 font-size: 0.72rem;
 color: var(--soft-gray);
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

.fleet__vehicle-info .fleet__vehicle-category {
 position: absolute;
 right: calc(100% + 40px);
 top: 105px;
 width: 300px;
 text-align: left;
 font-size: 0.92rem;
 line-height: 1.65;
 color: var(--soft-gray);
 background: rgba(16, 16, 16, 0.94);
 border: 1px solid rgba(200, 164, 77, 0.25);
 border-radius: var(--radius-lg);
 padding: 22px;
 box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
 margin: 0;
}

/* RIGHT SIDE: Flanking far right outside the car image */
.fleet__vehicle-info .fleet__amenities {
 position: absolute;
 left: calc(100% + 40px);
 top: 15px;
 width: 300px;
 display: flex;
 flex-wrap: wrap;
 align-content: flex-start;
 gap: 10px;
 background: rgba(16, 16, 16, 0.94);
 border: 1px solid rgba(200, 164, 77, 0.25);
 border-radius: var(--radius-lg);
 padding: 24px;
 box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
 margin: 0;
}

.fleet__vehicle-info .fleet__amenity {
 font-size: 0.82rem;
 color: var(--warm-white);
 background: rgba(200, 164, 77, 0.08);
 border: 1px solid rgba(200, 164, 77, 0.3);
 padding: 8px 16px;
 border-radius: 100px;
 letter-spacing: 0.04em;
 transition: all var(--t-fast);
}

.fleet__vehicle-info .fleet__amenity:hover {
 background: rgba(200, 164, 77, 0.18);
 border-color: var(--gold);
 color: var(--gold);
 transform: translateY(-2px);
}

/* 3. VIEW DETAILS / BOOK NOW OPTION AT THE BELOW (Centered directly under the active image) */
.fleet__vehicle-info .btn {
 position: absolute;
 top: 470px; /* Reduced from 540px to sit closer to the smaller image */
 left: 50%;
 transform: translateX(-50%);
 width: 320px;
 height: 52px;
 padding: 14px 32px;
 font-size: 0.88rem;
 font-weight: 700;
 letter-spacing: 0.18em;
 text-transform: uppercase;
 background: linear-gradient(135deg, #dfc27d 0%, #C8A44D 50%, #af8b33 100%);
 color: #000000;
 border: 1px solid rgba(255, 240, 180, 0.5);
 border-radius: 4px;
 cursor: pointer;
 z-index: 100;
 pointer-events: auto;
 box-shadow: 0 12px 30px rgba(200, 164, 77, 0.45);
 transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 overflow: hidden;
}

.fleet__vehicle-info .btn::after {
 content: '';
 position: absolute;
 top: -50%;
 left: -120%;
 width: 50%;
 height: 200%;
 background: linear-gradient(
 90deg,
 transparent,
 rgba(255, 255, 255, 0.75),
 transparent
 );
 transform: rotate(25deg);
 transition: left 0.7s cubic-bezier(0.16, 1, 0.3, 1);
 pointer-events: none;
}

.fleet__vehicle-info .btn:hover {
 background: linear-gradient(135deg, #ffeea8 0%, #eac26b 50%, #c49d40 100%);
 color: #000000;
 transform: translateX(-50%) translateY(-4px) scale(1.04);
 box-shadow: 0 20px 50px rgba(200, 164, 77, 0.65), 0 0 25px rgba(255, 230, 150, 0.5);
 border-color: #ffffff;
}

.fleet__vehicle-info .btn:hover::after {
 left: 140%;
}

.fleet__vehicle-info .btn:active {
 transform: translateX(-50%) translateY(-1px) scale(0.99);
 box-shadow: 0 8px 20px rgba(200, 164, 77, 0.4);
}

/* Responsive adjustments for tablet and mobile */
@media (max-width: 1150px) {
 .fleet__showcase {
 min-height: 720px; /* Increased to restore comfortable spacing below the button */
 }

 .fleet__vehicle {
 top: 100px; /* Shifted upwards from 160px to make better use of vertical space */
 }

 /* Hide specs and category on iPad to simplify layout */
 .fleet__vehicle-info .fleet__specs,
 .fleet__vehicle-info .fleet__vehicle-category,
 .vehicle-pricing-front {
 display: none !important;
 }

 /* Re-center the remaining floating elements directly under the image */
 .fleet__vehicle-info .fleet__amenities {
 position: absolute;
 left: 50%;
 transform: translateX(-50%);
 width: 90%;
 top: 390px; /* Sits right below the 600px width image */
 }
 .fleet__vehicle-info .btn {
 position: absolute;
 top: 580px; /* Shifted up slightly to reduce gap while clearing rating box */
 }
}

@media (max-width: 760px) {
 .fleet__vehicle {
 width: 80vw;
 margin-left: -40vw; /* Perfectly centers based on 80vw width and adds more padding to the sides */
 top: 100px; /* Shifted upwards from 160px to make more space */
 }

 /* The 3D coverflow's side-card offsets (repeater-left-1, etc.) are fixed
 pixel translate3d() values tuned for desktop widths - on a narrow
 viewport they don't scale down, so the adjacent card bleeds into view
 next to the centered active card instead of sitting off to the side.
 Navigation already has dedicated prev/next controls (and swipe), so on
 mobile the side positions are just fully hidden for a clean single-card
 view instead of trying to rescale the coverflow effect. */
 .fleet__vehicle.repeater-left-1,
 .fleet__vehicle.repeater-right-1,
 .fleet__vehicle.repeater-left-2,
 .fleet__vehicle.repeater-right-2,
 .fleet__vehicle.repeater-left-3,
 .fleet__vehicle.repeater-right-3 {
 opacity: 0;
 pointer-events: none;
 transform: translate3d(0, 0, -400px) scale(0.4);
 }

 .fleet__showcase {
 min-height: calc(50vw + 200px); /* Dynamic height based on scaled image */
 }
 #video-showcase.fleet__showcase {
 min-height: 850px;
 }

 /* Hide the details on small phones so they don't cover the car picture */
 .fleet__vehicle-info .fleet__vehicle-category,
 .fleet__vehicle-info .fleet__specs,
 .fleet__vehicle-info .fleet__amenities {
 display: none !important;
 }

 /* Move button directly under the car picture */
 .fleet__vehicle-info .btn {
 top: calc(50vw + 30px); /* Fluid top value so it never overlaps the scaled image */
 width: 100%;
 }
}

.fleet__details {
 padding: 20px 0;
}

.fleet__vehicle-label {
 margin-bottom: 16px;
}

.fleet__vehicle-name {
 font-size: var(--text-h2);
 margin-bottom: 8px;
}

.fleet__vehicle-category {
 font-size: var(--text-small);
 color: var(--soft-gray);
 margin-bottom: 40px;
}

.fleet__specs {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 24px;
 margin-bottom: 40px;
}

.fleet__spec {
 padding: 20px;
 background: var(--obsidian-light);
 border: 1px solid var(--border);
 border-radius: var(--radius);
}

.fleet__spec-value {
 font-family: var(--font-serif);
 font-size: var(--text-h3);
 color: var(--gold);
 line-height: 1;
 margin-bottom: 6px;
}

.fleet__spec-label {
 font-size: var(--text-caption);
 color: var(--soft-gray);
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

.fleet__amenities {
 display: flex;
 flex-wrap: wrap;
 gap: 12px;
 margin-bottom: 40px;
}

.fleet__amenity {
 font-size: var(--text-caption);
 color: var(--soft-gray);
 padding: 8px 16px;
 border: 1px solid var(--border);
 border-radius: 100px;
 letter-spacing: 0.05em;
 transition: all var(--t-fast);
}

.fleet__amenity:hover {
 border-color: var(--gold);
 color: var(--gold);
}

/* Fleet Navigation */
.fleet__nav {
 display: flex;
 align-items: center;
 justify-content: center;
 gap: 24px;
 margin-top: clamp(40px, 6vh, 80px);
}

.fleet__nav-btn {
 width: 48px;
 height: 48px;
 display: flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--border);
 border-radius: 50%;
 cursor: pointer;
 transition: all var(--t-fast);
}

.fleet__nav-btn:hover {
 border-color: var(--gold);
 background: var(--gold-muted);
}

.fleet__nav-btn svg {
 width: 16px;
 height: 16px;
 fill: none;
 stroke: var(--warm-white);
 stroke-width: 2;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.fleet__nav-dots {
 display: flex;
 gap: 8px;
}

.fleet__nav-dot {
 width: 8px;
 height: 8px;
 border-radius: 50%;
 background: var(--border);
 cursor: pointer;
 transition: all var(--t-fast);
}

.fleet__nav-dot.is-active {
 background: var(--gold);
 transform: scale(1.3);
}

.fleet__nav-counter {
 font-family: var(--font-serif);
 font-size: var(--text-small);
 color: var(--soft-gray);
}

.fleet__nav-counter .current {
 color: var(--gold);
 font-size: var(--text-h4);
}


/* Why Choose Us */

.why {
 padding: var(--section-gap) 0;
 background: var(--obsidian);
}

.why__header {
 text-align: center;
 margin-bottom: clamp(60px, 8vh, 100px);
}

.why__header h2 {
 margin-bottom: 20px;
}

.why__header p {
 margin: 0 auto;
}

.why__grid {
 display: grid;
 grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
 gap: 1px;
 background: var(--border);
 border: 1px solid var(--border);
 border-radius: var(--radius-lg);
 overflow: hidden;
}

.why__item {
 padding: clamp(32px, 4vw, 48px);
 background: var(--obsidian);
 transition: background var(--t-medium);
}

.why__item:hover {
 background: var(--obsidian-light);
}

.why__item-icon {
 width: 40px;
 height: 40px;
 margin-bottom: 20px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.why__item-icon svg {
 width: 28px;
 height: 28px;
 stroke: var(--gold);
 fill: none;
 stroke-width: 1.5;
 stroke-linecap: round;
 stroke-linejoin: round;
}

.why__item h4 {
 font-size: var(--text-h4);
 margin-bottom: 10px;
 color: var(--warm-white);
}

.why__item p {
 font-size: var(--text-small);
 color: var(--soft-gray);
 line-height: 1.7;
}


/* About / Vision */

.about {
 padding: var(--section-gap) 0;
 text-align: center;
}

.about__label {
 margin-bottom: 40px;
}

.about__quote {
 font-family: var(--font-serif);
 font-size: var(--text-h2);
 font-weight: 400;
 font-style: italic;
 line-height: 1.4;
 max-width: 900px;
 margin: 0 auto 48px;
 color: var(--warm-white);
 position: relative;
}

.about__quote::before {
 content: '\201C';
 position: absolute;
 top: -40px;
 left: 50%;
 transform: translateX(-50%);
 font-size: 6rem;
 color: var(--gold);
 opacity: 0.3;
 line-height: 1;
 font-family: var(--font-serif);
}

.about__values {
 display: flex;
 justify-content: center;
 gap: clamp(32px, 5vw, 80px);
 flex-wrap: wrap;
 margin-top: 60px;
}

.about__value {
 display: flex;
 align-items: center;
 gap: 12px;
 font-size: var(--text-small);
 color: var(--soft-gray);
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

.about__value::before {
 content: '';
 width: 6px;
 height: 6px;
 background: var(--gold);
 border-radius: 50%;
 flex-shrink: 0;
}


/* Testimonials */

.testimonials {
 padding: var(--section-gap) 0;
 background: var(--obsidian);
 overflow: hidden;
}

.testimonials__header {
 text-align: center;
 margin-bottom: clamp(60px, 8vh, 100px);
}

.testimonials__header h2 {
 margin-bottom: 20px;
}

.testimonials__track {
 position: relative;
 max-width: 800px;
 margin: 0 auto;
 text-align: center;
 min-height: 280px;
}

.testimonial {
 position: absolute;
 inset: 0;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
 opacity: 0;
 visibility: hidden;
 transition: all 0.7s var(--ease-out);
}

.testimonial.is-active {
 opacity: 1;
 visibility: visible;
}

.testimonial__stars {
 display: flex;
 gap: 4px;
 margin-bottom: 32px;
}

.testimonial__star {
 color: var(--gold);
 font-size: 1rem;
}

.testimonial__text {
 font-family: var(--font-serif);
 font-size: var(--text-h3);
 font-style: italic;
 line-height: 1.6;
 color: var(--warm-white);
 max-width: 700px;
 margin-bottom: 32px;
}

.testimonial__author {
 font-family: var(--font-sans);
 font-size: var(--text-small);
 color: var(--soft-gray);
 letter-spacing: 0.1em;
 text-transform: uppercase;
}

.testimonials__nav {
 display: flex;
 justify-content: center;
 gap: 12px;
 margin-top: 40px;
}

.testimonials__dot {
 width: 6px;
 height: 6px;
 border-radius: 50%;
 background: var(--medium-gray);
 cursor: pointer;
 transition: all var(--t-fast);
}

.testimonials__dot.is-active {
 background: var(--gold);
 transform: scale(1.5);
}


/* Service Areas */

.areas {
 padding: var(--section-gap) 0;
}

.areas__inner {
 display: grid;
 grid-template-columns: 1fr 1.5fr;
 gap: clamp(40px, 8vw, 120px);
 align-items: start;
}

.areas__content h2 {
 margin-bottom: 20px;
}

.areas__content p {
 margin-bottom: 32px;
}

.areas__note {
 font-size: var(--text-small);
 color: var(--gold);
 font-style: italic;
 padding: 16px 24px;
 border-left: 2px solid var(--gold);
 background: var(--gold-muted);
 border-radius: 0 var(--radius) var(--radius) 0;
}

.areas__grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 0;
}

.areas__city {
 padding: 20px 24px;
 border: 1px solid var(--border);
 margin: -0.5px;
 font-size: var(--text-small);
 color: var(--soft-gray);
 transition: all var(--t-fast);
}

.areas__city:hover {
 background: var(--obsidian-light);
 color: var(--warm-white);
 border-color: var(--border-gold);
 z-index: 1;
 position: relative;
}

.areas__city--highlight {
 color: var(--gold);
 font-weight: 500;
}


/* Booking CTA Section */

.booking-cta {
 padding: var(--section-gap) 0;
 text-align: center;
 background: var(--obsidian);
 position: relative;
 overflow: hidden;
}

.booking-cta::before {
 content: '';
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 width: 600px;
 height: 600px;
 background: radial-gradient(circle, rgba(200, 164, 77, 0.04) 0%, transparent 70%);
 pointer-events: none;
}

.booking-cta h2 {
 font-size: var(--text-h1);
 margin-bottom: 20px;
}

.booking-cta p {
 margin: 0 auto 48px;
 font-size: var(--text-body);
}

.booking-cta__actions {
 display: flex;
 justify-content: center;
 gap: 16px;
 flex-wrap: wrap;
}


/* Booking Modal */

.modal-overlay {
 position: fixed;
 inset: 0;
 z-index: 2000;
 background: rgba(0, 0, 0, 0.8);
 backdrop-filter: blur(10px);
 -webkit-backdrop-filter: blur(10px);
 display: flex;
 align-items: center;
 justify-content: center;
 padding: 24px;
 opacity: 0;
 visibility: hidden;
 transition: all var(--t-medium);
}

.modal-overlay.is-open {
 opacity: 1;
 visibility: visible;
}

.modal {
 width: 100%;
 max-width: 640px;
 max-height: 90vh;
 overflow-y: auto;
 background: var(--obsidian);
 border: 1px solid var(--border);
 border-radius: var(--radius-lg);
 padding: clamp(32px, 5vw, 56px);
 transform: translateY(20px) scale(0.98);
 transition: transform var(--t-medium);
}

.modal-overlay.is-open .modal {
 transform: translateY(0) scale(1);
}

.modal__header {
 display: flex;
 align-items: center;
 justify-content: space-between;
 margin-bottom: 40px;
}

.modal__title {
 font-size: var(--text-h3);
}

.modal__close {
 width: 40px;
 height: 40px;
 display: flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--border);
 border-radius: 50%;
 cursor: pointer;
 transition: all var(--t-fast);
 font-size: 1.2rem;
 color: var(--soft-gray);
}

.modal__close:hover {
 border-color: var(--gold);
 color: var(--warm-white);
}

/* Form Styles */
.form__group {
 margin-bottom: 24px;
}

.form__label {
 display: block;
 font-size: var(--text-caption);
 letter-spacing: 0.15em;
 text-transform: uppercase;
 color: var(--soft-gray);
 margin-bottom: 10px;
}

.form__input {
 width: 100%;
 padding: 16px 20px;
 background: var(--black);
 border: 1px solid var(--border);
 border-radius: var(--radius);
 color: var(--warm-white);
 font-size: var(--text-body);
 transition: border-color var(--t-fast);
}

.form__input:focus {
 border-color: var(--gold);
}

.form__input::placeholder {
 color: var(--medium-gray);
}

.form__row {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 16px;
}

textarea.form__input {
 min-height: 100px;
 resize: vertical;
}

select.form__input {
 appearance: none;
 background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
 background-repeat: no-repeat;
 background-position: right 16px center;
 cursor: pointer;
}

select.form__input option {
 background: var(--obsidian);
 color: var(--warm-white);
}

.form__submit {
 width: 100%;
 margin-top: 16px;
}

.form__note {
 text-align: center;
 margin-top: 16px;
 font-size: var(--text-caption);
 color: var(--medium-gray);
}

.flight-info-box {
 margin-top: 20px;
 background: var(--light-bg-alt);
 border: 1px solid rgba(200, 164, 77, 0.35);
 border-radius: 8px;
 padding: 16px 18px;
}

.flight-info-box.form__group,
.booking-form .flight-info-box.form__group {
 border-bottom: none;
 padding-bottom: 16px;
}

.flight-info-box .form__label {
 color: var(--booking-text);
 font-weight: 600;
}

.flight-info-box .form__input {
 background: var(--booking-surface);
 border: 1px solid rgba(200, 164, 77, 0.5);
 border-radius: 6px;
 padding: 10px 12px;
 color: var(--booking-text);
 margin-top: 6px;
 transition: border-color var(--t-fast);
}

.flight-info-box .form__input:focus {
 border-color: var(--gold);
}

.flight-info-box .form__input::placeholder {
 color: var(--booking-text-soft);
}

.flight-info-box__note {
 margin: 10px 0 0;
 font-size: 0.8rem;
 line-height: 1.5;
 color: var(--booking-text-soft);
}


/* Contact */

.contact {
 padding: var(--section-gap) 0;
}

.contact__inner {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: clamp(40px, 8vw, 120px);
}

.contact__info h2 {
 margin-bottom: 20px;
}

.contact__info > p {
 margin-bottom: 48px;
}

.contact__details {
 display: flex;
 flex-direction: column;
 gap: 24px;
}

.contact__detail {
 display: flex;
 gap: 16px;
 align-items: flex-start;
}

.contact__detail-icon {
 width: 40px;
 height: 40px;
 flex-shrink: 0;
 display: flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--border);
 border-radius: 50%;
}

.contact__detail-icon svg {
 width: 16px;
 height: 16px;
 stroke: var(--gold);
 fill: none;
 stroke-width: 1.5;
}

.contact__detail-text h4 {
 font-family: var(--font-sans);
 font-size: var(--text-small);
 font-weight: 500;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 margin-bottom: 4px;
 color: var(--warm-white);
}

.contact__detail-text p {
 font-size: var(--text-body);
 color: var(--soft-gray);
}

.contact__detail-text a {
 color: var(--gold);
 transition: color var(--t-fast);
}

.contact__detail-text a:hover {
 color: var(--gold-hover);
}

.contact__form h3 {
 margin-bottom: 32px;
}


/* Footer */

.footer {
 padding: clamp(60px, 8vh, 100px) 0 clamp(32px, 4vh, 48px);
 border-top: 1px solid var(--border);
}

.footer__top {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 40px;
 flex-wrap: wrap;
 margin-bottom: clamp(40px, 6vh, 80px);
}

.footer__brand {
 max-width: 360px;
}

.footer__logo {
 font-family: var(--font-serif);
 font-size: 1.15rem;
 letter-spacing: 0.25em;
 text-transform: uppercase;
 margin-bottom: 16px;
}

.footer__logo span {
 color: var(--gold);
}

.footer__tagline {
 font-size: var(--text-small);
 color: var(--soft-gray);
 line-height: 1.7;
}

.footer__columns {
 display: flex;
 gap: clamp(40px, 5vw, 80px);
}

.footer__column h4 {
 font-family: var(--font-sans);
 font-size: var(--text-caption);
 font-weight: 500;
 letter-spacing: 0.15em;
 text-transform: uppercase;
 color: var(--warm-white);
 margin-bottom: 20px;
}

.footer__column ul {
 display: flex;
 flex-direction: column;
 gap: 12px;
}

.footer__column a {
 font-size: var(--text-small);
 color: var(--soft-gray);
 transition: color var(--t-fast);
}

.footer__column a:hover {
 color: var(--gold);
}

.footer__bottom {
 display: flex;
 align-items: center;
 justify-content: space-between;
 padding-top: 32px;
 border-top: 1px solid var(--border);
 flex-wrap: wrap;
 gap: 16px;
}

.footer__copyright {
 font-size: var(--text-caption);
 color: var(--medium-gray);
}

.footer__social {
 display: flex;
 gap: 12px;
}

.footer__social a {
 width: auto;
 height: 40px;
 padding: 0 16px;
 display: flex;
 align-items: center;
 justify-content: center;
 border: 1px solid var(--border);
 border-radius: 20px;
 transition: all var(--t-fast);
 color: var(--soft-gray);
 font-size: 0.9rem;
}

.footer__social a:hover {
 border-color: var(--gold);
 background: var(--gold-muted);
}

.footer__social svg {
 width: 16px;
 height: 16px;
 fill: var(--soft-gray);
 transition: fill var(--t-fast);
}

.footer__social a:hover svg {
 fill: var(--gold);
}


/* WhatsApp Float */

.whatsapp {
 position: fixed;
 bottom: 28px;
 right: 28px;
 z-index: 900;
 width: 56px;
 height: 56px;
 background: #25D366;
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 box-shadow: 0 4px 20px rgba(37, 211, 102, 0.3);
 transition: all var(--t-fast);
}

.whatsapp:hover {
 transform: scale(1.08);
 box-shadow: 0 6px 30px rgba(37, 211, 102, 0.4);
}

.whatsapp svg {
 width: 28px;
 height: 28px;
 fill: #fff;
}


/* Responsive: Tablet */

@media (max-width: 1024px) {
 .nav__links, .nav__cta {
 display: none !important;
 }

 .nav__toggle {
 display: flex;
 }

 .service-block--split .service-block__inner,
 .service-block--stagger .service-block__inner {
 grid-template-columns: 1fr;
 gap: 32px;
 }

 .fleet__vehicle.is-active {
 grid-template-columns: 1fr;
 text-align: center;
 }

 .fleet__image-wrap {
 aspect-ratio: 16/10;
 }

 .fleet__specs {
 max-width: 400px;
 margin-left: auto;
 margin-right: auto;
 }

 .fleet__amenities {
 justify-content: center;
 }

 .fleet__details {
 display: flex;
 flex-direction: column;
 align-items: center;
 }

 .fleet__vehicle-label,
 .fleet__vehicle-category {
 text-align: center;
 }

 .areas__inner {
 grid-template-columns: 1fr;
 gap: 48px;
 }

 .areas__grid {
 grid-template-columns: repeat(3, 1fr);
 }

 .contact__inner {
 grid-template-columns: 1fr;
 gap: 60px;
 }

 .footer__top {
 flex-direction: column;
 }
}


/* Responsive: Mobile */

@media (max-width: 640px) {
 :root {
 --nav-height: 64px;
 }

 .hero__content {
 padding-top: 120px;
 padding-bottom: 80px;
 }

 .hero__actions {
 flex-direction: column;
 }

 .hero__actions .btn {
 width: 100%;
 }

 .hero__scroll {
 display: none;
 }

 .intro__pillars {
 gap: 32px;
 }

 .service-block--minimal .service-block__inner {
 flex-direction: column;
 align-items: flex-start;
 gap: 20px;
 }

 .fleet__specs {
 grid-template-columns: 1fr 1fr;
 max-width: 100%;
 }

 .why__grid {
 grid-template-columns: 1fr;
 }

 .areas__grid {
 grid-template-columns: repeat(2, 1fr);
 }

 .form__row {
 grid-template-columns: 1fr;
 }

 .booking-cta__actions {
 flex-direction: column;
 align-items: center;
 }

 .footer__columns {
 flex-direction: column;
 gap: 32px;
 }

 .footer__bottom {
 flex-direction: column;
 align-items: center;
 text-align: center;
 }

 .modal {
 padding: 24px;
 }
}

@media (max-width: 480px) {
 :root {
 --text-h1: 2rem;
 --text-h2: 1.75rem;
 --text-h3: 1.5rem;
 }

 .nav__logo {
 font-size: 1rem;
 letter-spacing: 0.15em;
 }

 .areas__grid {
 grid-template-columns: 1fr;
 }

 .fleet__specs {
 grid-template-columns: 1fr;
 gap: 8px;
 }

 .btn {
 width: 100%;
 text-align: center;
 justify-content: center;
 }

 .service-block--minimal .service-block__inner {
 padding: 24px 16px;
 }
}


/* Accessibility */

.sr-only {
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0, 0, 0, 0);
 white-space: nowrap;
 border-width: 0;
}

*:focus-visible {
 outline: 2px solid var(--gold);
 outline-offset: 2px;
}

@media (prefers-reduced-motion: reduce) {
 *, *::before, *::after {
 animation-duration: 0.01ms !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 }
}


/* Print */

@media print {
 .nav, .whatsapp, .hero__scroll, .modal-overlay {
 display: none !important;
 }

 body {
 background: #fff;
 color: #000;
 }

 section {
 page-break-inside: avoid;
 }
}

/* 
 ACCESSIBILITY & FOCUS
 */
:focus-visible {
 outline: 2px solid var(--gold) !important;
 outline-offset: 4px;
}

/* Skip to Content */
.skip-link {
 position: absolute;
 top: -40px;
 left: 0;
 background: var(--gold);
 color: #111;
 padding: 8px 16px;
 z-index: 9999;
 transition: top 0.2s ease;
}
.skip-link:focus {
 top: 0;
}

@media (prefers-reduced-motion: reduce) {
 * {
 animation-duration: 0.01ms !important;
 animation-iteration-count: 1 !important;
 transition-duration: 0.01ms !important;
 scroll-behavior: auto !important;
 }
}
/* -----------------------------------------
 Google Review Badge (Vehicle Cards)
----------------------------------------- */
.vehicle-google-review {
 display: inline-flex;
 flex-direction: column;
 gap: 6px;
 background: rgba(25, 25, 25, 0.6);
 border: 1px solid rgba(223, 194, 125, 0.2);
 padding: 12px 16px;
 border-radius: 8px;
 backdrop-filter: blur(4px);
 margin-bottom: 20px;
}
.vehicle-google-review__stars {
 display: flex;
 gap: 4px;
}
.vehicle-google-review__stars svg {
 width: 16px;
 height: 16px;
}
.vehicle-google-review__text {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 0.85rem;
 color: var(--soft-gray);
 letter-spacing: 0.5px;
}
.vehicle-google-review__text strong {
 color: var(--white);
}
/* -----------------------------------------
 Vehicle Review Card
----------------------------------------- */
.vehicle-review-card {
 display: flex;
 flex-direction: column;
 gap: 12px;
 background: rgba(25, 25, 25, 0.6);
 border: 1px solid rgba(223, 194, 125, 0.2);
 padding: 20px;
 border-radius: 8px;
 backdrop-filter: blur(4px);
 margin: 20px 0;
 max-width: 400px;
}
.vehicle-review-card__stars {
 display: flex;
 gap: 4px;
}
.vehicle-review-card__stars svg {
 width: 16px;
 height: 16px;
}
.vehicle-review-card__text {
 font-size: 0.95rem;
 color: var(--soft-gray);
 line-height: 1.5;
 font-style: italic;
 margin: 0;
}
.vehicle-review-card__author {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 0.85rem;
 color: var(--soft-gray);
 border-top: 1px solid rgba(255,255,255,0.1);
 padding-top: 12px;
}
.vehicle-review-card__author strong {
 color: var(--white);
}
/* Vehicle Pricing Front (Static Port) */
.vehicle-pricing-front {
 position: absolute;
 top: 450px;
 left: 50%;
 transform: translateX(-50%);
 display: flex;
 gap: 50px;
 text-align: left;
 border-top: 1px solid rgba(223,194,125,0.2);
 padding-top: 20px;
 width: max-content;
 z-index: 100;
}
.vehicle-pricing-front .price-main { font-size: 1.4rem; font-weight: 700; color: #dfc27d; margin-bottom: 4px; white-space: nowrap; }
.vehicle-pricing-front .price-sub { font-size: 1.1rem; font-weight: 600; color: #ffffff; margin-bottom: 4px; padding-top: 3px; white-space: nowrap; }
.vehicle-pricing-front .label { font-size: 0.7rem; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 0.05em; }
@media (max-width: 1150px) { .vehicle-pricing-front { top: 660px; gap: 30px; } }
@media (max-width: 760px) { .vehicle-pricing-front { top: 170px; gap: 15px; } .vehicle-pricing-front .price-main, .vehicle-pricing-front .price-sub { font-size: 1rem; } }

/* Fix Google Maps Autocomplete dropdown z-index to appear above all modals */
.pac-container {
 z-index: 9999999 !important;
}
.btn--secondary {
 background: rgba(255, 255, 255, 0.05);
 color: var(--warm-white);
 border: 1px solid rgba(255, 255, 255, 0.2);
}
.btn--secondary:hover {
 background: rgba(255, 255, 255, 0.1);
 border-color: var(--gold);
 color: var(--gold);
}


@media (max-width: 1024px) {

}

@media (max-width: 768px) {

}


gmp-place-picker { width: 100%; display: block; }


/* Hero Booking Prompt Responsive Classes */
.hero__booking-prompt {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 1.25rem;
 padding-bottom: 2rem;
 padding-left: 20px;
 padding-right: 20px;
 width: 100%;
 max-width: 100%;
 box-sizing: border-box;
}

.hero__booking-title {
 text-align: center;
 color: var(--warm-white);
 font-family: var(--font-serif);
 font-size: clamp(2rem, 2.6vw, 2.5rem);
 font-weight: 500;
 letter-spacing: 0.5px;
 margin: 0;
 text-shadow: 0 8px 28px rgba(0, 0, 0, 0.75);
}

.hero__booking-title-accent {
 color: var(--gold);
 font-style: italic;
}

.hero__booking-subtitle {
 text-align: center;
 color: rgba(255, 255, 255, 0.7);
 font-size: 1.1rem;
 max-width: 600px;
 margin: 0;
 line-height: 1.6;
}

.hero__booking-btn {
 /* Inherits from .btn .btn--primary, just adding any specific overrides here if needed */
}

@media (max-width: 768px) {
 .hero__booking-prompt {
 gap: 1rem;
 padding-bottom: 1rem;
 }
 .hero__booking-title {
 font-size: 1.7rem;
 }
 .hero__booking-subtitle {
 font-size: 0.95rem;
 padding: 0 10px;
 }
 .hero__booking-btn {
 width: 100%;
 max-width: 300px;
 padding: 14px 24px;
 font-size: 0.95rem;
 }
}

@media (max-width: 480px) {
 .hero__booking-title {
 font-size: 1.3rem;
 }
 .hero__booking-subtitle {
 font-size: 0.85rem;
 }
}

/* --- REFACTORED FLEET CTA WRAPPER --- */
.fleet__cta-wrapper {
 position: absolute;
 top: 490px;
 left: 50%;
 transform: translateX(-50%);
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 16px;
 width: 100%;
 z-index: 100;
}

.fleet__cta-wrapper > .btn {
 /* Override the old absolute desktop button positioning since it's now in a flex wrapper */
 position: relative !important;
 top: auto !important;
 left: auto !important;
 transform: none !important;
}

@media (max-width: 1150px) {
 .vehicle-google-review__text {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 0.85rem;
 color: var(--soft-gray);
 letter-spacing: 0.5px;
 }
}
.vehicle-google-review__text strong {
 color: var(--white);
}
/* -----------------------------------------
 Vehicle Review Card
----------------------------------------- */
.vehicle-review-card {
 display: flex;
 flex-direction: column;
 gap: 12px;
 background: rgba(25, 25, 25, 0.6);
 border: 1px solid rgba(223, 194, 125, 0.2);
 padding: 20px;
 border-radius: 8px;
 backdrop-filter: blur(4px);
 margin: 20px 0;
 max-width: 400px;
}
.vehicle-review-card__stars {
 display: flex;
 gap: 4px;
}
.vehicle-review-card__stars svg {
 width: 16px;
 height: 16px;
}
.vehicle-review-card__text {
 font-size: 0.95rem;
 color: var(--soft-gray);
 line-height: 1.5;
 font-style: italic;
 margin: 0;
}
.vehicle-review-card__author {
 display: flex;
 align-items: center;
 gap: 8px;
 font-size: 0.85rem;
 color: var(--soft-gray);
 border-top: 1px solid rgba(255,255,255,0.1);
 padding-top: 12px;
}
.vehicle-review-card__author strong {
 color: var(--white);
}
/* Vehicle Pricing Front (Static Port) */
.vehicle-pricing-front {
 position: absolute;
 top: 450px;
 left: 50%;
 transform: translateX(-50%);
 display: flex;
 gap: 50px;
 text-align: left;
 border-top: 1px solid rgba(223,194,125,0.2);
 padding-top: 20px;
 width: max-content;
 z-index: 100;
}
.vehicle-pricing-front .price-main { font-size: 1.4rem; font-weight: 700; color: #dfc27d; margin-bottom: 4px; white-space: nowrap; }
.vehicle-pricing-front .price-sub { font-size: 1.1rem; font-weight: 600; color: #ffffff; margin-bottom: 4px; padding-top: 3px; white-space: nowrap; }
.vehicle-pricing-front .label { font-size: 0.7rem; color: rgba(255,255,255,0.5); text-transform: uppercase; letter-spacing: 0.05em; }
@media (max-width: 1150px) { .vehicle-pricing-front { top: 660px; gap: 30px; } }
@media (max-width: 760px) { .vehicle-pricing-front { top: 170px; gap: 15px; } .vehicle-pricing-front .price-main, .vehicle-pricing-front .price-sub { font-size: 1rem; } }

/* Fix Google Maps Autocomplete dropdown z-index to appear above all modals */
/* --- REFACTORED FLEET CTA WRAPPER --- */
.fleet__cta-wrapper {
 position: absolute;
 top: 490px;
 left: 50%;
 transform: translateX(-50%);
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 16px;
 width: 100%;
 z-index: 100;
}

.fleet__cta-wrapper > .btn {
 /* Override the old absolute desktop button positioning since it's now in a flex wrapper */
 position: relative !important;
 top: auto !important;
 left: auto !important;
 transform: none !important;
}

@media (max-width: 1150px) {
 .fleet__cta-wrapper {
 top: 700px;
 }
}

@media (max-width: 760px) {
 .fleet__cta-wrapper {
 top: 100% !important;
 margin-top: -40px !important;
 gap: 12px;
 padding: 0 20px;
 box-sizing: border-box;
 }

 .fleet__cta-wrapper > [class^="vehicle-pricing-front-"] {
 width: 100% !important;
 max-width: 320px !important;
 box-sizing: border-box !important;
 padding: 12px 10px !important;
 justify-content: space-between !important;
 }

 .fleet__cta-wrapper > .btn {
 width: 100% !important;
 max-width: 320px !important;
 box-sizing: border-box !important;
 padding: 16px 10px !important;
 }

 .fleet__cta-wrapper > [class^="vehicle-pricing-front-"] > div {
 flex: 1 1 0;
 text-align: center;
 }

 .fleet__cta-wrapper > [class^="vehicle-pricing-front-"] > div > div:first-child {
 font-size: 0.95rem !important;
 white-space: nowrap;
 }

 .fleet__cta-wrapper > [class^="vehicle-pricing-front-"] > div > div:last-child {
 font-size: 0.65rem !important;
 letter-spacing: 0 !important;
 }

 .fleet__showcase {
 padding-bottom: 280px !important;
 }
}
/* =========================================
 WhatsApp Float Button
 ========================================= */
.whatsapp-float {
 position: fixed;
 bottom: 24px;
 right: 24px;
 width: 64px;
 height: 64px;
 background-color: var(--gold);
 color: var(--obsidian);
 border-radius: 50%;
 display: flex;
 align-items: center;
 justify-content: center;
 box-shadow: 0 4px 12px rgba(0,0,0,0.3);
 z-index: 9999;
 transition: transform 0.3s ease, background-color 0.3s ease, box-shadow 0.3s ease;
 text-decoration: none;
}
.whatsapp-float:hover,
.whatsapp-float:focus {
 transform: scale(1.1);
 background-color: var(--gold-hover);
 color: var(--obsidian);
 box-shadow: 0 6px 16px rgba(0,0,0,0.4);
 outline: none;
}
.whatsapp-float svg {
 width: 44px;
 height: 44px;
 fill: currentColor;
}