/* V3 review refinements over the frozen Claude case-study template. */
button { font-family: inherit; }
.cs-top .h1 { font-size: clamp(38px,4.1vw,60px); }
.cs-top .h1 { text-wrap: pretty; }
.facts { font-size: 14px; }
.phone-facts, .phone-lede { display: none; }
.chapter { min-width: 0; }
.chapter .text { max-width: 66ch; }
.chapter .text p { text-wrap: pretty; }
.chapter .project-date { font-size: 12px; line-height: 1.5; color: var(--muted); margin-top: -8px; }
.text-only.next-proj { grid-template-columns: 1fr; }
.next-proj strong { transition: transform var(--motion); }
.next-proj:hover strong { transform: translateX(3px); }
.wide > img, .wide > .enlarge img { width: 100%; height: auto; object-fit: contain; }
.enlarge { display: block; position: relative; overflow: hidden; background: var(--well); }
.enlarge img { width: 100%; height: 100%; transition: transform var(--motion); }
.enlarge > span { position: absolute; right: 10px; bottom: 10px; width: 32px; height: 32px; display: grid; place-items: center; background: rgba(255,255,255,.9); color: var(--ink); font-size: 17px; }
.enlarge:hover img, .enlarge:focus-visible img { transform: scale(1.015); }
.works .enlarge { width: 100%; height: 100%; }
.works .enlarge > span { font-size: 16px; width: 28px; height: 28px; right: 7px; bottom: 7px; }
.contribution-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.contribution-grid article { display: grid; grid-template-rows: auto 1fr; align-content: start; gap: 22px; }
.contribution-grid .text { gap: 12px; font-size: 15px; }
.contribution-grid .h3 { font-size: 21px; }
.contribution-grid article > figure { align-self: end; }
.contribution-grid figure .enlarge { aspect-ratio: 1; }
.contribution-grid figure img { object-fit: contain; background: #f5f5f2; }
.landscape-pair figure > .enlarge { aspect-ratio: 1.32; }
.landscape-pair figure img { object-fit: contain; background: #f5f5f2; }
.two figure > .enlarge { aspect-ratio: 1; }
.two figure img { object-fit: contain; }
.color-study { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 32px; align-items: start; }
.color-study figure > img { width: 100%; height: auto; aspect-ratio: 1; object-fit: contain; }
.turntable-pair { align-items: start; gap: 18px; }
.turntable-pair .splines, .turntable-pair .spline-still, .turntable-pair video { aspect-ratio: 1; }
.spline-still { background: #a3a7ab; }
.spline-still img { width: 100%; height: 100%; object-fit: contain; }
.turntable-pair video { width: 100%; height: auto; object-fit: contain; }
.turntable-pair .video-frame { background: transparent; }
.turntable-pair .splines .hint { right: 8px; top: 8px; }
.preparation-note { border-block: 1px solid var(--rule); }
.preparation-note summary { cursor: pointer; padding-block: 16px; font-size: 15px; min-height: 44px; }
.preparation-note .text { padding: 4px 0 22px; font-size: 15px; }
.production-note { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: start; gap: 32px; margin-top: 12px; }
.production-detail img { width: 100%; height: auto; }
.about-editorial .cs-top .h1 { max-width: 20ch; }
.about-intro-actions { margin-top: 22px; }
.availability-location { display: block; color: var(--muted); margin-top: 3px; }
.about-foundation { border-left: 1px solid var(--rule); padding-left: 22px; margin-top: 8px; }
.about-experience { border-top: 1px solid var(--rule); }
.about-experience article { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: baseline; gap: 28px; padding-block: 24px; border-bottom: 1px solid var(--rule); }
.about-experience article > div { display: grid; gap: 10px; }
.about-experience article p { color: var(--body); font-size: 15px; max-width: 60ch; }
.about-experience article .project-date { font-size: 12px; margin: 0; color: var(--muted); }
.about-tools { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px 40px; padding: 30px; background: #f5f5f2; }
.about-tools article { min-width: 0; }
.about-tools h3 { font-size: 17px; line-height: 1.4; margin-bottom: 10px; letter-spacing: -.015em; }
.about-tools p { color: var(--body); font-size: 15px; line-height: 1.65; }
.about-tools p + p { margin-top: 8px; color: var(--muted); font-size: 13px; }
.about-tools article:last-child { grid-column: 1 / -1; padding-top: 24px; border-top: 1px solid var(--rule); }
.closing-installation { margin-top: clamp(56px,7vw,96px); }
.closing-installation img { width: 100%; height: auto; object-fit: contain; }
.closing-installation + .next-proj { margin-top: 40px; }
.project-feature { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(0,1fr); gap: 36px; align-items: center; }
.project-feature .text { gap: 18px; }
.project-feature .h2 { margin-top: -8px; }
.project-feature .product-image { min-width: 0; }
.product-image .enlarge { aspect-ratio: 1.15; background: #fff; }
#maharam .product-image .enlarge { aspect-ratio: 1584 / 1008; }
.product-image img { object-fit: contain; }
.film-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.film-card { display: grid; grid-template-rows: subgrid; grid-row: span 4; gap: 18px; min-width: 0; }
.film-card .film-image .enlarge { aspect-ratio: 1; }
.film-image img { object-fit: cover; }
.film-title { display: grid; gap: 10px; align-content: start; }
.film-title .eyebrow { font-size: 12px; }
.film-title .h3 { font-size: 22px; }
.film-card .text { font-size: 15px; line-height: 1.65; flex: 1; }
.film-card .project-date { margin: 0; }
.splines .groups button, .splines .reset { min-width: 44px; min-height: 44px; }
.splines .ui { align-items: center; flex-wrap: wrap; }
.splines .reset { margin-left: auto; }
.splines canvas { touch-action: pan-y; }
.splines canvas:focus-visible { outline-offset: -4px; }
@media (min-width:761px) and (pointer:fine) {
  .splines .ui { left: 8px; right: 8px; bottom: 8px; gap: 6px; }
  .splines .groups { gap: 2px; padding: 2px; background: rgba(255,255,255,.9); }
  .splines .groups button, .splines .reset { min-width: 0; min-height: 26px; padding: 0 7px; font-size: 11px; font-weight: 450; line-height: 1.2; color: var(--ink); }
  .splines .groups button[aria-pressed="true"] { background: var(--ink); color: #fff; }
  .splines .reset { background: rgba(255,255,255,.9); }
  .splines .hint { font-size: 11px; padding: 3px 6px; }
}
.gallery-dialog { position: fixed; inset: 0; width: min(1440px,100vw); height: 100dvh; max-width: 100vw; max-height: 100dvh; margin: auto; border: 0; padding: 20px 28px; background: #f9f9f6; color: var(--ink); }
.gallery-dialog::backdrop { background: rgba(20,22,19,.85); }
.gallery-dialog[open] { display: grid; grid-template-rows: auto minmax(0,1fr) auto; gap: 16px; }
.gallery-toolbar, .gallery-controls { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.gallery-toolbar p { font-size: 15px; }
.gallery-dialog button { cursor: pointer; min-height: 44px; padding: 8px 16px; background: transparent; border: 1px solid #d1d3cd; color: var(--ink); font-size: 14px; }
.gallery-dialog button:hover, .gallery-dialog button:focus-visible { background: #eceee7; }
.gallery-dialog button:disabled { opacity: .3; cursor: default; }
.gallery-image { display: grid; place-items: center; min-height: 0; min-width: 0; }
.gallery-image img { width: 100%; height: 100%; min-height: 0; max-height: 100%; object-fit: contain; }
.gallery-controls span { font-size: 13px; color: var(--muted); }
body.gallery-open { overflow: hidden; }
@media (min-width:1001px) {
  .cs-body .wrap { grid-template-columns: 180px minmax(0,1fr); gap: 52px; }
  .chapters { max-width: 1040px; }
}
@media (max-width:1000px) {
  .rail a, .rail a[aria-current="true"] { min-height: 44px; display: flex; align-items: center; }
  .chapter { scroll-margin-top: 154px; }
  .contribution-grid { gap: 18px; }
}
@media (max-width:760px) {
  .crumb { font-size: 12px; padding-top: 22px; }
  .cs-top .h1 { font-size: clamp(34px,10vw,46px); line-height: 1.08; text-wrap: pretty; }
  .cs-top .wrap { gap: 26px; padding-bottom: 28px; }
  .facts { font-size: 13px; grid-template-columns: 78px minmax(0,1fr); }
  .facts dt { font-size: 12px; }
  .desktop-facts, .desktop-lede { display: none; }
  .phone-lede { display: block; }
  .phone-facts { display: block; margin-top: 18px; }
  .phone-facts-title { font-size: 13px; line-height: 1.5; font-weight: 500; color: var(--muted); padding-block: 12px; border-bottom: 1px solid var(--rule); }
  .phone-facts .facts { border-top: 0; }
  .porcelain-hero .frame { aspect-ratio: 3 / 2; }
  .porcelain-hero img { object-fit: contain; }
  .chapter { gap: 20px; }
  .chapter .text { gap: 13px; }
  .chapters { gap: 60px; }
  .contribution-grid, .project-feature { grid-template-columns: 1fr; gap: 26px; }
  .contribution-grid article { grid-template-columns: 1fr; gap: 16px; }
  .contribution-grid .text { font-size: 16px; }
  .contribution-grid figure .enlarge { aspect-ratio: 1.15; }
  .text-grid { gap: 24px; }
  .color-study, .turntable-pair { grid-template-columns: 1fr; gap: 24px; }
  .production-note { grid-template-columns: 1fr; gap: 20px; }
  .about-editorial .cs-top .h1 { max-width: 18ch; font-size: 34px; }
  .about-experience article { grid-template-columns: 1fr; gap: 12px; }
  .about-tools { grid-template-columns: 1fr; gap: 24px; padding: 24px 20px; }
  .about-foundation { padding-left: 18px; }
  .color-study figure > img { max-height: 360px; }
  .project-feature { gap: 14px; }
  .project-feature .text { display: contents; }
  .project-feature .text > .eyebrow { order: -3; }
  .project-feature .text > h2 { order: -2; margin-top: -5px; margin-bottom: 5px; }
  .project-feature .product-image { order: -1; margin-bottom: 6px; }
  .project-feature .project-date { margin-top: 0; }
  .product-image .enlarge { aspect-ratio: 1.25; }
  .film-grid { grid-template-columns: 1fr; gap: 40px; }
  .film-card { display: flex; flex-direction: column; gap: 16px; }
  .film-card .film-title { min-height: 0; }
  .film-card .film-image .enlarge { aspect-ratio: 1.2; }
  .film-title .h3 { font-size: 23px; }
  .film-card .text { font-size: 16px; }
  .film-card .film-title { order: -1; }
  .splines .ui { left: 8px; right: 8px; bottom: 8px; gap: 6px; }
  .splines .groups { gap: 0; }
  .splines .groups button { font-size: 12px; padding: 0 8px; }
  .splines .reset { font-size: 12px; padding-inline: 10px; }
  .gallery-dialog { padding: 12px 14px; gap: 12px; }
  .gallery-toolbar p { font-size: 13px; max-width: 60%; }
  .gallery-dialog button { font-size: 13px; padding: 8px 12px; }
}
@media (prefers-reduced-motion:reduce) {
  .enlarge img, .next-proj strong { transition: none; }
}
