/* =======================================================================
   Laundritek — design system
   Rebuilt 1:1 from "01 Home.ai" / "02 Products.ai" (1366px artboards)
   Palette + type sampled directly from the Illustrator files
   ======================================================================= */

@font-face{
  font-family:"Inter";
  src:url("../fonts/Inter-VariableFont_opsz,wght.ttf") format("truetype-variations");
  font-weight:100 900;
  font-style:normal;
  font-display:block;
}
:root{
  --navy:#18489A;
  --navy-d:#123B80;
  --navy-ink:#0E2E63;
  --orange:#F5911F;
  --orange-d:#E07F0E;
  --bg:#E7EBF0;
  --ink:#4D4D4D;
  --ink-soft:#6B7280;
  --muted:#CCCCCC;
  --white:#fff;
  --radius:16px;
  --shadow:0 10px 30px rgba(16,42,90,.08);
  --shadow-lg:0 18px 50px rgba(16,42,90,.14);
  --wrap:950px;
  --w-body:600;
  --w-head:700;
  --w-ui:400;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; overflow-x:hidden;
  font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  font-size:15px; line-height:1.45; color:var(--ink); font-weight:var(--w-body);
  background:#fff;
  -webkit-font-smoothing:antialiased;
  padding-left:env(safe-area-inset-left); padding-right:env(safe-area-inset-right);
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
}
img{max-width:100%; display:block; border:0}
a{color:inherit; text-decoration:none}
p{margin:0}
h1,h2,h3{margin:0; font-weight:var(--w-head); letter-spacing:-.015em}
ul{margin:0; padding:0; list-style:none}
button{font:inherit}

.wrap{width:100%; max-width:var(--wrap); margin:0 auto; padding:0}
.center{text-align:center}

/* ---------- buttons ---------- */
.btn{
  font-weight:var(--w-ui); display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-size:12px; font-weight:400; line-height:1;
  padding:12px 22px; border-radius:999px; border:1.5px solid transparent;
  white-space:nowrap; cursor:pointer;
  transition:transform .18s ease, background-color .18s ease, color .18s ease, box-shadow .18s ease;
}
.btn:hover{transform:translateY(-1px)}
.btn:active{transform:translateY(0)}

