/* BEYOND THE FLOW / V8 — INTERACTIVE ATLAS */
:root{--v8-ink:#eaf5ea;--v8-lime:#caff7b;--v8-stroke:rgba(198,255,203,.22)}
.experience-v2{background:radial-gradient(ellipse at 52% 33%,rgba(22,70,54,.36),transparent 56%),linear-gradient(180deg,#051011 0%,#091515 50%,#060e0f 100%)}
.experience-frame{border-color:rgba(192,255,200,.27);box-shadow:0 40px 120px rgba(3,10,8,.58),inset 0 0 80px rgba(56,172,114,.08)}
.experience-frame:focus-within{border-color:rgba(199,255,98,.55)}
.experience-topline{z-index:8}
.experience-grid-overlay{z-index:2}
.v8-view-wipe{position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;background:linear-gradient(111deg,transparent 22%,rgba(199,255,98,.075) 47%,rgba(113,240,224,.12) 51%,transparent 79%);transform:translateX(-110%);transition:transform .57s cubic-bezier(.16,.83,.12,1),opacity .5s;mix-blend-mode:screen}
.v8-view-wipe.is-switching{opacity:1;transform:translateX(115%)}
.v8-inspection{position:absolute;top:96px;left:36px;z-index:7;width:min(300px,35%);padding:20px 21px;background:linear-gradient(140deg,rgba(7,24,23,.88),rgba(5,15,16,.65));border:1px solid rgba(212,255,213,.19);box-shadow:0 24px 55px rgba(0,0,0,.18);backdrop-filter:blur(14px);pointer-events:auto;transition:border-color .35s,box-shadow .35s}
.v8-inspection:before{content:"";position:absolute;left:0;top:0;width:2px;height:100%;background:linear-gradient(180deg,#caff7b,rgba(202,255,123,0))}
.v8-inspection-kicker{display:flex;align-items:center;gap:8px;color:#9ebcaa;font-size:9px;letter-spacing:.11em;font-weight:800}
.v8-inspection-kicker i{display:block;width:7px;height:7px;border-radius:50%;background:#c7ff62;box-shadow:0 0 15px rgba(199,255,98,.5)}
.v8-inspection-counter{display:block;color:#caff7b;font-family:monospace;font-size:10px;font-weight:800;letter-spacing:.15em;margin-top:23px}
.v8-inspection h4{font-size:clamp(20px,2.2vw,30px);line-height:1.07;letter-spacing:-.05em;margin:10px 0 13px;font-weight:850;max-width:260px;color:var(--v8-ink)}
.v8-inspection p{font-size:12px;color:#b8c9bf;line-height:1.63;max-width:250px;margin:0}
.v8-inspection-footer{border-top:1px solid rgba(218,255,218,.16);margin-top:19px;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:8px}
.v8-inspection-footer span{font-size:9px;letter-spacing:.1em;color:#9db9a4;font-weight:700}
.v8-inspection-footer button{white-space:nowrap;background:transparent;border:0;padding:6px 0;color:#ddffa9;text-decoration:underline;text-decoration-color:rgba(210,255,149,.42);text-underline-offset:4px;font-size:10px;font-weight:800;cursor:pointer}
.v8-inspection-rail{position:absolute;right:27px;top:29%;z-index:7;display:flex;flex-direction:column;align-items:stretch;gap:8px;pointer-events:auto;min-width:142px}
.v8-inspection-rail>span{font-size:9px;letter-spacing:.13em;font-weight:800;color:#9db2a6;align-self:flex-end;margin:0 2px 7px}
.v8-focus-btn{cursor:pointer;display:flex;align-items:center;gap:12px;text-align:left;padding:12px 12px;max-width:168px;border:1px solid rgba(191,255,194,.16);background:rgba(3,18,16,.66);color:#d6e6d7;backdrop-filter:blur(7px);transition:background .24s,border-color .24s,transform .24s}
.v8-focus-btn b{font-family:monospace;font-size:13px;letter-spacing:.05em;color:#caff7b;font-weight:900}
.v8-focus-btn small{font-size:11px;line-height:1.25;letter-spacing:.02em;font-weight:750}
.v8-focus-btn:hover,.v8-focus-btn:focus-visible{transform:translateX(-4px);border-color:rgba(202,255,123,.7)}
.v8-focus-btn[aria-pressed="true"]{color:#102014;background:#caff7b;border-color:#caff7b;box-shadow:0 0 32px rgba(202,255,123,.14)}
.v8-focus-btn[aria-pressed="true"] b{color:#31431c}
.experience-bottom{bottom:28px;z-index:7;left:34px;right:34px}
.experience-current{max-width:460px}
.experience-current p{max-width:420px}
.experience-frame .experience-crosshair{top:48%;opacity:.32}
/* project dialogs: structured reasoning, not unverified metrics */
.project-dialog{width:min(720px,calc(100vw - 36px));background:radial-gradient(ellipse at 90% 0%,rgba(85,169,117,.15),transparent 53%),#0e1b18}
.v8-case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:22px}
.v8-case-grid>div{border:1px solid rgba(203,255,204,.16);padding:17px 14px;min-height:145px;background:rgba(255,255,255,.025)}
.v8-case-grid span{display:block;font-size:9px;letter-spacing:.15em;font-weight:800;color:#caff7b;margin-bottom:12px}
.v8-case-grid p{font-size:12px;line-height:1.6;color:#d1e4d5;margin:0}
/* more intentional transition from overview into real work */
.projects{position:relative;isolation:isolate}
.projects:before{content:"";position:absolute;inset:0 0 auto;height:280px;pointer-events:none;z-index:-1;background:radial-gradient(ellipse 65% 60% at 50% 0%,rgba(118,232,164,.055),transparent 80%)}
.project-card{border-color:rgba(172,230,183,.2)}
.project-card:focus-within{border-color:rgba(202,255,123,.65)}
@media(min-width:1200px){.experience-heading p{max-width:380px}.experience-v2{padding-top:122px}}
@media(max-width:900px){.v8-inspection{top:84px;left:25px;width:270px;padding:17px}.v8-inspection-rail{right:17px;top:34%;min-width:118px}.v8-focus-btn{padding:10px;gap:9px}.v8-focus-btn small{font-size:10px}}
@media(max-width:650px){
 .experience-frame{height:590px}
 .experience-topline{left:16px;right:16px;top:17px}
 .v8-inspection{top:57px;left:15px;width:min(238px,calc(100% - 105px));padding:13px 14px}
 .v8-inspection-counter{margin-top:12px;font-size:9px}
 .v8-inspection h4{font-size:19px;margin:7px 0 7px}
 .v8-inspection p{font-size:10.5px;line-height:1.43}
 .v8-inspection-footer{margin-top:10px;padding-top:8px;align-items:flex-start;flex-direction:column;gap:4px}
 .v8-inspection-footer span{font-size:8px}
 .v8-inspection-footer button{font-size:9px}
 .v8-inspection-kicker{font-size:7px;letter-spacing:.06em}
 .v8-inspection-rail{right:12px;top:150px;min-width:0;gap:6px}
 .v8-inspection-rail>span{font-size:7px;max-width:70px;text-align:right;margin-bottom:2px}
 .v8-focus-btn{max-width:80px;display:flex;flex-direction:column;align-items:center;padding:10px 7px;gap:5px}
 .v8-focus-btn b{font-size:12px}
 .v8-focus-btn small{font-size:9px;text-align:center}
 .experience-bottom{bottom:20px;left:16px;right:16px;align-items:flex-end}
 .experience-current{max-width:260px}
 .experience-current p{max-width:245px}
 .experience-current h3{font-size:22px}
 .experience-arrows button{width:37px;height:37px}
 .v8-case-grid{grid-template-columns:1fr;gap:7px}
 .v8-case-grid>div{min-height:0;padding:13px 14px}
 .v8-case-grid span{margin-bottom:5px}
 .v8-case-grid p{font-size:12px}
}
@media(max-width:390px){.v8-inspection{left:10px;width:210px;padding:11px}.v8-inspection-rail{right:9px;top:152px}.v8-focus-btn{max-width:77px}.v8-inspection h4{font-size:18px}.v8-inspection p{font-size:10px}}
@media(prefers-reduced-motion:reduce){.v8-view-wipe{display:none}.v8-focus-btn{transition:none!important}.v8-inspection{transition:none!important}}