#hero{--notch:10px;position:relative;overflow:hidden;display:flex;align-items:flex-end;background:var(--c-primary);color:var(--c-dark-text);min-height:calc(100vh - var(--header-h));min-height:calc(100svh - var(--header-h))}
#hero .hero__media{position:absolute;inset:0;z-index:0}
#hero .hero__img{width:100%;height:100%;object-fit:cover;object-position:50% 45%}
#hero .hero__wash{position:absolute;inset:0;z-index:1;background-image:linear-gradient(to bottom,rgba(40,10,83,.45) 0%,rgba(30,12,60,.72) 18%,rgba(17,17,17,.90) 30%,rgba(17,17,17,.95) 100%);pointer-events:none}
#hero .hero__inner{position:relative;z-index:2;width:100%;padding-top:var(--sp-8);padding-bottom:max(var(--sp-6),7vh)}
#hero .hero__stack{max-width:100%}
#hero .hero__spec{color:var(--c-dark-text);margin-bottom:var(--sp-4)}
#hero .hero__spec > *{padding-inline:0;margin-right:1.1rem}
#hero .hero__spec > * + *{border-left:0}
#hero h1{color:var(--c-dark-text);font-family:var(--f-display);font-weight:700;letter-spacing:-.01em;font-size:clamp(2.1rem,1.45rem + 3.1vw,4.6rem);line-height:1.04;max-width:16ch}
#hero .hero__lede{margin-top:var(--sp-4);color:rgba(244,240,250,.94);max-width:46ch;font-size:clamp(1.0625rem,1rem + .35vw,1.25rem)}
#hero .hero__actions{display:flex;flex-direction:column;gap:12px;margin-top:var(--sp-5)}
#hero .hero__actions .btn{width:100%}
#hero .btn--primary{background:var(--c-primary);color:var(--c-dark-text);box-shadow:inset 0 0 0 1px var(--c-secondary)}
#hero .btn--ghost-dark{color:var(--c-dark-text);box-shadow:inset 0 0 0 1.5px var(--c-secondary)}
#hero .btn--ghost-dark::after{background:var(--c-secondary)}
#hero .btn--ghost-dark:hover,#hero .btn--ghost-dark:focus-visible{box-shadow:inset 0 0 0 1.5px var(--c-accent);color:var(--c-dark-text)}
@media (min-width:768px){
  #hero{--notch:14px}
  #hero .hero__spec > *{padding-inline:16px;margin-right:0}
  #hero .hero__spec > *:first-child{padding-inline-start:0}
  #hero .hero__spec > * + *{border-left:1px solid var(--c-spec-rule-dark)}
  #hero .hero__actions{flex-direction:row;flex-wrap:wrap;gap:var(--sp-3)}
  #hero .hero__actions .btn{width:auto;min-width:13rem}
  #hero .hero__inner{padding-bottom:9vh}
}
@media (min-width:1100px){
  #hero .hero__stack{max-width:58%}
}

#on-the-plate{position:relative;overflow:hidden;padding-block:clamp(3.25rem,2.5rem + 3.2vw,6rem)}
#on-the-plate .otp__grid{display:grid;grid-template-columns:1fr;gap:var(--sp-6)}
#on-the-plate .otp__figure{margin:0;margin-inline:calc(-1 * var(--gutter));background:#000}
#on-the-plate .otp__figure img{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 32%}
#on-the-plate h2{color:var(--c-dark-text);font-family:var(--f-display);font-weight:600;max-width:18ch}
#on-the-plate .otp__body{margin-top:var(--sp-4);color:rgba(244,240,250,.9);max-width:52ch}
#on-the-plate .otp__spec{margin-top:var(--sp-5)}
#on-the-plate .otp__spec > *{padding-block:2px}
@media (min-width:900px){
  #on-the-plate .otp__grid{grid-template-columns:1fr 1fr;gap:clamp(2rem,1.4rem + 3vw,4rem);align-items:end}
  #on-the-plate .otp__figure{margin-inline:0;margin-left:calc(-1 * ((100vw - min(100vw, var(--max-w)))/2 + var(--gutter)));height:min(72vh,100%);max-height:72vh}
  #on-the-plate .otp__figure img{aspect-ratio:auto;height:min(72vh,100%);max-height:72vh;object-fit:cover;object-position:50% 32%}
  #on-the-plate .otp__copy{padding-bottom:var(--sp-5)}
}

