.is-about {
  --ab-pad-y: clamp(88px, 15rem, 166px);
  --ab-ink: rgba(16, 12, 6, .92);
  --ab-dir-gap: clamp(28px, 6.4rem, 71px);
  --ab-gold-hair: #e0bd6f;

  --ab-cast:
    drop-shadow(0 1px 0 rgba(54, 33, 5, .9))
    drop-shadow(0 4px 6px rgba(0, 0, 0, .42));
  --ab-cast-paper:
    drop-shadow(0 1px 0 rgba(96, 64, 14, .32))
    drop-shadow(0 3px 4px rgba(125, 86, 21, .16));
}

.ab-sec { position: relative; z-index: 6; }

.ab-eyebrow {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  margin: 0 0 2.6rem;

  font-family: var(--font-sans);
  font-size: clamp(11px, 1.2rem, 13.3px);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: .28em;
  text-transform: uppercase;
  color: var(--gold);
}

.ab-eyebrow i,
.ab-rule-r {
  flex: none;
  display: inline-block;
  width: 5.6rem;
  height: 2px;
  background: linear-gradient(90deg, var(--ab-gold-hair), rgba(224, 189, 111, 0));
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.ab-eyebrow--c { justify-content: center; }

.ab-eyebrow--c i:first-child {
  background: linear-gradient(90deg, rgba(224, 189, 111, 0), var(--ab-gold-hair));
  clip-path: polygon(0 50%, 100% 0, 100% 100%);
}

.ab-title {
  font-family: var(--font-title);
  font-weight: 400;
  font-size: clamp(34px, 6.2rem, 69px);
  line-height: 1.12;
  letter-spacing: -.016em;
  color: var(--paper);

  margin: 0 0 1.4rem;
  max-width: 17ch;
  text-wrap: balance;
}

.is-about h1 em,
.is-about h2 em,
.is-about h3 em { font-style: normal; }

.ab-body {
  font-size: clamp(15px, 1.85rem, 20.5px);
  font-weight: 400;
  line-height: 1.55;
  color: var(--on-dark);

  margin: 0 0 1.6rem;
  max-width: 50ch;
}

.ab-body:last-child { margin-bottom: 0; }

.ab-role {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem 1.2rem;
  margin: 0;

  font-size: clamp(11px, 1.2rem, 13.3px);
  font-weight: 500;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--gold);
}

.ab-role .ab-rule-r { width: 4.4rem; }

.ab-dot {
  width: .4rem;
  height: .4rem;
  border-radius: 50%;
  background: currentColor;
  opacity: .7;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ab-eyebrow span,
  .ab-trade-idx b,
  .ab-pv-idx b,
  .ab-facts b {
    background-image: var(--gold-metal);
    background-repeat: no-repeat;
    background-size: 100% 640%;
    background-position: 50% 24%;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: var(--gold-small-cast);
  }

  .ab-trade-idx b,
  .ab-pv-idx b,
  .ab-facts b {
    background-size: 100% 100%;
    background-position: 50% 50%;
  }

  .ab-title em,
  .ab-cta-title em,
  .ab-hero-title em,
  .ab-pv-title em {
    background-image: var(--gold-metal);
    background-repeat: no-repeat;
    background-size: 100% 100%;
    background-position: 50% 50%;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: var(--ab-cast);
  }
}

.ab-frame {
  display: block;
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-radius: var(--r-card, 20px);
  background: #0b0b0b;
}

.ab-frame img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}

[data-px] img { top: -8%; height: 116%; }

.ab-shine img {
  filter: contrast(1.02) brightness(.95);
  transition:
    scale 1.25s var(--ease-arch),
    filter .9s var(--ease-out);
}

.ab-shine::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: 0;
  background: linear-gradient(104deg,
    rgba(255, 253, 244, 0)   40%,
    rgba(247, 227, 173, .18) 47%,
    rgba(255, 253, 244, .3)  50%,
    rgba(247, 227, 173, .18) 53%,
    rgba(255, 253, 244, 0)   60%);
  transform: translateX(-115%);
  transition:
    transform 1.15s var(--ease-arch),
    opacity .3s var(--ease-out) .85s;
}

@media (hover: hover) {
  .ab-shine:hover img,
  .ab-lead:hover .ab-shine img {
    scale: 1.055;
    filter: contrast(1.05) brightness(1.02);
  }

  .ab-shine:hover::after,
  .ab-lead:hover .ab-shine::after {
    opacity: 1;
    transform: translateX(115%);
    transition:
      transform 1.15s var(--ease-arch),
      opacity .25s var(--ease-out);
  }
}

.ab-hero {
  height: 100vh;
  height: 100svh;
  min-height: 60rem;
  overflow: hidden;
  background: #000;
  color: var(--paper);
}

.ab-hero-media {
  position: absolute;
  left: 0;
  right: 0;
  top: -10%;
  height: 120%;
}

/* The NB emblem: a square of its circle and glow (20px of padding built in), shown
   whole at the right edge and centred in the space under the header. */
.ab-hero-media img {
  --emb: min(calc(100svh - var(--header-h) - 6rem), 52vw, 780px);
  position: absolute;
  top: calc(50% + var(--header-h) / 2);
  right: 0;
  width: var(--emb);
  height: var(--emb);
  max-width: none;
  margin-top: calc(var(--emb) / -2);
  object-fit: contain;
  transform-origin: 50% 50%;
}

