/* Nucleolenz About — technical editorial composition */
.nz-about-page {
  background: #fff;
}

.nz-about {
  --about-ink: #14161a;
  --about-paper: #fff;
  --about-muted: #6e747d;
  --about-line: rgba(20, 22, 26, 0.16);
  --about-orange: var(--nz-orange, #ff5722);
  width: 100vw;
  max-width: none;
  margin-inline: calc(50% - 50vw);
  overflow: clip;
  background: var(--about-paper);
  color: var(--about-ink);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
}

.nz-about *,
.nz-about *::before,
.nz-about *::after {
  box-sizing: border-box;
}

.nz-about h1,
.nz-about h2,
.nz-about h3,
.nz-about p,
.nz-about figure,
.nz-about dl,
.nz-about ol {
  margin-top: 0;
}

.nz-about h1,
.nz-about h2,
.nz-about h3 {
  font-family: var(--font-display);
  text-wrap: balance;
}

.nz-about p {
  text-wrap: pretty;
}

.nz-about img {
  max-width: 100%;
}

.nz-about .animate-on-scroll {
  transform: translateY(18px);
  transition-property: opacity, transform;
  transition-duration: 600ms;
  transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.nz-about .animate-on-scroll.visible {
  transform: translateY(0);
}

.nz-about-shell {
  width: min(100%, 1600px) !important;
  margin-inline: auto;
  padding-inline: clamp(1.25rem, 4vw, 4.5rem) !important;
}

.nz-about-kicker {
  display: block !important;
  width: auto !important;
  margin: 0 0 clamp(1.5rem, 3vw, 2.5rem) !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: inherit !important;
  opacity: 0.64;
}

/* Immersive opening frame */
.nz-about-hero {
  position: relative;
  isolation: isolate;
  display: grid;
  width: 100%;
  min-height: 100svh;
  min-height: 100dvh;
  padding: calc(var(--nz-header-h, 66px) + clamp(2rem, 6vh, 4rem)) max(var(--space-xl, 2rem), calc((100vw - 1500px) / 2)) clamp(2rem, 6vh, 4rem);
  align-items: center;
  overflow: hidden;
  background: #f4f5f6 !important;
  color: var(--about-ink);
}

.nz-about-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: var(--about-hero-bg) 58% center / cover no-repeat;
  transform: scale(1.015);
}

.nz-about-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(180deg, transparent 65%, rgba(255, 255, 255, .6) 88%, #fff 100%),
    linear-gradient(90deg, rgba(255, 255, 255, .64) 0%, rgba(255, 255, 255, .42) 34%, transparent 64%);
}

.nz-about-hero-content {
  width: min(100%, 1500px) !important;
  margin: 0 auto !important;
  padding: 0 !important;
  text-align: left !important;
}

.nz-about-hero .nz-about-kicker {
  margin-bottom: 1rem !important;
  font-size: 0.75rem !important;
  line-height: 1.7 !important;
  letter-spacing: 0.2em !important;
  opacity: 0.78;
}

.nz-about-hero h1 {
  max-width: none !important;
  margin: 0;
  font-family: 'Outfit', var(--font-display), sans-serif !important;
  font-size: clamp(2.6rem, 5.5vw, 5rem) !important;
  font-weight: 300 !important;
  line-height: 1.02 !important;
  letter-spacing: -0.02em !important;
  color: var(--about-ink) !important;
}

.nz-about-hero h1 strong { font-weight: 700; }

.nz-about-hero-content > p:not(.nz-about-kicker) {
  max-width: 36ch !important;
  margin: clamp(1rem, 2.5vh, 1.6rem) 0 0 !important;
  font-family: var(--font-body) !important;
  font-size: clamp(1rem, 1.3vw, 1.2rem) !important;
  line-height: 1.6 !important;
  color: #60666f !important;
}

.nz-about-arrow-link {
  display: inline-flex;
  min-height: 44px;
  margin-top: 1.5rem;
  align-items: center;
  gap: 0.8rem;
  border-bottom: 1px solid rgba(20, 22, 26, .65);
  font-family: var(--font-display);
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--about-ink) !important;
  text-decoration: none;
  transition-property: color, border-color;
  transition-duration: 180ms;
  transition-timing-function: ease-out;
}

.nz-about-arrow-link svg {
  transition: transform 180ms ease-out;
}

.nz-about-arrow-link:hover,
.nz-about-arrow-link:focus-visible {
  border-color: var(--about-orange);
  color: var(--about-orange) !important;
}

.nz-about-arrow-link:hover svg {
  transform: translateY(3px);
}

.nz-about-arrow-link:active,
.na-contact-link:active {
  scale: 0.96;
}

