:root{
  --ink:#131B33;
  --ink-rgb:19,27,51;
  --ink-lift:#1E2C57;
  --graphite:#7A2E1F;
  --graphite-deep:#4A1B12;
  --daylight:#F6EFDD;
  --paper:#F3E4B8;
  --paper-rgb:243,228,184;
  --paper-bright:#FBF3DA;
  --paper-bright-rgb:251,243,218;
  --paper-dim:#C9AE7E;
  --paper-dim-rgb:201,174,126;
  --gold:#E8A93D;
  --gold-rgb:232,169,61;
  --salt:#F2A79E;
  --salt-rgb:242,167,158;
  --sky:#29ABE2;
  --sky-rgb:41,171,226;
  --rule:rgba(var(--paper-rgb),.18);

  --hero-black:#050505;
  --hero-gray:#232323;
  --hero-gray-deep:#000000;
  --hero-accent:#D8D8D8;
  --hero-accent-rgb:216,216,216;

  --img-tidwell:url("../images/tidwell.jpg");
  --img-cassandre:url("../images/cassandre.jpg");
  --img-smithson:url("../images/smithson.jpg");
  --img-bliss:url("../images/bliss.jpg");

  --display:"Quintessential","Snell Roundhand","Brush Script MT",cursive;
  --ui:"Marcellus","Cormorant Garamond","Iowan Old Style",Georgia,serif;
  --body:"Cormorant Garamond","Iowan Old Style",Georgia,"Times New Roman",serif;

  --measure:60ch;
  --pad:clamp(1.25rem,5vw,4.5rem);
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;
  background:var(--ink);
  color:var(--paper);
  font-family:var(--body);
  font-weight:400;
  font-size:clamp(1.08rem,.66rem + .62vw,1.26rem);
  line-height:1.72;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
.art{
  position:relative;background-position:center;background-repeat:no-repeat;background-size:cover;
  -webkit-print-color-adjust:exact;print-color-adjust:exact;
}
.bg-tidwell{background-image:var(--img-tidwell)}
.bg-cassandre{background-image:var(--img-cassandre)}
.bg-smithson{background-image:var(--img-smithson)}
.bg-bliss{background-image:var(--img-bliss)}
.ar-tidwell{aspect-ratio:614/832}
.ar-cassandre{aspect-ratio:774/1068}
.ar-smithson{aspect-ratio:1400/860}
.ar-bliss{aspect-ratio:800/600}
a{color:inherit}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.08;letter-spacing:0;margin:0}
p{margin:0 0 1.15em}
p:last-child{margin-bottom:0}
em,i{font-style:italic}

.wrap{max-width:1180px;margin:0 auto;padding-inline:var(--pad)}
.narrow{max-width:var(--measure)}

/* ── skip link ─────────────────────────────────────── */
.skip{position:absolute;left:-9999px;top:0;background:var(--paper);color:var(--ink);padding:.6rem 1rem;z-index:99;font-family:var(--ui)}
.skip:focus{left:.5rem;top:.5rem}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ── hero ──────────────────────────────────────────── */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;flex-direction:column;justify-content:center;
  overflow:hidden;
  background:
    radial-gradient(115% 85% at 12% -10%, rgba(255,255,255,.06), transparent 60%),
    radial-gradient(90% 70% at 100% 110%, rgba(255,255,255,.04), transparent 65%),
    linear-gradient(165deg, var(--hero-gray) 0%, var(--hero-black) 62%, var(--hero-gray-deep) 100%);
}
.hero__inner{
  position:relative;text-align:left;padding-block:8vh 4vh;max-width:none;margin:0;padding-inline:var(--pad);
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,36rem);
  gap:clamp(2rem,5vw,4.5rem);align-items:center;
}
.hero h1{
  font-size:clamp(2.8rem,1.3rem + 7vw,7.2rem);
  letter-spacing:0;
  color:#F5F5F5;
  text-wrap:balance;
}
.hero h1 span{display:block}
.hero__subtitle{
  font-family:var(--ui);
  font-size:clamp(.82rem,.68rem + .5vw,1.02rem);
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#9A9A9A;
  margin:1.5rem 0 0;
}

