/* FORMANT — audit layer, 2026-10.
   Loaded after app.css and release.css. Every fix from the October audit lives
   here so the whole pass can be rolled back by removing one <link>. */

/* --white was declared as #FAFA8 (five digits), which is invalid, so the
   reference chips in the brief rendered with no background at all. */
:root{--white:#FAFAF8}

/* ---------------------------------------------------------------- captions --
   Captions printed the production slot format ("CUTOUT · 4:5", "INT · 16:10")
   next to the human label. That is internal bookkeeping, not information for
   a visitor, and on phones it pushed captions onto two or three lines. */
.asset-caption span:last-child{display:none}
.asset-caption span:first-child{flex:1 1 auto}
/* Loaded captions were faded to 42% opacity, which put them well under a
   readable contrast on paper. Keep them quiet, but legible. */
.asset.has-real .asset-caption{opacity:1}
.asset-caption{color:var(--muted)}
.ink .asset-caption{color:#9a9890}
/* The home hero already names the object right under it (E01 / FIGURE ·
   EDITION 01 / 25); the generic caption above it repeated the same words. */
.hero-object .asset-caption{display:none}

/* ------------------------------------------------------------ header / nav -- */
/* The inactive language read at roughly 2:1 contrast and looked disabled. */
.locale button,.mobile-bottom button{color:var(--muted);opacity:1!important}
.locale button:hover,.mobile-bottom button:hover{color:var(--ink)}
.locale span{color:var(--muted2)}
.mobile-bottom button{color:#9a9890}
.mobile-bottom button.on,.mobile-bottom button:hover{color:var(--paper)}

/* ------------------------------------------------------------------ specs --
   On /objects/arc/ the note under the spec table fell into the first grid
   column and was squeezed to a ~90px strip of one-word lines. */
.specs .spec-note{grid-column:7/13;margin:22px 0 0;padding-top:18px;border-top:1px solid var(--line);color:var(--muted);font-size:14px;line-height:1.55;max-width:60ch}
@media(max-width:720px){.specs .spec-note{margin-top:20px}}

/* ------------------------------------------------------------------ brief -- */
.brief-step h2:focus{outline:none}
.brief-error{margin:14px 0 0;color:var(--signalDark);font-size:14px;line-height:1.45}
.brief-contact.error input:required:invalid,.brief-contact.error input[type="email"]:invalid{border-color:var(--signal)}

/* ------------------------------------------------------------ mobile fixes -- */
@media(max-width:720px){
  /* Full-bleed "in space" scenes were letterboxed with black bars above and
     below, and the headline sat on top of the picture. On phones the image now
     shows whole at its own proportion with the copy on ink underneath. */
  .gallery-stage{min-height:0!important;display:flex;flex-direction:column}
  .gallery-stage>.asset{position:relative!important;inset:auto!important;height:auto!important}
  .gallery-stage>.asset .asset-frame{height:auto!important;aspect-ratio:var(--ratio)!important;background:var(--ink)!important}
  .gallery-stage>.asset .asset-real{object-fit:cover!important}
  .gallery-stage>.asset[data-asset="E01-FIGURE-CG-HERO-01"] .asset-frame{aspect-ratio:4/5!important}
  .gallery-copy,.gallery-stage>.asset[data-asset]+.gallery-copy{position:relative!important;top:auto!important;left:auto!important;right:auto!important;bottom:auto!important;max-width:none!important;padding:26px var(--page-pad,20px) 44px!important;color:var(--paper)!important;text-shadow:none!important}
  .gallery-stage>.asset .asset-frame::after{display:none!important}
  .gallery-feature:not(.ink) .gallery-copy{background:var(--ink)}

  /* Response charts were scaled down to ~350px wide with unreadable axes.
     They keep a readable size and scroll sideways inside their own frame. */
  .chartfig,.calib-curve{overflow-x:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;scrollbar-width:thin}
  .chartfig svg,.calib-curve svg{min-width:620px}
  .chartfig figcaption,.calib-curve figcaption{position:sticky;left:0;max-width:calc(100vw - 2*var(--page-pad,20px))}

  /* Home: bespoke collage. Two pictures sat side by side at thumbnail size
     with captions wrapping into three lines. */
  .process-collage{display:block!important}
  .process-collage>*:nth-child(1),.process-collage>*:nth-child(2),.process-collage>*:nth-child(3){width:100%!important;margin:0 0 22px!important}
  .process-collage>*:nth-child(2){width:72%!important;margin-left:auto!important}

  /* Home / bespoke: selected-work cards. The title was pushed to the right
     edge, away from its picture and meta line. */
  .work-card>div:last-child{display:block!important;padding-top:12px}
  .work-card>div:last-child .mono{display:block;margin-bottom:6px}
  .work-card.small{width:82%!important}
}

/* Product cutouts float on paper and are always named by the heading or label
   right next to them ("F01 / COLUMN" appeared up to three times per object).
   Captions stay on photographs, where they add information. */
.asset-cutout .asset-caption{display:none}
/* Same for project cards: the card's own meta line and title already name the
   project, so the photo caption under it only repeated them. */
.work-card .asset-caption,.work-index-item .asset-caption{display:none}