:root {
  --bg: #f7f4ee;
  --ink: #11110f;
  --muted: rgba(17,17,15,.50);
  --faint: rgba(17,17,15,.23);
  --line: rgba(17,17,15,.10);
  --image: rgba(17,17,15,.04);
  --serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, Georgia, "Times New Roman", serif;
  --sans: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
}
* { box-sizing: border-box; }
html { background: var(--bg); scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
  font-size: 12px;
  line-height: 1.72;
  letter-spacing: .01em;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
}
a { color: inherit; text-decoration: none; }
a:hover { opacity: .55; }

.header {
  position: fixed;
  z-index: 50;
  inset: 0 0 auto 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  padding: 24px 30px;
  mix-blend-mode: difference;
  color: var(--bg);
  pointer-events: none;
}
.logo, .nav a { pointer-events: auto; }
.logo { font-size: 11px; letter-spacing: .12em; }
.nav { display: flex; gap: 22px; font-size: 11px; }

main { padding: 84px 30px 34px; }

.hero {
  min-height: 76vh;
  display: grid;
  align-items: end;
  padding-bottom: 30px;
}
.hero h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(40px, 7.2vw, 104px);
  line-height: .98;
  letter-spacing: -.055em;
}
.hero-meta {
  margin-top: 18px;
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 30px;
  color: var(--muted);
  padding-top: 0;
  font-size: 10px;
}

.sequence { margin-top: 58px; }
.frame { margin: 0 auto 34px; }
.image {
  position: relative;
  width: 100%;
  background: linear-gradient(135deg, rgba(255,255,255,.30), rgba(0,0,0,.015)), var(--image);
  overflow: hidden;
}
.image:after {
  content: none;
  display: none;
}
.caption {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 7px;
  color: var(--muted);
  font-size: 10px;
}
.f1 { width: 78vw; max-width: 1220px; margin-left: 0; }
.f1 .image { aspect-ratio: 16 / 9.5; }
.f2 { width: 36vw; max-width: 540px; margin-right: 8vw; margin-top: 112px; }
.f2 .image { aspect-ratio: 4 / 5.5; }
.f3 { width: 58vw; max-width: 820px; margin-left: 12vw; margin-top: 84px; }
.f3 .image { aspect-ratio: 5 / 4; }
.f4 { width: 30vw; max-width: 430px; margin-left: 0; margin-top: 134px; }
.f4 .image { aspect-ratio: 3 / 4.4; }
.f5 { width: 82vw; max-width: 1280px; margin-right: 0; margin-top: 44px; }
.f5 .image { aspect-ratio: 16 / 8.5; }
.f6 { width: 44vw; max-width: 640px; margin-left: 44vw; margin-top: 120px; }
.f6 .image { aspect-ratio: 4 / 5; }

.word-break {
  min-height: 40vh;
  display: grid;
  align-items: center;
  margin: 104px 0 86px;
}
.word-break p {
  margin: 0;
  max-width: 740px;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif;
  font-size: clamp(14px, 1.45vw, 21px);
  line-height: 1.5;
  letter-spacing: -.035em;
}

.index {
  margin: 136px 0 120px;
  border-top: 1px solid var(--line);
}
.index-row {
  display: grid;
  grid-template-columns: 62px 1fr auto;
  gap: 24px;
  align-items: baseline;
  padding: 15px 0;
  border-bottom: 1px solid var(--line);
}
.index-row .num, .index-row .type {
  color: var(--muted);
  font-size: 10px;
}
.index-row .name {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(18px, 2.05vw, 31px);
  line-height: 1;
  letter-spacing: -.045em;
}

.info-link {
  margin: 132px 0 86px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8vw;
  border-top: 1px solid var(--line);
  padding-top: 24px;
}
.info-link h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(32px, 5.2vw, 78px);
  line-height: .98;
  letter-spacing: -.06em;
}
.info-link p {
  margin: 0;
  max-width: 400px;
  color: var(--muted);
  font-size: 11px;
}
.arrow {
  display: inline-block;
  margin-top: 20px;
  border-bottom: 1px solid currentColor;
  font-size: 11px;
}
.footer {
  margin-top: 68px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
  display: flex;
  justify-content: space-between;
  color: var(--muted);
  font-size: 10px;
}

/* Inner pages */
.page { padding-top: 116px; }
.page-title {
  min-height: 40vh;
  display: grid;
  align-items: end;
  border-bottom: 1px solid var(--line);
  padding-bottom: 28px;
}
.page-title h1 {
  margin: 0;
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(42px, 7.5vw, 104px);
  line-height: .96;
  letter-spacing: -.06em;
}
.page-lead {
  max-width: 560px;
  color: var(--muted);
  margin-top: 20px;
  font-size: 11px;
}
.content-grid {
  display: grid;
  grid-template-columns: 230px 1fr;
  gap: 8vw;
  padding: 76px 0;
  border-bottom: 1px solid var(--line);
}
.section-label {
  color: var(--faint);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.content-body { max-width: 700px; }
.content-body h2 {
  margin: 0 0 24px;
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(24px, 3.4vw, 48px);
  line-height: 1.08;
  letter-spacing: -.05em;
}
.content-body p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 11px;
}
.service-list {
  display: grid;
  gap: 0;
  border-top: 1px solid var(--line);
  margin-top: 30px;
}
.service-item {
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 36px;
  padding: 18px 0;
  border-bottom: 1px solid var(--line);
}
.service-item strong {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(18px, 1.9vw, 28px);
  line-height: 1.08;
  letter-spacing: -.04em;
}
.service-item span {
  color: var(--muted);
  font-size: 11px;
}
.contact-block {
  min-height: 40vh;
  display: grid;
  align-items: end;
  padding: 100px 0 28px;
}
.email {
  display: inline-block;
  margin-top: 20px;
  border-bottom: 1px solid currentColor;
  font-size: 11px;
}

@media (max-width: 860px) {
  .header { padding: 22px 20px; }
  .nav { gap: 16px; font-size: 10px; }
  main { padding: 94px 20px 28px; }
  .hero {
  min-height: 76vh;
  display: grid;
  align-items: end;
  padding-bottom: 30px;
}
  .hero-meta, .info-link, .content-grid, .service-item {
    grid-template-columns: 1fr;
  }
  .frame {
    width: 100% !important;
    max-width: none !important;
    margin: 0 0 64px !important;
  }
  .image { aspect-ratio: 4 / 5 !important; }
  .word-break { min-height: 36vh; margin: 84px 0; }
  .index-row { grid-template-columns: 1fr; gap: 8px; }
  .page { padding-top: 106px; }
  .content-grid { padding: 62px 0; }
  .footer { display: block; }
  .footer div + div { margin-top: 8px; }
}


.hero-copy {
  margin-top: 26px;
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(220px, 340px);
  gap: 8vw;
  border-top: 1px solid var(--line);
  padding-top: 18px;
  max-width: 980px;
}
.hero-copy .jp {
  margin: 0;
  font-family: "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif;
  font-size: clamp(15px, 1.35vw, 19px);
  line-height: 1.72;
  letter-spacing: -.02em;
}
.hero-copy .en {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.8;
  max-width: 340px;
}
.brand-note {
  margin-top: 10px;
  color: var(--faint);
  font-size: 10px;
  letter-spacing: .12em;
}

@media (max-width: 860px) {
  .hero-copy {
  margin-top: 26px;
  display: grid;
  grid-template-columns: minmax(260px, 420px) minmax(220px, 340px);
  gap: 8vw;
  border-top: 1px solid var(--line);
  padding-top: 18px;
  max-width: 980px;
}
}


/* Language switch */
.lang-switch {
  position: fixed;
  right: 30px;
  top: 64px;
  z-index: 80;
  display: flex;
  gap: 10px;
  mix-blend-mode: difference;
  color: var(--bg);
  font-size: 10px;
  letter-spacing: .12em;
}
.lang-switch button {
  appearance: none;
  border: 0;
  background: transparent;
  color: inherit;
  padding: 0;
  font: inherit;
  cursor: pointer;
  opacity: .45;
}
.lang-switch button.is-active {
  opacity: 1;
  border-bottom: 1px solid currentColor;
}
[data-lang="ja"] .lang-en { display: none; }
[data-lang="en"] .lang-ja { display: none; }

