:root{
  --bg:#0b0b0d;
  --bg-raise:#111114;
  --ink:#f4f2ec;
  --ink-dim:#a9a7a1;
  --mirror:#9aa1ab;
  --mirror-line:#2a2c30;
  --beacon:#ff5858;
  --beacon-ink:#0b0b0d;
  --highlight:#ff2586;
  --gold:#fafd03;
  --font-display:'Jost', sans-serif;
  --font-body:'Jost', sans-serif;
  --font-mono:'Jost', sans-serif;
  --measure: 62ch;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important;}
}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  -webkit-font-smoothing:antialiased;
}
a{color:inherit;}
img{max-width:100%; display:block;}
::selection{background:var(--highlight); color:var(--ink);}
:focus-visible{outline:2px solid var(--beacon); outline-offset:3px;}

.skip-link{
  position:absolute; left:-999px; top:0; z-index:100;
  background:var(--beacon); color:var(--beacon-ink); padding:10px 16px;
  font-family:var(--font-mono); font-size:13px; text-decoration:none;
}
.skip-link:focus{left:12px; top:12px;}

.beacon-dot{
  width:9px;height:9px;border-radius:50%;
  background:var(--beacon);
  box-shadow:0 0 8px 2px rgba(255,88,88,.7);
  display:inline-block;
  animation:breathe 4.5s ease-in-out infinite;
  flex:none;
}
@keyframes breathe{
  0%,100%{transform:scale(1); opacity:.65;}
  50%{transform:scale(1.3); opacity:1;}
}

/* NAV */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:50;
  display:flex; align-items:center; justify-content:space-between;
  padding:18px clamp(20px,4vw,56px);
  background:linear-gradient(180deg, rgba(11,11,13,.92), rgba(11,11,13,0));
  backdrop-filter:blur(2px);
}
.nav-mark{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-mono); font-size:13px; letter-spacing:.08em;
  text-decoration:none; color:var(--ink);
}
.nav-left{display:flex; align-items:center; gap:22px;}
.wd-back{
  display:flex; align-items:center; gap:6px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-dim); text-decoration:none; transition:color .2s ease;
}
.wd-back:hover{color:var(--beacon);}
.nav-links{display:flex; gap:clamp(12px,2.2vw,28px); list-style:none; margin:0; padding:0;}
.nav-links a{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.1em;
  text-decoration:none; color:var(--ink-dim);
  text-transform:uppercase;
  transition:color .2s ease;
}
.nav-links a:hover{color:var(--ink);}
.nav-links a.cta{color:var(--gold);}
.nav-links a.cta:hover{color:var(--ink);}
.nav-links a.active{color:var(--gold);}
@media (max-width:700px){
  .nav{flex-direction:column; align-items:flex-start; gap:12px;}
  .nav-links{gap:10px 16px; flex-wrap:wrap; width:100%;}
  .nav-links a{font-size:10.5px;}
}

section{padding:clamp(80px,12vw,140px) clamp(20px,6vw,72px);}
.eyebrow{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--mirror);
  display:flex; align-items:center; gap:10px;
  margin-bottom:22px;
}
.section-intro{
  font-size:16px; line-height:1.65; color:var(--ink-dim); max-width:var(--measure);
  margin:-8px 0 40px;
}

/* HERO */
.hero{
  min-height:64vh;
  padding:0 clamp(20px,6vw,72px);
  padding-top:clamp(115px,11vw,155px);
  display:flex; align-items:flex-end;
  position:relative;
  background-color:var(--bg);
  background-image:url('images/quilted-emptiness-hero.jpg');
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
.hero::before{
  content:"";
  position:absolute; top:0; left:0; right:0; height:40%;
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.9) 35%, rgba(0,0,0,0) 100%);
  mask-image:linear-gradient(180deg, rgba(0,0,0,.9) 0%, rgba(0,0,0,.9) 35%, rgba(0,0,0,0) 100%);
  pointer-events:none;
}
.hero::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(11,11,13,0) 0%, rgba(11,11,13,.3) 55%, rgba(11,11,13,.85) 82%, var(--bg) 100%);
  pointer-events:none;
}
.hero-copy{position:relative; z-index:1; text-align:left; padding-bottom:clamp(100px,14vw,180px);}
.hero h1{
  font-family:var(--font-display); font-weight:500;
  font-size:clamp(32px,5vw,64px); line-height:1; margin:0;
  letter-spacing:-.01em;
  text-shadow:0 2px 24px rgba(0,0,0,.6);
}
.hero .hero-handle{
  font-family:var(--font-display); font-weight:400; font-size:clamp(14px,1.6vw,18px);
  letter-spacing:.01em; color:var(--ink-dim); margin:10px 0 0;
  text-shadow:0 2px 16px rgba(0,0,0,.6);
}
@media (max-width:640px){
  .hero{min-height:440px;}
}
@media (max-width:700px){
  .hero{padding-top:clamp(150px,32vw,190px);}
}

