@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

:root{--yellow:#ffc617;--dark:#222;--card:#3e3e3d;--muted:#666;--soft:#f7f7f7}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:#343434;background:#fff;font-family:Inter,Arial,sans-serif}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.container{width:min(1080px,calc(100% - 40px));margin:auto}
.site-header{height:82px;padding:0 max(4vw,30px);display:flex;align-items:center;justify-content:space-between;background:#fff}
.brand img{width:162px}
.site-header nav{display:flex;align-items:center;gap:65px;font-size:15px;font-weight:500}
.app-button{height:44px;display:flex;align-items:center;border-radius:10px;overflow:hidden}
.app-button--dark{color:#fff;background:#191c22;border:2px solid #191c22}
.app-button strong{padding:0 17px;font-size:14px;white-space:nowrap}
.button-icon{display:grid;place-items:center;width:50px;height:42px;flex:0 0 50px;color:#111;background:#ffca05}
.dot-arrow{position:relative;width:16px;height:18px;display:block}
.dot-arrow i{position:absolute;width:3px;height:3px;border-radius:50%;background:#111}
.dot-arrow i:nth-child(1){left:0;top:0}.dot-arrow i:nth-child(2){left:0;top:5px}.dot-arrow i:nth-child(3){left:0;top:10px}.dot-arrow i:nth-child(4){left:0;top:15px}
.dot-arrow i:nth-child(5){left:4px;top:3px}.dot-arrow i:nth-child(6){left:4px;top:12px}.dot-arrow i:nth-child(7){left:8px;top:6px}.dot-arrow i:nth-child(8){left:8px;top:9px}.dot-arrow i:nth-child(9){left:12px;top:7.5px}
.hero{min-height:570px;display:grid;grid-template-columns:1fr 1fr;overflow:hidden;color:#fff;background:linear-gradient(105deg,#1c1c1b 0%,#252525 45%,#565656 100%)}
.hero__content{align-self:center;padding:70px 4vw 70px max(5vw,64px);position:relative;z-index:2}
.eyebrow{display:inline-block;margin:0 0 25px;padding:9px 17px;border-radius:25px;color:#1c1c1c;background:#f3f3f3;font-weight:600;font-size:14px}
.hero h1{margin:0;font-size:clamp(43px,4.2vw,64px);line-height:1.06;letter-spacing:-2px}
.hero__text{max-width:560px;margin:28px 0;color:#e3e3e3;font-size:18px;line-height:1.55}
.store-buttons{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.store-badge{width:190px;height:58px;padding:7px 13px;display:flex;align-items:center;gap:11px;border:1px solid #777;border-radius:8px;background:#050505;color:#fff}
.store-badge__text{display:flex;flex-direction:column;line-height:1}
.store-badge__text small{margin-bottom:3px;font-size:9px;letter-spacing:.2px}
.store-badge__text strong{font-size:20px;font-weight:500;white-space:nowrap}
.apple-mark{position:relative;width:29px;height:31px;flex:0 0 29px}
.apple-mark:before{content:"";position:absolute;left:4px;bottom:1px;width:22px;height:24px;background:#fff;border-radius:48% 48% 54% 54% / 56% 56% 45% 45%;clip-path:polygon(0 24%,22% 4%,50% 9%,73% 0,100% 22%,91% 56%,70% 100%,50% 91%,30% 100%,9% 58%)}
.apple-mark:after{content:"";position:absolute;left:16px;top:0;width:9px;height:5px;border-radius:100% 0 100% 0;background:#fff;transform:rotate(-28deg)}
.play-mark{width:30px;height:31px;flex:0 0 30px;background:conic-gradient(from 32deg at 35% 50%,#42a5f5 0 24%,#66bb6a 0 49%,#ffca28 0 74%,#ef5350 0);clip-path:polygon(4% 0,100% 50%,4% 100%,0 92%,0 8%)}
.primary-button,.secondary-button{display:inline-flex;align-items:center;justify-content:center;min-height:60px;padding:0 35px;border-radius:8px;font-size:17px;font-weight:700}
.primary-button{color:#242424;background:var(--yellow)}
.secondary-button{border:2px solid #303030}
.hero__visual{position:relative;min-height:570px}
.hero__visual>img:not(.hero__car){position:absolute;z-index:2;right:13%;bottom:0px;width:418px;height:570px;object-fit:contain;object-position:bottom}
.hero__visual .hero__car{position:absolute;z-index:3;right:2%;bottom:-21px;width:470px;height:279px;object-fit:contain;object-position:center;filter:none}
.hero__circle{position:absolute;z-index:1;width:245px;height:245px;border-radius:50%;background:#ffc83d;left:30%;top:22%}
.hero__dot{position:absolute;z-index:1;right:19%;top:20%;width:30px;height:30px;border-radius:50%;background:#ffc83d}
.section{padding:70px 0}
.section h2{margin:0 0 35px;text-align:center;font-size:38px;letter-spacing:-1.5px}
.services{background:var(--soft)}
.services .container{width:min(870px,calc(100% - 40px))}
.services__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.service-card{min-height:185px;padding:20px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:16px;text-align:center;color:var(--yellow);background:var(--card)}
.service-card img{width:60px;height:60px;object-fit:contain;filter:grayscale(1) brightness(4)}
.service-card h3{margin:9px 0 0;font-size:25px;line-height:1.15}
@media(min-width:1450px){
  .services{padding:64px 0}
  .services .container{width:min(1632px,calc(100% - 120px));display:grid;grid-template-columns:500px minmax(0,1fr);align-items:center;gap:44px}
  .services .container>h2{margin:0;text-align:left;font-size:44px;letter-spacing:-1.5px}
  .services__grid{gap:16px}
  .service-card{min-height:251px;padding:26px 20px}
  .service-card img{width:72px;height:72px}
  .service-card h3{margin-top:12px;font-size:32px;line-height:1.17;letter-spacing:-1px}
}
.steps{padding:62px 0 52px}
.steps .container{width:min(1540px,82vw)}
.steps.section h2{margin-bottom:38px;font-size:clamp(38px,3vw,56px);line-height:1.1}
.steps__grid{display:grid;grid-template-columns:repeat(3,1fr)}
.steps article{min-height:clamp(245px,20.5vw,388px);padding:36px clamp(32px,4vw,76px);text-align:center;border-right:1px solid #d8d8d8}
.steps article:last-child{border:0}
.steps span{display:grid;place-items:center;width:clamp(52px,4.25vw,80px);height:clamp(52px,4.25vw,80px);margin:0 auto clamp(18px,2vw,38px);border-radius:50%;background:#e9e9e9;color:#191919;font-size:clamp(23px,1.55vw,29px);font-weight:800}
.steps h3{margin:0 0 clamp(18px,1.4vw,27px);font-size:clamp(18px,1.55vw,30px);line-height:1.2;letter-spacing:-1px}
.steps p{margin:0 auto;max-width:500px;color:#292929;font-size:clamp(14px,1.22vw,23px);line-height:1.4}
.comfort{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:325px;background:#f1f1f1;color:#373737}
.comfort__image{display:flex;align-items:center;justify-content:center}
.comfort__image img{width:436px;max-width:75%}
.comfort__content{padding:45px max(5vw,55px)}
.comfort__content>h2{font-size:38px;line-height:1.08;margin:0 0 18px}
.comfort__content>p{max-width:540px;color:#3f3f3f;line-height:1.55;font-size:15px}
@media(min-width:1450px){
  .comfort{min-height:486px;grid-template-columns:1fr 1fr;background:#ededed}
  .comfort__image{justify-content:center;padding-left:40px}
  .comfort__image img{width:650px;max-width:82%}
  .comfort__content{padding:55px 6vw 55px 4vw}
  .comfort__content>h2{margin-bottom:24px;font-size:60px;line-height:1.08;letter-spacing:-2px}
  .comfort__content>p{max-width:700px;margin:0;color:#111;font-size:20px;line-height:1.35}
}
.download-callout{display:grid;place-items:center;min-height:377px;padding:60px 40px;background:#fff}
.download-callout>div{width:min(1140px,100%);min-height:232px;padding:42px 50px;display:grid;grid-template-columns:minmax(0,1fr) 314px;align-items:center;gap:58px;border-radius:20px;background:#ffc90b}
.download-callout h2{margin:0 0 24px;color:#171717;font-size:35px;line-height:1.08;letter-spacing:-1.2px}
.download-callout p{max-width:900px;margin:0;color:#171717;font-size:18px;line-height:1.4}
.dark-button{display:inline-flex;align-items:center;justify-content:center;width:314px;height:80px;border-radius:10px;background:#3c3c3c;color:#fff;font-size:20px;font-weight:700}
.driver{min-height:838px;padding:45px max(7vw,70px);display:grid;grid-template-columns:minmax(420px,1fr) minmax(600px,1.12fr);align-items:center;gap:70px;background:#3e3e3e;color:#fff;overflow:hidden}
.driver__content{width:min(715px,100%);margin:0}
.overline{margin:0 0 24px;text-align:left;font-weight:700;font-size:20px}
.driver h2{text-align:left;margin:0 0 38px;padding-bottom:38px;border-bottom:2px solid #aaa;color:var(--yellow);font-size:52px;line-height:1.06;letter-spacing:-2px;white-space:nowrap}
.requirements{display:grid;grid-template-columns:1fr}
.requirements article{display:grid;grid-template-columns:105px 1fr;gap:14px;padding:0 36px 24px;border-bottom:2px solid #aaa}
.requirements article+article{padding-top:38px}
.requirements article>img{width:80px;height:80px;padding:21px;border-radius:50%;background:#f5f5f5;object-fit:contain}
.requirements h3{margin:4px 0 20px;font-size:30px}.requirements ul{margin:0;padding-left:34px}.requirements li{margin-bottom:8px;font-size:19px;line-height:1.2}
.driver__actions{display:grid;grid-template-columns:315px 1fr;gap:42px;margin:23px 0 0}
.driver__actions a{min-height:80px;font-size:24px}
.driver__actions .primary-button{background:var(--yellow);color:#333}
.driver__actions .secondary-button{border:0;color:#fff}
.driver__image{height:auto;display:flex;align-self:start;align-items:center;justify-content:flex-end;margin-top:30px}
.driver__image img{width:725px;max-width:none;height:auto;object-fit:contain;transform:translateX(74px)}
@media(min-width:1450px){
  .driver__content{transform:translateX(40px)}
}
footer{background:#252525;color:#eee}
.footer__grid{display:grid;grid-template-columns:1.25fr .7fr .85fr 1.2fr;gap:45px;padding:40px 0 25px}
.footer__logo{width:127px;height:29px;object-fit:contain;margin-bottom:25px}
.footer__grid h3{margin:0 0 22px;color:var(--yellow)}
.footer__grid p,.footer__grid a{display:block;color:#bbb;font-size:13px;line-height:1.65;margin:0 0 11px}
.copyright{padding:18px 20px;text-align:center;border-top:1px solid #444;color:#aaa;font-size:12px}
@media(max-width:850px){
  .site-header{height:72px;padding:0 20px}.brand img{width:145px}.site-header nav>a:first-child{display:none}.site-header nav{gap:0}.app-button strong{display:none}.button-icon{width:45px;flex-basis:45px}
  .hero{grid-template-columns:1fr;min-height:auto}.hero__content{padding:55px 25px 25px}.hero__content h1 br{display:none}.hero__visual{min-height:390px}.hero__visual>img:not(.hero__car){right:8%;width:70%;height:100%}.hero__visual .hero__car{right:1%;bottom:35px;width:48%}.hero__circle{width:240px;height:240px}
  .services__grid,.steps__grid{grid-template-columns:1fr}.service-card{min-height:185px}.steps .container{width:min(100% - 40px,560px)}.steps article{min-height:0;border-right:0;border-bottom:1px solid #ddd;padding:34px 15px}.steps article:last-child{border-bottom:0}
  .comfort{grid-template-columns:1fr}.comfort__image{padding-top:40px}.comfort__content{padding:35px 25px 55px;text-align:center}.comfort__content>p{margin-inline:auto}
  .download-callout{min-height:auto;padding:45px 20px}.download-callout>div{min-height:0;padding:34px 28px;grid-template-columns:1fr;gap:28px;text-align:center}.download-callout h2{margin-bottom:18px;font-size:34px}.download-callout p{font-size:17px}.dark-button{width:min(314px,100%);height:64px;justify-self:center;font-size:20px}
  .driver{min-height:0;padding:0 20px 60px;grid-template-columns:1fr;gap:10px}.driver__image{height:450px;justify-content:center;margin-top:0}.driver__image img{width:min(578px,95%);height:430px;transform:none}.driver__content{width:min(580px,100%);margin:auto;transform:none}.overline{text-align:center;font-size:16px}.driver h2{text-align:center;font-size:40px;white-space:normal}.requirements article{grid-template-columns:80px 1fr;padding-inline:15px}.requirements article>img{width:64px;height:64px;padding:17px}.requirements h3{font-size:21px}.requirements li{font-size:16px}.driver__actions{grid-template-columns:1fr 1fr;gap:18px}.driver__actions a{min-height:60px;font-size:17px}.footer__grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .eyebrow{font-size:11px}.hero h1{font-size:41px}.hero__text{font-size:16px}.hero__visual{min-height:330px}
  .store-buttons{gap:8px}.store-badge{width:164px;height:52px;padding-inline:10px}.store-badge__text strong{font-size:17px}.store-badge__text small{font-size:8px}.apple-mark,.play-mark{transform:scale(.88)}
  .section{padding:55px 0}.section h2{font-size:31px}.service-card h3{font-size:24px}
  .comfort__content>h2,.driver h2{font-size:32px}.download-callout h2{font-size:30px}.download-callout p{font-size:16px}.requirements article{grid-template-columns:55px 1fr;padding-inline:0}.requirements article>img{width:50px;height:50px;padding:13px}.requirements li{font-size:14px}.driver__actions{grid-template-columns:1fr;margin-inline:0}.footer__grid{grid-template-columns:1fr}
}