/* Shared reading scale for the About content; hero and footer retain their styles. */
.nz-about-content, .na-invitation {
  --about-body-size: var(--nz-copy-size);
  --about-body-leading: var(--nz-copy-leading);
  --about-label-size: var(--nz-caption-size);
}
.nz-about-content { scroll-margin-top: 80px; }
.nz-about-content > section { background: transparent; }
.na-principles { padding: 0; }
.nz-about-content .nz-about-shell { max-width: 1340px; }
.na-eyebrow { font: 400 var(--about-label-size)/1.5 var(--font-body); color: #60666f; margin-bottom: 22px; }
.na-prose { font-size: var(--about-body-size); line-height: var(--about-body-leading); color: #60666f; }
.na-prose p { margin-bottom: 18px; }
.na-prose p:last-child { margin-bottom: 0; }
.na-prose a { color: inherit; text-underline-offset: 4px; }
.nz-about .na-section-heading { font: 400 clamp(34px, 4.4vw, 64px)/1.02 'Outfit', var(--font-display), sans-serif; letter-spacing: -.045em; text-wrap: pretty; margin-bottom: 0; }
.na-story { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(36px, 7vw, 110px); align-items: start; padding-block: clamp(72px, 8vw, 120px); }
.na-story-heading .na-eyebrow { margin-bottom: 20px; }
.nz-about .na-statement { max-width: 15ch; margin: 0; font: 400 clamp(30px, 3.1vw, 44px)/1.1 'Outfit', var(--font-display), sans-serif; letter-spacing: -.035em; text-wrap: pretty; }
.na-company-copy { max-width: 64ch; font-size: var(--about-body-size); line-height: var(--about-body-leading); color: #4f5660; }
.na-company-copy p { margin: 0 0 1em; font: inherit; color: inherit; }.na-company-copy p:last-child { margin-bottom: 0; }
.na-company-copy strong { font-weight: 600; color: var(--about-ink); }
.na-company-copy a { color: inherit; text-decoration: underline; text-underline-offset: 4px; }
.na-word-band { position: relative; display: flex; justify-content: center; overflow: hidden; padding-block: 35px 80px; }
.na-word-band > div { position: relative; width: max-content; flex-shrink: 0; white-space: nowrap; font: 450 clamp(72px, 11.4vw, 190px)/1.08 'Outfit', var(--font-display), sans-serif; letter-spacing: -.065em; transform: translateX(var(--band-x, 0px)); }
.na-word-band::before { content: ''; position: absolute; width: clamp(160px, 20vw, 330px); aspect-ratio: 1; top: -5%; left: 5%; border-radius: 49% 51% 64% 36%; border: 1px solid #ef77336b; box-shadow: inset 0 0 24px #ff9f5130, 0 0 18px #ff9f5124; transform: rotate(-25deg); }
.na-principles-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(50px, 9vw, 140px); align-items: center; padding-block: 22px clamp(100px, 10vw, 150px); }
.na-principles-copy > h2 { max-width: 10ch; }
.na-principle-list { margin-top: 40px; }
.na-principle { padding-block: 22px; border-bottom: 1px solid var(--about-line); }
.na-principle:last-child { border-bottom: 0; }
.na-principle summary { display: grid; grid-template-columns: 28px 1fr 20px; gap: 12px; align-items: baseline; cursor: pointer; list-style: none; min-height: 28px; }
.nz-about summary::-webkit-details-marker { display: none; }
.na-index { font: 400 var(--about-label-size)/1.5 var(--font-mono); color: #60666f; }
.na-principle h3 { font-size: clamp(23px, 2.3vw, 32px); font-weight: 400; line-height: 1.1; letter-spacing: -.035em; margin: 0; color: #60666f; transition: color 220ms; }
.na-principle[open] h3 { color: var(--about-ink); }
.na-principle[open] .na-index { color: #b94112; }
.na-principle p { margin: 16px 26px 0 40px; font-size: var(--about-body-size); line-height: var(--about-body-leading); color: #4f5660; max-width: 35ch; }
.na-toggle { position: relative; width: 16px; height: 16px; align-self: center; }
.na-toggle::before, .na-toggle::after { content: ''; position: absolute; background: currentColor; left: 2px; right: 2px; height: 1px; top: 7px; }
.na-toggle::after { transform: rotate(90deg); transition: transform 200ms; }
details[open] > summary .na-toggle::after { transform: rotate(0); }
.nz-about summary:focus-visible, .nz-about a:focus-visible { outline: 2px solid #bb4217; outline-offset: 5px; }
.na-optics { --lens-turn: -25deg; --lens-scale: 1; position: relative; isolation: isolate; overflow: hidden; aspect-ratio: 1.08; border-radius: 18px; background: radial-gradient(ellipse at 60% 32%, #fff 0, #f2f4f6 55%, #e3e7eb 100%); }
.na-optics-grid { position: absolute; inset: 0; opacity: .28; background-image: linear-gradient(#927b5725 1px, transparent 1px),linear-gradient(90deg,#927b5725 1px,transparent 1px); background-size: 42px 42px; mask-image: radial-gradient(ellipse, #000, transparent 80%); }
.na-optics-lens { position: absolute; width: 70%; aspect-ratio: 1; top: 12%; left: 15%; border-radius: 50%; transform: rotate(var(--lens-turn)) scale(var(--lens-scale)); transition: transform 850ms cubic-bezier(.22,1,.36,1); }
.na-optics-lens i { position: absolute; inset: 0; border: 1px solid #fff7e9c9; border-radius: 50%; background: linear-gradient(135deg,#ffffedb5 8%,#ffb05a13 32%,#f36b1ea1 67%,#ffc9831c 86%); box-shadow: 18px 24px 34px #ad63272c, inset 4px 3px 6px #ffffffe8, inset -3px -5px 8px #a941153d; }
.na-optics-lens i:nth-child(2) { inset: 10%; transform: translate(-13%,3%); }
.na-optics-lens i:nth-child(3) { inset: 20%; transform: translate(19%,-7%); }
.na-optics-lens i:nth-child(4) { inset: 32%; }
.na-optics-lens b { position: absolute; inset: 46%; border-radius: 50%; background: #f9f2df; box-shadow: 0 1px 6px #712e1d6b; }
.na-optics-cross { position: absolute; color: #6e747d; font: 200 24px/1 var(--font-mono); }
.na-optics-cross--one { top: 7%; left: 7%; }.na-optics-cross--two { right: 7%; bottom: 16%; }
.na-optics-label { position: absolute; bottom: 30px; left: 30px; font: 400 22px/1 var(--font-display); letter-spacing: -.02em; }
.na-optics-coordinate { position: absolute; bottom: 32px; right: 30px; font: var(--about-label-size)/1.4 var(--font-mono); }
.na-team { padding-block: 28px clamp(100px, 10vw, 155px); }
.na-team-heading { display: grid; grid-template-columns: 1fr 1fr; gap: 15%; align-items: end; margin-bottom: 48px; }
.na-team-heading h2 { max-width: 10ch; }.na-team-heading p { max-width: 35ch; margin: 0; }
.na-people { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.na-person { position: relative; overflow: hidden; border-radius: 12px; min-width: 0; aspect-ratio: .79; background: #e5e7e9; }
.na-person:nth-child(4) { grid-column: 2; }
.na-person figure { margin: 0; height: 100%; }
.na-person img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; transition: transform 550ms cubic-bezier(.22,1,.36,1); }
.na-person::after { content:''; position: absolute; inset: 30% 0 0; background: linear-gradient(0deg,#101713d9,transparent 65%); pointer-events: none; }
.na-person-caption { position: absolute; bottom: 24px; left: 24px; right: 16px; z-index: 1; color: #fff; }
.na-person-caption h3 { margin: 0 0 6px; color: #fff; font: 400 clamp(17px,1.65vw,24px)/1.1 'Outfit',var(--font-display); letter-spacing: -.02em; text-wrap: pretty; }
.na-person-caption p { font: 400 16px/1.5 var(--font-body); margin: 0; color: #ffffffe6; }
.na-person--no-image { background: linear-gradient(135deg,#b9b8a6,#737969); }
.na-team-invitation { position: relative; grid-column: 1; grid-row: 2; display: flex; flex-direction: column; align-items: start; justify-content: end; align-self: end; min-height: 300px; aspect-ratio: 1.1; padding: 28px; overflow: hidden; border-radius: 12px; background: #f2f4f6; color: var(--about-ink); text-decoration: none; }
.na-team-invitation > span { position: relative; max-width: 10ch; font: 400 clamp(25px,2.7vw,38px)/1.05 'Outfit',var(--font-display); letter-spacing: -.035em; }
.na-team-invitation > b { position: absolute; right: 28px; bottom: 28px; font-size: 28px; font-weight: 400; }
.na-team-orbit { position: absolute; top: -27%; right: -15%; width: 90%; aspect-ratio: 1; }
.na-team-orbit i { position: absolute; inset: 0; border: 1px solid #c269384f; border-radius: 50%; box-shadow: inset 0 0 20px #ff9f5124; }
.na-team-orbit i:nth-child(2) { transform: translateX(-22%); }.na-team-orbit i:nth-child(3) { transform: translateY(22%); }
.na-invitation { padding: clamp(24px,4vw,60px); background: #14161a; }
.na-invitation-frame { position: relative; overflow: hidden; min-height: 470px; display: grid; align-items: center; isolation: isolate; border-radius: clamp(24px, 2.5vw, 32px); background: #f2f4f6; }
.na-invitation-content { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 60px; padding-block: 60px; }
.nz-about .na-invitation h2 { max-width: 17ch; font: 400 clamp(37px,4.3vw,64px)/1.02 'Outfit',var(--font-display); letter-spacing: -.045em; margin: 0; }
.na-contact-link { display: inline-flex; align-items: center; justify-content: space-between; gap: 25px; padding: 18px 24px; min-height: 52px; border-radius: var(--radius-full, 9999px); color: #fff; background: #14161a; font-size: var(--about-body-size); line-height: 1.5; text-decoration: none; transition: background 180ms,color 180ms; }
.na-contact-link:hover { background: #b94112; color: #fff; }
.na-invitation-art { position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse at 85% 0%,#ff924226,transparent 48%),radial-gradient(ellipse at 5% 100%,#ffcc8f25,transparent 48%); }
.na-invitation-art i { position: absolute; width: 330px; height: 330px; border: 1px solid #e7b6878c; border-radius: 50%; box-shadow: inset 0 0 40px #ffba7740; top: -230px; left: 15%; }
.na-invitation-art i:nth-child(2) { width: 480px; height: 480px; top: auto; bottom: -370px; left: 40%; }.na-invitation-art i:nth-child(3) { width: 190px; height: 190px; left: auto; right: -90px; top: 25%; }
@media (hover:hover) { .na-person:hover img { transform: scale(1.035); }.na-team-invitation:hover { background: #e9ecef; }.na-principle summary:hover h3 { color: var(--about-ink); } }
@media (max-width:1020px) {
  .nz-about-hero, .nz-about-hero-content { text-align: center !important; }
  .nz-about-hero-content > p:not(.nz-about-kicker) { margin-inline: auto !important; }
  .na-principles-layout { gap: 40px; }
  .na-person-caption { bottom: 18px; left: 16px; }.na-person-caption h3 { font-size: 19px; }
  .na-team-invitation { min-height: 240px; padding: 20px; }.na-team-invitation > b { right: 20px; bottom: 20px; }
  .na-invitation-content { gap: 30px; grid-template-columns: 1fr; justify-items: start; }
}
@media (max-width:780px) {
  .nz-about-hero { min-height: 100svh; }
  .nz-about-hero::before { background-position: 64% center; }
  .nz-about-hero::after { background: linear-gradient(180deg, #ffffffc9 0%, #ffffffe6 45%, #ffffffb3 74%, #fff 100%); }
  .na-story { grid-template-columns: 1fr; gap: 28px; padding-block: 70px 50px; }
  .na-word-band { padding-block: 25px 60px; }
  .na-principles-layout, .na-team-heading { grid-template-columns: 1fr; gap: 32px; }
  .na-principles-copy > h2 { max-width: 16ch; }.na-principle-list { margin-top: 16px; }
  .na-optics { max-height: 550px; aspect-ratio: 1.2; }
  .na-principles-layout { padding-bottom: 80px; }
  .na-team-heading p { max-width: 46ch; }
  .na-team { padding-top: 10px; }.na-team-heading { gap: 20px; margin-bottom: 30px; }
  .na-people { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .na-person:nth-child(4) { grid-column: auto; }.na-team-invitation { grid-row: auto; grid-column: auto; align-self: stretch; min-height: 0; aspect-ratio: auto; }
  .na-team-invitation > span { font-size: 26px; }.na-team-invitation > b { font-size: 24px; bottom: 15px; right: 15px; }
  .na-invitation-frame { min-height: 390px; }.na-invitation-content { padding-block: 48px; }
}
@media (max-width:480px) {
  .nz-about-hero-content > p:not(.nz-about-kicker) { max-width: 40ch !important; }
  .na-person-caption { bottom: 14px; left: 12px; right: 10px; }.na-person-caption h3 { font-size: 19px; }.na-person-caption p { font-size: 14px; }
  .na-person { aspect-ratio: .7; }.na-team-invitation { padding: 16px; }.na-team-invitation > span { font-size: 24px; margin-bottom: 30px; }
  .na-optics-label { left: 24px; bottom: 24px; }.na-optics-coordinate { right: 24px; bottom: 26px; }
}
@media (prefers-reduced-motion:reduce) {
  .nz-about .animate-on-scroll { opacity: 1; transform: none; transition: none; }
  .na-word-band > div { transform: none; }.na-optics-lens,.na-person img,.na-toggle::after { transition: none; }
  .nz-about-arrow-link:hover svg { transform: none; }
}
