*{margin:0;padding:0;box-sizing:border-box}
body{font-family:var(--font-family-subtext);color:var(--text-color);background:var(--background-color);-webkit-font-smoothing:antialiased;line-height:1.55}
.wrap{max-width:var(--wrap);;margin:0 auto;padding:0 var(--space-8)}
a{color:inherit;text-decoration:none}
.btn{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--btn-padding-y) var(--btn-padding-x);border-radius:var(--radius-box-ms);font-weight:var(--btn-font-weight);font-size:var(--btn-font-size);transition:var(--btn-transition);cursor:pointer;border:var(--btn-border-width) solid transparent;font-family:var(--btn-font-family)}
.btn-p{background:var(--primary-color);color:#fff;box-shadow:var(--btn-primary-shadow)}
.btn-p:hover{box-shadow:var(--btn-primary-shadow-hover)}
.btn-g{background:#fff;color:var(--navy);border:1.5px solid var(--border-color)}
.btn-g:hover{color:var(--primary-color)}

.shead{max-width:720px;margin:0 auto var(--space-12);text-align:center}
.shead p{color:var(--muted);font-size:var(--fs-body-lg);margin-top:var(--space-3)}
@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
@keyframes fup{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* Hero */
.hero{background:#fff;position:relative;overflow:hidden}
.hg{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--space-12);align-items:center}
.hl h1{margin:var(--space-5) 0}
.hl h1 .g{background:var(--primary-color);-webkit-background-clip:text;background-clip:text;color:transparent}
.hl p.ld{font-size:var(--fs-body-lg);color:var(--muted);max-width:540px;margin:0 0 var(--space-6)}
.hcta{display:flex;gap:var(--space-3);flex-wrap:wrap}
.hmk{position:relative}
.hmk-card{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-nav);padding:var(--space-5);box-shadow:var(--shadow);transform:rotateY(-4deg) rotateX(2deg)}
.hh{display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--space-4);border-bottom:1px solid var(--border-color);margin-bottom:var(--space-4)}
.hh b{font-size:var(--fs-small);color:var(--text-color);font-weight:800}
.liv{display:flex;align-items:center;gap:var(--space-1);font-size:var(--fs-caption);color:var(--color-success);font-weight:700;letter-spacing:.04em;text-transform:uppercase}
.liv i{width:6px;height:6px;border-radius:50%;background:var(--color-success);animation:pulse 2s ease-in-out infinite}
.hk{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-2);margin-bottom:var(--space-3)}
.hkb{background:var(--background-color);border-radius:var(--radius-badge);padding:var(--space-3) var(--space-3)}
.hkb .l{font-size:var(--fs-caption);color:var(--muted);font-weight:700;letter-spacing:.04em}
.hkb .v{font-size:var(--fs-body-lg);font-weight:800;color:var(--text-color);margin-top:var(--space-1);letter-spacing:-.02em}
.hkb .v.c{color:var(--primary-color)}
.hmap{background:var(--surface-blue);border-radius:var(--radius-badge);height:148px;position:relative;overflow:hidden}
.hmap .gd{position:absolute;inset:0;background-image:none}
.hmap .zn{position:absolute;border:1.5px dashed rgba(var(--primary-rgb),.6);border-radius:var(--radius-box-icon);background:rgba(var(--primary-rgb),.04)}
.hmap .z1{top:18px;left:30px;width:84px;height:50px}
.hmap .z2{top:78px;right:36px;width:70px;height:46px;border-color:rgba(22,163,74,.6);background:rgba(22,163,74,.05)}
.hmap .dt{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--primary-color);box-shadow:0 0 8px rgba(var(--primary-rgb),.7);animation:pulse 2s ease-in-out infinite}
.hmap .dt:nth-child(3){top:30px;left:62px;animation-delay:.2s}
.hmap .dt:nth-child(4){top:90px;left:130px;animation-delay:.5s}
.hmap .dt:nth-child(5){top:54px;right:80px;animation-delay:.7s}
.hmap .dt:nth-child(6){top:106px;right:54px;animation-delay:.9s;background:var(--color-danger);box-shadow:var(--shadow-1)}
.hmap .dt:nth-child(7){top:70px;left:96px;animation-delay:1.1s}
.hfl{position:absolute;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-btn);padding:var(--space-3) var(--space-4);box-shadow:var(--shadow-3);font-size:var(--fs-caption);font-weight:700;color:var(--text-color);display:flex;align-items:center;gap:var(--space-2);animation:floaty 6s ease-in-out infinite}
.hfl .fc{width:24px;height:24px;border-radius:var(--radius-box-icon);background:var(--primary-color);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.hfl .fc svg{width:13px;height:13px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hfl.f1{bottom:30px;left:-18px}
.hfl.f2{top:-12px;right:-14px;animation-delay:2s}
@media(max-width:980px){.hg{grid-template-columns:1fr;gap:var(--space-10)}.hmk-card{transform:none}}

/* Modes */
.mod{background:#fff}

.mc{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-nav);padding:var(--space-6);transition:.25s;position:relative}
.mc:hover{border-color:var(--primary-color);transform:translateY(-3px);box-shadow:var(--shadow-sm)}
.mc .mf{height:132px;margin-bottom:var(--space-5);background:var(--surface-blue);border:1px solid var(--border-color);border-radius:var(--radius-sm);overflow:hidden;position:relative;transition:.25s}
.mc:hover .mf{border-color:rgba(var(--primary-rgb),.45)}
.mc .mf svg{width:100%;height:100%;display:block}
.mc h3{margin-bottom:var(--space-2)}
.mc p{font-size:var(--fs-small);color:var(--muted);line-height:var(--line-height-body)}
.mc .mtg{position:absolute;top:18px;right:18px;font-size:var(--fs-caption);font-weight:800;letter-spacing:.05em;color:var(--primary-color);text-transform:uppercase}

/* Challenges */


.phn{margin:0 auto;width:260px;background:var(--color-navy-2);border-radius:var(--radius-lg);padding:var(--space-2);box-shadow:var(--shadow);position:relative}
.phn:before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:60px;height:5px;background:#000;border-radius:3px;z-index:2}
.psc{background:#fff;border-radius:var(--radius-lg);overflow:hidden;height:480px;position:relative}
.pst{display:flex;justify-content:space-between;padding:var(--space-5) var(--space-6) var(--space-2);font-size:var(--fs-caption);font-weight:700;color:var(--text-color)}
.pah{padding:var(--space-2) var(--space-5);display:flex;align-items:center;justify-content:space-between}
.pah .pb{display:flex;align-items:center;gap:var(--space-2);font-size:var(--fs-caption);font-weight:800;color:var(--text-color)}
.pah .pb .lo{width:14px;height:16px}
.pah .pb .lo:after{font-size:var(--fs-caption);padding-bottom:var(--space-1)}
.pah .pm{width:24px;height:24px;border-radius:var(--radius-box-icon);background:var(--background-color);display:flex;align-items:center;justify-content:center}
.pah .pm svg{width:13px;height:13px;stroke:var(--text-color);fill:none;stroke-width:2;stroke-linecap:round}

.phn.op .phs{margin:var(--space-2) var(--space-4);background:var(--background-color);border-radius:var(--radius-badge);padding:var(--space-2) var(--space-3);display:flex;justify-content:space-between;align-items:center}
.phn.op .phs .pls{font-size:var(--fs-caption);font-weight:800;color:var(--text-color)}
.phn.op .phs .pts{font-size:var(--fs-caption);color:var(--muted);font-weight:600}
.phn.op .ptk{margin:var(--space-2) var(--space-4);display:flex;flex-direction:column;gap:var(--space-2)}
.phn.op .pt{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-3);display:flex;justify-content:space-between;align-items:center;animation:fup .5s ease-out backwards}
.phn.op .pt:nth-child(1){animation-delay:.1s}.phn.op .pt:nth-child(2){animation-delay:.2s}.phn.op .pt:nth-child(3){animation-delay:.3s}.phn.op .pt:nth-child(4){animation-delay:.4s}
.phn.op .pt.ac{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(var(--primary-rgb),.12)}
.phn.op .pt .ptl{font-size:var(--fs-caption);font-weight:800;color:var(--text-color)}
.phn.op .pt .ptm{font-size:var(--fs-caption);color:var(--muted);margin-top:var(--space-1)}
.phn.op .pt .ppr{font-size:var(--fs-caption);font-weight:800;letter-spacing:.05em;padding:var(--space-1) var(--space-2);border-radius:var(--radius-box-icon);text-transform:uppercase}
.phn.op .pt .ppr.lw{background:#eef2f9;color:var(--sol-muted)}
.phn.op .pt .ppr.hi{background:#fee2e2;color:#b03030}
.phn.op .pt .ppr.md{background:rgba(var(--primary-rgb),.1);color:var(--primary-color)}

/* IoT Band */
.iot{background:#fff;color:var(--text-color);position:relative;overflow:hidden}
.iot:before{content:"";position:absolute;inset:0;background:transparent}
.iot-g{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-16);align-items:center;position:relative;z-index:2}
.iot h2{margin:var(--space-5) 0 var(--space-4)}

.iot p.il{color:var(--muted);font-size:var(--fs-body);line-height:var(--line-height-body);margin-bottom:var(--space-6)}
.iot ul{list-style:none;display:flex;flex-direction:column;gap:var(--space-3)}
.iot ul li{font-size:var(--fs-small);color:var(--text-color);display:flex;gap:var(--space-3);align-items:flex-start}
.iot ul li:before{content:"";width:18px;height:18px;border-radius:50%;flex:0 0 auto;margin-top:var(--space-1);background:rgba(var(--primary-rgb),.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 10l2.5 2.5L14 7' stroke='%232E6BE6' stroke-width='2' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center no-repeat}
.vnd-g{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3)}
.vnd{background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-sm);padding:var(--space-5) var(--space-4);text-align:center;transition:.25s;font-weight:700;font-size:var(--fs-small);color:var(--text-color)}
.vnd:hover{border-color:rgba(var(--primary-rgb),.4);background:rgba(var(--primary-rgb),.05);transform:translateY(-2px)}
.vnd .vi{width:32px;height:32px;border-radius:var(--radius-box-icon);background:rgba(var(--primary-rgb),.12);display:flex;align-items:center;justify-content:center;margin:0 auto var(--space-2)}
.vnd .vi svg{width:16px;height:16px;stroke:var(--primary-color);fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:880px){.iot-g{grid-template-columns:1fr;gap:var(--space-10)}}

/* Operator Story */
.sty{background:#fff}
.sc{max-width:980px;margin:0 auto;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:0;display:grid;grid-template-columns:300px 1fr;align-items:stretch;position:relative;overflow:hidden;box-shadow:var(--shadow-sm)}
.sc .cs-img{width:100%;height:100%;min-height:380px;object-fit:cover;object-position:center;display:block}
.sc .cs-body{padding:var(--space-10) var(--space-10) var(--space-10);display:flex;flex-direction:column;justify-content:center}
.sc .cs-quote{font-family:var(--font-family-base);font-size:21px;font-weight:700;color:var(--text-color);line-height:1.42;letter-spacing:-.01em;margin-bottom:var(--space-6)}
.sc .cs-by{display:flex;flex-direction:column;margin-bottom:var(--space-6)}
.sc .cs-by b{font-size:var(--fs-body);font-weight:800;color:var(--text-color)}
.sc .cs-by span{font-size:var(--fs-small);color:var(--muted);margin-top:var(--space-1)}
.sc .cs-chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-6)}
.sc .cs-chips span{font-size:var(--fs-caption);font-weight:700;color:var(--primary-color-dark);background:rgba(var(--primary-rgb),.08);border:1px solid rgba(var(--primary-rgb),.18);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md)}
.sc .cs-link{color:var(--primary-color);font-weight:800;font-size:var(--fs-small);align-self:flex-start;display:inline-flex;gap:var(--space-2);transition:gap .2s}
.sc .cs-link:hover{gap:var(--space-3)}
@media(max-width:720px){.sc{grid-template-columns:1fr}.sc .cs-img{min-height:240px}.sc .cs-body{padding:var(--space-8) var(--space-6)}}
@media(max-width:680px){.sc{grid-template-columns:1fr;padding:var(--space-10) var(--space-8);text-align:center}.sc .pm{margin:0 auto}.sc .pst{justify-content:center}}


/* Pricing Teaser */
.pt-s{background:var(--background-color)}
.pt-c{max-width:920px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--space-6);padding:var(--space-8) var(--space-10);background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-md);flex-wrap:wrap}
.pt-l{flex:1;min-width:240px}
.pt-e{font-size:var(--fs-caption);font-weight:800;color:var(--primary-color);letter-spacing:.06em;margin-bottom:var(--space-2)}
.pt-l h3{margin-bottom:var(--space-1)}
.pt-l p{font-size:var(--fs-small);color:var(--muted);line-height:var(--line-height-body)}
.pt-l p b{color:var(--text-color);font-weight:700}


