/* About v2: dot-matrix V hero, scroll-lit manifesto, live numbers, founders accordion, stacked principles, disciplines, cases */
.a2 { --ink: #0E0F11; --st: #E3E7ED; --mut: #8C929C; }
.a2-n { font-family: var(--fd); font-stretch: 125%; font-weight: 600; font-size: .78rem; letter-spacing: .04em; color: var(--signal); }
.a2-k { display: flex; gap: 12px; align-items: center; margin: 0; font-size: .9rem; color: inherit; opacity: .8; }
.a2-head { display: grid; gap: 18px; padding: 0 var(--gx); margin-bottom: clamp(28px, min(3.6vw, 51.84px), 56px); }
.a2-head--row { grid-template-columns: minmax(0, 1fr) auto; align-items: end; }
.a2-head__p { margin: 0; max-width: 40ch; color: #646A76; }
.a2-h2 { margin: 0; font-weight: 500; font-size: clamp(2.4rem, min(4.6vw, 66.24px), 5rem); line-height: .98; letter-spacing: -.05em; }
.a2-h2 .mute { color: #9CA2AD; }
.dark .a2-h2 .mute { color: #646A76; }
[data-rv] { opacity: 0; transform: translateY(28px); transition: opacity .8s, transform 1s var(--ease); }
[data-rv].is-in { opacity: 1; transform: none; }

/* 1. hero */
.a2-hero { position: relative; min-height: 100svh; display: flex; align-items: flex-end; padding: 120px var(--gx) clamp(32px, min(4vw, 57.6px), 64px); background: var(--ink); color: var(--st); overflow: hidden; }
.a2-hero__cv { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.a2-hero__in { position: relative; z-index: 1; width: 100%; display: grid; gap: clamp(20px, min(2.4vw, 34.56px), 36px); pointer-events: none; }
.a2-hero__in a { pointer-events: auto; }
.a2-hero__h { margin: 0; font-weight: 500; font-size: clamp(3rem, min(9vw, 129.6px), 9.6rem); line-height: .9; letter-spacing: -.06em; }
.a2-ln { display: block; overflow: hidden; padding-bottom: .04em; }
.a2-ln i { display: block; font-style: normal; transform: translateY(105%); transition: transform 1.1s var(--ease); }
.a2-ln:nth-child(2) i { transition-delay: .08s; } .a2-ln:nth-child(3) i { transition-delay: .16s; }
.a2-ln--m { color: #646A76; }
.a2.is-live .a2-ln i { transform: none; }
.a2-hero__row { display: flex; justify-content: space-between; align-items: flex-end; gap: 32px; }
.a2-hero__p { margin: 0; max-width: 52ch; color: #B7BCC5; font-size: clamp(1rem, min(1.2vw, 17.28px), 1.15rem); line-height: 1.5; }
.a2-scroll { display: inline-flex; align-items: center; gap: 14px; font-family: var(--fd); font-stretch: 125%; font-weight: 600; font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: #9CA2AD; white-space: nowrap; }
.a2-scroll i { position: relative; width: 1px; height: 56px; background: rgba(227, 231, 237, .2); overflow: hidden; }
.a2-scroll i::after { content: ""; position: absolute; left: 0; top: -40%; width: 1px; height: 40%; background: var(--signal); animation: a2Drop 1.8s cubic-bezier(.6, 0, .3, 1) infinite; }
@keyframes a2Drop { to { top: 100%; } }

/* 2. manifesto: words light up with the scroll */
.a2-man { position: relative; height: 220vh; }
.a2-man__pin { position: sticky; top: 0; height: 100svh; display: flex; flex-direction: column; justify-content: center; gap: clamp(24px, min(3vw, 43.2px), 44px); padding: 80px var(--gx) 40px; }
.a2-man__t { margin: 0; max-width: 24ch; font-weight: 500; font-size: clamp(2rem, min(5vw, 72px), 5.4rem); line-height: 1.02; letter-spacing: -.05em; }
.a2-man__t .w { color: #C3C9D2; transition: color .35s; }
.a2-man__t .w.on { color: var(--ink); }
.a2-man__t .w.hot { color: var(--signal); }

/* 3. numbers */
.a2-num { padding: 0 var(--gx) var(--sec); }
.a2-num__g { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border-top: 1px solid rgba(14, 15, 17, .14); }
.a2-num__g li { display: grid; align-content: start; gap: 12px; padding: 26px 18px 0 0; border-right: 1px solid rgba(14, 15, 17, .1); }
.a2-num__g li + li { padding-left: 18px; }
.a2-num__g li:last-child { border-right: 0; }
.a2-num__g li:nth-child(2) { transition-delay: .06s; } .a2-num__g li:nth-child(3) { transition-delay: .12s; } .a2-num__g li:nth-child(4) { transition-delay: .18s; } .a2-num__g li:nth-child(5) { transition-delay: .24s; } .a2-num__g li:nth-child(6) { transition-delay: .3s; }
.a2-num__g b { font-family: var(--fd); font-stretch: 112%; font-weight: 500; font-size: clamp(2.8rem, min(5vw, 72px), 5rem); line-height: .9; letter-spacing: -.04em; font-variant-numeric: tabular-nums; }
.a2-num__g li:first-child b { color: var(--signal); }
.a2-num__g span:not([data-count]) { color: #646A76; font-size: .92rem; line-height: 1.35; max-width: 18ch; }

/* 4. founders */
.a2-team { padding: var(--sec) 0; background: var(--ink); color: var(--st); }
.a2-team__g { display: flex; gap: 10px; padding: 0 var(--gx); height: clamp(460px, 62vh, 620px); }
.a2-tm { position: relative; flex: 1; min-width: 0; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(22px, min(2.4vw, 34.56px), 34px); background: #17191C; overflow: hidden; cursor: pointer; outline: none;
  transition: flex 1s var(--ease), background .5s; }
.a2-tm.is-open { flex: 2.4; background: #1C1F23; }
.a2-tm--sig.is-open { background: var(--signal); color: var(--ink); }
.a2-tm__cv { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.a2-tm .a2-n, .a2-tm__b { position: relative; z-index: 1; }
.a2-tm--sig.is-open .a2-n { color: var(--ink); }
.a2-tm__b h3 { margin: 0; font-weight: 500; font-size: clamp(2.2rem, min(4vw, 57.6px), 4rem); line-height: 1; letter-spacing: -.05em; white-space: nowrap; }
.a2-tm__r { margin: 10px 0 0; color: #9CA2AD; white-space: nowrap; }
.a2-tm--sig.is-open .a2-tm__r { color: rgba(14, 15, 17, .7); }
.a2-tm__more { display: grid; gap: 16px; max-width: 46ch; max-height: 0; opacity: 0; overflow: hidden; transition: max-height .8s var(--ease), opacity .4s, margin .8s var(--ease); }
.a2-tm.is-open .a2-tm__more { max-height: 320px; opacity: 1; margin-top: 22px; transition-delay: .25s, .35s, .25s; }
.a2-tm__q { margin: 0; font-size: clamp(1.1rem, min(1.5vw, 21.6px), 1.4rem); line-height: 1.3; letter-spacing: -.02em; }
.a2-tm__more ul { list-style: none; margin: 0; padding: 14px 0 0; border-top: 1px solid rgba(227, 231, 237, .14); display: grid; gap: 6px; font-size: .95rem; }
.a2-tm--sig .a2-tm__more ul { border-top-color: rgba(14, 15, 17, .2); }
.a2-tm__more li::before { content: "— "; color: var(--signal); }
.a2-tm--sig .a2-tm__more li::before { color: var(--ink); }
.a2-team__plus { display: flex; align-items: center; gap: 18px; margin: 10px var(--gx) 0; padding: 20px clamp(22px, min(2.4vw, 34.56px), 34px); border: 1px solid rgba(227, 231, 237, .14); }
.a2-team__plus > span { flex: none; display: grid; place-items: center; width: 44px; height: 44px; background: var(--signal); color: var(--ink); font-family: var(--fd); font-weight: 700; font-size: 1.5rem; }
.a2-team__plus p { margin: 0; color: #9CA2AD; }
.a2-team__plus b { color: var(--st); font-weight: 500; }

/* 5. principles: cards stack as you scroll */
.a2-pr { padding: var(--sec) 0; }
.a2-pr__stack { padding: 0 var(--gx); display: grid; gap: 24px; }
.a2-pc { position: sticky; top: calc(96px + var(--k) * 22px); display: grid; grid-template-columns: auto minmax(0, 1fr) minmax(0, 1fr); align-items: end; gap: 24px 48px; min-height: clamp(260px, 36vh, 360px);
  padding: clamp(26px, min(3vw, 43.2px), 44px); background: var(--ink); color: var(--st); transform-origin: 50% 0; transition: transform .2s linear, filter .2s linear; }
.a2-pc--sig { background: var(--signal); color: var(--ink); }
.a2-pc--light { background: #fff; color: var(--ink); border: 1px solid rgba(14, 15, 17, .1); }
.a2-pc__n { align-self: start; font-family: var(--fd); font-stretch: 125%; font-weight: 700; font-size: clamp(4rem, min(9vw, 129.6px), 9rem); line-height: .8; letter-spacing: -.04em; color: transparent; -webkit-text-stroke: 1px currentColor; opacity: .5; }
.a2-pc h3 { margin: 0; font-weight: 500; font-size: clamp(2rem, min(3.6vw, 51.84px), 3.6rem); line-height: 1; letter-spacing: -.05em; }
.a2-pc p { margin: 0; max-width: 40ch; font-size: 1.05rem; line-height: 1.45; opacity: .75; }

/* 6. disciplines */
.a2-ds { padding: var(--sec) 0; overflow: hidden; }
.a2-mq { margin-bottom: clamp(40px, min(5vw, 72px), 80px); border-block: 1px solid rgba(14, 15, 17, .14); padding: 18px 0; overflow: hidden; }
.a2-mq__t { display: flex; gap: 48px; width: max-content; animation: a2Mq 40s linear infinite; }
.a2-mq__t span { font-weight: 500; font-size: clamp(2rem, min(4vw, 57.6px), 4rem); letter-spacing: -.045em; line-height: 1; color: transparent; -webkit-text-stroke: 1px #0E0F11; white-space: nowrap; }
.a2-mq__t span::after { content: "●"; margin-left: 48px; font-size: .3em; vertical-align: middle; color: var(--signal); -webkit-text-stroke: 0; }
@keyframes a2Mq { to { transform: translateX(-50%); } }
.a2-ds__l { list-style: none; margin: 0 var(--gx); padding: 0; border-top: 1px solid rgba(14, 15, 17, .14); }
.a2-ds__r { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: center; padding: clamp(20px, min(2vw, 28.8px), 30px) 0; border-bottom: 1px solid rgba(14, 15, 17, .14); transition: padding .5s var(--ease), color .3s, opacity .8s, transform 1s var(--ease); }
.a2-ds__r b { font-weight: 500; font-size: clamp(1.8rem, min(3vw, 43.2px), 3rem); letter-spacing: -.045em; line-height: 1; }
.a2-ds__tg { position: absolute; right: 0; top: 50%; transform: translateY(-50%); display: flex; gap: 6px; pointer-events: none; }
.a2-ds__tg i { padding: 8px 12px; border: 1px solid rgba(14, 15, 17, .16); background: var(--st); font-style: normal; font-size: .86rem; font-weight: 500; white-space: nowrap; opacity: 0; transform: translateX(28px); transition: opacity .3s, transform .5s var(--ease); transition-delay: calc((3 - var(--i)) * 30ms); }
.a2-ds__l:hover .a2-ds__r { color: #B4BAC3; }
.a2-ds__l .a2-ds__r:hover { color: var(--ink); padding-left: 14px; }
.a2-ds__r:hover .a2-ds__tg i { opacity: 1; transform: none; transition-delay: calc(var(--i) * 60ms); }
.a2-ds__r:hover .a2-ds__tg i:first-child { border-color: var(--signal); color: var(--signal); }

/* 7. cases */
.a2-work { padding: var(--sec) 0; background: var(--ink); color: var(--st); }
.a2-link { display: inline-flex; align-items: center; gap: 12px; padding-bottom: 6px; border-bottom: 1px solid currentColor; font-weight: 500; }
.a2-link svg, .a2-cs > svg { width: 18px; height: 18px; }
.a2-work__g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-rows: clamp(220px, 26vw, 340px); gap: 10px; padding: 0 var(--gx); }
.a2-cs { position: relative; overflow: hidden; background: #17191C; color: #fff; }
.a2-cs--big { grid-row: span 2; }
.a2-cs img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05) brightness(.7); transform: scale(1.04); transition: filter .8s, transform 1.2s var(--ease); }
.a2-cs:hover img { filter: none; transform: scale(1.1); }
.a2-cs::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 40%, rgba(14, 15, 17, .85)); }
.a2-cs__o { position: absolute; left: clamp(18px, 2vw, 28px); right: 60px; bottom: clamp(18px, 2vw, 28px); z-index: 1; display: grid; gap: 8px; }
.a2-cs__o small { font-family: var(--fd); font-stretch: 125%; font-weight: 600; font-size: .72rem; letter-spacing: .06em; text-transform: uppercase; color: var(--signal); }
.a2-cs__o b { font-weight: 500; font-size: clamp(1.4rem, min(2.2vw, 31.68px), 2.2rem); line-height: 1; letter-spacing: -.04em; }
.a2-cs--big .a2-cs__o b { font-family: var(--fd); font-stretch: 112%; font-size: clamp(2.6rem, min(5vw, 72px), 5rem); }
.a2-cs__o em { font-style: normal; color: #B7BCC5; }
.a2-cs > svg { position: absolute; right: 20px; bottom: 22px; z-index: 1; color: #fff; transition: transform .5s var(--ease), color .3s; }
.a2-cs:hover > svg { transform: translate(4px, -4px); color: var(--signal); }

@media (max-width: 1000px) {
  .a2-num__g { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 28px; }
  .a2-num__g li:nth-child(3n) { border-right: 0; }
  .a2-num__g li:nth-child(3n+1) { padding-left: 0; }
  .a2-team__g { flex-direction: column; height: auto; }
  .a2-tm { min-height: 150px; }
  .a2-tm.is-open { min-height: 360px; }
  .a2-pc { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .a2-work__g { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 240px; }
  .a2-cs--big { grid-row: span 1; }
  .a2-ds__tg { display: none; }
}
@media (max-width: 700px) {
  .a2-head--row { grid-template-columns: minmax(0, 1fr); }
  .a2-hero__row { flex-direction: column; align-items: flex-start; }
  .a2-scroll { display: none; }
  .a2-man { height: 180vh; }
  .a2-num__g { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a2-num__g li, .a2-num__g li + li { padding-left: 0; border-right: 0; }
  .a2-ds__r { grid-template-columns: 44px minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  [data-rv], .a2-ln i { opacity: 1; transform: none; transition: none; }
  .a2-mq__t { animation: none; }
  .a2-man { height: auto; } .a2-man__pin { position: static; height: auto; }
  .a2-man__t .w { color: var(--ink); }
}
.a2-work__g .a2-cs:last-child { grid-column: span 2; }
.a2-cs--big .a2-cs__o b { font-size: clamp(2.2rem, min(3.8vw, 54.72px), 4rem); white-space: nowrap; }
@media (max-width: 1000px) { .a2-work__g .a2-cs:last-child { grid-column: auto; } }
.a2-pc__n { -webkit-text-stroke: 1px rgba(227, 231, 237, .7); opacity: 1; }
.a2-pc--sig .a2-pc__n, .a2-pc--light .a2-pc__n { -webkit-text-stroke-color: rgba(14, 15, 17, .55); }