.seo-context {
  position: absolute;
  left: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

@media (max-width: 860px) {
  .lang-switch {
    right: 20px;
    top: 62px;
    bottom: auto;
  }
}

/* Robust bilingual visibility fix */
html[data-lang="ja"] .lang-en { display: none !important; }
html[data-lang="en"] .lang-ja { display: none !important; }


/* v19 integrated PC / mobile refinement */
.quiet-bridge {
  margin: 118px 0 104px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 42px 0;
}
.bridge-inner {
  max-width: 720px;
}
.quiet-bridge p {
  margin: 0;
  color: var(--muted);
  font-family: "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif;
  font-size: clamp(18px, 2.1vw, 32px);
  line-height: 1.62;
  letter-spacing: -.035em;
}
.brand-note {
  display: none !important;
}

@media (max-width: 860px) {
  main {
    padding: 88px 20px 28px;
  }

  .header {
    padding: 28px 20px 20px;
  }

  .logo {
    font-size: 13px;
    letter-spacing: .16em;
  }

  .nav {
    gap: 18px;
    font-size: 11px;
  }

  .hero {
    min-height: 72vh;
    padding-bottom: 28px;
  }

  .hero h1 {
    font-size: clamp(66px, 21vw, 118px);
    line-height: .92;
    letter-spacing: -.064em;
  }

  .hero-copy {
    margin-top: 34px;
    padding-top: 22px;
    gap: 20px;
    border-top: 1px solid var(--line);
  }

  .hero-copy .jp {
    font-size: clamp(19px, 5vw, 28px);
    line-height: 1.55;
    letter-spacing: -.035em;
  }

  .hero-copy .en {
    font-size: 11px;
    line-height: 1.75;
  }

  .hero-meta {
    margin-top: 28px;
    font-size: 12px;
    line-height: 1.7;
  }

  .hero-meta > div:last-child {
    display: none;
  }

  .sequence {
    margin-top: 72px;
  }

  .frame {
    margin-bottom: 76px !important;
  }

  .caption {
    font-size: 10px;
    line-height: 1.55;
  }

  .word-break {
    min-height: 34vh;
    margin: 76px 0 84px;
  }

  .word-break p {
    font-size: clamp(15px, 3.8vw, 23px);
    line-height: 1.55;
  }

  .quiet-bridge {
    margin: 84px 0 86px;
    padding: 30px 0;
  }

  .quiet-bridge p {
    font-size: clamp(17px, 4.8vw, 25px);
    line-height: 1.7;
  }

  .info-link {
    margin: 96px 0 76px;
    padding-top: 22px;
  }

  .info-link h2 {
    font-size: clamp(38px, 13vw, 70px);
  }

  .page-title {
    min-height: 34vh;
  }

  .page-title h1 {
    font-size: clamp(44px, 15vw, 86px);
  }

  .page-lead {
    font-size: 12px;
    line-height: 1.85;
  }

  .content-body p,
  .service-item span {
    font-size: 12px;
    line-height: 1.85;
  }

  .lang-switch {
    right: 20px;
    top: 62px;
    bottom: auto;
    font-size: 10px;
  }
}


/* v20 language switch hard fix */
html[data-lang="ja"] .lang-en,
body[data-lang="ja"] .lang-en {
  display: none !important;
}

html[data-lang="en"] .lang-ja,
body[data-lang="en"] .lang-ja {
  display: none !important;
}


/* v21 separate-language pages */
.lang-switch a {
  opacity: .45;
}
.lang-switch a.is-active {
  opacity: 1;
  border-bottom: 1px solid currentColor;
}


/* v03 refinements */
.image { background: var(--image); }
.word-break { min-height: 32vh; margin: 96px 0 72px; }
.word-break p { color: rgba(17,17,15,.36); font-weight: 400; }
.profile-list { display: grid; border-top: 1px solid var(--line); margin-top: 30px; }
.profile-row { display: grid; grid-template-columns: 180px 1fr; gap: 34px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.profile-row dt { margin: 0; color: var(--faint); font-size: 10px; letter-spacing: .10em; }
.profile-row dd { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.82; }
.contact-panel { margin: 88px 0 78px; display: grid; grid-template-columns: 1fr minmax(260px, 520px); gap: 8vw; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 34px 0 38px; }
.contact-panel h2 { margin: 0; font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif; font-weight: 400; font-size: clamp(30px, 4.6vw, 68px); line-height: .98; letter-spacing: -.06em; }
.contact-panel p { margin: 0; max-width: 460px; color: var(--muted); font-size: 11px; }
.contact-panel .arrow { margin-top: 24px; }
@media (max-width: 860px) {
  .word-break { min-height: 26vh; margin: 66px 0 68px; }
  .profile-row { grid-template-columns: 1fr; gap: 4px; padding: 16px 0; }
  .profile-row dd { font-size: 12px; line-height: 1.85; }
  .contact-panel { grid-template-columns: 1fr; margin: 76px 0 70px; padding: 28px 0 32px; }
  .contact-panel p { font-size: 12px; line-height: 1.85; }
}


/* v04 inquiry-growth architecture */
.image:after { display: none !important; }
.word-break { min-height: 32vh; margin: 96px 0 92px; }
.word-break p {
  max-width: 560px;
  color: rgba(17,17,15,.34);
  font-size: clamp(13px, 1.55vw, 22px);
  line-height: 1.72;
  letter-spacing: -.025em;
}
.content-body .profile-table,
.content-body .faq-list,
.content-body .work-list {
  border-top: 1px solid var(--line);
  margin-top: 30px;
}
.profile-row,
.faq-item,
.work-item {
  display: grid;
  grid-template-columns: 180px 1fr;
  gap: 36px;
  padding: 16px 0;
  border-bottom: 1px solid var(--line);
}
.profile-row span:first-child,
.faq-item strong,
.work-item strong {
  color: var(--ink);
  font-weight: 400;
  font-size: 11px;
}
.profile-row span:last-child,
.faq-item span,
.work-item span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.82;
}
.cta-strip {
  margin: 96px 0 40px;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  padding: 34px 0 38px;
  display: grid;
  grid-template-columns: 1fr 1.1fr;
  gap: 8vw;
  align-items: end;
}
.cta-strip h2 {
  margin: 0;
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(30px, 4.8vw, 72px);
  line-height: .98;
  letter-spacing: -.055em;
}
.cta-strip p { margin: 0; color: var(--muted); max-width: 520px; font-size: 11px; }
.small-note { color: var(--faint); font-size: 10px; letter-spacing: .08em; }
@media (max-width: 860px) {
  .profile-row, .faq-item, .work-item, .cta-strip { grid-template-columns: 1fr; gap: 10px; }
  .word-break p { font-size: clamp(14px, 4vw, 22px); }
  .cta-strip { margin: 74px 0 36px; padding: 28px 0 32px; }
}


/* v09 company profile title refinement */
.profile-heading {
  margin: 0 0 24px;
  padding-top: 14px;
  border-top: 1px solid var(--line);
}
.profile-heading span {
  display: block;
  margin-bottom: 10px;
  color: var(--faint);
  font-size: 10px;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.profile-heading h2 {
  margin: 0;
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
  font-weight: 400;
  font-size: clamp(18px, 1.85vw, 28px);
  line-height: 1.24;
  letter-spacing: .02em;
}
@media (max-width: 860px) {
  .profile-heading { margin-bottom: 22px; padding-top: 16px; }
  .profile-heading h2 { font-size: clamp(18px, 5vw, 25px); }
}

/* v11 minimal line reduction */
.page-title {
  border-bottom: 0;
  padding-bottom: 34px;
}
.content-grid {
  border-bottom: 0;
  padding: 82px 0 46px;
}
.content-grid + .content-grid {
  padding-top: 56px;
}
.service-list,
.content-body .profile-table,
.content-body .faq-list,
.content-body .work-list,
.profile-list {
  border-top: 0;
  margin-top: 34px;
}
.service-item,
.profile-row,
.faq-item,
.work-item {
  border-bottom: 0;
  padding: 16px 0 24px;
}
.service-item + .service-item,
.profile-row + .profile-row,
.faq-item + .faq-item,
.work-item + .work-item {
  padding-top: 22px;
}
.profile-heading {
  border-top: 0;
  padding-top: 0;
  margin-bottom: 30px;
}
.contact-panel,
.cta-strip {
  border-top: 0;
  border-bottom: 0;
  padding: 48px 0 34px;
}
.info-link {
  border-top: 0;
  padding-top: 8px;
}
.footer {
  border-top: 0;
  padding-top: 0;
}
.arrow,
.email,
.lang-switch a.is-active {
  border-bottom-color: rgba(17,17,15,.28);
}

.home-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px 28px;
  margin-top: 24px;
}
@media (max-width: 860px) {
  .content-grid { padding: 62px 0 34px; }
  .content-grid + .content-grid { padding-top: 38px; }
  .profile-heading { padding-top: 0; }
  .contact-panel, .cta-strip { padding: 34px 0 30px; }
}


/* v12 service unification */
.service-core {
  max-width: 620px;
  margin-top: 4px;
}
.service-core p {
  margin: 0 0 18px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.86;
}
.service-components {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 36px;
  margin-top: 42px;
  max-width: 860px;
}
.service-components div {
  display: block;
}
.service-components strong {
  display: block;
  margin-bottom: 12px;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(15px, 1.35vw, 21px);
  line-height: 1.12;
  letter-spacing: -.035em;
}
.service-components span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.82;
}
@media (max-width: 860px) {
  .service-components {
    grid-template-columns: 1fr;
    gap: 26px;
    margin-top: 34px;
  }
  .service-core p,
  .service-components span {
    font-size: 12px;
    line-height: 1.85;
  }
}


