:root{--blue:#0757c9;--blue2:#083b91;--yellow:#ffd21f;--red:#ef3e32;--ink:#10233d;--muted:#63738a;--paper:#f7f9fc;--line:#dfe7f0;--white:#fff;--shadow:0 25px 70px rgba(10,48,105,.12)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:"DM Sans",sans-serif;color:var(--ink);background:var(--paper);overflow-x:hidden}a{text-decoration:none;color:inherit}button,input,textarea,select{font:inherit}.nav{height:68px;position:fixed;z-index:50;left:50%;right:auto;width:min(760px,calc(100vw - 52px));transform:translateX(-50%);top:10px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:rgba(235,244,255,.34);backdrop-filter:blur(22px) saturate(145%);-webkit-backdrop-filter:blur(22px) saturate(145%);border:1px solid rgba(255,255,255,.42);border-radius:18px;box-shadow:0 18px 55px rgba(4,25,55,.16),inset 0 1px 0 rgba(255,255,255,.28);transition:.35s}.nav.compact{top:10px;height:68px}.brand,.footer-brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:.9rem;letter-spacing:.02em}.brand b,.footer-brand b{font-weight:900}.brand small,.footer-brand small{display:block;font-size:.55rem;color:#718198;letter-spacing:.14em;margin-top:3px}.brand-mark{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--blue);color:#fff;font:800 1.3rem Manrope;box-shadow:5px 6px 0 var(--yellow)}.desktop-nav{display:flex;align-items:center;gap:25px;font-size:.72rem;font-weight:800}.desktop-nav>a:not(.nav-cta){color:#4c5d74}.desktop-nav>a:hover{color:var(--blue)}.nav-cta{padding:13px 17px;background:var(--blue);color:#fff;border-radius:11px}.nav-cta span{color:var(--yellow)}.menu-btn{display:none;border:0;background:none}.mobile-menu{display:none}.video-hero{height:205vh;position:relative}.video-sticky{position:sticky;top:0;height:100vh;min-height:620px;overflow:hidden;background:#cfeeff}.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;opacity:1;background:#cfeeff;filter:brightness(1.08) contrast(1.08) saturate(1.14);transition:opacity .25s}.hero-video.ready{opacity:1}.hero-wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,35,78,.48),rgba(4,35,78,.08) 55%,rgba(4,35,78,0) 100%),linear-gradient(0deg,rgba(4,35,78,.22),transparent 50%);pointer-events:none}.hero-glow{position:absolute;border-radius:50%;filter:blur(4px);opacity:.45;pointer-events:none}.glow-a{width:30vw;height:30vw;background:var(--yellow);right:-12vw;top:-15vw}.glow-b{width:20vw;height:20vw;background:#fff;left:42%;bottom:-15vw}.hero-copy{position:absolute;z-index:3;left:clamp(20px,8vw,120px);top:21%;width:min(680px,calc(100% - 40px));color:#fff}.eyebrow,.section-kicker{font-size:.66rem;font-weight:900;letter-spacing:.18em}.eyebrow{display:flex;align-items:center;gap:9px}.eyebrow span{width:26px;height:4px;background:var(--yellow);border-radius:4px}.hero-copy h1{font:800 clamp(4rem,8vw,8.4rem)/.9 Manrope;letter-spacing:-.065em;margin:19px 0}.hero-copy h1 em,.hero-copy h1 span{font-style:normal;color:var(--yellow)}.hero-copy p{max-width:540px;font-size:1.04rem;line-height:1.7;color:#eef6ff}.hero-actions{display:flex;gap:10px;margin-top:28px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:14px;border:0;border-radius:12px;padding:14px 19px;font-size:.75rem;font-weight:900;cursor:pointer}.btn-yellow{background:var(--yellow);color:var(--ink);box-shadow:0 9px 25px rgba(255,210,31,.25)}.btn-yellow b{color:var(--red)}.btn-glass{border:1px solid rgba(255,255,255,.5);color:#fff;background:rgba(255,255,255,.1);backdrop-filter:blur(12px)}.hero-bottom{position:absolute;z-index:5;left:clamp(20px,8vw,120px);right:clamp(20px,8vw,120px);bottom:26px;display:grid;grid-template-columns:180px 1fr 60px;align-items:center;gap:20px;color:#fff}.scroll-prompt{display:flex;align-items:center;gap:10px;font-size:.62rem;font-weight:900;letter-spacing:.16em}.mouse{width:17px;height:27px;border:1px solid #fff;border-radius:10px;position:relative}.mouse:after{content:"";position:absolute;width:3px;height:6px;border-radius:3px;background:var(--yellow);left:6px;top:5px}.hero-meter{height:3px;background:rgba(255,255,255,.3);overflow:hidden}.hero-meter span{display:block;width:0;height:100%;background:var(--yellow)}.hero-count{text-align:right;font:800 1.5rem Manrope}.hero-count small{font:800 .65rem DM Sans}.hero-badge{display:none;position:absolute;right:5%;top:26%;z-index:4;width:100px;height:100px;border-radius:50%;background:var(--yellow);color:var(--ink);display:grid;place-items:center;text-align:center;transform:rotate(9deg);box-shadow:0 18px 35px rgba(0,0,0,.15)}.hero-badge strong{font:900 1.3rem Manrope}.hero-badge span{font-size:.48rem;font-weight:900;letter-spacing:.1em}.marquee{height:58px;overflow:hidden;background:var(--yellow);color:var(--ink);display:flex;align-items:center;font:900 1rem Manrope;letter-spacing:.03em;white-space:nowrap}.marquee div{animation:marquee 24s linear infinite}.marquee i{font-style:normal;color:var(--red);padding:0 35px}@keyframes marquee{to{transform:translateX(-50%)}}.section{padding:clamp(90px,10vw,150px) clamp(20px,8vw,120px);position:relative}.section-kicker{color:var(--blue)}.intro{background:#fff}.intro-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:9vw;margin-top:60px}.big-copy{font:800 clamp(3rem,6vw,6.8rem)/.95 Manrope;letter-spacing:-.06em;max-width:900px;margin:0}.big-copy span{color:var(--blue);position:relative}.big-copy span:after{content:"";position:absolute;height:10px;left:0;right:5%;bottom:-4px;background:var(--yellow);z-index:-1;border-radius:8px}.intro-text{align-self:end}.intro-text p{font-size:1.02rem;line-height:1.8;color:var(--muted)}.arrow-link{display:inline-flex;gap:30px;margin-top:20px;font-weight:900;color:var(--blue);border-bottom:2px solid var(--yellow);padding-bottom:7px}.floating-sticker{position:absolute;right:7%;bottom:12%;width:115px;height:115px;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;text-align:center;font:800 .75rem/1.1 Manrope;transform:rotate(-11deg);box-shadow:12px 15px 0 var(--yellow)}.courses{background:var(--paper)}.section-top{display:grid;grid-template-columns:1fr .6fr;gap:8vw;align-items:end}.section-top h2,.journey h2,.faq h2{font:800 clamp(3.2rem,6vw,6.8rem)/.92 Manrope;letter-spacing:-.06em;margin:18px 0}.section-top h2 span,.journey h2 span,.faq h2 span{color:var(--red)}.section-top>p{color:var(--muted);line-height:1.8;margin-bottom:12px}.course-stage{display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-top:65px}.course-card{min-height:440px;border-radius:28px;padding:28px;position:relative;overflow:hidden;box-shadow:var(--shadow);transition:transform .4s}.course-card:hover{transform:translateY(-10px) rotate(-.5deg)}.card-blue{background:var(--blue);color:#fff}.card-yellow{background:var(--yellow);color:var(--ink);transform:translateY(35px)}.card-red{background:var(--red);color:#fff}.card-top{display:flex;justify-content:space-between;font-size:.6rem;font-weight:900;letter-spacing:.14em}.card-icon{font-size:3rem;margin-top:60px}.course-card h3{font:800 2.2rem Manrope;margin:18px 0 10px}.course-card p{line-height:1.7;max-width:330px;opacity:.82}.course-card a{position:absolute;left:28px;bottom:28px;font-weight:900;font-size:.8rem}.card-shape{position:absolute;width:230px;height:230px;border-radius:50%;right:-95px;bottom:-100px;background:rgba(255,255,255,.12)}.experience{height:150vh;min-height:920px;position:relative;overflow:hidden;background:linear-gradient(180deg,#bfe9ff 0%,#e9f8ff 48%,#ccefd0 48%,#a7d995 100%)}.experience-bg{position:absolute;inset:0;overflow:hidden}.sun{position:absolute;width:220px;height:220px;border-radius:50%;background:var(--yellow);right:10%;top:10%;box-shadow:0 0 90px rgba(255,210,31,.42)}.hill{position:absolute;bottom:31%;width:80%;height:30%;border-radius:50% 50% 0 0}.hill-1{left:-20%;background:#7fc98b}.hill-2{right:-25%;bottom:27%;background:#63b87b}.cloud{position:absolute;width:190px;height:48px;background:rgba(255,255,255,.72);border-radius:50px;filter:blur(1px)}.cloud:before,.cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.cloud:before{width:80px;height:80px;left:32px;bottom:10px}.cloud:after{width:60px;height:60px;left:105px;bottom:13px}.cloud-1{top:17%;left:12%}.cloud-2{top:27%;right:17%;transform:scale(.72)}.road-ribbon{position:absolute;left:-8%;right:-8%;bottom:-18%;height:57%;background:#344457;transform:perspective(800px) rotateX(57deg);transform-origin:bottom;box-shadow:0 -12px 0 rgba(255,210,31,.95)}.experience-copy{position:absolute;z-index:5;left:clamp(20px,8vw,120px);top:10%;max-width:600px}.experience-copy h2{font:800 clamp(3.5rem,7vw,7.5rem)/.9 Manrope;letter-spacing:-.06em;margin:18px 0}.experience-copy h2 span{color:var(--blue)}.experience-copy p{max-width:510px;line-height:1.75;color:#28435f}.experience-points{position:absolute;z-index:6;right:7%;top:13%;display:flex;flex-direction:column;gap:8px}.experience-points div{display:flex;align-items:center;gap:10px;background:rgba(255,255,255,.82);backdrop-filter:blur(10px);border-radius:50px;padding:8px 14px 8px 8px;font-size:.68rem;font-weight:900;box-shadow:0 8px 25px rgba(20,70,100,.08)}.experience-points b{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--blue);color:#fff}.experience-car{position:absolute;z-index:7;width:min(430px,38vw);bottom:20%;left:0;filter:drop-shadow(0 22px 16px rgba(0,0,0,.22));will-change:transform;pointer-events:none}.road-sign{position:absolute;z-index:6;bottom:35%;left:12%;width:100px;height:100px;border-radius:50%;background:#fff;border:8px solid var(--red);display:grid;place-items:center;text-align:center;box-shadow:8px 10px 0 rgba(0,0,0,.1);font:900 1.1rem Manrope}.road-sign small{font:800 .36rem DM Sans;display:block}.traffic-light{position:absolute;z-index:6;right:13%;bottom:35%;width:52px;background:#182535;border-radius:12px;padding:9px 8px;display:grid;gap:6px;box-shadow:8px 10px 0 rgba(0,0,0,.1)}.traffic-light i{width:36px;height:36px;border-radius:50%;background:#44515f}.traffic-light .r{background:#ef3e32}
.stats{background:#fff}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:60px;border-top:1px solid var(--line)}.stat{padding:35px 25px 20px;border-right:1px solid var(--line)}.stat:first-child{padding-left:0}.stat:last-child{border:0}.stat strong{font:800 2.5rem Manrope;color:var(--yellow);-webkit-text-stroke:1px var(--ink)}.stat h3{font:800 1.7rem/1.05 Manrope;margin:25px 0 10px}.stat p{color:var(--muted);font-size:.85rem;line-height:1.6}.journey{background:var(--paper)}.journey-head{display:grid;grid-template-columns:1fr .5fr;gap:8vw;align-items:end;margin-top:25px}.journey-head p{color:var(--muted);line-height:1.7}.timeline{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:85px}.timeline-line{position:absolute;top:20px;left:0;right:0;height:3px;background:#d8e2ee}.timeline-line span{display:block;width:0;height:100%;background:var(--blue)}.timeline article{position:relative;padding-top:55px}.timeline article>b{position:absolute;top:0;left:0;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);font-size:.7rem}.timeline h3{font:800 1.6rem Manrope;margin-bottom:8px}.timeline p{color:var(--muted);font-size:.85rem;line-height:1.6}/* Google review section — calm, editorial, and compact on every screen */
.quote-section{min-height:760px;position:relative;overflow:hidden;background:var(--blue);color:#fff;padding:92px clamp(20px,8vw,120px);isolation:isolate}
.quote-inner{position:relative;z-index:2}
.reviews-shell{position:relative;z-index:2;max-width:1500px;margin:0 auto}
.reviews-head{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:42px}
.reviews-head .section-kicker{color:var(--yellow)}
.reviews-head h2{font:800 clamp(3rem,5.3vw,6rem)/.92 Manrope;letter-spacing:-.06em;margin:16px 0 0}
.reviews-head h2 span{color:var(--yellow)}
.reviews-source{display:flex;align-items:center;gap:12px;padding:12px 15px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.07);backdrop-filter:blur(14px);border-radius:18px;min-width:220px}
.google-mark{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#fff;color:#4285f4;font:900 1.1rem Manrope}
.reviews-source strong{display:block;font-size:.78rem}.reviews-source small{display:block;color:#d5e6fa;font-size:.58rem;margin-top:4px;letter-spacing:.04em}
.reviews-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:16px;align-items:stretch}
.review-card{position:relative;min-width:0;border:1px solid rgba(255,255,255,.13);border-radius:24px;background:rgba(7,34,67,.62);box-shadow:0 22px 60px rgba(0,0,0,.18);padding:24px;backdrop-filter:blur(16px);transition:transform .3s ease,border-color .3s ease,background .3s ease}
.review-card:hover{transform:translateY(-4px);border-color:rgba(255,210,31,.38);background:rgba(9,42,80,.78)}
.review-featured{grid-row:span 2;background:rgba(255,255,255,.1);padding:30px}
.review-top{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:20px}
.review-person{display:flex;align-items:center;gap:11px;min-width:0}.review-avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;background:#f1df9d;color:#23344c;font-weight:900}
.review-avatar.avatar-k{background:#ff5a1f;color:#fff}.review-avatar.avatar-l{background:#c8d9e7}.review-avatar.avatar-j{background:#0b665a;color:#fff}.review-avatar.avatar-h{background:#765647;color:#fff}.review-avatar.avatar-m{background:#17201f;color:#fff}
.review-person strong{display:block;font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.review-person small{display:block;color:#a9bfd7;font-size:.56rem;margin-top:3px}
.review-stars{color:#ffd21f;font-size:.78rem;letter-spacing:.08em;white-space:nowrap}
.review-card p{margin:0 0 13px;color:#dce8f6;font-size:.82rem;line-height:1.7}.review-card p:last-of-type{margin-bottom:0}.review-featured p{font-size:.86rem;line-height:1.75}
.review-sign{margin-top:18px;color:var(--yellow);font-weight:800;font-size:.7rem}.review-link{display:inline-block;margin-top:16px;color:#fff;font-size:.58rem;font-weight:900;letter-spacing:.06em;border-bottom:1px solid rgba(255,210,31,.7);padding-bottom:3px}
.reviews-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:20px;color:#a9bfd7;font-size:.58rem;letter-spacing:.02em}.reviews-footer a{color:#fff;font-weight:900;border-bottom:1px solid var(--yellow);padding-bottom:4px}
.quote-orbit{position:absolute;border:1px solid rgba(255,255,255,.11);border-radius:50%;pointer-events:none}.orbit-a{width:700px;height:700px;left:-300px;top:-220px}.orbit-b{width:900px;height:900px;right:-420px;bottom:-550px}
@media(max-width:1100px){.reviews-grid{grid-template-columns:1fr 1fr}.review-featured{grid-row:auto;grid-column:1/-1}.reviews-head{align-items:flex-start}.review-featured p{max-width:1050px}}
@media(max-width:700px){.quote-section{min-height:0;padding:76px 18px 72px}.reviews-head{display:block;margin-bottom:28px}.reviews-head h2{font-size:clamp(2.7rem,12vw,4rem);margin-top:13px}.reviews-source{margin-top:22px;width:max-content;max-width:100%;min-width:0}.reviews-grid{grid-template-columns:1fr;gap:12px}.review-card,.review-featured{grid-column:auto;padding:20px;border-radius:20px}.review-featured{padding:22px}.review-card p,.review-featured p{font-size:.75rem;line-height:1.62}.review-top{margin-bottom:15px}.review-stars{font-size:.67rem}.reviews-footer{align-items:flex-start;flex-direction:column;gap:12px;line-height:1.5}.orbit-a{width:430px;height:430px;left:-250px;top:-170px}.orbit-b{width:560px;height:560px;right:-360px;bottom:-380px}}
@media(prefers-reduced-motion:reduce){.review-card{transition:none}}
.faq{background:#fff}.faq-grid{display:grid;grid-template-columns:.7fr 1.3fr;gap:10vw;margin-top:50px}.faq-list{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line);padding:25px 0}summary{list-style:none;display:flex;justify-content:space-between;cursor:pointer;font:800 1.1rem Manrope}summary::-webkit-details-marker{display:none}summary b{font-size:1.5rem;color:var(--red)}details p{max-width:700px;color:var(--muted);line-height:1.7;margin:15px 0 0}.contact{position:relative;overflow:hidden;background:var(--blue2);color:#fff;padding:clamp(80px,9vw,130px) clamp(20px,8vw,120px)}.contact-art{position:absolute;inset:0;opacity:.8}.contact-sun{position:absolute;width:420px;height:420px;border-radius:50%;background:var(--yellow);right:-100px;top:-170px}.contact-road-shape{position:absolute;bottom:-40%;left:30%;width:45%;height:80%;background:rgba(0,0,0,.15);transform:rotate(15deg)}.contact-grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr .8fr;gap:10vw}.contact .section-kicker{color:var(--yellow)}.contact h2{font:800 clamp(3.5rem,6.5vw,7rem)/.92 Manrope;letter-spacing:-.06em;margin:18px 0}.contact h2 span{color:var(--yellow)}.contact>p,.contact-grid>div>p{max-width:520px;color:#dcecff;line-height:1.7}.contact-buttons{display:flex;gap:10px;margin-top:28px}.btn-white{background:#fff;color:var(--ink)}form{background:#fff;color:var(--ink);border-radius:22px;padding:28px;display:grid;gap:13px;box-shadow:0 30px 80px rgba(0,0,0,.22)}form label{font-size:.65rem;text-transform:uppercase;font-weight:900;color:#65758a;display:grid;gap:6px}form input,form textarea,form select{border:1px solid #d5dfeb;border-radius:9px;padding:12px;background:#fbfdff;color:var(--ink);outline:0}form input:focus,form textarea:focus,form select:focus{border-color:var(--blue)}form small{font-size:.62rem;color:#8290a1;line-height:1.4}footer{background:#062d6d;color:#dbe8f8;padding:42px clamp(20px,8vw,120px);display:grid;grid-template-columns:1fr auto;gap:25px;align-items:center}.footer-brand{color:#fff}.footer-brand small{color:#9bb4d5}.footer-nav{display:flex;gap:22px;font-size:.7rem;font-weight:800}.footer-nav a:hover{color:var(--yellow)}footer p{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);padding-top:20px;color:#8ca8cc;font-size:.65rem}.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}.menu-open .mobile-menu{display:grid}.mobile-menu{position:absolute;top:76px;right:0;width:230px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px;box-shadow:var(--shadow)}.mobile-menu a{padding:13px;border-bottom:1px solid #edf1f6;font-weight:800;font-size:.8rem}.mobile-menu a:last-child{border:0}
@media(max-width:900px){.desktop-nav{display:none}.menu-btn{display:grid;place-items:center;width:42px;height:42px}.menu-btn i{display:block;width:20px;height:2px;background:var(--blue);margin:3px}.intro-grid,.section-top,.journey-head,.faq-grid,.contact-grid{grid-template-columns:1fr;gap:35px}.course-stage{grid-template-columns:1fr}.card-yellow{transform:none}.stats-grid{grid-template-columns:1fr 1fr}.stat:nth-child(2){border-right:0}.experience-copy{top:10%;left:20px;right:20px}.experience-points{top:auto;bottom:10%;left:20px;right:20px;display:flex;flex-wrap:wrap}.experience-car{width:min(500px,75vw);bottom:21%}.road-sign{left:5%;bottom:39%;transform:scale(.8)}.traffic-light{right:5%;bottom:40%;transform:scale(.8)}}
@media(max-width:600px){.nav{height:70px;top:10px;background:rgba(235,244,255,.38);backdrop-filter:blur(20px) saturate(145%);-webkit-backdrop-filter:blur(20px) saturate(145%);}.video-hero{height:170vh}.video-sticky{min-height:600px}.hero-copy{top:17%}.hero-copy h1{font-size:clamp(3.3rem,15vw,5.2rem)}.hero-copy p{font-size:.92rem}.hero-actions{flex-wrap:wrap}.hero-bottom{grid-template-columns:1fr 45px;gap:12px}.hero-meter{grid-column:1/-1;grid-row:2}.scroll-prompt{font-size:.55rem}.hero-badge{width:75px;height:75px;right:6%;top:13%;font-size:.6rem}.hero-badge strong{font-size:1rem}.hero-badge span{font-size:.37rem}.floating-sticker{display:none}.section{padding:78px 20px}.big-copy{font-size:3.1rem}.section-top h2,.journey h2,.faq h2{font-size:3.5rem}.course-card{min-height:390px}.experience{height:130vh;min-height:780px}.experience-copy h2{font-size:3.6rem}.experience-copy p{font-size:.88rem}.experience-car{width:90vw;bottom:19%}.road-sign,.traffic-light{display:none}.experience-points{bottom:5%;gap:5px}.experience-points div{font-size:.58rem;padding:5px 9px 5px 5px}.experience-points b{width:24px;height:24px}.stats-grid{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid var(--line);padding:25px 0}.timeline{grid-template-columns:1fr 1fr;gap:25px;margin-top:55px}.timeline-line{display:none}.quote-section{min-height:560px}.quote-inner blockquote{font-size:2.7rem}.contact-grid{gap:45px}footer{grid-template-columns:1fr}.footer-nav{flex-wrap:wrap}footer p{grid-column:1}}

/* Driving classroom: sticky cinematic sequence */
.experience{height:190vh;min-height:1200px;position:relative;overflow:visible;background:linear-gradient(180deg,#bfe9ff 0%,#e9f8ff 48%,#ccefd0 48%,#a7d995 100%);isolation:isolate}
.experience-stage{position:sticky;top:0;height:100vh;min-height:700px;overflow:hidden}
.experience-copy{top:11%;left:clamp(20px,8vw,120px);max-width:640px;z-index:5}
.experience-copy h2{max-width:620px}
.experience-copy p{max-width:500px}
.experience-points,.road-sign,.signal-caption{display:none!important}
.experience-car{width:min(470px,40vw);left:0;bottom:17%;z-index:8;transform:translate3d(-42vw,0,0);filter:drop-shadow(0 24px 18px rgba(0,0,0,.20));will-change:transform;pointer-events:none;transition:none}
/* Small, realistic roadside traffic signal */
.traffic-light{position:absolute;right:17%;bottom:27%;z-index:9;width:42px;height:auto;background:transparent;border-radius:0;padding:0;box-shadow:none}
.signal-head{width:42px;background:#182535;border-radius:9px;padding:6px 5px;display:grid;gap:5px;box-shadow:6px 8px 0 rgba(12,35,58,.13)}
.traffic-light i{display:block;width:32px;height:32px;margin:auto;border-radius:50%;background:#465365;transition:background .2s ease,box-shadow .2s ease,opacity .2s ease}
.traffic-light .r,.traffic-light .a,.traffic-light .g{opacity:.3;box-shadow:none}
.signal-pole{width:6px;height:105px;background:#4a5664;margin:0 auto;border-radius:3px;box-shadow:2px 0 0 rgba(0,0,0,.08)}
.signal-base{width:42px;height:7px;background:#3d4856;border-radius:4px;margin:0 auto;box-shadow:0 4px 0 rgba(0,0,0,.1)}
.experience.signal-green .g{background:#24c86b;opacity:1;box-shadow:0 0 16px rgba(36,200,107,.65)}
.experience.signal-green .a,.experience.signal-green .r{opacity:.25}
.experience.signal-yellow .a{background:#ffc928;opacity:1;box-shadow:0 0 16px rgba(255,201,40,.62)}
.experience.signal-yellow .g,.experience.signal-yellow .r{opacity:.25}
.experience.signal-red .r{background:#ef3e32;opacity:1;box-shadow:0 0 16px rgba(239,62,50,.6)}
.experience.signal-red .a,.experience.signal-red .g{opacity:.25}
@media(max-width:900px){.experience{height:185vh;min-height:1100px}.experience-stage{min-height:680px}.experience-car{width:min(520px,76vw);bottom:18%;transform:translate3d(-58vw,0,0)}.traffic-light{right:9%;bottom:25%;transform:scale(.9);transform-origin:bottom center}}
@media(max-width:600px){.experience{height:175vh;min-height:980px}.experience-stage{min-height:650px}.experience-copy{top:9%;left:20px;right:20px}.experience-copy h2{font-size:3.5rem}.experience-copy p{font-size:.88rem}.experience-car{width:92vw;bottom:17%;transform:translate3d(-75vw,0,0)}.traffic-light{right:9%;bottom:24%;transform:scale(.72);transform-origin:bottom center}}

/* Final classroom road alignment */
.experience-stage{background:linear-gradient(180deg,#bfe9ff 0%,#e9f8ff 55%,#b8e5b5 55%,#a7d995 100%)}
.road-ribbon{left:0;right:0;bottom:0;height:36%;background:#344457;transform:none;transform-origin:initial;box-shadow:none;clip-path:polygon(8% 100%,92% 100%,61% 0,39% 0);z-index:2}
.road-ribbon:before{content:"";position:absolute;left:0;right:0;top:0;height:5px;background:var(--yellow);opacity:.9}
.experience-car{bottom:13%;z-index:8}
.traffic-light{z-index:9;bottom:29%}
@media(max-width:900px){.experience-car{bottom:13%}.traffic-light{bottom:28%;}}
@media(max-width:600px){.experience-car{bottom:12%}.traffic-light{bottom:27%;}}

/* Classroom final visual pass: a true left-to-right roadway */
.experience-stage{position:sticky;top:0;height:100vh;min-height:700px;overflow:hidden;background:linear-gradient(180deg,#bfe9ff 0%,#e9f8ff 58%,#b8e5b5 58%,#a7d995 100%)}
.road-ribbon{position:absolute;left:0;right:0;bottom:0;width:100%;height:31%;background:#344457;transform:none!important;clip-path:none!important;box-shadow:inset 0 7px 0 rgba(255,210,31,.95),inset 0 10px 0 rgba(255,255,255,.10);z-index:2}
.road-ribbon:before{content:"";position:absolute;left:0;right:0;top:48%;height:3px;background:rgba(255,255,255,.22);opacity:1}
.road-ribbon:after{content:"";position:absolute;left:0;right:0;top:calc(48% - 3px);height:6px;background:repeating-linear-gradient(90deg,transparent 0 42px,rgba(255,255,255,.16) 42px 84px);opacity:.6}
.experience-car{left:0!important;bottom:18%!important;width:min(470px,40vw)!important;z-index:8;transform:translate3d(-50vw,0,0);filter:drop-shadow(0 18px 14px rgba(0,0,0,.24));will-change:transform}
.traffic-light{right:15%!important;bottom:30%!important;z-index:9}
@media(max-width:900px){.experience-car{width:min(520px,76vw)!important;bottom:18%!important}.traffic-light{right:8%!important;bottom:29%!important}}
@media(max-width:600px){.experience-car{width:92vw!important;bottom:18%!important}.traffic-light{right:7%!important;bottom:28%!important;transform:scale(.72);transform-origin:bottom center}}


/* Modern floating glass navigation — navigation only */
.nav{
  left:24px;right:24px;top:18px;height:76px;
  padding:0 clamp(18px,2.2vw,30px);
  background:rgba(255,255,255,.58);
  -webkit-backdrop-filter:blur(24px) saturate(165%);
  backdrop-filter:blur(24px) saturate(165%);
  border:1px solid rgba(255,255,255,.72);
  border-top-color:rgba(255,255,255,.95);
  border-radius:24px;
  box-shadow:0 18px 55px rgba(8,39,78,.14),inset 0 1px 0 rgba(255,255,255,.75);
  transition:background .35s ease,box-shadow .35s ease,transform .35s ease,height .35s ease;
}
.nav:before{
  content:"";position:absolute;inset:1px;border-radius:23px;pointer-events:none;
  background:linear-gradient(120deg,rgba(255,255,255,.32),transparent 38%,rgba(255,210,31,.08));
}
.nav.compact{
  top:12px;height:68px;
  background:rgba(255,255,255,.76);
  box-shadow:0 14px 42px rgba(8,39,78,.16),inset 0 1px 0 rgba(255,255,255,.85);
}
.brand,.desktop-nav,.menu-btn{position:relative;z-index:1}
.brand{gap:12px}
.brand-mark{
  width:42px;height:42px;border-radius:14px;
  box-shadow:4px 5px 0 var(--yellow),0 7px 18px rgba(7,87,201,.18);
}
.desktop-nav{gap:8px}
.desktop-nav>a:not(.nav-cta){
  position:relative;padding:11px 13px;border-radius:12px;color:#40536d;
  transition:color .25s ease,background .25s ease,transform .25s ease;
}
.desktop-nav>a:not(.nav-cta):hover{
  color:var(--blue);background:rgba(7,87,201,.07);transform:translateY(-1px);
}
.nav-cta{
  margin-left:8px;padding:13px 18px;border-radius:14px;
  background:linear-gradient(135deg,#0757c9,#0a63df);
  box-shadow:0 8px 20px rgba(7,87,201,.2),inset 0 1px 0 rgba(255,255,255,.22);
  transition:transform .25s ease,box-shadow .25s ease;
}
.nav-cta:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(7,87,201,.27),inset 0 1px 0 rgba(255,255,255,.22)}
.menu-btn{border-radius:12px;padding:10px}
@media(max-width:900px){
  .nav{left:12px;right:12px;top:12px;height:70px;border-radius:20px}
  .nav:before{border-radius:19px}
  .nav.compact{top:9px;height:64px}
}
@media(max-width:600px){
  .nav{padding:0 16px}
  .brand{font-size:.78rem}
  .brand small{font-size:.5rem}
  .brand-mark{width:39px;height:39px}
}

/* Small-screen simplification: keep the cinematic classroom scene desktop-only.
   This preserves the desktop artwork exactly while avoiding cramped composition on
   phones and tablets. */
@media (max-width: 900px){
  #experience{display:none!important}
  .desktop-nav a[href="#experience"],
  .mobile-menu a[href="#experience"]{display:none!important}
}

.mobile-experience-note{display:none}
@media (max-width:900px){
  .mobile-experience-note{display:block;padding:78px 20px;background:linear-gradient(135deg,#e9f8ff 0%,#fff 58%,#fff5bf 100%)}
  .mobile-experience-note span{font-size:.66rem;font-weight:900;letter-spacing:.18em;color:var(--blue)}
  .mobile-experience-note h2{font:800 clamp(2.8rem,12vw,4.5rem)/.95 Manrope;letter-spacing:-.06em;margin:14px 0 12px;color:var(--ink)}
  .mobile-experience-note p{max-width:520px;margin:0;color:var(--muted);line-height:1.7}
}

/* =========================================================
   TRAINING FLEET — WHITE GRID SHOWCASE
   Desktop: 5 + 5 grid, with the full fleet visible as a clean
   gallery while scroll drives a subtle sequential blur-in.
   Mobile: one vehicle at a time, centered and fully in frame.
   ========================================================= */
.fleet-section{position:relative;height:560vh;background:#fff;color:var(--ink);overflow:visible;isolation:isolate}
.fleet-stage{position:sticky;top:0;height:100vh;min-height:680px;overflow:hidden;background:
  radial-gradient(circle at 88% 18%,rgba(255,210,31,.14),transparent 18%),
  radial-gradient(circle at 14% 62%,rgba(7,87,201,.09),transparent 28%),
  linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
.fleet-grid{position:absolute;inset:0;opacity:.3;pointer-events:none;background:
  linear-gradient(rgba(16,35,61,.035) 1px,transparent 1px),
  linear-gradient(90deg,rgba(16,35,61,.035) 1px,transparent 1px);
  background-size:74px 74px;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.fleet-sky-glow{position:absolute;left:-10vw;right:-10vw;top:12%;height:48%;background:radial-gradient(ellipse at center,rgba(255,255,255,.96),rgba(239,246,253,.48) 52%,transparent 76%);pointer-events:none}
.fleet-heading{position:absolute;z-index:8;left:clamp(22px,7vw,110px);top:10%;width:min(720px,54vw)}
.fleet-heading .section-kicker{color:var(--blue)}
.fleet-heading h2{font:800 clamp(3rem,5.5vw,6.2rem)/.9 Manrope;letter-spacing:-.065em;margin:15px 0 15px;color:var(--ink)}
.fleet-heading h2 span{color:var(--blue)}
.fleet-heading p{max-width:650px;color:#657991;line-height:1.65;margin:0;font-size:.92rem}
.fleet-scroll-cta{display:inline-flex;align-items:center;gap:11px;margin-top:24px;padding:9px 16px 9px 9px;border:1px solid #d9e3ee;border-radius:999px;background:rgba(255,255,255,.9);box-shadow:0 12px 32px rgba(15,56,99,.07);font-size:.54rem;font-weight:900;letter-spacing:.16em;color:#3d5a78}
.fleet-scroll-cta span{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:var(--ink);font-size:1.1rem;line-height:1}
.fleet-status{position:absolute;z-index:7;right:clamp(22px,7vw,110px);top:13%;display:grid;grid-template-columns:auto auto;align-items:baseline;column-gap:6px;color:#dfe6ee;pointer-events:none}
.fleet-status b:empty,.fleet-status span:empty,.fleet-status small:empty{display:none}
.fleet-lineup{position:absolute;z-index:5;left:clamp(28px,5vw,80px);right:clamp(28px,5vw,80px);bottom:4%;height:53%;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));column-gap:clamp(10px,1.2vw,24px);row-gap:clamp(8px,1vw,16px);align-items:end}
.fleet-item{position:relative;min-width:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;opacity:0;visibility:hidden;will-change:transform,opacity,filter;transform-origin:center bottom}
.fleet-item img{display:block;width:100%;height:auto;max-height:100%;aspect-ratio:3/2;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 12px rgba(25,43,63,.16));will-change:transform}
.fleet-item-bike img{width:92%;aspect-ratio:1.35/1}
.fleet-item-bus img{width:108%;aspect-ratio:3/2}
.fleet-label{position:relative;z-index:4;display:flex;align-items:center;justify-content:center;gap:8px;margin-top:-1px;padding:8px 11px 8px 7px;border:1px solid #d9e3ee;border-radius:999px;background:rgba(255,255,255,.97);box-shadow:0 10px 28px rgba(25,59,96,.10);white-space:nowrap;max-width:100%}
.fleet-label>b{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--yellow);color:transparent;font:900 .53rem Manrope;flex:0 0 auto}
.fleet-label span{display:flex;flex-direction:column;gap:1px;font-size:.43rem;font-weight:900;letter-spacing:.11em;color:#58708a;line-height:1.1;text-align:left}
.fleet-label strong{font-size:.42rem;color:#274563;letter-spacing:.12em}
.fleet-progress{position:absolute;z-index:10;left:clamp(22px,7vw,110px);right:clamp(22px,7vw,110px);bottom:22px;height:3px;background:#e1e8f0;overflow:hidden;border-radius:4px}
.fleet-progress-fill{display:block;width:0;height:100%;background:var(--blue);transform-origin:left center}
.fleet-counter{position:absolute;z-index:10;right:clamp(22px,7vw,110px);bottom:37px;display:flex;align-items:baseline;gap:5px}
.fleet-counter b:empty,.fleet-counter span:empty{display:none}

@media(max-width:1200px) and (min-width:901px){
  .fleet-heading{width:48vw}.fleet-lineup{left:24px;right:24px;column-gap:10px}.fleet-label{padding:7px 8px 7px 6px;gap:5px}.fleet-label>b{width:27px;height:27px}
}

@media(max-width:900px){
  /* Mobile fleet: no roadway, no yellow markings, one vehicle at a time. */
  .fleet-section{height:1050vh}
  .fleet-stage{min-height:100svh;background:linear-gradient(180deg,#fff 0%,#fbfdff 100%)}
  .fleet-heading{top:7.5%;left:20px;right:20px;width:auto}
  .fleet-heading h2{font-size:clamp(2.7rem,10.5vw,4.5rem);max-width:610px;margin:12px 0 10px}
  .fleet-heading p{font-size:.76rem;line-height:1.55;max-width:570px}
  .fleet-scroll-cta{margin-top:18px;font-size:.42rem;padding:7px 12px 7px 7px}.fleet-scroll-cta span{width:27px;height:27px;font-size:.95rem}
  .fleet-status{display:none}
  .fleet-lineup{left:0;right:0;top:34%;bottom:auto;height:52%;display:block}
  .fleet-item,.fleet-item-bus,.fleet-item-bike{position:absolute;left:50%!important;right:auto;top:0!important;bottom:auto!important;width:88vw!important;height:100%;flex:none;margin:0!important;transform:translate3d(-50%,0,0);filter:none;will-change:opacity,filter}
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{width:100%!important;max-height:78%;aspect-ratio:auto;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 16px 14px rgba(25,43,63,.14))}
  .fleet-label{transform:scale(.9);transform-origin:center top;margin-top:8px}
  .fleet-progress{left:20px;right:20px;bottom:20px}
  .fleet-counter{display:none}
}
@media(max-width:600px){
  .fleet-section{height:1050vh}
  .fleet-heading{top:7%;left:18px;right:18px}
  .fleet-heading h2{font-size:clamp(2.45rem,12vw,3.55rem);line-height:.93}
  .fleet-heading p{font-size:.67rem;max-width:355px}
  .fleet-scroll-cta{font-size:.36rem;letter-spacing:.13em}.fleet-scroll-cta span{width:25px;height:25px}
  .fleet-lineup{top:32%;height:55%}
  .fleet-item,.fleet-item-bus,.fleet-item-bike{width:90vw!important}
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{max-height:76%}
  .fleet-label{padding:6px 8px 6px 6px;gap:5px;transform:scale(.8)}.fleet-label>b{width:25px;height:25px;font-size:.48rem;color:transparent}.fleet-label span,.fleet-label strong{font-size:.36rem}
}
@media(prefers-reduced-motion:reduce){.fleet-item{will-change:auto}}

/* =========================================================
   HISTORY + BRAND POLISH
   ========================================================= */
.brand{min-width:0;height:100%}
.brand-logo{display:block;width:86px;height:58px;object-fit:contain;object-position:center;filter:drop-shadow(0 5px 10px rgba(7,42,92,.14))}
.footer-logo{width:118px;height:82px}
.intro-links{display:flex;flex-wrap:wrap;gap:22px;margin-top:8px}

.history{
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 86% 10%,rgba(255,210,31,.12),transparent 20%),
    radial-gradient(circle at 5% 78%,rgba(7,87,201,.09),transparent 25%),
    #f4f7fb;
}
.history-top{position:relative;z-index:2}
.history-top>.section-kicker{color:var(--blue)}
.history-hero{
  display:grid;
  grid-template-columns:minmax(0,1fr) 190px;
  align-items:end;
  gap:50px;
  margin-top:26px;
}
.history-hero h2{
  font:800 clamp(3.2rem,6vw,6.9rem)/.93 Manrope;
  letter-spacing:-.065em;
  margin:0;
  max-width:1050px;
}
.history-hero h2 span{color:var(--blue)}
.history-lead{
  max-width:700px;
  margin:26px 0 0;
  color:var(--muted);
  font-size:1.02rem;
  line-height:1.75;
}
.history-badge{
  width:175px;height:175px;border-radius:50%;
  display:grid;place-items:center;align-content:center;text-align:center;
  background:var(--blue);color:#fff;
  border:10px solid rgba(255,210,31,.95);
  box-shadow:0 24px 60px rgba(7,87,201,.18);
  transform:rotate(5deg);
}
.history-badge strong{font:800 3rem/.9 Manrope;letter-spacing:-.06em}
.history-badge span{margin-top:8px;font-size:.48rem;font-weight:900;letter-spacing:.17em;line-height:1.5;color:#dceaff}

.history-timeline{
  position:relative;
  max-width:1180px;
  margin:82px auto 0;
  padding:0 30px;
}
.history-line{
  position:absolute;
  left:50%;
  top:0;bottom:0;width:2px;
  background:linear-gradient(180deg,transparent,var(--yellow) 8%,#b9c9dc 50%,var(--blue) 92%,transparent);
  transform:translateX(-50%);
}
.history-line span{
  position:sticky;top:48%;
  display:block;width:12px;height:12px;margin-left:-5px;border-radius:50%;
  background:var(--yellow);
  box-shadow:0 0 0 8px rgba(255,210,31,.16),0 0 25px rgba(255,210,31,.55);
}
.history-milestone{
  position:relative;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:80px;
  align-items:start;
  min-height:285px;
  margin-bottom:52px;
}
.history-milestone:nth-child(odd){padding-right:50%}
.history-milestone:nth-child(even){padding-left:50%}
.history-offset .history-card{transform:translateX(0)}
.history-year{
  position:absolute;
  top:4px;
  width:calc(50% - 45px);
  font:800 clamp(2rem,4vw,4.6rem)/1 Manrope;
  letter-spacing:-.06em;
  color:var(--blue);
}
.history-milestone:nth-child(odd) .history-year{right:calc(50% + 40px);text-align:right}
.history-milestone:nth-child(even) .history-year{left:calc(50% + 40px)}
.history-card{
  grid-column:1;
  padding:28px 30px;
  border:1px solid #dce5ef;
  border-radius:24px;
  background:rgba(255,255,255,.82);
  box-shadow:0 22px 55px rgba(14,52,96,.08);
}
.history-milestone:nth-child(even) .history-card{grid-column:2}
.history-label{
  display:block;
  color:var(--blue);
  font-size:.56rem;
  font-weight:900;
  letter-spacing:.17em;
}
.history-card h3{
  margin:11px 0 12px;
  font:800 clamp(1.7rem,2.6vw,2.7rem)/1 Manrope;
  letter-spacing:-.045em;
}
.history-card p,.history-belief p,.history-ending p{
  color:var(--muted);
  line-height:1.72;
  margin:0 0 13px;
}
.history-card p:last-child,.history-belief p:last-child,.history-ending p:last-child{margin-bottom:0}
.history-card strong{color:var(--ink)}

.history-belief{
  max-width:1180px;
  margin:78px auto 0;
  padding:clamp(28px,5vw,58px);
  display:grid;
  grid-template-columns:1.15fr .85fr;
  gap:60px;
  border-radius:32px;
  color:#fff;
  background:linear-gradient(135deg,#072f72,#0757c9);
  box-shadow:0 30px 80px rgba(7,60,140,.18);
  overflow:hidden;
  position:relative;
}
.history-belief:after{
  content:"";
  position:absolute;width:420px;height:420px;border-radius:50%;
  right:-180px;top:-220px;background:rgba(255,210,31,.16);
}
.history-belief .history-label{color:var(--yellow)}
.history-belief h3{
  position:relative;z-index:1;
  margin:14px 0 20px;
  font:800 clamp(2.3rem,4.4vw,4.8rem)/.94 Manrope;
  letter-spacing:-.06em;
}
.history-belief h3 span{color:var(--yellow)}
.history-belief p{position:relative;z-index:1;color:#dceaff}
.history-principles{
  position:relative;z-index:1;
  display:grid;align-content:center;gap:10px;
}
.history-principles span{
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  border-radius:14px;
  padding:14px 16px;
  font-size:.58rem;font-weight:900;letter-spacing:.13em;
}

.history-ending{
  max-width:1180px;
  margin:78px auto 0;
  padding-top:50px;
  display:grid;
  grid-template-columns:180px 1fr;
  gap:55px;
  border-top:1px solid #d6e0eb;
}
.history-ending-number{
  font:800 clamp(5rem,9vw,9rem)/.78 Manrope;
  letter-spacing:-.08em;
  color:var(--blue);
}
.history-ending-number span{color:var(--yellow)}
.history-ending h3{
  margin:12px 0 18px;
  font:800 clamp(2rem,3.5vw,3.7rem)/.98 Manrope;
  letter-spacing:-.055em;
  max-width:850px;
}
.history-signoff{
  margin-top:26px!important;
  font:800 clamp(1.25rem,2vw,2rem) Manrope;
  color:var(--ink)!important;
}
.history-signoff span{color:var(--blue)}

@media(max-width:900px){
  .nav{left:12px;right:12px}
  .brand-logo{width:96px;height:68px}
  .intro-links{gap:14px}
  .history{padding-top:74px;padding-bottom:78px}
  .history-hero{grid-template-columns:1fr;gap:28px}
  .history-badge{width:120px;height:120px;border-width:7px;justify-self:start}
  .history-badge strong{font-size:2.15rem}
  .history-badge span{font-size:.4rem}
  .history-timeline{margin-top:55px;padding:0 0 0 34px}
  .history-line{left:8px;transform:none}
  .history-line span{margin-left:-5px}
  .history-milestone,.history-milestone:nth-child(odd),.history-milestone:nth-child(even){
    display:block;min-height:0;margin-bottom:24px;padding:0 0 0 0;
  }
  .history-milestone .history-year,
  .history-milestone:nth-child(odd) .history-year,
  .history-milestone:nth-child(even) .history-year{
    position:static;width:auto;text-align:left;margin:0 0 10px;
    font-size:2.2rem;
  }
  .history-card,.history-milestone:nth-child(even) .history-card{grid-column:auto;padding:22px}
  .history-card h3{font-size:1.8rem}
  .history-card p{font-size:.88rem}
  .history-belief{grid-template-columns:1fr;gap:30px;margin-top:52px;border-radius:24px}
  .history-principles{grid-template-columns:1fr 1fr}
  .history-ending{grid-template-columns:1fr;gap:22px;margin-top:52px;padding-top:35px}
  .history-ending-number{font-size:5.5rem}
  .history-ending h3{font-size:2.15rem}
  .history-ending p{font-size:.9rem}
}
@media(max-width:600px){
  .nav{height:68px;top:8px;border-radius:17px}
  .brand-logo{width:88px;height:64px}
  .mobile-menu{top:73px;right:-2px;width:min(230px,calc(100vw - 24px))}
  .history{padding:68px 18px 68px}
  .history-hero h2{font-size:clamp(2.65rem,12vw,3.7rem)}
  .history-lead{font-size:.88rem;line-height:1.6;margin-top:18px}
  .history-timeline{margin-top:42px;padding-left:26px}
  .history-line{left:6px}
  .history-milestone .history-year,
  .history-milestone:nth-child(odd) .history-year,
  .history-milestone:nth-child(even) .history-year{font-size:1.85rem;margin-bottom:8px}
  .history-card,.history-milestone:nth-child(even) .history-card{padding:19px;border-radius:19px}
  .history-label{font-size:.48rem}
  .history-card h3{font-size:1.55rem;line-height:1.02}
  .history-card p{font-size:.8rem;line-height:1.58}
  .history-belief{margin-top:40px;padding:24px 20px;border-radius:20px}
  .history-belief h3{font-size:2rem}
  .history-belief p{font-size:.82rem}
  .history-principles{grid-template-columns:1fr;gap:7px}
  .history-principles span{font-size:.48rem;padding:11px 12px}
  .history-ending{margin-top:42px;gap:15px}
  .history-ending-number{font-size:4.8rem}
  .history-ending h3{font-size:1.85rem}
  .history-ending p{font-size:.82rem;line-height:1.6}
  .history-signoff{font-size:1.2rem!important}
  .footer-logo{width:96px;height:68px}
}

/* Desktop history layout repair: keep the timeline balanced around the center rail. */
@media (min-width:901px){
  .history{padding-top:clamp(110px,11vw,155px);padding-bottom:clamp(110px,11vw,155px)}
  .history-hero{grid-template-columns:minmax(0,1fr) 150px;gap:42px;align-items:center;margin-top:34px}
  .history-hero h2{max-width:900px}
  .history-lead{max-width:760px;margin-top:24px}
  .history-badge{width:138px;height:138px;border-width:8px;justify-self:end;transform:rotate(5deg)}
  .history-badge strong{font-size:2.35rem}

  .history-timeline{max-width:1220px;margin-top:92px;padding:0 34px}
  .history-milestone,
  .history-milestone:nth-child(odd),
  .history-milestone:nth-child(even){
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr);
    gap:78px;
    min-height:250px;
    margin-bottom:64px;
    padding:0;
    align-items:start;
  }
  .history-line{left:50%;z-index:0}

  /* Articles alternate cleanly: year left/card right, then card left/year right. */
  .history-milestone .history-year,
  .history-milestone:nth-child(odd) .history-year,
  .history-milestone:nth-child(even) .history-year{
    position:relative;
    top:auto;left:auto;right:auto;
    width:auto;
    grid-row:1;
    align-self:start;
    padding-top:8px;
    font-size:clamp(2.5rem,4vw,4.3rem);
    line-height:.95;
    text-align:right;
  }
  .history-milestone .history-card,
  .history-milestone:nth-child(odd) .history-card,
  .history-milestone:nth-child(even) .history-card{
    grid-row:1;
    grid-column:2;
    position:relative;
    z-index:1;
    transform:none;
    max-width:500px;
  }
  .history-milestone:nth-child(even) .history-year{grid-column:2;text-align:left}
  .history-milestone:nth-child(even) .history-card{grid-column:1;grid-row:1;justify-self:end}
  .history-card{padding:27px 30px}

  .history-belief,.history-ending{max-width:1220px}
}

/* The supplied logo is a compact sign, so give it breathing room inside the glass nav. */
@media (min-width:901px){
  .nav .brand-logo{width:78px;height:54px;object-fit:contain;flex:0 0 86px;filter:drop-shadow(0 4px 8px rgba(7,42,92,.12))}
}
@media (max-width:900px){
  .nav .brand-logo{width:68px;height:50px;object-fit:contain;flex:0 0 72px}
}

/* ================================================================
   HERO — iTurn-inspired scroll composition
   The scene stays still; only the Raju training car glides right.
   ================================================================ */
.hero-scroll-car{height:185vh;background:#eef3f7}
.hero-scroll-car .video-sticky{background:#eef3f7;isolation:isolate}
.hero-static-scene{position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(247,249,252,.98) 0%,rgba(247,249,252,.92) 40%,rgba(247,249,252,.38) 66%,rgba(247,249,252,.08) 100%),
  linear-gradient(180deg,rgba(255,255,255,.9),rgba(222,235,244,.12) 60%,rgba(9,40,72,.18) 100%),
  url('./images/hero-poster.jpg') center/cover no-repeat;
  filter:saturate(.88) contrast(1.03);transform:scale(1.02);}
.hero-scroll-car .hero-wash{background:linear-gradient(90deg,rgba(247,249,252,.72) 0%,rgba(247,249,252,.18) 48%,rgba(4,35,78,.03) 100%),linear-gradient(0deg,rgba(4,35,78,.18),transparent 55%)}
.hero-scroll-car .hero-glow{opacity:.32}
.hero-scroll-car .glow-a{width:34vw;height:34vw;right:-15vw;top:-17vw}
.hero-scroll-car .glow-b{width:26vw;height:26vw;left:44%;bottom:-17vw;background:#fff}
.hero-scroll-car .hero-copy{color:var(--ink);top:18%;z-index:6}
.hero-scroll-car .eyebrow{color:var(--ink)}
.hero-scroll-car .hero-copy p{color:#40546b}
.hero-scroll-car .btn-glass{color:var(--ink);border-color:rgba(16,35,61,.28);background:rgba(255,255,255,.38)}
.hero-scroll-car .hero-car-wrap{position:absolute;z-index:5;left:31%;bottom:11%;width:min(64vw,980px);will-change:transform;pointer-events:none;filter:drop-shadow(0 28px 18px rgba(10,35,58,.22));}
.hero-scroll-car .hero-car{width:100%;height:auto;display:block;will-change:transform;transform-origin:center center;mix-blend-mode:multiply}
.hero-scroll-car .hero-road{position:absolute;z-index:2;left:0;right:0;bottom:5%;height:14%;pointer-events:none;opacity:.6}
.hero-scroll-car .hero-road:before{content:"";position:absolute;left:-5%;right:-5%;bottom:15%;height:3px;background:rgba(7,55,96,.24);box-shadow:0 18px 0 rgba(7,55,96,.08)}
.hero-scroll-car .hero-road span{position:absolute;bottom:5%;width:9vw;height:5px;border-radius:99px;background:rgba(255,210,31,.8)}
.hero-scroll-car .hero-road span:nth-child(1){left:7%}.hero-scroll-car .hero-road span:nth-child(2){left:32%}.hero-scroll-car .hero-road span:nth-child(3){left:57%}.hero-scroll-car .hero-road span:nth-child(4){left:82%}
.hero-scroll-car .hero-car-label{position:absolute;z-index:6;right:7%;bottom:13%;display:flex;flex-direction:column;align-items:flex-end;gap:4px;text-align:right;color:var(--ink);pointer-events:none}
.hero-scroll-car .hero-car-label span{font-size:.58rem;font-weight:900;letter-spacing:.18em;color:var(--blue)}
.hero-scroll-car .hero-car-label b{font:800 clamp(1rem,1.5vw,1.45rem) Manrope;letter-spacing:-.03em}
.hero-scroll-car .hero-bottom{color:var(--ink);z-index:8}
.hero-scroll-car .hero-meter{background:rgba(16,35,61,.18)}
.hero-scroll-car .hero-meter span{background:var(--yellow)}
.hero-scroll-car .scroll-prompt{color:var(--ink)}
.hero-scroll-car .mouse{border-color:rgba(16,35,61,.6)}
.hero-scroll-car .hero-count{color:var(--ink)}
.hero-scroll-car .hero-static-scene:after{content:"RAJU";position:absolute;right:-2vw;top:11%;font:900 clamp(8rem,18vw,20rem)/.8 Manrope;letter-spacing:-.1em;color:transparent;-webkit-text-stroke:2px rgba(7,87,201,.07);pointer-events:none;transform:rotate(-7deg)}

@media(max-width:1100px){
  .hero-scroll-car{height:170vh}
  .hero-scroll-car .hero-copy{top:19%;width:48%}
  .hero-scroll-car .hero-copy h1{font-size:clamp(3.5rem,7vw,6.2rem)}
  .hero-scroll-car .hero-car-wrap{left:28%;width:72vw;bottom:14%}
  .hero-scroll-car .hero-car-label{right:5%;bottom:15%}
}
@media(max-width:900px){
  .hero-scroll-car{height:155vh}
  .hero-scroll-car .video-sticky{min-height:680px}
  .hero-scroll-car .hero-static-scene{background:
    linear-gradient(180deg,rgba(247,249,252,.96) 0%,rgba(247,249,252,.78) 43%,rgba(247,249,252,.18) 70%,rgba(9,40,72,.18) 100%),
    url('./images/hero-poster.jpg') center/cover no-repeat;}
  .hero-scroll-car .hero-copy{left:24px;top:15%;width:calc(100% - 48px);max-width:620px}
  .hero-scroll-car .hero-copy h1{font-size:clamp(3rem,12vw,5rem);margin:14px 0}
  .hero-scroll-car .hero-copy p{max-width:520px;font-size:.9rem;line-height:1.55}
  .hero-scroll-car .hero-actions{margin-top:18px}
  .hero-scroll-car .hero-car-wrap{left:8%;bottom:17%;width:112vw;max-width:none}
  .hero-scroll-car .hero-car-label{right:24px;bottom:15%;align-items:flex-end}
  .hero-scroll-car .hero-car-label span{font-size:.48rem}
  .hero-scroll-car .hero-car-label b{font-size:1rem}
  .hero-scroll-car .hero-bottom{left:24px;right:24px;bottom:20px;grid-template-columns:1fr 42px;gap:12px}
  .hero-scroll-car .scroll-prompt{grid-column:1/-1}
  .hero-scroll-car .hero-meter{grid-column:1}
  .hero-scroll-car .hero-count{grid-column:2}
  .hero-scroll-car .hero-static-scene:after{font-size:28vw;top:18%}
}
@media(max-width:600px){
  .hero-scroll-car{height:145vh}
  .hero-scroll-car .hero-copy{top:14%;}
  .hero-scroll-car .hero-copy h1{font-size:clamp(2.8rem,14vw,4.3rem);}
  .hero-scroll-car .hero-copy p{max-width:360px}
  .hero-scroll-car .hero-actions{flex-wrap:wrap}
  .hero-scroll-car .hero-actions .btn{padding:12px 15px}
  .hero-scroll-car .hero-car-wrap{left:-7%;bottom:18%;width:122vw}
  .hero-scroll-car .hero-car-label{right:18px;bottom:16%;}
  .hero-scroll-car .hero-car-label b{font-size:.86rem}
}

/* ================================================================
   HERO — supplied Raju training video, iTurn-style scroll scrub
   The video itself contains the car movement. The page does not move
   the car independently, which keeps the interaction smooth and clean.
   ================================================================ */
.hero-scroll-car{height:185vh;background:#f7f8f4}
.hero-scroll-car .video-sticky{background:#f7f8f4;isolation:isolate}
.hero-scroll-car .hero-static-scene{background:
  radial-gradient(circle at 82% 28%,rgba(255,210,31,.34) 0 9%,transparent 9.3%),
  radial-gradient(circle at 86% 26%,rgba(255,210,31,.11) 0 20%,transparent 20.3%),
  linear-gradient(105deg,#fbfcfa 0%,#f7f8f4 48%,#eef3f0 100%);
  filter:none;transform:none}
.hero-scroll-car .hero-static-scene:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,87,201,.045) 1px,transparent 1px),linear-gradient(0deg,rgba(7,87,201,.035) 1px,transparent 1px);background-size:80px 80px;mask-image:linear-gradient(90deg,#000,transparent 78%);pointer-events:none}
.hero-scroll-car .hero-static-scene:after{content:"DRIVE";right:-3vw;top:7%;font:900 clamp(9rem,20vw,22rem)/.8 Manrope;letter-spacing:-.1em;color:transparent;-webkit-text-stroke:2px rgba(7,87,201,.055);transform:rotate(-7deg)}
.hero-scroll-car .hero-wash{background:linear-gradient(90deg,rgba(247,248,244,.96) 0%,rgba(247,248,244,.78) 33%,rgba(247,248,244,.12) 68%,rgba(247,248,244,0) 100%);}
.hero-scroll-car .hero-glow{opacity:.2}
.hero-scroll-car .glow-a{background:var(--yellow);width:31vw;height:31vw;right:-12vw;top:-15vw}
.hero-scroll-car .glow-b{display:none}
.hero-scroll-car .hero-copy{top:19%;left:clamp(20px,8vw,120px);color:var(--ink);z-index:8;width:min(560px,42vw)}
.hero-scroll-car .hero-copy h1{font-size:clamp(4rem,7.3vw,8rem);margin:18px 0 22px}
.hero-scroll-car .hero-copy p{color:#4c5d70;max-width:500px}
.hero-scroll-car .btn-glass{color:var(--ink);background:rgba(255,255,255,.5);border-color:rgba(16,35,61,.22)}
.hero-scroll-car .hero-scroll-canvas{position:absolute;z-index:5;left:29%;bottom:8%;width:min(77vw,1160px);height:auto;aspect-ratio:16/9;display:block;pointer-events:none;object-fit:contain;mix-blend-mode:multiply;filter:saturate(1.08) contrast(1.04);transform-origin:center bottom;will-change:contents}
.hero-scroll-car .hero-car-wrap{display:none!important}
.hero-scroll-car .hero-car-label{z-index:8;right:7%;bottom:12%;color:var(--ink)}
.hero-scroll-car .hero-car-label span{color:var(--blue)}
.hero-scroll-car .hero-bottom{z-index:10;color:var(--ink)}
.hero-scroll-car .hero-meter{background:rgba(16,35,61,.16)}
.hero-scroll-car .scroll-prompt{color:var(--ink)}
.hero-scroll-car .mouse{border-color:rgba(16,35,61,.5)}
.hero-scroll-car .hero-count{color:var(--ink)}

@media(max-width:1100px){
  .hero-scroll-car{height:175vh}
  .hero-scroll-car .hero-copy{top:18%;width:47%}
  .hero-scroll-car .hero-copy h1{font-size:clamp(3.6rem,7.2vw,6.2rem)}
  .hero-scroll-car .hero-scroll-canvas{left:25%;bottom:10%;width:82vw}
}
@media(max-width:900px){
  .hero-scroll-car{height:160vh}
  .hero-scroll-car .video-sticky{min-height:680px}
  .hero-scroll-car .hero-static-scene{background:
    radial-gradient(circle at 84% 55%,rgba(255,210,31,.25) 0 13%,transparent 13.3%),
    linear-gradient(180deg,#fbfcfa 0%,#f7f8f4 64%,#eef3f0 100%)}
  .hero-scroll-car .hero-static-scene:before{background-size:55px 55px;mask-image:linear-gradient(180deg,#000,transparent 75%)}
  .hero-scroll-car .hero-copy{left:24px;top:13%;width:calc(100% - 48px);max-width:560px}
  .hero-scroll-car .hero-copy h1{font-size:clamp(3.2rem,12vw,5rem);margin:14px 0 18px}
  .hero-scroll-car .hero-copy p{font-size:.92rem;max-width:520px}
  .hero-scroll-car .hero-scroll-canvas{left:3%;bottom:15%;width:115vw;max-width:none}
  .hero-scroll-car .hero-car-label{right:24px;bottom:14%}
  .hero-scroll-car .hero-bottom{left:24px;right:24px;bottom:20px}
}
@media(max-width:600px){
  .hero-scroll-car{height:150vh}
  .hero-scroll-car .hero-copy{top:12%;left:20px;right:20px;width:auto}
  .hero-scroll-car .hero-copy h1{font-size:clamp(2.9rem,14vw,4.1rem);line-height:.92}
  .hero-scroll-car .hero-copy p{font-size:.86rem;line-height:1.55;max-width:350px}
  .hero-scroll-car .hero-actions{margin-top:16px}
  .hero-scroll-car .hero-actions .btn{padding:11px 14px}
  .hero-scroll-car .hero-scroll-canvas{left:-13%;bottom:16%;width:132vw}
  .hero-scroll-car .hero-car-label{right:18px;bottom:15%;text-shadow:0 1px 10px rgba(255,255,255,.7)}
  .hero-scroll-car .hero-car-label b{font-size:.78rem}
  .hero-scroll-car .hero-static-scene:after{font-size:32vw;top:23%;right:-5vw}
}
@media(prefers-reduced-motion:reduce){
  .hero-scroll-car{height:100vh}
  .hero-scroll-car .hero-scroll-canvas{mix-blend-mode:multiply}
}


/* ================================================================
   FINAL HERO / NAV POLISH
   Compact floating navigation, cleaner hero floor, and extra headroom
   for the instructor/car composition.
   ================================================================ */
@media (min-width:901px){
  .nav{
    left:30px;right:30px;top:16px;height:66px;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
  }
  .nav.compact{top:16px;height:66px}
  .nav .brand{
    height:66px;
    padding-left:8px;
  }
  .nav .brand-logo{
    width:76px;height:54px;
  }
  .desktop-nav{
    gap:25px;
    padding:9px 10px 9px 24px;
    border:1px solid rgba(255,255,255,.50);
    border-radius:999px;
    background:rgba(255,255,255,.24);
    backdrop-filter:blur(24px) saturate(155%);
    -webkit-backdrop-filter:blur(24px) saturate(155%);
    box-shadow:none;
  }
  .desktop-nav .nav-cta{padding:12px 18px;border-radius:999px}

  /* Give the instructor's head clear space below the floating nav. */
  .hero-scroll-car .hero-scroll-canvas{
    bottom:5%;
  }

  /* Remove the cramped decorative floor/progress lines. */
  .hero-scroll-car .hero-road,
  .hero-scroll-car .hero-meter{
    display:none!important;
  }
  .hero-scroll-car .hero-bottom{
    left:clamp(20px,8vw,120px);
    right:clamp(20px,8vw,120px);
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    bottom:24px;
  }
  .hero-scroll-car .hero-count{margin-left:auto}
  .hero-scroll-car .hero-car-label{display:none!important}
}

@media (max-width:900px){
  .hero-scroll-car .hero-road,
  .hero-scroll-car .hero-meter,
  .hero-scroll-car .hero-car-label{display:none!important}
  .hero-scroll-car .hero-bottom{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
  }
}

/* Final hero/header polish */
.nav{background:rgba(255,255,255,.20);border-color:rgba(255,255,255,.55);box-shadow:none;}
.nav .brand-logo{filter:drop-shadow(0 4px 8px rgba(7,42,92,.12));}
@media (min-width:901px){
  .nav{width:min(720px,calc(100vw - 80px));}
  .nav .brand{position:absolute;right:calc(100% + 18px);top:50%;transform:translateY(-50%);height:56px;padding:4px 10px 4px 4px;border-radius:18px;background:rgba(255,255,255,.18);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border:1px solid rgba(255,255,255,.45);}
  .nav .brand-logo{width:78px;height:52px;object-fit:contain;flex:0 0 82px;}
}
@media(max-width:900px){
  .nav{left:50%;right:auto;width:calc(100vw - 24px);transform:translateX(-50%);height:68px;top:10px;}
  .nav.compact{top:10px;height:68px}
  .nav .brand-logo{width:68px;height:50px;object-fit:contain;}
}
/* Do not let the header change size or slide when the page scrolls. */
.nav.compact{transform:translateX(-50%);}

@media(max-width:600px){
  .hero-scroll-car{height:165vh;}
  .hero-scroll-car .video-sticky{min-height:700px;}
  .hero-scroll-car .hero-copy{top:12%;left:20px;right:20px;width:auto;}
  .hero-scroll-car .hero-copy h1{font-size:clamp(2.75rem,13.2vw,4rem);line-height:.92;margin:12px 0 16px;}
  .hero-scroll-car .hero-copy p{font-size:.84rem;line-height:1.5;max-width:330px;}
  .hero-scroll-car .hero-actions{position:relative;z-index:12;display:flex;flex-wrap:nowrap;gap:8px;margin-top:14px;}
  .hero-scroll-car .hero-actions .btn{padding:11px 13px;white-space:nowrap;font-size:.68rem;}
  .hero-scroll-car .hero-scroll-canvas{left:-7%;bottom:2%;width:116vw;max-width:none;z-index:5;}
  .hero-scroll-car .hero-car-label{right:16px;bottom:7%;}
  .hero-scroll-car .hero-car-label b{font-size:.72rem;}
  .hero-scroll-car .hero-bottom{bottom:10px;}
}

/* ================================================================
   RESPONSIVE FIX — mobile hero placement + stable navigation
   Desktop composition is intentionally left unchanged.
   ================================================================ */
@media (min-width:901px){
  /* Keep the floating desktop nav visually compact without allowing the
     navigation pill to clip its first/last items. */
  .nav{
    left:30px!important;
    right:30px!important;
    width:auto!important;
    height:66px!important;
    top:16px!important;
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    backdrop-filter:none!important;
    -webkit-backdrop-filter:none!important;
    transform:none!important;
  }
  .nav.compact{top:16px!important;height:66px!important;transform:none!important}
  .nav .brand{
    left:0!important;
    right:auto!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    margin:0!important;
  }
  .desktop-nav{margin-left:auto!important;}
}

@media (max-width:900px){
  /* Never let the desktop navigation reappear while scrolling/resizing. */
  .nav{
    left:50%!important;
    right:auto!important;
    width:calc(100vw - 24px)!important;
    max-width:none!important;
    top:10px!important;
    height:64px!important;
    padding:0 14px!important;
    transform:translateX(-50%)!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.54)!important;
    border:1px solid rgba(255,255,255,.68)!important;
    box-shadow:0 10px 28px rgba(8,39,78,.10),inset 0 1px 0 rgba(255,255,255,.72)!important;
    backdrop-filter:blur(20px) saturate(150%)!important;
    -webkit-backdrop-filter:blur(20px) saturate(150%)!important;
    overflow:visible!important;
  }
  .nav.compact{top:10px!important;height:64px!important;transform:translateX(-50%)!important;}
  .nav .brand{position:relative!important;left:auto!important;right:auto!important;top:auto!important;transform:none!important;height:64px!important;padding:0!important;background:transparent!important;border:0!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;}
  .nav .brand-logo{width:72px!important;height:52px!important;object-fit:contain!important;}
  .menu-btn{display:grid!important;place-items:center!important;flex:0 0 42px!important;width:42px!important;height:42px!important;padding:8px!important;background:transparent!important;border:0!important;}
  .desktop-nav{display:none!important;}
  .mobile-menu{top:72px!important;right:0!important;z-index:60!important;width:min(220px,calc(100vw - 40px))!important;}

  /* Mobile hero: leave the copy/buttons in their current order, then place
     the actual scroll artwork immediately underneath them. */
  .hero-scroll-car{height:155svh!important;min-height:760px!important;}
  .hero-scroll-car .video-sticky{height:100svh!important;min-height:680px!important;}
  .hero-scroll-car .hero-copy{top:12%!important;left:20px!important;right:20px!important;width:auto!important;max-width:none!important;}
  .hero-scroll-car .hero-copy h1{font-size:clamp(2.65rem,12.7vw,4rem)!important;line-height:.92!important;margin:12px 0 14px!important;}
  .hero-scroll-car .hero-copy p{font-size:.82rem!important;line-height:1.48!important;max-width:340px!important;margin-bottom:0!important;}
  .hero-scroll-car .hero-actions{position:relative!important;z-index:12!important;display:flex!important;flex-wrap:nowrap!important;gap:8px!important;margin-top:14px!important;}
  .hero-scroll-car .hero-actions .btn{padding:11px 13px!important;font-size:.67rem!important;white-space:nowrap!important;}

  /* The frame itself contains the person + car. Move the whole frame up so
     the vehicle begins directly below the CTA area instead of falling below
     the viewport. */
  .hero-scroll-car .hero-scroll-canvas{
    left:-9%!important;
    top:58%!important;
    bottom:auto!important;
    width:124vw!important;
    max-width:none!important;
    height:auto!important;
    z-index:5!important;
  }
  .hero-scroll-car .hero-bottom{left:20px!important;right:20px!important;bottom:10px!important;z-index:10!important;}
  .hero-scroll-car .hero-road,.hero-scroll-car .hero-meter,.hero-scroll-car .hero-car-label{display:none!important;}
}

@media (max-width:600px){
  .nav{height:62px!important;top:9px!important;border-radius:17px!important;}
  .nav.compact{top:9px!important;height:62px!important;}
  .nav .brand{height:62px!important;}
  .nav .brand-logo{width:70px!important;height:50px!important;}
  .menu-btn{width:40px!important;height:40px!important;}

  .hero-scroll-car{height:158svh!important;min-height:780px!important;}
  .hero-scroll-car .video-sticky{min-height:680px!important;}
  .hero-scroll-car .hero-copy{top:11.5%!important;}
  .hero-scroll-car .hero-copy h1{font-size:clamp(2.6rem,12.4vw,3.85rem)!important;}
  .hero-scroll-car .hero-copy p{font-size:.81rem!important;max-width:330px!important;}
  .hero-scroll-car .hero-actions{margin-top:12px!important;}
  .hero-scroll-car .hero-actions .btn{padding:10px 12px!important;font-size:.65rem!important;}
  .hero-scroll-car .hero-scroll-canvas{
    left:-12%!important;
    top:61%!important;
    width:128vw!important;
  }
}

/* ================================================================
   MOBILE HERO REFINEMENT — clean header + higher car composition
   Desktop remains unchanged.
   ================================================================ */
@media (max-width:900px){
  /* Remove the decorative yellow glow on phones so the vehicle can sit higher. */
  .hero-scroll-car .glow-a{display:none!important;}

  /* Clean floating mobile header: no drop shadow or artificial edge. */
  .nav{
    box-shadow:none!important;
    background:rgba(255,255,255,.42)!important;
    border-color:rgba(255,255,255,.62)!important;
  }
  .nav .brand-logo{
    transition:opacity .35s ease, transform .35s ease;
  }
  .nav.logo-hidden .brand-logo{
    opacity:0!important;
    transform:translateY(-5px) scale(.94)!important;
    pointer-events:none;
  }

  /* Bring the scroll artwork up underneath the CTA buttons. */
  .hero-scroll-car .hero-scroll-canvas{
    top:53%!important;
    bottom:auto!important;
  }
}

@media (max-width:600px){
  .hero-scroll-car .hero-scroll-canvas{
    top:53%!important;
    left:-12%!important;
    width:128vw!important;
  }
}

/* Desktop navigation visibility: fade the entire header + logo away while
   scrolling down and bring it back when scrolling upward. Mobile stays visible. */
@media (min-width:901px){
  .nav{
    opacity:1;
    visibility:visible;
    transition:opacity .42s ease, visibility .42s ease;
  }
  .nav.nav-hidden{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}
@media (max-width:900px){
  .nav.nav-hidden{opacity:1!important;visibility:visible!important;pointer-events:auto!important;}
  .nav.logo-hidden .brand-logo{opacity:1!important;transform:none!important;}
}

/* =========================================================
   FLEET FINAL POLISH — clean 5 + 5 desktop gallery
   ========================================================= */
.fleet-scroll-cta{
  position:absolute;
  z-index:12;
  top:10%;
  right:clamp(22px,7vw,110px);
  margin-top:0;
}
.fleet-label{display:none!important}
.fleet-lineup{
  bottom:3.5%;
  height:57%;
  left:clamp(22px,4vw,72px);
  right:clamp(22px,4vw,72px);
  column-gap:clamp(14px,1.5vw,28px);
  row-gap:clamp(4px,.6vw,10px);
}
.fleet-item img{
  width:108%;
  max-height:108%;
}
.fleet-item-bike img{
  width:88%;
  max-height:100%;
  mix-blend-mode:multiply;
}
.fleet-item-bus img{
  width:112%;
  max-height:108%;
}

@media(max-width:1200px) and (min-width:901px){
  .fleet-lineup{left:16px;right:16px;column-gap:7px}
  .fleet-item img{width:106%}
  .fleet-item-bike img{width:86%}
  .fleet-item-bus img{width:110%}
}

@media(max-width:900px){
  .fleet-scroll-cta{
    top:7.5%;
    right:20px;
    margin-top:0;
    font-size:.42rem;
    padding:7px 12px 7px 7px;
  }
  .fleet-lineup{top:34%;height:52%;left:0;right:0}
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{
    width:100%!important;
    max-height:78%;
  }
  .fleet-item-bike img{mix-blend-mode:multiply}
}
@media(max-width:600px){
  .fleet-scroll-cta{top:7%;right:18px;font-size:.36rem;letter-spacing:.13em}
  .fleet-lineup{top:32%;height:55%}
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{max-height:76%}
}

/* =========================================================
   FLEET REFERENCE POLISH — mobile spacing + desktop second row
   ========================================================= */
/* The history badge is redundant with the timeline and was marked for removal. */
.history-badge{display:none!important}

@media (min-width:901px){
  /* Keep the full 5 + 5 fleet comfortably inside the sticky viewport. */
  .fleet-lineup{
    bottom:3%;
    height:65%;
    row-gap:clamp(2px,.45vw,8px);
  }
  .fleet-item img{max-height:100%;}
  .fleet-item-bike img{max-height:92%;}
  .fleet-item-bus img{max-height:100%;}
}

@media (max-width:900px){
  /* Keep the CTA in the upper-right, but below the floating nav so it never
     sits on top of the heading. */
  .fleet-scroll-cta{
    top:13.5%;
    right:18px;
    margin-top:0;
  }
  /* Pull the active vehicle upward into the open area beneath the intro. */
  .fleet-lineup{
    top:39%;
    height:56%;
  }
  .fleet-item,.fleet-item-bus,.fleet-item-bike{
    justify-content:flex-start;
  }
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{
    max-height:74%;
    object-position:center top;
  }
}

@media (max-width:600px){
  .fleet-scroll-cta{top:14%;right:16px}
  .fleet-lineup{top:40%;height:55%}
  .fleet-item img,.fleet-item-bike img,.fleet-item-bus img{max-height:72%}
}

/* Fleet desktop: bring the second row closer to the first row. */
@media (min-width: 901px) {
  .fleet-lineup .fleet-item:nth-child(n+6) {
    top: clamp(-72px, -4.2vw, -38px);
  }
}

/* Motorcycle cutouts: the source images now use transparent backgrounds. */
.fleet-item-bike img {
  background: transparent !important;
  mix-blend-mode: normal;
}


/* =========================================================
   THE RAJU METHOD — premium six-step training journey
   Visual language follows the supplied reference: airy header,
   floating promise card, timeline connectors, road ribbon and
   image-led white information panels.
   ========================================================= */
.raju-method{
  background:
    radial-gradient(circle at 8% 26%, rgba(7,87,201,.085), transparent 25%),
    radial-gradient(circle at 92% 12%, rgba(255,210,31,.13), transparent 23%),
    linear-gradient(180deg,#f8fafd 0%,#f5f8fc 100%);
  overflow:hidden;
}
.method-head{
  display:grid;
  grid-template-columns:minmax(280px,1.02fr) minmax(230px,.82fr) minmax(330px,1fr);
  gap:clamp(28px,4.2vw,72px);
  align-items:start;
  margin-bottom:52px;
}
.method-title h2{
  font:800 clamp(3.65rem,5.9vw,6.55rem)/.88 Manrope;
  letter-spacing:-.068em;
  margin:17px 0 0;
}
.method-title h2 span{color:var(--blue)}
.method-title h2 em{font-style:normal;color:var(--red)}
.method-intro{padding-top:69px}
.method-intro>p{
  max-width:420px;
  margin:0;
  color:#5f7189;
  font-size:1.02rem;
  line-height:1.72;
}
.method-intro>p strong{color:var(--blue)}
.method-promise{padding-top:4px;display:flex;justify-content:flex-end}
.promise-card{
  width:min(430px,100%);
  height:auto;
  display:block;
  filter:drop-shadow(0 18px 35px rgba(10,48,105,.08));
}
.method-journey{
  position:relative;
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  --method-gap:clamp(12px,1.55vw,24px);
  gap:var(--method-gap);
  align-items:start;
}
.method-road{position:absolute;pointer-events:none;z-index:0}
.method-road-one{left:-6%;top:214px;width:112%;height:165px;opacity:.48}
.method-road-two{left:31%;width:39%;top:308px;height:126px;opacity:.27}
.method-stage{
  position:relative;
  z-index:2;
  min-width:0;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  overflow:visible;
}
.method-stage:hover{transform:none;box-shadow:none}
.method-stage:after{
  content:"";
  position:absolute;
  z-index:-1;
  top:19px;
  left:40px;
  width:calc(100% + var(--method-gap) - 40px);
  height:1px;
  background:#bac7d5;
}
.method-stage:before{
  content:"";
  position:absolute;
  z-index:3;
  top:15px;
  right:calc(var(--method-gap) * -0.5 - 5px);
  width:9px;
  height:9px;
  border-right:2px solid #4d617a;
  border-top:2px solid #4d617a;
  transform:rotate(45deg);
  background:transparent;
}
.method-stage:last-child:after,.method-stage:last-child:before{display:none}
.stage-top{position:relative;display:block;height:91px;padding:0}
.stage-number{
  width:38px;height:38px;border-radius:50%;display:grid;place-items:center;
  color:#fff;background:var(--blue);font:900 .72rem Manrope;
  box-shadow:0 7px 16px rgba(7,87,201,.17);margin-left:2px;
}
.method-stage-red .stage-number{background:var(--red);box-shadow:0 7px 16px rgba(239,62,50,.14)}
.stage-icon{width:31px;height:31px;object-fit:contain;display:block;margin:13px 0 0 2px}
.stage-copy{padding:0 2px 0 0;min-height:164px}
.stage-copy h3{margin:0 0 5px;font:900 .98rem/1.14 Manrope;text-transform:uppercase;letter-spacing:.005em}
.stage-lead{margin:0 0 9px;color:var(--blue);font-weight:900;font-size:.78rem;line-height:1.3}
.method-stage-red .stage-lead{color:var(--red)}
.stage-copy>p:last-child{margin:0;color:#4f627a;font-size:.69rem;line-height:1.62}
.stage-panel{
  background:rgba(255,255,255,.96);
  border:1px solid rgba(221,229,238,.9);
  border-radius:19px;
  box-shadow:0 14px 34px rgba(10,48,105,.075);
  overflow:hidden;
}
.stage-image{display:block;width:100%;height:133px;object-fit:cover;margin:0;border-radius:0;background:#eef3f8}
.stage-image-cockpit{object-fit:contain;background:#fff;height:158px;padding:0}
.method-stage ul{list-style:none;padding:13px 15px 17px;margin:0;display:grid;gap:5px}
.method-stage li{position:relative;padding-left:13px;color:#263b57;font-size:.61rem;line-height:1.38}
.method-stage li:before{content:"";position:absolute;left:0;top:.48em;width:5px;height:5px;border-radius:50%;background:var(--blue)}
.method-stage .red-list li:before{background:var(--red)}
.method-mini-flow{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #e6edf5;margin-top:0}
.method-mini-flow>div{padding:12px 7px 14px;text-align:center}
.method-mini-flow>div+div{border-left:1px solid #e6edf5}
.method-mini-flow strong{display:block;color:var(--red);font:900 .83rem Manrope;margin-bottom:4px}
.method-mini-flow span{display:block;color:#4e627c;font-size:.55rem;line-height:1.4}
.method-bottom{position:relative;z-index:3;margin-top:30px}
.method-bottom img{display:block;width:100%;height:auto;border-radius:22px;box-shadow:0 15px 45px rgba(10,48,105,.07)}
@media(max-width:1200px){
  .method-head{grid-template-columns:1fr .82fr .9fr;gap:3vw}
  .method-journey{grid-template-columns:repeat(3,minmax(0,1fr));row-gap:28px}
  .method-stage:after,.method-stage:before{display:none}
  .method-stage:nth-child(n+4){margin-top:4px}
  .method-road{display:none}
  .stage-copy{min-height:140px}
}
@media(max-width:900px){
  .method-head{grid-template-columns:1fr;gap:12px;margin-bottom:38px}
  .method-intro{padding-top:0}
  .method-promise{padding-top:6px;justify-content:flex-start}
  .promise-card{width:min(430px,100%)}
  .method-journey{grid-template-columns:1fr 1fr;gap:20px}
  .stage-copy{min-height:145px}
}
@media(max-width:600px){
  .raju-method{padding-top:72px;padding-bottom:72px}
  .method-title h2{font-size:3.45rem;line-height:.9}
  .method-intro>p{font-size:.9rem;line-height:1.65}
  .method-journey{grid-template-columns:1fr;gap:18px}
  .stage-top{height:78px}
  .stage-number{width:36px;height:36px}
  .stage-icon{margin-top:10px}
  .stage-copy{min-height:0;padding-bottom:15px}
  .stage-copy h3{font-size:1rem}
  .stage-copy>p:last-child{font-size:.77rem}
  .stage-panel{border-radius:18px}
  .stage-image{height:auto;max-height:210px}
  .stage-image-cockpit{height:auto}
  .method-stage ul{padding:13px 15px 18px}
  .method-stage li{font-size:.69rem}
  .method-bottom{margin-top:24px}
  .method-bottom img{border-radius:18px}
}

/* Training in action — supporting photography outside the fleet */
.training-in-action{background:linear-gradient(180deg,#fff 0%,#f5f8fc 100%);overflow:hidden}
.training-action-head{display:grid;grid-template-columns:1.1fr .62fr;gap:8vw;align-items:end;margin-bottom:48px}
.training-action-head h2{font:800 clamp(3.2rem,6vw,6.7rem)/.92 Manrope;letter-spacing:-.06em;margin:18px 0 0}
.training-action-head h2 span{color:var(--blue)}
.training-action-head>p{margin:0 0 8px;color:var(--muted);font-size:1rem;line-height:1.8;max-width:510px}
.training-action-grid{display:grid;grid-template-columns:1.45fr .9fr;gap:22px;align-items:stretch}
.training-action-feature,.training-action-card{margin:0;position:relative;overflow:hidden;border:1px solid rgba(216,226,237,.9);background:#fff;border-radius:28px;box-shadow:0 24px 70px rgba(10,48,105,.10)}
.training-action-feature{min-height:620px}
.training-action-feature img{display:block;width:100%;height:100%;min-height:620px;object-fit:cover;object-position:center}
.training-action-side{display:grid;grid-template-rows:1fr 1fr;gap:22px}
.training-action-card{min-height:299px}
.training-action-card img{display:block;width:100%;height:100%;min-height:299px;object-fit:cover}
.training-action-bike img{object-fit:contain;object-position:center;background:#fff;mix-blend-mode:multiply;padding:8px 18px 0}
.training-action-feature figcaption,.training-action-card figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;background:rgba(255,255,255,.88);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.75);border-radius:18px;box-shadow:0 12px 30px rgba(10,48,105,.10)}
.training-action-feature figcaption strong,.training-action-card figcaption strong{display:block;font:900 1rem Manrope;margin-bottom:5px;color:var(--ink)}
.training-action-feature figcaption span,.training-action-card figcaption span{display:block;color:var(--muted);font-size:.72rem;line-height:1.5}
@media(max-width:900px){
  .training-action-head{grid-template-columns:1fr;gap:8px;margin-bottom:32px}
  .training-action-grid{grid-template-columns:1fr}
  .training-action-feature,.training-action-feature img{min-height:480px}
  .training-action-side{grid-template-columns:1fr 1fr;grid-template-rows:none}
  .training-action-card,.training-action-card img{min-height:300px}
}
@media(max-width:600px){
  .training-in-action{padding-top:72px;padding-bottom:72px}
  .training-action-head h2{font-size:3.35rem}
  .training-action-head>p{font-size:.88rem;line-height:1.7}
  .training-action-grid{gap:16px}
  .training-action-feature,.training-action-feature img{min-height:420px;border-radius:22px}
  .training-action-side{grid-template-columns:1fr;gap:16px}
  .training-action-card,.training-action-card img{min-height:280px;border-radius:22px}
  .training-action-feature figcaption,.training-action-card figcaption{left:12px;right:12px;bottom:12px;padding:13px 14px;border-radius:15px}
  .training-action-feature figcaption strong,.training-action-card figcaption strong{font-size:.92rem}
  .training-action-feature figcaption span,.training-action-card figcaption span{font-size:.68rem}
}


/* Learning Hub portal teaser */
.learn-portal{background:linear-gradient(135deg,#eef5ff 0%,#fff 55%,#fff8d8 100%);overflow:hidden}
.learn-portal-grid{max-width:1400px;margin:auto;display:grid;grid-template-columns:1.05fr .72fr;gap:9vw;align-items:center}
.learn-portal h2{font:800 clamp(3.3rem,6vw,6.7rem)/.9 Manrope;letter-spacing:-.06em;margin:18px 0 24px}.learn-portal h2 span{color:var(--blue)}
.learn-portal p{max-width:620px;color:var(--muted);line-height:1.8;font-size:1rem}.learn-portal .btn{margin-top:15px}
.learn-portal-card{position:relative;padding:30px;border-radius:30px;background:#fff;border:1px solid #dce6f0;box-shadow:0 25px 75px rgba(10,48,105,.12);min-height:420px;overflow:hidden}.learn-portal-card:before{content:"";position:absolute;width:280px;height:280px;border-radius:50%;right:-120px;top:-120px;background:var(--yellow);opacity:.8}.learn-portal-card-top{display:flex;justify-content:space-between;position:relative;z-index:2;font-size:.62rem;font-weight:900;letter-spacing:.12em}.learn-portal-card-top span{color:var(--blue)}.learn-portal-card-top b{color:#718096}.learn-portal-wheel{position:relative;width:270px;height:270px;margin:38px auto 24px;border-radius:50%;background:conic-gradient(from 0deg,var(--blue) 0 25%,#fff 25% 27%,var(--red) 27% 52%,#fff 52% 54%,var(--yellow) 54% 79%,#fff 79% 81%,#eaf0f6 81% 100%);display:grid;place-items:center;box-shadow:0 18px 45px rgba(10,48,105,.12)}.learn-portal-wheel:after{content:"";position:absolute;inset:38px;border-radius:50%;background:#fff;border:1px solid #e3eaf2}.learn-portal-wheel span{position:absolute;z-index:2;font-size:.53rem;font-weight:900;letter-spacing:.08em}.learn-portal-wheel span:nth-child(1){top:25px;color:var(--blue)}.learn-portal-wheel span:nth-child(2){right:15px;top:110px;color:var(--red)}.learn-portal-wheel span:nth-child(3){bottom:37px;left:42px;color:#a27700}.learn-portal-wheel span:nth-child(4){left:12px;top:108px;color:#596b81}.learn-portal-wheel strong{position:relative;z-index:3;text-align:center;font:900 1.5rem/1 Manrope;color:var(--ink)}.learn-portal-card>p{position:relative;z-index:2;margin:0;text-align:center;font-size:.72rem;line-height:1.55}
@media(max-width:900px){.learn-portal-grid{grid-template-columns:1fr;gap:35px}.learn-portal-card{min-height:390px}}
@media(max-width:600px){.learn-portal{padding:75px 20px}.learn-portal h2{font-size:3.5rem}.learn-portal p{font-size:.88rem}.learn-portal-card{min-height:350px;padding:22px}.learn-portal-wheel{width:220px;height:220px;margin-top:30px}.learn-portal-wheel:after{inset:31px}.learn-portal-wheel span{font-size:.46rem}}