@font-face{font-family:Montserrat;src:url('assets/montserrat.ttf') format('truetype');font-weight:100 900;font-display:swap}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#f7f9fc;color:#16233a;font-family:Montserrat,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}.container{width:min(1200px,calc(100% - 64px));margin-inline:auto}.skip{position:absolute;left:16px;top:-60px;background:#fff;color:#101b2d;z-index:20;padding:10px}.skip:focus{top:10px}:focus-visible{outline:3px solid #72a8ff;outline-offset:3px}.site-header{height:86px;position:absolute;inset:0 0 auto;z-index:10;color:white;border-bottom:1px solid rgba(255,255,255,.15)}.nav-wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:30px}.brand img{width:195px;height:auto;display:block}.site-header nav{display:flex;gap:38px;align-items:center}.site-header nav a{font-size:13px;font-weight:600;color:#dbe4f3;transition:color .2s}.site-header nav a:hover{color:white}.nav-cta{font-size:12px;font-weight:750;border:1px solid rgba(255,255,255,.4);padding:14px 18px;border-radius:4px;white-space:nowrap}.nav-cta span{margin-left:12px;color:#77b8ff}.menu-toggle{display:none;background:none;border:0;color:#fff}.mobile-menu[hidden]{display:none}.hero{min-height:710px;position:relative;background:#09162b;color:#fff;overflow:hidden}.hero-photo{position:absolute;inset:0 0 0 39%;background:url('assets/fleet-hero.png') center 67%/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,#09152a 4%,#0b1a33 34%,rgba(10,26,50,.93) 45%,rgba(9,23,45,.56) 67%,rgba(9,22,43,.13) 100%),linear-gradient(0deg,rgba(6,15,30,.54),transparent 42%)}.hero-inner{min-height:710px;position:relative;display:flex;align-items:center;justify-content:space-between;padding-top:95px}.hero-copy{max-width:690px;padding:60px 0 84px}.eyebrow,.section-kicker{font-size:11px;letter-spacing:.22em;font-weight:800}.eyebrow{color:#9fbbdc;display:flex;align-items:center;gap:14px;margin:0 0 28px}.eyebrow-line{width:30px;height:2px;background:#4a92ff}.hero h1{font-size:clamp(52px,6.5vw,92px);line-height:1.055;letter-spacing:-.065em;margin:0;font-weight:760}.hero h1 em{font-style:normal;color:#6dabff}.hero-lead{font-size:18px;line-height:1.8;color:#ccd8e9;max-width:510px;margin:30px 0 33px}.hero-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.button{display:inline-flex;align-items:center;justify-content:center;gap:34px;border:0;border-radius:4px;font-size:13px;font-weight:800;cursor:pointer;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-primary{background:#3975f3;color:#fff;padding:18px 22px}.button-primary:hover{background:#2464e9}.button span,.text-link span,.inline-cta span{font-size:18px;font-weight:400}.text-link{font-size:13px;font-weight:700;color:#e6effa;display:inline-flex;gap:13px;align-items:center}.hero-note{font-size:11px;color:#acc2db;letter-spacing:.02em;margin:27px 0 0}.hero-note span{color:#81adff;margin-right:6px}.hero-side{align-self:flex-end;display:flex;align-items:center;gap:17px;margin-bottom:53px;color:#9fbbd8;font-size:9px;letter-spacing:.15em;white-space:nowrap;transform:rotate(-90deg) translate(50%,100%);transform-origin:right bottom}.hero-side i{display:block;width:42px;height:1px;background:#76a8e4}.intro{padding:90px 0 98px;background:#fff}.intro-grid{display:grid;grid-template-columns:270px 1fr;gap:70px}.section-kicker{color:#3673e5;margin:0 0 23px}.intro h2,.section-heading h2,.control h2,.closing h2{font-size:clamp(34px,4vw,55px);line-height:1.15;letter-spacing:-.05em;margin:0;font-weight:740}.intro h2 span,.control h2 span{color:#8895a7}.intro p:last-child{max-width:670px;color:#66748a;font-size:16px;line-height:1.9;margin:26px 0 0}.features{background:#f3f6fb;padding:100px 0 115px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:47px}.section-heading>p{max-width:370px;color:#6c798c;line-height:1.8;font-size:14px;margin:0 0 5px}.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-card{background:white;min-height:315px;padding:26px;position:relative;border:1px solid #e4eaf2;display:flex;flex-direction:column}.feature-primary{background:#1a3969;color:#fff;border-color:#1a3969}.feature-num{font-size:10px;font-weight:800;letter-spacing:.12em;color:#738298}.feature-primary .feature-num{color:#a7c4ed}.feature-icon{font-size:37px;color:#3778f1;font-weight:300;margin:33px 0 21px}.feature-primary .feature-icon{color:#85b4ff}.feature-card h3{font-size:18px;letter-spacing:-.035em;margin:0 0 10px}.feature-card p{font-size:12px;line-height:1.75;color:#738095;margin:0 0 22px}.feature-primary p{color:#c6d5eb}.feature-arrow{position:absolute;right:25px;bottom:23px;color:#91a0b3;font-size:18px}.feature-primary .feature-arrow{color:#b5d4fc}.control{background:#fff;padding:122px 0}.control-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center}.control-copy p:not(.section-kicker){color:#6b788d;font-size:15px;line-height:1.9;max-width:450px;margin:27px 0 30px}.inline-cta{display:inline-flex;align-items:center;gap:24px;color:#2f6be4;font-size:13px;font-weight:800;border-bottom:1px solid #c6d6f3;padding-bottom:11px}.dashboard{background:#f9fbff;box-shadow:0 30px 70px rgba(22,48,92,.16);border:1px solid #dfe7f2;border-radius:13px;min-height:386px;position:relative;overflow:hidden;transform:perspective(1000px) rotateY(-4deg) rotateX(2deg)}.dash-top{height:48px;background:#13243e;color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 20px}.dash-logo{font-size:10px;letter-spacing:.1em;font-weight:900}.dash-logo b{color:#70a7ff}.dash-dots{display:flex;gap:5px}.dash-dots i{width:6px;height:6px;border-radius:50%;background:#697d9f}.dash-content{display:grid;grid-template-columns:134px 1fr;min-height:308px}.dash-sidebar{background:#edf2f9;border-right:1px solid #e0e7f1;padding:26px 10px;display:flex;flex-direction:column;gap:6px}.dash-sidebar span{font-size:9px;color:#75859b;padding:10px;border-radius:5px}.dash-sidebar span.active{background:#dbe8ff;color:#2357c6;font-weight:800}.dash-main{padding:24px}.dash-welcome small,.dash-statrow small{display:block;color:#93a1b4;font-size:8px;letter-spacing:.1em;font-weight:800;margin-bottom:6px}.dash-welcome strong{display:block;font-size:16px}.dash-statrow{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.dash-statrow>div{border:1px solid #e2e8f1;border-radius:6px;background:#fff;padding:15px;min-height:88px}.dash-statrow strong{font-size:11px}.dash-statrow i{display:block;background:#2d72ee;border-radius:2px;width:60%;height:3px;margin-top:14px}.dash-statrow>div:nth-child(2) i{background:#67b1df;width:45%}.dash-list{background:#fff;border:1px solid #e2e8f1;border-radius:6px;padding:14px}.dash-list-title{font-size:10px;font-weight:800;display:flex;justify-content:space-between}.dash-list-title span{font-size:14px;color:#5a82ca}.dash-list p{margin:12px 0 0;border-top:1px solid #eef2f6;padding-top:9px;font-size:8px;color:#4b5b72;display:flex;align-items:center;gap:8px}.dash-list p span{margin-left:auto;color:#8e9bae}.dash-list b{width:6px;height:6px;border-radius:50%;background:#3d74eb}.dash-list b.cyan{background:#60b5da}.dash-list b.violet{background:#8f80e5}.demo-label{position:absolute;right:18px;bottom:9px;color:#9aa9ba;font-size:7px;letter-spacing:.1em}.closing{background:#0d1b31;color:#fff;padding:112px 0 120px}.closing-grid{display:grid;grid-template-columns:1fr 450px;gap:90px;align-items:start}.closing .section-kicker{color:#79aeff}.closing h2{max-width:610px}.closing h2 em{font-style:normal;color:#76aaff}.closing-grid>div:first-child>p:not(.section-kicker){color:#b6c5d9;line-height:1.85;max-width:490px;margin:28px 0 37px;font-size:15px}footer{background:#071323;color:#a8b9cf;padding:40px 0}.footer-inner{display:flex;justify-content:space-between;gap:40px}.footer-inner img{width:170px}.footer-inner p{font-size:11px;margin:13px 0 0}.footer-inner>div:last-child{display:flex;flex-direction:column;align-items:flex-end;gap:9px;font-size:11px}.footer-inner a:hover{color:#fff}.footer-inner span{color:#7d8da3}
@media(max-width:1050px){.feature-grid{grid-template-columns:repeat(2,1fr)}.control-grid{gap:40px}.closing-grid{gap:45px}.site-header nav{gap:18px}.hero-side{display:none}}
@media(max-width:760px){.container{width:min(100% - 36px,560px)}.site-header{height:70px}.brand img{width:157px}.site-header nav:not(.mobile-menu),.nav-cta{display:none}.menu-toggle{display:flex;flex-direction:column;gap:6px;padding:10px}.menu-toggle span{width:24px;height:2px;background:#fff}.mobile-menu{display:flex!important;position:absolute;top:70px;left:0;right:0;background:#0c1b32;padding:10px 18px 22px;flex-direction:column;gap:0!important;box-shadow:0 18px 30px rgba(0,0,0,.25)}.mobile-menu[hidden]{display:none!important}.mobile-menu a{padding:13px}.hero,.hero-inner{min-height:650px}.hero-photo{inset:0;background-position:63% 65%;opacity:.7}.hero-shade{background:linear-gradient(90deg,rgba(7,18,36,.96),rgba(7,18,36,.68)),linear-gradient(0deg,#08162b,transparent 65%)}.hero-inner{align-items:flex-end}.hero-copy{padding:125px 0 74px}.hero h1{font-size:clamp(48px,10vw,68px)}.hero-lead{font-size:15px;line-height:1.7;margin:23px 0 27px}.hero-actions{gap:19px}.button-primary{padding:17px 16px}.hero-note{line-height:1.5}.intro{padding:65px 0}.intro-grid{display:block}.intro-grid>.section-kicker{margin-bottom:18px}.intro h2,.section-heading h2,.control h2,.closing h2{font-size:36px}.intro p:last-child{font-size:14px;margin-top:20px}.features{padding:70px 0}.section-heading{display:block;margin-bottom:30px}.section-heading>p{margin-top:19px}.feature-grid{grid-template-columns:1fr;gap:10px}.feature-card{min-height:245px}.feature-icon{margin:20px 0 15px}.control{padding:75px 0}.control-grid{grid-template-columns:1fr;gap:45px}.dashboard{transform:none;min-height:310px}.dash-content{grid-template-columns:90px 1fr}.dash-sidebar{padding:18px 6px}.dash-sidebar span{font-size:7px;padding:8px 5px}.dash-main{padding:15px}.dash-statrow{gap:6px}.dash-statrow>div{padding:9px}.dash-list p span{display:none}.closing{padding:75px 0}.closing-grid{grid-template-columns:1fr;gap:42px}.footer-inner{flex-direction:column;gap:27px}.footer-inner>div:last-child{align-items:flex-start}}
@media(max-width:390px){.hero h1{font-size:45px}.hero-actions{align-items:flex-start;flex-direction:column}.dash-sidebar{display:none}.dash-content{display:block}.dash-main{padding:17px}}

/* Feature cards */
.feature-grid{gap:16px}
.feature-card{
  min-height:326px;
  padding:28px;
  overflow:hidden;
  isolation:isolate;
  border-radius:8px;
  box-shadow:0 8px 28px rgba(20,52,98,.025);
  transition:transform .42s cubic-bezier(.2,.8,.2,1),box-shadow .42s ease,border-color .3s ease;
}
.feature-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:3px;
  background:linear-gradient(90deg,#4382ff,#72c5f4);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .45s ease;
}
.feature-card::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:210px;
  height:210px;
  right:-105px;
  top:-105px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(74,139,246,.12),transparent 69%);
  opacity:0;
  transform:scale(.55);
  transition:transform .55s ease,opacity .55s ease;
}
.feature-card:hover{
  transform:translateY(-9px);
  border-color:#c7d9f3;
  box-shadow:0 22px 42px rgba(23,58,114,.13);
}
.feature-card:hover::before{transform:scaleX(1)}
.feature-card:hover::after{opacity:1;transform:scale(1)}
.feature-primary{
  background:linear-gradient(145deg,#1b3b6d,#142d55);
  border-color:#1b3b6d;
}
.feature-primary:hover{border-color:#4785ed;box-shadow:0 24px 44px rgba(17,48,99,.28)}
.feature-primary::after{background:radial-gradient(circle,rgba(125,185,255,.19),transparent 69%)}
.feature-icon{
  display:grid;
  place-items:center;
  width:60px;
  height:60px;
  margin:26px 0 22px;
  border-radius:16px;
  color:#3679ed;
  background:#edf4ff;
  border:1px solid #dceaff;
  box-shadow:0 7px 15px rgba(46,110,215,.08);
  transition:transform .4s cubic-bezier(.2,.8,.2,1),background .4s ease,box-shadow .4s ease;
  animation:feature-icon-float 4.5s ease-in-out infinite;
  animation-delay:calc(var(--i) * -.35s);
}
.feature-primary .feature-icon{color:#9fc8ff;background:rgba(126,178,255,.13);border-color:rgba(154,199,255,.23)}
.feature-icon svg{
  width:34px;
  height:34px;
  stroke:currentColor;
  stroke-width:2.1;
  stroke-linecap:round;
  stroke-linejoin:round;
  transition:transform .4s ease,stroke-width .35s ease;
}
.feature-card:hover .feature-icon{
  animation-play-state:paused;
  transform:translateY(-4px) rotate(-5deg) scale(1.08);
  background:#e3efff;
  box-shadow:0 12px 25px rgba(46,110,215,.18);
}
.feature-primary:hover .feature-icon{background:rgba(143,195,255,.24)}
.feature-card:hover .feature-icon svg{transform:rotate(5deg);stroke-width:2.4}
.feature-card h3{font-size:17px;line-height:1.3}
.feature-card p{font-size:12px;line-height:1.75;max-width:250px}
.feature-arrow{transition:transform .35s ease,color .35s ease}
.feature-card:hover .feature-arrow{transform:translate(4px,-4px);color:#3378ed}
.feature-primary:hover .feature-arrow{color:#a7ceff}
.reveal-ready .feature-card{opacity:0;transform:translateY(28px)}
.reveal-ready .feature-card.is-visible{
  opacity:1;
  transform:translateY(0);
  transition:opacity .6s ease,transform .65s cubic-bezier(.2,.8,.2,1),box-shadow .42s ease,border-color .3s ease;
  transition-delay:calc(var(--i) * 55ms);
}
.reveal-ready .feature-card.is-visible:hover{
  transform:translateY(-9px);
  transition-delay:0ms;
}
@keyframes feature-icon-float{0%,100%{translate:0 0}50%{translate:0 -4px}}

/* Keep navigation visible over every section. */
.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  background:rgba(8,21,41,.94);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 8px 28px rgba(6,18,36,.12);
}
html{scroll-padding-top:86px}
#top,#mogucnosti,#kako-radi,#kontakt{scroll-margin-top:86px}

/* Bring the vehicles closer in the desktop hero without changing its artwork. */
@media(min-width:761px){
  .hero-photo{background-size:118% auto;background-position:right 72%}
}

/* Real application screenshot */
.control-grid{grid-template-columns:.76fr 1.24fr;gap:50px}
.app-shot{margin:0;min-width:0;position:relative;isolation:isolate}
.app-shot::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:8% -6% 8%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(54,116,225,.22),transparent 67%);
  filter:blur(18px);
}
.monitor{
  transform:perspective(1500px) rotateY(-3deg) rotateX(1deg);
  transition:transform .55s cubic-bezier(.2,.8,.2,1);
}
.monitor:hover{transform:perspective(1500px) rotateY(0) rotateX(0) translateY(-6px)}
.monitor-frame{
  padding:8px 8px 0;
  border:1px solid #38506f;
  border-radius:16px;
  background:linear-gradient(145deg,#233750 0%,#0b1729 48%,#192d47 100%);
  box-shadow:0 28px 55px rgba(10,30,61,.24),0 48px 75px rgba(21,65,140,.13),inset 0 1px 0 rgba(255,255,255,.27);
}
.monitor-top{height:16px;display:grid;place-items:center}
.monitor-camera{
  width:5px;
  height:5px;
  border-radius:50%;
  background:#112a4c;
  border:1px solid #456487;
  box-shadow:0 0 0 2px rgba(5,15,30,.44);
}
.app-shot-scroll{
  overflow:hidden;
  border:1px solid #31425b;
  border-radius:5px 5px 2px 2px;
  background:#0d1728;
}
.app-shot img{display:block;width:100%;height:auto}
.monitor-chin{
  height:28px;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
}
.monitor-brand{font-size:8px;font-weight:850;letter-spacing:.23em;color:#9aafc8}
.monitor-brand-dot{color:#5a98ff}
.monitor-power{
  position:absolute;
  right:10px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#56a5ff;
  box-shadow:0 0 9px rgba(85,167,255,.9);
}
.monitor-neck{
  width:82px;
  height:29px;
  margin:auto;
  background:linear-gradient(90deg,#1b2c43,#64768d 48%,#15273f);
  clip-path:polygon(20% 0,80% 0,91% 100%,9% 100%);
  box-shadow:0 12px 18px rgba(13,33,66,.15);
}
.monitor-base{
  width:220px;
  height:12px;
  margin:-1px auto 0;
  border-radius:50% 50% 7px 7px;
  background:linear-gradient(180deg,#72849a,#213750 60%,#0d1c30);
  box-shadow:0 12px 23px rgba(20,45,82,.23);
}
.app-shot figcaption{
  margin-top:20px;
  color:#8998ac;
  font-size:9px;
  font-weight:800;
  letter-spacing:.13em;
  text-align:center;
}

/* Hero secondary action */
.text-link{
  position:relative;
  padding-bottom:8px;
  transition:color .25s ease;
}
.text-link::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:0;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg,#67a7ff,#a4ccff);
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}
.text-link span{transition:transform .3s ease,color .3s ease}
.text-link:hover,.text-link:focus-visible{color:#90bdff}
.text-link:hover::after,.text-link:focus-visible::after{transform:scaleX(1)}
.text-link:hover span,.text-link:focus-visible span{transform:translateY(4px);color:#90bdff}

/* Header trial action */
.nav-cta{
  background:rgba(255,255,255,.025);
  transition:background .28s ease,border-color .28s ease,box-shadow .28s ease,transform .28s ease;
}
.nav-cta span{display:inline-block;transition:transform .28s ease,color .28s ease}
.nav-cta:hover,.nav-cta:focus-visible{
  background:rgba(57,117,243,.22);
  border-color:#8ebaff;
  box-shadow:0 10px 26px rgba(41,99,215,.24),inset 0 0 0 1px rgba(142,186,255,.18);
  transform:translateY(-2px);
}
.nav-cta:hover span,.nav-cta:focus-visible span{
  color:#b9d7ff;
  transform:translate(3px,-3px);
}
@media(max-width:1050px){
  .control-grid{gap:38px}
}
@media(max-width:760px){
  html{scroll-padding-top:70px}
  #top,#mogucnosti,#kako-radi,#kontakt{scroll-margin-top:70px}
  .control-grid{grid-template-columns:1fr}
  .app-shot-scroll{overflow:hidden}
  .app-shot img{width:100%;max-width:100%;height:auto}
  .monitor{transform:none}
  .monitor:hover{transform:none}
  .monitor-frame{padding:5px 5px 0;border-radius:11px}
  .monitor-top{height:10px}
  .monitor-chin{height:19px}
  .monitor-neck{height:18px;width:58px}
  .monitor-base{width:150px;height:9px}
  .monitor-brand{font-size:6px}
  .feature-grid{gap:12px}
  .feature-card{min-height:275px;padding:24px}
  .feature-icon{margin:17px 0 17px}
  .feature-card p{max-width:440px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .monitor{transition:none}
  .monitor:hover{transform:none}
  .nav-cta,.nav-cta span{transition:none}
  .nav-cta:hover,.nav-cta:focus-visible,.nav-cta:hover span,.nav-cta:focus-visible span{transform:none}
  .text-link,.text-link::after,.text-link span{transition:none}
  .feature-icon{animation:none}
  .feature-card,.feature-card::before,.feature-card::after,.feature-icon,.feature-icon svg,.feature-arrow{transition:none!important}
  .reveal-ready .feature-card,.reveal-ready .feature-card.is-visible{opacity:1;transform:none;transition:none}
  .feature-card:hover,.reveal-ready .feature-card.is-visible:hover{transform:none}
}

/* A shared motion rhythm throughout the page. */
.reveal-ready .motion-reveal{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .75s ease,transform .85s cubic-bezier(.2,.75,.2,1);
  transition-delay:var(--reveal-delay,0ms);
}
.reveal-ready .motion-reveal.is-visible,
.reveal-ready .motion-reveal:focus-within{opacity:1;transform:none}
.button{transition:transform .25s ease,background .25s ease,box-shadow .25s ease}
.button span,.inline-cta span{display:inline-block;transition:transform .3s ease}
.button:hover,.button:focus-visible{transform:translateY(-3px);box-shadow:0 10px 25px rgba(34,99,235,.25)}
.button:hover span,.button:focus-visible span,
.inline-cta:hover span,.inline-cta:focus-visible span{transform:translate(3px,-3px)}
.button:active{transform:translateY(0)}
.inline-cta{transition:color .25s ease,border-color .25s ease}
.inline-cta:hover,.inline-cta:focus-visible{color:#174dae;border-color:#3975f3}
.site-header nav a{position:relative;transition:color .25s ease}
.site-header nav a::after{
  content:"";position:absolute;bottom:-7px;left:0;right:0;height:2px;
  background:#76adff;transform:scaleX(0);transform-origin:left;transition:transform .25s ease;
}
.site-header nav a:hover::after,.site-header nav a:focus-visible::after{transform:scaleX(1)}footer a{transition:color .25s ease}footer a:hover{color:#8bbaff}
@media(prefers-reduced-motion:no-preference){
  .hero-copy > *{animation:hero-enter .85s cubic-bezier(.2,.75,.2,1) both}
  .hero-copy > :nth-child(2){animation-delay:100ms}
  .hero-copy > :nth-child(3){animation-delay:200ms}
  .hero-copy > :nth-child(4){animation-delay:300ms}
  .hero-copy > :nth-child(5){animation-delay:400ms}
  .hero-photo{transform-origin:75% 75%;animation:hero-settle 9s cubic-bezier(.2,.6,.3,1) both}
  .monitor-power{animation:power-glow 4s ease-in-out infinite}
}
@keyframes hero-enter{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes hero-settle{from{transform:scale(1.045)}to{transform:scale(1)}}
@keyframes power-glow{0%,100%{box-shadow:0 0 6px rgba(85,167,255,.5)}50%{box-shadow:0 0 13px rgba(85,167,255,.95)}}
@media(prefers-reduced-motion:reduce){
  .reveal-ready .motion-reveal{opacity:1;transform:none;transition:none}
  .button,.button span,.inline-cta,.inline-cta span,.site-header nav a,
  .site-header nav a::after,footer a{transition:none}
  .button:hover,.button:focus-visible,.button:hover span,.button:focus-visible span,
  .inline-cta:hover span,.inline-cta:focus-visible span,.text-link:hover span,.text-link:focus-visible span{transform:none}
}

/* Automotive details: light blooms stay aligned with the original photo. */
.hero-lights{position:absolute;width:118%;height:auto;aspect-ratio:2/3;right:0;top:72%;transform:translateY(-72%);pointer-events:none;overflow:visible}
.headlights{fill:url(#headlight-glow);opacity:0}

@media(prefers-reduced-motion:no-preference){
  .headlights{animation:headlight-greeting 12s ease-in-out infinite;animation-play-state:paused}
  .headlights-suv{animation-delay:.35s}
  .headlights-van{animation-delay:.7s}
  .hero.is-in-view .headlights{animation-play-state:running}
}
@keyframes headlight-greeting{0%,5%,13%,24%,100%{opacity:0}9%,18%{opacity:.85}}
/* Mobile uses the same crop for the photo and its headlight overlay. */
@media(max-width:760px){
  .hero{--hero-scene-height:clamp(260px,70vw,440px);min-height:0}
  .hero-inner{min-height:0;align-items:flex-start;padding-top:100px}
  .hero-copy{width:100%;padding:0 0 calc(var(--hero-scene-height) - 40px)}
  .hero .eyebrow{margin-bottom:22px}
  .hero h1{font-size:clamp(34px,10.8vw,68px)}
  .hero-lead{margin:20px 0 24px}
  .hero-note{margin-top:22px}
  .hero-photo{
    inset:auto 0 0;
    height:var(--hero-scene-height);
    background-size:160% auto;
    background-position:right 82%;
    opacity:1;
    animation:none;
  }
  .hero-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(#09162b,transparent 35%);pointer-events:none}
  .hero-shade{background:linear-gradient(0deg,rgba(6,15,30,.12),transparent 30%)}
  .hero-lights{display:block;width:160%;right:0;top:82%;transform:translateY(-82%)}
}
@media(prefers-reduced-motion:reduce){.headlights{display:none}}

/* Photographic vehicles pass through two planes below the introduction. */
.fleet-driveby{
  position:relative;height:300px;margin:30px 0 -65px;overflow:hidden;isolation:isolate;
  pointer-events:none;background:radial-gradient(ellipse at 50% 90%,#edf3fc 0,transparent 65%);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.driveby-horizon{position:absolute;left:6%;right:6%;bottom:36px;height:1px;background:linear-gradient(90deg,transparent,#c7d4e5,transparent)}
.fleet-vehicle{position:absolute;left:0;will-change:transform}
.fleet-vehicle::after{content:"";position:absolute;z-index:-1;left:6%;right:6%;height:12px;border-radius:50%;background:#142d4b40;filter:blur(8px)}
.fleet-vehicle-sedan{width:clamp(370px,39vw,580px);bottom:4px;z-index:2;transform:translateX(8vw)}
.fleet-vehicle-sedan::after{bottom:8%}
.fleet-vehicle-van{width:clamp(310px,30vw,450px);bottom:92px;z-index:1;transform:translateX(62vw)}
.fleet-vehicle-van::after{bottom:3%}
.vehicle-body{position:relative}
.vehicle-body>img{width:100%;height:auto;display:block}
@media(prefers-reduced-motion:no-preference){
  .fleet-vehicle-sedan{animation:sedan-driveby 18s linear -4s infinite paused}
  .fleet-vehicle-van{animation:van-driveby 22s linear -5s infinite paused}
  .fleet-driveby.is-in-view .fleet-vehicle{animation-play-state:running}
}
@keyframes sedan-driveby{from{transform:translateX(-110%)}to{transform:translateX(110vw)}}
@keyframes van-driveby{from{transform:translateX(110vw)}to{transform:translateX(-110%)}}
@media(max-width:760px){
  .fleet-driveby{height:215px;margin-top:24px;margin-bottom:-35px}
  .fleet-vehicle-sedan{width:330px;bottom:0}
  .fleet-vehicle-van{width:275px;bottom:80px}
  .driveby-horizon{bottom:25px}
}
@media(prefers-reduced-motion:reduce){
  .fleet-vehicle{will-change:auto}
  .fleet-vehicle-sedan{transform:translateX(4vw)}
  .fleet-vehicle-van{transform:translateX(52vw)}
}


/* Direct contact: two prominent, fully clickable choices. */
.closing{position:relative;overflow:hidden;background:radial-gradient(ellipse at 95% 40%,#17355b80,transparent 60%),#0d1b31;padding:105px 0}
.closing-grid{grid-template-columns:1fr 1.05fr;gap:70px;align-items:center}
.contact-copy h2{max-width:550px}
.closing-grid .contact-copy>p:not(.section-kicker){max-width:485px;margin:25px 0 28px}
.contact-trial{display:flex;align-items:center;gap:13px;color:#b8d3f9}
.contact-trial>svg{width:27px;height:27px;flex-shrink:0;stroke:#84b5ff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.contact-trial>span{display:flex;flex-direction:column;gap:6px}
.contact-trial strong{font-size:14px;color:#edf4ff}
.contact-trial span span{font-size:12px;color:#9eb1cb}
.contact-options{display:grid;gap:18px;min-width:0}
.contact-card{display:grid;grid-template-columns:48px minmax(0,1fr) 20px;align-items:center;gap:20px;padding:32px 28px;border:1px solid #3b5273;border-radius:14px;background:#15283f;box-shadow:0 15px 35px #06102420;transition:background .3s,border-color .3s,box-shadow .3s,translate .3s}
.contact-card-email{background:linear-gradient(120deg,#224d89,#193762);border-color:#456faa}
.contact-card-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid #ffffff22;border-radius:12px;background:#ffffff09;color:#a9ccff;transition:background .3s,transform .3s}
.contact-card-icon svg{width:25px;height:25px;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.contact-card-copy{display:flex;flex-direction:column;gap:12px;min-width:0}
.contact-card-label{font-size:10px;letter-spacing:.16em;font-weight:800;color:#a8c5ea}
.contact-card-copy strong{font-size:clamp(20px,2vw,28px);letter-spacing:-.035em;font-weight:750;color:#fff;overflow-wrap:anywhere}
.contact-card-note{font-size:11px;line-height:1.6;color:#bacbe0}
.contact-card-arrow{font-size:23px;color:#9bc2ff;transition:transform .3s}
.contact-card:hover,.contact-card:focus-visible{translate:0 -4px;border-color:#82b3ff;box-shadow:0 18px 40px #040e2040}
.contact-card:hover .contact-card-icon,.contact-card:focus-visible .contact-card-icon{background:#ffffff16;transform:rotate(-5deg)}
.contact-card:hover .contact-card-arrow,.contact-card:focus-visible .contact-card-arrow{transform:translate(3px,-3px)}
@media(max-width:1050px){.closing-grid{gap:35px}.contact-card{gap:14px;padding:25px 20px;grid-template-columns:40px minmax(0,1fr) 18px}.contact-card-icon{width:40px;height:40px}}
@media(max-width:760px){.closing{padding:70px 0}.closing-grid{grid-template-columns:1fr;gap:34px}.contact-card{padding:24px 18px;gap:12px}.contact-card-copy strong{font-size:clamp(18px,5.1vw,27px)}.contact-card-note{font-size:11px}.contact-options{gap:14px}}
@media(prefers-reduced-motion:reduce){.contact-card,.contact-card-icon,.contact-card-arrow{transition:none}.contact-card:hover,.contact-card:focus-visible{translate:none}.contact-card:hover .contact-card-icon,.contact-card:focus-visible .contact-card-icon,.contact-card:hover .contact-card-arrow,.contact-card:focus-visible .contact-card-arrow{transform:none}}

/* Compact centered copyright footer. */
footer{padding:26px 0;border-top:1px solid #ffffff0b}
.footer-inner{display:block;text-align:center}
.footer-inner p{margin:0;font-size:12px;line-height:1.8;color:#93a5bc}
.footer-inner #year{color:inherit}
@media(max-width:760px){footer{padding:22px 0}.footer-inner p{font-size:11px}}

/* Rotate the photographed rim in normalized circular coordinates, then
   project it back into its original ellipse. The fixed clip keeps the tire intact. */
.wheel-surface{position:absolute;display:block;overflow:hidden;pointer-events:none}
.wheel-rotor{transform-box:view-box;transform-origin:50px 50px}
.fleet-vehicle-sedan{--drive-seconds:18;--tire-diameter-ratio:.14}
.fleet-vehicle-van{--drive-seconds:22;--tire-diameter-ratio:.153}
@media(prefers-reduced-motion:no-preference){
  .wheel-rotor{animation:wheel-turn var(--wheel-period,2s) linear infinite paused}
  .fleet-vehicle-van .wheel-rotor{animation-direction:reverse}
  .fleet-driveby.is-in-view .wheel-rotor{animation-play-state:running}
}
@keyframes wheel-turn{to{transform:rotate(360deg)}}

/* Keep the mobile header on a stable layer while the page scrolls. */
@media(max-width:760px){
  html{overscroll-behavior:none}
  html,body{overflow-x:clip}
  .app-shot::before{inset:8% 0}
  .site-header{
    position:fixed;
    inset:0 0 auto;
    height:70px;
    z-index:100;
    margin:0;
    background:#0c192d;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    transform:translateZ(0);
    -webkit-backface-visibility:hidden;
    backface-visibility:hidden;
    transition:none;
    animation:none;
    box-shadow:0 3px 12px rgba(6,18,36,.12);
  }
  .nav-wrap{height:69px;min-height:69px;flex-wrap:nowrap}
  .brand{flex:0 0 auto}
  .brand img{width:157px;height:auto}
  .menu-toggle{flex:0 0 44px;width:44px;height:44px;align-items:center;justify-content:center;padding:10px}
  .mobile-menu{
    top:100%;
    max-height:calc(100vh - 70px);
    max-height:calc(100dvh - 70px);
    overflow-y:auto;
    overscroll-behavior:contain;
    background:#0c192d;
  }
}