/* NextRise: original identity, an expanded customer experience. */
:root{
  --ink:#111;
  --paper:#fff;
  --pale:#f4f4f4;
  --muted:#606060;
  --line:#d9d9d9;
  --dark:#080808;
  --width:1264px;
  --gutter:clamp(22px,4.4vw,80px);
  --display:"Archivo Variable",Arial,sans-serif;
  --mono:"Martian Mono Variable",monospace
}
*,*::before,*::after{
  box-sizing:border-box
}
html{
  scroll-behavior:smooth;
  scroll-padding-top:110px
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font:16px/1.65 var(--display);
  -webkit-font-smoothing:antialiased
}
body,button,input,select,textarea{
  font-family:var(--display)
}
button,input,select,textarea{
  font-size:inherit
}
button,a,input,select,textarea{
  -webkit-tap-highlight-color:transparent
}
button,a{
  touch-action:manipulation
}
img{
  max-width:100%;
  height:auto;
  display:block
}
figure,p,dl,dd{
  margin:0
}
h1,h2,h3,h4{
  margin:0;
  line-height:1.08;
  font-weight:530;
  font-stretch:105%;
  letter-spacing:-.045em
}
h1{
  font-size:clamp(44px,5.6vw,82px)
}
h2{
  font-size:clamp(34px,3.7vw,54px)
}
h3{
  font-size:25px;
  letter-spacing:-.025em
}
a{
  color:inherit;
  text-decoration:none
}
p a:not(.btn),.source-note a,.form__privacy a{
  text-decoration:underline;
  text-underline-offset:4px
}
p+p{
  margin-top:20px
}
p{
  text-wrap:pretty
}
h2+p,h3+p{
  margin-top:24px
}
button{
  color:inherit;
  cursor:pointer
}
button:disabled{
  cursor:wait;
  opacity:.6
}
ul,ol{
  padding:0;
  margin:0
}
fieldset{
  min-width:0
}
address{
  font-style:normal
}
[hidden]{
  display:none!important
}
::selection{
  background:#999;
  color:#000
}
:focus-visible{
  outline:2px solid currentColor;
  outline-offset:5px
}
.wrap{
  width:min(var(--width),calc(100% - var(--gutter)*2));
  margin-inline:auto
}
.section{
  padding-block:104px
}
.pale{
  background:var(--pale)
}
.lead{
  font-size:clamp(19px,1.65vw,23px);
  line-height:1.6;
  letter-spacing:-.018em
}
.eyebrow{
  font-family:var(--mono);
  font-size:10px;
  font-weight:450;
  line-height:1.8;
  letter-spacing:.08em;
  text-transform:uppercase;
  margin-bottom:25px
}
.section-heading{
  display:grid;
  grid-template-columns:1fr .62fr;
  align-items:end;
  gap:80px;
  margin-bottom:52px
}
.section-heading>p{
  max-width:410px;
  color:var(--muted);
  padding-bottom:4px
}
.actions{
  display:flex;
  gap:22px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:32px
}
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:35px;
  min-height:54px;
  padding:14px 23px;
  border:1px solid transparent;
  font-size:14px;
  line-height:1.5;
  font-weight:560;
  letter-spacing:-.012em;
  transition:background .2s,color .2s,transform .2s
}
.btn span,.text-link span{
  font-size:19px;
  line-height:1;
  transition:transform .2s
}
.btn:hover span,.text-link:hover span{
  transform:translate(3px,-3px)
}
.btn--solid{
  background:var(--ink);
  color:#fff
}
.btn--solid:hover{
  background:#333
}
.btn--light{
  background:#fff;
  color:#111
}
.btn--light:hover{
  background:#ddd
}
.btn--outline,.btn--ghost{
  border-color:currentColor;
  background:transparent
}
.btn--outline:hover,.btn--ghost:hover{
  background:#e7e7e7;
  color:#111
}
.btn--text{
  padding-inline:0;
  min-height:44px
}
.text-link{
  display:inline-flex;
  gap:32px;
  align-items:center;
  padding-block:12px;
  font-size:14px;
  border-bottom:1px solid currentColor;
  font-weight:550
}
.contact-link{
  display:flex;
  width:fit-content;
  gap:18px;
  align-items:center;
  padding:15px 0;
  font-size:17px;
  overflow-wrap:anywhere
}
.u-hidden,.skip:not(:focus){
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0
}
.skip:focus{
  position:fixed;
  top:12px;
  left:12px;
  z-index:1000;
  background:#fff;
  color:#000;
  padding:16px
}
.utility{
  background:#080808;
  color:#bcbcbc;
  border-bottom:1px solid #252525;
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:.015em
}
.utility>.wrap{
  display:flex;
  justify-content:space-between;
  padding-block:10px;
  gap:20px
}
.utility a{
  color:#d0d0d0
}
.nav{
  background:rgba(8,8,8,.97);
  color:#fff;
  position:sticky;
  top:0;
  z-index:50;
  border-bottom:1px solid #242424;
  backdrop-filter:blur(16px)
}
.nav__inner{
  height:92px;
  display:flex;
  align-items:center;
  gap:32px
}
.nav__logo{
  flex-shrink:0;
  margin-right:auto
}
.nav__logo img{
  width:185px;
  height:auto
}
.nav__links{
  display:flex;
  align-items:center;
  gap:27px;
  font-size:13px
}
.nav__links a{
  padding:12px 0;
  white-space:nowrap;
  position:relative
}
.nav__links a::after{
  content:"";
  position:absolute;
  bottom:5px;
  left:0;
  width:100%;
  height:1px;
  background:#fff;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .2s
}
.nav__links a:hover::after,.nav__links a[aria-current]::after{
  transform:scaleX(1)
}
.nav__cta{
  display:inline-flex;
  gap:20px;
  align-items:center;
  background:#fff;
  color:#111;
  padding:13px 17px;
  font-weight:550;
  font-size:12px;
  white-space:nowrap;
  min-height:44px
}
.nav__burger{
  display:none
}
.hero{
  background:var(--dark);
  color:#fff;
  overflow:hidden;
  padding-top:64px
}
.hero__intro{
  display:grid;
  grid-template-columns:1.45fr 1fr;
  gap:70px;
  position:relative;
  z-index:2;
  align-items:end
}
.hero .eyebrow{
  color:#b5b5b5;
  margin-bottom:23px
}
.hero h1{
  font-size:clamp(48px,5.6vw,82px);
  line-height:1.045;
  white-space:nowrap;
  font-weight:490
}
.hero h1 span{
  color:#939393
}
.hero__copy{
  padding:0 0 3px 6px;
  max-width:400px;
  justify-self:end
}
.hero__copy p{
  color:#c2c2c2;
  font-size:15px;
  line-height:1.8
}
.hero__copy .text-link{
  margin-top:17px;
  font-size:12px;
  gap:44px
}
.hero__visual{
  height:480px;
  position:relative;
  margin-top:-15px;
  isolation:isolate
}
.hero__truck{
  position:absolute;
  inset:-78px 0 auto;
  width:100%;
  height:660px;
  object-fit:contain;
  object-position:50% 50%;
  transform:translate3d(var(--truck-x,0px),0,0);
  will-change:transform;
  mask-image:linear-gradient(to bottom,transparent 1%,#000 21%,#000 83%,transparent 98%)
}
.hero__visual figcaption{
  position:absolute;
  bottom:8px;
  left:0;
  font:8px/1.7 var(--mono);
  letter-spacing:.03em;
  color:#c4c4c4;
  z-index:2
}
.motion-toggle{
  position:absolute;
  right:0;
  bottom:0;
  background:rgba(8,8,8,.85);
  color:#ccc;
  border:1px solid #555;
  display:flex;
  gap:20px;
  align-items:center;
  padding:8px 12px;
  min-height:38px;
  font:9px/1.5 var(--mono);
  z-index:2
}
.hero__base{
  border-top:1px solid #333;
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:20px 0 27px;
  font:9px/1.6 var(--mono);
  text-transform:uppercase;
  letter-spacing:.035em;
  color:#aaa
}
.quick-section{
  background:#eee;
  padding-block:30px
}
.quick{
  display:grid;
  grid-template-columns:1fr 2.55fr;
  gap:35px;
  align-items:center
}
.quick__heading h2{
  font-size:20px;
  letter-spacing:-.025em;
  max-width:215px;
  line-height:1.25
}
.quick__heading p{
  font-size:11px;
  color:#555;
  margin-top:7px
}
.quick-form{
  display:grid;
  grid-template-columns:1fr .9fr .95fr auto;
  align-items:end;
  gap:13px
}
.quick-form label>span{
  font-size:11px;
  font-weight:550;
  display:block;
  margin-bottom:6px
}
.quick-form input,.quick-form select{
  border:1px solid #ccc;
  border-radius:0;
  width:100%;
  height:50px;
  padding:10px 12px;
  background:#fff;
  color:#111;
  font-size:13px;
  min-width:0
}
.quick-form .btn{
  font-size:12px;
  gap:20px;
  min-height:50px;
  padding:12px 16px
}
.product-section{
  padding-bottom:86px
}
.product-tabs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  border-block:1px solid var(--line);
  margin-bottom:42px
}
.product-tabs button{
  border:0;
  border-right:1px solid var(--line);
  background:#fff;
  padding:25px 20px;
  font-size:25px;
  letter-spacing:-.03em;
  text-align:left;
  display:flex;
  gap:20px;
  align-items:center;
  transition:background .2s,color .2s
}
.product-tabs button:first-child{
  border-left:1px solid var(--line)
}
.product-tabs button[aria-selected="true"]{
  background:#111;
  color:#fff
}
.product-tabs button>span:last-child{
  margin-left:auto;
  font-size:17px
}
.tab__number{
  font:9px/1 var(--mono);
  align-self:flex-start;
  padding-top:8px
}
.product-panel{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:65px;
  align-items:center
}
.product-panel__copy{
  padding:20px 0
}
.product-panel__copy .eyebrow{
  margin-bottom:17px;
  font-size:9px;
  color:#5b5b5b
}
.product-panel__copy h3{
  font-size:45px
}
.product-panel__copy h3>span{
  display:block;
  font-size:24px;
  line-height:1.25;
  margin-top:17px;
  max-width:370px;
  letter-spacing:-.025em
}
.product-panel__copy>p:not(.eyebrow){
  font-size:14px;
  line-height:1.8;
  color:#555;
  margin-top:20px;
  max-width:445px
}
.product-facts{
  margin-top:25px;
  font-size:12px
}
.product-facts>div{
  display:flex;
  justify-content:space-between;
  gap:25px;
  padding:12px 0;
  border-bottom:1px solid var(--line)
}
.product-facts dt{
  color:#626262
}
.product-facts dd{
  text-align:right
}
.product-panel .actions{
  gap:24px;
  margin-top:25px
}
.product-panel .btn{
  font-size:12px;
  gap:16px
}
.product-panel__visual{
  position:relative;
  overflow:hidden;
  background:#f5f5f5;
  aspect-ratio:1.08
}
.product-panel__visual img{
  width:100%;
  height:100%;
  object-fit:cover;
  mix-blend-mode:multiply;
  transition:transform .8s
}
.product-panel__visual:hover img{
  transform:scale(1.04)
}
.product-code{
  position:absolute;
  left:23px;
  bottom:12px;
  font-size:88px;
  line-height:1;
  letter-spacing:-.07em;
  font-weight:550;
  color:#111
}
.industry-section{
  position:relative;
  background:#111;
  min-height:600px;
  display:flex;
  align-items:center;
  color:#fff;
  overflow:hidden
}
.industry-section__image{
  position:absolute;
  inset:0
}
.industry-section__image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.86),rgba(0,0,0,.48) 50%,rgba(0,0,0,.05))
}
.industry-section__image>img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center 58%
}
.image-caption{
  position:absolute;
  bottom:18px;
  right:var(--gutter);
  font:8px/1.6 var(--mono);
  z-index:2;
  color:#ddd;
  background:rgba(0,0,0,.7);
  padding:6px 9px
}
.industry-section__copy{
  position:relative;
  z-index:1;
  padding-block:75px
}
.industry-section__copy h2{
  font-size:clamp(42px,5.3vw,76px)
}
.industry-section__copy>p:not(.eyebrow){
  max-width:420px;
  margin-block:28px;
  font-size:16px;
  color:#ddd
}
.sectors-section{
  padding-block:0;
  background:#f4f4f4
}
.sectors{
  display:grid;
  grid-template-columns:repeat(4,1fr)
}
.sector{
  padding:37px 26px 31px;
  border-right:1px solid #d7d7d7;
  display:flex;
  flex-direction:column;
  transition:background .2s
}
.sector:first-child{
  padding-left:0
}
.sector:last-child{
  border-right:0;
  padding-right:0
}
.sector h3{
  font-size:21px;
  line-height:1.25
}
.sector p{
  font-size:13px;
  color:#585858;
  margin-block:18px 25px;
  line-height:1.75
}
.sector__link{
  font-size:11px;
  display:flex;
  gap:20px;
  justify-content:space-between;
  margin-top:auto
}
.sector:hover{
  background:#eaeaea
}
.process{
  list-style:none;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:42px;
  margin-top:55px;
  margin-bottom:40px
}
.process li{
  border-top:1px solid #aaa;
  padding-top:27px;
  position:relative
}
.process__n{
  font:12px/1 var(--mono);
  display:block;
  margin-bottom:34px;
  color:#555
}
.process h3{
  font-size:24px
}
.process p{
  font-size:14px;
  line-height:1.8;
  color:#5c5c5c;
  margin-top:16px;
  max-width:330px
}
.company-teaser{
  background:#eee
}
.company-teaser__grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:105px
}
.company-teaser h2 span{
  color:#777
}
.company-teaser__grid>div:last-child>p:not(.lead){
  font-size:15px;
  line-height:1.85;
  color:#555;
  margin-top:23px
}
.company-teaser .btn{
  margin-top:28px
}
.company-teaser .contact-link{
  font-size:13px;
  margin-top:15px
}
.about-intro{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:clamp(40px,6vw,90px);
  align-items:start
}
.about-intro__copy>p:not(.lead){
  font-size:15px;
  color:var(--muted);
  margin-top:24px
}
.about-intro__copy>.btn{
  margin-top:30px
}
.office-portraits{
  margin-top:56px
}
.office-portraits__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px
}
.office-portraits__grid img{
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  background:var(--line)
}
.team-profile{
  min-width:0
}
.team-profile__copy{
  padding-top:24px
}
.team-profile__role{
  margin-bottom:12px;
  font:10px/1.6 var(--mono);
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted)
}
.team-profile h3{
  font-size:clamp(23px,1.85vw,28px);
  line-height:1.15
}
.team-profile__bio{
  margin-top:18px;
  font-size:15px;
  line-height:1.8;
  color:var(--muted)
}
.office-portraits figcaption{
  margin-top:32px;
  font:10px/1.8 var(--mono);
  color:var(--muted)
}
.faq__grid{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:100px
}
.faq__grid>div:first-child>p:not(.eyebrow){
  font-size:14px;
  color:#666;
  max-width:330px;
  margin:24px 0 15px
}
.faq__list{
  border-top:1px solid #bbb
}
.faq__list details{
  border-bottom:1px solid #ccc
}
.faq__list summary{
  cursor:pointer;
  font-size:16px;
  line-height:1.45;
  font-weight:530;
  padding:25px 0;
  list-style:none;
  display:flex;
  gap:20px;
  justify-content:space-between
}
.faq__list summary::-webkit-details-marker{
  display:none
}
.faq__list summary span{
  font-size:23px;
  font-weight:350;
  line-height:1;
  flex-shrink:0;
  transition:transform .2s
}
.faq__list details[open] summary span{
  transform:rotate(45deg)
}
.faq__list details>div{
  padding:0 35px 25px 0
}
.faq__list p{
  font-size:14px;
  color:#595959;
  line-height:1.85
}
.cta-band{
  background:#111;
  color:#fff;
  padding-block:78px
}
.cta-band .wrap{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:75px
}
.cta-band h2{
  font-size:clamp(35px,4.2vw,60px)
}
.cta-band p:not(.eyebrow){
  max-width:490px;
  color:#bdbdbd;
  font-size:14px;
  margin-top:23px
}
.cta-band .btn{
  flex-shrink:0
}
.foot{
  background:#080808;
  color:#fff;
  padding-top:67px
}
.foot__top{
  display:flex;
  justify-content:space-between;
  align-items:start;
  border-bottom:1px solid #333;
  padding-bottom:43px
}
.foot__top img{
  width:246px;
  height:auto
}
.foot__top p{
  color:#999;
  line-height:1.35;
  font-size:21px;
  letter-spacing:-.02em
}
.foot__cols{
  display:grid;
  grid-template-columns:1fr 1.1fr 1fr 1.3fr;
  gap:35px;
  padding-block:43px 54px
}
.foot__cols>div,.foot__cols>address{
  display:flex;
  flex-direction:column;
  align-items:start;
  gap:9px;
  font-size:12px;
  color:#ababab
}
.foot__cols strong{
  font-weight:500;
  color:#eee;
  font-size:11px;
  margin-bottom:10px
}
.foot__cols a{
  padding-block:2px;
  overflow-wrap:anywhere;
  max-width:100%
}
.foot__cols a:hover{
  color:#fff
}
.foot__cols address span{
  padding-top:10px;
  line-height:1.8
}
.foot__meta{
  display:flex;
  justify-content:space-between;
  gap:25px;
  flex-wrap:wrap;
  border-top:1px solid #292929;
  padding:23px 0 28px;
  font:8px/1.6 var(--mono);
  color:#aaa
}
.page-hero{
  background:#0c0c0c;
  color:#fff;
  padding:30px 0 78px
}
.breadcrumbs{
  display:flex;
  gap:14px;
  color:#aaa;
  font-size:10px;
  margin-bottom:52px
}
.breadcrumbs a{
  color:#ddd
}
.page-hero h1 span{
  color:#959595
}
.page-hero .lead{
  color:#bdbdbd;
  max-width:790px;
  margin-top:27px;
  font-size:20px
}
.page-hero .eyebrow{
  color:#bcbcbc;
  margin-bottom:21px
}
.jump-links{
  display:flex;
  gap:30px;
  flex-wrap:wrap;
  margin-top:40px;
  font-size:12px
}
.jump-links a{
  border-bottom:1px solid #777;
  padding-block:10px
}
.product-hero__grid{
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:60px;
  align-items:center
}
.product-hero__name{
  font:11px/1.4 var(--mono);
  margin-bottom:17px;
  color:#ccc
}
.product-hero h1{
  font-size:clamp(36px,4.4vw,62px)
}
.product-hero .lead{
  font-size:16px;
  max-width:510px
}
.product-hero .btn{
  margin-top:32px
}
.product-hero__art{
  position:relative;
  aspect-ratio:1.12;
  background:#eee;
  overflow:hidden
}
.product-hero__art img{
  width:100%;
  height:100%;
  object-fit:cover;
  mix-blend-mode:multiply
}
.product-hero__code{
  position:absolute;
  z-index:1;
  bottom:15px;
  left:20px;
  font-size:clamp(80px,11vw,160px);
  font-weight:550;
  line-height:1;
  letter-spacing:-.07em;
  color:#111
}
.detail-grid{
  display:grid;
  grid-template-columns:.85fr 1.2fr;
  gap:115px
}
.detail-grid>aside>p:not(.eyebrow),.detail-grid>div:first-child>p:not(.eyebrow){
  font-size:14px;
  color:#666;
  margin-top:26px;
  max-width:350px
}
.detail-grid .lead{
  margin-bottom:32px
}
.editorial-row{
  display:grid;
  grid-template-columns:.65fr 1fr;
  gap:35px;
  padding-block:28px;
  border-top:1px solid var(--line)
}
.editorial-row h3{
  font-size:19px;
  line-height:1.3
}
.editorial-row p{
  font-size:14px;
  color:#565656;
  line-height:1.85;
  margin:0
}
.source-note{
  font-size:11px;
  line-height:1.9;
  color:#606060;
  margin-top:24px
}
.check-list{
  list-style:none;
  margin:28px 0
}
.check-list li{
  padding:16px 0 16px 28px;
  border-top:1px solid #ccc;
  font-size:14px;
  position:relative
}
.check-list li::before{
  content:"↗";
  position:absolute;
  left:0
}
.check-list li:last-child{
  border-bottom:1px solid #ccc
}
.check-list+p{
  font-size:13px;
  color:#666;
  margin-bottom:25px
}
.related{
  padding-top:0
}
.related h2{
  font-size:28px
}
.related__links{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  margin-top:30px
}
.related__links>a{
  border-block:1px solid #ccc;
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:25px 0;
  font-size:26px
}
.wide-photo{
  margin-top:40px
}
.wide-photo img{
  width:100%;
  height:440px;
  object-fit:cover
}
.wide-photo figcaption{
  font:8px/1.5 var(--mono);
  color:#606060;
  margin-top:12px
}
.application-row{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:110px;
  padding-block:88px;
  border-bottom:1px solid #ccc;
  scroll-margin-top:105px
}
.application-row:last-child{
  border-bottom:0
}
.application-row h2{
  font-size:42px
}
.application-row .lead{
  font-size:19px
}
.application-row h3{
  font-size:18px;
  margin-top:33px
}
.application-row .check-list{
  margin-block:18px 30px
}
.editorial-note{
  border-left:3px solid #111;
  background:#f4f4f4;
  padding:30px 35px;
  margin-top:55px;
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:45px
}
.editorial-note h3{
  font-size:22px
}
.editorial-note p{
  font-size:14px;
  color:#555;
  margin:0
}
.numbered-list article{
  display:flex;
  gap:25px;
  padding:27px 0;
  border-top:1px solid #ccc
}
.numbered-list article>span{
  font:11px/1.5 var(--mono);
  padding-top:6px;
  color:#555
}
.numbered-list h3{
  font-size:23px
}
.numbered-list p{
  font-size:14px;
  color:#555;
  line-height:1.9;
  margin-top:14px
}
.table-scroll{
  overflow-x:auto
}
table{
  border-collapse:collapse;
  width:100%;
  font-size:13px;
  text-align:left;
  margin-top:25px
}
caption{
  text-align:left;
  font-size:11px;
  color:#555;
  padding-bottom:18px
}
th,td{
  padding:18px 12px;
  border-bottom:1px solid #ccc;
  min-width:130px
}
th{
  font-weight:560
}
th:first-child,td:first-child{
  padding-left:0
}
thead{
  background:#111;
  color:#fff
}
thead th:first-child{
  padding-left:12px
}
tbody th{
  font-size:12px
}
td a{
  text-decoration:underline;
  text-underline-offset:5px
}
.company-story{
  display:grid;
  grid-template-columns:1fr 1.1fr;
  gap:80px;
  align-items:center
}
.company-story>div>p:not(.eyebrow):not(.lead){
  font-size:15px;
  color:#555;
  margin-top:24px
}
.company-story .lead{
  margin-top:27px;
  font-size:23px
}
.company-story .btn{
  margin-top:35px
}
.company-story figure{
  background:#080808;
  color:#ccc
}
.company-story figure img{
  width:100%;
  aspect-ratio:1;
  object-fit:cover
}
.company-story figcaption{
  font:8px/1.8 var(--mono);
  padding:10px 16px
}
.values{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:50px;
  margin-top:55px
}
.values article{
  border-top:1px solid #aaa;
  padding-top:28px
}
.values h3{
  font-size:25px
}
.values p{
  font-size:14px;
  line-height:1.85;
  color:#555;
  margin-top:22px
}
.company-facts>div{
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:25px;
  padding:19px 0;
  border-top:1px solid #ccc;
  font-size:14px
}
.company-facts dt{
  color:#666
}
.enquiry-hero{
  padding-bottom:60px
}
.enquiry-hero h1{
  font-size:64px
}
.enquiry-hero .lead{
  max-width:700px;
  font-size:18px
}
.enquiry-section{
  padding-top:62px
}
.enquiry-grid{
  display:grid;
  grid-template-columns:1.6fr 1fr;
  gap:90px;
  align-items:start
}
.form__intro{
  font-size:12px;
  color:#666;
  margin-bottom:40px
}
.form fieldset{
  margin:0 0 36px;
  padding:0 0 34px;
  border:0;
  border-bottom:1px solid #ccc
}
.form legend{
  font-size:25px;
  letter-spacing:-.03em;
  font-weight:530;
  width:100%;
  margin-bottom:28px
}
.form legend>span{
  font:10px/1 var(--mono);
  color:#666;
  margin-right:22px;
  vertical-align:middle
}
.form label{
  display:block;
  min-width:0
}
.form label>span,.field-label{
  display:block;
  font-size:12px;
  line-height:1.5;
  margin-bottom:9px;
  font-weight:550
}
.form label small{
  font-size:10px;
  color:#666;
  font-weight:400;
  margin-left:5px
}
.form input:not([type="radio"]):not([type="hidden"]),.form select,.form textarea{
  width:100%;
  border:1px solid #bcbcbc;
  background:#fff;
  color:#111;
  padding:14px 13px;
  font-size:14px;
  min-height:51px;
  border-radius:0;
  line-height:1.5;
  max-width:100%
}
.form input::placeholder,.form textarea::placeholder{
  color:#737373;
  opacity:1
}
.form textarea{
  resize:vertical
}
.pair{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
  margin-bottom:24px
}
.seg{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  margin-bottom:26px
}
.seg label{
  position:relative
}
.seg input{
  position:absolute;
  opacity:0;
  left:10px;
  top:15px;
  width:20px;
  height:20px
}
.seg label>span{
  border:1px solid #ccc;
  padding:14px 5px;
  margin:0;
  min-height:50px;
  text-align:center;
  font-size:13px;
  font-weight:500;
  cursor:pointer
}
.seg input:checked+span{
  background:#111;
  color:#fff;
  border-color:#111
}
.seg input:focus-visible+span{
  outline:2px solid #111;
  outline-offset:4px
}
.hint{
  font-size:11px;
  color:#666;
  line-height:1.8
}
.form fieldset>.hint{
  margin-top:-10px;
  margin-bottom:23px
}
.trap{
  position:absolute!important;
  left:-10000px!important;
  width:1px;
  height:1px;
  overflow:hidden
}
.form__privacy{
  font-size:12px;
  color:#666;
  line-height:1.85;
  margin-bottom:25px
}
.form__submit{
  min-width:250px
}
.form__status{
  font-size:14px;
  line-height:1.8;
  margin-top:20px
}
.form__status:not(:empty){
  border-left:3px solid #111;
  padding:15px 20px;
  background:#f3f3f3
}
.enquiry-aside{
  position:sticky;
  top:125px
}
.enquiry-summary{
  padding:32px;
  background:#f1f1f1;
  border-top:3px solid #111
}
.enquiry-summary .eyebrow{
  font-size:9px;
  margin-bottom:19px
}
.enquiry-summary h2{
  font-size:31px;
  margin-bottom:25px
}
.enquiry-summary dl>div{
  padding:14px 0;
  border-bottom:1px solid #d0d0d0;
  display:flex;
  justify-content:space-between;
  gap:25px;
  font-size:12px
}
.enquiry-summary dt{
  color:#666
}
.enquiry-summary dd{
  text-align:right;
  max-width:65%;
  overflow-wrap:anywhere
}
.enquiry-summary>.hint{
  margin-top:25px
}
.enquiry-help{
  margin-top:30px;
  padding-bottom:25px;
  border-bottom:1px solid #ddd
}
.enquiry-help h3{
  font-size:19px
}
.enquiry-help p{
  font-size:13px;
  color:#666;
  line-height:1.85;
  margin-top:14px
}
.enquiry-help>a{
  font-size:13px;
  overflow-wrap:anywhere;
  display:inline-block;
  margin-top:15px
}
.enquiry-help .text-link{
  display:inline-flex;
  margin-top:9px
}
.doc{
  padding:80px var(--gutter) 100px;
  max-width:1100px;
  margin:auto;
  overflow-wrap:anywhere
}
.doc>div,.doc>dl{
  margin-bottom:40px
}
.doc>p{
  margin-bottom:35px
}
.doc h1{
  font-size:60px;
  margin-bottom:30px
}
.doc h2{
  font-size:26px;
  margin-top:35px
}
.doc p,.doc address,.doc dd{
  font-size:15px;
  line-height:1.85;
  color:#555
}
.doc dt{
  font-weight:600;
  margin-top:26px
}
.doc dd{
  margin-top:10px
}
.doc a{
  text-decoration:underline;
  text-underline-offset:4px
}
.doc .notice{
  padding:25px 30px;
  background:#eee;
  border-left:3px solid #111
}
.doc .notice h2{
  margin-top:0;
  font-size:22px
}
.doc .idx{
  font:10px/1.7 var(--mono);
  text-transform:uppercase;
  color:#666
}
.doc .idx span{
  margin-right:20px
}
.nojs-products{
  margin-top:30px
}
.nojs-products a{
  text-decoration:underline
}
.no-js [data-motion-toggle]{
  display:none
}
.js [data-reveal].is-visible{
  animation:rise-in .65s ease both
}
@keyframes rise-in{
  from{
    opacity:.3;
    transform:translateY(18px)
  }
  to{
    opacity:1;
    transform:none
  }
}
@media(min-width:1600px){
  .hero__visual{
    height:510px
  }
  .hero__truck{
    height:730px;
    top:-100px
  }
  .hero{
    padding-top:75px
  }
}
@media(max-width:1150px){
  .nav__inner{
    gap:22px
  }
  .nav__logo img{
    width:160px
  }
  .nav__links{
    gap:20px;
    font-size:12px
  }
  .nav__cta{
    font-size:11px;
    gap:12px
  }
  .hero__intro{
    gap:45px;
    grid-template-columns:1.5fr 1fr
  }
  .hero h1{
    font-size:5.75vw
  }
  .hero__copy p{
    font-size:13px
  }
  .hero__visual{
    height:400px
  }
  .hero__truck{
    height:565px;
    inset:-65px 0 auto
  }
  .quick{
    grid-template-columns:1fr;
    gap:22px
  }
  .quick__heading{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:30px
  }
  .quick__heading h2{
    max-width:none
  }
  .quick__heading p{
    margin-top:0
  }
  .quick-form{
    grid-template-columns:1fr 1fr 1fr auto
  }
  .section-heading{
    gap:55px
  }
  .product-tabs button{
    font-size:22px;
    padding:23px 17px;
    gap:12px
  }
  .product-panel{
    gap:40px
  }
  .product-panel .actions{
    gap:10px
  }
  .product-panel .btn{
    font-size:11px;
    gap:12px;
    padding-inline:15px
  }
  .product-panel .btn--text{
    padding-inline:0
  }
  .product-facts>div{
    font-size:10px
  }
  .sector{
    padding-inline:20px
  }
  .sector h3{
    font-size:18px
  }
  .sector__link{
    font-size:10px
  }
  .faq__grid{
    gap:65px
  }
  .company-teaser__grid,.detail-grid,.application-row{
    gap:65px
  }
  .enquiry-grid{
    gap:50px
  }
  .foot__cols{
    gap:25px
  }
  .foot__cols address{
    font-size:11px
  }
  .product-hero__grid{
    gap:40px
  }
  .product-hero .lead{
    font-size:14px
  }
  .product-hero .eyebrow{
    font-size:9px
  }
  .company-story{
    gap:45px
  }
}
@media(max-width:950px){
  .nav__inner{
    height:80px
  }
  .nav__logo img{
    width:160px
  }
  .nav__burger{
    display:flex;
    position:relative;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:6px;
    background:transparent;
    border:1px solid #666;
    width:44px;
    height:44px;
    flex-shrink:0
  }
  .nav__burger>span:not(.u-hidden){
    height:1px;
    width:17px;
    background:#fff;
    transition:transform .2s
  }
  .nav__burger[aria-expanded="true"]>span:first-child{
    transform:translateY(3.5px) rotate(45deg)
  }
  .nav__burger[aria-expanded="true"]>span:nth-child(2){
    transform:translateY(-3.5px) rotate(-45deg)
  }
  .nav__links{
    display:none;
    position:absolute;
    top:80px;
    left:0;
    width:100%;
    padding:22px var(--gutter) 30px;
    background:#111;
    border-top:1px solid #333;
    border-bottom:1px solid #555;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    font-size:18px
  }
  .nav__links.is-open{
    display:flex
  }
  .nav__links>a{
    padding:15px 0;
    border-bottom:1px solid #333
  }
  .nav__links>a::after{
    display:none
  }
  .no-js .nav{
    position:relative
  }
  .no-js .nav__inner{
    height:auto;
    min-height:90px;
    flex-wrap:wrap;
    padding-block:20px
  }
  .no-js .nav__links{
    position:static;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    order:3;
    padding:0;
    background:none;
    border:0;
    font-size:13px;
    gap:20px
  }
  .no-js .nav__burger{
    display:none
  }
  .hero{
    padding-top:45px
  }
  .hero__intro{
    gap:32px
  }
  .hero__copy p{
    font-size:12px
  }
  .hero .eyebrow{
    font-size:8px
  }
  .hero__copy .text-link{
    font-size:10px;
    gap:23px
  }
  .hero__visual{
    height:330px;
    margin-top:0
  }
  .hero__truck{
    height:485px;
    top:-60px
  }
  .product-tabs button{
    font-size:19px;
    padding:22px 13px;
    gap:10px
  }
  .tab__number{
    font-size:8px;
    padding-top:5px
  }
  .product-panel{
    gap:30px
  }
  .product-panel__copy h3{
    font-size:35px
  }
  .product-panel__copy h3>span{
    font-size:22px
  }
  .product-panel__copy .eyebrow{
    font-size:8px
  }
  .product-panel__copy>p:not(.eyebrow){
    font-size:13px
  }
  .product-panel .actions{
    flex-direction:column;
    align-items:start;
    gap:5px
  }
  .product-panel__visual{
    aspect-ratio:.8
  }
  .product-facts>div{
    display:block
  }
  .product-facts dd{
    text-align:left;
    margin-top:4px;
    font-size:12px
  }
  .industry-section{
    min-height:520px
  }
  .sectors{
    grid-template-columns:repeat(2,1fr)
  }
  .sector,.sector:first-child,.sector:last-child{
    padding:28px 25px
  }
  .sector:nth-child(2){
    border-right:0
  }
  .sector:nth-child(-n+2){
    border-bottom:1px solid #d7d7d7
  }
  .section{
    padding-block:80px
  }
  .process{
    gap:28px
  }
  .process h3{
    font-size:21px
  }
  .process p{
    font-size:13px
  }
  .company-teaser__grid{
    gap:50px
  }
  .faq__grid{
    gap:45px
  }
  .foot__cols{
    grid-template-columns:repeat(2,1fr);
    gap:45px
  }
  .foot__cols address{
    font-size:12px
  }
  .detail-grid{
    grid-template-columns:.8fr 1fr;
    gap:45px
  }
  .editorial-row{
    grid-template-columns:1fr;
    gap:15px
  }
  .enquiry-grid{
    grid-template-columns:1.6fr 1fr;
    gap:32px
  }
  .enquiry-summary{
    padding:24px 20px
  }
  .seg{
    grid-template-columns:repeat(2,1fr)
  }
  .form legend{
    font-size:22px
  }
  .form legend span{
    margin-right:12px
  }
  .enquiry-summary dl>div{
    display:block
  }
  .enquiry-summary dd{
    text-align:left;
    max-width:100%;
    margin-top:5px
  }
  .pair{
    grid-template-columns:1fr;
    gap:23px
  }
  .page-hero h1{
    font-size:50px
  }
  .page-hero .lead{
    font-size:18px
  }
  .product-hero__grid{
    grid-template-columns:1fr 1fr;
    gap:30px
  }
  .product-hero h1{
    font-size:38px
  }
  .product-hero .lead{
    font-size:14px
  }
  .product-hero__art{
    aspect-ratio:.75
  }
  .application-row{
    gap:45px
  }
  .application-row h2{
    font-size:33px
  }
  .application-row .lead{
    font-size:17px
  }
  .values{
    gap:30px
  }
  .values h3{
    font-size:23px
  }
  .company-story{
    grid-template-columns:1.1fr 1fr;
    gap:40px
  }
  .company-story h2{
    font-size:35px
  }
  .company-story .lead{
    font-size:20px
  }
  .company-story figure img{
    aspect-ratio:.7
  }
  .related{
    padding-top:0
  }
}
@media(max-width:700px){
  .about-intro{
    grid-template-columns:1fr;
    gap:28px
  }
  .about-intro__copy>p:not(.lead){
    font-size:14px
  }
  .office-portraits{
    margin-top:36px
  }
  .office-portraits__grid{
    grid-template-columns:1fr;
    gap:44px;
    max-width:440px;
    margin-inline:auto
  }
  .team-profile__copy{
    padding-top:22px
  }
  .team-profile__bio{
    font-size:14px
  }
  .office-portraits figcaption{
    max-width:440px;
    margin-inline:auto
  }
  :root{
    --gutter:24px
  }
  html{
    scroll-padding-top:94px
  }
  .utility>.wrap{
    padding-block:8px
  }
  .utility{
    font-size:8px
  }
  .utility a{
    display:none
  }
  .nav__inner{
    height:74px;
    gap:13px
  }
  .nav__logo img{
    width:143px
  }
  .nav__cta{
    font-size:10px;
    padding:10px 12px;
    gap:12px;
    min-height:40px
  }
  .nav__burger{
    width:40px;
    height:40px
  }
  .nav__links{
    top:74px
  }
  .hero{
    padding-top:37px
  }
  .hero__intro{
    display:block
  }
  .hero h1{
    font-size:clamp(38px,8.5vw,60px);
    white-space:normal;
    line-height:1.07
  }
  .hero .eyebrow{
    font-size:8px;
    margin-bottom:21px
  }
  .hero__copy{
    margin-top:24px;
    padding:0;
    max-width:400px;
    justify-self:start
  }
  .hero__copy p{
    font-size:13px;
    line-height:1.8
  }
  .hero__copy .text-link{
    font-size:11px;
    margin-top:9px;
    gap:32px
  }
  .hero__visual{
    height:265px;
    margin-top:2px;
    margin-inline:-24px
  }
  .hero__truck{
    height:340px;
    inset:-27px 0 auto;
    width:100%;
    object-fit:contain;
    object-position:50% 65%;
    mask-image:linear-gradient(to bottom,transparent 0%,#000 18%,#000 83%,transparent 100%)
  }
  .hero__visual figcaption{
    left:24px;
    bottom:9px;
    font-size:6px
  }
  .motion-toggle{
    right:24px;
    bottom:3px;
    font-size:7px;
    min-height:34px;
    padding:7px 9px;
    gap:10px
  }
  .hero__base{
    font-size:7px;
    padding-block:17px 22px;
    gap:10px
  }
  .hero__base>span:first-child{
    display:none
  }
  .quick-section{
    padding-block:26px
  }
  .quick{
    gap:22px
  }
  .quick__heading{
    display:block
  }
  .quick__heading h2{
    font-size:21px
  }
  .quick__heading p{
    margin-top:6px;
    font-size:11px
  }
  .quick-form{
    grid-template-columns:1fr 1fr;
    gap:15px 12px
  }
  .quick-form label:first-child{
    grid-column:1/-1
  }
  .quick-form .btn{
    grid-column:1/-1;
    min-height:49px;
    padding-inline:17px;
    justify-content:space-between
  }
  .quick-form label>span{
    font-size:10px
  }
  .quick-form input,.quick-form select{
    font-size:13px
  }
  .section{
    padding-block:62px
  }
  h2{
    font-size:37px
  }
  .eyebrow{
    font-size:8px;
    margin-bottom:18px
  }
  .section-heading{
    grid-template-columns:1fr;
    gap:23px;
    margin-bottom:33px
  }
  .section-heading>p{
    font-size:13px;
    max-width:400px
  }
  .product-tabs{
    grid-template-columns:repeat(2,1fr);
    margin-bottom:30px
  }
  .product-tabs button{
    font-size:21px;
    padding:18px 14px;
    gap:12px
  }
  .product-tabs button:nth-child(3){
    border-left:1px solid var(--line)
  }
  .product-tabs button:nth-child(-n+2){
    border-bottom:1px solid var(--line)
  }
  .product-panel{
    grid-template-columns:1fr;
    gap:28px
  }
  .product-panel__copy{
    padding:0
  }
  .product-panel__copy h3{
    font-size:39px
  }
  .product-panel__copy h3>span{
    font-size:24px;
    max-width:350px
  }
  .product-panel__copy .eyebrow{
    font-size:8px
  }
  .product-panel__copy>p:not(.eyebrow){
    font-size:14px
  }
  .product-facts>div{
    display:flex;
    font-size:11px;
    gap:20px
  }
  .product-facts dd{
    text-align:right;
    margin:0;
    font-size:11px
  }
  .product-panel .actions{
    flex-direction:row;
    align-items:center;
    gap:20px
  }
  .product-panel .btn{
    font-size:11px;
    gap:15px
  }
  .product-panel__visual{
    aspect-ratio:1.3
  }
  .product-code{
    font-size:70px
  }
  .industry-section{
    min-height:480px
  }
  .industry-section__copy{
    padding-block:66px
  }
  .industry-section__copy h2{
    font-size:45px
  }
  .industry-section__copy>p:not(.eyebrow){
    font-size:14px;
    max-width:330px
  }
  .industry-section__image::after{
    background:linear-gradient(90deg,rgba(0,0,0,.85),rgba(0,0,0,.45))
  }
  .industry-section .btn{
    font-size:12px;
    min-height:50px
  }
  .image-caption{
    font-size:6px;
    right:24px;
    bottom:14px
  }
  .sectors-section{
    padding:0
  }
  .sectors{
    width:100%;
    padding-inline:24px
  }
  .sector,.sector:first-child,.sector:last-child{
    padding:28px 18px
  }
  .sector:nth-child(odd){
    padding-left:0
  }
  .sector:nth-child(even){
    padding-right:0
  }
  .sector h3{
    font-size:18px
  }
  .sector p{
    font-size:12px;
    margin-top:13px
  }
  .sector__link{
    font-size:9px;
    gap:10px;
    line-height:1.7
  }
  .process{
    grid-template-columns:1fr;
    gap:29px;
    margin-block:37px 28px
  }
  .process li{
    padding:23px 0 0 43px
  }
  .process__n{
    position:absolute;
    left:0;
    top:28px;
    font-size:10px
  }
  .process h3{
    font-size:24px
  }
  .process p{
    max-width:none;
    font-size:14px;
    margin-top:14px
  }
  .company-teaser__grid{
    grid-template-columns:1fr;
    gap:31px
  }
  .company-teaser .lead{
    font-size:20px
  }
  .company-teaser__grid>div:last-child>p:not(.lead){
    font-size:14px
  }
  .company-teaser .btn{
    font-size:12px
  }
  .faq__grid{
    grid-template-columns:1fr;
    gap:32px
  }
  .faq__grid>div:first-child>p:not(.eyebrow){
    margin-top:20px;
    font-size:13px
  }
  .faq__list summary{
    font-size:15px;
    padding:21px 0
  }
  .faq__list p{
    font-size:13px
  }
  .faq__list details>div{
    padding-right:18px
  }
  .cta-band{
    padding-block:60px
  }
  .cta-band .wrap{
    display:block
  }
  .cta-band h2{
    font-size:38px
  }
  .cta-band p:not(.eyebrow){
    font-size:13px
  }
  .cta-band .btn{
    margin-top:29px;
    font-size:12px;
    min-width:215px
  }
  .foot{
    padding-top:48px
  }
  .foot__top{
    display:block;
    padding-bottom:32px
  }
  .foot__top img{
    width:220px
  }
  .foot__top p{
    font-size:16px;
    margin-top:27px
  }
  .foot__cols{
    gap:32px 20px;
    padding-block:35px 40px;
    grid-template-columns:1fr 1fr
  }
  .foot__cols>div,.foot__cols>address{
    font-size:11px
  }
  .foot__cols address{
    grid-column:1/-1
  }
  .foot__cols strong{
    font-size:10px;
    margin-bottom:4px
  }
  .foot__meta{
    font-size:7px;
    gap:14px;
    padding-block:20px
  }
  .foot__meta>span:nth-child(2){
    display:none
  }
  .page-hero{
    padding:23px 0 52px
  }
  .breadcrumbs{
    font-size:9px;
    gap:12px;
    margin-bottom:37px
  }
  .page-hero h1,.enquiry-hero h1{
    font-size:42px
  }
  .page-hero .lead{
    font-size:16px;
    line-height:1.8;
    margin-top:24px
  }
  .jump-links{
    gap:12px 23px;
    font-size:11px;
    margin-top:28px
  }
  .product-hero__grid{
    grid-template-columns:1fr;
    gap:37px
  }
  .product-hero h1{
    font-size:40px
  }
  .product-hero .lead{
    font-size:15px
  }
  .product-hero__name{
    font-size:10px
  }
  .product-hero .btn{
    font-size:12px;
    margin-top:28px
  }
  .product-hero__art{
    aspect-ratio:1.3
  }
  .product-hero__code{
    font-size:95px
  }
  .detail-grid{
    grid-template-columns:1fr;
    gap:34px
  }
  .detail-grid .lead{
    font-size:20px;
    margin-bottom:28px
  }
  .detail-grid>aside>p:not(.eyebrow){
    margin-top:20px
  }
  .editorial-row{
    grid-template-columns:1fr;
    gap:12px;
    padding-block:25px
  }
  .editorial-row h3{
    font-size:22px
  }
  .editorial-row p{
    font-size:14px
  }
  .check-list li{
    font-size:13px
  }
  .source-note{
    font-size:10px
  }
  .related{
    padding-top:0
  }
  .related h2{
    font-size:25px
  }
  .related__links{
    grid-template-columns:1fr;
    gap:0;
    margin-top:25px
  }
  .related__links>a{
    border-bottom:0;
    font-size:24px;
    padding-block:22px
  }
  .related__links>a:last-child{
    border-bottom:1px solid #ccc
  }
  .wide-photo{
    margin-top:25px
  }
  .wide-photo img{
    height:265px
  }
  .wide-photo figcaption{
    font-size:7px
  }
  .application-row{
    grid-template-columns:1fr;
    gap:27px;
    padding-block:58px
  }
  .application-row h2{
    font-size:35px
  }
  .application-row .lead{
    font-size:17px
  }
  .application-row .btn{
    font-size:12px
  }
  .editorial-note{
    grid-template-columns:1fr;
    gap:19px;
    padding:25px;
    margin-top:35px
  }
  .editorial-note h3{
    font-size:23px
  }
  .editorial-note p{
    font-size:13px
  }
  .numbered-list article{
    gap:20px
  }
  .numbered-list h3{
    font-size:23px
  }
  .numbered-list p{
    font-size:13px
  }
  .company-story{
    grid-template-columns:1fr;
    gap:35px
  }
  .company-story h2{
    font-size:37px
  }
  .company-story>div>p:not(.eyebrow):not(.lead){
    font-size:14px
  }
  .company-story figure img{
    aspect-ratio:1.2
  }
  .company-story figcaption{
    font-size:7px
  }
  .values{
    grid-template-columns:1fr;
    gap:30px;
    margin-top:35px
  }
  .values h3{
    font-size:25px
  }
  .values p{
    font-size:14px;
    margin-top:17px
  }
  .company-facts>div{
    font-size:12px;
    gap:20px
  }
  .enquiry-section{
    padding-top:38px
  }
  .enquiry-grid{
    grid-template-columns:1fr;
    gap:35px
  }
  .form__intro{
    font-size:11px;
    margin-bottom:30px
  }
  .form legend{
    font-size:23px
  }
  .form label>span{
    font-size:12px
  }
  .form input:not([type="radio"]):not([type="hidden"]),.form select,.form textarea{
    font-size:16px
  }
  .form input::placeholder,.form textarea::placeholder{
    font-size:13px
  }
  .form fieldset{
    padding-bottom:26px;
    margin-bottom:28px
  }
  .form__submit{
    width:100%
  }
  .enquiry-aside{
    position:static;
    display:grid;
    grid-template-columns:1fr
  }
  .enquiry-summary{
    padding:28px
  }
  .enquiry-summary dl>div{
    display:flex
  }
  .enquiry-summary dd{
    text-align:right;
    max-width:65%;
    margin:0
  }
  .doc{
    padding-top:50px;
    padding-bottom:65px
  }
  .doc h1{
    font-size:43px
  }
  .doc h2{
    font-size:24px
  }
  .doc p{
    font-size:14px
  }
  .doc .notice{
    padding:22px
  }
  .doc .notice h2{
    font-size:20px
  }
}
@media(max-width:370px){
  :root{
    --gutter:19px
  }
  .nav__logo img{
    width:120px
  }
  .nav__inner{
    gap:9px
  }
  .nav__cta{
    font-size:9px;
    padding:9px;
    gap:8px
  }
  .nav__burger{
    width:36px;
    height:38px
  }
  .hero h1{
    font-size:34px
  }
  .hero__visual{
    height:220px;
    margin-inline:-19px
  }
  .hero__truck{
    height:285px;
    top:-17px
  }
  .hero__visual figcaption{
    left:19px
  }
  .motion-toggle{
    right:19px
  }
  .product-panel .actions{
    gap:12px
  }
  .product-panel .btn{
    font-size:10px;
    gap:10px;
    padding:13px
  }
  .product-panel .btn--text{
    padding-inline:0
  }
  .product-facts>div{
    display:block
  }
  .product-facts dd{
    text-align:left;
    margin-top:5px
  }
  .page-hero h1,.product-hero h1{
    font-size:36px
  }
  .sector h3{
    font-size:16px
  }
  .sector__link{
    font-size:8px
  }
  .cta-band h2{
    font-size:33px
  }
  .form legend{
    font-size:21px
  }
}
@media(prefers-reduced-motion:reduce){
  html{
    scroll-behavior:auto
  }
  *,*::before,*::after{
    animation:none!important;
    transition:none!important
  }
  .hero__truck{
    transform:none!important;
    will-change:auto
  }
  .motion-toggle{
    display:none
  }
}
@media print{
  .utility,.nav,.foot,.motion-toggle,.quick-section,.cta-band,.hero__visual,.enquiry-aside{
    display:none
  }
  body{
    color:#000;
    background:#fff
  }
  .wrap{
    width:100%
  }
  .section{
    padding:25px 0
  }
  .page-hero,.hero{
    background:#fff;
    color:#000;
    padding:20px 0
  }
  .page-hero .lead,.page-hero h1 span{
    color:#333
  }
  .product-panel{
    display:block!important
  }
  .product-panel__visual{
    display:none
  }
  .product-tabs{
    display:none
  }
  .product-panel__copy{
    margin:30px 0
  }
  .detail-grid,.enquiry-grid{
    display:block
  }
  a{
    text-decoration:underline
  }
  .btn{
    border:1px solid #000;
    background:#fff;
    color:#000
  }
}
/* Let the comparison table scroll inside its column at narrow widths. */
.detail-grid>*{
  min-width:0
}
.table-scroll{
  max-width:100%
}
.hero__visual{
  overflow:hidden
}

/* Scroll-controlled opening: a pinned scene with a vehicle crossing the road. */
.hero--journey {
  --nav-height: 93px;
  --journey-progress: 0;
  --truck-x: 0px;
  --road-x: 0px;
  background: #080808;
  padding: 0;
  overflow: visible;
}
.hero__pin {
  position: relative;
  height: 800px;
  min-height: 650px;
  overflow: hidden;
  isolation: isolate;
  background: #080808;
}
.hero--journey.is-scrollable {
  height: calc(100svh + 1350px);
}
.hero--journey.is-scrollable .hero__pin {
  position: sticky;
  top: var(--nav-height);
  height: calc(100svh - var(--nav-height));
  min-height: 0;
}
.hero__content { position: relative; z-index: 4; padding-top: 60px; }
.hero__chapter { transition: opacity .45s ease, transform .45s ease; }
.hero__chapter:not(.is-active) {
  position: absolute;
  top: 60px;
  left: 0;
  right: 0;
  opacity: 0;
  transform: translateY(28px);
  visibility: hidden;
  pointer-events: none;
}
.hero__chapter.is-active { opacity: 1; transform: translateY(0); visibility: visible; }
.hero__chapter h2 {
  font-size: clamp(48px,5.6vw,82px);
  line-height: 1.045;
  font-weight: 490;
}
.hero__chapter h2 span { color: #939393; }
.hero__chapter .btn { margin-top: 22px; font-size: 12px; }
.hero__landscape { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.hero__horizon {
  position: absolute;
  left: -30%; right: -30%; bottom: 115px; height: 270px;
  background: radial-gradient(ellipse at center, #303030 0%, #131313 40%, transparent 72%);
  opacity: .35;
}
.hero__route-text {
  position: absolute;
  left: 8%; bottom: 160px;
  color: #131313;
  white-space: nowrap;
  font-size: clamp(90px,15vw,225px);
  font-weight: 650;
  letter-spacing: -.06em;
  line-height: 1;
  transform: translateX(var(--road-x));
  will-change: transform;
}
.hero__road { position: absolute; bottom: 113px; left: -100%; width: 300%; height: 48px; transform: translateX(var(--road-x)); }
.hero__road i { position: absolute; left: 0; width: 100%; height: 1px; background: #4b4b4b; }
.hero__road i:last-child { bottom: 0; height: 3px; background: repeating-linear-gradient(90deg,#777 0 100px,transparent 100px 210px); opacity: .45; }
/* Blend the whole vehicle layer with the scene, including its black surround. */
.hero__drive-stage { position: absolute; inset: 240px 0 155px; z-index: 2; pointer-events: none; mix-blend-mode: screen; }
.hero--journey .hero__truck {
  position: absolute;
  top: auto; bottom: -20px; left: 50%; right: auto;
  width: min(1020px,86vw);
  height: auto;
  max-width: none;
  object-fit: contain;
  mask-image: none;
  mix-blend-mode: normal;
  transform: translate3d(calc(-50% + var(--truck-x)),22%,0);
  filter: grayscale(1);
  will-change: transform;
}
.hero__dashboard { position: absolute; bottom: 28px; left: 0; right: 0; z-index: 5; }
.hero__journey-label { display: flex; align-items: center; justify-content: space-between; gap: 24px; font: 8px/1.7 var(--mono); color: #aaa; margin-bottom: 20px; }
.hero__journey-label a { color: #eee; font-size: 10px; padding: 8px 0; }
.hero__progress { position: relative; display: flex; justify-content: space-between; gap: 24px; border-top: 1px solid #444; padding-top: 15px; margin-right: 240px; }
.hero__progress>span { font-size: 11px; color: #858585; transition: color .3s; }
.hero__progress b { font: 9px/1 var(--mono); margin-right: 13px; font-weight: 450; }
.hero__progress .is-active { color: #fff; }
.hero__progress>i { position: absolute; top: -1px; height: 2px; width: 100%; background: #fff; transform: scaleX(var(--journey-progress)); transform-origin: left; }
.hero__dashboard .motion-toggle { bottom: -8px; right: 0; }
.hero--journey:not(.is-scrollable) .hero__progress { display: none; }
.hero--journey:not(.is-scrollable) .hero__journey-label a { display: none; }
.hero--journey:not(.is-scrollable) .motion-toggle { display: none; }
@media (max-width: 1150px) {
  .hero__content { padding-top: 45px; }
  .hero__chapter:not(.is-active) { top: 45px; }
  .hero__chapter h2 { font-size: 5.75vw; }
  .hero__pin { height: 700px; min-height: 570px; }
  .hero__drive-stage { bottom: 160px; }
  .hero__progress { margin-right: 190px; }
  .hero__progress>span { font-size: 10px; }
}
@media (max-width: 950px) {
  .hero--journey { --nav-height: 81px; }
  .hero__progress { gap: 12px; }
  .hero__progress>span { font-size: 9px; }
  .hero__progress b { margin-right: 7px; }
}
@media (max-width: 700px) {
  .hero--journey { --nav-height: 75px; }
  .hero--journey.is-scrollable { height: calc(100svh + 1000px); }
  .hero__pin { height: 700px; min-height: 620px; }
  .hero--journey.is-scrollable .hero__pin { min-height: 0; }
  .hero__content { padding-top: 35px; }
  .hero__chapter:not(.is-active) { top: 35px; }
  .hero__chapter h2 { font-size: clamp(35px,8.5vw,55px); }
  .hero__chapter .btn { margin-top: 19px; min-height: 45px; }
  .hero__drive-stage { inset: 290px 0 172px; }
  .hero--journey .hero__truck { width: 108vw; bottom: -16px; }
  .hero__horizon { height: 190px; bottom: 165px; }
  .hero__route-text { font-size: 85px; bottom: 190px; }
  .hero__road { bottom: 137px; height: 27px; }
  .hero__dashboard { bottom: 24px; }
  .hero__journey-label { margin-bottom: 10px; font-size: 6px; gap: 12px; }
  .hero__journey-label a { font-size: 8px; }
  .hero__progress { margin-right: 0; gap: 10px; padding-top: 13px; padding-bottom: 42px; }
  .hero__progress>span { font-size: 9px; }
  .hero__progress b { display: block; margin: 0 0 7px; font-size: 8px; }
  .hero__dashboard .motion-toggle { bottom: -6px; font-size: 7px; min-height: 29px; }
}
@media (max-height: 650px) and (min-width: 701px) {
  .hero--journey.is-scrollable .hero__pin { min-height: 0; }
  .hero__content { padding-top: 22px; }
  .hero__chapter:not(.is-active) { top: 22px; }
  .hero__chapter h1,.hero__chapter h2 { font-size: 43px; }
  .hero__chapter .eyebrow { margin-bottom: 12px; }
  .hero__copy p { font-size: 11px; }
  .hero__copy .text-link { margin-top: 2px; padding: 5px 0; }
  .hero__drive-stage { inset: 180px 0 110px; }
  .hero--journey .hero__truck { width: min(660px,62vw); }
  .hero__road { bottom: 85px; }
  .hero__route-text { bottom: 105px; font-size: 110px; }
  .hero__dashboard { bottom: 16px; }
  .hero__journey-label { margin-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero--journey.is-scrollable { height: auto; }
  .hero--journey.is-scrollable .hero__pin { position: relative; top: auto; height: 800px; }
  .hero--journey .hero__truck { transform: translate3d(-50%,22%,0)!important; will-change: auto; }
  .hero__route-text { transform: none; will-change: auto; }
  .hero__chapter:not(.is-active) { display: none; }
}