/* Layout: abundance radiates from one corner. A slow light field rises from the bottom-left of every page header;
   pages are switched from a fixed top bar. Serif for conviction, sans for clarity, mono for the system. */
:root{
  --bg:#F6F5FC; --bg-a:rgba(246,245,252,.94); --surface:#FFFFFF; --ink:#1F0234; --body:#3B3550; --muted:#726B86; --rule:#E4E0EE;
  --night:#1F0234; --night-2:#2A1248; --on-night:#F6F5FC; --on-night-muted:#B4A9D4;
  --sky:#7565EA; --sky-ink:#4D389B; --clay:#035147; --sage:#A4DCB5; --chip:#ECE8F6; --danger:#A33A2A;
  --display:"Newsreader","Iowan Old Style",Georgia,serif; --sans:"Inter",system-ui,-apple-system,"Segoe UI",Arial,sans-serif; --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --wrap:1200px;
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  --bg:#150823; --bg-a:rgba(21,8,35,.92); --surface:#241041; --ink:#F1ECFA; --body:#C9BFE0; --muted:#9488AE; --rule:#33264A;
  --sky-ink:#B9A9F2; --chip:#2A1C45; --danger:#E08A78; color-scheme:dark } }
:root[data-theme="dark"]{
  --bg:#150823; --bg-a:rgba(21,8,35,.92); --surface:#241041; --ink:#F1ECFA; --body:#C9BFE0; --muted:#9488AE; --rule:#33264A;
  --sky-ink:#B9A9F2; --chip:#2A1C45; --danger:#E08A78; color-scheme:dark }

*{box-sizing:border-box} [hidden]{display:none!important}
body{margin:0; background:var(--bg); color:var(--body); font:16px/1.6 var(--sans); -webkit-font-smoothing:antialiased; overflow-x:hidden}
a{color:inherit}
button{font:inherit}
:focus-visible{outline:2px solid var(--sky); outline-offset:3px; border-radius:2px}
.wrap{max-width:var(--wrap); margin:0 auto; padding-inline:clamp(16px,4vw,44px)}
h1,h2,h3{font-family:var(--display); font-weight:300; color:var(--ink); text-wrap:balance; margin:0; letter-spacing:-.015em}
h2{font-size:clamp(34px,5vw,60px); line-height:1.04}
h3{font-size:26px; line-height:1.15; font-weight:400}
p{margin:0; max-width:62ch}
.eyebrow{font:500 12px/1.2 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.lede{font-size:clamp(17px,1.6vw,20px); line-height:1.55}
section{position:relative; z-index:1; padding-block:clamp(64px,9vw,120px); background:var(--bg-a)}
section.surface{background:var(--surface); border-block:1px solid var(--rule)}
.sec-head{display:grid; gap:20px; margin-bottom:clamp(36px,5vw,64px); max-width:820px}
#field{position:fixed; inset:0; width:100%; height:100%; z-index:0; pointer-events:none}

/* top bar */
.top{position:fixed; top:0; left:0; right:0; z-index:30; padding-top:env(safe-area-inset-top,0px); background:rgba(31,2,52,.0); transition:background .5s, border-color .5s; border-bottom:1px solid transparent; color:var(--on-night)}
.top.solid{background:rgba(31,2,52,.88); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-color:rgba(255,255,255,.07)}
.top .wrap{display:flex; align-items:center; justify-content:space-between; gap:20px; padding-block:14px}
.brand{all:unset; cursor:pointer; display:flex; align-items:center; gap:12px}
.brand svg{width:36px; height:36px; flex:none}
.brand b{font:400 25px/1 var(--display); letter-spacing:-.01em}
.brand small{display:block; font:500 9.5px/1 var(--sans); letter-spacing:.34em; color:var(--on-night-muted); margin-top:5px}
.brand .r{stroke:#CFC4F5; stroke-width:2.6; stroke-dasharray:170; stroke-dashoffset:0}
.brand .f{fill:none; stroke:#CFC4F5; stroke-width:3.2}
.brand .n{fill:#A4DCB5}
.anim .brand .r{animation:draw 2.4s cubic-bezier(.25,.6,.2,1) both}
.anim .brand .r:nth-child(2){animation-delay:.15s}.anim .brand .r:nth-child(3){animation-delay:.3s}.anim .brand .r:nth-child(4){animation-delay:.45s}.anim .brand .r:nth-child(5){animation-delay:.6s}.anim .brand .r:nth-child(6){animation-delay:.75s}.anim .brand .r:nth-child(7){animation-delay:.9s}
.anim .brand .n{animation:pop .9s 2.1s cubic-bezier(.3,1.4,.5,1) both; transform-box:fill-box; transform-origin:center}
.anim .brand .n:nth-of-type(2){animation-delay:2.4s}.anim .brand .n:nth-of-type(3){animation-delay:2.7s}
@keyframes draw{from{stroke-dashoffset:170}to{stroke-dashoffset:0}}
@keyframes pop{from{transform:scale(0)}to{transform:scale(1)}}
.tabs{display:flex; gap:4px; list-style:none; margin:0; padding:0}
.tabs button{all:unset; cursor:pointer; font:500 14px/1 var(--sans); color:var(--on-night-muted); padding:10px 14px; border-radius:999px; transition:color .3s, background .3s}
.tabs button:hover{color:var(--on-night)}
.tabs button[aria-current="page"]{color:var(--on-night); background:rgba(117,101,234,.20)}
.tabs button:focus-visible{outline:2px solid var(--sky)}
.menu{all:unset; cursor:pointer; display:none; color:var(--on-night); font:500 13px/1 var(--mono); letter-spacing:.1em; border:1px solid rgba(238,242,234,.3); padding:10px 14px; border-radius:999px}
.btn{all:unset; box-sizing:border-box; cursor:pointer; display:inline-flex; align-items:center; gap:10px; font:600 14px/1 var(--sans); padding:15px 22px; border-radius:999px; border:1px solid transparent; transition:transform .3s, border-color .3s}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:2px solid var(--sky); outline-offset:3px}
.btn-sky{background:var(--sky); color:#F6F5FC}
.btn-line{border-color:rgba(238,242,234,.35); color:var(--on-night)}
.btn-line:hover{border-color:var(--on-night)}
.btn-ink{background:var(--ink); color:var(--bg)}
.btn-ghost{border-color:var(--rule); color:var(--ink)}
@media (max-width:900px){
  .menu{display:inline-block}
  .tabs{display:none; position:absolute; left:0; right:0; top:100%; flex-direction:column; gap:0; background:rgba(31,2,52,.97); padding:8px clamp(16px,4vw,44px) 16px}
  .tabs.open{display:flex}
  .tabs button{display:block; box-sizing:border-box; width:100%; padding:14px 4px; border-radius:0; border-bottom:1px solid rgba(255,255,255,.08)}
  .tabs button[aria-current="page"]{background:none; color:var(--sky)}
}

/* page heroes */
.hero{position:relative; z-index:1; color:var(--on-night); padding-block:150px clamp(56px,8vw,96px)}
.hero.home{min-height:min(92vh,900px); display:flex; align-items:flex-end}
.hero .wrap{width:100%}
.hero .eyebrow{color:var(--sage)}
.def{font:400 15px/1.5 var(--mono); color:var(--on-night-muted); display:flex; flex-wrap:wrap; gap:6px 14px; align-items:baseline; margin-bottom:28px}
.def b{font:italic 400 22px/1 var(--display); color:var(--on-night); letter-spacing:.01em}
.def i{font-style:normal; color:var(--sky)}
.hero h1{color:var(--on-night); font-size:clamp(52px,9.4vw,138px); line-height:.94; letter-spacing:-.035em; max-width:11ch}
.hero.page h1{font-size:clamp(44px,7vw,96px); max-width:14ch; margin-top:18px}
.hero h1 em{font-style:italic; color:var(--sky)}
.hero .sub{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:32px; align-items:end; margin-top:40px}
.hero p{color:var(--on-night-muted); font-size:clamp(17px,1.5vw,20px)}
.hero.page p{margin-top:24px}
.hero .ctas{display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end}
@media (max-width:860px){ .hero .sub{grid-template-columns:1fr} .hero .ctas{justify-content:flex-start} }
.view{animation:fadein 1.1s ease both}
@keyframes fadein{from{opacity:.0; transform:translateY(8px)}to{opacity:1; transform:none}}

/* pillars */
.pillars{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1px; background:var(--rule); border:1px solid var(--rule)}
.pillar{background:var(--surface); padding:28px 26px 30px; display:grid; gap:14px; align-content:start}
.pillar svg{width:100%; height:120px; display:block}
.pillar .k{font:500 11px/1 var(--mono); letter-spacing:.12em; color:var(--clay)}
.pillar h3{font-size:25px}
.pillar p{font-size:15px}
.ln{stroke:var(--sky-ink); stroke-width:1.6; fill:none}
.ln-soft{stroke:var(--rule); stroke-width:1.2; fill:none}
.nd{fill:var(--sage)}
.flow{stroke-dasharray:4 7; animation:flow 4.5s linear infinite}
@keyframes flow{to{stroke-dashoffset:-22}}
.orbit{transform-origin:110px 60px; animation:spin 22s linear infinite}
.orbit.o2{animation-duration:15s}.orbit.o3{animation-duration:10s}
@keyframes spin{to{transform:rotate(360deg)}}
.ripple{transform-origin:110px 112px; animation:ripple 7.5s ease-out infinite}
.ripple.d2{animation-delay:2.5s}.ripple.d3{animation-delay:5s}
@keyframes ripple{0%{transform:scale(.25); opacity:.8}100%{transform:scale(1.2); opacity:0}}
.rider{offset-path:path("M10 108 C 70 106, 120 96, 160 70 S 205 18, 212 10"); animation:ride 9s cubic-bezier(.45,0,.35,1) infinite}
@keyframes ride{from{offset-distance:0%}to{offset-distance:100%}}
@media (max-width:980px){ .pillars{grid-template-columns:1fr 1fr} }
@media (max-width:540px){ .pillars{grid-template-columns:1fr} }

/* teaser links */
.next{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(16px,2.4vw,28px)}
.next button{all:unset; cursor:pointer; display:grid; gap:12px; align-content:start; padding:28px; background:var(--surface); border:1px solid var(--rule); transition:border-color .4s, transform .4s}
.next button:hover{border-color:var(--ink); transform:translateY(-2px)}
.next button:focus-visible{outline:2px solid var(--sky)}
.next .k{font:500 11px/1 var(--mono); letter-spacing:.12em; color:var(--clay)}
.next b{font:300 30px/1.1 var(--display); color:var(--ink)}
.next span:last-child{font-size:15px}
@media (max-width:860px){ .next{grid-template-columns:1fr} }

/* approach */
.split{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,6vw,96px); align-items:start}
.traits{border-top:1px solid var(--ink)}
.trait{display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; padding:22px 0; border-bottom:1px solid var(--rule)}
.trait span{font:500 12px/1.9 var(--mono); color:var(--clay)}
.trait b{display:block; font:400 22px/1.25 var(--display); color:var(--ink); margin-bottom:6px}
.trait p{font-size:15px}
.facts{display:flex; flex-wrap:wrap; gap:8px; margin-top:28px}
.facts span{font:500 12.5px/1 var(--mono); padding:9px 12px; border:1px solid var(--rule); border-radius:999px; color:var(--ink); background:var(--surface)}
.dark{background:var(--night); color:var(--on-night)}
.dark h2,.dark h3{color:var(--on-night)} .dark .eyebrow{color:var(--sage)} .dark .lede{color:var(--on-night-muted)}
.dark h2 em{font-style:italic; color:var(--sky)}
.trio{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,3vw,40px)}
.trio div{border-top:1px solid rgba(238,242,234,.18); padding-top:22px; display:grid; gap:12px; align-content:start}
.trio .k{font:500 11px/1 var(--mono); letter-spacing:.12em; color:var(--sky)}
.trio p{color:var(--on-night-muted); font-size:15.5px}
.os{margin-top:clamp(56px,8vw,96px); display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(32px,5vw,72px); align-items:center}
.net{width:100%; max-width:520px; aspect-ratio:1; justify-self:center}
.net .edge{stroke:rgba(207,196,245,.28); stroke-width:1}
.net .pulse{stroke:var(--sky); stroke-width:1.6; stroke-dasharray:10 200; animation:pulse 7s linear infinite}
@keyframes pulse{from{stroke-dashoffset:210}to{stroke-dashoffset:0}}
.net .node{fill:var(--night-2); stroke:rgba(207,196,245,.6); stroke-width:1}
.net text{font:500 10px var(--mono); fill:var(--on-night); letter-spacing:.06em}
.net .core{fill:var(--sage)}
.net .halo{fill:none; stroke:var(--sage); stroke-width:1; transform-box:fill-box; transform-origin:center; animation:halo 5s ease-out infinite}
@keyframes halo{from{transform:scale(1); opacity:.8}to{transform:scale(2.3); opacity:0}}
.stages{border-top:1px solid rgba(238,242,234,.18); margin-top:28px}
.stage{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 16px; padding:16px 0; border-bottom:1px solid rgba(238,242,234,.18)}
.stage b{font:400 20px/1.3 var(--display); color:var(--on-night)}
.stage p{grid-column:1/-1; color:var(--on-night-muted); font-size:14.5px}
.chip{font:500 10.5px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; padding:6px 9px; border-radius:999px; border:1px solid currentColor; align-self:center; white-space:nowrap}
.chip.live{color:var(--sky)} .chip.build{color:var(--sage)}
.guard{margin-top:22px; font-size:14.5px; color:var(--on-night-muted)}
.guard b{color:var(--on-night); font-weight:500}
.stats{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,3vw,40px)}
.stat{border-top:1px solid var(--ink); padding-top:24px}
.stat .n{font:300 clamp(56px,7vw,92px)/.95 var(--display); color:var(--ink); letter-spacing:-.03em; font-variant-numeric:tabular-nums}
.stat .n .vs{font-size:.32em; font-style:italic; color:var(--muted); margin-inline:.2em; letter-spacing:0}
.stat .n .hi{color:var(--clay)}
.stat h3{font:500 12px/1.3 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--ink); margin:18px 0 8px}
.stat p{font-size:15px}
.src{margin-top:28px; font-size:12.5px; color:var(--muted)}
@media (max-width:900px){ .split,.trio,.os,.stats{grid-template-columns:1fr} }

/* companies */
.toolbar{display:flex; flex-wrap:wrap; justify-content:space-between; gap:16px; align-items:center; margin-bottom:28px}
.filters{display:flex; flex-wrap:wrap; gap:8px}
.filters button{all:unset; cursor:pointer; font:500 12.5px/1 var(--mono); padding:10px 14px; border:1px solid var(--rule); border-radius:999px; color:var(--body); background:var(--surface)}
.filters button[aria-pressed="true"]{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.filters button:focus-visible{outline:2px solid var(--sky)}
.grid-co{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(14px,2vw,24px)}
.co{background:var(--surface); border:1px solid var(--rule); padding:24px; display:grid; gap:14px; align-content:start; transition:border-color .4s}
.co:hover{border-color:var(--muted)}
.co .head{display:flex; gap:16px; align-items:center}
.logo{width:56px; height:56px; flex:none; display:grid; place-items:center; background:var(--chip); border-radius:6px; overflow:hidden; font:400 24px/1 var(--display); color:var(--ink)}
.logo img{width:100%; height:100%; object-fit:contain; background:#fff; padding:6px}
.co h3{font-size:24px}
.co .role{font:500 11px/1.3 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-top:4px}
.co p{font-size:15px}
.co .foot{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:4px; flex-wrap:wrap}
.status{font:500 10.5px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; padding:6px 9px; border-radius:999px; border:1px solid currentColor; color:var(--sky-ink)}
.status.s-exited{color:var(--clay)} .status.s-current{color:var(--ink)} .status.s-partial{color:var(--sky-ink)} .status.s-past{color:var(--muted)}
.co a{font:500 13px/1 var(--sans); color:var(--ink); text-underline-offset:3px}
.empty{padding:48px 24px; border:1px dashed var(--rule); text-align:center; color:var(--muted)}
.note{margin-top:28px; font-size:12.5px; color:var(--muted); max-width:none}
@media (max-width:980px){ .grid-co{grid-template-columns:1fr 1fr} }
@media (max-width:600px){ .grid-co{grid-template-columns:1fr} }

/* CMS */
.cms{margin-top:40px; border:1px solid var(--ink); background:var(--surface)}
.cms header{display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px 22px; border-bottom:1px solid var(--rule); flex-wrap:wrap}
.cms header b{font:400 22px/1.2 var(--display); color:var(--ink)}
.cms .body{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}
.cms ul{list-style:none; margin:0; padding:0; border-right:1px solid var(--rule); max-height:620px; overflow:auto}
.cms li button{all:unset; box-sizing:border-box; cursor:pointer; width:100%; display:flex; justify-content:space-between; gap:10px; padding:14px 22px; border-bottom:1px solid var(--rule); font-size:15px; color:var(--ink)}
.cms li button[aria-current="true"]{background:var(--chip)}
.cms li button small{font:500 11px var(--mono); color:var(--muted); text-transform:uppercase}
.cms form{padding:22px; display:grid; gap:16px}
.cms label{display:grid; gap:6px; font:500 12px/1.2 var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.cms input,.cms select,.cms textarea{font:15px/1.4 var(--sans); color:var(--ink); background:var(--bg); border:1px solid var(--rule); border-radius:4px; padding:11px 12px; text-transform:none; letter-spacing:0; width:100%}
.cms textarea{min-height:96px; resize:vertical}
.cms .row2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.cms .logo-row{display:flex; gap:14px; align-items:center}
.cms .actions{display:flex; gap:10px; flex-wrap:wrap; align-items:center}
.cms .msg{font-size:13.5px; color:var(--muted)}
.cms .msg.err{color:var(--danger)}
.btn-danger{border-color:var(--danger); color:var(--danger)}
@media (max-width:860px){ .cms .body{grid-template-columns:1fr} .cms ul{border-right:0; max-height:260px} .cms .row2{grid-template-columns:1fr} }

/* team */
.people{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(24px,4vw,56px)}
.person{display:grid; grid-template-columns:150px minmax(0,1fr); gap:24px; align-items:start; border-top:1px solid var(--ink); padding-top:28px}
.person > div, .person > p{grid-column:2}
.person figure{margin:0; grid-row:1 / span 3; width:150px; height:150px; border-radius:50%; overflow:hidden; background:var(--night)}
.person img{width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.05); display:block}
.person h3{font-size:30px}
.person .role{font:500 11.5px/1.3 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--clay); margin-top:6px}
.person p{font-size:15.5px}
.person .edu{font-size:13.5px; color:var(--muted)}
.together{margin-top:clamp(32px,4vw,48px); font:300 clamp(22px,2.6vw,30px)/1.3 var(--display); color:var(--ink); max-width:none}
.team-intro{margin:0 0 clamp(40px,5vw,64px); max-width:900px}
.person{row-gap:14px}
.together em{font-style:italic; color:var(--clay)}
.blist{list-style:none; margin:0; padding:0; counter-reset:b}
.blist li{counter-increment:b; display:grid; grid-template-columns:72px minmax(0,1fr); gap:16px; padding:clamp(18px,2.4vw,28px) 0; border-bottom:1px solid var(--rule); align-items:baseline}
.blist li::before{content:counter(b,decimal-leading-zero); font:500 12px var(--mono); color:var(--clay)}
.blist li span{font:300 clamp(24px,3.2vw,40px)/1.15 var(--display); color:var(--ink)}
.blist li span em{font-style:italic}
@media (max-width:860px){ .people{grid-template-columns:1fr} }
@media (max-width:480px){ .person{grid-template-columns:1fr} .person > div, .person > p{grid-column:1} .person figure{grid-row:auto; width:120px; height:120px} }

/* login */
.login{max-width:440px; display:grid; gap:18px; background:var(--surface); border:1px solid var(--rule); padding:clamp(24px,4vw,40px)}
.login label{display:grid; gap:8px; font:500 12px/1.2 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted)}
.login input{font:16px/1.4 var(--sans); color:var(--ink); background:var(--bg); border:1px solid var(--rule); border-radius:4px; padding:12px 13px; text-transform:none; letter-spacing:0; width:100%}
.login input:focus{outline:2px solid var(--sky); outline-offset:1px}
.login .btn{justify-content:center}
.login-note{font-size:15px}
.login .msg{min-height:1.4em; font-size:14px; color:var(--danger)}
.login-help{font-size:13.5px; color:var(--muted)} .login-help a{color:var(--ink); text-underline-offset:3px}

/* contact */
.mailbox{display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; margin-top:40px; padding-top:28px; border-top:1px solid rgba(238,242,234,.2)}
.mailbox .mail{font:300 clamp(28px,4.4vw,56px)/1.1 var(--display); color:var(--on-night); user-select:all; word-break:break-all}
.copy{all:unset; cursor:pointer; font:500 12px/1 var(--mono); color:var(--on-night); border:1px solid rgba(238,242,234,.35); padding:11px 14px; border-radius:999px}
.copy:focus-visible{outline:2px solid var(--sky)}
.who-list{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(20px,3vw,40px)}
.who-list div{border-top:1px solid var(--ink); padding-top:20px; display:grid; gap:10px}
.who-list b{font:400 24px/1.2 var(--display); color:var(--ink)}
.who-list p{font-size:15px}
@media (max-width:860px){ .who-list{grid-template-columns:1fr} }

footer{position:relative; z-index:1; background:var(--night); color:var(--on-night-muted); padding-block:36px 40px}
footer .wrap{display:grid; gap:22px}
footer .row{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; align-items:center; font-size:13px}
footer .links{display:flex; gap:18px; flex-wrap:wrap}
footer .links button,.motion{all:unset; cursor:pointer; font:500 12px/1 var(--mono); letter-spacing:.08em; color:var(--on-night)}
footer .legal{font-size:12px; line-height:1.6; opacity:.85; display:grid; gap:10px} footer .legal p{max-width:none}


.pillar{padding:0 0 26px}
.pillar > h3, .pillar > p{padding-inline:24px}
.pillar .media{position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--night); margin-bottom:6px}
.pillar .media img{width:100%; height:100%; object-fit:cover; display:block; transition:transform 6s ease}
.pillar:hover .media img{transform:scale(1.05)}
.pillar .media::after{content:""; position:absolute; inset:0; background:linear-gradient(200deg, rgba(31,2,52,0) 30%, rgba(31,2,52,.72))}
.pillar .media svg{position:absolute; left:14px; right:14px; bottom:12px; width:calc(100% - 28px); height:42%; z-index:1}
.pillar .media .ln{stroke:#CFC4F5} .pillar .media .ln-soft{stroke:rgba(207,196,245,.35)}
section.slim{padding-block:clamp(28px,4vw,48px)}
.next button{grid-template-columns:1fr auto; align-items:center; padding:22px 26px}
.next .arrow{font:300 28px/1 var(--display); color:var(--clay); transition:transform .4s}
.next button:hover .arrow{transform:translateX(4px)}
.trait{grid-template-columns:1fr}
.blist li{grid-template-columns:1fr} .blist li::before{content:none}
.stat .n{margin-bottom:14px}
footer .credit{font-size:11.5px; opacity:.7}
.expect{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(20px,3vw,36px)}
.expect div{border-top:1px solid var(--ink); padding-top:20px; display:grid; gap:8px; align-content:start}
.expect b{font:400 22px/1.25 var(--display); color:var(--ink)}
.expect p{font-size:15px}
@media (max-width:900px){ .expect{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .expect{grid-template-columns:1fr} }
.net text{font-size:9px}


.tiles-h{font-size:clamp(24px,2.75vw,35px); line-height:1.15; max-width:none; text-wrap:wrap; margin-bottom:clamp(24px,3vw,36px)}
.tiles-h em{font-style:italic; color:var(--sky-ink)}
.tiles{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:clamp(12px,1.6vw,20px)}
.tile{display:grid; background:var(--surface); border:1px solid var(--rule); transition:border-color .4s}
.tile .media{position:relative; display:block; aspect-ratio:4/3; overflow:hidden; background:var(--tile-bg,var(--night))}
.tile:nth-child(1){--tile-bg:#1F0234}.tile:nth-child(2){--tile-bg:#4D389B}.tile:nth-child(3){--tile-bg:#035147}.tile:nth-child(4){--tile-bg:#0D2827}
.tile .media img{width:100%; height:100%; object-fit:cover; display:block; transition:transform 6s ease}
.tile:hover .media img{transform:scale(1.05)}

.tile .media svg{position:absolute; left:18px; right:18px; top:50%; transform:translateY(-50%); width:calc(100% - 36px); height:58%; z-index:1}
.tile .media .ln{stroke:#CFC4F5} .tile .media .ln-soft{stroke:rgba(207,196,245,.35)}
.tile .t{display:flex; justify-content:space-between; align-items:center; gap:12px; padding:20px 22px; font:400 23px/1.2 var(--display); color:var(--ink)}
@media (max-width:980px){ .tiles{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .tiles{grid-template-columns:1fr} }
.contact-band{display:grid; gap:8px}
.contact-band h2 em{font-style:italic; color:var(--sky)}
.cs{display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,2.2fr); gap:clamp(24px,4vw,56px); padding-block:clamp(36px,5vw,56px); border-top:1px solid var(--ink)}
.cs:first-child{padding-top:0; border-top:0}
.cs-k{font:500 12px/1.2 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--clay); margin-bottom:12px}
.cs h2{font-size:clamp(28px,3vw,38px)}
.cs-body{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:clamp(18px,2.4vw,32px)}
.cs-body h3{font:500 12px/1.2 var(--mono); letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:10px}
.cs-body p, .cs-body li{font-size:15.5px}
.cs-body ul{margin:0; padding-left:18px; display:grid; gap:8px}
@media (max-width:900px){ .cs{grid-template-columns:1fr} .cs-body{grid-template-columns:1fr} }

.news-list{display:grid}
.post{display:grid; grid-template-columns:200px minmax(0,1fr); gap:6px 32px; padding-block:26px; border-top:1px solid var(--rule)}
.post:first-child{border-top:1px solid var(--ink)}
.post .date{font:500 12px/1.6 var(--mono); letter-spacing:.08em; text-transform:uppercase; color:var(--muted); grid-row:span 2}
.post h3{font-size:26px} .post h3 a{text-decoration:none} .post h3 a:hover{text-decoration:underline; text-underline-offset:4px}
.post p{font-size:15.5px}
@media (max-width:700px){ .post{grid-template-columns:1fr} .post .date{grid-row:auto} }
.mailto{color:var(--on-night); text-underline-offset:3px}

.chirp{offset-path:path("M12.0 60.0 L12.8 59.3 L13.5 58.6 L14.3 57.8 L15.0 57.1 L15.8 56.3 L16.5 55.6 L17.3 54.8 L18.0 54.0 L18.8 53.2 L19.5 52.4 L20.3 51.6 L21.0 50.7 L21.8 49.9 L22.6 49.1 L23.3 48.3 L24.1 47.5 L24.8 46.7 L25.6 45.9 L26.3 45.1 L27.1 44.3 L27.8 43.5 L28.6 42.8 L29.3 42.1 L30.1 41.4 L30.8 40.7 L31.6 40.1 L32.4 39.5 L33.1 38.9 L33.9 38.4 L34.6 37.9 L35.4 37.5 L36.1 37.1 L36.9 36.7 L37.6 36.5 L38.4 36.3 L39.1 36.1 L39.9 36.0 L40.6 36.0 L41.4 36.1 L42.2 36.2 L42.9 36.4 L43.7 36.7 L44.4 37.0 L45.2 37.5 L45.9 38.0 L46.7 38.6 L47.4 39.3 L48.2 40.1 L48.9 40.9 L49.7 41.9 L50.4 42.9 L51.2 44.0 L52.0 45.2 L52.7 46.5 L53.5 47.8 L54.2 49.2 L55.0 50.6 L55.7 52.1 L56.5 53.7 L57.2 55.3 L58.0 56.9 L58.7 58.6 L59.5 60.3 L60.2 62.0 L61.0 63.8 L61.8 65.5 L62.5 67.2 L63.3 68.8 L64.0 70.5 L64.8 72.1 L65.5 73.6 L66.3 75.1 L67.0 76.5 L67.8 77.8 L68.5 79.0 L69.3 80.1 L70.0 81.1 L70.8 82.0 L71.6 82.7 L72.3 83.2 L73.1 83.7 L73.8 83.9 L74.6 84.0 L75.3 83.9 L76.1 83.7 L76.8 83.2 L77.6 82.6 L78.3 81.8 L79.1 80.8 L79.8 79.7 L80.6 78.4 L81.4 76.9 L82.1 75.3 L82.9 73.6 L83.6 71.7 L84.4 69.7 L85.1 67.6 L85.9 65.4 L86.6 63.2 L87.4 60.9 L88.1 58.6 L88.9 56.3 L89.6 54.0 L90.4 51.7 L91.2 49.5 L91.9 47.4 L92.7 45.5 L93.4 43.6 L94.2 41.9 L94.9 40.4 L95.7 39.1 L96.4 38.0 L97.2 37.1 L97.9 36.5 L98.7 36.1 L99.4 36.0 L100.2 36.2 L101.0 36.6 L101.7 37.3 L102.5 38.3 L103.2 39.6 L104.0 41.1 L104.7 42.9 L105.5 44.8 L106.2 47.0 L107.0 49.4 L107.7 51.9 L108.5 54.5 L109.2 57.2 L110.0 60.0 L110.8 62.8 L111.5 65.5 L112.3 68.3 L113.0 70.9 L113.8 73.3 L114.5 75.6 L115.3 77.7 L116.0 79.5 L116.8 81.1 L117.5 82.3 L118.3 83.2 L119.0 83.8 L119.8 84.0 L120.6 83.8 L121.3 83.3 L122.1 82.4 L122.8 81.1 L123.6 79.5 L124.3 77.5 L125.1 75.2 L125.8 72.7 L126.6 70.0 L127.3 67.0 L128.1 63.9 L128.8 60.8 L129.6 57.6 L130.4 54.4 L131.1 51.4 L131.9 48.4 L132.6 45.7 L133.4 43.2 L134.1 41.0 L134.9 39.2 L135.6 37.7 L136.4 36.7 L137.1 36.1 L137.9 36.0 L138.6 36.4 L139.4 37.2 L140.2 38.5 L140.9 40.3 L141.7 42.4 L142.4 45.0 L143.2 47.8 L143.9 51.0 L144.7 54.3 L145.4 57.8 L146.2 61.3 L146.9 64.9 L147.7 68.3 L148.4 71.6 L149.2 74.6 L150.0 77.3 L150.7 79.6 L151.5 81.5 L152.2 82.9 L153.0 83.7 L153.7 84.0 L154.5 83.7 L155.2 82.9 L156.0 81.4 L156.7 79.5 L157.5 77.0 L158.2 74.1 L159.0 70.9 L159.8 67.4 L160.5 63.6 L161.3 59.8 L162.0 55.9 L162.8 52.1 L163.5 48.5 L164.3 45.3 L165.0 42.4 L165.8 39.9 L166.5 38.0 L167.3 36.7 L168.0 36.1 L168.8 36.1 L169.6 36.8 L170.3 38.1 L171.1 40.1 L171.8 42.7 L172.6 45.8 L173.3 49.3 L174.1 53.2 L174.8 57.2 L175.6 61.4 L176.3 65.5 L177.1 69.5 L177.8 73.2 L178.6 76.5 L179.4 79.3 L180.1 81.6 L180.9 83.1 L181.6 83.9 L182.4 83.9 L183.1 83.2 L183.9 81.7 L184.6 79.4 L185.4 76.6 L186.1 73.1 L186.9 69.2 L187.6 65.0 L188.4 60.6 L189.2 56.2 L189.9 51.8 L190.7 47.8 L191.4 44.1 L192.2 41.0 L192.9 38.6 L193.7 36.9 L194.4 36.1 L195.2 36.1 L195.9 37.0 L196.7 38.8 L197.4 41.3 L198.2 44.6 L199.0 48.4 L199.7 52.7 L200.5 57.3 L201.2 62.0 L202.0 66.7 L202.7 71.1 L203.5 75.1 L204.2 78.5 L205.0 81.1 L205.7 83.0 L206.5 83.9 L207.2 83.9 L208.0 82.8"); animation:chirp 8s linear infinite}
@keyframes chirp{0%{offset-distance:0%; opacity:0}5%{opacity:1}93%{opacity:1}100%{offset-distance:100%; opacity:0}}
.runner{opacity:0; animation:run 7.2s cubic-bezier(.45,0,.4,1) infinite}
.runner.r2{animation-delay:1.8s}.runner.r3{animation-delay:3.6s}.runner.r4{animation-delay:5.4s}
@keyframes run{0%{offset-distance:0%; opacity:0}6%{opacity:1}88%{opacity:1}100%{offset-distance:100%; opacity:0}}
.tile .media .leaf{fill:var(--tile-bg)}
.paused *, .paused *::before, .paused *::after{animation-play-state:paused!important}
@media (prefers-reduced-motion: reduce){ *,*::before,*::after{animation:none!important; transition:none!important} }