/* ── hero card fan ─────────────────────────────────── */
.fan{
  position:relative;
  width:100%;
  height:clamp(370px,46vh,540px);
  padding-right:clamp(3rem,9vw,8rem);
  perspective:1300px;
  perspective-origin:50% 55%;
  touch-action:manipulation;
}
.fan__stage{
  position:absolute;inset:0;
  transform-style:preserve-3d;
  transform:rotateX(calc(var(--ry,0) * -1deg)) rotateY(calc(var(--rx,0) * 1deg));
  will-change:transform;
}
.fan__card{
  --w:clamp(150px,19vw,224px);
  position:absolute;
  top:50%;left:50%;
  width:var(--w);
  margin:calc(var(--w) * -0.667) 0 0 calc(var(--w) * -.5);
  transform-origin:50% 125%;
  transform-style:flat;
  backface-visibility:hidden;
  transform:
    translate3d(var(--tx,0px), var(--ty,0px), var(--tz,0px))
    rotate(var(--rot,0deg));
  text-decoration:none;color:inherit;
  border-radius:11px;
  overflow:hidden;
  background:var(--hero-black);
  box-shadow:
    0 0 0 1px rgba(255,255,255,.14),
    0 26px 48px -22px rgba(0,0,0,.85);
  will-change:transform;
  z-index:var(--z,1);
}
.fan__art{
  display:block;width:100%;aspect-ratio:3/4;
  background-color:var(--hero-black);
  filter:saturate(.66) brightness(.7);
  transition:filter .5s ease;
}
.fan__card::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(
    calc(var(--sheen,105deg)),
    rgba(255,255,255,0) 38%,
    rgba(255,255,255,.16) 50%,
    rgba(255,255,255,0) 62%);
  opacity:var(--gloss,0);
  transition:opacity .4s ease;
}
.fan__meta{
  position:absolute;left:0;right:0;bottom:0;
  border-radius:0 0 11px 11px;
  padding:1.9rem .7rem .62rem;
  background:linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.86) 55%);
  opacity:var(--meta,0);
  transform:translateY(calc((1 - var(--meta,0)) * .5rem));
  pointer-events:none;
}
.fan__artist{
  display:block;font-family:var(--ui);
  font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--hero-accent);
}
.fan__title{
  display:block;font-size:.82rem;line-height:1.3;font-style:italic;
  color:rgba(255,255,255,.8);margin-top:.2rem;
}
.fan__card.is-active .fan__art,
.fan__card:focus-visible .fan__art{filter:saturate(1) brightness(1)}
.fan__card.is-active,
.fan__card:focus-visible{
  box-shadow:
    0 0 0 1px rgba(var(--hero-accent-rgb),.5),
    0 40px 70px -26px rgba(0,0,0,.9);
}
.fan__card:focus-visible{outline:2px solid var(--hero-accent);outline-offset:4px}

@media (prefers-reduced-motion:reduce){
  .fan__stage,.fan__card{transition:none!important}
}

/* ── section scaffolding ───────────────────────────── */
section,footer{position:relative;scroll-margin-top:4.5rem}
.band{padding-block:clamp(3rem,7vh,6rem)}
.band--ink{background:var(--ink)}
.band--lift{background:var(--ink-lift)}
.band--graphite{background:var(--graphite);color:var(--paper-bright)}
.band--day{background:var(--daylight);color:var(--ink)}
.band--white{background:var(--paper-bright);color:var(--ink)}
.fade{height:clamp(160px,20vh,340px)}
.fade--ink-lift{background:linear-gradient(var(--ink),var(--ink-lift))}
.fade--lift-ink{background:linear-gradient(var(--ink-lift),var(--ink))}
.fade--ink-graphite{background:linear-gradient(var(--ink),var(--graphite))}
.fade--graphite-day{background:linear-gradient(var(--graphite),var(--daylight))}
.fade--day-ink{background:linear-gradient(var(--daylight),var(--ink))}
.fade--ink-white{background:linear-gradient(var(--ink),var(--paper-bright))}
.fade--white-lift{background:linear-gradient(var(--paper-bright),var(--ink-lift))}
.fade--hero-ink{background:linear-gradient(var(--hero-black),var(--ink))}
.band--white .kicker{color:rgba(var(--ink-rgb),.62)}
.band--white .kicker::after{background:rgba(var(--ink-rgb),.16)}

