/* 2026-08-21 refinement: wider hero orbit, pinch-only zoom, varied entrances and denser profile. */

#house {
  transform:none !important;
  transform-origin:50% 50% !important;
}

.herotext {
  width:min(1420px,calc(100% - 40px)) !important;
}

.herotext h1 {
  font-size:clamp(3.15rem,5.7vw,6.1rem) !important;
}

/* Keep the scan at the centre and let the opening typography inhabit the edges. */
.hero-signature__line--one {
  top:-4% !important;
  font-size:clamp(10rem,19.5vw,22rem) !important;
}
.hero-signature__line--two {
  bottom:-8% !important;
  font-size:clamp(11rem,22vw,24rem) !important;
}
.hero-signature__line--three {
  top:72% !important;
  font-size:clamp(4.8rem,10vw,11rem) !important;
}
.hero-signature__stamp { top:58% !important; }

.hero-social-grid {
  width:min(1320px,100%) !important;
  gap:14px !important;
  margin-top:24px !important;
}

.hero-social-grid .social-card,
.hero-social-grid .social-card--instagram,
.hero-social-grid .social-card--youtube,
.hero-social-grid .social-card--x,
.hero-social-grid .social-card--threads {
  grid-template-columns:126px minmax(0,1fr) !important;
  min-height:142px !important;
}

.hero-social-grid .social-card figure {
  padding:5px !important;
}

.hero-social-grid .social-card img {
  max-height:132px !important;
}

.hero-social-grid .social-card__copy {
  grid-template-columns:30px minmax(0,1fr) !important;
  padding:15px 16px !important;
  gap:3px 10px !important;
}

.hero-social-grid .social-card__icon {
  width:28px !important;
  height:28px !important;
}

.hero-social-grid .social-card h3 { font-size:.96rem !important; }
.hero-social-grid .social-card b { font-size:.7rem !important; }
.hero-social-grid .social-card p { font-size:.69rem !important; }
.hero-social-grid .social-card__action { font-size:.65rem !important; }

/* Every passage keeps its own spatial direction instead of sharing one upward fade. */
body.motion-ready .scroll-reveal,
body.detail-motion-ready .detail-reveal,
body.detail-motion-ready .reveal {
  --motion-x:0px;
  --motion-y:0px;
  --motion-r:0deg;
  --motion-s:1;
  opacity:0;
  transform:translate3d(var(--motion-x),var(--motion-y),0) rotate(var(--motion-r)) scale(var(--motion-s));
  transform-origin:var(--motion-origin,50% 50%);
  clip-path:inset(var(--motion-clip,0 0 0 0));
  filter:blur(var(--motion-blur,2px));
  transition:
    opacity .78s cubic-bezier(.18,.78,.2,1),
    transform .92s cubic-bezier(.18,.78,.2,1),
    clip-path .92s cubic-bezier(.18,.78,.2,1),
    filter .72s ease !important;
  transition-delay:var(--reveal-delay,var(--detail-delay,0ms)) !important;
}

body.motion-ready .motion-left,
body.detail-motion-ready .motion-left { --motion-x:-76px; --motion-r:-1.2deg; --motion-origin:0 50%; }
body.motion-ready .motion-right,
body.detail-motion-ready .motion-right { --motion-x:76px; --motion-r:1.2deg; --motion-origin:100% 50%; }
body.motion-ready .motion-cut-left,
body.detail-motion-ready .motion-cut-left { --motion-x:-34px; --motion-clip:0 0 0 52%; --motion-origin:0 50%; }
body.motion-ready .motion-cut-right,
body.detail-motion-ready .motion-cut-right { --motion-x:34px; --motion-clip:0 52% 0 0; --motion-origin:100% 50%; }
body.motion-ready .motion-focus,
body.detail-motion-ready .motion-focus { --motion-s:.9; --motion-blur:9px; }
body.motion-ready .motion-tilt,
body.detail-motion-ready .motion-tilt { --motion-y:34px; --motion-r:2.4deg; --motion-s:.96; }

body.motion-ready .scroll-reveal.is-visible,
body.detail-motion-ready .detail-reveal.detail-visible,
body.detail-motion-ready .reveal.in {
  opacity:1;
  transform:none;
  clip-path:inset(0);
  filter:none;
}

