*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#0c0d0d;color:#f2f3ee;font-family:"Manrope",Arial,sans-serif;overflow-x:hidden}.noise{position:fixed;inset:0;pointer-events:none;opacity:.04;z-index:99;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.45'/%3E%3C/svg%3E")}.topbar{position:fixed;top:0;left:0;right:0;height:72px;padding:0 clamp(24px,4vw,72px);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;z-index:50;border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(18px);background:rgba(12,13,13,.72);font-family:"Space Grotesk",sans-serif;font-size:12px;letter-spacing:.08em}.topbar a{color:#d8d9d4;text-decoration:none}.topbar nav{display:flex;gap:26px}.topbar .year{text-align:right;color:#777a73}.section-grid{position:relative;padding:clamp(90px,10vw,150px) clamp(24px,6vw,92px)}.hero{min-height:100svh;padding-top:140px;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);align-items:center;overflow:hidden}.grid-lines{position:absolute;inset:72px 0 0;background:linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),rgba(255,255,255,.035) 25%,transparent calc(25% + 1px),transparent calc(50% - 1px),rgba(255,255,255,.035) 50%,transparent calc(50% + 1px),transparent calc(75% - 1px),rgba(255,255,255,.035) 75%,transparent calc(75% + 1px));pointer-events:none}.hero-copy{z-index:2;max-width:920px}.eyebrow,.section-kicker,.tags,.coordinates,.availability,.small{font-family:"Space Grotesk",sans-serif;letter-spacing:.1em;text-transform:uppercase}.eyebrow{font-size:12px;color:#7b7f76;margin:0 0 36px}.hero h1{font-family:"Space Grotesk",sans-serif;font-weight:400;font-size:clamp(48px,6.7vw,118px);line-height:.95;letter-spacing:-.055em;margin:0}.hero h1 span{display:block}.hero h1 em,.about h2 em,.quiz-cta h2 em,.contact h2 em{color:#b7ff00;font-style:normal}.lead{font-size:clamp(18px,2vw,28px);line-height:1.45;color:#b6b8b1;max-width:700px;margin:46px 0 36px}.hero-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.text-link,.pill{color:#f2f3ee;text-decoration:none;font-family:"Space Grotesk",sans-serif;font-size:13px;letter-spacing:.06em}.pill{display:inline-flex;padding:14px 18px;border-radius:999px;transition:.25s ease}.pill-outline{border:1px solid rgba(255,255,255,.22)}.pill-outline:hover{border-color:#b7ff00;color:#b7ff00;transform:translateY(-2px)}.pill-lime{background:#b7ff00;color:#0b0c0c;font-weight:600;padding:16px 22px}.pill-lime:hover{transform:translateY(-2px) rotate(-1deg);box-shadow:0 14px 40px rgba(183,255,0,.12)}.hero-object{position:relative;height:min(64vw,760px);min-height:500px;z-index:1}.orb,.glass-ring,.lime-flare{position:absolute}.orb-a{width:68%;aspect-ratio:1;right:4%;top:12%;border-radius:42% 58% 51% 49%/55% 38% 62% 45%;background:radial-gradient(circle at 35% 25%,rgba(255,255,255,.34),rgba(90,96,90,.07) 31%,rgba(0,0,0,.8) 72%),linear-gradient(145deg,#1d201f,#020303);box-shadow:inset -35px -25px 75px rgba(0,0,0,.7),inset 18px 12px 40px rgba(255,255,255,.05),0 40px 120px rgba(0,0,0,.55);transform:rotate(-18deg)}.orb-b{width:38%;aspect-ratio:1;left:2%;bottom:7%;border-radius:50%;background:radial-gradient(circle at 32% 25%,#353936 0,#111312 40%,#030404 78%);border:1px solid rgba(255,255,255,.08)}.glass-ring{width:60%;aspect-ratio:1;right:-9%;bottom:-6%;border-radius:50%;border:1px solid rgba(220,255,229,.25);box-shadow:inset 0 0 55px rgba(194,255,204,.05),0 0 80px rgba(183,255,0,.05);transform:rotate(24deg)}.lime-flare{width:160px;height:160px;right:12%;top:22%;border-radius:50%;background:#b7ff00;filter:blur(70px);opacity:.18}.availability{position:absolute;right:6vw;bottom:7vw;color:#7f827a;font-size:12px;display:flex;align-items:center;gap:9px}.dot{width:8px;height:8px;background:#b7ff00;border-radius:50%;box-shadow:0 0 20px rgba(183,255,0,.5)}.coordinates{position:absolute;left:6vw;bottom:7vw;color:#656860;font-size:11px}.services{border-top:1px solid rgba(255,255,255,.08)}.section-kicker{font-size:13px;color:#7f827a;margin-bottom:48px}.service-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.08)}.service{position:relative;padding:38px;background:#0c0d0d;min-height:260px;transition:.3s ease}.service:hover{background:#111313;transform:translateY(-6px)}.num{color:#b7ff00;font-family:"Space Grotesk",sans-serif}.service .num{display:block;margin-bottom:72px}.service h2,.case h2{font-family:"Space Grotesk",sans-serif;font-weight:500;letter-spacing:-.025em}.service h2{font-size:clamp(22px,2vw,34px);margin:0 0 18px}.service p,.case p,.step p,.about-copy p,.quiz-copy p,.contact-copy p{color:#979b92;line-height:1.65}.works{border-top:1px solid rgba(255,255,255,.08)}.case{display:grid;grid-template-columns:minmax(260px,.42fr) minmax(0,1fr);gap:clamp(34px,6vw,100px);align-items:center;margin:0 0 clamp(110px,13vw,190px)}.case-drive{grid-template-columns:minmax(0,1fr) minmax(260px,.42fr)}.case-meta{max-width:430px}.case-meta .num{display:block;margin-bottom:20px}.case h2{font-size:clamp(32px,4vw,68px);line-height:1.04;margin:0 0 26px}.tags{display:inline-block;color:#747970;font-size:11px;margin-top:18px}.media-frame{overflow:hidden;background:#121414;border:1px solid rgba(255,255,255,.08);position:relative}.media-frame::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);pointer-events:none}.media-frame img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.media-frame:hover img{transform:scale(1.025)}.sport-frame{aspect-ratio:16/9}.drive-frame{aspect-ratio:1/1;max-width:880px}.process{border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:.35fr 1fr;gap:8vw}.process-list{display:grid}.step{display:grid;grid-template-columns:70px 1fr;gap:24px;padding:30px 0;border-bottom:1px solid rgba(255,255,255,.08)}.step>span{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#b7ff00;color:#090a0a;font-family:"Space Grotesk",sans-serif}.step h3{margin:2px 0 7px;font-family:"Space Grotesk",sans-serif}.step p{margin:0}.about{border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:1fr 1fr;gap:10vw;align-items:start}.about-statement h2,.quiz-cta h2,.contact h2{font-family:"Space Grotesk",sans-serif;font-weight:500;letter-spacing:-.045em}.about-statement h2{font-size:clamp(44px,6vw,92px);line-height:.95;margin:0}.about-copy{padding-top:42px}.about-copy p{font-size:clamp(17px,1.6vw,22px);margin:0 0 30px}.about-copy mark{background:none;color:#b7ff00}.quiz-cta{border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:1fr .55fr;gap:8vw;align-items:end}.quiz-cta h2{font-size:clamp(48px,6vw,96px);line-height:.94;margin:0 0 28px}.quiz-copy p{max-width:640px;font-size:18px;margin:0 0 32px}.quiz-stat{justify-self:end;text-align:right}.quiz-stat .big{display:block;font-family:"Space Grotesk",sans-serif;font-size:clamp(68px,9vw,150px);color:#202320;letter-spacing:-.06em}.quiz-stat .small{color:#666a62;font-size:10px}.contact{min-height:86svh;border-top:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:1fr .42fr;align-content:center;gap:8vw;padding-bottom:72px}.contact h2{font-size:clamp(58px,8vw,132px);line-height:.88;margin:0 0 34px}.contact-copy p{max-width:640px;font-size:18px}.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:22px;justify-content:center}.contact-links a{font-family:"Space Grotesk",sans-serif;color:#f2f3ee;text-decoration:none;font-size:18px;border-bottom:1px solid #343733;padding-bottom:8px;transition:.2s}.contact-links a:hover{color:#b7ff00;border-color:#b7ff00}.footer{position:absolute;left:6vw;right:6vw;bottom:28px;display:flex;justify-content:space-between;color:#62665f;font-family:"Space Grotesk",sans-serif;font-size:10px;letter-spacing:.1em}.reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s ease}.reveal.in{opacity:1;transform:none}@media(max-width:900px){.topbar{grid-template-columns:1fr auto}.topbar nav{display:none}.topbar .year{display:none}.hero{grid-template-columns:1fr;align-content:center;padding-top:120px}.hero-object{position:absolute;right:-22%;top:18%;width:72%;opacity:.48}.hero-copy{position:relative;z-index:4}.lead{max-width:560px}.availability{right:24px;bottom:28px}.coordinates{left:24px;bottom:28px}.service-list{grid-template-columns:1fr}.service .num{margin-bottom:34px}.case,.case-drive{grid-template-columns:1fr}.case-drive .media-frame{order:2}.case-drive .case-meta{order:1}.drive-frame{max-width:none}.process,.about,.quiz-cta,.contact{grid-template-columns:1fr}.quiz-stat{justify-self:start;text-align:left}.contact{min-height:80svh}.footer{left:24px;right:24px}}@media(max-width:560px){.topbar{height:62px;padding:0 18px}.brand{font-size:10px}.section-grid{padding:82px 20px}.hero{min-height:100svh;padding-top:96px;padding-bottom:120px}.hero h1{font-size:clamp(45px,15vw,76px)}.hero h1 span:last-child{max-width:92%}.hero-object{width:100%;right:-38%;top:33%;opacity:.42}.lead{font-size:17px;margin-top:34px}.hero-actions{align-items:flex-start;flex-direction:column}.coordinates{display:none}.availability{left:20px;right:auto}.case{margin-bottom:100px}.case h2{font-size:38px}.process{gap:20px}.step{grid-template-columns:54px 1fr}.about-statement h2{font-size:51px}.about-copy{padding-top:0}.quiz-cta h2{font-size:52px}.quiz-stat .big{font-size:74px}.contact h2{font-size:62px}.footer{flex-direction:column;gap:8px}}