.kicker{
  font-family:var(--ui);font-size:.72rem;letter-spacing:.16em;
  color:var(--paper-dim);margin:0 0 1.6rem;
  display:flex;align-items:center;gap:.9rem;
}
.kicker::after{content:"";flex:1;height:1px;background:var(--rule)}
.band--graphite .kicker{color:rgba(var(--paper-bright-rgb),.62)}
.band--graphite .kicker::after{background:rgba(var(--paper-bright-rgb),.22)}
.band--day .kicker{color:rgba(var(--ink-rgb),.62)}
.band--day .kicker::after{background:rgba(var(--ink-rgb),.16)}

h2{font-size:clamp(1.7rem,1.05rem + 2.4vw,3.1rem);letter-spacing:-.02em;margin-bottom:1.6rem;text-wrap:balance}

/* ── curatorial statement ──────────────────────────── */
#statement .wrap{text-align:center}
.statement{max-width:64ch;margin-inline:auto;text-align:left}
.statement p{font-size:clamp(1.06rem,.68rem + .58vw,1.24rem);line-height:1.82}
.statement p:first-of-type::first-letter{
  float:left;font-family:var(--display);font-size:3.55em;line-height:.78;
  padding:.06em .12em 0 0;color:var(--paper-bright);
}
.btn{
  display:inline-flex;align-items:center;gap:.6rem;
  margin-top:2.6rem;padding:.85rem 1.5rem;
  font-family:var(--ui);font-size:.78rem;letter-spacing:.1em;text-decoration:none;
  color:var(--paper);border:1px solid var(--gold);
  transition:background .25s ease,color .25s ease;
}
.btn::before{content:"↓"}
.btn:hover,.btn:focus-visible{background:var(--gold);color:var(--ink)}

/* ── matrix ────────────────────────────────────────── */
.matrix{
  display:grid;
  grid-template-columns:minmax(0,5.5rem) 1fr 1fr;
  grid-template-rows:auto auto auto;
  gap:0;
  margin-top:2.6rem;
  border:1px solid var(--rule);
}
.matrix__corner{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.matrix__col,.matrix__row{
  font-family:var(--ui);font-size:.74rem;letter-spacing:.11em;color:var(--paper-dim);
  display:flex;align-items:center;justify-content:center;text-align:center;padding:.9rem .6rem;
}
.matrix__col{border-bottom:1px solid var(--rule)}
.matrix__col + .matrix__col{border-left:1px solid var(--rule)}
.matrix__row{writing-mode:vertical-rl;transform:rotate(180deg);border-right:1px solid var(--rule);padding:.6rem .9rem}
.matrix__row + .matrix__row{border-top:1px solid var(--rule)}
.cell{
  display:block;text-decoration:none;color:inherit;
  padding:clamp(1.1rem,2.4vw,1.8rem);
  border-left:0;
  transition:background .35s ease;
  min-height:100%;
}
.cell:nth-of-type(even){border-left:1px solid var(--rule)}
.cell--br,.cell--bl{border-top:1px solid var(--rule)}
.cell__thumb{
  display:block;width:100%;height:clamp(96px,13vw,132px);
  background-position:center;background-size:contain;background-color:rgba(0,0,0,.34);
  filter:saturate(.72) brightness(.86);transition:filter .4s ease;
  box-shadow:0 0 0 1px rgba(var(--paper-rgb),.14);
}
.cell h3{font-family:var(--ui);font-weight:600;font-size:.95rem;letter-spacing:.01em;margin:1rem 0 .35rem;line-height:1.3}
.cell h3 em{font-family:var(--body);font-weight:400;font-style:italic;font-size:1.06em}
.cell p{font-size:.9rem;line-height:1.6;color:var(--paper-dim);margin:0}

/* ── floor plan ────────────────────────────────────── */
.plan{margin-top:clamp(3.5rem,8vh,6rem)}
.plan svg{width:100%;height:auto;overflow:visible}
.plan .wall{stroke:rgba(var(--ink-rgb),.4);stroke-width:1.4;fill:none}
.plan .work{stroke:var(--gold);stroke-width:6;stroke-linecap:butt}
.plan .bench{fill:none;stroke:rgba(var(--ink-rgb),.4);stroke-width:1.4;rx:3}
.plan .sight{stroke:rgba(var(--sky-rgb),.55);stroke-width:1;stroke-dasharray:3 5;fill:none}
.plan .lbl{font-family:var(--ui);font-size:12px;letter-spacing:.09em;fill:rgba(var(--ink-rgb),.62)}
.plan .lbl--work{fill:var(--ink);font-size:13px;letter-spacing:.04em}
.plan .lbl--room{fill:rgba(var(--ink-rgb),.5);font-size:11px;letter-spacing:.18em}

/* ── work rooms ────────────────────────────────────── */
.room{display:grid;gap:clamp(2rem,5vw,4.5rem);align-items:start}
.room--solo{grid-template-columns:minmax(0,1fr) minmax(0,26rem)}
.plate{position:relative;margin:0}
.plate__frame{position:relative;display:block;line-height:0;background-color:#0A0E1C}
.plate .art{width:100%}
.plate--tidwell .plate__frame{box-shadow:0 40px 90px -40px rgba(0,0,0,.95)}
.plate--bliss .plate__frame{box-shadow:0 30px 70px -34px rgba(var(--sky-rgb),.35)}
.caption{font-size:.9rem;line-height:1.68;color:var(--paper-dim);margin-top:1.3rem;max-width:56ch}
.caption em{color:inherit}
.band--graphite .caption{color:rgba(var(--paper-bright-rgb),.66)}
.band--day .caption{color:rgba(var(--ink-rgb),.68)}

.label h2{margin-bottom:.5rem}
.label__artist{font-family:var(--ui);font-size:.8rem;letter-spacing:.14em;color:var(--paper-dim);margin-bottom:1.1rem}
.band--graphite .label__artist{color:rgba(var(--paper-bright-rgb),.6)}
.band--day .label__artist{color:rgba(var(--ink-rgb),.62)}
.label__text{max-width:46ch}
.label__text p{font-size:1rem;line-height:1.78}

/* ── facing pair ───────────────────────────────────── */
.pair{
  display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.245fr);
  gap:clamp(2rem,5vw,4.5rem);align-items:start;margin-top:3rem;
}
.pair figure{margin:0}
.pair .plate__frame{box-shadow:0 30px 70px -34px rgba(0,0,0,.8)}
.pair--left{text-align:right}
.pair--left .caption{margin-left:auto}
.pair .art{width:100%;height:auto}
.pairtext{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,5rem);margin-top:clamp(3rem,6vh,5rem)}
.pairtext .label__text{max-width:44ch}
.echo{
  margin-top:clamp(3rem,7vh,5.5rem);padding-top:2.2rem;border-top:1px solid rgba(var(--sky-rgb),.45);
  max-width:64ch;
}
.echo p{font-size:1.04rem;line-height:1.8}