/* v19 typography and responsive line refinement */
.page-title {
  min-height: 32vh;
  padding-bottom: 26px;
}
.page-title h1 {
  font-size: clamp(34px, 5.8vw, 78px);
  line-height: 1;
  letter-spacing: -.052em;
  text-wrap: balance;
}
.page-lead {
  max-width: 500px;
  font-size: 11px;
  line-height: 1.9;
  text-wrap: pretty;
}
.content-grid {
  grid-template-columns: 170px minmax(0, 1fr);
  gap: 7vw;
  padding: 70px 0 40px;
}
.content-grid + .content-grid {
  padding-top: 42px;
}
.content-body {
  max-width: 660px;
}
.content-body h2 {
  max-width: 560px;
  margin-bottom: 22px;
  font-size: clamp(20px, 2.55vw, 34px);
  line-height: 1.22;
  letter-spacing: -.042em;
  text-wrap: balance;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
.content-body p,
.service-core p,
.faq-item span,
.profile-row dd,
.cta-strip p,
.contact-panel p {
  line-height: 1.9;
  text-wrap: pretty;
}
.service-core {
  max-width: 600px;
}
.service-components {
  gap: 30px;
  margin-top: 36px;
  max-width: 820px;
}
.service-components strong {
  font-size: clamp(14px, 1.2vw, 18px);
  line-height: 1.25;
  letter-spacing: -.02em;
}
.service-components span {
  line-height: 1.9;
}
.faq-item strong,
.profile-row span:first-child,
.work-item strong {
  line-height: 1.65;
  text-wrap: pretty;
}
.cta-strip h2,
.contact-panel h2 {
  font-size: clamp(24px, 3.3vw, 48px);
  line-height: 1.04;
  letter-spacing: -.045em;
}
.profile-title {
  font-size: clamp(17px, 1.5vw, 23px) !important;
  line-height: 1.35 !important;
  letter-spacing: .02em !important;
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif !important;
}
.info-link h2 {
  font-size: clamp(28px, 4.4vw, 60px);
  line-height: 1.02;
}

@media (max-width: 860px) {
  .page-title {
    min-height: 28vh;
    padding-bottom: 20px;
  }
  .page-title h1 {
    font-size: clamp(34px, 11vw, 56px);
    line-height: 1.02;
    letter-spacing: -.048em;
  }
  .page-lead {
    max-width: 100%;
    font-size: 11px;
    line-height: 1.9;
  }
  .content-grid {
    padding: 48px 0 26px;
  }
  .content-grid + .content-grid {
    padding-top: 28px;
  }
  .section-label {
    font-size: 9px;
    letter-spacing: .16em;
  }
  .content-body h2 {
    font-size: clamp(20px, 6.2vw, 27px);
    line-height: 1.28;
    letter-spacing: -.035em;
    margin-bottom: 20px;
  }
  .content-body p,
  .service-core p,
  .service-components span,
  .faq-item span,
  .profile-row dd,
  .cta-strip p,
  .contact-panel p {
    font-size: 11px;
    line-height: 1.9;
  }
  .service-components {
    gap: 22px;
    margin-top: 30px;
  }
  .service-components strong {
    font-size: 17px;
    margin-bottom: 8px;
  }
  .faq-item strong,
  .profile-row span:first-child,
  .work-item strong {
    font-size: 11px;
    line-height: 1.7;
  }
  .cta-strip h2,
  .contact-panel h2 {
    font-size: clamp(24px, 8vw, 36px);
    line-height: 1.08;
  }
  .profile-title {
    font-size: 18px !important;
  }
  .info-link h2 {
    font-size: clamp(32px, 11vw, 52px);
  }
}


/* v20 subtle structure for services readability */
.services-page .content-grid {
  border-top: 1px solid rgba(17,17,15,.105);
  padding-top: 58px;
}
.services-page .content-grid + .content-grid {
  margin-top: 12px;
}
.services-page .service-components {
  border-top: 1px solid rgba(17,17,15,.09);
  padding-top: 30px;
}
.services-page .faq-list {
  border-top: 1px solid rgba(17,17,15,.09);
  margin-top: 28px;
}
.services-page .faq-item {
  border-bottom: 1px solid rgba(17,17,15,.075);
  padding: 18px 0 22px;
}
.services-page .faq-item:last-child {
  border-bottom: 0;
}
.services-page .section-label {
  color: rgba(17,17,15,.30);
}
@media (max-width: 860px) {
  .services-page .content-grid {
    padding-top: 36px;
  }
  .services-page .content-grid + .content-grid {
    margin-top: 4px;
  }
  .services-page .service-components {
    padding-top: 24px;
  }
  .services-page .faq-list {
    margin-top: 24px;
  }
  .services-page .faq-item {
    padding: 16px 0 20px;
  }
}


/* v24 company profile integration */
.profile-section {
  padding-top: 34px;
}
.profile-intro {
  max-width: 600px;
  margin-bottom: 24px !important;
}
.profile-section .profile-list {
  margin-top: 18px;
}
.profile-section .profile-row {
  padding: 10px 0 14px;
}
.profile-section .profile-row dt {
  color: rgba(17,17,15,.38);
}
.profile-section .profile-row dd {
  color: rgba(17,17,15,.62);
}
@media (max-width: 860px) {
  .profile-section {
    padding-top: 28px;
  }
  .profile-section .profile-list {
    margin-top: 16px;
  }
  .profile-section .profile-row {
    padding: 10px 0 13px;
  }
}

/* v26 real photograph sequence */
.image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  user-select: none;
  -webkit-user-drag: none;
}
.f2 .image img { object-position: center top; }
.f4 .image img { object-position: center center; }
.f6 .image img { object-position: center center; }


/* v29 no-crop photograph display */
.sequence .image {
  aspect-ratio: auto !important;
  overflow: visible;
}
.sequence .image img {
  width: 100%;
  height: auto;
  object-fit: contain;
}


/* v31 Journal: SEO/AIO knowledge assets without changing the main site tone */
.journal-page .page-title,
.article-page .page-title {
  border-bottom: 0;
  min-height: 30vh;
}
.journal-list {
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(17,17,15,.10);
  margin-top: 16px;
}
.journal-item {
  display: grid;
  grid-template-columns: minmax(220px, .86fr) minmax(0, 1.14fr);
  gap: 5vw;
  padding: 22px 0 28px;
  border-bottom: 1px solid rgba(17,17,15,.075);
}
.journal-item a {
  display: inline-block;
}
.journal-item strong {
  display: block;
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(17px, 1.5vw, 24px);
  line-height: 1.3;
  letter-spacing: -.035em;
}
.journal-item span,
.article-meta {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.9;
}
.article-page .content-body {
  max-width: 720px;
}
.article-body {
  color: var(--muted);
  font-size: 12px;
  line-height: 2;
  text-wrap: pretty;
}
.article-body h2 {
  margin: 56px 0 18px;
  color: var(--ink);
  font-family: Georgia, "Times New Roman", "Hiragino Mincho ProN", "Yu Mincho", serif;
  font-weight: 400;
  font-size: clamp(20px, 2.2vw, 31px);
  line-height: 1.25;
  letter-spacing: -.04em;
}
.article-body p {
  margin: 0 0 20px;
  color: var(--muted);
  font-size: 12px;
  line-height: 2;
}
.article-body ul {
  list-style: none;
  padding: 0;
  margin: 22px 0 34px;
  border-top: 1px solid rgba(17,17,15,.08);
}
.article-body li {
  padding: 12px 0 14px;
  border-bottom: 1px solid rgba(17,17,15,.065);
}
.article-note {
  margin: 54px 0 0;
  padding-top: 24px;
  border-top: 1px solid rgba(17,17,15,.09);
  color: var(--muted);
}
.journal-back {
  margin-top: 38px;
}
@media (max-width: 860px) {
  .journal-item {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 20px 0 24px;
  }
  .journal-item strong {
    font-size: clamp(18px, 5vw, 24px);
  }
  .article-body,
  .article-body p {
    font-size: 12px;
    line-height: 1.95;
  }
  .article-body h2 {
    margin-top: 44px;
    font-size: clamp(20px, 6vw, 27px);
  }
}


/* v33 Services visual passage */
.service-visual {
  margin: 52px 0 42px;
  display: grid;
  grid-template-columns: minmax(220px, .8fr) minmax(0, 1.6fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: end;
}
.service-visual figure {
  margin: 0;
}
.service-visual img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}
.service-visual-whole {
  max-width: 360px;
}
.service-visual-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(12px, 1.5vw, 22px);
  align-items: start;
}
@media (max-width: 860px) {
  .service-visual {
    margin: 40px 0 36px;
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .service-visual-whole {
    max-width: none;
  }
  .service-visual-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
}

/* v32 Journal typography alignment */
.journal-page .page-title h1,
.article-page .page-title h1,
.journal-item strong,
.article-body h2 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", Georgia, "Times New Roman", serif;
}
.journal-item span,
.article-meta,
.article-body,
.article-body p,
.article-body li {
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
}
.journal-page .page-lead,
.article-page .page-lead {
  font-family: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, sans-serif;
}


/* v35 Services study passage */
.study-section {
  padding-top: 64px;
}
.study-section .content-body > h2 {
  max-width: 880px;
}
.study-lead {
  max-width: 880px;
  margin: 0 0 46px;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.9;
}
.service-visual {
  margin: 0 0 44px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(24px, 3.8vw, 56px);
  align-items: start;
  max-width: 1040px;
}
.service-visual figure {
  margin: 0;
}
.service-visual img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}
@media (max-width: 860px) {
  .study-section {
    padding-top: 52px;
  }
  .study-lead {
    margin-bottom: 30px;
    font-size: 12px;
    line-height: 1.9;
  }
  .service-visual {
    grid-template-columns: 1fr;
    gap: 18px;
    max-width: none;
  }
}

