/* Most6 composition. Original Most5 remains a separate comparison. */
.most6-home .hero { display:block; min-height:0; }
.most6-home .hero-most {
  display:grid; grid-template-rows:auto minmax(320px,1fr) auto;
  min-height:max(620px,calc(100svh - var(--header-offset,var(--header-height))));
  border-right:0;
}
.most6-home .hero-most > .panel-meta { background:rgb(0 0 0 / 72%); }
.most6-home .hero-most > .main-display {
  display:flex; position:static; justify-content:flex-end; min-height:0; width:100%;
  padding:0; aspect-ratio:auto;
}
.most6-home .main-display::before { content:none; }
.most6-home .hero-most .main-slideshow {
  position:static; display:grid; width:100%; inset:auto; align-items:end;
}
.most6-home .hero-most .main-slide-stage {
  display:grid; position:static; grid-area:1 / 1; width:100%; min-height:0;
}
.most6-home .hero-most .main-slide {
  display:block; position:static; grid-area:1 / 1;
  width:100%; min-height:0;
}
.most6-home .hero-most .main-slide img {
  position:absolute; inset:0; width:100%; height:100%;
  aspect-ratio:auto; object-fit:cover;
  object-position:var(--slide-position,50% 50%);
}
.most6-home .hero-most .main-slide figcaption {
  position:relative; inset:auto; z-index:1;
  display:flex; align-items:center; width:100%; min-height:64px;
  padding:12px calc(var(--gutter) + 280px) 12px var(--gutter);
  color:var(--white); background:rgb(0 0 0 / 78%);
  font-size:14px; line-height:1.5;
}
.most6-home .hero-most .main-slide-controls {
  position:relative; inset:auto; grid-area:1 / 1; justify-self:end; z-index:2;
  display:flex; flex-wrap:nowrap; justify-content:flex-end; gap:16px;
  width:264px; min-height:64px; margin-right:var(--gutter); padding:0;
  border:0; background:none; font-size:14px;
}
.most6-home .hero-intro {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:calc(2 * var(--gutter)); padding:48px var(--gutter);
  position:relative; z-index:2;
  color:var(--white); background:rgb(0 0 0 / 72%); border-top:1px solid var(--light-line);
}
.most6-home .hero-intro > * { padding:0; }
.most6-home .hero-intro .hero-statement { font-size:clamp(32px,3.8vw,64px); }
.most6-home .hero-intro .hero-detail { align-self:center; max-width:var(--prose-measure,44rem); }
.most6-home #systems .tool--inquiry h3 { color:var(--signal); }
.most6-home #systems .tool summary { padding-block:32px; }
.most6-home #systems .tool-role { align-self:start; padding-top:.3em; }

/* The IQB link belongs to IQB; the following orange band introduces NODE. */
.most6-home #case-iqb > .iqb-project-entry {
  display:flex; flex-direction:column; align-items:stretch; justify-content:space-between; gap:1.5rem;
  min-height:10rem; padding:1.5rem var(--gutter);
  color:var(--paper); background:var(--ink);
  border-top:1px solid var(--light-line); border-bottom:1px solid var(--ink);
}
.most6-home #case-iqb .iqb-project-entry__main {
  display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem;
  min-width:0; min-height:3.5rem; padding:0; border:0;
  color:inherit; background:transparent; text-decoration:none;
}
.most6-home #case-iqb .iqb-project-entry__main:hover .iqb-project-entry__label {
  text-decoration:underline; text-underline-offset:.2em;
}
.most6-home #case-iqb .iqb-project-entry__main:focus-visible {
  outline:2px solid var(--paper); outline-offset:4px;
}
.most6-home #case-iqb>.iqb-project-entry>.project-credits {
  margin:0; padding:0; width:100%; max-width:none;
}
/* A static poster fills the title surface. Keep the source geometry intact;
   reveal the model on the right while shading the heading on the left. */
