:root{
  --bg:#020202;
  --bg-soft:#080808;
  --ink:#f2f0ea;
  --muted:#cbc7bf;
  --muted-strong:#dfddd7;
  --soft:#98948d;
  --line:rgba(255,255,255,.08);
  --line-strong:rgba(255,255,255,.16);
  --wash:rgba(255,255,255,.042);
  --wash-strong:rgba(255,255,255,.082);
  --glow:rgba(255,255,255,.12);
  --glow-strong:rgba(255,255,255,.22);
  --shadow:rgba(0,0,0,.45);
  --max:1240px;
  --scroll:0;
  --breath:0;
  --light:0;
  --hover-light-x:50%;
  --hover-light-y:38%;
  --hover-light-alpha:0;
  --header-h:76px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 24px)}
body{
  margin:0;
  min-height:100vh;
  color:var(--ink);
  background:
    radial-gradient(72vw 48vw at 60% calc(8% + var(--scroll) * -8%), rgba(255,255,255,.06), transparent 62%),
    radial-gradient(46vw 28vw at 14% calc(22% + var(--scroll) * 6%), rgba(255,255,255,.034), transparent 68%),
    radial-gradient(32vw 24vw at 84% 10%, rgba(255,255,255,.028), transparent 70%),
    linear-gradient(180deg, #000000 0%, #050505 48%, #020202 100%);
  font-family:"Sora",system-ui,sans-serif;
  overflow-x:hidden;
  padding-top:var(--header-h);
}
body::before, body::after{
  content:"";
  position:fixed;
  inset:-12vh -12vw;
  pointer-events:none;
  z-index:-4;
}
body::before{
  background:
    radial-gradient(30vw 22vw at var(--hover-light-x) var(--hover-light-y), rgba(255,255,255,calc(var(--hover-light-alpha) * .18)), transparent 72%),
    radial-gradient(26vw 26vw at 72% 18%, rgba(255,255,255,calc(.08 + var(--light) * .05)), transparent 68%),
    radial-gradient(24vw 24vw at 24% 70%, rgba(255,255,255,calc(.05 + var(--light) * .03)), transparent 72%),
    radial-gradient(18vw 18vw at 50% 8%, rgba(255,255,255,calc(.03 + var(--light) * .025)), transparent 74%);
  filter:blur(44px);
  transform:translateY(calc(var(--scroll) * -36px));
  transition:background .28s ease;
}
body::after{
  background:
    linear-gradient(transparent 0 97%, rgba(255,255,255,.024) 97% 100%),
    linear-gradient(90deg, transparent 0 97%, rgba(255,255,255,.015) 97% 100%);
  background-size:100% 88px,88px 100%;
  opacity:.18;
  mask-image:radial-gradient(circle at 50% 42%, #000 58%, transparent 100%);
}
body.lights-off main,
body.lights-off .site-header,
body.lights-off footer{
  opacity:0;
  filter:blur(12px);
  transform:translateY(24px);
  pointer-events:none;
}
body.lights-awakening main,
body.lights-awakening .site-header,
body.lights-awakening footer,
body.lights-on main,
body.lights-on .site-header,
body.lights-on footer{
  transition:opacity 1.05s ease, transform 1.05s ease, filter 1.05s ease;
}
section[id]{scroll-margin-top:calc(var(--header-h) + 24px)}
a{color:inherit;text-decoration:none}
img,video,iframe{max-width:100%;display:block}
button{font:inherit}
#ink-canvas{
  position:fixed;
  inset:0;
  width:100%;height:100%;
  z-index:-2;
  pointer-events:none;
  opacity:.78;
}
#dust-canvas{
  position:fixed;
  inset:0;
  width:100%;height:100%;
  z-index:-1;
  pointer-events:none;
  opacity:calc(.28 + var(--light) * .26);
  mix-blend-mode:screen;
  filter:blur(.08px);
}

body.is-firefox #dust-canvas,
body.low-power #dust-canvas{
  mix-blend-mode:normal;
  opacity:calc(.22 + var(--light) * .22);
  filter:none;
}

.ink-stage{
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  overflow:hidden;
}
.ink-stage .sweep,
.ink-stage .stroke{
  position:absolute;
  display:block;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.16) 14%, rgba(255,255,255,.045) 58%, transparent 100%);
  opacity:calc(.28 + var(--light) * .24);
  filter:blur(.2px) drop-shadow(0 0 22px rgba(255,255,255,.05));
  transform-origin:center;
}

