.yohaku-gallery img { display: block; width: 100%; height: 100%; object-fit: cover; }

.yohaku-hero h1,
.yohaku-about .yohaku-lead,
.yohaku-gallery h3,
.yohaku-services .yohaku-head h2,
.yohaku-services .yohaku-li h3,
.yohaku-voices blockquote,
.yohaku-contact h2 {
  font-family: var(--display);
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: .06em;
}

.yohaku-wrap {
  max-width: 1080px;
  margin-inline: auto;
  padding-inline: clamp(24px, 7vw, 120px);
}
.yohaku-kicker { font-size: .68rem; letter-spacing: .5em; color: var(--silver); }
.yohaku-tate { writing-mode: vertical-rl; text-orientation: mixed; font-family: var(--display); }
.yohaku-accent { color: var(--navy); }

.yohaku-top {
  display: flex; align-items: center; justify-content: space-between;
  padding: clamp(26px, 4vw, 44px) clamp(24px, 7vw, 120px);
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-top .yohaku-brand { font-family: var(--display); font-size: 1.1rem; letter-spacing: .5em; }
.yohaku-top nav { display: flex; gap: clamp(20px, 3vw, 40px); font-size: .74rem; letter-spacing: .2em; color: var(--silver); }
.yohaku-top nav a { color: inherit; text-decoration: none; }
.yohaku-top nav a:hover { color: var(--ink); }
@media (max-width: 680px) { .yohaku-top nav { display: none; } }

.yohaku-hero {
  min-height: 84svh; display: grid; grid-template-columns: auto 1fr;
  gap: clamp(30px, 6vw, 90px); align-items: center;
  padding-block: clamp(40px, 8vh, 120px);
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-hero .yohaku-tate { font-size: clamp(2.2rem, 5vw, 3.4rem); letter-spacing: .4em; justify-self: center; color: var(--ink); }
.yohaku-hero .yohaku-main h1 { font-size: clamp(2.4rem, 6.5vw, 4.6rem); font-weight: 400; }
.yohaku-hero .yohaku-main .yohaku-sub {
  margin-top: 2rem; max-width: 30ch; color: var(--silver);
  font-weight: 300; font-size: clamp(.95rem, 1.5vw, 1.05rem); line-height: 2.1;
}
.yohaku-hero .yohaku-main .yohaku-mark { display: inline-block; width: 48px; height: 1px; background: var(--navy); margin-top: 2.4rem; }
@media (max-width: 680px) {
  .yohaku-hero { grid-template-columns: 1fr; }
  .yohaku-hero .yohaku-tate { writing-mode: horizontal-tb; justify-self: start; letter-spacing: .2em; }
}

.yohaku-about {
  padding-block: clamp(80px, 16vh, 200px);
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-about .yohaku-lead {
  font-size: clamp(1.4rem, 3.4vw, 2.4rem); line-height: 1.9;
  max-width: 24ch; margin-inline: auto; text-align: center;
}
.yohaku-about .yohaku-lead .yohaku-accent,
.yohaku-about .yohaku-lead em { font-style: normal; color: var(--navy); }
.yohaku-about .yohaku-sign { display: block; text-align: center; margin-top: 3rem; font-size: .72rem; letter-spacing: .3em; color: var(--silver); }

.yohaku-gallery {
  padding-block: clamp(60px, 12vh, 160px);
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-gallery .yohaku-pair {
  display: grid; grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 8vw, 140px); align-items: center;
  margin-bottom: clamp(60px, 12vh, 160px);
}
.yohaku-gallery .yohaku-pair:last-child { margin-bottom: 0; }
.yohaku-gallery .yohaku-pair.yohaku-flip .yohaku-txt { order: 2; }
.yohaku-gallery .yohaku-pair .yohaku-imgwrap { aspect-ratio: 4/5; }
.yohaku-gallery .yohaku-pair h3 { font-size: clamp(1.3rem, 2.8vw, 1.9rem); margin-bottom: 1.2rem; }
.yohaku-gallery .yohaku-pair p { color: var(--silver); font-weight: 300; max-width: 34ch; line-height: 2.1; }
.yohaku-gallery .yohaku-pair .yohaku-num { font-family: var(--display); font-size: .8rem; letter-spacing: .3em; color: var(--navy); margin-bottom: 1rem; }
@media (max-width: 760px) {
  .yohaku-gallery .yohaku-pair,
  .yohaku-gallery .yohaku-pair.yohaku-flip { grid-template-columns: 1fr; gap: 24px; }
  .yohaku-gallery .yohaku-pair.yohaku-flip .yohaku-txt { order: 0; }
  .yohaku-gallery .yohaku-pair .yohaku-imgwrap { aspect-ratio: 16/11; }
}

.yohaku-services {
  padding-block: clamp(60px, 12vh, 160px);
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-services .yohaku-head { text-align: center; margin-bottom: clamp(40px, 7vw, 80px); }
.yohaku-services .yohaku-head h2 { font-size: clamp(1.6rem, 4vw, 2.6rem); margin-top: .8rem; }
.yohaku-services .yohaku-list { max-width: 760px; margin-inline: auto; }
.yohaku-services .yohaku-li {
  display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: baseline;
  padding-block: clamp(22px, 3vw, 34px); border-top: 1px solid var(--silver-2);
}
.yohaku-services .yohaku-li:last-child { border-bottom: 1px solid var(--silver-2); }
.yohaku-services .yohaku-li h3 { font-size: clamp(1.1rem, 2.4vw, 1.5rem); font-weight: 500; }
.yohaku-services .yohaku-li p { color: var(--silver); font-weight: 300; font-size: .9rem; margin-top: .4rem; max-width: 40ch; line-height: 2.1; }
.yohaku-services .yohaku-li .yohaku-price { font-family: var(--display); color: var(--ink); white-space: nowrap; }
@media (max-width: 560px) {
  .yohaku-services .yohaku-li { grid-template-columns: 1fr; }
}

.yohaku-voices {
  padding-block: clamp(80px, 16vh, 200px); text-align: center;
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-voices blockquote { font-size: clamp(1.5rem, 4vw, 2.8rem); line-height: 1.85; max-width: 20ch; margin-inline: auto; font-weight: 400; }
.yohaku-voices cite { display: block; margin-top: 2.4rem; font-style: normal; font-size: .72rem; letter-spacing: .3em; color: var(--silver); }

.yohaku-contact {
  padding-block: clamp(80px, 16vh, 200px); text-align: center;
  background: var(--paper); color: var(--ink);
  font-family: var(--sans);
}
.yohaku-contact h2 { font-size: clamp(2.2rem, 7vw, 4.6rem); font-weight: 400; margin-bottom: 2.4rem; }
.yohaku-contact .yohaku-link {
  display: inline-block; font-size: .82rem; letter-spacing: .34em;
  border-bottom: 1px solid var(--navy); padding-bottom: 8px; color: var(--ink);
  text-decoration: none; transition: .3s;
}
.yohaku-contact .yohaku-link:hover { color: var(--navy); }

.yohaku-hero h1,
.yohaku-about .yohaku-lead,
.yohaku-voices blockquote,
.yohaku-contact h2 {
  line-break: strict;
  word-break: keep-all;
  overflow-wrap: anywhere;
  text-wrap: balance;
  font-feature-settings: "palt";
  hanging-punctuation: allow-end;
}