/* 2026-08-13: bilingual social evidence, centered hero, integrated media, calm varied motion. */

html,body { overflow-x:hidden !important; }
.block { scroll-margin-top:82px; }
.herotext {
  top:50% !important;
  transform:translateY(-50%);
  padding-inline:clamp(20px,4vw,64px) !important;
}
.herotext .avatar { width:clamp(72px,7vw,98px); height:clamp(72px,7vw,98px); }
.herotext h1 { font-size:clamp(2.7rem,7vw,5.5rem) !important; }
.herotext p { max-width:54ch; }

/* Official social profile views: screenshots remain uncropped and cards differ by medium. */
.social-hub { background:linear-gradient(135deg,#07131b 0%,#0b1d24 52%,#0b1019 100%); }
.social-hub__lead { max-width:72ch; margin:24px 0 42px; color:#b7c9ce; font-size:clamp(.98rem,1.25vw,1.14rem); line-height:1.9; }
.social-card-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:18px; }
.social-card {
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1.42fr) minmax(240px,.58fr);
  min-width:0;
  color:inherit;
  border:1px solid rgba(255,255,255,.16);
  background:#080e14;
  transition:border-color .25s ease,transform .35s cubic-bezier(.2,.75,.2,1),background .25s ease;
}
.social-card--instagram,.social-card--youtube { grid-column:span 7; }
.social-card--x,.social-card--threads { grid-column:span 5; grid-template-columns:1fr; }
.social-card--youtube { grid-template-columns:minmax(260px,.9fr) minmax(280px,1.1fr); }
.social-card--threads { background:#101010; }
.social-card--x { background:#030303; }
.social-card figure { display:grid; place-items:center; min-width:0; margin:0; padding:10px; background:#05090d; overflow:hidden; }
.social-card img { display:block; width:100%; height:auto !important; max-height:460px; object-fit:contain !important; }
.social-card__copy { position:relative; min-width:0; padding:clamp(22px,3vw,38px); border-left:1px solid rgba(255,255,255,.13); }
.social-card--x .social-card__copy,.social-card--threads .social-card__copy { border-left:0; border-top:1px solid rgba(255,255,255,.13); }
.social-card__index { position:absolute; top:20px; right:22px; color:var(--teal); font-size:.66rem; letter-spacing:.16em; }
.social-card__icon { display:block; width:34px; height:34px; margin-bottom:24px; }
.social-card__icon .bic,.social-card__icon svg { display:block; width:100%; height:100%; }
.social-card h3 { margin:0; font-family:var(--serif); font-size:clamp(1.65rem,2.7vw,3rem); font-weight:400; }
.social-card b { display:block; margin-top:7px; color:var(--teal); font-size:.78rem; letter-spacing:.08em; }
.social-card p { margin:20px 0 30px; color:#b8c6cc; line-height:1.8; }
.social-card__action { display:block; padding:13px 0 9px; border-top:1px solid rgba(255,255,255,.22); color:#f3fbf9; font-size:.77rem; font-weight:750; letter-spacing:.07em; }
.social-card:hover { transform:translateY(-5px); border-color:var(--teal); background:#0d1820; }
.social-card:focus-visible { outline:3px solid var(--gold); outline-offset:5px; }

/* QuizKnock remains the third tier of one media section, never an independent section. */
.media-video-tier { margin:86px 0 10px; }
.media-video-tier__head { position:relative; display:grid; grid-template-columns:180px minmax(260px,.8fr) minmax(320px,1fr); align-items:end; gap:28px; padding:20px 0 18px; border-bottom:1px solid rgba(255,255,255,.22); }
.media-video-tier__head::before { content:""; position:absolute; top:0; left:0; width:72px; height:2px; background:var(--teal); transform-origin:left; }
.media-video-tier__head>span { color:var(--teal); font-size:.72rem; letter-spacing:.2em; }
.media-video-tier__head h3 { margin:0; font-size:clamp(1.25rem,2vw,2rem); line-height:1.1; }
.media-video-tier__head p { margin:0; color:var(--muted); line-height:1.75; }
.media-video-tier__grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:24px; }

/* AIconication words enter independently and settle without changing layout width. */
.vision-title { display:grid !important; grid-template-columns:max-content max-content; justify-content:start; gap:.02em .22em; overflow:visible; }
.vision-word { display:block; opacity:0; transform:translateX(clamp(-90px,-7vw,-42px)) skewX(-6deg); transition:opacity .45s ease var(--vision-delay,0ms),transform .75s cubic-bezier(.16,.86,.26,1) var(--vision-delay,0ms); }
.vision-word:nth-child(even) { transform:translateX(clamp(42px,7vw,90px)) skewX(5deg); font-family:var(--serif); font-style:italic; }
.vision-word.is-visible { opacity:1; transform:none; }

/* The article invitation keeps media and copy readable in one view. */
.journal-title { max-width:14ch; font-size:clamp(2.2rem,4vw,4.3rem) !important; line-height:1.05 !important; }
.journal-lead { font-size:clamp(.95rem,1.15vw,1.08rem); }
.journal-link { font-size:clamp(1.15rem,1.55vw,1.45rem) !important; }

/* Education matches research in width and visual weight. */
#bansou .sectitle { font-size:clamp(2.8rem,6vw,6.5rem); max-width:14ch; }
.bansou-media figure { min-width:0; }
.bansou-media img { width:100%; max-height:620px; }

/* Normal document flow: no inner timeline scroll and no decorative short bars. */
.life-scroll { overflow:visible !important; }
.life-event::before { display:none !important; content:none !important; }
.life-list::before { opacity:.46; }
.life-event { padding-block:clamp(42px,5.5vw,78px) !important; }
.life-body { padding-left:clamp(20px,3vw,44px); }
.life-body h3 { max-width:26ch; }
.life-body p { max-width:76ch; }
.profile-video { width:min(1120px,100%); margin:0 auto 58px; aspect-ratio:16/9; background:#05090d; }
.profile-video iframe,.profile-video video { display:block; width:100%; height:100%; border:0; object-fit:contain !important; }

/* Verified text links replace unrelated stock/crab imagery in awards. */
.award-row { grid-template-columns:80px minmax(0,1fr) 88px !important; }
.award-copy { grid-template-columns:minmax(260px,.8fr) minmax(320px,1fr); }
.award-row figure { display:none !important; }
.award-arrow { font-size:.68rem !important; letter-spacing:.12em; }

/* Contact and footer are calmer, compact and never collide. */
.contact-heading .sectitle { font-size:clamp(2.4rem,4.5vw,4.8rem) !important; line-height:1.05; }
.contact-heading .secsub { margin-top:34px !important; }
footer { padding:clamp(48px,7vw,82px) 0 !important; }
footer .wrap { display:grid !important; grid-template-columns:minmax(180px,.55fr) minmax(280px,1fr) auto; align-items:center; gap:16px 36px; text-align:left; }
footer .big { margin:0 !important; font-size:clamp(1.2rem,2vw,1.75rem) !important; line-height:1.25; }
footer .footer-role,footer .wrap>div:nth-child(2) { color:var(--muted); font-size:.76rem !important; line-height:1.6; }
footer .c { margin:0 !important; text-align:right; }

/* Section-specific arrival directions instead of one universal fade-up. */
.reveal .social-card { opacity:0; transform:translateX(-34px); transition:opacity .65s ease,transform .85s cubic-bezier(.2,.75,.2,1); }
.reveal .social-card:nth-child(even) { transform:translateX(34px); }
.reveal.in .social-card { opacity:1; transform:none; }
.reveal.in .social-card:nth-child(2) { transition-delay:.08s; }
.reveal.in .social-card:nth-child(3) { transition-delay:.15s; }
.reveal.in .social-card:nth-child(4) { transition-delay:.22s; }
.reveal .media-video-tier__head::before { transform:scaleX(0); transition:transform .85s cubic-bezier(.2,.75,.2,1); }
.reveal.in .media-video-tier__head::before { transform:scaleX(1); }

/* Production article: editorial two-column rhythm and moderate scale. */
.build-hero { min-height:100vh; min-height:100dvh; padding-inline:clamp(22px,6vw,110px); }
.build-hero-copy { max-width:960px; }
.build-hero h1 { max-width:15ch; font-size:clamp(2.8rem,5.2vw,5.8rem); line-height:1.02; }
.build-hero p { max-width:70ch; font-size:clamp(.98rem,1.15vw,1.12rem); }
.build-section { padding-inline:clamp(22px,6vw,110px); }
.build-grid { grid-template-columns:100px minmax(300px,.78fr) minmax(420px,1.22fr); gap:clamp(26px,5vw,84px); max-width:1560px; margin-inline:auto; }
.build-section h2 { font-size:clamp(2rem,3.6vw,4rem); line-height:1.12; }
.build-copy { max-width:74ch; font-size:clamp(.98rem,1.1vw,1.08rem); }
.build-media { width:min(1180px,86%); margin-inline:auto; }
.build-ending { padding-block:clamp(76px,10vh,120px); }
.build-ending h2 { font-size:clamp(2.3rem,4.4vw,4.8rem); }

@media (max-width:1100px) {
  .social-card--instagram,.social-card--youtube,.social-card--x,.social-card--threads { grid-column:span 6; grid-template-columns:1fr; }
  .social-card__copy { border-left:0; border-top:1px solid rgba(255,255,255,.13); }
  footer .wrap { grid-template-columns:1fr 1fr; }
  footer .c { grid-column:1/-1; text-align:left; }
  .build-grid { grid-template-columns:76px minmax(260px,.8fr) minmax(340px,1.2fr); }
}

@media (max-width:760px) {
  .block { scroll-margin-top:132px; }
  .herotext { top:51% !important; width:100%; }
  .herotext .avatar { width:72px; height:72px; margin-bottom:12px; }
  .herotext .k { max-width:30ch; margin-inline:auto; font-size:.62rem; line-height:1.45; }
  .herotext h1 { font-size:clamp(2.45rem,12vw,3.7rem) !important; }
  .herotext p { margin-top:12px; font-size:.86rem; line-height:1.5; }
  .social-card-grid { grid-template-columns:1fr; }
  .social-card--instagram,.social-card--youtube,.social-card--x,.social-card--threads { grid-column:auto; }
  .social-card img { max-height:none; }
  .social-card__copy { padding:22px; }
  .social-card p { margin:16px 0 24px; }
  .media-video-tier__head { grid-template-columns:1fr; gap:8px; }
  .media-video-tier__grid { grid-template-columns:1fr; }
  .vision-title { grid-template-columns:1fr 1fr; width:100%; gap:.05em .16em; }
  .vision-word { min-width:0; }
  .journal-title { max-width:16ch; font-size:clamp(2.15rem,10.5vw,3.5rem) !important; }
  #bansou .sectitle { font-size:clamp(2.5rem,12vw,4rem); }
  .life-list::before { display:none; }
  .life-event { padding:38px 0 !important; }
  .life-body { padding-left:0; }
  .award-row { grid-template-columns:34px minmax(0,1fr) 44px !important; gap:12px !important; }
  .award-copy { grid-template-columns:1fr; gap:8px; }
  .contact-heading .sectitle { font-size:clamp(2.25rem,10vw,3.6rem) !important; }
  footer .wrap { grid-template-columns:1fr; gap:12px; }
  footer .c { grid-column:auto; }
  .build-nav span { display:none; }
  .build-hero { min-height:100vh; min-height:100dvh; padding:100px 20px 54px; }
  .build-hero h1 { font-size:clamp(2.5rem,11vw,4rem); }
  .build-facts div { min-height:0; padding:25px 20px; }
  .build-section { padding:72px 20px; }
  .build-grid { grid-template-columns:1fr; gap:18px; }
  .build-number { font-size:2.8rem; }
  .build-section h2 { font-size:clamp(2rem,8.5vw,3.15rem); }
  .build-media { width:100%; margin-top:38px; }
}

@media (max-height:680px) and (min-width:761px) {
  .herotext { top:52% !important; }
  .herotext .avatar { width:68px; height:68px; margin-bottom:10px; }
  .herotext h1 { font-size:clamp(2.6rem,6vw,4.4rem) !important; }
  .herotext p { margin-top:10px; }
}

@media (prefers-reduced-motion:reduce) {
  body .reveal,body .reveal * { opacity:1 !important; filter:none !important; transform:none !important; transition:none !important; animation:none !important; }
  .vision-word,.social-card { opacity:1 !important; transform:none !important; transition:none !important; }
  .media-video-tier__head::before { transform:none !important; }
}