/* A concise profile: JSEC proof and three decisive milestones stay near one desktop screen. */
#profile.block { padding-block:clamp(78px,8vh,104px) !important; }
#profile-area {
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(520px,1.1fr);
  gap:18px 26px;
  align-items:stretch;
}
#profile-area .profile-opening { grid-column:1 / -1; margin-bottom:4px !important; }
#profile-area .profile-biography {
  display:block !important;
  margin:0 !important;
  padding:clamp(20px,2vw,28px);
  border:1px solid rgba(255,255,255,.16);
  background:rgba(7,14,22,.72);
}
#profile-area .profile-biography p {
  padding:0 !important;
  border:0 !important;
  font-size:clamp(.94rem,1.05vw,1.05rem) !important;
  line-height:1.86 !important;
}
#profile-area .profile-proof {
  grid-template-columns:220px minmax(0,1fr) !important;
  min-height:0;
  margin:0 !important;
}
#profile-area .profile-proof figure { padding:12px !important; }
#profile-area .profile-proof figure img { max-height:286px !important; }
#profile-area .profile-proof>div { padding:clamp(20px,2.4vw,34px) !important; }
#profile-area .profile-proof h3 { font-size:clamp(1.55rem,2.35vw,2.65rem) !important; }
#profile-area .profile-proof p { font-size:.9rem !important; line-height:1.7 !important; }
#profile-area .profile-proof small { margin-top:12px !important; padding-top:10px !important; }
#profile-area .profile-honours { display:none !important; }
#profile-area .life-list {
  grid-column:1 / -1;
  grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:12px !important;
}
#profile-area .life-event,
#profile-area .life-event:nth-child(odd),
#profile-area .life-event:nth-child(even) {
  min-height:184px !important;
  padding:17px !important;
}
#profile-area .life-body h3 { min-height:0 !important; }

@media (min-width:1200px) and (min-height:780px) {
  #aicone.block,
  #research.block,
  #bansou.block,
  #profile.block {
    min-height:100svh !important;
    padding-block:clamp(74px,8vh,96px) !important;
  }
  #research .sectitle { margin-bottom:22px !important; }
  #research .research-collage { min-height:430px !important; }
  #research .research-findings { margin-top:28px !important; }
  #bansou .edcols { gap:clamp(34px,5vw,74px) !important; }
  #bansou .bansou-points { margin-top:20px !important; }
  #bansou .bansou-media figure { min-height:0 !important; }
}

/* The detail-page masthead keeps moving English language in view. */
.detail-kinetic-banner {
  position:absolute;
  z-index:3;
  left:50%;
  top:clamp(92px,12vh,130px);
  width:min(1180px,calc(100% - 44px));
  transform:translateX(-50%);
  display:flex;
  justify-content:space-between;
  gap:22px;
  overflow:hidden;
  pointer-events:none;
  color:rgba(230,252,248,.7);
  font-size:clamp(.54rem,.72vw,.72rem);
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
}
.detail-kinetic-banner span {
  min-width:max-content;
  transition:opacity .28s ease,transform .45s cubic-bezier(.18,.78,.2,1),font-family .35s ease;
}
.detail-kinetic-banner span.is-changing { opacity:0; transform:translateX(26px); }

