/* ═══════════════════════════════════════════════════════════════════
   GLAMMBOX 2026 — MODELS (Builder 2)
   The V1 lab cards carried eleven different border colours ("a tag-cloud,
   not a system") and set copy straight on a busy screen-recording with no
   contrast. One system now: one hairline, one scrim, one type scale. The
   lab's own colour survives only as a 2px mark on the kicker rule.
   Content and links are untouched.
   ─────────────────────────────────────────────────────────────────── */

.mind-grid{
  display:grid;gap:clamp(.8rem,1.5vw,1.2rem);margin:var(--s-7) 0 var(--s-9);
  grid-template-columns:1fr;
}
@media (min-width:820px){.mind-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1320px){.mind-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* one card system — the candy borders are retired */
.mind,
.mind-claude,.mind-sol,.mind-grok,.mind-gemini,.mind-qwen,.mind-kimi,
.mind-meta,.mind-nvidia,.mind-deepseek,.mind-minimax,.mind-glm,.mind-msft{
  position:relative;isolation:isolate;overflow:hidden;
  background:var(--gb-ink);
  border:0!important;
  border-radius:var(--r-md);
  box-shadow:inset 0 0 0 1px var(--gb-line-soft);
  display:flex;flex-direction:column;
  transition:transform var(--d-md) var(--e-out),box-shadow var(--d-md) var(--e-out);
}
@media (hover:hover) and (pointer:fine){
  .mind:hover{transform:translateY(-4px);box-shadow:inset 0 0 0 1px var(--gb-line-strong),var(--gb-shadow-soft)}
}

/* the film plate: a backdrop, not a subject. Darkened hard so the copy
   that sits over it is actually readable — that was the flaw. */
.mind .mind-plate{
  position:relative;display:block;
  aspect-ratio:16/9;width:100%;overflow:hidden;
  background:var(--gb-black);
  border-bottom:1px solid var(--gb-line-soft);
  margin:0;padding:0;
}
.mind .mind-plate video,
.mind .mind-plate img:not(.mind-logo){
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;display:block;
  filter:saturate(.62) contrast(1.04) brightness(.72);
}
.mind .mind-plate::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(to top,var(--gb-ink) 2%,rgba(11,13,16,.42) 38%,rgba(11,13,16,.12) 100%);
}
.mind-logo{
  position:absolute;z-index:2;left:var(--s-5);bottom:var(--s-4);
  width:auto;max-width:38%;max-height:2.1rem;height:auto;
  object-fit:contain;filter:none!important;opacity:.94;
}
.mind-veil{display:none}

.mind-copy{
  position:relative;z-index:2;
  display:flex;flex-direction:column;gap:var(--s-2);
  padding:var(--s-5);
  flex:1;
}
/* the lab mark: a short rule in the lab's own colour, then mono caps.
   Identity kept, tag-cloud gone. */