/* v36 Services visual passage: editorial, not catalog-like */
.study-section .content-body > h2 {
  max-width: 780px;
}
.study-lead {
  max-width: 780px;
  margin-bottom: clamp(42px, 5vw, 72px);
}
.service-visual {
  margin: 0 0 clamp(56px, 7vw, 96px);
  max-width: 1120px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 34px);
  align-items: start;
}
.service-visual-whole {
  grid-column: 1 / span 6;
  max-width: none;
}
.service-visual-grid {
  grid-column: 7 / -1;
  display: grid;
  grid-template-columns: repeat(8, minmax(0, 1fr));
  gap: clamp(18px, 2.2vw, 32px);
  align-items: start;
  padding-top: clamp(30px, 5.5vw, 86px);
}
.service-visual-grid .detail-01 {
  grid-column: 1 / span 3;
  margin-top: clamp(18px, 3vw, 48px);
}
.service-visual-grid .detail-02 {
  grid-column: 4 / span 4;
}
.service-visual-grid .detail-03 {
  grid-column: 2 / span 4;
  margin-top: clamp(12px, 2.5vw, 42px);
}
.service-visual-grid .detail-04 {
  grid-column: 6 / span 3;
  margin-top: clamp(48px, 7vw, 110px);
}
@media (max-width: 860px) {
  .service-visual {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .service-visual-whole,
  .service-visual-grid {
    grid-column: auto;
  }
  .service-visual-grid {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    padding-top: 8px;
    gap: 14px;
  }
  .service-visual-grid .detail-01 {
    grid-column: 1 / span 3;
    margin-top: 20px;
  }
  .service-visual-grid .detail-02 {
    grid-column: 4 / span 3;
    margin-top: 0;
  }
  .service-visual-grid .detail-03 {
    grid-column: 1 / span 4;
    margin-top: 14px;
  }
  .service-visual-grid .detail-04 {
    grid-column: 4 / span 3;
    margin-top: 44px;
  }
}

/* v37 Services study passage: ergonomically edited asymmetry */
.study-section .content-body > h2 {
  max-width: 760px;
}
.study-lead {
  max-width: 760px;
  margin: 0 0 clamp(40px, 4.8vw, 68px);
}
.service-visual {
  margin: 0 0 clamp(60px, 7vw, 98px);
  max-width: 1060px;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  column-gap: clamp(18px, 2vw, 32px);
  row-gap: clamp(18px, 2vw, 34px);
  align-items: start;
}
.service-visual figure {
  margin: 0;
}
.service-visual img {
  display: block;
  width: 100%;
  height: auto;
  user-select: none;
  -webkit-user-drag: none;
}
.service-visual-whole {
  grid-column: 1 / span 6;
  grid-row: 1 / span 2;
  max-width: none;
}
.service-visual-grid {
  display: contents;
}
.service-visual-grid .detail-01 {
  grid-column: 7 / span 3;
  grid-row: 1;
  margin-top: clamp(52px, 5vw, 78px);
}
.service-visual-grid .detail-02 {
  grid-column: 10 / span 3;
  grid-row: 1;
  margin-top: clamp(8px, 1.4vw, 24px);
}
.service-visual-grid .detail-03 {
  grid-column: 7 / span 4;
  grid-row: 2;
  margin-top: clamp(12px, 2vw, 34px);
}
.service-visual-grid .detail-04 {
  grid-column: 11 / span 2;
  grid-row: 2;
  margin-top: clamp(58px, 6vw, 94px);
}
@media (max-width: 860px) {
  .study-lead {
    margin-bottom: 34px;
  }
  .service-visual {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 16px;
  }
  .service-visual-whole {
    grid-column: 1 / -1;
    grid-row: auto;
  }
  .service-visual-grid .detail-01 {
    grid-column: 1 / span 3;
    grid-row: auto;
    margin-top: 10px;
  }
  .service-visual-grid .detail-02 {
    grid-column: 4 / span 3;
    grid-row: auto;
    margin-top: 0;
  }
  .service-visual-grid .detail-03 {
    grid-column: 1 / span 4;
    grid-row: auto;
    margin-top: 12px;
  }
  .service-visual-grid .detail-04 {
    grid-column: 4 / span 3;
    grid-row: auto;
    margin-top: 34px;
  }
}


/* v38: move the visual study from Services to Journal.
   Services stays action-oriented; Journal carries deeper photographic thinking. */
.journal-visual-study {
  margin: 3.6rem 0 4.2rem;
}
.journal-visual-study .journal-visual-kicker {
  margin: 0 0 1.1rem;
  font-family: var(--sans);
  font-size: .72rem;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--muted);
}
.journal-visual-study h2 {
  margin-top: 0;
}
.article-body .journal-visual-study p {
  max-width: 760px;
}
.journal-visual.service-visual {
  margin-top: 2.2rem;
}
@media (max-width: 760px) {
  .journal-visual-study {
    margin: 2.8rem 0 3.4rem;
  }
}

/* v39 Direction refinement */
.direction-page .page-title h1 {
  letter-spacing: -.055em;
}
.direction-page .process-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 34px;
  border-top: 1px solid rgba(17,17,15,.09);
  margin-top: 28px;
}
.direction-page .process-list div {
  padding: 18px 0 22px;
  border-bottom: 1px solid rgba(17,17,15,.075);
}
.direction-page .process-list strong {
  display: block;
  margin-bottom: 8px;
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  font-size: clamp(14px, 1.2vw, 18px);
  line-height: 1.25;
  letter-spacing: -.02em;
}
.direction-page .process-list span {
  display: block;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.9;
  text-wrap: pretty;
}
@media (max-width: 860px) {
  .direction-page .process-list {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 24px;
  }
  .direction-page .process-list div {
    padding: 16px 0 20px;
  }
  .direction-page .process-list strong {
    font-size: 17px;
  }
  .direction-page .process-list span {
    font-size: 11px;
    line-height: 1.9;
  }
}


/* v41 Direction partnership */
.partnership-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; margin-top: 34px; }
.partnership-list div { border-top: 1px solid var(--line); padding-top: 18px; }
.partnership-list strong { display:block; font-family: var(--serif); font-size: clamp(22px, 2.2vw, 32px); line-height: 1.2; font-weight: 400; margin-bottom: 18px; color: var(--ink); }
.partnership-list span { display:block; color: var(--muted); font-size: 13px; line-height: 2.0; letter-spacing: .03em; }
@media (max-width: 760px) { .partnership-list { grid-template-columns: 1fr; gap: 22px; } .partnership-list strong { font-size: 22px; } }

/* v42 Direction Japanese heading typography fix */
.direction-page .process-list strong,
.partnership-list strong {
  font-family: var(--serif);
  font-weight: 400;
  letter-spacing: -.055em;
  font-feature-settings: "palt" 1;
}
.direction-page .process-list strong {
  font-size: clamp(20px, 2.05vw, 30px);
  line-height: 1.24;
}
.partnership-list strong {
  font-size: clamp(20px, 2.05vw, 30px);
  line-height: 1.24;
}
@media (max-width: 760px) {
  .direction-page .process-list strong,
  .partnership-list strong {
    font-size: 22px;
    line-height: 1.28;
  }
}

/* v43 Typography and line-break supervision */
/* Prevent awkward Japanese heading breaks in Direction cards. */
.service-components strong,
.partnership-list strong,
.direction-page .process-list strong {
  word-break: keep-all;
  overflow-wrap: normal;
  line-break: strict;
  text-wrap: balance;
}