/* Real platform previews remain real assets; the surrounding presentation becomes larger. */
body.detail-tutoring .links { grid-template-columns:repeat(3,minmax(0,1fr)) !important; }
body.detail-tutoring .linkcard {
  display:grid !important;
  grid-template-columns:132px minmax(0,1fr) auto;
  min-height:126px;
  padding:0 !important;
  overflow:hidden;
}
body.detail-tutoring .linkthumb {
  display:grid;
  place-items:center;
  align-self:stretch;
  overflow:hidden;
  border-right:1px solid rgba(255,255,255,.13);
  background:#09111a;
}
body.detail-tutoring .linkthumb img {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
body.detail-tutoring .linkcard>span:not(.linkthumb) { padding:17px; }
body.detail-tutoring .linkcard>.arw { align-self:center; padding:16px 18px 16px 0; }

body.detail-tutoring .reel { height:390px !important; }
body.detail-tutoring .ring { --r:560px !important; --ang:36deg !important; }
body.detail-tutoring .rcard {
  width:252px !important;
  height:142px !important;
  margin:-71px 0 0 -126px !important;
}

@media (max-width:1100px) {
  .hero-social-grid .social-card,
  .hero-social-grid .social-card--instagram,
  .hero-social-grid .social-card--youtube,
  .hero-social-grid .social-card--x,
  .hero-social-grid .social-card--threads {
    grid-template-columns:96px minmax(0,1fr) !important;
    min-height:118px !important;
  }
  #profile-area { grid-template-columns:1fr; }
  #profile-area .profile-opening,
  #profile-area .life-list { grid-column:1; }
  body.detail-tutoring .links { grid-template-columns:1fr !important; }
}

@media (max-width:760px) {
  .herotext { top:51% !important; width:calc(100% - 20px) !important; }
  .herotext h1 { font-size:clamp(2.35rem,11.8vw,3.55rem) !important; }
  .hero-signature__line--one { top:5% !important; font-size:40vw !important; }
  .hero-signature__line--two { bottom:4% !important; font-size:43vw !important; }
  .hero-signature__line--three { top:70% !important; font-size:18vw !important; }
  .hero-social-grid { gap:8px !important; margin-top:18px !important; }
  .hero-social-grid .social-card,
  .hero-social-grid .social-card--instagram,
  .hero-social-grid .social-card--youtube,
  .hero-social-grid .social-card--x,
  .hero-social-grid .social-card--threads {
    grid-template-columns:76px minmax(0,1fr) !important;
    min-height:98px !important;
  }
  .hero-social-grid .social-card img { max-height:90px !important; }
  .hero-social-grid .social-card__copy { padding:9px !important; grid-template-columns:20px minmax(0,1fr) !important; gap:2px 6px !important; }
  .hero-social-grid .social-card__icon { width:20px !important; height:20px !important; }
  .hero-social-grid .social-card h3 { font-size:.74rem !important; }
  .hero-social-grid .social-card b { font-size:.55rem !important; }
  .hero-social-grid .social-card p { display:none !important; }
  .hero-social-grid .social-card__action { font-size:.53rem !important; }
  #profile.block { padding-block:70px !important; }
  #profile-area .profile-proof { grid-template-columns:118px minmax(0,1fr) !important; }
  #profile-area .profile-proof figure { border-right:1px solid rgba(255,255,255,.14) !important; border-bottom:0 !important; }
  #profile-area .profile-proof>div { padding:16px !important; }
  #profile-area .profile-proof p { display:none; }
  #profile-area .life-list { grid-template-columns:1fr !important; }
  #profile-area .life-event { min-height:0 !important; }
  .detail-kinetic-banner { top:82px; width:calc(100% - 32px); }
  .detail-kinetic-banner span:nth-child(n+3) { display:none; }
  body.detail-tutoring .linkcard { grid-template-columns:106px minmax(0,1fr) auto; min-height:110px; }
  body.detail-tutoring .reel {
    height:auto !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:8px 0 12px !important;
    perspective:none !important;
    -webkit-mask:none !important;
    mask:none !important;
    scrollbar-width:thin;
  }
  body.detail-tutoring .ring {
    position:static !important;
    display:flex !important;
    gap:12px !important;
    width:max-content !important;
    height:auto !important;
    padding:2px !important;
    transform:none !important;
    animation:none !important;
  }
  body.detail-tutoring .rcard {
    position:relative !important;
    top:auto !important;
    left:auto !important;
    flex:0 0 210px !important;
    width:210px !important;
    height:118px !important;
    margin:0 !important;
    transform:none !important;
  }
}

@media (prefers-reduced-motion:reduce) {
  body.motion-ready .scroll-reveal,
  body.detail-motion-ready .detail-reveal,
  body.detail-motion-ready .reveal {
    opacity:1 !important;
    transform:none !important;
    clip-path:none !important;
    filter:none !important;
  }
  .detail-kinetic-banner span { transition:none !important; }
}