/* Base styles extracted from the original single-file page. */
:root{
 --gold:#c9a84c;
 --gold-light:#e2c278;
 --gold-dark:#9a7a30;
 --black:#080808;
 --charcoal:#111111;
 --card-bg:#141414;
 --card-border:rgba(201,168,76,0.18);
 --text:#e8e8e8;
 --text-muted:#888;
 --white:#ffffff;
 --font-display:'Cormorant Garamond',Georgia,serif;
 --font-body:'Montserrat',sans-serif;
 --radius:4px;
 --transition:0.35s cubic-bezier(0.4,0,0.2,1);
}
 *,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
 html{scroll-behavior:smooth;font-size:16px;}
 body{
 background:var(--black);
 color:var(--text);
 font-family:var(--font-body);
 line-height:1.6;
 -webkit-font-smoothing:antialiased;
 overflow-x:hidden;
}
 img{display:block;max-width:100%;}
 a{text-decoration:none;color:inherit;}
 ul{list-style:none;}
 .gold{color:var(--gold);}
 .section-label{
 font-family:var(--font-body);
 font-size:10px;
 font-weight:600;
 letter-spacing:4px;
 text-transform:uppercase;
 color:var(--gold);
 margin-bottom:14px;
 display:block;
}
 .section-title{
 font-family:var(--font-display);
 font-size:clamp(2rem,6vw,3.2rem);
 font-weight:600;
 color:var(--white);
 line-height:1.1;
 margin-bottom:16px;
}
 .section-sub{
 font-size:14px;
 color:var(--text-muted);
 line-height:1.7;
 max-width:540px;
 margin:0 auto;
}
 .divider{
 width:48px;
 height:1px;
 background:var(--gold);
 margin:20px auto;
 opacity:0.6;
}
 .btn-primary{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 background:var(--gold);
 color:var(--black);
 font-family:var(--font-body);
 font-size:11px;
 font-weight:700;
 letter-spacing:2.5px;
 text-transform:uppercase;
 padding:16px 36px;
 border-radius:var(--radius);
 border:none;
 cursor:pointer;
 transition:background var(--transition),transform var(--transition),box-shadow var(--transition);
 white-space:nowrap;
}
 .btn-primary:hover{
 background:var(--gold-light);
 transform:translateY(-2px);
 box-shadow:0 8px 28px rgba(201,168,76,0.35);
}
 .btn-primary:active{transform:translateY(0);}
 .btn-outline{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 gap:8px;
 background:transparent;
 color:var(--gold);
 font-family:var(--font-body);
 font-size:11px;
 font-weight:600;
 letter-spacing:2.5px;
 text-transform:uppercase;
 padding:15px 36px;
 border-radius:var(--radius);
 border:1px solid var(--gold);
 cursor:pointer;
 transition:all var(--transition);
 white-space:nowrap;
}
 .btn-outline:hover{
 background:rgba(201,168,76,0.1);
 transform:translateY(-2px);
}
 .fade-in{
 opacity:0;
 transform:translateY(28px);
 transition:opacity 0.7s ease,transform 0.7s ease;
}
 .fade-in.visible{
 opacity:1;
 transform:translateY(0);
}
 .section{
 padding:90px 24px;
 text-align:center;
}
 @media (min-width:768px){
 .section{padding:110px 40px;}
}
 #hero{
 position:relative;
 width:100%;
 min-height:100svh;
 display:flex;
 flex-direction:column;
 align-items:center;
 justify-content:center;
 text-align:center;
 padding:40px 24px 100px;
 overflow:hidden;
}
 /* IMAGES: Replace assets/images/hero-image.jpg with the final hero photo. */
 .hero-bg{
 position:absolute;
 inset:0;
 background-image:url('assets/images/hero-image.jpg');
 background-size:cover;
 background-position:center 40%;
 background-repeat:no-repeat;
 transform:scale(1.04);
 animation:slowZoom 20s ease-in-out infinite alternate;
}
 @keyframes slowZoom{
 from{transform:scale(1.04);}
 to{transform:scale(1.10);}
}
 .hero-overlay{
 position:absolute;
 inset:0;
 background:linear-gradient(
 to bottom,
 rgba(8,8,8,0.55) 0%,
 rgba(8,8,8,0.35) 40%,
 rgba(8,8,8,0.65) 80%,
 rgba(8,8,8,0.92) 100%
 );
}
 .hero-content{
 position:relative;
 z-index:2;
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:0;
}
 .hero-logo{
 width:140px;
 margin-bottom:36px;
 animation:fadeDown 1s ease 0.2s both;
 filter:drop-shadow(0 4px 20px rgba(201,168,76,0.3));
}
 @keyframes fadeDown{
 from{opacity:0;transform:translateY(-16px);}
 to{opacity:1;transform:translateY(0);}
}
 .hero-eyebrow{
 font-size:10px;
 font-weight:600;
 letter-spacing:4px;
 text-transform:uppercase;
 color:var(--gold);
 margin-bottom:20px;
 animation:fadeUp 1s ease 0.5s both;
}
 .hero-title{
 font-family:var(--font-display);
 font-size:clamp(2.6rem,9vw,5.5rem);
 font-weight:600;
 color:var(--white);
 line-height:1.05;
 max-width:720px;
 margin-bottom:22px;
 animation:fadeUp 1s ease 0.7s both;
 text-shadow:0 2px 24px rgba(0,0,0,0.6);
}
 .hero-sub{
 font-size:14px;
 font-weight:300;
 color:rgba(232,232,232,0.8);
 max-width:400px;
 line-height:1.7;
 margin-bottom:44px;
 animation:fadeUp 1s ease 0.9s both;
 letter-spacing:0.3px;
}
 .hero-buttons{
 display:flex;
 flex-direction:column;
 gap:14px;
 width:100%;
 max-width:320px;
 animation:fadeUp 1s ease 1.1s both;
}
 .hero-buttons .btn-primary,
 .hero-buttons .btn-outline{
 width:100%;
}
 @keyframes fadeUp{
 from{opacity:0;transform:translateY(18px);}
 to{opacity:1;transform:translateY(0);}
}
 .hero-scroll{
 position:absolute;
 bottom:28px;
 left:50%;
 transform:translateX(-50%);
 z-index:2;
 display:flex;
 flex-direction:column;
 align-items:center;
 gap:8px;
 color:rgba(255,255,255,0.4);
 font-size:9px;
 letter-spacing:3px;
 text-transform:uppercase;
 animation:fadeUp 1s ease 1.4s both;
}
 .hero-scroll-line{
 width:1px;
 height:32px;
 background:linear-gradient(to bottom,var(--gold),transparent);
 animation:scrollLine 2s ease-in-out infinite;
}
 @keyframes scrollLine{
 0%,100%{opacity:0.4;transform:scaleY(1);}
 50%{opacity:1;transform:scaleY(1.2);}
}
 @media (min-width:768px){
 .hero-logo{width:180px;margin-bottom:48px;}
 .hero-buttons{flex-direction:row;max-width:none;}
 .hero-buttons .btn-primary,
 .hero-buttons .btn-outline{width:auto;padding:18px 44px;}
}
 @media (min-width:992px){
 .hero-buttons{justify-content:center;gap:20px;}
}
 #why{
 background:var(--charcoal);
 position:relative;
}
 #why::before{
 content:'';
 position:absolute;
 top:0;left:0;right:0;
 height:1px;
 background:linear-gradient(to right,transparent,var(--gold),transparent);
 opacity:0.3;
}
 .why-grid{
 display:grid;
 grid-template-columns:1fr;
 gap:20px;
 max-width:1000px;
 margin:56px auto 0;
}
 @media (min-width:768px){
 .why-grid{grid-template-columns:repeat(3,1fr);gap:24px;}
}
.why-card{
 background:var(--card-bg);
 border:1px solid var(--card-border);
 border-radius:var(--radius);
 padding:32px 24px 30px;
 text-align:left;
 transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);
}
 .why-card:hover{
 transform:translateY(-4px);
 border-color:rgba(201,168,76,0.4);
 box-shadow:0 18px 40px rgba(0,0,0,0.45);
 }
 .why-icon{
 width:42px;
 height:42px;
 border:1px solid rgba(201,168,76,0.25);
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 margin-bottom:22px;
 color:var(--gold);
}
 .why-icon svg{
 width:18px;
 height:18px;
 stroke:currentColor;
 fill:none;
 stroke-width:1.8;
 stroke-linecap:round;
 stroke-linejoin:round;
}
 .why-card h3{
 font-family:var(--font-display);
 font-size:1.55rem;
 font-weight:600;
 color:var(--white);
 margin-bottom:12px;
}
 .why-card p{
 font-size:13px;
 color:var(--text-muted);
 line-height:1.8;
}
 #fleet{
 background:var(--black);
}
 .fleet-grid{
 display:grid;
 grid-template-columns:1fr;
 gap:28px;
 max-width:1080px;
 margin:58px auto 0;
}
 @media (min-width:900px){
 .fleet-grid{grid-template-columns:repeat(2,1fr);}
}
 .vehicle-card{
 background:linear-gradient(180deg,#141414 0%,#101010 100%);
 border:1px solid var(--card-border);
 border-radius:var(--radius);
 overflow:hidden;
 text-align:left;
 transition:transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
 .vehicle-card:hover{
 transform:translateY(-6px);
 border-color:rgba(201,168,76,0.4);
 box-shadow:0 24px 60px rgba(0,0,0,0.6),0 0 50px rgba(201,168,76,0.05);
}
 .vehicle-img-wrap{
 position:relative;
 width:100%;
 height:260px;
 overflow:hidden;
 background:#0d0d0d;
 }
 /* SHARED VEHICLE SLIDESHOW: Stacked-image slideshow styles used by the Escalade and Tesla card/modal galleries. */
 .image-slideshow{
 position:relative;
 width:100%;
 height:100%;
 overflow:hidden;
 }
 .slideshow-image{
 position:absolute;
 inset:0;
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center 38%;
 opacity:0;
 transition:opacity 0.9s ease,transform 0.6s ease;
 will-change:opacity,transform;
 }
 .slideshow-image.is-active{
 opacity:1;
 }
 /* SHARED SLIDESHOW ARROWS: Minimal luxury previous/next controls for both vehicles. */
 .slideshow-controls{
 position:absolute;
 inset:0;
 z-index:2;
 pointer-events:none;
 }
 .slideshow-arrow{
 position:absolute;
 top:50%;
 transform:translateY(-50%);
 width:46px;
 height:46px;
 border:none;
 background:linear-gradient(180deg,rgba(8,8,8,0.18) 0%,rgba(8,8,8,0.34) 100%);
 color:rgba(201,168,76,0.92);
 display:flex;
 align-items:center;
 justify-content:center;
 cursor:pointer;
 pointer-events:auto;
 transition:color 0.2s ease,background 0.2s ease,opacity 0.2s ease,transform 0.2s ease;
 opacity:0.92;
 -webkit-tap-highlight-color:transparent;
 }
 .slideshow-arrow:hover,
 .slideshow-arrow:focus-visible{
 color:var(--gold-light);
 background:linear-gradient(180deg,rgba(8,8,8,0.26) 0%,rgba(8,8,8,0.44) 100%);
 }
 .slideshow-arrow:focus-visible{
 outline:1px solid rgba(201,168,76,0.5);
 outline-offset:2px;
 }
 .slideshow-arrow-prev{left:10px;}
 .slideshow-arrow-next{right:10px;}
 .slideshow-arrow svg{
 width:18px;
 height:18px;
 stroke:currentColor;
 fill:none;
 stroke-width:1.6;
 stroke-linecap:round;
 stroke-linejoin:round;
 }
 /* SHARED SLIDESHOW DOTS: Active/inactive luxury navigation states for both vehicles. */
 .slideshow-dots{
 position:absolute;
 left:50%;
 bottom:14px;
 transform:translateX(-50%);
 z-index:2;
 display:flex;
 align-items:center;
 gap:8px;
 }
 .slideshow-dot{
 width:9px;
 height:9px;
 padding:0;
 border:none;
 border-radius:50%;
 background:rgba(201,168,76,0.26);
 box-shadow:0 0 0 1px rgba(255,255,255,0.08);
 cursor:pointer;
 transition:background 0.2s ease,transform 0.2s ease,box-shadow 0.2s ease;
 -webkit-tap-highlight-color:transparent;
 }
 .slideshow-dot:hover,
 .slideshow-dot:focus-visible{
 background:rgba(226,194,120,0.62);
 transform:scale(1.05);
 }
 .slideshow-dot:focus-visible{
 outline:1px solid rgba(201,168,76,0.5);
 outline-offset:3px;
 }
 .slideshow-dot.is-active{
 background:var(--gold);
 box-shadow:0 0 0 1px rgba(201,168,76,0.2),0 0 12px rgba(201,168,76,0.24);
 transform:scale(1.08);
 }
 .vehicle-img-wrap img{
 width:100%;
 height:100%;
 object-fit:cover;
 object-position:center 38%;
 transition:opacity 0.9s ease,transform 0.6s ease;
 }
 .vehicle-card:hover .vehicle-img-wrap img,
 .vehicle-card:hover .vehicle-img-wrap .slideshow-image{
 transform:scale(1.04);
 }
 .vehicle-price-badge{
 position:absolute;
 top:16px;
 right:16px;
 background:rgba(8,8,8,0.85);
 border:1px solid rgba(201,168,76,0.4);
 border-radius:var(--radius);
 padding:8px 14px;
 text-align:center;
 backdrop-filter:blur(8px);
}
 .vehicle-price-badge .from{
 font-size:9px;
 letter-spacing:2px;
 text-transform:uppercase;
 color:var(--text-muted);
 display:block;
}
 .vehicle-price-badge .price{
 font-family:var(--font-display);
 font-size:1.5rem;
 font-weight:600;
 line-height:1;
 color:var(--white);
 display:block;
 margin:3px 0;
}
 .vehicle-price-badge .per-day{
 font-size:9px;
 letter-spacing:1.5px;
 text-transform:uppercase;
 color:var(--gold);
}
 .vehicle-body{
 padding:26px 24px 28px;
}
.vehicle-name{
 font-family:var(--font-display);
 font-size:2rem;
 line-height:1.05;
 font-weight:600;
 color:var(--white);
 margin-bottom:14px;
}
/* VEHICLE TITLES: Small balance refinements for the fleet card headings. */
.vehicle-name-tesla{
 text-align:center;
 margin-inline:auto;
 max-width:13ch;
 text-wrap:balance;
}
.vehicle-name-escalade{
 letter-spacing:0.01em;
}
@media (min-width:768px){
 .vehicle-name-tesla{
 max-width:none;
 white-space:nowrap;
 }
}
.vehicle-desc{
 font-size:13px;
 color:var(--text-muted);
 line-height:1.8;
 margin-bottom:20px;
}
 .vehicle-tags{
 display:flex;
 flex-wrap:wrap;
 gap:8px;
 margin-bottom:26px;
}
 .tag{
 display:inline-flex;
 align-items:center;
 justify-content:center;
 padding:7px 12px;
 border:1px solid rgba(201,168,76,0.15);
 border-radius:999px;
 color:var(--text-muted);
 font-size:10px;
 letter-spacing:1.2px;
 text-transform:uppercase;
}
 .vehicle-actions{
 display:flex;
 flex-direction:column;
 gap:12px;
}
 .vehicle-actions .btn-primary,
 .vehicle-actions .btn-outline{
 width:100%;
}
 @media (min-width:640px){
 .vehicle-actions{flex-direction:row;}
}
 /* TESTIMONIAL CAROUSEL: Update spacing, typography, and responsive card styling for the review slider here. */
 #testimonials{
 position:relative;
 overflow:hidden;
 background:
 radial-gradient(circle at top,rgba(201,168,76,0.08) 0%,rgba(201,168,76,0) 34%),
 var(--charcoal);
}
 #testimonials .section-title{
 font-size:clamp(1.9rem,8vw,3.2rem);
}
 .testimonial-carousel{
 --testimonial-gap:14px;
 --testimonial-cards-visible:1;
 width:min(100%,1120px);
 max-width:1120px;
 margin:40px auto 0;
 position:relative;
 z-index:1;
}
 .testimonial-viewport{
 overflow:visible;
}
 .testimonial-track{
 display:grid;
 gap:var(--testimonial-gap);
}
 .testimonial-slide{
 min-width:0;
}
 .testimonial-card{
 position:relative;
 display:flex;
 flex-direction:column;
 width:100%;
 min-height:100%;
 padding:22px 18px 20px;
 text-align:left;
 background:linear-gradient(180deg,rgba(24,24,24,0.98) 0%,rgba(15,15,15,0.98) 100%);
 border:1px solid rgba(201,168,76,0.18);
 border-radius:12px;
 box-shadow:0 18px 48px rgba(0,0,0,0.32);
 overflow:hidden;
 transition:border-color var(--transition),box-shadow var(--transition);
}
 .testimonial-card::before{
 content:'';
 position:absolute;
 inset:0;
 background:linear-gradient(135deg,rgba(201,168,76,0.08) 0%,rgba(201,168,76,0) 48%);
 pointer-events:none;
}
 .testimonial-card:hover{
 border-color:rgba(201,168,76,0.28);
 box-shadow:0 22px 58px rgba(0,0,0,0.4);
}
 .stars{
 display:flex;
 gap:4px;
 margin-bottom:16px;
 color:var(--gold);
}
 .stars svg{
 width:13px;
 height:13px;
 fill:currentColor;
 flex-shrink:0;
}
 .testimonial-text{
 position:relative;
 z-index:1;
 font-size:14px;
 color:var(--text);
 line-height:1.72;
 margin-bottom:18px;
 overflow-wrap:break-word;
}
 .testimonial-author{
 position:relative;
 z-index:1;
 display:flex;
 align-items:center;
 gap:13px;
 margin-top:auto;
 padding-top:18px;
 border-top:1px solid rgba(201,168,76,0.1);
}
 .author-meta{
 min-width:0;
}
 .author-avatar{
 width:40px;
 height:40px;
 border-radius:50%;
 background:rgba(201,168,76,0.14);
 color:var(--gold);
 display:flex;
 align-items:center;
 justify-content:center;
 font-family:var(--font-display);
 font-size:1.1rem;
 font-weight:600;
 flex-shrink:0;
}
 .author-name{
 font-size:13px;
 font-weight:600;
 color:var(--white);
 margin-bottom:4px;
}
 .author-role{
 font-size:10px;
 color:var(--text-muted);
 letter-spacing:1.4px;
 text-transform:uppercase;
}
 .testimonial-pagination{
 display:none;
}
 .testimonial-carousel.is-ready .testimonial-viewport{
 overflow:hidden;
 padding:2px 2px 6px;
 touch-action:pan-y;
 cursor:grab;
}
 .testimonial-carousel.is-ready .testimonial-viewport.is-dragging{
 cursor:grabbing;
 user-select:none;
}
 .testimonial-carousel.is-ready .testimonial-track{
 display:flex;
 align-items:stretch;
 gap:var(--testimonial-gap);
 will-change:transform;
 transform:translate3d(0,0,0);
 transition:transform 700ms cubic-bezier(0.22,1,0.36,1);
}
 .testimonial-carousel.is-ready .testimonial-slide{
 flex:0 0 calc((100% - (var(--testimonial-gap) * (var(--testimonial-cards-visible) - 1))) / var(--testimonial-cards-visible));
 display:flex;
}
 .testimonial-carousel.is-ready .testimonial-pagination{
 display:flex;
 justify-content:center;
 align-items:center;
 gap:10px;
 flex-wrap:wrap;
 margin-top:20px;
}
 .testimonial-dot{
 width:10px;
 height:10px;
 border-radius:999px;
 border:1px solid transparent;
 background:rgba(255,255,255,0.18);
 cursor:pointer;
 transition:background var(--transition),transform var(--transition),box-shadow var(--transition),border-color var(--transition);
}
 .testimonial-dot:hover{
 background:rgba(201,168,76,0.4);
}
 .testimonial-dot.is-active{
 background:var(--gold-light);
 border-color:rgba(201,168,76,0.4);
 box-shadow:0 0 18px rgba(201,168,76,0.35);
 transform:scale(1.12);
}
 .testimonial-dot:focus-visible{
 outline:none;
 box-shadow:0 0 0 3px rgba(201,168,76,0.22);
}
 @media (max-width:479px){
 .testimonial-carousel{margin-top:36px;}
 .testimonial-card{padding:20px 17px 18px;}
 .testimonial-text{
 font-size:13px;
 line-height:1.68;
 margin-bottom:16px;
}
 .testimonial-author{padding-top:16px;}
 .author-role{
 font-size:9.5px;
 letter-spacing:1.2px;
}
 .testimonial-carousel.is-ready .testimonial-pagination{margin-top:18px;}
}
 @media (min-width:768px){
 .testimonial-carousel{
 --testimonial-gap:18px;
 margin-top:48px;
}
 .testimonial-card{padding:28px 24px 24px;}
 .stars{margin-bottom:18px;}
 .stars svg{
 width:14px;
 height:14px;
}
 .testimonial-text{
 font-size:14px;
 line-height:1.8;
 margin-bottom:22px;
}
 .author-avatar{
 width:44px;
 height:44px;
 font-size:1.2rem;
}
 .author-name{font-size:14px;}
 .author-role{
 font-size:10px;
 letter-spacing:1.6px;
}
}
 @media (min-width:1024px){
 .testimonial-carousel{--testimonial-gap:20px;}
 .testimonial-card{padding:30px 26px 26px;}
}
 #booking{
 background:radial-gradient(circle at top,#171717 0%,#0b0b0b 55%,#060606 100%);
 position:relative;
}
 #booking::before{
 content:'';
 position:absolute;
 inset:0;
 background:
 linear-gradient(rgba(201,168,76,0.03) 1px,transparent 1px),
 linear-gradient(90deg,rgba(201,168,76,0.03) 1px,transparent 1px);
 background-size:60px 60px;
 mask-image:radial-gradient(circle at center,black,transparent 78%);
 pointer-events:none;
}
 .booking-inner{
 position:relative;
 z-index:1;
 max-width:780px;
 margin:0 auto;
}
 .booking-form{
 margin-top:42px;
 background:rgba(20,20,20,0.95);
 border:1px solid rgba(201,168,76,0.14);
 border-radius:var(--radius);
 padding:26px 18px 24px;
 text-align:left;
 box-shadow:0 20px 50px rgba(0,0,0,0.35);
}
 @media (min-width:640px){
 .booking-form{padding:34px 32px 30px;}
}
 .form-row{
 display:grid;
 gap:18px;
 margin-bottom:18px;
}
 .form-row.two{
 grid-template-columns:1fr;
}
 @media (min-width:640px){
 .form-row.two{grid-template-columns:repeat(2,1fr);}
}
 .form-group{
 margin-bottom:18px;
}
 .form-group label{
 display:block;
 font-size:11px;
 letter-spacing:2px;
 text-transform:uppercase;
 color:var(--gold);
 margin-bottom:10px;
}
 .form-group input:not([type="checkbox"]),
 .form-group select{
 width:100%;
 background:#0c0c0c;
 border:1px solid rgba(255,255,255,0.08);
 border-radius:var(--radius);
 color:var(--white);
 padding:16px 16px;
 font-family:var(--font-body);
 font-size:14px;
 outline:none;
 transition:border-color 0.25s,box-shadow 0.25s,background 0.25s;
 appearance:none;
}
 .form-group input:not([type="checkbox"])::placeholder{
 color:rgba(255,255,255,0.25);
}
 .form-group input:not([type="checkbox"]):focus,
 .form-group select:focus{
 border-color:rgba(201,168,76,0.45);
 box-shadow:0 0 0 4px rgba(201,168,76,0.08);
 background:#101010;
 }
 /* DATE PICKER ICON COLOR STYLING */
 /* Native date picker icon workaround: tint the WebKit calendar indicators without changing field behavior or clickability. */
 #pickup::-webkit-calendar-picker-indicator,
 #dropoff::-webkit-calendar-picker-indicator{
 opacity:0.82;
 filter:invert(78%) sepia(23%) saturate(694%) hue-rotate(358deg) brightness(95%) contrast(90%);
 cursor:pointer;
 }
 #pickup:focus::-webkit-calendar-picker-indicator,
 #dropoff:focus::-webkit-calendar-picker-indicator{
 opacity:0.92;
 }
 /* BOOKING RANGE DISPLAY STYLING */
 .booking-range-summary{
 margin:0 0 18px;
 padding:14px 16px 13px;
 border:1px solid rgba(201,168,76,0.16);
 border-radius:var(--radius);
 background:linear-gradient(135deg,rgba(201,168,76,0.08),rgba(201,168,76,0.02));
 text-align:left;
 }
 .booking-range-label{
 display:block;
 font-size:10px;
 font-weight:600;
 letter-spacing:2px;
 text-transform:uppercase;
 color:var(--gold);
 margin-bottom:7px;
 }
 .booking-range-value{
 font-family:var(--font-display);
 font-size:1.4rem;
 font-weight:600;
 line-height:1.18;
 color:var(--white);
 }
 .booking-range-meta{
 font-size:11px;
 color:var(--text-muted);
 line-height:1.6;
 margin-top:4px;
 }
 .form-consent{
 margin:2px 0 20px;
 }
 .consent-option{
 display:grid;
 grid-template-columns:auto 1fr;
 gap:12px;
 align-items:flex-start;
 color:var(--text-muted);
 font-size:11px;
 line-height:1.7;
 letter-spacing:0.2px;
 cursor:pointer;
}
 .consent-option input{
 width:18px;
 height:18px;
 margin-top:2px;
 accent-color:var(--gold);
 flex-shrink:0;
}
 .consent-copy{
 display:block;
}
 .consent-option.consent-invalid{
 outline:1px solid rgba(201,168,76,0.38);
 outline-offset:8px;
 border-radius:2px;
}
 .consent-disclaimer{
 font-size:10px;
 color:var(--text-muted);
 line-height:1.6;
 margin-top:10px;
 padding-left:30px;
}
 .consent-disclaimer a{
 color:var(--gold-light);
 text-decoration:none;
 border-bottom:1px solid rgba(201,168,76,0.22);
 transition:color var(--transition),border-color var(--transition);
}
 .consent-disclaimer a:hover{
 color:var(--gold);
 border-color:rgba(201,168,76,0.45);
}
 .consent-disclaimer a:focus-visible{
 outline:none;
 color:var(--gold);
 border-color:rgba(201,168,76,0.55);
}
 @media (max-width:479px){
 .form-consent{margin:0 0 18px;}
 .consent-option{
 gap:10px;
 font-size:10.5px;
 line-height:1.65;
}
 .consent-option input{
 width:17px;
 height:17px;
}
 .booking-range-summary{
 padding:12px 14px;
 }
 .booking-range-label{
 font-size:9.5px;
 }
 .booking-range-value{
 font-size:1.2rem;
 }
 .booking-range-meta{
 font-size:10px;
 }
 .consent-disclaimer{
 font-size:9.5px;
 padding-left:27px;
}
}
 .select-wrap{
 position:relative;
}
 .select-wrap::after{
 content:'';
 position:absolute;
 right:18px;
 top:50%;
 width:8px;
 height:8px;
 border-right:1px solid var(--gold);
 border-bottom:1px solid var(--gold);
 transform:translateY(-60%) rotate(45deg);
 pointer-events:none;
}
 .booking-form .btn-primary{
 width:100%;
 margin-top:8px;
 padding:18px;
}
 .booking-note{
 font-size:11px;
 color:var(--text-muted);
 text-align:center;
 margin-top:16px;
 line-height:1.6;
}
 .field-error{
 margin:7px 0 0;
 font-size:10.5px;
 letter-spacing:0.06em;
 text-transform:uppercase;
 color:#c9a84c;
 font-family:inherit;
 line-height:1.4;
}
 .modal-backdrop{
 position:fixed;
 inset:0;
 z-index:2000;
 background:rgba(0,0,0,0.88);
 backdrop-filter:blur(8px);
 display:flex;
 align-items:flex-end;
 justify-content:center;
 opacity:0;
 pointer-events:none;
 transition:opacity 0.3s ease;
}
 .modal-backdrop.open{
 opacity:1;
 pointer-events:all;
}
 @media (min-width:640px){
 .modal-backdrop{align-items:center;}
}
 .modal{
 background:var(--card-bg);
 border:1px solid var(--card-border);
 border-radius:12px 12px 0 0;
 width:100%;
 max-width:560px;
 max-height:90svh;
 overflow-y:auto;
 transform:translateY(40px);
 transition:transform 0.4s cubic-bezier(0.34,1.56,0.64,1);
 scrollbar-width:none;
}
 .modal::-webkit-scrollbar{display:none;}
 .modal-backdrop.open .modal{
 transform:translateY(0);
}
 @media (min-width:640px){
 .modal{
 border-radius:12px;
 max-height:85svh;
 transform:translateY(20px) scale(0.97);
}
 .modal-backdrop.open .modal{
 transform:translateY(0) scale(1);
}
}
 .modal-img{
 width:100%;
 height:240px;
 object-fit:cover;
 object-position:center 38%;
 }
 .modal-slideshow{
 height:240px;
 }
 .modal-body{
 padding:28px 24px 32px;
}
 .modal-close{
 position:absolute;
 top:16px;
 right:16px;
 width:36px;
 height:36px;
 border-radius:50%;
 background:rgba(0,0,0,0.5);
 border:1px solid rgba(255,255,255,0.15);
 display:flex;
 align-items:center;
 justify-content:center;
 cursor:pointer;
 color:var(--white);
 font-size:18px;
 transition:background 0.2s;
 z-index:10;
}
 .modal-close:hover{background:rgba(201,168,76,0.25);}
 .modal-img-wrap{position:relative;}
 .modal-title{
 font-family:var(--font-display);
 font-size:1.7rem;
 font-weight:600;
 color:var(--white);
 margin-bottom:10px;
}
 .modal-desc{
 font-size:13px;
 color:var(--text-muted);
 line-height:1.7;
 margin-bottom:24px;
}
 .modal-details{
 display:flex;
 flex-direction:column;
 gap:10px;
 margin-bottom:28px;
}
 .modal-detail-row{
 display:flex;
 align-items:center;
 gap:12px;
 font-size:13px;
 color:var(--text);
}
 .modal-detail-row svg{
 width:15px;
 height:15px;
 stroke:var(--gold);
 fill:none;
 stroke-width:1.8;
 flex-shrink:0;
}
 .modal .btn-primary{
 width:100%;
 padding:17px;
 }
 /* SUCCESS POPUP STYLING */
 .modal-backdrop-success{
 align-items:center;
 padding:24px 18px;
 overflow:hidden;
 }
 .success-celebration-canvas{
 position:absolute;
 inset:0;
 width:100%;
 height:100%;
 pointer-events:none;
 z-index:0;
 }
 .modal-success{
 position:relative;
 z-index:1;
 max-width:500px;
 max-height:none;
 overflow:hidden;
 border-radius:14px;
 background:linear-gradient(180deg,rgba(20,20,20,0.98) 0%,rgba(12,12,12,0.98) 100%);
 transform:translateY(18px) scale(0.98);
 }
 .modal-backdrop-success.open .modal-success{
 transform:translateY(0) scale(1);
 }
 .success-modal-body{
 padding:34px 24px 30px;
 text-align:center;
 }
 .success-modal-title{
 margin-bottom:0;
 }
 .success-modal-divider{
 margin:16px auto 18px;
 }
 .success-modal-desc{
 max-width:32ch;
 margin:0 auto 24px;
 }
 .success-modal-note{
 font-size:11px;
 color:var(--text-muted);
 line-height:1.65;
 margin-top:14px;
 }
 @media (min-width:640px){
 .modal-backdrop-success{
 padding:28px 24px;
 }
 .success-modal-body{
 padding:42px 38px 36px;
 }
 .success-modal-title{
 font-size:2rem;
 }
 }
 @media (max-width:479px){
 .modal-backdrop-success{
 padding:18px 14px;
 }
 .modal-success{
 border-radius:12px;
 }
 .success-modal-body{
 padding:28px 18px 24px;
 }
 .success-modal-title{
 font-size:1.6rem;
 }
 .success-modal-desc{
 font-size:12px;
 margin-bottom:22px;
 }
 .success-modal-note{
 font-size:10px;
 }
 }
 footer{
 background:#050505;
 padding:50px 24px 32px;
 text-align:center;
 border-top:1px solid rgba(201,168,76,0.12);
}
 .footer-logo{
 width:110px;
 margin:0 auto 20px;
 opacity:0.9;
}
 .footer-tagline{
 font-size:11px;
 color:var(--text-muted);
 letter-spacing:2px;
 text-transform:uppercase;
 margin-bottom:28px;
}
 .footer-links{
 display:flex;
 flex-wrap:wrap;
 justify-content:center;
 gap:8px 24px;
 margin-bottom:28px;
}
 .footer-links a{
 font-size:11px;
 color:var(--text-muted);
 letter-spacing:1px;
 text-transform:uppercase;
 transition:color 0.2s;
}
 .footer-links a:hover{color:var(--gold);}
 .footer-social{
 display:flex;
 justify-content:center;
 gap:14px;
 margin-bottom:32px;
}
 .footer-social a{
 width:38px;
 height:38px;
 border-radius:50%;
 border:1px solid rgba(201,168,76,0.25);
 display:flex;
 align-items:center;
 justify-content:center;
 color:var(--text-muted);
 transition:border-color 0.2s,color 0.2s;
}
 .footer-social a:hover{border-color:var(--gold);color:var(--gold);}
 .footer-social svg{width:15px;height:15px;fill:currentColor;}
 .footer-copy{
 font-size:11px;
 color:rgba(255,255,255,0.2);
 letter-spacing:0.5px;
}
 .whatsapp-btn{
 position:fixed;
 bottom:28px;
 right:28px;
 z-index:999;
 width:58px;
 height:58px;
 background:#25d366;
 border-radius:50%;
 display:flex;
 align-items:center;
 justify-content:center;
 box-shadow:0 4px 18px rgba(37,211,102,0.45);
 transition:transform 0.2s ease,box-shadow 0.2s ease;
 text-decoration:none;
}
 .whatsapp-btn:hover{
 transform:scale(1.1);
 box-shadow:0 6px 24px rgba(37,211,102,0.6);
}
 .whatsapp-btn svg{width:30px;height:30px;fill:#fff;}
 .footer-phone{
 display:inline-block;
 color:var(--gold);
 font-family:var(--font-body);
 font-size:0.95rem;
 letter-spacing:0.05em;
 text-decoration:none;
 margin-bottom:14px;
 transition:color 0.2s;
}
 .footer-phone:hover{color:var(--gold-light);}
 @media (max-width:767px){
 #hero{
 min-height:100svh;
 padding-top:34px;
 padding-bottom:92px;
}
 .hero-title{font-size:clamp(2.4rem,12vw,3.8rem);}
 .hero-sub{max-width:340px;}
 .hero-scroll{bottom:20px;}
 .section{padding:78px 20px;}
 .vehicle-name{font-size:1.75rem;}
 .vehicle-name-tesla{
 max-width:12ch;
 }
 .vehicle-img-wrap{height:230px;}
 .slideshow-arrow{
 width:44px;
 height:44px;
 }
 .slideshow-arrow-prev{left:8px;}
 .slideshow-arrow-next{right:8px;}
 .slideshow-dots{
 bottom:12px;
 gap:7px;
 }
 .modal-body{padding:24px 20px 28px;}
 .booking-form{padding:24px 16px 22px;}
 .whatsapp-btn{
 width:54px;
 height:54px;
 right:18px;
 bottom:18px;
}
 .whatsapp-btn svg{
 width:28px;
 height:28px;
}
}
 /* Legal Pages */
 .legal-page{
 min-height:100svh;
 background:radial-gradient(circle at top,#171717 0%,#0b0b0b 55%,#060606 100%);
 }
 .legal-shell{
 width:min(100%,920px);
 margin:0 auto;
 padding:24px 20px 72px;
 }
 .legal-back{
 display:inline-flex;
 align-items:center;
 gap:8px;
 color:var(--gold);
 font-size:11px;
 font-weight:600;
 letter-spacing:2px;
 text-transform:uppercase;
 transition:color var(--transition),transform var(--transition);
 }
 .legal-back:hover{
 color:var(--gold-light);
 transform:translateX(-2px);
 }
 .legal-card{
 margin-top:18px;
 background:rgba(20,20,20,0.95);
 border:1px solid rgba(201,168,76,0.14);
 border-radius:var(--radius);
 padding:28px 18px 32px;
 box-shadow:0 20px 50px rgba(0,0,0,0.35);
 }
 .legal-header{
 text-align:center;
 margin-bottom:30px;
 }
 .legal-logo{
 width:112px;
 margin:0 auto 18px;
 filter:drop-shadow(0 4px 20px rgba(201,168,76,0.22));
 }
 .legal-page-title{
 font-family:var(--font-display);
 font-size:clamp(2.15rem,8vw,3.45rem);
 font-weight:600;
 line-height:1.08;
 color:var(--white);
 }
 .legal-header .divider{
 margin:18px auto 0;
 }
 .legal-content{
 max-width:720px;
 margin:0 auto;
 text-align:left;
 }
 .legal-content h2{
 font-family:var(--font-display);
 font-size:1.95rem;
 font-weight:600;
 line-height:1.15;
 color:var(--white);
 margin-bottom:10px;
 }
 .legal-effective{
 font-size:13px;
 color:var(--gold-light);
 margin-bottom:22px;
 }
 .legal-section{
 margin-top:26px;
 }
 .legal-section h3{
 font-family:var(--font-display);
 font-size:1.35rem;
 font-weight:600;
 color:var(--white);
 margin-bottom:12px;
 }
 .legal-content p{
 font-size:13px;
 color:var(--text-muted);
 line-height:1.85;
 margin-bottom:14px;
 }
 .legal-content ul{
 list-style:disc;
 padding-left:20px;
 margin:0 0 18px;
 }
 .legal-content li{
 font-size:13px;
 color:var(--text-muted);
 line-height:1.85;
 margin-bottom:8px;
 }
 .legal-contact{
 color:var(--white);
 }
 .legal-content a{
 color:var(--gold-light);
 border-bottom:1px solid rgba(201,168,76,0.22);
 transition:color var(--transition),border-color var(--transition);
 }
 .legal-content a:hover{
 color:var(--gold);
 border-color:rgba(201,168,76,0.45);
 }
 @media (min-width:640px){
 .legal-shell{
 padding:38px 24px 88px;
 }
 .legal-card{
 margin-top:20px;
 padding:42px 44px 48px;
 }
 .legal-header{
 margin-bottom:36px;
 }
 }
 @media (max-width:479px){
 .legal-shell{
 padding:20px 16px 56px;
 }
 .legal-card{
 margin-top:16px;
 padding:24px 16px 28px;
 }
 .legal-logo{
 width:100px;
 margin-bottom:16px;
 }
 .legal-content h2{
 font-size:1.75rem;
 }
 .legal-effective,
 .legal-content p,
 .legal-content li{
 font-size:12px;
 line-height:1.78;
 }
 .legal-section{
 margin-top:22px;
 }
 .legal-section h3{
 font-size:1.22rem;
 }
 }

/* ============================================================
   NAVBAR
   ============================================================ */
.site-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 900;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 40px;
  height: 72px;
  background: transparent;
  border-bottom: 1px solid transparent;
  transition: background 0.5s ease, border-color 0.5s ease, backdrop-filter 0.5s ease;
}