.direction-page .service-components {
  gap: 38px;
  max-width: 900px;
}
.direction-page .service-components strong {
  font-size: clamp(13px, 1.05vw, 16px);
  line-height: 1.28;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.direction-page .service-components span {
  font-size: 11px;
  line-height: 1.9;
}

.direction-page .process-list strong {
  font-size: clamp(17px, 1.58vw, 23px);
  line-height: 1.26;
  letter-spacing: -.045em;
}

.direction-page .partnership-list {
  gap: 52px;
}
.direction-page .partnership-list strong {
  font-size: clamp(17px, 1.55vw, 22px);
  line-height: 1.28;
  letter-spacing: -.045em;
  white-space: normal;
  max-width: 9.5em;
}
.direction-page .partnership-list span {
  font-size: 12px;
  line-height: 1.95;
}

@media (min-width: 980px) {
  .direction-page .partnership-list strong {
    min-height: 2.55em;
  }
}

@media (max-width: 860px) {
  .direction-page .service-components strong,
  .direction-page .process-list strong,
  .direction-page .partnership-list strong {
    white-space: normal;
    font-size: 20px;
    line-height: 1.32;
  }
  .direction-page .partnership-list strong {
    max-width: none;
    min-height: 0;
  }
}

/* v44 Global typography and line-break supervision
   Purpose: make the site feel editorial, readable, and stable across pages.
   The visible copy stays quiet; AIO/SEO structure remains in metadata and JSON-LD. */
:root {
  --measure-short: 32em;
  --measure-body: 46em;
}

.page-title h1,
.content-body h2,
.cta-strip h2,
.contact-panel h2,
.article-body h2,
.journal-item strong,
.service-item strong,
.service-components strong,
.direction-page .process-list strong,
.direction-page .partnership-list strong,
.faq-item strong {
  font-feature-settings: "palt" 1;
  line-break: strict;
  word-break: keep-all;
  overflow-wrap: normal;
  text-wrap: balance;
}

.page-title h1 {
  font-size: clamp(30px, 5.05vw, 66px) !important;
  line-height: 1.06 !important;
  letter-spacing: -.047em !important;
  max-width: 10.5em;
}

.page-lead {
  max-width: 38em !important;
  font-size: 11px !important;
  line-height: 1.92 !important;
  letter-spacing: .015em;
  text-wrap: pretty;
}

.content-body {
  max-width: 620px !important;
}

.content-body h2,
.article-body h2 {
  font-size: clamp(18px, 2.05vw, 28px) !important;
  line-height: 1.34 !important;
  letter-spacing: -.035em !important;
  max-width: 17em !important;
  margin-bottom: 20px !important;
}

.content-body p,
.service-core p,
.service-components span,
.direction-page .process-list span,
.direction-page .partnership-list span,
.faq-item span,
.journal-item span,
.article-body p,
.article-body li,
.profile-row dd,
.cta-strip p,
.contact-panel p {
  font-size: 11px !important;
  line-height: 1.96 !important;
  letter-spacing: .018em;
  text-wrap: pretty;
}

.service-core,
.article-body,
.journal-item span {
  max-width: var(--measure-body);
}

.service-components {
  gap: clamp(28px, 4.2vw, 64px) !important;
}

.service-components strong,
.direction-page .process-list strong,
.direction-page .partnership-list strong,
.faq-item strong,
.journal-item strong {
  font-size: clamp(15px, 1.32vw, 19px) !important;
  line-height: 1.42 !important;
  letter-spacing: -.025em !important;
}

.direction-page .service-components strong {
  font-size: clamp(13px, 1.0vw, 15px) !important;
  white-space: nowrap;
}

.direction-page .partnership-list strong {
  max-width: 12em !important;
  min-height: 0 !important;
}

.direction-page .partnership-list {
  gap: clamp(34px, 4.8vw, 72px) !important;
}

.direction-page .process-list {
  gap: 0 clamp(30px, 4vw, 58px) !important;
}

.journal-item {
  grid-template-columns: minmax(220px, .92fr) minmax(0, 1.08fr) !important;
  gap: clamp(30px, 5vw, 72px) !important;
}

.journal-item strong {
  max-width: 17em;
}

.cta-strip h2,
.contact-panel h2 {
  font-size: clamp(22px, 3.0vw, 42px) !important;
  line-height: 1.1 !important;
  letter-spacing: -.04em !important;
}

.info-link h2 {
  font-size: clamp(26px, 4.0vw, 52px) !important;
  line-height: 1.08 !important;
}

.profile-heading h2,
.profile-title {
  font-size: clamp(16px, 1.35vw, 21px) !important;
  line-height: 1.5 !important;
}

@media (max-width: 860px) {
  .page-title h1 {
    font-size: clamp(30px, 10vw, 48px) !important;
    max-width: 9.5em;
  }
  .content-grid {
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    padding: 46px 0 28px !important;
  }
  .content-body h2,
  .article-body h2 {
    font-size: clamp(19px, 5.4vw, 25px) !important;
    max-width: 13.5em !important;
    line-height: 1.38 !important;
  }
  .service-components strong,
  .direction-page .process-list strong,
  .direction-page .partnership-list strong,
  .faq-item strong,
  .journal-item strong {
    font-size: 18px !important;
    line-height: 1.44 !important;
  }
  .direction-page .service-components strong {
    white-space: normal;
  }
  .journal-item {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
    padding: 20px 0 24px !important;
  }
}

@media (min-width: 1100px) {
  .direction-page .content-body {
    max-width: 760px !important;
  }
  .direction-page .content-body h2 {
    max-width: 20em !important;
  }
}

/* v45 Typography QA: global readable rhythm and no-overlap guard
   The visible text stays calm; SEO/AIO metadata remains intact. */
:root {
  --sf-measure-title: 18em;
  --sf-measure-text: 42em;
}

/* General heading scale: smaller, quieter, safer Japanese wrapping */
.page-title h1 {
  font-size: clamp(34px, 4.4vw, 58px) !important;
  line-height: 1.08 !important;
  letter-spacing: -.045em !important;
  max-width: 11em !important;
}
.content-body h2,
.article-body h2 {
  font-size: clamp(19px, 1.82vw, 25px) !important;
  line-height: 1.46 !important;
  letter-spacing: -.03em !important;
  max-width: var(--sf-measure-title) !important;
  text-wrap: balance;
}

/* Body copy: keep a readable measure and prevent text collision */
.page-lead,
.content-body p,
.service-core p,
.service-components span,
.direction-page .process-list span,
.direction-page .partnership-list span,
.faq-item span,
.journal-item span,
.article-body p,
.article-body li,
.cta-strip p,
.contact-panel p,
.profile-row dd {
  max-width: var(--sf-measure-text);
  font-size: 11px !important;
  line-height: 2.02 !important;
  letter-spacing: .018em !important;
  text-wrap: pretty;
}

/* The repeated card/list headings must never overlap body copy. */
.faq-item strong,
.journal-item strong,
.direction-page .process-list strong,
.direction-page .partnership-list strong,
.service-components strong {
  display: block;
  max-width: 100% !important;
  word-break: normal !important;
  overflow-wrap: break-word !important;
  line-break: strict;
  white-space: normal !important;
  text-wrap: balance;
}

/* Direction: long Before questions are stacked, not side-by-side. */
.direction-page .faq-list {
  border-top: 1px solid rgba(17,17,15,.09) !important;
  margin-top: 28px !important;
}
.direction-page .faq-item {
  display: block !important;
  grid-template-columns: none !important;
  gap: 0 !important;
  padding: 20px 0 22px !important;
  border-bottom: 1px solid rgba(17,17,15,.075) !important;
}
.direction-page .faq-item strong {
  font-family: var(--serif);
  font-weight: 400;
  color: var(--ink);
  font-size: clamp(16px, 1.45vw, 21px) !important;
  line-height: 1.48 !important;
  letter-spacing: -.035em !important;
  margin: 0 0 8px !important;
  max-width: 25em !important;
}
.direction-page .faq-item span {
  display: block !important;
  max-width: 44em !important;
  color: var(--muted);
}

/* Direction: keep 3-column headings elegant without awkward one-character drops. */
.direction-page .service-components {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(32px, 4.2vw, 58px) !important;
}
.direction-page .service-components strong {
  font-size: clamp(14px, 1.05vw, 16px) !important;
  line-height: 1.42 !important;
  letter-spacing: -.02em !important;
  margin-bottom: 12px !important;
}
.direction-page .partnership-list {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(34px, 4.6vw, 64px) !important;
}
.direction-page .partnership-list strong {
  font-size: clamp(16px, 1.35vw, 20px) !important;
  line-height: 1.46 !important;
  letter-spacing: -.03em !important;
  min-height: 0 !important;
  max-width: 12em !important;
  margin-bottom: 12px !important;
}
.direction-page .process-list strong {
  font-size: clamp(16px, 1.38vw, 20px) !important;
  line-height: 1.42 !important;
  letter-spacing: -.03em !important;
}

/* Journal index: stop title/summary collisions and make the reading path calm. */
.journal-page .page-title {
  min-height: 24vh !important;
}
.journal-page .page-title h1 {
  font-size: clamp(42px, 6.2vw, 82px) !important;
  line-height: .98 !important;
}
.journal-list {
  max-width: 980px;
  margin-left: auto;
}
.journal-item {
  grid-template-columns: minmax(280px, .92fr) minmax(280px, 1.08fr) !important;
  gap: clamp(34px, 5vw, 70px) !important;
  align-items: start !important;
  padding: 26px 0 30px !important;
}
.journal-item strong {
  font-size: clamp(16px, 1.38vw, 21px) !important;
  line-height: 1.5 !important;
  letter-spacing: -.03em !important;
  max-width: 22em !important;
}
.journal-item span {
  display: block !important;
  max-width: 36em !important;
  padding-top: 2px;
}

/* Article pages: keep paragraphs editorial, not dense. */
.article-page .content-body,
.article-body {
  max-width: 720px !important;
}
.article-body p {
  margin: 0 0 1.45em !important;
}

@media (max-width: 960px) {
  .direction-page .service-components,
  .direction-page .partnership-list,
  .direction-page .process-list,
  .journal-item {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
  }
  .direction-page .service-components div,
  .direction-page .partnership-list div,
  .direction-page .process-list div,
  .journal-item {
    padding: 18px 0 22px !important;
  }
  .journal-list {
    max-width: none;
    margin-left: 0;
  }
  .journal-item span {
    padding-top: 6px;
  }
}

@media (max-width: 760px) {
  .page-title h1 {
    font-size: clamp(31px, 9.2vw, 45px) !important;
    line-height: 1.12 !important;
    max-width: 10em !important;
  }
  .journal-page .page-title h1 {
    font-size: clamp(42px, 17vw, 68px) !important;
  }
  .content-body h2,
  .article-body h2 {
    font-size: clamp(19px, 5.1vw, 24px) !important;
    line-height: 1.46 !important;
    max-width: 12.5em !important;
  }
  .direction-page .faq-item strong,
  .journal-item strong,
  .direction-page .process-list strong,
  .direction-page .partnership-list strong {
    font-size: 18px !important;
    line-height: 1.48 !important;
  }
}

/* v46 typography cleanup: make explanatory lists calm, not noisy. */
:root {
  --sf-list-title: clamp(14px, .96vw, 16px);
  --sf-list-copy: 11px;
}

/* Global page headings: slightly quieter across the site. */
.page-title h1 {
  font-size: clamp(38px, 5.8vw, 78px) !important;
  line-height: 1.03 !important;
  letter-spacing: -.055em !important;
}
.content-body h2,
.article-body h2,
.cta-strip h2,
.contact-panel h2 {
  font-size: clamp(24px, 2.65vw, 39px) !important;
  line-height: 1.22 !important;
  letter-spacing: -.048em !important;
  max-width: 13.5em !important;
  text-wrap: balance;
}

/* Direction / Before: stop the section from becoming a wall of oversized questions. */
.direction-page .before-note {
  max-width: 42em;
  margin: 12px 0 26px;
  color: var(--muted);
  font-size: 11px;
  line-height: 2;
  letter-spacing: .018em;
}
.direction-page .before-list {
  max-width: 760px;
  border-top: 1px solid rgba(17,17,15,.075) !important;
}
.direction-page .before-list .faq-item {
  padding: 16px 0 18px !important;
  display: grid !important;
  grid-template-columns: minmax(240px, .84fr) minmax(280px, 1.16fr) !important;
  gap: clamp(28px, 4vw, 56px) !important;
  align-items: baseline !important;
}
.direction-page .before-list .faq-item strong {
  font-family: var(--serif);
  font-size: var(--sf-list-title) !important;
  line-height: 1.65 !important;
  letter-spacing: -.026em !important;
  margin: 0 !important;
  max-width: 20em !important;
  text-wrap: balance;
}
.direction-page .before-list .faq-item span {
  max-width: 34em !important;
  font-size: var(--sf-list-copy) !important;
  line-height: 2 !important;
  padding-top: 0 !important;
}

/* Journal index: use a calm editorial list, not competing headings. */
.journal-page .content-body h2 {
  font-size: clamp(23px, 2.45vw, 36px) !important;
  line-height: 1.28 !important;
  max-width: 14em !important;
}
.journal-list {
  max-width: 860px !important;
}
.journal-item {
  grid-template-columns: minmax(260px, .9fr) minmax(280px, 1.1fr) !important;
  gap: clamp(28px, 4vw, 58px) !important;
  padding: 20px 0 23px !important;
}
.journal-item strong {
  font-size: clamp(14px, 1.06vw, 17px) !important;
  line-height: 1.72 !important;
  letter-spacing: -.026em !important;
  max-width: 24em !important;
}
.journal-item span {
  font-size: 11px !important;
  line-height: 2 !important;
  max-width: 34em !important;
}

/* Keep three-column blocks compact and clear. */
.direction-page .service-components strong,
.direction-page .partnership-list strong,
.direction-page .process-list strong {
  font-size: clamp(14px, 1vw, 16px) !important;
  line-height: 1.58 !important;
  letter-spacing: -.024em !important;
}
.direction-page .service-components span,
.direction-page .partnership-list span,
.direction-page .process-list span {
  max-width: 31em !important;
}

@media (max-width: 960px) {
  .direction-page .before-list .faq-item {
    display: block !important;
    grid-template-columns: none !important;
    padding: 17px 0 20px !important;
  }
  .direction-page .before-list .faq-item strong {
    max-width: 18em !important;
    margin-bottom: 6px !important;
  }
}
@media (max-width: 760px) {
  .page-title h1 {
    font-size: clamp(31px, 8.4vw, 42px) !important;
    line-height: 1.16 !important;
    max-width: 11em !important;
  }
  .content-body h2,
  .article-body h2,
  .cta-strip h2,
  .contact-panel h2 {
    font-size: clamp(20px, 5vw, 26px) !important;
    line-height: 1.42 !important;
    max-width: 12.5em !important;
  }
  .journal-item strong,
  .direction-page .before-list .faq-item strong {
    font-size: 15px !important;
    line-height: 1.66 !important;
  }
}


/* v47 Final QA: language, clarity, typography, and calm conversion flow */
/* Top lower action block: keep the photographic air, move navigation aid to the right. */
.info-link > div {
  justify-self: end;
  max-width: 360px;
}
.info-link .arrow + br + .arrow { margin-top: 16px; }

/* Direction: simplify Before into a quiet statement instead of a noisy list. */
.direction-page .before-section .content-body {
  max-width: 620px !important;
}
.direction-page .before-section h2 {
  max-width: 15em !important;
  margin-bottom: 18px !important;
}
.direction-page .before-section p {
  max-width: 38em !important;
  margin: 0 0 14px !important;
  color: var(--muted);
  font-size: 11px !important;
  line-height: 2.02 !important;
  letter-spacing: .018em;
}

/* Journal index: one calm editorial column, no title/body collision. */
.journal-page .content-grid {
  grid-template-columns: 170px minmax(0, 760px) !important;
}
.journal-page .content-body {
  max-width: 760px !important;
}
.journal-page .content-body h2 {
  font-size: clamp(21px, 2.2vw, 32px) !important;
  line-height: 1.34 !important;
  max-width: 15em !important;
  margin-bottom: 20px !important;
}
.journal-page .content-body > p {
  max-width: 42em !important;
  margin-bottom: 32px !important;
}
.journal-list {
  max-width: 760px !important;
  margin: 30px 0 0 !important;
  border-top: 1px solid rgba(17,17,15,.085) !important;
}
.journal-item {
  display: block !important;
  padding: 18px 0 20px !important;
  border-bottom: 1px solid rgba(17,17,15,.065) !important;
}
.journal-item strong {
  display: block !important;
  max-width: 31em !important;
  margin-bottom: 6px !important;
  font-size: clamp(14px, 1.08vw, 16px) !important;
  line-height: 1.68 !important;
  letter-spacing: -.022em !important;
}
.journal-item span {
  display: block !important;
  max-width: 44em !important;
  padding-top: 0 !important;
  font-size: 11px !important;
  line-height: 1.96 !important;
}

/* Global safety net: prevent overlapping text in content lists. */
.faq-item,
.journal-item,
.direction-page .process-list div,
.direction-page .partnership-list div,
.direction-page .service-components div {
  min-width: 0;
}

@media (max-width: 860px) {
  .info-link > div {
    justify-self: start;
    max-width: none;
  }
  .journal-page .content-grid {
    grid-template-columns: 1fr !important;
  }
  .journal-list {
    max-width: none !important;
  }
}

/* v48 Top lower action block: align the closing navigation with the bottom-right language switch. */
.info-link {
  grid-template-columns: minmax(0, 1fr) minmax(260px, 420px);
}
.info-link > div {
  justify-self: end;
  max-width: 420px;
  text-align: right;
}
.info-link p {
  margin-left: auto;
  max-width: 420px;
  text-align: right;
  text-wrap: balance;
}
.info-link .arrow {
  text-align: right;
}
@media (max-width: 860px) {
  .info-link {
    grid-template-columns: 1fr;
  }
  .info-link > div {
    justify-self: start;
    max-width: none;
    text-align: left;
  }
  .info-link p,
  .info-link .arrow {
    margin-left: 0;
    text-align: left;
  }
}

/* v55 CTA alignment refinement */
.cta-strip > div {
  justify-self: end;
  width: min(100%, 520px);
}
@media (max-width: 860px) {
  .cta-strip > div {
    justify-self: start;
    width: 100%;
  }
}


/* v57 mobile: show a portrait photograph first on Top only. PC order stays unchanged. */
@media (max-width: 860px) {
  .sequence {
    display: flex;
    flex-direction: column;
  }
  .sequence .f2 { order: 1; }
  .sequence .f1 { order: 2; }
  .sequence .f3 { order: 3; }
  .sequence .f4 { order: 4; }
  .sequence .f5 { order: 5; }
  .sequence .f6 { order: 6; }
}


/* v58 CTA: align lower Contact copy and link to the right on desktop. */
.cta-strip > div {
  text-align: right;
}
.cta-strip p {
  margin-left: auto;
}
.cta-strip .arrow {
  text-align: right;
}
@media (max-width: 860px) {
  .cta-strip > div {
    text-align: left;
  }
  .cta-strip p {
    margin-left: 0;
  }
  .cta-strip .arrow {
    text-align: left;
  }
}

/* v61 Motion refinement: quiet, editorial interaction layer. */
:root {
  --motion-ease: cubic-bezier(0.16, 1, 0.3, 1);
}

.motion-ready .motion-reveal {
  opacity: 0;
  transform: translate3d(0, 14px, 0);
  transition:
    opacity 900ms var(--motion-ease),
    transform 900ms var(--motion-ease);
  will-change: opacity, transform;
}
.motion-ready .frame.motion-reveal {
  transform: translate3d(0, 18px, 0);
}
.motion-ready .motion-reveal.is-visible {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}
.motion-ready .motion-reveal:nth-of-type(2) { transition-delay: 70ms; }
.motion-ready .motion-reveal:nth-of-type(3) { transition-delay: 120ms; }
.motion-ready .motion-reveal:nth-of-type(4) { transition-delay: 160ms; }

.image img,
.service-visual img {
  transition: transform 1400ms var(--motion-ease), filter 1400ms var(--motion-ease);
  will-change: transform;
}
.motion-ready .frame.motion-reveal:not(.is-visible) .image img {
  transform: scale(1.012);
}
.frame:hover .image img,
.service-visual:hover img {
  transform: scale(1.01);
}

.nav a,
.arrow,
.lang-switch a,
.footer a,
.journal-back,
.journal-item a {
  transition:
    opacity 260ms ease,
    transform 520ms var(--motion-ease),
    background-size 520ms var(--motion-ease),
    border-color 520ms var(--motion-ease);
}
.nav a,
.lang-switch a,
.footer a,
.journal-back {
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;
  background-size: 0 1px;
}
.nav a:hover,
.lang-switch a:hover,
.footer a:hover,
.journal-back:hover {
  background-size: 100% 1px;
  opacity: .82;
}
.arrow:hover {
  opacity: .78;
  transform: translate3d(3px, 0, 0);
}
.journal-item a:hover {
  opacity: .86;
  transform: translate3d(5px, 0, 0);
}
.index-row,
.journal-item {
  transition: border-color 520ms var(--motion-ease), opacity 320ms ease;
}
.index-row:hover,
.journal-item:hover {
  border-color: rgba(17,17,15,.22);
}

@media (hover: none) {
  .frame:hover .image img,
  .service-visual:hover img,
  .arrow:hover,
  .journal-item a:hover {
    transform: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .motion-reveal {
    opacity: 1 !important;
    transform: none !important;
  }
}

/* v65 mobile balance: Hero, titles, and image sequence */
@media (max-width: 860px) {
  html,
  body {
    overflow-x: hidden;
  }

  .hero {
    min-height: auto !important;
    align-items: end !important;
    padding-top: clamp(92px, 20svh, 128px) !important;
    padding-bottom: 18px !important;
  }

  .hero h1 {
    max-width: 4.4em;
    font-size: clamp(54px, 16.4vw, 74px) !important;
    line-height: .94 !important;
    letter-spacing: -.058em !important;
  }

  .hero-copy {
    grid-template-columns: 1fr !important;
    margin-top: 24px !important;
    padding-top: 16px !important;
    gap: 8px !important;
  }

  .hero-copy .jp {
    max-width: 15em;
    font-size: clamp(16px, 4.25vw, 20px) !important;
    line-height: 1.58 !important;
    letter-spacing: -.025em !important;
    text-wrap: balance;
  }

  .hero-copy .en {
    max-width: 20em;
    font-size: 10.5px !important;
    line-height: 1.68 !important;
  }

  .hero-meta {
    margin-top: 18px !important;
    font-size: 11px !important;
    line-height: 1.65 !important;
  }

  html[lang="en"] .hero .hero-meta > div:first-child {
    display: none;
  }

  .sequence {
    margin-top: 46px !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .sequence .f1 { order: 1 !important; }
  .sequence .f2 { order: 2 !important; }
  .sequence .f3 { order: 3 !important; }
  .sequence .word-break { order: 4 !important; }
  .sequence .f4 { order: 5 !important; }
  .sequence .f5 { order: 6 !important; }
  .sequence .f6 { order: 7 !important; }

  .sequence .f1 .image { aspect-ratio: 16 / 9.5 !important; }
  .sequence .f2 .image { aspect-ratio: 4 / 5.5 !important; }
  .sequence .f3 .image { aspect-ratio: 5 / 4 !important; }
  .sequence .f4 .image { aspect-ratio: 3 / 4.4 !important; }
  .sequence .f5 .image { aspect-ratio: 16 / 8.5 !important; }
  .sequence .f6 .image { aspect-ratio: 4 / 5 !important; }
}
@media (max-width: 760px) {
  .page-title {
    padding-top: 84px !important;
    padding-bottom: 42px !important;
  }

  .page-title h1 {
    font-size: clamp(30px, 8.4vw, 42px) !important;
    line-height: 1.12 !important;
    letter-spacing: -.04em !important;
    text-wrap: balance;
    overflow-wrap: anywhere;
  }

  .direction-page .page-title h1 {
    font-size: clamp(38px, 11.5vw, 52px) !important;
  }

  .journal-page .page-title h1 {
    font-size: clamp(40px, 12.5vw, 56px) !important;
  }

  .article-page .page-title h1 {
    max-width: 12em;
    font-size: clamp(28px, 7.6vw, 38px) !important;
    line-height: 1.16 !important;
  }

  .page-lead {
    max-width: 31em !important;
    font-size: 11px !important;
    line-height: 1.85 !important;
  }

  .content-grid {
    padding-top: 46px !important;
  }
}

@media (max-width: 374px) {
  .hero {
    padding-top: 82px !important;
  }

  .hero h1 {
    font-size: clamp(50px, 15vw, 58px) !important;
  }

  .hero-copy .jp {
    font-size: 15.5px !important;
  }

  .page-title h1 {
    font-size: clamp(27px, 8vw, 34px) !important;
  }

  .direction-page .page-title h1,
  .journal-page .page-title h1 {
    font-size: clamp(34px, 11vw, 46px) !important;
  }
}

/* Projects / selected work */
.projects-page main {
  width: min(100%, 1440px);
  margin: 0 auto;
  padding: 130px 32px 36px;
}

.projects-hero {
  min-height: 58vh;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 520px);
  gap: 80px;
  align-items: end;
  padding: 80px 0 100px;
}

.projects-hero h1 {
  margin: 0;
  font-family: var(--sf-font-en-display);
  font-size: clamp(68px, 11vw, 154px);
  font-weight: 400;
  line-height: .86;
  letter-spacing: -.07em;
}

.projects-hero p {
  margin: 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 2;
}

.projects-grid {
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(90px, 15vw, 220px) 24px;
  padding: 80px 0 clamp(150px, 21vw, 300px);
}

.projects-grid figure {
  grid-column: span 8;
  margin: 0;
}

.projects-grid figure:nth-child(even) {
  grid-column: 6 / span 7;
}

.projects-grid img {
  display: block;
  width: 100%;
  height: auto;
  background: transparent;
}

.projects-grid figcaption {
  display: flex;
  justify-content: space-between;
  gap: 24px;
  padding-top: 10px;
  color: var(--muted);
  font-size: 10px;
  line-height: 1.6;
}

.projects-grid figcaption span:last-child {
  text-align: right;
}

@media (max-width: 860px) {
  .projects-page main {
    padding: 96px 20px 28px;
  }

  .projects-hero {
    min-height: 56svh;
    grid-template-columns: 1fr;
    gap: 34px;
    align-content: end;
    padding: 50px 0 70px;
  }

  .projects-hero h1 {
    font-size: clamp(58px, 18vw, 82px);
  }

  .projects-hero p {
    font-size: 11px;
    line-height: 1.9;
  }

  .projects-grid {
    display: block;
    padding: 40px 0 150px;
  }

  .projects-grid figure,
  .projects-grid figure:nth-child(even) {
    width: 100%;
    margin: 0 0 112px;
  }

  .projects-grid figcaption {
    gap: 12px;
    font-size: 9px;
  }
}

/* v20260710 mobile image cleanup: all top photographs use normal img loading. */
@media (max-width: 860px) {
  html body main .sequence {
    display: flex !important;
    flex-direction: column !important;
  }

  html body main .sequence > .f1 { order: 1 !important; }
  html body main .sequence > .f2 { order: 2 !important; }
  html body main .sequence > .f3 { order: 3 !important; }
  html body main .sequence > .word-break { order: 4 !important; }
  html body main .sequence > .f4 { order: 5 !important; }
  html body main .sequence > .f5 { order: 6 !important; }
  html body main .sequence > .f6 { order: 7 !important; }

  html body main .sequence > figure.frame {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    background: transparent !important;
  }

  html body main .sequence > figure.frame > .image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    aspect-ratio: auto !important;
    overflow: visible !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    line-height: 0 !important;
    font-size: 0 !important;
  }

  html body main .sequence > figure.frame > .image::before,
  html body main .sequence > figure.frame > .image::after {
    content: none !important;
    display: none !important;
  }

  html body main .sequence > figure.frame > .image > img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center center !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    vertical-align: top !important;
    transform: none !important;
    opacity: 1 !important;
  }

  html body main .sequence > figure.frame > .caption {
    margin-top: 7px !important;
    padding: 0 !important;
    line-height: 1.55 !important;
    background: transparent !important;
  }
}

