

.b0 {
  position: relative;
  min-height: 100vh;
  min-height: 100dvh;
  overflow: hidden;
  isolation: isolate;
  display: block;

  padding: 0 max(var(--gutter), env(safe-area-inset-right, 0px))
           0 max(var(--gutter), env(safe-area-inset-left, 0px));

  --a-lx: 50%;
  --a-ly: 28%;

  --seam-a: 46%;
  --seam-b: 54%;
}

.b0-portraits { position: absolute; inset: 0; z-index: 0; pointer-events: none; }

.b0-fr { isolation: isolate; }
.b0-fr::after {
  content: "";
  position: absolute; inset: 0;
  background: rgba(20,30,44,.16);
  mix-blend-mode: color;
  pointer-events: none;
}

.b0-panel { position: absolute; top: 0; bottom: 0; overflow: hidden; }

.b0-panel--vika {
  left: 0; width: 55%;
  -webkit-mask-image: linear-gradient(to right,
    #000 0%, #000 94.545%,
    rgba(0,0,0,.967) 95.227%, rgba(0,0,0,.844) 95.909%,
    rgba(0,0,0,.684) 96.591%, rgba(0,0,0,.500) 97.273%,
    rgba(0,0,0,.316) 97.955%, rgba(0,0,0,.156) 98.636%,
    rgba(0,0,0,.033) 99.318%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(to right,
    #000 0%, #000 94.545%,
    rgba(0,0,0,.967) 95.227%, rgba(0,0,0,.844) 95.909%,
    rgba(0,0,0,.684) 96.591%, rgba(0,0,0,.500) 97.273%,
    rgba(0,0,0,.316) 97.955%, rgba(0,0,0,.156) 98.636%,
    rgba(0,0,0,.033) 99.318%, rgba(0,0,0,0) 100%);
}

.b0-panel--vika::before {
  content: "";
  position: absolute; inset: 0; z-index: 1;
  pointer-events: none;
  opacity: var(--seam-veil, 0);
  background: linear-gradient(to right,
    rgba(14,15,18,0) 76%,
    rgba(14,15,18,.42) 88%,
    rgba(14,15,18,.86) 96%,
    var(--bg) 100%);
}

.b0-panel--arut {
  left: var(--seam-a); right: 0;
  -webkit-mask-image: linear-gradient(to right,
    rgba(0,0,0,0) 0%, rgba(0,0,0,.033) 1.85%, rgba(0,0,0,.156) 3.70%,
    rgba(0,0,0,.316) 5.56%, rgba(0,0,0,.500) 7.41%, rgba(0,0,0,.684) 9.26%,
    rgba(0,0,0,.844) 11.11%, rgba(0,0,0,.967) 12.96%, #000 14.82%);
          mask-image: linear-gradient(to right,
    rgba(0,0,0,0) 0%, rgba(0,0,0,.033) 1.85%, rgba(0,0,0,.156) 3.70%,
    rgba(0,0,0,.316) 5.56%, rgba(0,0,0,.500) 7.41%, rgba(0,0,0,.684) 9.26%,
    rgba(0,0,0,.844) 11.11%, rgba(0,0,0,.967) 12.96%, #000 14.82%);
}

.b0-panel::after {
  content: "";
  position: absolute; inset: 0;
  pointer-events: none;

  background: linear-gradient(180deg,
    rgba(14,15,18,.40) 0%,
    rgba(14,15,18,.05) 20%,
    rgba(14,15,18,.06) 32%,
    rgba(14,15,18,.19) 45%,
    rgba(14,15,18,.34) 57%,
    rgba(14,15,18,.55) 69%,
    rgba(14,15,18,.80) 83%,
    var(--bg) 95%);
}

.por { position: absolute; inset: 0; margin: 0; }

.b0-px { position: absolute; inset: 0; }

.b0-px { transform: translate(var(--pxx, 0px), var(--pxy, 0px)); }

@media (prefers-reduced-motion: reduce) {
  .b0-px { transform: none !important; animation: none !important;
           translate: none !important; }
}

.b0-photo { position: absolute; max-width: none; }

.b0-panel--vika { --panel-w: 55vw; }
.b0-panel--arut { --panel-w: 54vw; }

.b0-fr {
  position: absolute;
  inset: 0;

  transform-origin: var(--lx, 50%) var(--ly, 50%);
}

.b0-panel--vika .b0-fr { --lx: 50%; --ly: 28%; }
.b0-panel--arut .b0-fr { --lx: var(--a-lx); --ly: var(--a-ly); }

.b0-fr .b0-photo {
  inset: auto;
  left: var(--lx);
  top:  var(--ly);
  width: auto;

  height: min(
            max(calc(var(--fh) * var(--fh-pad, 1.060)), 100%,
                calc(var(--panel-w) / var(--asp) * var(--wk, 1) * var(--cover-pad, 1.052))),
            var(--cap));
  object-fit: fill;
  transform: translate(calc(-1 * var(--fx)), calc(-1 * var(--fy)));
}

.b0-panel--vika .b0-fr--1 .b0-photo { --asp: .75044; --fx: 42%; --fy: 19%; --fh: 150%; --wk: 1.20; --cap: 2400px; }

.b0-panel--vika .b0-fr--2 .b0-photo { --asp: .7508;  --fx: 43%; --fy: 44%; --fh: 189%; --wk: 1.17; --cap: 2340px; }

.b0-panel--vika .b0-fr--3 { --lx: 55%; }
.b0-panel--vika .b0-fr--3 .b0-photo { --asp: .75;    --fx: 59%; --fy: 31%; --fh: 107%; --wk: 1.11; --cap: 2220px; }

.b0-panel--vika .b0-fr--4 .b0-photo { --asp: .7504;  --fx: 48%; --fy: 22%; --fh: 130%; --wk: 1.05; --cap: 2100px; }
.b0-panel--vika .b0-fr--5 .b0-photo { --asp: .75;    --fx: 49%; --fy: 23%; --fh: 125%; --wk: 1.03; --cap: 2060px; }

.b0-panel--arut .b0-fr--1 .b0-photo { --asp: .8829;   --fx: 37%;    --fy: 20%;    --fh: 143%; --wk: 1.36; --cap: 2272px; }
.b0-panel--arut .b0-fr--2 .b0-photo { --asp: .8;      --fx: 36%;    --fy: 19%;    --fh: 150%; --wk: 1.40; --cap: 2580px; }
.b0-panel--arut .b0-fr--3 .b0-photo { --asp: .75;     --fx: 57%;    --fy: 21%;    --fh: 136%; --wk: 1.17; --cap: 2300px; }
.b0-panel--arut .b0-fr--4 .b0-photo { --asp: .8;      --fx: 43%;    --fy: 45%;    --fh: 165%; --wk: 1.17; --cap: 2156px; }

.b0-fr:not(.b0-fr--1) { opacity: 0; visibility: hidden; }

.b0-tr--wipe {
  -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 44%, rgba(0,0,0,0) 56%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(90deg, #000 0%, #000 44%, rgba(0,0,0,0) 56%, rgba(0,0,0,0) 100%);
  -webkit-mask-size: 250% 100%;         mask-size: 250% 100%;
  -webkit-mask-repeat: no-repeat;       mask-repeat: no-repeat;
  -webkit-mask-position: 0% 0%;         mask-position: 0% 0%;
}
.b0-tr--curtain {
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 44%, rgba(0,0,0,0) 56%, rgba(0,0,0,0) 100%);
          mask-image: linear-gradient(180deg, #000 0%, #000 44%, rgba(0,0,0,0) 56%, rgba(0,0,0,0) 100%);
  -webkit-mask-size: 100% 250%;         mask-size: 100% 250%;
  -webkit-mask-repeat: no-repeat;       mask-repeat: no-repeat;
  -webkit-mask-position: 0% 0%;         mask-position: 0% 0%;
}

.b0-portraits.is-cycling .b0-panel--vika .b0-fr--1 { animation: b0-base        50s linear  -7.5s infinite; }
.b0-portraits.is-cycling .b0-panel--vika .b0-fr--2 { animation: b0-mid-push    50s linear -47.5s infinite; }
.b0-portraits.is-cycling .b0-panel--vika .b0-fr--3 { animation: b0-mid-wipe    50s linear -37.5s infinite; }
.b0-portraits.is-cycling .b0-panel--vika .b0-fr--4 { animation: b0-mid-drift   50s linear -27.5s infinite; }
.b0-portraits.is-cycling .b0-panel--vika .b0-fr--5 { animation: b0-top-curtain 50s linear -17.5s infinite; }

.b0-portraits.is-cycling .b0-panel--arut .b0-fr--1 { animation: b0-base-40        40s linear  -2.5s infinite; }
.b0-portraits.is-cycling .b0-panel--arut .b0-fr--2 { animation: b0-mid-wipe-40    40s linear -32.5s infinite; }
.b0-portraits.is-cycling .b0-panel--arut .b0-fr--3 { animation: b0-mid-drift-40   40s linear -22.5s infinite; }
.b0-portraits.is-cycling .b0-panel--arut .b0-fr--4 { animation: b0-top-curtain-40 40s linear -12.5s infinite; }

@keyframes b0-base {
  0%     { visibility: visible; transform: scale(1.06);
           animation-timing-function: cubic-bezier(.22,.61,.36,1); }
  5.2%   { transform: scale(1); }
  25.59% { visibility: visible; }
  25.6%  { visibility: hidden; }
  96.99% { visibility: hidden; }
  97%    { visibility: visible; }
  100%   { visibility: visible; transform: scale(1); }
}

@keyframes b0-mid-push {
  0%     { opacity: 0; visibility: visible; transform: scale(1.065);
           animation-timing-function: cubic-bezier(.22,.61,.36,1); }
  3.6%   { opacity: 1; }
  5.2%   { transform: scale(1); }
  25.99% { opacity: 1; visibility: visible; transform: scale(1); }
  26.01% { opacity: 0; visibility: hidden; transform: scale(1.065); }
  100%   { opacity: 0; visibility: hidden; transform: scale(1.065); }
}

@keyframes b0-mid-drift {
  0%     { opacity: 0; visibility: visible; transform: translate3d(2.2%, -1.2%, 0) scale(1.07);
           animation-timing-function: cubic-bezier(.25,.55,.3,1); }
  4%     { opacity: 1; }
  6%     { transform: translate3d(0, 0, 0) scale(1); }
  25.99% { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0) scale(1); }
  26.01% { opacity: 0; visibility: hidden; transform: translate3d(2.2%, -1.2%, 0) scale(1.07); }
  100%   { opacity: 0; visibility: hidden; transform: translate3d(2.2%, -1.2%, 0) scale(1.07); }
}

@keyframes b0-mid-wipe {
  0%     { opacity: 1; visibility: visible; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%;
           animation-timing-function: cubic-bezier(.33,.6,.28,1); }
  4%     { -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  5.6%   { transform: scale(1); }
  25.99% { opacity: 1; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  26.01% { opacity: 0; visibility: hidden; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%; }
  100%   { opacity: 0; visibility: hidden; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%; }
}

@keyframes b0-top-curtain {
  0%     { opacity: 1; visibility: visible; transform: scale(1.02);
           -webkit-mask-position: 0% 100%; mask-position: 0% 100%;
           animation-timing-function: cubic-bezier(.36,.62,.3,1); }
  4.4%   { -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  6%     { transform: scale(1); }
  20%    { opacity: 1; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  24%    { opacity: 0; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  24.01% { opacity: 0; visibility: hidden; }
  100%   { opacity: 0; visibility: hidden; transform: scale(1.02);
           -webkit-mask-position: 0% 100%; mask-position: 0% 100%; }
}

@keyframes b0-base-40 {
  0%     { visibility: visible; transform: scale(1.06);
           animation-timing-function: cubic-bezier(.22,.61,.36,1); }
  6.5%   { transform: scale(1); }
  31.99% { visibility: visible; }
  32%    { visibility: hidden; }
  96.24% { visibility: hidden; }
  96.25% { visibility: visible; }
  100%   { visibility: visible; transform: scale(1); }
}

@keyframes b0-mid-wipe-40 {
  0%     { opacity: 1; visibility: visible; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%;
           animation-timing-function: cubic-bezier(.33,.6,.28,1); }
  5%     { -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  7%     { transform: scale(1); }
  32.49% { opacity: 1; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  32.51% { opacity: 0; visibility: hidden; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%; }
  100%   { opacity: 0; visibility: hidden; transform: scale(1.03);
           -webkit-mask-position: 100% 0%; mask-position: 100% 0%; }
}

@keyframes b0-mid-drift-40 {
  0%     { opacity: 0; visibility: visible; transform: translate3d(2.2%, -1.2%, 0) scale(1.07);
           animation-timing-function: cubic-bezier(.25,.55,.3,1); }
  5%     { opacity: 1; }
  7.5%   { transform: translate3d(0, 0, 0) scale(1); }
  32.49% { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0) scale(1); }
  32.51% { opacity: 0; visibility: hidden; transform: translate3d(2.2%, -1.2%, 0) scale(1.07); }
  100%   { opacity: 0; visibility: hidden; transform: translate3d(2.2%, -1.2%, 0) scale(1.07); }
}

@keyframes b0-top-curtain-40 {
  0%     { opacity: 1; visibility: visible; transform: scale(1.02);
           -webkit-mask-position: 0% 100%; mask-position: 0% 100%;
           animation-timing-function: cubic-bezier(.36,.62,.3,1); }
  5.5%   { -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  7.5%   { transform: scale(1); }
  25%    { opacity: 1; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  30%    { opacity: 0; visibility: visible; transform: scale(1);
           -webkit-mask-position: 0% 0%;   mask-position: 0% 0%; }
  30.01% { opacity: 0; visibility: hidden; }
  100%   { opacity: 0; visibility: hidden; transform: scale(1.02);
           -webkit-mask-position: 0% 100%; mask-position: 0% 100%; }
}

.b0-portraits:not(.is-inview) .b0-fr { animation-play-state: paused; }

.b0-stage { position: absolute; inset: 0; z-index: 1; pointer-events: none; }

.b0-grade {
  position: absolute; inset: 0;

  background: linear-gradient(to top,
    var(--bg) 3%,
    rgba(14,15,18,.96) 13%,
    rgba(14,15,18,.76) 22%,
    rgba(14,15,18,.34) 33%,
    rgba(14,15,18,.10) 43%,
    rgba(14,15,18,0) 53%);
}

.b0-vig {
  position: absolute; inset: 0;
  background:

    radial-gradient(32% 31% at 50% 62%,
      rgba(14,15,18,.83) 0%,
      rgba(14,15,18,.79) 48%,
      rgba(14,15,18,.54) 76%,
      rgba(14,15,18,.16) 92%,
      rgba(14,15,18,0) 100%),
    linear-gradient(to right,
      rgba(14,15,18,.20) 0%,
      rgba(14,15,18,.06) 18%,
      rgba(14,15,18,0) 40%,
      rgba(14,15,18,0) 60%,
      rgba(14,15,18,.06) 82%,
      rgba(14,15,18,.20) 100%),
    radial-gradient(124% 82% at 50% 30%, rgba(14,15,18,0) 46%, rgba(14,15,18,.42) 100%);
}

.b0-ui {
  position: relative;
  z-index: 2;
  min-height: 100vh;
  min-height: 100dvh;
  display: grid;
  grid-template-rows: auto 1fr auto auto;

  padding: calc(clamp(26px, 4.2vh, 46px) + env(safe-area-inset-top, 0px))
           0
           calc(clamp(22px, 3.4vh, 38px) + env(safe-area-inset-bottom, 0px));
}

.b0 .eyebrow {
  max-width: min(760px, 52vw);
  color: var(--fg-2);
  flex-wrap: nowrap;
  align-items: flex-start;

  margin-inline: auto;
  justify-content: center;
  text-align: center;
}

.b0 .eyebrow .rule { display: none; }

.b0 .eyebrow .b0-eb-t { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: center; }

.b0-copy {
  grid-row: 3;
  padding-bottom: clamp(24px, 5vh, 58px);
  max-width: var(--copy-max);
  margin-inline: auto;
  text-align: center;
}

.b0-title {
  font-family: var(--font-dp);
  font-size: clamp(42px, 6.1vw, 90px);

  line-height: 1;
  letter-spacing: -.014em;
  color: var(--fg);

}
.ln { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.ln-i { display: block; white-space: nowrap; }

.b0-title .ln {
  padding: .14em 0 .18em;
  margin:  -.14em 0 -.18em;
}

.b0-title .ln-i {
  background-image: linear-gradient(96deg,
    var(--fg) 0%, var(--fg) 38%,
    #FFFFFF 50%,
    var(--fg) 62%, var(--fg) 100%);
  background-size: 320% 100%;
  background-repeat: no-repeat;
  background-position: 100% 0;
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}
.b0-title .ln-i.is-lit { animation: ln-sweep 1.15s cubic-bezier(.25,.6,.2,1) both; }
@keyframes ln-sweep {
  from { background-position: 100% 0; }
  to   { background-position: 0% 0; }
}

.usa { color: inherit; }

body.flag-usa .b0-title .ln-i .usa { -webkit-text-fill-color: transparent; }

body.flag-usa .usa {
  background-image: url("../img/b0/flag.svg");
  background-repeat: no-repeat;

  background-size: 100% 62%;
  background-position: 0 32%;
  -webkit-background-clip: text;
          background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;

  -webkit-text-stroke: .012em rgba(243,241,237,.30);
  padding-right: .04em;
  margin-right: -.04em;
}

body:not(.flag-usa) .usa { -webkit-text-fill-color: currentColor; }

html.rm .b0-fr:not(.b0-fr--1) { display: none; }
html.rm .b0-fr { animation: none !important; transform: none !important; }
html.rm .b0-title .ln-i { animation: none !important; }

@media (prefers-reduced-motion: reduce) {
  .b0-fr:not(.b0-fr--1) { display: none; }
  .b0-fr { animation: none !important; transform: none !important; }
  .b0-title .ln-i { animation: none !important; }
}

.b0-sub {
  margin-top: clamp(20px, 2.4vw, 30px);

  margin-inline: auto;
  max-width: 32ch;
  color: var(--fg-2);
  font-size: clamp(17px, 1.5vw, 22px);
  line-height: 1.45;

  text-shadow: 0 1px 16px rgba(14,15,18,.72), 0 0 5px rgba(14,15,18,.5);
}
.b0-sub .nb { white-space: nowrap; }

.b0-names {
  grid-row: 4;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  padding-top: clamp(16px, 2.2vh, 24px);
  border-top: 1px solid var(--line);
}
.b0-name { max-width: 40ch; }
.b0-name--right { text-align: right; }
.b0-name-n {
  color: var(--fg);
  font-size: var(--t-small);
  font-weight: 600;
  letter-spacing: .01em;
}
.b0-name-r {
  margin-top: 5px;
  color: var(--fg-3);

  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.b1 { padding-bottom: clamp(120px, 13vw, 184px); }

.b1-lead {
  margin-top: clamp(28px, 3vw, 40px);
  max-width: 48ch;
}

.b1-pin { position: relative; margin-top: clamp(48px, 7vw, 90px); }
.b1-sticky { position: relative; }

.b1-q {
  font-family: var(--font-dp);

  font-size: clamp(40px, 5.6vw, 82px);
  line-height: 1;
  letter-spacing: -.014em;
  color: var(--fg);

  max-width: 7.8em;
}
.b1-a {
  margin-top: clamp(28px, 3.4vw, 46px);
  font-family: var(--font-dp);
  font-size: var(--t-h1);
  line-height: 1.12;
  color: var(--fg);
  max-width: 18ch;
}

.b1-rail { display: none; }

@media (min-width: 900px) {

  .b1-pin { min-height: 92vh; padding-left: 56px; margin-left: -56px; }
  .b1-sticky { position: sticky; top: 20vh; }
  .b1-rail {
    display: block;
    position: absolute;
    left: 0; top: 6px; bottom: 8vh;
    width: 1px;
    background: var(--line);
  }
  .b1-rail i {
    position: absolute;
    inset: 0 auto 0 0;
    width: 1px; height: 100%;
    background: linear-gradient(to bottom, var(--accent), rgba(228,58,110,0));
    transform: scaleY(0);
    transform-origin: 50% 0;
  }
}

.b1-faces {
  display: flex;
  align-items: flex-start;
  gap: clamp(10px, 1.1vw, 16px);
  margin-top: clamp(4px, 1vw, 12px);
}
.b1-face {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  max-width: 132px;
  aspect-ratio: 2 / 3;
  overflow: hidden;

  -webkit-mask-image:
    linear-gradient(to right, transparent 0, #000 7%, #000 93%, transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 7%, #000 72%, rgba(0,0,0,.35) 95%, transparent 100%);
          mask-image:
    linear-gradient(to right, transparent 0, #000 7%, #000 93%, transparent 100%),
    linear-gradient(to bottom, transparent 0, #000 7%, #000 72%, rgba(0,0,0,.35) 95%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-composite: intersect;
}
.b1-face img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 50% 30%;
  filter: saturate(.7) contrast(1.05) brightness(.9);
}

.b1-face.is-swapping > img {
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1), filter .9s ease;
}
.b1-face .b1-face-in { opacity: 0; }
.b1-face[data-fx="up"]   .b1-face-in { transform: translateY(16%); }
.b1-face[data-fx="down"] .b1-face-in { transform: translateY(-16%); }
.b1-face[data-fx="zoom"] .b1-face-in { transform: scale(1.12); }
.b1-face[data-fx="blur"] .b1-face-in { filter: saturate(.7) contrast(1.05) brightness(.9) blur(10px); }
.b1-face.is-swapping .b1-face-in { opacity: 1; transform: none; filter: saturate(.7) contrast(1.05) brightness(.9); }
.b1-face.is-swapping > img:not(.b1-face-in) { opacity: 0; }
.b1-face.is-swapping[data-fx="up"]   > img:not(.b1-face-in) { transform: translateY(-12%); }
.b1-face.is-swapping[data-fx="down"] > img:not(.b1-face-in) { transform: translateY(12%); }
.b1-face.is-swapping[data-fx="zoom"] > img:not(.b1-face-in) { transform: scale(.94); }
.b1-face.is-swapping[data-fx="blur"] > img:not(.b1-face-in) { filter: saturate(.7) contrast(1.05) brightness(.9) blur(8px); }

.b1-face:nth-child(even) { transform: translateY(20px); }

.b1-face--mirror { border-color: var(--line-2); }
.b1-face--mirror img { filter: saturate(.28) contrast(1.1) brightness(.42); }
.b1-face--mirror::after {
  content: "";
  position: absolute; inset: 0;
  background:
    linear-gradient(152deg, rgba(255,255,255,.10) 0%, rgba(255,255,255,.02) 26%, rgba(255,255,255,0) 46%),
    linear-gradient(180deg, rgba(16,19,24,.62) 0%, rgba(11,13,17,.86) 100%);
}

.b1-faces-note { margin-top: clamp(26px, 3vw, 38px); }

.b1-text {
  margin-top: clamp(56px, 7vw, 96px);
  display: grid;
  gap: clamp(18px, 1.8vw, 26px);
  max-width: 62ch;
}

.b1-split { margin-top: clamp(52px, 6.4vw, 92px); }
.b1-h2 {
  font-size: var(--t-h2);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--fg);
  max-width: 16ch;
}
.b1-aside { padding-top: clamp(0px, 2.4vw, 34px); }

.b1-chain-lead {
  margin-top: clamp(56px, 7vw, 100px);
  max-width: 52ch;
  color: var(--fg-2);
  font-size: var(--t-small);
  line-height: 1.5;
}

.b1-foot {
  margin-top: clamp(56px, 7vw, 100px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: clamp(28px, 4vw, 56px);
  padding-top: clamp(30px, 3.4vw, 44px);
  border-top: 1px solid var(--line);
}
.b1-close { max-width: 46ch; color: var(--fg); }

.chain {
  --chain-gap: clamp(16px, 2vw, 32px);
  --node: 40px;
  --node-c: calc(var(--node) / 2);
  --track: var(--line-2);

  margin-top: clamp(26px, 3vw, 40px);
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  column-gap: var(--chain-gap);
}
.chain--tight { --node: 36px; }
.b7-steps     { --node: 32px; }

.chain-i {
  position: relative;
  padding-top: calc(var(--node) + 16px);
}

.chain-i::before {
  content: "";
  position: absolute;
  left: var(--node);
  right: calc(-1 * var(--chain-gap));
  top: var(--node-c);
  height: 1px;
  background: var(--track);
  transform: scaleX(var(--seg, 1));
  transform-origin: 0 50%;
}
.chain-i:last-child::before { content: none; }

.chain-i::after {
  content: "";
  position: absolute;
  left: 0; top: 0;
  width: var(--node); height: var(--node);
  border: 1px solid var(--accent-line);
  border-radius: 50%;
  background: none;

  box-shadow: 0 0 0 var(--halo, 0px) var(--accent-soft);
  transform: scale(var(--node-s, 1));
}

.chain-i > .ic {
  position: absolute;
  left: calc(var(--node-c) - var(--ic) / 2);
  top: calc(var(--node-c) - var(--ic) / 2);
  --ic: 20px;

  --ic-rest: var(--fg-2);
  --ic-lift: var(--fg);
  color: var(--ic-rest);
  transform: scale(var(--node-s, 1));
}
.chain--tight .chain-i > .ic { --ic: 18px; }
.b7-steps .chain-i > .ic     { --ic: 16px; --icw: 1.75; }

.chain > .chain-i:last-child { --halo: 6px; }
.chain > .chain-i:last-child > .ic  { --ic-rest: var(--accent); --ic-lift: var(--accent); }
.b6-contour > .chain-i:last-child { --halo: 0px; }
.b6-contour > .chain-i:last-child > .ic  { --ic-rest: var(--ink-2); --ic-lift: var(--fg); }

.chain-n {
  display: block;
  color: var(--fg-3);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: .1em;
  font-variant-numeric: tabular-nums;
}
.chain-t {
  display: block;
  margin-top: 8px;
  color: var(--fg);
  font-size: clamp(16px, 1.3vw, 20px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.chain--tight .chain-t { font-size: clamp(15px, 1.15vw, 18px); }
.b7-steps .chain-t      { font-size: clamp(14px, 1vw, 16px); }

.blk--paper .chain,
.paper-card .chain { --track: rgba(18, 19, 22, .18); }
.blk--paper .chain-n,
.paper-card .chain-n { color: var(--ink-2); }
.blk--paper .chain-i > .ic,
.paper-card .chain-i > .ic { --ic-rest: var(--ink-2); }

.chain {
  --wave: 10s;
  --wave-step: .6s;
}
.chain-i:nth-child(1) { --wave-d: 0s; }
.chain-i:nth-child(2) { --wave-d: calc(var(--wave-step) * 1); }
.chain-i:nth-child(3) { --wave-d: calc(var(--wave-step) * 2); }
.chain-i:nth-child(4) { --wave-d: calc(var(--wave-step) * 3); }
.chain-i:nth-child(5) { --wave-d: calc(var(--wave-step) * 4); }
.chain-i:nth-child(6) { --wave-d: calc(var(--wave-step) * 5); }

@keyframes chain-wave-ic {
  0%      { stroke-dashoffset: calc(var(--len, 96) * .45); color: var(--ic-lift); }
  20%     { stroke-dashoffset: 0;              color: var(--ic-lift); }
  28%     { stroke-dashoffset: 0;              color: var(--ic-rest); }
  100%    { stroke-dashoffset: 0;              color: var(--ic-rest); }
}

@keyframes chain-wave-ring {
  0%      { box-shadow: 0 0 0 var(--halo, 0px) var(--accent-soft); }
  5%      { box-shadow: 0 0 0 calc(var(--halo, 0px) + 5px) var(--accent-soft); }
  20%     { box-shadow: 0 0 0 var(--halo, 0px) var(--accent-soft); }
  100%    { box-shadow: 0 0 0 var(--halo, 0px) var(--accent-soft); }
}

.chain.is-revealed .chain-i > .ic {

  stroke-dasharray: var(--len, 96);
  animation: none var(--wave) ease-out var(--wave-d, 0s) infinite paused;
}
.chain.is-revealed .chain-i::after {
  animation: none var(--wave) ease-out var(--wave-d, 0s) infinite paused;
}
.chain.is-revealed.is-inview .chain-i > .ic {
  animation-name: chain-wave-ic;
  animation-play-state: running;
}
.chain.is-revealed.is-inview .chain-i::after {
  animation-name: chain-wave-ring;
  animation-play-state: running;
}

html.rm .chain .chain-i > .ic,
html.rm .chain .chain-i::after { animation: none; stroke-dasharray: none; }
@media (prefers-reduced-motion: reduce) {
  .chain .chain-i > .ic,
  .chain .chain-i::after { animation: none !important; stroke-dasharray: none !important; }
}

.b2-intro {
  margin-top: clamp(34px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(30px, 4vw, 72px);
  align-items: end;
}
.b2-lead { padding-bottom: 6px; }

.b2-tiles {
  margin-top: clamp(52px, 6vw, 88px);
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 22px);
}
.b2-tiles .tile { min-height: 210px; }

.b2-tiles .tile {
  --b2-ic: clamp(56px, 4.6vw, 72px);
  padding-right: calc(var(--tile-pad) + var(--b2-ic) + clamp(18px, 1.8vw, 30px));
}
.b2-tiles .tile > .ic {
  position: absolute;
  right: var(--tile-pad);
  top: 50%;
  --ic: var(--b2-ic);

  --icw: 1.15;
  color: var(--fg-3);
  transform: translateY(-50%);
  transition: transform .4s var(--ease), color .4s var(--ease);
}
.b2-tiles .tile:hover > .ic,
.b2-tiles .tile:focus-visible > .ic,
.b2-tiles .tile[aria-expanded="true"] > .ic {
  color: var(--accent);
  transform: translateY(calc(-50% - 2px));
}

.b2-chips {
  margin-top: clamp(22px, 2.4vw, 30px);
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.b2-mech { margin-top: clamp(64px, 8vw, 110px); }
.b2-mech-l { margin-bottom: 4px; }

.b2-emo {
  margin-top: clamp(64px, 8vw, 110px);
  padding-top: clamp(30px, 3.4vw, 44px);
  border-top: 1px solid var(--line);
  display: grid;
  grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
  gap: clamp(24px, 3vw, 56px);
  align-items: start;
}
.b2-emo-t {
  font-family: var(--font-dp);
  font-size: clamp(24px, 2.5vw, 36px);
  line-height: 1.2;
  color: var(--fg);
  max-width: 22ch;
}

@media (max-width: 899px) {
  .b2-intro { grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
  .b2-tiles { grid-template-columns: minmax(0, 1fr); }
  .b2-tiles .tile { min-height: 0; }
  .b2-emo { grid-template-columns: minmax(0, 1fr); gap: 18px; }

  .b2-tiles .tile { --b2-ic: 40px; padding-right: var(--tile-pad); }
  .b2-tiles .tile > .ic { top: var(--tile-pad); transform: none; }
  .b2-tiles .tile:hover > .ic,
  .b2-tiles .tile:focus-visible > .ic,
  .b2-tiles .tile[aria-expanded="true"] > .ic { transform: translateY(-2px); }
  .b2-tiles .tile > .tile-w { padding-right: calc(var(--b2-ic) + 14px); }
}

.b3-intro {
  margin-top: clamp(34px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(30px, 4vw, 72px);
  align-items: start;
}
.b3-tasks { margin-top: 18px; display: grid; gap: 14px; }

.b3-task > .ic { --ic: 20px; align-self: center; }
.b3-task {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  gap: 14px;
  align-items: baseline;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  color: var(--fg);
  font-size: var(--t-small);
  line-height: 1.5;
}

.b3-task-n {
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 700;
  letter-spacing: .1em;
  font-variant-numeric: tabular-nums;
}

.b3-people { margin-top: clamp(64px, 8vw, 110px); display: grid; }
.b3-person {
  display: grid;
  grid-template-columns: 140px minmax(0, 5fr) minmax(0, 6fr);
  gap: clamp(24px, 3vw, 48px);
  align-items: start;
  padding: clamp(30px, 3.4vw, 46px) 0;
  border-top: 1px solid var(--line);
}
.b3-person:last-child { border-bottom: 1px solid var(--line); }

.b3-por {
  position: relative;
  width: 140px; height: 190px;
  overflow: hidden;
  border-radius: 2px;
  background: transparent;
  -webkit-mask-image: linear-gradient(to bottom, #000 78%, rgba(0,0,0,.5) 94%, rgba(0,0,0,.15) 100%);
          mask-image: linear-gradient(to bottom, #000 78%, rgba(0,0,0,.5) 94%, rgba(0,0,0,.15) 100%);
}

.b3-por {
  transform: translate3d(var(--pxx, 0px),
                         calc(var(--pxy, 0px) + var(--sy, 0px)), 0);
}
.b3-por img {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: var(--op, 50% 20%);
  transform: scale(var(--z, 1));
  transform-origin: var(--op, 50% 20%);
  filter: saturate(.72) contrast(1.04);
}

.js:not(.rm) .b3-por.is-inview img {
  animation: b3-drift 17s ease-in-out infinite;
}
@keyframes b3-drift {
  0%   { translate: 0 0; }
  35%  { translate: -.90% -1.00%; }
  70%  { translate: .80% .60%; }
  100% { translate: 0 0; }
}
@media (prefers-reduced-motion: reduce) {
  .b3-por { transform: none !important; }
  .b3-por img { animation: none !important; translate: none !important; }
}

.b3-name {
  font-family: var(--font-dp);
  font-size: var(--t-h2);
  line-height: 1.1;
  color: var(--fg);
}
.b3-role { margin-top: 12px; }
.b3-desc { padding-top: 6px; color: var(--fg-2); font-size: var(--t-body); line-height: 1.55; max-width: 46ch; }

.b3-res { margin-top: clamp(64px, 8vw, 110px); }
.b3-res-h { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.b3-res-t {
  font-size: var(--t-h2);
  font-weight: 600;
  line-height: 1.15;
  letter-spacing: -.02em;
  color: var(--fg);
}
.b3-nums {
  margin-top: clamp(28px, 3vw, 40px);
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 22px);
}
.b3-num { grid-column: span 2; }

.b3-num:nth-child(4), .b3-num:nth-child(5) { grid-column: span 3; }

.b3-num {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  width: 100%;

  padding: var(--tile-pad) var(--tile-pad) var(--tile-pad-b);
  border: 1px solid var(--line-2);
  border-radius: var(--tile-radius);
  background: var(--bg-2);
  color: var(--fg);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  overflow: hidden;
  transition: border-color .4s var(--ease), background-color .4s var(--ease);
}
.b3-num > * { transition: transform .4s var(--ease); }
.b3-num:hover > *, .b3-num:focus-visible > * { transform: translateY(-2px); }

.b3-num:hover, .b3-num:focus-visible { border-color: var(--accent-line); }
.b3-num:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.b3-num[aria-expanded="true"] { border-color: var(--accent-line); }

.b3-num--static { cursor: default; }
.b3-num--static:hover, .b3-num--static:focus-visible { border-color: var(--line-2); }
.b3-num--static:hover > *, .b3-num--static:focus-visible > * { transform: none; }
.b3-num--static:hover > .ic { color: var(--fg-3); }
.b3-num--static { box-shadow: none !important; }

.b3-num--link { text-decoration: none; color: var(--fg); }

.b3-num > .ic {
  --ic: 34px;
  --icw: 1.3;
  margin-bottom: clamp(16px, 1.8vw, 22px);
  color: var(--fg-3);
  transition: transform .4s var(--ease), color .4s var(--ease);
}
.b3-num:hover > .ic,
.b3-num:focus-visible > .ic { color: var(--accent); }

.b3-num--static { padding-bottom: var(--tile-pad); }
.b3-num .tile-chip { right: var(--tile-pad); }

.b3-n {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0;
  color: var(--fg);
  font-size: var(--t-num);

  font-weight: 800;
  line-height: .95;
  letter-spacing: -.045em;
  font-variant-numeric: tabular-nums;
}

.odo { display: inline-flex; align-items: baseline; }

.odo-d {
  position: relative;
  display: inline-block;
  padding: .1em 0;
  margin: -.1em 0;
  line-height: 1;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 14%, #000 86%, transparent);
}
.odo-p { visibility: hidden; }
.odo-s {
  position: absolute;
  left: 0;
  top: .1em;
}
.odo-s i { display: block; height: 1em; line-height: 1; font-style: normal; }

.b3-n .num-u {
  color: var(--accent-deep);
  font-size: .46em;
  font-weight: 700;
  letter-spacing: 0;
  margin-left: .26em;
}

.b3-num-l {
  margin-top: clamp(18px, 1.6vw, 22px);
  color: var(--fg-2);
  font-size: var(--t-small);
  line-height: 1.5;
  max-width: 34ch;
}

.b3-num-l .acc { color: var(--accent-tx); font-weight: 600; }

.b3-num:hover .tile-chip, .b3-num:focus-visible .tile-chip { color: var(--accent-tx); }

.b3-num--link .tile-chip { color: var(--accent-tx); }
.b3-num--link:hover .tile-chip, .b3-num--link:focus-visible .tile-chip { color: var(--accent-deep); }
.b3-num--link .tile-chip-t { display: inline-flex; align-items: center; gap: 9px; }
.b3-num--link .tile-chip .ic { --ic: 17px; --icw: 1.7; }

.b3-num--link .tile-chip > svg { transition: transform .35s var(--ease); }
.b3-num--link:hover .tile-chip > svg,
.b3-num--link:focus-visible .tile-chip > svg { transform: translateX(4px); }

@media (max-width: 1180px) {
  .b3-nums { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .b3-num { grid-column: span 2; }
  .b3-num:nth-child(4), .b3-num:nth-child(5) { grid-column: span 2; }
  .b3-num:nth-child(5) { grid-column: span 4; }
  .b3-n { font-size: clamp(46px, 6vw, 78px); }
}
@media (max-width: 899px) {
  .b3-intro { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .b3-person { grid-template-columns: 116px minmax(0, 1fr); gap: 20px; }
  .b3-por { width: 116px; height: 158px; }
  .b3-desc { grid-column: 1 / -1; padding-top: 0; }
  .b3-nums { grid-template-columns: minmax(0, 1fr); }
  .b3-num, .b3-num:nth-child(4), .b3-num:nth-child(5) { grid-column: span 1; }
  .b3-n { font-size: clamp(48px, 15vw, 72px); }
  .b3-num-l { max-width: none; }
}

@media (max-width: 1180px) {
  .b0 .eyebrow .b0-eb-t { max-width: 34em; }
}

@media (max-width: 1180px) and (min-width: 900px) {
  :root { --copy-max: min(600px, 52vw); }

  .b0-title { font-size: clamp(40px, 5.35vw, 66px); }

}

@media (max-width: 899px) {

  .b0-grade {
    background: linear-gradient(to top,
      var(--bg) 4%,
      rgba(14,15,18,.96) 20%,
      rgba(14,15,18,.72) 30%,
      rgba(14,15,18,.30) 41%,
      rgba(14,15,18,.08) 51%,
      rgba(14,15,18,0) 60%);
  }
  .b0-vig {
    background:
      radial-gradient(72% 30% at 50% 66%,
        rgba(14,15,18,.54) 0%,
        rgba(14,15,18,.48) 44%,
        rgba(14,15,18,.24) 76%,
        rgba(14,15,18,0) 100%),
      linear-gradient(to right,
        rgba(14,15,18,.42) 0%, rgba(14,15,18,.10) 30%,
        rgba(14,15,18,.10) 70%, rgba(14,15,18,.42) 100%);
  }

  .b0 .eyebrow {
    font-size: 10.5px; letter-spacing: .11em;
    max-width: none;
  }
  .b0 .eyebrow .b0-eb-t { max-width: none; }

  .b0 .eyebrow .b0-eb-t { display: flex; flex-direction: column; gap: 5px; align-items: center; }
  .b0 .eyebrow .dot { display: none; }

  .b0-copy { max-width: none; padding-bottom: clamp(20px, 4vh, 34px); }

  .b0-title { font-size: clamp(32px, 9.7vw, 66px); }
  .b0-sub { max-width: 26ch; font-size: 17px; }

  .b0-names { flex-direction: column; gap: 14px; }
  .b0-name { max-width: none; }
  .b0-name--right { text-align: left; border-top: 1px solid var(--line); padding-top: 14px; }
  .b0-name-r { letter-spacing: .1em; }

  .b1-q { font-size: clamp(38px, 10.4vw, 56px); max-width: 12ch; }
  .b1-a { font-size: clamp(27px, 7.2vw, 40px); max-width: 16ch; }

  .b1-faces {

    margin-top: clamp(38px, 9vw, 60px);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    row-gap: 16px;
  }
  .b1-face { max-width: none; }
  .b1-face:nth-child(even) { transform: translateY(12px); }

  .b1-aside { padding-top: 0; }
  .b1-h2 { max-width: none; }

  .b1-foot { display: block; }
  .b1-foot .rv:last-child { margin-top: 32px; }
  .why { padding: 0 16px 0 18px; gap: 12px; font-size: 11.5px; }

  .chain {
    --node: 32px;
    --row: 18px;
    display: block;
    margin-top: 22px;
  }
  .chain--tight, .b7-steps { --node: 32px; }

  .chain-i {
    padding-top: 0;
    padding-left: calc(var(--node) + 14px);
    min-height: var(--node);
    display: flex;
    align-items: center;
  }
  .chain-i + .chain-i { margin-top: var(--row); }

  .chain-i::before {
    left: calc(var(--node-c) - .5px);
    right: auto;
    top: calc(50% + var(--node) / 2);
    bottom: calc(-1 * var(--row));
    width: 1px; height: auto;
    transform: scaleY(var(--seg, 1));
    transform-origin: 50% 0;
  }
  .chain-i::after {
    left: 0;
    top: 50%;
    transform: translateY(-50%) scale(var(--node-s, 1));
  }

  .chain .chain-i > .ic,
  .chain--tight .chain-i > .ic,
  .b7-steps .chain-i > .ic {
    --ic: 16px;
    --icw: 1.75;
    left: calc(var(--node-c) - var(--ic) / 2);
    top: 50%;
    transform: translateY(-50%) scale(var(--node-s, 1));
  }
  .chain > .chain-i:last-child { --halo: 4px; }
  .b6-contour > .chain-i:last-child { --halo: 0px; }

  .chain-n { display: none; }

  .chain-t,
  .chain--tight .chain-t {
    margin-top: 0;
    font-size: 14.5px;
    line-height: 1.35;
    letter-spacing: .06em;
  }
  .b7-steps .chain-t { font-size: 14px; }
}

@media (min-width: 900px) and (max-height: 720px) {
  .b0-title { font-size: clamp(38px, 4.4vw, 58px); }
}

@media (min-width: 900px) and (min-aspect-ratio: 2/1) {
  .b0 { --a-ly: 34%; }
  .b0-panel--vika .b0-fr { --ly: 34%; }
}

@media (max-width: 420px) {

  .why-label { white-space: normal; text-align: center; line-height: 1.25; }
}

@media (max-width: 400px) {
  .b0 .eyebrow { letter-spacing: .08em; }
}

@media (prefers-reduced-motion: reduce) {
  .b1-pin { min-height: 0 !important; padding-left: 0 !important; margin-left: 0 !important; }
  .b1-sticky { position: static !important; }
  .b1-rail { display: none !important; }
  .b1-face:nth-child(even) { transform: translateY(20px) !important; }
}
@media (prefers-reduced-motion: reduce) and (max-width: 899px) {
  .b1-face:nth-child(even) { transform: translateY(12px) !important; }
}

.paper-card {
  --bg:      var(--paper);
  --bg-2:    var(--paper-2);
  --bg-3:    #E3DED5;
  --fg:      var(--ink);
  --fg-2:    #4A4A47;
  --fg-3:    #66645F;
  --line:    rgba(18,19,22,.12);
  --line-2:  rgba(18,19,22,.22);
  --accent:      var(--accent-deep);

  --accent-tx:   #A82049;
  --accent-soft: rgba(196,42,90,.10);
  --accent-line: rgba(196,42,90,.42);
  padding: clamp(28px, 3.4vw, 48px);
  border-radius: var(--radius-m);
  background: var(--paper);
  color: var(--ink);

  box-shadow:
    0 0 0 1px rgba(244,241,236,.10),
    0 2px 4px rgba(0,0,0,.5),
    0 24px 48px -42px rgba(0,0,0,.9);
}

.b4-intro {
  margin-top: clamp(34px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(30px, 4vw, 72px);
  align-items: end;
}
.b4-lead { padding-bottom: 6px; }

.b4-decomp {
  --b4-lane-gap: clamp(6px, .7vw, 10px);
  margin-top: clamp(52px, 6vw, 88px);
  display: grid;
  grid-template-columns: clamp(160px, 19vw, 262px) clamp(44px, 5.5vw, 92px) minmax(0, 1fr);
  align-items: stretch;
}

.b4-src {
  display: flex;
  flex-direction: column;
  justify-content: center;

  align-items: center;
  text-align: center;
  gap: 8px;
  padding: clamp(20px, 2.2vw, 30px);
  border: 1px solid var(--line-2);
  border-radius: var(--tile-radius);
  background: var(--bg-2);
}

.b4-thumb {
  position: relative;
  display: grid;
  place-items: center;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-bottom: clamp(10px, 1.2vw, 16px);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.07);
  border-radius: 10px;
  background:
    radial-gradient(70% 60% at 22% 88%, rgba(228,58,110,.30) 0%, rgba(228,58,110,0) 70%),
    radial-gradient(90% 70% at 50% -10%, #33373F 0%, rgba(51,55,63,0) 70%),
    linear-gradient(180deg, #1D2026 0%, #121418 100%);
}

.b4-thumb::before {
  content: "";
  position: absolute;
  inset: auto 0 34% 0;
  height: 1px;
  background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,255,255,.10) 40%, rgba(255,255,255,0) 100%);
}
.b4-thumb-yt {
  position: relative;
  width: clamp(30px, 2.8vw, 40px);
  height: clamp(30px, 2.8vw, 40px);
  filter: drop-shadow(0 4px 14px rgba(228,58,110,.35));
}
.b4-thumb-yt .yt-body { fill: var(--accent); }
.b4-thumb-yt .yt-play { fill: #fff; }
.b4-dur {
  position: absolute;
  right: 6px;
  bottom: 6px;
  padding: 2px 5px 2px;
  border-radius: 4px;
  background: rgba(0,0,0,.82);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .02em;
  line-height: 1.3;
  font-variant-numeric: tabular-nums;
}
.b4-src-n {
  color: var(--fg);
  font-size: clamp(44px, 5vw, 72px);
  font-weight: 700;
  line-height: .95;
  letter-spacing: -.035em;
  font-variant-numeric: tabular-nums;
}
.b4-src-l {
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.b4-arm {
  position: relative;
  --b4-draw: 1;
  --b4-dot: 1;
  display: grid;
  grid-template-rows: repeat(6, minmax(0, 1fr));
  gap: var(--b4-lane-gap);
}
.b4-arm i { position: relative; align-self: center; height: 1px; }
.b4-arm i::before {
  content: "";
  position: absolute; inset: 0;
  background-image: repeating-linear-gradient(90deg, var(--line-2) 0 5px, transparent 5px 11px);
  transform: scaleX(var(--b4-draw));
  transform-origin: 0 50%;
}
.b4-arm i::after {
  content: "";
  position: absolute; right: 0; top: 50%;
  margin-top: -2.5px;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--accent);
  opacity: var(--b4-dot);
}

.b4-grid {
  display: grid;
  grid-auto-flow: column;
  grid-template-rows: repeat(6, minmax(0, 1fr));
  grid-template-columns:
    minmax(0, 1.28fr) minmax(0, 1.06fr) minmax(0, .9fr) minmax(0, .76fr);
  gap: var(--b4-lane-gap);
}
.b4-cell {
  display: flex;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  padding: 4px clamp(8px, .9vw, 14px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: var(--bg-3);
  color: var(--fg-2);

  font-size: clamp(10.5px, .8vw, 12px);
  font-weight: 600;
  letter-spacing: .07em;
  line-height: 1.2;
  text-transform: uppercase;
  white-space: nowrap;
}
.b4-cell > .ic { --ic: 14px; --icw: 1.75; }
.b4-cell--h {
  min-height: clamp(34px, 3.2vw, 46px);
  border-color: var(--line-2); background: var(--bg-2); color: var(--fg);
}

.b4-cell:nth-child(n+7) {
  align-self: center;
  padding: 0 clamp(6px, .7vw, 11px);
  font-size: clamp(10px, .72vw, 11px);
  letter-spacing: .04em;
}
.b4-cell:nth-child(n+7):nth-child(-n+12) {
  height: clamp(25px, 2.5vw, 36px);
  color: rgba(169,167,161,.50); border-color: rgba(255,255,255,.075); background: rgba(28,31,37,.66);
}
.b4-cell:nth-child(n+13):nth-child(-n+18) {
  height: clamp(20px, 2vw, 28px);
  color: rgba(169,167,161,.34); border-color: rgba(255,255,255,.06); background: rgba(28,31,37,.42);
}
.b4-cell:nth-child(n+19) {
  height: clamp(16px, 1.6vw, 21px);
  color: rgba(169,167,161,.22); border-color: rgba(255,255,255,.05); border-style: dashed;
  background: rgba(28,31,37,.22);
}

.b4-cap { grid-column: 3; margin-top: clamp(14px, 1.6vw, 20px); }

.b4-sys {
  --b4-gap: clamp(18px, 2vw, 28px);
  --b4-draw: 1;
  margin-top: clamp(60px, 7vw, 104px);
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: var(--b4-gap);
}
.js:not(.rm):not(.nogsap) .b4-sys { --b4-draw: 0; }

.b4-node {
  position: relative;
  grid-column: span 4;
  display: flex;
  flex-direction: column;
  padding: var(--tile-pad);
  border: 1px solid var(--line);
  border-radius: var(--tile-radius);
  background: var(--bg-2);
}

.b4-node-h {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: clamp(14px, 1.6vw, 20px);
}
.b4-item-n {
  flex: 1;
  display: flex;
  align-items: center;
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 700;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums;
}
.b4-item-n::after {
  content: "";
  flex: 1;
  height: 1px;
  margin-left: 14px;
  background: var(--line);
}
.b4-node-ic { --ic: 30px; --icw: 1.35; color: var(--fg-3); }

.b4-item-t {
  color: var(--fg);
  font-size: var(--t-h3);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.01em;
}
.b4-item-d {
  margin-top: 14px;
  color: var(--fg-2);
  font-size: var(--t-small);
  line-height: 1.55;
}

.b4-node > .why { margin-top: auto; align-self: flex-start; padding-top: 0; }
.b4-node > .b4-item-d + .why { margin-top: clamp(20px, 2.2vw, 28px); }

.b4-tag {
  display: inline-block;
  margin-left: 12px;
  padding: 5px 12px;
  vertical-align: middle;
  border: 1px solid var(--line-2);
  border-radius: 999px;
  color: var(--fg-3);
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.b4-node--opt { border-style: dashed; }

.b4-node--hub {
  border-color: var(--line-2);
  box-shadow:
    0 2px 4px rgba(0,0,0,.4),
    0 34px 72px -48px rgba(228,58,110,.55);
}
.b4-node--hub .b4-node-ic { --ic: 38px; }
.b4-hub-tx .b4-item-d { margin-top: 14px; }
.b4-hub-fg { margin-top: clamp(22px, 2.4vw, 32px); }
.b4-hub-d { margin-top: clamp(22px, 2.4vw, 30px); }

.b4-econ {
  margin: clamp(24px, 2.6vw, 34px) calc(var(--tile-pad) * -1) calc(var(--tile-pad) * -1);
  padding: clamp(16px, 1.7vw, 22px) var(--tile-pad);
  display: flex;
  align-items: center;

  border-top: 1px solid var(--line);
  border-radius: 0 0 calc(var(--tile-radius) - 1px) calc(var(--tile-radius) - 1px);
  background: rgba(228,58,110,.07);
}
.b4-econ > .why { margin: 0; }

.b4-node::before,
.b4-node::after {
  content: "";
  position: absolute;
  left: 50%;
  display: none;
  width: 1px;
  height: var(--b4-gap);
  background-image: repeating-linear-gradient(180deg, var(--line-2) 0 5px, transparent 5px 11px);
  pointer-events: none;
  transform: scaleY(var(--b4-draw));
}
.b4-node::after  { top: 100%;    transform-origin: 50% 0; }
.b4-node::before { bottom: 100%; transform-origin: 50% 100%; }

@media (min-width: 900px) {
  .b4-node--base { grid-column: span 2; }
  .b4-node--hub  { grid-column: span 4; }
  .b4-node--br   { grid-column: span 2; }
  .b4-node--base::after { display: block; }
  .b4-node--br::before  { display: block; }
}

@media (min-width: 1024px) {
  .b4-node--hub {
    display: grid;
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    column-gap: clamp(32px, 4vw, 64px);
    align-content: start;
  }
  .b4-node--hub .b4-node-h { grid-column: 1 / -1; }
  .b4-hub-tx { grid-column: 1; }
  .b4-hub-fg { grid-column: 2; grid-row: 2 / span 2; margin-top: 0; }
  .b4-hub-d  { grid-column: 1; }
  .b4-econ   { grid-column: 1 / -1; }

}

@media (min-width: 900px) and (max-width: 1179px) {
  .b4-node--br:nth-child(n+6)::before { display: none; }
}

@media (min-width: 1180px) {
  .b4-node--br { grid-column: span 1; }
  .b4-node--br .b4-item-t { font-size: clamp(18px, 1.35vw, 20px); }
  .b4-node--br .b4-node-ic { --ic: 26px; }
}

.b4-figs-l { margin-top: 0; }
.b4-figs {
  margin-top: 12px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(12px, 1.4vw, 18px);
}
.b4-fig {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  width: 100%;
  padding: clamp(18px, 1.9vw, 24px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: var(--radius-s);
  background: var(--bg-3);
  color: var(--fg);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .4s var(--ease);
}

.b4-fig { cursor: default; box-shadow: none !important; }
.b4-fig:hover, .b4-fig:focus-visible { border-color: var(--line); }
.b4-fig-n {
  display: flex;
  align-items: baseline;
  gap: 0 .14em;
  font-size: clamp(30px, 3.4vw, 46px);
  font-weight: 700;
  line-height: .95;
  letter-spacing: -.035em;
  font-variant-numeric: tabular-nums;
}
.b4-fig-u { color: var(--accent); font-size: .36em; font-weight: 700; letter-spacing: 0; }
.b4-fig-l { max-width: 26ch; color: var(--fg-2); font-size: var(--t-small); line-height: 1.45; }

.b4-fig { gap: clamp(10px, 1.1vw, 14px); }
.b4-fig-l { margin-top: auto; }

.b5-intro { margin-top: clamp(34px, 4vw, 56px); }

.b5-path {
  position: relative;
  margin-top: clamp(56px, 7vw, 100px);
  --b5-rail: 20px;

  --b5-line: 48px;
  --b5-ring: 32px;
  --b5-pad: 22px;
}

.b5-scenes {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}

.b5-scene:nth-child(1) { grid-row: 1; --b5-i: 0; }
.b5-scene:nth-child(2) { grid-row: 3; --b5-i: 1; }
.b5-scene:nth-child(3) { grid-row: 5; --b5-i: 2; }
.b5-scene:nth-child(4) { grid-row: 7; --b5-i: 3; }
.b5-scene:nth-child(5) { grid-row: 9; --b5-i: 4; }

.b5-dos { grid-row: var(--b5-row, 2); min-width: 0; z-index: 3; }

.b5-scene {
  position: relative;
  z-index: 2;
  border-radius: 14px;
  transition: border-color .4s var(--ease), background-color .4s var(--ease);

  --b5-d: calc(var(--b5-i, 0) * 1.4s);
  --b5-nc: calc(10px + var(--b5-ring) / 2);
}
.b5-btn {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 7px;
  width: 100%;
  padding: 12px 0 18px calc(var(--b5-rail) + var(--b5-ring) / 2 + 18px);
  border: 0;
  background: none;
  color: var(--fg);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
}
.b5-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 12px; }

.b5-node {
  position: absolute;
  z-index: 2;
  left: calc(var(--b5-rail) - var(--b5-ring) / 2);
  top: 10px;
  display: grid;
  place-items: center;
  width: var(--b5-ring); height: var(--b5-ring);
  border: 1px solid var(--accent-line);
  border-radius: 50%;
  background: var(--bg);
  transition: box-shadow .45s var(--ease);
}
.b5-node > .ic { --ic: 16px; color: var(--fg-3); transition: color .45s var(--ease); }

.b5-scene.is-on .b5-node { box-shadow: 0 0 0 5px var(--accent-soft); }
.b5-scene.is-on .b5-node > .ic { color: var(--accent); }

.b5-node::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: 50%;
  border: 1.5px solid var(--accent);
  box-shadow: 0 0 16px 2px rgba(228,58,110,.55), 0 0 4px 0 rgba(228,58,110,.8);
  opacity: 0;
  pointer-events: none;
}

.b5-n {
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 600;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums;
}
.b5-state {
  font-family: var(--font-dp);
  font-weight: 400;
  font-size: clamp(24px, 2.1vw, 32px);
  line-height: 1.05;
  letter-spacing: 0;
  color: var(--fg);

  overflow-wrap: normal;
  hyphens: none;
}
.b5-stage {
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 600;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.b5-lead { color: var(--fg-2); font-size: var(--t-small); line-height: 1.45; }

.b5-dos-h { display: flex; }
.b5-dos-in {
  opacity: 0;
  transform: translateY(10px);
  transition: opacity .4s var(--ease) .22s, transform .4s var(--ease) .22s;
}
.b5-dos-in.is-in { opacity: 1; transform: none; }
.b5-dos-txt p { max-width: 46ch; color: var(--fg-2); font-size: var(--t-small); line-height: 1.55; }
.b5-dos-txt p + p { margin-top: 11px; }
.b5-meta {
  margin-top: clamp(16px, 1.6vw, 22px);
  padding-top: clamp(14px, 1.4vw, 18px);
  border-top: 1px solid var(--line);
  display: grid;
  gap: 16px;
  align-content: start;
}
.b5-meta dt {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--fg-3);
  font-size: var(--t-label);
  font-weight: 600;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.b5-meta dt > .ic { color: var(--fg-3); }
.b5-meta dd { margin: 6px 0 0; color: var(--fg); font-size: 16px; line-height: 1.5; }

.b5-beam {
  position: absolute;
  z-index: 1;
  top: 0; bottom: 0;
  left: calc(var(--b5-rail) - 2px);
  width: 4px;
  pointer-events: none;
}

.b5-beam > i {
  position: absolute;
  top: 0; bottom: 0; left: -10px; right: -10px;
  background-repeat: no-repeat;
  background-position: center;
  background-image:
    linear-gradient(180deg, transparent, var(--accent) 50%, transparent),
    radial-gradient(closest-side, rgba(228,58,110,.5), rgba(228,58,110,0));
  background-size: 4px 104px, 24px 190px;
  opacity: 0;
  transform: translateY(-50%);
}
html:not(.rm) .b5-path.is-inview .b5-beam > i {
  animation: b5-beam-v 7s linear infinite;
  animation-delay: var(--b5-d);
}
html:not(.rm) .b5-path.is-inview .b5-node::after {
  animation: b5-ring 7s linear infinite;
  animation-delay: var(--b5-d);
}

@keyframes b5-beam-v {
  0%      { transform: translateY(calc(-50% + var(--b5-nc))); opacity: 0; }
  4.29%   { transform: translateY(calc(-50% + var(--b5-nc))); opacity: 0; }
  7.14%   { transform: translateY(calc(-50% + var(--b5-nc) + 44px)); opacity: 1; }
  13.57%  { transform: translateY(50%); opacity: 1; }
  13.58%  { transform: translateY(50%); opacity: 0; }
  93.57%  { transform: translateY(-50%); opacity: 0; }
  93.58%  { transform: translateY(-50%); opacity: 1; }
  98.29%  { opacity: 1; }
  100%    { transform: translateY(calc(-50% + var(--b5-nc))); opacity: 0; }
}

@keyframes b5-ring {
  0%      { opacity: 1; }
  7.14%   { opacity: 1; }
  14.3%   { opacity: 0; }
  95%     { opacity: 0; }
  100%    { opacity: 1; }
}

@keyframes b5-lit {
  0%          { box-shadow: 0 18px 30px -12px rgba(228,58,110,0);
                animation-timing-function: cubic-bezier(.22,.61,.36,1); }
  5.7%        { box-shadow: 0 18px 30px -12px rgba(228,58,110,.42);
                animation-timing-function: cubic-bezier(.4,0,.7,1); }
  17.2%, 100% { box-shadow: 0 18px 30px -12px rgba(228,58,110,0); }
}
html:not(.rm) .b5-path.is-inview .b5-scene {
  animation: b5-lit 7s linear infinite;
  animation-delay: calc(var(--b5-d) - .45s);
}

html.rm .b5-beam { display: none; }
@media (prefers-reduced-motion: reduce) {
  .b5-beam { display: none; }
  .b5-node::after { display: none; }
  .b5-scene { animation: none !important; box-shadow: none !important; }
}

@media (min-width: 1180px) {
  .b5-path {
    --b5-pad: clamp(18px, 1.7vw, 24px);
    --b5-ring: 40px;
    --b5-gap: 12px;

    --b5-h1: 232px;
    --b5-h2: 380px;
  }

  @media (max-width: 1279.98px) { .b5-path { --b5-h1: 250px; } }
  .b5-scenes {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: var(--b5-h1) minmax(var(--b5-h2), auto);
    column-gap: var(--b5-gap);

    transition: grid-template-columns .6s var(--ease);
  }
  .b5-scenes[data-active="0"] { grid-template-columns: minmax(0, 2.4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
  .b5-scenes[data-active="1"] { grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
  .b5-scenes[data-active="2"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2.4fr) minmax(0, 1fr) minmax(0, 1fr); }
  .b5-scenes[data-active="3"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2.4fr) minmax(0, 1fr); }
  .b5-scenes[data-active="4"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2.4fr); }

  .b5-scene {
    border: 1px solid var(--line);
    background: var(--bg-2);
    overflow: hidden;
    grid-row: 1;

    --b5-nc: calc(var(--b5-pad) + var(--b5-ring) / 2);
  }

  .b5-scene:nth-child(1) { grid-column: 1; grid-row: 1; }
  .b5-scene:nth-child(2) { grid-column: 2; grid-row: 1; }
  .b5-scene:nth-child(3) { grid-column: 3; grid-row: 1; }
  .b5-scene:nth-child(4) { grid-column: 4; grid-row: 1; }
  .b5-scene:nth-child(5) { grid-column: 5; grid-row: 1; }
  .b5-scene.is-on { grid-row: 1 / -1; }

  .b5-scene::before {
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 1px;
    background: var(--accent-line);
    transform: scaleX(0);
    transform-origin: 0 50%;
    transition: transform .45s var(--ease);
    z-index: 3;
  }
  .b5-scene.is-on { border-color: var(--line-2); }

  .b5-scene:has(.b5-btn:focus-visible) {
    outline: 2px solid var(--accent);
    outline-offset: 3px;
  }
  .b5-scene:has(.b5-btn:focus-visible) .b5-btn { outline: 0; }
  .b5-scene.is-on::before { transform: scaleX(1); }

  .b5-scene:not(.is-on) .b5-btn > span:not(.b5-node) { opacity: .78; }

  .b5-btn > span:not(.b5-node) { transition: opacity .4s var(--ease); }
  .b5-btn > span.b5-state {
    transition: opacity .4s var(--ease), font-size .6s var(--ease);
  }

  .b5-btn {
    height: var(--b5-h1);
    align-items: stretch;
    gap: 8px;

    padding: calc(var(--b5-line) + 32px) var(--b5-pad) 0;
  }
  .b5-node {
    left: var(--b5-pad);
    top: calc(var(--b5-line) - var(--b5-ring) / 2);

    background: var(--bg-2);
  }
  .b5-node > .ic { --ic: 20px; }
  .b5-scene.is-on .b5-node { box-shadow: 0 0 0 6px var(--accent-soft); }

  .b5-scene:not(.is-on) .b5-state { font-size: clamp(14px, 1.34vw, 20px); }

  .b5-dos {
    grid-row: 2;
    grid-column: var(--b5-col, 1);
    padding: 0 var(--b5-pad) 26px;
    overflow: hidden;
  }
  .b5-dos-txt p { max-width: 54ch; }
  .b5-meta {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    grid-template-rows: auto minmax(0, 1fr);
    grid-auto-flow: column;
    gap: 0 clamp(20px, 2.4vw, 34px);
  }

  .b5-beam {
    left: 0; right: 0; top: calc(var(--b5-line) - 1.5px); bottom: auto;
    width: auto; height: 4px;
  }
  .b5-beam > i {
    left: 0; right: 0; top: -10px; bottom: -10px;
    background-image:
      linear-gradient(90deg, transparent, var(--accent) 50%, transparent),
      radial-gradient(closest-side, rgba(228,58,110,.5), rgba(228,58,110,0));
    background-size: 104px 4px, 190px 24px;
    transform: translateX(calc(-50% - 120px));
  }
  html:not(.rm) .b5-path.is-inview .b5-beam > i { animation-name: b5-beam-h; }

  @keyframes b5-beam-h {
    0%      { transform: translateX(calc(-50% + var(--b5-nc))); opacity: 0; }
    4.29%   { transform: translateX(calc(-50% + var(--b5-nc))); opacity: 0; }
    7.14%   { transform: translateX(calc(-50% + var(--b5-nc) + 44px)); opacity: 1; }
    13.57%  { transform: translateX(calc(50% + 120px)); opacity: 1; }
    13.58%  { transform: translateX(calc(50% + 120px)); opacity: 0; }
    93.57%  { transform: translateX(calc(-50% - 120px)); opacity: 0; }
    93.58%  { transform: translateX(calc(-50% - 120px)); opacity: 1; }
    98.29%  { opacity: 1; }
    100%    { transform: translateX(calc(-50% + var(--b5-nc))); opacity: 0; }
  }
}

@media (max-width: 1179.98px) {
  .b5-dos {
    padding: 2px 0 clamp(20px, 3vw, 28px) calc(var(--b5-rail) + var(--b5-ring) / 2 + 18px);
  }
  .b5-dos-in {
    padding: clamp(18px, 4vw, 24px);
    border: 1px solid var(--line);
    border-left: 2px solid var(--accent-line);
    border-radius: var(--radius-m);
    background: var(--bg-2);
  }
  .b5-meta { margin-top: 18px; }
}

@media (min-width: 1180px) and (min-height: 800px) {
  #b5 { padding-top: clamp(72px, 7vw, 96px); }
  #b5 .statement { max-width: 18ch; }
}

.b6-intro {
  margin-top: clamp(34px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(30px, 4vw, 72px);
  align-items: end;
}
.b6-contour { margin-top: clamp(44px, 5vw, 76px); }

.b6-scheme {
  position: relative;

  --b6-draw: 1;
  --b6-lane: clamp(46px, 6vw, 96px);
  --b6-rowgap: clamp(44px, 4.6vw, 76px);
  margin-top: clamp(70px, 8vw, 116px);

  padding: clamp(52px, 5.2vw, 80px) clamp(22px, 3vw, 54px) clamp(34px, 3.6vw, 54px);
  border-radius: 24px;
  display: grid;
  grid-template-columns:
    minmax(0, 1fr) var(--b6-lane) minmax(0, 1.04fr) var(--b6-lane) minmax(0, 1fr);
  column-gap: 0;
  row-gap: var(--b6-rowgap);
  align-items: stretch;
}
.b6-shield {
  position: absolute;
  inset: 0;

  width: 100%; height: 100%;
  z-index: 0;

  overflow: visible;
  pointer-events: none;
}
.b6-shield rect {
  fill: none;
  stroke: rgba(18,19,22,.28);
  stroke-width: 1;
  stroke-dasharray: 6 5;
  transition: stroke .45s var(--ease);
}

@keyframes b6-shield-flow { to { stroke-dashoffset: -11; } }

.b6-consent:hover ~ .b6-shield rect,
.b6-consent:focus-within ~ .b6-shield rect {
  stroke: var(--accent-line);
  animation: b6-shield-flow 2.4s steps(11) infinite;
}
html.rm .b6-shield rect { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .b6-shield rect { animation: none !important; } }

.b6-consent { position: absolute; z-index: 2; top: 0; left: 50%; transform: translate(-50%, -50%); }

.b6-consent .why { background: var(--bg); }
.b6-consent .why > .ic { color: var(--fg-3); transition: color .35s var(--ease); }
.b6-consent .why:hover > .ic,
.b6-consent .why:focus-visible > .ic,
.b6-consent .why[aria-expanded="true"] > .ic { color: var(--accent-tx); }

.b6-tile--a { grid-area: 1 / 1; }
.b6-core    { grid-area: 1 / 3; }
.b6-tile--b { grid-area: 1 / 5; }

.b6-tile--c { grid-area: 2 / 2 / 3 / 5; }

.b6-tile {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 10px;
  width: 100%;

  padding: var(--tile-pad) var(--tile-pad) var(--tile-pad-b);
  border: 1px solid var(--line-2);
  border-radius: var(--tile-radius);
  background: var(--bg-2);
  color: var(--fg);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color .4s var(--ease), background-color .4s var(--ease);
}

.b6-tile > * { transition: transform .4s var(--ease); }
.b6-tile:hover > *, .b6-tile:focus-visible > * { transform: translateY(-2px); }
.b6-tile-t { font-size: var(--t-h3); font-weight: 600; line-height: 1.2; letter-spacing: -.01em; }
.b6-tile-s { color: var(--fg-2); font-size: var(--t-small); line-height: 1.45; }

.b6-tile .tile-chip { color: var(--fg-3); }
.b6-tile .tile-chip .why-plus { color: var(--fg-3); }

.b6-tile:hover, .b6-tile:focus-visible,
.b6-tile[aria-expanded="true"] { border-color: var(--accent-line); background: var(--accent-soft); }
.b6-tile:hover .tile-chip, .b6-tile:focus-visible .tile-chip,
.b6-tile[aria-expanded="true"] .tile-chip { color: var(--accent-tx); }
.b6-tile:hover .tile-chip .why-plus, .b6-tile:focus-visible .tile-chip .why-plus,
.b6-tile[aria-expanded="true"] .tile-chip .why-plus { color: var(--accent-tx); }
.b6-tile:hover .tile-chip .why-cross,
.b6-tile:focus-visible .tile-chip .why-cross { transform: rotate(90deg); }
.b6-tile[aria-expanded="true"] .tile-chip .why-cross { transform: rotate(45deg); }
.b6-tile:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }

.b6-core {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  --hub-x: clamp(24px, 2.6vw, 38px);
  --hub-y: clamp(22px, 2.4vw, 34px);
  min-height: 210px;

  padding: calc(var(--hub-y) + 16px) calc(var(--hub-x) + 14px);
  border: 1px solid rgba(18,19,22,.16);
  border-radius: var(--radius-m);
  box-shadow:
    0 28px 54px -34px rgba(196,42,90,.26),
    0 0 60px -24px rgba(196,42,90,.14),
    0 3px 12px -9px rgba(18,19,22,.14);
}

.b6-core::before {
  content: "";
  position: absolute;
  inset: var(--hub-y) var(--hub-x);
  border-radius: var(--radius-s);
  background: var(--paper-2);
}

.b6-hub {
  position: absolute;
  inset: calc(var(--hub-y) / 2) calc(var(--hub-x) / 2);
  width: calc(100% - var(--hub-x));
  height: calc(100% - var(--hub-y));
  overflow: visible;
  pointer-events: none;
}
.b6-hub rect {
  fill: none;
  stroke: rgba(196,42,90,.46);
  stroke-width: 1;

  stroke-dasharray: 3 11;
  stroke-linecap: round;

  animation: b6-hub-turn 24s steps(224) infinite;
  animation-play-state: paused;
}
.b6-scheme.is-inview .b6-hub rect { animation-play-state: running; }
@keyframes b6-hub-turn { to { stroke-dashoffset: -224; } }
html.rm .b6-hub { display: none; }
@media (prefers-reduced-motion: reduce) { .b6-hub { display: none; } }

.b6-core-t {
  position: relative;
  max-width: none;
  font-family: var(--font-dp);
  font-size: clamp(23px, 2.45vw, 35px);
  line-height: 1.12;
  letter-spacing: -.006em;
  color: var(--fg);
}

.b6-tile::after {
  content: "";
  position: absolute;
  pointer-events: none;
  background-repeat: repeat;
}

.b6-tile--a::after,
.b6-tile--b::after {
  top: 50%;
  width: var(--b6-lane); height: 1px;
  background-image: repeating-linear-gradient(90deg, var(--line-2) 0 5px, transparent 5px 11px);
  transform: scaleX(var(--b6-draw));
}
.b6-tile--a::after { left: 100%;  transform-origin: 100% 50%; }
.b6-tile--b::after { right: 100%; transform-origin: 0 50%; }

.b6-tile--c::after {
  left: 50%; bottom: 100%;
  width: 1px; height: var(--b6-rowgap);
  background-image: repeating-linear-gradient(180deg, var(--line-2) 0 5px, transparent 5px 11px);
  transform: scaleY(var(--b6-draw));
  transform-origin: 50% 0;
}

.b6-tile::before {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 1;
  width: 7px; height: 7px;
  margin: -3.5px 0 0 -3.5px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 5px rgba(196,42,90,.10), 0 0 15px 2px rgba(196,42,90,.30);
  opacity: 0;
  transform: scale(.35);
  transition: opacity .3s var(--ease), transform .35s var(--ease);
}
.b6-tile--a::before { top: 50%; left: calc(100% + var(--b6-lane)); }
.b6-tile--b::before { top: 50%; left: calc(var(--b6-lane) * -1); }
.b6-tile--c::before { left: 50%; top: calc(var(--b6-rowgap) * -1); }
.b6-tile:hover::before,
.b6-tile:focus-visible::before,
.b6-tile[aria-expanded="true"]::before {
  opacity: 1;
  transform: scale(1);
  transition-delay: .26s;
}

@keyframes b6-flow   { to { background-position:  11px 0; } }
@keyframes b6-flow-l { to { background-position: -11px 0; } }
@keyframes b6-flow-u { to { background-position: 0 -11px; } }
@keyframes b6-flow-v { to { background-position: 0  11px; } }
.b6-tile--a:hover::after,
.b6-tile--a:focus-visible::after,
.b6-tile--a[aria-expanded="true"]::after,
.b6-tile--b:hover::after,
.b6-tile--b:focus-visible::after,
.b6-tile--b[aria-expanded="true"]::after {
  background-image: repeating-linear-gradient(90deg, var(--accent) 0 5px, transparent 5px 11px);
}
.b6-tile--a:hover::after,
.b6-tile--a:focus-visible::after,
.b6-tile--a[aria-expanded="true"]::after { animation: b6-flow .9s linear infinite; }
.b6-tile--b:hover::after,
.b6-tile--b:focus-visible::after,
.b6-tile--b[aria-expanded="true"]::after { animation: b6-flow-l .9s linear infinite; }
.b6-tile--c:hover::after,
.b6-tile--c:focus-visible::after,
.b6-tile--c[aria-expanded="true"]::after {
  background-image: repeating-linear-gradient(180deg, var(--accent) 0 5px, transparent 5px 11px);
  animation: b6-flow-u .9s linear infinite;
}

html.rm .b6-tile::after { animation: none !important; }
@media (prefers-reduced-motion: reduce) { .b6-tile::after { animation: none !important; } }

.b7-statement { margin-top: clamp(24px, 2.6vw, 34px); max-width: 20ch; }

.b7-stack { position: relative; margin-top: clamp(52px, 6.4vw, 88px); }

.b7-map {
  position: absolute;
  inset: 0;
  z-index: 0;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 1.4vw, 22px);
  pointer-events: none;
}
.b7-map i {
  justify-self: start;
  width: 1px;
  background: linear-gradient(180deg, rgba(255,255,255,.16) 0, rgba(255,255,255,.05) 46%, transparent 88%);
}

.b7-ghost {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(10px, 1.4vw, 22px);
  opacity: .3;
}
.b7-gnode { position: relative; padding-top: 22px; border-top: 1px solid var(--line-2); }
.b7-gnode::before {
  content: "";
  position: absolute; left: 0; top: -3.5px;
  width: 7px; height: 7px;
  border-radius: 50%;
  background: var(--fg-3);
}
.b7-gn {
  display: block;
  color: var(--fg-2);
  font-size: var(--t-label);
  font-weight: 700;
  letter-spacing: .14em;
  font-variant-numeric: tabular-nums;
}
.b7-gs {
  display: block;
  margin-top: 10px;
  color: var(--fg-3);
  font-size: 11px;
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.b7-card {
  position: relative; z-index: 1;
  max-width: 740px; margin: 0 auto;
}

@media (min-width: 900px) {
  .b7-gnode { padding-bottom: 36px; }
  .b7-card { margin: -24px auto 0; }
}
.b7-card-t {
  font-family: var(--font-dp);
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.16;
  letter-spacing: -.004em;
  color: var(--fg);
}

.b7-steps {
  --node: 40px;
  margin-top: clamp(30px, 3.4vw, 44px);
  margin-bottom: clamp(30px, 3.4vw, 44px);
  padding-bottom: clamp(24px, 2.8vw, 36px);
  border-bottom: 1px solid var(--line);
}
.b7-need-l { margin-top: 0; }
.b7-need {
  margin-top: 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px clamp(18px, 2vw, 28px);
}
.b7-need li {
  position: relative;
  padding-left: 18px;
  color: var(--fg-2);
  font-size: var(--t-small);
  line-height: 1.5;
}
.b7-need li::before {
  content: "";
  position: absolute; left: 0; top: .68em;

  width: 8px; height: 2px;
  background: var(--fg-3);
}

.b7-after {
  position: relative;
  margin-top: clamp(26px, 2.8vw, 34px);
  padding-left: clamp(18px, 2vw, 26px);
  color: var(--fg);
  font-size: clamp(15.5px, 1.15vw, 17px);
  line-height: 1.5;
  letter-spacing: -.002em;
}
.b7-after::before {
  content: "";
  position: absolute;
  left: 0; top: .35em; bottom: .35em;
  width: 2px;
  background: var(--accent);
  opacity: .55;
}

.b7-close {
  margin: clamp(48px, 6vw, 80px) auto 0;
  max-width: 740px;
  color: var(--fg);
}

.b8-intro {
  margin-top: clamp(34px, 4vw, 56px);
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: clamp(30px, 4vw, 72px);
  align-items: end;
}
.b8-map-l { margin-top: clamp(56px, 7vw, 96px); }

.b8-map {
  margin-top: clamp(20px, 2.4vw, 30px);
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  counter-reset: vm;
  border-bottom: 1px solid var(--line-2);
}
.b8-cell {
  display: flex;
  align-items: center;
  min-height: clamp(84px, 11vh, 120px);
  padding: clamp(14px, 1.6vw, 20px) 0;
  border: 0;
  border-top: 1px solid var(--line-2);
  border-radius: 0;
  color: var(--fg);
  font-size: clamp(15px, 1.45vw, 20px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.b8-cell::before {
  content: counter(vm, decimal-leading-zero);
  counter-increment: vm;
  flex: none;

  min-width: 2.6em;
  color: var(--fg-3);
  font-size: clamp(15px, 1.15vw, 18px);
  font-weight: 700;
  letter-spacing: .1em;
  font-variant-numeric: tabular-nums;
  margin-right: clamp(14px, 1.5vw, 24px);
}

.b8-cell-t { flex: 1 1 auto; min-width: 0; }
.b8-cell > .ic { flex: none; margin-left: clamp(16px, 2vw, 32px); color: var(--accent); }

.b8-money {
  margin-top: clamp(56px, 7vw, 96px);
  display: grid;
  justify-items: end;
  gap: clamp(16px, 1.8vw, 22px);
}

@property --b8-a { syntax: '<angle>'; inherits: false; initial-value: 0deg; }
.b8-card {
  position: relative; overflow: hidden; width: 100%; max-width: 620px;
  border: 1px solid var(--accent-line);
  box-shadow: 0 -16px 30px -6px rgba(228,58,110,.28);
}
.b8-card::before {
  content: "";
  position: absolute;
  inset: 0;
  padding: 2px;
  border-radius: inherit;
  pointer-events: none;
  background: conic-gradient(from var(--b8-a),
    transparent 0deg, transparent 285deg, rgba(228,58,110,.55) 322deg,
    #F7B0C6 346deg, var(--accent) 353deg, transparent 360deg);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
          mask-composite: exclude;
}
@keyframes b8-orbit-arc { to { --b8-a: 360deg; } }
@keyframes b8-orbit-glow {
  0%     { box-shadow:   0px -16px 30px -6px rgba(228,58,110,.50); }
  12.5%  { box-shadow:  11px -11px 30px -6px rgba(228,58,110,.50); }
  25%    { box-shadow:  16px   0px 30px -6px rgba(228,58,110,.50); }
  37.5%  { box-shadow:  11px  11px 30px -6px rgba(228,58,110,.50); }
  50%    { box-shadow:   0px  16px 30px -6px rgba(228,58,110,.50); }
  62.5%  { box-shadow: -11px  11px 30px -6px rgba(228,58,110,.50); }
  75%    { box-shadow: -16px   0px 30px -6px rgba(228,58,110,.50); }
  87.5%  { box-shadow: -11px -11px 30px -6px rgba(228,58,110,.50); }
  100%   { box-shadow:   0px -16px 30px -6px rgba(228,58,110,.50); }
}
html:not(.rm) .b8-card.is-inview          { animation: b8-orbit-glow 12s linear infinite; }
html:not(.rm) .b8-card.is-inview::before  { animation: b8-orbit-arc 12s linear infinite; }
@media (prefers-reduced-motion: reduce) {
  .b8-card, .b8-card::before { animation: none !important; }
}
.b8-row + .b8-row {
  margin-top: clamp(20px, 2.2vw, 28px);
  padding-top: clamp(20px, 2.2vw, 28px);
  border-top: 1px solid var(--line);
}
.b8-row-l { display: flex; align-items: flex-start; gap: 9px; color: var(--fg-3); }

.b8-row-l > .ic { --ic: 18px; margin-top: calc((1.5em - 18px) / 2); }
.b8-figs {
  margin-top: 16px;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(210px, 1fr));
  gap: clamp(18px, 2vw, 30px);
}

.b8-n {
  color: var(--fg);
  font-size: clamp(28px, 2.9vw, 40px);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -.03em;
  font-variant-numeric: tabular-nums;
}
.b8-row:first-child .b8-fig:first-child .b8-n {
  font-size: clamp(34px, 4.1vw, 58px);
  letter-spacing: -.038em;
}
.b8-u {
  display: block;
  margin-top: 6px;
  color: var(--fg-3);
  font-size: 12.5px;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
}
.b8-c { margin-top: 12px; max-width: 34ch; color: var(--fg-2); font-size: var(--t-small); line-height: 1.5; }

.b8-note {
  position: relative;
  margin-top: clamp(18px, 2vw, 24px);
  max-width: 92ch;
  color: var(--fg-3);
}
.b8-extra { margin-top: 14px; max-width: 48ch; color: var(--fg-2); font-size: var(--t-small); line-height: 1.5; }
.b8-row .why { margin-top: clamp(18px, 2vw, 24px); }

.b8-budgets {
  max-width: 560px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
  text-align: left;
  color: var(--fg-3);
  font-size: 13.5px;
  line-height: 1.62;
  letter-spacing: .012em;
}

@media (min-width: 1024px) {

  .b8-map {
    display: grid;
    grid-auto-flow: column;
    grid-template-rows: repeat(4, 1fr);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(48px, 6vw, 96px);
    border-bottom: 0;
  }

  .b8-cell {

    min-height: clamp(112px, 13vh, 124px);
    font-size: var(--t-h3);
  }

  .b8-cell:nth-child(4),
  .b8-cell:nth-child(8) { border-bottom: 1px solid var(--line-2); }

  .b8-money {
    grid-template-columns: minmax(0, 1fr);
    justify-items: stretch;
  }
  .b8-card    { grid-column: 1; grid-row: 1; max-width: none; }
  .b8-budgets { grid-column: 1; grid-row: 2; max-width: none; }

  .b8-card {
    --b8-pad: clamp(16px, 2.2vw, 40px);
    display: grid;
    grid-template-columns:
      minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.22fr) minmax(0, .86fr);
    column-gap: 0;

    align-items: stretch;
  }
  .b8-card > .b8-row:nth-child(1) {
    grid-column: 1 / 3;
    padding-right: var(--b8-pad);
    display: flex;
    flex-direction: column;
  }

  .b8-card > .b8-row:nth-child(1) .b8-figs { flex: 1; }
  .b8-card > .b8-row:nth-child(2) { grid-column: 3; }
  .b8-card > .b8-row:nth-child(3) { grid-column: 4; }
  .b8-card > .b8-row + .b8-row {
    margin-top: 0;
    padding-top: 0;
    padding-left: var(--b8-pad);
    border-top: 0;
    border-left: 1px solid var(--line);
  }
  .b8-card > .b8-row:nth-child(2) { padding-right: var(--b8-pad); }

  .b8-card > .b8-row:nth-child(1) .b8-figs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 0;
  }
  .b8-card > .b8-row:nth-child(1) .b8-fig:first-child { padding-right: var(--b8-pad); }
  .b8-card > .b8-row:nth-child(1) .b8-fig + .b8-fig {
    padding-left: var(--b8-pad);
    border-left: 1px solid var(--line);
  }

  .b8-card .b8-c { max-width: 28ch; }

  .b8-card { padding-bottom: 124px; }
  .b8-card .b8-note {
    position: absolute;
    left: clamp(28px, 3.4vw, 48px);
    right: clamp(28px, 3.4vw, 48px);
    bottom: clamp(28px, 3.4vw, 48px);
    margin-top: 0;
    padding-top: clamp(16px, 1.5vw, 22px);
    border-top: 1px solid var(--line);
    max-width: none;
  }
}

@media (min-width: 1024px) and (max-width: 1279px) {
  .b8-card .b8-n { font-size: 28px; }
  .b8-card .b8-row:first-child .b8-fig:first-child .b8-n { font-size: 36px; }
}

.b9 {
  background: #000;
  border-top: 1px solid var(--line);
  padding-top: 0;
  padding-bottom: 0;
  display: flex;
  flex-direction: column;
}
.b9-in {
  flex: 1 0 auto;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  justify-content: center;

  padding-block: clamp(40px, 5vw, 72px);
}
.b9-text {
  margin-top: clamp(40px, 5vw, 72px);
  display: grid;
  gap: clamp(18px, 2vw, 26px);
  max-width: 62ch;
}
.b9-final {
  margin-top: clamp(56px, 7vw, 100px);
  max-width: 16ch;
  font-family: var(--font-dp);
  font-size: var(--t-h1);
  line-height: 1.06;
  letter-spacing: -.01em;
  color: var(--fg);
}

.b9-tail { height: 52vh; pointer-events: none; }

@media (max-width: 1180px) {
  .b4-decomp { grid-template-columns: clamp(132px, 17vw, 180px) clamp(30px, 4vw, 60px) minmax(0, 1fr); }
  .b7-need { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 899px) {

  .b4-intro { grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
  .b4-decomp { grid-template-columns: minmax(0, 1fr); }

  .b4-src {
    flex-direction: row; align-items: center; justify-content: flex-start; gap: 12px;
    padding: clamp(14px, 3.6vw, 20px);
    text-align: left;
  }

  .b4-thumb { width: clamp(88px, 26vw, 112px); flex: none; margin: 0 4px 0 0; border-radius: 7px; }
  .b4-thumb-yt { width: 22px; height: 22px; }
  .b4-dur { right: 4px; bottom: 4px; padding: 1px 4px; font-size: 9.5px; border-radius: 3px; }
  .b4-src-n { font-size: clamp(30px, 9vw, 40px); }
  .b4-arm {
    justify-self: start;
    display: block;
    width: 1px; height: clamp(26px, 6vw, 40px);
    margin-left: 26px;
  }
  .b4-arm i { display: none; }
  .b4-arm::before {
    content: "";
    position: absolute; inset: 0;
    background-image: repeating-linear-gradient(180deg, var(--line-2) 0 5px, transparent 5px 11px);
    transform: scaleY(var(--b4-draw));
    transform-origin: 50% 0;
  }
  .b4-arm::after {
    content: "";
    position: absolute; left: 50%; bottom: 0;
    margin: 0 0 -2.5px -2.5px;
    width: 5px; height: 5px;
    border-radius: 50%;
    background: var(--accent);
    opacity: var(--b4-dot);
  }

  .b4-grid {
    grid-template-columns: minmax(0, 1.62fr) repeat(3, minmax(0, 1fr));
    gap: 5px;
  }
  .b4-cell { gap: 5px; padding: 3px 6px; letter-spacing: .03em; }
  .b4-cell--h { min-height: 34px; }
  .b4-cell > .ic { --ic: 12px; }

  .b4-cell:nth-child(n+7) {
    padding: 0 5px;
    letter-spacing: 0;
    font-size: clamp(9px, 2.4vw, 11px);
  }
  .b4-cap { grid-column: 1; }
  .b4-node { padding: clamp(20px, 5vw, 26px); }
  .b4-node--br::before { display: none; }
  .b4-node:not(:last-child)::after { display: block; }
  .b4-econ {
    margin-left: calc(clamp(20px, 5vw, 26px) * -1);
    margin-right: calc(clamp(20px, 5vw, 26px) * -1);
    margin-bottom: calc(clamp(20px, 5vw, 26px) * -1);
    padding-left: clamp(20px, 5vw, 26px);
    padding-right: clamp(20px, 5vw, 26px);
  }
  .b4-figs { grid-template-columns: minmax(0, 1fr); }
  .b4-fig-n { font-size: clamp(34px, 11vw, 44px); }
  .b4-tag { margin-left: 0; margin-top: 10px; }
  .b4-item-t .b4-tag { display: block; width: max-content; }

  .b6-intro { grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }
  .b6-scheme {
    --b6-rowgap: clamp(26px, 5.4vw, 38px);
    grid-template-columns: minmax(0, 1fr);
    column-gap: 0;
    row-gap: var(--b6-rowgap);
    padding: clamp(46px, 8vw, 62px) clamp(18px, 4vw, 28px) clamp(30px, 5vw, 40px);
  }

  .b6-core    { grid-area: 1 / 1; }
  .b6-tile--a { grid-area: 2 / 1; }
  .b6-tile--b { grid-area: 3 / 1; }
  .b6-tile--c { grid-area: 4 / 1; }
  .b6-tile--a::after,
  .b6-tile--b::after,
  .b6-tile--c::after {
    left: 28px; right: auto; top: auto; bottom: 100%;
    width: 1px; height: var(--b6-rowgap);
    background-image: repeating-linear-gradient(180deg, var(--line-2) 0 5px, transparent 5px 11px);
    transform: scaleY(var(--b6-draw));
    transform-origin: 50% 0;
  }
  .b6-tile--a::before,
  .b6-tile--b::before,
  .b6-tile--c::before { left: 28px; top: calc(var(--b6-rowgap) * -1); }
  .b6-tile--a:hover::after,
  .b6-tile--a:focus-visible::after,
  .b6-tile--a[aria-expanded="true"]::after,
  .b6-tile--b:hover::after,
  .b6-tile--b:focus-visible::after,
  .b6-tile--b[aria-expanded="true"]::after {
    background-image: repeating-linear-gradient(180deg, var(--accent) 0 5px, transparent 5px 11px);
    animation: b6-flow-u .9s linear infinite;
  }
  .b6-core { min-height: 104px; }
  .b6-core-t { max-width: none; font-size: clamp(22px, 6.4vw, 30px); }

  .b7-map { display: none; }
  .b7-ghost { margin-bottom: 28px; gap: 8px; }
  .b7-card { max-width: none; }
  .b7-close { max-width: none; }

  .b8-intro { grid-template-columns: minmax(0, 1fr); gap: 24px; align-items: start; }

  .b8-cell { min-height: 108px; }
  .b8-figs { grid-template-columns: minmax(0, 1fr); margin-top: 12px; gap: 16px; }
  .b8-card { padding: clamp(22px, 5vw, 30px); }
  .b8-row + .b8-row { margin-top: 18px; padding-top: 18px; }
  .b8-n { font-size: clamp(27px, 7.4vw, 34px); }
  .b8-row:first-child .b8-fig:first-child .b8-n { font-size: clamp(32px, 9vw, 42px); }
  .b8-c { margin-top: 10px; }
  .b8-note { margin-top: 14px; }
  .b8-extra { margin-top: 12px; }
  .b8-budgets { font-size: 13px; }
}

@media (max-width: 470px) {
  .b7-ghost { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
}

.b6-note { margin-top: clamp(28px, 3vw, 44px); max-width: 54ch; color: var(--ink-2); }

@media (min-width: 1024px) {

  .b0-name-r { font-size: 13px; }

  .b3-task-n { font-size: 14px; }

  .b4-cell--h { font-size: 13px; }
  .b4-cell { min-height: clamp(40px, 3.6vw, 52px); }
  .b4-cap  { font-size: 14px; }
  .b4-tag  { font-size: 12.5px; }
  .b4-item-n { font-size: 14px; }
  .b4-fig .tile-chip { font-size: 12.5px; }

  .b4-item-d { font-size: 17px; line-height: 1.55; }
  .b4-node--br .b4-item-d { font-size: 15px; }

  .b5-lead { font-size: 16px; }

  .b7-gn { font-size: 14px; }
  .b7-gs { font-size: 12.5px; }

  .b8-cell::before { font-size: 14px; }
  .b8-u { font-size: 13.5px; }
}

html.cover-plate .b0-portraits { display: none; }

html.cover-plate .b0-plate {
  position: absolute; inset: 0; z-index: 0;
  pointer-events: none;

  animation: b0-plate-in 1.5s cubic-bezier(.33,0,.2,1) .08s both;
}

html.cover-plate .b0-plate img {
  position: absolute;
  left: 0; right: 0; top: auto; bottom: 0;
  width: 100%;
  height: min(calc(100% + 260px), max(100%, 1160px));
  object-fit: cover;
  object-position: 50% 50%;
}
@keyframes b0-plate-in { from { opacity: 0; } to { opacity: 1; } }

html.rm.cover-plate .b0-plate { animation: none; }
@media (prefers-reduced-motion: reduce) {
  html.cover-plate .b0-plate { animation: none; }
}

html.cover-plate .b0-grade {
  background:

    linear-gradient(to bottom,
      rgba(14,15,18,.76) 0%,
      rgba(14,15,18,.70) 12%,
      rgba(14,15,18,.56) 24%,
      rgba(14,15,18,.34) 36%,
      rgba(14,15,18,.13) 47%,
      rgba(14,15,18,0) 58%),

    linear-gradient(to top,
      var(--bg) 3%,
      rgba(14,15,18,.93) 12%,
      rgba(14,15,18,.70) 21%,
      rgba(14,15,18,.28) 32%,
      rgba(14,15,18,.08) 42%,
      rgba(14,15,18,0) 52%);
}
html.cover-plate .b0-vig {
  background:

    radial-gradient(34% 31% at 50% 60%,
      rgba(14,15,18,.84) 0%,
      rgba(14,15,18,.81) 46%,
      rgba(14,15,18,.55) 74%,
      rgba(14,15,18,.18) 91%,
      rgba(14,15,18,0) 100%),

    linear-gradient(to right,
      rgba(14,15,18,.30) 0%,
      rgba(14,15,18,.10) 20%,
      rgba(14,15,18,0) 42%,
      rgba(14,15,18,0) 58%,
      rgba(14,15,18,.10) 80%,
      rgba(14,15,18,.30) 100%),

    radial-gradient(120% 78% at 50% 34%,
      rgba(14,15,18,0) 44%, rgba(14,15,18,.46) 100%);
}

html.finale-stage .b9-in { position: relative; isolation: isolate; }

html.finale-stage .b9 { overflow: hidden; }

html.finale-stage .b9-plate {
  position: absolute; z-index: -1;
  top: 0; bottom: 0; left: 50%; right: auto;
  width: 100vw; height: 100%;

  max-width: none;
  transform: translateX(-50%);
  object-fit: cover;
  object-position: 50% 42%;
  pointer-events: none;

  opacity: .72;
}
html.finale-stage .b9-in::after {
  content: ''; position: absolute; z-index: -1; pointer-events: none;
  top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%);
  background:

    linear-gradient(to right,
      rgba(0,0,0,.90) 0%,
      rgba(0,0,0,.86) 30%,
      rgba(0,0,0,.62) 48%,
      rgba(0,0,0,.26) 68%,
      rgba(0,0,0,.14) 100%),

    linear-gradient(to bottom,
      rgba(0,0,0,.80) 0%, rgba(0,0,0,.24) 12%,
      rgba(0,0,0,.24) 62%, rgba(0,0,0,.62) 82%,
      rgba(0,0,0,.80) 100%);
}

@media (max-width: 899px) {

  html.cover-plate .b0-plate img { height: 100%; }

  html.cover-plate .b0-grade {
    background:
      linear-gradient(to bottom,
        rgba(14,15,18,.72) 0%,
        rgba(14,15,18,.64) 9%,
        rgba(14,15,18,.52) 19%,
        rgba(14,15,18,.34) 28%,
        rgba(14,15,18,.16) 38%,
        rgba(14,15,18,0) 50%),
      linear-gradient(to top,
        var(--bg) 4%,
        rgba(14,15,18,.95) 18%,
        rgba(14,15,18,.72) 28%,
        rgba(14,15,18,.34) 39%,
        rgba(14,15,18,.10) 49%,
        rgba(14,15,18,0) 58%);
  }
  html.cover-plate .b0-vig {
    background:

      radial-gradient(76% 34% at 50% 68%,
        rgba(14,15,18,.66) 0%,
        rgba(14,15,18,.60) 44%,
        rgba(14,15,18,.30) 76%,
        rgba(14,15,18,0) 100%),
      linear-gradient(to right,
        rgba(14,15,18,.34) 0%, rgba(14,15,18,.08) 30%,
        rgba(14,15,18,.08) 70%, rgba(14,15,18,.34) 100%);
  }

  html.finale-stage .b9-plate,
  html.finale-stage .b9-in::after { display: none; }
}

html.cover-rockey #b0 .b0-portraits { display: none; }

html.cover-rockey .b0-tp {
  position: absolute; inset: 0; z-index: 0;
  overflow: hidden; pointer-events: none;
}
html.cover-rockey .b0-tp-l {
  position: absolute; inset: -3% -3%;
  will-change: transform;
}
html.cover-rockey .b0-tp-far img,
html.cover-rockey .b0-tp-mid img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;

  object-position: 68% 46%;
}

html.cover-rockey .b0-tp-mid {
  -webkit-mask-image: linear-gradient(to top, #000 0%, #000 34%, transparent 58%);
          mask-image: linear-gradient(to top, #000 0%, #000 34%, transparent 58%);
}

html.cover-rockey .b0-tp-fg {
  position: absolute; inset: 0; z-index: 1;
  pointer-events: none; overflow: hidden;
  will-change: transform;
}
html.cover-rockey .b0-tp-fg img {
  position: absolute;
  left: -3vw; bottom: 0;
  height: 81%; width: auto;

  filter: drop-shadow(0 0 28px rgba(0,0,0,.55));
}

html.cover-rockey .b0-tp-far img { animation: b0-tp-far-in 1.6s cubic-bezier(.33,0,.2,1) .08s both; }
html.cover-rockey .b0-tp-mid img { animation: b0-tp-mid-in 1.6s cubic-bezier(.33,0,.2,1) .16s both; }
html.cover-rockey .b0-tp-fg  img { animation: b0-tp-fg-in  1.5s cubic-bezier(.33,0,.2,1) .55s both; }
@keyframes b0-tp-far-in { from { opacity: 0; transform: translate3d(18px,0,0); } to { opacity: 1; transform: none; } }
@keyframes b0-tp-mid-in { from { opacity: 0; transform: translate3d(12px,0,0); } to { opacity: 1; transform: none; } }
@keyframes b0-tp-fg-in  { from { opacity: 0; transform: translate3d(0,26px,0); } to { opacity: 1; transform: none; } }
html.rm.cover-rockey .b0-tp-far img,
html.rm.cover-rockey .b0-tp-mid img,
html.rm.cover-rockey .b0-tp-fg  img { animation: none; }
@media (prefers-reduced-motion: reduce) {
  html.cover-rockey .b0-tp-far img,
  html.cover-rockey .b0-tp-mid img,
  html.cover-rockey .b0-tp-fg  img { animation: none; }
}

html.cover-rockey .b0-grade {
  background:
    linear-gradient(to bottom,
      rgba(14,15,18,.62) 0%,
      rgba(14,15,18,.44) 12%,
      rgba(14,15,18,.20) 24%,
      rgba(14,15,18,0) 38%),
    linear-gradient(to top,
      var(--bg) 3%,
      rgba(14,15,18,.92) 11%,
      rgba(14,15,18,.66) 20%,
      rgba(14,15,18,.26) 31%,
      rgba(14,15,18,.06) 41%,
      rgba(14,15,18,0) 50%);
}

html.cover-rockey .b0-vig {
  background:
    radial-gradient(33% 30% at 54% 60%,
      rgba(14,15,18,.82) 0%,
      rgba(14,15,18,.78) 46%,
      rgba(14,15,18,.50) 74%,
      rgba(14,15,18,.16) 91%,
      rgba(14,15,18,0) 100%),
    linear-gradient(to right,
      rgba(14,15,18,0) 60%,
      rgba(14,15,18,.10) 80%,
      rgba(14,15,18,.30) 100%),
    radial-gradient(120% 78% at 50% 34%,
      rgba(14,15,18,0) 48%, rgba(14,15,18,.40) 100%);
}

html.cover-rockey .b0-copy { position: relative; left: 3.5vw; }

html.cover-rockey .b0-names {
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  border-top: 0;
}
html.cover-rockey .b0-name { text-align: right; }
html.cover-rockey .b0-name:first-child {
  border-top: 1px solid var(--line);
  padding-top: clamp(12px, 1.6vh, 18px);
  min-width: min(40ch, 100%);
}

@media (max-width: 767.98px) {
  html.cover-rockey .b0-tp-l { inset: 0; }
  html.cover-rockey .b0-tp-far img,
  html.cover-rockey .b0-tp-mid img { object-position: 84% 40%; }
  html.cover-rockey .b0-tp-fg { z-index: 0; }
  html.cover-rockey .b0-tp-fg img { left: -12vw; height: 48%; filter: none; }
  html.cover-rockey .b0-copy { left: 0; padding-bottom: 27vh; }
  html.cover-rockey .b0-names { max-width: 64%; margin-left: auto; }
  html.cover-rockey .b0-vig {
    background:
      radial-gradient(64% 30% at 50% 40%,
        rgba(14,15,18,.80) 0%, rgba(14,15,18,.66) 60%, rgba(14,15,18,0) 100%),
      radial-gradient(120% 78% at 50% 34%, rgba(14,15,18,0) 48%, rgba(14,15,18,.40) 100%);
  }
  html.cover-rockey .b0-grade {
    background:
      linear-gradient(to bottom, rgba(14,15,18,.62) 0%, rgba(14,15,18,.30) 14%, rgba(14,15,18,0) 30%),
      linear-gradient(to top, var(--bg) 2%, rgba(14,15,18,.90) 9%, rgba(14,15,18,.62) 18%,
        rgba(14,15,18,.22) 28%, rgba(14,15,18,0) 38%);
  }
}

@media (min-width: 768px) {
  html.cover-rockey .b0-grade {
    background:
      linear-gradient(to bottom,
        rgba(14,15,18,.62) 0%,
        rgba(14,15,18,.44) 12%,
        rgba(14,15,18,.20) 24%,
        rgba(14,15,18,0) 38%);
  }
  html.cover-rockey .b0-tp-fg {
    overflow: visible;
    -webkit-mask-image: none; mask-image: none;
  }
  html.cover-rockey .b0-tp-fg::after {
    content: ''; position: absolute; pointer-events: none;
    inset: -6% -4%;
    background:
      linear-gradient(to top,
        var(--bg) 8%,
        rgba(14,15,18,.92) 15.2%,
        rgba(14,15,18,.66) 23.2%,
        rgba(14,15,18,.26) 33%,
        rgba(14,15,18,.06) 42%,
        rgba(14,15,18,0) 50%);
  }
}

html.finale-rockey .b9 {
  overflow: hidden;
  padding-left: 0;
  padding-right: 0;
}
html.finale-rockey .b9-in {
  position: relative;
  isolation: isolate;
  max-width: none;
  margin: 0;
  padding-left: max(calc(69.9dvh - 3vw + 40px), 42vw);
  padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}

html.finale-rockey .b9-tp {
  position: absolute; inset: 0; z-index: -1;
  overflow: hidden; pointer-events: none;
}
html.finale-rockey .b9-tp-l {
  position: absolute; inset: -3% -3%;
  will-change: transform;
}
html.finale-rockey .b9-tp-far img,
html.finale-rockey .b9-tp-mid img {
  position: absolute; inset: 0;
  width: 100%; height: 100%; max-width: none;
  object-fit: cover;
  object-position: 68% 46%;
}
html.finale-rockey .b9-tp-mid {
  -webkit-mask-image: linear-gradient(to top, #000 0%, #000 34%, transparent 58%);
          mask-image: linear-gradient(to top, #000 0%, #000 34%, transparent 58%);
}
html.finale-rockey .b9-tp-fg {
  position: absolute; inset: 0; z-index: -1;
  overflow: hidden; pointer-events: none;
  will-change: transform;
}
html.finale-rockey .b9-tp-fg img {
  position: absolute;
  left: -3vw; bottom: 0;
  height: 81dvh; width: auto; max-width: none;
  filter: drop-shadow(0 0 28px rgba(0,0,0,.55));
}

html.finale-rockey .b9-in::after {
  content: ''; position: absolute; z-index: -1; inset: 0; pointer-events: none;
  background:
    linear-gradient(to right,
      rgba(0,0,0,0) 30%,
      rgba(0,0,0,.34) 37%,
      rgba(0,0,0,.66) 44%,
      rgba(0,0,0,.80) 52%,
      rgba(0,0,0,.82) 100%),
    linear-gradient(to bottom,
      var(--bg) 0%,
      rgba(14,15,18,.78) 6%,
      rgba(14,15,18,.40) 14%,
      rgba(14,15,18,0) 26%),
    linear-gradient(to top,
      #000 0%,
      rgba(0,0,0,.92) 7%,
      rgba(0,0,0,.66) 15%,
      rgba(0,0,0,.30) 26%,
      rgba(0,0,0,.08) 36%,
      rgba(0,0,0,0) 46%);
}

html.finale-rockey .b9-tp-l img { opacity: 0; }
html.finale-rockey .b9-in.is-on .b9-tp-far img { animation: b0-tp-far-in 1.6s cubic-bezier(.33,0,.2,1) .08s both; }
html.finale-rockey .b9-in.is-on .b9-tp-mid img { animation: b0-tp-mid-in 1.6s cubic-bezier(.33,0,.2,1) .16s both; }
html.finale-rockey .b9-in.is-on .b9-tp-fg  img { animation: b0-tp-fg-in  1.5s cubic-bezier(.33,0,.2,1) .55s both; }
html.rm.finale-rockey .b9-tp-l img { opacity: 1; animation: none; }
@media (prefers-reduced-motion: reduce) {
  html.finale-rockey .b9-tp-l img { opacity: 1; animation: none; }
}

@media (max-width: 767.98px) {
  html.finale-rockey .b9-in {
    padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
    padding-bottom: 56dvh;
  }
  html.finale-rockey .b9-tp-l { inset: 0; }
  html.finale-rockey .b9-tp-far img,
  html.finale-rockey .b9-tp-mid img {
    top: auto; bottom: 0; height: 46%;
    object-position: 84% 40%;
  }
  html.finale-rockey .b9-tp-fg img { left: -12vw; height: 44dvh; filter: none; }
  html.finale-rockey .b9-in::after {
    background:
      linear-gradient(to bottom,
        #000 57%,
        rgba(0,0,0,.50) 61%,
        rgba(0,0,0,.15) 65%,
        rgba(0,0,0,0) 68%),
      linear-gradient(to top,
        #000 0%,
        rgba(0,0,0,.90) 5%,
        rgba(0,0,0,.55) 12%,
        rgba(0,0,0,.18) 20%,
        rgba(0,0,0,0) 28%);
  }
}

html.cover-rockey .b3-cin {
  position: relative;
  z-index: 0;
  width: 100vw;
  height: 100vh;
  height: 100svh;
  min-height: 560px;
  margin: clamp(56px, 7vw, 96px) 0 0 calc(50% - 50vw);
  background: var(--paper);
  isolation: isolate;
  overflow: hidden;
  --a-lx: 50%;

  --a-ly: 33%;
  --seam-a: 46%;
  --seam-b: 54%;
}

html.cover-rockey .b3-cin .b0-panel--vika .b0-fr { --ly: 33%; }

html.cover-rockey .b3 { overflow-x: clip; }
html.cover-rockey .b3-cin-stage { position: absolute; inset: 0; z-index: 0; }
html.cover-rockey .b3-cin .b0-portraits { display: block; }

html.cover-rockey .b3-cin .b0-fr { display: block; animation: none !important; opacity: 1; visibility: visible; }

html.cover-rockey .b3-cin .b0-fr::after { content: none; }
html.cover-rockey .b3-cin .b0-panel::after {
  background: linear-gradient(180deg,
    rgba(244,241,236,0) 0%,
    rgba(244,241,236,0) 48%,
    rgba(244,241,236,.42) 64%,
    rgba(244,241,236,.80) 76%,
    rgba(244,241,236,.95) 86%,
    #F4F1EC 100%);
}

html.cover-rockey .b3-cin-ramp {
  position: absolute; inset: 0 0 auto 0; height: 26%; z-index: 1;
  pointer-events: none;
  background: linear-gradient(to bottom,
    #F4F1EC 0%, #F4F1EC 13%,
    rgba(244,241,236,.60) 20%, rgba(244,241,236,.38) 28%, rgba(244,241,236,.20) 37%,
    rgba(244,241,236,.09) 47%, rgba(244,241,236,.03) 60%, rgba(244,241,236,0) 78%);
}

html.cover-rockey .b3 .wrap { container-type: inline-size; }
html.cover-rockey .b3-cin-names {
  position: absolute; z-index: 2;
  left: 0; right: 0;
  bottom: 12%;
  margin: 0 auto;
  width: 100cqw;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 24px;
  padding-top: clamp(14px, 2vh, 22px);
  border-top: 1px solid var(--line);
}

html.band-in .counter.is-on,
html.band-in .pill.is-on { opacity: 0; pointer-events: none; }
html.band-in .pill.is-on { visibility: hidden; }
html.cover-rockey .b3-cin-names > div { max-width: 40ch; }
html.cover-rockey .b3-cin-names > div:last-child { text-align: right; }
html.cover-rockey .b3-cin-names .b3-name {
  font-size: clamp(22px, 2.1vw, 32px);
  line-height: 1.1;
  color: var(--fg);
}
html.cover-rockey .b3-cin-names .b3-role { margin-top: 8px; color: var(--fg-3); }

html.cover-rockey .b3-people {
  position: relative; z-index: 1;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(28px, 4vw, 64px);
  margin-top: calc(26px - 12vh);
  margin-top: calc(26px - max(12svh, 67px));
}
html.cover-rockey .b3-person { display: block; padding: 0; border: 0; }
html.cover-rockey .b3-person:last-child { border-bottom: 0; }
html.cover-rockey .b3-person .b3-por { display: none; }
html.cover-rockey .b3-desc { padding-top: 0; max-width: 40ch; }
html.cover-rockey .b3-person:last-child .b3-desc { margin-left: auto; }

@media (max-width: 899px) {
  html.cover-rockey .b3-cin { margin-top: clamp(40px, 8vw, 56px); }
  html.cover-rockey .b3-cin-names:empty { display: none; }
  html.cover-rockey .b3-people {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin-top: calc(0px - 11vh);
    margin-top: calc(0px - max(11svh, 62px));
  }
  html.cover-rockey .b3-person .b3-name { font-size: clamp(22px, 6.2vw, 28px); line-height: 1.1; }
  html.cover-rockey .b3-person .b3-role { margin-top: 8px; color: var(--fg-3); }
  html.cover-rockey .b3-person .b3-desc { margin-top: 14px; }
  html.cover-rockey .b3-person + .b3-person { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--line); }
  html.cover-rockey .b3-person:last-child .b3-desc { margin-left: 0; }
}

@media (min-width: 900px) and (min-aspect-ratio: 2/1) {
  html.cover-rockey .b3-cin { --a-ly: 34%; }
}

.b6-tile--photo {
  --b6-ground: #17181c;
  color: var(--paper);
  background: var(--b6-ground);
  border-color: rgba(18,19,22,.42);

  isolation: isolate;
}
.b6-tile--photo .b6-tile-s { color: rgba(244,241,236,.80); }
.b6-tile--photo > .ic { color: rgba(244,241,236,.88); }
.b6-tile--photo .tile-chip,
.b6-tile--photo .tile-chip .why-plus { color: rgba(244,241,236,.66); }

.b6-tile--photo .b6-tile-s { max-width: 74%; }
.b6-tile--b.b6-tile--photo .b6-tile-s { max-width: 64%; }
.b6-tile-bg {
  position: absolute; inset: 0; z-index: -1;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
  background: var(--b6-ground);

}
.b6-tile-bg > img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 68% 50%;

  filter: saturate(.82) contrast(1.06) brightness(.74);
  transition: filter .5s var(--ease), transform .7s var(--ease);
}

.b6-tile-bg::after {
  content: ""; position: absolute; inset: 0;
  background:
    linear-gradient(90deg, rgba(23,24,28,.78) 0%, rgba(23,24,28,.46) 42%, rgba(23,24,28,.06) 100%),
    linear-gradient(0deg,  rgba(23,24,28,.50) 0%, rgba(23,24,28,0) 38%);
}

.b6-tile-bg--rockey .b6-tile-far { object-position: 50% 45%; filter: saturate(.8) contrast(1.05) brightness(.55); }
.b6-tile-bg--rockey .b6-tile-fg {
  inset: auto;
  top: 4%; right: -12%;
  width: auto; height: 104%;
  object-fit: contain; object-position: 100% 0;
  filter: saturate(.92) contrast(1.04) brightness(.92);
}

.b6-tile--photo:hover, .b6-tile--photo:focus-visible,
.b6-tile--photo[aria-expanded="true"] { background: var(--b6-ground); border-color: var(--accent-line); }
.b6-tile--photo:hover > .b6-tile-bg, .b6-tile--photo:focus-visible > .b6-tile-bg,
.b6-tile--photo[aria-expanded="true"] > .b6-tile-bg { transform: none; }
.b6-tile--photo:hover .b6-tile-bg > img, .b6-tile--photo:focus-visible .b6-tile-bg > img,
.b6-tile--photo[aria-expanded="true"] .b6-tile-bg > img { filter: saturate(.9) contrast(1.06) brightness(.9); transform: scale(1.025); }
.b6-tile--photo:hover .b6-tile-bg--rockey .b6-tile-fg, .b6-tile--photo:focus-visible .b6-tile-bg--rockey .b6-tile-fg,
.b6-tile--photo[aria-expanded="true"] .b6-tile-bg--rockey .b6-tile-fg { filter: none; transform: none; }

.b6-tile--photo:hover .b6-tile-bg--rockey .b6-tile-far, .b6-tile--photo:focus-visible .b6-tile-bg--rockey .b6-tile-far,
.b6-tile--photo[aria-expanded="true"] .b6-tile-bg--rockey .b6-tile-far { filter: saturate(.85) contrast(1.05) brightness(.68); }

.b6-tile--photo:hover .tile-chip, .b6-tile--photo:focus-visible .tile-chip,
.b6-tile--photo[aria-expanded="true"] .tile-chip,
.b6-tile--photo:hover .tile-chip .why-plus, .b6-tile--photo:focus-visible .tile-chip .why-plus,
.b6-tile--photo[aria-expanded="true"] .tile-chip .why-plus { color: #EA4E7A; }
html.rm .b6-tile-bg > img { transition: none; }

@media (max-width: 899px) {
  .b6-tile--photo .b6-tile-s { max-width: 84%; }
  .b6-tile--b.b6-tile--photo .b6-tile-s { max-width: 52%; }
  .b6-tile-bg--rockey .b6-tile-fg { right: -8%; top: 4%; height: 92%; }
}
