/* 2026-08-13 local refinement: editorial hierarchy, natural media ratios, varied motion. */

/* Every photographic/video source stays complete. Frames absorb mismatched ratios. */
body img,
body video {
  object-fit: contain !important;
  object-position: center !important;
}

.wrap { width:min(1560px,calc(100% - 64px)); max-width:none; }
.block { overflow:clip; }
.section-heading { align-items:flex-start; gap:40px; }
.sectitle { max-width:20ch; }
.section-index { font-size:clamp(4.6rem,10vw,10rem); line-height:.72; margin-right:0; }

/* Meaningful words settle once into the site's editorial sans. */
.type-settle {
  display:inline-block;
  color:var(--teal);
  font-family:var(--serif);
  font-style:italic;
  font-weight:400;
  letter-spacing:-.04em;
  transition:font-family .01s step-end,color .5s ease,font-style .5s ease,letter-spacing .5s ease;
}
.type-settle.is-settled {
  font-family:"Arial Black","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  font-style:normal;
  letter-spacing:-.065em;
}

/* NEWS: TV first, archive second, QuizKnock last. */
.media-tier-heading,
.quiz-feature__head {
  position:relative;
  display:grid;
  grid-template-columns:180px minmax(260px,.8fr) minmax(320px,1fr);
  align-items:end;
  gap:28px;
  padding:20px 0 18px;
  margin-top:42px;
  border-bottom:1px solid rgba(255,255,255,.22);
}
.media-tier-heading::before,
.quiz-feature__head::before {
  content:"";
  position:absolute;
  left:0; top:0;
  width:72px; height:2px;
  background:var(--teal);
  transform-origin:left;
}
.media-tier-heading span,
.quiz-feature__head>span { color:var(--teal); font-size:.72rem; letter-spacing:.2em; }
.media-tier-heading h3,
.quiz-feature__head h3 { margin:0; font-size:clamp(1.25rem,2vw,2rem); line-height:1.1; }
.media-tier-heading p,
.quiz-feature__head p { margin:0; color:var(--muted); line-height:1.75; }
.media-tier-heading--secondary { margin-top:76px; }

.nmarq { overflow:visible; margin-top:24px; }
.nmarq .ntrack {
  display:grid !important;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:18px !important;
  transform:none !important;
  width:auto !important;
}
.nmcard {
  width:auto !important;
  min-width:0 !important;
  height:auto !important;
  display:flex !important;
  flex-direction:column;
  border:1px solid rgba(255,255,255,.13);
  background:rgba(7,13,20,.78);
  transform:none !important;
}
.nmcard:nth-child(1),.nmcard:nth-child(2) { grid-column:span 1; }
.nmvisual {
  height:auto !important;
  min-height:0 !important;
  aspect-ratio:auto !important;
  display:grid;
  place-items:center;
  padding:14px;
  background:linear-gradient(145deg,rgba(70,230,211,.08),rgba(255,255,255,.025));
  overflow:visible !important;
}
.nmvisual::before { display:none !important; }
.nmvisual .nmi { position:relative !important; inset:auto !important; width:100%; height:auto !important; aspect-ratio:auto !important; transform:none !important; }
.nmshots { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; padding:0 14px 14px; }
.nmshots img { width:100%; height:auto !important; aspect-ratio:auto !important; }
.nmt { margin-top:auto; padding:20px !important; }
.nmtl { font-size:clamp(1.02rem,1.35vw,1.32rem) !important; }
.nmdesc { -webkit-line-clamp:4 !important; }
.nmo { position:static !important; justify-self:start; margin-top:10px; }