.most6-home #case-iqb .case-title--model>.title-media {
  object-fit:cover; object-position:50% 50%;
}
.most6-home #case-iqb .case-title--model::after {
  background:linear-gradient(90deg,rgb(10 10 10 / 55%),rgb(10 10 10 / 20%) 45%,rgb(10 10 10 / 0%) 72%);
}
.most6-home .iqb-project-entry__label {
  display:flex; align-items:baseline; flex-wrap:wrap; gap:12px 32px;
  font-size:var(--most6-subheading-size,24px); font-weight:600; line-height:1.4;
}
.most6-home .iqb-project-entry__label > span { font-size:var(--most6-body-size,18px); font-weight:400; }
.most6-home .iqb-project-entry__arrow {
  display:grid; place-items:center; flex:none; width:56px; height:56px;
  font-size:32px; line-height:1; background:var(--signal); color:var(--ink);
}
.most6-home #case-iqb > .iqb-project-entry:hover { background:#242424; }
.most6-home .iqb-project-entry:focus-visible { outline-offset:-6px; }
.most6-home .node-intro {
  display:grid; grid-column:1 / -1; grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:calc(2 * var(--gutter)); row-gap:24px;
  padding:48px var(--gutter); background:var(--signal); color:var(--ink);
  border-bottom:1px solid var(--ink);
}
.most6-home .node-intro__title { display:flex; flex-direction:column; gap:16px; }
.most6-home .node-intro h2 { font-size:clamp(48px,5vw,80px); font-weight:700; line-height:1; letter-spacing:-.06em; }
.most6-home .node-intro__copy { max-width:var(--prose-measure,44rem); }
.most6-home .node-intro__copy > p + p { margin-top:1em; }
.most6-home #open-lab .lab-copy { align-items:start; }
.most6-home #open-lab .lab-copy > h3 { margin:0; }

@media (max-width:900px) {
  .most6-home .hero-most {
    min-height:0; grid-template-rows:auto minmax(clamp(320px,58svh,660px),1fr) auto;
  }
  .most6-home .hero-most .main-slideshow { grid-template-rows:auto auto; }
  .most6-home .hero-most .main-slide img {
    object-position:var(--slide-mobile-position,var(--slide-position,50% 50%));
  }
  .most6-home .hero-most .main-slide figcaption {
    min-height:64px; padding:12px var(--gutter);
  }
  .most6-home .hero-most .main-slide-controls {
    grid-area:2 / 1; width:100%; min-height:48px; margin:0;
    padding:0 var(--gutter); border-top:1px solid var(--light-line); background:rgb(0 0 0 / 78%);
  }
  .most6-home .hero-intro { padding-block:32px; }
  .most6-home #open-lab .lab-copy { display:grid; grid-template-columns:1fr; gap:24px; }
  .most6-home #open-lab .lab-copy > p { grid-column:auto; }
}
@media (max-width:600px) {
  .most6-home .hero-intro { grid-template-columns:1fr; gap:24px; }
  .most6-home .hero-intro .hero-detail { padding:0; max-width:none; }
  .most6-home .hero-statement { max-width:none; overflow-wrap:normal; word-break:normal; }
  .most6-home #systems .tool summary { padding-block:24px; }
  .most6-home .node-intro { grid-template-columns:1fr; padding-block:32px; gap:24px; }
  .most6-home #case-iqb > .iqb-project-entry { padding-block:1.25rem; min-height:9rem; }
  .most6-home #case-iqb .iqb-project-entry__main { min-height:3rem; }
  .most6-home .iqb-project-entry__label { flex-direction:column; gap:4px; }
  .most6-home .iqb-project-entry__arrow { width:48px; height:48px; }
}

/* The IQB mobile footer now carries readable 14px notes. Reserve that space
   explicitly so the institute name and reading text cannot touch its rule. */