body.low-power .ink-stage .sweep,
body.low-power .ink-stage .stroke,
body.is-firefox .ink-stage .sweep,
body.is-firefox .ink-stage .stroke{
  filter:none;
}
body.low-power .project-media-link img,
body.is-firefox .project-media-link img{
  transition-duration:.78s;
}
body.low-power .project-media-link::before,
body.low-power .project-paint-pass,
body.is-firefox .project-media-link::before,
body.is-firefox .project-paint-pass{
  mix-blend-mode:normal;
}
.ink-stage .s1{
  width:112vw;height:34vh;left:-16vw;top:10vh;
  mask:url("brush-sweep-1.svg") center / 100% 100% no-repeat;
  -webkit-mask:url("brush-sweep-1.svg") center / 100% 100% no-repeat;
  transform:translateY(calc(var(--scroll) * 56px + var(--breath) * 6px)) rotate(-6deg);
}
.ink-stage .s2{
  width:100vw;height:30vh;right:-10vw;top:42vh;
  mask:url("brush-sweep-2.svg") center / 100% 100% no-repeat;
  -webkit-mask:url("brush-sweep-2.svg") center / 100% 100% no-repeat;
  transform:translateY(calc(var(--scroll) * -34px - var(--breath) * 8px)) rotate(4deg);
  opacity:calc(.22 + var(--light) * .2);
}
.ink-stage .s3{
  width:118vw;height:36vh;left:-8vw;bottom:-2vh;
  mask:url("brush-sweep-1.svg") center / 100% 100% no-repeat;
  -webkit-mask:url("brush-sweep-1.svg") center / 100% 100% no-repeat;
  transform:translateY(calc(var(--scroll) * -72px + var(--breath) * 10px)) rotate(-3deg);
  opacity:calc(.18 + var(--light) * .18);
}.ink-stage .stroke{
  width:128vw;height:140px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.12) 18%, rgba(255,255,255,.03) 72%, transparent);
  filter:blur(6px);
}
.ink-stage .stroke.one{top:17vh;left:-18vw;transform:translateY(calc(var(--scroll) * 18px)) rotate(-5deg)}
.ink-stage .stroke.two{top:58vh;right:-24vw;transform:translateY(calc(var(--scroll) * -18px)) rotate(7deg);opacity:calc(.15 + var(--light) * .15)}
.ink-stage .stroke.three{bottom:8vh;left:-10vw;transform:translateY(calc(var(--scroll) * 22px)) rotate(-4deg);opacity:calc(.12 + var(--light) * .15)}
.site-header{
  position:fixed;top:0;left:0;right:0;width:100%;z-index:30;
  backdrop-filter:blur(18px);
  background:linear-gradient(180deg, rgba(1,1,1,.92), rgba(1,1,1,.62));
  border-bottom:1px solid rgba(255,255,255,.06);
}
.site-header .inner{
  width:min(var(--max), calc(100vw - 40px));
  margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;gap:22px;
  padding:16px 0;
}
.brand{
  display:flex;align-items:center;gap:12px;
  font-family:"IBM Plex Mono",monospace;
  text-transform:uppercase;letter-spacing:.22em;font-size:.78rem;white-space:nowrap;
}
.brand img{width:44px;height:auto;opacity:.98;filter:brightness(0) saturate(0) invert(1) drop-shadow(0 0 16px rgba(255,255,255,.12)) drop-shadow(0 0 34px rgba(255,255,255,.08))}
.nav-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px 24px}
.nav-links a{
  position:relative;
  font-family:"IBM Plex Mono",monospace;font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;
  color:var(--muted);padding:6px 0;
}.nav-links a::before{
  content:"";position:absolute;left:-14px;right:-14px;bottom:-6px;height:18px;
  background:linear-gradient(90deg, transparent 0%, rgba(255,255,255,.16) 14%, rgba(255,255,255,.06) 58%, transparent 100%);
  opacity:0;transform:translateY(4px) scaleX(.84);
  transition:opacity .28s ease, transform .28s ease;
}
.nav-links a:hover,.nav-links a.is-active{color:#fff}
.nav-links a:hover::before,.nav-links a.is-active::before{opacity:.8;transform:translateY(0) scaleX(1)}
.container{width:min(var(--max), calc(100vw - 40px));margin:0 auto}
.hero{
  position:relative;min-height:calc(100svh - var(--header-h));display:grid;align-items:center;
  padding:56px 0 60px;
}.hero::before{
  content:"";position:absolute;inset:4vh -4vw auto -4vw;height:68vh;
  background:linear-gradient(90deg, rgba(255,255,255,.04), rgba(255,255,255,.015) 48%, transparent 100%);
  opacity:.5;z-index:-1;transform:translateY(calc(var(--scroll) * 20px));
}
.hero-grid{display:grid;grid-template-columns:minmax(300px, .9fr) minmax(420px, 1.2fr);gap:min(4vw,48px);align-items:center}
.hero-media{position:relative;padding:28px 18px 18px 12px}.hero-media::before{
  content:"";position:absolute;inset:4% -6% 8% -3%;
  background:linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,.035) 64%, transparent 100%);
  opacity:.46;filter:blur(.3px);
}.hero-media::after{
  content:"";position:absolute;left:-4%;right:8%;bottom:24%;height:104px;
  background:linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.05) 72%, transparent 100%);
  opacity:.58;filter:blur(4px);
}
.hero-portrait{
  position:relative;z-index:1;
  display:block;width:100%;height:auto;
  aspect-ratio:1 / 1;
  border-radius:24px;
  box-shadow:0 22px 54px rgba(0,0,0,.48);
  border:1px solid rgba(255,255,255,.08);
  object-fit:cover;
}
.hero-copy{position:relative}
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:"IBM Plex Mono",monospace;font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;
  color:var(--soft);margin-bottom:18px;
}.eyebrow::before{
  content:"";width:62px;height:14px;
  background:linear-gradient(90deg, rgba(255,255,255,.36), rgba(255,255,255,0));
}
.hero h1{margin:0 0 16px;line-height:.94;font-size:clamp(3rem, 8vw, 6.35rem);letter-spacing:-.055em;max-width:10ch;text-wrap:balance}
.hero h1 .line-1{font-weight:300;display:block}
.hero h1 .line-2{font-weight:800;display:block;text-shadow:0 0 24px rgba(255,255,255,.08)}
.paint-ribbon{
  position:relative;display:inline-flex;align-items:center;min-height:62px;
  width:min(100%, 760px);padding:0 34px 0 24px;margin:8px 0 24px;
  font-family:"IBM Plex Mono",monospace;font-size:clamp(.78rem, 1.8vw, 1rem);text-transform:uppercase;letter-spacing:.16em;
  color:#0d0d0d;isolation:isolate;
}
.paint-ribbon span{position:relative;z-index:1;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}.paint-ribbon::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.96), rgba(224,224,224,.92) 56%, rgba(255,255,255,.85) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.06), 0 10px 26px rgba(0,0,0,.28);
}.paint-ribbon::after{
  content:"";position:absolute;inset:6px -18px;
  background:linear-gradient(90deg, rgba(255,255,255,.2), rgba(255,255,255,0));
  filter:blur(12px);z-index:-1;opacity:.9;
}
.hero-summary{max-width:62ch;color:var(--muted);font-size:clamp(1rem,1.35vw,1.15rem);line-height:1.85}
.section{position:relative;padding:94px 0}
.section + .section{padding-top:54px}
.section-heading{margin:0 0 28px;font-size:clamp(2rem,4.4vw,4rem);letter-spacing:-.04em;line-height:.95}
.section-intro{max-width:68ch;color:var(--muted);line-height:1.95;font-size:1.02rem}
.section-label{
  display:inline-flex;align-items:center;gap:12px;margin-bottom:16px;
  font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.22em;font-size:.74rem;color:var(--soft)
}.section-label::before{
  content:"";width:74px;height:14px;background:linear-gradient(90deg, rgba(255,255,255,.5), rgba(255,255,255,0));
  opacity:.72;
}
.weave-stack{display:grid;gap:24px;margin-top:44px}
.weave-band{
  position:relative;max-width:1080px;padding:38px 36px 42px;border:none;background:transparent;overflow:visible;
}.weave-band::before{
  content:"";position:absolute;inset:4px -20px 0 -20px;height:100%;
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.06) 54%, transparent 100%);
  opacity:.34;z-index:-1;
}.weave-band::after{
  content:"";position:absolute;left:34px;right:44%;bottom:12px;height:18px;
  background:linear-gradient(90deg, rgba(255,255,255,.6), rgba(255,255,255,0));
  opacity:.72;
}
.weave-band:nth-child(odd){margin-right:8%;transform:translateX(-8px)}
.weave-band:nth-child(even){margin-left:10%;transform:translateX(12px)}.weave-band:nth-child(even)::before{
  background:linear-gradient(270deg, rgba(255,255,255,.18), rgba(255,255,255,.06) 54%, transparent 100%);
}
.weave-band:nth-child(even)::after{left:44%;right:34px;background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.6))}
.band-kicker{font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.18em;font-size:.72rem;color:var(--soft);margin-bottom:12px}
.weave-band h3{margin:0 0 10px;font-size:clamp(1.45rem,2vw,2.15rem);letter-spacing:-.03em;max-width:16ch}
.weave-band p{margin:0;max-width:64ch;color:var(--muted);line-height:1.92}
.about-layout{display:grid;grid-template-columns:minmax(320px,.85fr) minmax(400px,1.15fr);gap:min(4vw,56px);align-items:center}
.about-photo{position:relative;padding:16px 0 16px 12px}.about-photo::before{
  content:"";position:absolute;inset:6% 8% 6% -2%;
  background:linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,.04) 62%, transparent 100%);
  opacity:.38;
}
.about-photo img{position:relative;z-index:1;display:block;width:100%;height:auto;aspect-ratio:775 / 1879;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 40px rgba(0,0,0,.38)}
.about-copy p{color:var(--muted);line-height:1.95;margin:0 0 18px}
.about-copy .paint-ribbon{margin-top:4px;margin-bottom:22px;max-width:720px}
.project-stream{display:grid;gap:48px;margin-top:44px}
.project-row{
  position:relative;display:grid;grid-template-columns:minmax(260px,.9fr) minmax(420px,1.1fr);gap:min(3.2vw,46px);align-items:center;padding:16px 0 34px;
}.project-row::before{
  content:"";position:absolute;inset:0 -4vw 0 -4vw;
  background:linear-gradient(90deg, rgba(255,255,255,.11), rgba(255,255,255,.03) 48%, transparent 100%);
  opacity:.18;z-index:-1;
}
.project-row:nth-child(even){grid-template-columns:minmax(420px,1.1fr) minmax(260px,.9fr)}.project-row:nth-child(even)::before{
  background:linear-gradient(270deg, rgba(255,255,255,.11), rgba(255,255,255,.03) 48%, transparent 100%);
}
.project-row:nth-child(even) .project-media{order:2}
.project-row:nth-child(even) .project-copy{order:1}.project-row::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:16px;
  background:linear-gradient(90deg, rgba(255,255,255,.42), rgba(255,255,255,0));
  opacity:.36;
}
.project-media{position:relative;min-height:280px;padding:6px 8px 18px}.project-media::before{
  content:"";position:absolute;left:-2%;right:10%;bottom:10%;height:92px;
  background:linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.05) 72%, transparent 100%);
  filter:blur(5px);opacity:.56;
}
.project-media img,.project-media iframe{position:relative;z-index:1;width:100%;min-height:280px;aspect-ratio:16/10;object-fit:cover;border-radius:22px;border:1px solid rgba(255,255,255,.08);box-shadow:0 20px 46px rgba(0,0,0,.4)}
.project-media iframe{background:#050505}
.project-copy{position:relative;padding:14px 0}.project-copy::before{
  content:"";position:absolute;left:-26px;right:-20px;top:0;bottom:6px;
  background:linear-gradient(90deg, rgba(255,255,255,.09), rgba(255,255,255,.03) 62%, transparent 100%);
  opacity:.16;z-index:-1;
}
.project-copy .section-label{margin-bottom:12px}
.project-copy h3{margin:0 0 12px;font-size:clamp(1.9rem,3vw,3rem);letter-spacing:-.045em;max-width:13ch}
.project-copy p{margin:0 0 16px;color:var(--muted);line-height:1.9;max-width:60ch}
.project-meta{display:flex;flex-wrap:wrap;gap:12px 16px;margin:16px 0 24px}
.project-meta span{
  position:relative;display:inline-flex;align-items:center;min-height:38px;padding:0 16px;
  font-family:"IBM Plex Mono",monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.16em;color:#0a0a0a;isolation:isolate;
}.project-meta span::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.96), rgba(225,225,225,.84));
  opacity:.88;z-index:-1;
}
.link-line{display:flex;flex-wrap:wrap;gap:12px}
.link-btn{
  position:relative;display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:0 22px;
  font-family:"IBM Plex Mono",monospace;font-size:.76rem;text-transform:uppercase;letter-spacing:.17em;color:#0c0c0c;isolation:isolate;
  transition:transform .22s ease, filter .22s ease;
}.link-btn::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(225,225,225,.9));
  box-shadow:0 8px 22px rgba(0,0,0,.24);z-index:-1;
}.link-btn::after{
  content:"";position:absolute;inset:6px -16px;
  background:linear-gradient(90deg, rgba(255,255,255,.28), rgba(255,255,255,0));
  filter:blur(8px);opacity:.88;z-index:-2;
}
.link-btn:hover{transform:translateY(-2px);filter:brightness(1.03)}
.study-links{display:flex;flex-wrap:wrap;gap:18px;margin-top:24px}
.study-links a{font-family:"IBM Plex Mono",monospace;font-size:.74rem;text-transform:uppercase;letter-spacing:.16em;color:var(--muted);padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.14)}
.footer{padding:90px 0 42px}.footer-line{height:16px;background:linear-gradient(90deg, rgba(255,255,255,.44), rgba(255,255,255,0));opacity:.34;margin-bottom:26px}
.footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:18px 30px;align-items:flex-start}
.footer-copy{max-width:54ch;color:var(--muted);line-height:1.9}
.footer-links{display:flex;flex-wrap:wrap;gap:12px 18px}
.footer-links a{font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.18em;font-size:.75rem;color:var(--muted)}
.case-hero{padding:58px 0 34px}
.case-head{display:grid;grid-template-columns:minmax(340px,.95fr) minmax(380px,1.05fr);gap:min(4vw,52px);align-items:end}
.case-head .hero-summary{max-width:58ch}
.case-media{position:relative;min-height:320px;padding:10px 14px 18px}.case-media::before{
  content:"";position:absolute;inset:4% -6% 8% 0;
  background:linear-gradient(90deg, rgba(255,255,255,.15), rgba(255,255,255,.04) 62%, transparent 100%);
  opacity:.34;
}.case-media::after{
  content:"";position:absolute;left:0;right:10%;bottom:10%;height:96px;
  background:linear-gradient(90deg, rgba(255,255,255,.24), rgba(255,255,255,.04) 72%, transparent 100%);
  filter:blur(5px);opacity:.48;
}
.case-media > *{position:relative;z-index:1;width:100%;aspect-ratio:16/10;object-fit:cover;min-height:320px;border-radius:22px;border:1px solid rgba(255,255,255,.09);box-shadow:0 18px 42px rgba(0,0,0,.4)}
.case-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px}
.signal-river{margin:48px 0 24px;display:grid;gap:10px}
.signal{
  position:relative;width:min(100%, 980px);padding:30px 34px 34px;background:transparent;overflow:visible;transform:translateX(-8px)
}.signal::before{
  content:"";position:absolute;inset:0 -18px 0 -18px;
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.06) 58%, transparent 100%);
  opacity:.3;z-index:-1;
}.signal::after{content:"";position:absolute;left:34px;right:44%;bottom:12px;height:16px;background:linear-gradient(90deg, rgba(255,255,255,.65), rgba(255,255,255,0));opacity:.7}
.signal:nth-child(2){margin-left:auto;transform:translateX(10px)}.signal:nth-child(2)::before{background:linear-gradient(270deg, rgba(255,255,255,.16), rgba(255,255,255,.06) 58%, transparent 100%);-webkit-mask:none center/100% 100% no-repeat}
.signal:nth-child(2)::after{left:44%;right:34px;background:linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.65))}
.signal:nth-child(3){width:min(100%, 900px);transform:translateX(-2px)}
.signal-label{display:inline-flex;align-items:center;justify-content:center;min-width:98px;min-height:36px;padding:0 16px;font-family:"IBM Plex Mono",monospace;font-size:.74rem;text-transform:uppercase;letter-spacing:.18em;color:#0b0b0b;position:relative;isolation:isolate;margin-bottom:16px}.signal-label::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(224,224,224,.9));z-index:-1}
.signal h2{margin:0 0 8px;font-size:clamp(1.7rem,2.5vw,2.8rem);letter-spacing:-.05em;max-width:18ch}
.signal p{margin:0;max-width:58ch;color:var(--muted);line-height:1.86}
.story{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(260px,.74fr);gap:min(4vw,58px);align-items:start;padding:16px 0 8px}
.story-copy p{margin:0 0 20px;color:var(--muted);line-height:1.98;font-size:1rem}
.story-side{position:sticky;top:92px}
.fact-list{display:grid;gap:18px}
.fact{padding-bottom:18px;position:relative}.fact::after{content:"";position:absolute;left:0;right:22%;bottom:0;height:14px;background:linear-gradient(90deg, rgba(255,255,255,.44), rgba(255,255,255,0));opacity:.4}
.fact .name{display:block;font-family:"IBM Plex Mono",monospace;text-transform:uppercase;letter-spacing:.16em;font-size:.72rem;color:var(--soft);margin-bottom:6px}
.fact .value{display:block;color:var(--ink);font-size:1rem;line-height:1.68}
.media-strip{margin-top:34px;display:grid;grid-template-columns:repeat(12,1fr);gap:14px}
.media-cell{grid-column:span 4;position:relative}.media-cell.wide{grid-column:span 6}
.media-card{position:relative;overflow:hidden;min-height:180px;border-radius:20px;border:1px solid rgba(255,255,255,.08);box-shadow:0 14px 34px rgba(0,0,0,.26)}
.media-card img{width:100%;height:100%;object-fit:cover}
.media-caption{margin-top:10px;color:var(--soft);font-family:"IBM Plex Mono",monospace;font-size:.72rem;text-transform:uppercase;letter-spacing:.16em}
.paint-reveal{opacity:0;transform:translateY(30px);transition:opacity .88s ease, transform .88s cubic-bezier(.2,.7,.2,1)}
.paint-reveal.is-visible{opacity:1;transform:translateY(0)}
.paint-in{position:relative}.paint-in::before{
  content:"";position:absolute;inset:8% -2%;
  background:linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 54%, transparent 100%);
  transform-origin:left center;transform:scaleX(0);transition:transform .84s cubic-bezier(.2,.8,.2,1);z-index:-1;opacity:.24;
}
.paint-in.is-visible::before{transform:scaleX(1)}
.switch-stage{
  position:fixed;inset:0;z-index:120;display:grid;place-items:center;padding:24px;
  background:
    radial-gradient(40vw 30vw at 50% 34%, rgba(255,255,255,.06), transparent 68%),
    linear-gradient(180deg, rgba(0,0,0,.94), rgba(0,0,0,.98));
  overflow:hidden;
  transition:opacity 1.2s ease, visibility 1.2s ease;
}.switch-stage::before{
  content:"";position:absolute;inset:12% -12% auto -12%;height:40vh;
  background:linear-gradient(90deg, rgba(255,255,255,.14), rgba(255,255,255,.03) 54%, transparent 100%);
  opacity:.26;
}.switch-stage::after{
  content:"";position:absolute;inset:auto -10% 8% -10%;height:26vh;
  background:linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 48%, transparent 100%);
  opacity:.2;
}
.switch-stage.is-hidden{opacity:0;visibility:hidden}
.switch-shell{position:relative;z-index:1;width:min(760px, 100%);display:grid;justify-items:center;text-align:center;gap:26px}
.switch-mark{font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.24em;text-transform:uppercase;color:var(--soft)}
.switch-title{margin:0;font-size:clamp(2.4rem, 7vw, 5rem);line-height:.92;letter-spacing:-.05em;max-width:10ch;text-wrap:balance}
.switch-copy{max-width:46ch;color:var(--muted);line-height:1.9}
.switch-interact{position:relative;display:grid;place-items:center;gap:18px;padding:20px 24px 0}
.switch-glow{position:absolute;inset:-22% auto auto 50%;width:380px;height:380px;background:radial-gradient(circle at center, rgba(255,255,255,.18), rgba(255,255,255,.04) 34%, transparent 66%);transform:translateX(-50%) scale(calc(.72 + var(--light) * .22));filter:blur(12px);opacity:calc(.22 + var(--light) * .56)}
.bulb-symbol{position:relative;width:118px;height:152px;opacity:calc(.28 + var(--light) * .72);transition:opacity .5s ease, transform .5s ease;transform:translateY(calc((1 - var(--light)) * 6px))}
.bulb-symbol svg{width:100%;height:100%}
.light-switch{
  position:relative;display:inline-flex;align-items:center;justify-content:flex-start;
  width:128px;height:72px;padding:10px;background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);border-radius:999px;color:var(--ink);
  box-shadow:0 10px 28px rgba(0,0,0,.3), inset 0 0 0 1px rgba(255,255,255,.02);
}
.light-switch .switch-track{position:absolute;inset:8px;border-radius:999px;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02))}
.light-switch .switch-knob{position:relative;z-index:1;width:48px;height:48px;border-radius:50%;background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(216,216,216,.82));box-shadow:0 10px 20px rgba(0,0,0,.24);transform:translateX(0);transition:transform .5s cubic-bezier(.25,.9,.2,1)}
body.lights-awakening .light-switch .switch-knob,
body.lights-on .light-switch .switch-knob{transform:translateX(52px)}
.switch-hint{font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--soft)}
body.lights-awakening .switch-stage,
body.lights-awakening::before,
body.lights-awakening .ink-stage{animation:flicker 1.5s linear 1}
@keyframes flicker{0%,8%,15%,22%,40%,48%,70%,100%{opacity:1} 4%,11%,18%,31%,45%,62%,85%{opacity:.55}}
@media (max-width: 1024px){
  .hero-grid,.case-head,.about-layout,.story,.project-row,.project-row:nth-child(even){grid-template-columns:1fr}
  .project-row:nth-child(even) .project-media,.project-row:nth-child(even) .project-copy{order:initial}
  .story-side{position:relative;top:auto}
  .hero{min-height:auto}
  .signal:nth-child(2),.signal:nth-child(3),.weave-band:nth-child(odd),.weave-band:nth-child(even){margin-left:0;margin-right:0;width:100%;transform:none}
}
@media (max-width: 760px){
  .site-header .inner{flex-direction:column;align-items:flex-start;gap:14px}
  .nav-links{justify-content:flex-start;gap:10px 18px}
  .hero{padding-top:32px}
  .hero-media{padding:14px}
  .hero h1{font-size:clamp(2.5rem,15vw,4.2rem)}
  .paint-ribbon{padding:0 18px 0 16px;min-height:54px;width:100%}
  .paint-ribbon span{white-space:normal;line-height:1.35;padding:8px 0}
  .section{padding:74px 0}
  .section-heading{font-size:clamp(2rem,10vw,3.4rem)}
  .project-meta{gap:10px}
  .media-strip{grid-template-columns:1fr}
  .media-cell,.media-cell.wide{grid-column:span 1}
  .footer-grid{flex-direction:column}
  .switch-shell{gap:20px}
  .light-switch{width:116px;height:66px}
  .light-switch .switch-knob{width:42px;height:42px}
  body.lights-awakening .light-switch .switch-knob,
  body.lights-on .light-switch .switch-knob{transform:translateX(42px)}
}


