:root{
  --bg:#f2f0eb;
  --paper:#faf9f6;
  --ink:#111111;
  --muted:#68645f;
  --line:#c9c4bc;
  --accent:#b5231f;
  --max:1180px;
  --text:690px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.55;text-rendering:auto;font-kerning:normal;font-variant-ligatures:none}
a{color:inherit}.wrap{width:min(calc(100% - 36px),var(--max));margin:0 auto}
.topbar{border-bottom:1px solid var(--ink);padding:16px 0 13px;position:relative;z-index:2}
.brand{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:end}
.eyebrow,.kicker,.section-label,.work-no,.section-no,.card-index{font-size:10px;line-height:1.2;letter-spacing:.18em;text-transform:uppercase;font-weight:700}
.kicker,.eyebrow{color:var(--muted)}.name{margin-top:5px;font-size:15px;line-height:1.15;font-weight:700;letter-spacing:0}
.back{font-size:12px;font-weight:700;text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:2px}.back:hover{color:var(--accent)}

/* ARTWORK PAGE */
.hero{
  width:min(100%,720px);
  margin:28px auto 0;
  padding:0;
  background:transparent;
  border:0;
  min-height:0;
  display:block;
}
.hero img{
  display:block;
  width:100%;
  height:auto;
  max-height:none;
  object-fit:unset;
  background:transparent;
}
.article{display:grid;grid-template-columns:minmax(0,1fr);padding:34px 0 76px}
.work-head{display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px;margin-bottom:24px}
.work-no{color:var(--accent);padding-top:8px;white-space:nowrap}
.work-title{margin:0;font-size:clamp(50px,12vw,104px);line-height:.95;letter-spacing:-.015em;font-weight:700;max-width:1050px}
.work-title.long{font-size:clamp(44px,10vw,88px)}.work-title.xlong{font-size:clamp(38px,8.8vw,76px)}
.work-subtitle{margin:14px 0 0;font-size:clamp(20px,4vw,34px);line-height:1;font-weight:700;letter-spacing:0;color:var(--muted)}
.tech{max-width:var(--text);margin-left:76px;font-size:11px;line-height:1.6;text-transform:uppercase;letter-spacing:.07em;color:var(--muted);border-top:1px solid var(--line);padding-top:13px;margin-bottom:44px}
.copy{max-width:var(--text);margin-left:76px}.lead{font-size:clamp(23px,4.8vw,34px);line-height:1.22;font-weight:700;letter-spacing:0;margin:0 0 31px;text-align:left}
.copy p{font-size:16px;line-height:1.72;margin:0 0 20px;text-align:left;hyphens:none;word-break:normal;overflow-wrap:break-word;font-kerning:normal;font-variant-ligatures:none}
.look{margin:48px 0 0;padding:18px 0 20px;border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);font-size:15px;line-height:1.58}
.look strong{display:block;margin-bottom:9px;color:var(--accent);font-size:10px;line-height:1.2;letter-spacing:.18em;text-transform:uppercase}
.question{font-size:clamp(27px,5.6vw,43px);line-height:1.16;letter-spacing:0;font-weight:700;margin:47px 0 42px}
.actions{display:grid;gap:0;margin-top:32px;border-bottom:1px solid var(--ink)}
.button{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:49px;text-decoration:none;border-top:1px solid var(--ink);padding:12px 0 10px;font-size:11px;line-height:1.2;font-weight:700;text-transform:uppercase;letter-spacing:.09em}
.button::after{content:"↗";font-size:16px;font-weight:400}.button.internal::after{content:"→"}.button:hover{color:var(--accent)}
.footer{border-top:1px solid var(--ink);padding:18px 0 38px;font-size:10px;line-height:1.4;text-transform:uppercase;letter-spacing:.14em;color:var(--muted)}