.mind .kicker{
  display:flex;align-items:center;gap:var(--s-3);
  font-family:var(--f-mono)!important;font-size:var(--t-label)!important;
  letter-spacing:var(--tr-label)!important;text-transform:uppercase;
  color:var(--gb-mute)!important;
  margin:0!important;padding:0!important;
}
.mind .kicker::before{
  content:"";width:1.6rem;height:2px;flex:none;border-radius:2px;
  background:var(--mind-mark,var(--gb-ember));
}
.mind-claude{--mind-mark:#D97757}.mind-sol{--mind-mark:#10A37F}
.mind-grok{--mind-mark:#EFEBE3}.mind-gemini{--mind-mark:#4285F4}
.mind-qwen{--mind-mark:#8B5CF6}.mind-kimi{--mind-mark:#EFEBE3}
.mind-meta{--mind-mark:#0081FB}.mind-nvidia{--mind-mark:#76B900}
.mind-deepseek{--mind-mark:#4D6BFE}.mind-minimax{--mind-mark:#FF5C35}
.mind-glm{--mind-mark:#5B50FF}.mind-msft{--mind-mark:#EFEBE3}
/* the coloured body text is retired — it was the second half of the mess */
.mind .now{color:var(--gb-bone-soft)!important}

.mind h2{
  font-family:var(--f-display)!important;font-weight:520!important;
  font-size:var(--t-lg)!important;line-height:1.04;
  letter-spacing:var(--tr-head)!important;
  color:var(--gb-bone);
  margin:var(--s-1) 0 0!important;padding:0!important;
}
.mind .mind-names{
  font-family:var(--f-mono)!important;font-size:var(--t-label)!important;
  letter-spacing:var(--tr-label)!important;text-transform:uppercase;
  color:var(--gb-dim)!important;margin:0!important;padding:0!important;
}
.mind p{
  font-size:var(--t-sm);line-height:1.58;
  color:var(--gb-bone-soft);margin:0;padding:0!important;
  letter-spacing:var(--tr-body);
}
.mind-chips{margin:var(--s-2) 0 0!important;padding:0!important}
.mind-chips li{border-color:var(--gb-line-strong)}

/* "Full profile" — a real disclosure row, not a bare summary */
.mind-more{margin-top:auto;border-top:1px solid var(--gb-line-soft)}
.mind-more > summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:var(--s-3);
  min-height:48px;padding:0 var(--s-5);
  font-family:var(--f-mono);font-size:var(--t-label);
  letter-spacing:var(--tr-label);text-transform:uppercase;
  color:var(--gb-dim);
  transition:color var(--d-sm) var(--e-out),background var(--d-sm) var(--e-out);
}
.mind-more > summary::-webkit-details-marker{display:none}
.mind-more > summary::after{
  content:"";width:.55rem;height:.55rem;flex:none;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translateY(-2px);
  transition:transform var(--d-sm) var(--e-out);
}
.mind-more[open] > summary::after{transform:rotate(-135deg) translateY(-2px)}
.mind-more > summary:hover{color:var(--gb-bone);background:var(--gb-glass-hi)}
.mind-more > summary:focus-visible{outline:2px solid var(--gb-ember);outline-offset:-2px}
.mind-more > p{padding:0 var(--s-5) var(--s-4)!important;font-size:var(--t-sm)}
.mind-more > p:first-of-type{padding-top:var(--s-3)!important}
.mind-more b{color:var(--gb-bone);font-weight:560}

/* section furniture */
.mind-band{
  font-family:var(--f-mono);font-size:var(--t-label);
  letter-spacing:var(--tr-label);text-transform:uppercase;
  color:var(--gb-mute);
  margin:var(--s-9) 0 var(--s-4);
  padding-bottom:var(--s-3);
  border-bottom:1px solid var(--gb-line);
}
.labs-updated{
  font-size:var(--t-body);line-height:var(--lh-body);
  color:var(--gb-bone-soft);max-width:60ch;
}

/* the primer was a 1px rectangle wrapped around a definition list —
   the exact "cheap card" the house law bans. It is an editorial
   appendix now: a rule, a column of type, and air. */
.model-primer{
  border:0!important;border-top:1px solid var(--gb-line)!important;
  border-radius:0!important;background:none!important;
  padding:var(--s-7) 0 0!important;
}
.model-primer dt,.model-primer b{
  font-family:var(--f-mono);font-size:var(--t-label);
  letter-spacing:var(--tr-label);text-transform:uppercase;
  color:var(--gb-ember)!important;
}
.model-primer dd,.model-primer p{color:var(--gb-bone-soft);font-size:var(--t-sm);line-height:1.55}

/* the fold was a definition list on black, then a screenshot behind a
   fade band. A company's own landing film now runs FULL-BLEED across
   the top of the room, with the headline on a floor of shade under it. */
.models-mast-film{
  position:absolute;left:50%;top:0;transform:translateX(-50%);
  width:100vw;height:clamp(300px,46vh,480px);
  overflow:hidden;pointer-events:none;z-index:0;
}
.models-mast-film::after{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(7,8,10,.30) 0%,rgba(7,8,10,.10) 28%,rgba(7,8,10,.82) 72%,var(--gb-black) 96%),
    linear-gradient(90deg,rgba(7,8,10,.62) 0%,rgba(7,8,10,.10) 54%,rgba(7,8,10,.16) 100%);
}
.models-mast-film .film-el{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 44%}
.room-models main.page{position:relative}
.room-models .mast,.room-models > .lede,.room-models .model-primer{position:relative;z-index:1}
/* the headline lands inside the film; the lede must clear it, or the
   film's hard bottom edge slices the paragraph in half. */
.room-models .mast{padding-top:clamp(5rem,16vh,9rem);padding-bottom:clamp(2rem,6vh,4rem)}
.room-models > .lede{margin-top:clamp(2.5rem,8vh,6rem)}
.room-models .mast h1{
  font-family:var(--f-display);font-weight:500;
  font-size:var(--t-xl);line-height:var(--lh-head);
  letter-spacing:var(--tr-mega);color:var(--gb-bone);
  max-width:17ch;text-transform:none;
  text-shadow:0 10px 44px rgba(3,5,10,.6);
}
@media (max-width:900px){
  .models-mast-film{height:clamp(280px,48vh,420px)}
  .room-models .mast{padding-top:clamp(4rem,16vh,8rem)}
}