/* ===== V6 switch / bulb / living ink overrides ===== */
:root{
  --lamp-x:50%;
  --lamp-y:14%;
  --bulb-x:50vw;
  --bulb-y:122px;
  --bulb-rot:0deg;
  --bulb-drop:-220px;
}

body{
  background:
    radial-gradient(64vw 42vw at var(--lamp-x) var(--lamp-y), rgba(255,255,255,calc(.02 + var(--light) * .12)), transparent 62%),
    radial-gradient(42vw 28vw at 16% calc(24% + var(--scroll) * 4%), rgba(255,255,255,.03), transparent 70%),
    linear-gradient(180deg, #000 0%, #030303 46%, #020202 100%);
}
body::before{
  background:
    radial-gradient(22vw 22vw at var(--lamp-x) var(--lamp-y), rgba(255,255,255,calc(.06 + var(--light) * .18)), transparent 70%),
    radial-gradient(26vw 22vw at 80% 22%, rgba(255,255,255,calc(.02 + var(--light) * .04)), transparent 72%),
    radial-gradient(22vw 18vw at 18% 74%, rgba(255,255,255,calc(.02 + var(--light) * .03)), transparent 70%);
  filter:blur(54px);
  transform:translateY(calc(var(--scroll) * -30px));
}
body.lights-off{
  background:linear-gradient(180deg, #010101 0%, #010101 100%);
}
body.lights-off::before,
body.lights-off::after,
body.lights-off .ink-stage,
body.lights-off #ink-canvas{
  opacity:.14;
}

.switch-stage{
  position:fixed;
  inset:0;
  z-index:120;
  display:grid;
  place-items:center;
  background:
    radial-gradient(42vw 32vw at 50% 18%, rgba(255,255,255,.03), transparent 72%),
    linear-gradient(180deg, #010101 0%, #040404 58%, #020202 100%);
  transition:opacity .8s ease, visibility .8s ease;
}
.switch-stage::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(transparent 0 96%, rgba(255,255,255,.02) 96% 100%),
    linear-gradient(90deg, transparent 0 96%, rgba(255,255,255,.012) 96% 100%);
  background-size:100% 96px, 96px 100%;
  opacity:.24;
}
.switch-stage.is-hidden{opacity:0;visibility:hidden;pointer-events:none}
.switch-shell{position:relative;z-index:1;display:grid;justify-items:center;gap:20px}
.switch-prompt{
  font-family:"IBM Plex Mono",monospace;
  font-size:.82rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--muted-strong);
}
.wall-switch{
  appearance:none;
  border:none;
  background:transparent;
  padding:0;
  cursor:pointer;
  display:grid;
  justify-items:center;
  gap:12px;
}
.wall-switch:focus-visible{outline:2px solid rgba(255,255,255,.7);outline-offset:8px;border-radius:20px}
.switch-plate{
  position:relative;
  width:190px;
  padding:18px 20px 16px;
  border-radius:24px;
  background:linear-gradient(180deg, #e8e8e8 0%, #bdbdbd 52%, #d8d8d8 100%);
  box-shadow:
    0 26px 70px rgba(0,0,0,.62),
    inset 0 1px 0 rgba(255,255,255,.92),
    inset 0 -10px 18px rgba(0,0,0,.16);
  border:1px solid rgba(255,255,255,.34);
  display:grid;
  justify-items:center;
  gap:12px;
}
.switch-plate::after{
  content:"";
  position:absolute;
  inset:12px;
  border-radius:18px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);
}
.switch-states{
  width:100%;
  display:flex;
  justify-content:space-between;
  font-family:"IBM Plex Mono",monospace;
  font-size:.8rem;
  letter-spacing:.2em;
  text-transform:uppercase;
  color:#111;
}
.switch-rocker{
  position:relative;
  width:86px;
  height:118px;
  border-radius:18px;
  background:linear-gradient(180deg, #111 0%, #262626 100%);
  box-shadow:inset 0 4px 8px rgba(255,255,255,.08), inset 0 -10px 16px rgba(0,0,0,.44);
  padding:6px;
}
.switch-rocker::before{
  content:"";
  position:absolute;
  inset:6px;
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(0,0,0,.14));
}
.switch-toggle{
  position:absolute;
  left:9px;
  right:9px;
  top:10px;
  height:46px;
  border-radius:12px;
  background:linear-gradient(180deg, #fafafa 0%, #d7d7d7 100%);
  box-shadow:0 8px 14px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.92);
  transition:transform .55s cubic-bezier(.2,.9,.18,1);
}
.wall-switch.is-on .switch-toggle{ transform:translateY(52px); }
.switch-stage .switch-note{
  font-family:"IBM Plex Mono",monospace;
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--soft);
}