.site-nav.scrolled {
  background: rgba(8,8,8,0.85);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  border-bottom-color: rgba(201,168,76,0.18);
}

/* Logo */
.nav-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  z-index: 2;
  position: relative;
}

.nav-logo-img {
  height: 46px;
  width: auto;
  filter: drop-shadow(0 2px 10px rgba(201,168,76,0.25));
  transition: filter 0.35s ease;
}

.nav-logo-img:hover {
  filter: drop-shadow(0 2px 20px rgba(201,168,76,0.55));
}

/* Desktop nav links — centered absolutely so CTA stays flush right */
.nav-links {
  display: flex;
  align-items: center;
  gap: 44px;
  list-style: none;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.nav-link {
  font-family: var(--font-body);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: rgba(232,232,232,0.82);
  text-decoration: none;
  position: relative;
  padding-bottom: 3px;
  transition: color 0.3s ease;
}

/* Underline expands from center on hover */
.nav-link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  right: 50%;
  height: 1px;
  background: var(--gold);
  transition: left 0.35s cubic-bezier(0.4,0,0.2,1),
              right 0.35s cubic-bezier(0.4,0,0.2,1);
}

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

.nav-link:hover::after {
  left: 0;
  right: 0;
}

/* CTA — reuses .btn-primary with tighter padding */
.nav-cta {
  font-size: 10px !important;
  font-weight: 700 !important;
  letter-spacing: 2.5px !important;
  padding: 12px 26px !important;
  text-decoration: none;
  flex-shrink: 0;
  z-index: 2;
  position: relative;
}

