/* Approved SANAM header and hero only. No styles outside these two regions. */
.topbar{--s:calc(100vw / 1966);height:clamp(84px,5.8vw,114px);background:linear-gradient(118deg,#002b24 72%,#8ac5e9 72%,#e9d9b2);border-bottom:1px solid #ffffff70}
.topbar .nav{width:90%;max-width:none;gap:2vw}
.topbar .brand{width:23.6%;margin:0;height:100%;border:0;clip-path:polygon(13% 0,90% 0,100% 100%,0 100%)}
.topbar .brand img{width:auto;height:125%;max-width:88%;object-fit:contain}
.topbar .nav nav{gap:2.6vw;margin-inline-start:auto}
.topbar .nav nav a{font-size:clamp(14px,1.02vw,20px);padding-block:16px}
.topbar .nav nav a:first-child:after{height:4px;border-radius:3px;bottom:3px;background:#ffd15e}
.topbar .nav-actions{gap:2.4vw;margin-inline-start:3.6vw}
.topbar .lang{color:#002b24;font-size:clamp(14px,1.02vw,20px);gap:12px}
.topbar .lang svg{width:34px;height:34px}
.topbar .nav-cta{min-width:clamp(150px,12.7vw,250px);min-height:clamp(46px,3.15vw,62px);font-size:clamp(14px,1.02vw,20px);background:linear-gradient(#ffdf83,#f2bc3b);border:0;gap:18px}
.hero{height:auto;min-height:calc(100vw * .349);background:#00291f}
.hero .hero-media{inset:0;width:100%;height:100%;background:#00291f}
.hero .hero-media img{width:100%;height:100%;object-fit:contain;object-position:center top}
.hero:before{background:linear-gradient(90deg,#00291fa8,transparent 42%)}
html[dir=rtl] .hero:before{background:none}
.hero .hero-media:after{display:none}
.hero .hero-inner{width:90%;max-width:none;min-height:calc(100vw * .349);padding-block:3.5vw 4.5vw}
.hero .hero-copy{width:37.5%;margin:0;padding:0}
.hero .eyebrow{font-size:clamp(13px,1.12vw,22px);color:#ffcd4d;margin-bottom:16px}
.hero .eyebrow:before{width:6px;height:1.3em;inset-inline-start:-30px;background:#ffcd4d;border-radius:0}
.hero h1{width:100%;font-size:clamp(36px,3.25vw,64px);line-height:1.02;letter-spacing:-.6px;margin:0 0 24px}
.hero h1 em{font-size:inherit;color:#ffcd4d}
.hero .hero-copy>p{width:88%;font-size:clamp(14px,1.13vw,22px);line-height:1.25}
.hero .hero-buttons{gap:12px;margin-top:28px}
.hero .hero-buttons .btn{min-width:0;min-height:clamp(48px,3.4vw,67px);padding:12px 25px;font-size:clamp(13px,1.02vw,20px);gap:18px}
.hero .hero-buttons .gold{background:linear-gradient(#ffdc7b,#f3bb36)}
.hero .hero-buttons svg{width:32px;height:32px}
.hero .hero-benefits{position:static;display:flex;gap:26px;margin-top:32px;width:138%;color:#ffcd4d}
.hero .hero-benefits>span{max-width:none;gap:16px;flex:1}
.hero .hero-benefits svg{width:54px;height:54px}
.hero .hero-benefits b{width:auto;font-size:clamp(13px,1.02vw,20px);line-height:1.35}
.hero .fleet-preview{inset-inline-end:-3%;bottom:5.5%;display:flex;gap:16px;padding:7px 18px 7px 7px;font-size:clamp(14px,1.05vw,21px);border-radius:12px;background:#00291fe8}
.hero .fleet-thumb{display:block;width:10.2vw;height:4.1vw;border-radius:8px}
.hero .fleet-thumb img{object-position:80% 70%}
.hero .play{width:52px;height:52px;font-size:24px}
.hero .fleet-preview small{font-size:.85em;margin-top:4px}
html[dir=rtl] .topbar .nav-actions .lang{color:#002b24}
html[dir=rtl] .hero .hero-copy{padding:24px;border-radius:12px;background:#00291fd9}
html[dir=rtl] .hero h1{font-size:clamp(30px,2.65vw,52px);line-height:1.25}
html[dir=rtl] .hero .hero-copy>p{font-size:clamp(14px,1.05vw,20px)}
html[dir=rtl] .hero .hero-benefits{width:100%;flex-wrap:wrap;gap:18px}
html[dir=rtl] .hero .hero-benefits>span{flex:1 1 40%}
.topbar a:focus-visible,.topbar button:focus-visible,.hero a:focus-visible{outline:3px solid #ffd15e;outline-offset:5px}
@media(min-width:1201px){
 .hero .eyebrow{margin-bottom:.81vw}.hero h1{margin-bottom:1.22vw}.hero .hero-buttons{margin-top:1.42vw;gap:.61vw}.hero .hero-buttons .btn{padding:.61vw 1.27vw;gap:.91vw}.hero .hero-buttons svg{width:1.63vw;height:1.63vw}.hero .hero-benefits{margin-top:1.63vw;gap:1.32vw}.hero .hero-benefits>span{gap:.81vw}.hero .hero-benefits svg{width:2.75vw;height:2.75vw}
}
@media(max-width:1200px){
 .topbar{height:84px;background:#002b24}.topbar .nav{width:94%;gap:16px}.topbar .brand{width:190px}.topbar .menu{display:block;margin-inline-start:auto;border:1px solid #ffffff70;border-radius:5px;color:white;background:none;font-size:24px;padding:5px 10px}
 .topbar .nav nav{display:none;position:absolute;top:84px;inset-inline:0;background:#002b24;padding:20px;gap:24px;justify-content:center;flex-wrap:wrap;margin:0}.topbar .nav nav.open{display:flex}.topbar .nav-actions{margin:0;gap:20px}.topbar .lang,html[dir=rtl] .topbar .nav-actions .lang{color:white}.topbar .nav-cta{display:inline-flex}
 .hero .hero-inner{padding-block:40px 100px}.hero .hero-copy{width:48%}.hero .hero-copy>p{width:100%}.hero .hero-benefits{width:120%;gap:16px}.hero .hero-benefits svg{width:36px;height:36px}.hero .hero-benefits>span{gap:8px}.hero .hero-buttons .btn{padding:10px 16px;gap:10px}.hero .hero-buttons svg{width:24px;height:24px}.hero .fleet-preview{bottom:16px;inset-inline-end:0}.hero .fleet-thumb{width:120px;height:48px}.hero .play{width:36px;height:36px;font-size:18px}
}
@media(max-width:900px){
 .hero:before{background:none}
 .hero .hero-media{height:auto;aspect-ratio:2.866;inset:0 0 auto}.hero .hero-media img{object-fit:contain}.hero .hero-inner{padding:calc(100vw / 2.866 + 24px) 0 24px;min-height:0;width:90%}.hero .hero-copy,html[dir=rtl] .hero .hero-copy{width:100%;padding:0;background:none}.hero h1{font-size:44px;max-width:650px}.hero .hero-copy>p{max-width:600px;font-size:17px;line-height:1.5}.hero .hero-benefits{width:100%;margin:28px 0;gap:20px}.hero .hero-benefits b{font-size:14px}.hero .fleet-preview{position:static;width:max-content;max-width:100%;font-size:16px}.hero .fleet-thumb{width:150px;height:60px}.hero .hero-buttons .btn{font-size:15px;min-height:52px}html[dir=rtl] .hero h1{font-size:36px}html[dir=rtl] .hero .hero-copy>p{font-size:17px}
}
@media(max-width:560px){
 .topbar .nav{width:94%;gap:10px}.topbar .brand{width:115px}.topbar .nav-actions{gap:0}.topbar .lang{font-size:13px;min-width:0;gap:6px}.topbar .lang svg{width:23px;height:23px}.topbar .nav-cta{display:none}.topbar .nav nav{gap:18px}.topbar .nav nav a{font-size:15px}
 .hero h1,.hero h1 em{font-size:35px}.hero .eyebrow{font-size:12px;margin-inline-start:14px}.hero .eyebrow:before{inset-inline-start:-14px;width:4px}.hero .hero-buttons{gap:10px;margin-top:22px}.hero .hero-buttons .btn{padding:10px;gap:8px;font-size:12px;flex:1}.hero .hero-buttons svg{width:23px;height:23px}.hero .hero-benefits{display:grid;grid-template-columns:1fr 1fr;gap:20px}.hero .hero-benefits svg{width:38px;height:38px}.hero .hero-benefits>span{gap:12px}.hero .fleet-preview{gap:12px;padding:7px;font-size:14px}.hero .fleet-thumb{width:110px;height:48px}.hero .play{width:34px;height:34px}html[dir=rtl] .hero h1{font-size:30px}
}