.living-bulb{
  position:fixed;
  left:0;
  top:0;
  width:100vw;
  height:270px;
  z-index:50;
  pointer-events:none;
  opacity:0;
  transition:opacity .45s ease;
}
body.lights-awakening .living-bulb,
body.lights-on .living-bulb{ opacity:1; }
.bulb-swing{
  position:absolute;
  left:50%;
  top:0;
  width:220px;
  height:270px;
  transform:translateX(calc(var(--bulb-x) - 50vw - 110px)) translateY(var(--bulb-drop));
  transform-origin:50% 0%;
}
.bulb-cord-svg{
  position:absolute;
  left:0;
  top:-10px;
  width:220px;
  height:190px;
  overflow:visible;
}
.bulb-cord-path{
  fill:none;
  stroke:rgba(218,218,218,.82);
  stroke-width:2.2;
  stroke-linecap:round;
  filter:drop-shadow(0 0 2px rgba(255,255,255,.08));
}
.bulb-hardware{
  position:absolute;
  left:50%;
  top:0;
  width:110px;
  height:150px;
  transform:translate(calc(var(--bulb-local-x, 0px) - 55px), var(--bulb-local-y, 122px)) rotate(var(--bulb-rot, 0deg));
  transform-origin:50% 0%;
}
.bulb-socket{
  position:absolute;
  left:50%;
  top:0;
  width:36px;
  height:24px;
  transform:translateX(-50%);
  border-radius:10px 10px 8px 8px;
  background:linear-gradient(180deg, #4a4a4a 0%, #1c1c1c 100%);
  box-shadow:0 6px 10px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.1);
}
.bulb-glass{
  position:absolute;
  left:50%;
  top:16px;
  width:80px;
  height:102px;
  transform:translateX(-50%);
  border-radius:48px 48px 42px 42px;
  background:
    radial-gradient(circle at 34% 26%, rgba(255,255,255,.95), rgba(255,255,255,.16) 18%, transparent 22%),
    radial-gradient(circle at 50% 36%, rgba(255,255,255,calc(.22 + var(--light) * .48)), rgba(255,255,255,calc(.06 + var(--light) * .14)) 54%, rgba(205,205,205,calc(.05 + var(--light) * .05)) 70%, rgba(255,255,255,.02) 100%);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:
    0 18px 36px rgba(0,0,0,.36),
    inset 0 0 24px rgba(255,255,255,calc(.03 + var(--light) * .12));
}
.bulb-glass::before{
  content:"";
  position:absolute;
  left:18%;
  top:18%;
  width:18px;
  height:34px;
  border-radius:50%;
  background:rgba(255,255,255,.4);
  filter:blur(1px);
}
.bulb-aura{
  position:absolute;
  left:50%;
  top:18px;
  width:300px;
  height:300px;
  transform:translateX(-50%);
  background:
    radial-gradient(circle at center, rgba(255,255,255,calc(.16 + var(--light) * .24)) 0%, rgba(255,255,255,calc(.06 + var(--light) * .12)) 18%, rgba(255,255,255,.02) 42%, transparent 72%);
  filter:blur(18px);
  opacity:calc(.18 + var(--light) * .7);
}

.site-header{ z-index:45; }
.site-header .inner{ padding:14px 0; }
.nav-links{ gap:12px; }
.nav-links a{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 16px;
  font-family:"IBM Plex Mono",monospace;
  font-size:.75rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02));
}
.nav-links a.is-active{ background:rgba(255,255,255,.9); color:#0c0c0c; border-color:rgba(255,255,255,.8); }

.paint-reveal,
.paint-in{ opacity:0; transform:translateY(26px); filter:blur(8px); transition:opacity .85s ease, transform .85s ease, filter .85s ease; }
.paint-reveal.is-visible,
.paint-in.is-visible{ opacity:1; transform:none; filter:none; }

@media (max-width: 900px){
  .site-header .inner{ gap:14px; }
  .nav-links{ flex-wrap:wrap; justify-content:flex-end; }
  .nav-links a{ padding:0 12px; font-size:.68rem; letter-spacing:.12em; }
  .switch-plate{ width:170px; }
  .switch-rocker{ width:76px; height:108px; }
  .switch-toggle{ left:8px; right:8px; height:42px; }
  .wall-switch.is-on .switch-toggle{ transform:translateY(46px); }
  .living-bulb{ height:230px; }
  .bulb-swing{ width:180px; height:230px; transform:translateX(calc(var(--bulb-x) - 50vw - 90px)) translateY(var(--bulb-drop)); }
  .bulb-cord-svg{ width:180px; height:166px; }
  .bulb-hardware{ width:96px; transform:translate(calc(var(--bulb-local-x, 0px) - 48px), var(--bulb-local-y, 108px)) rotate(var(--bulb-rot, 0deg)); }
  .bulb-glass{ width:68px; height:88px; top:14px; }
  .bulb-aura{ width:240px; height:240px; }
}

@media (prefers-reduced-motion: reduce){
  .paint-reveal, .paint-in{ opacity:1; transform:none; filter:none; transition:none; }
  .switch-stage, .living-bulb, #ink-canvas{ display:none !important; }
  body.lights-off main, body.lights-off .site-header, body.lights-off footer{ opacity:1; transform:none; filter:none; pointer-events:auto; }
}


/* --- usability + painted portfolio refinements --- */
.switch-shell{gap:18px}
.switch-jump{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.9);
  font-family:"IBM Plex Mono",monospace;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  cursor:pointer;
}.switch-jump::before{
  content:"";
  position:absolute;
  inset:0 -10px;
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.04) 58%, transparent 100%);
  opacity:.62;
}
.switch-jump::after{
  content:"↓";
  position:relative;
  margin-left:10px;
  font-size:.92rem;
}
.switch-jump:hover,.switch-jump:focus-visible{color:#fff}
.switch-jump:hover::before,.switch-jump:focus-visible::before{opacity:.92}

.link-btn span::after,
.study-links a::after,
.footer-links a::after{
  content:" ↗";
  opacity:.72;
}

.footer-links a,
.study-links a{
  position:relative;
  padding-bottom:8px;
}.footer-links a::before,
.study-links a::before{
  content:"";
  position:absolute;
  left:0;right:0;bottom:0;height:10px;
  background:linear-gradient(90deg, rgba(255,255,255,.3), rgba(255,255,255,0));
  opacity:.2;
  transition:opacity .24s ease, transform .24s ease;
  transform:translateY(3px);
}
.footer-links a:hover::before,
.study-links a:hover::before,
.footer-links a:focus-visible::before,
.study-links a:focus-visible::before{
  opacity:.52;
  transform:translateY(0);
}

.project-row{padding-top:22px}
.project-media{overflow:visible}
.project-media-link{
  position:relative;
  display:block;
  overflow:hidden;
  border-radius:22px;
  text-decoration:none;
}
.project-media-link img{
  display:block;
  width:100%;
  min-height:280px;
  aspect-ratio:16/10;
  object-fit:cover;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 20px 46px rgba(0,0,0,.4);
  transform:scale(1.045);
  filter:grayscale(1) brightness(.28) blur(5px);
  clip-path:inset(0 100% 0 0 round 22px);
  transition:transform 1.05s cubic-bezier(.2,.7,.2,1), filter .9s ease, clip-path 1s cubic-bezier(.2,.7,.2,1);
}
.project-row.is-visible .project-media-link img{
  transform:scale(1);
  filter:grayscale(.08) brightness(.98) blur(0);
  clip-path:inset(0 0 0 0 round 22px);
}.project-media-link::before{
  content:"";
  position:absolute;
  inset:-8% -12% -8% -4%;
  background:linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,.4) 40%, rgba(255,255,255,.08) 65%, transparent 100%);
  opacity:.92;
  transform:translateX(-42%) scaleX(1.12);
  transition:transform 1.08s cubic-bezier(.2,.7,.2,1), opacity .9s ease;
  pointer-events:none;
  mix-blend-mode:screen;
}
.project-row.is-visible .project-media-link::before{
  transform:translateX(110%) scaleX(.92);
  opacity:0;
}.project-media-link::after{
  content:"";
  position:absolute;
  inset:auto -6% 2% -4%;
  height:28%;
  background:linear-gradient(90deg, rgba(255,255,255,.22), rgba(255,255,255,.06) 56%, transparent 100%);
  opacity:.52;
  transform:translateY(10px);
  transition:transform .9s ease, opacity .9s ease;
  pointer-events:none;
}
.project-row.is-visible .project-media-link::after{
  transform:translateY(0);
  opacity:.7;
}
.open-pill{
  position:absolute;
  left:18px;
  bottom:18px;
  display:inline-flex;
  align-items:center;
  min-height:34px;
  padding:0 14px;
  font-family:"IBM Plex Mono",monospace;
  font-size:.67rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#0b0b0b;
  z-index:2;
  isolation:isolate;
}.open-pill::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(228,228,228,.9));
  box-shadow:0 8px 20px rgba(0,0,0,.28);
  z-index:-1;
}
.open-pill::after{content:" ↗"; margin-left:8px}

.project-copy h3{margin-bottom:10px}
.project-copy p{margin-bottom:20px}
.project-signal-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  gap:12px;
  margin:0 0 24px;
}
.project-signal{
  position:relative;
  min-height:88px;
  padding:14px 16px 16px;
  isolation:isolate;
}.project-signal::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(255,255,255,.11), rgba(255,255,255,.04));
  opacity:.84;
  z-index:-1;
}.project-signal::after{
  content:"";
  position:absolute;
  left:12px; right:22%; bottom:8px; height:10px;
  background:linear-gradient(90deg, rgba(255,255,255,.46), rgba(255,255,255,0));
  opacity:.46;
}
.project-signal-label{
  font-family:"IBM Plex Mono",monospace;
  font-size:.62rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--soft);
  margin-bottom:9px;
}
.project-signal-value{
  font-size:.92rem;
  line-height:1.55;
  color:#f3f3f3;
  text-wrap:balance;
}
.case-open-btn{
  min-width:240px;
  justify-content:center;
}
.case-open-btn span{font-weight:600}
.case-open-btn::before{
  background:linear-gradient(90deg, rgba(255,255,255,1), rgba(231,231,231,.92));
}

.case-actions .link-btn,
.link-line .link-btn{min-width:220px; justify-content:center}
.case-actions .link-btn span,
.link-line .link-btn span{display:inline-flex; align-items:center}

@media (max-width: 900px){
  .project-signal-grid{grid-template-columns:1fr; gap:10px}
  .project-signal{min-height:auto}
  .open-pill{left:14px; bottom:14px; font-size:.62rem}
}

