/* NOIRE AUDIO — editorial showcase pass, built on the supplied graphite / steel system. */
:root {
  --na-void: #0c0d0f;
  --na-graphite: #151719;
  --na-carbon: #202327;
  --na-steel: #30343a;
  --na-chalk: #e9e6e3;
  --na-muted: #b7bbba;
  --na-dim: #959b9b;
  --na-line: rgba(233, 230, 227, .16);
  --na-line-strong: rgba(233, 230, 227, .27);
  --na-green: #72b9a4;
  --na-gutter: clamp(1.15rem, 5.15vw, 5.25rem);
  --na-max: 100rem;
}

html { scroll-padding-top: 6.5rem; }
body,
body.theme-dark,
body.theme-light {
  color: var(--na-chalk);
  background:
    radial-gradient(ellipse at 48% -14rem, rgba(106, 117, 118, .14), transparent 44rem),
    var(--na-void);
}
body::after { opacity: .1; }
.na-body { overflow-x: clip; }

.site-loader {
  position: fixed;
  z-index: 100;
  inset: 0;
  display: none;
  place-content: center;
  justify-items: center;
  gap: .75rem;
  min-height: 100dvh;
  padding: max(2rem,env(safe-area-inset-top)) 1.5rem max(2rem,env(safe-area-inset-bottom));
  color: var(--na-chalk);
  background: radial-gradient(ellipse at 50% 43%,rgba(66,75,75,.18),transparent 22rem), #0c0d0f;
}
html.has-entry-loader .site-loader { display: grid; }
.site-loader img { width: 5.1rem; height: 5.1rem; border: 1px solid rgba(233,230,227,.2); border-radius: 50%; object-fit: cover; background: #08090a; box-shadow: 0 0 0 5px rgba(255,255,255,.025),0 16px 44px rgba(0,0,0,.4); }
.site-loader__wordmark { margin-top: .2rem; font-family: var(--na-font-display); font-size: .78rem; font-weight: 500; letter-spacing: .32em; text-indent: .32em; }
.site-loader__caption { color: #aeb5b1; font-family: var(--na-font-mono); font-size: .52rem; letter-spacing: .16em; text-align: center; }
.site-loader__meter { width: 9rem; height: 2px; margin-top: .7rem; overflow: hidden; background: rgba(233,230,227,.13); }
.site-loader__meter i { display: block; width: 100%; height: 100%; background: linear-gradient(90deg,transparent 0%,var(--na-green) 42%,#d8e8e2 50%,var(--na-green) 58%,transparent 100%); transform: translateX(-100%); animation: na-loader-pass 850ms cubic-bezier(.42,0,.58,1) infinite; }
.site-loader.is-leaving { animation: na-loader-out 380ms cubic-bezier(.4,0,.8,.3) forwards; }
@keyframes na-loader-pass { to { transform: translateX(100%); } }
@keyframes na-loader-out { to { opacity: 0; visibility: hidden; } }

a,
button { touch-action: manipulation; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible { outline: 2px solid var(--na-green); outline-offset: 4px; }

/* A quiet, tactile glass rail; glass stays limited to navigation and useful labels. */
.site-nav { top: clamp(.65rem, 1.5vw, 1.15rem); width: min(calc(100% - 2 * var(--na-gutter)), var(--na-max)); }
.nav-capsule.glass {
  min-height: 4.15rem;
  padding: .35rem .55rem .35rem .7rem;
  border: 1px solid rgba(233, 230, 227, .2);
  border-radius: 1.15rem;
  background:
    linear-gradient(155deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .012) 36%, transparent 65%),
    rgba(18, 20, 22, .73);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 14px 40px rgba(0,0,0,.22);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  backdrop-filter: blur(24px) saturate(135%);
}
.nav-brand { min-width: 11rem; min-height: 3rem; justify-content: flex-start; gap: .65rem; }
.nav-brand img {
  display: block;
  width: 3.25rem;
  height: 3.25rem;
  border: 1px solid rgba(233,230,227,.16);
  border-radius: 50%;
  object-fit: cover;
  background: #090a0b;
  box-shadow: 0 0 0 3px rgba(255,255,255,.025), 0 5px 16px rgba(0,0,0,.38);
}
.nav-brand__wordmark { display: grid; gap: .07rem; color: var(--na-chalk); font-family: var(--na-font-display); font-size: .82rem; font-weight: 500; line-height: 1; letter-spacing: .23em; }
.nav-brand__audio { color: #b9bfbc; font-family: var(--na-font-mono); font-size: .46rem; font-weight: 400; letter-spacing: .36em; }
.nav-links { gap: clamp(.25rem, .7vw, .85rem); }
.nav-links a,
.nav-links > li > span { min-height: 2.75rem; padding-inline: .9rem; border-radius: .75rem; }
.nav-links a { font-size: .82rem; }
.nav-links a[aria-current="page"] { color: var(--na-chalk); background: rgba(233,230,227,.1); }
.nav-shop { font-size: .78rem; }
.nav-tools { padding-left: .65rem; }
.lang-switch { min-height: 2.7rem; padding: .16rem; border-radius: .75rem; background: rgba(0,0,0,.22); }
.lang-switch a { min-width: 2.55rem; min-height: 2.35rem; }
.nav-menu-button { min-width: 3rem; min-height: 3rem; border-radius: .75rem; }
.nav-sheet.glass {
  border: 1px solid rgba(233,230,227,.2);
  border-radius: 1rem;
  background: rgba(18,20,22,.88);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 20px 48px rgba(0,0,0,.42);
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  backdrop-filter: blur(24px) saturate(135%);
}

.na-eyebrow,
.na-micro { color: var(--na-muted); }
.na-eyebrow { font-size: .66rem; letter-spacing: .17em; }
.na-eyebrow__dot,
.na-status-dot,
.status__dot { box-shadow: 0 0 0 3px rgba(114,185,164,.1); }
.na-button {
  min-height: 3.25rem;
  padding: .85rem 1.1rem;
  border-radius: .65rem;
  letter-spacing: -.01em;
  transition: transform 220ms ease, color 220ms ease, background-color 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
}
.na-button--light { box-shadow: 0 8px 24px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.8); }
.na-button--light:hover { transform: translateY(-2px); box-shadow: 0 12px 30px rgba(0,0,0,.34), inset 0 1px 0 #fff; }
.na-button--outline { border-radius: .65rem; background: rgba(255,255,255,.045); }
.na-button--outline:hover { transform: translateY(-2px); border-color: rgba(233,230,227,.5); background: rgba(255,255,255,.09); }
.na-quiet-link,
.na-text-link { min-height: 2.75rem; }

/* Homepage: a real studio photograph, a real plugin capture, and one clear action. */
.na-home-hero {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: min(100%, 112rem);
  min-height: clamp(42rem, 82svh, 61rem);
  margin: 0 auto;
  padding: 8rem var(--na-gutter) 5.4rem;
  overflow: hidden;
  isolation: isolate;
  border-bottom: 1px solid var(--na-line);
}
.na-home-hero::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  background: radial-gradient(ellipse at 73% 47%, rgba(117,128,127,.13), transparent 31rem), linear-gradient(90deg, rgba(12,13,15,.2), rgba(12,13,15,.45));
  content: "";
}
.na-home-hero__backdrop { position: absolute; z-index: -2; inset: 0 0 0 25%; overflow: hidden; }
.na-home-hero__backdrop::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--na-void) 0%, rgba(12,13,15,.87) 20%, rgba(12,13,15,.3) 65%, rgba(12,13,15,.52)), linear-gradient(0deg, var(--na-void), transparent 42%, rgba(12,13,15,.12));
  content: "";
}
.na-home-hero__backdrop picture,
.na-home-hero__backdrop img { display: block; width: 100%; height: 100%; }
.na-home-hero__backdrop img { object-fit: cover; object-position: 52% center; filter: grayscale(1) brightness(.52) contrast(1.16); }
.na-home-hero__inner {
  display: grid;
  grid-template-columns: minmax(21rem, .86fr) minmax(0, 1.14fr);
  align-items: center;
  gap: clamp(2.5rem, 6vw, 7rem);
  width: min(100%, var(--na-max));
  margin: 0 auto;
}
.na-home-hero__copy { max-width: 39rem; padding: 1rem 0 2rem; animation: na-v4-arrive 760ms cubic-bezier(.2,.72,.26,1) both; }
.na-home-hero h1,
.na-catalog-hero h1,
.na-product-hero h1 {
  color: var(--na-chalk);
  font-family: var(--na-font-display);
  font-weight: 400;
  letter-spacing: -.075em;
  text-wrap: balance;
}
.na-home-hero h1 { max-width: none; margin: 1.3rem 0 1.55rem; font-size: clamp(4.4rem, 5.9vw, 6.8rem); line-height: .92; }
.na-home-hero__lead { max-width: 29rem; color: #d1d2cf; font-size: clamp(1.03rem,1.28vw,1.18rem); line-height: 1.68; text-wrap: pretty; }
.na-home-hero .na-actions { gap: 1.05rem; margin-top: 1.8rem; }
.na-home-hero__spec { display: flex; flex-wrap: wrap; gap: .5rem .75rem; margin-top: 2.55rem; padding-top: 1rem; border-top: 1px solid rgba(233,230,227,.21); color: #c0c4c2; font-size: .62rem; letter-spacing: .1em; }
.na-home-hero__spec span { padding: .4rem 0; }
.na-home-hero__spec span + span::before { margin-right: .75rem; color: var(--na-green); content: "/"; }
.na-home-hero__visual { position: relative; min-width: 0; padding: .8rem 1.1rem 2.7rem .5rem; perspective: 1500px; animation: na-v4-arrive 960ms 120ms cubic-bezier(.2,.72,.26,1) both; }
.na-hero-display {
  position: relative;
  overflow: visible;
  padding: .72rem;
  border: 1px solid rgba(233,230,227,.27);
  border-radius: .92rem;
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.025) 24%, transparent 64%), #111416;
  box-shadow: 0 44px 95px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.22);
  transform: rotateY(-5deg) rotateX(1deg) rotateZ(-.8deg);
  transform-style: preserve-3d;
  transition: transform 700ms cubic-bezier(.2,.7,.24,1), box-shadow 700ms ease;
}
.na-hero-display::before { position: absolute; z-index: -1; right: -1px; bottom: -9px; left: 10px; height: 12px; border: 1px solid rgba(233,230,227,.18); border-top: 0; border-radius: 0 0 .65rem .65rem; background: linear-gradient(90deg,#202326,#131516 55%,#282b2e); content: ""; transform: translateZ(-12px); }
.na-hero-display:hover { transform: rotateY(-2deg) rotateX(0) rotateZ(0); box-shadow: 0 52px 110px rgba(0,0,0,.61), inset 0 1px 0 rgba(255,255,255,.24); }
.na-hero-display__top { display: flex; justify-content: space-between; gap: .8rem; padding: .18rem .35rem .72rem; color: #c6c9c7; font-family: var(--na-font-mono); font-size: .58rem; letter-spacing: .15em; }
.na-hero-display__top span:last-child { color: #a5aaa7; }
.na-hero-display__image { display: block; overflow: hidden; border: 1px solid rgba(255,255,255,.09); border-radius: .25rem; background: #090a0b; }
.na-hero-display__image .na-art { display: block; margin: 0; }
.na-hero-display__image img { display: block; width: 100%; height: auto; }
.na-hero-display__note {
  position: absolute;
  right: -2rem;
  bottom: -1.5rem;
  display: grid;
  gap: .3rem;
  min-width: min(18rem, 72%);
  padding: .8rem 1rem .9rem;
  border: 1px solid rgba(233,230,227,.25);
  border-radius: .72rem;
  color: var(--na-chalk);
  text-decoration: none;
  background: linear-gradient(145deg, rgba(255,255,255,.1), rgba(255,255,255,.02) 42%), rgba(19,21,23,.8);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 18px 42px rgba(0,0,0,.4);
  -webkit-backdrop-filter: blur(22px) saturate(145%);
  backdrop-filter: blur(22px) saturate(145%);
  transition: transform 220ms ease, border-color 220ms ease;
}
.na-hero-display__note:hover { transform: translateY(-3px); border-color: rgba(233,230,227,.48); }
.na-hero-display__note > span { color: #b6bcba; font-family: var(--na-font-mono); font-size: .55rem; letter-spacing: .1em; }
.na-hero-display__note > span b { color: var(--na-green); font-weight: 500; }
.na-hero-display__note strong { display: flex; justify-content: space-between; gap: 1rem; font-family: var(--na-font-display); font-size: 1.02rem; font-weight: 500; letter-spacing: -.02em; }
.na-hero-display__note i { color: var(--na-green); font-style: normal; }
.na-home-hero__visual-index { position: absolute; right: .6rem; top: -.7rem; color: rgba(233,230,227,.6); font-family: var(--na-font-mono); font-size: .53rem; letter-spacing: .16em; writing-mode: vertical-rl; }
.na-home-hero__visual-index i { color: var(--na-green); font-style: normal; }
.na-home-hero__edge { right: var(--na-gutter); bottom: 1.6rem; left: var(--na-gutter); align-items: center; padding-top: 1.05rem; color: #b9bfbc; border-color: rgba(233,230,227,.2); }
.na-home-hero__edge > span { display: flex; gap: .65rem; align-items: center; }
.na-home-hero__edge i { color: var(--na-green); font-style: normal; }
.na-home-hero__edge a { display: inline-flex; align-items: center; min-height: 2.75rem; }

.na-statement {
  display: grid;
  grid-template-columns: minmax(13rem,.9fr) minmax(0,1.1fr);
  align-items: center;
  gap: 3rem;
  max-width: none;
  padding: clamp(2.5rem,5vw,4.2rem) var(--na-gutter);
  border-block: 0;
  background: linear-gradient(110deg, #151719, #111315 75%);
}
.na-statement p { max-width: 17ch; font-size: clamp(1.7rem,3.1vw,2.65rem); line-height: 1.12; }
.na-statement__facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); border-left: 1px solid var(--na-line); }
.na-statement__facts span { display: grid; gap: .75rem; padding: .2rem 1.35rem; color: var(--na-green); font-family: var(--na-font-mono); font-size: .58rem; letter-spacing: .14em; }
.na-statement__facts span + span { border-left: 1px solid var(--na-line); }
.na-statement__facts b { color: var(--na-chalk); font-family: var(--na-font-body); font-size: .83rem; font-weight: 500; letter-spacing: 0; }

.na-featured {
  width: min(100%, var(--na-max));
  margin: 0 auto;
  padding: clamp(5rem,9vw,8.5rem) var(--na-gutter);
  grid-template-columns: minmax(16rem,.64fr) minmax(0,1.36fr);
  gap: clamp(3rem,8vw,8rem);
}
.na-featured__copy { max-width: 32rem; }
.na-featured__copy h2,
.na-section-intro h2,
.na-photo-story h2,
.na-principles h2,
.na-shop-callout h2,
.na-product-detail h2,
.na-product-specs h2 { letter-spacing: -.065em; text-wrap: balance; }
.na-featured__copy h2 { margin: 1rem 0 1.1rem; font-size: clamp(2.7rem,4.6vw,5.1rem); line-height: .98; }
.na-featured__copy > p:not(.na-eyebrow) { color: #c0c3c2; line-height: 1.7; }
.na-featured__screen {
  padding: .65rem;
  border: 1px solid rgba(233,230,227,.22);
  border-radius: .75rem;
  background: linear-gradient(135deg, rgba(255,255,255,.07), transparent 36%), #111315;
  box-shadow: 0 32px 80px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.1);
}
.na-featured__screen picture { border-radius: .27rem; }
.na-featured__screen img { filter: saturate(.86); }
.na-screen-caption { padding: .85rem .55rem .3rem; color: #adb3b0; }

.na-range,
.na-product-features { padding: clamp(5rem,9vw,8.2rem) var(--na-gutter); border-top: 1px solid var(--na-line); background: linear-gradient(180deg, #131517, #0f1112 70%); }
.na-section-intro { width: min(100%, var(--na-max)); margin-bottom: clamp(2.2rem,4vw,3.4rem); }
.na-section-intro h2 { max-width: 15ch; margin-top: .85rem; font-size: clamp(2.7rem,5vw,5rem); line-height: .98; }
.na-section-intro > p { max-width: 30rem; color: #bdc1bf; line-height: 1.7; }
.na-product-grid { gap: .9rem; }
.na-product-card {
  min-height: 30rem;
  border: 1px solid rgba(233,230,227,.15);
  border-radius: .75rem;
  background: linear-gradient(145deg, rgba(255,255,255,.055), transparent 42%), radial-gradient(ellipse at 60% 22%, rgba(114,185,164,.075), transparent 55%), #171a1c;
  box-shadow: 0 18px 44px rgba(0,0,0,.13), inset 0 1px 0 rgba(255,255,255,.055);
  transition: transform 300ms cubic-bezier(.2,.7,.24,1), border-color 300ms ease, background-color 300ms ease, box-shadow 300ms ease;
}
.na-product-card:hover { transform: translateY(-5px); border-color: rgba(233,230,227,.34); box-shadow: 0 28px 58px rgba(0,0,0,.27), inset 0 1px 0 rgba(255,255,255,.11); }
.na-product-card__link { grid-template-rows: auto minmax(13rem,1fr) auto; padding: clamp(1.2rem,2vw,1.8rem); }
.na-product-card__top { min-height: 1.8rem; }
.na-product-card__art { min-height: 15rem; margin: 1rem -.5rem .65rem; }
.na-product-card__art img { max-height: 19rem; }
.na-product-card:nth-child(1) .na-product-card__art img { max-height: 25rem; }
.na-product-card__copy h3,
.na-product-card__copy h2 { font-size: clamp(1.4rem,2.2vw,2rem); }
.na-product-card__copy p { color: #b8bdbb; line-height: 1.62; }
.na-product-card__copy .na-text-link { color: var(--na-chalk); }
.na-range__foot { margin-top: 1.4rem; color: #aeb4b1; }

.na-photo-story { min-height: clamp(34rem,65vw,55rem); border-block: 1px solid rgba(233,230,227,.12); }
.na-photo-story__image img { filter: grayscale(92%) contrast(1.07) brightness(.62); }
.na-photo-story__shade { background: linear-gradient(90deg,rgba(12,13,15,.88),rgba(12,13,15,.38) 58%,rgba(12,13,15,.08)),linear-gradient(0deg,rgba(12,13,15,.8),transparent 48%); }
.na-photo-story__copy { width: min(52rem,100%); }
.na-photo-story h2 { max-width: 10ch; margin-block: 1.15rem; font-size: clamp(3.5rem,8vw,8rem); line-height: .94; }
.na-photo-story__copy > p:not(.na-eyebrow) { color: #d5d7d4; font-size: 1.03rem; line-height: 1.72; }
.na-photo-story__caption { color: #c0c4c2; }
.na-principles { width: min(100%,var(--na-max)); margin: 0 auto; padding: clamp(5rem,9vw,8rem) var(--na-gutter); }
.na-principles__title { max-width: 48rem; }
.na-principles__title h2 { margin: 1rem 0; font-size: clamp(2.8rem,5vw,5rem); line-height: .98; }
.na-principles__title > p:not(.na-eyebrow) { max-width: 36rem; color: #bfc4c1; line-height: 1.7; }
.na-principles__list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 0; margin-top: 3.2rem; border-top: 1px solid var(--na-line); }
.na-principles__list article { display: block; padding: 1.4rem 1.7rem 0 0; }
.na-principles__list article + article { padding-left: 1.7rem; border-left: 1px solid var(--na-line); }
.na-principles__list h3 { margin: 0 0 .6rem; font-family: var(--na-font-display); font-size: 1.23rem; font-weight: 500; letter-spacing: -.03em; }
.na-principles__list p { max-width: 31ch; margin: 0; color: #b9bfbc; font-size: .88rem; line-height: 1.68; }
.na-shop-callout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max));
  margin: 0 auto clamp(4rem,7vw,7rem);
  padding: clamp(1.7rem,4vw,3.2rem);
  border: 1px solid rgba(233,230,227,.19);
  border-radius: .8rem;
  background: radial-gradient(ellipse at 87% 15%, rgba(114,185,164,.085), transparent 34rem), linear-gradient(145deg,rgba(255,255,255,.055),transparent 58%), #151719;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 20px 58px rgba(0,0,0,.22);
}
.na-shop-callout > div { max-width: 43rem; }
.na-shop-callout h2 { margin: .5rem 0 .7rem; font-size: clamp(2rem,3.4vw,3.4rem); line-height: 1; }
.na-shop-callout p:not(.na-eyebrow) { margin-bottom: 0; color: #bdc2bf; }
.na-shop-callout .na-button { flex: 0 0 auto; }

/* Catalogue: a useful orientation panel before the product list. */
.na-catalog { width: min(100%,112rem); margin-inline: auto; }
.na-catalog-hero { padding: clamp(6.8rem,9vw,8.2rem) var(--na-gutter) 1.8rem; }
.na-catalog-hero__layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(19rem,.72fr); align-items: center; gap: clamp(2rem,6vw,6rem); }
.na-catalog-hero__copy { max-width: 51rem; }
.na-catalog-hero h1 { max-width: 10ch; margin: 1.15rem 0 1rem; font-size: clamp(4rem,7.5vw,7.6rem); line-height: .93; }
.na-catalog-hero__copy > p:not(.na-eyebrow) { max-width: 37rem; color: #c1c5c3; font-size: 1.08rem; line-height: 1.7; }
.na-catalog-hero__visual {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
  min-height: 17rem;
  padding: 2.5rem 1rem 1rem;
  overflow: hidden;
  border: 1px solid rgba(233,230,227,.17);
  border-radius: .75rem;
  color: var(--na-chalk);
  text-decoration: none;
  background: radial-gradient(ellipse at 49% 48%,rgba(114,185,164,.11),transparent 64%),linear-gradient(140deg,rgba(255,255,255,.055),transparent 52%),#141719;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 26px 60px rgba(0,0,0,.26);
  transition: border-color 240ms ease, transform 240ms ease;
}
.na-catalog-hero__visual:hover { transform: translateY(-3px); border-color: rgba(233,230,227,.34); }
.na-catalog-hero__visual .na-art { width: min(100%,32rem); margin: .4rem auto; }
.na-catalog-hero__visual-meta,
.na-catalog-hero__visual-link { position: absolute; z-index: 1; color: #c1c6c3; font-family: var(--na-font-mono); font-size: .52rem; letter-spacing: .14em; }
.na-catalog-hero__visual-meta { top: 1rem; left: 1rem; }
.na-catalog-hero__visual-meta i { color: var(--na-green); font-style: normal; }
.na-catalog-hero__visual-link { right: 1rem; bottom: 1rem; display: flex; align-items: center; gap: .75rem; }
.na-catalog-hero__visual-link b { color: var(--na-green); font-size: .9rem; font-weight: 400; }
.na-family-nav { display: flex; flex-wrap: wrap; gap: .25rem; margin-top: clamp(2rem,4vw,3.2rem); padding: .45rem; border: 1px solid rgba(233,230,227,.17); border-radius: .72rem; background: rgba(255,255,255,.025); }
.na-family-nav a { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.8rem; padding: .55rem .9rem; border-radius: .5rem; color: #c0c5c2; font-size: .76rem; text-decoration: none; transition: color 180ms ease, background-color 180ms ease; }
.na-family-nav a:hover { color: var(--na-chalk); background: rgba(233,230,227,.09); }
.na-family-nav a span { color: var(--na-green); }
.na-preview-note { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); margin: .5rem auto 1rem; padding: .9rem 1rem; border-left: 2px solid var(--na-green); color: #c0c5c2; background: rgba(255,255,255,.025); font-size: .82rem; }
.na-product-grid--catalog { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); }
.na-catalog .na-shop-callout { margin-top: clamp(3rem,6vw,5.5rem); }

/* Product pages: the software is the hero. */
.na-product-page { width: min(100%,112rem); margin-inline: auto; }
.na-breadcrumb { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); margin: 6.3rem auto .35rem; color: #aeb4b1; font-size: .75rem; }
.na-breadcrumb a { min-height: 2.6rem; display: inline-flex; align-items: center; color: #cbd0cd; }
.na-product-hero { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); min-height: 36rem; gap: clamp(2rem,5vw,5.5rem); padding: 2.4rem 0 4rem; }
.na-product-hero__copy { max-width: 35rem; }
.na-product-hero h1 { margin: 1.1rem 0 1.15rem; font-size: clamp(3.6rem,6.2vw,6.7rem); line-height: .96; }
.na-product-hero__intro { color: #e1e1df; font-size: clamp(1.25rem,2vw,1.8rem); line-height: 1.18; }
.na-product-hero__note { color: #bec3c0; font-size: .97rem; line-height: 1.72; }
.na-product-hero__visual {
  padding: .75rem;
  border: 1px solid rgba(233,230,227,.22);
  border-radius: .78rem;
  background: linear-gradient(145deg,rgba(255,255,255,.09),transparent 42%),#111315;
  box-shadow: 0 32px 78px rgba(0,0,0,.43),inset 0 1px 0 rgba(255,255,255,.12);
}
.na-product-hero__visual .na-art { min-height: 22rem; }
.na-product-hero__visual img { max-height: 32rem; filter: saturate(.9); }
.na-product-hero__visual .na-art img { border-radius: .28rem; }
.na-product-hero__edge { margin-top: .35rem; padding-top: .7rem; color: #aeb5b1; }
.na-product-detail { gap: clamp(2.5rem,7vw,7rem); padding: clamp(4.5rem,8vw,7.7rem) var(--na-gutter); background: linear-gradient(120deg,#141719,#101213 70%); }
.na-product-detail__image { padding: .65rem; border-radius: .7rem; background: #0d0f10; box-shadow: 0 28px 70px rgba(0,0,0,.33),inset 0 1px 0 rgba(255,255,255,.07); }
.na-product-detail__image picture { border-radius: .35rem; }
.na-product-detail__image img { filter: grayscale(74%) contrast(1.08) brightness(.8); }
.na-product-detail__copy h2 { margin: 1rem 0; font-size: clamp(2.8rem,5vw,5.2rem); line-height: .98; }
.na-product-detail__copy > p:not(.na-eyebrow) { color: #bec3c0; line-height: 1.76; }
.na-feature-grid { gap: .8rem; }
.na-feature-point,
.na-feature-point:first-child,
.na-feature-point:last-child { padding: 1.55rem; border: 1px solid rgba(233,230,227,.14); border-radius: .65rem; background: linear-gradient(145deg,rgba(255,255,255,.05),transparent 60%),rgba(18,20,22,.55); }
.na-feature-point h3 { margin: 1.4rem 0 .65rem; font-family: var(--na-font-display); font-size: clamp(1.35rem,2vw,1.8rem); font-weight: 500; letter-spacing: -.045em; line-height: 1.08; }
.na-feature-point p { margin: 0; color: #b9bfbc; font-size: .9rem; line-height: 1.7; }
.na-product-specs { width: min(100%,var(--na-max)); margin-inline: auto; gap: clamp(2rem,7vw,8rem); padding: clamp(4.5rem,8vw,7rem) var(--na-gutter); }
.na-product-specs h2 { max-width: 12ch; font-size: clamp(2.7rem,4.8vw,5rem); line-height: .98; }
.na-spec-row { border-color: rgba(233,230,227,.19); }
.na-spec-row dt { color: #aab1ae; }
.na-spec-row dd { color: #e5e4e1; }
.na-product-note { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); margin: 0 auto; padding: 1rem 1.2rem; border: 1px solid rgba(216,166,92,.23); border-radius: .55rem; color: #d0d0cb; background: rgba(216,166,92,.055); }
.na-note-mark { color: #dfb36e; }

/* Existing studio, support and legal pages inherit the same surface and type scale. */
.hero--page,
.photo-band,
.section,
.site-footer,
.closing { color: var(--na-chalk); background-color: var(--na-void); }
.hero--page { min-height: min(43rem,72svh); padding: clamp(8rem,14vw,12rem) var(--na-gutter) 5rem; }
.hero--page .container,
.section .container,
.photo-band .container,
.closing .container,
.site-footer .container { width: min(calc(100% - 2 * var(--na-gutter)),var(--na-max)); }
.display-hero,
.display,
.headline { font-family: var(--na-font-display); font-weight: 400; letter-spacing: -.065em; text-wrap: balance; }
.display-hero { max-width: 12ch; font-size: clamp(3.5rem,7.5vw,7.4rem); line-height: .95; }
.display { font-size: clamp(2.8rem,5.5vw,5.7rem); line-height: .98; }
.headline { font-size: clamp(2rem,3.4vw,3.4rem); line-height: 1.04; }
.display-hero__muted { color: #9da4a1; }
.section { padding: clamp(4.5rem,8vw,8rem) 0; border-top: 1px solid var(--na-line); }
.section.theme-light { background: linear-gradient(160deg,#171a1c,#111315 78%); }
.photo-band { border-block: 1px solid var(--na-line); }
.site-footer { border-top: 1px solid var(--na-line-strong); background: #0a0b0c; }
.footer-brand__mark { align-items: center; gap: .8rem; }
.footer-brand__mark img { display: block; width: 4.3rem; height: 4.3rem; border: 1px solid rgba(233,230,227,.16); border-radius: 50%; object-fit: cover; background: #090a0b; }
.footer-brand > p { max-width: 32ch; color: #b3b8b5; }
.footer-grid h2 { color: #dcdedb; font-family: var(--na-font-display); font-size: .95rem; font-weight: 500; letter-spacing: -.02em; }
.footer-grid a,
.footer-grid li > span,
.footer-legal { color: #aab0ad; }
.footer-grid a:hover,
.footer-legal a:hover { color: var(--na-chalk); }

.product-path__grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); margin-top: 2.8rem; border-top: 1px solid var(--na-line-strong); }
.product-path__grid article { min-width: 0; padding: 1.45rem 1.6rem 1.3rem 0; }
.product-path__grid article + article { padding-left: 1.6rem; border-left: 1px solid var(--na-line); }
.product-path__number { color: var(--na-green); font-family: var(--na-font-mono); font-size: .56rem; letter-spacing: .13em; }
.product-path__grid h3 { max-width: 15ch; margin: 1.4rem 0 .65rem; color: var(--na-chalk); font-family: var(--na-font-display); font-size: clamp(1.35rem,2.1vw,1.95rem); font-weight: 500; letter-spacing: -.045em; line-height: 1.08; }
.product-path__grid p { max-width: 35ch; min-height: 4.7em; margin: 0 0 1rem; color: #bac0bd; font-size: .88rem; line-height: 1.68; }
.product-path__grid a { display: inline-flex; align-items: center; gap: .6rem; min-height: 2.75rem; color: var(--na-chalk); font-size: .78rem; text-decoration: none; }
.product-path__grid a span { color: var(--na-green); transition: transform 180ms ease; }
.product-path__grid a:hover span { transform: translate(2px,-2px); }
.closing__mark { width: 4.5rem; height: 4.5rem; border: 1px solid rgba(233,230,227,.16); border-radius: 50%; object-fit: cover; background: #090a0b; }

@keyframes na-v4-arrive { from { opacity: 0; transform: translate3d(0,1.1rem,0); } to { opacity: 1; transform: translate3d(0,0,0); } }

@media (max-width: 68rem) {
  .na-home-hero { min-height: 48rem; }
  .na-home-hero__inner { grid-template-columns: minmax(16rem,.86fr) minmax(0,1.14fr); gap: 2.3rem; }
  .na-home-hero h1 { font-size: clamp(4rem,5.9vw,5.3rem); }
  .na-hero-display { transform: rotateY(-2deg) rotateX(1deg); }
  .na-hero-display__note { right: -.6rem; }
  .na-principles__list { grid-template-columns: 1fr; }
  .na-principles__list article,
  .na-principles__list article + article { padding: .9rem 0; border-left: 0; border-bottom: 1px solid var(--na-line); }
  .na-principles__list p { max-width: 52ch; }
  .product-path__grid { grid-template-columns: 1fr; }
  .product-path__grid article,
  .product-path__grid article + article { padding: 1.15rem 0; border-left: 0; border-bottom: 1px solid var(--na-line); }
  .product-path__grid h3 { max-width: 25ch; margin-top: .8rem; }
  .product-path__grid p { min-height: 0; max-width: 48ch; }
  .na-catalog-hero__layout { grid-template-columns: minmax(0,1fr) minmax(16rem,.72fr); gap: 2rem; }
  .na-product-hero { grid-template-columns: minmax(16rem,.8fr) minmax(0,1.2fr); gap: 2.2rem; }
}

@media (max-width: 52.5rem) {
  :root { --na-gutter: clamp(1.1rem,5vw,1.7rem); }
  .site-nav { top: .55rem; width: calc(100% - 2rem); }
  .nav-capsule.glass { min-height: 3.85rem; padding: .3rem .4rem .3rem .55rem; border-radius: .92rem; }
  .nav-brand { min-width: 9.7rem; gap: .48rem; }
  .nav-brand img { width: 2.8rem; height: 2.8rem; }
  .nav-brand__wordmark { font-size: .75rem; }
  .nav-brand__audio { font-size: .42rem; }
  .nav-menu-button { min-height: 2.9rem; min-width: 2.9rem; }
  .na-home-hero { width: 100%; min-height: 0; padding: 7.9rem var(--na-gutter) 5rem; }
  .na-home-hero__backdrop { inset: 0 0 15% 0; }
  .na-home-hero__backdrop img { object-position: 40% center; }
  .na-home-hero__backdrop::after { background: linear-gradient(180deg,rgba(12,13,15,.42),rgba(12,13,15,.8) 38%,var(--na-void) 100%),linear-gradient(90deg,rgba(12,13,15,.4),rgba(12,13,15,.12)); }
  .na-home-hero__inner { grid-template-columns: minmax(0,1fr); gap: 2.4rem; }
  .na-home-hero__copy { padding: 0; }
  .na-home-hero h1 { max-width: 8ch; margin: 1.15rem 0 1.15rem; font-size: clamp(4.1rem,15vw,6.4rem); line-height: .91; }
  .na-home-hero__lead { max-width: 35rem; font-size: 1rem; }
  .na-home-hero .na-actions { gap: .45rem 1rem; }
  .na-home-hero__spec { margin-top: 1.65rem; }
  .na-home-hero__visual { width: min(100%,43rem); margin: .1rem auto 0; padding: 0 .2rem 2.15rem 0; }
  .na-hero-display { padding: .45rem; border-radius: .65rem; transform: none; }
  .na-hero-display:hover { transform: none; }
  .na-hero-display__top { padding: .15rem .22rem .52rem; font-size: .48rem; }
  .na-hero-display__note { right: -.15rem; bottom: -1rem; min-width: 68%; padding: .65rem .75rem; }
  .na-hero-display__note > span { font-size: .47rem; }
  .na-hero-display__note strong { font-size: .93rem; }
  .na-home-hero__visual-index { display: none; }
  .na-home-hero__edge { bottom: .6rem; gap: 1rem; padding-top: .7rem; font-size: .48rem; }
  .na-home-hero__edge > span { gap: .4rem; }
  .na-home-hero__edge a { font-size: .54rem; }
  .na-statement { grid-template-columns: 1fr; gap: 1.6rem; padding-block: 2.5rem; }
  .na-statement p { max-width: 19ch; font-size: clamp(1.7rem,7vw,2.4rem); }
  .na-statement__facts { border-left: 0; border-top: 1px solid var(--na-line); }
  .na-statement__facts span { gap: .55rem; padding: .85rem .45rem .25rem; font-size: .49rem; }
  .na-statement__facts b { font-size: .69rem; line-height: 1.35; }
  .na-featured { grid-template-columns: 1fr; gap: 2rem; padding-block: 4rem; }
  .na-featured__copy h2 { max-width: 12ch; font-size: clamp(2.9rem,10vw,4.4rem); }
  .na-featured__screen { order: 2; }
  .na-section-intro { display: grid; gap: 1rem; }
  .na-section-intro h2 { font-size: clamp(2.7rem,10vw,4.2rem); }
  .na-product-grid { grid-template-columns: repeat(6,minmax(0,1fr)); gap: .7rem; }
  /* La v3 remet les cartes du catalogue en grid-column: auto (sélecteur plus précis) : une seule colonne ici. */
  .na-product-grid--catalog { grid-template-columns: minmax(0,1fr); }
  .na-product-card,
  .na-product-card:nth-child(n) { grid-column: span 6; min-height: 27rem; }
  .na-product-card__link { grid-template-rows: auto minmax(13rem,1fr) auto; }
  .na-product-card__art { min-height: 14rem; margin-inline: -.2rem; }
  .na-product-card__art img { max-height: 17rem; }
  .na-product-card:nth-child(1) .na-product-card__art img { max-height: 19rem; }
  .na-photo-story { min-height: 40rem; padding: var(--na-gutter); }
  .na-photo-story__image img { object-position: 58% center; }
  .na-photo-story__shade { background: linear-gradient(90deg,rgba(12,13,15,.79),rgba(12,13,15,.26)),linear-gradient(0deg,rgba(12,13,15,.9),transparent 72%); }
  .na-photo-story h2 { max-width: 9ch; font-size: clamp(3.3rem,14vw,5.3rem); }
  .na-principles { padding-block: 4.2rem; }
  .na-principles__title h2 { font-size: clamp(2.7rem,10vw,4rem); }
  .na-principles__list { grid-template-columns: 1fr; margin-top: 2rem; }
  .na-principles__list article,
  .na-principles__list article + article { padding: 1.1rem 0; border-left: 0; border-bottom: 1px solid var(--na-line); }
  .na-principles__list p { max-width: 48ch; }
  .na-shop-callout { align-items: flex-start; flex-direction: column; gap: 1.3rem; margin-bottom: 3rem; }
  .na-shop-callout h2 { max-width: 11ch; font-size: clamp(2.2rem,8vw,3rem); }
  .na-catalog-hero { padding: 7rem var(--na-gutter) 1.4rem; }
  .na-catalog-hero__layout { grid-template-columns: 1fr; gap: 1.5rem; }
  .na-catalog-hero h1 { max-width: 10ch; margin-block: 1rem; font-size: clamp(3.7rem,14vw,6rem); }
  .na-catalog-hero__copy > p:not(.na-eyebrow) { font-size: 1rem; }
  .na-catalog-hero__visual { min-height: 13rem; }
  .na-family-nav { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); margin-top: 1.4rem; }
  .na-family-nav a { justify-content: space-between; padding-inline: .65rem; }
  .na-preview-note { margin-bottom: .8rem; font-size: .75rem; }
  .na-product-grid--catalog .na-product-card { min-height: 27rem; }
  .na-breadcrumb { margin-top: 5.5rem; }
  .na-product-hero { grid-template-columns: 1fr; gap: 1.7rem; min-height: 0; padding-block: 1.4rem 3rem; }
  .na-product-hero h1 { max-width: 10ch; font-size: clamp(3.45rem,13vw,5.4rem); }
  .na-product-hero__visual { order: 2; padding: .45rem; }
  .na-product-hero__visual .na-art { min-height: 0; }
  .na-product-hero__visual img { max-height: none; }
  .na-product-hero__edge { position: static; margin-top: .65rem; }
  .na-product-detail { grid-template-columns: 1fr; gap: 2rem; padding-block: 3.6rem; }
  .na-product-detail__image picture { height: clamp(15rem,58vw,23rem); }
  .na-product-detail__copy h2 { font-size: clamp(2.7rem,10vw,4rem); }
  .na-product-features { padding-block: 3.7rem; }
  .na-feature-grid { grid-template-columns: 1fr; }
  .na-product-specs { grid-template-columns: 1fr; gap: 1.3rem; padding-block: 3.8rem; }
  .na-product-specs h2 { max-width: 14ch; font-size: clamp(2.6rem,9vw,4rem); }
  .hero--page { min-height: 32rem; padding: 7.5rem var(--na-gutter) 3rem; }
  .display-hero { font-size: clamp(3.4rem,13vw,5.5rem); }
  .display { font-size: clamp(2.8rem,10vw,4.4rem); }
}

@media (max-width: 23rem) {
  .na-home-hero h1 { font-size: 3.65rem; }
  .na-home-hero__spec { font-size: .53rem; }
  .na-home-hero__edge > span { max-width: 60%; }
  .na-home-hero__edge a { text-align: right; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
  .na-product-card,
  .na-home-hero__copy,
  .na-home-hero__visual { transform: none !important; }
  .site-loader,
  .site-loader * { animation: none !important; }
}

/* Approved collection-first homepage: brand, Console as one example, then the open collection. */
:root { --na-gutter: clamp(1.25rem, 4.3vw, 4.4rem); }
.site-nav {
  position: fixed;
  inset: 0 0 auto;
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  pointer-events: none;
}
.nav-capsule.glass {
  min-height: 5.35rem;
  padding: .55rem var(--na-gutter);
  border: 0;
  border-bottom: 1px solid rgba(233,230,227,.19);
  border-radius: 0;
  background: linear-gradient(180deg,rgba(8,9,10,.98),rgba(8,9,10,.92));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035);
  pointer-events: auto;
}
.nav-brand { min-width: 13rem; min-height: 3rem; padding: 0; }
.nav-brand img { display: block; width: min(14.4rem,20vw); height: auto; border: 0; border-radius: 0; background: none; box-shadow: none; }
.nav-links { gap: clamp(.35rem,2.15vw,2.1rem); margin-right: 2.6rem; }
.nav-links a,
.nav-links > li > span { padding-inline: .55rem; border-radius: .35rem; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; white-space: nowrap; }
.nav-links a[aria-current="page"] { background: transparent; }
.nav-links a[aria-current="page"]::after { bottom: -.55rem; width: 1.3rem; height: 2px; }
.nav-shop { font-size: .75rem !important; letter-spacing: .09em; }
.nav-tools { margin-left: .35rem; padding-left: 2.45rem; border-left: 1px solid var(--na-line); }
.lang-switch { min-height: 3.05rem; padding: .2rem; border-radius: 2rem; }
.lang-switch a { min-width: 2.7rem; min-height: 2.55rem; border-radius: 2rem; font-size: .68rem; }
.nav-menu-button { pointer-events: auto; }

.site-loader { gap: .85rem; background: radial-gradient(ellipse at 50% 45%,rgba(72,83,81,.18),transparent 25rem),#090a0b; }
.site-loader img { width: clamp(12rem,24vw,17rem); height: auto; border: 0; border-radius: 0; background: none; box-shadow: none; }
.site-loader__caption { margin-top: .15rem; font-size: .56rem; letter-spacing: .2em; }
.site-loader__meter { width: 7.25rem; height: 2px; margin-top: .4rem; }

.na-home-hero {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  width: 100%;
  max-width: none;
  min-height: clamp(38rem,67.9svh,43rem);
  margin: 0;
  padding: 3.1rem var(--na-gutter) 2.15rem;
  border-bottom: 1px solid rgba(233,230,227,.2);
}
.na-home-hero::before {
  z-index: -1;
  background: linear-gradient(90deg,rgba(8,9,10,.84) 0%,rgba(8,9,10,.66) 31%,rgba(8,9,10,.27) 66%,rgba(8,9,10,.44) 100%),linear-gradient(0deg,rgba(7,8,9,.68),transparent 34%);
}
.na-home-hero__backdrop { inset: 0; }
.na-home-hero__backdrop::after { background: linear-gradient(90deg,rgba(8,9,10,.22),rgba(8,9,10,.12) 65%,rgba(8,9,10,.2)),linear-gradient(0deg,rgba(7,8,9,.55),transparent 40%); }
.na-home-hero__backdrop img { object-position: 50% 46%; filter: grayscale(1) brightness(.42) contrast(1.2); }
.na-home-hero__inner {
  grid-template-columns: minmax(29rem,.9fr) minmax(0,1.1fr);
  align-items: center;
  gap: clamp(2rem,4vw,4.5rem);
  width: min(100%,100rem);
  margin: auto;
}
.na-home-hero__copy { position: relative; top: .25rem; max-width: 43rem; padding: 0; animation: na-v4-arrive 720ms cubic-bezier(.2,.72,.26,1) both; }
.na-home-hero__eyebrow { height: .35rem; margin: 0 0 1.45rem; }
.na-home-hero__eyebrow .na-eyebrow__dot { display: block; width: 2.45rem; height: 2px; border-radius: 0; box-shadow: none; }
.na-home-hero h1 { width: calc(100% + 5rem); max-width: 45rem; margin: 0 0 1.35rem; font-size: clamp(3.8rem,5.25vw,5.2rem); letter-spacing: -.074em; line-height: .98; }
.na-home-hero__lead { max-width: 32rem; font-size: clamp(1.12rem,1.52vw,1.5rem); line-height: 1.5; }
.na-home-hero .na-actions { margin-top: 2.38rem; }
.na-home-hero .na-button--light { min-height: 3.8rem; gap: 1.45rem; padding-inline: 1.95rem; border-radius: .45rem; font-size: 1.12rem; font-weight: 600; }
.na-home-hero .na-button--light span { font-size: 1.1rem; }
.na-home-hero { overflow: clip; }
.na-home-hero__visual { position: relative; z-index: 1; display: block; min-width: 0; margin-right: calc(var(--na-gutter) * -.52); padding: 0; perspective: none; container-type: inline-size; animation: na-v4-arrive 960ms 90ms cubic-bezier(.2,.72,.26,1) both; }
/* Scène de la maquette validée : la Console au premier plan, d'autres interfaces réelles alignées derrière elle
   vers la gauche, avec leur reflet. Tout est en cqw (largeur de la colonne) pour garder la composition à chaque taille. */
/* Variables déclarées pour être animées : la rotation suit le défilement, la profondeur glisse au survol. */
@property --na-hero-turn { syntax: "<angle>"; inherits: true; initial-value: -37deg; }
@property --na-dz { syntax: "<length>"; inherits: false; initial-value: 0px; }
@keyframes na-hero-turn { from { --na-hero-turn: -37deg; } to { --na-hero-turn: -27deg; } }
@supports (animation-timeline: scroll()) {
  @media (prefers-reduced-motion: no-preference) {
    .na-hero-stage { animation: na-hero-turn linear both; animation-timeline: scroll(root block); animation-range: 0 80vh; }
  }
}
.na-hero-stage { --na-hero-turn: -37deg; --na-hero-y: calc(50% + 6cqw); position: relative; height: 66cqw; perspective: 300cqw; perspective-origin: 61% 70%; }
.na-hero-stack { position: absolute; inset: 0; transform-style: preserve-3d; pointer-events: none; }
.na-hero-stack__panel,
.na-hero-display { position: absolute; top: var(--na-hero-y, 50%); left: var(--na-hero-x, 55cqw); transform: translate(-50%,-50%) translate3d(var(--na-dx, 0px), 0px, var(--na-dz, 0px)) rotateY(var(--na-hero-turn)); -webkit-box-reflect: below .5cqw linear-gradient(transparent 62%, rgba(255,255,255,.34)); }
.na-hero-stack__panel { display: block; width: var(--na-w); height: auto; border: 1px solid rgba(233,230,227,.16); border-radius: .3rem; filter: brightness(var(--na-light)) blur(var(--na-blur)); box-shadow: 0 2cqw 5cqw rgba(0,0,0,.5); }
.na-hero-stack__panel--check { --na-w: 96cqw; --na-dx: -31.7cqw; --na-dz: -38.5cqw; --na-light: .7; --na-blur: .5px; }
.na-hero-stack__panel--mastering { --na-w: 94cqw; --na-dx: -62cqw; --na-dz: -93.5cqw; --na-light: .48; --na-blur: 1.2px; }
.na-hero-stack__panel--resonance { --na-w: 108cqw; --na-dx: -92.4cqw; --na-dz: -144cqw; --na-light: .36; --na-blur: 1.8px; }
.na-hero-stack__panel--vocals { --na-w: 108cqw; --na-dx: -122.6cqw; --na-dz: -200cqw; --na-light: .27; --na-blur: 2.4px; }
.na-hero-display {
  z-index: 1;
  display: block;
  width: 105cqw;
  margin: 0;
  padding: .35cqw;
  border: 1px solid rgba(233,230,227,.34);
  border-radius: .4rem;
  color: var(--na-chalk);
  background: linear-gradient(145deg,rgba(255,255,255,.1),transparent 28%),#101214;
  box-shadow: 0 4cqw 9cqw rgba(0,0,0,.56),inset 0 1px 0 rgba(255,255,255,.2);
  transform-style: flat;
  transition: --na-dz 520ms cubic-bezier(.2,.7,.24,1),box-shadow 520ms ease,border-color 260ms ease;
}
.na-hero-display::before { content: none; }
.na-hero-display::after { position: absolute; inset: auto 0 0; height: 22%; background: linear-gradient(0deg,rgba(0,0,0,.16),transparent); content: ""; pointer-events: none; }
.na-hero-display:hover { --na-dz: 1.6cqw; transform: translate(-50%,-50%) translate3d(0px,0px,var(--na-dz)) rotateY(var(--na-hero-turn)); border-color: rgba(233,230,227,.58); box-shadow: 0 5cqw 11cqw rgba(0,0,0,.64),inset 0 1px 0 rgba(255,255,255,.24); }
.na-hero-display img { display: block; width: 100%; height: auto; border-radius: .15rem; }
.na-hero-stack__panel img { display: block; width: 100%; height: auto; border-radius: inherit; }
/* Vu-mètres animés (js/hero-meters.js), dessinés exactement sur les barres des captures. */
.na-hero-screen { position: relative; display: block; }
.na-hero-meters { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }

.na-home-collection { width: 100%; padding: 2.15rem 2vw 2.1rem; border-bottom: 1px solid var(--na-line); background: linear-gradient(180deg,rgba(255,255,255,.015),transparent 55%); }
.na-home-collection__grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,12rem),1fr)); width: min(100%,100rem); margin: 0 auto; }
.na-home-collection { position: relative; }
.na-home-collection__title { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.na-home-collection__title span { display: none; }
.na-collection-card { min-width: 0; }
.na-collection-card + .na-collection-card { border-left: 1px solid var(--na-line); }
.na-collection-card__link { display: grid; grid-template-rows: auto minmax(6.8rem,1fr) auto; gap: 1.075rem; height: 100%; padding: .5rem clamp(1.15rem,1.8vw,1.8rem) .35rem; color: var(--na-chalk); text-decoration: none; }
.na-collection-card__heading { min-height: 2.65rem; }
.na-collection-card__heading h2 { overflow: hidden; margin: 0 0 .35rem; color: #f0eeeb; font-family: var(--na-font-display); font-size: clamp(.62rem,.8vw,.84rem); font-weight: 500; letter-spacing: .13em; line-height: 1.4; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.na-collection-card__heading p { margin: 0; color: #bec3c0; font-size: clamp(.5rem,.68vw,.66rem); letter-spacing: .16em; line-height: 1.45; text-transform: uppercase; }
.na-collection-card__screen { display: grid; place-items: center; min-width: 0; aspect-ratio: 1.53; overflow: hidden; border: 1px solid rgba(233,230,227,.2); border-radius: .2rem; background: radial-gradient(ellipse at 45% 0,rgba(255,255,255,.065),transparent 70%),#090a0b; transition: border-color 240ms ease,transform 420ms cubic-bezier(.2,.7,.24,1),box-shadow 240ms ease; }
.na-collection-card__screen picture { display: block; width: 100%; height: 100%; }
.na-collection-card__screen img { display: block; width: 100%; height: 100%; object-fit: contain; }
.na-collection-card__arrow { display: inline-flex; align-items: center; min-height: 1.5rem; color: var(--na-green); font-size: 1.1rem; line-height: 1; transition: transform 240ms ease; }
.na-collection-card__link:hover .na-collection-card__screen,
.na-collection-card__link:focus-visible .na-collection-card__screen { border-color: rgba(114,185,164,.62); box-shadow: 0 10px 26px rgba(0,0,0,.28); transform: translateY(-2px); }
.na-collection-card__link:hover .na-collection-card__arrow { transform: translateX(4px); }
.na-photo-story { min-height: clamp(31rem,55vw,45rem); }
.na-photo-story__copy h2 { max-width: 13ch; }
.na-photo-story__copy > .na-text-link { display: inline-flex; margin-top: .85rem; }
.footer-brand__mark { align-items: flex-start; }
.footer-brand__mark img { width: min(13rem,70vw); height: auto; border: 0; border-radius: 0; background: none; }
.closing__mark { width: 12rem; height: auto; border: 0; border-radius: 0; object-fit: contain; background: none; }

@media (max-width: 70rem) {
  .nav-capsule.glass { min-height: 4.8rem; }
  .nav-brand { min-width: 10rem; }
  .nav-brand img { width: min(11rem,18vw); }
  .nav-links { gap: .15rem; }
  .nav-links a,
  .nav-links > li > span { padding-inline: .38rem; font-size: .65rem; }
  .nav-shop { font-size: .63rem !important; }
  .nav-tools { padding-left: .65rem; }
  .na-home-hero { min-height: clamp(34rem,65svh,39rem); padding-top: 4.8rem; }
  .na-home-hero__visual { margin-right: 0; }
  .na-home-hero__inner { grid-template-columns: minmax(23rem,.92fr) minmax(0,1.08fr); gap: 2rem; }
  .na-home-hero h1 { width: calc(100% + 5rem); font-size: clamp(3.3rem,5vw,4.4rem); }
  .na-home-hero__copy { top: 0; }
  .na-home-collection__grid { grid-template-columns: repeat(3,minmax(0,1fr)); row-gap: 1.1rem; }
  .na-collection-card:nth-child(4) { border-left: 0; }
  .na-collection-card__link { padding-inline: 1rem; }
  .na-collection-card__heading h2 { font-size: .72rem; }
  .na-collection-card__heading p { font-size: .57rem; }
}

@media (max-width: 52.5rem) {
  .site-nav { top: 0; }
  .nav-capsule.glass { min-height: 4.45rem; padding-inline: var(--na-gutter); }
  .nav-brand { min-width: 0; }
  .nav-brand img { width: min(10.4rem,42vw); }
  .nav-tools { display: none; }
  .na-home-hero { display: block; min-height: 0; padding: 7.25rem var(--na-gutter) 2.2rem; }
  .na-home-hero__backdrop { inset: 0; }
  .na-home-hero__backdrop::after { background: linear-gradient(180deg,rgba(7,8,9,.2),rgba(7,8,9,.76) 38%,rgba(7,8,9,.92)),linear-gradient(90deg,rgba(8,9,10,.5),rgba(8,9,10,.12)); }
  .na-home-hero__backdrop img { object-position: 63% center; filter: grayscale(1) brightness(.24) contrast(1.15); }
  .na-home-hero__inner { grid-template-columns: minmax(0,1fr); gap: 1.8rem; }
  .na-home-hero__copy { max-width: 38rem; }
  .na-home-hero__eyebrow { margin-bottom: 1.1rem; }
  .na-home-hero__copy { top: 0; }
  .na-home-hero h1 { width: auto; max-width: 12ch; margin-bottom: 1.05rem; font-size: clamp(3rem,11.8vw,4.15rem); line-height: .98; }
  .na-home-hero__lead { max-width: 35rem; font-size: 1rem; line-height: 1.55; }
  .na-home-hero .na-actions { margin-top: 1.5rem; }
  .na-home-hero .na-button--light { min-height: 3.45rem; gap: 1.2rem; padding-inline: 1.45rem; font-size: 1rem; }
  /* La scène du desktop en pleine largeur, réduite et décalée à droite : la pile reste visible à gauche. */
  .na-home-hero__visual { width: auto; max-width: none; margin: .4rem calc(var(--na-gutter) * -1) 0; padding: 0; }
  .na-hero-stage { margin-bottom: -6cqw; transform: translateX(7cqw) scale(.94); transform-origin: 0 0; }
  /* La collection défile au doigt : une grande carte à la fois, la suivante dépasse à droite. */
  .na-home-collection { padding: 1.7rem 0 2.1rem; }
  .na-home-collection__title { position: static; display: flex; align-items: center; gap: .65rem; width: auto; height: auto; margin: 0 var(--na-gutter) 1rem; overflow: visible; clip-path: none; color: #b9bfbc; font: 500 .66rem/1.4 var(--na-font-mono); letter-spacing: .2em; text-transform: uppercase; white-space: normal; }
  .na-home-collection__title::before { width: 1.6rem; height: 1px; background: var(--na-green); content: ""; }
  .na-home-collection__title span { display: inline; margin-left: auto; color: var(--na-green); font-size: .95rem; letter-spacing: 0; }
  .na-home-collection__grid { display: flex; gap: .75rem; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 0 var(--na-gutter) .25rem; scroll-padding-inline: var(--na-gutter); scrollbar-width: none; }
  .na-home-collection__grid::-webkit-scrollbar { display: none; }
  .na-collection-card,
  .na-collection-card + .na-collection-card { flex: 0 0 min(80%,22rem); border: 1px solid rgba(233,230,227,.14); border-radius: .7rem; background: linear-gradient(160deg,rgba(255,255,255,.05),transparent 55%),#111315; scroll-snap-align: start; }
  .na-collection-card__link,
  .na-collection-card:first-child .na-collection-card__link,
  .na-collection-card:last-child .na-collection-card__link { gap: .9rem; padding: 1.05rem 1.05rem .9rem; }
  .na-collection-card__heading { min-height: 0; }
  .na-collection-card__heading h2 { font-size: .86rem; letter-spacing: .14em; }
  .na-collection-card__heading p { font-size: .64rem; letter-spacing: .16em; }
  .na-collection-card__screen { aspect-ratio: 1.53; border-radius: .35rem; }
  .na-photo-story { min-height: 34rem; }
  .footer-brand__mark img { width: 11rem; }
}

@media (max-width: 23rem) {
  .nav-capsule.glass { min-height: 4.1rem; }
  .na-home-hero { padding-top: 6.7rem; }
  .na-home-hero h1 { font-size: 2.75rem; }
  .na-collection-card__link { padding-inline: .5rem; }
  .na-collection-card__heading h2 { font-size: .64rem; }
  .na-collection-card__heading p { font-size: .52rem; }
}

@media (max-width: 25rem) {
  .na-home-hero h1 { max-width: none; font-size: clamp(2.7rem,11.7vw,3rem); }
}

@media (prefers-reduced-motion: reduce) {
  .na-home-hero__copy,
  .na-home-hero__visual { animation: none; }
  .na-collection-card__screen,
  .na-collection-card__arrow { transform: none; }
  .na-hero-display:hover { --na-dz: 0px; }
}

@media (min-width: 52.5625rem) and (max-width: 68rem) {
  .product-path__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .product-path__grid article,
  .product-path__grid article + article { padding: 1.15rem 0; border-left: 0; border-bottom: 1px solid var(--na-line); }
  .product-path__grid article:nth-child(even) { padding-left: 1.35rem; border-left: 1px solid var(--na-line); }
}

@media (prefers-reduced-transparency: reduce) {
  .nav-capsule.glass,
  .nav-sheet.glass,
  .na-hero-display__note { background: #171a1c; -webkit-backdrop-filter: none; backdrop-filter: none; }
}