/* ABOUT */
.about{background:var(--bg-raise); border-top:1px solid var(--mirror-line); border-bottom:1px solid var(--mirror-line);}
.about-grid{display:grid; grid-template-columns:1fr .55fr; gap:56px; align-items:center;}
.about p:not(.eyebrow){font-size:clamp(17px,1.6vw,20px); line-height:1.65; max-width:var(--measure); color:var(--ink);}
.about-portrait{position:relative; border-radius:2px; overflow:hidden;}
.about-portrait img{width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; filter:grayscale(.15) contrast(1.03);}
.about-portrait::after{
  content:""; position:absolute; inset:0;
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
@media (max-width:800px){ .about-grid{grid-template-columns:1fr;} .about-portrait{max-width:320px;} }

/* STATEMENT */
.statement p:not(.eyebrow){
  font-size:clamp(17px,1.6vw,19px); line-height:1.75; max-width:var(--measure);
  color:var(--ink); margin:0 0 26px;
}

/* WORKS GRID (square thumb + title beside) */
.works-grid{
  display:grid; grid-template-columns:1fr 1fr; gap:30px 40px;
}
@media (max-width:560px){ .works-grid{grid-template-columns:1fr;} }
.wg-item{display:block; text-decoration:none;}
.wg-item .wg-row{display:flex; align-items:center; gap:22px;}
.wg-item .wg-thumb{
  width:clamp(150px,16vw,220px); height:clamp(150px,16vw,220px); flex:none; overflow:hidden; background:var(--bg-raise);
}
.wg-item .wg-thumb img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.wg-item:hover .wg-thumb img{transform:scale(1.06);}
.wg-item .wg-title{
  font-family:var(--font-display); font-weight:500; font-size:16px; color:var(--ink-dim);
  transition:color .2s ease; line-height:1.35;
}
.wg-item.is-link .wg-title{color:var(--ink);}
.wg-item:hover .wg-title{color:var(--gold);}
.project-divider{
  display:flex; align-items:baseline; gap:18px;
  margin:0 0 28px;
}
.project-divider .pd-label{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink); white-space:nowrap;
}
.project-divider .pd-line{flex:1; height:1px; background:var(--ink); opacity:.5;}

.project-group{
  grid-column:1/-1;
  position:relative;
  padding:32px 0 36px;
  margin-top:24px;
}
.project-group::before{
  content:"";
  position:absolute;
  top:0; bottom:0;
  left:calc(-1 * clamp(20px,4vw,40px));
  right:calc(-1 * clamp(20px,4vw,40px));
  background:rgba(255,255,255,.045);
  border-radius:10px;
  z-index:0;
}
.project-group > *{position:relative; z-index:1;}
.project-items{
  display:grid; grid-template-columns:1fr 1fr; gap:30px 40px;
}
@media (max-width:560px){ .project-items{grid-template-columns:1fr;} }
.project-end-line{height:1px; background:var(--ink); margin-top:36px;}