/* ===== V6.1 portfolio clarity + painterly reveal refinements ===== */
.project-copy h3{
  margin:0 0 14px;
  font-size:clamp(2rem, 3.1vw, 3.15rem);
  line-height:.94;
  letter-spacing:-.055em;
}
.project-title-link{
  position:relative;
  display:inline-block;
  padding-right:18px;
  color:var(--ink);
  text-decoration:none;
}
.project-title-link::after{
  content:"↗";
  position:absolute;
  right:0;
  top:.02em;
  font-size:.62em;
  opacity:.55;
  transform:translateY(1px);
  transition:transform .22s ease, opacity .22s ease;
}
.project-title-link:hover::after,
.project-title-link:focus-visible::after{opacity:.95;transform:translate(3px,-1px)}
.project-copy .section-label{margin-bottom:10px;color:var(--muted-strong)}
.project-copy p{font-size:1rem;color:#d7d3cc}

.project-media-link{
  border-radius:24px;
  isolation:isolate;
  box-shadow:0 24px 52px rgba(0,0,0,.38);
}
.project-media-link img{
  border-radius:24px;
  clip-path:inset(0 100% 100% 0 round 24px);
  filter:grayscale(1) brightness(.16) blur(3px);
  transition:transform 1.15s cubic-bezier(.18,.78,.18,1), filter 1s ease, clip-path 1.18s cubic-bezier(.18,.78,.18,1);
}
.project-row.is-visible .project-media-link img{
  clip-path:inset(0 0 0 0 round 24px);
  filter:grayscale(.02) brightness(1) blur(0);
}
.project-media-link::before{
  inset:-12% -10% -6% -5%;
  background:linear-gradient(90deg, rgba(255,255,255,.95), rgba(255,255,255,.52) 34%, rgba(255,255,255,.12) 62%, transparent 100%);
  transform:translate(-54%, -14%) rotate(-6deg) scale(1.14);
  transition:transform 1.12s cubic-bezier(.18,.78,.18,1), opacity .92s ease;
  opacity:.88;
}
.project-row.is-visible .project-media-link::before{
  transform:translate(108%, 22%) rotate(-5deg) scale(.98);
  opacity:0;
}.project-media-link::after{
  inset:-10% -8% -6% -4%;
  height:auto;
  background:linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 54%, transparent 100%);
  opacity:.46;
  transform:translate(-8%, 38%) rotate(4deg) scale(1.06);
  transition:transform 1.22s .08s cubic-bezier(.18,.78,.18,1), opacity .95s ease;
}
.project-row.is-visible .project-media-link::after{
  transform:translate(4%, -106%) rotate(2deg) scale(.98);
  opacity:0;
}
.project-paint-pass{
  position:absolute;
  inset:-8% -8% -8% -2%;
  pointer-events:none;
  z-index:2;
  opacity:.8;
  mix-blend-mode:screen;
  will-change:transform, opacity;
}.project-paint-pass.paint-pass-one{
  background:linear-gradient(90deg, rgba(255,255,255,.84), rgba(255,255,255,.46) 36%, rgba(255,255,255,.08) 62%, transparent 100%);
  transform:translate(-62%, -18%) rotate(-7deg) scale(1.18);
  transition:transform 1.05s cubic-bezier(.16,.8,.16,1), opacity .9s ease;
}.project-paint-pass.paint-pass-two{
  background:linear-gradient(180deg, rgba(255,255,255,.42), rgba(255,255,255,.08) 60%, transparent 100%);
  transform:translate(-20%, 56%) rotate(4deg) scale(1.08);
  transition:transform 1.14s .08s cubic-bezier(.16,.8,.16,1), opacity .92s ease;
}
.project-row.is-visible .project-paint-pass.paint-pass-one{
  transform:translate(114%, 12%) rotate(-5deg) scale(.98);
  opacity:0;
}
.project-row.is-visible .project-paint-pass.paint-pass-two{
  transform:translate(6%, -118%) rotate(1deg) scale(.94);
  opacity:0;
}
.project-media-overlay{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  display:flex;
  align-items:end;
  justify-content:space-between;
  gap:14px;
  z-index:3;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .55s .22s ease, transform .55s .22s ease;
  pointer-events:none;
}
.project-row.is-visible .project-media-overlay{
  opacity:1;
  transform:translateY(0);
}
.project-overlay-title{
  display:grid;
  gap:7px;
  max-width:min(72%, 28ch);
}
.project-overlay-title strong{
  font-size:clamp(1rem, 1.45vw, 1.28rem);
  line-height:1.02;
  letter-spacing:-.03em;
  color:#fff;
  text-shadow:0 2px 16px rgba(0,0,0,.56);
}
.project-overlay-title span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-family:"IBM Plex Mono",monospace;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.16em;
  color:rgba(255,255,255,.9);
}.project-overlay-title span::before{
  content:"";
  width:32px;
  height:10px;
  background:linear-gradient(90deg, rgba(255,255,255,.92), rgba(255,255,255,0));
}.project-overlay-meta{
  align-self:flex-start;
  min-height:34px;
  padding:8px 14px;
  font-family:"IBM Plex Mono",monospace;
  font-size:.67rem;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:#111;
  background:linear-gradient(90deg, rgba(255,255,255,.96), rgba(228,228,228,.9));
  box-shadow:0 10px 22px rgba(0,0,0,.26);
}
.open-pill{
  top:18px;
  right:18px;
  left:auto;
  bottom:auto;
  min-height:36px;
  padding:0 16px;
  font-size:.68rem;
  letter-spacing:.18em;
  color:#050505;
  opacity:0;
  transform:translateY(-8px);
  transition:opacity .4s .24s ease, transform .4s .24s ease;
}
.project-row.is-visible .open-pill{opacity:1;transform:translateY(0)}
.open-pill::before{box-shadow:0 10px 22px rgba(0,0,0,.32)}
.open-pill::after{content:"  ↗";margin-left:0}

.project-signal-grid{
  gap:14px;
  margin:4px 0 28px;
}
.project-signal{
  min-height:94px;
  padding:16px 18px 18px;
}
.project-signal::before{
  background:linear-gradient(180deg, rgba(255,255,255,.13), rgba(255,255,255,.045));
  opacity:.9;
}
.project-signal::after{left:16px;right:28%;bottom:10px;height:11px;opacity:.52}
.project-signal-label{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-bottom:10px;
  font-size:.6rem;
  letter-spacing:.2em;
  color:#f0ede7;
}.project-signal-label::after{
  content:"";
  width:26px;
  height:9px;
  background:linear-gradient(90deg, rgba(255,255,255,.9), rgba(255,255,255,0));
  opacity:.8;
}
.project-signal-value{
  font-size:.98rem;
  line-height:1.58;
  color:#fbfaf6;
}
.case-open-btn{
  min-width:260px;
  font-size:.79rem;
  letter-spacing:.18em;
}
.case-open-btn::before{
  background:linear-gradient(90deg, rgba(255,255,255,1), rgba(236,236,236,.94));
}
.case-open-btn span::after{
  content:" ↗";
  margin-left:8px;
}

@media (max-width: 900px){
  .project-media-overlay{left:14px;right:14px;bottom:14px;gap:10px}
  .project-overlay-title{max-width:76%}
  .project-overlay-title strong{font-size:1rem}
  .project-overlay-meta{padding:8px 12px;font-size:.62rem}
  .open-pill{top:14px;right:14px}
}
@media (max-width: 760px){
  .project-media-link img{clip-path:inset(0 100% 100% 0 round 22px)}
  .project-media-overlay{flex-direction:column;align-items:flex-start}
  .project-overlay-title{max-width:100%}
  .project-overlay-meta{align-self:flex-start}
  .project-title-link{padding-right:14px}
}


/* ===== V6.2 clarity + brush reveal corrections ===== */
.hero .paint-ribbon{
  min-height:58px;
  padding:0 26px 0 22px;
}
.hero .paint-ribbon::before{
  background:linear-gradient(90deg, rgba(6,6,6,.9), rgba(18,18,18,.82) 56%, rgba(8,8,8,.72) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 12px 28px rgba(0,0,0,.4);
}
.hero .paint-ribbon::after{
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0));
  opacity:.58;
}
.hero .paint-ribbon span{
  color:rgba(255,255,255,.94);
  text-shadow:0 2px 14px rgba(0,0,0,.52);
  overflow:visible;
  text-overflow:clip;
  font-size:clamp(.78rem, 1.18vw, .96rem);
  letter-spacing:.2em;
}

.project-media-link{
  overflow:hidden;
  position:relative;
  display:block;
  border-radius:24px;
  isolation:isolate;
  cursor:pointer;
}
.project-media-link img{
  transform:none;
  clip-path:inset(0 0 0 0 round 24px);
  filter:grayscale(1) brightness(.18) blur(2px);
  transition:filter .9s ease, opacity .9s ease, transform .9s ease, box-shadow .45s ease;
}
.project-row.is-visible .project-media-link img{
  filter:grayscale(.02) brightness(1) blur(0);
}
.project-media-link:hover img,
.project-media-link:focus-visible img{
  filter:grayscale(0) brightness(1.08) contrast(1.04) saturate(1.02);
  transform:scale(1.014);
  box-shadow:0 0 28px rgba(255,255,255,.08), 0 0 70px rgba(255,255,255,.06);
}

/* convert the reveal into stacked horizontal brush sweeps instead of diagonal zoom */
.project-media-link::before,
.project-media-link::after,
.project-paint-pass.paint-pass-one,
.project-paint-pass.paint-pass-two{
  left:-10%;
  right:-10%;
  inset:auto -10% auto -10%;
  pointer-events:none;
  mix-blend-mode:screen;
}.project-media-link::before{
  top:-1%;
  height:33%;
  background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(255,255,255,.58) 34%, rgba(255,255,255,.14) 68%, transparent 100%);
  transform:translateX(-118%) rotate(-2deg) scale(1.04);
  transition:transform .92s cubic-bezier(.17,.82,.18,1), opacity .72s ease;
  opacity:.96;
}
.project-row.is-visible .project-media-link::before{
  transform:translateX(118%) rotate(-1deg) scale(1);
  opacity:0;
}.project-paint-pass.paint-pass-one{
  top:22%;
  height:27%;
  background:linear-gradient(90deg, transparent 0, rgba(255,255,255,.12) 8%, rgba(255,255,255,.96) 46%, rgba(255,255,255,.42) 74%, transparent 100%);
  transform:translateX(118%) rotate(1deg) scale(1.04);
  transition:transform .96s .08s cubic-bezier(.17,.82,.18,1), opacity .74s ease;
  opacity:.9;
}
.project-row.is-visible .project-paint-pass.paint-pass-one{
  transform:translateX(-118%) rotate(0deg) scale(1);
  opacity:0;
}.project-media-link::after{
  top:47%;
  height:27%;
  background:linear-gradient(90deg, rgba(255,255,255,.94), rgba(255,255,255,.54) 36%, rgba(255,255,255,.12) 70%, transparent 100%);
  transform:translateX(-118%) rotate(-1deg) scale(1.04);
  transition:transform .98s .16s cubic-bezier(.17,.82,.18,1), opacity .74s ease;
  opacity:.82;
}
.project-row.is-visible .project-media-link::after{
  transform:translateX(118%) rotate(0deg) scale(1);
  opacity:0;
}.project-paint-pass.paint-pass-two{
  top:71%;
  height:29%;
  background:linear-gradient(90deg, transparent 0, rgba(255,255,255,.14) 9%, rgba(255,255,255,.92) 44%, rgba(255,255,255,.34) 70%, transparent 100%);
  transform:translateX(118%) rotate(1deg) scale(1.03);
  transition:transform 1s .24s cubic-bezier(.17,.82,.18,1), opacity .76s ease;
  opacity:.78;
}
.project-row.is-visible .project-paint-pass.paint-pass-two{
  transform:translateX(-118%) rotate(0deg) scale(1);
  opacity:0;
}