/* Hamburger button */
.nav-hamburger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  z-index: 1100;
  position: relative;
}

.nav-hamburger-bar {
  display: block;
  width: 100%;
  height: 1px;
  background: var(--gold);
  transform-origin: center;
  transition: transform 0.4s cubic-bezier(0.4,0,0.2,1),
              opacity 0.3s ease,
              width 0.3s ease;
}

/* X morph */
.nav-hamburger.is-open .nav-hamburger-bar:nth-child(1) {
  transform: translateY(7px) rotate(45deg);
}
.nav-hamburger.is-open .nav-hamburger-bar:nth-child(2) {
  opacity: 0;
  transform: scaleX(0);
}
.nav-hamburger.is-open .nav-hamburger-bar:nth-child(3) {
  transform: translateY(-7px) rotate(-45deg);
}

/* Full-screen mobile drawer */
.nav-drawer {
  position: fixed;
  inset: 0;
  z-index: 800;
  background: rgba(8,8,8,0);
  visibility: hidden;
  pointer-events: none;
  transition: background 0.45s ease, visibility 0s linear 0.45s;
}

.nav-drawer.is-open {
  background: rgba(8,8,8,0.97);
  visibility: visible;
  pointer-events: all;
  transition: background 0.45s ease, visibility 0s linear 0s;
}