.ab-hero-in {
  position: absolute;
  inset: 0;
  z-index: 2;
  align-content: end;
  padding-bottom: clamp(44px, 8.4rem, 93px);
}

.ab-hero-copy {
  grid-column: content-start / span 10;
  grid-row: 1;
}

.ab-hero-title {
  margin: 0 0 3.4rem;
  font-family: var(--font-title);
  font-weight: 400;
  font-size: clamp(46px, 9rem, 99px);
  line-height: 1.2;
  letter-spacing: -.02em;
  color: var(--paper);
}

.ab-hero-line { display: block; }

.ab-hero-text {
  position: relative;
  margin: 0;
  max-width: 40ch;
  padding-left: 2.4rem;
  font-size: clamp(16px, 2rem, 22px);
  font-weight: 400;
  line-height: 1.6;
  color: rgba(251, 250, 247, .9);
  text-wrap: pretty;
}

.ab-hero-text::before {
  content: '';
  position: absolute;
  left: 0;
  top: .3em;
  bottom: .3em;
  width: 2px;
  background: linear-gradient(180deg, #e0bd6f, rgba(224, 189, 111, .15));
}

.ab-hero-side {
  grid-column: span 4 / content-end;
  grid-row: 1;
  align-self: end;
  justify-self: end;
}

.ab-cue {
  display: flex;
  align-items: center;
  gap: 1.4rem;
  font-size: clamp(10.5px, 1.1rem, 12.2px);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(251, 250, 247, .6);
}

.ab-cue i {
  position: relative;
  display: block;
  width: 6rem;
  height: var(--hair);
  overflow: hidden;
  background: rgba(251, 250, 247, .2);
}

.ab-cue i::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--gold);
  transform: translateX(-100%);
  animation: ab-cue 2.4s var(--ease) infinite;
}

@keyframes ab-cue {
  0%   { transform: translateX(-100%); }
  55%  { transform: translateX(0); }
  100% { transform: translateX(100%); }
}

.ab-intro [data-hero-in],
.ab-intro .header-inner { opacity: 0; }

.ab-origin {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(42% 60% at 22% 50%, rgba(160, 118, 48, .16), rgba(160, 118, 48, 0) 70%),
    #000;
  padding: clamp(80px, 12rem, 133px) 0;
}

.ab-origin-in { position: relative; align-items: center; }