/* ── bliss room ────────────────────────────────────── */
.room--bliss{grid-template-columns:minmax(0,1fr)}
.room--bliss .plate{width:100%;max-width:1000px;margin-inline:auto}
.blisstext{display:grid;grid-template-columns:minmax(0,26rem) minmax(0,1fr);gap:clamp(2rem,5vw,4.5rem);margin-top:clamp(2.5rem,5vh,4rem);width:100%;max-width:1000px;margin-inline:auto}

/* ── back matter ───────────────────────────────────── */
.cols2{columns:2;column-gap:clamp(2rem,5vw,4rem)}
.cited{list-style:none;padding:0;margin:2rem 0 0;font-size:.9rem;line-height:1.68}
.cited li{padding-left:1.6em;text-indent:-1.6em;margin-bottom:.95em;break-inside:avoid;color:var(--paper-dim)}
.cited li em{color:var(--paper)}
.credits{font-size:.86rem;line-height:1.7;color:var(--paper-dim);max-width:70ch}
.credits p{margin-bottom:1.1em}
.colophon{
  margin-top:clamp(3.5rem,8vh,6rem);padding-top:2rem;border-top:1px solid var(--rule);
  font-family:var(--ui);font-size:.74rem;letter-spacing:.09em;line-height:2;color:rgba(var(--paper-dim-rgb),.8);
}