.project-media-overlay{
  left:16px;
  right:16px;
  bottom:16px;
  gap:12px;
  transition:transform .35s ease, opacity .35s ease;
}
.project-media-link:hover .project-media-overlay,
.project-media-link:focus-visible .project-media-overlay{
  transform:translateY(-4px);
}
.project-overlay-title{
  max-width:min(74%, 30ch);
  padding:12px 16px 11px;
  position:relative;
  isolation:isolate;
}.project-overlay-title::before{
  content:"";
  position:absolute;
  inset:-6px -10px -8px -10px;
  background:linear-gradient(90deg, rgba(6,6,6,.88), rgba(12,12,12,.72) 58%, rgba(6,6,6,.58) 100%);
  box-shadow:0 10px 26px rgba(0,0,0,.34);
  z-index:-1;
}
.project-overlay-title strong{
  font-size:clamp(1.06rem, 1.55vw, 1.34rem);
  line-height:1.02;
  color:#fff;
  text-shadow:0 2px 16px rgba(0,0,0,.64);
}
.project-overlay-title span{
  color:rgba(255,255,255,.96);
  font-weight:600;
  letter-spacing:.17em;
}
.project-overlay-title span::before{
  width:38px;
  opacity:.98;
}
.project-overlay-meta{
  align-self:flex-start;
  min-height:34px;
  padding:8px 14px;
  color:#fff;
  background:none;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  -webkit-mask:none;
  mask:none;
  background:rgba(10,10,10,.74);
  box-shadow:0 10px 24px rgba(0,0,0,.28);
}
.open-pill{display:none !important;}
.project-media-link::selection{background:transparent;}
.project-media-link:hover::selection{background:transparent;}
.project-media-link:hover::before,
.project-media-link:focus-visible::before,
.project-media-link:hover .project-paint-pass.paint-pass-one,
.project-media-link:focus-visible .project-paint-pass.paint-pass-one,
.project-media-link:hover::after,
.project-media-link:focus-visible::after,
.project-media-link:hover .project-paint-pass.paint-pass-two,
.project-media-link:focus-visible .project-paint-pass.paint-pass-two{
  filter:brightness(1.1);
}
.project-media-link::marker{content:"";}
.project-media-link .project-overlay-title span{opacity:.9;}
.project-media-link:hover .project-overlay-title span,
.project-media-link:focus-visible .project-overlay-title span{opacity:1;color:#fff;letter-spacing:.19em;}
.project-media-link:hover .project-overlay-title::before,
.project-media-link:focus-visible .project-overlay-title::before{
  background:linear-gradient(90deg, rgba(8,8,8,.74), rgba(20,20,20,.52) 58%, rgba(8,8,8,.26) 100%);
  box-shadow:0 14px 32px rgba(0,0,0,.42), 0 0 34px rgba(255,255,255,.05);
}
.project-media-link:hover .project-overlay-meta,
.project-media-link:focus-visible .project-overlay-meta{
  border-color:rgba(255,255,255,.34);
  box-shadow:0 12px 24px rgba(0,0,0,.28), 0 0 18px rgba(255,255,255,.06);
}
.project-media-link:hover,
.project-media-link:focus-visible{
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 0 44px rgba(255,255,255,.05);
}

.case-open-btn{
  min-width:250px;
}
.case-open-btn::before{
  background:linear-gradient(90deg, rgba(9,9,9,.94), rgba(18,18,18,.84));
  box-shadow:0 12px 26px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.14);
}
.case-open-btn span{
  color:#fff;
}
.case-open-btn span::after{opacity:.92}

@media (max-width: 900px){
  .project-overlay-title{max-width:100%;}
}


/* ===== V9 performance + hover clarity + case readability ===== */
:root{
  --hover-light-alpha:0;
  --hover-light-x:50%;
  --hover-light-y:42%;
}

/* stronger readable ribbons on case-study pages */
.case-hero .paint-ribbon{
  min-height:58px;
  padding:0 24px 0 20px;
}
.case-hero .paint-ribbon::before{
  background:linear-gradient(90deg, rgba(10,10,10,.96), rgba(18,18,18,.88) 56%, rgba(8,8,8,.8) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.14), 0 12px 26px rgba(0,0,0,.34);
}
.case-hero .paint-ribbon::after{
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  opacity:.62;
}
.case-hero .paint-ribbon span,
.case-actions .link-btn span{
  color:rgba(255,255,255,.96);
  text-shadow:0 2px 14px rgba(0,0,0,.48);
}
.case-actions .link-btn::before{
  background:linear-gradient(90deg, rgba(8,8,8,.96), rgba(18,18,18,.9));
  box-shadow:0 12px 26px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.14);
}
.case-actions .link-btn::after{
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0));
}
.case-actions .link-btn:hover,
.case-actions .link-btn:focus-visible{
  filter:brightness(1.08);
}

/* portfolio images: no text overlays, image itself becomes the light source */
.project-media-overlay{
  display:none !important;
}
.project-media-link{
  overflow:hidden;
  position:relative;
  display:block;
  border-radius:24px;
  isolation:isolate;
  cursor:pointer;
  transform:translateZ(0);
}
.project-media-link::before,
.project-media-link::after,
.project-paint-pass.paint-pass-one,
.project-paint-pass.paint-pass-two{
  left:-10%;
  right:-10%;
  inset:auto -10% auto -10%;
  pointer-events:none;
  mix-blend-mode:screen;
}.project-media-link::before{
  top:-2%;
  height:31%;
  background:linear-gradient(90deg, rgba(255,255,255,.98), rgba(255,255,255,.64) 34%, rgba(255,255,255,.16) 68%, transparent 100%);
  transform:translateX(-118%) scale(1.03);
  transition:transform .9s cubic-bezier(.17,.82,.18,1), opacity .72s ease;
  opacity:.94;
}.project-paint-pass.paint-pass-one{
  top:24%;
  height:26%;
  background:linear-gradient(90deg, transparent 0, rgba(255,255,255,.18) 10%, rgba(255,255,255,.98) 46%, rgba(255,255,255,.48) 72%, transparent 100%);
  transform:translateX(118%) scale(1.03);
  transition:transform .96s .08s cubic-bezier(.17,.82,.18,1), opacity .74s ease;
  opacity:.88;
}.project-media-link::after{
  top:50%;
  height:25%;
  background:linear-gradient(90deg, rgba(255,255,255,.96), rgba(255,255,255,.58) 36%, rgba(255,255,255,.16) 70%, transparent 100%);
  transform:translateX(-118%) scale(1.03);
  transition:transform .98s .16s cubic-bezier(.17,.82,.18,1), opacity .74s ease;
  opacity:.82;
}.project-paint-pass.paint-pass-two{
  top:74%;
  height:24%;
  background:linear-gradient(90deg, transparent 0, rgba(255,255,255,.16) 10%, rgba(255,255,255,.92) 44%, rgba(255,255,255,.36) 70%, transparent 100%);
  transform:translateX(118%) scale(1.02);
  transition:transform 1s .24s cubic-bezier(.17,.82,.18,1), opacity .76s ease;
  opacity:.76;
}
.project-row.is-visible .project-media-link::before{ transform:translateX(118%) scale(1); opacity:0; }
.project-row.is-visible .project-paint-pass.paint-pass-one{ transform:translateX(-118%) scale(1); opacity:0; }
.project-row.is-visible .project-media-link::after{ transform:translateX(118%) scale(1); opacity:0; }
.project-row.is-visible .project-paint-pass.paint-pass-two{ transform:translateX(-118%) scale(1); opacity:0; }

.project-media-link img{
  border-radius:24px;
  clip-path:inset(0 0 0 0 round 24px);
  filter:grayscale(1) brightness(.18) blur(1.8px);
  transform:scale(1.001);
  transition:filter .9s ease, transform .55s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease;
  will-change:transform, filter;
}
.project-row.is-visible .project-media-link img{
  filter:grayscale(.02) brightness(1) blur(0);
}
.project-media-link:hover img,
.project-media-link:focus-visible img{
  filter:grayscale(0) brightness(1.12) contrast(1.05) saturate(1.02);
  transform:scale(1.032);
  box-shadow:0 0 34px rgba(255,255,255,.09), 0 0 100px rgba(255,255,255,.08);
}
.project-media-link .project-overlay-title,
.project-media-link .project-overlay-meta{display:none !important;}
.project-media-link:hover,
.project-media-link:focus-visible{
  box-shadow:0 0 0 1px rgba(255,255,255,.14), 0 0 54px rgba(255,255,255,.08);
}
.project-media::before{
  transition:opacity .35s ease, filter .35s ease;
}
.project-row:hover .project-media::before,
.project-row:focus-within .project-media::before{
  opacity:.78;
  filter:blur(8px);
}
/* let the portfolio image light the surrounding page */
.project-row::after{
  transition:opacity .35s ease, filter .35s ease;
}
.project-row:hover::after,
.project-row:focus-within::after{
  opacity:.7;
  filter:blur(2px);
}
.project-row::before{
  transition:opacity .35s ease;
}
.project-row:hover::before,
.project-row:focus-within::before{
  opacity:.26;
}

/* slightly stronger case-study CTA on the side */
.case-open-btn{
  min-width:238px;
}
.case-open-btn span{
  color:#fff;
  font-weight:700;
}
.case-open-btn::before{
  background:linear-gradient(90deg, rgba(10,10,10,.92), rgba(20,20,20,.84));
  box-shadow:0 12px 26px rgba(0,0,0,.32), inset 0 0 0 1px rgba(255,255,255,.14);
}
.case-open-btn::after{
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,0));
}

@media (max-width: 760px){
  .case-hero .paint-ribbon span{white-space:normal; line-height:1.32;}
}

/* ===== V10 intro jump + smoother anchor path ===== */
@media (prefers-reduced-motion: no-preference){
  html{scroll-behavior:smooth;}
}

#home, #work, #about, #contact{scroll-margin-top:96px;}

.hero-jump-row{
  margin-top:22px;
  display:flex;
  align-items:center;
  gap:14px;
  flex-wrap:wrap;
}
.hero-jump-switch{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:14px;
  min-height:54px;
  padding:0 18px 0 22px;
  border-radius:999px;
  text-decoration:none;
  color:rgba(255,255,255,.96);
  font-family:"IBM Plex Mono", monospace;
  font-size:.74rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  isolation:isolate;
  transition:transform .28s ease, filter .28s ease, color .28s ease;
}
.hero-jump-switch::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(10,10,10,.94), rgba(20,20,20,.84) 58%, rgba(12,12,12,.68) 100%);
  box-shadow:0 14px 30px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.12);
  z-index:-2;
}
.hero-jump-switch::after{
  content:"";
  position:absolute;
  inset:1px;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,.03) 24%, rgba(255,255,255,0) 62%);
  opacity:.72;
  z-index:-1;
}
.hero-jump-label{white-space:nowrap;}
.hero-jump-toggle{
  display:inline-grid;
  place-items:center;
  width:28px;
  height:28px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.12);
  font-size:1rem;
  line-height:1;
}
.hero-jump-switch:hover,
.hero-jump-switch:focus-visible{
  transform:translateY(-2px);
  filter:brightness(1.08);
}
.hero-jump-switch:hover .hero-jump-toggle,
.hero-jump-switch:focus-visible .hero-jump-toggle{
  background:rgba(255,255,255,.14);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18), 0 0 18px rgba(255,255,255,.08);
}