.ab-origin-bond {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  width: 15%;
  pointer-events: none;
  opacity: 1;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='56'%3E%3Cpath d='M0 .5h120M0 28.5h120M.5 0v28M60.5 28v28' fill='none' stroke='%23c9a063' stroke-opacity='.5'/%3E%3C/svg%3E");
  background-size: 12rem 5.6rem;
  background-position: right top;
  -webkit-mask-image: linear-gradient(270deg, #000 0%, rgba(0, 0, 0, .55) 45%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%);
          mask-image: linear-gradient(270deg, #000 0%, rgba(0, 0, 0, .55) 45%, transparent 100%), linear-gradient(180deg, transparent 0%, #000 22%, #000 78%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-composite: intersect;
}

.ab-origin-media {
  position: relative;
  grid-column: content-start / span 7;
  grid-row: 1;
  margin: 0;
}

.ab-origin-media .ab-frame {
  aspect-ratio: 1200 / 1320;
  outline: 1px solid rgba(228, 198, 142, .14);
  outline-offset: -1px;
  box-shadow: 0 4rem 8rem -4rem rgba(0, 0, 0, .9);
}

.ab-origin-copy {
  grid-column: span 8 / content-end;
  grid-row: 1;
}

.ab-origin-copy .ab-title { max-width: none; margin-bottom: 1.4rem; }
.ab-origin-copy .ab-body  { max-width: 56ch; color: rgba(251, 250, 247, .8); }

.ab-facts {
  display: grid;
  grid-template-columns: repeat(4, auto);
  justify-content: space-between;
  column-gap: clamp(20px, 3.2rem, 40px);
  margin: 3.2rem 0 0;
  padding-top: 3.2rem;
  border-top: 1px solid rgba(228, 198, 142, .18);
}

.ab-facts > div {
  display: grid;
  align-content: start;
  gap: 1rem;
}

.ab-facts dt,
.ab-facts dd { margin: 0; }

.ab-facts b {
  display: inline-block;
  font-family: var(--font-year);
  font-weight: 400;
  font-size: clamp(24px, 3.4rem, 38px);
  line-height: 1;
  letter-spacing: .01em;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  color: var(--gold);
}

.ab-facts dd {
  font-size: clamp(10.5px, 1.1rem, 12.2px);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: rgba(251, 250, 247, .62);
  max-width: 15ch;
}

.ab-paper {
  --on-light:        rgba(16, 12, 6, .78);
  --on-light-mute:   rgba(16, 12, 6, .54);
  --on-light-faint:  rgba(16, 12, 6, .28);
  --line-light:      rgba(16, 12, 6, .13);
  --line-light-lift: rgba(16, 12, 6, .26);
  --paper-2:         #f2f0eb;
  --ab-gold-hair:    #a67f33;

  color: var(--ab-ink);
}

.ab-paper .ab-body  { color: rgba(16, 12, 6, .84); }
.ab-paper .ab-role  { color: #5e400e; font-weight: 600; }

.ab-family::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  will-change: transform;

  background-image:
    linear-gradient(90deg,
      rgb(var(--np-burn-deep) / calc(.46 * var(--np-age))) 0%,
      rgb(var(--np-burn) / calc(.28 * var(--np-age))) 3%,
      rgb(var(--np-burn) / calc(.13 * var(--np-age))) 9%,
      rgb(var(--np-burn) / calc(.04 * var(--np-age))) 20%,
      transparent 33%,
      transparent 67%,
      rgb(var(--np-burn) / calc(.04 * var(--np-age))) 80%,
      rgb(var(--np-burn) / calc(.13 * var(--np-age))) 91%,
      rgb(var(--np-burn) / calc(.28 * var(--np-age))) 97%,
      rgb(var(--np-burn-deep) / calc(.46 * var(--np-age))) 100%),

    linear-gradient(180deg,
      rgb(var(--np-burn-deep) / calc(.36 * var(--np-age))) 0%,
      rgb(var(--np-burn) / calc(.14 * var(--np-age))) 3%,
      rgb(var(--np-burn) / calc(.04 * var(--np-age))) 8%,
      transparent 14%,
      transparent 86%,
      rgb(var(--np-burn) / calc(.04 * var(--np-age))) 92%,
      rgb(var(--np-burn) / calc(.14 * var(--np-age))) 97%,
      rgb(var(--np-burn-deep) / calc(.36 * var(--np-age))) 100%),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='310' height='310'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.62' numOctaves='1' seed='17' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='discrete' tableValues='1 1 1 1 1 1 1 1 1 1 0.3'/%3E%3CfeFuncG type='discrete' tableValues='1 1 1 1 1 1 1 1 1 1 0.25'/%3E%3CfeFuncB type='discrete' tableValues='1 1 1 1 1 1 1 1 1 1 0.18'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='310' height='310' filter='url(%23f)'/%3E%3C/svg%3E"),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='590' height='590'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.13' numOctaves='2' seed='41' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='discrete' tableValues='1 1 1 1 1 1 1 1 0.7 0.36'/%3E%3CfeFuncG type='discrete' tableValues='1 1 1 1 1 1 1 1 0.64 0.3'/%3E%3CfeFuncB type='discrete' tableValues='1 1 1 1 1 1 1 1 0.54 0.21'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='590' height='590' filter='url(%23f)'/%3E%3C/svg%3E"),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='940' height='940'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='turbulence' baseFrequency='0.045' numOctaves='2' seed='61' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='discrete' tableValues='1 1 1 1 1 1 0.9 0.74 0.54'/%3E%3CfeFuncG type='discrete' tableValues='1 1 1 1 1 1 0.87 0.69 0.47'/%3E%3CfeFuncB type='discrete' tableValues='1 1 1 1 1 1 0.82 0.6 0.36'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='940' height='940' filter='url(%23f)'/%3E%3C/svg%3E"),

    radial-gradient(118% 88% at 50% 46%,
      rgb(var(--np-lift) / .50) 0%,
      rgb(var(--np-lift) / .34) 34%,
      rgb(var(--np-lift) / .13) 58%,
      rgb(var(--np-lift) / 0) 80%),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='190' height='190'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.115' intercept='0.885'/%3E%3CfeFuncG type='linear' slope='0.115' intercept='0.885'/%3E%3CfeFuncB type='linear' slope='0.13' intercept='0.87'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='190' height='190' filter='url(%23f)'/%3E%3C/svg%3E"),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='430' height='430'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.11' numOctaves='3' seed='11' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.14' intercept='0.86'/%3E%3CfeFuncG type='linear' slope='0.16' intercept='0.84'/%3E%3CfeFuncB type='linear' slope='0.205' intercept='0.795'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='430' height='430' filter='url(%23f)'/%3E%3C/svg%3E"),

    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='770' height='770'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.009' numOctaves='5' seed='29' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3CfeComponentTransfer%3E%3CfeFuncR type='linear' slope='0.19' intercept='0.81'/%3E%3CfeFuncG type='linear' slope='0.245' intercept='0.755'/%3E%3CfeFuncB type='linear' slope='0.34' intercept='0.66'/%3E%3CfeFuncA type='table' tableValues='1 1'/%3E%3C/feComponentTransfer%3E%3C/filter%3E%3Crect width='770' height='770' filter='url(%23f)'/%3E%3C/svg%3E"),

    linear-gradient(0deg, var(--np-sheet), var(--np-sheet));

  background-size:
    cover, cover,
    310px 310px, 590px 590px, 940px 940px,
    cover,
    190px 190px, 430px 430px, 770px 770px,
    cover;
  background-repeat:
    no-repeat, no-repeat,
    repeat, repeat, repeat,
    no-repeat,
    repeat, repeat, repeat,
    no-repeat;
  background-blend-mode:
    normal, normal,
    multiply, multiply, multiply,
    normal,
    multiply, multiply, multiply,
    normal;
  background-color: var(--np-sheet);
}

.ab-family {
  padding: var(--ab-pad-y) 0;

  position: relative;
  isolation: isolate;
  background-color: var(--np-sheet);

  --gold-metal: linear-gradient(180deg,
    #241503 0%, #4d3207 4%, #7a5514 9%, #a07c37 14%, #bd9a4f 20%,
    #9c7433 26%, #7c5518 35%, #5e3e0c 44%, #432c06 51%, #573a08 55%,
    #78551a 62%, #9a7a3c 70%, #ac8a4b 76%, #8c6826 83%, #6b4711 91%,
    #2e1d04 100%);
  --gold-line-light: linear-gradient(180deg,
    #1c1002 0%, #281903 12%, #3a2605 22%, #543a0b 32%, #77561a 41%,
    #a67f33 48%, #b98e3d 52%, #96702a 57%, #77551a 65%, #5c4010 73%,
    #452f09 82%, #2e1f05 91%, #1d1103 100%);
}

.ab-founder {
  --w: min(50rem, 40%);

  grid-column: content;
  display: grid;
  grid-template-columns: var(--w) minmax(0, 1fr);
  column-gap: clamp(48px, 9rem, 100px);
  align-items: center;
}

.ab-founder-media { margin: 0; }

.ab-founder-media .ab-frame {
  aspect-ratio: 585 / 673;
  background: #d9cdb3;
  box-shadow: 0 3rem 6rem -3.6rem rgba(74, 46, 6, .55);
}

.ab-founder-media .ab-shine img { filter: grayscale(.4) contrast(1.02) brightness(.92); }

@media (hover: hover) {
  .ab-founder-media .ab-shine:hover img { filter: grayscale(0) contrast(1.05) brightness(1.02); }
}

.ab-name {
  font-weight: 400;
  margin: 0 0 1.8rem;
}

.ab-name-pre {
  display: block;
  font-family: var(--font-sans);
  font-size: calc(1.35rem + 3px);
  line-height: 1;
  letter-spacing: .3em;
  text-transform: uppercase;
  color: #7d5615;
  margin-bottom: 2rem;
}

.ab-name-main {
  display: block;
  font-family: var(--font-title);
  font-size: 7rem;
  line-height: 1.06;
  letter-spacing: -.018em;
  max-width: 19ch;
  color: var(--ab-ink);
  padding: .1em 0 .22em;
  margin: -.1em 0 -.22em;
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ab-name-main {
    background-image: var(--gold-line-light);
    background-repeat: repeat-y;
    background-size: 100% 1.06em;
    background-position: 50% .1em;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: var(--ab-cast-paper);
  }

  .ab-name-pre,
  .ab-founder-copy .ab-role b {
    background-image: var(--gold-line-light);
    background-repeat: no-repeat;
    background-size: 100% 500%;
    background-position: 50% 77.5%;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    color: #7d5615;
  }
}

.ab-founder-copy .ab-role {
  gap: 1.2rem;
  margin-bottom: 3rem;
  font-size: calc(1.3rem + 2px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: .18em;
  color: rgba(16, 12, 6, .56);
}
.ab-founder-copy .ab-role b { font-weight: 500; }
.ab-founder-copy .ab-dot { background: #a8792c; opacity: 1; }

.ab-founder-copy .ab-body { font-size: calc(clamp(15px, 1.85rem, 20.5px) + 2px); max-width: 68ch; color: rgba(16, 12, 6, .84); }

.ab-thread {
  --bar-y: 52%;
  --arm: calc((100% - var(--ab-dir-gap)) / 4);
  --stem-x: min(25rem, 20%);

  grid-column: content;
  position: relative;
  height: clamp(150px, 21rem, 233px);
}

.ab-thread-stem,
.ab-thread-drop {
  position: absolute;
  width: 2px;
  margin-left: -1px;
  background: linear-gradient(180deg, #b98e3d, #7a5514);
  transform-origin: 50% 0;
}

.ab-thread-stem { left: var(--stem-x); top: 0; height: var(--bar-y); }

.ab-thread-drop { top: var(--bar-y); bottom: 0; }
.ab-thread-drop--l { left: var(--arm); }
.ab-thread-drop--r { left: calc(100% - var(--arm)); }

.ab-thread-bar {
  position: absolute;
  top: var(--bar-y);
  left: min(var(--stem-x), var(--arm));
  right: var(--arm);
  height: 2px;
  margin-top: -1px;
  background: linear-gradient(90deg, #8c6826, #b98e3d 50%, #8c6826);
  transform-origin: 50% 50%;
}

.ab-thread-node {
  position: absolute;
  width: 1.2rem;
  height: 1.2rem;
  margin: -.6rem 0 0 -.6rem;
  background: linear-gradient(135deg, #e7c886, #a67f33);
  box-shadow: 0 0 0 .5rem rgba(166, 127, 51, .14);
  transform: rotate(45deg);
}

.ab-thread-node--top { left: var(--stem-x); top: 0; }
.ab-thread-node--l   { left: var(--arm); top: 100%; }
.ab-thread-node--r   { left: calc(100% - var(--arm)); top: 100%; }

.ab-thread-label {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: var(--bar-y);
  transform: translate(-50%, -50%);
  padding: 1.1rem 2.4rem;
  border: 1px solid rgba(125, 86, 21, .4);
  border-radius: 100vmax;
  background: #f1e8d4;
  white-space: nowrap;
  box-shadow: 0 1rem 2.4rem -1.4rem rgba(74, 46, 6, .5);

  font-size: clamp(10.5px, 1.15rem, 12.8px);
  font-weight: 600;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: #5e400e;
}

.ab-thread-label span { display: inline-block; margin-right: -.26em; }

.ab-spark {
  position: absolute;
  left: var(--stem-x);
  top: 0;
  width: 1rem;
  height: 1rem;
  margin: -.5rem 0 0 -.5rem;
  border-radius: 50%;
  background: radial-gradient(circle, #fffdf4 0%, #f0d18e 45%, rgba(224, 189, 111, 0) 72%);
  box-shadow: 0 0 1.4rem .4rem rgba(240, 209, 142, .75);
  opacity: 0;
  pointer-events: none;
}

.ab-directors {
  --ab-inset: clamp(10px, 1.2rem, 13px);
  --r-out: calc(var(--r-card, 20px) + var(--ab-inset));

  grid-column: content;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: var(--ab-dir-gap);
  align-items: stretch;
}

.ab-lead {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 38fr) minmax(0, 62fr);
  padding: var(--ab-inset);
  overflow: hidden;
  border-radius: var(--r-out);
  border: 1px solid rgba(125, 86, 21, .2);
  background: linear-gradient(180deg, rgba(255, 252, 244, .86), rgba(250, 243, 228, .7));
  box-shadow:
    0 4rem 8rem -5rem rgba(74, 46, 6, .5),
    inset 0 1px 0 rgba(255, 255, 255, .7);
  transition:
    transform .9s var(--ease-arch),
    box-shadow .9s var(--ease-arch),
    border-color .6s var(--ease-out);
}

@media (hover: hover) {
  .ab-lead:hover {
    transform: translateY(-.8rem);
    border-color: rgba(166, 127, 51, .55);
    box-shadow:
      0 6rem 10rem -5.6rem rgba(74, 46, 6, .62),
      inset 0 1px 0 rgba(255, 255, 255, .7);
  }
}

.ab-lead.is-lit { border-color: rgba(166, 127, 51, .5); }

.ab-lead-glow {
  position: absolute;
  top: 0;
  left: var(--r-out);
  right: var(--r-out);
  height: 2px;
  background: linear-gradient(90deg, rgba(185, 142, 61, 0), #b98e3d 20%, #e0bd6f 50%, #b98e3d 80%, rgba(185, 142, 61, 0));
  transform-origin: 50% 50%;
  transition: transform 1.1s var(--ease-arch), opacity .6s var(--ease-out);
}

.has-js .ab-lead:not(.is-lit) .ab-lead-glow { opacity: 0; transform: scaleX(0); }

.ab-lead-media { position: relative; margin: 0; }

.ab-mount {
  position: absolute;
  inset: 0;
  background: #d9cdb3;
  border-radius: var(--r-card, 20px);
}

.ab-mount img { object-position: 50% 60%; }

.ab-mount::before {
  content: '';
  position: absolute;
  inset: 1.2rem;
  z-index: 3;
  border: 1px solid rgba(240, 216, 162, 0);
  border-radius: calc(var(--r-card, 20px) - 8px);
  pointer-events: none;
  transition: inset .9s var(--ease-arch), border-color .7s var(--ease-out);
}

@media (hover: hover) {
  .ab-lead:hover .ab-mount::before {
    inset: 1.8rem;
    border-color: rgba(240, 216, 162, .75);
  }
}

.ab-lead-body {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(28px, 5rem, 55px) clamp(22px, 4.4rem, 49px);
}

.ab-lead-name {
  margin: 0 0 1.6rem;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: min(calc(clamp(20px, 2.4rem, 28px) + 4px), 9.8cqi); /* the cap keeps the name on one line inside its card */
  white-space: nowrap;
  line-height: 1.16;
  letter-spacing: -.014em;
  color: var(--ab-ink);
}

/* Directors' names in the same gold as the founder's name above them. */
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ab-lead-name {
    padding: .08em 0 .16em;
    margin-top: -.08em;
    margin-bottom: calc(1.6rem - .16em);
    background-image: var(--gold-line-light);
    background-repeat: repeat-y;
    background-size: 100% 1.16em;
    background-position: 50% .08em;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    filter: var(--ab-cast-paper);
  }
}

.ab-lead-bio {
  margin: 2.8rem 0 0;
  padding-top: 2.8rem;
  border-top: 1px solid rgba(125, 86, 21, .2);
  font-size: calc(clamp(14.5px, 1.6rem, 17.5px) + 1px);
  font-weight: 400;
  line-height: 1.8;
  color: rgba(16, 12, 6, .82);
}

.ab-what {
  background: #000;
  padding: var(--ab-pad-y) 0;
}

.ab-what-head {
  grid-column: content;
  display: grid;
  justify-items: center;
  text-align: center;
  margin-bottom: clamp(44px, 7rem, 78px);
}

.ab-what-head .ab-title { max-width: none; margin: 0 0 1.4rem; }

.ab-what-lede {
  max-width: 100ch;
  text-wrap: balance;
  margin: 0;
  color: rgba(251, 250, 247, .74);
}

.ab-trades {
  --ab-inset: clamp(10px, 1.2rem, 13px);

  grid-column: content;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2.4rem, 27px);
  margin: 0;
  padding: 0;
  list-style: none;
}

@media (max-width: 1279px) {
  .ab-trades { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

.ab-trade {
  display: flex;
  flex-direction: column;
  padding: var(--ab-inset);
  border: 1px solid rgba(228, 198, 142, .16);
  border-radius: calc(var(--r-card, 20px) + var(--ab-inset));
  background: linear-gradient(180deg, #0e0c09, #080706);
  transition:
    transform .9s var(--ease-arch),
    border-color .6s var(--ease-out);
}

.ab-trade-pic { aspect-ratio: 4 / 3; }

.ab-trade-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: clamp(22px, 3.2rem, 35px) clamp(14px, 2rem, 22px) clamp(16px, 2.2rem, 24px);
}

.ab-trade-btn { margin-top: auto; }

.ab-trade-idx {
  display: flex;
  align-items: baseline;
  gap: 1.4rem;
  margin-bottom: 1.4rem;
  font-size: clamp(10.5px, 1.1rem, 12.2px);
  font-weight: 500;
  letter-spacing: .24em;
  text-transform: uppercase;
  color: rgba(251, 250, 247, .6);
}

.ab-trade-idx b {
  font-family: var(--font-year);
  font-weight: 400;
  font-size: clamp(20px, 2.4rem, 27px);
  letter-spacing: .02em;
  line-height: 1;
  color: var(--gold);
}

.ab-trade-name {
  margin: 0 0 1.4rem;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(20px, 2.4rem, 28px);
  line-height: 1.15;
  letter-spacing: -.014em;
  color: var(--paper);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .ab-trade-name {
    background-image: var(--gold-metal);
    background-size: 100% 100%;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: var(--paper);
    transition: -webkit-text-fill-color .6s var(--ease-out);
  }
}

@media (hover: hover) {
  .ab-trade:hover {
    transform: translateY(-.8rem);
    border-color: rgba(228, 198, 142, .42);
  }
  .ab-trade:hover .ab-trade-name { -webkit-text-fill-color: transparent; }
  .ab-trade:hover .ab-shine img { scale: 1.055; filter: contrast(1.05) brightness(1.02); }
  .ab-trade:hover .ab-shine::after {
    opacity: 1;
    transform: translateX(115%);
    transition:
      transform 1.15s var(--ease-arch),
      opacity .25s var(--ease-out);
  }
}

.ab-trade-say {
  margin: 0 0 2.8rem;
  font-size: clamp(15px, 1.7rem, 18.5px);
  font-weight: 400;
  line-height: 1.66;
  color: rgba(251, 250, 247, .74);
}

.ab-purpose {
  background: #000;
  padding: 0 0 var(--ab-pad-y);
}

.ab-pv-frame {
  grid-column: content;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  overflow: hidden;
  border: 1px solid rgba(228, 198, 142, .2);
  border-radius: var(--r-card, 20px);
  background:
    radial-gradient(60% 80% at 0% 0%, rgba(217, 179, 120, .07), transparent 70%),
    radial-gradient(60% 80% at 100% 0%, rgba(217, 179, 120, .07), transparent 70%),
    #090807;
}

.ab-pv { padding: clamp(36px, 8rem, 89px); }

.ab-pv + .ab-pv { border-left: 1px solid rgba(228, 198, 142, .2); }

.ab-pv-idx {
  display: flex;
  align-items: baseline;
  gap: 1.4rem;
  margin-bottom: 2.8rem;
  font-size: clamp(11px, 1.2rem, 13.3px);
  font-weight: 500;
  letter-spacing: .26em;
  text-transform: uppercase;
  color: var(--on-dark-mute);
}

.ab-pv-idx b {
  font-family: var(--font-year);
  font-weight: 400;
  font-size: clamp(22px, 3rem, 33px);
  letter-spacing: .02em;
  line-height: 1;
  color: var(--gold);
}

.ab-pv-title {
  margin: 0 0 2.6rem;
  font-family: var(--font-title);
  font-weight: 400;
  font-size: clamp(30px, 4.6rem, 51px);
  line-height: 1.14;
  letter-spacing: -.014em;
  color: var(--paper);
  text-wrap: balance;
}

.ab-close {
  background: #000;
  padding: 0 0 var(--ab-pad-y);
}

.ab-cta {
  grid-column: content;
  position: relative;
  padding: 11rem 4rem;
  border-radius: 2.8rem;
  border: 1px solid transparent;
  overflow: hidden;
  isolation: isolate;
  background:
    linear-gradient(180deg, rgba(240, 209, 142, .5), rgba(201, 160, 99, .1) 45%, rgba(201, 160, 99, .26)) border-box;
  text-align: center;
}

.ab-cta-bg {
  position: absolute;
  inset: -8% 0;
  z-index: -2;
  background: url(../../assets/img/yr-2025.jpg) center 55% / cover no-repeat;
}

.ab-cta::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    radial-gradient(62% 72% at 50% 50%, rgba(0, 0, 0, .78), rgba(0, 0, 0, .4) 100%),
    linear-gradient(180deg, rgba(0, 0, 0, .25), rgba(0, 0, 0, .55));
}

.ab-cta-title {
  margin: 0;
  font-family: var(--font-title);
  font-weight: 400;
  font-size: clamp(30px, 5.6rem, 62px);
  line-height: 1.13;
  letter-spacing: -.02em;
  color: var(--paper);
}

.ab-cta-lede {
  max-width: 52ch;
  margin: 2rem auto 3.6rem;
  font-size: clamp(15px, 1.75rem, 19.5px);
  line-height: 1.62;
  color: rgba(251, 250, 247, .88);
}

.ab-cta-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1.6rem 2rem;
}

.ab-cta .btn--solid {
  background: var(--paper);
  border-color: var(--paper);
  color: var(--ink);
}

.ab-cta-call {
  border-color: rgba(251, 250, 247, .4);
  color: var(--paper);
}

.ab-dept {
  background: #000;
  padding: 0 0 var(--ab-pad-y);
}

.ab-depts {
  grid-column: content;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: clamp(16px, 2.4rem, 27px);
  margin: 0;
  padding: 0;
  list-style: none;
}

.ab-dept-card {
  display: flex;
  flex-direction: column;
  padding: clamp(24px, 3.4rem, 38px) clamp(20px, 2.8rem, 31px) clamp(26px, 3.6rem, 40px);
  border: 1px solid rgba(228, 198, 142, .16);
  border-radius: var(--r-card, 20px);
  background: linear-gradient(180deg, #0e0c09, #080706);
  transition: border-color .6s var(--ease-out), transform .9s var(--ease-arch);
}

.ab-dept-ico {
  display: grid;
  place-items: center;
  width: clamp(48px, 5.6rem, 62px);
  height: clamp(48px, 5.6rem, 62px);
  border: 1px solid rgba(217, 179, 120, .32);
  border-radius: 50%;
  background: radial-gradient(closest-side, rgba(217, 179, 120, .1), rgba(217, 179, 120, 0));
}
.ab-dept-ico svg {
  width: 46%;
  height: 46%;
  fill: none;
  stroke: var(--ab-gold-hair);
  stroke: url(#abDeptGold);
  stroke-width: 1.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.ab-dept-name {
  margin: clamp(22px, 3rem, 33px) 0 1.2rem;
  font-family: var(--font-sans);
  font-weight: 500;
  font-size: clamp(17px, 2rem, 22px);
  line-height: 1.25;
  letter-spacing: -.01em;
  color: var(--gold-lift);
}

.ab-dept-text {
  margin: 0;
  font-size: clamp(14px, 1.55rem, 17px);
  line-height: 1.6;
  color: rgba(255, 255, 255, .82);
}

@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  /* same gold as the footer column titles, kept in sentence case */
  .ab-dept-name {
    background-image: var(--gold-metal);
    background-repeat: no-repeat;
    background-size: 100% 640%;
    background-position: 50% 24%;
    -webkit-background-clip: text;
            background-clip: text;
    -webkit-text-fill-color: transparent;
    text-shadow: var(--gold-small-cast);
  }
}

@media (hover: hover) {
  .ab-dept-card:hover { border-color: rgba(228, 198, 142, .45); transform: translateY(-.4rem); }
}

@media (max-width: 1279px) {
  .ab-depts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
  .ab-depts { grid-template-columns: minmax(0, 1fr); gap: 1.2rem; }
  .ab-dept-card { padding: 2.8rem 2.4rem; border-radius: 1.6rem; }
  .ab-dept-name { margin: 2rem 0 .9rem; }
}

@media (prefers-reduced-motion: reduce) {
  .ab-dept-card { transition: none; }
}

@media (max-width: 1279px) {
  .ab-lead { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto 1fr; }
  .ab-lead-media { aspect-ratio: 4 / 3; }
  .ab-lead-body { justify-content: flex-start; padding: clamp(26px, 3.6rem, 40px) clamp(14px, 2.6rem, 29px) clamp(20px, 2.8rem, 31px); }
}

@media (max-width: 991px) {
  .is-about { --ab-pad-y: clamp(64px, 8.8rem, 88px); }
  .ab-origin { padding: calc(var(--ab-pad-y) * .5) 0 var(--ab-pad-y); }
  .ab-hero-in { padding-bottom: 4rem; }

  .ab-hero-copy { grid-column: content; }
  .ab-hero-side { display: none; }
  .ab-hero-title { font-size: clamp(54px, 8rem, 80px); }

  .ab-title { font-size: clamp(34px, 5rem, 50px); max-width: none; }

  .ab-origin-media,
  .ab-origin-copy { grid-column: content; }
  .ab-origin-copy { grid-row: 2; padding-top: 5.6rem; }
  .ab-origin-media { width: min(100%, 60rem); }
  .ab-origin-bond { display: none; }

  .ab-founder { grid-template-columns: minmax(0, 1fr); row-gap: 5.6rem; }
  .ab-founder-media { grid-row: 1; width: min(100%, 44rem); justify-self: center; }
  .ab-founder-copy { grid-row: 2; }
  .ab-name-main { font-size: 5rem; max-width: none; }

  .ab-thread { --stem-x: 50%; --bar-y: 62%; margin-top: 4rem; }
  .ab-thread-bar { transform-origin: 50% 50%; }
  .ab-thread-node--top { top: 0; }
  .ab-thread-label { top: calc(var(--bar-y) / 2); }

  .ab-lead-name { font-size: min(26px, 9.8cqi); }

  .ab-trades { grid-template-columns: minmax(0, 1fr); gap: 2.4rem; }
  .ab-trade { display: grid; grid-template-columns: minmax(0, 42fr) minmax(0, 58fr); }
  .ab-trade-pic { aspect-ratio: auto; min-height: 100%; }
  .ab-trade-body { padding: 2.8rem 2.4rem; align-self: center; }

  .ab-pv-title { font-size: clamp(28px, 4rem, 40px); }
}

@media (max-width: 767px) {
  .is-about { --ab-pad-y: clamp(52px, 16vw, 64px); }
  .is-about section { --r-card: 12px; }

  .ab-body { font-size: 15.5px; }
  .ab-founder-copy .ab-body { font-size: 16px; }
  .ab-founder-copy .ab-role { font-size: 11.5px; letter-spacing: .15em; gap: .8rem; margin-bottom: 2.4rem; }
  .ab-lead-bio { font-size: 15.5px; }
  .ab-trade-say { font-size: 14.5px; line-height: 1.62; }

  .ab-hero { min-height: 56rem; }
  .ab-hero-title { font-size: clamp(34px, 4.4rem, 46px); line-height: 1.2; margin-bottom: 2.4rem; }
  .ab-hero-text  { font-size: 15.5px; padding-left: 1.8rem; }

  .ab-eyebrow { letter-spacing: .22em; margin-bottom: 2rem; }
  .ab-eyebrow i { width: 4rem; }
  .ab-title { font-size: clamp(30px, 3.6rem, 38px); margin-bottom: 1.2rem; }

  .ab-origin-media { width: 100%; }
  .ab-origin-copy { padding-top: 4rem; }
  .ab-facts { grid-template-columns: repeat(2, auto); justify-content: start; gap: 2.8rem 4.8rem; }
  .ab-facts b { font-size: 26px; }
  .ab-facts dd { font-size: 10px; letter-spacing: .14em; }

  .ab-founder-media { width: 100%; }
  .ab-name-main { font-size: clamp(30px, 3.4rem, 34px); }
  .ab-name-pre { font-size: 12.5px; letter-spacing: .24em; margin-bottom: 1.4rem; }

  .ab-thread { height: clamp(120px, 18rem, 180px); --bar-y: 100%; --arm: 50%; }
  .ab-thread-bar,
  .ab-thread-drop,
  .ab-thread-node--l,
  .ab-thread-node--r,
  .ab-spark[data-spark="l"],
  .ab-spark[data-spark="r"] { display: none; }
  .ab-thread-label { top: 50%; }

  .ab-directors { grid-template-columns: minmax(0, 1fr); row-gap: 4.8rem; }
  .ab-lead-name { font-size: min(28px, 9.8cqi); }

  .ab-trade { display: flex; }
  .ab-trade-pic { aspect-ratio: 16 / 11; min-height: 0; }
  .ab-trade-body { padding: 2.4rem 1.2rem 1.4rem; }
  .ab-trade-name { font-size: clamp(20px, 2.4rem, 24px); }

  .ab-pv-frame { grid-template-columns: minmax(0, 1fr); }
  .ab-pv { padding: 3.6rem 2.8rem; }
  .ab-pv + .ab-pv { border-left: 0; border-top: 1px solid rgba(228, 198, 142, .2); }
  .ab-pv-title { font-size: clamp(26px, 3.2rem, 34px); }

  .ab-cta { padding: 6rem 2.4rem; border-radius: 16px; }
  .ab-cta-title { font-size: clamp(26px, 3.2rem, 34px); line-height: 1.28; }
  .ab-cta-title br { display: none; }
  .ab-cta-lede { font-size: 15.5px; }
  .ab-cta-actions { flex-direction: column; align-items: stretch; }
  .ab-cta-actions .btn { justify-content: space-between; }
}

@media (prefers-reduced-motion: reduce) {
  .ab-cue i::after { animation: none; transform: none; }
}

.ab-hero-media,
.ab-hero-in,
.ab-cta-bg,
[data-px] img,
.ab-thread-stem,
.ab-thread-bar,
.ab-thread-drop,
.ab-thread-node,
.ab-thread-label,
.ab-spark { will-change: transform; }

/* Founder's name on parchment: deeper gold to hold contrast */
.ab-paper .nb-founder,
.ab-founder-copy .nb-founder { color: #9a6a1f; }

/* Tablets and phones: the emblem sits centred above the title rather than behind it. */
@media (max-width: 991px) {
  /* Hero sizes to its content, so tall screens don't open a gap between emblem and title. */
  .ab-hero { height: auto; min-height: 0; }
  .ab-hero-media {
    position: relative;
    top: 0;
    height: auto;
    padding-top: calc(var(--header-h) + 3svh);
  }
  .ab-hero-media img {
    --emb: min(70vw, 42svh, 520px);
    position: relative;
    display: block;
    top: auto;
    right: auto;
    margin: 0 auto;
  }
  .ab-hero-in { position: relative; inset: auto; padding-top: 4rem; }
}

/* Thread and directors travel together (on desktop they share one screen). */
.ab-heirs { grid-column: content; }