:root {
  --sc-canvas:#090a0c;
  --sc-surface:#111315;
  --sc-ink:#f1f1ed;
  --sc-ink-soft:#a4a8ac;
  --sc-accent:#e4efc3;
  --sc-accent-ink:#090a0c;
  --sc-font-display:"Bahnschrift","Arial",sans-serif;
  --sc-font-text:"Arial","Helvetica Neue",sans-serif;
  --sc-r-sm:0;
  --line:#303438;
  --gutter:clamp(24px,4.2vw,80px);
  --ease:cubic-bezier(.23,1,.32,1);
}
html {scroll-padding-top:80px;scrollbar-gutter:stable;}
html.dialog-is-open {overflow:hidden;}
body {font-size:15px;line-height:1.6;letter-spacing:.005em;}
button,a,input,label {-webkit-tap-highlight-color:transparent;}
button {border:0;cursor:pointer;}
button:disabled {cursor:default;opacity:.5;}
button:active,a:active {translate:0 1px;}
a {text-decoration:none;}
p,h1,h2,h3,figure,dl,dd {margin:0;}
h1,h2,h3 {font-family:var(--sc-font-display);font-weight:400;line-height:1.04;letter-spacing:-.045em;text-wrap:balance;}
svg {overflow:visible;}
button svg,.text-link svg {width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.2;}
fieldset {margin:0;padding:0;border:0;min-inline-size:0;}
legend {padding:0;}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0;}
.skip-link {position:fixed;top:8px;left:8px;z-index:200;padding:12px 20px;background:var(--sc-ink);color:var(--sc-canvas);transform:translateY(-160%);}
.skip-link:focus {transform:none;}
.site-header {height:80px;position:sticky;top:0;z-index:60;background:var(--sc-canvas);display:flex;align-items:center;justify-content:space-between;padding-inline:var(--gutter);border-bottom:1px solid #23262a;gap:28px;}
.wordmark {display:inline-flex;align-items:center;gap:.28em;font-family:var(--sc-font-display);font-size:24px;letter-spacing:-.065em;line-height:1;white-space:nowrap;}
.wordmark span {font-family:Arial,sans-serif;font-size:29px;font-weight:400;color:#888e94;margin-inline:4px;}
.site-header nav {display:flex;gap:40px;margin-left:50px;}
.site-header nav a {font-size:12px;color:#c1c5c7;line-height:44px;position:relative;}
.site-header nav a::after {position:absolute;content:"";height:1px;background:var(--sc-ink);left:0;right:0;bottom:6px;transform:scaleX(0);transform-origin:left;transition:transform 180ms var(--ease);}
.site-header nav a[aria-current="location"] {color:var(--sc-ink);}
.site-header nav a[aria-current="location"]::after {transform:scaleX(1);}
.basket-toggle {display:flex;align-items:center;gap:12px;background:none;padding:8px 0 8px 12px;font-size:12px;min-height:44px;}
.basket-count {display:inline-grid;place-items:center;min-width:25px;height:25px;border:1px solid #656a6d;font-size:11px;font-variant-numeric:tabular-nums;}
.hero {position:relative;scroll-margin-top:0;}
.concept-note {height:40px;padding-inline:var(--gutter);display:flex;align-items:center;justify-content:center;gap:9px;font-size:10px;letter-spacing:.035em;color:#aeb3b6;border-bottom:1px solid #1d2023;}
.status-dot {width:4px;height:4px;background:#b7bdbe;border-radius:50%;}
.hero-stage {position:relative;isolation:isolate;height:calc(100svh - 120px);min-height:630px;max-height:1080px;overflow:hidden;background:radial-gradient(ellipse at 50% 43%,#1a1d21 0%,#101215 31%,#090a0c 67%);}
.hero-rear {position:absolute;inset:-5% 13%;color:#4e555d;opacity:.65;transform:translate3d(var(--rear-x,0px),var(--rear-y,0px),0);transition:transform 420ms var(--ease);z-index:0;pointer-events:none;}
.contour {width:100%;height:100%;}
.hero-object {position:absolute;width:min(69vw,calc(100svh - 146px),900px);height:min(69vw,calc(100svh - 146px),900px);left:50%;top:47%;transform:translate(-50%,-50%) perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translate3d(var(--product-x,0px),var(--product-y,0px),0);transition:transform 440ms var(--ease);z-index:2;pointer-events:none;}
.hero-float {width:100%;height:100%;animation:float 7s ease-in-out infinite;animation-play-state:paused;}
.hero.is-in-view .hero-float {animation-play-state:running;}
.hero-object img {width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 36px 28px #0005);}
.hero-meta {position:absolute;display:flex;gap:18px;align-items:center;z-index:3;color:#aab0b7;font-size:9px;line-height:1.8;letter-spacing:.08em;}
.hero-meta--left {left:var(--gutter);top:21%;}
.hero-meta--right {right:var(--gutter);top:37%;text-align:right;}
.cross {font-size:20px;font-weight:300;color:#bac1c5;}
.hero-copy {position:absolute;z-index:4;left:var(--gutter);bottom:10%;}
.hero-copy h1 {font-size:clamp(44px,4vw,65px);line-height:.98;letter-spacing:-.055em;margin-bottom:27px;}
.text-link {display:inline-flex;align-items:center;justify-content:space-between;gap:35px;min-height:44px;border-bottom:1px solid #9aa09f;font-size:12px;}
.text-link svg {transition:transform 180ms var(--ease);}
.hero-caption {position:absolute;z-index:3;right:var(--gutter);bottom:11.5%;color:#b9bfc4;font-size:12px;line-height:1.7;}
.hero-caption-bottom {position:absolute;right:var(--gutter);bottom:3%;font-size:8px;letter-spacing:.13em;color:#8f969c;}
.section {scroll-margin-top:0;}
.details {display:grid;grid-template-columns:1.14fr 1fr;min-height:790px;align-items:center;position:relative;overflow:hidden;border-top:1px solid #24282b;}
.detail-media {align-self:stretch;position:relative;min-height:790px;overflow:hidden;background:radial-gradient(ellipse at 43% 48%,#20252b,#101215 45%,#090a0c 75%);}
.detail-media::after {position:absolute;inset:0;content:"";pointer-events:none;background:linear-gradient(90deg,transparent 70%,#090a0c),linear-gradient(0deg,#090a0c,transparent 18%);}
.detail-media img {width:156%;height:125%;max-width:none;object-fit:contain;position:absolute;left:-36%;top:6%;transform:rotate(-14deg) scale(1.3);transform-origin:50% 28%;}
.detail-cross {position:absolute;left:var(--gutter);top:70px;z-index:2;color:#c2c6ca;font-size:24px;font-weight:300;}
.image-caption {position:absolute;left:var(--gutter);bottom:58px;font-size:9px;letter-spacing:.06em;color:#abb1b8;z-index:2;}
.detail-copy {padding:100px var(--gutter) 100px 7%;position:relative;z-index:3;}
h2 {font-size:clamp(48px,6.1vw,90px);}
.section-intro {margin:30px 0 48px;color:#aeb4ba;font-size:14px;line-height:1.7;}
.feature-list {border-top:1px solid var(--line);}
.feature-list>div {display:grid;grid-template-columns:1fr 1.45fr;gap:16px;align-items:center;min-height:70px;border-bottom:1px solid var(--line);font-size:12px;}
.feature-list dt {color:#9da5ad;}
.feature-list dd {color:#e0e3e4;}
.fine-print {font-size:10px;color:#929ca5;line-height:1.75;letter-spacing:.01em;}
.detail-copy>.fine-print {margin-top:25px;}
.collection {padding:124px var(--gutter) 120px;border-top:1px solid #25292c;}
.collection-heading {display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:60px;}
.collection-heading p,.material-heading p {font-size:13px;color:#aeb5bc;line-height:1.75;max-width:34ch;padding-bottom:5px;}
.model-grid {display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;}
.model {min-width:0;}
.model-sprite {background-image:url("assets/puffer-catalog-technical-v5.png");background-size:200% 200%;background-repeat:no-repeat;background-color:#090a0c;}
.sprite-lime {background-position:0 0;}
.sprite-rose {background-position:100% 0;}
.sprite-ember {background-position:0 100%;}
.sprite-ice {background-position:100% 100%;}
.model-image {display:block;width:100%;aspect-ratio:1;position:relative;border-bottom:1px solid #3a3f44;transition:border-color 160ms var(--ease),transform 240ms var(--ease);}
.model-index {position:absolute;left:15px;top:12px;z-index:1;font-size:8px;letter-spacing:.1em;color:#b7bfc5;}
.selection-mark {position:absolute;right:12px;bottom:12px;font-size:8px;text-transform:uppercase;letter-spacing:.09em;color:#edf3ed;opacity:0;transition:opacity 140ms;}
.model.is-selected .model-image {border-color:var(--sc-ink);}
.model.is-selected .selection-mark {opacity:1;}
.model-label {display:flex;align-items:center;justify-content:space-between;padding:20px 0 10px;}
.model-label h3 {font-size:20px;letter-spacing:-.025em;}
.color-dot {width:7px;height:7px;background:var(--swatch);border-radius:50%;}
.model-open {display:flex;width:100%;align-items:center;justify-content:space-between;background:none;border-bottom:1px solid var(--line);padding:9px 0 17px;font-size:11px;color:#aeb5bc;min-height:44px;}
.model-open>span[aria-hidden] {font-size:17px;color:#ecefed;}
.collection-bottom {display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:42px;}
.collection-bottom>p {font-size:12px;min-width:150px;color:#c3cacf;}
.collection-bottom>.fine-print {margin-left:auto;}
.button {display:inline-flex;align-items:center;justify-content:space-between;min-height:50px;padding:14px 22px;gap:30px;font-size:12px;line-height:1.3;white-space:nowrap;transition:background-color 160ms,color 160ms,transform 160ms;}
.button-light {background:#e6e8e2;color:#141718;}
.button-light:focus-visible {outline-color:#e4efc3;outline-offset:4px;}
.material {border-top:1px solid #25292c;padding:115px var(--gutter) 94px;}
.material-heading {display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:45px;}
.material-layout {display:grid;grid-template-columns:1.55fr 1fr;gap:7%;align-items:center;}
.material-drawing {height:510px;position:relative;min-width:0;isolation:isolate;}
.plane-stack {position:absolute;width:100%;height:100%;perspective:1100px;left:-2%;top:-15px;}
.fabric-plane {position:absolute;width:76%;height:57%;left:2%;transform:rotateX(57deg) rotateZ(-31deg);transform-style:preserve-3d;border:1px solid #727c84;border-radius:9px;box-shadow:0 24px 26px -12px #0009;overflow:hidden;transition:opacity 240ms,border-color 240ms;}
.fabric-plane>span {position:absolute;inset:0;}
.fabric-plane>i {position:absolute;inset:12px;border:1px dashed #b4c0cb36;border-radius:4px;}
.plane-1 {top:0;z-index:3;background:linear-gradient(153deg,#434b54,#171b20 30%,#343c45 36%,#181c22 58%,#3d4650 74%,#111519);}
.plane-1>span {background:repeating-linear-gradient(0deg,transparent 0 22%,#a0a9af24 23%,#05080b 24%,transparent 25%),repeating-linear-gradient(90deg,#c4d2e20a 0 1px,transparent 1px 3px);box-shadow:inset 0 2px 0 #afbecf3b,inset 0 -12px 14px #080c10;}
.plane-2 {top:100px;z-index:2;background:linear-gradient(130deg,#a9afb0,#596264 50%,#989e9d);border-color:#aeb8ba;}
.plane-2>span {background:repeating-radial-gradient(ellipse at 15% 20%,#cbd3cd22 0 1px,#66717118 2px 4px);box-shadow:inset 0 3px 5px #e8eeee3a,inset 0 -8px 9px #161d1f9e;}
.plane-3 {top:200px;z-index:1;background:linear-gradient(130deg,#34434a,#14252d 50%,#3b484d);}
.plane-3>span {background:repeating-linear-gradient(0deg,#c3d3d51a 0 1px,transparent 1px 3px),repeating-linear-gradient(90deg,#bfd2db14 0 1px,transparent 1px 3px);}
.material-drawing[data-active="1"] .plane-2,.material-drawing[data-active="1"] .plane-3,.material-drawing[data-active="2"] .plane-1,.material-drawing[data-active="2"] .plane-3,.material-drawing[data-active="3"] .plane-1,.material-drawing[data-active="3"] .plane-2 {opacity:.54;}
.material-drawing[data-active="1"] .plane-1,.material-drawing[data-active="2"] .plane-2,.material-drawing[data-active="3"] .plane-3 {border-color:#edf3ed;}
.material-lines {position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:4;}
.callout {stroke:#c9d1d3;stroke-width:1;opacity:.2;transition:opacity 200ms;}
.material-drawing[data-active="1"] .callout-1,.material-drawing[data-active="2"] .callout-2,.material-drawing[data-active="3"] .callout-3 {opacity:1;}
.hotspot {position:absolute;z-index:5;left:86%;width:44px;height:44px;display:grid;place-items:center;background:#0c1013;border:1px solid #6a767f;border-radius:50%;font-size:10px;font-variant-numeric:tabular-nums;transition:background-color 160ms,color 160ms;}
.hotspot-1 {top:calc(17.65% - 22px);}
.hotspot-2 {top:calc(48.04% - 22px);}
.hotspot-3 {top:calc(78.43% - 22px);}
.hotspot[aria-pressed="true"] {background:#e0e5df;color:#101619;border-color:#e0e5df;}
.hotspot:focus-visible {outline-offset:5px;border-radius:50%;}
.drawing-caption {position:absolute;bottom:0;left:0;font-size:9px;color:#99a4ae;line-height:1.8;}
.material-kicker {font-size:9px;letter-spacing:.15em;color:#9ba7af;margin-bottom:22px;}
.material-description {min-height:165px;}
.material-description h3 {font-size:31px;letter-spacing:-.03em;margin-bottom:18px;}
.material-description p {font-size:13px;line-height:1.8;color:#aeb8bf;max-width:40ch;}
.layer-list {margin-top:25px;border-top:1px solid var(--line);}
.layer-list button {width:100%;min-height:57px;display:flex;align-items:center;gap:20px;background:none;border-bottom:1px solid var(--line);font-size:12px;color:#a1acb3;text-align:left;padding:10px 0;}
.layer-list button>span:first-child {font-size:9px;color:#91a0a8;font-variant-numeric:tabular-nums;}
.layer-list button[aria-pressed="true"] {color:#f1f3ef;}
.layer-plus {margin-left:auto;font-size:21px;font-weight:300;}
.layer-list button[aria-pressed="true"] .layer-plus {transform:rotate(45deg);}
.material-info>.fine-print {margin-top:25px;}
.site-footer {padding:58px var(--gutter) 33px;border-top:1px solid var(--line);}
.footer-main {display:flex;align-items:center;justify-content:space-between;gap:30px;padding-bottom:56px;}
.footer-main>p {font-size:19px;letter-spacing:-.02em;}
.back-top {display:flex;align-items:center;justify-content:space-between;gap:30px;font-size:11px;min-height:44px;}
.back-top span {font-size:19px;}
.footer-meta {display:flex;justify-content:space-between;gap:30px;border-top:1px solid #282d31;padding-top:27px;font-size:9px;line-height:1.8;color:#949fa7;}
.author-credit {text-align:right;}
.author-credit span {color:#c1c9cf;}
dialog {color:var(--sc-ink);background:#101214;border:1px solid #4b5256;max-width:calc(100vw - 40px);max-height:calc(100svh - 40px);padding:0;overscroll-behavior:contain;box-shadow:0 30px 100px #0008;}
dialog::backdrop {background:#030507d9;}
dialog[open] {animation:dialog-in 210ms var(--ease);}
.dialog-close {position:sticky;z-index:10;top:14px;display:grid;place-items:center;width:44px;height:44px;margin:14px 14px -58px auto;border:1px solid #525b61;background:#111517;color:#edf0ec;}
.dialog-close svg {width:20px;height:20px;}
.product-dialog {width:990px;}
.product-layout {display:grid;grid-template-columns:1fr 1fr;}
.product-photo {aspect-ratio:1;align-self:center;width:100%;}
.product-info {padding:70px 38px 35px;}
.micro-label {font-size:9px;letter-spacing:.12em;color:#a7b0b8;}
.product-info h2 {font-size:37px;margin:21px 0 19px;letter-spacing:-.035em;}
.product-summary {font-size:12px;color:#b2bbc2;line-height:1.7;max-width:37ch;}
.color-options {display:flex;gap:13px;margin-top:28px;}
.color-options legend,.size-options legend {font-size:11px;margin-bottom:15px;}
.color-options label {position:relative;width:44px;height:44px;display:grid;place-items:center;cursor:pointer;}
.color-options input,.size-options input {position:absolute;inset:0;appearance:none;opacity:0;width:100%;height:100%;cursor:pointer;margin:0;z-index:1;}
.swatch {width:28px;height:28px;background:var(--swatch);border-radius:50%;position:relative;}
.color-options input:checked+.swatch::after {content:"";position:absolute;inset:-6px;border:1px solid #d5ddd8;border-radius:50%;}
.color-options input:focus-visible+.swatch {outline:2px solid var(--sc-accent);outline-offset:7px;}
.size-options {display:flex;gap:7px;margin-top:22px;}
.size-options label {display:block;position:relative;min-width:0;flex:1;cursor:pointer;}
.size-options label>span {display:grid;place-items:center;border:1px solid #5e6970;font-size:11px;height:44px;transition:background-color 160ms,color 160ms;}
.size-options input:checked+span {background:#e6e8e2;color:#141718;border-color:#e6e8e2;}
.size-options input:focus-visible+span {outline:2px solid var(--sc-accent);outline-offset:3px;}
.size-hint {font-size:10px;color:#9da9b3;margin-top:11px;min-height:18px;}
.size-hint.is-error {color:#ffc2a9;}
.add-button {width:100%;margin-top:22px;padding-inline:17px;font-size:11px;gap:8px;}
.product-feedback {font-size:11px;color:#d8e4ce;min-height:18px;margin:10px 0;}
.demo-disclaimer {font-size:10px;line-height:1.8;color:#a8b3bc;}
.product-info>.demo-disclaimer {padding-top:15px;border-top:1px solid #343c42;}
.basket-dialog {width:620px;}
.basket-content {padding:55px 35px 32px;}
.basket-dialog h2 {font-size:43px;margin:18px 0 20px;}
.basket-items {list-style:none;margin:26px 0 0;padding:0;}
.basket-item {border-top:1px solid #3c464d;padding:17px 0;display:grid;grid-template-columns:76px 1fr 44px;gap:18px;align-items:center;}
.basket-item-photo {width:76px;aspect-ratio:1;}
.basket-item h3 {font-size:18px;margin-bottom:6px;}
.basket-item p {font-size:10px;color:#b0bbc3;}
.item-remove {display:grid;place-items:center;width:44px;height:44px;background:none;font-size:22px;color:#b6c1c7;border:1px solid #48535b;}
.basket-empty {padding:20px 0 35px;font-size:16px;color:#bac4ca;line-height:1.7;}
.basket-empty[hidden],.basket-items[hidden] {display:none;}
.basket-actions {display:flex;justify-content:space-between;align-items:center;gap:15px;border-top:1px solid #3c464d;padding-top:22px;}
.text-button {background:none;border-bottom:1px solid #7d8992;padding:9px 0;font-size:11px;}
.basket-content>.fine-print {margin-top:22px;}
.basket-storage {font-size:10px;color:#b6c1c7;margin-bottom:18px;}
.basket-storage:empty {display:none;}
.noscript-note {position:fixed;z-index:100;bottom:0;background:#e4e8de;color:#13191b;padding:12px 20px;font-size:12px;width:100%;}
@keyframes float {0%,100% {transform:translateY(0) rotate(-.35deg);}50% {transform:translateY(-9px) rotate(.35deg);}}
@keyframes dialog-in {from {opacity:0;transform:translateY(8px);}to {opacity:1;transform:translateY(0);}}
@media (hover:hover) and (pointer:fine) {
  .site-header nav a:hover::after {transform:scaleX(1);}
  .basket-toggle:hover {color:#e4efc3;}
  .text-link:hover svg {transform:translateX(5px);}
  .model-image:hover {transform:translateY(-5px);border-color:#b3bec4;}
  .model-open:hover {color:#f1f1ed;}
  .button-light:hover {background:#f5f7ef;}
  .layer-list button:hover {color:#e5ece9;}
  .hotspot:hover {border-color:#e8efea;}
  .back-top:hover,.text-button:hover {color:#e4efc3;}
  .dialog-close:hover,.item-remove:hover {background:#242c30;}
  .size-options label:hover>span {border-color:#e5ebe7;}
}
@media (min-width:1600px) {
  .hero-object {width:min(69vw,calc(100svh - 140px),1000px);height:min(69vw,calc(100svh - 140px),1000px);}
  .details {min-height:850px;}
  .detail-media {min-height:850px;}
}
@media (max-width:1100px) {
  .site-header nav {gap:25px;margin-left:0;}
  .hero-meta {font-size:8px;gap:12px;}
  .hero-meta--right {top:20%;}
  .hero-object {width:min(75vw,calc(100svh - 155px));height:min(75vw,calc(100svh - 155px));top:44%;}
  .hero-copy {bottom:10%;}
  .hero-copy h1 {font-size:50px;}
  .details {grid-template-columns:1fr 1fr;min-height:710px;}
  .detail-media {min-height:710px;}
  .detail-copy {padding-block:80px;padding-left:5%;}
  h2 {font-size:66px;}
  .feature-list>div {grid-template-columns:1fr;gap:4px;padding-block:14px;min-height:76px;}
  .collection,.material {padding-block:90px;}
  .model-grid {gap:12px;}
  .model-index {font-size:7px;left:10px;top:9px;}
  .model-label h3 {font-size:18px;}
  .material-layout {gap:5%;grid-template-columns:1.3fr 1fr;}
  .material-drawing {height:455px;}
  .plane-stack {top:0;}
  .fabric-plane {width:77%;height:49%;}
  .plane-1 {top:0;}.plane-2 {top:100px;}.plane-3 {top:200px;}
  .material-description h3 {font-size:27px;}
  .material-description p {font-size:12px;}
}
@media (max-width:760px) {
  :root {--gutter:24px;}
  html {scroll-padding-top:68px;}
  .site-header {height:68px;gap:14px;}
  .wordmark {font-size:20px;}
  .wordmark span {font-size:24px;margin-inline:2px;}
  .site-header nav {gap:17px;margin-left:auto;}
  .site-header nav a {font-size:10px;}
  .basket-toggle {font-size:0;gap:0;padding-left:3px;}
  .basket-count {font-size:10px;min-width:28px;height:28px;}
  .hero {scroll-margin-top:0;}
  .concept-note {height:36px;font-size:10px;letter-spacing:.015em;gap:7px;}
  .hero-stage {height:calc(100svh - 104px);min-height:635px;max-height:850px;}
  .hero-rear {inset:6% -22% 12%;opacity:.7;}
  .hero-object {width:min(100vw,580px);height:min(100vw,580px);top:44%;}
  .hero-meta--left {top:6%;font-size:8px;gap:10px;}
  .hero-meta--right {top:6%;font-size:8px;gap:10px;}
  .hero-meta .cross {font-size:15px;}
  .hero-copy {bottom:8%;}
  .hero-copy h1 {font-size:46px;margin-bottom:14px;}
  .text-link {font-size:11px;gap:26px;}
  .hero-caption {bottom:15.8%;font-size:10px;}
  .hero-caption-bottom {bottom:3%;font-size:8px;}
  .section {scroll-margin-top:0;}
  .details {grid-template-columns:1fr;min-height:0;}
  .detail-media {height:480px;min-height:0;}
  .detail-media::after {background:linear-gradient(0deg,#090a0c,transparent 24%);}
  .detail-media img {width:122%;height:160%;top:0;left:-14%;transform:rotate(-13deg) scale(1.2);transform-origin:50% 25%;}
  .detail-cross {top:40px;}
  .image-caption {bottom:25px;}
  .detail-copy {padding:44px var(--gutter) 75px;}
  h2 {font-size:56px;}
  .section-intro {margin:24px 0 34px;font-size:13px;}
  .feature-list>div {grid-template-columns:1fr 1.6fr;gap:20px;min-height:65px;padding-block:16px;font-size:11px;}
  .fine-print {font-size:9px;}
  .collection {padding-block:76px 80px;}
  .collection-heading {align-items:start;gap:25px;margin-bottom:38px;}
  .collection-heading h2 {font-size:56px;}
  .collection-heading p {font-size:11px;max-width:18ch;padding-top:8px;}
  .model-grid {grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 16px;}
  .model-index {font-size:8px;}
  .model-label {padding-top:15px;}
  .model-label h3 {font-size:18px;}
  .model-open {font-size:10px;padding-bottom:12px;}
  .selection-mark {font-size:7px;bottom:9px;right:8px;}
  .collection-bottom {gap:16px 20px;margin-top:34px;}
  .collection-bottom>p {min-width:0;font-size:11px;flex:1;}
  .collection-bottom>.fine-print {margin-left:0;flex-basis:100%;font-size:9px;}
  .collection-bottom .button {font-size:11px;gap:20px;padding-inline:16px;min-height:48px;}
  .material {padding:75px var(--gutter) 70px;}
  .material-heading {align-items:start;margin-bottom:18px;gap:30px;}
  .material-heading h2 {font-size:56px;}
  .material-heading p {font-size:10px;max-width:19ch;padding-top:8px;}
  .material-layout {display:flex;flex-direction:column;gap:37px;align-items:stretch;}
  .material-drawing {height:390px;margin-inline:-4px;}
  .plane-stack {top:5px;}
  .fabric-plane {width:78%;height:49%;left:0;}
  .plane-1 {top:0;}.plane-2 {top:80px;}.plane-3 {top:160px;}
  .hotspot {left:85%;width:40px;height:40px;font-size:9px;}
  .hotspot-1 {top:calc(17.65% - 20px);}.hotspot-2 {top:calc(48.04% - 20px);}.hotspot-3 {top:calc(78.43% - 20px);}
  .material-lines {width:99%;}
  .drawing-caption {font-size:8px;}
  .material-description {min-height:130px;}
  .material-description h3 {font-size:30px;}
  .material-description p {font-size:13px;max-width:48ch;}
  .material-kicker {font-size:9px;margin-bottom:16px;}
  .layer-list {margin-top:15px;}
  .site-footer {padding-top:38px;}
  .footer-main {gap:26px;flex-wrap:wrap;padding-bottom:35px;}
  .footer-main>p {order:3;flex-basis:100%;font-size:19px;}
  .footer-meta {flex-wrap:wrap;gap:22px;font-size:8px;}
  .footer-meta>p {flex-basis:calc(50% - 12px);}
  .footer-meta>.author-credit {text-align:left;flex-basis:100%;font-size:9px;}
  dialog {max-width:calc(100vw - 24px);max-height:calc(100svh - 24px);}
  .product-dialog {width:480px;}
  .product-layout {grid-template-columns:1fr;}
  .product-photo {width:72%;margin:15px auto 0;}
  .product-info {padding:0 25px 25px;}
  .product-info h2 {font-size:31px;margin:15px 0;}
  .product-summary {max-width:48ch;font-size:11px;}
  .color-options {margin-top:21px;gap:12px;}
  .color-options legend,.size-options legend {margin-bottom:10px;}
  .size-options {margin-top:17px;}
  .add-button {margin-top:16px;min-height:49px;}
  .product-feedback {margin-block:7px;}
  .demo-disclaimer {font-size:9px;}
  .basket-content {padding:65px 23px 25px;}
  .basket-dialog h2 {font-size:36px;}
  .basket-item {grid-template-columns:62px 1fr 40px;gap:13px;}
  .basket-item-photo {width:62px;}
  .basket-item h3 {font-size:17px;}
  .basket-item p {font-size:9px;}
  .basket-actions .button {font-size:11px;padding-inline:16px;gap:20px;}
}
@media (max-width:420px) {
  :root {--gutter:20px;}
  .site-header {gap:10px;}
  .site-header nav {gap:13px;}
  .site-header nav a {font-size:9px;}
  .wordmark {font-size:18px;gap:.15em;}
  .wordmark span {font-size:22px;}
  .hero-stage {min-height:590px;}
  .hero-object {top:42%;width:100vw;height:100vw;}
  .hero-copy {bottom:8%;}
  .hero-copy h1 {font-size:43px;}
  .hero-caption {bottom:19%;font-size:9px;}
  .hero-caption-bottom {font-size:8px;}
  .hero-meta {font-size:8px;}
  h2,.collection-heading h2,.material-heading h2 {font-size:49px;}
  .collection-heading p {font-size:10px;}
  .material-heading p {font-size:9px;}
  .detail-media {height:400px;}
  .material-drawing {height:345px;}
  .plane-2 {top:72px;}.plane-3 {top:144px;}
}
@media (max-height:720px) and (min-width:761px) {
  .hero-stage {min-height:560px;}
  .hero-object {height:545px;width:545px;}
  .hero-copy h1 {font-size:47px;}
}
@media (max-height:700px) and (max-width:760px) {
  .hero-stage {min-height:530px;}
  .hero-object {top:38%;width:min(88vw,360px);height:min(88vw,360px);}
  .hero-copy {bottom:7%;}
  .hero-copy h1 {font-size:36px;}
}
@media (prefers-reduced-motion:reduce),(pointer:coarse) {
  html:not([data-product-motion="on"]) .hero-float {animation:none;}
  html:not([data-product-motion="on"]) .hero-object,html:not([data-product-motion="on"]) .hero-rear {transition:none;}
  html:not([data-product-motion="on"]) .hero-object {transform:translate(-50%,-50%);}
  html:not([data-product-motion="on"]) .hero-rear {transform:none;}
}
@media (prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto;}
  html:not([data-product-motion="on"]) *,html:not([data-product-motion="on"]) *::before,html:not([data-product-motion="on"]) *::after {animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;}
  dialog[open] {animation:none;}
}