/* Reveal */
.rev{opacity:0;transform:translateY(20px);transition:.7s cubic-bezier(.2,.7,.2,1)}
.rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rev,.hfl,.hmap .dt,.phn.op .pt{animation:none;opacity:1;transform:none;transition:none}}

/* Solution Hero */
.ghero{position:relative;overflow:hidden}
.ghero .gh-in{display:grid;grid-template-columns:1.05fr 1fr;gap:var(--space-12);align-items:center;margin:0 auto}
.ghero h1{margin:var(--space-5) 0 var(--space-5)}
.ghero h1 .hl{color:var(--primary-color)}
.ghero p.sub{font-size:var(--fs-body-lg);color:var(--muted);line-height:var(--line-height-body);margin-bottom:var(--space-8);max-width:545px}
.ghero .gh-cta{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-6)}
.gh-media{position:relative}
.gh-media img{width:100%;display:block}
@media(max-width:920px){.ghero .gh-in{grid-template-columns:1fr;gap:var(--space-8)}.gh-media{order:-1}}

/* Use Cases */
.uc-g{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);margin-top:var(--space-10)}
.uc-card{background:none;border:0;border-radius:0;overflow:visible;transition:.25s}
.uc-card:hover{transform:none;box-shadow:none}
.uc-card .uc-img{height:240px;width:100%;background:var(--surface-blue);border-radius:var(--radius-nav);overflow:hidden;display:block;margin-bottom:var(--space-4)}
.uc-card .uc-img img{width:100%;height:100%;object-fit:cover;display:block}
.uc-card .uc-b{padding:0}
.uc-card .uc-b h3{margin-bottom:var(--space-2);font-size:20px}
.uc-card .uc-b p{font-size:var(--fs-small);color:var(--muted);line-height:var(--line-height-body)}
.uc-card .uc-b p a{color:var(--primary-color)}
@media(max-width:880px){.uc-g{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.uc-g{grid-template-columns:1fr}}

/* Features */

/* Customer Story */
.cstease{background:#fff}
.ct-card{max-width:940px;margin:0 auto;background:var(--background-color);border:1px solid var(--border-color);border-radius:var(--radius-lg);overflow:hidden;display:grid;grid-template-columns:280px 1fr;align-items:stretch;transition:.25s}
.ct-card:hover{box-shadow:var(--shadow);border-color:transparent}
.ct-img{width:100%;height:100%;min-height:248px;object-fit:cover;display:block}
.ct-body{padding:var(--space-8) var(--space-10) var(--space-8);display:flex;flex-direction:column;justify-content:center}
.ct-body .eyebrow{margin-bottom:var(--space-4)}
.ct-body h3{margin-bottom:var(--space-3)}
.ct-body p{font-size:var(--fs-body);color:var(--muted);line-height:var(--line-height-body);margin-bottom:var(--space-5)}
.ct-chips{display:flex;flex-wrap:wrap;gap:var(--space-2);margin-bottom:var(--space-5)}
.ct-chips span{font-size:var(--fs-caption);font-weight:700;color:var(--primary-color-dark);background:rgba(var(--primary-rgb),.08);border:1px solid rgba(var(--primary-rgb),.18);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md)}
.ct-link{color:var(--primary-color);font-weight:800;font-size:var(--fs-small);display:inline-flex;align-items:center;gap:var(--space-2);align-self:flex-start;transition:gap .2s}
.ct-card:hover .ct-link{gap:var(--space-3)}
@media(max-width:760px){.ct-card{grid-template-columns:1fr}.ct-img{min-height:200px}}


/* 601px–1023px */
@media (min-width:601px) and (max-width:1023px){
  .ownit .ownit-box{flex-direction:column;align-items:stretch}
  .ownit .ownit-btn{align-self:flex-start}
}

/* 768px–920px */
@media (min-width:768px) and (max-width:920px){
  .ghero .gh-in{grid-template-columns:1.05fr 1fr;gap:var(--space-8)}
  .gh-media{order:0}
}

/* ≤768px */
@media (max-width:768px){
  .wrap{padding:0 var(--container-pad)}
  .shead{margin-bottom:var(--space-3)}
  .ghero h1{margin-top:var(--space-4);margin-bottom:var(--space-4)}
}

/* ≤600px */
@media (max-width:600px){
  .shead h2{margin-bottom:var(--space-4)}
  .ghero p.sub,
  .shead p{font-size:var(--fs-body)}
  .ghero .gh-cta{margin-bottom:0}
}

/* ≤420px */
@media (max-width:420px){
  .btn{padding:var(--space-3) var(--space-6);font-size:var(--fs-small)}
}

/* Carousel Arrows */
.uc-nav{display:none}
.uc-arrow{width:40px;height:40px;border-radius:50%;border:1px solid var(--border-color);background:#fff;color:var(--color-heading);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s}
.uc-arrow svg{width:18px;height:18px}
.uc-arrow:hover:not(:disabled){border-color:var(--primary-color);color:var(--surface);box-shadow:var(--shadow-1);background:var(--primary-color)}
.uc-arrow:disabled{opacity:.35;cursor:default}

/* 768px–1023px */
@media (min-width:768px) and (max-width:1023px){
  .ucs .uc-g{display:flex;gap:var(--space-6);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding-bottom:var(--space-2)}
  .ucs .uc-g::-webkit-scrollbar{display:none}
  .ucs .uc-card{flex:0 0 calc((100% - var(--space-6))/2);scroll-snap-align:start}
  .ucs .uc-nav{display:flex;justify-content:center;gap:var(--space-3);margin-top:var(--space-8)}
}