.nav-drawer-inner {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 24px 80px;
}

/* Decorative gold rule above tagline */
.nav-drawer-inner::after {
  content: '';
  position: absolute;
  bottom: 68px;
  left: 50%;
  transform: translateX(-50%);
  width: 36px;
  height: 1px;
  background: rgba(201,168,76,0.35);
}

.nav-drawer-links {
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  width: 100%;
}

/* Large editorial links in drawer */
.nav-drawer-link {
  display: block;
  font-family: var(--font-display);
  font-size: clamp(2.4rem,9vw,3.8rem);
  font-weight: 500;
  color: rgba(232,232,232,0.65);
  text-decoration: none;
  letter-spacing: 3px;
  padding: 12px 40px;
  text-align: center;
  opacity: 0;
  transform: translateY(28px);
  transition: color 0.35s ease,
              transform 0.55s cubic-bezier(0.4,0,0.2,1),
              opacity 0.55s ease;
  will-change: transform, opacity;
}

/* Staggered reveal */
.nav-drawer.is-open .nav-drawer-links li:nth-child(1) .nav-drawer-link { transition-delay: 0.08s; opacity: 1; transform: translateY(0); }
.nav-drawer.is-open .nav-drawer-links li:nth-child(2) .nav-drawer-link { transition-delay: 0.14s; opacity: 1; transform: translateY(0); }
.nav-drawer.is-open .nav-drawer-links li:nth-child(3) .nav-drawer-link { transition-delay: 0.20s; opacity: 1; transform: translateY(0); }
.nav-drawer.is-open .nav-drawer-links li:nth-child(4) .nav-drawer-link { transition-delay: 0.26s; opacity: 1; transform: translateY(0); }

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

