/* =====================================================================
   STUDIO NEFES — unseen.co near-clone
   Faithful structural clone of unseen.co in the Studio Nefes skin.
   Reskin: change the --ground / --ink / --paper tokens below and done.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500&family=Hanken+Grotesk:wght@400;500;600;700&display=swap');

:root{
  /* --- SKIN: dark indigo (Studio Nefes) --- */
  --ground:#131232;      /* deep indigo ground           */
  --paper:#1d1b46;       /* raised indigo panel          */
  --ink:#ECEAFB;         /* soft lavender-white text     */
  --ink-soft:#9994ca;    /* muted lavender               */
  --line:rgba(236,234,251,.14);
  --panel:#0b0a20;       /* near-black indigo (menu)     */
  --panel-ink:#ECEAFB;   /* menu text                    */

  /* --- type --- */
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;

  --ease:cubic-bezier(.62,.05,.01,.99);
  --pad:clamp(20px,4.5vw,64px);
}

*{margin:0;padding:0;box-sizing:border-box}
html{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body{
  background:var(--ground);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16px;
  line-height:1.4;
  overflow-x:hidden;
  cursor:none;
}
@media (hover:none){body{cursor:auto}}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
::selection{background:var(--ink);color:var(--ground)}

/* ---------- custom cursor (unseen has one) ---------- */
.cursor{
  position:fixed;top:0;left:0;width:9px;height:9px;border-radius:50%;
  background:var(--ink);pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  transition:width .3s var(--ease),height .3s var(--ease),background .3s var(--ease);
  mix-blend-mode:difference;
}
.cursor.is-hover{width:46px;height:46px;background:#fff}
@media (hover:none){.cursor{display:none}}

/* ---------- preloader ---------- */
.loader{
  position:fixed;inset:0;z-index:900;background:var(--ground);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:26px;
}
.loader__glyph{
  font-family:var(--sans);font-weight:400;
  font-size:clamp(56px,9vw,120px);line-height:1;color:var(--ink);
  min-height:1em;
}
.loader__meta{text-align:center;opacity:0;transition:opacity .8s var(--ease)}
.loader__meta.show{opacity:1}
.loader__mark{font-size:15px;letter-spacing:.04em;margin-bottom:12px}
.loader__tag{font-size:14px;line-height:1.6;color:var(--ink);max-width:34ch}
.loader.done{opacity:0;visibility:hidden;transition:opacity .7s var(--ease),visibility .7s}

/* ---------- fixed chrome ---------- */
.chrome{position:fixed;inset:0;z-index:200;pointer-events:none;mix-blend-mode:normal}
.chrome a,.chrome button{pointer-events:auto}

.brand{
  position:fixed;top:var(--pad);left:var(--pad);z-index:210;
  font-size:15px;letter-spacing:.03em;font-weight:500;
}
.brand span{font-family:var(--serif);font-style:italic;font-weight:400}

/* top-right nav */
.nav{
  position:fixed;top:var(--pad);right:var(--pad);z-index:210;
  display:flex;gap:30px;font-size:14px;
}
.nav a{position:relative;display:inline-flex;gap:7px;align-items:baseline}
.nav a .num{font-size:11px;color:var(--ink-soft)}
.nav a::after{
  content:"";position:absolute;left:0;bottom:-4px;height:1px;width:100%;
  background:var(--ink);transform:scaleX(0);transform-origin:right;
  transition:transform .45s var(--ease);
}
.nav a:hover::after,.nav a.active::after{transform:scaleX(1);transform-origin:left}
.nav .menu-btn{display:none}

/* bottom-left status + sound */
.status{
  position:fixed;bottom:var(--pad);left:var(--pad);z-index:210;
  font-size:12px;color:var(--ink-soft);letter-spacing:.02em;
}
.sound{
  position:fixed;bottom:var(--pad);right:var(--pad);z-index:210;
  display:flex;align-items:center;gap:10px;font-size:12px;color:var(--ink-soft);
  background:none;border:0;letter-spacing:.06em;text-transform:uppercase;font-family:var(--sans);
}
.sound .bars{display:flex;align-items:flex-end;gap:2px;height:12px}
.sound .bars i{width:2px;height:4px;background:var(--ink-soft);display:block}
.sound.on .bars i{animation:eq .9s var(--ease) infinite alternate}
.sound.on .bars i:nth-child(2){animation-delay:.15s}
.sound.on .bars i:nth-child(3){animation-delay:.3s}
.sound.on .bars i:nth-child(4){animation-delay:.45s}
@keyframes eq{to{height:12px}}

/* ---------- dark menu overlay ---------- */
.menu{
  position:fixed;inset:0;z-index:400;background:var(--panel);color:var(--panel-ink);
  clip-path:inset(0 0 100% 0);transition:clip-path .8s var(--ease);
  display:flex;flex-direction:column;justify-content:center;padding:var(--pad);
}
.menu.open{clip-path:inset(0 0 0 0)}
.menu__nav{display:flex;flex-direction:column;gap:2px}
.menu__nav a{
  font-family:var(--serif);font-weight:300;font-size:clamp(44px,9vw,104px);
  line-height:1.02;letter-spacing:-.02em;color:var(--panel-ink);
  display:flex;align-items:baseline;gap:18px;opacity:.55;transition:opacity .4s var(--ease),transform .5s var(--ease);
  transform:translateY(14px);
}
.menu.open .menu__nav a{transform:translateY(0)}
.menu__nav a .n{font-family:var(--sans);font-size:14px;opacity:.6;font-weight:400}
.menu__nav a:hover{opacity:1}
.menu__foot{
  display:flex;flex-wrap:wrap;gap:26px 40px;margin-top:6vh;
  font-size:13px;letter-spacing:.04em;text-transform:uppercase;opacity:.7;
}
.menu__foot a:hover{opacity:1;text-decoration:underline;text-underline-offset:4px}
.menu__close{
  position:absolute;top:var(--pad);right:var(--pad);background:none;border:0;
  color:var(--panel-ink);font-family:var(--sans);font-size:14px;letter-spacing:.06em;
  text-transform:uppercase;cursor:none;
}

/* ---------- generic page ---------- */
.page{min-height:100vh;padding:calc(var(--pad) + 42px) var(--pad) calc(var(--pad) + 64px)}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.in{opacity:1;transform:none}

/* ---------- HOME ---------- */
.home{
  position:relative;
  min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;gap:30px;padding:var(--pad);
}
/* rotating scroll badge (unseen has one) */
.badge{
  position:absolute;bottom:calc(var(--pad) - 4px);left:50%;transform:translateX(-50%);
  width:104px;height:104px;
}
.badge svg{width:100%;height:100%;animation:spin 18s linear infinite}
.badge text{font-family:var(--sans);font-size:9.4px;letter-spacing:.18em;fill:var(--ink-soft);text-transform:uppercase}
.badge .mid{position:absolute;inset:0;display:grid;place-items:center;font-size:17px;color:var(--ink)}
@keyframes spin{to{transform:rotate(360deg)}}
@media (max-width:760px){.badge{display:none}}

/* WebGL hero light-field (desktop) sits behind hero content */
.home>*{position:relative;z-index:1}
.hero-field{position:absolute!important;inset:0;width:100%;height:100%;z-index:0!important;pointer-events:none;display:block}

/* home sub-sections */
.home-sec{max-width:1400px;margin:0 auto;padding:min(12vh,120px) var(--pad)}
.home-sec + .home-sec{padding-top:0}
.sec-label{font-size:14px;letter-spacing:.02em;font-weight:600;margin-bottom:min(7vh,70px)}
.sec-label::before{content:"";display:inline-block;width:30px;height:1px;background:var(--ink);vertical-align:middle;margin-right:14px}
.cta-line{display:flex;flex-wrap:wrap;gap:20px 44px;align-items:baseline;margin-top:40px}
.cta-line a.email{font-family:var(--serif);font-size:clamp(22px,3vw,38px);position:relative}
.cta-line a.email::after{content:"";position:absolute;left:0;bottom:2px;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.cta-line a.email:hover::after{transform:scaleX(1);transform-origin:left}
.cta-line a.start{font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);display:inline-flex;gap:9px;align-items:center}
.cta-line a.start .arrow{transition:transform .4s var(--ease)}
.cta-line a.start:hover .arrow{transform:translate(4px,-4px)}
.home__word{
  font-family:var(--sans);font-weight:400;
  font-size:clamp(64px,15vw,220px);line-height:.9;letter-spacing:-.02em;
}
.home__mark{font-size:15px;letter-spacing:.05em;font-weight:500}
.home__mark span{font-family:var(--serif);font-style:italic;font-weight:400}
.home__tag{font-size:clamp(15px,1.7vw,19px);line-height:1.55;max-width:40ch;color:var(--ink)}
.home__enter{
  margin-top:8px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;
  display:inline-flex;gap:10px;align-items:center;color:var(--ink-soft);
}
.home__enter .arrow{transition:transform .4s var(--ease)}
.home__enter:hover .arrow{transform:translate(4px,-4px)}

/* ---------- CONTACT ---------- */
.contact{max-width:1400px;margin:0 auto}
.contact__label{font-size:14px;letter-spacing:.02em;font-weight:600;margin-bottom:clamp(40px,7vh,84px)}
.contact__label::before{content:"";display:inline-block;width:30px;height:1px;background:var(--ink);vertical-align:middle;margin-right:14px}
.contact__hello{
  font-family:var(--sans);font-weight:700;
  font-size:clamp(56px,11vw,150px);line-height:.86;letter-spacing:-.02em;
  margin-bottom:2px;
}
.contact__hello em{font-family:var(--serif);font-style:italic;font-weight:300;letter-spacing:-.01em}
.contact__sub{max-width:44ch;color:var(--ink);font-size:clamp(15px,1.6vw,18px);line-height:1.55;margin:clamp(20px,3vh,26px) 0 clamp(44px,7vh,84px)}

.contact__grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:48px 60px;border-top:1px solid var(--line);padding-top:44px;
}
.chan__k{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:16px}
.chan a,.chan p{font-family:var(--serif);font-weight:400;font-size:clamp(22px,2.8vw,34px);line-height:1.15;letter-spacing:-.01em;display:inline-block}
.chan a{position:relative}
.chan a::after{content:"";position:absolute;left:0;bottom:2px;height:1px;width:100%;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.chan a:hover::after{transform:scaleX(1);transform-origin:left}
.chan small{display:block;font-family:var(--sans);font-size:13px;color:var(--ink-soft);margin-top:8px;letter-spacing:.01em}

.socials{
  display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:56px;
  border-top:1px solid var(--line);padding-top:34px;
}
.socials a{font-size:13px;letter-spacing:.08em;text-transform:uppercase;position:relative;padding-left:20px}
.socials a::before{content:"↳";position:absolute;left:0;color:var(--ink-soft)}
.socials a:hover{text-decoration:underline;text-underline-offset:4px}

/* big wordmark footer */
.wordmark{
  margin-top:min(16vh,150px);border-top:1px solid var(--line);padding-top:34px;
  display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;
}
.wordmark__big{
  font-family:var(--serif);font-weight:300;line-height:.82;letter-spacing:-.03em;
  font-size:clamp(70px,20vw,300px);
}
.wordmark__meta{font-size:12px;color:var(--ink-soft);letter-spacing:.04em;text-align:right}

/* ---------- WORK — editorial project gallery ---------- */
.workx{max-width:1400px;margin:0 auto}
.projects{margin-top:min(9vh,90px)}
.proj{display:block;width:min(100%,64%);margin-bottom:min(15vh,150px);color:inherit}
.projects .proj:nth-child(even){margin-left:auto}
.proj__frame{overflow:hidden;aspect-ratio:4/3;background:var(--paper)}
.proj__frame img{width:100%;height:100%;object-fit:cover;transform:scale(1.03);transition:transform 1.3s var(--ease)}
.proj:hover .proj__frame img{transform:scale(1.09)}
.proj__row{display:flex;justify-content:space-between;align-items:baseline;gap:16px 30px;margin-top:22px;flex-wrap:wrap}
.proj__num{font-size:12px;color:var(--ink-soft);margin-right:14px}
.proj__ttl{font-family:var(--serif);font-weight:400;font-size:clamp(28px,4vw,52px);letter-spacing:-.01em;display:inline}
.proj__cat{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.proj__view{display:inline-flex;gap:8px;align-items:center;margin-top:12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}
.proj__view .arrow{transition:transform .4s var(--ease)}
.proj:hover .proj__view .arrow{transform:translate(4px,-4px)}
@media (max-width:760px){.proj{width:100%!important;margin-bottom:72px}}

/* ---------- MORE WORK (thumbnail grid -> live demos) ---------- */
.more{max-width:1400px;margin:min(15vh,140px) auto 0}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:min(3.4vw,40px) min(2.6vw,30px);margin-top:min(6vh,54px)}
.gtile{display:block;color:inherit}
.gtile__frame{aspect-ratio:4/3;overflow:hidden;background:var(--paper);position:relative}
.gtile__frame img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);transition:transform 1.1s var(--ease)}
.gtile:hover .gtile__frame img{transform:scale(1.09)}
.gtile__field{aspect-ratio:4/3;overflow:hidden;position:relative;display:grid;place-items:center;
  background:radial-gradient(120% 120% at 20% 15%, #2a2660 0%, #1a1840 45%, #122a1c 100%)}
.gtile__field span{font-family:var(--serif);font-style:italic;font-size:clamp(30px,5vw,52px);color:rgba(236,234,251,.30);letter-spacing:-.02em}
.gtile:hover .gtile__field span{color:rgba(236,234,251,.42);transition:color .5s var(--ease)}
.gtile__row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-top:15px;flex-wrap:wrap}
.gtile__name{font-family:var(--serif);font-weight:400;font-size:clamp(19px,2vw,26px);letter-spacing:-.01em}
.gtile__cat{font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-soft)}
.gtile__ext{display:inline-flex;gap:6px;align-items:center;font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-top:7px}
.gtile__ext .arrow{transition:transform .4s var(--ease)}
.gtile:hover .gtile__ext .arrow{transform:translate(3px,-3px)}
@media (max-width:900px){.grid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.grid{grid-template-columns:1fr}}