/* EXHIBITIONS / PRESS */
.exhibitions{background:var(--bg-raise); border-top:1px solid var(--mirror-line); border-bottom:1px solid var(--mirror-line);}
.ex-cat{margin-bottom:44px;}
.ex-cat h3{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.12em; text-transform:uppercase;
  color:var(--ink); margin:0 0 4px; padding-bottom:12px; border-bottom:1px solid var(--mirror-line);
}
.ex-columns{column-count:2; column-gap:48px;}
@media (max-width:800px){ .ex-columns{column-count:1;} }
.ex-list{list-style:none; margin:0; padding:0;}
.ex-list li{
  font-size:14.5px; line-height:1.55; color:var(--ink-dim);
  padding:9px 0; border-top:1px solid var(--mirror-line);
  break-inside:avoid;
}
.ex-list li:last-child{border-bottom:1px solid var(--mirror-line);}
.ex-list .y{font-family:var(--font-mono); color:var(--mirror); margin-right:10px;}
.ex-list .ex-title{color:var(--gold);}
.press-list{list-style:none; margin:0; padding:0;}
.press-list li{
  font-size:14.5px; line-height:1.5; color:var(--ink-dim);
  padding:9px 0; border-top:1px solid var(--mirror-line);
  break-inside:avoid;
}
.press-list li:last-child{border-bottom:1px solid var(--mirror-line);}
.press-list a{text-decoration:none; color:var(--ink); border-bottom:1px solid var(--mirror-line); transition:color .2s, border-color .2s;}
.press-list .ex-title a{color:var(--gold);}
.press-list a:hover{color:var(--beacon); border-color:var(--beacon);}
.press-list .y{font-family:var(--font-mono); color:var(--mirror); margin-right:10px; font-size:13px;}

/* CONTACT */
.contact{text-align:left;}
.on-view{
  font-family:var(--font-mono); font-size:13px; color:var(--ink-dim);
  display:flex; align-items:center; gap:10px; margin-bottom:40px;
}
.contact h2{
  font-family:var(--font-display); font-weight:700; font-size:clamp(36px,5.4vw,64px);
  margin:0 0 26px; line-height:1;
}
.contact-links{display:flex; flex-wrap:wrap; gap:14px 34px; margin-bottom:56px;}
.contact-links a{
  font-family:var(--font-mono); font-size:14px; text-decoration:none; color:var(--gold);
  border-bottom:1px solid var(--mirror); padding-bottom:3px;
}
.contact-links a:hover{border-color:var(--beacon); color:var(--beacon);}
.foot-line{
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-family:var(--font-mono); font-size:11px; color:var(--mirror);
  border-top:1px solid var(--mirror-line); padding-top:22px;
}

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* ===== CV PAGE ===== */
.cv-hero{
  padding:clamp(120px,14vw,160px) clamp(20px,6vw,72px) 60px;
  border-bottom:1px solid var(--mirror-line);
}
.cv-hero h1{
  font-family:var(--font-display); font-weight:700; font-size:clamp(36px,5.6vw,64px);
  margin:0 0 14px; line-height:1;
}
.cv-hero .cv-contact{
  font-family:var(--font-mono); font-size:13px; color:var(--ink-dim);
  display:flex; flex-wrap:wrap; gap:6px 22px;
}
.cv-hero .cv-contact a{color:var(--ink-dim); text-decoration:none; border-bottom:1px solid var(--mirror-line);}
.cv-hero .cv-contact a:hover{color:var(--beacon); border-color:var(--beacon);}
.cv-section{padding:56px clamp(20px,6vw,72px); border-bottom:1px solid var(--mirror-line);}
.cv-section:nth-child(even){background:var(--bg-raise);}
.cv-section h2{
  font-family:var(--font-mono); font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--mirror); margin:0 0 28px;
}
.cv-entry{padding:16px 0; border-top:1px solid var(--mirror-line); display:grid; grid-template-columns:1fr auto; gap:12px 24px;}
.cv-entry:last-child{border-bottom:1px solid var(--mirror-line);}
.cv-entry .cv-role{font-family:var(--font-display); font-weight:600; font-size:17px; margin:0 0 4px; color:var(--ink);}
.cv-entry .cv-place{font-size:14px; color:var(--ink-dim); margin:0;}
.cv-entry .cv-desc{font-size:14px; line-height:1.6; color:var(--ink-dim); margin:8px 0 0; grid-column:1 / -1; max-width:72ch;}
.cv-entry .cv-date{font-family:var(--font-mono); font-size:12.5px; color:var(--gold); white-space:nowrap; text-align:right;}
@media (max-width:640px){
  .cv-entry{grid-template-columns:1fr;}
  .cv-entry .cv-date{text-align:left;}
}
.cv-columns{column-count:2; column-gap:40px;}
@media (max-width:800px){ .cv-columns{column-count:1;} }
.cv-columns .cv-entry{break-inside:avoid;}
.cv-skills{list-style:none; margin:0; padding:0;}
.cv-skills li{
  font-size:15px; line-height:1.6; color:var(--ink-dim);
  padding:10px 0; border-top:1px solid var(--mirror-line);
}
.cv-skills li:last-child{border-bottom:1px solid var(--mirror-line);}
.back-link{
  display:inline-flex; align-items:center; gap:8px; margin-top:28px;
  font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ink-dim); text-decoration:none; border-bottom:1px solid var(--mirror-line);
}
.back-link:hover{color:var(--beacon); border-color:var(--beacon);}