/* Book Now CTA inside drawer — uses body font + border */
.nav-drawer-cta {
  margin-top: 32px;
  font-family: var(--font-body) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 3px !important;
  text-transform: uppercase;
  color: var(--gold) !important;
  border: 1px solid rgba(201,168,76,0.35);
  padding: 16px 48px !important;
  border-radius: var(--radius);
}

.nav-drawer-cta:hover {
  background: rgba(201,168,76,0.07);
  border-color: rgba(201,168,76,0.65);
  color: var(--gold-light) !important;
}

/* Brand tagline at drawer bottom */
.nav-drawer-tagline {
  position: absolute;
  bottom: 36px;
  left: 0;
  right: 0;
  text-align: center;
  font-family: var(--font-body);
  font-size: 9px;
  font-weight: 600;
  letter-spacing: 4px;
  text-transform: uppercase;
  color: var(--text-muted);
  opacity: 0;
  transition: opacity 0.4s ease 0.32s;
}

.nav-drawer.is-open .nav-drawer-tagline {
  opacity: 0.55;
}

/* Scroll offset so sections don't slide under the fixed nav */
#why, #fleet, #testimonials, #booking {
  scroll-margin-top: 72px;
}

/* Mobile — hide desktop links, show hamburger */
@media (max-width: 767px) {
  .site-nav {
    padding: 0 20px;
    height: 64px;
  }
  .nav-links,
  .nav-cta {
    display: none;
  }
  .nav-hamburger {
    display: flex;
  }
  #why, #fleet, #testimonials, #booking {
    scroll-margin-top: 64px;
  }
}

/* Tablet — tighten gaps */
@media (min-width: 768px) and (max-width: 1023px) {
  .site-nav {
    padding: 0 28px;
  }
  .nav-links {
    gap: 28px;
  }
}