/* =========================================================
   STUDIOFENCE FONT SYSTEM v1
   Purpose: consolidate actual rendered typefaces into 3 stacks.
   Upload target: /public_html/assets/style.css
   ========================================================= */
:root {
  --sf-font-jp-serif: "Hiragino Mincho ProN", "Yu Mincho", YuMincho, "Hiragino Mincho Pro", "MS PMincho", serif;
  --sf-font-en-display: Georgia, "Times New Roman", Times, serif;
  --sf-font-ui: "Helvetica Neue", Arial, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic", YuGothic, Meiryo, sans-serif;
}

html body,
html body button,
html body input,
html body textarea,
html body select,
html body .header,
html body .logo,
html body .nav,
html body .caption,
html body .kicker,
html body .label,
html body .small-note,
html body .hero-meta,
html body .article-meta,
html body .profile-row,
html body .profile-title,
html body .journal-item span,
html body .article-body,
html body .article-body p,
html body .article-body li,
html body .faq-item p,
html body .contact-panel p,
html body .cta-strip p {
  font-family: var(--sf-font-ui) !important;
}

html[lang="ja"] body .hero h1,
html[lang="ja"] body .page-title h1,
html[lang="ja"] body .word-break p,
html[lang="ja"] body .hero-copy .jp,
html[lang="ja"] body .quiet-bridge p,
html[lang="ja"] body .contact-panel h2,
html[lang="ja"] body .cta-strip h2,
html[lang="ja"] body .profile-heading h2,
html[lang="ja"] body .content-body h2,
html[lang="ja"] body .article-body h2,
html[lang="ja"] body .journal-item strong,
html[lang="ja"] body .service-item strong,
html[lang="ja"] body .service-components strong,
html[lang="ja"] body .direction-page .process-list strong,
html[lang="ja"] body .direction-page .faq-item strong,
html[lang="ja"] body .direction-page .before-list .faq-item strong,
html[lang="ja"] body .partnership-list strong,
html[lang="ja"] body .faq-item strong {
  font-family: var(--sf-font-jp-serif) !important;
  font-weight: 400;
}

