
/* ── Scroll carousels ── */
:root{
  --bs-font-sans-serif:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --site-gutter:clamp(1rem,5vw,6rem);
  --section-space:clamp(5rem,10vw,11rem);
  --section-space-tight:clamp(4rem,7vw,8rem);
  --content-max:1280px;
  --ui-radius:8px;
  /* On screens wider than content-max, align bleed carousels with the same
     centered column edge as every other section instead of just the raw
     viewport gutter — otherwise the carousel drifts left of the heading
     text above it on ultra-wide monitors. */
  --bleed-gutter:max(var(--site-gutter),calc((100vw - var(--content-max)) / 2));
}
html{scroll-behavior:smooth}
body{overflow-x:hidden}
/* Natural proportions for content images; framed media retains its explicit fit. */
img{max-width:100%;height:auto;object-fit:contain}
/* Keep media fitting local instead of relying on the Bootstrap CDN. */
img.object-fit-cover,video.object-fit-cover{object-fit:cover!important}
img.object-fit-contain,video.object-fit-contain{object-fit:contain!important}

/* Shared page rhythm: generous space on large screens, compact and readable on phones. */
:is(body,main) > section.py-5,
:is(body,main) > section.section-pad{padding-top:var(--section-space)!important;padding-bottom:var(--section-space)!important}
:is(body,main) > section.py-4{padding-top:var(--section-space-tight)!important;padding-bottom:var(--section-space-tight)!important}
:is(body,main) > section[class*="px-"]{padding-left:var(--site-gutter)!important;padding-right:var(--site-gutter)!important}
:is(body,main) > section > [class*="px-"]{padding-left:var(--site-gutter)!important;padding-right:var(--site-gutter)!important}
:is(body,main) > section > .row{--bs-gutter-x:clamp(1.25rem,3vw,3.5rem);--bs-gutter-y:clamp(1.5rem,4vw,3rem)}
.about-anstel-cta{border-radius:4px;font-size:.875rem;font-weight:600;min-width:180px}
@media(min-width:768px){.about-pillar + .about-pillar{border-left:1px solid #d1d5db}}
@media(min-width:768px){.platform-highlight + .platform-highlight{border-left:1px solid #d1d5db}}

/* Shared page alignment: keep full-width backgrounds while placing normal
   section content on the same centered rail as the IoT and Job Scheduling pages. */
:is(body,main) > section.section-pad[class*="px-"]:not(.d-flex):not(.text-center){
  display:grid;
  grid-template-columns:minmax(0,var(--content-max));
  justify-content:center;
}
:is(body,main) > section.section-pad[class*="px-"]:not(.text-center):not(:has(.demo-accordion)) > [style*="max-width:760px"],
:is(body,main) > section.section-pad[class*="px-"]:not(.text-center):not(:has(.demo-accordion)) > [style*="max-width:780px"],
:is(body,main) > section.section-pad[class*="px-"]:not(.text-center):not(:has(.demo-accordion)) > [style*="max-width:820px"]{
  margin-left:0!important;
  margin-right:auto!important;
}
/* Some legacy pages place their horizontal padding on a child wrapper instead
   of the section. Center that wrapper so its inner content begins on the same
   1280px rail. Carousel sections are excluded because their header and first
   card intentionally use the shared bleed gutter instead. */
:is(body,main) > section.section-pad:not(:has(> .scroll-carousel)) > [class*="px-"]{
  width:100%;
  max-width:calc(var(--content-max) + (var(--site-gutter) * 2));
  margin-left:auto!important;
  margin-right:auto!important;
}

@media(max-width:575px){
  :root{--site-gutter:1rem;--section-space:4.5rem;--section-space-tight:3.25rem}
  :is(body,main) > section > .row{--bs-gutter-x:1rem;--bs-gutter-y:1.5rem}
}

/* ── Section heading system (shared across all major sections) ── */
.section-eyebrow{
  color:#0b57d0;font-weight:600;text-transform:uppercase;letter-spacing:.12em;
  font-size:.72rem;margin-bottom:.75rem
}
.section-heading{
  font-weight:800;letter-spacing:-.03em;line-height:1.1;color:#171a20;
  font-size:clamp(2rem,4vw,3.25rem);margin-bottom:.75rem
}
.section-lede{color:#4b5563;line-height:1.7;font-size:clamp(1rem,1.2vw,1.125rem);margin-bottom:0}

/* Connected Fleet: clean Tesla-style capability cards */
.cf-platform-section{display:grid;grid-template-columns:minmax(var(--site-gutter),1fr) minmax(0,var(--content-max)) minmax(var(--site-gutter),1fr);padding-inline:0;background:#fff}
.cf-platform-section>*{grid-column:2;min-width:0}
.cf-platform-intro{max-width:860px;margin:0 0 clamp(2.75rem,5vw,4.5rem)}
.cf-platform-section>.cf-platform-video{grid-column:1/-1;position:relative;width:100%;aspect-ratio:32/15;margin:0;padding:0;overflow:hidden;border:0;border-radius:0;background:#eef2f5}
.cf-platform-video>video{display:block;width:100%;height:auto;aspect-ratio:32/15;object-fit:contain}
.cf-platform-rail{display:flex;align-items:center;gap:1rem;margin-top:clamp(2rem,4vw,3rem);margin-bottom:1.25rem}
.cf-platform-rail span{flex-shrink:0;color:#0d6efd;font-size:.68rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}
.cf-platform-rail i{display:block;width:100%;height:1px;background:#d8dce2}
.cf-capability-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(.75rem,1.5vw,1.25rem)}
.cf-capability-card{
  display:flex;min-height:280px;flex-direction:column;padding:clamp(1.4rem,2vw,2rem);
  border:0;border-radius:12px;color:#171a20;background:#f4f4f4
}
.cf-capability-icon{display:flex;width:52px;height:52px;align-items:center;justify-content:flex-start;margin-bottom:clamp(1.5rem,2vw,2.25rem);color:#171a20;font-size:2.2rem}
.cf-capability-label{margin:0 0 .65rem!important;color:#5f6368!important;font-size:.66rem!important;font-weight:700;letter-spacing:.12em;line-height:1.35!important;text-transform:uppercase}
.cf-capability-card h3{margin:0 0 .7rem;font-size:clamp(1.5rem,1.8vw,1.85rem);font-weight:700;letter-spacing:-.025em}
.cf-capability-card>p:last-child{margin:0;color:#62666d;font-size:.86rem;line-height:1.65}
.cf-platform-footer{max-width:1080px;margin:clamp(2rem,4vw,3.25rem) 0 0;color:#62666d;font-size:.88rem;line-height:1.8}
.cf-platform-footer a{color:#171a20;font-weight:600;text-decoration:underline;text-decoration-color:#afb4bc;text-underline-offset:4px}
.cf-audience-section .tesla-card,
.cf-audience-section .tesla-card:hover{box-shadow:none;transform:none;transition:none}
@media(max-width:1199px){.cf-capability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767px){.cf-capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:575px){
  .cf-capability-grid{grid-template-columns:1fr}
  .cf-capability-card{min-height:260px}
}

/* Connected Fleet workflow: show devices, live visibility and action in context. */
.cf-how-media{margin:clamp(2rem,4vw,3rem) 0 0;overflow:hidden;border-radius:var(--ui-radius);background:#f4f4f4}
.cf-how-media img{display:block;width:100%;height:auto}

/* Connected Fleet capabilities: photos fill each slide and continue off the viewport. */
.cf-capability-slide{position:relative;display:flex;align-items:flex-end;min-height:clamp(480px,62vh,660px);overflow:hidden;border-radius:var(--ui-radius);background:#171a20;color:#fff;isolation:isolate}
.cf-capability-slide>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.cf-capability-slide::after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(7,12,18,.03) 20%,rgba(7,12,18,.25) 42%,rgba(7,12,18,.82) 72%,rgba(7,12,18,.96) 100%)}
.cf-capability-copy{position:relative;z-index:2;width:100%;padding:clamp(1.5rem,3vw,3rem)}
.cf-capability-copy .cf-capability-kicker{margin:0 0 .85rem;color:rgba(255,255,255,.8);font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.cf-capability-copy h3{max-width:640px;margin:0 0 1rem;color:#fff;font-size:clamp(1.65rem,2.8vw,2.5rem);font-weight:700;letter-spacing:-.03em;line-height:1.12;text-wrap:balance}
.cf-capability-copy>p:last-child{max-width:620px;margin:0;color:rgba(255,255,255,.9);font-size:clamp(.95rem,1.1vw,1.05rem);line-height:1.6}
.cf-capabilities-carousel>.car-btn{top:calc((100% - 32px) / 2);z-index:3;transform:translateY(-50%)}
.cf-capabilities-carousel .scroll-track:focus-visible{outline:2px solid #3e6ae1;outline-offset:4px}
@media(max-width:575px){
  .cf-capability-slide{min-height:500px}
  .cf-capability-copy{padding:1.5rem}
}

/* Trusted leaders: a seamless, minimal logo rail based on the supplied reference. */
.trusted-leaders{overflow:hidden;margin-inline:calc(var(--site-gutter) * -1);padding:clamp(5rem,8vw,8rem) 0;background:#fff;color:#171a20}
.trusted-leaders-heading{max-width:780px;margin:0 auto clamp(3rem,6vw,5rem);padding-inline:var(--site-gutter);text-align:center}
.trusted-leaders-kicker{margin:0 0 1rem;color:#4169dc;font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.trusted-leaders-heading h2{margin:0;color:#171a20;font-size:clamp(2.4rem,5vw,4.5rem);font-weight:600;letter-spacing:-.045em;line-height:1.03}
.trusted-leaders-heading p:last-child{max-width:610px;margin:1.25rem auto 0;color:#5c6066;font-size:clamp(1rem,1.25vw,1.15rem);line-height:1.65}
.trusted-logo-marquee{position:relative;width:100%;overflow:hidden;background:#fff;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.trusted-logo-track{display:flex;width:max-content;animation:trustedLogoRail 32s linear infinite;will-change:transform}
@media(hover:hover) and (pointer:fine){.trusted-logo-marquee:hover .trusted-logo-track{animation-play-state:paused}}
.trusted-logo-set{display:flex;align-items:center;flex-shrink:0}
.trusted-logo{width:clamp(180px,16vw,260px);height:clamp(112px,10vw,148px);display:flex;align-items:center;justify-content:center;padding:1.5rem 2rem;text-decoration:none}
.trusted-logo:focus-visible{outline:2px solid #4169dc;outline-offset:-4px;border-radius:8px}
.trusted-logo img{display:block;width:100%;height:100%;max-width:190px;object-fit:contain;filter:grayscale(1) contrast(1.15);opacity:.58;transition:filter .3s ease,opacity .3s ease,transform .3s ease}
.trusted-logo:hover img{filter:grayscale(0) contrast(1);opacity:1;transform:scale(1.06)}
.trusted-logo--symbol img{max-width:92px}
@keyframes trustedLogoRail{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.trusted-logo-track{animation:none}.trusted-logo-set[aria-hidden="true"]{display:none}}
@media(max-width:575px){
  .trusted-leaders{padding-block:4.5rem}
  .trusted-logo-marquee{mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
  .trusted-logo{width:155px;height:104px;padding:1.15rem 1.35rem}
  .trusted-logo--symbol img{max-width:72px}
}

.scroll-track{scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;scroll-padding-inline:var(--bleed-gutter)}
.scroll-track::-webkit-scrollbar{display:none}
.inventory-bleed-carousel{width:100vw;height:clamp(520px,58vw,760px);margin-top:clamp(3rem,6vw,5rem);margin-left:calc(50% - 50vw)}
.inventory-image-card{position:relative;width:86vw;max-width:720px;overflow:hidden;border-radius:var(--ui-radius);background:#111;color:#fff;scroll-snap-align:start}
.inventory-image-card>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .55s ease}
.inventory-image-card-shade{position:absolute;inset:0;background:linear-gradient(to top,rgba(4,8,14,.88),rgba(4,8,14,.2) 56%,rgba(4,8,14,.04))}
.inventory-image-card-copy{position:absolute;right:0;bottom:0;left:0;z-index:1;padding:clamp(1.5rem,3vw,2.5rem)}
.inventory-image-card-copy span{display:block;margin-bottom:.8rem;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.inventory-image-card-copy h3{max-width:560px;margin:0;font-size:clamp(1.65rem,3vw,2.65rem);font-weight:600;letter-spacing:-.04em;line-height:1.04}
.inventory-image-card-copy p{max-width:520px;margin:1rem 0 0;color:rgba(255,255,255,.76);font-size:.9rem;line-height:1.65}
.inventory-image-card:hover>img{transform:scale(1.025)}
@media(max-width:575px){.inventory-bleed-carousel{height:560px}.inventory-image-card{width:86vw}.inventory-image-card-copy{padding:1.5rem}}
[data-card]{scroll-snap-align:center}

/* Bleed carousels: align the left edge with the page's centered content column
   (same as the heading above it) and let cards bleed off only the right edge. */
section:has(> .scroll-carousel) > [class*="px-"]{
  padding-left:var(--bleed-gutter)!important;
  padding-right:var(--bleed-gutter)!important;
}
.scroll-track > [data-card]:first-child{margin-left:var(--bleed-gutter)!important}
.scroll-track > [aria-hidden="true"]{width:var(--bleed-gutter)!important}

/* Bleed carousels: one dominant "peek" card in view at a time — like Tesla/Apple's
   product carousels — with slivers of the neighbor cards visible at both edges,
   consistent across every breakpoint. Overrides whatever width/max-width each card's
   inline style originally specified (the old equal-width 3-up/4-up grid). */
.scroll-carousel .scroll-track{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.scroll-carousel .scroll-track [data-card]{
  width:78vw!important;
  max-width:min(78vw,860px)!important;
}
.scroll-carousel--showcase{
  height:70vh;
  min-height:380px;
}
/* Tesla-style card symbols: large, monochrome and free of decorative containers. */
.carousel-card-icon{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  width:64px;
  height:64px;
  margin-bottom:1.25rem;
  color:#171a20;
  flex:0 0 auto;
}
.carousel-card-icon svg,
.carousel-card-icon iconify-icon{
  display:block;
  width:52px;
  height:52px;
  overflow:visible;
}
.carousel-card-icon iconify-icon{
  font-size:52px;
  font-weight:900;
  line-height:52px;
  text-align:left;
}
.carousel-card-icon--light{color:#fff}
.carousel-card-title{
  font-size:clamp(1.4rem,2vw,2rem)!important;
  font-weight:700!important;
  line-height:1.12!important;
  letter-spacing:-.025em;
  margin-bottom:.75rem!important;
}
.carousel-card-description{
  font-size:clamp(.95rem,1.15vw,1.1rem)!important;
  line-height:1.55!important;
}
.scroll-carousel--showcase .carousel-card-icon{
  width:58px;
  height:58px;
  margin-bottom:.75rem;
}
.scroll-carousel--showcase .carousel-card-icon svg,
.scroll-carousel--showcase .carousel-card-icon iconify-icon{width:46px;height:46px;font-size:46px;line-height:46px}
.scroll-carousel--showcase .carousel-card-title{font-size:clamp(1.35rem,2vw,1.75rem)!important}
.scroll-carousel--showcase .carousel-card-description{font-size:.95rem!important;line-height:1.45!important}
/* Taller, more cinematic photo like Tesla/Apple's carousels — was a flat 280px
   thumbnail, cramped now that each card is much wider. */
.scroll-carousel .scroll-track [data-card] > [style*="height:280px"]{
  height:min(56vh,460px)!important;
}
@media(max-width:991px){
  .scroll-carousel .scroll-track{gap:.75rem!important;scroll-padding-inline:var(--bleed-gutter)}
  .scroll-carousel--showcase{height:min(68svh,520px);min-height:360px}
  .scroll-carousel .scroll-track [data-card] > [style*="height:280px"]{height:min(50svh,400px)!important}
  .scroll-carousel .sc-prev,.scroll-carousel .sc-next{width:36px;height:36px}
}
@media(max-width:575px){
  .scroll-carousel .scroll-track{gap:.625rem!important;scroll-padding-inline:var(--bleed-gutter)}
  .scroll-carousel .scroll-track [data-card]{width:84vw!important;max-width:84vw!important}
  .scroll-carousel--showcase{height:min(70svh,480px);min-height:340px}
  .carousel-card-icon{width:54px;height:54px;margin-bottom:1rem}
  .carousel-card-icon svg,
  .carousel-card-icon iconify-icon{width:44px;height:44px;font-size:44px;line-height:44px}
  .scroll-carousel--showcase .carousel-card-icon{width:48px;height:48px;margin-bottom:.5rem}
  .scroll-carousel--showcase .carousel-card-icon svg,
  .scroll-carousel--showcase .carousel-card-icon iconify-icon{width:40px;height:40px;font-size:40px;line-height:40px}
  .scroll-carousel .scroll-track [data-card] > [style*="height:280px"]{height:min(42svh,320px)!important}
  .scroll-carousel .sc-prev,.scroll-carousel .sc-next{display:none!important}
}

/* ── Hero crossfade ── */
@keyframes heroSlideUp {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-slide{position:absolute;top:-40px;left:0;right:0;bottom:0;opacity:0;transform:translateY(40px);transition:all .8s ease-in-out;visibility:hidden}
.hero-slide.active{opacity:1;transform:translateY(0);visibility:visible;animation:heroSlideUp .8s ease-in-out forwards}
.hero-slide:first-child.active{animation:none;transition:none}
.hero-slide::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to bottom,rgba(10,18,28,.38) 0%,rgba(10,18,28,.2) 30%,transparent 58%);
  pointer-events:none;
}

/* Hero carousel presentation */
.hero-slide--video-telematics::after{background:linear-gradient(to bottom,rgba(0,0,0,.38) 0%,rgba(0,0,0,.2) 30%,transparent 58%)}
#hero-content h1{font-size:clamp(2.35rem,4vw,3.5rem);font-weight:600;letter-spacing:-.035em;line-height:1.08;color:#fff!important;text-shadow:none}
#hero-subtitle{color:#fff!important;font-size:clamp(1rem,1.35vw,1.2rem);font-weight:500;line-height:1.35;text-shadow:none}
.hero-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;width:fit-content;max-width:100%}
.hero-actions .btn{flex:0 0 auto;min-height:44px;display:inline-flex;align-items:center;justify-content:center;min-width:260px;max-width:100%;white-space:nowrap;border-radius:4px;padding:.72rem 1.5rem;font-size:.875rem;font-weight:600;line-height:1.25}
.hero-primary-btn{background:#4169dc!important;border-color:#4169dc!important;color:#fff!important}
.hero-primary-btn:hover{background:#355bc8!important;border-color:#355bc8!important;color:#fff!important}
.hero-prev.car-btn,.hero-next.car-btn{
  width:40px;
  height:40px;
  border:0;
  border-radius:4px;
  background:rgba(255,255,255,.9);
  box-shadow:0 1px 2px rgba(0,0,0,.08);
  backdrop-filter:none;
}
.hero-prev.car-btn{left:48px!important;margin-left:0!important}
.hero-next.car-btn{right:48px!important;margin-right:0!important}
.hero-prev.car-btn:hover,.hero-next.car-btn:hover{background:#fff}
.hero-dot.dot-btn{width:13px;min-width:13px;height:13px;border-radius:50%;background:rgba(255,255,255,.65)}
.hero-dot.dot-btn.active{width:13px;background:#fff}
@media(max-width:767px){
  #hero-content{padding-top:12vh!important}
  #hero-subtitle{max-width:330px}
  .hero-actions{width:min(100%,330px)}
  .hero-actions .btn{flex-basis:100%;min-width:0}
  .hero-prev.car-btn{left:16px!important}
  .hero-next.car-btn{right:16px!important}
}

/* ── Fade-up text ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
.fade-up{animation:fadeUp .6s ease both}

/* ── Carousel nav buttons ── */
.car-btn{width:40px;height:40px;border-radius:8px;background:rgba(255,255,255,.4);border:0;display:flex;align-items:center;justify-content:center;backdrop-filter:blur(8px);cursor:pointer;transition:background .2s}
.car-btn:hover{background:rgba(255,255,255,.7)}

/* ── Dot indicators ── */
.dot-btn{height:8px;width:8px;min-width:8px;border-radius:4px;background:#9ca3af;border:0;cursor:pointer;transition:all .3s;padding:0}
.dot-btn.active{width:16px;background:#111827}
.dot-btn-light.active{background:#fff}
.dot-btn-light{background:rgba(255,255,255,.5)}

/* ── Mega menu ── */
.mega-menu{position:absolute;left:0;right:0;top:100%;background:#fff;border-top:1px solid #f3f4f6;box-shadow:0 8px 24px rgba(0,0,0,.08);z-index:999;display:none}
.mega-product-card{text-align:center;text-decoration:none;color:inherit;cursor:pointer}
.mega-product-card:hover .card-name{text-decoration:underline}
.mega-product-card img{height:80px;object-fit:contain;width:100%;transition:transform .2s}
.mega-product-card:hover img{transform:scale(1.05)}

/* ── Mega menu page overlay / blur ── */
#mega-overlay{position:fixed;top:56px;left:0;right:0;bottom:0;background:rgba(0,0,0,.3);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:998;display:none;pointer-events:none}

/* ── Frosted glass ── */
.frosted{background:rgba(0,0,0,.35)!important;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* ── Section vertical rhythm ── */
.section-pad{padding-top:5rem;padding-bottom:5rem}
@media(max-width:767px){.section-pad{padding-top:3.5rem;padding-bottom:3.5rem}}

/* ── Schedule bar ── */
.schedule-bar{position:fixed;bottom:0;left:0;right:0;height:56px;background:#fff;border-top:1px solid #e5e7eb;z-index:1040;display:flex;align-items:stretch}

/* ── Misc ── */
.nav-btn{background:none;border:0;border-radius:6px;padding:6px 14px;font-size:.875rem;font-weight:500;cursor:pointer;transition:background .15s}
.nav-btn:hover,.nav-btn.active{background:rgba(0,0,0,.05)}
.icon-btn{background:none;border:0;border-radius:6px;padding:8px;cursor:pointer;transition:background .15s}
.icon-btn:hover{background:rgba(0,0,0,.05)}
.feature-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;display:inline-block}
.why-card-img{border-radius:var(--ui-radius);overflow:hidden;background:#f3f4f6;flex:0 0 63%;height:380px;align-self:flex-start}
.why-card-img img{width:100%;height:100%;object-fit:cover;display:block}
@media(max-width:767px){.why-card-img{flex:0 0 auto;width:100%;height:260px}}

/* Patrol Connect: Tesla-inspired editorial feature rows. */
.mission-security-section{background:#fff;padding-bottom:clamp(5rem,9vw,9rem)}
.mission-security-heading{max-width:1360px;margin:0 auto;padding:clamp(5rem,8vw,8.5rem) clamp(1.5rem,4vw,4rem) clamp(3.5rem,6vw,6rem)}
.mission-security-heading>p:last-child{max-width:650px;margin-bottom:0}
.mission-security-list{display:flex;max-width:1360px;margin:0 auto;padding:0 clamp(1.5rem,4vw,4rem);flex-direction:column;gap:clamp(3.5rem,6vw,6.5rem)}
.mission-security-row{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(280px,.88fr);align-items:stretch;gap:clamp(3rem,6vw,7rem)}
.mission-security-row .why-card-img{width:100%;height:clamp(390px,35vw,520px);min-width:0;align-self:auto;flex:none;border-radius:var(--ui-radius);background:#f4f4f4}
.mission-security-row .why-card-img img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.mission-security-row:hover .why-card-img img{transform:scale(1.015)}
.mission-security-copy{display:flex;align-items:center;padding:clamp(2rem,4vw,4rem) 0}
.mission-security-copy>div{max-width:390px}
.mission-security-copy h3{margin-bottom:1.25rem!important;font-size:clamp(1.7rem,2.15vw,2.35rem);font-weight:600!important;line-height:1.12;letter-spacing:-.035em;color:#171a20}
.mission-security-copy>div>p:first-child{margin-bottom:.65rem!important;color:#393c41!important;font-size:.82rem!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}
.mission-security-copy>div>p:last-child{max-width:390px!important;margin-bottom:0;color:#393c41!important;font-size:clamp(.9rem,1vw,1rem)!important;line-height:1.55!important}
@media(max-width:991px){
  .mission-security-row{grid-template-columns:minmax(0,1.45fr) minmax(250px,.8fr);gap:2.5rem}
  .mission-security-row .why-card-img{height:390px}
}
@media(max-width:767px){
  .mission-security-heading{padding-bottom:3.5rem}
  .mission-security-list{gap:4.5rem}
  .mission-security-row{display:flex;flex-direction:column;gap:0}
  .mission-security-row .why-card-img{height:clamp(250px,66vw,390px)}
  .mission-security-copy{padding:2rem .1rem 0}
  .mission-security-copy>div{max-width:100%}
}

/* Last Mile: same editorial rhythm and radius as Mission Security. */
.last-mile-feature-section{background:#fff;padding-bottom:clamp(5rem,9vw,9rem)}
.last-mile-feature-heading{max-width:1360px;margin:0 auto;padding:clamp(5rem,8vw,8.5rem) clamp(1.5rem,4vw,4rem) clamp(3.5rem,6vw,6rem)}
.last-mile-feature-heading>p:last-child{max-width:650px;margin-bottom:0}
.last-mile-feature-list{display:flex;max-width:1360px;margin:0 auto;padding:0 clamp(1.5rem,4vw,4rem);flex-direction:column;gap:clamp(3.5rem,6vw,6.5rem)}
.last-mile-feature-row{display:grid;grid-template-columns:minmax(0,1.72fr) minmax(280px,.88fr);align-items:stretch;gap:clamp(3rem,6vw,7rem)}
.last-mile-feature-row .why-card-img{width:100%;height:clamp(390px,35vw,520px);min-width:0;align-self:auto;flex:none;border-radius:var(--ui-radius);background:#f4f4f4}
.last-mile-feature-row .why-card-img img{transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.last-mile-feature-row:hover .why-card-img img{transform:scale(1.015)}
.last-mile-feature-copy{display:flex;align-items:center;padding:clamp(2rem,4vw,4rem) 0}
.last-mile-feature-copy>div{max-width:390px}
.last-mile-feature-copy h3{margin-bottom:1.25rem!important;font-size:clamp(1.7rem,2.15vw,2.35rem);font-weight:600!important;line-height:1.12;letter-spacing:-.035em;color:#171a20}
.last-mile-feature-copy>div>p:first-child{margin-bottom:.65rem!important;color:#393c41!important;font-size:.82rem!important;font-weight:500!important;letter-spacing:0!important;text-transform:none!important}
.last-mile-feature-copy>div>p:last-child{max-width:390px;margin-bottom:0;color:#393c41!important;font-size:clamp(.9rem,1vw,1rem)!important;line-height:1.55!important}
.last-mile-how-image{height:280px;margin-bottom:1rem;overflow:hidden;border-radius:var(--ui-radius);background:#f4f4f4}
.last-mile-how-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1)}
[data-card]:hover .last-mile-how-image img{transform:scale(1.02)}
.last-mile-how-section{padding:clamp(5rem,8vw,8rem) 0 clamp(5rem,7vw,7rem);background:#fff}
.last-mile-how-heading{width:100%;max-width:none;margin:0 0 clamp(2.75rem,5vw,4.5rem)}
.last-mile-how-heading>p:last-child{max-width:680px!important;margin-bottom:0}
.last-mile-how-carousel .scroll-track{gap:clamp(1rem,1.3vw,1.5rem)!important;padding-bottom:1.25rem;scroll-snap-type:x mandatory}
.last-mile-how-carousel .last-mile-how-card{width:clamp(560px,42vw,800px)!important;max-width:none!important;scroll-snap-align:start}
.last-mile-how-carousel .last-mile-how-image{height:clamp(430px,30.5vw,580px);margin-bottom:1.65rem;border-radius:var(--ui-radius)}
.last-mile-how-carousel .last-mile-how-card h5{margin-bottom:.75rem!important;font-size:clamp(1.65rem,2vw,2.1rem);font-weight:600!important;line-height:1.1;letter-spacing:-.035em;color:#171a20}
.last-mile-how-carousel .last-mile-how-card>p{max-width:720px;margin-bottom:0;color:#393c41!important;font-size:clamp(.95rem,1.12vw,1.12rem)!important;line-height:1.5!important}
.last-mile-how-carousel .car-btn{top:calc(clamp(430px,30.5vw,580px) / 2);z-index:20;width:44px;height:44px;transform:translateY(-50%);border-radius:var(--ui-radius);background:rgba(255,255,255,.94);box-shadow:0 2px 8px rgba(0,0,0,.16);backdrop-filter:none}
.last-mile-how-carousel .sc-prev{left:clamp(.75rem,2vw,2rem)}
.last-mile-how-carousel .sc-next{right:clamp(.75rem,2vw,2rem)}
.last-mile-how-carousel .car-btn:hover{background:#fff}
@media(max-width:991px){
  .last-mile-feature-row{grid-template-columns:minmax(0,1.45fr) minmax(250px,.8fr);gap:2.5rem}
  .last-mile-feature-row .why-card-img{height:390px}
  .last-mile-how-carousel .last-mile-how-card{width:72vw!important}
  .last-mile-how-carousel .last-mile-how-image{height:min(54vw,500px)}
  .last-mile-how-carousel .car-btn{top:calc(min(54vw,500px) / 2)}
}
@media(max-width:767px){
  .last-mile-feature-heading{padding-bottom:3.5rem}
  .last-mile-feature-list{gap:4.5rem}
  .last-mile-feature-row{display:flex;flex-direction:column;gap:0}
  .last-mile-feature-row .why-card-img{height:clamp(250px,66vw,390px)}
  .last-mile-feature-copy{padding:2rem .1rem 0}
  .last-mile-feature-copy>div{max-width:100%}
  .last-mile-how-heading{margin-bottom:2.5rem}
  .last-mile-how-carousel .last-mile-how-card{width:86vw!important;max-width:86vw!important}
  .last-mile-how-carousel .last-mile-how-image{height:64vw;max-height:380px;margin-bottom:1.3rem}
  .last-mile-how-carousel .last-mile-how-card h5{font-size:1.55rem}
  .last-mile-how-carousel .car-btn{display:none!important}
}
.tag-pill{display:inline-block;border:1px solid #e5e7eb;border-radius:999px;padding:6px 16px;font-size:.875rem;color:#4b5563;cursor:default;transition:all .2s}
.tag-pill:hover{border-color:#93c5fd;color:#2563eb}

/* ── Event media slot (Events page: image, carousel, or video placeholder — same box treatment) ── */
.event-media{position:relative;border-radius:var(--ui-radius);overflow:hidden;height:clamp(240px,32vw,380px);background:#f3f4f6}
.event-media img{width:100%;height:100%;object-fit:cover;display:block}
.event-media.carousel .carousel-item{height:clamp(240px,32vw,380px)}
.event-media-video img{filter:brightness(.75)}

/* Blog/Knowledge Center cover — full-bleed photo card (Tesla-style): consistent
   aspect ratio instead of a fixed pixel height, so it scales cleanly at any card
   width; anchored to the top of the source image so logo/text-led graphics don't
   lose their header content when cropped to fill the frame. */
.blog-cover-media{border-radius:var(--ui-radius);height:auto;aspect-ratio:16/10}
.blog-cover-media img{object-fit:cover;object-position:top}
.blog-card-title{font-size:1.15rem;font-weight:700;line-height:1.3;letter-spacing:-.01em}
.blog-card-date{font-size:.85rem;color:#6b7280}
/* Knowledge Center cards: 2-line summary from the post, then date + "Continue reading". */
.blog-card-excerpt{margin:.4rem 0 .65rem;color:#4b5563;font-size:.92rem;line-height:1.55}
.blog-card-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.25rem 1rem}
.blog-card-more{color:#171a20;font-size:.85rem;font-weight:600;white-space:nowrap}
a:hover .blog-card-more,a:focus-visible .blog-card-more{text-decoration:underline;text-underline-offset:3px}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.event-play-btn{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.92);color:#171a20;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.acc-arrow{display:inline-block;transition:transform .2s}
.acc-arrow.rotated{transform:rotate(180deg)}

/* ── Mobile mega menu (Tesla-style full-screen slide panel) ── */
.mob-panel{position:fixed;inset:0;background:#fff;z-index:1100;display:none;flex-direction:column}
.mobile-menu-open{overflow:hidden}
.mob-panel.open{display:flex}
.mob-view-stack{position:relative;flex:1 1 auto;overflow:hidden}
.mob-view{
  position:absolute;top:0;left:0;width:100%;height:100%;overflow-y:auto;background:#fff;
  transform:translateX(100%);transition:transform .32s cubic-bezier(.4,0,.2,1)
}
.mob-view-main{transform:translateX(0)}
.mob-view-main.pushed{transform:translateX(-100%)}
.mob-view-sub.active{transform:translateX(0)}
.mob-panel-topbar{display:flex;justify-content:flex-end;padding:.375rem .75rem;flex-shrink:0}
.mob-row{
  width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;
  border:0;border-bottom:1px solid #f3f4f6;background:#fff;font-size:.95rem;font-weight:500;color:#171a20;text-align:left
}
.mob-row-link{
  display:block;padding:1rem 1.25rem;font-size:.95rem;font-weight:500;color:#171a20;
  text-decoration:none;border-bottom:1px solid #f3f4f6
}
.mob-subheader{position:relative;display:flex;align-items:center;justify-content:center;padding:1rem;border-bottom:1px solid #f3f4f6;flex-shrink:0}
.mob-back-btn{position:absolute;left:.5rem;background:0;border:0;padding:.5rem;color:#171a20;display:flex}
.mob-subtitle{font-weight:600;font-size:.95rem}
.mob-close-btn{background:0;border:0;padding:.4rem;color:#171a20;line-height:0;display:flex;align-items:center;justify-content:center;width:44px;height:44px}
.mob-close-btn:focus-visible{outline:2px solid #4169dc;outline-offset:2px}
.mob-sub-content{padding:1.25rem 1.25rem 2.5rem}
.mob-product-card{display:block;text-decoration:none;text-align:center;color:inherit}
.mob-product-card img{width:100%;height:76px;object-fit:contain}
.mob-product-name{font-weight:600;font-size:.85rem;color:#171a20;margin:.5rem 0 .1rem}
.mob-product-link{font-size:.78rem;color:#6c757d}
.mob-sub-links{border-top:1px solid #f3f4f6;margin-top:1.75rem;padding-top:1.25rem}
.mob-sub-links + .mob-sub-links{margin-top:1.25rem;border-top:0;padding-top:0}
.mob-sub-heading{text-transform:uppercase;font-size:.68rem;letter-spacing:.08em;font-weight:600;color:#6c757d;margin-bottom:.75rem}
.mob-sub-links a{display:block;padding:.5rem 0;font-size:.9rem;color:#374151;text-decoration:none}
.mob-utility{padding:.5rem 1.25rem 1.5rem;border-top:1px solid #f3f4f6;flex-shrink:0}
.mob-util-btn{display:flex;align-items:center;gap:.5rem;width:100%;padding:.7rem 0;background:0;border:0;font-size:.9rem;color:#374151;text-align:left}

/* ── Tesla-style flat card (shared base: white, borderless, on light-gray section bg) ── */
.tesla-card{background:#fff;border-radius:var(--ui-radius);box-shadow:none;transition:box-shadow .2s ease}
.tesla-card:hover{box-shadow:0 4px 18px rgba(0,0,0,.07)}
.tesla-card-link{text-decoration:none;color:inherit;display:block}

/* ── Flat gray card (tesla.com feature-grid look: no border/shadow, subtle radius) ── */
.tesla-card-flat{background:#f4f4f4;border-radius:var(--ui-radius);transition:background .2s ease}
.tesla-card-flat:hover{background:#eee}

/* ── Near-full-height image band (keeps the site's side gutter, fills most of the viewport height) ── */
.full-bleed-media{position:relative;overflow:hidden;height:clamp(420px,90vh,880px);border-radius:var(--ui-radius)}
.full-bleed-media img{width:100%;height:100%;object-fit:cover;display:block}

/* ── Section immediately following a full-bleed band: tight top padding, image sits close to the heading ── */
:is(body,main)>section.section-pad.pt-tight{padding-top:clamp(2rem,4vw,3rem)!important}

/* ── Generous vertical rhythm between a heading block and the row below it ── */
.tesla-gap{margin-top:clamp(3rem,6vw,5.5rem)}

/* ── Tesla-inspired informational icons ──
   Large, monochrome outline symbols without decorative icon containers. */
.industry-icon,
.feature-icon,
.device-icon{
  width:64px;
  height:64px;
  padding:0;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  color:#171a20;
  flex-shrink:0;
}
.industry-icon svg,
.feature-icon svg,
.device-icon svg{
  width:50px!important;
  height:50px!important;
  overflow:visible;
}
.industry-icon iconify-icon,
.feature-icon iconify-icon,
.device-icon iconify-icon{
  display:block;
  width:50px;
  height:50px;
  font-size:48px;
  font-weight:900;
  line-height:50px;
  text-align:center;
}
.industry-icon svg [stroke],
.feature-icon svg [stroke],
.device-icon svg [stroke]{stroke-width:1.7!important}

.industry-card h2,.industry-card h3,.industry-card h4,
.feature-card h2,.feature-card h3,.feature-card h4,
.device-card h2,.device-card h3,.device-card h4{
  color:#171a20;
  font-weight:700!important;
}

/* ── Industries grid ── */
.industry-title{font-size:.9rem;line-height:1.3}
.industry-sub{font-size:.8rem;line-height:1.4}
@media(max-width:575px){
  .industry-card{padding:1rem!important}
  .industry-icon{width:54px;height:54px}
  .industry-icon svg{width:44px!important;height:44px!important}
  .industry-icon iconify-icon{width:44px;height:44px;font-size:42px;line-height:44px}
}

/* ── Feature cards (Why Anstel) ── */
@media(max-width:575px){
  .feature-card{padding:1.5rem!important}
  .feature-icon{width:54px;height:54px}
  .feature-icon svg{width:44px!important;height:44px!important}
  .feature-icon iconify-icon{width:44px;height:44px;font-size:42px;line-height:44px}
}

/* ── Devices grid (Tesla flat card) ── */
@media(max-width:575px){
  .device-card{padding:1.5rem!important}
  .device-icon{width:54px;height:54px}
  .device-icon svg{width:44px!important;height:44px!important}
  .device-icon iconify-icon{width:44px;height:44px;font-size:42px;line-height:44px}
}

/* ── One Platform stats: hero + small stat cards ── */
.stat-hero-value{font-size:clamp(2.25rem,5vw,3rem);font-weight:700;color:#4169dc;letter-spacing:-.02em;line-height:1.1}
.stat-sm-icon{color:#171a20;margin-bottom:1.35rem;display:block}
.stat-sm-icon svg{width:48px!important;height:48px!important;overflow:visible}
.stat-sm-icon svg [stroke]{stroke-width:1.7!important}
.stat-sm-value{font-size:clamp(1.5rem,3.4vw,2rem);font-weight:700;color:#111827;line-height:1.1}
.stat-sm-unit{font-size:clamp(1rem,2vw,1.25rem);font-weight:600;color:#111827}
@media(max-width:575px){
  .stat-card-hero{padding:1.5rem!important}
  .stat-card-sm{padding:1.25rem!important}
}

/* ── About Anstel: phone showcase + step tabs ── */
.about-phone-stage{
  --phone-w:clamp(148px,30vw,260px);
  --phone-h:calc(var(--phone-w) * 1.846);
  --stage-gap:clamp(14px,3vw,40px);
  position:relative;padding:2rem 0;min-height:calc(var(--phone-h) + 4rem)
}
.about-phone-track{justify-content:center}
.about-phone-frame{
  width:var(--phone-w);height:var(--phone-h);background:#0d1b2a;border-radius:clamp(20px,4vw,36px);
  padding:clamp(7px,1.4vw,12px);position:relative;z-index:1;flex-shrink:0;margin:0 calc(var(--stage-gap)/2);
  box-shadow:0 12px 28px rgba(0,0,0,.1);opacity:.5;filter:grayscale(1);transform:scale(.86);
  transition:opacity .5s ease,filter .5s ease,transform .5s ease,box-shadow .5s ease;cursor:pointer
}
.about-phone-frame.active{opacity:1;filter:grayscale(0);transform:scale(1);z-index:2;box-shadow:0 24px 48px rgba(0,0,0,.18);cursor:default}
@media(max-width:575px){
  .about-phone-stage{--phone-w:min(72vw,240px);min-height:calc(var(--phone-h) + 2rem)}
  .about-phone-frame:not(.active){display:none}
  .about-phone-frame.active{transform:scale(1)}
}
.about-phone-notch{
  position:absolute;top:clamp(7px,1.4vw,12px);left:50%;transform:translateX(-50%);
  width:clamp(44px,10vw,70px);height:clamp(11px,2.4vw,18px);background:#0d1b2a;border-radius:0 0 12px 12px;z-index:3
}
.about-phone-notch::before{
  content:'';position:absolute;top:35%;left:50%;transform:translateX(-50%);width:clamp(20px,5vw,36px);height:4px;
  background:#000;border-radius:3px
}
.about-phone-screen{position:relative;width:100%;height:100%;border-radius:clamp(14px,3vw,26px);overflow:hidden;background:#0d1b2a}
.about-phone-panel{
  position:absolute;inset:0;display:flex;flex-direction:column;
  padding:clamp(1.5rem,6vw,2.75rem) clamp(.75rem,3vw,1.25rem) clamp(.85rem,3vw,1.5rem)
}
.about-phone-eyebrow{color:rgba(255,255,255,.5);text-transform:uppercase;letter-spacing:.1em;font-size:clamp(.55rem,1.4vw,.62rem);font-weight:600;margin-bottom:.5rem}
.about-phone-graphic{flex:1;display:flex;align-items:center;justify-content:center;min-height:0}
.about-phone-caption{margin-top:auto}
.about-phone-caption p:first-child{font-size:clamp(.8rem,2vw,1rem)}
.about-phone-caption p.small{font-size:clamp(.68rem,1.6vw,.8rem)}

/* Food Services challenge: rotating mobile-frame story */
.cold-chain-challenge-showcase{max-width:1180px;margin-inline:auto}
.cold-chain-phone-stage{--phone-w:clamp(190px,24vw,270px);display:flex;align-items:center;overflow:hidden;padding:clamp(3rem,6vw,5.5rem) clamp(1rem,4vw,3rem);background:transparent}
.cold-chain-phone-stage .about-phone-track{width:100%}
.cold-chain-phone-stage .about-phone-frame{background:#050608;box-shadow:none;opacity:.38;filter:grayscale(.7);transform:scale(.84)}
.cold-chain-phone-stage .about-phone-frame.active{opacity:1;filter:none;transform:scale(1);box-shadow:0 26px 55px rgba(0,0,0,.2)}
.cold-chain-phone-stage .about-phone-screen{background:radial-gradient(circle at 50% 30%,#263a50 0,#132235 44%,#08111d 100%)}
.cold-chain-phone-stage .about-phone-panel{padding-top:clamp(2rem,5vw,2.75rem)}
.cold-chain-phone-graphic svg{width:min(82%,150px);fill:none;stroke:#91b7e6;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.cold-chain-phone-graphic .is-broken,.cold-chain-phone-graphic .is-alert{stroke:#f3a65a}
.cold-chain-phone-stage .about-play-toggle{left:clamp(1rem,4vw,3rem);bottom:clamp(1rem,3vw,2rem);border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.1)}
.cold-chain-challenge-tabs{max-width:940px;margin-inline:auto;align-items:flex-start}
.cold-chain-challenge-tabs .about-step{display:block!important;align-self:flex-start;height:auto;padding:0 .75rem 1rem;color:#171a20;appearance:none}
.cold-chain-challenge-tabs .about-step:focus-visible{outline:3px solid rgba(65,105,220,.35);outline-offset:4px}
@media(max-width:575px){.cold-chain-challenge-showcase{width:calc(100% + 2rem);margin-left:-1rem}.cold-chain-phone-stage{--phone-w:min(76vw,270px);min-height:calc(var(--phone-h) + 5rem);padding-inline:1rem}.cold-chain-challenge-tabs{width:calc(100% - 2rem);display:flex;flex-wrap:nowrap;overflow-x:auto;scroll-snap-type:x mandatory}.cold-chain-challenge-tabs .about-step{min-width:72vw;scroll-snap-align:center}}

/* Driver Management: relevant in-phone performance interfaces */
.driver-phone-ui{width:100%;color:#f8fafc;font-size:clamp(.48rem,1vw,.68rem)}
.driver-score-ui{display:flex;flex-direction:column;align-items:center;gap:clamp(.65rem,2vw,1rem)}
.driver-score-ring{display:flex;width:clamp(82px,13vw,118px);aspect-ratio:1;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;background:radial-gradient(circle at center,#0d1b2a 61%,transparent 63%),conic-gradient(#3b82f6 0 92%,rgba(255,255,255,.12) 92%)}
.driver-score-ring strong{font-size:clamp(1.55rem,4vw,2.35rem);line-height:1}
.driver-score-ring span{margin-top:.25rem;color:#8ba0b7;font-size:.62rem}
.driver-score-metrics{display:grid;width:100%;gap:.5rem}
.driver-score-metrics span{display:grid;grid-template-columns:1fr auto;gap:.18rem .5rem;align-items:center}
.driver-score-metrics i{grid-column:1/-1;height:3px;overflow:hidden;border-radius:4px;background:rgba(255,255,255,.1)}
.driver-score-metrics i::after{content:'';display:block;width:var(--value);height:100%;border-radius:inherit;background:#3b82f6}
.driver-score-metrics b{font-weight:500}.driver-score-metrics small{color:#8ba0b7}
.driver-trend-ui{padding:.75rem;border-radius:12px;background:rgba(255,255,255,.045)}
.driver-trend-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:.5rem;color:#8ba0b7}
.driver-trend-head strong{color:#fff;font-size:1.15rem;line-height:1}.driver-trend-head small{color:#5ee1a2;font-size:.55rem;font-weight:600}
.driver-trend-ui svg{display:block;width:100%;overflow:visible}.driver-trend-ui .trend-grid{fill:none;stroke:rgba(255,255,255,.09);stroke-width:1}.driver-trend-ui .trend-fill{fill:url(#driverTrendFill)}.driver-trend-ui .trend-line{fill:none;stroke:#4f9cff;stroke-width:4;stroke-linecap:round}.driver-trend-ui circle{fill:#60a5fa;stroke:#dbeafe;stroke-width:2}
.driver-trend-labels{display:flex;justify-content:space-between;color:#70859b;font-size:.52rem}
.driver-behaviour-ui{display:grid;gap:.42rem}
.behaviour-summary{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:.2rem;padding:.65rem;border-radius:10px;background:rgba(59,130,246,.13)}
.behaviour-summary span{color:#9fb0c2}.behaviour-summary strong{font-size:1.15rem;line-height:1}.behaviour-summary small{display:block;margin-top:.18rem;color:#7f93a9;font-size:.5rem;font-weight:400}
.behaviour-row{display:grid;grid-template-columns:24px 1fr auto;gap:.45rem;align-items:center;padding:.42rem .48rem;border-radius:9px;background:rgba(255,255,255,.045)}
.behaviour-icon{display:grid;width:24px;height:24px;place-items:center;border-radius:50%;color:#9cc5ff;background:rgba(59,130,246,.16);font-size:.56rem;font-weight:700}
.behaviour-row p{margin:0}.behaviour-row b,.behaviour-row small{display:block}.behaviour-row b{font-size:.58rem;font-weight:600}.behaviour-row small{margin-top:.1rem;color:#7e93a8;font-size:.48rem}.behaviour-row em{font-size:.47rem;font-style:normal}.behaviour-row .is-low{color:#67dca1}.behaviour-row .is-watch{color:#f6c96b}
.about-play-toggle{
  position:absolute;left:0;bottom:0;width:36px;height:36px;border-radius:8px;background:#e5e7eb;
  border:0;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#374151;z-index:4;
  transition:background .15s
}
.about-play-toggle:hover{background:#d1d5db}
/* Showcases auto-advance (js/main.js removes the button); hide it before JS runs. */
.about-phone-stage .about-play-toggle,.process-photo-stage .about-play-toggle{display:none!important}

.about-step{cursor:pointer}
/* Shared text treatment for image carousels with a title-and-description rail. */
.about-step-track,.waste-challenge-track{display:block;height:2px;background:#e5e7eb;width:100%;margin-bottom:1.75rem;position:relative;overflow:hidden;border-radius:2px}
.about-step-fill{position:absolute;left:0;top:0;height:100%;width:0;background:#111827;display:block}
.about-step.active .about-step-fill{animation:aboutStepFill 4.5s linear forwards}
.about-step.paused .about-step-fill{animation-play-state:paused}
.about-step-title,.waste-challenge-label{display:block;margin:0 0 .5rem;color:#6b7280;font-size:clamp(1.5rem,2.6vw,2rem);font-weight:600;line-height:1.15;letter-spacing:-.02em;overflow-wrap:break-word;transition:color .2s}
.about-step.active .about-step-title,.waste-challenge-title[aria-pressed="true"] .waste-challenge-label{color:#111827}
.about-step-desc,.waste-challenge-copy{display:block;margin:0;color:#6b7280;font-size:1rem;font-weight:400;line-height:2;letter-spacing:0;overflow-wrap:break-word;transition:color .2s}
.about-step.active .about-step-desc,.waste-challenge-title[aria-pressed="true"] .waste-challenge-copy{color:#4b5563}
@keyframes aboutStepFill{from{width:0}to{width:100%}}

/* ── Single-photo step carousel (How It Works, mission workflow, etc.) ── */
.process-photo-stage{position:relative;border-radius:var(--ui-radius);overflow:hidden;height:clamp(420px,80vh,820px)}
.about-phone-frame.process-photo-frame{
  position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;background:none;border-radius:0;
  box-shadow:none;opacity:0;filter:none;transform:none;z-index:1;transition:opacity .6s ease;cursor:default
}
.about-phone-frame.process-photo-frame.active{opacity:1;z-index:2;box-shadow:none;transform:none}
.process-photo-frame img{width:100%;height:100%;object-fit:cover;display:block}
.process-photo-stage.device-management-stage{height:auto;aspect-ratio:3/2;background:#eef2f5}
.device-management-stage .process-photo-frame img{object-fit:contain}
@media(max-width:575px){.about-phone-frame.process-photo-frame:not(.active){display:none}}

/* Fleet Tracking video telematics showcase */
.video-telematics-showcase{width:100%;max-width:1504px;margin:0 auto}
.video-telematics-copy{max-width:780px;margin-bottom:clamp(2.5rem,5vw,4.5rem)}
.video-telematics-stage{height:calc(100vh - 56px);min-height:640px;max-height:none;aspect-ratio:auto;background:#090b0e;border-radius:var(--ui-radius)}
.video-telematics-stage .process-photo-frame img{width:100%;height:100%;object-fit:cover;object-position:center}
.video-telematics-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(1rem,2vw,1.5rem);padding-top:1.5rem}
@media(max-width:767.98px){
  .video-telematics-stage{height:72vh;min-height:480px;aspect-ratio:auto}
  .video-telematics-tabs{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
  .video-telematics-tabs::-webkit-scrollbar{display:none}
  .video-telematics-tabs .about-step{flex:0 0 76vw;scroll-snap-align:start}
}

/* Fleet Tracking audience overview */
.fleet-tracking-audience-intro{width:100%;max-width:none}
.fleet-tracking-audience-intro .section-heading,
.fleet-tracking-audience-intro .section-lede{max-width:900px}
.fleet-tracking-audience-carousel{margin-top:clamp(3rem,6vw,5.5rem)}
.fleet-tracking-audience-carousel .scroll-track{gap:clamp(1rem,1.8vw,1.75rem)}
.fleet-tracking-audience-slide{background:transparent}
.fleet-tracking-audience-image{height:min(56vh,460px);margin-bottom:1rem;overflow:hidden;border-radius:1rem;background:#f4f4f4}
.fleet-tracking-audience-image img{display:block;width:100%;height:100%;object-fit:cover}
.fleet-tracking-audience-slide h3{margin:0 0 .55rem;color:#171a20;font-size:clamp(1.2rem,1.5vw,1.5rem);font-weight:600;letter-spacing:-.025em;line-height:1.2}
.fleet-tracking-audience-slide p{max-width:680px;margin:0;color:#5c5e62;font-size:.95rem;line-height:1.6}
.fleet-tracking-audience-summary{display:flex;align-items:baseline;justify-content:space-between;gap:2rem;margin-top:clamp(4rem,8vw,7rem);padding-top:0;border:0}
.fleet-tracking-audience-summary strong{max-width:720px;color:#171a20;font-size:clamp(1.65rem,3vw,2.6rem);font-weight:500;letter-spacing:-.04em;line-height:1.1}
.fleet-tracking-audience-summary span{max-width:320px;color:#5c5e62;font-size:.9rem;line-height:1.6;text-align:right}
@media(max-width:991px){
  .fleet-tracking-audience-image{height:min(50vh,400px)}
}
@media(max-width:575.98px){
  .fleet-tracking-audience-image{height:min(42vh,320px);min-height:0;margin-bottom:1rem}
  .fleet-tracking-audience-summary{display:block;margin-top:3rem}
  .fleet-tracking-audience-summary span{display:block;margin-top:1rem;text-align:left}
}

/* AI Event Detection: Tesla-style portrait image carousel */
/* Video Telematics business outcomes: Tesla-style image-and-progress carousel */
.business-outcomes-shell{width:100%;max-width:1504px;margin:0 auto}
.business-outcomes-stage{
  height:auto;
  min-height:360px;
  max-height:658px;
  aspect-ratio:16/7;
  border-radius:4px;
  background:#e9eaec;
}
.business-outcomes-stage .process-photo-frame img{object-position:center}
.business-outcomes-stage .about-play-toggle{
  left:2rem;
  bottom:2rem;
  width:40px;
  height:40px;
  border-radius:4px;
  background:rgba(23,26,32,.55);
  color:#fff;
  backdrop-filter:blur(8px);
}
.business-outcomes-stage .about-play-toggle:hover{background:rgba(23,26,32,.78)}
.business-outcomes-steps{
  position:relative;
  display:flex;
  align-items:flex-start;
  gap:clamp(1rem,1.6vw,1.5rem);
  width:100%;
  margin-top:1.4rem;
  padding-bottom:.35rem;
  overflow-x:auto;
  overscroll-behavior-x:contain;
  scrollbar-width:none;
  scroll-snap-type:x proximity;
}
.business-outcomes-steps::-webkit-scrollbar{display:none}
.business-outcome-step{
  display:flex;
  align-self:flex-start;
  flex-direction:column;
  flex:0 0 calc((100% - (clamp(1rem,1.6vw,1.5rem) * 2)) / 3);
  min-width:0;
  margin:0;
  padding:0;
  border:0;
  appearance:none;
  background:transparent;
  text-align:left;
  scroll-snap-align:start;
}
.business-outcome-step .about-step-track{flex:0 0 2px}
.business-outcome-step:focus-visible{outline:2px solid #4169dc;outline-offset:6px}
@media(max-width:991px){
  .business-outcomes-stage{min-height:320px;aspect-ratio:16/8}
  .business-outcome-step{flex-basis:calc((100% - 1rem) / 2)}
}
@media(max-width:575px){
  .business-outcomes-stage{min-height:0;aspect-ratio:4/3;border-radius:3px}
  .business-outcomes-stage .about-play-toggle{left:1rem;bottom:1rem;width:36px;height:36px}
  .business-outcomes-steps{margin-top:1rem;gap:.9rem}
  .business-outcome-step{flex-basis:84vw}
}

#ai-event-detection{--ai-event-gutter:max(var(--site-gutter),calc((100vw - 1504px) / 2))}
#ai-event-detection > [class*="px-"]{
  padding-left:var(--ai-event-gutter)!important;
  padding-right:var(--ai-event-gutter)!important;
}
.ai-event-carousel{margin-top:clamp(2rem,4vw,3.5rem)}
.ai-event-carousel .scroll-track{
  align-items:stretch;
  gap:clamp(1rem,1.15vw,1.4rem)!important;
  padding-bottom:.25rem;
  scroll-padding-inline:var(--ai-event-gutter);
}
.ai-event-carousel .scroll-track [data-card]{
  position:relative;
  width:clamp(320px,28vw,536px)!important;
  max-width:none!important;
  aspect-ratio:6/7;
  overflow:hidden;
  border-radius:.75rem;
  background:#171a20;
  isolation:isolate;
}
.ai-event-carousel .scroll-track > [data-card]:first-child{margin-left:var(--ai-event-gutter)!important}
.ai-event-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .5s ease;
}
.ai-event-card:hover img{transform:scale(1.025)}
.ai-event-card-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.42) 29%,rgba(0,0,0,0) 64%);
}
.ai-event-card-copy{
  position:absolute;
  right:0;
  bottom:0;
  left:0;
  z-index:2;
  padding:clamp(1.4rem,2.5vw,2rem);
}
.ai-event-card-copy h3{
  margin:0;
  color:#fff;
  font-size:clamp(1.45rem,2.1vw,2rem);
  font-weight:700;
  letter-spacing:-.035em;
  line-height:1.05;
}
.ai-event-card-copy p{
  max-width:31rem;
  margin:.65rem 0 0;
  color:rgba(255,255,255,.84);
  font-size:.78rem;
  line-height:1.5;
}
.ai-event-carousel .car-btn{
  z-index:5;
  width:48px;
  height:48px;
  border-radius:.5rem;
  background:rgba(255,255,255,.96);
  box-shadow:0 2px 12px rgba(0,0,0,.16);
}
.ai-event-carousel .sc-prev{left:1rem!important;margin-left:0!important}
.ai-event-carousel .sc-next{right:1rem!important;margin-right:0!important}
.ai-event-carousel .dot-btn{width:9px;min-width:9px;height:9px;border-radius:50%;background:#b7b7b7}
.ai-event-carousel .dot-btn.active{width:9px;background:#171a20}
.ai-event-carousel .ai-event-end-spacer{width:var(--ai-event-gutter)!important}
@media(max-width:991px){
  .ai-event-carousel .scroll-track [data-card]{width:clamp(300px,43vw,390px)!important}
}
@media(max-width:575px){
  .ai-event-carousel .scroll-track [data-card]{width:82vw!important;max-width:82vw!important;border-radius:.65rem}
  .ai-event-card-copy{padding:1.25rem}
  .ai-event-card-copy h3{font-size:1.45rem}
  .ai-event-card-copy p{font-size:.75rem}
}

/* Shared capability strips: large values and supporting labels. */
.capability-section{padding:clamp(3rem,5vw,4rem) var(--site-gutter);background:#fff}
.capability-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;max-width:1200px;margin-inline:auto;row-gap:2rem}
.capability-stat{position:relative;display:grid;grid-template-rows:1fr auto;align-content:center;min-width:0;min-height:72px;padding:0 clamp(.75rem,1.5vw,1.5rem);text-align:center}
.capability-stat-value{display:block;align-self:end;min-width:0;margin:0;color:#171a20;font-size:clamp(1.75rem,3.25vw,2.5rem);font-weight:700;letter-spacing:-.025em;line-height:1.1;overflow-wrap:anywhere;text-wrap:balance}
.capability-stat-label{display:block;margin:.6rem 0 0;color:#6c757d;font-size:.8rem;font-weight:400;line-height:1.4;text-wrap:balance}
.capability-stat-unit{font-size:.65em;margin-left:.08em}
.capability-action{display:flex;align-items:center;justify-content:center;width:100%;max-width:1200px;margin:clamp(2rem,4vw,3rem) auto 0;padding:0;text-align:center}
.capability-action .capability-demo-btn{display:inline-flex;align-items:center;justify-content:center;width:205px;max-width:100%;min-height:38px;margin:0;padding:.5rem 1.5rem;border:1px solid #d1d5db;border-radius:999px;background:#fff;color:#171a20;font-size:.85rem;font-weight:500;line-height:1.5;text-decoration:none;box-shadow:none;transition:background .2s ease,color .2s ease,border-color .2s ease}
.capability-action .capability-demo-btn:hover{border-color:#171a20;background:#171a20;color:#fff}
.capability-action .capability-demo-btn:focus-visible{outline:2px solid #4169dc;outline-offset:4px}
@media(max-width:1023.98px){
  .capability-strip{grid-template-columns:repeat(2,minmax(0,1fr));max-width:720px}
}
@media(max-width:479.98px){
  .capability-stat{padding-inline:.5rem}
  .capability-stat-value{font-size:1.5rem}
  .capability-stat-label{font-size:.75rem}
}
@media(max-width:359.98px){
  .capability-strip{grid-template-columns:1fr}
}

/* Job Scheduling capability strip */
.job-content{width:calc(100% - (var(--site-gutter) * 2));max-width:var(--content-max);margin-inline:auto}
.job-copy{max-width:780px}
.job-faq-content{max-width:820px}

/* Fleet Tracking introduction editorial image */
.fleet-tracking-intro-media{width:calc(100vw - (clamp(1rem,2.5vw,3rem) * 2));margin-left:50%;overflow:hidden;border-radius:var(--ui-radius);transform:translateX(-50%)}
.fleet-tracking-intro-media img{display:block;width:100%;height:auto;aspect-ratio:2/1;object-fit:cover}
.fleet-tracking-intro-copy{max-width:820px;padding-top:clamp(2.5rem,5vw,4.5rem)}
@media(max-width:767.98px){.fleet-tracking-intro-media img{aspect-ratio:4/3}.fleet-tracking-intro-copy{padding-top:2.25rem}}

/* Fleet Management organization editorial section */
.fleet-organization-editorial{width:100%}
.fleet-organization-media{width:calc(100vw - (clamp(1rem,2.5vw,3rem) * 2));margin-left:50%;overflow:hidden;border-radius:var(--ui-radius);background:transparent;transform:translateX(-50%)}
.fleet-organization-media img{display:block;width:100%;height:auto;mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 100%);-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 10%,#000 100%)}
.fleet-organization-copy{max-width:920px;padding-top:clamp(2.5rem,5vw,4.5rem)}
.fleet-organization-copy .section-heading{font-size:clamp(2.25rem,4.5vw,3.5rem)}
.fleet-organization-copy .section-lede{max-width:860px}
.fleet-organization-details{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(1.5rem,4vw,4rem);margin-top:clamp(3rem,6vw,5rem)}
.fleet-organization-details>div{display:flex;min-width:0;flex-direction:column;justify-content:center;padding:0}
.fleet-organization-details>div:first-child{padding-left:0}
.fleet-organization-details span{margin-bottom:.75rem;color:#171a20;font-size:clamp(2.35rem,4vw,4rem);font-weight:700;letter-spacing:-.05em;line-height:.9}
.fleet-organization-details strong{color:#393c41;font-size:clamp(.82rem,1vw,.95rem);font-weight:500;line-height:1.4}
@media(max-width:767.98px){
  .fleet-organization-copy{padding-top:2.25rem}
  .fleet-organization-details{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.25rem 1.5rem;margin-top:2.75rem}
}

/* ── Global presence map (Leaflet) ── */
.presence-map-wrap{border:1px solid #e5e7eb;overflow:hidden}
#presence-map{height:560px;border-radius:.75rem;background:#e9edf2;cursor:default}
/* Mute only the basemap; keep country markers, labels and attribution unchanged. */
#presence-map .leaflet-tile-pane{filter:grayscale(1) brightness(1.08) contrast(.9)}
#presence-map .leaflet-control-zoom{display:none}
#presence-map .leaflet-control-attribution{font-size:.65rem;background:rgba(255,255,255,.8)}
.presence-tooltip{
  background:#171a20!important;color:#fff!important;border:0!important;border-radius:6px!important;
  font-weight:600;font-size:.75rem;padding:.3rem .6rem!important;box-shadow:0 4px 10px rgba(0,0,0,.15)!important
}
.presence-tooltip::before{display:none!important}
.presence-region-nav{
  display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.65rem;
  width:max-content;max-width:100%;margin-inline:auto;padding:.7rem;
  border-radius:1.1rem;background:rgba(255,255,255,.92);
  box-shadow:0 12px 38px rgba(23,26,32,.08)
}
.presence-region-nav::before{
  content:"Explore regions";padding:0 .65rem;color:#6b7280;font-size:.72rem;
  font-weight:700;letter-spacing:.1em;text-transform:uppercase
}
.presence-region-nav a{
  display:inline-flex;align-items:center;gap:.65rem;min-height:42px;padding:.65rem 1rem;
  border-radius:.75rem;background:#f4f6fa;color:#171a20;font-size:.9rem;font-weight:600;
  line-height:1;text-decoration:none;transition:background-color .2s ease,color .2s ease,transform .2s ease
}
.presence-region-nav a::after{content:"→";color:#4169dc;font-size:1rem;transition:transform .2s ease}
.presence-region-nav a:hover,.presence-region-nav a:focus-visible{background:#171a20;color:#fff;transform:translateY(-1px)}
.presence-region-nav a:hover::after,.presence-region-nav a:focus-visible::after{transform:translateX(3px)}
.presence-region-nav a:focus-visible{outline:3px solid rgba(65,105,220,.35);outline-offset:2px}
@media(max-width:767px){#presence-map{height:420px}}
@media(max-width:575px){
  #presence-map{height:340px}
  .presence-region-nav{width:100%;justify-content:flex-start;padding:.65rem}
  .presence-region-nav::before{width:100%;padding:.3rem .45rem .45rem}
  .presence-region-nav a{flex:1 1 calc(50% - .65rem);justify-content:space-between}
}

/* ── Process steps (numbered, connected rail) ── */
.process-step{position:relative}
.process-step-num{
  width:38px;height:38px;background:#4169dc;color:#fff;font-weight:700;font-size:.9rem;
  flex-shrink:0;position:relative;z-index:1
}
.process-rail{position:absolute;top:19px;left:10%;right:10%;height:1px;background:#e5e7eb;z-index:0}

/* Autonautics implementation journey */
.implementation-journey{background:#f4f4f4!important}
.implementation-journey-layout{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:clamp(4rem,9vw,9rem);max-width:1320px;margin:auto}
.implementation-journey-intro{align-self:start;position:sticky;top:7rem}
.implementation-steps{margin:0;padding:0;list-style:none;counter-reset:implementation}
.implementation-steps li{display:grid;grid-template-columns:56px 1fr;gap:clamp(1.25rem,2.5vw,2.5rem);padding:clamp(1.75rem,3vw,2.75rem) 0;border-bottom:1px solid #d8d9dc}
.implementation-steps li:first-child{padding-top:0}
.implementation-steps li:last-child{padding-bottom:0;border-bottom:0}
.implementation-step-number{padding-top:.18rem;color:#4169dc;font-size:.72rem;font-weight:700;letter-spacing:.12em}
.implementation-steps h3{margin:0 0 .65rem;color:#171a20;font-size:clamp(1.2rem,2vw,1.55rem);font-weight:600;letter-spacing:-.025em}
.implementation-steps p{max-width:660px;margin:0;color:#666b73;font-size:.94rem;line-height:1.75}
@media(max-width:767px){.implementation-journey-layout{grid-template-columns:1fr;gap:3.5rem}.implementation-journey-intro{position:static}.implementation-steps li{grid-template-columns:42px 1fr;gap:1rem}.implementation-steps p{font-size:.9rem}}

/* Device Ecosystem compatibility detail */
.device-compatibility{background:#171a20;color:#fff}
.device-compatibility-heading{max-width:820px}
.device-compatibility-heading>p:last-child{max-width:760px;margin:1.5rem 0 0;color:#b7bbc3;font-size:1rem;line-height:1.75}
.device-compatibility-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(3rem,7vw,7rem);margin-top:clamp(4rem,7vw,7rem)}
.device-compatibility-groups section{padding:2.5rem 0;border-top:1px solid rgba(255,255,255,.17)}
.device-compatibility-index{margin:0 0 1.5rem;color:#8fa9f2;font-size:.7rem;font-weight:700;letter-spacing:.12em}
.device-compatibility-groups h3{margin:0 0 .8rem;font-size:clamp(1.25rem,2vw,1.6rem);font-weight:600;letter-spacing:-.025em}
.device-compatibility-groups section>p:last-child{max-width:560px;margin:0;color:#aeb3bc;font-size:.9rem;line-height:1.75}
.compatibility-assessment{display:grid;grid-template-columns:minmax(260px,.7fr) minmax(0,1.3fr);gap:clamp(3rem,8vw,8rem);margin-top:clamp(4rem,7vw,7rem);padding-top:clamp(4rem,7vw,6rem);border-top:1px solid rgba(255,255,255,.17)}
.compatibility-assessment h3{margin:0 0 1rem;font-size:clamp(1.75rem,3vw,2.6rem);font-weight:600;letter-spacing:-.04em}
.compatibility-assessment>div>p:last-child{margin:0;color:#aeb3bc;font-size:.92rem;line-height:1.75}
.compatibility-assessment ol{margin:0;padding:0;list-style:none}
.compatibility-assessment li{display:grid;grid-template-columns:42px 120px 1fr;align-items:baseline;gap:1rem;padding:1.25rem 0;border-bottom:1px solid rgba(255,255,255,.13)}
.compatibility-assessment li:first-child{padding-top:0}.compatibility-assessment li:last-child{border-bottom:0}
.compatibility-assessment li span{color:#8fa9f2;font-size:.68rem;font-weight:700;letter-spacing:.1em}.compatibility-assessment li strong{font-size:.95rem}.compatibility-assessment li small{color:#9da3ad;font-size:.8rem;line-height:1.55}
.device-compatibility-note{max-width:820px;margin:clamp(3rem,6vw,5rem) 0 0;color:#858c97;font-size:.76rem;line-height:1.7}
@media(max-width:767px){.device-compatibility-groups,.compatibility-assessment{grid-template-columns:1fr}.compatibility-assessment{gap:3rem}.compatibility-assessment li{grid-template-columns:34px 92px 1fr;gap:.75rem}}
@media(max-width:480px){.compatibility-assessment li{grid-template-columns:34px 1fr}.compatibility-assessment li small{grid-column:2}}

/* Platform authentication and permissions */
.access-controls{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(0,1.28fr);gap:clamp(4rem,9vw,9rem);margin-top:clamp(5rem,9vw,9rem);padding:clamp(4rem,7vw,7rem);background:#171a20;color:#fff}
.access-controls-intro{align-self:start}
.access-controls-intro h3{margin:0;color:#fff;font-size:clamp(2rem,4vw,3.6rem);font-weight:600;letter-spacing:-.05em;line-height:1.02}
.access-controls-intro>p:last-child{max-width:510px;margin:1.5rem 0 0;color:#aeb3bc;font-size:.94rem;line-height:1.75}
.access-controls-list article{display:grid;grid-template-columns:48px 1fr;gap:1.25rem;padding:1.8rem 0;border-bottom:1px solid rgba(255,255,255,.15)}
.access-controls-list article:first-child{padding-top:0}.access-controls-list article:last-child{padding-bottom:0;border-bottom:0}
.access-controls-list article>span{padding-top:.15rem;color:#8fa9f2;font-size:.68rem;font-weight:700;letter-spacing:.12em}
.access-controls-list h4{margin:0 0 .55rem;color:#fff;font-size:clamp(1.05rem,1.6vw,1.3rem);font-weight:600;letter-spacing:-.02em}
.access-controls-list p{max-width:650px;margin:0;color:#aeb3bc;font-size:.86rem;line-height:1.7}
@media(max-width:991px){.access-controls{grid-template-columns:1fr;gap:4rem;padding:clamp(3rem,7vw,5rem)}}
@media(max-width:575px){.access-controls{width:calc(100% + 2rem);margin-left:-1rem;padding:3.5rem 1.25rem}.access-controls-list article{grid-template-columns:36px 1fr;gap:.75rem}}

/* Platform operational intelligence engine */
.intelligence-engine{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);width:calc(100% + (var(--site-gutter) * 2));height:600px;margin:calc(clamp(3.5rem,7vw,6rem) + 96px) calc(var(--site-gutter) * -1) 96px;background:#000;color:#fff}
.intelligence-engine::before{content:"";position:absolute;z-index:-1;inset:-96px 0;background:#000}
.intelligence-stage{position:relative;isolation:isolate;display:flex;flex-direction:column;justify-content:space-between;padding:clamp(2rem,4vw,4.5rem);overflow:hidden;background:radial-gradient(circle at 68% 45%,rgba(65,105,220,.36),transparent 28%),radial-gradient(circle at 66% 48%,rgba(65,105,220,.12),transparent 52%),#050608}
.intelligence-stage::before,.intelligence-stage::after{content:"";position:absolute;z-index:-1;border:1px solid rgba(255,255,255,.12);border-radius:50%;aspect-ratio:1}
.intelligence-stage::before{width:min(62vw,630px);right:-12%;top:50%;transform:translateY(-50%)}
.intelligence-stage::after{width:min(42vw,420px);right:2%;top:50%;transform:translateY(-50%)}
.intelligence-stage-topline{display:flex;align-items:center;justify-content:space-between;color:#aeb4bf;font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
.intelligence-stage-index{font-size:clamp(3rem,6vw,5.75rem);font-weight:300;line-height:1;color:rgba(255,255,255,.15);letter-spacing:-.06em}
.intelligence-stage-copy{max-width:620px;position:relative;z-index:1}.intelligence-stage-kicker{margin:0 0 1rem;color:#8fa9f2;font-size:.72rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.intelligence-stage-title{margin:0;color:#fff;font-size:clamp(3.25rem,7vw,7rem);font-weight:500;letter-spacing:-.06em;line-height:.92}.intelligence-stage-description{max-width:570px;margin:1.75rem 0 0;color:#b7bbc3;font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.7}
.intelligence-stage-copy.is-changing{animation:intelligenceCopyIn .42s ease both}@keyframes intelligenceCopyIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.intelligence-stage-progress{height:2px;background:rgba(255,255,255,.14)}.intelligence-stage-progress span{display:block;width:20%;height:100%;background:#4169dc;transition:width .45s ease}
.intelligence-steps{display:flex;flex-direction:column;background:#111317}
.intelligence-step{position:relative;flex:1;display:grid;grid-template-columns:44px 1fr;grid-template-rows:auto auto;column-gap:1rem;align-content:center;padding:1.3rem clamp(1.4rem,2.5vw,2.5rem);color:#777d87;text-align:left;background:transparent;border:0;border-bottom:1px solid rgba(255,255,255,.09);transition:color .3s ease,background .3s ease;cursor:pointer}
.intelligence-step:last-child{border-bottom:0}.intelligence-step::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:#4169dc;transform:scaleY(0);transition:transform .3s ease}.intelligence-step span{grid-row:1/3;color:#555b65;font-size:.72rem;font-weight:600;letter-spacing:.08em}.intelligence-step strong{color:inherit;font-size:clamp(1rem,1.4vw,1.2rem);font-weight:600}.intelligence-step small{margin-top:.3rem;color:#666c76;font-size:.78rem}.intelligence-step:hover,.intelligence-step:focus-visible,.intelligence-step.active{color:#fff;background:rgba(255,255,255,.045)}.intelligence-step.active::before{transform:scaleY(1)}.intelligence-step.active span{color:#8fa9f2}.intelligence-step.active small{color:#a8adb6}
@media(max-width:991px){.intelligence-engine{grid-template-columns:1fr;height:612px;margin-top:calc(clamp(3.5rem,7vw,6rem) + 72px);margin-bottom:72px}.intelligence-engine::before{inset:-72px 0}.intelligence-stage{height:500px;min-height:0}.intelligence-steps{height:112px;flex-direction:row;overflow-x:auto;scrollbar-width:none}.intelligence-steps::-webkit-scrollbar{display:none}.intelligence-step{flex:0 0 180px;min-height:112px;border-right:1px solid rgba(255,255,255,.09);border-bottom:0}.intelligence-step::before{inset:auto 0 0;width:auto;height:3px;transform:scaleX(0)}.intelligence-step.active::before{transform:scaleX(1)}}
@media(max-width:575px){.intelligence-engine{height:534px;margin-top:calc(clamp(3.5rem,7vw,6rem) + 56px);margin-bottom:56px}.intelligence-engine::before{inset:-56px 0}.intelligence-stage{height:430px;padding:1.5rem}.intelligence-steps{height:104px}.intelligence-stage::before{width:500px;right:-65%}.intelligence-stage::after{width:330px;right:-37%}.intelligence-stage-description{max-width:90%}.intelligence-step{min-height:104px;flex-basis:160px;padding:1.1rem;grid-template-columns:34px 1fr}.intelligence-step small{display:none}}
@media(prefers-reduced-motion:reduce){.intelligence-stage-copy.is-changing{animation:none}}

/* ── Platform flow diagram ── */
.platform-flow-node{
  background:#fff;border:1px solid #e5e7eb;border-radius:.75rem;padding:1.1rem 1.5rem;
  max-width:440px;margin:0 auto;text-align:center
}
.platform-flow-chevron{display:flex;justify-content:center;padding:.4rem 0;color:#9ca3af}
.platform-flow-hub{
  background:#0d1b2a;border-radius:1.25rem;padding:2rem 1.5rem;max-width:560px;margin:0 auto;
  box-shadow:0 24px 48px rgba(13,27,42,.18);text-align:center
}
.platform-flow-chip{
  background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.18);
  border-radius:999px;padding:.4rem 1rem;font-size:.78rem;font-weight:600
}

/* Patrol Connect introduction: aligned copy above an uncropped, edge-to-edge image. */
.security-intro-layout{display:flex;width:min(calc(100% - (var(--site-gutter) * 2)),var(--content-max));flex-direction:column;margin:auto}
.security-intro-copy{max-width:1160px;margin-bottom:clamp(2.5rem,5vw,4.25rem);padding-inline:clamp(0rem,8vw,7rem)}
.security-intro-copy .section-heading{margin-bottom:.75rem}
.security-intro-visual{width:100%;margin:0;padding:0;border:0;border-radius:0;background:#0d1622}
.security-intro-visual img{display:block;width:100%;height:auto}
@media(max-width:991px){.security-intro-copy{max-width:760px;padding-inline:0}}

/* Integrations: connected architecture visual */
.integration-architecture{width:calc(100% + (var(--site-gutter) * 2));max-width:none;margin:clamp(5rem,9vw,8rem) calc(var(--site-gutter) * -1) 0;padding:clamp(2.25rem,5vw,4.5rem) var(--site-gutter);background:#f4f4f4;border-radius:0;color:#171a20;overflow:hidden}
.integration-architecture-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-bottom:clamp(3rem,6vw,5rem)}
.integration-architecture-heading span{color:#4169dc;font-size:.7rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.integration-architecture-heading h3{max-width:570px;margin:0;font-size:clamp(2rem,4.2vw,3.75rem);font-weight:600;letter-spacing:-.045em;line-height:1.04;text-align:right}
.integration-sources{--architecture-gap:clamp(2rem,7vw,8rem);--architecture-connector-offset:clamp(.5rem,1.75vw,2rem);position:relative;display:grid;grid-template-columns:1fr 1fr;gap:var(--architecture-gap);width:100%;max-width:var(--content-max);margin:auto;padding-bottom:40px}
.integration-sources::before{content:"";position:absolute;right:calc(25% - var(--architecture-connector-offset));bottom:0;left:calc(25% - var(--architecture-connector-offset));height:2px;background:#4169dc}
.integration-source{position:relative;display:flex;align-items:center;gap:1.25rem;padding-bottom:1.5rem;border-bottom:1px solid #cfd2d7}
.integration-source::after{content:"";position:absolute;bottom:-40px;left:50%;width:2px;height:40px;background:#4169dc;transform:translateX(-50%)}
.integration-source-icon{display:grid;width:56px;height:56px;flex:0 0 56px;place-items:center;color:#171a20}
.integration-source-icon svg{width:50px;height:50px}
.integration-source-copy{display:flex;min-width:0;flex-direction:column}.integration-source-copy strong{font-size:1.05rem;font-weight:600;letter-spacing:-.015em}.integration-source-copy small{margin-top:.35rem;color:#69707a;font-size:.76rem;line-height:1.5}
.integration-merge{position:relative;width:2px;height:58px;margin:0 auto;background:#4169dc;border:0}
.integration-merge::before{content:"";position:absolute;top:-5px;left:50%;width:10px;height:10px;border:2px solid #4169dc;border-radius:50%;background:#f4f4f4;transform:translateX(-50%)}
.integration-merge::after{content:"";position:absolute;bottom:1px;left:50%;width:9px;height:9px;border-right:2px solid #4169dc;border-bottom:2px solid #4169dc;transform:translateX(-50%) rotate(45deg)}
.integration-merge span{display:none}
.integration-gateway{display:flex;width:max-content;max-width:100%;align-items:center;gap:.9rem;margin:0 auto;padding:.8rem 1.15rem;background:#fff;border:1px solid #c7d2f1;border-radius:999px;box-shadow:0 8px 24px rgba(65,105,220,.1)}
.integration-gateway-icon{display:grid;width:30px;height:30px;place-items:center;color:#4169dc}.integration-gateway-icon svg{width:28px;height:28px}.integration-gateway>span:last-child{display:flex;flex-direction:column}.integration-gateway strong{font-size:.82rem;font-weight:600}.integration-gateway small{margin-top:.15rem;color:#737983;font-size:.67rem}
.integration-flow-line{position:relative;width:2px;height:72px;margin:auto;background:linear-gradient(#4169dc,#8ba1e6)}.integration-flow-line::before{content:"";position:absolute;top:0;left:50%;width:8px;height:8px;border-radius:50%;background:#4169dc;transform:translate(-50%,-1px)}.integration-flow-line::after{content:"";position:absolute;left:50%;bottom:2px;width:9px;height:9px;border-right:2px solid #4169dc;border-bottom:2px solid #4169dc;transform:translateX(-50%) rotate(45deg)}
.integration-platform{display:flex;min-height:130px;align-items:center;justify-content:space-between;padding:clamp(1.75rem,4vw,3rem);background:#171a20;color:#fff;border-radius:4px}
.integration-platform>div{display:flex;flex-direction:column}.integration-platform span{margin-bottom:.55rem;color:#91a9ec;font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}.integration-platform strong{font-size:clamp(1.65rem,3.2vw,3rem);font-weight:600;letter-spacing:-.04em}.integration-platform svg{width:min(28%,190px);color:#6e8ce4}
.integration-flow-line--out{height:84px}
.integration-outcome{display:flex;max-width:720px;align-items:center;flex-direction:column;gap:.75rem;margin:0 auto;padding:1.25rem 1rem 0;text-align:center}.integration-outcome-dot{width:11px;height:11px;border-radius:50%;background:#4169dc;box-shadow:0 0 0 7px rgba(65,105,220,.12)}.integration-outcome>div{display:flex;align-items:center;flex-direction:column}.integration-outcome>div span{color:#4169dc;font-size:.66rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase}.integration-outcome strong{margin-top:.35rem;font-size:clamp(1.35rem,2.4vw,1.8rem);font-weight:600;letter-spacing:-.025em}.integration-outcome p{margin:0;color:#69707a;font-size:.85rem;text-align:center}
@media(max-width:767px){.integration-architecture-heading{display:block}.integration-architecture-heading h3{margin-top:1rem;text-align:left}.integration-sources{--architecture-gap:1rem;--architecture-connector-offset:.25rem}.integration-source{align-items:flex-start;flex-direction:column}.integration-platform svg{width:25%}}
@media(max-width:575px){.integration-architecture{padding:2rem 1.25rem}.integration-sources{display:grid;grid-template-columns:1fr;gap:1.5rem;padding-bottom:32px}.integration-sources::before{right:auto;bottom:0;left:50%;width:2px;height:32px}.integration-source{flex-direction:row}.integration-source::after{display:none}.integration-merge{height:48px}.integration-gateway{border-radius:4px}.integration-platform{min-height:120px}.integration-platform svg{display:none}}
.platform-flow-sep{color:rgba(255,255,255,.35)}
.platform-flow-output{max-width:640px;margin:0 auto;text-align:center}

/* Platform flow: complete input → intelligence → outcome system. */
.platform-system-flow{width:calc(100% + (var(--site-gutter) * 2));margin:clamp(7rem,12vw,12rem) calc(var(--site-gutter) * -1) 0;padding:clamp(4.5rem,8vw,8rem) var(--site-gutter);color:#171a20;background:#fff}
.platform-system-heading{max-width:760px;margin-bottom:clamp(3.5rem,6vw,5.5rem)}
.platform-system-heading h3{margin:0;font-size:clamp(2rem,4vw,3.75rem);font-weight:600;letter-spacing:-.045em;line-height:1.05}.platform-system-heading>p:last-child{max-width:650px;margin:1.25rem 0 0;color:#69707a;font-size:1rem;line-height:1.7}
.platform-flow-map{width:100%;max-width:1600px;margin:auto;background:#fff}
.platform-flow-tier{display:block}
.platform-flow-tier-heading{position:relative;display:block;padding:clamp(3rem,5vw,5rem) 1rem 1.25rem;text-align:center}.platform-flow-tier-heading>span{display:none}.platform-flow-tier-heading h4{margin:0 0 .55rem;font-size:clamp(1.6rem,2.4vw,2.25rem);font-weight:600;letter-spacing:-.035em}.platform-flow-tier-heading p{margin:0;color:#818792;font-size:.8rem}
.platform-flow-items{display:grid;grid-template-columns:repeat(4,1fr);align-items:stretch;max-width:1400px;margin:auto}.platform-flow-items article{position:relative;display:flex;min-height:190px;flex-direction:column;align-items:center;justify-content:center;padding:clamp(1.75rem,3vw,3.25rem);text-align:center}.platform-flow-items article::after{display:none}.platform-flow-items strong{font-size:.92rem;font-weight:600;letter-spacing:-.01em}.platform-flow-items small{max-width:230px;margin-top:.75rem;color:#747b85;font-size:.75rem;line-height:1.6}
.platform-flow-long-arrow{display:flex;height:132px;align-items:center;justify-content:center;background:#fff}.platform-flow-long-arrow svg{width:24px;height:96px;stroke:#4169dc;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.platform-flow-platform{position:relative;isolation:isolate;display:block;width:calc(100% + (var(--site-gutter) * 2));min-height:720px;margin-inline:calc(var(--site-gutter) * -1);padding:clamp(4.5rem,7vw,6.5rem) var(--site-gutter);background:#171a20;color:#fff;overflow:hidden}.platform-flow-platform::after{content:"AUTONAUTICS";position:absolute;right:-.02em;bottom:-.2em;color:rgba(255,255,255,.025);font-size:clamp(6rem,13vw,13rem);font-weight:700;letter-spacing:-.07em;line-height:1;z-index:-1}.platform-flow-platform .platform-flow-tier-heading{display:block;padding:0;text-align:center}.platform-flow-platform .platform-flow-tier-heading h4{margin-bottom:.7rem;font-size:clamp(2.15rem,4vw,3.5rem);font-weight:600;letter-spacing:-.04em}.platform-flow-platform .platform-flow-tier-heading p{color:#aab8d0;font-size:.85rem}
.platform-flow-actions{display:flex;width:min(100%,1220px);flex-direction:column;margin:clamp(3rem,5vw,4.5rem) auto 0;padding:0;list-style:none}.platform-flow-actions li{display:flex;min-height:118px;flex-direction:column;align-items:center;justify-content:center;text-align:center;border-bottom:1px solid rgba(255,255,255,.16)}.platform-flow-actions li:first-child{border-top:1px solid rgba(255,255,255,.16)}.platform-flow-actions strong{margin-bottom:.55rem;font-size:clamp(1.05rem,1.45vw,1.3rem);font-weight:600;letter-spacing:-.015em}.platform-flow-actions small{color:#aab8d0;font-size:.8rem;line-height:1.55}.platform-flow-outcomes .platform-flow-items strong{color:#2448ac}
@media(max-width:991px){.platform-flow-tier{grid-template-columns:1fr}.platform-flow-tier-heading{border-right:0;border-bottom:1px solid #dfe2e6}.platform-flow-platform .platform-flow-tier-heading{border-bottom:0}.platform-flow-items article{min-height:140px}}
@media(max-width:767px){.platform-flow-items{grid-template-columns:repeat(2,1fr)}.platform-flow-items article:nth-child(-n+2){border-bottom:1px solid #e4e6e9}.platform-flow-items article:nth-child(2){border-right:0}.platform-flow-long-arrow{height:100px}.platform-flow-long-arrow svg{height:76px}.platform-flow-platform{min-height:650px}.platform-flow-actions li{min-height:105px}}
@media(max-width:575px){.platform-system-flow{margin-top:7rem}.platform-flow-items{grid-template-columns:1fr}.platform-flow-items article{min-height:112px;border-right:0!important;border-bottom:1px solid #e4e6e9!important}.platform-flow-platform{padding-block:4rem}.platform-flow-actions li{min-height:108px}.platform-flow-actions small{margin-top:.1rem}}

/* ── Final CTA band ── */
.cta-band{padding-right:0!important;padding-bottom:0!important;padding-left:0!important;overflow:hidden}
.cta-band.cta-band--full-media{padding-right:0!important;padding-bottom:0!important;padding-left:0!important}
.cta-band-content{position:relative;z-index:2;padding-right:1.5rem;padding-bottom:clamp(3.5rem,6vw,5.5rem);padding-left:1.5rem}
.cta-band-media{position:relative;width:100%;height:clamp(360px,55vw,720px);overflow:hidden}
.cta-band-media::before{
  content:"";position:absolute;inset:0 0 auto;height:18%;z-index:1;pointer-events:none;
  background:linear-gradient(to bottom,#0d1b2a 0%,rgba(13,27,42,.7) 32%,transparent 100%)
}
.cta-band-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom}
.cta-band-media.cta-band-media--full{width:100%;height:auto;min-height:0;margin:0;padding:0;aspect-ratio:auto}
.cta-band-media.cta-band-media--full::before{content:none}
.cta-band-media.cta-band-media--full img{height:auto;object-fit:contain;object-position:center}
.cta-band-media.cta-band-media--video img,.cta-band-media.cta-band-media--video video{object-position:center 35%}
.cta-band-media--video video{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none}
.cta-band-media--video[data-video-ready="true"] video{opacity:1}
.cta-video-toggle{position:absolute;left:clamp(1rem,3vw,3rem);bottom:clamp(1rem,3vw,3rem);z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:4px;background:rgba(23,26,32,.65);color:#fff;backdrop-filter:blur(8px);cursor:pointer}
.cta-video-toggle:hover{background:rgba(23,26,32,.85)}
.cta-video-toggle[hidden],[data-cta-video][data-paused="true"] .icon-pause,[data-cta-video][data-paused="false"] .icon-play{display:none}
.cta-video-toggle:focus-visible{outline:3px solid #fff;outline-offset:4px}
.locations-cta-wrap,.stories-cta-wrap{padding-bottom:0!important;overflow:hidden}
.locations-cta-wrap>.cta-band-media,.stories-cta-wrap>.cta-band-media{left:50%;width:100vw;margin-top:clamp(3rem,6vw,5rem);transform:translateX(-50%)}
.cta-band .btn{border-radius:4px;font-size:.875rem;font-weight:600;min-width:180px;padding-top:.66rem;padding-bottom:.66rem}
.cta-primary-btn{background:#4169dc;border:1px solid #4169dc;color:#fff}
.cta-primary-btn:hover{background:#355bc8;border-color:#355bc8;color:#fff}
.cta-secondary-btn{background:transparent;border:1px solid rgba(255,255,255,.4);color:#fff}
.cta-secondary-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.7);color:#fff}
.cta-action-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.12);transition:all .2s ease}
.cta-action-card:hover{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.28);transform:translateY(-3px)}
@media(max-width:575px){
  .cta-band-media{height:420px}
  .cta-band-media img{object-position:54% bottom}
}

/* Keep photography proportional on narrow screens. Desktop dimensions stay
   unchanged; phones use the same compositions in predictable media frames. */
@media(max-width:767px){
  .why-card-img,
  .mission-security-row .why-card-img,
  .last-mile-feature-row .why-card-img,
  .last-mile-how-carousel .last-mile-how-image,
  .event-media,
  .event-media.carousel .carousel-item,
  .fleet-tracking-audience-image{
    height:auto;
    min-height:0;
    aspect-ratio:16/10;
  }

  div[style*="height:280px"]:has(>img.object-fit-cover),
  div[style*="height:400px"]:has(>img.object-fit-cover){
    height:auto!important;
    aspect-ratio:16/10;
  }

  .cta-band-media{
    height:auto;
    min-height:0;
    aspect-ratio:4/3;
  }

  .cta-band-media img,
  .why-card-img img,
  .last-mile-how-image img,
  .event-media img,
  .fleet-tracking-audience-image img,
  div[style*="height:280px"]>img.object-fit-cover,
  div[style*="height:400px"]>img.object-fit-cover{
    width:100%;
    height:100%;
    object-fit:cover;
  }
}

/* ── Light numbered step badge (Request Demo, Fleet Tracking "How It Works", etc.) ── */
.step-num{width:44px;height:44px;border-radius:50%;background:rgba(13,110,253,.08);color:#0d6efd;font-weight:700;font-size:.95rem}

/* ── FAQ accordion (Request Demo, Homepage, and any solution/product page) ── */
/* Auto margins on a grid item otherwise let its width depend on the open answer.
   Keep each wrapper at its existing max-width throughout collapse transitions. */
:is(body,main) > section.section-pad[class*="px-"] > div:has(> .demo-accordion){width:100%;min-width:0}
.demo-accordion{width:100%;min-width:0}
.demo-accordion .accordion-item{
  background:#fff;border:1px solid #e5e7eb;border-radius:1rem;margin-bottom:.75rem;
  overflow:hidden;transition:border-color .2s ease,box-shadow .2s ease;
}
.demo-accordion .accordion-item:hover{border-color:#d1d5db;box-shadow:0 2px 10px rgba(0,0,0,.04)}
.demo-accordion .accordion-item:last-child{margin-bottom:0}
.demo-accordion .accordion-button{background:transparent;font-weight:600;font-size:.98rem;color:#171a20;padding:1.15rem 1.5rem;box-shadow:none}
.demo-accordion .accordion-button:not(.collapsed){background:#f9fafb;color:#171a20;box-shadow:none}
.demo-accordion .accordion-button:focus{box-shadow:none}
.demo-accordion .accordion-button::after{
  background-image:none!important;content:'+';font-size:1.4rem;font-weight:400;color:#4169dc;
  line-height:1;width:20px;height:20px;display:flex;align-items:center;justify-content:center;
  transition:none;flex-shrink:0;
}
.demo-accordion .accordion-button:not(.collapsed)::after{content:'\2212'}
.demo-accordion .accordion-body{padding:0 1.5rem 1.25rem;color:#4b5563;font-size:.92rem;line-height:1.7}

/* ── Tesla-style form inputs (Request Demo, Contact Us) ── */
.tesla-form .form-control,
.tesla-form .form-select{border-radius:.75rem;padding:.65rem 1rem;border-color:#d1d5db;font-size:.9rem}
.tesla-form .form-control:focus,
.tesla-form .form-select:focus{border-color:#4169dc;box-shadow:0 0 0 .2rem rgba(65,105,220,.15)}
.tesla-form label{font-size:.78rem;font-weight:600;color:#4b5563;margin-bottom:.4rem}
.form-success-msg{display:none}

/* ── Carousel bleed padding to align with bootstrap px- classes ── */
.scroll-track.px-3 { scroll-padding-left: 1rem; scroll-padding-right: 1rem; }
.scroll-track.px-4 { scroll-padding-left: 1.5rem; scroll-padding-right: 1.5rem; }
.scroll-track.px-5 { scroll-padding-left: 3rem; scroll-padding-right: 3rem; }
@media (min-width: 768px) {
  .scroll-track.px-md-3 { scroll-padding-left: 1rem; scroll-padding-right: 1rem; }
  .scroll-track.px-md-4 { scroll-padding-left: 1.5rem; scroll-padding-right: 1.5rem; }
  .scroll-track.px-md-5 { scroll-padding-left: 3rem; scroll-padding-right: 3rem; }
}
@media (min-width: 992px) {
  .scroll-track.px-lg-3 { scroll-padding-left: 1rem; scroll-padding-right: 1rem; }
  .scroll-track.px-lg-4 { scroll-padding-left: 1.5rem; scroll-padding-right: 1.5rem; }
  .scroll-track.px-lg-5 { scroll-padding-left: 3rem; scroll-padding-right: 3rem; }
}

/* ── Coming Soon (photo-mosaic backdrop + glass card) ── */
.coming-soon-hero{position:relative;min-height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:2rem 1.25rem}
.coming-soon-mosaic{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:2px;background:#0d1017}
.coming-soon-mosaic img{width:100%;height:100%;object-fit:cover;filter:grayscale(.35) brightness(.5)}
@media(max-width:767px){.coming-soon-mosaic{grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,1fr)}}
.coming-soon-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,13,20,.6),rgba(10,13,20,.8))}
.coming-soon-card{position:relative;z-index:2;max-width:640px;width:100%;padding:clamp(2rem,5vw,3.5rem);text-align:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);border-radius:1.5rem;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);box-shadow:0 24px 60px rgba(0,0,0,.4)}
.coming-soon-teaser{display:flex;justify-content:center;gap:clamp(1.25rem,4vw,2.25rem);flex-wrap:wrap;margin-top:2.25rem}
.coming-soon-teaser-item{display:flex;flex-direction:column;align-items:center;gap:.6rem;color:rgba(255,255,255,.85);width:84px}
.coming-soon-teaser-icon{width:60px;height:60px;border-radius:0;background:transparent;border:0;display:flex;align-items:center;justify-content:center;color:#fff}
.coming-soon-teaser-icon svg{width:46px!important;height:46px!important;overflow:visible}
.coming-soon-teaser-icon svg [stroke]{stroke-width:1.7!important}
.coming-soon-teaser-item span.small{font-size:.72rem;line-height:1.3}

/* ── Footer social icons ── */
.social-footer-link{color:#6c757d;transition:color .15s;display:inline-flex}
.social-footer-link:hover{color:#171a20}
.footer-legal-link{color:#6c757d;font-size:.75rem;text-decoration:none}
.footer-legal-link:hover{color:#171a20}
/* Static navigation fallback is written into public HTML during the build. */
.skip-link{position:fixed;top:.5rem;left:.5rem;z-index:2000;padding:.75rem 1rem;background:#171a20;color:#fff;transform:translateY(-160%);transition:transform .15s}.skip-link:focus{transform:none;color:#fff}
.static-site-nav{position:fixed;inset:0 0 auto;z-index:1049;display:flex;height:56px;align-items:center;gap:2rem;padding:0 clamp(1rem,3vw,3rem);background:#fff}.static-site-logo{flex:0 0 auto}.static-site-nav nav{display:flex;align-items:center;gap:clamp(.8rem,2vw,1.8rem);margin-left:auto}.static-site-nav nav a{color:#171a20;font-size:.82rem;font-weight:600;text-decoration:none}.static-site-nav nav a:focus-visible{outline:2px solid #4169dc;outline-offset:4px}@media(max-width:850px){.static-site-nav{height:auto;min-height:56px;align-items:flex-start;padding-block:.5rem}.static-site-nav nav{flex-wrap:wrap;justify-content:flex-end;gap:.45rem 1rem}.static-site-nav nav a{font-size:.75rem}}

/* WCAG 2.2 interaction safeguards shared by every public page. */
html{scroll-padding-top:72px}
:target{scroll-margin-top:72px}
:where(a,button,input,select,textarea,summary,[tabindex]:not([tabindex="-1"])):focus-visible{outline:3px solid #0b57d0;outline-offset:3px;box-shadow:0 0 0 2px #fff}
:where(button,input,select,textarea,[role="button"]){min-height:24px}
.social-footer-link{min-width:24px;min-height:24px;align-items:center;justify-content:center}
.dot-btn{position:relative;width:24px!important;height:24px!important;min-width:24px!important;padding:0!important;background:transparent!important;display:inline-flex;align-items:center;justify-content:center}
.dot-btn::before{content:"";display:block;width:8px;height:8px;border-radius:999px;background:#9ca3af;transition:width .3s ease,background-color .3s ease}
.dot-btn.active::before{width:16px;background:#111827}
.dot-btn-light::before{background:rgba(255,255,255,.5)}
.dot-btn-light.active::before{background:#fff}
.device-card .text-secondary,.feature-card .text-secondary,.stat-card-sm .text-secondary{color:#565e64!important}
/* Keep secondary copy readable on the site's off-white surfaces. */
.text-secondary{color:#4b5563!important}
.text-primary{color:#0759b8!important}
.step-num{color:#0759b8!important}
.cta-band .section-eyebrow,.cta-band-content .section-eyebrow{color:#a9bcff!important}
.cta-band .text-secondary,.cta-band-content .text-secondary{color:#c7cbd1!important}
[style*="color:#4169dc"]{color:#3154b8!important}
.tesla-card [style*="color:#4169dc"]{color:#3154b8!important}

/* Page-specific muted text that fell just below WCAG AA contrast. */
.privacy{color:#5f6368!important}
.privacy a{color:#0759b8!important;text-decoration:underline!important}
.path-index{color:#5f6368!important}
.office-list a{text-decoration:underline!important;text-underline-offset:2px}
.support-number{color:#b8bec7!important}

/* Platform diagrams use smaller labels, so they need stronger colour values. */
.platform-flow-tier-heading p{color:#626974}
.platform-flow-items small{color:#626974}
.integration-architecture-heading span,.integration-outcome>div span{color:#3154b8}
.integration-gateway small{color:#5f6670}
.implementation-step-number{color:#3154b8}
.access-controls .section-eyebrow{color:#a9bcff}

/* Small labels used by standalone page layouts. */
.career-value span,.value-item span{color:#3154b8!important}
.personal-steps article>span{color:#5f6368!important}
.demo-field label span,.demo-privacy{color:#5f6368!important}
.demo-privacy a{color:#0759b8!important;text-decoration:underline!important}
.demo-outcome-number{color:#5f6368!important}
.demo-process .demo-kicker{color:#a9bcff!important}
.device-compatibility-heading .section-eyebrow,.compatibility-assessment .section-eyebrow{color:#a9bcff!important}
.region-section .region-kicker{color:#3154b8!important}
.region-support-panel .region-kicker{color:#a9bcff!important}
.advanced-item>span{color:#8b95a5!important}

/* IoT alternates intentionally dark and light sections. */
.section-pad:not(.iot-light-section) .iot-copy .text-secondary{color:#c7cbd1!important}
body .iot-light-cards .row>.col>.h-100>p.text-uppercase,.iot-light-section .iot-copy>p.text-uppercase{color:#5f6368!important}
.iot-light-section .iot-workflow-copy .carousel-card-description{color:#5c6066!important}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}
}