/* V2 readability + active status */
.section-kicker{
  font-size:16px;
  color:#d5d7d1;
  font-weight:500;
  letter-spacing:.12em;
}
.availability{
  font-size:14px;
  color:#c8cbc3;
  font-weight:500;
}
.dot{
  animation:statusPulse 1.55s ease-in-out infinite;
}
@keyframes statusPulse{
  0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(183,255,0,.45),0 0 18px rgba(183,255,0,.55)}
  50%{transform:scale(1.22);box-shadow:0 0 0 9px rgba(183,255,0,0),0 0 28px rgba(183,255,0,.85)}
}

/* Buttons that behave like links */
button.pill,.contact-button{
  font-family:"Space Grotesk",sans-serif;
  cursor:pointer;
}
button.pill{border-width:1px}
.contact-button{
  background:none;border:0;border-bottom:1px solid #343733;
  color:#f2f3ee;padding:0 0 8px;font-size:18px;text-align:left;
  transition:.2s;
}
.contact-button:hover{color:#b7ff00;border-color:#b7ff00}

/* Custom dark/digital quiz */
.quiz-modal{
  position:fixed;inset:0;z-index:120;display:none;
}
.quiz-modal.open{display:block}
.quiz-backdrop{
  position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(18px);
}
.quiz-shell{
  position:absolute;inset:clamp(14px,3vw,42px);
  background:#0c0d0d;border:1px solid rgba(255,255,255,.1);
  box-shadow:0 30px 120px rgba(0,0,0,.55);
  overflow:auto;
}
.quiz-topline{
  height:68px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-family:"Space Grotesk",sans-serif;font-size:11px;letter-spacing:.12em;color:#7d8178;
}
.quiz-close{
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.16);
  background:transparent;color:#f2f3ee;font-size:24px;cursor:pointer;line-height:1;
}
.quiz-progress{height:2px;background:#171a18}
.quiz-progress-bar{height:100%;width:20%;background:#b7ff00;transition:width .35s ease}
.quiz-body{
  min-height:calc(100% - 70px);
  display:grid;grid-template-columns:minmax(220px,.34fr) 1fr;
}
.quiz-aside{
  position:relative;padding:48px 34px;border-right:1px solid rgba(255,255,255,.08);overflow:hidden;
}
.quiz-step-label{
  font-family:"Space Grotesk",sans-serif;color:#b7ff00;font-size:13px;letter-spacing:.1em;
}
.quiz-aside p{
  position:absolute;left:34px;bottom:36px;max-width:220px;color:#6f736a;line-height:1.5;font-size:13px;
}
.quiz-aside-orb{
  position:absolute;width:250px;height:250px;border-radius:50%;left:-70px;top:28%;
  background:
    radial-gradient(circle at 35% 25%,rgba(255,255,255,.26),rgba(42,46,43,.12) 28%,rgba(0,0,0,.8) 72%),
    linear-gradient(145deg,#1c201d,#030403);
  box-shadow:inset -30px -20px 65px rgba(0,0,0,.75),0 30px 80px rgba(0,0,0,.5);
}
.quiz-aside-orb::after{
  content:"";position:absolute;width:80px;height:80px;border-radius:50%;right:-12px;top:26px;
  background:#b7ff00;filter:blur(35px);opacity:.25;
}
.quiz-stage{padding:clamp(36px,5vw,76px);display:flex;align-items:center}
#portfolioQuiz{width:min(880px,100%)}
.quiz-slide{display:none}
.quiz-slide.active{display:block;animation:quizIn .35s ease}
@keyframes quizIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.quiz-kicker{
  margin:0 0 16px;color:#b7ff00;font-family:"Space Grotesk",sans-serif;
  font-size:12px;letter-spacing:.12em;
}
.quiz-slide h3{
  margin:0 0 32px;font-family:"Space Grotesk",sans-serif;
  font-size:clamp(34px,4.6vw,72px);line-height:1.02;letter-spacing:-.04em;font-weight:500;
}
.quiz-hint{margin:-18px 0 26px;color:#777b72}
.quiz-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.quiz-options label{display:block;cursor:pointer}
.quiz-options input{position:absolute;opacity:0;pointer-events:none}
.quiz-options span{
  display:flex;align-items:center;min-height:68px;padding:16px 18px;
  border:1px solid rgba(255,255,255,.12);background:#101211;
  color:#d9dbd5;transition:.2s;font-size:15px;
}
.quiz-options label:hover span{border-color:rgba(183,255,0,.48);transform:translateY(-2px)}
.quiz-options input:checked + span{
  border-color:#b7ff00;background:rgba(183,255,0,.08);color:#f4f5ef;
  box-shadow:inset 3px 0 0 #b7ff00;
}
.quiz-controls{
  margin-top:34px;display:flex;justify-content:space-between;align-items:center;
  border-top:1px solid rgba(255,255,255,.08);padding-top:22px;
}
.quiz-back,.quiz-next{
  background:none;border:0;color:#777b72;font-family:"Space Grotesk",sans-serif;
  font-size:12px;letter-spacing:.08em;cursor:pointer;padding:10px 0;
}
.quiz-next{color:#f0f1ec}
.quiz-back:disabled{opacity:.2;cursor:default}
.quiz-result p{color:#979b92;line-height:1.6;max-width:680px}
.quiz-fields{display:grid;gap:12px;margin:28px 0 24px}
.quiz-fields input{
  width:100%;height:58px;padding:0 16px;background:#101211;color:#f2f3ee;
  border:1px solid rgba(255,255,255,.12);outline:none;font:inherit;
}
.quiz-fields input:focus{border-color:#b7ff00}
.quiz-note{font-size:12px!important;color:#656960!important;margin-top:18px}
body.quiz-open{overflow:hidden}

@media(max-width:800px){
  .quiz-shell{inset:8px}
  .quiz-body{grid-template-columns:1fr}
  .quiz-aside{display:none}
  .quiz-stage{padding:34px 20px 28px}
  .quiz-options{grid-template-columns:1fr}
  .quiz-topline{padding:0 18px}
}


/* V3 interaction polish */
.topbar nav a{
  transition:color .2s ease, transform .2s ease;
}
.topbar nav a:hover{
  color:#b7ff00;
  transform:translateY(-1px);
}

/* Hero project button: dark base, visible text, lime hover */
.hero-project-btn{
  appearance:none;
  border:1px solid rgba(183,255,0,.62);
  background:#111311;
  color:#f2f3ee;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02);
  transition:background .22s ease,color .22s ease,border-color .22s ease,
             transform .22s ease,box-shadow .22s ease;
}
.hero-project-btn:hover{
  background:#b7ff00;
  color:#0a0b0b;
  border-color:#b7ff00;
  transform:translateY(-2px);
  box-shadow:0 12px 36px rgba(183,255,0,.16);
}
.hero-project-btn:focus-visible{
  outline:2px solid #b7ff00;
  outline-offset:4px;
}

/* Make section labels more visible, but still secondary */
.section-kicker{
  text-shadow:0 0 22px rgba(255,255,255,.03);
}


/* V4 spacing and process refinements */

/* More breathing room between small section label and large statement */
.about-statement .section-kicker{
  display:block;
  margin-bottom:72px;
}

.quiz-copy .section-kicker{
  display:block;
  margin-bottom:72px;
}

/* HOW I WORK — lighter numerals, no large green circles */
.step{
  position:relative;
  grid-template-columns:72px 1fr;
  padding:34px 18px 34px 0;
  transition:background .25s ease, transform .25s ease, padding-left .25s ease;
}

.step>span{
  width:auto;
  height:auto;
  border-radius:0;
  display:block;
  background:none;
  color:#b7ff00;
  box-shadow:none;
  font-family:"Space Grotesk",sans-serif;
  font-size:28px;
  font-weight:500;
  letter-spacing:-.04em;
  line-height:1;
  padding-top:2px;
  opacity:.9;
  transition:color .25s ease, transform .25s ease, opacity .25s ease;
}

.step:hover{
  background:#111313;
  transform:translateX(4px);
  padding-left:16px;
}

.step:hover>span{
  color:#d9ff72;
  transform:translateX(4px);
  opacity:1;
}

.step:hover h3{
  color:#b7ff00;
}

.step h3{
  transition:color .25s ease;
}

/* Mobile keeps the numerals compact */
@media(max-width:560px){
  .about-statement .section-kicker,
  .quiz-copy .section-kicker{
    margin-bottom:44px;
  }

  .step{
    grid-template-columns:48px 1fr;
    padding-right:0;
  }

  .step>span{
    font-size:22px;
  }
}


/* V5 — Selected Works image fit + smoother quiz interactions */
.sport-frame{
  aspect-ratio:auto;
  background:#0f1110;
  display:flex;
  align-items:center;
  justify-content:center;
}
.sport-frame img{
  width:100%;
  height:auto;
  object-fit:contain;
  object-position:center;
}

.quiz-options span{
  transition:
    border-color .34s ease,
    background-color .34s ease,
    color .34s ease,
    transform .34s cubic-bezier(.2,.7,.2,1),
    box-shadow .34s ease;
}
.quiz-options label:hover span{
  border-color:rgba(183,255,0,.58);
  background:rgba(183,255,0,.035);
  transform:translateY(-1px);
  box-shadow:0 10px 28px rgba(183,255,0,.035);
}
.quiz-options input:checked + span{
  border-color:#b7ff00;
  background:rgba(183,255,0,.085);
  color:#f4f5ef;
  box-shadow:inset 3px 0 0 #b7ff00,0 10px 30px rgba(183,255,0,.04);
}

.quiz-back{
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:12px 18px;
  color:#c7cac3;
  font-size:13px;
  transition:
    color .24s ease,
    border-color .24s ease,
    background-color .24s ease,
    transform .24s ease;
}
.quiz-back:hover:not(:disabled){
  color:#0a0b0b;
  border-color:#b7ff00;
  background:#b7ff00;
  transform:translateX(-2px);
}
.quiz-back:disabled{
  opacity:.18;
  cursor:default;
}
.quiz-next.auto-hidden{
  visibility:hidden;
  pointer-events:none;
}


/* V6.1 — Netlify Telegram delivery */
.quiz-submit[disabled]{
  opacity:.65;
  cursor:wait;
  transform:none!important;
}
.quiz-status{
  min-height:24px;
  margin:14px 0 0;
  font-size:13px;
  color:#7f837a;
}
.quiz-status.success{color:#b7ff00}
.quiz-status.error{color:#ff7f7f}


/* V6.4 — anti-spam + accessibility polish */
.hp-field{
  position:absolute!important;
  left:-9999px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.quiz-options input:focus-visible + span,
.quiz-fields input:focus-visible,
.quiz-back:focus-visible,
.quiz-next:focus-visible,
.quiz-submit:focus-visible{
  outline:2px solid #b7ff00;
  outline-offset:3px;
}


/* V6.5 — clearer quiz navigation */
.quiz-next{
  border:1px solid rgba(255,255,255,.14);
  border-radius:999px;
  padding:12px 18px;
  color:#c7cac3;
  transition:
    color .24s ease,
    border-color .24s ease,
    background-color .24s ease,
    box-shadow .24s ease,
    transform .24s ease;
}

.quiz-next:hover:not(:disabled),
.quiz-next:focus-visible{
  color:#0a0b0b;
  border-color:#b7ff00;
  background:#b7ff00;
  box-shadow:0 0 0 1px rgba(183,255,0,.25), 0 0 26px rgba(183,255,0,.22);
  transform:translateX(2px);
}


/* V6.7 — Selected Works 2.0 */
.works-v2{
  border-top:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}
.works-v2-head{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(280px,.34fr);
  gap:6vw;
  align-items:end;
  margin-bottom:clamp(42px,6vw,84px);
}
.works-v2-head h2{
  margin:18px 0 0;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(42px,5.8vw,92px);
  line-height:.92;
  font-weight:500;
  letter-spacing:-.045em;
}
.works-v2-head h2 em{color:#b7ff00;font-style:normal}
.works-v2-head p{
  margin:0 0 8px;
  color:#858a82;
  line-height:1.65;
  max-width:420px;
}
.works-v2-grid{
  display:grid;
  grid-template-columns:1.16fr 1fr 1fr;
  gap:14px;
}
.work-card{
  min-width:0;
}
.work-media{
  width:100%;
  padding:0;
  border:1px solid rgba(255,255,255,.1);
  background:#0d0f0e;
  color:#f2f3ee;
  position:relative;
  overflow:hidden;
  cursor:pointer;
  aspect-ratio:4/5;
  text-align:left;
}
.work-card:first-child .work-media{aspect-ratio:1/1}
.work-media::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:
    linear-gradient(180deg,rgba(6,8,7,.54) 0%,transparent 25%,transparent 67%,rgba(5,6,6,.68) 100%);
  transition:background .35s ease;
}
.work-media::after{
  content:"";
  position:absolute;
  inset:-40%;
  z-index:2;
  background:radial-gradient(circle at 50% 52%,rgba(183,255,0,.12),transparent 32%);
  opacity:0;
  transition:opacity .35s ease;
  pointer-events:none;
}
.work-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  transition:transform .75s cubic-bezier(.2,.7,.2,1),filter .4s ease;
}
.work-card:first-child .work-media img{object-position:center center}
.work-media:hover img,
.work-media:focus-visible img{
  transform:scale(1.035);
  filter:contrast(1.04) saturate(1.03);
}
.work-media:hover::after,
.work-media:focus-visible::after{opacity:1}
.work-media:focus-visible{outline:2px solid #b7ff00;outline-offset:4px}
.work-index,.work-category,.work-view{
  position:absolute;
  z-index:3;
  font-family:"Space Grotesk",sans-serif;
  letter-spacing:.08em;
}
.work-index{
  top:22px;
  left:22px;
  color:#b7ff00;
  font-size:18px;
}
.work-category{
  top:24px;
  right:22px;
  color:rgba(242,243,238,.78);
  font-size:9px;
}
.work-view{
  left:22px;
  bottom:22px;
  font-size:10px;
  color:#b7ff00;
  transform:translateY(4px);
  transition:transform .3s ease,color .3s ease;
}
.work-media:hover .work-view{transform:none;color:#d9ff75}
.work-copy{
  padding:22px 2px 8px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.work-copy h3{
  margin:0 0 8px;
  font-family:"Space Grotesk",sans-serif;
  font-size:clamp(22px,2vw,34px);
  font-weight:500;
  letter-spacing:-.03em;
}
.work-copy p{
  margin:0 0 18px;
  color:#767b74;
  line-height:1.55;
  font-size:13px;
}
.works-v2-foot{
  margin-top:28px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  justify-content:space-between;
  color:#595e57;
  font-size:9px;
  letter-spacing:.16em;
  font-family:"Space Grotesk",sans-serif;
}

/* Work preview lightbox */
.work-lightbox{
  position:fixed;
  inset:0;
  z-index:120;
  display:none;
  place-items:center;
  padding:24px;
}
.work-lightbox.open{display:grid}
.work-lightbox-backdrop{
  position:absolute;
  inset:0;
  border:0;
  background:rgba(3,4,4,.88);
  backdrop-filter:blur(14px);
  cursor:zoom-out;
}
.work-lightbox-panel{
  position:relative;
  z-index:2;
  width:min(1120px,94vw);
  max-height:92vh;
  background:#0b0d0c;
  border:1px solid rgba(255,255,255,.1);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  box-shadow:0 30px 100px rgba(0,0,0,.45);
}
.work-lightbox-top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:30px;
  padding:18px 22px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.work-lightbox-top span{
  display:block;
  color:#6e746b;
  font-size:9px;
  letter-spacing:.14em;
  margin-bottom:6px;
}
.work-lightbox-top h3{
  margin:0;
  font-family:"Space Grotesk",sans-serif;
  font-size:22px;
  font-weight:500;
}
.work-lightbox-close{
  width:38px;
  height:38px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.15);
  background:#101211;
  color:#f2f3ee;
  font-size:24px;
  line-height:1;
  cursor:pointer;
  transition:.2s ease;
}
.work-lightbox-close:hover{
  color:#0a0b0b;
  background:#b7ff00;
  border-color:#b7ff00;
}
.work-lightbox-image{
  min-height:0;
  overflow:auto;
  display:grid;
  place-items:center;
  background:#080909;
}
.work-lightbox-image img{
  max-width:100%;
  width:auto;
  height:auto;
  display:block;
}

@media(max-width:980px){
  .works-v2-head{grid-template-columns:1fr}
  .works-v2-grid{grid-template-columns:1fr 1fr}
  .work-card:first-child{grid-column:1/-1}
  .work-card:first-child .work-media{aspect-ratio:16/10}
}
@media(max-width:640px){
  .works-v2-grid{grid-template-columns:1fr}
  .work-card:first-child{grid-column:auto}
  .work-card:first-child .work-media,
  .work-media{aspect-ratio:4/5}
  .works-v2-foot{gap:20px;align-items:flex-end}
  .works-v2-foot span:last-child{text-align:right}
  .work-lightbox{padding:10px}
  .work-lightbox-panel{width:100%;max-height:96vh}
}


/* V6.8 — Selected Works polish */
.work-format-note{
  position:absolute;
  z-index:3;
  top:52px;
  right:22px;
  max-width:210px;
  color:rgba(242,243,238,.66);
  font-family:"Space Grotesk",sans-serif;
  font-size:9px;
  line-height:1.35;
  letter-spacing:.06em;
  text-align:right;
}

@media(max-width:640px){
  .work-format-note{
    top:50px;
    right:18px;
    max-width:150px;
    font-size:8px;
  }
}


/* V6.9 — full Web Design/UI artwork + quiz accent */
.work-card[data-case="web-ui"] .work-media{
  aspect-ratio:2 / 3;
  background:#080909;
}
.work-card[data-case="web-ui"] .work-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  transform:none;
}
.work-card[data-case="web-ui"] .work-media:hover img,
.work-card[data-case="web-ui"] .work-media:focus-visible img{
  transform:scale(1.01);
}

.work-lightbox-image img{
  max-width:100%;
  max-height:calc(92vh - 88px);
  width:auto;
  height:auto;
  object-fit:contain;
  margin:auto;
}

.quiz-result-accent{
  color:#b7ff00;
}

/* V6.10 — unify Selected Works card heights and use full-image lightbox */
.work-card[data-case="web-ui"] .work-media{
  aspect-ratio:4 / 5;
  background:#0d0f0e;
}
.work-card[data-case="web-ui"] .work-media img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center top;
  transform:none;
}
.work-card[data-case="web-ui"] .work-media:hover img,
.work-card[data-case="web-ui"] .work-media:focus-visible img{
  transform:scale(1.035);
}