html[lang="en"] body .hero h1,
html[lang="en"] body .page-title h1,
html[lang="en"] body .word-break p,
html[lang="en"] body .hero-copy .jp,
html[lang="en"] body .quiet-bridge p,
html[lang="en"] body .contact-panel h2,
html[lang="en"] body .cta-strip h2,
html[lang="en"] body .profile-heading h2,
html[lang="en"] body .content-body h2,
html[lang="en"] body .article-body h2,
html[lang="en"] body .journal-item strong,
html[lang="en"] body .service-item strong,
html[lang="en"] body .service-components strong,
html[lang="en"] body .direction-page .process-list strong,
html[lang="en"] body .direction-page .faq-item strong,
html[lang="en"] body .direction-page .before-list .faq-item strong,
html[lang="en"] body .partnership-list strong,
html[lang="en"] body .faq-item strong,
html body .index-row .name,
html body .info-link h2 {
  font-family: var(--sf-font-en-display) !important;
  font-weight: 400;
}

/* ONLY BE SEEN philosophy page */
.only-page main {
  padding-top: 84px;
}

.only-hero {
  min-height: calc(100svh - 84px);
  display: flex;
  align-items: flex-end;
  padding: 10vh 0 42px;
}

.only-hero-inner {
  width: 100%;
}