#what-the-machine-holds{position:relative;overflow:hidden}
#what-the-machine-holds .wmh__grid{display:grid;grid-template-columns:1fr;gap:var(--sp-6)}
#what-the-machine-holds .wmh__figure{margin:0}
#what-the-machine-holds .wmh__frame{display:block;background:#000}
#what-the-machine-holds .wmh__frame img{width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;object-position:50% 40%}
#what-the-machine-holds figcaption{color:var(--c-accent)}
#what-the-machine-holds h2{color:var(--c-dark-text);font-family:var(--f-display);font-weight:600;max-width:20ch}
#what-the-machine-holds .wmh__drawing{margin-top:var(--sp-5);max-width:420px}
#what-the-machine-holds .wmh__svg{width:100%;height:auto}
#what-the-machine-holds .wmh__lab{font-family:var(--f-mono);font-weight:500;font-size:14px;letter-spacing:1.6px;fill:#CA78EA;text-transform:uppercase}
#what-the-machine-holds .wmh__body{margin-top:var(--sp-5);color:rgba(244,240,250,.9);max-width:50ch}
#what-the-machine-holds .wmh__spec{margin-top:var(--sp-4)}
#what-the-machine-holds .wmh__spec > *{padding-block:2px}
#what-the-machine-holds .plate-rule--close{margin-top:var(--sp-8)}
@media (min-width:900px){
  #what-the-machine-holds .wmh__grid{grid-template-columns:1fr 1fr;gap:clamp(2rem,1.4rem + 3vw,4rem);align-items:start}
  #what-the-machine-holds .wmh__lab{font-size:13px}
}

#what-the-shop-builds{position:relative;overflow:hidden;background:var(--c-bg)}
#what-the-shop-builds h2{font-family:var(--f-display);font-weight:600;max-width:20ch}
#what-the-shop-builds .wsb__grid{display:grid;grid-template-columns:1fr;gap:var(--sp-4);margin-top:var(--sp-6)}
#what-the-shop-builds .wsb__card{display:flex;flex-direction:column}
#what-the-shop-builds .wsb__card h3{font-family:var(--f-display);font-weight:600;margin-bottom:var(--sp-3)}
#what-the-shop-builds .wsb__card p{font-size:1rem;max-width:44ch}
#what-the-shop-builds .card--dark p{color:rgba(244,240,250,.88)}
#what-the-shop-builds .wsb__card--light{border:1px solid var(--c-secondary);background:var(--c-surface)}
#what-the-shop-builds .wsb__strip{margin-top:var(--sp-6);padding-top:var(--sp-4);border-top:1px solid var(--c-secondary);display:flex;flex-direction:column;gap:var(--sp-3);align-items:flex-start}
#what-the-shop-builds .wsb__strip-line{margin:0;font-family:var(--f-mono);font-weight:500;font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;color:var(--c-secondary);max-width:none}
#what-the-shop-builds .wsb__strip-link{display:inline-flex;align-items:center;min-height:44px;font-family:var(--f-display);font-weight:600;font-size:1rem;color:var(--c-secondary)}
#what-the-shop-builds .wsb__strip-link:hover,#what-the-shop-builds .wsb__strip-link:focus-visible{color:var(--c-primary)}
@media (min-width:768px){
  #what-the-shop-builds .wsb__grid{grid-template-columns:1fr 1fr;gap:var(--sp-5)}
  #what-the-shop-builds .wsb__strip{flex-direction:row;align-items:center;justify-content:space-between;gap:var(--sp-5)}
}

#made-for-people-who-notice{position:relative;overflow:hidden;background:var(--c-bg);padding-block:clamp(2.25rem,1.9rem + 1.6vw,3.25rem)}
#made-for-people-who-notice .mfp__split{display:grid;grid-template-columns:1fr;gap:var(--sp-5);align-items:center}
#made-for-people-who-notice .mfp__rows{list-style:none;margin:0;padding:0}
#made-for-people-who-notice .mfp__rows li{padding-block:16px;font-family:var(--f-display);font-weight:600;font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--c-text)}
#made-for-people-who-notice .mfp__rows li + li{border-top:1px solid rgba(108,63,168,.2)}
#made-for-people-who-notice .mfp__figure{margin:0}
#made-for-people-who-notice .mfp__frame{display:block;background:#000}
#made-for-people-who-notice .mfp__frame img{width:100%;height:auto;aspect-ratio:1/1;object-fit:cover;object-position:50% 45%}
@media (min-width:768px){
  #made-for-people-who-notice .mfp__split{grid-template-columns:1fr 1fr;gap:clamp(2rem,1.5rem + 2vw,3.5rem)}
  #made-for-people-who-notice .mfp__figure{justify-self:end;width:100%;max-width:300px}
}

#the-shop{position:relative;overflow:hidden;background:var(--c-bg)}
#the-shop h2{font-family:var(--f-display);font-weight:600;max-width:22ch}
#the-shop .shop__split{display:grid;grid-template-columns:1fr;gap:var(--sp-6);margin-top:var(--sp-6)}
#the-shop .shop__copy p{font-size:1.125rem;line-height:1.6;max-width:62ch}
#the-shop .shop__facts{list-style:none;margin:0;padding:0}
#the-shop .shop__facts li{padding-block:16px;font-family:var(--f-display);font-weight:600;font-size:14px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-text)}
#the-shop .shop__facts li + li{border-top:1px solid var(--c-rule-light)}
#the-shop .shop__action{margin-top:var(--sp-6)}
#the-shop .shop__action .btn{width:100%}
#the-shop .plate-rule--close{margin-top:var(--sp-8)}
@media (min-width:768px){
  #the-shop .shop__action .btn{width:auto;min-width:13rem}
}
@media (min-width:900px){
  #the-shop .shop__split{grid-template-columns:1fr 1fr;gap:clamp(2rem,1.4rem + 3vw,4rem);align-items:start}
  #the-shop .shop__facts{padding-top:var(--sp-1)}
}