/* ===== PROJECTS PROTOTYPE ===== */
.proj-note{
  font-family:var(--font-mono); font-size:12px; color:var(--beacon); letter-spacing:.06em;
  border:1px solid rgba(255,88,88,.4); padding:10px 16px; margin-bottom:40px; display:inline-block;
}
.proj-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
@media (max-width:800px){ .proj-grid{grid-template-columns:1fr;} }
.proj-card{
  border:1px solid var(--mirror-line); padding:28px 24px; min-height:220px;
  display:flex; flex-direction:column; justify-content:space-between;
}
.proj-card .proj-num{font-family:var(--font-mono); font-size:12px; color:var(--gold); letter-spacing:.1em;}
.proj-card h3{font-family:var(--font-display); font-weight:600; font-size:26px; margin:14px 0 10px;}
.proj-card p{font-size:14px; line-height:1.6; color:var(--ink-dim); margin:0 0 20px;}
.proj-card.empty{opacity:.4; border-style:dashed;}
.proj-works{list-style:none; margin:0; padding:0;}
.proj-works li{border-top:1px solid var(--mirror-line); padding:10px 0;}
.proj-works a{
  text-decoration:none; color:var(--ink); font-size:14px;
  display:flex; justify-content:space-between; gap:12px;
}
.proj-works a:hover{color:var(--beacon);}
.proj-works .py{font-family:var(--font-mono); color:var(--mirror); font-size:12px;}

/* ===== WORK DETAIL PAGE ===== */
.wd-slice{
  margin-top:64px; background:var(--bg-raise);
  display:flex; justify-content:center; align-items:center;
  padding:clamp(28px,5vw,64px) clamp(20px,6vw,72px);
}
.wd-slice img{
  max-width:min(100%, 760px); max-height:58vh; width:auto; height:auto;
  object-fit:contain; display:block;
}
.wd-thumbstrip{
  display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
  padding:36px clamp(20px,6vw,72px) 0;
}
.wd-thumbstrip button{
  all:unset; cursor:pointer; width:88px; height:66px; flex:none;
  overflow:hidden; opacity:.5; transition:opacity .2s ease;
}
.wd-thumbstrip button img{width:100%; height:100%; object-fit:cover; display:block;}
.wd-thumbstrip button:hover{opacity:.85;}
.wd-thumbstrip button.active{opacity:1; box-shadow:0 0 0 1px var(--beacon);}

.wd-body{padding:56px clamp(20px,6vw,72px) 0; max-width:720px; margin:0 auto; text-align:center;}
.wd-title{font-family:var(--font-display); font-weight:500; font-size:clamp(28px,4vw,46px); margin:0 0 22px; line-height:1.05;}
.wd-meta{font-family:var(--font-mono); font-size:13px; color:var(--mirror); line-height:1.7; margin-bottom:34px;}
.wd-statement{font-size:clamp(15px,1.3vw,17px); line-height:1.8; color:var(--ink); text-align:left; margin:0 0 22px;}

.wd-nav{
  display:flex; justify-content:space-between; align-items:center; gap:20px;
  padding:44px clamp(20px,6vw,72px) 100px; margin-top:60px; border-top:1px solid var(--mirror-line);
}
.wd-nav a{
  font-family:var(--font-display); font-weight:600; font-size:clamp(16px,2vw,22px);
  text-decoration:none; color:var(--ink); display:flex; align-items:center; gap:8px;
  transition:color .2s ease;
}
.wd-nav a:hover{color:var(--beacon);}
.wd-nav .dir-next{margin-left:auto; text-align:right;}
