/* 03. Page-specific composition. Shared controls live in components.css. */
.hero { position: relative; height: min(760px, calc(100svh - 86px)); min-height: 560px; background: #84b8df; color: #fff; overflow: hidden; }
.hero__media, .hero__video, .hero__poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero__poster { object-position: center 57%; }
.hero__video { opacity: 0; transition: opacity .6s; }
.hero__video.is-playing { opacity: 1; }
.hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,rgba(3,15,32,.64),rgba(3,15,32,.17) 70%),linear-gradient(0deg,rgba(3,15,32,.35),transparent 60%); }
.hero__content { position: relative; z-index: 2; height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; padding-block: 75px; }
.hero__eyebrow { color: #fff; font-size: .75rem; letter-spacing: .2em; margin-bottom: 28px; }
.hero h1 { font-size: clamp(2.5rem, 4.8vw, 4.6rem); line-height: 1.38; letter-spacing: -.045em; font-weight: 800; text-shadow: 0 3px 26px #061b3035; }
.hero__translation { font-size: .8125rem; letter-spacing: .12em; line-height: 1.8; font-weight: 500; text-transform: uppercase; margin-top: 30px; max-width: 370px; }
.hero__bottom { position: absolute; left: 0; right: 0; bottom: 36px; display: flex; justify-content: space-between; align-items: flex-end; font-size: .6875rem; letter-spacing: .14em; line-height: 1.8; }
.hero__scroll { display: flex; align-items: center; gap: 18px; }
.hero__scroll::before { content: ''; width: 64px; height: 1px; background: #fff; }
.hero__motion { display: none; color: #fff; background: #0e1a2a99; border: 1px solid #ffffff60; padding: 7px 12px; border-radius: 3px; font-size: .75rem; letter-spacing: .05em; }
.hero__motion.is-available { display: block; }
.manifesto { background: linear-gradient(180deg,#f1f8ff,#fff 80%); padding-block: 110px 95px; }
.manifesto__head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 80px; align-items: center; margin-bottom: 55px; }
.manifesto__copy p { line-height: 2.05; color: var(--muted); margin-bottom: 22px; }
.manifesto__copy .button { min-width: 210px; }
.manifesto__image { aspect-ratio: 2.3; overflow: hidden; position: relative; border-radius: 5px; }
.manifesto__image img { width: 100%; height: 100%; object-fit: cover; object-position: center 63%; }
.manifesto__line { font-size: clamp(1.45rem,4.3vw,4rem); font-weight: 800; line-height: 1.1; letter-spacing: -.03em; color: var(--blue); margin-top: 44px; text-align: center; }
.pathways { padding-block: 0 100px; }
.pathway-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.pathway { border-top: 2px solid var(--ink); padding-top: 28px; display: grid; grid-template-columns: 1fr 140px; gap: 24px; }
.pathway h2 { font-size: 1.7rem; line-height: 1.2; }
.pathway__ja { color: var(--muted); font-size: .75rem; margin-top: 8px; }
.pathway p { margin: 20px 0 22px; font-size: .9375rem; }
.pathway__image { aspect-ratio: 1; border-radius: 3px; overflow: hidden; }
.pathway__image>img { width: 100%; height: 100%; object-fit: cover; }
.pathway .button { min-height: 46px; padding: 11px 26px; font-size: .875rem; }
.page-top { padding: 38px 0 65px; background: linear-gradient(180deg,#f2f8ff,#fff); }
.page-top h1 { max-width: 980px; }
.page-top .lead { max-width: 780px; color: var(--muted); margin-top: 24px; }
.page-top .button { margin-top: 28px; }
.page-image { width: 100%; max-height: 640px; aspect-ratio: 2.25; object-fit: cover; object-position: center 62%; border-radius: 5px; }
.two-column { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }
.prose { max-width: 760px; }
.prose p { margin-bottom: 24px; line-height: 2.05; }
.prose h2 { font-size: 1.6rem; margin: 52px 0 20px; }
.prose h2:first-child { margin-top: 0; }
.prose ul { margin-block: 20px 32px; }
.prose li { margin-block: 10px; }
.prose a:not(.button) {
  text-decoration: underline;
  color: var(--blue);
}
.principles { display: grid; grid-template-columns: repeat(3,1fr); gap: 40px; }
.principle { border-top: 1px solid var(--line); padding-top: 25px; }
.principle__number { color: var(--blue); font-size: .8125rem; letter-spacing: .1em; margin-bottom: 18px; }
.principle h3 { font-size: 1.35rem; margin-bottom: 16px; }
.principle p { color: var(--muted); font-size: .9375rem; }
.tint { background: var(--sky); }
.drift-hero { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.drift-hero__image { aspect-ratio: 1.13; border-radius: 5px; }
.drift-hero .display { font-size: clamp(2.3rem,4vw,3.8rem); }
.drift-hero .lead { font-size: 1.05rem; }
.status-note { border-left: 3px solid var(--blue); padding: 14px 20px; background: #edf6ff; color: var(--muted); font-size: .875rem; margin-top: 28px; }
.step-list { margin: 32px 0 0; padding: 0; list-style: none; counter-reset: step; }
.step-list li { counter-increment: step; border-top: 1px solid var(--line); padding: 25px 0 25px 66px; position: relative; }
.step-list li::before { content: '0' counter(step); position: absolute; left: 0; top: 27px; color: var(--blue); font-size: .875rem; font-weight: 700; }
.step-list h3 { font-size: 1.15rem; margin-bottom: 9px; }
.step-list p { color: var(--muted); }
.contact-panel { padding: 55px; background: var(--sky); border-radius: 5px; margin-top: 60px; }
.contact-panel h2 { font-size: 2rem; margin-bottom: 16px; }
.contact-panel p { margin-bottom: 26px; max-width: 660px; }
.article-heading { max-width: 860px; margin-inline: auto; }
.article-heading .display { font-size: clamp(2rem,3.8vw,3.2rem); }
.article-heading .article-card__meta { margin-top: 0; }
.article-layout { display: grid; grid-template-columns: 200px 1fr; max-width: 1060px; margin: 0 auto; gap: 80px; padding-block: 60px 95px; }
.article-sidebar { font-size: .8125rem; color: var(--muted); }
.article-sidebar p { position: sticky; top: 130px; border-top: 1px solid var(--line); padding-top: 20px; }
.article-cover { height: 480px; border-radius: 5px; }
.article-cover>img { width: 100%; height: 100%; object-fit: cover; }
.article-cover.editorial-frame>img { width: 300%; max-width: none; height: auto; object-fit: initial; }
.article-ending { border-top: 1px solid var(--line); padding-top: 28px; margin-top: 44px; }
.legal { padding-block: 10px 90px; }
.legal .prose { margin-inline: auto; }
.legal-date { color: var(--muted); font-size: .875rem; }
.signup-page { padding-block: 80px; }
.signup-page+.section { padding-block: 70px; }
.not-found { text-align: center; padding: 100px 20px 130px; }
.not-found .display { color: var(--blue); font-size: 6rem; }
.not-found p { margin: 24px 0 32px; }
html[lang=en] .hero h1 { line-height: 1.1; font-size: clamp(2.8rem,5.7vw,5.5rem); letter-spacing: -.055em; max-width: 860px; }
html[lang=en] .display { line-height: 1.15; }
@media (max-width: 1000px) {
  .manifesto__head, .two-column { gap: 48px; }
  .pathway { grid-template-columns: 1fr 110px; gap: 16px; }
  .drift-hero { gap: 40px; }
  .article-layout { gap: 45px; grid-template-columns: 150px 1fr; }
}
@media (max-width: 800px) {
  .hero { height: 680px; min-height: 0; max-height: calc(100svh - 74px); }
  .hero__content { padding-block: 50px 100px; }
  .hero h1 { font-size: clamp(2.1rem,5.8vw,3.5rem); }
  .hero__translation { font-size: .75rem; max-width: 300px; }
  .hero__bottom { bottom: 26px; }
  .manifesto { padding-block: 76px; }
  .manifesto__head, .two-column, .drift-hero { grid-template-columns: 1fr; gap: 28px; }
  .manifesto__image { aspect-ratio: 1.65; }
  .manifesto__copy { max-width: 640px; }
  .pathways { padding-bottom: 72px; }
  .pathway { grid-template-columns: 1fr; }
  .pathway__image { display: none; }
  .principles { gap: 26px; }
  .drift-hero__image { aspect-ratio: 1.8; }
  .article-layout { grid-template-columns: 1fr; gap: 28px; padding-top: 36px; }
  .article-sidebar p { position: static; }
  .article-cover { height: 380px; }
}
@media (max-width: 540px) {
  .hero { height: 670px; min-height: 590px; max-height: none; }
  .hero__poster, .hero__video { object-position: 63% center; }
  .hero::after { background: linear-gradient(90deg,#0415299c,#04152921),linear-gradient(0deg,#04152980,transparent 70%); }
  .hero__content { justify-content: flex-end; padding-bottom: 114px; }
  .hero__eyebrow { font-size: .65rem; letter-spacing: .12em; margin-bottom: 20px; }
  .hero h1 { font-size: clamp(1.9rem,7.9vw,2.6rem); line-height: 1.5; }
  .hero__translation { font-size: .7rem; letter-spacing: .08em; margin-top: 24px; max-width: 260px; }
  .hero__bottom { font-size: .625rem; }
  .hero__bottom>p { display: none; }
  html[lang=en] .hero h1 { font-size: 2.8rem; line-height: 1.16; }
  .manifesto { padding-block: 62px; }
  .manifesto .display { font-size: 2.1rem; }
  .manifesto__head { margin-bottom: 34px; }
  .manifesto__image { aspect-ratio: 1.25; }
  .manifesto__line { margin-top: 32px; font-size: 1.5rem; }
  .pathway-grid { grid-template-columns: 1fr; gap: 36px; }
  .pathway { grid-template-columns: 1fr 95px; }
  .pathway__image { display: block; }
  .pathways { padding-bottom: 60px; }
  .page-top { padding-block: 26px 45px; }
  .page-top .display { font-size: 2.2rem; }
  .page-image { aspect-ratio: 1.3; }
  .principles { grid-template-columns: 1fr; gap: 34px; }
  .contact-panel { padding: 30px 24px; margin-top: 40px; }
  .contact-panel h2 { font-size: 1.7rem; }
  .article-cover { height: 285px; }
  .article-layout { padding-bottom: 58px; }
  .prose h2 { font-size: 1.35rem; margin-top: 36px; }
  .signup-page { padding-block: 56px; }
}
/* Preserve intentional phrase breaks in Japanese headlines. */
.keep { display: inline-block; }
.pathway__image.editorial-frame>img { width: 300%; max-width: none; height: auto; object-fit: initial; }
.hero__media { transform: translateY(var(--hero-shift, 0px)) scale(1.04); }
@media (prefers-reduced-motion: reduce) { .hero__media { transform: none; } }
.motion-paused .hero__media { transform: none; }

.hr-vision {
  --vision-blue: var(--blue, #0755ed);
  --vision-ink: var(--ink, #101c2d);
  --vision-muted: var(--muted, #53647b);
  color: var(--vision-ink);
  background: #fff;
  font-family: var(--sans, 'Hiragino Kaku Gothic ProN', 'Yu Gothic', sans-serif);
  font-size: 1rem;
  line-height: 2;
}
.hr-vision *, .hr-vision *::before, .hr-vision *::after { box-sizing: border-box; }
.hr-vision h2, .hr-vision h3, .hr-vision p { margin: 0; }
.hr-vision__locale--en { display: none; }
html:lang(en) .hr-vision__locale--ja { display: none; }
html:lang(en) .hr-vision__locale--en { display: block; }
.hr-vision__chapter { padding: 88px 0; }
.hr-vision__chapter--sky { background: #f1f7ff; }
.hr-vision__inner {
  width: min(calc(100% - 96px), 1280px);
  margin-inline: auto;
}
.hr-vision__grid {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.35fr);
  align-items: start;
  gap: clamp(48px, 7vw, 112px);
}
.hr-vision__heading { position: sticky; top: 124px; }
.hr-vision .hr-vision__index {
  display: flex;
  align-items: center;
  gap: 15px;
  margin-bottom: 25px;
  color: var(--vision-blue);
  font-size: .8125rem;
  font-weight: 700;
  letter-spacing: .13em;
  line-height: 1.5;
}
.hr-vision__index::before {
  content: '';
  width: 34px;
  height: 1px;
  background: currentColor;
}
.hr-vision .hr-vision__title {
  font-family: Arial, Helvetica, var(--sans, sans-serif);
  font-size: clamp(2rem, 3.2vw, 3.125rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.14;
  overflow-wrap: normal;
  word-break: normal;
}
.hr-vision .hr-vision__title span { display: block; }
.hr-vision__body { min-width: 0; }
.hr-vision .hr-vision__lead {
  margin-bottom: 34px;
  font-size: clamp(1.35rem, 2vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.7;
}
.hr-vision .hr-vision__body > p {
  color: var(--vision-muted);
  margin-bottom: 25px;
  font-size: 1rem;
  line-height: 2.05;
}
.hr-vision .hr-vision__body > p:last-child { margin-bottom: 0; }
.hr-vision .hr-vision__body > .hr-vision__statement {
  margin-block: 35px;
  padding-left: 25px;
  border-left: 3px solid var(--vision-blue);
  color: var(--vision-ink);
  font-size: clamp(1.13rem, 1.65vw, 1.45rem);
  font-weight: 700;
  line-height: 1.85;
  letter-spacing: -.025em;
}
.hr-vision__statement strong { color: var(--vision-blue); font-weight: 800; }
.hr-vision .hr-vision__body > .hr-vision__invitation {
  margin-block: 35px;
  color: var(--vision-blue);
  font-size: clamp(1.45rem, 2vw, 1.875rem);
  line-height: 1.7;
  font-weight: 800;
  letter-spacing: -.035em;
}
.hr-vision .hr-vision__body > .hr-vision__support {
  margin-block: 32px;
  padding-block: 25px;
  border-block: 1px solid #d6e2f1;
  color: var(--vision-ink);
  font-size: clamp(1.2rem, 1.85vw, 1.6rem);
  font-weight: 800;
  line-height: 1.85;
}
.hr-vision .hr-vision__body > .hr-vision__destination {
  color: var(--vision-blue);
  font-size: 1.2rem;
  font-weight: 800;
  line-height: 1.85;
  margin-top: 36px;
}
.hr-vision__closing {
  padding: 85px 0;
  background: #101e33;
  color: #fff;
}
.hr-vision__closing .hr-vision__index { color: #9fc8ff; }
.hr-vision__closing .hr-vision__title { font-size: clamp(2rem, 3.25vw, 3.2rem); }
.hr-vision .hr-vision__values {
  font-size: clamp(1.55rem, 2.6vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.75;
}
.hr-vision .hr-vision__legacy {
  color: #c4d1e3;
  margin-top: 28px;
  font-size: 1rem;
  line-height: 2;
}
.hr-vision__signature {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 30px;
  margin-top: 58px;
  padding-top: 32px;
  border-top: 1px solid #ffffff35;
}
.hr-vision .hr-vision__brand { font-size: 2rem; font-weight: 800; line-height: 1.2; letter-spacing: -.035em; }
.hr-vision .hr-vision__tagline { margin-top: 12px; color: #c4d1e3; font-size: .75rem; line-height: 1.8; letter-spacing: .12em; }
.hr-vision .hr-vision__signoff { color: #fff; font-size: clamp(1.2rem, 2vw, 1.75rem); font-weight: 800; line-height: 1.6; }
@media (max-width: 900px) {
  .hr-vision__inner { width: calc(100% - 48px); }
  .hr-vision__grid { grid-template-columns: 1fr; gap: 36px; }
  .hr-vision__heading { position: static; }
  .hr-vision__chapter, .hr-vision__closing { padding-block: 64px; }
  .hr-vision .hr-vision__title { font-size: clamp(2rem, 5vw, 3rem); }
  .hr-vision__body { max-width: 720px; }
}
@media (max-width: 540px) {
  .hr-vision__inner { width: calc(100% - 40px); }
  .hr-vision__chapter, .hr-vision__closing { padding-block: 52px; }
  .hr-vision .hr-vision__index { margin-bottom: 20px; }
  .hr-vision .hr-vision__lead { font-size: 1.28rem; }
  .hr-vision .hr-vision__body > .hr-vision__statement { padding-left: 17px; }
  .hr-vision__signature { flex-direction: column; align-items: flex-start; gap: 25px; margin-top: 40px; }
  .hr-vision .hr-vision__tagline { letter-spacing: .055em; }
}

.hr-vision__statement strong span { display: inline-block; }

