:root {
  --ink:oklch(21% .009 25);
  --paper:oklch(97% .008 75);
  --surface:oklch(99% .005 75);
  --red:oklch(52% .2 22);
  --red-dark:oklch(43% .17 22);
  --gold:oklch(80% .13 80);
  --text:var(--ink);
  --muted:oklch(45% .012 65);
  --border:oklch(87% .012 65);
  --radius:6px
}
html {
  scroll-padding-top:110px
}
body {
  font-size:16px
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible {
  outline:3px solid var(--red);
  outline-offset:4px
}
[hidden] {
  display:none!important
}
.wrap {
  width:min(1200px,calc(100% - 56px))
}
p {
  max-width:70ch
}
button,input,select,textarea {
  font:inherit
}
a.text-link {
  text-decoration:underline;
  text-decoration-thickness:1px;
  text-underline-offset:5px;
  font-weight:600
}
.button {
  min-height:48px;
  border-radius:5px;
  padding:14px 22px;
  color:var(--surface);
  font-size:.92rem;
  transition:background .2s,transform .2s
}
.button:hover {
  transform:translateY(-2px)
}
.button.outline {
  color:var(--ink);
  border:1px solid var(--border)
}
.button.outline:hover {
  background:var(--paper)
}
.button.light {
  background:var(--paper);
  color:var(--ink)
}
.button:disabled {
  opacity:.55;
  cursor:wait;
  transform:none
}
.skip-link {
  position:absolute;
  top:-100px;
  left:15px;
  background:var(--surface);
  padding:16px;
  z-index:100
}
.skip-link:focus {
  top:10px
}
.site-header {
  position:sticky;
  top:0;
  background:var(--paper);
  z-index:30;
  border-bottom:1px solid var(--border)
}
.header-row {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  min-height:88px
}
.brand {
  font-size:1.65rem;
  white-space:nowrap
}
.brand img {
  height:44px;
  width:44px;
  object-fit:contain;
  border-radius:50%
}
.site-header nav {
  position:static;
  display:flex;
  align-items:center;
  gap:24px;
  font-size:.82rem;
  border:0;
  background:transparent;
  backdrop-filter:none
}
.site-header nav>a:not(.button):hover {
  color:var(--red)
}
.cart-link span {
  background:var(--ink);
  color:var(--paper);
  padding:2px 6px;
  border-radius:50%;
  font-size:.72rem
}
.menu-toggle {
  display:none;
  min-height:44px;
  background:transparent;
  border:1px solid var(--border);
  padding:8px 14px
}
.home-hero {
  display:grid;
  grid-template-columns:1.08fr 1fr;
  gap:48px;
  align-items:center;
  padding:52px 0 66px
}
.home-hero h1 {
  font-size:clamp(4rem,7.3vw,7.2rem);
  line-height:.93;
  letter-spacing:.006em
}
.home-hero h1 span {
  color:var(--red)
}
.eyebrow {
  letter-spacing:.14em;
  font-size:.7rem
}
.hero-copy .lead {
  max-width:440px;
  font-size:1.06rem;
  margin:24px 0
}
.home-hero .actions {
  align-items:center;
  gap:22px
}
.hero-footnote {
  font-size:.76rem;
  color:var(--muted);
  margin-top:24px
}
.hero-photo {
  position:relative;
  min-width:0
}
.hero-photo>img {
  height:565px;
  width:100%;
  object-fit:cover;
  border-radius:120px 8px 8px 8px;
  filter:brightness(.83)
}
.photo-caption {
  position:absolute;
  bottom:28px;
  left:28px;
  right:28px;
  color:var(--surface);
  display:flex;
  align-items:end;
  justify-content:space-between;
  font-weight:600;
  font-size:1.2rem
}
.photo-caption a {
  font-size:2.5rem
}
.sewn-label {
  position:absolute;
  right:-15px;
  top:35px;
  background:var(--gold);
  padding:19px 22px;
  transform:rotate(7deg);
  outline:1px dashed var(--ink);
  outline-offset:-7px;
  font-size:.6rem;
  letter-spacing:.15em;
  text-align:center
}
.sewn-label b {
  font-family:var(--display);
  display:block;
  font-size:1.5rem;
  letter-spacing:.02em
}
.sewn-label small {
  font-size:.5rem
}
.service-ribbon {
  background:var(--red);
  color:var(--surface)
}
.service-ribbon .wrap {
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:18px 0;
  font-family:var(--display);
  font-size:1.45rem;
  letter-spacing:.07em
}
.making {
  padding:78px 0 90px
}
.section-head h2 {
  font-size:3.3rem
}
.service-mosaic {
  display:grid;
  grid-template-columns:1.3fr 1fr;
  gap:24px
}
.service-tile {
  position:relative;
  overflow:hidden;
  background:var(--ink);
  color:var(--surface);
  min-height:345px;
  border-radius:6px
}
.service-tile img {
  width:100%;
  height:345px;
  object-fit:cover;
  opacity:.58;
  transition:transform .35s ease-out
}
.service-tile:hover img {
  transform:scale(1.035)
}
.service-tile>div {
  position:absolute;
  bottom:25px;
  left:28px;
  right:28px
}
.service-tile h3 {
  font-size:2.65rem;
  margin:5px 0 10px;
  display:flex;
  justify-content:space-between
}
.service-tile p {
  margin:0;
  max-width:42ch;
  font-size:.88rem
}
.service-tile small {
  font-size:.7rem
}
.tile-1 img,.tile-3 img {
  object-position:center
}
.choose-path {
  background:oklch(92% .014 65);
  padding:65px 0
}
.path-layout {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:70px
}
.path-layout h2 {
  font-size:3.3rem
}
.paths>a {
  display:flex;
  gap:22px;
  align-items:start;
  padding:22px 0;
  border-bottom:1px solid var(--border)
}
.paths>a:first-child {
  padding-top:0
}
.paths h3 {
  font-size:1.9rem
}
.paths p {
  font-size:.88rem;
  margin:9px 0 0
}
.path-number {
  color:var(--red);
  font-family:var(--display);
  font-size:1.8rem
}
.process-feature {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:75px;
  align-items:center;
  padding:85px 0
}
.process-feature h2 {
  font-size:3.5rem
}
.process-illustration {
  background:oklch(93% .014 65);
  padding:28px;
  border-radius:10px;
  text-align:center
}
.process-illustration svg {
  width:100%;
  height:auto;
  max-height:320px
}
.motion-button {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:99px;
  min-height:44px;
  padding:10px 20px;
  cursor:pointer;
  font-size:.8rem
}
.stitch-path {
  stroke-dasharray:650;
  stroke-dashoffset:0
}
.is-playing .stitch-path {
  animation:stitch 3s ease-out 1
}
.layer-demo {
  height:250px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center
}
.layer-demo span {
  background:var(--red);
  color:var(--surface);
  border:2px dashed var(--paper);
  padding:17px;
  width:210px;
  transform:rotate(-9deg);
  margin:-4px;
  z-index:3
}
.layer-demo span:nth-child(2) {
  background:var(--ink);
  z-index:2
}
.layer-demo span:nth-child(3) {
  background:var(--muted);
  z-index:1
}
.is-playing .layer-demo span:first-child {
  animation:lift 2.5s ease-out
}
.is-playing .layer-demo span:last-child {
  animation:lower 2.5s ease-out
}
.press-demo {
  height:250px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column
}
.press-top {
  padding:24px;
  width:250px;
  background:var(--ink);
  color:var(--paper);
  border-radius:12px 12px 0 0;
  transform:translateY(-32px)
}
.transfer-layer {
  background:var(--red);
  color:var(--surface);
  padding:6px 20px
}
.garment-layer {
  background:var(--gold);
  padding:14px;
  width:270px
}
.is-playing .press-top {
  animation:press 2.5s ease-out
}
.caption {
  font-size:.75rem;
  color:var(--muted);
  margin:14px auto 0
}
.shop-story {
  display:grid;
  grid-template-columns:1.1fr 1fr;
  gap:65px;
  align-items:center;
  padding:0 0 85px
}
.shop-story img {
  width:100%;
  height:380px;
  object-fit:cover;
  border-radius:6px
}
.shop-story h2 {
  font-size:3.5rem
}
.order-banner {
  background:var(--red);
  color:var(--surface);
  padding:48px 0
}
.order-banner>.wrap {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px
}
.order-banner h2 {
  font-size:3rem
}
.order-banner p {
  margin-bottom:0
}
footer {
  margin:0;
  background:var(--ink);
  color:var(--paper);
  padding:55px 0 20px;
  font-size:.82rem
}
.footer-grid {
  display:grid;
  grid-template-columns:2fr 1fr 1fr;
  gap:40px
}
.footer-grid h3 {
  font-family:var(--body);
  font-size:.9rem;
  margin-bottom:22px
}
.footer-grid address {
  font-style:normal
}
.footer-grid a {
  margin:10px 0
}
.footer-bottom {
  display:flex;
  gap:28px;
  border-top:1px solid oklch(38% .008 25);
  margin-top:35px;
  padding-top:22px;
  font-size:.7rem
}
.footer-bottom span {
  margin-right:auto
}
.page-intro {
  padding:60px 0 32px
}
.page-intro h1 {
  font-size:clamp(3.5rem,7vw,6rem);
  max-width:850px
}
.page-intro .lead {
  max-width:660px
}
.service-hero {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:65px;
  align-items:center;
  padding:50px 0 60px
}
.service-hero h1 {
  font-size:clamp(3.5rem,6vw,5.7rem);
  margin:25px 0
}
.service-hero>img {
  width:100%;
  height:440px;
  object-fit:cover;
  border-radius:7px
}
.breadcrumb {
  font-size:.75rem;
  color:var(--muted);
  text-decoration:underline
}
.service-minimum {
  font-size:.8rem;
  margin:24px 0
}
.article-layout {
  display:grid;
  grid-template-columns:260px 1fr;
  gap:80px;
  padding:50px 0 80px
}
.contents {
  align-self:start;
  position:sticky;
  top:120px
}
.contents h3 {
  font-size:1.6rem
}
.contents a {
  display:block;
  font-size:.8rem;
  margin:16px 0
}
.guide {
  max-width:70ch
}
.guide section {
  padding:26px 0
}
.guide h2 {
  font-size:2.1rem;
  line-height:1.05
}
.guide p {
  color:var(--muted);
  line-height:1.8
}
.guide a {
  text-decoration:underline
}
.agent-guide {
  padding-bottom:65px
}
.patch-specimens {
  display:flex;
  gap:20px;
  justify-content:center;
  background:oklch(93% .014 65);
  padding:25px 28px
}
.patch-specimens figure {
  margin:0;
  flex:1;
  max-width:215px
}
.patch-specimens img {
  width:100%;
  height:155px;
  object-fit:cover;
  border-radius:6px
}
.patch-specimens figcaption {
  font-size:.8rem;
  font-weight:600;
  padding-top:9px
}
.guide-list {
  padding-bottom:75px
}
.guide-row {
  display:grid;
  grid-template-columns:210px 1fr 30px;
  align-items:center;
  gap:35px;
  padding:27px 0;
  border-bottom:1px solid var(--border)
}
.guide-row img {
  width:210px;
  height:155px;
  object-fit:cover;
  border-radius:6px
}
.guide-row h2 {
  font-size:2.6rem;
  margin:8px 0
}
.guide-row small {
  color:var(--red);
  font-size:.75rem
}
.guide-row p {
  font-size:.9rem
}
.guide-row>span {
  font-size:2rem
}
.shop-section {
  padding:28px 0 48px
}
.pricing-note {
  font-size:.88rem;
  color:var(--muted);
  max-width:85ch
}
.product-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:32px;
  margin-top:30px
}
.product {
  display:flex;
  flex-direction:column;
  border-bottom:1px solid var(--border);
  padding-bottom:26px
}
.product img {
  width:100%;
  height:225px;
  object-fit:cover;
  border-radius:6px
}
.product h3 {
  font-size:1.8rem;
  margin:20px 0 8px
}
.product p {
  font-size:.83rem;
  color:var(--muted)
}
.product .button {
  align-self:start;
  margin-top:auto
}
.product strong {
  display:block;
  margin:8px 0
}
.empty-offers {
  padding:22px;
  background:oklch(93% .014 65);
  border-radius:6px;
  max-width:850px
}
.empty-offers p {
  margin:0
}
.catalog-link {
  padding:40px 0 70px
}
.catalog-link h2 {
  font-size:2.5rem
}
.pricing-example {
  padding:30px 0;
  border-bottom:1px solid var(--border)
}
.pricing-example h2 {
  font-size:2.2rem
}
.cart-layout {
  display:grid;
  grid-template-columns:1.5fr 1fr;
  gap:60px;
  padding:30px 0 80px;
  min-height:340px
}
.cart-summary {
  background:oklch(93% .014 65);
  padding:26px;
  align-self:start
}
.cart-summary h2 {
  font-size:2.2rem
}
.cart-summary p {
  font-size:.88rem
}
.cart-summary .text-link {
  display:block;
  margin-top:20px
}
.cart-line {
  display:grid;
  grid-template-columns:90px 1fr;
  gap:22px;
  padding:24px 0;
  border-bottom:1px solid var(--border)
}
.cart-line img {
  width:90px;
  height:100px;
  object-fit:cover
}
.cart-line h3 {
  font-size:1.6rem
}
.cart-line p {
  font-size:.8rem
}
.remove {
  background:none;
  border:0;
  text-decoration:underline;
  color:var(--red);
  cursor:pointer;
  min-height:44px;
  padding:0
}
.builder-heading {
  padding:35px 0 26px
}
.builder-heading h1 {
  font-size:3.5rem;
  margin-top:15px
}
.builder-heading p {
  font-size:.88rem
}
.builder-layout {
  display:grid;
  grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);
  gap:40px;
  padding-bottom:70px
}
#order-form {
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:10px;
  padding:32px;
  min-height:540px
}
.builder-progress {
  display:flex;
  align-items:center;
  gap:24px;
  margin-bottom:35px;
  font-size:.7rem;
  color:var(--muted)
}
progress {
  height:6px;
  width:100%;
  accent-color:var(--red);
  border:0
}
#step-content h2 {
  font-size:2.8rem;
  line-height:1.05
}
#step-content>p {
  font-size:.9rem;
  color:var(--muted)
}
.choices {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin:26px 0
}
.choice-option {
  border:1px solid var(--border);
  border-radius:6px;
  cursor:pointer;
  min-height:85px;
  text-align:left;
  padding:16px;
  background:var(--paper)
}
.choice-option[aria-pressed="true"] {
  border:2px solid var(--red);
  background:oklch(96% .023 22);
  padding:15px;
  color:var(--red-dark)
}
.choice-option strong {
  font-size:.95rem;
  display:block
}
.choice-option small {
  display:block;
  font-size:.73rem;
  margin-top:5px;
  color:var(--muted)
}
.builder-nav {
  display:flex;
  justify-content:space-between;
  gap:20px;
  margin-top:30px
}
.builder-nav #next-step {
  margin-left:auto
}
.order-overview {
  padding:22px 0;
  align-self:start;
  position:sticky;
  top:115px
}
.order-overview h2 {
  font-size:2.3rem
}
dl>div {
  padding:15px 0;
  border-bottom:1px solid var(--border)
}
dt {
  font-size:.7rem;
  color:var(--muted)
}
dd {
  margin:4px 0 0;
  font-size:.88rem;
  overflow-wrap:anywhere
}
.human-help {
  margin-top:26px;
  padding:20px;
  background:oklch(93% .014 65);
  border-radius:6px;
  font-size:.8rem
}
.human-help p {
  margin:8px 0
}
.human-help a {
  text-decoration:underline
}
.field {
  margin-top:20px
}
.field label {
  text-transform:none;
  font-size:.82rem;
  letter-spacing:0;
  color:var(--ink)
}
.field input,.field select,.field textarea {
  border-width:1px;
  background:var(--surface);
  font-size:16px;
  min-height:48px
}
.field small {
  color:var(--muted);
  font-size:.75rem;
  display:block;
  margin:6px 0
}
.check-label {
  display:flex;
  align-items:flex-start;
  gap:10px;
  margin-top:18px;
  font-size:.83rem;
  text-transform:none;
  letter-spacing:0;
  font-weight:400;
  line-height:1.5;
  color:var(--ink)
}
.check-label input {
  width:20px;
  min-height:20px;
  height:20px;
  flex:none;
  margin:2px 0
}
.form-error {
  color:var(--red-dark);
  padding:12px;
  background:oklch(96% .023 22);
  font-size:.85rem
}
.step-enter {
  animation:step-in .22s ease-out
}
.review-table {
  margin-top:20px
}
.review-table div {
  display:grid;
  grid-template-columns:1fr 1.5fr;
  gap:15px;
  padding:12px 0;
  border-bottom:1px solid var(--border);
  font-size:.8rem;
  overflow-wrap:anywhere
}
.review-table span {
  white-space:pre-wrap
}
.customer-panel {
  padding:25px 0 90px;
  min-height:300px;
  max-width:850px
}
.customer-panel h2 {
  font-size:2.5rem
}
.status-pill {
  display:inline-block;
  background:oklch(92% .025 140);
  padding:8px 13px;
  border-radius:5px;
  font-size:.8rem
}
.private-link {
  overflow-wrap:anywhere;
  font-size:.8rem
}
.contact-layout {
  display:grid;
  grid-template-columns:1fr 1.3fr;
  gap:55px;
  padding:30px 0 80px
}
.contact-layout h2 {
  font-size:2.5rem
}
.contact-layout address {
  font-style:normal;
  margin-top:24px
}
.contact-layout img {
  width:100%;
  height:380px;
  object-fit:cover;
  border-radius:7px
}
.toast {
  position:fixed;
  bottom:24px;
  left:50%;
  transform:translateX(-50%);
  background:var(--ink);
  color:var(--surface);
  padding:14px 22px;
  border-radius:6px;
  z-index:60;
  font-size:.85rem;
  width:max-content;
  max-width:calc(100% - 32px)
}
@keyframes stitch {
  from {
    stroke-dashoffset:650
  }
  to {
    stroke-dashoffset:0
  }

}
@keyframes lift {
  0%,100% {
    transform:rotate(-9deg)
  }
  50% {
    transform:translateY(-28px) rotate(-9deg)
  }

}
@keyframes lower {
  0%,100% {
    transform:rotate(-9deg)
  }
  50% {
    transform:translateY(28px) rotate(-9deg)
  }

}
@keyframes press {
  0%,100% {
    transform:translateY(-32px)
  }
  40%,70% {
    transform:translateY(0)
  }

}
@keyframes step-in {
  from {
    opacity:.2;
    transform:translateY(7px)
  }
  to {
    opacity:1;
    transform:translateY(0)
  }

}
@media(max-width:1050px) {
  .site-header nav {
    gap:14px;
    font-size:.75rem
  }
  .brand {
    font-size:1.4rem
  }
  .brand img {
    width:36px;
    height:36px
  }
  .site-header nav .button {
    padding:12px
  }
  .home-hero {
    gap:30px
  }
  .home-hero h1 {
    font-size:6rem
  }
  .hero-photo>img {
    height:510px
  }

}
@media(max-width:850px) {
  .wrap {
    width:calc(100% - 36px)
  }
  .menu-toggle {
    display:block
  }
  .site-header nav {
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    padding:20px;
    background:var(--paper);
    border-bottom:1px solid var(--border);
    flex-direction:column;
    align-items:stretch;
    gap:3px;
    font-size:.95rem
  }
  .site-header nav.is-open {
    display:flex
  }
  .site-header nav>a {
    padding:12px
  }
  .header-row {
    min-height:72px
  }
  .home-hero {
    gap:25px;
    padding-top:35px
  }
  .home-hero h1 {
    font-size:4.4rem
  }
  .hero-photo>img {
    height:440px
  }
  .sewn-label {
    right:0;
    top:20px;
    padding:13px
  }
  .hero-copy .lead {
    font-size:.95rem
  }
  .home-hero .actions {
    gap:18px
  }
  .service-ribbon .wrap {
    font-size:1.1rem;
    gap:10px
  }
  .path-layout {
    gap:35px
  }
  .process-feature {
    gap:30px
  }
  .shop-story {
    gap:30px
  }
  .product-grid {
    grid-template-columns:1fr 1fr
  }
  .article-layout {
    grid-template-columns:190px 1fr;
    gap:35px
  }
  .service-hero {
    gap:35px
  }
  .builder-layout {
    gap:25px;
    grid-template-columns:minmax(0,1.8fr) minmax(0,1fr)
  }
  #order-form {
    padding:24px
  }
  .choices {
    grid-template-columns:1fr
  }
  .footer-grid {
    grid-template-columns:1.5fr 1fr 1fr
  }

}
@media(max-width:600px) {
  .top .wrap {
    height:32px;
    font-size:.68rem
  }
  .top .wrap>span {
    display:none
  }
  .home-hero {
    grid-template-columns:1fr;
    padding:30px 0 38px;
    gap:32px
  }
  .home-hero h1 {
    font-size:clamp(4.1rem,17vw,6rem)
  }
  .hero-copy .lead {
    font-size:1rem
  }
  .hero-photo>img {
    height:345px;
    border-top-left-radius:75px
  }
  .hero-footnote {
    margin-top:18px
  }
  .sewn-label {
    right:9px
  }
  .photo-caption {
    left:20px;
    bottom:20px;
    font-size:1rem
  }
  .service-ribbon .wrap {
    flex-wrap:wrap;
    justify-content:center;
    font-size:1rem;
    column-gap:15px;
    padding:12px 0
  }
  .service-ribbon span:nth-child(4) {
    display:none
  }
  .making {
    padding:46px 0
  }
  .section-head {
    display:block
  }
  .section-head h2 {
    font-size:2.7rem;
    margin-bottom:16px
  }
  .service-mosaic {
    grid-template-columns:1fr;
    gap:18px
  }
  .service-tile,.service-tile img {
    min-height:280px;
    height:280px
  }
  .service-tile>div {
    left:22px;
    right:22px;
    bottom:22px
  }
  .service-tile h3 {
    font-size:2.4rem
  }
  .path-layout,.process-feature,.shop-story,.service-hero,.contact-layout,.cart-layout {
    grid-template-columns:1fr;
    gap:28px
  }
  .choose-path {
    padding:40px 0
  }
  .path-layout h2,.process-feature h2,.shop-story h2 {
    font-size:3rem
  }
  .process-feature {
    padding:45px 0
  }
  .shop-story {
    padding-bottom:45px
  }
  .shop-story img {
    height:290px
  }
  .order-banner .wrap {
    display:block
  }
  .order-banner h2 {
    font-size:2.7rem
  }
  .order-banner .button {
    margin-top:24px
  }
  .footer-grid {
    grid-template-columns:1fr 1fr;
    gap:30px
  }
  .footer-grid>div:first-child {
    grid-column:1/-1
  }
  .footer-bottom {
    flex-wrap:wrap;
    gap:12px 20px
  }
  .footer-bottom span {
    width:100%
  }
  .page-intro {
    padding-top:35px
  }
  .page-intro h1 {
    font-size:3.6rem
  }
  .service-hero {
    padding:30px 0
  }
  .service-hero h1 {
    font-size:3.8rem;
    margin:20px 0
  }
  .service-hero>img {
    height:300px
  }
  .article-layout {
    display:block;
    padding:25px 0 45px
  }
  .contents {
    position:static;
    padding-bottom:25px
  }
  .contents a {
    margin:12px 0
  }
  .guide h2 {
    font-size:2rem
  }
  .guide-row {
    grid-template-columns:100px 1fr;
    gap:18px
  }
  .guide-row img {
    width:100px;
    height:120px
  }
  .guide-row h2 {
    font-size:2rem
  }
  .guide-row p {
    font-size:.8rem
  }
  .guide-row>span {
    display:none
  }
  .patch-specimens {
    overflow:auto;
    justify-content:start;
    padding:20px 18px
  }
  .patch-specimens figure {
    min-width:155px
  }
  .patch-specimens img {
    height:130px
  }
  .product-grid {
    grid-template-columns:1fr;
    gap:28px
  }
  .product img {
    height:260px
  }
  .shop-section {
    padding-top:15px
  }
  .cart-layout {
    padding-top:10px
  }
  .builder-heading {
    padding-top:25px
  }
  .builder-heading h1 {
    font-size:3rem
  }
  .builder-layout {
    display:flex;
    flex-direction:column;
    padding-bottom:40px
  }
  .order-overview {
    position:static;
    order:2;
    padding-top:0
  }
  .order-overview dl {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 20px
  }
  #order-form {
    padding:22px;
    min-height:460px
  }
  .choices {
    grid-template-columns:1fr 1fr
  }
  .choice-option {
    min-height:92px;
    padding:12px
  }
  .choice-option[aria-pressed="true"] {
    padding:11px
  }
  .choice-option strong {
    font-size:.84rem
  }
  .choice-option small {
    font-size:.68rem
  }
  #step-content h2 {
    font-size:2.4rem
  }
  .builder-nav .button {
    padding:12px 17px
  }
  .review-table div {
    grid-template-columns:1fr
  }
  .contact-layout img {
    height:290px
  }
  .guide-list {
    padding-bottom:40px
  }

}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .button:hover,.service-tile:hover img {
    transform:none
  }

}
@media(max-width:850px) {
  html:not(.has-js) .menu-toggle {
    display:none
  }
  html:not(.has-js) .header-row {
    flex-wrap:wrap;
    padding:15px 0
  }
  html:not(.has-js) .site-header nav {
    position:static;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    width:100%;
    padding:0
  }
  html:not(.has-js) .site-header {
    position:static
  }

}

/* Material studies keep the full product visible and load motion on demand. */
.home-hero:has(.concept-photo) { grid-template-columns: .85fr 1.3fr; gap: 40px; }
.concept-photo, .finish-film { margin: 0; min-width: 0; }
.hero-photo.concept-photo > img { display: block; height: auto; aspect-ratio: 1920 / 1072; width: 100%; object-fit: contain; border-radius: 3px; filter: none; }
.concept-photo figcaption, .finish-film figcaption { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding: 12px 0; font-size: .78rem; color: var(--ink); }
.concept-photo figcaption span, .finish-film figcaption span, .media-note { color: var(--muted); font-size: .72rem; }
.finish-film video { display: block; width: 100%; height: auto; aspect-ratio: 1920 / 1072; background: #eae4da; border-radius: 3px; }
.media-note { margin-top: 12px; margin-bottom: 24px; }
@media (max-width: 900px) { .home-hero:has(.concept-photo) { grid-template-columns: 1fr; gap: 28px; } }