@media (max-width:650px) {
  .most6-page .iqb-detail .hero-identity,
  .most6-page .iqb-detail .hero-question { height:auto; bottom:150px; }
  .most6-page .iqb-detail .hero-subtitle { bottom:64px; }
  .most6-page .iqb-detail .hero-institute { bottom:0; }
}
/* Record photographs: source padding belongs to the photograph, not letterboxes.
   The right column sets stable image geometry; the black cover spans both rows.
   cover may trim neutral source margins, never stretch the book proportions. */
.most6-page.about-page .about-records-grid {
  grid-template-rows: auto auto;
  grid-auto-rows: auto;
}
.most6-page.about-page .about-record--model,
.most6-page.about-page .about-record--practice {
  grid-template-rows: auto auto;
}
.most6-page.about-page .about-record--model .about-record-image,
.most6-page.about-page .about-record--practice .about-record-image {
  aspect-ratio: 16 / 9;
}
.most6-page.about-page .about-record-image img { object-fit: cover; }
@media (max-width: 600px) {
  .most6-page.about-page .about-records-grid { grid-template-rows: none; }
  .most6-page.about-page .about-record--theory .about-record-image { aspect-ratio: 5 / 6; }
}

/* JP and EN share one English diagram in the site's display typeface.
   Alphabetic baselines allow actual ink bounds to be centred after font load;
   override the legacy middle baseline and language-specific/mobile font sizes. */
.most6-page.about-page .about-cycle-svg .about-cycle-node-title {
  font-family: var(--display);
  font-size: 21px;
  font-weight: 600;
  letter-spacing: 0;
  text-anchor: middle;
  dominant-baseline: alphabetic;
}
.most6-page.about-page .about-cycle-svg .about-cycle-brand-copy {
  font-family: var(--display);
  font-size: 17px;
  font-weight: 400;
  letter-spacing: 0;
  text-anchor: middle;
  dominant-baseline: alphabetic;
}

/* r17: component geometry; text roles remain in most6-brand.css. */
.most6-home #systems .tool[open] .tool-note {
  max-width:none; padding:1.5rem var(--gutter) 2rem;
  background:var(--paper);color:var(--ink);
}
.most6-home #systems .tool-note>p {max-width:36em}
.most6-home #systems .tool[open] .tool-note .note-label {color:var(--most-muted-light)!important}
.most6-home #systems .tool[open]>summary {border-bottom:1px solid var(--ink)}
.most6-home .project-credits {margin-block:2rem 0}
.most6-home .project-credits p {margin-block:.5rem 0}
.most6-home .photography-credits {margin:2rem var(--gutter);padding-block:1rem;border-top:1px solid var(--line)}
.most6-home .photography-credits>summary {min-height:2.75rem;cursor:pointer;display:flex;align-items:center}
.most6-home .photography-credit-list {padding-block:1rem}
.about-page .about-photography-credit-link {display:block;margin-block:0 2rem}
/* Long English labels reflow with the user's enlarged text setting. */
.about-page .about-system-return>span{min-width:0;overflow-wrap:anywhere}
.about-page #about-lab-title{max-width:100%;min-width:0;overflow-wrap:anywhere}

/* The circular diagram retains readable labels in a contained two-dimensional
   viewport. Its explanatory prose continues to reflow with the page. */
.about-page .about-cycle-canvas{width:100%;max-width:36rem;min-width:0;align-self:center;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
.about-page .about-cycle-canvas:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.about-page .about-cycle-canvas .about-cycle-svg{min-width:27rem;max-width:36rem}
.about-page .about-intro-heading .lead{max-width:36em;text-wrap:pretty}
/* Hit areas have geometry independent of their shared reading sizes. */
body.most6-page :is(.most-footer-nav a,.most-footer-contact>a,.most-footer-enquiry-links a,.most-footer-records,.most-footer-bottom a){display:inline-flex;align-items:center;min-height:2.75rem;min-width:2.75rem}