.about-page { background:#050606; }
.about-page .cryox-nav a[aria-current="page"] { color:var(--accent); }
.about-hero { position:relative; min-height:100dvh; overflow:hidden; display:grid; align-content:end; padding:150px 4vw 7vh; background:#050606; isolation:isolate; }
.about-hero::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(0,0,0,.88),rgba(0,0,0,.2)),var(--about-hero-image,url("../images/client/photos/04.jpg")) center 38%/cover; filter:grayscale(1) contrast(1.08); transform:scale(1.03); }
.about-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(to bottom,rgba(5,6,6,.2),#050606 97%); }
.about-hero__kicker { margin:0 0 4vh; font:700 11px/1 var(--sans); letter-spacing:.13em; }
.about-hero h1 { margin:0; max-width:11ch; font:800 clamp(4.7rem,13vw,13.5rem)/.75 var(--display); letter-spacing:-.085em; }
.about-hero h1 span { display:block; }
.about-hero__aside { position:absolute; right:4vw; bottom:8vh; width:min(28ch,24vw); margin:0; font:600 clamp(10px,.82vw,14px)/1.6 var(--sans); }
.about-manifesto { display:grid; grid-template-columns:.6fr 1.4fr; gap:8vw; padding:16vh 4vw; border-top:1px solid rgba(242,239,232,.16); }
.about-manifesto__label { color:var(--accent); font:800 11px/1 var(--sans); letter-spacing:.12em; }
.about-manifesto h2 { margin:0; font:700 clamp(2.4rem,6vw,7rem)/.95 var(--display); letter-spacing:-.065em; }
.about-manifesto p { max-width:58ch; margin:4vh 0 0; color:rgba(242,239,232,.66); font:500 clamp(14px,1.1vw,19px)/1.7 var(--sans); }
.about-collage { display:grid; grid-template-columns:1.05fr .7fr 1fr; grid-template-rows:42vw 34vw; gap:1.5vw; padding:0 4vw 15vh; }
.about-collage figure { position:relative; overflow:hidden; margin:0; background:#101111; }
.about-collage figure:nth-child(1) { grid-row:1 / 3; }
.about-collage figure:nth-child(4) { grid-column:2 / 4; }
.about-collage img { width:100%; height:100%; display:block; object-fit:cover; filter:grayscale(1) contrast(1.08); transition:filter .5s ease,transform .8s cubic-bezier(.22,1,.36,1); }
.about-collage figure:hover img { filter:grayscale(0); transform:scale(1.025); }
.about-collage figcaption { position:absolute; left:16px; bottom:14px; font:700 9px/1 var(--sans); letter-spacing:.1em; }
.about-principles { padding:4vh 4vw 16vh; }
.about-principles h2 { margin:0 0 6vh; font:800 clamp(3rem,8vw,9rem)/.82 var(--display); letter-spacing:-.07em; }
.about-principles ol { list-style:none; margin:0; padding:0; border-top:1px solid rgba(242,239,232,.18); }
.about-principles li { display:grid; grid-template-columns:80px 1fr 1fr; gap:3vw; align-items:center; min-height:110px; border-bottom:1px solid rgba(242,239,232,.18); }
.about-principles li span { color:var(--accent); font:800 11px/1 var(--sans); }
.about-principles li strong { font:700 clamp(1.5rem,3vw,3.4rem)/1 var(--display); letter-spacing:-.05em; }
.about-principles li p { max-width:50ch; color:rgba(242,239,232,.58); font:500 13px/1.6 var(--sans); }
.about-logos { padding:10vh 4vw 16vh; background:#f2efe8; color:#050606; }
.about-logos__head { display:flex; justify-content:space-between; gap:20px; margin-bottom:8vh; }
.about-logos h2 { margin:0; font:800 clamp(2.6rem,6vw,7rem)/.88 var(--display); letter-spacing:-.065em; }
.about-logos p { max-width:36ch; margin:0; font:600 12px/1.6 var(--sans); }
.about-logo-wall { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); border-top:1px solid rgba(5,6,6,.22); border-left:1px solid rgba(5,6,6,.22); }
.about-logo-wall div { aspect-ratio:1.35; display:grid; place-items:center; padding:9%; overflow:hidden; border-right:1px solid rgba(5,6,6,.22); border-bottom:1px solid rgba(5,6,6,.22); }
.about-logo-wall img { width:100%; height:100%; max-height:112px; object-fit:contain; filter:grayscale(1); transform:scale(2); transform-origin:center; }
@media (max-width:1180px) {
  .about-hero { padding-top:110px; }
  .about-hero h1 { font-size:clamp(4.2rem,14vw,9rem); }
  .about-hero__aside { width:30ch; }
  .about-logo-wall { grid-template-columns:repeat(4,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .about-hero { min-height:92dvh; padding:110px 20px 42px; }
  .about-hero h1 { font-size:21vw; }
  .about-hero__aside { position:relative; inset:auto; width:auto; margin-top:30px; }
  .about-manifesto { grid-template-columns:1fr; padding:100px 20px; }
  .about-collage { grid-template-columns:1fr 1fr; grid-template-rows:105vw 66vw 90vw; gap:10px; padding:0 20px 90px; }
  .about-collage figure:nth-child(1) { grid-column:1 / 3; grid-row:auto; }
  .about-collage figure:nth-child(4) { grid-column:1 / 3; }
  .about-principles { padding:70px 20px 100px; }
  .about-principles li { grid-template-columns:42px 1fr; gap:14px; padding:28px 0; }
  .about-principles li p { grid-column:2; margin:0; }
  .about-logos { padding:80px 20px; }
  .about-logos__head { display:grid; }
  .about-logo-wall { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .about-logo-wall div { padding:8%; }
  .about-logo-wall img { max-height:96px; transform:scale(1.85); }
}
@media (prefers-reduced-motion:reduce) { .about-collage img { transition:none; } }