/* ---------- WORK (simple list rows, used on home) ---------- */
.work{max-width:1400px;margin:0 auto}
.work__head{font-family:var(--serif);font-weight:300;font-size:clamp(48px,9vw,130px);line-height:.9;letter-spacing:-.02em;margin-bottom:min(10vh,90px)}
.work__row{display:grid;grid-template-columns:60px 1fr auto;gap:20px;align-items:center;padding:26px 0;border-top:1px solid var(--line);transition:padding .4s var(--ease)}
.work__row:last-child{border-bottom:1px solid var(--line)}
.work__row:hover{padding-left:14px}
.work__row .idx{font-size:12px;color:var(--ink-soft)}
.work__row .ttl{font-family:var(--serif);font-size:clamp(24px,4vw,44px);font-weight:400;letter-spacing:-.01em}
.work__row .tag{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}

/* ---------- CASE STUDY ---------- */
.case{max-width:1400px;margin:0 auto}
.case__crumb{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:min(6vh,50px)}
.case__crumb a:hover{text-decoration:underline;text-underline-offset:3px}
.case__title{font-family:var(--serif);font-weight:300;font-size:clamp(52px,11vw,150px);line-height:.92;letter-spacing:-.02em;margin-bottom:32px}
.case__title em{font-style:italic}
.case__lead{max-width:48ch;font-size:clamp(18px,2.1vw,27px);line-height:1.44;margin-bottom:min(8vh,64px)}
.case__meta{display:flex;flex-wrap:wrap;gap:26px 56px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:28px 0;margin-bottom:min(7vh,56px)}
.case__meta div{min-width:110px}
.case__meta .k{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:9px}
.case__meta .v{font-size:15px}
.case__cta{display:inline-flex;gap:9px;align-items:center;font-size:13px;letter-spacing:.12em;text-transform:uppercase;border:1px solid var(--ink);padding:14px 24px;border-radius:100px;transition:background .4s var(--ease),color .4s var(--ease)}
.case__cta:hover{background:var(--ink);color:var(--ground)}
.case__cta .arrow{transition:transform .4s var(--ease)}
.case__cta:hover .arrow{transform:translate(3px,-3px)}
.figure{overflow:hidden;background:var(--paper);margin-top:min(6vh,44px)}
.figure img{width:100%;height:100%;object-fit:cover;display:block;transition:transform 1.4s var(--ease)}
.figure:hover img{transform:scale(1.05)}
.case__hero{aspect-ratio:16/10;margin-top:min(8vh,60px)}
.figure--land{aspect-ratio:3/2}
.figure--port{aspect-ratio:3/4}
.two{display:grid;grid-template-columns:1fr 1fr;gap:min(4vw,40px);margin-top:min(6vh,44px)}
.two .figure{margin-top:0}
.case__note{max-width:46ch;color:var(--ink);font-size:clamp(16px,1.7vw,20px);line-height:1.55;margin:min(7vh,56px) 0}
.case__note em{font-family:var(--serif);font-style:italic}
.case__next{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);margin-top:min(12vh,120px);padding-top:32px;gap:16px;flex-wrap:wrap}
.case__next .k{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft)}
.case__next a{font-family:var(--serif);font-size:clamp(32px,6vw,74px);font-weight:300;letter-spacing:-.02em;display:inline-flex;gap:16px;align-items:center}
.case__next a .arrow{transition:transform .5s var(--ease)}
.case__next a:hover .arrow{transform:translateX(8px)}