.btn--orange{background:var(--orange); color:#fff; box-shadow:0 6px 16px rgba(245,145,31,.28)}
.btn--orange:hover{background:var(--orange-d)}

.btn--outline{background:transparent; color:#fff; border-color:rgba(255,255,255,.85)}
.btn--outline:hover{background:#fff; color:var(--navy); border-color:#fff}

.btn--ghost-navy{background:#fff; color:var(--navy); border-color:var(--navy)}
.btn--ghost-navy:hover{background:var(--navy); color:#fff}

.btn--navy{background:var(--navy); color:#fff}
.btn--navy:hover{background:var(--navy-d)}

/* ---------- top bar ---------- */
.topbar{background:var(--navy); color:#fff; font-size:9.5px}
.topbar__in{
  display:flex; align-items:center; justify-content:space-between;
  height:30px; gap:16px;
}
.topbar__tag{font-weight:var(--w-ui); font-size:11.5px; letter-spacing:.01em; white-space:nowrap}
.topbar__tag .sep{opacity:.55; margin:0 6px}
.topbar__right{display:flex; align-items:center; gap:10px; font-size:9.5px}
.topbar__link{display:inline-flex; align-items:center; gap:6px; opacity:.95}
.topbar__link:hover{opacity:1; text-decoration:underline; text-underline-offset:3px}
.topbar__link svg{width:13px; height:13px; fill:none; stroke:currentColor}
.topbar__link strong{font-weight:400}
.topbar__div{width:1px; height:12px; background:rgba(255,255,255,.35)}

.social{display:flex; align-items:center; gap:9px}
.social a{display:inline-flex; width:15px; height:15px; opacity:.95}
.social a:hover{opacity:1; transform:translateY(-1px)}
.social svg{width:100%; height:100%; fill:#fff}

/* ---------- header ---------- */
.header{background:#fff; position:relative; z-index:20}
.header__in{display:flex; align-items:center; height:67px; gap:28px}
.brand{display:block; line-height:0; flex:0 0 auto}
.brand img{width:207px; height:auto}

.nav{display:flex; align-items:center; gap:26px; margin-left:auto}
.nav a{
  font-weight:600; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:#4D4D4D;
  padding:6px 0; position:relative; transition:color .16s;
}
.nav a:hover{color:var(--navy)}
.nav a.is-active{color:var(--navy)}
.nav a.is-active::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--navy);
}
.header__cta{margin-left:14px; padding:11px 20px; font-size:12px}

.burger{display:none; width:40px; height:40px; border:0; background:none; padding:8px; cursor:pointer}
.burger span{display:block; height:2px; background:var(--navy); margin:5px 0; border-radius:2px; transition:transform .2s ease, opacity .2s ease}

/* ---------- ticker ---------- */
.ticker{background:#F4F6FA; color:var(--navy); height:32px; overflow:hidden; display:flex; align-items:center; border-top:1px solid #E4E9F0; border-bottom:1px solid #E4E9F0}
.ticker__track{display:flex; width:max-content; animation:tick 34s linear infinite}
.ticker__group{
  display:inline-flex; align-items:center; gap:10px;
  font-size:13.5px; letter-spacing:.02em; white-space:nowrap; padding-right:10px;
}
.ticker__group b{font-weight:700; color:var(--orange)}
.ticker__group em{font-style:normal; font-weight:700; color:var(--navy)}
.ticker__group .tick-loc{color:var(--navy); font-weight:600}
.ticker__group .tick-sep{color:#B9C4D4}
.ticker__group i{width:4px; height:4px; border-radius:50%; background:var(--orange); margin:0 6px}
@keyframes tick{from{transform:translateX(0)}to{transform:translateX(-50%)}}


/* icon accents */
.stat__ico{display:inline-grid; place-items:center; width:46px; height:46px; border-radius:12px; background:#FDF1E3; color:var(--orange); margin:0 auto 10px}
.stat__ico .ico{width:24px; height:24px; stroke-width:1.6}
.stat{text-align:center}
.fact__ico{width:20px; height:20px; stroke:#fff; opacity:.9; margin-bottom:6px}
.fact{display:flex; flex-direction:column; align-items:flex-start; gap:2px}
.ecard__ico{display:inline-grid; place-items:center; width:44px; height:44px; border-radius:12px; background:#FDF1E3; color:var(--orange); margin-bottom:14px}
.ecard__ico .ico{width:24px; height:24px; stroke-width:1.7}


/* ---------- editorial pages (about / franchise) ---------- */
.ehero{background:var(--navy); color:#fff; padding:64px 0 70px; position:relative; overflow:hidden}
.ehero::after{content:""; position:absolute; right:-120px; top:-120px; width:420px; height:420px; border-radius:50%; background:rgba(245,145,31,.12)}
.ehero .eyebrow{color:rgba(255,255,255,.72); margin-bottom:14px}
.ehero h1{font-size:46px; line-height:1.08; letter-spacing:-.025em; font-weight:700; margin-bottom:16px; max-width:760px}
.ehero h1 em{font-style:normal; color:var(--orange)}
.ehero p{font-size:15px; line-height:1.5; max-width:620px; color:rgba(255,255,255,.88)}
.ehero__meta{display:flex; gap:34px; margin-top:30px; flex-wrap:wrap}
.ehero__meta div b{display:block; font-size:26px; font-weight:700; color:#fff; line-height:1.1}
.ehero__meta div span{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.6)}

.esec{padding:64px 0}
.esec--alt{background:#F5F7FA}
.esec h2{font-size:30px; line-height:1.15; letter-spacing:-.02em; font-weight:700; color:var(--navy-ink); margin-bottom:14px}
.esec h2 em{font-style:normal; color:var(--orange)}
.esec .lede{font-size:14.5px; line-height:1.6; color:var(--ink); max-width:720px}
.etext p{font-size:14px; line-height:1.7; color:var(--ink); margin-bottom:14px}
.etext p strong{color:var(--navy-ink); font-weight:700}
.esplit{display:grid; grid-template-columns:1fr 1fr; gap:44px; align-items:center}
.esplit img{border-radius:16px; width:100%; height:100%; object-fit:cover}

.ecards{display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:32px}
.ecards--4{grid-template-columns:repeat(4,1fr)}
.ecard2{background:#fff; border:1px solid #E6EBF2; border-radius:14px; padding:24px 22px}
.ecard2 .ico{width:22px; height:22px; color:var(--orange); margin-bottom:12px}
.ecard2 h3{font-size:14.5px; font-weight:700; color:var(--navy); margin-bottom:6px}
.ecard2 p{font-size:12.5px; line-height:1.5; color:#5A6472}

.tl{position:relative; margin-top:34px; padding-left:26px}
.tl::before{content:""; position:absolute; left:5px; top:6px; bottom:6px; width:2px; background:#E1E8F2}
.tl__row{position:relative; padding:0 0 22px 0}
.tl__row::before{content:""; position:absolute; left:-25px; top:5px; width:10px; height:10px; border-radius:50%; background:var(--orange); box-shadow:0 0 0 3px #fff}
.tl__row b{font-size:12px; letter-spacing:.08em; color:var(--orange); display:block; margin-bottom:2px}
.tl__row span{font-size:13.5px; color:var(--ink); line-height:1.5}

.group{background:var(--navy); color:#fff; border-radius:18px; padding:38px 40px; margin-top:36px}
.group h3{font-size:20px; font-weight:700; margin-bottom:10px}
.group h3 span{color:var(--orange)}
.group p{font-size:13.5px; line-height:1.7; color:rgba(255,255,255,.85); max-width:760px}

/* franchise */
.model{border:1px solid #E6EBF2; border-radius:16px; padding:26px 24px; background:#fff; display:flex; flex-direction:column}
.model--hi{background:var(--navy); border-color:var(--navy); color:#fff}
.model.model--hi h3{color:#fff}
.model--hi .model__k{color:var(--orange)}
.model.model--hi p{color:#fff}
.model.model--hi li{color:#fff}
.model__k{font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--orange); font-weight:700; margin-bottom:8px}
.model h3{font-size:19px; font-weight:700; color:var(--navy-ink); margin-bottom:8px}
.model p{font-size:12.5px; line-height:1.55; color:#5A6472; margin-bottom:14px}
.model ul{list-style:none; padding:0; margin:0 0 16px}
.model li{font-size:12px; padding:6px 0 6px 22px; position:relative; color:inherit}
.model li::before{content:""; position:absolute; left:0; top:11px; width:8px; height:8px; border-radius:50%; background:var(--orange)}
.model .btn{align-self:flex-start; margin-top:auto}

.steps{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:30px}
.step{background:#fff; border:1px solid #E6EBF2; border-radius:14px; padding:20px 16px}
.step b{display:block; font-size:11px; color:var(--orange); letter-spacing:.1em; margin-bottom:8px}
.step h4{font-size:13px; font-weight:700; color:var(--navy); margin-bottom:4px}
.step p{font-size:11.5px; line-height:1.45; color:#5A6472}

.faq{margin-top:26px; border-top:1px solid #E1E8F2}
.faq details{border-bottom:1px solid #E1E8F2; padding:16px 0}
.faq summary{font-size:14px; font-weight:700; color:var(--navy-ink); cursor:pointer; list-style:none; display:flex; justify-content:space-between; gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+"; color:var(--orange); font-weight:700}
.faq details[open] summary::after{content:"–"}
.faq p{font-size:13px; line-height:1.6; color:var(--ink); margin-top:10px; max-width:760px}

.form2{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:24px; max-width:760px}
.form2 .full{grid-column:span 2}
.form2 label{display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; font-weight:600; color:#7C8798; margin-bottom:6px}
.form2 input,.form2 select,.form2 textarea{
  width:100%; padding:12px 14px; border:1px solid #DCE3ED; border-radius:10px; font:inherit;
  font-size:13.5px; color:var(--ink); background:#fff;
}
.form2 input:focus,.form2 select:focus,.form2 textarea:focus{outline:2px solid rgba(245,145,31,.35); border-color:var(--orange)}
.form2 .btn{justify-self:start}
.formnote{font-size:11.5px; color:#7C8798; margin-top:12px; text-align:left}

@media screen and (max-width:1000px){
  .ecards,.ecards--4{grid-template-columns:1fr 1fr}
  .esplit{grid-template-columns:1fr; gap:28px}
  .steps{grid-template-columns:1fr 1fr}
  .ehero h1{font-size:34px}
}
@media screen and (max-width:640px){
  .ecards,.ecards--4,.steps{grid-template-columns:1fr}
  .form2{grid-template-columns:1fr}
  .form2 .full{grid-column:auto}
  .ehero h1{font-size:28px}
  .esec{padding:44px 0}
}


/* ---------- packages ---------- */
.pkghead{display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:34px; align-items:center; margin-bottom:22px; min-width:0}
.pkghead__k{font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--orange); font-weight:700; margin-bottom:6px}
.pkghead h2{font-size:32px; line-height:1.1; letter-spacing:-.02em; font-weight:700; color:var(--navy-ink); margin-bottom:10px}
.pkghead img{width:100%; max-width:100%; min-width:0; height:auto; align-self:center}
.pkgstats{display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin:20px 0 26px}
.pkgstats div{background:#F5F7FA; border:1px solid #E6EBF2; border-radius:12px; padding:14px 16px}
.pkgstats b{display:block; font-size:20px; line-height:1.1; color:var(--navy); font-weight:700}
.pkgstats span{font-size:10.5px; letter-spacing:.02em; color:#5A6472}

.pkgtable{width:100%; border-collapse:collapse; font-size:12.5px}
.pkgtable th{text-align:left; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:#8794A6; font-weight:700; padding:9px 12px; border-bottom:2px solid #E1E8F2; white-space:nowrap}
.pkgtable td{padding:12px; border-bottom:1px solid #EDF0F4; color:var(--ink); vertical-align:middle}
.pkgtable td:first-child{font-weight:700; color:var(--navy-ink)}
.pkgtable td:nth-child(2){font-weight:700; color:var(--orange); white-space:nowrap}

.pkgnote{display:flex; gap:12px; margin-top:20px; background:#F5F7FA; border-left:3px solid var(--orange); border-radius:0 12px 12px 0; padding:16px 18px}
.pkgnote .ico{width:20px; height:20px; color:var(--orange); flex:0 0 auto; margin-top:2px}
.pkgnote p{font-size:13px; line-height:1.6; color:var(--ink)}
.pkgsub{font-size:16px; font-weight:700; color:var(--navy-ink); margin:30px 0 4px}

/* ---------- legal / vacancy ---------- */
.legal{max-width:800px}
.legal h2{font-size:21px; font-weight:700; color:var(--navy-ink); margin:34px 0 10px}
.legal h2:first-child{margin-top:0}
.legal h3{font-size:14.5px; font-weight:700; color:var(--navy); margin:20px 0 6px}
.legal p,.legal li{font-size:13.5px; line-height:1.7; color:var(--ink)}
.legal p{margin-bottom:12px}
.legal ul{list-style:disc outside; margin:0 0 14px 22px; padding:0}
.legal li{margin-bottom:7px; padding-left:2px}
.legal li::marker{color:var(--orange)}
.legal a{color:var(--navy); font-weight:600; text-decoration:underline; text-decoration-color:rgba(24,72,154,.3)}
.legal a:hover{color:var(--orange)}
.legal .meta{font-size:11.5px; color:#8794A6; margin-bottom:26px}

.vacancy{display:grid; grid-template-columns:1.4fr 1fr; gap:40px; align-items:start}
.vacancy__side{background:#F5F7FA; border:1px solid #E6EBF2; border-radius:14px; padding:24px}
.vacancy__side h3{font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:#8794A6; margin-bottom:12px}
.vacancy__side dl{margin:0}
.vacancy__side dt{font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:#8794A6; margin-top:14px}
.vacancy__side dd{margin:2px 0 0; font-size:13.5px; font-weight:600; color:var(--navy-ink)}
.vacancy__side .btn{width:100%; justify-content:center; margin-top:20px}

@media screen and (max-width:1000px){
  .pkghead{grid-template-columns:minmax(0,1fr); gap:20px}
  .pkgstats{grid-template-columns:repeat(2,1fr)}
  .vacancy{grid-template-columns:1fr; gap:26px}
}
@media screen and (max-width:640px){
  /* spec table becomes stacked rows instead of sideways scrolling */
  .pkgtable{display:block; white-space:normal}
  .pkgtable thead{display:none}
  .pkgtable tbody{display:block}
  .pkgtable tr{display:block; background:#fff; border:1px solid #E6EBF2; border-radius:12px; padding:14px 16px; margin-bottom:12px}
  .pkgtable td{display:flex; justify-content:space-between; align-items:baseline; gap:14px; padding:4px 0; border:0; font-size:12.5px; white-space:normal; text-align:right}
  .pkgtable td::before{content:attr(data-l); color:#8794A6; font-size:10px; letter-spacing:.08em; text-transform:uppercase; flex:0 0 auto; text-align:left}
  .pkgtable td:first-child{display:block; font-size:14px; padding:0 0 8px; margin-bottom:6px; border-bottom:1px solid #EEF1F5; text-align:left}
  .pkgtable td:first-child::before{content:""}
  .pkgtable td:nth-child(2){color:var(--orange)}
  .pkgstats{grid-template-columns:1fr 1fr}
  .pkgstats div{padding:12px 12px}
  .pkgstats b{font-size:17px}
}

/* ---------- social links on the artwork slides ---------- */
.hs__social{
  position:absolute; z-index:5; top:24px; right:max(24px,calc((100% - 950px)/2));
  display:flex; align-items:center; gap:8px; padding:7px 10px 7px 14px; border-radius:999px;
  background:rgba(10,30,64,.45); color:#fff;
}
.hs__social span{font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; font-weight:600; opacity:.9; margin-right:2px}
.hs__social a{width:30px; height:30px; border-radius:50%; display:grid; place-items:center; background:rgba(255,255,255,.16); transition:background .2s, transform .2s}
.hs__social a:hover{background:var(--orange); transform:translateY(-1px)}
.hs__social svg{width:15px; height:15px; fill:currentColor; display:block}

/* ---------- inline icons ---------- */
.ico{width:16px; height:16px; flex:0 0 auto; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.ico--sm{width:13px; height:13px}
.ico--orange{color:var(--orange)}
.chips li{display:inline-flex; align-items:center; gap:6px}
.chips .ico{color:var(--navy)}

@media (prefers-reduced-motion:reduce){.ticker__track{animation:none}}

/* ---------- hero slider ---------- */
.hs{position:relative; height:640px; overflow:hidden; background:#fff}
.hs__track{position:absolute; inset:0}
.hs__slide{
  position:absolute; inset:0; display:none; flex-direction:column;
}
.hs__slide.is-active{display:flex; z-index:2}
@keyframes hs-fade{from{opacity:.001}to{opacity:1}}

.hs__slide--pkg{background:#fff}
.hs__top{
  position:relative; height:390px; flex:0 0 auto; isolation:isolate;
  padding:22px max(24px, calc((100% - 950px)/2)) 0;
  display:flex; flex-direction:column; align-items:center;
}
.hs__top .eyebrow{align-self:flex-start; margin-bottom:0; position:relative; z-index:4}

.eyebrow{
  font-weight:500; font-size:14px; line-height:1.2; color:var(--ink); margin:0 0 8px; font-weight:400;
}
.eyebrow--plain{color:var(--ink)}

.hs__lockup{display:flex; justify-content:flex-start; margin-top:-6px; margin-left:-10px; width:100%; min-width:0; position:relative; z-index:1}
.hs__lockup img{width:602px; max-width:100%; height:auto}

.hs__machines{
  --rowW:min(953px, calc(100vw - 48px));
  display:flex; align-items:flex-end; justify-content:center;
  gap:0; margin-bottom:-4px; position:relative; z-index:3;
  width:var(--rowW); margin-inline:auto;
}
.hs__machines--pro{margin-top:-68px}
.hs__machines--semi{margin-top:auto}
.hs__machines img{
  height:calc(var(--rowW) * 0.19098); width:auto; max-width:none; flex:0 0 auto;
}
.hs__machines img.is-tall{height:calc(var(--rowW) * 0.21406)}
.hs__machines img.is-stack{height:calc(var(--rowW) * 0.28436)}
.hs__machines--semi img{height:141px}

.hs__band{
  flex:0 0 auto; height:250px; background:var(--navy); color:#fff;
  padding-top:6px; overflow:hidden;
}
.pills--hero{
  display:grid; grid-template-columns:586fr 141fr 218fr; gap:0;
  border:1px solid rgba(255,255,255,.22); border-top:0;
  padding:4px 0 8px; margin-bottom:10px;
}
.pills--two{grid-template-columns:repeat(2,1fr)}
.pill{display:flex; align-items:center; justify-content:center; gap:12px; position:relative}
.pill + .pill::before{
  content:""; position:absolute; left:0; top:-4px; bottom:-4px; width:1px;
  background:rgba(255,255,255,.22);
}
.pill__meta{font-size:12.5px; line-height:1.25; text-align:right; color:#fff; max-width:92px}
.pill__meta b{font-weight:700; display:block}
.pill__x{
  font-size:40px; font-style:italic; color:var(--orange); line-height:1;
  font-weight:800; letter-spacing:-.02em;
}
.hs__row{display:flex; align-items:flex-start; justify-content:space-between; gap:40px; padding-top:10px}
.hs__copy h1{
  font-size:32px; font-weight:var(--w-head); letter-spacing:-.015em; line-height:1.15; margin-bottom:12px;
}
.hs__copy h1 em{font-style:normal; color:var(--orange)}
.hs__copy p{font-size:15px; line-height:1.4; max-width:640px; color:#fff}
.hs__btns{display:flex; gap:10px; flex:0 0 auto; padding-top:4px}
.hs__btns .btn{padding:11px 18px}

/* artwork slides */
.hs__slide--art{background:#0D3D8F}
.hs__slide--art picture{display:contents}
.hs__slide--art.hs__slide--promo{background:#18489A}
.hs__art{width:100%; height:100%; object-fit:cover; object-position:center; display:block}
.hs__hotspot{position:absolute; border-radius:999px; text-indent:-9999px; overflow:hidden}
.hs__slide--art:nth-of-type(3) .hs__hotspot{left:60.6%; top:76.2%; width:24.4%; height:9%}
.hs__slide--art:nth-of-type(4) .hs__hotspot{left:17.4%; top:82.4%; width:65.4%; height:8.4%}

/* slider controls */
.hs__nav{
  position:absolute; top:50%; transform:translateY(-50%); z-index:6;
  width:44px; height:44px; border-radius:50%; border:0; padding:0;
  background:rgba(255,255,255,.92); color:var(--navy); cursor:pointer;
  display:grid; place-items:center; box-shadow:0 6px 18px rgba(0,0,0,.18);
  opacity:0; transition:opacity .25s ease, background-color .2s;
}
.hs:hover .hs__nav,.hs:focus-within .hs__nav{opacity:1}
.hs__nav:hover{background:#fff}
.hs__nav--prev{left:18px}
.hs__nav--next{right:18px}
.hs__nav svg{width:20px; height:20px}

.hs__dots{
  position:absolute; left:50%; bottom:16px; transform:translateX(-50%);
  display:flex; gap:8px; z-index:6;
}
.hs__dots button{
  width:9px; height:9px; padding:0; border:0; border-radius:999px; cursor:pointer;
  background:rgba(255,255,255,.5); transition:width .25s ease, background-color .25s ease;
  position:relative;
}
/* comfortable touch target without changing the dot's look */
.hs__dots button::after{content:""; position:absolute; inset:-13px -8px}
.link-pdf{position:relative}
.link-pdf::after{content:""; position:absolute; inset:-8px -6px}
.hs__dots button.is-active{width:26px; background:#fff}
@media (hover:none){
  .hs__nav{opacity:1; width:38px; height:38px}
  .hs__nav--prev{left:10px}
  .hs__nav--next{right:10px}
}

/* ---------- stats ---------- */
.stats{background:var(--bg); padding:16px 0 0}
.stats__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.stat{
  background:#fff; border-radius:18px; box-shadow:var(--shadow);
  padding:22px 18px 20px; text-align:center;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  min-height:181px;
}
.stat__n{font-size:50px; line-height:1; color:var(--orange); letter-spacing:-.02em; margin-bottom:10px}
.stat__l{font-weight:var(--w-body); font-size:15px; line-height:1.2; color:var(--ink)}

/* ---------- generic section ---------- */
.section{background:var(--bg); padding:18px 0 28px}
.section--tight{padding:22px 0}
.sec-head{display:flex; align-items:flex-start; justify-content:space-between; gap:24px; margin-bottom:22px}
.h2{font-size:32px; line-height:1.15; letter-spacing:-.015em}
.h2--navy{color:var(--navy)}
.lede{font-size:15px; color:var(--ink); margin-top:12px}

/* ---------- product grid (home) ---------- */
.prodgrid{display:grid; grid-template-columns:repeat(3,1fr); gap:30px}
.pcard{display:flex; flex-direction:column}
.pcard__img{height:301px; display:flex; align-items:flex-end; justify-content:center; margin-bottom:12px}
.pcard__img img{width:auto; max-width:none; mix-blend-mode:multiply}
.pcard:nth-child(1) .pcard__img img{height:229px}
.pcard:nth-child(2) .pcard__img img{height:201px}
.pcard:nth-child(3) .pcard__img img{height:301px}
.pcard h3{font-size:15px; font-weight:var(--w-body); color:var(--ink); margin-bottom:8px}
.pcard p{font-size:12px; line-height:1.35; color:var(--ink); min-height:36px}
.chips{display:flex; flex-wrap:wrap; gap:6px; margin:12px 0 12px}
.chips li{
  font-weight:var(--w-ui); background:var(--navy); color:#fff; font-size:12px; line-height:1;
  padding:6px 12px; border-radius:999px;
}
.link-arrow{
  font-weight:var(--w-ui); font-size:12px; color:var(--ink); display:inline-flex; align-items:center; gap:6px;
  margin-top:auto; padding-top:6px;
}
.link-arrow:hover{color:var(--navy)}
.link-arrow span{font-size:16px; line-height:1}

.cardlinks{display:flex; align-items:center; gap:10px; margin-top:auto}
.cardlinks .link-arrow,.cardlinks .link-navy{margin-top:0}
.link-pdf{
  font-size:9.5px; letter-spacing:.08em; font-weight:700; text-transform:uppercase;
  color:var(--navy); border:1px solid #C9D2DE; border-radius:999px;
  padding:5px 10px; line-height:1; transition:.16s;
}
.link-pdf:hover{background:var(--navy); color:#fff; border-color:var(--navy)}

/* ---------- quote / packages ---------- */
.quote{
  font-size:28px; font-style:italic; color:var(--ink); margin-top:10px;
  letter-spacing:-.01em;
}
.rule{border:0; border-top:1px solid rgba(24,72,154,.18); margin:26px 0 0}

/* ---------- about ---------- */
.about{display:grid; grid-template-columns:430px 487px; gap:33px; align-items:start; padding-top:24px}
.about__copy h2{margin-bottom:24px}
.about__copy h2.h2{font-size:26px; line-height:1.2}
.about__copy p{font-size:15px; line-height:1.22; margin-bottom:18px; max-width:430px}
.about__img img{width:100%; height:auto; border-radius:14px; object-fit:cover; object-position:50% 45%; aspect-ratio:487/390}

/* ---------- CTA band ---------- */
.cta{
  background:var(--navy); color:#fff; border-radius:22px;
  padding:30px 40px; display:flex; align-items:center; justify-content:space-between; gap:30px;
  box-shadow:0 14px 34px rgba(16,42,90,.16);
}
.cta__h{font-size:32px; font-weight:var(--w-head); letter-spacing:-.015em; margin-bottom:10px}
.cta__p{font-size:15px; line-height:1.35; color:rgba(255,255,255,.95)}
.cta__in{display:flex; align-items:center; justify-content:space-between; gap:30px; width:100%}
.cta h2{font-size:32px; font-weight:700; letter-spacing:-.015em; color:#fff; margin-bottom:10px}
.cta p{font-size:15px; line-height:1.4; color:rgba(255,255,255,.95)}
.cta__btns{display:flex; gap:10px; flex:0 0 auto}
.cta__btns .btn{padding:11px 18px}

/* ---------- footer ---------- */
.footer{background:var(--navy); color:var(--muted); padding:26px 0 0}
.footer__top{display:grid; grid-template-columns:330px 1fr; gap:17px; padding-bottom:20px}
.footer__brand img{width:167px; height:auto; margin-bottom:16px}
.footer__blurb{font-weight:var(--w-ui); font-size:10px; line-height:1.45; color:var(--muted); max-width:300px}
.social--footer{margin-top:14px; gap:11px}
.social--footer a{width:14px; height:14px}

.footer__cols{display:grid; grid-template-columns:135px 136px 135px 1fr; gap:0}
.fcol{display:flex; flex-direction:column; gap:6px}
.fcol__h{
  font-size:10px; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; margin-bottom:12px; font-weight:400;
}
.fcol a{font-weight:var(--w-ui); font-size:10px; line-height:1.45; color:var(--muted); transition:color .15s}
.fcol a:hover{color:#fff}
.fcol a span{color:var(--muted)}

.footer__bar{
  font-weight:var(--w-ui); border-top:1px solid rgba(255,255,255,.14);
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:14px 0 18px; font-size:10px; color:var(--muted);
}

/* =======================================================================
   PRODUCTS PAGE
   ======================================================================= */
.phero{background:#fff; padding:24px 0 0; position:relative; overflow:hidden}
.phero__eyebrow{font-size:14px; line-height:1.2; margin-bottom:0; position:relative; z-index:3}
.phero__lineup{position:relative; width:965px; max-width:100%; margin:-26px auto 0}
.phero__lineup img{width:100%; height:auto}

.phero__body{
  display:grid; grid-template-columns:355px 1fr; gap:14px; align-items:start;
  margin-top:0; position:relative; z-index:2; padding-bottom:24px;
}
.phero__h{font-size:32px; line-height:1.15; color:var(--navy); letter-spacing:-.015em}
.phero__copy p{font-size:15px; line-height:1.28; color:var(--ink); margin:12px 0 16px; max-width:340px}
.phero__actions{display:flex; gap:10px; align-items:center}
.btn--pill-outline{background:#fff; color:var(--ink); border-color:#C9D2DE}
.btn--pill-outline:hover{border-color:var(--navy); color:var(--navy)}

.phero__facts{display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding-top:6px}
.fact{
  background:var(--navy); color:#fff; border-radius:12px; padding:14px 12px 14px 16px;
  display:flex; align-items:center; justify-content:space-between; gap:8px;
  font-size:15px; line-height:1.15; min-height:96px;
}
.fact svg{width:14px; height:14px; flex:0 0 auto; stroke:#fff; fill:none; opacity:.9}

/* orange tab bar */
.tabbar{background:var(--orange); padding:22px 0}
.tabbar__in{display:flex; gap:8px; justify-content:space-between}
.tab{
  font-weight:var(--w-ui); background:#fff; color:var(--ink); font-size:12px; line-height:1;
  padding:12px 20px; border-radius:999px; white-space:nowrap;
  transition:.16s;
}
.tab:hover,.tab.is-active{background:var(--navy); color:#fff}

/* category blocks */
.catblock{background:#fff; padding:60px 0}
.catblock:nth-of-type(even){background:linear-gradient(#fff, #EFEFEF)}
.cathead{
  background:var(--navy); color:#fff; border-radius:10px;
  padding:16px 22px; margin-bottom:24px;
}
.cathead h2{font-size:18px; font-weight:var(--w-head)}
.cathead p{font-size:12px; opacity:.92; margin-top:3px}

.cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px}
.gcard{
  background:linear-gradient(#FDFDFD, #F0F0F0);
  border:1px solid #E4E7EB; border-radius:16px;
  padding:20px 20px 18px; display:flex; flex-direction:column;
  box-shadow:0 6px 18px rgba(16,42,90,.05);
}
.gcard__img{
  height:290px; display:flex; align-items:center; justify-content:center;
  background:#fff; border-radius:10px; margin-bottom:16px; padding:10px;
  border:1px solid #EDEFF2;
}
.gcard__img img{max-height:100%; width:auto; mix-blend-mode:multiply}
.gcard h3{font-size:15px; font-weight:var(--w-body); color:var(--navy); margin-bottom:7px}
.gcard p{font-size:11px; line-height:1.35; color:var(--ink); min-height:46px}
.gcard .chips{margin:12px 0 10px}
.gcard .chips li{font-size:11.5px; padding:6px 10px}
.gcard .chips{gap:5px}
.link-navy{font-weight:var(--w-ui); font-size:11px; color:var(--navy); font-weight:500; margin-top:auto}
.link-navy:hover{text-decoration:underline; text-underline-offset:3px}

/* special block */
.special{display:grid; grid-template-columns:200px 1fr; gap:20px; align-items:start}
.special--pair{grid-template-columns:1fr 1fr; gap:26px; align-items:stretch}
.special__card{
  display:flex; flex-direction:column; background:#F5F7FA; border:1px solid #E6EBF2;
  border-radius:14px; padding:20px 20px 18px; text-align:left;
}
.special__card .special__img{height:250px; margin-bottom:16px}
.special__card .special__img img{width:auto; max-width:100%; max-height:100%; height:auto; object-fit:contain}
.special__card h3{font-size:16px; font-weight:700; color:var(--navy); margin-bottom:6px}
.special__card p{font-size:12px; line-height:1.45; margin-bottom:10px}
.special__card .chips{margin-bottom:auto}
.special__card .cardlinks{margin-top:14px}
.special__img{display:flex; align-items:center; justify-content:center}
.special__img img{width:100%; height:auto; mix-blend-mode:multiply}
.special__item + .special__item{margin-top:40px}
.special__item h3{font-size:15px; font-weight:var(--w-body); color:var(--navy); margin-bottom:6px}
.special__item p{font-size:11px; line-height:1.35; color:var(--ink); margin-bottom:10px; max-width:260px}
.special__item .link-navy{display:inline-block; margin-top:4px}

/* engineered (navy) */
.eng{background:var(--navy); padding:64px 0 70px}
.eng h2{color:#fff; text-align:center; font-size:32px; letter-spacing:-.015em; margin-bottom:34px}
.eng h2 span{color:var(--orange)}
.eng__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.ecard{
  background:#F3F5F8; border-radius:14px; padding:26px 26px 28px; text-align:center;
  min-height:258px; display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.ecard h3{font-size:20px; line-height:1.2; color:var(--navy); font-weight:var(--w-head); margin-bottom:14px}
.ecard p{font-size:11px; line-height:1.4; color:var(--ink); max-width:230px}

/* beyond (white) */
.beyond{background:#fff; padding:64px 0 72px}
.beyond h2{text-align:center; font-size:32px; color:var(--navy); letter-spacing:-.015em; margin-bottom:34px}
.beyond h2 span{color:var(--orange)}
.beyond__grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.bcard{
  background:var(--navy); color:#fff; border-radius:14px; padding:26px 24px;
  text-align:center; min-height:170px;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
}
.bcard h3{font-size:20px; line-height:1.2; font-weight:var(--w-head); margin-bottom:14px}
.bcard p{font-size:11px; line-height:1.4; color:rgba(255,255,255,.92); max-width:250px}

/* enquiry */
.enq{background:linear-gradient(#EEF0F3, #F7F8FA); padding:72px 0 78px}
.enq__in{display:grid; grid-template-columns:1fr 475px; gap:56px; align-items:start}
.enq h2{font-size:32px; line-height:1.18; color:var(--navy); letter-spacing:-.015em; margin-bottom:20px}
.enq__lede{font-size:11px; line-height:1.45; color:var(--ink); max-width:420px; margin-bottom:26px}
.enq__points{display:flex; flex-direction:column; gap:18px}
.enq__point h3{font-size:15px; font-weight:400; color:var(--navy); margin-bottom:3px}
.enq__point p{font-size:11px; color:var(--ink)}

.formcard{background:#fff; border-radius:16px; padding:22px; box-shadow:var(--shadow-lg)}
.formrow{display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:10px}
.field{display:flex; flex-direction:column; gap:4px}
.field label{font-size:9.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink)}
.field input,.field select,.field textarea{
  font:inherit; font-size:11px; color:var(--ink);
  border:1px solid #DDE2E8; border-radius:6px; padding:9px 10px; background:#fff;
  width:100%;
}
.field textarea{min-height:74px; resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{
  outline:none; border-color:var(--navy); box-shadow:0 0 0 3px rgba(24,72,154,.12);
}
.field--full{grid-column:1 / -1}
.formcard .btn--orange{width:100%; margin-top:4px; padding:13px; font-size:12px}
.formnote{font-size:10px; color:var(--ink-soft); text-align:center; margin-top:10px}

/* ---------- reveal ---------- */
.reveal{opacity:1; transform:none}

/* =======================================================================
   RESPONSIVE
   ======================================================================= */
@media (max-width:1180px){
  .wrap{max-width:100%; padding:0 24px}
}
/* below this the fixed-height slides become fluid */
@media (max-width:1000px){
  .hs{height:auto; min-height:0}
  .hs__track{position:relative; inset:auto}
  .hs__slide{position:relative; inset:auto; display:none; min-height:0; justify-content:space-between}
  .hs__slide.is-active{display:flex}
  .hs__slide--pkg.is-active{min-height:0}
  .hs__top{height:auto; padding:18px 20px 0; gap:6px}
  .hs__machines--pro{margin-top:8px}
  .hs__machines--semi{margin-top:14px}
  .hs__band{height:auto; padding:6px 0 24px}
  /* artwork slides: keep image in flow so the carousel does not collapse to 0 height */
  .hs__slide--art.is-active{display:block; min-height:0}
  .hs__slide--art picture{display:block; line-height:0}
  .hs__slide--art .hs__art{
    position:relative; inset:auto;
    width:100%; height:auto; max-height:none;
    object-fit:contain; object-position:center top;
  }
  .hs__hotspot{display:none}
  .hs__social{top:14px; right:16px; padding:5px 8px 5px 11px}
  .hs__social span{display:none}
  .hs__btns{flex-wrap:wrap; width:100%}
  .hs__btns .btn{flex:1 1 auto; justify-content:center}
  .phero__actions{flex-wrap:wrap}
}
@media (max-width:1000px){
  .phero__body{grid-template-columns:1fr; margin-top:14px}
  .phero__lineup{margin-top:-12px}
  .phero__copy p{max-width:none}
  .phero__facts{padding-top:20px}
  .about{grid-template-columns:1fr; gap:32px}
  .about__img img{aspect-ratio:auto; max-height:420px}
  .enq__in{grid-template-columns:1fr; gap:36px}
  .footer__top{grid-template-columns:1fr; gap:30px}
}
@media (max-width:860px){
  .header{position:sticky; top:0; z-index:50; box-shadow:0 1px 0 rgba(16,42,90,.06)}
  .nav{
    position:absolute; top:100%; left:0; right:0; z-index:40;
    background:#fff; flex-direction:column; align-items:flex-start; gap:0;
    padding:8px 24px 18px; box-shadow:0 18px 30px rgba(16,42,90,.12);
    display:none; max-height:min(70vh, 420px); overflow-y:auto;
  }
  .nav.is-open{display:flex}
  .nav a{width:100%; padding:14px 0; font-size:12px; border-bottom:1px solid #EEF1F5}
  .nav a.is-active::after{display:none}
  .header__cta{display:none}
  .burger{display:block; margin-left:auto}
  .burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .burger[aria-expanded="true"] span:nth-child(2){opacity:0}
  .burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .topbar__tag{display:none}
  .topbar__in{justify-content:flex-end}
  .stats__grid{grid-template-columns:repeat(2,1fr)}
  .prodgrid,.cards3,.eng__grid,.beyond__grid{grid-template-columns:1fr 1fr}
  .special,.special--pair{grid-template-columns:1fr; gap:24px}
  .hs__row{flex-direction:column; gap:18px; padding-top:12px}
  .sec-head{flex-direction:column; align-items:flex-start}
  .cta{flex-direction:column; align-items:flex-start; padding:28px}
  .footer__cols{grid-template-columns:1fr 1fr; gap:26px}
  .tabbar__in{overflow-x:auto; justify-content:flex-start; padding-bottom:4px; -webkit-overflow-scrolling:touch}
  .tabbar__in::-webkit-scrollbar{display:none}
  .gcard__img{height:220px}
}
@media (max-width:700px){
  .wrap{padding:0 16px}
  .brand img{width:148px}
  .header__in{height:56px; gap:12px}
  .hs__top{padding:14px 16px 0}
  .hs__lockup{margin-left:0}
  .hs__copy h1,.h2,.cta__h,.phero__h,.eng h2,.beyond h2,.enq h2{font-size:26px}
  .hs__copy p{font-size:14px}
  .hs__nav{width:36px; height:36px}
  .hs__dots{bottom:10px}
  .hs__machines{--rowW:min(953px, calc(100vw - 32px))}
  .hs__machines--semi img{height:96px}
  .pills--hero{
    grid-template-columns:1fr; gap:0; padding:6px 0 4px;
    border:0; border-top:1px solid rgba(255,255,255,.18);
  }
  /* topbar: keep socials + a short "Let's talk", drop the long email */
  .topbar__in{height:32px; gap:10px; padding:0 14px}
  .topbar__link{font-size:0}
  .topbar__link strong{font-size:10.5px; letter-spacing:.04em}
  .topbar__link[href^="mailto:"]{display:none}
  .topbar__div{display:none}
  .stats__grid{grid-template-columns:1fr 1fr; gap:14px}
  .stat{min-height:0; padding:18px 12px}
  .stat__n{font-size:34px}
  .stat__ico{width:40px; height:40px; margin-bottom:8px}
  .pcard__img{height:200px}
  .pcard:nth-child(1) .pcard__img img{height:150px}
  .pcard:nth-child(2) .pcard__img img{height:132px}
  .pcard:nth-child(3) .pcard__img img{height:200px}
  .cta{padding:24px 20px}
  .cta__in{flex-direction:column; align-items:flex-start; gap:18px}
  .cta h2{font-size:24px}
  .cta__btns{width:100%; flex-wrap:wrap}
  .cta__btns .btn{flex:1 1 auto; justify-content:center}
  .pill{padding:9px 2px; border-bottom:1px solid rgba(255,255,255,.14)}
  .pill + .pill::before{display:none}
  .pill{justify-content:space-between}
  .pill__meta{text-align:left; max-width:none; font-size:12px; line-height:1.3}
  .pill__meta b{display:inline; margin-right:4px}
  .pill__x{font-size:30px}
  .stat__n{font-size:38px}
  .prodgrid,.cards3,.eng__grid,.beyond__grid{grid-template-columns:1fr}
  .quote{font-size:22px}
  .cta__btns{flex-wrap:wrap}
  .phero__facts{grid-template-columns:1fr}
  .phero__actions .btn{flex:1 1 auto; justify-content:center}
  .formrow{grid-template-columns:1fr}
  .footer__bar{flex-direction:column; align-items:flex-start; gap:6px}
  .footer__cols{grid-template-columns:1fr; gap:22px}
  .section{padding:40px 0}
  .hs__lockup img{width:100%}
  .catblock{padding:40px 0}
  .eng{padding:44px 0 50px}
  .fact{min-height:72px; font-size:14px}
  .pkgnote{flex-direction:column; gap:8px}
}

/* =======================================================================
   FRANCHISE (coming soon)
   ======================================================================= */
.fr-hero{background:var(--navy); color:#fff; padding:56px 0 64px}
.fr-hero .eyebrow{color:rgba(255,255,255,.8); margin-bottom:14px}
.fr-badge{
  display:inline-block; background:var(--orange); color:#fff;
  font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:500;
  padding:6px 13px; border-radius:999px; margin-bottom:16px;
}
.fr-h{font-size:46px; line-height:1.06; font-weight:var(--w-head); letter-spacing:-.02em; margin-bottom:20px}
.fr-h span{color:var(--orange)}
.fr-lede{font-size:16px; line-height:1.45; max-width:640px; margin-bottom:14px}
.fr-note{font-size:13px; line-height:1.5; color:rgba(255,255,255,.72); max-width:560px; margin-bottom:28px}
.fr-actions{display:flex; gap:12px; flex-wrap:wrap}

.fr-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.fr-card{background:#fff; border-radius:16px; padding:26px 24px; box-shadow:var(--shadow)}
.fr-tag{
  display:inline-block; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase;
  color:var(--orange); border:1px solid rgba(245,145,31,.5); border-radius:999px;
  padding:4px 10px; margin-bottom:14px;
}
.fr-card h2{font-size:19px; font-weight:var(--w-head); color:var(--navy); margin-bottom:8px}
.fr-card p{font-size:13px; line-height:1.45; color:var(--ink)}

.cta--form{display:grid; grid-template-columns:1fr 420px; gap:40px; align-items:center; padding:36px 40px}


@media (max-width:1000px){
  .fr-h{font-size:36px}
  .fr-grid{grid-template-columns:1fr}
  .cta--form{grid-template-columns:1fr; gap:28px; padding:30px 26px}
}
@media (max-width:700px){
  .fr-h{font-size:30px}
  .fr-form__row{grid-template-columns:1fr}
  .fr-hero{padding:40px 0 46px}
}