.only-hero h1 {
  max-width: 8em;
  margin: 0;
  font-family: var(--sf-font-en-display);
  font-size: clamp(54px, 10.8vw, 154px);
  font-weight: 400;
  line-height: .88;
  letter-spacing: -.065em;
}

.only-subtitle {
  margin: 34px 0 0;
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(17px, 2.1vw, 30px);
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -.025em;
}

html[lang="en"] .only-subtitle {
  max-width: 25em;
  font-family: var(--sf-font-en-display);
  font-size: clamp(19px, 2.4vw, 34px);
  line-height: 1.45;
}

.only-intro {
  display: grid;
  grid-template-columns: minmax(120px, .7fr) minmax(0, 2fr);
  gap: clamp(38px, 8vw, 140px);
  margin: clamp(120px, 18vw, 260px) 0;
  padding-top: 24px;
  border-top: 1px solid var(--line);
}

.only-kicker,
.only-section-label {
  color: var(--faint);
  font-size: 9px;
  line-height: 1.7;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.only-intro-copy {
  max-width: 820px;
}

.only-intro-copy p,
.only-section-copy p,
.only-closing p {
  margin: 0 0 1.45em;
  font-size: clamp(13px, 1.15vw, 16px);
  line-height: 2.05;
}

.only-lead {
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(22px, 3.2vw, 46px) !important;
  line-height: 1.65 !important;
  letter-spacing: -.035em;
}

html[lang="en"] .only-lead {
  font-family: var(--sf-font-en-display);
  line-height: 1.45 !important;
}

.only-visual {
  margin: clamp(120px, 17vw, 240px) 0;
}

.only-visual img {
  display: block;
  width: 100%;
  height: auto;
}

.only-visual-portrait {
  width: min(58vw, 760px);
  margin-left: auto;
}

.only-visual-landscape {
  width: min(86vw, 1320px);
}

.only-visual figcaption {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 9px;
  color: var(--muted);
  font-size: 9px;
  letter-spacing: .04em;
}

.only-statement {
  min-height: 62vh;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: clamp(120px, 18vw, 250px) 0;
  text-align: center;
}

.only-statement p {
  max-width: 28em;
  margin: 0;
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(24px, 4.3vw, 64px);
  line-height: 1.62;
  letter-spacing: -.04em;
}

html[lang="en"] .only-statement p {
  max-width: 22em;
  font-family: var(--sf-font-en-display);
  line-height: 1.4;
}

.only-section {
  display: grid;
  grid-template-columns: minmax(120px, .7fr) minmax(0, 2fr);
  gap: clamp(38px, 8vw, 140px);
  padding: clamp(86px, 10vw, 140px) 0;
  border-top: 1px solid var(--line);
}

.only-section-copy {
  max-width: 820px;
}

.only-section-copy h2 {
  max-width: 17em;
  margin: 0 0 1.25em;
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(26px, 3.8vw, 54px);
  font-weight: 400;
  line-height: 1.48;
  letter-spacing: -.045em;
}

html[lang="en"] .only-section-copy h2 {
  max-width: 14em;
  font-family: var(--sf-font-en-display);
  line-height: 1.28;
}

.only-core {
  margin: 2.2em 0 !important;
  padding: 1.7em 0;
  border-top: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(19px, 2.35vw, 34px) !important;
  line-height: 1.75 !important;
  letter-spacing: -.025em;
}

html[lang="en"] .only-core {
  font-family: var(--sf-font-en-display);
  line-height: 1.55 !important;
}

.only-terms {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 48px 0;
}

.only-terms div,
.only-triad div {
  padding-top: 18px;
  border-top: 1px solid var(--line);
}

.only-terms strong,
.only-triad strong {
  display: block;
  margin-bottom: 10px;
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(17px, 1.8vw, 25px);
  font-weight: 400;
  line-height: 1.5;
}

html[lang="en"] .only-terms strong,
html[lang="en"] .only-triad strong {
  font-family: var(--sf-font-en-display);
}

.only-terms span,
.only-triad span {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.8;
}

.only-process {
  max-width: 680px;
  margin: 56px 0 0;
  padding: 0;
  list-style: none;
}

.only-process li {
  position: relative;
  padding: 20px 0 34px;
  border-top: 1px solid var(--line);
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(17px, 2vw, 28px);
  line-height: 1.55;
}

html[lang="en"] .only-process li {
  font-family: var(--sf-font-en-display);
}

.only-process li:not(:last-child)::after {
  content: "↓";
  position: absolute;
  left: 0;
  bottom: 7px;
  color: var(--faint);
  font-family: var(--sf-font-ui);
  font-size: 11px;
}

.only-triad {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
  margin: 52px 0;
}

.only-closing {
  min-height: 78vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: clamp(130px, 20vw, 280px);
  padding: 100px 0;
  border-top: 1px solid var(--line);
}

.only-closing h2 {
  max-width: 15em;
  margin: 0 0 1.4em;
  font-family: var(--sf-font-jp-serif);
  font-size: clamp(34px, 6vw, 86px);
  font-weight: 400;
  line-height: 1.35;
  letter-spacing: -.055em;
}

html[lang="en"] .only-closing h2 {
  max-width: 12em;
  font-family: var(--sf-font-en-display);
  line-height: 1.16;
}

.only-closing-copy {
  max-width: 720px;
  margin-left: auto;
}

.only-signature {
  margin-top: 2.6em !important;
  font-family: var(--sf-font-en-display);
  font-size: clamp(24px, 3.2vw, 46px) !important;
  letter-spacing: -.035em;
}

.only-actions {
  display: flex;
  gap: 30px;
  margin-top: 50px;
  font-size: 11px;
  letter-spacing: .08em;
}

.only-actions a {
  padding-bottom: 4px;
  border-bottom: 1px solid currentColor;
}

@media (max-width: 860px) {
  .header {
    padding-right: 14px;
    padding-left: 14px;
  }

  .logo {
    font-size: 10px;
  }

  .nav {
    gap: 9px;
    font-size: 9px;
  }

  .only-page main {
    padding: 84px 20px 28px;
  }

  .only-hero {
    min-height: calc(86svh - 84px);
    padding-bottom: 24px;
  }

  .only-hero h1 {
    font-size: clamp(56px, 18.5vw, 86px);
    line-height: .9;
  }

  .only-subtitle {
    margin-top: 26px;
    font-size: 17px;
  }

  .only-intro,
  .only-section {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .only-intro {
    margin: 110px 0 130px;
  }

  .only-intro-copy p,
  .only-section-copy p,
  .only-closing p {
    font-size: 12px;
    line-height: 1.95;
  }

  .only-lead {
    font-size: clamp(22px, 6.8vw, 30px) !important;
  }

  .only-visual {
    margin: 120px 0;
  }

  .only-visual-portrait,
  .only-visual-landscape {
    width: 100%;
  }

  .only-statement {
    min-height: 52vh;
    margin: 120px 0;
    text-align: left;
  }

  .only-statement p {
    font-size: clamp(24px, 7.8vw, 36px);
  }

  .only-section {
    padding: 74px 0 92px;
  }

  .only-section-copy h2 {
    font-size: clamp(26px, 8vw, 38px);
  }

  .only-core {
    font-size: 20px !important;
  }

  .only-terms,
  .only-triad {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .only-process li {
    font-size: 18px;
  }

  .only-closing {
    min-height: auto;
    margin-top: 130px;
    padding: 90px 0 70px;
  }

  .only-closing h2 {
    font-size: clamp(36px, 11vw, 54px);
  }

  .only-closing-copy {
    margin-left: 0;
  }
}

@media (max-width: 374px) {
  .header {
    padding-right: 12px;
    padding-left: 12px;
  }

  .nav {
    gap: 7px;
    font-size: 8px;
  }

  .only-hero h1 {
    font-size: 52px;
  }
}