/* ---------- OWN IT (drawers, comparison, pricing roads) ---------- */
.drawer{border:1px solid var(--line);background:var(--paper);margin-top:22px}
.drawer summary{
  list-style:none;display:flex;justify-content:space-between;align-items:baseline;gap:18px;
  padding:26px clamp(20px,3vw,36px);cursor:none;
}
.drawer summary::-webkit-details-marker{display:none}
.drawer summary .q{font-family:var(--serif);font-size:clamp(19px,2.3vw,28px);font-weight:400;letter-spacing:-.01em}
.drawer summary .k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap;display:inline-flex;gap:8px;align-items:center}
.drawer summary .k .chev{transition:transform .4s var(--ease);display:inline-block}
.drawer[open] summary .k .chev{transform:rotate(180deg)}
.drawer__body{padding:0 clamp(20px,3vw,36px) 30px;color:var(--ink)}
.drawer__body p{max-width:56ch;font-size:15px;line-height:1.6;color:var(--ink-soft)}
.drawer__body p em{font-family:var(--serif);font-style:italic;color:var(--ink)}
.maths{display:grid;grid-template-columns:auto 1fr 1fr;gap:12px 28px;margin:6px 0 20px;font-size:15px}
.maths .h{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);padding-bottom:8px;border-bottom:1px solid var(--line)}
.maths .y{color:var(--ink-soft)}
.maths .own{font-family:var(--serif);font-size:17px}
.maths .rent{font-family:var(--serif);font-size:17px;color:var(--ink-soft)}
.rentline{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px}
.rentline .amt{font-family:var(--serif)}
.rentline--total{border-bottom:0;color:var(--ink);font-weight:600}
.versus{display:grid;grid-template-columns:1fr 1fr;gap:min(3vw,28px);margin-top:min(7vh,56px)}
.versus .col{border:1px solid var(--line);padding:clamp(20px,3vw,34px)}
.versus .col--own{background:var(--paper)}
.versus h3{font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.4vw,28px);margin-bottom:4px}
.versus .sub{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:20px}
.versus ul{list-style:none}
.versus li{display:flex;gap:12px;padding:9px 0;font-size:15px;line-height:1.5}
.versus li .m{flex:0 0 auto;color:var(--ink-soft)}
.roads{display:grid;grid-template-columns:repeat(3,1fr);gap:min(3vw,28px);margin-top:min(6vh,48px)}
.road{border:1px solid var(--line);padding:clamp(20px,2.6vw,32px);display:flex;flex-direction:column;gap:14px}
.road--mid{background:var(--paper)}
.road .tag{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.road h3{font-family:var(--serif);font-weight:400;font-size:clamp(21px,2.4vw,29px);display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.road h3 .ar{font-size:.7em;color:var(--ink-soft)}
.road .nums{display:flex;gap:26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:14px 0}
.road .nums .k{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);display:block;margin-bottom:5px}
.road .nums .v{font-family:var(--serif);font-size:clamp(19px,2vw,25px)}
.road p{font-size:14px;line-height:1.55;color:var(--ink-soft)}
.road .kreol{font-family:var(--serif);font-style:italic;color:var(--ink);font-size:15px;margin-top:auto}
.careline{max-width:56ch;font-size:15px;line-height:1.6;color:var(--ink-soft);margin-top:26px}
.careline em{font-family:var(--serif);font-style:italic;color:var(--ink)}
@media (max-width:900px){.roads{grid-template-columns:1fr}}
@media (max-width:760px){
  .versus{grid-template-columns:1fr}
  .maths{gap:10px 14px}
  .drawer summary{flex-direction:column;gap:6px;align-items:flex-start}
}

/* ---------- responsive ---------- */
@media (max-width:760px){
  :root{--pad:20px}
  .nav a:not(.menu-btn){display:none}
  .nav .menu-btn{display:inline-flex}
  .contact__grid{grid-template-columns:1fr;gap:36px}
  .contact__label{margin-bottom:64px}
  .wordmark{flex-direction:column;align-items:flex-start}
  .wordmark__meta{text-align:left}
  .work__row{grid-template-columns:34px 1fr;gap:12px}
  .work__row .tag{grid-column:2;margin-top:2px}
  .status{display:none}
  .cursor{display:none}
  body{cursor:auto}
  .two{grid-template-columns:1fr}
  .case__hero{aspect-ratio:4/5}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.01ms!important}
  .reveal{opacity:1;transform:none}
}