/* LANDING */
.landing{padding:48px 0 82px}.landing-hero{display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px;margin-bottom:58px}.hero-index{color:var(--accent);font-size:11px;line-height:1.2;letter-spacing:.16em;font-weight:700;text-transform:uppercase;padding-top:9px}
.landing h1{margin:0;font-size:clamp(66px,15vw,148px);line-height:.78;letter-spacing:-.02em;font-weight:700;max-width:1000px}
.intro{max-width:760px;margin:34px 0 0 76px;font-size:clamp(20px,3.6vw,30px);line-height:1.22;letter-spacing:0;font-weight:700}
.landing-meta{margin:18px 0 0 76px;font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:var(--muted);font-weight:700}
.section{margin-top:72px}.section-head{display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px;align-items:end;border-top:1px solid var(--ink);padding-top:12px;margin:0 0 22px}.section-no{color:var(--accent)}.section-title{font-size:13px;line-height:1;font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:20px 14px;
  align-items:start;
}
.card{
  display:block;
  background:transparent;
  text-decoration:none;
  border-top:1px solid var(--ink);
  padding-top:8px;
  min-width:0;
}
.card-media{
  aspect-ratio:1/1;
  background:#fff;
  overflow:hidden;
}
.card img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  background:#fff;
  transition:transform .35s ease;
}
.card:hover img{transform:scale(1.015)}
.card .caption{
  display:grid;
  grid-template-columns:36px minmax(0,1fr);
  gap:8px;
  padding:11px 0 24px;
}
.card-index{
  color:var(--accent);
  padding-top:4px;
  white-space:nowrap;
}
.card .caption strong{
  display:block;
  font-size:clamp(19px,2.2vw,29px);
  line-height:.96;
  letter-spacing:-.01em;
  font-weight:700;
}
.card .caption span{
  display:block;
  margin-top:7px;
  font-size:8px;
  line-height:1.4;
  text-transform:uppercase;
  letter-spacing:.09em;
  color:var(--muted);
}
.card:hover .caption strong{color:var(--accent)}

/* CONTACT */
.collector-contact{margin-top:70px;border-top:1px solid var(--ink);padding-top:12px}.contact-grid{display:grid;grid-template-columns:58px minmax(0,1fr);gap:18px}.contact-main{max-width:780px}.contact-title{margin:0 0 18px;font-size:clamp(32px,6vw,58px);line-height:.95;letter-spacing:-.01em;font-weight:700}.contact-copy{margin:0 0 28px;max-width:610px;color:var(--muted);font-size:15px;line-height:1.6;text-align:justify}.contact-links{display:grid;grid-template-columns:1fr;border-bottom:1px solid var(--ink)}.contact-links .button{margin:0}

@media (min-width:760px){.contact-links{grid-template-columns:1fr 1fr}.contact-links .button:nth-child(odd){padding-right:18px}.contact-links .button:nth-child(even){padding-left:18px;border-left:1px solid var(--ink)}}
@media (max-width:980px){
  .grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:720px){
  .landing{padding-top:36px}
  .landing-hero,.section-head,.contact-grid,.work-head{grid-template-columns:42px minmax(0,1fr);gap:12px}
  .landing h1{font-size:clamp(58px,18vw,90px)}
  .intro,.landing-meta{margin-left:54px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}
  .card .caption{grid-template-columns:30px minmax(0,1fr);gap:7px;padding-bottom:20px}
  .card .caption strong{font-size:clamp(18px,5vw,25px)}
  .card .caption span{font-size:7.5px}
  .tech,.copy{margin-left:54px}
  .work-title,.work-title.long,.work-title.xlong{font-size:clamp(46px,14vw,74px)}
}
@media (max-width:420px){
  .wrap{width:min(calc(100% - 28px),var(--max))}
  .topbar{padding-top:13px}
  .name{font-size:14px}
  .intro{font-size:21px}
  .tech,.copy,.intro,.landing-meta{margin-left:0}
  .work-head{grid-template-columns:1fr}
  .work-no{padding-top:0;margin-bottom:-4px}
  .question{font-size:30px}
  .landing-meta{margin-top:14px}
  .hero{margin-top:20px}
  .article{padding-top:28px}
  .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 10px}
  .card .caption{grid-template-columns:24px minmax(0,1fr);gap:5px}
  .card .caption strong{font-size:17px}
  .card .caption span{font-size:7px;letter-spacing:.07em}
  .card-index{font-size:8px}
}
@media (max-width:720px){
  .copy p{ text-align:left; hyphens:none; word-break:normal; overflow-wrap:normal; }
}

/* TYPOGRAPHY SAFETY */
.work-title,.work-subtitle,.tech,.lead,.copy,.copy p,.look,.question,
.card .caption strong,.card .caption span,.contact-title,.contact-copy,
.intro,.name,.back,.button{
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
  word-break:normal;
  font-variant-ligatures:none;
}