.newsbox { margin-top:22px; }
.nrow { border-color:rgba(255,255,255,.13); }
.nhead { grid-template-columns:86px 118px minmax(0,1fr) minmax(140px,.28fr) !important; min-height:104px; }
.nthumb { width:74px !important; height:64px !important; border-radius:0 !important; overflow:hidden; background:#101a23; }
.nthumb img.art { position:absolute; inset:6px; width:calc(100% - 12px); height:calc(100% - 12px); }
.ndet .ngallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.ndet .ngallery .nimg,
.ndet .nimg { width:100%; height:auto !important; max-height:none !important; aspect-ratio:auto !important; margin:0; background:#0b121a; }
.nbmore { border-radius:0 !important; min-height:52px; }

.quiz-feature { margin:86px 0 10px; padding-top:0 !important; border-top:0 !important; }
.quiz-feature__grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:24px; }
.quiz-work { display:grid; grid-template-columns:minmax(260px,.92fr) minmax(250px,1.08fr); min-height:0; border:1px solid rgba(255,255,255,.14); }
.quiz-work figure { min-height:0 !important; display:grid; place-items:center; padding:12px; background:#101720; overflow:visible; }
.quiz-work img { width:100%; height:auto !important; aspect-ratio:auto !important; transform:none !important; }
.quiz-work>div { padding:22px; }

/* AIconication: actual official first view, explicit destination. */
.aicone-head { grid-template-columns:minmax(360px,.72fr) minmax(520px,1.28fr); gap:clamp(36px,5vw,86px); align-items:center; }
.aiconication-live { display:block; color:inherit; border:1px solid rgba(255,255,255,.18); background:#08121a; }
.aiconication-live figure { margin:0; }
.aiconication-live img { display:block; width:100%; height:auto !important; }
.aiconication-live figcaption {
  display:grid;
  grid-template-columns:180px minmax(0,1fr);
  gap:6px 24px;
  padding:18px 20px 20px;
  border-top:1px solid rgba(255,255,255,.16);
  background:linear-gradient(90deg,rgba(70,230,211,.1),transparent 38%);
}
.aiconication-live figcaption span { grid-row:span 2; color:var(--teal); font-size:.68rem; letter-spacing:.16em; }
.aiconication-live figcaption strong { font-size:1rem; }
.aiconication-live figcaption small { color:var(--muted); }
.aiconication-live:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }
.aiconication-live:hover figcaption strong { color:var(--teal); }

/* Compact site journal. */
#journal { min-height:0 !important; padding:clamp(70px,8vw,120px) 0; background:#0b121b; }
.journal-wrap {
  width:min(1420px,calc(100% - 64px)) !important;
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:minmax(360px,.9fr) minmax(420px,1.1fr) !important;
  gap:clamp(40px,6vw,100px) !important;
  align-items:center !important;
}
.journal-media { margin:0; padding:16px; border:1px solid rgba(255,255,255,.15); background:#050a10; }
.journal-media video { display:block; width:100%; height:auto !important; }
.journal-media figcaption { padding-top:10px; color:var(--muted); font-size:.66rem; letter-spacing:.18em; }
.journal-copy { max-width:650px; }
.journal-title { margin:16px 0 24px; font-size:clamp(2.4rem,5vw,5rem) !important; line-height:1.02; }
.journal-lead { max-width:58ch; }
.journal-link { margin-top:32px; max-width:540px; border-radius:0 !important; }

/* Research: copy and visual evidence share the width. */
#research-area,#bansou-area { max-width:none !important; }
.research-stage { grid-template-columns:minmax(370px,.82fr) minmax(520px,1.18fr) !important; gap:clamp(38px,5vw,82px) !important; align-items:start; }
.research-copy { max-width:none !important; }
.research-question { font-size:clamp(2rem,4.6vw,5rem) !important; line-height:.94; }
.research-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); margin:30px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.research-meta div { padding:16px 12px 16px 0; }
.research-meta dt { color:var(--teal); font-size:.64rem; letter-spacing:.16em; }
.research-meta dd { margin:8px 0 0; font-size:.9rem; }
.research-collage {
  position:relative !important;
  inset:auto !important;
  min-height:0 !important;
  display:grid !important;
  grid-template-columns:1.25fr .75fr;
  gap:14px;
}
.research-collage figure {
  position:relative !important;
  inset:auto !important;
  width:auto !important;
  height:auto !important;
  margin:0 !important;
  overflow:visible !important;
  border:1px solid rgba(255,255,255,.14);
  background:#0b1219;
  padding:10px;
}
.research-collage .rc-main { grid-row:span 2; align-self:center; }
.research-collage img { width:100%; height:auto !important; filter:none !important; transform:none !important; }
.research-collage figcaption { position:static !important; padding:9px 0 0; }
.research-findings { grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:18px !important; margin-top:52px !important; }

/* Education: denser but still readable. */
.edcols { grid-template-columns:minmax(430px,1fr) minmax(500px,1fr) !important; gap:clamp(38px,5vw,82px) !important; align-items:start !important; }
.bansou-copy .lead { font-size:clamp(1.15rem,1.8vw,1.55rem); }
.bansou-summary { color:var(--muted); line-height:1.9; max-width:64ch; }
.bansou-points { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin:30px 0; border-top:1px solid var(--line); }
.bansou-points article { display:grid; grid-template-columns:38px 1fr; gap:12px; align-items:center; min-height:76px; border-bottom:1px solid var(--line); }
.bansou-points article:nth-child(odd) { border-right:1px solid var(--line); padding-right:16px; }
.bansou-points article:nth-child(even) { padding-left:16px; }
.bansou-points span { color:var(--teal); font-size:.68rem; letter-spacing:.13em; }
.bansou-points b { font-size:.95rem; line-height:1.45; }
.bansou-media { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.bansou-media figure { margin:0; padding:10px; border:1px solid rgba(255,255,255,.14); background:#0b121a; }
.bansou-media img { display:block; width:100%; height:auto !important; }
.bansou-media figcaption { padding-top:9px; color:var(--muted); font-size:.66rem; letter-spacing:.13em; }

/* Profile: text never intersects the rule; image keeps its source ratio. */
.life-list::before { left:144px !important; }
.life-event { grid-template-columns:120px minmax(0,1fr) !important; gap:48px !important; }
.life-body { padding-left:22px; }
.life-body figure { width:min(460px,100%) !important; height:auto !important; }
.life-body img { width:100%; height:auto !important; clip-path:none !important; margin:14px 0 0 !important; }

/* Awards and remaining content media. */
.award-row figure { height:auto !important; min-height:0 !important; overflow:visible; background:#0c151e; padding:6px; }
.award-row figure img,.workcard .workimg { width:100%; height:auto !important; aspect-ratio:auto !important; clip-path:none !important; }

/* Contact uses the full width and sends the selected category with Formspree. */
#contact>.wrap {
  display:grid !important;
  width:min(1560px,calc(100% - 64px)) !important;
  max-width:1560px !important;
  padding:clamp(42px,5vw,78px) !important;
  grid-template-columns:minmax(300px,.58fr) minmax(620px,1.42fr);
  gap:18px clamp(46px,7vw,120px);
  align-items:start;
}
#contact>.wrap>.eyebrow { grid-column:1/-1 !important; grid-row:auto !important; }
.contact-heading,.cform { grid-column:auto !important; grid-row:auto !important; }
.contact-heading { position:sticky; top:118px; }
.contact-heading .sectitle { font-size:clamp(2.8rem,5.5vw,6rem); }
.contact-heading .secsub { max-width:34ch; margin-top:28px; line-height:1.9; }
.cform { max-width:none !important; margin:0 !important; }
.contact-types { margin:0 0 26px; padding:0; border:0; }
.contact-types legend { margin-bottom:12px; font-size:.78rem; letter-spacing:.12em; color:var(--muted); }
.contact-types legend span { color:var(--gold); }
.contact-types { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.contact-types legend { grid-column:1/-1; }
.contact-types label {
  position:relative;
  display:grid;
  grid-template-columns:42px 1fr;
  align-items:center;
  gap:12px;
  min-height:76px;
  padding:13px 15px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(4,11,17,.62);
  cursor:pointer;
  transition:border-color .25s ease,background .25s ease,transform .2s ease;
}
.contact-types label:last-of-type { grid-column:1/-1; }
.contact-types input { position:absolute; opacity:0; width:1px; height:1px; }
.contact-type-no { color:var(--teal); font-size:.7rem; letter-spacing:.14em; }
.contact-types b,.contact-types small { display:block; }
.contact-types b { font-size:.94rem; line-height:1.4; }
.contact-types small { margin-top:4px; color:var(--muted); line-height:1.4; }
.contact-types label:has(input:checked) { border-color:var(--teal); background:rgba(70,230,211,.1); }
.contact-types label:has(input:checked) .contact-type-no { color:#fff; }
.contact-types label:has(input:focus-visible) { outline:3px solid var(--gold); outline-offset:4px; }
.contact-types label:hover { border-color:rgba(70,230,211,.7); transform:translateY(-2px); }
.cform input,.cform textarea,.cform button { border-radius:0 !important; }
.cform button { min-height:56px; }

/* Varied entry rhythm: number, rule, copy, then media. */
.reveal .section-index { opacity:0; transform:translateY(-20px); transition:opacity .55s ease,transform .7s cubic-bezier(.2,.75,.2,1); }
.reveal.in .section-index { opacity:.95; transform:none; }
.reveal .motion-rule::before { transform:scaleX(0); transition:transform .8s cubic-bezier(.2,.75,.2,1); }
.reveal.in .motion-rule::before { transform:scaleX(1); }
.reveal .motion-mask { clip-path:inset(0 100% 0 0); transition:clip-path 1s cubic-bezier(.2,.75,.2,1); }
.reveal.in .motion-mask { clip-path:inset(0 0 0 0); }
.reveal .research-meta,
.reveal .bansou-points { opacity:0; transform:translateX(-24px); transition:opacity .75s ease .15s,transform .85s cubic-bezier(.2,.75,.2,1) .15s; }
.reveal.in .research-meta,
.reveal.in .bansou-points { opacity:1; transform:none; }
.secskew .kj { transition:transform 1.4s cubic-bezier(.2,.75,.2,1); }
.reveal.in~* .secskew .kj { transform:translateY(-10px); }

@media (max-width:1100px) {
  .nmarq .ntrack { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
  .quiz-work { grid-template-columns:1fr; }
  .aicone-head,.research-stage,.edcols { grid-template-columns:1fr !important; }
  .aicone-copy { max-width:760px; }
  .journal-wrap { grid-template-columns:1fr 1fr !important; }
  #contact>.wrap { grid-template-columns:minmax(250px,.55fr) minmax(500px,1.45fr); }
}

@media (max-width:760px) {
  .wrap,.journal-wrap { width:min(100% - 32px,680px) !important; }
  .block { padding-left:0 !important; padding-right:0 !important; }
  .section-heading { gap:18px; }
  .section-index { font-size:clamp(3.5rem,20vw,6rem); }
  .media-tier-heading,.quiz-feature__head { grid-template-columns:1fr; gap:8px; margin-top:30px; }
  .media-tier-heading--secondary { margin-top:54px; }
  .nmarq .ntrack { display:grid !important; grid-template-columns:1fr !important; gap:14px !important; width:100% !important; }
  .nmvisual { padding:10px; }
  .nhead { grid-template-columns:68px minmax(0,1fr) !important; gap:8px 14px !important; padding:12px 0 !important; }
  .nhead .d,.nhead .o { grid-column:2; }
  .nhead .t { grid-column:2; }
  .nthumb { grid-row:1/4; width:60px !important; height:58px !important; }
  .ndet .ngallery { grid-template-columns:1fr; }
  .quiz-feature { margin-top:60px; }
  .quiz-feature__grid { grid-template-columns:1fr; }
  .quiz-work { grid-template-columns:1fr; }
  .aicone-head { gap:34px; }
  .aiconication-live figcaption { grid-template-columns:1fr; gap:6px; }
  .aiconication-live figcaption span { grid-row:auto; }
  #journal { padding:70px 0; }
  .journal-wrap { grid-template-columns:1fr !important; gap:34px !important; }
  .journal-media { padding:10px; }
  .journal-title { font-size:clamp(2.35rem,12vw,4.1rem) !important; }
  .research-question { font-size:clamp(2rem,11vw,3.4rem) !important; }
  .research-meta { grid-template-columns:1fr; }
  .research-meta div { border-bottom:1px solid var(--line); }
  .research-meta div:last-child { border-bottom:0; }
  .research-collage { grid-template-columns:1fr !important; }
  .research-collage .rc-main { grid-row:auto; }
  .research-findings { grid-template-columns:1fr !important; }
  .bansou-points,.bansou-media { grid-template-columns:1fr; }
  .bansou-points article:nth-child(odd) { border-right:0; padding-right:0; }
  .bansou-points article:nth-child(even) { padding-left:0; }
  .life-list::before { left:8px !important; }
  .life-event { grid-template-columns:1fr !important; gap:10px !important; padding-left:30px !important; }
  .life-body { padding-left:0; }
  #contact>.wrap { grid-template-columns:1fr; width:calc(100% - 28px) !important; padding:32px 18px !important; }
  .contact-heading { position:static; }
  .contact-heading .sectitle { font-size:clamp(2.8rem,13vw,4.4rem); }
  .contact-types { grid-template-columns:1fr; }
  .contact-types label:last-of-type { grid-column:auto; }
  .crow { grid-template-columns:1fr !important; }
}

@media (prefers-reduced-motion:reduce) {
  .type-settle { transition:none !important; }
  .motion-mask { clip-path:none !important; }
  .motion-rule::before { transform:none !important; }
  .research-meta,.bansou-points,.section-index { opacity:1 !important; transform:none !important; }
  .contact-types label { transform:none !important; }
}