:root{--ink:#15253b;--muted:#697487;--orange:#ff642f;--orange-dark:#f34c20;--blue:#153cdb;--pale:#f6f7fb;--line:#e8eaf0;--white:#fff;--radius:22px;--shadow:0 22px 60px rgba(23,38,69,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;font-family:"DM Sans",sans-serif;color:var(--ink);background:#fff}a{color:inherit;text-decoration:none}button,input{font:inherit}.container{width:min(1160px,calc(100% - 48px));margin-inline:auto}.site-header{height:82px;display:flex;align-items:center;background:rgba(255,255,255,.94);position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(232,234,240,.8);backdrop-filter:blur(12px)}.nav{display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;gap:7px;font-family:Manrope,sans-serif;font-weight:800;letter-spacing:-1px}.brand-mark{font-size:25px;line-height:1;color:var(--blue);letter-spacing:-2px}.brand-mark span{color:var(--orange);font-size:18px;vertical-align:top}.brand-name{font-size:21px;letter-spacing:1.5px}.nav-links{display:flex;align-items:center;gap:35px;font-size:13px;font-weight:700;color:#455168}.nav-links>a:not(.nav-cta):hover,.footer-links a:hover{color:var(--orange)}.nav-cta{background:var(--orange);color:white;padding:13px 19px;border-radius:9px;transition:transform .2s,background .2s}.nav-cta:hover,.button-primary:hover{background:var(--orange-dark);transform:translateY(-2px)}.nav-cta span{margin-left:10px}.menu-toggle{display:none;border:0;background:none;padding:8px}.menu-toggle span{display:block;width:23px;height:2px;background:var(--ink);margin:5px}
.hero{position:relative;overflow:hidden;background:linear-gradient(115deg,#fbfcff 0%,#f5f7ff 58%,#fff6f1 100%);padding:75px 0 0}.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:28px;min-height:420px}.hero-copy{position:relative;z-index:2;padding-bottom:65px}.eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:800;letter-spacing:1.7px;color:#59647a}.eyebrow-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);display:inline-block;box-shadow:0 0 0 4px rgba(255,100,47,.12)}h1,h2,h3,p{margin-top:0}h1,h2{font-family:Manrope,sans-serif;letter-spacing:-2.8px;font-weight:800}h1{font-size:clamp(48px,5.8vw,76px);line-height:1.04;margin:23px 0 20px}h1 span,h2 span{color:var(--orange)}.hero-text{max-width:420px;font-size:16px;line-height:1.8;color:#647087;margin-bottom:26px}.hero-actions{display:flex;align-items:center;gap:26px}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;border:0;border-radius:9px;padding:16px 20px;font-size:13px;font-weight:800;transition:transform .2s,background .2s;cursor:pointer}.button-primary{background:var(--orange);color:#fff;box-shadow:0 10px 22px rgba(255,100,47,.18)}.button span{font-size:17px}.text-link{font-size:13px;font-weight:800;display:inline-flex;align-items:center;gap:10px}.text-link span{font-size:18px;color:var(--orange);transition:transform .2s}.text-link:hover span{transform:translateX(4px)}.hero-trust{display:flex;align-items:center;gap:13px;margin-top:35px}.trust-avatars{display:flex;padding-left:4px}.trust-avatars span{display:grid;place-items:center;width:31px;height:31px;border-radius:50%;border:2px solid #fff;margin-left:-4px;background:#173cd7;color:#fff;font-weight:800;font-size:11px}.trust-avatars span:nth-child(2){background:#ffb43e}.trust-avatars span:nth-child(3){background:#ff6332}.hero-trust strong,.hero-trust small{display:block}.hero-trust strong{font-size:11px}.hero-trust small{font-size:10px;color:var(--muted);margin-top:4px}.hero-visual{position:relative;min-height:405px;display:flex;align-items:center;justify-content:center}.hero-shape{position:absolute;border-radius:50%;pointer-events:none}.hero-shape-one{width:460px;height:460px;background:#e7ebff;right:-90px;top:-180px;opacity:.75}.hero-shape-two{width:210px;height:210px;background:#ffe5d9;left:43%;bottom:30px;opacity:.7}.visual-sun{position:absolute;width:285px;height:285px;border-radius:50%;background:#ffcc9e;right:65px;top:40px;opacity:.7}.car-placeholder{display:none;position:relative;z-index:3;flex-direction:column;align-items:center;gap:7px;padding:24px;text-align:center;color:var(--ink)}.placeholder-car{font-size:130px;filter:drop-shadow(0 15px 8px #bbc2d5)}.car-placeholder strong{font-size:14px}.car-placeholder span{font-size:11px;color:var(--muted)}code{background:#eef0f6;padding:3px 5px;border-radius:4px}.visual-label{position:absolute;z-index:4;top:25px;left:10px;display:flex;align-items:center;gap:10px;padding:12px 15px;background:#fff;border-radius:12px;box-shadow:var(--shadow)}.label-icon{display:grid;place-items:center;background:#fff0e9;color:var(--orange);width:35px;height:35px;border-radius:9px;font-size:18px}.visual-label strong,.visual-label small{display:block}.visual-label strong{font-size:11px}.visual-label small{font-size:9px;color:var(--muted);margin-top:4px}.visual-sticker{position:absolute;z-index:5;right:12px;bottom:44px;width:91px;height:91px;background:var(--orange);color:#fff;border-radius:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;transform:rotate(10deg);box-shadow:0 12px 24px #ff642f40}.visual-sticker span{font-size:10px;letter-spacing:2px}.visual-sticker b{font-size:16px;line-height:.95;text-align:center}.visual-sticker i{font-style:normal;position:absolute;right:15px;top:13px;font-size:15px}.visual-caption{position:absolute;left:20px;bottom:34px;display:flex;align-items:center;gap:10px;font-size:9px;letter-spacing:2px;font-weight:800;color:#67738a}.caption-line{height:1px;width:33px;background:var(--orange)}
.booking-wrap{position:relative;z-index:6;transform:translateY(32px)}.booking-bar{display:grid;grid-template-columns:1.1fr 1.25fr 1fr 1fr auto;align-items:center;gap:18px;background:#fff;padding:21px 23px;border:1px solid #edf0f5;border-radius:16px;box-shadow:0 20px 60px rgba(26,43,77,.1)}.booking-heading{display:flex;align-items:center;gap:10px}.booking-icon{width:38px;height:38px;display:grid;place-items:center;background:#eef1ff;color:var(--blue);font-size:24px;border-radius:10px}.booking-heading strong,.booking-heading small{display:block}.booking-heading strong{font-size:12px}.booking-heading small{font-size:10px;color:var(--muted);margin-top:4px}.booking-field{display:flex;flex-direction:column;gap:7px;border-left:1px solid var(--line);padding-left:17px;min-width:0}.booking-field span{font-size:10px;font-weight:800;color:#5d687c}.booking-field input{border:0;outline:0;width:100%;font-size:11px;color:var(--ink);background:transparent;min-width:0}.booking-field input::placeholder{color:#a3aab7}.booking-submit{white-space:nowrap;padding:16px 18px;background:var(--blue);color:#fff}.booking-submit:hover{background:#0c2db9;transform:translateY(-2px)}.form-note{margin:38px 0 0;text-align:center;font-size:12px;color:var(--blue);min-height:16px}
.section{padding:110px 0}.cars-section{padding-top:105px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:34px}.section-heading h2,.how-copy h2,.why-copy h2,.final-cta h2{font-size:clamp(36px,4.2vw,52px);line-height:1.13;margin:17px 0 0}.section-heading .text-link{margin-bottom:8px}.car-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.car-card{border:1px solid #eceef4;border-radius:17px;overflow:hidden;background:#fff;transition:transform .25s,box-shadow .25s}.car-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.car-image{height:220px;position:relative;display:grid;place-items:center;overflow:hidden}.car-image-blue{background:#eaf0ff}.car-image-orange{background:#fff0e7}.car-image-lilac{background:#f0edff}.car-image img{position:relative;z-index:2;width:100%;height:100%;object-fit:contain;padding:28px 13px;mix-blend-mode:multiply}.car-tag{position:absolute;z-index:3;top:16px;left:16px;background:#fff;border-radius:6px;padding:7px 9px;font-size:8px;font-weight:800;letter-spacing:1px}.car-fallback{display:none;place-items:center;gap:4px;font-size:72px}.car-fallback small{font-size:10px;color:#657086}.car-info{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 13px}.car-info h3{font-family:Manrope,sans-serif;font-size:17px;letter-spacing:-.5px;margin-bottom:6px}.car-info p{font-size:11px;color:var(--muted);margin:0}.car-arrow{width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;color:var(--orange);font-size:17px}.car-meta{display:flex;gap:15px;padding:0 20px 20px;font-size:9px;color:#727d90}.car-meta span:first-child{color:#4f5b70}.section-footnote{font-size:10px;color:#929aaa;margin-top:20px}
.how-section{background:#f6f7fb}.how-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:90px;align-items:center}.how-copy h2{margin-bottom:20px}.how-copy>p{font-size:14px;line-height:1.8;color:var(--muted);max-width:320px;margin-bottom:25px}.steps{border-top:1px solid #dfe3ed}.step{display:grid;grid-template-columns:54px 1fr 40px;align-items:center;gap:17px;padding:25px 0;border-bottom:1px solid #dfe3ed}.step-number{font-family:Manrope,sans-serif;font-size:13px;font-weight:800;color:var(--orange)}.step h3{font-family:Manrope,sans-serif;font-size:16px;margin-bottom:7px}.step p{font-size:12px;line-height:1.7;color:var(--muted);margin:0;max-width:390px}.step-symbol{width:39px;height:39px;border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--blue);font-size:21px}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:95px;align-items:center}.why-art{height:410px;position:relative;background:#fff2eb;border-radius:24px;overflow:hidden}.art-circle{position:absolute;width:270px;height:270px;border-radius:50%;background:#ffbd95;top:42px;left:50%;transform:translateX(-50%)}.art-sun{position:absolute;width:52px;height:52px;border-radius:50%;background:#fff0b5;top:56px;right:56px}.art-road{position:absolute;left:-10%;right:-10%;height:130px;bottom:50px;background:#27344d;border-radius:50% 50% 0 0/40% 40% 0 0;transform:rotate(-8deg);display:flex;align-items:center;justify-content:center}.art-road:after{content:"";position:absolute;top:57px;left:0;right:0;border-top:3px dashed #fff;opacity:.8}.art-road span{position:relative;z-index:2;color:#fff;font-family:Manrope,sans-serif;font-weight:800;font-size:28px;letter-spacing:4px;transform:rotate(8deg)}.art-note{position:absolute;left:28px;top:34px;font-family:Manrope,sans-serif;font-size:17px;font-weight:800;line-height:1.1;letter-spacing:1px;color:var(--blue);transform:rotate(-7deg)}.art-note b{color:var(--orange);font-size:24px}.why-copy h2{margin-bottom:20px}.why-copy>p{font-size:14px;line-height:1.9;color:var(--muted);max-width:450px;margin-bottom:27px}.benefits{display:grid;gap:16px}.benefits>div{display:flex;align-items:center;gap:13px}.benefits>div>span{width:39px;height:39px;display:grid;place-items:center;border-radius:11px;background:#fff0e9;color:var(--orange);font-size:19px}.benefits p{margin:0}.benefits strong,.benefits small{display:block}.benefits strong{font-size:12px}.benefits small{font-size:10px;color:var(--muted);margin-top:4px}
.final-cta{background:var(--blue);color:#fff;overflow:hidden}.final-cta-inner{min-height:270px;display:flex;align-items:center;justify-content:space-between;position:relative;padding:45px 0}.eyebrow-light{color:#d7ddff}.eyebrow-light .eyebrow-dot{background:#ffb14a;box-shadow:0 0 0 4px #ffffff1a}.final-cta h2{font-size:48px;margin-top:18px}.final-cta h2 span{color:#ffb14a}.button-white{background:#fff;color:var(--blue);position:relative;z-index:2}.button-white:hover{transform:translateY(-3px);background:#fff2e9}.cta-doodle{position:absolute;font-size:200px;right:20%;top:-70px;color:#ffffff0b;line-height:1}
.footer{background:#111f36;color:#fff}.footer-main{display:flex;align-items:center;gap:50px;padding:40px 0 32px}.brand-footer .brand-mark{color:#fff}.brand-footer .brand-mark span{color:#ffb14a}.brand-footer .brand-name{color:#fff}.footer-main>p{font-size:11px;line-height:1.8;color:#aab4c8;margin:0}.footer-links{margin-left:auto;display:flex;gap:25px;font-size:11px;color:#dce2ef}.footer-bottom{border-top:1px solid #29364b;display:flex;justify-content:space-between;padding:17px 0 20px;font-size:9px;color:#8995aa}
@media(max-width:950px){.hero-grid{grid-template-columns:1fr 1fr;gap:0}.hero-copy{padding-bottom:45px}.hero-visual{min-height:350px}.visual-label{left:0}.booking-bar{grid-template-columns:1fr 1fr;gap:18px}.booking-heading{grid-column:1/-1}.booking-field{padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:14px}.booking-submit{align-self:end}.cars-section{padding-top:120px}.how-grid,.why-grid{gap:45px}.car-image{height:190px}.car-meta{flex-wrap:wrap;gap:8px}.footer-main{gap:28px}.footer-links{gap:15px}}
@media(max-width:700px){.container{width:min(100% - 34px,500px)}.site-header{height:70px}.menu-toggle{display:block}.nav-links{display:none;position:absolute;top:69px;left:0;right:0;background:#fff;padding:20px 24px 24px;box-shadow:0 15px 25px #18243a12;flex-direction:column;align-items:stretch;gap:20px}.nav-links.open{display:flex}.nav-cta{text-align:center}.hero{padding-top:45px}.hero-grid{display:flex;flex-direction:column;align-items:stretch}.hero-copy{padding-bottom:0}.hero h1{font-size:56px}.hero-text{font-size:14px}.hero-visual{min-height:300px;margin-top:8px}.visual-sun{width:220px;height:220px;right:45px;top:28px}.placeholder-car{font-size:90px}.visual-label{top:12px;left:0;padding:9px}.visual-sticker{width:75px;height:75px;right:0;bottom:25px}.visual-sticker b{font-size:13px}.visual-caption{left:0;bottom:20px;font-size:8px}.booking-wrap{transform:translateY(20px)}.booking-bar{grid-template-columns:1fr 1fr;padding:18px;gap:16px}.booking-heading{grid-column:1/-1}.booking-field{min-width:0}.booking-submit{grid-column:1/-1;width:100%}.form-note{margin-top:28px}.section{padding:75px 0}.cars-section{padding-top:90px}.section-heading{align-items:start;gap:18px;flex-direction:column;margin-bottom:25px}.section-heading h2,.how-copy h2,.why-copy h2{font-size:42px}.car-grid{grid-template-columns:1fr;gap:17px}.car-image{height:230px}.car-meta{gap:18px}.how-grid,.why-grid{grid-template-columns:1fr;gap:35px}.how-copy>p{max-width:390px}.step{grid-template-columns:42px 1fr 36px;gap:12px;padding:21px 0}.why-art{height:330px;order:2}.why-copy{order:1}.art-circle{width:220px;height:220px}.art-road{bottom:35px}.art-road span{font-size:23px}.final-cta-inner{align-items:flex-start;flex-direction:column;gap:25px;padding:45px 0}.final-cta h2{font-size:44px}.cta-doodle{right:-12px;top:15px;font-size:150px}.footer-main{align-items:flex-start;flex-direction:column;gap:20px}.footer-links{margin-left:0;flex-wrap:wrap}.footer-bottom{gap:10px;flex-direction:column}.hero-shape-one{right:-240px}.hero-shape-two{left:20%;bottom:0}}
@media(max-width:390px){.hero h1{font-size:48px}.hero-actions{gap:17px}.button{padding:14px 15px}.booking-bar{padding:14px}.booking-field input{font-size:10px}.car-image{height:200px}}


/* Search results generated by the booking form */
.search-results{margin-top:24px;padding:30px;background:#fff;border:1px solid #e9ecf4;border-radius:18px;box-shadow:0 18px 50px rgba(26,43,77,.08);scroll-margin-top:100px}
.search-results[hidden]{display:none}
.results-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:24px}
.results-heading h2{font-size:clamp(30px,3vw,40px);line-height:1.1;margin:14px 0 8px;letter-spacing:-1.8px}
.results-heading h2 span{color:var(--orange)}
.results-heading p{font-size:12px;color:var(--muted);margin:0}
.results-reset{background:#f0f2ff;border:0;border-radius:8px;padding:12px 15px;color:var(--blue);font-size:11px;font-weight:800;white-space:nowrap;cursor:pointer}
.results-reset span{margin-left:8px}
.results-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.result-card{border:1px solid #e9ecf4;border-radius:14px;overflow:hidden;min-width:0;background:#fff}
.result-image{height:155px;position:relative;display:grid;place-items:center;overflow:hidden}
.result-image-blue{background:#eaf0ff}.result-image-orange{background:#fff0e7}.result-image-lilac{background:#f0edff}
.result-image img{width:100%;height:100%;object-fit:contain;padding:18px;mix-blend-mode:multiply}
.result-category{position:absolute;z-index:2;left:12px;top:12px;background:#fff;padding:6px 8px;border-radius:5px;font-size:8px;font-weight:800;letter-spacing:.7px}
.result-fallback{display:none;place-items:center;font-size:58px}
.result-card-body{padding:16px}
.result-title-row{display:flex;justify-content:space-between;gap:8px}
.result-title-row h3{font-family:Manrope,sans-serif;font-size:15px;margin:0 0 5px}
.result-title-row p{font-size:10px;color:var(--muted);margin:0}
.result-index{font-size:10px;color:#9ba4b5;font-weight:800}
.result-specs{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0;padding-bottom:14px;border-bottom:1px solid var(--line)}
.result-specs span{font-size:9px;color:#5d687c;background:#f5f6fa;border-radius:5px;padding:6px 7px}
.result-price-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.result-price-row strong{font-size:15px;display:inline-block}
.result-price-row small{font-size:9px;color:var(--muted);display:block;margin-top:4px}
.result-select{background:var(--blue);color:#fff;border:0;border-radius:7px;padding:10px 12px;font-size:10px;font-weight:800;cursor:pointer;white-space:nowrap}
.result-select:hover{background:#0c2db9}
.result-select span{margin-left:5px}
.results-disclaimer{font-size:10px;line-height:1.6;color:#8b94a5;margin:18px 0 0}
@media(max-width:950px){.results-grid{grid-template-columns:1fr 1fr}.result-image{height:145px}}
@media(max-width:700px){.search-results{padding:19px;margin-top:18px}.results-heading{align-items:flex-start;flex-direction:column}.results-grid{grid-template-columns:1fr}.result-image{height:200px}.result-card-body{padding:17px}}


/* YO DRIVE catalogue, booking flow and lead panel */

.search-results{margin-top:22px;padding:30px;background:#fff;border:1px solid #e9ecf4;border-radius:18px;box-shadow:0 18px 50px rgba(26,43,77,.08);scroll-margin-top:100px}
.search-results[hidden],.modal-backdrop[hidden],.admin-detail-backdrop[hidden]{display:none}
.results-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}
.results-heading h2{font-size:clamp(30px,3vw,40px);line-height:1.1;margin:14px 0 8px;letter-spacing:-1.8px}
.results-heading h2 span{color:var(--orange)}.results-heading p{font-size:12px;color:var(--muted);margin:0}
.results-reset{background:#f0f2ff;border:0;border-radius:8px;padding:12px 15px;color:var(--blue);font-size:11px;font-weight:800;cursor:pointer}
.filter-row{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px;margin-bottom:20px}
.filter-row label,.lead-form-grid label{font-size:11px;font-weight:700;color:#59647a;display:flex;flex-direction:column;gap:7px}
.filter-row input,.filter-row select,.lead-form-grid input,.lead-form-grid textarea,.status-editor select,.admin-toolbar input,.admin-toolbar select{width:100%;border:1px solid #dfe4ef;border-radius:8px;padding:12px;font:inherit;font-size:12px;background:#fff;color:var(--ink);outline-color:var(--blue)}
.results-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.result-card{border:1px solid #e9ecf4;border-radius:14px;overflow:hidden;min-width:0;background:#fff}
.result-image{height:155px;position:relative;display:grid;place-items:center;overflow:hidden}
.result-image-blue{background:#edf1ff}.result-category{position:absolute;z-index:2;left:12px;top:12px;background:#fff;padding:6px 8px;border-radius:5px;font-size:8px;font-weight:800;letter-spacing:.5px}
.result-image img{width:100%;height:100%;object-fit:contain;padding:13px;mix-blend-mode:multiply}
.result-fallback{display:none;place-items:center;font-size:58px}.result-card-body{padding:16px}
.result-title-row{display:flex;justify-content:space-between;gap:8px}.result-title-row h3{font-family:Manrope,sans-serif;font-size:15px;margin:0 0 5px}.result-title-row p{font-size:10px;line-height:1.5;color:var(--muted);margin:0}.result-index{font-size:10px;color:#9ba4b5;font-weight:800}
.result-specs{display:flex;flex-wrap:wrap;gap:7px;margin:15px 0;padding-bottom:14px;border-bottom:1px solid var(--line)}.result-specs span{font-size:9px;color:#5d687c;background:#f5f6fa;border-radius:5px;padding:6px 7px}
.result-price-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.result-price-row strong{font-size:15px;display:inline-block}.result-price-row small{font-size:9px;color:var(--muted);display:block;margin-top:4px}
.result-select{background:var(--blue);color:#fff;border:0;border-radius:7px;padding:10px 12px;font-size:10px;font-weight:800;cursor:pointer;white-space:nowrap}.result-select:hover{background:#0c2db9}.results-disclaimer,.section-footnote{font-size:10px;line-height:1.7;color:#8b94a5;margin:18px 0 0}
.car-card{border:1px solid #eceef4;border-radius:17px;overflow:hidden;background:#fff}.car-image{height:190px;position:relative;display:grid;place-items:center;background:#edf1ff;overflow:hidden}.car-image img{width:100%;height:100%;object-fit:contain;padding:18px;mix-blend-mode:multiply}.car-tag{position:absolute;z-index:2;top:12px;left:12px;background:#fff;border-radius:5px;padding:6px 8px;font-size:8px;font-weight:800}.car-fallback{display:none;place-items:center;font-size:45px}.car-fallback small{font-size:9px}.car-info{display:flex;justify-content:space-between;align-items:center;padding:16px 16px 8px}.car-info h3{font-family:Manrope,sans-serif;font-size:16px;margin:0 0 5px}.car-info p{font-size:10px;color:var(--muted);margin:0}.car-meta{display:flex;gap:12px;padding:0 16px 12px;font-size:10px;color:var(--muted)}.compact-action{padding:0 16px 16px}.compact-action .result-select{width:100%}
.empty-results{grid-column:1/-1;padding:30px;text-align:center;background:#f7f8fc;border-radius:12px}.empty-results p{font-size:12px;color:var(--muted)}
.modal-backdrop,.admin-detail-backdrop{position:fixed;inset:0;background:rgba(13,24,44,.62);z-index:100;display:grid;place-items:center;padding:20px;overflow:auto}
.booking-modal,.admin-detail{position:relative;width:min(680px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:20px;padding:32px;box-shadow:0 25px 90px #0003}
.modal-close{position:absolute;right:17px;top:13px;border:0;background:#f1f3f8;width:34px;height:34px;border-radius:50%;font-size:24px;line-height:1;cursor:pointer;color:var(--ink)}
.booking-modal h2,.admin-detail h2{font-family:Manrope,sans-serif;font-size:35px;letter-spacing:-1.5px;margin:14px 0 8px}.booking-modal h2 span{color:var(--orange)}.modal-intro{font-size:12px;color:var(--muted);line-height:1.7;margin-bottom:22px}
.lead-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.lead-form-grid .full-field{grid-column:1/-1}.lead-form-grid textarea{resize:vertical}.consent-check{display:flex;align-items:flex-start;gap:9px;margin:17px 0;font-size:11px;line-height:1.6;color:#59647a}.consent-check input{margin-top:2px}.submit-lead{width:100%}.modal-note{font-size:10px;color:#8b94a5;line-height:1.6;margin:12px 0 0}.modal-open{overflow:hidden}.toast{position:fixed;bottom:24px;right:24px;z-index:120;background:#14243d;color:#fff;border-radius:10px;padding:14px 18px;font-size:12px;box-shadow:var(--shadow);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:translateY(0)}
.admin-body{background:#f6f7fb;min-height:100vh}.admin-nav{display:flex}.admin-main{padding-top:50px;padding-bottom:70px}.admin-title{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:25px}.admin-title h1{font-size:clamp(38px,5vw,56px);margin:14px 0 8px}.admin-title h1 span{color:var(--orange)}.admin-title p{font-size:13px;color:var(--muted);margin:0}
.admin-warning{padding:15px 17px;border:1px solid #f4d4a2;background:#fff8e9;border-radius:10px;color:#76531e;font-size:11px;line-height:1.7;margin-bottom:22px}
.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:22px}.admin-stats article{background:#fff;border:1px solid #e8ebf3;border-radius:12px;padding:20px}.admin-stats small,.admin-stats strong{display:block}.admin-stats small{font-size:11px;color:var(--muted)}.admin-stats strong{font-family:Manrope,sans-serif;font-size:27px;margin-top:10px}
.admin-toolbar{display:grid;grid-template-columns:1fr 180px auto;gap:10px;margin-bottom:16px}.leads-list{display:grid;gap:12px}.lead-row{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px;background:#fff;border:1px solid #e8ebf3;border-radius:12px}.lead-status{display:inline-block;padding:5px 8px;border-radius:5px;font-size:9px;font-weight:800;background:#eaf0ff;color:#2443bd}.status-contacted{background:#fff2d9;color:#885b00}.status-confirmed{background:#e5f8ec;color:#16743b}.status-cancelled{background:#ffe9e9;color:#a62929}.lead-main h3{font-size:16px;margin:10px 0 5px}.lead-main h3 small{font-size:10px;color:#8b94a5;font-weight:500;margin-left:5px}.lead-main p{font-size:12px;color:var(--muted);margin:0 0 12px}.lead-meta{display:flex;gap:13px;flex-wrap:wrap;font-size:10px;color:#667186}.lead-value{text-align:right;min-width:150px}.lead-value strong,.lead-value small{display:block}.lead-value strong{font-size:18px}.lead-value small{font-size:10px;color:var(--muted);margin:5px 0 12px}.empty-leads{text-align:center;padding:55px 20px;background:#fff;border:1px dashed #d5dbea;border-radius:14px}.empty-leads>div{font-size:35px;color:var(--orange)}.empty-leads h3{font-size:19px;margin:12px 0 8px}.empty-leads p{font-size:12px;color:var(--muted);margin-bottom:20px}.detail-list{margin:20px 0}.detail-list>div{display:grid;grid-template-columns:140px 1fr;gap:12px;padding:11px 0;border-bottom:1px solid #edf0f5;font-size:12px}.detail-list dt{color:var(--muted)}.detail-list dd{margin:0;overflow-wrap:anywhere;font-weight:600}.status-editor{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700}.detail-actions{display:flex;gap:10px;margin-top:18px}.detail-actions .button{flex:1}
@media(max-width:950px){.results-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.car-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.result-image{height:145px}}
@media(max-width:700px){.search-results{padding:18px;margin-top:18px}.results-heading{align-items:flex-start;flex-direction:column}.filter-row{grid-template-columns:1fr}.results-grid,.car-grid{grid-template-columns:1fr}.result-image{height:200px}.booking-modal,.admin-detail{padding:25px 18px}.booking-modal h2,.admin-detail h2{font-size:29px}.lead-form-grid{grid-template-columns:1fr}.lead-form-grid .full-field{grid-column:auto}.admin-title{align-items:flex-start;flex-direction:column}.admin-stats{grid-template-columns:1fr}.admin-toolbar{grid-template-columns:1fr}.lead-row{align-items:flex-start;flex-direction:column}.lead-value{text-align:left;width:100%;border-top:1px solid #edf0f5;padding-top:14px}.detail-list>div{grid-template-columns:105px 1fr}.detail-actions{flex-direction:column}}


/* =========================================================
   YO DRIVE — HERO FIX + POLISHED INTERACTIONS
   Consolidated overrides: place at the end of the stylesheet.
   ========================================================= */

/* Motion defaults */
:root {
  --motion-fast: 180ms;
  --motion-normal: 280ms;
  --motion-slow: 650ms;
}
html { scroll-behavior: smooth; }
a, button, input, select, textarea {
  -webkit-tap-highlight-color: transparent;
}
:focus-visible {
  outline: 3px solid rgba(21, 60, 219, .42);
  outline-offset: 3px;
}

/* Hero layers: decorative shapes stay behind the vehicle. */
.hero {
  isolation: isolate;
  overflow: clip;
}
.hero-grid {
  position: relative;
  z-index: 1;
}
.hero-copy {
  animation: yd-fade-up .7s cubic-bezier(.2,.7,.2,1) both;
}
.hero-visual {
  position: relative;
  isolation: isolate;
  min-width: 0;
  overflow: visible;
  animation: yd-fade-in .85s ease-out .08s both;
}
.hero-visual:before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 35px 0;
  pointer-events: none;
  background-image: radial-gradient(rgba(189,200,237,.72) 1px, transparent 1px);
  background-size: 17px 17px;
  opacity: .48;
}
.hero-image-backdrop {
  position: absolute;
  z-index: 0;
  width: min(78%, 390px);
  aspect-ratio: 1;
  right: 7%;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  background: linear-gradient(145deg, #e8edff 0%, #f5f7ff 62%, #fff0e7 100%);
  pointer-events: none;
}
.hero-shape { z-index: 0; }
.visual-sun {
  z-index: 0;
  opacity: .58;
  pointer-events: none;
}
.hero-car {
  display: block;
  position: relative;
  z-index: 2;
  width: 100%;
  max-width: 660px;
  height: auto;
  max-height: 365px;
  object-fit: contain;
  object-position: center;
  padding: 0;
  border-radius: 0;
  background: transparent;
  mix-blend-mode: normal;
  filter: drop-shadow(0 22px 17px rgba(22,35,62,.17));
  transform: translateX(8px);
  animation: yd-car-arrive .95s cubic-bezier(.2,.7,.2,1) .12s both;
  transition: filter var(--motion-normal), transform var(--motion-normal);
}
.hero-visual:hover .hero-car {
  transform: translate(8px, -4px);
  filter: drop-shadow(0 28px 20px rgba(22,35,62,.2));
}
.car-placeholder[hidden] { display: none !important; }
.car-placeholder:not([hidden]) {
  display: flex;
  position: relative;
  z-index: 3;
  min-height: 260px;
  justify-content: center;
  align-items: center;
  text-align: center;
  gap: 8px;
  animation: yd-fade-in .35s ease both;
}
.visual-label {
  z-index: 4;
  animation: yd-fade-up .65s ease .3s both;
}
.visual-sticker {
  z-index: 5;
  animation: yd-sticker-pop .6s cubic-bezier(.2,.8,.2,1) .45s both;
  transition: transform var(--motion-normal);
}
.visual-sticker:hover { transform: rotate(0) scale(1.06); }
.visual-caption { z-index: 3; }

/* Booking bar and buttons */
.booking-bar {
  transition: box-shadow var(--motion-normal), transform var(--motion-normal);
}
.booking-bar:focus-within {
  box-shadow: 0 24px 65px rgba(26,43,77,.14);
}
.button, .nav-cta, .result-select, .results-reset {
  transition: transform var(--motion-fast), background var(--motion-fast),
    box-shadow var(--motion-fast), color var(--motion-fast);
}
.button:active, .nav-cta:active, .result-select:active {
  transform: translateY(0) scale(.98);
}

/* Catalogue cards */
.car-card, .result-card {
  transition: transform var(--motion-normal) cubic-bezier(.2,.7,.2,1),
    box-shadow var(--motion-normal), border-color var(--motion-normal);
}
.car-card:hover, .result-card:hover {
  transform: translateY(-5px);
  border-color: #dce2f4;
  box-shadow: 0 20px 45px rgba(23,38,69,.1);
}
.car-image img, .result-image img {
  mix-blend-mode: normal;
  transition: transform .4s cubic-bezier(.2,.7,.2,1);
}
.car-card:hover .car-image img,
.result-card:hover .result-image img {
  transform: scale(1.035);
}
.result-select:hover, .results-reset:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(21,60,219,.14);
}

/* Gentle reveal/hover details without requiring JavaScript changes */
.step, .benefits > div {
  transition: transform var(--motion-normal);
}
.step:hover { transform: translateX(5px); }
.benefits > div:hover { transform: translateX(4px); }
.benefits > div > span {
  transition: transform var(--motion-normal), background var(--motion-normal);
}
.benefits > div:hover > span {
  transform: rotate(-8deg) scale(1.06);
  background: #ffe5d9;
}
.why-art, .art-circle, .art-sun {
  transition: transform .45s ease;
}
.why-art:hover .art-circle { transform: translateX(-50%) scale(1.04); }
.why-art:hover .art-sun { transform: translate(-5px, 5px); }

/* Booking dialog */
.modal-backdrop, .admin-detail-backdrop {
  backdrop-filter: blur(7px);
  animation: yd-backdrop-in .2s ease both;
}
.booking-modal, .admin-detail {
  animation: yd-modal-in .28s cubic-bezier(.2,.7,.2,1) both;
}
.modal-close:hover { background: #ffe8df; color: var(--orange-dark); }
input, select, textarea {
  transition: border-color var(--motion-fast), box-shadow var(--motion-fast);
}
.booking-field input:focus {
  box-shadow: none;
}
.filter-row input:focus, .filter-row select:focus,
.lead-form-grid input:focus, .lead-form-grid textarea:focus {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px rgba(21,60,219,.08);
}

/* Entrance animations */
@keyframes yd-fade-up {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes yd-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes yd-car-arrive {
  from { opacity: 0; transform: translate(22px, 10px) scale(.975); }
  to { opacity: 1; transform: translate(8px, 0) scale(1); }
}
@keyframes yd-sticker-pop {
  from { opacity: 0; transform: rotate(-8deg) scale(.75); }
  to { opacity: 1; transform: rotate(10deg) scale(1); }
}
@keyframes yd-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes yd-modal-in {
  from { opacity: 0; transform: translateY(12px) scale(.985); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* Responsive hero sizing and mobile overlap prevention */
@media (min-width: 1200px) {
  .hero-visual { min-height: 430px; }
  .hero-car { max-height: 395px; }
}
@media (max-width: 950px) {
  .hero-visual { min-height: 350px; }
  .hero-car { max-height: 315px; transform: none; }
  .hero-visual:hover .hero-car { transform: translateY(-3px); }
  .hero-image-backdrop { width: min(78%, 320px); right: 8%; }
}
@media (max-width: 700px) {
  .hero { overflow: hidden; }
  .hero-visual { min-height: 290px; margin-top: 12px; }
  .hero-car {
    width: 100%;
    max-width: 520px;
    max-height: 270px;
    transform: none;
  }
  .hero-visual:hover .hero-car { transform: translateY(-2px); }
  .hero-image-backdrop { width: 72%; right: 10%; }
  .hero-visual:before { inset: 25px 0; }
  .visual-label { top: 8px; }
  .visual-sticker { bottom: 22px; }
  .visual-caption { bottom: 12px; }
  .result-card:hover, .car-card:hover { transform: translateY(-2px); }
}
@media (max-width: 390px) {
  .hero-visual { min-height: 255px; }
  .hero-car { max-height: 235px; }
  .visual-label { transform: scale(.92); transform-origin: top left; }
}

/* Respect visitors who prefer reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
