/* cycle™ — About page. Ports About.dc.html. */
.ab-sec-idx { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.16em; text-transform: uppercase; color: var(--text-muted); }
.ab-block-label { display: block; margin-bottom: 32px; }
.ab-kicker { display: inline-flex; align-items: center; gap: 12px; font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,.7); }
.ab-kicker__tick { width: 28px; height: 1px; background: rgba(255,255,255,.5); }

.ab-hero { position: relative; min-height: 78vh; display: flex; align-items: flex-end; overflow: hidden; background: #000; color: #fff; }
.ab-hero video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.72; }
.ab-hero__scrim { position: absolute; inset: 0; background: var(--scrim-bottom); }
.ab-hero__wrap { position: relative; padding: clamp(40px,7vw,96px) clamp(20px,5vw,80px); max-width: var(--container-wide); width: 100%; margin: 0 auto; }
.ab-hero__title { margin: 18px 0 0; font-family: var(--font-display); font-weight: 900; font-size: clamp(2.8rem,7vw,6rem); line-height: 0.94; letter-spacing: -0.04em; max-width: 18ch; }

.ab-manifesto { max-width: var(--container); margin: 0 auto; padding: clamp(64px,11vh,150px) clamp(20px,5vw,80px); }
.ab-manifesto__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: clamp(32px,5vw,72px); align-items: start; }
.ab-manifesto__text { margin: 0; grid-column: span 2; font-family: var(--font-display); font-weight: 500; font-size: clamp(1.6rem,2.8vw,2.4rem); line-height: 1.25; letter-spacing: -0.01em; text-wrap: pretty; }

.ab-disciplines { max-width: var(--container-wide); margin: 0 auto; padding: 0 clamp(20px,5vw,80px) clamp(48px,8vh,120px); }
.ab-disc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 1px; background: var(--hairline); border: 1px solid var(--hairline); }
.ab-disc { background: var(--bg); padding: 28px 26px; display: flex; flex-direction: column; gap: 12px; min-height: 200px; transition: var(--t-hover); }
.ab-disc:hover { background: var(--surface-sunk); }
.ab-disc__idx { font-family: var(--font-mono); font-size: var(--t-micro); color: var(--text-faint); }
.ab-disc__name { margin: auto 0 0; font-family: var(--font-display); font-weight: 700; font-size: var(--t-h3); letter-spacing: var(--ls-tight); }
.ab-disc__blurb { margin: 0; color: var(--text-muted); font-size: var(--t-small); line-height: 1.5; }

.ab-stats { max-width: var(--container-wide); margin: 0 auto; padding: 0 clamp(20px,5vw,80px) clamp(56px,9vh,130px); }
.ab-stats__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: clamp(24px,4vw,56px); border-top: 1.5px solid var(--border-strong); padding-top: clamp(28px,4vw,48px); }
.ab-stat__num { font-family: var(--font-display); font-weight: 900; font-size: clamp(2.5rem,5vw,4rem); line-height: 0.95; letter-spacing: -0.03em; }
.ab-stat__label { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); }

.ab-band { position: relative; background: #000; color: #fff; overflow: hidden; padding: clamp(72px,12vh,160px) clamp(20px,5vw,80px); text-align: center; }
.ab-band__pattern { position: absolute; inset: 0; background-size: 520px; opacity: 0.5; }
.ab-band__scrim { position: absolute; inset: 0; background: var(--scrim-radial); }
.ab-band__wrap { position: relative; max-width: 24ch; margin: 0 auto; }
.ab-band__kicker { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.ab-band__text { margin: 18px 0 0; font-family: var(--font-display); font-weight: 700; font-size: clamp(1.6rem,3.4vw,2.6rem); line-height: 1.2; letter-spacing: -0.02em; }

.ab-process { max-width: var(--container-wide); margin: 0 auto; padding: clamp(56px,9vh,130px) clamp(20px,5vw,80px); }
.ab-process__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: clamp(24px,3vw,40px); }
.ab-proc { border-top: 1.5px solid var(--border-strong); padding-top: 18px; }
.ab-proc__idx { font-family: var(--font-mono); font-size: var(--t-caption); font-weight: 700; color: var(--text-strong); }
.ab-proc__name { margin: 10px 0 8px; font-family: var(--font-display); font-weight: 700; font-size: var(--t-h4); letter-spacing: var(--ls-tight); }
.ab-proc__blurb { margin: 0; color: var(--text-muted); font-size: var(--t-small); line-height: 1.55; }

.ab-team { max-width: var(--container-wide); margin: 0 auto; padding: 0 clamp(20px,5vw,80px) clamp(64px,10vh,140px); }
.ab-team__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: clamp(18px,2.5vw,32px); }
.ab-member__photo { aspect-ratio: 4/5; border-radius: var(--r-md); overflow: hidden; background: #000; }
.ab-member__photo img { width: 100%; height: 100%; object-fit: cover; filter: grayscale(1) contrast(1.05); transition: transform var(--d-slow) var(--e-out); }
.ab-member:hover .ab-member__photo img { transform: scale(1.04); }
.ab-member__name { margin: 14px 0 2px; font-family: var(--font-display); font-weight: 700; font-size: var(--t-h4); letter-spacing: var(--ls-tight); }
.ab-member__role { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-muted); }

.ab-cta { background: #000; color: #fff; padding: clamp(72px,13vh,170px) clamp(20px,5vw,80px); text-align: center; }
.ab-cta__kicker { font-family: var(--font-mono); font-size: var(--t-micro); letter-spacing: 0.2em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.ab-cta__head { margin: 18px 0 0; font-family: var(--font-display); font-weight: 900; font-size: clamp(2.6rem,7vw,5.5rem); line-height: 0.95; letter-spacing: -0.04em; }
.ab-cta__actions { margin-top: 38px; display: flex; align-items: center; justify-content: center; gap: 14px; flex-wrap: wrap; }
.ab-cta__email { display: inline-flex; align-items: center; height: 56px; padding: 0 24px; font-family: var(--font-mono); font-size: var(--t-small); letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,.7); transition: var(--t-hover); }
.ab-cta__email:hover { color: #fff; }
.ab-cta .cy-dark { display: inline-flex; }