@media (max-width: 760px){
  .hero-jump-switch{
    width:100%;
    justify-content:space-between;
    padding-right:14px;
  }
}


.hero-about-switch .hero-jump-toggle{
  font-size:.92rem;
}
.contact-echo{
  padding-top:34px;
  padding-bottom:34px;
  margin-top:8px;
}
.contact-echo .footer-line{
  opacity:.22;
}


.process-river-section{padding-top:6px}
.process-strip{position:relative;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px;margin-top:18px}.process-strip::before{
  content:"";position:absolute;inset:10px -2% 12px -2%;
  background:linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,.03) 52%, transparent 100%);
  opacity:.18;pointer-events:none;
}
.process-card{
  position:relative;z-index:1;min-height:126px;padding:18px 16px 18px;
  background:linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.08);border-radius:18px;
  box-shadow:0 14px 32px rgba(0,0,0,.18);
  overflow:hidden;
}.process-card::before{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,.04) 60%, transparent 100%);
  opacity:.12;pointer-events:none;
}.process-card::after{
  content:"";position:absolute;left:14px;right:28%;bottom:10px;height:12px;
  background:linear-gradient(90deg, rgba(255,255,255,.45), rgba(255,255,255,0));
  opacity:.34;pointer-events:none;
}
.process-tag{display:block;font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin-bottom:10px}
.process-value{display:block;font-size:.94rem;line-height:1.55;color:var(--ink)}
.process-card strong{color:var(--ink);font-weight:600}
@media (max-width: 1240px){
  .process-strip{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width: 760px){
  .process-strip{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .process-card{min-height:118px;padding:16px 14px 16px}
  .process-value{font-size:.9rem;line-height:1.5}
}
@media (max-width: 520px){
  .process-strip{grid-template-columns:1fr}
}


/* Local-safe YouTube poster cards */
.video-poster{position:relative;display:block;overflow:hidden;border-radius:22px;background:#050505;isolation:isolate;text-decoration:none;color:#fff;}
.video-poster img{width:100%;height:100%;min-height:320px;aspect-ratio:16/10;object-fit:cover;display:block;transform:scale(1.01);transition:transform .55s ease, filter .45s ease;}
.video-poster::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.08) 0%, rgba(0,0,0,.18) 46%, rgba(0,0,0,.44) 100%);z-index:1;pointer-events:none;}
.video-poster-badge{position:absolute;left:18px;bottom:18px;z-index:2;display:inline-flex;align-items:center;min-height:42px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(10,10,10,.58);backdrop-filter:blur(8px);font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:#fff;box-shadow:0 10px 28px rgba(0,0,0,.28);}
.video-poster-play{position:absolute;right:18px;bottom:14px;z-index:2;width:60px;height:60px;border-radius:999px;border:0;background:radial-gradient(circle at center, rgba(255,255,255,.18), rgba(255,255,255,.06) 46%, rgba(255,255,255,0) 72%);backdrop-filter:blur(2px);box-shadow:0 0 28px rgba(255,255,255,.08), 0 12px 32px rgba(0,0,0,.26);}
.video-poster-play::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-38%,-50%);border-left:16px solid #fff;border-top:10px solid transparent;border-bottom:10px solid transparent;opacity:.96;filter:drop-shadow(0 0 10px rgba(255,255,255,.2));}
.video-poster:hover img,.video-poster:focus-visible img{transform:scale(1.03);filter:brightness(1.06);}
.video-poster:hover .video-poster-badge,.video-poster:focus-visible .video-poster-badge{border-color:rgba(255,255,255,.34);background:rgba(18,18,18,.68);} .video-poster:hover .video-poster-play,.video-poster:focus-visible .video-poster-play{background:radial-gradient(circle at center, rgba(255,255,255,.24), rgba(255,255,255,.08) 46%, rgba(255,255,255,0) 74%);box-shadow:0 0 32px rgba(255,255,255,.12), 0 12px 32px rgba(0,0,0,.28);}
@media (max-width: 720px){.video-poster-badge{left:14px;bottom:14px;font-size:.66rem;letter-spacing:.14em;padding:0 14px;}.video-poster-play{right:12px;bottom:10px;width:52px;height:52px;}.video-poster-play::before{border-left-width:14px;border-top-width:9px;border-bottom-width:9px;}}


/* v22 clarity fixes */
.link-btn span,
.case-open-btn span,
.footer-links a,
.study-links a,
.project-title-link,
.open-pill{
  overflow:visible;
}
.link-btn span::after,
.case-open-btn span::after,
.footer-links a::after,
.study-links a::after,
.open-pill::after,
.project-title-link::after{
  display:inline-block !important;
  line-height:1 !important;
  vertical-align:.06em;
  text-rendering:geometricPrecision;
  -webkit-font-smoothing:antialiased;
}
.project-title-link{
  padding-right:0 !important;
}
.project-title-link::after{
  position:static !important;
  margin-left:6px;
  transform:none !important;
  font-size:.58em;
  opacity:.72;
}
.project-title-link:hover::after,
.project-title-link:focus-visible::after{
  transform:translateX(2px) !important;
  opacity:.96 !important;
}
.link-btn span,
.case-open-btn span{
  display:inline-flex;
  align-items:center;
  gap:8px;
}
.link-btn span::after,
.case-open-btn span::after,
.footer-links a::after,
.study-links a::after,
.open-pill::after{
  content:"↗";
  margin-left:0;
}

/* ===== V23.0 logo frame cleanup + arrow spacing refinement ===== */
.project-title-link{
  display:inline-flex !important;
  align-items:flex-start;
  gap:10px;
  padding-right:0 !important;
}
.project-title-link::after{
  position:static !important;
  margin-left:0 !important;
  line-height:1;
  font-size:.56em;
  transform:translateY(.12em) !important;
  flex:0 0 auto;
}
.project-title-link:hover::after,
.project-title-link:focus-visible::after{
  transform:translate(2px, .1em) !important;
}

.link-btn span,
.case-open-btn span,
.footer-links a,
.study-links a{
  display:inline-flex;
  align-items:center;
}
.link-btn span::after,
.case-open-btn span::after,
.footer-links a::after,
.study-links a::after,
.open-pill::after{
  display:inline-block;
  margin-left:8px !important;
  line-height:1;
  transform:translateY(-.02em);
}

.case-media > img[src*="FORTRESSARTISTALLEY"],
.project-media-link img[src*="FORTRESSARTISTALLEY"]{
  background:#a44aa6;
}
.case-media > img[src*="VictorianNaginataFederation"],
.project-media-link img[src*="VictorianNaginataFederation"]{
  background:#ebedf0;
}


/* ===== V24 atmosphere + VNF clarity tuning ===== */
.case-media > img[src*="VictorianNaginataFederation"],
.project-media-link img[src*="VictorianNaginataFederation"]{
  background:#ebedf0;
  object-fit:contain !important;
  object-position:center center;
  padding:2.5% 2%;
  image-rendering:auto;
}
.case-media > img[src*="VictorianNaginataFederation"]{
  filter:drop-shadow(0 18px 34px rgba(0,0,0,.16)) drop-shadow(0 6px 14px rgba(0,0,0,.1));
}
.project-media-link:hover img[src*="VictorianNaginataFederation"],
.project-media-link:focus-visible img[src*="VictorianNaginataFederation"]{
  transform:scale(1.014);
}


/* ===== V27 contact + about polish ===== */
.portfolio-links{margin-top:18px;}
.portfolio-links .footer-links{justify-content:flex-start;}
.about-copy .section-heading{
  position:relative;
  z-index:1;
  color:rgba(255,255,255,.97);
  text-shadow:0 2px 16px rgba(0,0,0,.46), 0 0 26px rgba(0,0,0,.24);
}
.about-copy .paint-ribbon{
  position:relative;
  z-index:1;
}
.footer#contact .footer-grid{align-items:flex-start;}
.footer#contact .footer-links{row-gap:14px;}


/* ===== V31 about ribbon readability fix ===== */
.about-copy .paint-ribbon{
  min-height:58px;
  padding:0 24px 0 20px;
}
.about-copy .paint-ribbon::before{
  background:linear-gradient(90deg, rgba(10,10,10,.96), rgba(18,18,18,.88) 56%, rgba(8,8,8,.8) 100%);
  box-shadow:0 0 0 1px rgba(255,255,255,.14), 0 12px 26px rgba(0,0,0,.34);
}
.about-copy .paint-ribbon::after{
  background:linear-gradient(90deg, rgba(255,255,255,.16), rgba(255,255,255,0));
  opacity:.62;
}
.about-copy .paint-ribbon span{
  color:rgba(255,255,255,.96);
  text-shadow:0 2px 14px rgba(0,0,0,.48);
}


/* Brush SVG cleanup override: keep only the three large background strokes */
.nav-links a::before,
.hero::before,
.hero-media::before,
.hero-media::after,
.eyebrow::before,
.paint-ribbon::before,
.paint-ribbon::after,
.section-label::before,
.weave-band::before,
.weave-band::after,
.weave-band:nth-child(even)::before,
.about-photo::before,
.project-row::before,
.project-row:nth-child(even)::before,
.project-row::after,
.project-media::before,
.project-copy::before,
.project-meta span::before,
.link-btn::before,
.link-btn::after,
.case-media::before,
.case-media::after,
.signal::before,
.signal::after,
.signal:nth-child(2)::before,
.signal-label::before,
.fact::after,
.paint-in::before,
.switch-stage::before,
.switch-stage::after,
.switch-jump::before,
.footer-links a::before,
.study-links a::before,
.project-media-link::before,
.project-media-link::after,
.open-pill::before,
.project-signal::before,
.project-signal::after,
.project-overlay-title span::before,
.project-signal-label::after,
.project-overlay-title::before,
.process-strip::before,
.process-card::before,
.process-card::after{content:none !important; display:none !important; background:none !important; box-shadow:none !important; filter:none !important; -webkit-mask:none !important; mask:none !important;}
.ink-stage .stroke,
.footer-line,
.project-paint-pass.paint-pass-one,
.project-paint-pass.paint-pass-two,
.project-overlay-meta{background:none !important; box-shadow:none !important; filter:none !important; -webkit-mask:none !important; mask:none !important;}
.ink-stage .stroke{display:none !important; background:none !important; -webkit-mask:none !important; mask:none !important;}


