body.v2-about-page { background:#030207; }
.v2-about-cinematic { position:relative; min-height:100svh; overflow:clip; }
.v2-about-cinematic .v2-universe-canvas,
.v2-about-cinematic .v2-cinematic-overlay,
.v2-about-cinematic .v2-cinematic-noise,
.v2-about-cinematic .v2-cinematic-vignette { position:fixed; inset:0; }

.about-hero {
  position:relative;
  min-height:100svh;
  padding:150px 0 100px;
  display:grid;
  place-items:center;
  text-align:center;
  overflow:clip;
}
.about-hero::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(circle at 50% 46%,rgba(166,126,255,.14),transparent 26%),linear-gradient(180deg,rgba(3,2,7,.12),rgba(3,2,7,.52)); }
.about-hero-inner { position:relative; z-index:2; width:min(980px,calc(100vw - 36px)); display:grid; justify-items:center; }
.about-hero-mark { width:clamp(86px,9vw,126px); aspect-ratio:1; object-fit:contain; filter:drop-shadow(0 0 18px rgba(255,255,255,.24)) drop-shadow(0 0 42px rgba(170,134,255,.24)); animation:about-mark-float 7s ease-in-out infinite; }
.about-kicker { margin:28px 0 15px; color:#b99aff; font-size:.7rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.about-hero h1 { max-width:900px; margin:0; color:#fff; font-family:Manrope,Inter,sans-serif; font-size:clamp(3rem,6.1vw,6.4rem); font-weight:520; line-height:.95; letter-spacing:-.065em; text-wrap:balance; }
.about-hero p:not(.about-kicker) { max-width:700px; margin:26px 0 0; color:rgba(239,234,249,.68); font-size:clamp(1rem,1.25vw,1.18rem); line-height:1.74; text-wrap:pretty; }
.about-hero-actions { margin-top:32px; display:flex; flex-wrap:wrap; justify-content:center; gap:10px; }
.about-scroll-cue { position:absolute; left:50%; bottom:28px; width:26px; height:44px; border:1px solid rgba(255,255,255,.12); border-radius:999px; transform:translateX(-50%); }
.about-scroll-cue::after { content:""; position:absolute; left:50%; top:9px; width:3px; height:8px; border-radius:99px; background:#c2abff; transform:translateX(-50%); animation:about-scroll 2s ease-in-out infinite; }
@keyframes about-mark-float { 0%,100%{transform:translateY(0) rotate(-1deg)} 50%{transform:translateY(-7px) rotate(1deg)} }
@keyframes about-scroll { 0%{opacity:0;transform:translate(-50%,0)} 30%{opacity:1} 100%{opacity:0;transform:translate(-50%,14px)} }

.about-section { position:relative; z-index:3; padding:clamp(88px,9vw,132px) 0; overflow:clip; }
.about-section::before { content:""; position:absolute; inset:-18% 0; pointer-events:none; background:radial-gradient(circle at 50% 15%,rgb(var(--scene-rgb)/.16),transparent 36%),radial-gradient(circle at 15% 70%,rgb(var(--scene-rgb-soft)/.10),transparent 32%); opacity:calc(.56 + var(--section-focus,.2)*.38); }
.about-container { position:relative; z-index:1; width:var(--v2-container); margin:0 auto; }
.about-heading { max-width:800px; margin:0 auto clamp(42px,6vw,76px); display:grid; justify-items:center; text-align:center; }
.about-heading .v2-eyebrow { justify-content:center; }
.about-heading h2 { margin:0; color:#fff; font-family:Manrope,Inter,sans-serif; font-size:clamp(2.55rem,4.6vw,5rem); font-weight:540; line-height:.99; letter-spacing:-.052em; text-wrap:balance; }
.about-heading > p:last-child { max-width:670px; margin:20px 0 0; color:rgba(237,231,248,.66); line-height:1.75; }

.about-foundation-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.about-foundation-card { min-height:360px; padding:clamp(30px,4vw,50px); display:grid; align-content:space-between; gap:40px; border:1px solid rgba(255,255,255,.09); border-radius:30px; background:radial-gradient(circle at 20% 0%,rgb(var(--card-accent)/.14),transparent 38%),linear-gradient(150deg,rgba(18,15,30,.84),rgba(8,7,13,.78)); box-shadow:0 30px 100px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.04); backdrop-filter:blur(10px); }
.about-foundation-card:nth-child(1){--card-accent:172 139 255}.about-foundation-card:nth-child(2){--card-accent:105 190 255}
.about-foundation-card span { color:rgb(var(--card-accent)); font-size:.67rem; font-weight:800; letter-spacing:.13em; text-transform:uppercase; }
.about-foundation-card h3 { max-width:540px; margin:0; color:#fff; font-family:Manrope,Inter,sans-serif; font-size:clamp(2rem,3.4vw,3.55rem); font-weight:540; line-height:1.04; letter-spacing:-.045em; }
.about-foundation-card p { max-width:560px; margin:0; color:rgba(236,230,247,.64); line-height:1.75; }

.about-principles-shell { min-height:560px; display:grid; grid-template-columns:280px minmax(0,1fr); border:1px solid rgba(255,255,255,.09); border-radius:32px; overflow:hidden; background:linear-gradient(155deg,rgba(16,13,27,.88),rgba(7,6,12,.82)); box-shadow:0 36px 110px rgba(0,0,0,.27); }
.about-principle-tabs { padding:18px; display:grid; align-content:center; gap:8px; border-right:1px solid rgba(255,255,255,.07); }
.about-principle-tab { min-height:88px; padding:16px; display:grid; grid-template-columns:38px 1fr; align-items:center; gap:12px; border:1px solid transparent; border-radius:18px; color:rgba(235,229,247,.46); background:transparent; text-align:left; cursor:pointer; transition:background 220ms ease,border-color 220ms ease,color 220ms ease,transform 220ms ease; }
.about-principle-tab span { width:34px; height:34px; display:grid; place-items:center; border:1px solid rgba(255,255,255,.08); border-radius:11px; font-size:.66rem; font-weight:800; }
.about-principle-tab strong { font-size:.82rem; font-weight:690; }
.about-principle-tab.is-active { color:#fff; border-color:rgba(178,145,255,.22); background:rgba(153,116,235,.10); transform:translateX(3px); }
.about-principle-stage { position:relative; min-height:560px; padding:clamp(44px,6vw,82px); display:grid; align-content:center; overflow:hidden; }
.about-principle-stage::before { content:""; position:absolute; right:-8%; top:-20%; width:58%; aspect-ratio:1; border-radius:50%; background:radial-gradient(circle,rgb(var(--scene-rgb)/.20),transparent 66%); filter:blur(26px); }
.about-principle-panel { position:relative; z-index:1; display:none; grid-template-columns:minmax(0,1fr) minmax(260px,.7fr); gap:clamp(36px,6vw,90px); align-items:end; }
.about-principle-panel.is-active { display:grid; animation:about-panel-in 420ms cubic-bezier(.2,.8,.2,1) both; }
.about-principle-panel .about-panel-number { position:absolute; right:0; top:-.2em; color:transparent; -webkit-text-stroke:1px rgb(var(--scene-rgb)/.18); font-family:Manrope,Inter,sans-serif; font-size:clamp(10rem,20vw,20rem); font-weight:760; line-height:.8; opacity:.6; }
.about-principle-copy { position:relative; z-index:2; }
.about-principle-copy .v2-panel-kicker { margin-bottom:18px; }
.about-principle-copy h3 { max-width:650px; margin:0; color:#fff; font-family:Manrope,Inter,sans-serif; font-size:clamp(2.3rem,4.3vw,4.6rem); font-weight:540; line-height:1; letter-spacing:-.052em; }
.about-principle-copy p { max-width:650px; margin:22px 0 0; color:rgba(237,231,248,.66); line-height:1.75; }
.about-principle-proof { position:relative; z-index:2; margin:0; display:grid; gap:12px; }
.about-principle-proof div { padding:16px 0; border-bottom:1px solid rgba(255,255,255,.07); display:grid; gap:5px; }
.about-principle-proof dt { color:rgb(var(--scene-rgb)); font-size:.64rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.about-principle-proof dd { margin:0; color:rgba(248,245,255,.76); font-size:.82rem; line-height:1.5; }
@keyframes about-panel-in { from{opacity:0;transform:translateY(15px);filter:blur(4px)} to{opacity:1;transform:none;filter:none} }

.about-collaboration-grid { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(40px,7vw,100px); align-items:start; }
.about-collaboration-copy { position:sticky; top:130px; }
.about-collaboration-copy h2 { margin:0; color:#fff; font-family:Manrope,Inter,sans-serif; font-size:clamp(2.6rem,4.8vw,5rem); font-weight:540; line-height:.99; letter-spacing:-.052em; }
.about-collaboration-copy p { max-width:580px; margin:22px 0 0; color:rgba(237,231,248,.66); line-height:1.75; }
.about-collaboration-list { display:grid; gap:12px; }
.about-collaboration-item { min-height:150px; padding:26px 28px; display:grid; grid-template-columns:52px 1fr; gap:18px; align-items:start; border:1px solid rgba(255,255,255,.08); border-radius:24px; background:linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.015)); }
.about-collaboration-item > span { width:46px; height:46px; display:grid; place-items:center; border:1px solid rgba(184,151,255,.22); border-radius:15px; color:#c5afff; background:rgba(153,115,235,.08); font-size:.72rem; font-weight:800; }
.about-collaboration-item h3 { margin:0; color:#fff; font-size:1.08rem; font-weight:690; }
.about-collaboration-item p { margin:9px 0 0; color:rgba(234,228,246,.58); font-size:.9rem; line-height:1.65; }

.about-conversion { padding-top:80px; }

@media(max-width:900px){
  .about-foundation-grid,.about-collaboration-grid{grid-template-columns:1fr}
  .about-principles-shell{grid-template-columns:1fr}
  .about-principle-tabs{grid-template-columns:repeat(4,1fr);border-right:0;border-bottom:1px solid rgba(255,255,255,.07)}
  .about-principle-tab{min-height:72px;grid-template-columns:1fr;justify-items:center;text-align:center}
  .about-principle-tab strong{display:none}
  .about-collaboration-copy{position:static}
}
@media(max-width:700px){
  .about-hero{padding-top:130px}
  .about-hero h1{font-size:clamp(2.75rem,13vw,4.4rem)}
  .about-foundation-card{min-height:310px;padding:28px 22px}
  .about-heading h2,.about-collaboration-copy h2{font-size:clamp(2.4rem,11vw,3.8rem)}
  .about-principle-stage{min-height:520px;padding:34px 22px}
  .about-principle-panel.is-active{grid-template-columns:1fr;gap:30px}
  .about-principle-copy h3{font-size:clamp(2.25rem,11vw,3.8rem)}
  .about-collaboration-item{padding:22px 20px;grid-template-columns:42px 1fr}
}

@media (max-width: 820px), (pointer: coarse) { .about-foundation-card { backdrop-filter:none; -webkit-backdrop-filter:none; background:linear-gradient(150deg,rgba(18,15,30,.94),rgba(8,7,13,.92)); } }