/* ── top navigation ────────────────────────────────── */
.topnav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;gap:1.5rem;
  padding:.85rem clamp(1.25rem,5vw,2.5rem);
  background: rgba(0,0,0,0.6);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(var(--paper-rgb),.12);
}
.topnav__brand{
  font-family:var(--display);font-size:1.2rem;color:var(--paper-bright);
  text-decoration:none;white-space:nowrap;flex-shrink:0;
}
.topnav__links{
  display:flex;align-items:center;gap:clamp(1rem,2.2vw,2rem);
  overflow-x:auto;-ms-overflow-style:none;scrollbar-width:none;
}
.topnav__links::-webkit-scrollbar{display:none}
.topnav__links a{
  display:block;text-decoration:none;white-space:nowrap;
  font-family:var(--ui);font-size:.8rem;letter-spacing:.06em;
  color:rgba(var(--paper-rgb),.68);border-bottom:1px solid transparent;
  padding-block:.15rem;transition:color .25s ease,border-color .25s ease;
}
.topnav__links a:hover,.topnav__links a[aria-current="true"]{
  color:var(--paper-bright);border-color:var(--gold);
}

/* ── responsive ────────────────────────────────────── */
@media (max-width:1000px){
  .hero__inner{grid-template-columns:1fr;gap:clamp(1.5rem,4vw,3rem);align-items:start}
  .fan{height:clamp(290px,38vh,380px);order:2;padding-right:clamp(1.5rem,4vw,3rem)}
  .fan__card{--w:clamp(126px,29vw,178px)}
}
@media (max-width:900px){
  .room--solo{grid-template-columns:1fr}
  .pair{grid-template-columns:1fr;gap:2.5rem;align-items:stretch}
  .pair--left{text-align:left}
  .pair--left .caption{margin-left:0}
  .pairtext,.blisstext{grid-template-columns:1fr;gap:2.4rem}
  .cols2{columns:1}
}
@media (max-width:640px){
  .topnav{flex-direction:column;align-items:flex-start;gap:.6rem}
  .topnav__links{width:100%}
  .matrix{grid-template-columns:2.6rem 1fr 1fr}
  .matrix__col,.matrix__row{font-size:.62rem;letter-spacing:.06em}
  .cell h3{font-size:.86rem}
  .cell p{font-size:.82rem}
  .statement p:first-of-type::first-letter{font-size:3em}
}

/* ── entrance sequence ─────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  .hero h1 span{opacity:0;transform:translateY(.4em);animation:rise .95s cubic-bezier(.22,.61,.36,1) forwards}
  .hero h1 span:nth-child(1){animation-delay:.35s}
  .hero h1 span:nth-child(2){animation-delay:.5s}
  .hero__subtitle{opacity:0;transform:translateY(.4em);animation:rise .95s cubic-bezier(.22,.61,.36,1) forwards;animation-delay:.75s}
  @keyframes rise{to{opacity:1;transform:none}}

  .has-js .fan__card{opacity:0;animation:deal 1s cubic-bezier(.22,.61,.36,1) forwards}
  .has-js .fan__card:nth-child(1){animation-delay:.85s}
  .has-js .fan__card:nth-child(2){animation-delay:.95s}
  .has-js .fan__card:nth-child(3){animation-delay:1.05s}
  .has-js .fan__card:nth-child(4){animation-delay:1.15s}
  @keyframes deal{from{opacity:0}to{opacity:1}}
}

/* ── scroll reveal ─────────────────────────────────── */
@media (prefers-reduced-motion:no-preference){
  .has-js .reveal{
    opacity:0;transform:translateY(30px);
    transition:opacity .85s ease-out,transform .85s cubic-bezier(.22,.61,.36,1);
  }
  .has-js .reveal.is-visible{opacity:1;transform:none}
  .has-js .reveal-img{
    opacity:0;transform:translateY(26px) scale(.97);
    transition:opacity 1.05s ease-out,transform 1.05s cubic-bezier(.22,.61,.36,1);
  }
  .has-js .reveal-img.is-visible{opacity:1;transform:none}

  .matrix .cell.reveal:nth-of-type(1){transition-delay:.05s}
  .matrix .cell.reveal:nth-of-type(2){transition-delay:.15s}
  .matrix .cell.reveal:nth-of-type(3){transition-delay:.05s}
  .matrix .cell.reveal:nth-of-type(4){transition-delay:.15s}
  .pairtext .label.reveal:nth-of-type(1){transition-delay:0s}
  .pairtext .label.reveal:nth-of-type(2){transition-delay:.12s}
}
@media print{
  .topnav{display:none}
  body{background:#fff;color:#000}
}