/* ===== mobile QoL patch: single-row nav + no case-page side overflow ===== */
@media (max-width: 760px){
  .site-header .inner{
    align-items:flex-start;
  }
  .nav-links{
    width:100%;
    flex-wrap:nowrap !important;
    justify-content:flex-start;
    overflow-x:auto;
    overflow-y:hidden;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:8px;
    padding-bottom:2px;
  }
  .nav-links::-webkit-scrollbar{display:none;}
  .nav-links a{
    flex:0 0 auto;
    white-space:nowrap;
    min-height:40px;
    padding:0 12px;
    font-size:.64rem;
    letter-spacing:.11em;
  }

  .case-head,
  .case-copy,
  .case-actions,
  .case-media,
  .story,
  .story-copy,
  .story-side,
  .signal-river,
  .process-strip,
  .process-card,
  .container{
    min-width:0;
  }
  .case-actions{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    width:100%;
  }
  .case-actions .link-btn,
  .link-line .link-btn{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
  }
  .case-actions .link-btn span,
  .link-line .link-btn span{
    white-space:normal;
    justify-content:center;
    text-align:center;
  }
  .case-media{
    padding-left:0;
    padding-right:0;
  }
}



@media (max-width: 760px){
  :root{ --header-h:114px; }
}

@media (max-width: 430px){
  :root{ --header-h:106px; }
}

/* ===== mobile QoL patch v2: no horizontal nav scroll, no page side drift ===== */
html,
body{
  max-width:100%;
  overflow-x:hidden;
}

@media (max-width: 760px){
  .site-header .inner{
    width:calc(100vw - 16px);
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:10px;
    padding:12px 0;
  }
  .brand{
    justify-content:flex-start;
    gap:10px;
  }
  .brand img{ width:36px; }
  .brand span,
  .brand{
    font-size:.68rem;
    letter-spacing:.18em;
  }
  .nav-links{
    width:100%;
    display:grid !important;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    gap:6px;
    overflow:visible !important;
    padding-bottom:0;
  }
  .nav-links a{
    min-width:0;
    width:100%;
    min-height:36px;
    padding:0 4px;
    white-space:nowrap;
    text-align:center;
    font-size:clamp(.48rem, 2.25vw, .60rem);
    letter-spacing:clamp(.02em, .18vw, .08em);
    line-height:1;
  }
  .nav-links a::before{
    content:none !important;
    display:none !important;
  }

  main,
  section,
  .container,
  .case-hero,
  .case-head,
  .case-copy,
  .case-actions,
  .case-media,
  .story,
  .story-copy,
  .story-side,
  .signal-river,
  .process-strip,
  .process-card,
  .link-line{
    max-width:100%;
    overflow-x:clip;
  }
  .case-actions,
  .link-line{
    display:grid;
    grid-template-columns:1fr;
    gap:10px;
    width:100%;
  }
  .case-actions .link-btn,
  .link-line .link-btn,
  .case-open-btn{
    min-width:0 !important;
    width:100%;
    max-width:100%;
    box-sizing:border-box;
  }
}

@media (max-width: 430px){
  .site-header .inner{ width:calc(100vw - 12px); gap:8px; }
  .nav-links{ gap:4px; }
  .nav-links a{
    min-height:34px;
    padding:0 2px;
    font-size:clamp(.43rem, 2.6vw, .54rem);
    letter-spacing:.015em;
    border-radius:999px;
  }
}


/* ===== folio item consistency patch: signal labels + mobile quick facts order ===== */
.signal-label{color:var(--soft) !important;}

@media (max-width: 760px){
  .story{display:flex;flex-direction:column;}
  .story-side{order:-1;margin-bottom:20px;}
  .story-copy{order:1;}
}


/* ===== QOL patch: case-study subhead visibility ===== */
.case-hero .paint-ribbon{
  min-height:auto;
  align-items:flex-start;
  padding:14px 24px 14px 20px;
}
.case-hero .paint-ribbon span{
  display:block;
  width:100%;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  line-height:1.32;
}

/* ===== QOL patch: living bulb cord + fluid swing ===== */
.bulb-cord-svg{
  overflow:visible;
}
.bulb-cord-path{
  stroke-width:2.35;
}
.bulb-hardware{
  will-change:transform;
}

/* ===== QOL4: portfolio-first home, inline video, performance ===== */
.home-anchor{position:relative;height:1px;pointer-events:none;}
.about-intro{max-width:82ch;margin-bottom:38px;}
.about-hero{margin-bottom:48px;}
.about-hero-heading{margin:0 0 16px;line-height:.94;font-size:clamp(3rem, 8vw, 6.35rem);letter-spacing:-.055em;max-width:10ch;text-wrap:balance;}
.about-hero-heading .line-1{font-weight:300;display:block;}
.about-hero-heading .line-2{font-weight:800;display:block;text-shadow:0 0 24px rgba(255,255,255,.08);}
.about-copy-standalone{max-width:76ch;margin-top:54px;}
.about-copy-standalone .paint-ribbon{max-width:100%;}

.about-display{
  margin:12px 0 16px;
  font-size:clamp(2.5rem, 7.4vw, 5.4rem);
  line-height:.94;
  letter-spacing:-.05em;
  text-wrap:balance;
}
.about-intro .paint-ribbon{margin:0 0 18px;display:inline-flex;max-width:100%;}
.capability-block{margin-top:40px;}
.capability-heading{margin:0 0 18px;font-size:clamp(1.8rem,4vw,3rem);letter-spacing:-.04em;line-height:.96;}
.switch-jump-about::after{content:"→";}
.video-inline-trigger{appearance:none;border:0;cursor:pointer;}
.video-poster{appearance:none;border:0;padding:0;text-align:left;width:100%;cursor:pointer;}
.video-embed-shell{
  position:relative;
  z-index:1;
  width:100%;
  aspect-ratio:16 / 10;
  min-height:320px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 18px 42px rgba(0,0,0,.4);
  overflow:hidden;
  background:#050505;
}
.video-embed-shell iframe{display:block;width:100%;height:100%;border:0;}

@supports (content-visibility:auto){
  .project-row,
  .process-strip,
  .story,
  .weave-stack,
  .about-layout,
  .footer-grid,
  .fact-list,
  .signal-river,
  .case-gallery,
  .support-grid,
  .support-strip,
  .image-grid{
    content-visibility:auto;
    contain-intrinsic-size:1px 780px;
  }
  #work,
  #about,
  .case-hero,
  .site-header,
  .switch-stage,
  .living-bulb{
    content-visibility:visible;
    contain-intrinsic-size:auto;
  }
}

@media (max-width: 900px){
  .about-intro{margin-bottom:28px;}
  .about-display{font-size:clamp(2.2rem, 10vw, 4rem);}
  .about-hero-heading{font-size:clamp(2.5rem,15vw,4.2rem);}
}

/* ===== PERF + ABOUT + VIDEO BUTTON FIX ===== */
.hero-portrait,.about-photo img{display:block;width:100%;height:auto;}
.about-layout{margin-top:54px;}
.about-photo img{object-fit:cover;}
.video-inline-trigger{appearance:none;-webkit-appearance:none;border:0;background:transparent;color:inherit;font:inherit;line-height:inherit;cursor:pointer;padding:0 22px;border-radius:0;box-shadow:none;}
.video-inline-trigger::-moz-focus-inner{border:0;padding:0;}
#ink-canvas,#dust-canvas{pointer-events:none;}
.low-power .project-media-link img,.coarse-pointer .project-media-link img{filter:grayscale(0) brightness(.92) blur(0)!important;transition:transform .35s ease,filter .35s ease,box-shadow .35s ease!important;}
.low-power .project-media::before,.low-power .project-row::after,.coarse-pointer .project-media::before,.coarse-pointer .project-row::after{opacity:.24!important;filter:none!important;}
.low-power .project-media-link:hover img,.low-power .project-media-link:focus-visible img,.coarse-pointer .project-media-link:hover img,.coarse-pointer .project-media-link:focus-visible img{transform:scale(1.018)!important;box-shadow:none!important;}
.low-power .bulb-aura,.coarse-pointer .bulb-aura{opacity:.72;}
.low-power .paint-reveal,.low-power .paint-in,.coarse-pointer .paint-reveal,.coarse-pointer .paint-in{transition-duration:.55s;}
body.low-power .switch-stage,body.coarse-pointer .switch-stage,body.low-power .site-header,body.coarse-pointer .site-header{backdrop-filter:none;}
@media (max-width: 900px){.about-layout{margin-top:40px;}}


/* ===== PERF TUNE + PRESENTATION RESTORE ===== */
.project-media img{height:auto;min-height:0;}
.project-media-link img{will-change:auto;}
#ink-canvas,#dust-canvas{contain:strict;}
.low-power .project-media-link::before,.low-power .project-media-link::after,.coarse-pointer .project-media-link::before,.coarse-pointer .project-media-link::after{display:none!important;}
.low-power .project-paint-pass,.coarse-pointer .project-paint-pass{display:none!important;}
.low-power .project-row::before,.low-power .project-row::after,.coarse-pointer .project-row::before,.coarse-pointer .project-row::after{opacity:.12!important;filter:none!important;}
.low-power .project-media-overlay,.coarse-pointer .project-media-overlay{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;}
.low-power .open-pill,.coarse-pointer .open-pill{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important;}

/* ===== Final fix: hero subtitle colour ===== */
.about-hero .paint-ribbon span{
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.48) !important;
}


/* ===== About anchor + subtitle robustness ===== */
#about{scroll-margin-top:calc(var(--header-h) + 20px);}
.about-hero .paint-ribbon{
  color: rgba(255,255,255,.96) !important;
  min-height:58px;
  padding:0 26px 0 22px;
}
.about-hero .paint-ribbon::before{
  background:linear-gradient(90deg, rgba(6,6,6,.9), rgba(18,18,18,.82) 56%, rgba(8,8,8,.72) 100%) !important;
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 12px 28px rgba(0,0,0,.4) !important;
}
.about-hero .paint-ribbon::after{
  background:linear-gradient(90deg, rgba(255,255,255,.18), rgba(255,255,255,0)) !important;
  opacity:.58 !important;
}
.about-hero .paint-ribbon span{
  color: rgba(255,255,255,.96) !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.52) !important;
  overflow: visible;
  text-overflow: clip;
}


/* ===== Intro about jump + subtitle hard fix ===== */
.about-hero .paint-ribbon,
.about-hero .paint-ribbon span,
.about-hero .paint-ribbon *{
  color: rgba(255,255,255,.96) !important;
}
.about-hero .paint-ribbon{
  background: transparent !important;
}


/* ===== perf9 subtitle plain text + about jump stability ===== */
.about-hero .hero-subtitle-plain{
  display:block;
  margin:24px 0 22px;
  padding:0;
  background:none !important;
  color:rgba(255,255,255,.96) !important;
  font-family:"IBM Plex Mono", monospace;
  font-size:clamp(.88rem,1.08vw,.96rem);
  line-height:1.2;
  letter-spacing:.28em;
  text-transform:uppercase;
  font-weight:500;
  text-shadow:0 2px 14px rgba(0,0,0,.52);
}
.about-hero .hero-subtitle-plain::before,
.about-hero .hero-subtitle-plain::after{content:none !important;}


/* ===== v41 surgical fixes ===== */
.about-photo img{width:calc(100% - 28px);max-width:calc(100% - 28px);margin-inline:auto;height:auto;aspect-ratio:auto;object-fit:contain;object-position:center top;}