@charset "UTF-8";
/* ============================================================
   Shinwa Renewal v2 — 10per-komatsu layout × 高級配色 × 明朝
   loads AFTER style.css / namespace .r- / do NOT edit style.css
   canon: _design-preview/shinwa-komatsu-style.html
   ============================================================ */
:root {
  --r-ink: #14161d; /* 墨黒 text */
  --r-sub: #9a9183; /* muted warm gray */
  --r-gold: #b08d4c; /* 真鍮ゴールド */
  --r-gold-l: #c8a96a;
  --r-charcoal: #1f1c1a; /* ウォームチャコール */
  --r-line: #e7e3db; /* warm hairline */
  --r-paper: #f7f5f0; /* 月白 */
  --r-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", serif;
  --en-font: Georgia, "Times New Roman", serif;
  --r-sans: var(--en-font);
}

/* ===== shared atoms (scoped to renewed wrappers) ===== */
.r-home,
.r-cpt,
.r-co {
  font-family: var(--r-serif);
  color: var(--r-ink);
  line-height: 1.8;
  font-feature-settings: "palt" 1;
  -webkit-font-smoothing: antialiased;
}
.r-home a,
.r-cpt a,
.r-co a {
  color: inherit;
  text-decoration: none;
}
.r-en {
  font-family: var(--r-sans);
}
.r-wrap {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(24px, 4vw, 48px);
}
.r-sec-label {
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.45em;
  color: var(--r-gold);
  text-transform: uppercase;
}
.r-sec-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 52px;
}
.r-sec-title {
  font-family: var(--r-sans);
  font-size: 13px;
  letter-spacing: 0.45em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--r-ink);
}
.r-more {
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.25em;
  color: var(--r-sub);
  text-transform: uppercase;
}
.r-more:hover {
  color: var(--r-gold);
}

/* Unify legacy English typography with the renewal pages. */
.josefin,
.p-footer-contact__en,
.p-footer-nav__item,
.p-footer__copy,
.p-header-nav__item,
.p-navbar__item,
.p-navbar-secondary__item,
.c-banner-type1__heading,
.c-button-type1,
.c-button-type2,
.c-card-type2__category,
.c-heading-lv1__heading,
.c-page-heading__title,
.c-return-top a,
.p-home-kv__en,
.p-home-kv__scroll,
.p-home-info__heading,
.p-home-heading,
.p-works-gallery__heading,
.p-service-about__heading,
.c-category-list--en,
.p-service-info__title {
  font-family: var(--en-font) !important;
}

/* ===== HEADER restyle (markup unchanged): minimal bar ===== */
body .p-header {
  background: #fff;
  box-shadow: 0 1px 0 var(--r-line);
  transition: background-color 0.4s, box-shadow 0.4s;
}
body .p-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
body .p-header__logo a {
  font-family: var(--r-serif);
  letter-spacing: 0.2em;
  color: var(--r-ink);
}
.r-logo-en {
  display: block;
  font-family: var(--r-sans);
  font-size: 17px;
  letter-spacing: 0.3em;
}
.r-logo-ja {
  display: block;
  font-family: var(--r-sans);
  font-size: 9px;
  letter-spacing: 0.3em;
  color: var(--r-gold);
  margin-top: 3px;
}
body .p-header-nav__child {
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  color: var(--r-ink);
}
body .p-header-nav__child:hover {
  color: var(--r-gold);
}

/* hero pages: transparent over hero, white text */
.r-hero-page .p-header {
  background: transparent;
  box-shadow: none;
  position: absolute;
}
.r-hero-page .p-header__logo a,
.r-hero-page .p-header-nav__child {
  color: #fff;
}
.r-hero-page .r-logo-ja {
  color: var(--r-gold-l);
}
.r-hero-page .p-header.r-is-solid {
  position: fixed;
  background: #fff;
  box-shadow: 0 1px 0 var(--r-line);
}
.r-hero-page .p-header.r-is-solid .p-header__logo a,
.r-hero-page .p-header.r-is-solid .p-header-nav__child {
  color: var(--r-ink);
}
.r-hero-page .p-header.r-is-solid .p-header-nav__child:hover {
  color: var(--r-gold);
}
.r-hero-page .p-header.r-is-solid .r-logo-ja {
  color: var(--r-gold);
}

/* ===== FOOTER restyle (markup unchanged): charcoal minimal ===== */
body .p-footer {
  background: var(--r-charcoal);
  color: #efe9e0;
  border-top: 1px solid rgba(176, 141, 76, 0.28);
}
body .p-footer-contact__wrap {
  background: transparent;
}
body .p-footer-contact__en {
  font-family: var(--r-sans);
  letter-spacing: 0.4em;
  color: var(--r-gold-l);
}
body .p-footer-contact__ja {
  font-family: var(--r-serif);
  letter-spacing: 0.12em;
  color: #efe9e0;
}
body .p-footer-nav a,
body .p-footer-secondary a {
  font-family: var(--r-sans);
  letter-spacing: 0.2em;
  color: #cdc7bc;
}
body .p-footer-nav a:hover,
body .p-footer-secondary a:hover {
  color: var(--r-gold-l);
}
body .p-footer__logo a {
  font-family: var(--r-serif);
  letter-spacing: 0.2em;
  color: #efe9e0;
}
body .p-footer__copy {
  font-family: var(--r-sans);
  letter-spacing: 0.15em;
  color: #7a746b;
}
body .p-footer__return-top a {
  color: var(--r-gold-l);
}

/* ============================================================
   HERO (full-bleed photo, minimal) — used by home/concept/company
   ============================================================ */
.r-hero {
  height: 100vh;
  min-height: 620px;
  background-size: cover;
  background-position: center;
  position: relative;
  background-image: linear-gradient(
    rgba(20, 18, 16, 0.2),
    rgba(20, 18, 16, 0.42)
  );
}
.r-hero__tag {
  position: absolute;
  left: clamp(24px, 4vw, 48px);
  bottom: 42px;
  color: #fff;
  font-size: clamp(15px, 1.6vw, 19px);
  letter-spacing: 0.22em;
}
.r-hero__scroll {
  position: absolute;
  right: clamp(24px, 4vw, 48px);
  bottom: 42px;
  color: #fff;
  font-family: var(--r-sans);
  font-size: 9px;
  letter-spacing: 0.35em;
  writing-mode: vertical-rl;
  opacity: 0.85;
}

/* ============================================================
   HOME sections
   ============================================================ */
.r-home section {
  padding: clamp(80px, 11vw, 130px) 0;
}

/* WORKS grid */
.r-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 28px;
}
.r-card .r-ph {
  aspect-ratio: 4/3;
  overflow: hidden;
  background: var(--r-paper);
}
.r-card .r-ph i {
  display: block;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
  transition: transform 1.2s cubic-bezier(0.16, 0.7, 0.3, 1);
}
.r-card:hover .r-ph i {
  transform: scale(1.05);
}
.r-card h3 {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.1em;
  margin: 20px 0 4px;
}
.r-card .r-loc {
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.12em;
  color: var(--r-sub);
}
.r-det {
  display: inline-block;
  margin-top: 14px;
  font-family: var(--r-sans);
  font-size: 10px;
  letter-spacing: 0.25em;
  color: var(--r-gold);
  text-transform: uppercase;
  border-bottom: 1px solid var(--r-gold);
  padding-bottom: 3px;
}

/* Concept band (charcoal) */
.r-concept {
  background: var(--r-charcoal);
  text-align: center;
}
.r-concept .r-sec-label {
  color: var(--r-gold-l);
}
.r-concept .r-lead {
  font-size: clamp(22px, 2.6vw, 34px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 2.3;
  color: #f1ece2;
  margin: 26px auto 0;
}
.r-concept .r-rule {
  width: 56px;
  height: 1px;
  background: var(--r-gold);
  margin: 38px auto;
}
.r-concept .r-body {
  font-size: 14px;
  letter-spacing: 0.08em;
  color: #cdc7bc;
  line-height: 2.4;
  max-width: 680px;
  margin: 0 auto;
}

/* Feature works (service rows) */
.r-feat {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.r-frow {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  align-items: stretch;
}
.r-frow:nth-child(even) {
  direction: rtl;
}
.r-frow:nth-child(even) > * {
  direction: ltr;
}
.r-frow .r-ph {
  aspect-ratio: 16/10;
  background-size: cover;
  background-position: center;
}
.r-frow .r-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 0 clamp(28px, 5vw, 72px);
}
.r-tags {
  font-family: var(--r-sans);
  font-size: 10px;
  letter-spacing: 0.22em;
  color: var(--r-gold);
  text-transform: uppercase;
}
.r-frow h3 {
  font-size: clamp(24px, 2.8vw, 32px);
  font-weight: 500;
  letter-spacing: 0.12em;
  margin: 16px 0 16px;
}
.r-frow p {
  font-size: 14.5px;
  letter-spacing: 0.06em;
  color: #4a4744;
  line-height: 2.2;
}
.r-frow .r-det {
  align-self: flex-start;
}

/* Journal / News grid */
.r-jgrid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 28px;
}
.r-jcard .r-ph {
  aspect-ratio: 3/2;
  background-size: cover;
  background-position: center;
  background-color: var(--r-paper);
}
.r-jcard .r-meta {
  display: flex;
  gap: 14px;
  align-items: center;
  margin: 18px 0 8px;
}
.r-jcard .r-date {
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--r-gold);
}
.r-jcard .r-cat {
  font-family: var(--r-sans);
  font-size: 9px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  border: 1px solid var(--r-line);
  padding: 3px 8px;
  color: var(--r-sub);
}
.r-jcard h4 {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.8;
}

/* ============================================================
   CONCEPT page
   ============================================================ */
.r-phero {
  height: 78vh;
  min-height: 480px;
  background-size: cover;
  background-position: center;
  position: relative;
}
.r-phero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(rgba(20, 18, 16, 0.25), rgba(20, 18, 16, 0.5));
}
.r-phero__inner {
  position: absolute;
  left: clamp(24px, 5vw, 72px);
  bottom: 48px;
  z-index: 2;
  color: #fff;
}
.r-phero .r-sec-label {
  color: var(--r-gold-l);
}
.r-phero h1 {
  font-size: clamp(30px, 4.4vw, 52px);
  font-weight: 500;
  letter-spacing: 0.16em;
  margin-top: 14px;
}
.r-cpt section,
.r-co section {
  padding: clamp(80px, 11vw, 130px) 0;
}

/* ============================================================
   COMPANY page
   ============================================================ */
.r-msg {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}
.r-msg__photo {
  min-height: 520px;
  background-size: cover;
  background-position: center;
}
.r-msg__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(48px, 7vw, 96px);
}
.r-msg__body h2 {
  font-size: clamp(22px, 2.6vw, 32px);
  font-weight: 500;
  letter-spacing: 0.12em;
  line-height: 1.9;
  margin: 16px 0 0;
}
.r-msg__body .r-body {
  font-size: 14.5px;
  line-height: 2.3;
  letter-spacing: 0.06em;
  color: #4a4744;
  margin: 28px 0;
}
.r-msg__body .r-sign {
  font-size: 14px;
  letter-spacing: 0.1em;
}
.r-msg__body .r-sign small {
  display: block;
  font-family: var(--r-sans);
  font-size: 11px;
  letter-spacing: 0.1em;
  color: var(--r-sub);
  margin-top: 6px;
}

.r-profile {
  background: var(--r-paper);
}
.r-profile__head {
  text-align: center;
  margin-bottom: 48px;
}
.r-profile__head h2 {
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 500;
  letter-spacing: 0.16em;
  margin-top: 12px;
}
.r-ptable {
  max-width: 760px;
  margin: 0 auto;
}
.r-ptable__r {
  display: flex;
  gap: 32px;
  padding: 20px 0;
  border-bottom: 1px solid var(--r-line);
}
.r-ptable__k {
  min-width: 150px;
  font-family: var(--r-sans);
  font-size: 12px;
  letter-spacing: 0.2em;
  color: var(--r-gold);
}
.r-ptable__v {
  font-size: 14.5px;
  letter-spacing: 0.04em;
  line-height: 1.9;
}

.r-access {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: stretch;
}
.r-access__map {
  min-height: 420px;
}
.r-access__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 420px;
  border: 0;
}
.r-access__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(48px, 7vw, 96px);
}
.r-access__body h2 {
  font-size: clamp(20px, 2.4vw, 28px);
  font-weight: 500;
  letter-spacing: 0.14em;
  margin: 14px 0 0;
}
.r-access__body .r-body {
  font-size: 14px;
  letter-spacing: 0.06em;
  line-height: 2.2;
  color: #4a4744;
  margin: 22px 0;
}

/* page closing CTA (shared) */
.r-cta {
  background: var(--r-charcoal);
  color: #fff;
  text-align: center;
}
.r-cta .r-sec-label {
  color: var(--r-gold-l);
}
.r-cta h2 {
  font-size: clamp(24px, 3vw, 38px);
  font-weight: 500;
  letter-spacing: 0.16em;
  margin: 18px 0 0;
}
.r-cta .r-body {
  font-size: 14px;
  line-height: 2.2;
  color: #cdc7bc;
  margin: 26px 0 36px;
}
.r-cta .r-det {
  color: var(--r-gold-l);
  border-color: var(--r-gold-l);
}

/* ============================================================
   responsive
   ============================================================ */
@media (max-width: 880px) {
  .r-grid {
    grid-template-columns: 1fr 1fr;
  }
  .r-jgrid {
    grid-template-columns: 1fr 1fr;
  }
  .r-frow,
  .r-frow:nth-child(even) {
    grid-template-columns: 1fr;
    direction: ltr;
  }
  .r-frow .r-body {
    padding: 36px 24px 56px;
  }
  .r-msg,
  .r-access {
    grid-template-columns: 1fr;
  }
  .r-msg__body,
  .r-access__body {
    padding: 48px 24px;
  }
  .r-ptable__r {
    flex-direction: column;
    gap: 6px;
  }
}

/* ===== Concept/Company white intro block ===== */
.r-intro {
  text-align: center;
}
.r-intro .r-lead {
  font-family: var(--r-serif);
  font-size: clamp(22px, 2.6vw, 34px);
  font-weight: 400;
  letter-spacing: 0.14em;
  line-height: 2.2;
  margin: 24px auto 0;
}
.r-intro .r-rule {
  width: 56px;
  height: 1px;
  background: var(--r-gold);
  margin: 36px auto;
}
.r-intro .r-body {
  font-size: 15px;
  line-height: 2.5;
  letter-spacing: 0.08em;
  color: #4a4744;
  max-width: 640px;
  margin: 0 auto;
}

/* ============================================================
   PHILOSOPHY page
   ============================================================ */
.r-philosophy {
  background: var(--r-paper);
}
.r-philosophy-hero {
  background-position: center 54%;
}
.r-philosophy-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
      90deg,
      rgba(20, 18, 16, 0.58),
      rgba(20, 18, 16, 0.18) 48%,
      rgba(20, 18, 16, 0.48)
    ),
    linear-gradient(180deg, rgba(20, 18, 16, 0.18), rgba(20, 18, 16, 0.56));
}
.r-philosophy-hero .r-phero__inner {
  z-index: 2;
}
.r-philosophy-intro {
  background: linear-gradient(180deg, #fffaf3 0, var(--r-paper) 100%);
}
.r-philosophy .r-philosophy-intro {
  padding: clamp(80px, 11vw, 130px) 0;
}
.r-philosophy-statement {
  display: grid;
  grid-template-columns: minmax(42vw, 1.12fr) minmax(360px, 0.88fr);
  align-items: stretch;
  min-height: 720px;
  padding: 0;
  background: #171715;
  color: #f7f1e8;
}
.r-philosophy .r-philosophy-statement {
  padding: 0;
}
.r-philosophy-statement__photo {
  min-height: 640px;
  background-size: cover;
  background-position: center;
  filter: saturate(0.72) brightness(0.78);
}
.r-philosophy-statement__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(56px, 7vw, 108px);
}
.r-philosophy-statement__body .r-sec-label {
  color: var(--r-gold-l);
}
.r-philosophy-statement__body h2 {
  font-size: clamp(25px, 2.7vw, 42px);
}
.r-philosophy-statement__body p {
  margin: 34px 0 0;
  color: #d7d0c6;
  font-size: 15px;
  line-height: 2.35;
  letter-spacing: 0.08em;
}
.r-philosophy-axis {
  padding: clamp(90px, 12vw, 150px) 0;
  background: var(--r-paper);
}
.r-philosophy .r-philosophy-axis {
  padding: clamp(90px, 12vw, 150px) 0;
}
.r-philosophy-axis__head {
  display: grid;
  grid-template-columns: 220px 1fr;
  gap: clamp(36px, 7vw, 96px);
  align-items: start;
  margin-bottom: clamp(56px, 8vw, 96px);
}
.r-philosophy-axis__head h2 {
  max-width: 720px;
}
.r-philosophy-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--r-line);
  border-left: 1px solid var(--r-line);
}
.r-axis-card {
  position: relative;
  min-height: 420px;
  padding: clamp(30px, 4vw, 54px);
  border-right: 1px solid var(--r-line);
  border-bottom: 1px solid var(--r-line);
  background: rgba(255, 250, 243, 0.42);
}
.r-axis-card::after {
  content: "";
  position: absolute;
  right: 24px;
  bottom: 24px;
  width: 72px;
  height: 1px;
  background: rgba(176, 141, 76, 0.45);
}
.r-axis-card__number {
  display: block;
  margin-bottom: 42px;
  font-family: var(--r-sans);
  font-size: 10px;
  letter-spacing: 0.26em;
  color: var(--r-gold);
}
.r-axis-card__en {
  margin: 0 0 10px;
  font-family: var(--en-font);
  font-size: clamp(30px, 3vw, 48px);
  line-height: 1;
  letter-spacing: 0.02em;
  color: #25231f;
}
.r-axis-card h3 {
  margin: 0 0 30px;
  font-size: clamp(18px, 1.55vw, 24px);
  font-weight: 500;
  letter-spacing: 0.12em;
}
.r-axis-card p:not(.r-axis-card__en) {
  margin: 0;
  color: #4a4744;
  font-size: 14px;
  line-height: 2.15;
  letter-spacing: 0.06em;
}
.r-axis-card small {
  display: block;
  margin-top: 30px;
  color: #8b7d68;
  font-size: 12px;
  line-height: 2;
  letter-spacing: 0.08em;
}
.r-philosophy-photo-band {
  position: relative;
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: clamp(24px, 5vw, 72px);
  align-items: end;
  padding: 0 7vw clamp(100px, 13vw, 170px);
  background: var(--r-paper);
}
.r-philosophy .r-philosophy-photo-band {
  padding: 0 7vw clamp(100px, 13vw, 170px);
}
.r-philosophy-photo-band__large,
.r-philosophy-photo-band__small {
  background-size: cover;
  background-position: center;
}
.r-philosophy-photo-band__large {
  min-height: 58vw;
  max-height: 780px;
}
.r-philosophy-photo-band__small {
  min-height: 28vw;
  margin-bottom: 8vw;
}
.r-philosophy-photo-band p {
  position: absolute;
  left: 8vw;
  bottom: clamp(44px, 7vw, 92px);
  max-width: 560px;
  margin: 0;
  padding: 34px 42px;
  background: rgba(247, 245, 240, 0.9);
  color: #292621;
  font-size: clamp(16px, 1.35vw, 20px);
  line-height: 2.2;
  letter-spacing: 0.12em;
}

@media (max-width: 960px) {
  .r-philosophy-statement,
  .r-philosophy-axis__head,
  .r-philosophy-photo-band {
    grid-template-columns: 1fr;
  }
  .r-philosophy-statement__photo {
    min-height: 56vw;
  }
  .r-philosophy-grid {
    grid-template-columns: 1fr 1fr;
  }
  .r-axis-card {
    min-height: 360px;
  }
  .r-philosophy-photo-band__large,
  .r-philosophy-photo-band__small {
    min-height: 58vw;
    margin: 0;
  }
  .r-philosophy-photo-band p {
    position: relative;
    left: auto;
    bottom: auto;
    padding: 0;
    background: transparent;
  }
}

@media (max-width: 620px) {
  .r-philosophy-grid {
    grid-template-columns: 1fr;
  }
  .r-axis-card {
    min-height: 0;
    padding: 34px 24px 42px;
  }
  .r-axis-card__number {
    margin-bottom: 28px;
  }
  .r-philosophy-statement__body {
    padding: 56px 24px 72px;
  }
  .r-philosophy-photo-band {
    padding: 0 24px 96px;
  }
  .r-philosophy .r-philosophy-photo-band {
    padding: 0 24px 96px;
  }
}

/* ============================================================
   HOME renewal from handoff ZIP — Margin top page
   Scoped to front-page.php / .m-site only
   ============================================================ */
body.l-home {
  background: #f5f2eb;
}
body.l-home .p-loading,
body.l-home .p-header,
body.l-home .p-hamburger,
body.l-home .p-navbar,
body.l-home .p-footer {
  display: none !important;
}
body.l-home .p-main {
  margin-top: 0;
}
body.l-home .l-wrapper {
  overflow: visible;
}

.m-site {
  --f-ink: #1d201f;
  --f-black: #060706;
  --f-paper: #f5f2eb;
  --f-paper-soft: #ebe5d8;
  --f-brown: #3b2b24;
  --f-brown-soft: #5a4539;
  --f-white: #fffaf1;
  --f-muted: #8b8376;
  --f-line: rgba(29, 32, 31, 0.16);
  --f-line-light: rgba(255, 250, 241, 0.28);
  --f-serif: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN",
    "Hiragino Mincho Pro", "Noto Serif JP", serif;
  --f-sans: var(--en-font);
  --f-ease: cubic-bezier(0.16, 0.84, 0.22, 1);
  --f-mask-ease: cubic-bezier(0.61, 1, 0.88, 1);
  overflow: hidden;
  min-width: 320px;
  background: var(--f-paper);
  color: var(--f-ink);
  font-family: var(--f-serif);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.m-site *,
.m-site *::before,
.m-site *::after {
  box-sizing: border-box;
}
.m-site :is(a, button) {
  color: inherit;
  font: inherit;
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
}
.m-site button {
  border: 0;
  background: none;
  cursor: pointer;
}
.m-site img {
  display: block;
  width: 100%;
}
.m-site figure {
  margin: 0;
}
.m-site h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(27px, 2.6vw, 42px);
  line-height: 1.82;
  letter-spacing: 0.12em;
}
.m-site h3 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(27px, 2.55vw, 42px);
  letter-spacing: 0.11em;
}
.m-site p {
  font-size: 14.5px;
  line-height: 2.42;
  letter-spacing: 0.075em;
}

.m-header {
  position: absolute;
  z-index: 30;
  inset: 0 0 auto;
  height: 116px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(24px, 3vw, 54px);
  opacity: 0;
  transform: translateY(-14px);
  transition: opacity 1.3s var(--f-ease) 0.55s,
    transform 1.3s var(--f-ease) 0.55s;
}
.is-ready .m-header {
  opacity: 1;
  transform: none;
}
.m-logo {
  width: clamp(150px, 15vw, 210px);
  filter: drop-shadow(0 10px 30px rgba(0, 0, 0, 0.28));
}
.m-menu {
  width: 72px;
  height: 38px;
  position: relative;
}
.m-menu span {
  position: absolute;
  right: 0;
  width: 72px;
  height: 1px;
  background: rgba(255, 250, 241, 0.86);
  transform-origin: right center;
  transition: transform 0.8s var(--f-ease), opacity 0.8s ease;
}
.m-menu span:first-child {
  top: 12px;
}
.m-menu span:last-child {
  bottom: 12px;
}
.m-menu:hover span:first-child {
  transform: translateX(-7px);
}
.m-menu:hover span:last-child {
  transform: translateX(7px);
}

.m-hero {
  position: relative;
  min-height: 100svh;
  height: 100svh;
  overflow: hidden;
  color: var(--f-white);
  background: var(--f-black);
}
.hero-visual {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 56%;
  filter: saturate(0.58) brightness(0.48) contrast(1.08);
  transform: scale(1.08);
  transition: transform 3.2s var(--f-ease), filter 3.2s ease;
}
.is-ready .hero-visual {
  transform: scale(1.015);
}
.hero-veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.72),
      rgba(0, 0, 0, 0.08) 38%,
      rgba(0, 0, 0, 0.36) 72%,
      rgba(0, 0, 0, 0.86)
    ),
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.45),
      transparent 46%,
      rgba(0, 0, 0, 0.42)
    );
}
.hero-vertical {
  position: absolute;
  left: 50%;
  top: 49%;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 24px;
  transform: translate(-50%, -50%);
}
.hero-vertical p {
  writing-mode: vertical-rl;
  order: 2;
  margin: 0;
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.14em;
  color: rgba(255, 250, 241, 0.68);
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 1.4s var(--f-ease) 1.15s,
    transform 1.4s var(--f-ease) 1.15s;
}
.hero-vertical h1 {
  writing-mode: vertical-rl;
  display: flex;
  gap: 0.72em;
  margin: 0;
  font-weight: 400;
  font-size: clamp(34px, 3.8vw, 56px);
  line-height: 1.92;
  letter-spacing: 0.22em;
  text-shadow: 0 22px 54px rgba(0, 0, 0, 0.52);
  opacity: 0;
  filter: blur(10px);
  transform: translateY(30px);
  transition: opacity 1.7s var(--f-ease) 0.85s, filter 1.7s ease 0.85s,
    transform 1.7s var(--f-ease) 0.85s;
}
.hero-vertical h1 span {
  display: block;
}
.is-ready .hero-vertical h1,
.is-ready .hero-vertical p {
  opacity: 1;
  filter: blur(0);
  transform: none;
}
.hero-side-copy {
  position: absolute;
  z-index: 3;
  left: calc(50% - 220px);
  top: 48%;
  margin: 0;
  writing-mode: vertical-rl;
  font-size: 11px;
  line-height: 2.4;
  letter-spacing: 0.18em;
  color: rgba(255, 250, 241, 0.64);
  opacity: 0;
  transform: translateY(-50%) translateX(-10px);
  transition: opacity 1.4s var(--f-ease) 1.55s,
    transform 1.4s var(--f-ease) 1.55s;
}
.is-ready .hero-side-copy {
  opacity: 1;
  transform: translateY(-50%);
}
.opening {
  position: relative;
  overflow: hidden;
  background: var(--f-paper);
}
.opening-composed {
  display: grid;
  grid-template-columns: 42vw 1fr;
  align-items: center;
  min-height: 920px;
  padding: 120px 10vw 130px 0;
  background: linear-gradient(
      90deg,
      transparent 0,
      transparent 41.9vw,
      rgba(29, 32, 31, 0.08) 42vw,
      transparent calc(42vw + 1px)
    ),
    var(--f-paper);
}
.opening-tree-motion {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  opacity: 1;
  pointer-events: none;
  background: url("../videos/top-concept-bg-poster.jpg") center/cover no-repeat;
}
.opening-tree-motion::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.36) 0%,
      rgba(0, 0, 0, 0.16) 42%,
      rgba(0, 0, 0, 0.3) 100%
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.26) 100%);
}
.opening-concept-video {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1;
  filter: saturate(1.08) contrast(1.03);
}
.opening-tree-motion span {
  display: none;
}
.opening-vertical-copy,
.opening-silent-copy {
  position: relative;
  z-index: 1;
}
.opening-vertical-copy {
  justify-self: center;
  display: flex;
  flex-direction: row-reverse;
  align-items: flex-start;
  gap: 52px;
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.28);
  transform: translateY(-8px);
}
.opening-vertical-copy p {
  writing-mode: vertical-rl;
  margin: 10px 0 0;
  color: rgba(255, 255, 255, 0.74);
  font-size: 13px;
  line-height: 2.15;
  letter-spacing: 0.2em;
  white-space: nowrap;
}
.opening-vertical-copy h2 {
  writing-mode: vertical-rl;
  font-size: clamp(38px, 3.5vw, 54px);
  line-height: 1.72;
  letter-spacing: 0.13em;
  white-space: nowrap;
}
.opening-silent-copy {
  justify-self: end;
  align-self: end;
  width: min(520px, 40vw);
  margin-bottom: 5vh;
  color: #fff;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.25);
}
.opening-silent-copy::before {
  content: "";
  display: block;
  width: 140px;
  height: 1px;
  margin: 0 0 46px;
  background: rgba(255, 255, 255, 0.62);
}
.opening-silent-copy span {
  display: block;
  margin: 0 0 28px;
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.82);
}
.opening-silent-copy p {
  margin: 0;
  font-size: 16px;
  line-height: 2.45;
  letter-spacing: 0.09em;
  color: #fff;
  font-weight: 500;
}
.opening-page-link {
  display: inline-flex;
  align-items: center;
  gap: 22px;
  margin-top: 42px;
  padding: 15px 0;
  color: #fff;
  font-family: var(--f-sans);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.opening-page-link::before {
  content: "";
  width: 64px;
  height: 1px;
  background: rgba(255, 255, 255, 0.72);
  transition: width 0.65s var(--f-ease), background-color 0.65s ease;
}
.opening-page-link span {
  margin: 0;
  color: #fff;
  font-size: 12px;
  letter-spacing: 0.3em;
}
.opening-page-link em {
  color: rgba(255, 255, 255, 0.86);
  font-family: var(--f-serif);
  font-size: 13px;
  font-style: normal;
  letter-spacing: 0.12em;
  text-transform: none;
}
.opening-page-link:hover::before {
  width: 92px;
  background: #fff;
}
.opening-page-link:hover span,
.opening-page-link:hover em {
  color: #fff;
}

.section-kicker {
  margin: 0 0 34px;
  font-family: var(--f-sans);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: inherit;
  opacity: 0.64;
}
.residence-space {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 2.8vw;
  row-gap: 18vh;
  min-height: 1480px;
  padding: 9vh 4vw 16vh;
  overflow: hidden;
  background: var(--f-paper);
  color: var(--f-ink);
}
.residence-main-visual {
  position: relative;
  grid-column: 1 / 8;
  grid-row: 1;
  align-self: start;
  margin-top: 6vh;
}
.residence-primary {
  width: 100%;
}
.residence-primary .image-mask {
  height: min(58vh, 620px);
  min-height: 430px;
  --mask-duration: 2.35s;
  --filter-duration: 1.8s;
}
.residence-primary .image-mask,
.residence-detail-top .image-mask,
.residence-lower-small .image-mask,
.residence-lower-wide .image-mask {
  border-radius: 4px;
}
.residence-primary img,
.residence-detail-top img,
.residence-lower-small img,
.residence-lower-wide img {
  height: 100%;
  object-fit: cover;
}
.residence-copy {
  grid-column: 9 / 13;
  grid-row: 1;
  align-self: start;
  max-width: 500px;
  padding-top: 9vh;
}
.m-site .residence-en {
  margin: 0 0 28px;
  font-family: var(--en-font);
  font-size: 46px;
  line-height: 1;
  letter-spacing: 0.015em;
  color: #252724;
}
.residence-sub {
  margin: 0 0 72px;
  font-size: 14px;
  line-height: 1.4;
  letter-spacing: 0.1em;
  color: #4f493f;
}
.residence-copy p:not(.residence-en):not(.residence-sub) {
  margin: 0 0 30px;
  font-size: 15.5px;
  line-height: 2.35;
  letter-spacing: 0.065em;
  color: #383833;
}
.residence-detail-top {
  position: absolute;
  right: -4vw;
  top: -6vh;
  width: min(22vw, 340px);
  max-width: none;
  z-index: 2;
}
.residence-detail-top .image-mask {
  aspect-ratio: 3/4;
  --mask-duration: 1.95s;
}
.residence-lower-small {
  position: relative;
  top: -10vh;
  grid-column: 1 / 6;
  grid-row: 2;
  justify-self: start;
  width: 100%;
  max-width: 560px;
  margin-top: 0;
}
.residence-lower-small .image-mask {
  aspect-ratio: 4/5;
  --mask-duration: 2s;
}
.residence-lower-wide {
  position: relative;
  top: 16vh;
  grid-column: 7 / 13;
  grid-row: 2;
  justify-self: end;
  width: 100%;
  max-width: 760px;
  margin-top: 0;
}
.residence-lower-wide .image-mask {
  aspect-ratio: 1.5;
  --mask-duration: 2.25s;
}

.m-works {
  padding: 22vh 9vw 24vh;
  background: linear-gradient(
      120deg,
      rgba(255, 255, 255, 0.28),
      transparent 42%,
      rgba(80, 65, 48, 0.035)
    ),
    var(--f-paper);
  color: var(--f-ink);
}
.section-title {
  display: block;
  align-items: start;
  margin-bottom: clamp(70px, 9vw, 140px);
}
.works-list {
  display: grid;
  gap: 24vh;
}
.work-row {
  display: grid;
  grid-template-columns: minmax(340px, 46vw) minmax(280px, 1fr);
  gap: 13vw;
  align-items: center;
}
.work-row:nth-child(even) {
  grid-template-columns: minmax(280px, 1fr) minmax(320px, 42vw);
}
.work-row:nth-child(even) .reveal-image {
  order: 2;
}
.work-row .image-mask {
  aspect-ratio: 16/9;
}
.work-row img {
  height: 100%;
  object-fit: cover;
}
.work-row span {
  display: block;
  margin-bottom: 34px;
  font-family: var(--f-sans);
  font-size: 10px;
  letter-spacing: 0.34em;
  color: #8b6f43;
}
.work-row p {
  margin-top: 34px;
  max-width: 34em;
  color: #4d4a43;
}
.work-spec {
  display: grid;
  gap: 8px;
  margin: 34px 0 0;
  padding: 0;
  list-style: none;
  color: #8f887b;
  font-family: var(--f-sans);
  font-size: 10px;
  line-height: 1.7;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.work-spec li {
  padding-top: 8px;
  border-top: 1px solid rgba(29, 32, 31, 0.12);
}
.work-empty {
  margin: 0;
  color: #4d4a43;
}
.works-more {
  margin-top: 100px;
}
.m-text-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: 36px;
  font-family: var(--f-sans);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
.m-text-link::after {
  content: "";
  width: 72px;
  height: 1px;
  background: currentColor;
}

.m-dialo {
  position: relative;
  min-height: 980px;
  overflow: hidden;
  background: var(--f-paper);
  color: var(--f-white);
}
.m-dialo::after {
  content: none;
  display: none;
}
.dialo-photo,
.dialo-photo .image-mask {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.dialo-photo img {
  height: 100%;
  object-fit: cover;
  object-position: center 46%;
  filter: saturate(0.92) contrast(1.02);
}
.dialo-photo .image-mask {
  background: var(--f-paper);
}
.dialo-panel {
  position: absolute;
  z-index: 2;
  left: 8vw;
  bottom: 13vh;
  width: min(520px, 42vw);
  text-shadow: 0 18px 46px rgba(0, 0, 0, 0.5);
}
.dialo-panel .section-kicker {
  color: rgba(255, 250, 241, 0.66);
  margin-bottom: 46px;
}
.dialo-panel h2 {
  color: rgba(255, 250, 241, 0.94);
  font-size: clamp(30px, 3vw, 48px);
  line-height: 1.9;
  letter-spacing: 0.14em;
}
.dialo-panel p:not(.section-kicker) {
  margin-top: 42px;
  color: rgba(255, 250, 241, 0.78);
  font-size: 16px;
  line-height: 2.35;
}

.m-craft {
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 10vw;
  padding: 180px 9vw;
  background: var(--f-paper-soft);
  align-items: start;
}
.m-craft > p {
  margin: 76px 0 0;
  color: #514b42;
}
.m-company {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8vw;
  padding: 170px 7vw;
  background: var(--f-paper);
  align-items: center;
}
.m-company .image-mask {
  aspect-ratio: 4/5;
}
.m-company img {
  height: 100%;
  object-fit: cover;
}
.m-company dl {
  margin: 42px 0 0;
  border-top: 1px solid var(--f-line);
}
.m-company dl div {
  display: grid;
  grid-template-columns: 96px 1fr;
  gap: 28px;
  padding: 20px 0;
  border-bottom: 1px solid var(--f-line);
}
.m-company dt {
  color: var(--f-muted);
  font-size: 12px;
}
.m-company dd {
  margin: 0;
  line-height: 1.9;
}
.m-contact {
  min-height: 720px;
  display: grid;
  place-items: center;
  text-align: center;
  padding: 120px 24px;
  background: #11130f;
  color: var(--f-white);
}
.m-contact h2 {
  margin-bottom: 58px;
}
.contact-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
}
.contact-actions a {
  min-width: 240px;
  padding: 20px 28px;
  background: rgba(255, 250, 241, 0.09);
  border: 1px solid rgba(255, 250, 241, 0.24);
  backdrop-filter: blur(10px);
}
.m-legacy-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  padding: 48px 4vw;
  background: #090a08;
  color: rgba(255, 250, 241, 0.62);
}
.m-legacy-footer img {
  width: 178px;
}

.reveal-image {
  overflow: hidden;
}
.reveal-image[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: none;
  transition: opacity 1.05s cubic-bezier(0.19, 1, 0.22, 1),
    transform 1.15s cubic-bezier(0.19, 1, 0.22, 1);
}
.reveal-image[data-reveal].is-visible {
  opacity: 1;
  transform: none;
}
.image-mask {
  display: block;
  position: relative;
  overflow: hidden;
  transform: none;
  background: transparent;
}
.residence-detail-top,
.residence-lower-wide {
  background: transparent;
}
.residence-detail-top .image-mask,
.residence-lower-wide .image-mask {
  background: transparent;
}
.residence-detail-top[data-reveal]:not(.is-visible),
.residence-lower-wide[data-reveal]:not(.is-visible) {
  opacity: 0;
}
.residence-detail-top[data-reveal].is-visible,
.residence-lower-wide[data-reveal].is-visible {
  opacity: 1;
}
.m-site [data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: blur(8px);
  transition: opacity 1.2s var(--f-ease), transform 1.2s var(--f-ease),
    filter 1.2s ease;
}
.m-site [data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: blur(0);
}
.m-site .reveal-image[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: none;
  transition: opacity 1.05s cubic-bezier(0.19, 1, 0.22, 1),
    transform 1.15s cubic-bezier(0.19, 1, 0.22, 1);
}
.m-site .reveal-image[data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}

.m-nav {
  position: fixed;
  z-index: 80;
  inset: 0;
  display: grid;
  grid-template-columns: minmax(360px, 34vw) minmax(300px, 24vw) minmax(
      330px,
      28vw
    );
  align-items: center;
  justify-content: center;
  gap: clamp(52px, 5vw, 96px);
  padding: 8vh clamp(44px, 5vw, 86px);
  background: var(--f-paper);
  color: var(--f-ink);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.75s var(--f-ease), visibility 0.75s;
}
.m-nav.is-open {
  opacity: 1;
  visibility: visible;
}
/* .m-nav::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 31vw;
  width: 1px;

} */
.nav-close {
  position: absolute;
  z-index: 3;
  right: 4.2vw;
  top: 46px;
  width: 74px;
  height: 74px;
}
.nav-close span {
  position: absolute;
  left: 9px;
  top: 36px;
  width: 58px;
  height: 1px;
  background: #252724;
  transform-origin: center;
}
.nav-close span:first-child {
  transform: rotate(24deg);
}
.nav-close span:last-child {
  transform: rotate(-24deg);
}
.nav-photo {
  position: relative;
  width: 100%;
  max-width: 520px;
  aspect-ratio: 4/5.55;
  align-self: center;
  overflow: hidden;
  border-radius: 3px;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.95s var(--f-ease), transform 0.95s var(--f-ease);
}
.m-nav.is-open .nav-photo {
  opacity: 1;
  transform: none;
}
.nav-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.18),
      rgba(0, 0, 0, 0.06) 44%,
      rgba(0, 0, 0, 0.16)
    ),
    linear-gradient(180deg, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.18));
}
.nav-photo img {
  height: 100%;
  object-fit: cover;
  object-position: center;
  filter: saturate(0.8) brightness(0.88);
}
.nav-photo p {
  position: absolute;
  z-index: 2;
  left: 44px;
  right: 44px;
  bottom: 48px;
  margin: 0;
  color: #fff;
  font-size: clamp(22px, 1.7vw, 30px);
  line-height: 1.75;
  letter-spacing: 0.12em;
}
.nav-contents {
  justify-self: center;
  width: 100%;
  max-width: 360px;
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.95s var(--f-ease) 0.08s,
    transform 0.95s var(--f-ease) 0.08s;
}
.m-nav.is-open .nav-contents {
  opacity: 1;
  transform: none;
}
.nav-contents > p,
.nav-address span {
  margin: 0 0 42px;
  font-family: var(--en-font);
  font-size: 19px;
  letter-spacing: 0.02em;
  color: #8b8376;
}
.nav-contents > div {
  display: grid;
  grid-template-columns: repeat(2, minmax(9em, 1fr));
  column-gap: clamp(34px, 3vw, 58px);
  row-gap: 34px;
}
.nav-content-item {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 0.72s var(--f-ease), transform 0.72s var(--f-ease);
}
.nav-content-item > a {
  display: block;
  color: #252724;
  text-align: left;
  font-family: var(--en-font);
  font-size: clamp(18px, 1.25vw, 22px);
  line-height: 1.4;
  letter-spacing: 0.02em;
  white-space: nowrap;
  transition: color 0.4s ease;
}
.nav-content-item > a span {
  display: block;
  margin-top: 8px;
  font-family: var(--f-serif);
  font-size: 11px;
  line-height: 1.5;
  letter-spacing: 0.14em;
  color: #8b8376;
}
.nav-content-item ul {
  display: grid;
  gap: 7px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}
.nav-content-item li a {
  display: inline-block;
  color: #6b6358;
  font-size: 11px;
  line-height: 1.7;
  letter-spacing: 0.12em;
  white-space: normal;
  transition: color 0.4s ease;
}
.nav-content-item > a:hover,
.nav-content-item li a:hover {
  color: #7c5f42;
}
.m-nav.is-open .nav-content-item {
  opacity: 1;
  transform: none;
}
.m-nav.is-open .nav-content-item:nth-child(1) {
  transition-delay: 0.16s;
}
.m-nav.is-open .nav-content-item:nth-child(2) {
  transition-delay: 0.2s;
}
.m-nav.is-open .nav-content-item:nth-child(3) {
  transition-delay: 0.24s;
}
.m-nav.is-open .nav-content-item:nth-child(4) {
  transition-delay: 0.28s;
}
.m-nav.is-open .nav-content-item:nth-child(5) {
  transition-delay: 0.32s;
}
.m-nav.is-open .nav-content-item:nth-child(6) {
  transition-delay: 0.36s;
}
.m-nav.is-open .nav-content-item:nth-child(7) {
  transition-delay: 0.4s;
}
.nav-info {
  justify-self: center;
  width: min(360px, 100%);
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.95s var(--f-ease) 0.16s,
    transform 0.95s var(--f-ease) 0.16s;
}
.m-nav.is-open .nav-info {
  opacity: 1;
  transform: none;
}
.nav-info > img {
  width: 210px;
  margin-bottom: 34px;
}
.nav-tagline {
  margin: 0 0 58px;
  color: #5a4539;
  font-size: 17px;
  line-height: 2;
  letter-spacing: 0.08em;
}
.nav-address p {
  margin: 0 0 28px;
  color: #4b4942;
  font-size: 14px;
  line-height: 2;
}
.nav-actions {
  display: grid;
  gap: 14px;
  margin: 34px 0 42px;
}
.nav-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 64px;
  background: #2a211e;
  color: var(--f-white);
  font-size: 16px;
  letter-spacing: 0.1em;
}
.nav-info small {
  color: #aaa293;
  font-size: 13px;
}

@media (max-width: 900px) {
  .m-header {
    height: 92px;
  }
  .m-logo {
    width: 150px;
  }
  .m-menu,
  .m-menu span {
    width: 58px;
  }
  .hero-vertical {
    gap: 16px;
  }
  .hero-vertical h1 {
    font-size: clamp(32px, 8.4vw, 46px);
  }
  .hero-side-copy {
    left: 28px;
  }
  .m-nav {
    display: block;
    overflow: auto;
    padding: 96px 24px 54px;
  }
  .m-nav::before {
    display: none;
  }
  .nav-close {
    right: 22px;
    top: 22px;
    width: 56px;
    height: 56px;
  }
  .nav-close span {
    left: 8px;
    top: 28px;
    width: 42px;
  }
  .nav-photo {
    width: min(330px, 78vw);
    aspect-ratio: 4/5;
    margin: 0 auto 54px;
  }
  .nav-photo p {
    left: 28px;
    right: 28px;
    bottom: 32px;
    font-size: 22px;
  }
  .nav-contents {
    width: min(430px, 100%);
    margin: 0 auto 54px;
  }
  .nav-contents > p,
  .nav-address span {
    margin-bottom: 28px;
  }
  .nav-contents > div {
    grid-template-columns: repeat(2, minmax(8em, 1fr));
    column-gap: 34px;
    row-gap: 26px;
  }
  .nav-info {
    width: min(520px, 100%);
    margin: 0 auto;
    padding-top: 48px;
    border-top: 1px solid rgba(29, 32, 31, 0.12);
  }
  .nav-info > img {
    width: 180px;
  }
  .opening-composed {
    grid-template-columns: 1fr;
    min-height: 780px;
    padding: 110px 24px;
    gap: 80px;
    background: var(--f-paper);
  }
  .opening-tree-motion {
    inset: 0;
  }
  .opening-vertical-copy {
    justify-self: start;
    gap: 42px;
    margin-left: 8vw;
  }
  .opening-silent-copy {
    justify-self: start;
    width: min(520px, 82vw);
    margin: 0 0 0 8vw;
  }
  .residence-space {
    grid-template-columns: repeat(12, 1fr);
    column-gap: 3.2vw;
    min-height: auto;
    padding: 110px 24px 140px;
    row-gap: 84px;
  }
  .residence-detail-top {
    grid-column: auto;
    grid-row: auto;
  }
  .residence-lower-small {
    grid-column: 1 / 8;
    grid-row: 3;
    top: -48px;
    margin: -28px 0 0;
  }
  .residence-lower-wide {
    grid-column: 6 / 13;
    grid-row: 3;
    top: 94px;
    margin: 56px 0 0;
  }
  .work-row,
  .work-row:nth-child(even),
  .m-craft,
  .m-company {
    grid-template-columns: 1fr;
  }
  .work-row:nth-child(even) .reveal-image {
    order: 0;
  }
  .m-works {
    padding: 130px 24px 150px;
  }
  .works-list {
    gap: 120px;
  }
  .section-title {
    gap: 28px;
    margin-bottom: 100px;
  }
  .work-row {
    gap: 42px;
  }
  .dialo-panel {
    left: 24px;
    right: 24px;
    bottom: 86px;
    width: auto;
  }
  .m-dialo {
    min-height: 860px;
  }
  .dialo-photo img {
    object-position: center top;
  }
  .m-craft,
  .m-company {
    padding: 120px 24px;
  }
}

@media (max-width: 560px) {
  .m-hero {
    min-height: 760px;
    height: 100svh;
  }
  .hero-visual {
    object-position: 58% center;
  }
  .hero-vertical {
    left: 53%;
    top: 45%;
  }
  .hero-vertical h1 {
    font-size: 33px;
    line-height: 1.82;
  }
  .hero-vertical p {
    font-size: 9px;
  }
  .hero-side-copy {
    font-size: 9px;
    left: 18px;
  }
  .m-nav {
    padding: 86px 22px 46px;
  }
  .nav-photo {
    width: 100%;
    max-width: 330px;
    margin-bottom: 44px;
  }
  .nav-photo p {
    left: 24px;
    right: 24px;
    bottom: 26px;
    font-size: 20px;
    line-height: 1.7;
  }
  .nav-contents > div {
    grid-template-columns: 1fr;
    row-gap: 20px;
  }
  .nav-content-item > a {
    font-size: 20px;
    white-space: nowrap;
    letter-spacing: 0.02em;
  }
  .nav-content-item ul {
    margin-top: 10px;
    gap: 5px;
  }
  .nav-actions a {
    min-height: 58px;
  }
  .opening-composed {
    padding: 90px 20px;
    gap: 56px;
    min-height: 720px;
  }
  .opening-vertical-copy {
    margin-left: 0;
    gap: 28px;
  }
  .opening-vertical-copy h2 {
    font-size: 34px;
    line-height: 1.66;
  }
  .opening-vertical-copy p {
    font-size: 12px;
  }
  .opening-silent-copy {
    width: auto;
    margin: 0;
  }
  .opening-silent-copy p {
    font-size: 13px;
    line-height: 2.25;
  }
  .residence-space {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    column-gap: 3.2vw;
    row-gap: 84px;
    min-height: auto;
    padding: 84px 20px 128px;
  }
  .residence-main-visual {
    grid-column: 1 / 10;
    grid-row: 1;
    margin: 0 0 24px;
  }
  .residence-primary .image-mask {
    height: auto;
    min-height: 0;
    aspect-ratio: 1.38;
  }
  .residence-detail-top {
    position: absolute;
    right: -9vw;
    top: -48px;
    width: min(34vw, 180px);
    margin: 0;
  }
  .residence-detail-top .image-mask {
    aspect-ratio: 3/4;
  }
  .residence-copy {
    grid-column: 1 / 13;
    grid-row: 2;
    align-self: start;
    max-width: none;
    padding-top: 0;
    margin: 0;
  }
  .m-site .residence-en {
    font-size: 46px;
    margin-bottom: 18px;
  }
  .residence-sub {
    margin-bottom: 30px;
    font-size: 12px;
  }
  .residence-copy p:not(.residence-en):not(.residence-sub) {
    font-size: 12.5px;
    line-height: 2.05;
    letter-spacing: 0.045em;
  }
  .residence-lower-small,
  .residence-lower-wide {
    width: 100%;
    margin: 0;
  }
  .residence-lower-small {
    grid-column: 1 / 8;
    grid-row: 3;
    align-self: start;
    max-width: none;
    top: -42px;
    margin: -20px 0 0;
  }
  .residence-lower-wide .image-mask {
    aspect-ratio: 1.5;
  }
  .residence-lower-wide {
    grid-column: 6 / 13;
    grid-row: 3;
    max-width: none;
    top: 90px;
    margin: 54px 0 0;
  }
  .m-site h2 {
    font-size: 27px;
  }
  .m-site p {
    font-size: 14px;
  }
  .work-row .image-mask {
    aspect-ratio: 4/5;
  }
  .section-title {
    display: block;
  }
  .section-title h2 {
    margin-top: 28px;
  }
  .work-row p {
    margin-top: 26px;
  }
  .dialo-panel {
    left: 22px;
    right: 22px;
    bottom: 54px;
    max-width: calc(100vw - 44px);
  }
  .dialo-panel .section-kicker {
    margin-bottom: 26px;
  }
  .dialo-panel h2 {
    font-size: clamp(22px, 6.2vw, 25px);
    line-height: 1.95;
    letter-spacing: 0.08em;
    max-width: 100%;
  }
  .dialo-panel p:not(.section-kicker) {
    font-size: 13px;
    line-height: 2.1;
    letter-spacing: 0.06em;
    max-width: 100%;
  }
  .contact-actions {
    display: grid;
  }
  .contact-actions a {
    min-width: 0;
  }
  .m-legacy-footer {
    display: grid;
  }
}

@media (max-width: 390px) {
  .dialo-panel {
    left: 18px;
    right: 18px;
    max-width: calc(100vw - 36px);
  }
  .dialo-panel h2 {
    font-size: 21px;
    letter-spacing: 0.06em;
  }
  .dialo-panel p:not(.section-kicker) {
    font-size: 12.5px;
    letter-spacing: 0.04em;
  }
}

@media (prefers-reduced-motion: reduce) {
  .m-site *,
  .m-site *::before,
  .m-site *::after,
  .philosophy-design *,
  .philosophy-design *::before,
  .philosophy-design *::after {
    scroll-behavior: auto !important;
    animation: none !important;
    transition-duration: 0.01ms !important;
  }
  .m-site [data-reveal],
  .philosophy-design [data-reveal],
  .m-header,
  .hero-vertical h1,
  .hero-vertical p,
  .hero-side-copy,
  .pd-rule,
  .pd-hero .pd-kicker,
  .pd-hero h1 {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }
  .image-mask img,
  .hero-visual,
  .fp-award-feature > figure,
  .fp-award-grid figure,
  .fp-award-feature > figure img,
  .fp-award-grid img {
    transform: none !important;
    filter: none !important;
  }
  .fp-award-feature.is-award-enhanced figure {
    clip-path: inset(0 0 0 0) !important;
    opacity: 1 !important;
  }
  .fp-award-feature.is-award-enhanced figure::after {
    display: none !important;
  }
  .fp-award-feature > figure img,
  .fp-award-grid img {
    animation: none !important;
  }
  .opening-concept-video {
    display: none !important;
  }
  .pd-hero::before {
    opacity: 0.46 !important;
  }
}

/* ============================================================
   PHILOSOPHY page — follows the top page margin language
   ============================================================ */
body.l-philosophy .p-main,
body.l-concept .p-main {
  margin-top: 0;
}
.r-philosophy.m-site {
  background: var(--f-paper);
}
.r-philosophy .philosophy-top {
  min-height: 100svh;
  height: 100svh;
}
.r-philosophy .philosophy-top .hero-visual {
  object-position: center 54%;
}
.r-philosophy .philosophy-top .hero-veil {
  background: linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.76),
      rgba(0, 0, 0, 0.08) 38%,
      rgba(0, 0, 0, 0.38) 72%,
      rgba(0, 0, 0, 0.88)
    ),
    linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.48),
      transparent 50%,
      rgba(0, 0, 0, 0.45)
    );
}
.r-philosophy .philosophy-opening {
  min-height: 920px;
}
.r-philosophy .philosophy-opening .opening-tree-motion {
  background: linear-gradient(
      90deg,
      var(--f-paper) 0,
      rgba(245, 242, 235, 0.9) 30%,
      rgba(245, 242, 235, 0.72) 64%,
      var(--f-paper) 100%
    ),
    url("../images/luxury/concept.jpg") center/cover no-repeat;
}
.philosophy-margin-scene {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 2.4vw;
  padding: 16vh 7.5vw 20vh;
  background: var(--f-paper);
}
.philosophy-margin-scene__photo {
  grid-column: 1 / 8;
  align-self: start;
}
.philosophy-margin-scene__photo .image-mask {
  height: min(74vh, 720px);
  min-height: 520px;
}
.philosophy-margin-scene__photo img {
  height: 100%;
  object-fit: cover;
}
.philosophy-margin-scene__copy {
  grid-column: 9 / 13;
  max-width: 470px;
  padding-top: 10vh;
}
.philosophy-margin-scene__copy h2 {
  font-size: clamp(27px, 2.7vw, 43px);
  line-height: 1.9;
}
.philosophy-margin-scene__copy p:not(.section-kicker) {
  margin: 42px 0 0;
  color: #4c473f;
  font-size: 15.5px;
  line-height: 2.35;
}
.philosophy-axis-flow {
  padding: 18vh 8vw 20vh;
  background: #11130f;
  color: var(--f-white);
}
.philosophy-axis-flow__head {
  display: grid;
  grid-template-columns: minmax(220px, 0.45fr) 1fr;
  gap: 8vw;
  align-items: start;
  margin-bottom: 13vh;
}
.philosophy-axis-flow__head h2 {
  font-size: clamp(30px, 3vw, 48px);
  line-height: 1.8;
}
.philosophy-axis-list {
  display: grid;
  gap: 0;
  border-top: 1px solid rgba(255, 250, 241, 0.16);
}
.philosophy-axis-item {
  display: grid;
  grid-template-columns: 120px minmax(0, 1fr);
  gap: clamp(34px, 8vw, 120px);
  padding: clamp(46px, 6vw, 78px) 0;
  border-bottom: 1px solid rgba(255, 250, 241, 0.16);
}
.philosophy-axis-item > span {
  color: rgba(255, 250, 241, 0.34);
  font-family: var(--f-sans);
  font-size: 10px;
  letter-spacing: 0.34em;
}
.philosophy-axis-item > div {
  display: grid;
  grid-template-columns: minmax(180px, 280px) minmax(180px, 300px) minmax(
      280px,
      1fr
    );
  gap: clamp(28px, 4vw, 68px);
  align-items: start;
}
.philosophy-axis-item__en {
  margin: 0;
  color: rgba(255, 250, 241, 0.9);
  font-family: var(--en-font);
  font-size: clamp(34px, 4vw, 64px);
  line-height: 1;
  letter-spacing: 0.02em;
}
.philosophy-axis-item h3 {
  margin: 0;
  color: rgba(255, 250, 241, 0.86);
  font-size: clamp(19px, 1.5vw, 26px);
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.12em;
}
.philosophy-axis-item p:not(.philosophy-axis-item__en) {
  margin: 0;
  max-width: 43em;
  color: rgba(255, 250, 241, 0.58);
  font-size: 15px;
  line-height: 2.28;
  letter-spacing: 0.07em;
}
.philosophy-closing-scene {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 2.4vw;
  min-height: 1120px;
  padding: 18vh 7.5vw 16vh;
  background: var(--f-paper);
}
.philosophy-closing-scene__wide {
  grid-column: 5 / 13;
  align-self: start;
}
.philosophy-closing-scene__wide .image-mask {
  aspect-ratio: 16 / 10;
}
.philosophy-closing-scene__small {
  grid-column: 2 / 5;
  align-self: end;
  margin-bottom: 12vh;
}
.philosophy-closing-scene__small .image-mask {
  aspect-ratio: 3 / 4;
}
.philosophy-closing-scene img {
  height: 100%;
  object-fit: cover;
}
.philosophy-closing-scene > p {
  position: absolute;
  left: 8vw;
  bottom: 15vh;
  max-width: 620px;
  margin: 0;
  color: #302d28;
  font-size: clamp(18px, 1.55vw, 25px);
  line-height: 2.25;
  letter-spacing: 0.13em;
}
.philosophy-contact {
  min-height: 680px;
}

@media (max-width: 980px) {
  .philosophy-margin-scene,
  .philosophy-closing-scene {
    display: block;
    min-height: auto;
    padding: 120px 24px;
  }
  .philosophy-margin-scene__photo .image-mask {
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .philosophy-margin-scene__copy {
    max-width: 640px;
    padding-top: 72px;
  }
  .philosophy-axis-flow {
    padding: 120px 24px 140px;
  }
  .philosophy-axis-flow__head {
    grid-template-columns: 1fr;
    gap: 30px;
    margin-bottom: 72px;
  }
  .philosophy-axis-item,
  .philosophy-axis-item > div {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .philosophy-axis-item {
    padding: 46px 0;
  }
  .philosophy-closing-scene__wide {
    margin-bottom: 76px;
  }
  .philosophy-closing-scene__small {
    width: min(58vw, 330px);
    margin: 0 0 72px auto;
  }
  .philosophy-closing-scene > p {
    position: relative;
    left: auto;
    bottom: auto;
  }
}

@media (max-width: 560px) {
  .r-philosophy .philosophy-top {
    min-height: 760px;
  }
  .r-philosophy .philosophy-opening {
    min-height: 720px;
  }
  .philosophy-margin-scene,
  .philosophy-closing-scene {
    padding: 96px 20px;
  }
  .philosophy-margin-scene__copy {
    padding-top: 56px;
  }
  .philosophy-axis-flow {
    padding: 96px 20px 116px;
  }
  .philosophy-axis-item__en {
    font-size: 36px;
  }
  .philosophy-closing-scene__small {
    width: 62vw;
  }
}

/* ============================================================
   PHILOSOPHY — quiet light tone matched to the top section
   ============================================================ */
body.l-philosophy,
body.l-concept {
  background: #f5f2eb;
  overflow-x: hidden;
}
body.l-philosophy .p-main,
body.l-concept .p-main {
  margin-top: 0;
}
body.l-philosophy.r-hero-page .p-header,
body.l-concept.r-hero-page .p-header {
  background: transparent;
  box-shadow: none;
}
body.l-philosophy.r-hero-page .p-header__logo a,
body.l-philosophy.r-hero-page .p-header-nav__child,
body.l-concept.r-hero-page .p-header__logo a,
body.l-concept.r-hero-page .p-header-nav__child {
  color: #38342d;
}
body.l-philosophy.r-hero-page .r-logo-ja,
body.l-concept.r-hero-page .r-logo-ja {
  color: #8f7b58;
}

.philosophy-design {
  --pd-paper: #f5f2eb;
  --pd-ink: #3b3730;
  --pd-muted: #8f887c;
  --pd-line: rgba(59, 55, 48, 0.2);
  --pd-serif: "Yu Mincho", "YuMincho", "Hiragino Mincho ProN",
    "Hiragino Mincho Pro", "Noto Serif JP", serif;
  --pd-sans: var(--en-font);
  --f-ease: cubic-bezier(0.16, 0.84, 0.22, 1);
  --f-mask-ease: cubic-bezier(0.61, 1, 0.88, 1);
  overflow: hidden;
  width: 100%;
  max-width: none;
  padding-right: 0;
  padding-left: 0;
  background: var(--pd-paper);
  color: var(--pd-ink);
  font-family: var(--pd-serif);
  -webkit-font-smoothing: antialiased;
}
.philosophy-design img {
  display: block;
  width: 100%;
}
.pd-hero {
  position: relative;
  width: 100%;
  min-height: 100svh;
  display: flex;
  align-items: center;
  overflow: hidden;
  background: var(--pd-paper);
}
.pd-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: url("../images/luxury/philosophy-plant-shadow.webp") center/cover
    no-repeat;
  opacity: 0.46;
  filter: blur(0.18px) saturate(0.82);
  mix-blend-mode: multiply;
}
.pd-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
      90deg,
      rgba(245, 242, 235, 0.82) 0%,
      rgba(245, 242, 235, 0.6) 42%,
      rgba(245, 242, 235, 0.22) 72%,
      rgba(245, 242, 235, 0.08) 100%
    ),
    linear-gradient(
      180deg,
      rgba(245, 242, 235, 0.18) 0%,
      rgba(245, 242, 235, 0) 48%,
      rgba(245, 242, 235, 0.24) 100%
    );
}
.pd-hero__inner {
  position: relative;
  z-index: 2;
  width: min(980px, 72vw);
  margin-left: 17vw;
  padding-top: 3vh;
}
.pd-rule {
  display: block;
  width: min(320px, 22vw);
  height: 1px;
  margin-bottom: 74px;
  background: var(--pd-line);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 1.4s var(--f-ease) 0.55s;
}
.pd-kicker {
  margin: 0 0 72px;
  color: #8e8679;
  font-family: var(--pd-sans);
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.42em;
  text-transform: uppercase;
}
.pd-hero .pd-kicker {
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 1.35s var(--f-ease) 0.75s,
    transform 1.35s var(--f-ease) 0.75s;
}
.pd-hero h1 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(23px, 2vw, 34px);
  line-height: 2.35;
  letter-spacing: 0.14em;
  opacity: 0;
  filter: blur(10px);
  transform: translateY(30px);
  transition: opacity 1.65s var(--f-ease) 0.95s, filter 1.65s ease 0.95s,
    transform 1.65s var(--f-ease) 0.95s;
}
.is-ready .pd-rule {
  transform: scaleX(1);
}
.is-ready .pd-hero .pd-kicker,
.is-ready .pd-hero h1 {
  opacity: 1;
  filter: blur(0);
  transform: none;
}
.pd-opening {
  display: grid;
  grid-template-columns: minmax(280px, 0.58fr) minmax(420px, 0.8fr);
  gap: 14vw;
  padding: 22vh 10vw 24vh;
  background: var(--pd-paper);
}
.pd-opening__copy h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(28px, 3vw, 46px);
  line-height: 1.9;
  letter-spacing: 0.14em;
  writing-mode: vertical-rl;
}
.pd-opening__text {
  align-self: end;
  max-width: 760px;
  margin: 0;
  color: #555049;
  font-size: 15.5px;
  line-height: 2.85;
  letter-spacing: 0.1em;
}
.pd-opening__lead-line {
  white-space: nowrap;
}
.pd-image-essay {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 2.4vw;
  min-height: 1080px;
  padding: 2vh 7.5vw 24vh;
  background: var(--pd-paper);
}
.pd-image-essay__photo {
  grid-column: 1 / 8;
  margin: 0;
  align-self: start;
}
.pd-image-essay__photo img {
  height: min(72vh, 720px);
  min-height: 520px;
  object-fit: cover;
  filter: saturate(0.78) brightness(0.96);
}
.pd-image-essay__body {
  grid-column: 9 / 13;
  max-width: 430px;
  align-self: center;
}
.pd-image-essay__body .pd-kicker {
  margin-bottom: 44px;
}
.pd-image-essay__body h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(27px, 2.8vw, 44px);
  line-height: 1.92;
  letter-spacing: 0.13em;
}
.pd-image-essay__body p:not(.pd-kicker) {
  margin: 54px 0 0;
  color: #504b44;
  font-size: 15px;
  line-height: 2.7;
  letter-spacing: 0.075em;
}
.pd-axis {
  padding: 24vh 10vw 24vh;
  background: var(--pd-paper);
}
.pd-axis__intro {
  max-width: none;
  margin-bottom: 16vh;
}
.pd-axis__intro h2 {
  max-width: none;
  margin: 0;
  font-weight: 400;
  font-size: clamp(28px, 3vw, 46px);
  line-height: 1.9;
  letter-spacing: 0.14em;
  white-space: nowrap;
}
.pd-axis__list {
  display: grid;
  gap: 0;
}
.pd-axis-item {
  display: grid;
  grid-template-columns: minmax(220px, 360px) minmax(300px, 560px);
  gap: 0;
  align-items: start;
  padding: 86px 0;
  border-top: 1px solid rgba(59, 55, 48, 0.13);
}
.pd-axis-item:last-child {
  border-bottom: 1px solid rgba(59, 55, 48, 0.13);
}
.pd-axis-item__en {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  color: #4a453d;
  font-family: var(--en-font);
  font-size: clamp(32px, 3vw, 52px);
  line-height: 1.05;
  letter-spacing: 0.04em;
  text-transform: none;
}
.pd-axis-item h3 {
  grid-column: 1;
  grid-row: 2;
  margin: 12px 0 0;
  font-weight: 400;
  font-size: clamp(18px, 1.35vw, 23px);
  line-height: 2;
  letter-spacing: 0.12em;
}
.pd-axis-item p:last-child {
  grid-column: 2;
  grid-row: 1 / span 2;
  align-self: center; /* 左の見出しブロックに対して縦中央 */
  text-align: left; /* 横は左寄せ（オーナー指示 2026-07-23） */
  margin: 0;
  color: #555049;
  font-size: 14.5px;
  line-height: 2.55;
  letter-spacing: 0.07em;
}
.pd-closing {
  position: relative;
  min-height: 1040px;
  padding: 4vh 7.5vw 20vh;
  background: var(--pd-paper);
}
.pd-closing__photo {
  width: min(720px, 52vw);
  margin: 0 0 0 auto;
}
.pd-closing__photo img {
  aspect-ratio: 16/10;
  height: auto;
  object-fit: cover;
  filter: saturate(0.82) brightness(0.92);
}
.pd-closing__copy {
  position: absolute;
  left: 10vw;
  bottom: 20vh;
  max-width: 580px;
}
.pd-closing__copy p {
  margin: 0;
  color: #36322c;
  font-size: clamp(17px, 1.45vw, 23px);
  line-height: 2.45;
  letter-spacing: 0.13em;
}
.pd-closing__copy a {
  display: inline-flex;
  align-items: center;
  gap: 18px;
  margin-top: 48px;
  color: #514b42;
  font-family: var(--pd-sans);
  font-size: 11px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  text-decoration: none;
}
.pd-closing__copy a::before {
  content: "";
  width: 72px;
  height: 1px;
  background: rgba(59, 55, 48, 0.28);
  transition: width 0.6s ease, background-color 0.6s ease;
}
.pd-closing__copy a:hover::before {
  width: 100px;
  background: #7c5f42;
}
.philosophy-design [data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: blur(8px);
  transition: opacity 1.2s var(--f-ease), transform 1.2s var(--f-ease),
    filter 1.2s ease;
}
.philosophy-design [data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: blur(0);
}
.philosophy-design .reveal-image[data-reveal] {
  opacity: 0;
  transform: translateY(34px);
  filter: none;
  transition: opacity 1.05s cubic-bezier(0.19, 1, 0.22, 1),
    transform 1.15s cubic-bezier(0.19, 1, 0.22, 1);
}
.philosophy-design .reveal-image[data-reveal].is-visible {
  opacity: 1;
  transform: none;
  filter: none;
}
.philosophy-design .image-mask {
  background: transparent;
}

@media (max-width: 980px) {
  .pd-hero__inner {
    width: auto;
    margin: 0 clamp(24px, 5vw, 64px);
  }
  .pd-opening,
  .pd-image-essay,
  .pd-axis__intro,
  .pd-axis-item {
    display: block;
  }
  /* SPは積み上げのため説明文は左揃えに戻す */
  .pd-axis-item p:last-child {
    text-align: left;
  }
  .pd-opening {
    padding: 140px clamp(24px, 5vw, 64px);
  }
  .pd-opening__copy h2 {
    display: inline-block;
    writing-mode: vertical-rl;
    font-size: clamp(30px, 6vw, 42px);
    line-height: 1.75;
    margin-bottom: 72px;
  }
  .pd-opening__lead-line {
    white-space: normal;
  }
  .pd-image-essay {
    min-height: 0;
    padding: 0 clamp(24px, 5vw, 64px) 120px;
  }
  .pd-image-essay__photo img {
    height: auto;
    min-height: 0;
    aspect-ratio: 4/3;
  }
  .pd-image-essay__body {
    max-width: 640px;
    margin-top: 68px;
  }
  .pd-axis {
    padding: 140px clamp(24px, 5vw, 64px);
    background: var(--pd-paper);
  }
  .pd-axis__intro {
    margin-bottom: 92px;
  }
  .pd-axis__intro h2 {
    white-space: normal;
  }
  .pd-axis-item {
    grid-template-columns: minmax(180px, 260px) minmax(0, 1fr);
    padding: 64px 0;
  }
  .pd-closing {
    min-height: auto;
    padding: 0 clamp(24px, 5vw, 64px) 120px;
  }
  .pd-closing__photo {
    width: 100%;
  }
  .pd-closing__copy {
    position: relative;
    left: auto;
    bottom: auto;
    margin-top: 68px;
  }
}

@media (max-width: 560px) {
  .pd-hero {
    min-height: 760px;
  }
  .pd-rule {
    width: 48vw;
    margin-bottom: 58px;
  }
  .pd-kicker {
    margin-bottom: 48px;
    font-size: 11px;
  }
  .pd-hero h1 {
    font-size: 20px;
    line-height: 2.15;
  }
  .pd-opening,
  .pd-axis {
    padding: 96px clamp(24px, 5vw, 64px);
  }
  .pd-image-essay {
    padding: 0 clamp(24px, 5vw, 64px) 96px;
  }
  .pd-axis-item__en {
    font-size: 28px;
  }
  .pd-axis-item h3 {
    margin-top: 10px;
  }
  .pd-closing {
    padding: 0 clamp(24px, 5vw, 64px) 96px;
  }
}

/* ============================================================
   Renewed shared lower pages
   ============================================================ */
.m-page {
  --fp-paper: #eeeae5;
  --fp-paper-deep: #e7e1d8;
  --fp-ink: #20211d;
  --fp-muted: #6b6e67;
  --fp-sage: #bcb49b;
  --fp-line: rgba(32, 33, 29, 0.2);
  --fp-gutter: clamp(24px, 5vw, 64px);
  --fp-serif: var(
    --f-serif,
    "Yu Mincho",
    "YuMincho",
    "Hiragino Mincho ProN",
    "Times New Roman",
    serif
  );
  --fp-sans: var(--en-font);
  --fp-inner: min(
    1120px,
    calc(100vw - var(--fp-gutter) - var(--fp-gutter))
  );
  --fp-wide: min(
    1360px,
    calc(100vw - var(--fp-gutter) - var(--fp-gutter))
  );
  position: relative;
  overflow: hidden;
  background-color: var(--fp-paper);
  background-image: radial-gradient(
      circle at 12% 8%,
      rgba(255, 255, 255, 0.34) 0 1px,
      transparent 1px
    ),
    linear-gradient(
      120deg,
      rgba(255, 255, 255, 0.18),
      transparent 34%,
      rgba(70, 60, 45, 0.035)
    );
  background-size: 36px 36px, 100% 100%;
  color: var(--fp-ink);
  font-family: var(--fp-serif);
  font-feature-settings: "palt" 1;
  -webkit-font-smoothing: antialiased;
}
.m-page a {
  color: inherit;
  text-decoration: none;
}
.m-page img {
  display: block;
  width: 100%;
}
.fp-hero {
  position: relative;
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  column-gap: 0;
  min-height: auto;
  padding: clamp(170px, 17vw, 250px) 0 clamp(90px, 10vw, 150px);
  isolation: isolate;
}
.fp-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -2;
  background: url("../images/luxury/philosophy-plant-shadow.webp") 88% 4% / 46vw
    auto no-repeat;
  opacity: 0.11;
  filter: saturate(0.78);
}
.fp-hero::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: clamp(40px, 5vw, 70px);
  width: min(240px, 22vw);
  height: 1px;
  transform: translateX(-50%);
  background: var(--fp-line);
}
.fp-hero__copy {
  grid-column: 1 / -1;
  width: var(--fp-inner);
  margin: 0 auto;
  padding-left: clamp(28px, 3.5vw, 58px);
  border-left: 1px solid var(--fp-line);
  position: relative;
  z-index: 2;
  animation: fpFadeUp 1.15s cubic-bezier(0.19, 1, 0.22, 1) both;
}
.fp-hero__media {
  grid-column: 1 / -1;
  width: var(--fp-wide);
  margin: clamp(72px, 8vw, 126px) auto 0;
  position: relative;
  z-index: 1;
  animation: fpFadeUp 1.35s 0.12s cubic-bezier(0.19, 1, 0.22, 1) both;
}
.fp-hero__media img {
  aspect-ratio: 1360 / 560;
  height: auto;
  min-height: 0;
  max-height: 620px;
  object-fit: cover;
  border-radius: 4px;
}
.fp-kicker {
  display: block;
  margin: 0 0 clamp(28px, 3vw, 48px);
  font-family: var(--fp-sans);
  font-size: 12px;
  line-height: 1.1;
  letter-spacing: 0.28em;
  color: var(--fp-muted);
}
.fp-hero h1,
.fp-section-head h2,
.fp-lead-title {
  margin: 0;
  font-weight: 400;
  letter-spacing: 0.12em;
}
.fp-hero h1 {
  display: grid;
  grid-template-columns: max-content minmax(0, 1fr);
  gap: 14px;
  align-items: start;
  font-size: clamp(15px, 1.25vw, 18px);
  line-height: 1.9;
  letter-spacing: 0.11em;
}
.fp-hero h1::before {
  content: "";
  width: 18px;
  height: 1px;
  margin-top: 0.9em;
  background: currentColor;
}
.fp-hero .fp-kicker {
  margin: 0 0 clamp(20px, 2vw, 30px);
  color: var(--fp-ink);
  font-size: clamp(62px, 8vw, 112px);
  line-height: 0.92;
  letter-spacing: 0.015em;
  text-transform: none;
}
.fp-hero__lead {
  max-width: 720px;
  margin: clamp(46px, 5vw, 72px) 0 0;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #4e5049;
}
.fp-service-logo {
  width: min(280px, 72vw);
  margin: 0 0 clamp(34px, 4vw, 54px);
}
.fp-service-logo img {
  width: 100%;
}
.fp-section {
  position: relative;
  padding: clamp(88px, 9.5vw, 150px) 0;
  background: var(--fp-paper);
}
.fp-section--deep {
  background: var(--fp-paper-deep);
}
.fp-section + .fp-section {
  border-top: 0;
}
.fp-section-head {
  display: flex;
  flex-direction: column;
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(38px, 5vw, 72px);
}
.fp-section-head > div {
  display: contents;
}
.fp-section-head h2,
.fp-lead-title {
  font-size: clamp(24px, 2.3vw, 34px);
  line-height: 1.72;
}
.fp-section-head h2 {
  order: 1;
}
.fp-section-head .fp-kicker {
  order: 2;
  margin: 14px 0 0;
  color: #55574f;
  font-size: clamp(16px, 1.35vw, 20px);
  letter-spacing: 0.02em;
  text-transform: none;
}
.fp-section-head p {
  order: 3;
  max-width: 760px;
  margin: clamp(30px, 3.4vw, 48px) 0 0;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #4e5049;
}
.fp-split {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(48px, 6vw, 90px);
  align-items: start;
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto;
}
.fp-split__media {
  grid-column: 1 / 8;
}
.fp-split__media img {
  aspect-ratio: 540 / 380;
  object-fit: cover;
  border-radius: 4px;
}
.fp-split__body {
  grid-column: 8 / 13;
  display: flex;
  flex-direction: column;
  padding-top: clamp(8px, 2vw, 34px);
}
.fp-split--reverse .fp-split__media {
  grid-column: 6 / 13;
  order: 2;
}
.fp-split--reverse .fp-split__body {
  grid-column: 1 / 6;
}
.fp-body {
  order: 3;
  margin: 0;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.08em;
  color: #444741;
}
.fp-body + .fp-body {
  margin-top: 18px;
}
.fp-split__body > .fp-kicker {
  order: 2;
  margin: 12px 0 clamp(30px, 3vw, 46px);
  color: #55574f;
  font-size: clamp(16px, 1.25vw, 19px);
  letter-spacing: 0.02em;
  text-transform: none;
}
.fp-split__body > .fp-lead-title {
  order: 1;
}
.fp-split__body > .fp-link {
  order: 4;
}
.fp-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(72px, 8vw, 126px) clamp(38px, 5vw, 72px);
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto;
}
.fp-card-grid--2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fp-card-grid--4 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.fp-card-grid--architect {
  grid-template-columns: repeat(3, minmax(0, 232px));
  justify-content: space-between;
  gap: clamp(64px, 7vw, 104px) clamp(64px, 7vw, 116px);
  width: min(980px, calc(100vw - 80px));
  max-width: none;
}
.fp-section-inner {
  margin-top: clamp(54px, 6vw, 90px);
}
.fp-card {
  position: relative;
}
.fp-card--text {
  padding-top: clamp(30px, 3vw, 44px);
  border-top: 1px solid var(--fp-line);
}
.fp-card__image {
  overflow: hidden;
  border-radius: 4px;
  background: #ddd6ca;
}
.fp-card__image img {
  aspect-ratio: 1.14;
  height: 100%;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1);
}
.fp-card:hover .fp-card__image img {
  transform: scale(1.045);
}
.fp-card__body {
  padding: clamp(30px, 3.4vw, 44px) 0 0;
}
.fp-card__en {
  display: block;
  margin: 0 0 14px;
  font-family: var(--fp-sans);
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.1;
  letter-spacing: 0.02em;
  color: #565851;
}
.fp-card h3 {
  margin: 0 0 22px;
  font-weight: 400;
  font-size: clamp(18px, 1.45vw, 24px);
  line-height: 1.7;
  letter-spacing: 0.1em;
}
.fp-card p {
  margin: 0;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.07em;
  color: #4e5049;
}
.fp-card__role {
  margin: -10px 0 18px !important;
  color: var(--fp-muted) !important;
}
.fp-card-grid--architect .fp-card__image img {
  aspect-ratio: 4/5;
  object-position: center top;
}
.fp-card-grid--renov {
  width: min(1440px, calc(100vw - 160px));
  grid-template-columns: minmax(0, 1.05fr) minmax(360px, 0.95fr);
  column-gap: clamp(58px, 6vw, 104px);
  align-items: start;
}
.fp-card-grid--renov .fp-card:first-child .fp-card__image img {
  aspect-ratio: 0.9;
  min-height: clamp(640px, 55vw, 860px);
}
.fp-card-grid--renov .fp-card-grid__side {
  display: grid;
  gap: clamp(42px, 4vw, 64px);
  align-self: start;
}
.fp-card-grid--renov .fp-card-grid__side .fp-card {
  display: grid;
  grid-template-columns: minmax(220px, 0.72fr) minmax(0, 1fr);
  gap: clamp(28px, 3vw, 48px);
  align-items: stretch;
}
.fp-card-grid--renov .fp-card-grid__side .fp-card__image {
  align-self: stretch;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: auto;
  position: relative;
}
.fp-card-grid--renov .fp-card-grid__side .fp-card__image img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100% !important;
  min-height: 0;
  aspect-ratio: auto;
  object-fit: cover;
}
.fp-card-grid--renov .fp-card-grid__side .fp-card__body {
  padding-top: 0;
}
.fp-card-grid--reform {
  width: min(1120px, calc(100vw - 96px));
  grid-template-columns: 1fr;
  gap: clamp(64px, 7vw, 96px);
}
.fp-card-grid--reform .fp-card {
  display: grid;
  grid-template-columns: minmax(360px, 0.82fr) minmax(0, 1fr);
  gap: clamp(48px, 5.8vw, 74px);
  align-items: stretch;
}
.fp-card-grid--reform .fp-card__image {
  align-self: start;
  width: 100%;
  height: auto;
  min-height: 0;
  aspect-ratio: 4 / 3;
  position: relative;
}
.fp-card-grid--reform .fp-card__image img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100% !important;
  min-height: 0;
  aspect-ratio: auto;
  object-fit: cover;
}
.fp-card-grid--reform .fp-card__body {
  padding-top: 0;
}
.fp-award-feature {
  width: var(--fp-wide);
  max-width: none;
  margin: 0 auto;
  position: relative;
  padding-top: clamp(8px, 1.8vw, 28px);
}
.fp-award-feature::before {
  display: none;
}
.fp-award-feature > figure,
.fp-award-grid figure,
.fp-gallery-mosaic figure {
  overflow: hidden;
  border-radius: 4px;
  background: #ddd6ca;
}
.fp-award-feature > figure {
  margin: 0;
  position: relative;
}
.fp-award-feature > figure img {
  aspect-ratio: 1;
  height: 100%;
  object-fit: cover;
}
.fp-award-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: clamp(16px, 1.8vw, 28px);
  position: relative;
  align-items: start;
}
.fp-award-grid figure {
  margin: 0;
  position: relative;
  aspect-ratio: 1;
  cursor: pointer;
}
.fp-award-grid img {
  height: 100%;
  object-fit: cover;
}
.fp-award-grid figure:nth-child(3n + 1) {
  margin-top: 0;
}
.fp-award-grid figure:nth-child(3n + 3) {
  margin-top: 0;
}
.fp-award-feature img {
  display: block;
  width: 100%;
  transform: scale(1.001);
  transition: transform 0.45s cubic-bezier(0.2, 0.74, 0.16, 1),
    opacity 0.45s ease;
}
.fp-award-grid figure:hover img,
.fp-award-grid figure:focus-visible img {
  transform: scale(1.035);
}
.fp-award-feature.is-award-enhanced figure,
.fp-award-feature.is-award-enhanced figure:not(.is-award-visible),
.fp-award-feature.is-award-enhanced figure.is-award-visible {
  opacity: 1;
  transform: translateY(0);
}
.fp-award-feature.is-award-enhanced .fp-award-grid figure:nth-child(5n + 2) {
  transition-delay: 0.06s;
}
.fp-award-feature.is-award-enhanced .fp-award-grid figure:nth-child(5n + 3) {
  transition-delay: 0.12s;
}
.fp-award-feature.is-award-enhanced .fp-award-grid figure:nth-child(5n + 4) {
  transition-delay: 0.18s;
}
.fp-award-feature.is-award-enhanced .fp-award-grid figure:nth-child(5n) {
  transition-delay: 0.24s;
}
.is-fp-lightbox-open {
  overflow: hidden;
}
.fp-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  padding: clamp(22px, 4vw, 64px);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.34s ease, visibility 0.34s ease;
}
.fp-lightbox.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
.fp-lightbox__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(32, 29, 25, 0.78);
  backdrop-filter: blur(10px);
}
.fp-lightbox__figure {
  position: relative;
  z-index: 1;
  margin: 0;
  max-width: min(88vw, 1180px);
  max-height: 82svh;
  overflow: hidden;
  border-radius: 4px;
  background: #ddd6ca;
  box-shadow: 0 34px 120px rgba(0, 0, 0, 0.34);
  transform: translateY(18px) scale(0.985);
  transition: transform 0.42s cubic-bezier(0.2, 0.74, 0.16, 1);
}
.fp-lightbox.is-open .fp-lightbox__figure {
  transform: translateY(0) scale(1);
}
.fp-lightbox__image {
  display: block;
  max-width: min(88vw, 1180px);
  max-height: 82svh;
  width: auto;
  height: auto;
  object-fit: contain;
}
.fp-lightbox__button {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border: 1px solid rgba(246, 240, 230, 0.45);
  border-radius: 999px;
  background: rgba(246, 240, 230, 0.1);
  color: #f6f0e6;
  font-family: var(--fp-serif);
  font-size: 30px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.25s ease, border-color 0.25s ease;
}
.fp-lightbox__button:hover,
.fp-lightbox__button:focus-visible {
  background: rgba(246, 240, 230, 0.2);
  border-color: rgba(246, 240, 230, 0.76);
}
.fp-lightbox__button--close {
  top: clamp(18px, 3vw, 42px);
  right: clamp(18px, 3vw, 42px);
}
.fp-lightbox__button--prev {
  left: clamp(18px, 3vw, 42px);
  top: 50%;
  transform: translateY(-50%);
}
.fp-lightbox__button--next {
  right: clamp(18px, 3vw, 42px);
  top: 50%;
  transform: translateY(-50%);
}
.fp-gallery-mosaic {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(20px, 2.8vw, 40px);
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto;
}
.fp-gallery-mosaic figure:first-child {
  grid-column: span 2;
}
.fp-gallery-mosaic--triptych {
  grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.9fr);
}
.fp-gallery-mosaic--triptych figure:first-child {
  grid-row: span 2;
}
.fp-gallery-mosaic--triptych figure:first-child img {
  aspect-ratio: 1.02;
}
.fp-gallery-mosaic img {
  aspect-ratio: 1.35;
  height: 100%;
  object-fit: cover;
}
.fp-link {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  margin-top: clamp(28px, 3vw, 44px);
  font-family: var(--fp-sans);
  font-size: 15px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #2f2d28;
}
.fp-link::before {
  content: "";
  width: 42px;
  height: 1px;
  background: rgba(48, 45, 39, 0.34);
  transition: width 0.45s cubic-bezier(0.19, 1, 0.22, 1);
}
.fp-link:hover::before {
  width: 68px;
}
.fp-list {
  display: grid;
  gap: 1px;
  width: min(900px, calc(100vw - 80px));
  max-width: none;
  margin: 0 auto;
  background: var(--fp-line);
}
.fp-list__row {
  display: grid;
  grid-template-columns: minmax(130px, 220px) minmax(0, 1fr);
  gap: clamp(26px, 5vw, 80px);
  padding: clamp(26px, 3vw, 40px) 4px;
  background: var(--fp-paper);
}
.fp-list__term {
  font-family: var(--fp-sans);
  font-size: 15px;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--fp-muted);
}
.fp-list__desc {
  font-size: 15px;
  line-height: 1.85;
  letter-spacing: 0.06em;
}
.fp-archive {
  padding: clamp(170px, 17vw, 250px) 0 clamp(110px, 12vw, 180px);
}
.fp-archive__head {
  display: block;
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(64px, 7vw, 104px);
  padding-left: clamp(28px, 3.5vw, 58px);
  border-left: 1px solid var(--fp-line);
}
.fp-archive__head h1 {
  margin: 0;
  font-family: var(--fp-sans);
  font-size: clamp(62px, 8vw, 112px);
  font-weight: 400;
  line-height: 0.92;
  letter-spacing: 0.015em;
}
.fp-archive__head p {
  max-width: 720px;
  margin: clamp(40px, 5vw, 70px) 0 0;
  font-size: 15px;
  line-height: 2;
  letter-spacing: 0.08em;
}
.fp-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(58px, 6vw, 92px);
  font-family: var(--fp-sans);
  font-size: 14px;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--fp-muted);
}
.fp-filter a.is-current,
.fp-filter a:hover {
  color: var(--fp-ink);
}
.fp-post-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(76px, 8.5vw, 132px) clamp(38px, 5vw, 72px);
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto;
}
.fp-post {
  display: block;
}
.fp-post__thumb {
  overflow: hidden;
  border-radius: 4px;
  background: #ddd6ca;
}
.fp-post__thumb img {
  aspect-ratio: 1.24;
  object-fit: cover;
  transition: transform 1.1s cubic-bezier(0.19, 1, 0.22, 1);
}
.fp-post:hover .fp-post__thumb img {
  transform: scale(1.045);
}
/* サムネなしのブログカード（オーナー指示 2026-07-21）: 上罫で区切る編集的リスト */
.fp-post--nothumb {
  border-top: 1px solid rgba(32, 33, 29, 0.16);
  padding-top: clamp(22px, 2.4vw, 34px);
}
.fp-post--nothumb .fp-post__meta {
  margin-top: 0;
}
.fp-post__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin: 24px 0 12px;
  font-family: var(--fp-sans);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--fp-muted);
}
.fp-post h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(18px, 1.35vw, 22px);
  line-height: 1.8;
  letter-spacing: 0.08em;
}
.fp-post__excerpt {
  margin: 18px 0 0;
  font-size: 13px;
  line-height: 1.9;
  letter-spacing: 0.06em;
  color: #5a554d;
}
.fp-pagination {
  width: var(--fp-inner);
  max-width: none;
  margin: clamp(70px, 8vw, 112px) auto 0;
}
.fp-pagination .c-pagination-list {
  justify-content: flex-start;
}
.fp-single {
  padding: clamp(170px, 17vw, 250px) 0 clamp(110px, 12vw, 180px);
}
.fp-single-hero {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(44px, 5vw, 78px);
  align-items: start;
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(74px, 8vw, 128px);
}
.fp-single-hero__copy {
  grid-column: 1 / 13;
}
.fp-single-hero__media {
  grid-column: 7 / 13;
}
.fp-single-hero__media img {
  aspect-ratio: 1.22;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}
.fp-single h1 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(30px, 4vw, 62px);
  line-height: 1.42;
  letter-spacing: 0.1em;
}
.fp-single-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  margin: 26px 0 0;
  font-family: var(--fp-sans);
  font-size: 13px;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--fp-muted);
}
.fp-single-intro {
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(86px, 9vw, 140px);
  display: grid;
  grid-template-columns: minmax(190px, 28%) minmax(0, 680px);
  gap: clamp(42px, 7vw, 112px);
  align-items: start;
  border-top: 1px solid var(--fp-line);
  padding-top: clamp(40px, 5vw, 68px);
}
.fp-single-intro h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(22px, 2.1vw, 34px);
  line-height: 1.75;
  letter-spacing: 0.1em;
}
.fp-single-intro p {
  margin: 0;
  font-size: clamp(16px, 1.25vw, 20px);
  line-height: 2.15;
  letter-spacing: 0.065em;
  color: #3f423c;
}
.fp-single-body {
  width: var(--fp-inner);
  max-width: 780px;
  margin: 0 auto;
  font-size: 16px;
  line-height: 2.15;
  letter-spacing: 0.06em;
}
.fp-single-body :is(h2, h3, h4) {
  margin: 3.2em 0 1em;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: 0.1em;
}
.fp-single-body p {
  margin: 0 0 2.1em;
}
.fp-single-body img {
  height: auto;
  margin: 3.75em 0;
  border-radius: 4px;
}
.fp-single-gallery {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: clamp(22px, 3vw, 44px);
  width: var(--fp-inner);
  max-width: none;
  margin: 0 auto clamp(90px, 10vw, 150px);
}
.fp-single-gallery figure {
  margin: 0;
  grid-column: span 6;
}
.fp-single-gallery figure:nth-child(3n + 1) {
  grid-column: span 8;
}
.fp-single-gallery img {
  aspect-ratio: 1.3;
  height: 100%;
  object-fit: cover;
  border-radius: 4px;
}
.fp-single-gallery figure:nth-child(3n + 1) img {
  aspect-ratio: 1.55;
}
.fp-single-detail {
  margin: 0 auto clamp(90px, 10vw, 150px);
}
.fp-single-related {
  margin-top: clamp(100px, 11vw, 170px);
}
.fp-single-related .fp-section-head {
  margin-bottom: clamp(42px, 5vw, 72px);
}
.fp-contact-form {
  width: min(780px, calc(100vw - 80px));
  max-width: none;
  margin: 0 auto;
}
.fp-contact-form .wpcf7-form p {
  margin: 0 0 36px;
  font-size: 14px;
  line-height: 2;
  letter-spacing: 0.06em;
}
.fp-contact-form input:not([type="submit"]),
.fp-contact-form textarea,
.fp-contact-form select {
  width: 100%;
  border: 0;
  border-bottom: 1px solid rgba(48, 45, 39, 0.28);
  border-radius: 0;
  padding: 14px 0;
  background: transparent;
  color: var(--fp-ink);
  font-family: var(--fp-serif);
  font-size: 16px;
}
.fp-contact-form textarea {
  min-height: 180px;
}
.fp-contact-form input[type="submit"] {
  min-width: 220px;
  border: 1px solid rgba(48, 45, 39, 0.34);
  border-radius: 0;
  padding: 18px 32px;
  background: transparent;
  color: var(--fp-ink);
  font-family: var(--fp-sans);
  font-size: 12px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  cursor: pointer;
}
.fp-map {
  overflow: hidden;
  border-radius: 4px;
  background: #ddd6ca;
}
.fp-map iframe {
  display: block;
  width: 100%;
  height: min(52vw, 460px);
  border: 0;
  filter: saturate(0.72) contrast(0.9);
}
.fp-cta {
  padding: clamp(96px, 11vw, 160px) 0;
  background: #24231f;
  color: #f6f0e6;
  text-align: center;
}
.fp-cta .fp-kicker {
  color: #b8ae9c;
}
.fp-cta h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(24px, 2.4vw, 34px);
  line-height: 1.8;
  letter-spacing: 0.13em;
}
.fp-cta .fp-link {
  margin-top: clamp(44px, 5vw, 70px);
  color: #f6f0e6;
}
.fp-cta .fp-link::before {
  background: rgba(246, 240, 230, 0.42);
}

@keyframes fpFadeUp {
  from {
    opacity: 0;
    transform: translateY(36px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 1024px) {
  .m-page {
    --fp-inner: calc(100vw - var(--fp-gutter) - var(--fp-gutter));
    --fp-wide: calc(100vw - var(--fp-gutter) - var(--fp-gutter));
  }
  .fp-hero {
    grid-template-columns: 1fr;
    min-height: auto;
    padding: 150px 0 110px;
  }
  .fp-hero__copy,
  .fp-hero__media {
    grid-column: 1;
  }
  .fp-hero__media img {
    min-height: 0;
    height: auto;
    aspect-ratio: 12 / 5; /* スマホKVを横長にして縦幅を抑える */
  }
  .fp-section-head,
  .fp-archive__head {
    width: var(--fp-inner);
  }
  .fp-split,
  .fp-split--reverse {
    grid-template-columns: 1fr;
    gap: 42px;
  }
  .fp-split__media,
  .fp-split__body,
  .fp-split--reverse .fp-split__media,
  .fp-split--reverse .fp-split__body {
    grid-column: 1;
    order: initial;
  }
  .fp-card-grid,
  .fp-card-grid--2,
  .fp-card-grid--4,
  .fp-card-grid--architect,
  .fp-post-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 62px 36px;
  }
  .fp-card-grid--renov {
    grid-template-columns: 1fr;
    width: var(--fp-inner);
    gap: 72px;
  }
  .fp-card-grid--renov .fp-card:first-child .fp-card__image img,
  .fp-card-grid--renov .fp-card-grid__side .fp-card__image img {
    aspect-ratio: 1.18;
    min-height: 0;
  }
  .fp-card-grid--renov .fp-card-grid__side .fp-card__image {
    height: auto;
    aspect-ratio: 1.18;
  }
  .fp-card-grid--renov .fp-card-grid__side .fp-card__image img {
    height: 100% !important;
  }
  .fp-card-grid--renov .fp-card-grid__side {
    gap: 72px;
  }
  .fp-card-grid--renov .fp-card-grid__side .fp-card {
    display: block;
    margin-top: 0;
  }
  .fp-card-grid--renov .fp-card-grid__side .fp-card__body {
    padding-top: clamp(30px, 3.4vw, 44px);
  }
  .fp-card-grid--reform {
    width: var(--fp-inner);
    gap: 72px;
  }
  .fp-card-grid--reform .fp-card {
    display: block;
    grid-template-columns: 1fr;
  }
  .fp-card-grid--reform .fp-card__image {
    height: auto;
    min-height: 0;
    aspect-ratio: 4 / 3;
  }
  .fp-card-grid--reform .fp-card__image img {
    position: static;
    height: 100% !important;
    aspect-ratio: 4 / 3;
  }
  .fp-card-grid--reform .fp-card__body {
    padding-top: clamp(30px, 3.4vw, 44px);
  }
  .fp-award-feature::before {
    display: none;
  }
  .fp-award-feature > figure {
    width: 100%;
    margin: 0 0 52px;
  }
  .fp-gallery-mosaic {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .fp-award-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 24px;
  }
  .fp-award-grid figure:nth-child(n) {
    margin-top: 0;
  }
  .fp-gallery-mosaic--triptych {
    grid-template-columns: 1fr;
  }
  .fp-gallery-mosaic--triptych figure:first-child {
    grid-row: auto;
  }
  .fp-single-hero {
    grid-template-columns: 1fr;
  }
  .fp-single-hero__copy,
  .fp-single-hero__media {
    grid-column: 1;
  }
  .fp-single-intro {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

@media (max-width: 700px) {
  .m-page {
    --fp-inner: calc(100vw - var(--fp-gutter) - var(--fp-gutter));
    --fp-wide: calc(100vw - var(--fp-gutter) - var(--fp-gutter));
  }
  .fp-hero,
  .fp-section,
  .fp-archive,
  .fp-cta {
    padding-left: 0;
    padding-right: 0;
  }
  .fp-hero {
    padding-top: 126px;
    padding-bottom: 82px;
  }
  .fp-hero__copy {
    padding-left: 24px;
  }
  .fp-section,
  .fp-archive,
  .fp-single,
  .fp-cta {
    padding-top: 88px;
    padding-bottom: 88px;
  }
  .fp-hero h1 {
    font-size: 14px;
    line-height: 1.9;
  }
  .fp-hero .fp-kicker {
    font-size: clamp(54px, 17vw, 72px);
  }
  .fp-kicker {
    margin-bottom: 28px;
    font-size: 11px;
  }
  .fp-section-head h2,
  .fp-lead-title {
    font-size: 24px;
  }
  .fp-section-head {
    margin-bottom: 34px;
  }
  .fp-card-grid,
  .fp-card-grid--2,
  .fp-card-grid--4,
  .fp-card-grid--architect,
  .fp-post-grid {
    grid-template-columns: 1fr;
    gap: 58px;
  }
  .fp-award-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
  }
  .fp-gallery-mosaic {
    grid-template-columns: 1fr;
  }
  .fp-gallery-mosaic figure:first-child {
    grid-column: 1;
  }
  .fp-single {
    padding-left: 0;
    padding-right: 0;
  }
  .fp-single h1 {
    font-size: 28px;
  }
  .fp-single-intro {
    margin-bottom: 78px;
    padding-top: 36px;
  }
  .fp-single-gallery {
    grid-template-columns: 1fr;
  }
  .fp-single-gallery figure,
  .fp-single-gallery figure:nth-child(3n + 1) {
    grid-column: 1;
  }
  .fp-single-gallery img,
  .fp-single-gallery figure:nth-child(3n + 1) img {
    aspect-ratio: 1.24;
  }
  .fp-list__row {
    grid-template-columns: 1fr;
    gap: 20px;
    padding: 38px 0;
  }
  .fp-archive__head h1 {
    font-size: 58px;
  }
  .fp-filter {
    gap: 12px 20px;
  }
}

/* Global: keep every page image square-edged */
body img,
body picture,
body figure,
body .wp-block-image,
body .wp-block-gallery,
body .image-mask,
body
  :where(
    [class$="__image"],
    [class$="__media"],
    [class*="-image"],
    [class*="-media"],
    [class*="visual"]
  ):has(img) {
  border-radius: 0 !important;
}

/* High-end product language: Lexus precision, architectural restraint */
.m-page {
  --fp-paper: #f4f1eb;
  --fp-paper-deep: #ebe7df;
  --fp-ink: #171916;
  --fp-muted: #666860;
  --fp-line: rgba(23, 25, 22, 0.16);
  --fp-mask-ease: cubic-bezier(0.61, 1, 0.88, 1);
  background-image: linear-gradient(
      90deg,
      rgba(23, 25, 22, 0.035) 1px,
      transparent 1px
    ),
    linear-gradient(180deg, rgba(255, 255, 255, 0.48), transparent 360px);
  background-size: min(7.5vw, 112px) 100%, 100% 100%;
}
.m-page::before {
  content: "";
  position: fixed;
  left: 0;
  right: 0;
  top: 0;
  z-index: 20;
  height: 1px;
  background: rgba(23, 25, 22, 0.18);
  pointer-events: none;
}
.fp-hero {
  padding-top: 190px;
}
.fp-hero::before {
  opacity: 0.06;
}
.fp-hero::after {
  width: min(520px, 34vw);
  background: linear-gradient(
    90deg,
    transparent,
    rgba(23, 25, 22, 0.32),
    transparent
  );
}
.fp-hero__copy,
.fp-archive__head {
  padding-left: 0;
  border-left: 0;
}
.fp-hero__copy::before,
.fp-archive__head::before {
  content: "";
  display: block;
  width: 92px;
  height: 1px;
  margin: 0 0 42px;
  background: rgba(23, 25, 22, 0.42);
}
.fp-hero .fp-kicker,
.fp-archive__head h1 {
  font-family: var(--fp-sans);
  letter-spacing: 0.01em;
}
.fp-hero__lead,
.fp-section-head p,
.fp-body,
.fp-card p,
.fp-single-body {
  color: #3f423c;
}
.fp-hero__media,
.fp-single-hero__media {
  width: min(1480px, calc(100vw - 72px));
}
.fp-hero__media::before,
.fp-single-hero__media::before {
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  margin: 0 0 18px;
  background: linear-gradient(90deg, rgba(23, 25, 22, 0.28), transparent);
}
.fp-hero__media img,
.fp-single-hero__media img,
.fp-split__media img,
.fp-card__image img,
.fp-post__thumb img,
.fp-gallery-mosaic img,
.fp-single-gallery img {
  filter: saturate(0.92) contrast(1.02);
}
.fp-section {
  padding-top: 136px;
  padding-bottom: 136px;
}
.fp-section--deep {
  background: linear-gradient(
      180deg,
      rgba(23, 25, 22, 0.035),
      rgba(255, 255, 255, 0) 36%
    ),
    var(--fp-paper-deep);
}
.fp-section-head {
  display: grid;
  grid-template-columns: minmax(160px, 280px) minmax(0, 1fr);
  gap: 72px;
  padding-top: 38px;
  border-top: 1px solid var(--fp-line);
}
.fp-section-head > div {
  display: block;
  grid-column: 2;
}
.fp-section-head h2 {
  order: initial;
}
.fp-section-head .fp-kicker {
  order: initial;
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  color: var(--fp-muted);
  font-size: 12px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}
.fp-section-head p {
  max-width: 700px;
  margin-top: 34px;
}
.fp-lead-title {
  position: relative;
  padding-top: 32px;
}
.fp-lead-title::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 78px;
  height: 1px;
  background: rgba(23, 25, 22, 0.34);
}
.fp-split {
  width: var(--fp-wide);
  gap: 88px;
  align-items: center;
}
.fp-split__body {
  padding-top: 0;
}
.fp-card-grid,
.fp-post-grid {
  width: var(--fp-wide);
  gap: 72px 42px;
}
.fp-card {
  border-top: 1px solid var(--fp-line);
  padding-top: 22px;
}
.fp-card--text {
  padding: 34px 0 0;
}
.fp-card__image,
.fp-post__thumb,
.fp-gallery-mosaic figure,
.fp-single-gallery figure {
  position: relative;
  background: #d8d3c9;
}
.fp-card__image::after,
.fp-post__thumb::after,
.fp-gallery-mosaic figure::after,
.fp-single-gallery figure::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(23, 25, 22, 0.08);
  pointer-events: none;
}
.fp-card__body {
  padding-top: 24px;
}
.fp-card__en,
.fp-post__meta,
.fp-single-meta,
.fp-list__term {
  font-family: var(--fp-sans);
  font-size: 12px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
}
.fp-card h3,
.fp-post h2 {
  line-height: 1.55;
}
.fp-link {
  gap: 18px;
  font-size: 12px;
  letter-spacing: 0.22em;
}
.fp-link::before {
  width: 56px;
  background: rgba(23, 25, 22, 0.42);
}
.fp-link:hover::before {
  width: 92px;
}
.fp-list {
  width: var(--fp-inner);
  background: transparent;
  border-top: 1px solid var(--fp-line);
}
.fp-list__row {
  padding: 30px 0;
  border-bottom: 1px solid var(--fp-line);
  background: transparent;
}
.fp-filter {
  padding: 18px 0;
  border-top: 1px solid var(--fp-line);
  border-bottom: 1px solid var(--fp-line);
}
.fp-filter a {
  position: relative;
}
.fp-filter a::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -18px;
  height: 1px;
  transform: scaleX(0);
  transform-origin: left;
  background: var(--fp-ink);
  transition: transform 0.32s ease;
}
.fp-filter a.is-current::after,
.fp-filter a:hover::after {
  transform: scaleX(1);
}
.fp-contact-form {
  padding-top: 16px;
  border-top: 1px solid var(--fp-line);
}
.fp-contact-form input[type="submit"] {
  min-width: 260px;
  background: #1e1f1c;
  color: #f5f1e8;
  border-color: #1e1f1c;
}
.fp-cta {
  background: #1f201d;
}
.m-page.has-fp-reveal .fp-section-head,
.m-page.has-fp-reveal .fp-split,
.m-page.has-fp-reveal .fp-card,
.m-page.has-fp-reveal .fp-post,
.m-page.has-fp-reveal .fp-list__row,
.m-page.has-fp-reveal .fp-gallery-mosaic figure,
.m-page.has-fp-reveal .fp-single-gallery figure,
.m-page.has-fp-reveal .fp-hero__copy,
.m-page.has-fp-reveal .fp-hero__media,
.m-page.has-fp-reveal .fp-single-hero__copy,
.m-page.has-fp-reveal .fp-single-hero__media {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.8s ease, transform 0.9s cubic-bezier(0.2, 0.74, 0.16, 1);
}
.m-page.has-fp-reveal .is-fp-visible {
  opacity: 1;
  transform: translateY(0);
}

.fp-image-statement {
  position: relative;
  width: min(1680px, calc(100vw - 80px));
  min-height: clamp(620px, 76vh, 920px);
  margin: clamp(112px, 11vw, 186px) auto;
  overflow: hidden;
  isolation: isolate;
  background: #ddd6ca;
  color: #fff;
}
.fp-image-statement__media {
  position: absolute;
  inset: 0;
  margin: 0;
}
.fp-image-statement__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: var(--fp-statement-position, center);
}
.fp-image-statement__copy {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: flex-start;
  min-height: inherit;
  width: min(720px, 100%);
  padding: clamp(58px, 7vw, 112px) clamp(32px, 7vw, 118px);
  text-shadow: 0 2px 18px rgba(18, 16, 13, 0.38);
}
.fp-image-statement--right .fp-image-statement__copy {
  margin-left: auto;
}
.fp-image-statement .fp-kicker {
  font-family: var(--fp-sans, var(--en-font, "Times New Roman", serif));
  color: rgba(255, 255, 255, 0.72);
}
.fp-image-statement h2 {
  margin: 0;
  font-weight: 400;
  font-size: clamp(42px, 5.2vw, 82px);
  line-height: 1.38;
  letter-spacing: 0.08em;
}
.fp-image-statement p {
  width: min(620px, 100%);
  margin: clamp(28px, 3.2vw, 48px) 0 0;
  font-size: clamp(15px, 1.12vw, 18px);
  line-height: 2.25;
  letter-spacing: 0.08em;
}
.m-page.has-fp-reveal .fp-image-statement__copy {
  opacity: 0;
  transform: translateY(28px);
  filter: blur(8px);
  transition: opacity 1.1s var(--fp-mask-ease),
    transform 1.1s var(--fp-mask-ease), filter 1.1s ease;
}
.m-page.has-fp-reveal
  .fp-image-statement.is-fp-visible
  .fp-image-statement__copy {
  opacity: 1;
  transform: none;
  filter: blur(0);
  transition-delay: 0.35s;
}

@media (max-width: 1024px) {
  .fp-section-head {
    grid-template-columns: 1fr;
    gap: 22px;
  }
  .fp-image-statement {
    width: calc(100vw - 48px);
    min-height: clamp(620px, 86vh, 820px);
    margin: 108px auto;
  }
  .fp-image-statement__copy {
    justify-content: flex-end;
    width: 100%;
    padding: 56px 28px;
  }
  .fp-image-statement h2 {
    font-size: clamp(34px, 10vw, 54px);
    line-height: 1.48;
  }
  .fp-image-statement p {
    font-size: 14px;
    line-height: 2.1;
  }
  .fp-section-head > div,
  .fp-section-head .fp-kicker {
    grid-column: 1;
  }
  .fp-split,
  .fp-card-grid,
  .fp-post-grid,
  .fp-hero__media,
  .fp-single-hero__media {
    width: var(--fp-inner);
  }
}

@media (max-width: 700px) {
  .fp-hero {
    padding-top: 132px;
  }
  .fp-image-statement {
    width: 100vw;
    min-height: 760px;
    margin: 96px 0;
  }
  .fp-image-statement__copy {
    padding: 58px 28px 72px;
  }
  .fp-image-statement p {
    width: min(330px, 100%);
  }
  .fp-section {
    padding-top: 96px;
    padding-bottom: 96px;
  }
  .fp-hero__copy::before,
  .fp-archive__head::before {
    margin-bottom: 30px;
  }
  .fp-section-head {
    padding-top: 28px;
  }
}

/* Top page alignment with the same high-end product language */
.m-site {
  background-image: linear-gradient(
      90deg,
      rgba(29, 32, 31, 0.035) 1px,
      transparent 1px
    ),
    linear-gradient(180deg, rgba(255, 255, 255, 0.42), transparent 360px);
  background-size: min(7.5vw, 112px) 100%, 100% 100%;
}
.m-site .section-kicker,
.work-row span,
.work-spec,
.m-text-link {
  color: #62645d;
}
.m-works,
.m-craft,
.m-company,
.m-contact {
  position: relative;
  border-top: 1px solid rgba(29, 32, 31, 0.14);
}
.m-works::before,
.m-craft::before,
.m-company::before {
  content: "";
  position: absolute;
  left: 9vw;
  top: 0;
  width: min(320px, 24vw);
  height: 1px;
  background: rgba(29, 32, 31, 0.34);
}
.work-row {
  gap: 9vw;
  padding-top: 42px;
  border-top: 1px solid rgba(29, 32, 31, 0.13);
}
.work-row .image-mask,
.m-company .image-mask {
  position: relative;
}
.work-row .image-mask::after,
.m-company .image-mask::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(29, 32, 31, 0.08);
  pointer-events: none;
}
.work-spec li {
  border-top-color: rgba(29, 32, 31, 0.16);
}
.m-company dl div {
  border-top-color: rgba(29, 32, 31, 0.16);
}
.contact-actions a {
  border-color: #1f201d;
}
.contact-actions a:first-child {
  background: #1f201d;
  color: #f5f1e8;
}

/* Legacy page template support */
.p-page-single {
  background: #f4f1eb;
  padding: 136px 0;
}
.p-page-single .l-inner-lv2 {
  width: min(
    980px,
    calc(
      100vw - clamp(24px, 5vw, 64px) - clamp(24px, 5vw, 64px)
    )
  );
  max-width: none;
}
.p-page-single__eyecatch {
  margin: 0 0 72px;
  padding-top: 20px;
  border-top: 1px solid rgba(23, 25, 22, 0.18);
}
.p-page-single__eyecatch img,
.p-page-single .wysiwyg-style-content img {
  filter: saturate(0.92) contrast(1.02);
}
.p-page-single__body {
  padding-top: 42px;
  border-top: 1px solid rgba(23, 25, 22, 0.14);
}
.p-page-single .wysiwyg-style-content :is(h2, h3) {
  font-weight: 400;
  letter-spacing: 0.1em;
}
.p-page-single .wysiwyg-style-content p {
  line-height: 2.05;
  letter-spacing: 0.055em;
  color: #3f423c;
}

@media (max-width: 700px) {
  .p-page-single {
    padding: 96px 0;
  }
  .p-page-single .l-inner-lv2 {
    width: calc(
      100vw - clamp(24px, 5vw, 64px) - clamp(24px, 5vw, 64px)
    );
  }
}

/* Remove decorative page backgrounds */
.m-page,
.m-site {
  background-image: none !important;
}
.fp-hero::before {
  display: none !important;
  background: none !important;
}

/* Editorial image rhythm for lower page content */
.m-page > .fp-section {
  padding-top: clamp(126px, 12vw, 190px);
  padding-bottom: clamp(126px, 12vw, 190px);
}
.m-page .fp-split {
  width: min(1540px, calc(100vw - 72px));
  gap: clamp(76px, 8vw, 150px);
  align-items: start;
}
.m-page .fp-split__media {
  grid-column: 1 / 9;
}
.m-page .fp-split__media img {
  aspect-ratio: 1.06;
  min-height: clamp(540px, 54vw, 860px);
  object-fit: cover;
}
.m-page .fp-split__body {
  grid-column: 9 / 13;
  max-width: 430px;
  padding-top: clamp(80px, 9vw, 150px);
}
.m-page .fp-split--reverse .fp-split__media {
  grid-column: 5 / 13;
  order: 2;
}
.m-page .fp-split--reverse .fp-split__body {
  grid-column: 1 / 5;
}
.m-page .fp-split--reverse .fp-split__media img {
  aspect-ratio: 1.5;
  min-height: clamp(440px, 40vw, 660px);
}
.m-page
  > .fp-section:nth-of-type(odd)
  .fp-split:not(.fp-split--reverse)
  .fp-split__media {
  grid-column: 1 / 8;
}
.m-page
  > .fp-section:nth-of-type(odd)
  .fp-split:not(.fp-split--reverse)
  .fp-split__media
  img {
  aspect-ratio: 1.58;
  min-height: clamp(420px, 38vw, 620px);
}
.m-page
  > .fp-section:nth-of-type(odd)
  .fp-split:not(.fp-split--reverse)
  .fp-split__body {
  grid-column: 8 / 13;
  padding-top: clamp(42px, 5vw, 86px);
}
.m-page .fp-gallery-mosaic {
  width: min(1580px, calc(100vw - 64px));
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: clamp(24px, 2.6vw, 48px);
  align-items: end;
}
.m-page .fp-gallery-mosaic figure {
  grid-column: span 4;
}
.m-page .fp-gallery-mosaic figure:first-child {
  grid-column: span 7;
  grid-row: span 2;
}
.m-page .fp-gallery-mosaic figure:nth-child(2) {
  grid-column: span 5;
  align-self: start;
  margin-top: clamp(70px, 7vw, 132px);
}
.m-page .fp-gallery-mosaic figure:nth-child(3) {
  grid-column: span 5;
}
.m-page .fp-gallery-mosaic img {
  aspect-ratio: 1.18;
}
.m-page .fp-gallery-mosaic figure:first-child img {
  aspect-ratio: 0.86;
  min-height: clamp(620px, 62vw, 920px);
}
.m-page .fp-gallery-mosaic figure:nth-child(2) img,
.m-page .fp-gallery-mosaic figure:nth-child(3) img {
  aspect-ratio: 1.52;
}
.m-page .fp-single-gallery {
  width: min(1580px, calc(100vw - 64px));
  gap: clamp(22px, 2.4vw, 44px);
}
.m-page .fp-single-gallery figure {
  grid-column: span 4;
}
.m-page .fp-single-gallery figure:nth-child(4n + 1) {
  grid-column: span 7;
}
.m-page .fp-single-gallery figure:nth-child(4n + 2) {
  grid-column: span 5;
  margin-top: clamp(64px, 6vw, 112px);
}
.m-page .fp-single-gallery figure:nth-child(4n + 3),
.m-page .fp-single-gallery figure:nth-child(4n) {
  grid-column: span 6;
}
.m-page .fp-single-gallery img {
  aspect-ratio: 1.18;
  min-height: clamp(340px, 32vw, 560px);
}
.m-page .fp-single-gallery figure:nth-child(4n + 1) img {
  aspect-ratio: 1.5;
  min-height: clamp(460px, 42vw, 720px);
}
.m-page .fp-single-body img {
  width: auto;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

@media (max-width: 980px) {
  .m-page .fp-split {
    width: var(--fp-inner);
    gap: clamp(46px, 8vw, 72px);
  }
  .m-page .fp-split__media,
  .m-page .fp-split--reverse .fp-split__media,
  .m-page
    > .fp-section:nth-of-type(odd)
    .fp-split:not(.fp-split--reverse)
    .fp-split__media {
    grid-column: 1 / -1;
    order: 0;
  }
  .m-page .fp-split__body,
  .m-page .fp-split--reverse .fp-split__body,
  .m-page
    > .fp-section:nth-of-type(odd)
    .fp-split:not(.fp-split--reverse)
    .fp-split__body {
    grid-column: 1 / -1;
    max-width: 680px;
    padding-top: 0;
  }
  .m-page .fp-split__media img,
  .m-page .fp-split--reverse .fp-split__media img,
  .m-page
    > .fp-section:nth-of-type(odd)
    .fp-split:not(.fp-split--reverse)
    .fp-split__media
    img {
    min-height: 0;
    aspect-ratio: 1.18;
  }
  .m-page .fp-gallery-mosaic figure,
  .m-page .fp-gallery-mosaic figure:first-child,
  .m-page .fp-gallery-mosaic figure:nth-child(2),
  .m-page .fp-gallery-mosaic figure:nth-child(3),
  .m-page .fp-single-gallery figure,
  .m-page .fp-single-gallery figure:nth-child(4n + 1),
  .m-page .fp-single-gallery figure:nth-child(4n + 2),
  .m-page .fp-single-gallery figure:nth-child(4n + 3),
  .m-page .fp-single-gallery figure:nth-child(4n) {
    grid-column: span 6;
    margin-top: 0;
  }
}

@media (max-width: 700px) {
  .m-page > .fp-section {
    padding-top: 104px;
    padding-bottom: 104px;
  }
  .m-page .fp-gallery-mosaic,
  .m-page .fp-single-gallery {
    width: var(--fp-inner);
  }
  .m-page .fp-gallery-mosaic figure,
  .m-page .fp-gallery-mosaic figure:first-child,
  .m-page .fp-gallery-mosaic figure:nth-child(2),
  .m-page .fp-gallery-mosaic figure:nth-child(3),
  .m-page .fp-single-gallery figure,
  .m-page .fp-single-gallery figure:nth-child(4n + 1),
  .m-page .fp-single-gallery figure:nth-child(4n + 2),
  .m-page .fp-single-gallery figure:nth-child(4n + 3),
  .m-page .fp-single-gallery figure:nth-child(4n) {
    grid-column: 1 / -1;
  }
  .m-page .fp-gallery-mosaic img,
  .m-page .fp-gallery-mosaic figure:first-child img,
  .m-page .fp-gallery-mosaic figure:nth-child(2) img,
  .m-page .fp-gallery-mosaic figure:nth-child(3) img,
  .m-page .fp-single-gallery img,
  .m-page .fp-single-gallery figure:nth-child(4n + 1) img {
    min-height: 0;
    aspect-ratio: 1.12;
  }
  .m-page .fp-single-body img {
    width: auto;
    max-width: 100%;
  }
}

/* Remove Lexus-style decorative rules */
.m-page::before,
.fp-hero::after,
.fp-hero h1::before,
.fp-hero__copy::before,
.fp-archive__head::before,
.fp-hero__media::before,
.fp-single-hero__media::before,
.fp-lead-title::before,
.fp-card__image::after,
.fp-post__thumb::after,
.fp-gallery-mosaic figure::after,
.fp-single-gallery figure::after,
.m-works::before,
.m-craft::before,
.m-company::before,
.work-row .image-mask::after,
.m-company .image-mask::after {
  content: none !important;
  display: none !important;
}
.fp-hero h1 {
  grid-template-columns: 1fr;
  gap: 0;
}
.fp-section-head,
.fp-card,
.fp-list,
.fp-list__row,
.fp-filter,
.fp-contact-form,
.work-row,
.m-works,
.m-craft,
.m-company,
.m-contact,
.p-page-single__eyecatch,
.p-page-single__body {
  border-top: 0 !important;
  border-bottom: 0 !important;
}
.fp-filter a::after {
  content: none !important;
  display: none !important;
}
.fp-card,
.fp-card--text,
.fp-list__row,
.work-row {
  padding-top: 0;
}
.fp-lead-title {
  padding-top: 0;
}

.fp-card-grid--stack {
  grid-template-columns: 1fr !important;
  width: min(1720px, calc(100vw - 160px));
  gap: 0;
  margin-left: auto;
  margin-right: auto;
}
.fp-card-grid--stack .fp-card {
  display: grid;
  grid-template-columns: minmax(260px, 430px) minmax(360px, 760px);
  column-gap: clamp(90px, 10vw, 190px);
  align-items: start;
  max-width: none;
  padding: clamp(82px, 7vw, 122px) 0 !important;
  border-top: 1px solid rgba(59, 55, 48, 0.13) !important;
}
.fp-card-grid--stack .fp-card:nth-child(even) {
  margin-left: 0;
}
.fp-card-grid--stack .fp-card:last-child {
  border-bottom: 1px solid rgba(59, 55, 48, 0.13) !important;
}
.fp-card-grid--stack .fp-card__en {
  grid-column: 1;
  grid-row: 1;
  margin: 0;
  color: #4a453d;
  font-family: var(--en-font);
  font-size: clamp(32px, 3vw, 52px);
  line-height: 1.08;
  letter-spacing: 0.04em;
  text-transform: none;
}
.fp-card-grid--stack .fp-card h3 {
  grid-column: 1;
  grid-row: 2;
  margin: 18px 0 0;
  font-size: clamp(18px, 1.35vw, 24px);
  line-height: 2;
  letter-spacing: 0.12em;
}
.fp-card-grid--stack .fp-card p {
  grid-column: 2;
  grid-row: 1 / span 2;
  max-width: 720px;
  margin: 0;
  padding-top: 4px;
  color: #555049;
  font-size: 14.5px;
  line-height: 2.55;
  letter-spacing: 0.07em;
}

@media (max-width: 700px) {
  .fp-card-grid--stack {
    width: var(--fp-inner);
    gap: 0;
  }
  .fp-card-grid--stack .fp-card,
  .fp-card-grid--stack .fp-card:nth-child(even) {
    display: block;
    max-width: none;
    margin-left: 0;
    padding: 64px 0 !important;
  }
  .fp-card-grid--stack .fp-card__en {
    font-size: 32px;
  }
  .fp-card-grid--stack .fp-card h3 {
    margin-top: 12px;
  }
  .fp-card-grid--stack .fp-card p {
    max-width: none;
    margin-top: 32px;
    padding-top: 0;
  }
}

/* AITOHUS-inspired quiet editorial rhythm */
.m-page {
  background: #f5f1ea;
}
.m-page > .fp-section {
  padding-top: clamp(144px, 13vw, 220px);
  padding-bottom: clamp(144px, 13vw, 220px);
}
.m-page .fp-section-head {
  width: min(1240px, calc(100vw - 104px));
  display: grid;
  grid-template-columns: minmax(132px, 0.28fr) minmax(0, 0.72fr);
  gap: clamp(54px, 6vw, 108px);
  align-items: start;
  margin-bottom: clamp(72px, 8vw, 128px);
}
.m-page .fp-section-head .fp-kicker {
  margin: clamp(14px, 1.8vw, 24px) 0 0;
  font-family: var(--fp-sans);
  font-size: 11px;
  line-height: 1;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: #747168;
}
.m-page .fp-section-head > div {
  max-width: 820px;
}
.m-page .fp-section-head h2 {
  font-size: clamp(46px, 6.4vw, 108px);
  line-height: 1.08;
  letter-spacing: 0.055em;
}
.m-page .fp-section-head p {
  max-width: 720px;
  margin-top: clamp(24px, 3.2vw, 46px);
  color: #4f4b43;
  font-size: clamp(14px, 1.05vw, 17px);
  line-height: 2.35;
  letter-spacing: 0.08em;
}
.m-page .fp-split,
.m-page .fp-card-grid,
.m-page .fp-post-grid,
.m-page .fp-gallery-mosaic,
.m-page .fp-single-gallery {
  position: relative;
}
.m-page .fp-card-grid--renov,
.m-page .fp-card-grid--reform {
  margin-top: clamp(34px, 4vw, 72px);
}
.m-page .fp-card__image,
.m-page .fp-post__thumb,
.m-page .fp-gallery-mosaic figure,
.m-page .fp-single-gallery figure,
.m-page .fp-image-statement__media,
.m-page .fp-split__media,
.m-page .fp-hero__media,
.m-page .fp-single-hero__media {
  background: #ebe6dc;
}
.m-page .fp-card__image img,
.m-page .fp-post__thumb img,
.m-page .fp-gallery-mosaic img,
.m-page .fp-single-gallery img,
.m-page .fp-image-statement__media img,
.m-page .fp-split__media img,
.m-page .fp-hero__media img,
.m-page .fp-single-hero__media img {
  transition: transform 1.8s cubic-bezier(0.19, 1, 0.22, 1);
}
.m-page.has-fp-reveal .fp-section-head,
.m-page.has-fp-reveal .fp-split,
.m-page.has-fp-reveal .fp-card,
.m-page.has-fp-reveal .fp-post,
.m-page.has-fp-reveal .fp-list__row,
.m-page.has-fp-reveal .fp-image-statement,
.m-page.has-fp-reveal .fp-gallery-mosaic figure,
.m-page.has-fp-reveal .fp-single-gallery figure,
.m-page.has-fp-reveal .fp-hero__copy,
.m-page.has-fp-reveal .fp-hero__media,
.m-page.has-fp-reveal .fp-single-hero__copy,
.m-page.has-fp-reveal .fp-single-hero__media {
  transform: translateY(42px);
  transition: opacity 1s ease, transform 1.2s cubic-bezier(0.19, 1, 0.22, 1);
}
.m-page.has-fp-reveal .fp-card:nth-child(2),
.m-page.has-fp-reveal .fp-gallery-mosaic figure:nth-child(2) {
  transition-delay: 0.08s;
}
.m-page.has-fp-reveal .fp-card:nth-child(3),
.m-page.has-fp-reveal .fp-gallery-mosaic figure:nth-child(3) {
  transition-delay: 0.16s;
}

/* Restore the same image reveal used on the top page. */
.reveal-image[data-reveal],
.m-site .reveal-image[data-reveal],
.philosophy-design .reveal-image[data-reveal] {
  opacity: 1;
  transform: none;
  filter: none;
  transition: none;
}

/* Home: AITOHUS-like intro and floating photo composition */
.home-intro {
  position: fixed;
  z-index: 120;
  inset: 0;
  display: grid;
  place-items: center;
  background: var(--f-paper);
  color: #77736a;
  pointer-events: auto;
}
.home-intro span {
  display: block;
  font-family: var(--f-sans);
  font-size: 13px;
  line-height: 1;
  letter-spacing: 0.34em;
  opacity: 0;
  transform: translateY(10px);
  animation: homeIntroLogo 1.05s cubic-bezier(0.19, 1, 0.22, 1) 0.18s forwards;
}
.is-ready .home-intro {
  pointer-events: none;
  animation: homeIntroOut 1.05s cubic-bezier(0.19, 1, 0.22, 1) 1.05s forwards;
}
@keyframes homeIntroLogo {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@keyframes homeIntroOut {
  to {
    opacity: 0;
    visibility: hidden;
  }
}

.m-hero {
  background: var(--f-paper);
}
.hero-visual {
  filter: saturate(0.72) brightness(0.68) contrast(1.04);
  transition: transform 3.4s var(--f-ease), filter 3.4s ease;
}
.hero-veil {
  background: linear-gradient(
      180deg,
      rgba(6, 7, 6, 0.48),
      rgba(6, 7, 6, 0.05) 42%,
      rgba(6, 7, 6, 0.48) 100%
    ),
    linear-gradient(
      90deg,
      rgba(6, 7, 6, 0.34),
      transparent 52%,
      rgba(6, 7, 6, 0.18)
    );
}
.residence-space {
  grid-template-columns: repeat(12, minmax(0, 1fr));
  row-gap: clamp(104px, 10vw, 168px);
  min-height: auto;
  padding: clamp(132px, 12vw, 210px) 5vw clamp(148px, 13vw, 230px);
  background: #f5f2eb;
}
.residence-main-visual {
  grid-column: 1 / 13;
  min-height: clamp(620px, 58vw, 900px);
  margin-top: 0;
}
.residence-primary {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  width: min(62vw, 980px);
  transform: translate(-50%, -50%);
}
.residence-primary .image-mask {
  height: auto;
  min-height: 0;
  aspect-ratio: 16 / 9;
}
.residence-detail-top {
  right: 6vw;
  top: 0;
  width: min(24vw, 380px);
}
.residence-detail-top .image-mask {
  aspect-ratio: 16 / 10;
}
.residence-copy {
  grid-column: 8 / 13;
  grid-row: 1;
  align-self: end;
  z-index: 3;
  max-width: 430px;
  padding: 0 0 clamp(32px, 5vw, 74px);
}
.m-site .residence-en {
  margin-bottom: 20px;
  font-size: clamp(56px, 7.4vw, 112px);
  letter-spacing: -0.01em;
}
.residence-sub {
  margin-bottom: clamp(42px, 4vw, 68px);
}
.residence-lower-small {
  top: 0;
  grid-column: 2 / 6;
  grid-row: 2;
  width: min(30vw, 470px);
  max-width: none;
}
.residence-lower-small .image-mask {
  aspect-ratio: 4 / 3;
}
.residence-lower-wide {
  top: clamp(28px, 4vw, 76px);
  grid-column: 7 / 13;
  grid-row: 2;
  width: 100%;
  max-width: none;
}
.residence-lower-wide .image-mask {
  aspect-ratio: 16 / 9;
}
.residence-space .reveal-image[data-reveal] {
  opacity: 0;
  translate: 0 42px;
  transition: opacity 1.1s cubic-bezier(0.19, 1, 0.22, 1),
    translate 1.35s cubic-bezier(0.19, 1, 0.22, 1);
}
.residence-space .reveal-image[data-reveal].is-visible {
  opacity: 1;
  translate: 0 0;
}
.residence-space .residence-detail-top[data-reveal] {
  transition-delay: 0.1s;
}
.residence-space .residence-lower-small[data-reveal] {
  transition-delay: 0.08s;
}
.residence-space .residence-lower-wide[data-reveal] {
  transition-delay: 0.18s;
}

@media (max-width: 900px) {
  .residence-space {
    display: block;
    min-height: 0;
    padding: 108px 0 132px;
  }
  .residence-main-visual {
    width: 100%;
    min-height: 650px;
    margin: 0;
  }
  .residence-primary {
    left: 0;
    top: 168px;
    width: 88vw;
    transform: none;
  }
  .residence-primary .image-mask {
    aspect-ratio: 4 / 3;
  }
  .residence-detail-top {
    right: 0;
    top: 0;
    width: 56vw;
  }
  .residence-detail-top .image-mask {
    aspect-ratio: 4 / 3;
  }
  .residence-copy {
    display: block;
    max-width: none;
    margin: 0 28px 96px;
    padding: 0;
  }
  .m-site .residence-en {
    font-size: clamp(64px, 18vw, 92px);
  }
  .residence-lower-small {
    display: block;
    width: 72vw;
    margin: 0 auto 80px 0;
  }
  .residence-lower-wide {
    display: block;
    width: 88vw;
    margin: 0 0 0 auto;
  }
}

@media (max-width: 700px) {
  .m-page > .fp-section {
    padding-top: 112px;
    padding-bottom: 112px;
  }
  .m-page .fp-section-head {
    width: var(--fp-inner);
    display: block;
    margin-bottom: 56px;
  }
  .m-page .fp-section-head .fp-kicker {
    margin: 0 0 24px;
  }
  .m-page .fp-section-head h2 {
    font-size: clamp(36px, 12vw, 58px);
  }
}

/* Home final composition: generous AITOHUS-style photo editorial layout. */
.m-site .image-mask,
.m-site .image-mask img {
  border-radius: 0 !important;
}
.residence-space {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.78fr);
  column-gap: clamp(72px, 8vw, 150px);
  row-gap: clamp(120px, 13vw, 210px);
  align-items: start;
  min-height: 0;
  padding: clamp(156px, 13vw, 230px) clamp(54px, 6vw, 112px)
    clamp(170px, 14vw, 250px);
}
.residence-main-visual {
  position: relative;
  grid-column: 1;
  grid-row: 1;
  min-height: 0;
  margin: clamp(80px, 7vw, 132px) 0 0;
}
.residence-primary {
  position: relative;
  left: auto;
  top: auto;
  z-index: 1;
  width: 100%;
  transform: none;
}
.residence-primary .image-mask {
  height: auto;
  min-height: 0;
  aspect-ratio: 4 / 5;
}
.residence-detail-top {
  position: absolute;
  right: clamp(-96px, -5vw, -52px);
  top: clamp(-116px, -6vw, -66px);
  z-index: 2;
  width: min(46%, 360px);
}
.residence-detail-top .image-mask {
  aspect-ratio: 16 / 10;
}
.residence-copy {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  max-width: 520px;
  padding: clamp(44px, 4vw, 82px) 0 0;
}
.m-site .residence-en {
  margin: 0 0 18px;
  font-size: clamp(78px, 8.5vw, 132px);
}
.residence-sub {
  margin: 0 0 clamp(46px, 4.8vw, 76px);
}
.residence-lower-small {
  position: relative;
  top: 0;
  grid-column: 1;
  grid-row: 2;
  justify-self: start;
  width: min(64%, 520px);
  max-width: none;
  margin: 0;
}
.residence-lower-small .image-mask {
  aspect-ratio: 4 / 3;
}
.residence-lower-wide {
  position: relative;
  top: clamp(42px, 4vw, 84px);
  grid-column: 2;
  grid-row: 2;
  justify-self: stretch;
  width: 100%;
  max-width: none;
  margin: 0;
}
.residence-lower-wide .image-mask {
  aspect-ratio: 16 / 10;
}

@media (max-width: 900px) {
  .residence-space {
    display: block;
    padding: 112px 0 140px;
  }
  .residence-main-visual {
    min-height: 0;
    margin: 80px 0 72px;
  }
  .residence-primary {
    width: 86vw;
  }
  .residence-primary .image-mask {
    aspect-ratio: 4 / 5;
  }
  .residence-detail-top {
    right: 0;
    top: -72px;
    width: 48vw;
  }
  .residence-copy {
    max-width: none;
    margin: 0 28px 92px;
    padding: 0;
  }
  .m-site .residence-en {
    font-size: clamp(62px, 18vw, 96px);
  }
  .residence-lower-small {
    width: 72vw;
    margin: 0 auto 82px 0;
  }
  .residence-lower-wide {
    width: 88vw;
    margin: 0 0 0 auto;
    top: 0;
  }
}

/* Smooth the Margin collage: no mask edge, no horizontal bleed. */
body.l-home {
  overflow-x: hidden;
  background: #fff !important;
}
body.l-home .l-wrapper,
body.l-home .p-main,
.m-site,
.residence-space {
  max-width: 100vw;
  background: #fff;
}
.residence-space {
  overflow: hidden;
}

/* White canvas across the renewed site. */
body {
  background: #fff !important;
}
.m-site {
  --f-paper: #fff;
  --f-paper-soft: #fff;
  background: #fff !important;
  background-image: none !important;
}
.m-site
  :is(
    .opening-composed,
    .residence-space,
    .m-dialo,
    .m-works,
    .m-craft,
    .m-company,
    .m-contact
  ) {
  background-color: #fff !important;
  background-image: none !important;
}
body.l-philosophy,
body.l-concept,
body.l-philosophy .p-main,
body.l-concept .p-main,
.philosophy-design,
.r-philosophy.m-site {
  --pd-paper: #fff;
  --f-paper: #fff;
  --f-paper-soft: #fff;
  background: #fff !important;
  background-image: none !important;
}
.m-page {
  --fp-paper: #fff;
  --fp-paper-deep: #fff;
  background: #fff !important;
  background-image: none !important;
}
.m-page > .fp-section,
.m-page
  :is(
    .fp-card,
    .fp-card--text,
    .fp-list,
    .fp-list__row,
    .fp-post,
    .fp-filter,
    .fp-contact-form,
    .fp-single-body
  ),
.p-page-single {
  background-color: #fff !important;
  background-image: none !important;
}

@media (prefers-reduced-motion: reduce) {
  .home-intro {
    display: none !important;
  }
  .reveal-image[data-reveal],
  .m-site .reveal-image[data-reveal],
  .philosophy-design .reveal-image[data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
  .m-page.has-fp-reveal .fp-section-head,
  .m-page.has-fp-reveal .fp-split,
  .m-page.has-fp-reveal .fp-card,
  .m-page.has-fp-reveal .fp-post,
  .m-page.has-fp-reveal .fp-list__row,
  .m-page.has-fp-reveal .fp-image-statement,
  .m-page.has-fp-reveal .fp-image-statement__copy,
  .m-page.has-fp-reveal .fp-gallery-mosaic figure,
  .m-page.has-fp-reveal .fp-single-gallery figure,
  .m-page.has-fp-reveal .fp-hero__copy,
  .m-page.has-fp-reveal .fp-hero__media,
  .m-page.has-fp-reveal .fp-single-hero__copy,
  .m-page.has-fp-reveal .fp-single-hero__media {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Image reveal: soft white wipe from the reference recording. */
.home-intro {
  display: none !important;
}
.m-hero {
  background: #fff;
}
.hero-visual {
  filter: saturate(0.72) brightness(0.86) contrast(1.02);
  transform: scale(1.08);
  transition: transform 3.2s var(--f-ease), filter 3.2s ease;
}
.is-ready .hero-visual {
  transform: scale(1.015);
}
.hero-veil {
  background: linear-gradient(
    90deg,
    rgba(0, 0, 0, 0.18),
    rgba(0, 0, 0, 0.02) 50%,
    rgba(0, 0, 0, 0.12)
  );
}
/* reveal-image の figure は隠さない（opacity:1）。中の img は
   html.m-img-reveal 配下の斜めマスク拭き上げ（1.4s）で現れる。
   以前は figure を opacity:0 かつ transition:none にしていたため、
   img の拭き上げが figure の裏で完了し、is-visible 付与時に figure が
   opacity 0→1 を瞬間切替＝完成画像が「パッと」出ていた（Dialo等）。
   figure を常時表示にして、拭き上げを唯一の入場演出にする。 */
.reveal-image[data-reveal],
.m-site .reveal-image[data-reveal],
.philosophy-design .reveal-image[data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
  filter: none !important;
  transition: none !important;
  will-change: auto !important;
}
.reveal-image[data-reveal].is-visible,
.m-site .reveal-image[data-reveal].is-visible,
.philosophy-design .reveal-image[data-reveal].is-visible {
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
  filter: none !important;
}
.m-site [data-reveal]:not(.reveal-image),
.philosophy-design [data-reveal]:not(.reveal-image) {
  opacity: 0;
  transform: translateY(34px);
  filter: blur(8px);
  transition: opacity 1.2s var(--f-ease), transform 1.2s var(--f-ease),
    filter 1.2s ease;
}
.m-site [data-reveal].is-visible:not(.reveal-image),
.philosophy-design [data-reveal].is-visible:not(.reveal-image) {
  opacity: 1;
  transform: none;
  filter: blur(0);
}
.residence-space .reveal-image[data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
  transition: none !important;
}
.residence-space .reveal-image[data-reveal].is-visible {
  opacity: 1 !important;
  transform: none !important;
  translate: none !important;
}
.m-page.has-fp-reveal .fp-section-head,
.m-page.has-fp-reveal .fp-split,
.m-page.has-fp-reveal .fp-card,
.m-page.has-fp-reveal .fp-post,
.m-page.has-fp-reveal .fp-list__row,
.m-page.has-fp-reveal .fp-image-statement,
.m-page.has-fp-reveal .fp-gallery-mosaic figure,
.m-page.has-fp-reveal .fp-single-gallery figure,
.m-page.has-fp-reveal .fp-award-feature > figure,
.m-page.has-fp-reveal .fp-award-grid figure,
.m-page.has-fp-reveal .fp-hero__copy,
.m-page.has-fp-reveal .fp-hero__media,
.m-page.has-fp-reveal .fp-single-hero__copy,
.m-page.has-fp-reveal .fp-single-hero__media {
  opacity: 0;
  transform: translateY(28px);
  filter: none;
  transition: opacity 0.8s ease, transform 0.9s cubic-bezier(0.2, 0.74, 0.16, 1);
}
.m-page.has-fp-reveal .is-fp-visible {
  opacity: 1;
  transform: translateY(0);
  filter: none;
}
.m-page.has-fp-reveal
  :is(
    .fp-hero__media,
    .fp-single-hero__media,
    .fp-split__media,
    .fp-card__image,
    .fp-post__thumb,
    .fp-image-statement__media,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure,
    .fp-award-grid figure
  ):has(img) {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
}
.m-page.has-fp-reveal
  :is(
    .fp-hero__media.is-fp-visible,
    .fp-single-hero__media.is-fp-visible,
    .fp-split.is-fp-visible .fp-split__media,
    .fp-card.is-fp-visible .fp-card__image,
    .fp-post.is-fp-visible .fp-post__thumb,
    .fp-image-statement.is-fp-visible .fp-image-statement__media,
    .fp-gallery-mosaic figure.is-fp-visible,
    .fp-single-gallery figure.is-fp-visible,
    .fp-award-feature.is-fp-visible > figure,
    .fp-award-grid figure.is-fp-visible
  ):has(img) {
  opacity: 1 !important;
  transform: none !important;
}

/* Keep archive/work images from flashing a dark edge during reveal. */
.m-page
  :is(
    .fp-hero__media,
    .fp-single-hero__media,
    .fp-split__media,
    .fp-card__image,
    .fp-post__thumb,
    .fp-image-statement__media,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure,
    .fp-award-grid figure
  ) {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: var(--m-paper, #fff) !important; /* 白幕リビールの幕色 */
  contain: paint;
  transform: translate3d(0, 0, 0) !important;
  backface-visibility: hidden;
}
.m-page
  :is(
    .fp-card__image,
    .fp-post__thumb,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure
  )::after,
.m-page.has-fp-reveal
  :is(
    .fp-hero__media,
    .fp-single-hero__media,
    .fp-split__media,
    .fp-card__image,
    .fp-post__thumb,
    .fp-image-statement__media,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure,
    .fp-award-grid figure
  ):has(img)::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
}
.m-page.has-fp-reveal
  :is(
    .fp-hero__media,
    .fp-single-hero__media,
    .fp-split__media,
    .fp-card__image,
    .fp-post__thumb,
    .fp-image-statement__media,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure,
    .fp-award-grid figure
  ):has(img) {
  overflow: hidden;
  isolation: isolate;
  filter: none !important;
  clip-path: none !important;
  transition: none !important;
  will-change: auto;
}

/* Top works: avoid double reveal blur on image rows. */
.m-works .work-row[data-reveal] {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
.m-works .work-row > div {
  opacity: 0;
  transform: translate3d(0, 26px, 0);
  filter: blur(6px);
  transition: opacity 1.05s var(--f-ease), transform 1.05s var(--f-ease),
    filter 1.05s ease;
}
.m-works .work-row.is-visible > div {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}
.m-works .work-row .reveal-image {
  display: block;
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
.m-works .work-row .image-mask {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: var(--m-paper, #fff) !important; /* 白幕リビールの幕色 */
  filter: none !important;
  transform: translate3d(0, 0, 0) !important;
  backface-visibility: hidden;
  contain: paint;
}
.m-works .work-row .image-mask::after {
  content: none !important;
  display: none !important;
}
/* Philosophy opening: quiet motion behind the first statement. */
.philosophy-design .pd-opening {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: min(980px, 100svh);
  background: #fff;
}
.philosophy-design .pd-opening__video {
  position: absolute;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  opacity: 1;
  filter: saturate(0.98) contrast(1.04);
  pointer-events: none;
}
.philosophy-design .pd-opening::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.52) 0%,
      rgba(255, 255, 255, 0.24) 45%,
      rgba(255, 255, 255, 0.62) 100%
    ),
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.66) 0%,
      rgba(255, 255, 255, 0.18) 48%,
      rgba(255, 255, 255, 0.7) 100%
    );
}
.philosophy-design .pd-opening__copy,
.philosophy-design .pd-opening__text {
  position: relative;
  z-index: 2;
}

/* Service child pages: keep H2 editorial, not oversized hero scale. */
body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
  .m-page
  .fp-section-head
  h2 {
  font-size: clamp(30px, 3.4vw, 52px);
  line-height: 1.42;
  letter-spacing: 0.08em;
}
body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
  .m-page
  .fp-image-statement
  h2 {
  font-size: clamp(34px, 4vw, 58px);
  line-height: 1.45;
  letter-spacing: 0.08em;
}
body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
  .m-page
  .fp-lead-title {
  font-size: clamp(25px, 2.5vw, 38px);
  line-height: 1.58;
  letter-spacing: 0.08em;
}

@media (max-width: 980px) {
  .philosophy-design .pd-opening {
    min-height: 100svh;
  }
  .philosophy-design .pd-opening__video {
    object-position: center top;
    opacity: 0.96;
  }
  .philosophy-design .pd-opening::before {
    background: linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.46) 0%,
        rgba(255, 255, 255, 0.2) 45%,
        rgba(255, 255, 255, 0.58) 100%
      ),
      linear-gradient(
        180deg,
        rgba(255, 255, 255, 0.62) 0%,
        rgba(255, 255, 255, 0.16) 52%,
        rgba(255, 255, 255, 0.68) 100%
      );
  }
}

@media (max-width: 700px) {
  body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
    .m-page
    .fp-section-head
    h2,
  body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
    .m-page
    .fp-image-statement
    h2 {
    font-size: clamp(28px, 8vw, 42px);
    line-height: 1.55;
  }
  body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
    .m-page
    .fp-lead-title {
    font-size: clamp(24px, 7vw, 36px);
  }
}

/* Full-bleed statement blocks must keep the image as an absolute background layer. */
.m-page .fp-image-statement__media,
.m-page.has-fp-reveal .fp-image-statement__media:has(img) {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  background: var(
    --m-paper,
    #faf8f4
  ) !important; /* 白幕リビールの幕色（マスク透過部に透ける） */
  transform: none !important;
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
  will-change: auto !important;
}
.m-page .fp-image-statement__media::before,
.m-page .fp-image-statement__media::after,
.m-page.has-fp-reveal .fp-image-statement__media:has(img)::before,
.m-page.has-fp-reveal .fp-image-statement__media:has(img)::after {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  transform: none !important;
  transition: none !important;
}
.m-page .fp-image-statement__media img,
.m-page.has-fp-reveal .fp-image-statement__media:has(img) img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  object-position: var(--fp-statement-position, center);
  backface-visibility: hidden;
}

body
  .m-page.has-fp-reveal
  .fp-image-statement
  .fp-image-statement__media:has(img)::before,
body
  .m-page.has-fp-reveal
  .fp-image-statement.is-fp-visible
  .fp-image-statement__media:has(img)::before,
body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
  .m-page.has-fp-reveal
  .fp-image-statement
  .fp-image-statement__media:has(img)::before,
body:is(.l-dialo, .l-renovation, .l-realestate, .l-building)
  .m-page.has-fp-reveal
  .fp-image-statement.is-fp-visible
  .fp-image-statement__media:has(img)::before {
  content: none !important;
  display: none !important;
  opacity: 0 !important;
  transform: none !important;
  transition: none !important;
}
/* Service split images: use the same white wipe reveal as the top page. */
body .m-page.has-fp-reveal .fp-split {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
body .m-page.has-fp-reveal .fp-split .fp-split__body {
  opacity: 0;
  transform: translate3d(0, 24px, 0);
  filter: blur(4px);
  transition: opacity 1.05s cubic-bezier(0.22, 1, 0.36, 1),
    transform 1.05s cubic-bezier(0.22, 1, 0.36, 1), filter 1.05s ease;
}
body .m-page.has-fp-reveal .fp-split.is-fp-visible .fp-split__body {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  filter: blur(0);
}

/* Image reveal guard: no visible frames, and no image edge before the wipe. */
body
  :is(
    .reveal-image,
    .image-mask,
    .m-site .image-mask,
    .philosophy-design .image-mask,
    .m-works .work-row .image-mask,
    .m-company .image-mask,
    .dialo-photo .image-mask,
    .residence-primary .image-mask,
    .residence-detail-top .image-mask,
    .residence-lower-small .image-mask,
    .residence-lower-wide .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-image-statement__media,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid,
    .m-page .fp-award-grid figure,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure
  ) {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

body
  :where(
    main,
    .l-main,
    .site-main,
    .p-main,
    .l-contents,
    .m-site,
    .philosophy-design,
    .m-works,
    .m-company,
    .m-page
  )
  :is(figure, picture, div, span, a):has(> img) {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

body
  :is(
    .image-mask,
    .m-site .image-mask,
    .philosophy-design .image-mask,
    .m-works .work-row .image-mask,
    .m-company .image-mask,
    .dialo-photo .image-mask,
    .residence-primary .image-mask,
    .residence-detail-top .image-mask,
    .residence-lower-small .image-mask,
    .residence-lower-wide .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-image-statement__media,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid figure,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure
  )::after,
body
  :where(
    main,
    .l-main,
    .site-main,
    .p-main,
    .l-contents,
    .m-site,
    .philosophy-design,
    .m-works,
    .m-company,
    .m-page
  )
  :is(figure, picture, div, span, a):has(> img)::after {
  content: none !important;
  display: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

body
  :is(
    .image-mask,
    .m-site .image-mask,
    .philosophy-design .image-mask,
    .m-works .work-row .image-mask,
    .m-company .image-mask,
    .dialo-photo .image-mask,
    .residence-primary .image-mask,
    .residence-detail-top .image-mask,
    .residence-lower-small .image-mask,
    .residence-lower-wide .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid figure
  )::before {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

body
  :is(
    .m-site,
    .philosophy-design,
    .m-works,
    .m-company,
    .m-page
  )
  img {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
}

/* Stronger edge guard: hide one-pixel image edges during and after reveal. */
body
  :is(
    .image-mask,
    .m-site .image-mask,
    .philosophy-design .image-mask,
    .m-works .work-row .image-mask,
    .m-company .image-mask,
    .dialo-photo .image-mask,
    .residence-primary .image-mask,
    .residence-detail-top .image-mask,
    .residence-lower-small .image-mask,
    .residence-lower-wide .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid figure
  ) {
  overflow: hidden !important;
  contain: paint !important;
}

/* Split content reveal: slightly slower to match the richer site-wide image reveal. */
body .m-page.has-fp-reveal .fp-split .fp-split__body {
  opacity: 0 !important;
  transform: translate3d(0, 26px, 0) !important;
  filter: blur(4px) !important;
  transition: opacity 2.25s cubic-bezier(0.22, 0.61, 0.36, 1) 0.18s,
    transform 2.25s cubic-bezier(0.22, 0.61, 0.36, 1) 0.18s,
    filter 2.25s ease 0.18s !important;
}

body .m-page.has-fp-reveal .fp-split.is-fp-visible .fp-split__body {
  opacity: 1 !important;
  transform: translate3d(0, 0, 0) !important;
  filter: blur(0) !important;
}

/* Award/gallery: keep the original grid design, use only the reference-style group motion. */
body .m-page .fp-award-feature {
  width: var(--fp-wide) !important;
  max-width: none !important;
  margin-left: auto !important;
  margin-right: auto !important;
  overflow: visible !important;
  padding-top: clamp(8px, 1.8vw, 28px) !important;
}

/* Dialo statement: full-width cinematic image with a restrained parallax drift. */
body.l-dialo .m-page .fp-image-statement {
  position: relative !important;
  width: 100vw !important;
  max-width: none !important;
  min-height: clamp(1060px, calc(88vh + 300px), 1340px) !important;
  margin: clamp(112px, 11vw, 186px) calc(50% - 50vw) !important;
  padding: 0 !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background: #fff !important;
  color: #fff !important;
}

body.l-dialo .m-page .fp-image-statement::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(
      90deg,
      rgba(0, 0, 0, 0.42) 0%,
      rgba(0, 0, 0, 0.3) 36%,
      rgba(0, 0, 0, 0.12) 68%,
      rgba(0, 0, 0, 0) 100%
    ),
    linear-gradient(
      180deg,
      rgba(0, 0, 0, 0.06) 0%,
      rgba(0, 0, 0, 0) 42%,
      rgba(0, 0, 0, 0.22) 100%
    ) !important;
}

body.l-dialo .m-page .fp-image-statement__media,
body.l-dialo .m-page.has-fp-reveal .fp-image-statement__media:has(img) {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: var(--m-paper, #fff) !important; /* 白幕リビールの幕色 */
}

body.l-dialo .m-page .fp-image-statement__copy {
  position: absolute !important;
  inset: 0 !important;
  z-index: 3 !important;
  display: block !important;
  min-height: clamp(1060px, calc(88vh + 300px), 1340px) !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-shadow: 0 2px 26px rgba(0, 0, 0, 0.46) !important;
  pointer-events: none !important;
}

body.l-dialo .m-page .fp-image-statement .fp-kicker {
  display: none !important;
}

body.l-dialo .m-page .fp-image-statement h2 {
  position: absolute !important;
  top: clamp(132px, 12vw, 220px) !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  color: #fff !important;
  font-size: clamp(34px, 3.8vw, 62px) !important;
  line-height: 1.58 !important;
  letter-spacing: 0.16em !important;
  max-width: none !important;
  margin: 0 !important;
  writing-mode: vertical-rl !important;
  text-orientation: mixed !important;
}

body.l-dialo .m-page .fp-image-statement p {
  position: absolute !important;
  left: clamp(28px, 10vw, 220px) !important;
  bottom: clamp(92px, 9vw, 150px) !important;
  color: rgba(255, 255, 255, 0.9) !important;
  width: min(620px, 100%) !important;
  margin: 0 !important;
}

@media (max-width: 768px) {
  body.l-dialo .m-page .fp-image-statement {
    min-height: clamp(900px, calc(92svh + 220px), 1120px) !important;
    margin: clamp(88px, 18vw, 132px) calc(50% - 50vw) !important;
  }

  body.l-dialo .m-page .fp-image-statement::after {
    background: linear-gradient(
        90deg,
        rgba(0, 0, 0, 0.42) 0%,
        rgba(0, 0, 0, 0.24) 58%,
        rgba(0, 0, 0, 0.06) 100%
      ),
      linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.03) 0%,
        rgba(0, 0, 0, 0.08) 42%,
        rgba(0, 0, 0, 0.34) 100%
      ) !important;
  }

  body.l-dialo .m-page .fp-image-statement__copy {
    min-height: clamp(900px, calc(92svh + 220px), 1120px) !important;
    width: 100% !important;
    padding: 0 !important;
  }

  body.l-dialo .m-page .fp-image-statement h2 {
    top: clamp(76px, 17vw, 124px) !important;
    font-size: clamp(30px, 8vw, 44px) !important;
  }

  body.l-dialo .m-page .fp-image-statement p {
    left: 24px !important;
    right: 24px !important;
    bottom: clamp(56px, 14vw, 88px) !important;
    width: auto !important;
  }
}

/* Prevent parent reveal fades from making image blocks appear as a soft whole-section fade. */
html
  body
  .m-page.has-fp-reveal
  :is(
    .fp-hero__media,
    .fp-single-hero__media,
    .fp-split__media,
    .fp-card,
    .fp-card__image,
    .fp-post,
    .fp-post__thumb,
    .fp-image-statement__media,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure,
    .fp-award-grid
  ) {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
  animation: none !important;
}

/* Dialo: keep the page readable while images use the dedicated left-to-right veil only. */
html
  body.l-dialo
  main.m-page.has-fp-reveal
  :is(
    .fp-hero__copy,
    .fp-single-hero__copy,
    .fp-section-head,
    .fp-split,
    .fp-card,
    .fp-post,
    .fp-list__row,
    .fp-image-statement,
    .fp-gallery-mosaic figure,
    .fp-single-gallery figure,
    .fp-award-feature > figure
  ) {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  filter: none !important;
}

/* =============================================================
   Phase0 — 統一画像リビール（唯一の画像リビール系統）
   トリガー: renewal.js が付与する is-shinwa-image-visible のみ。
   ゲート: margin.js が <html> に m-img-reveal を付与した時だけ
   初期非表示になる（JS無効・失敗時は常に表示）。
   ============================================================= */
html.m-img-reveal
  :is(
    .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-image-statement__media,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid figure
  ) {
  overflow: hidden;
  /* リビール前・拭き上げ中の下地は透過にする。以前は幕色として和紙白
     (--m-paper) を敷いていたが、トップ等のセクション地は実際には白
     (#fff) のため、和紙白の矩形が白地に「ベージュのカード」として
     浮いて見えていた。透過にすると、どのページでも背後のセクション地に
     溶け込み、画像がそのまま結像する（前方の transparent ガード群＝
     エッジ消しと同じ状態に戻す）。overflow:hidden は拭き上げのはみ出し
     防止に必要なので残す。 */
  background: transparent !important;
}

/* 斜めマスク拭き上げリビール（mitone式を参照・m- 規約で書き下ろし）:
   img に -30deg の斜めグラデーションマスクを縦300%（最低100vh）で敷き、
   mask-position を「下に隠れた状態」から「center 0（定位置）」へ
   縦にスライドさせる。斜めのグラデーション帯が下から上へ拭き上がる
   ように見える。mask-position 1.4s linear ／ scale(1.075→1) 1.4s
   cubic-bezier(.165,.84,.44,1)。 */
html.m-img-reveal
  :is(
    .image-mask,
    .m-page .fp-hero__media,
    .m-page .fp-single-hero__media,
    .m-page .fp-split__media,
    .m-page .fp-card__image,
    .m-page .fp-post__thumb,
    .m-page .fp-image-statement__media,
    .m-page .fp-gallery-mosaic figure,
    .m-page .fp-single-gallery figure,
    .m-page .fp-award-feature > figure,
    .m-page .fp-award-grid figure
  )
  img {
  -webkit-mask-image: linear-gradient(
    -30deg,
    transparent,
    transparent 40%,
    rgba(0, 0, 0, 0.02) 42%,
    rgba(0, 0, 0, 0.08) 44%,
    rgba(0, 0, 0, 0.18) 46%,
    rgba(0, 0, 0, 0.32) 48%,
    rgba(0, 0, 0, 0.5) 50%,
    rgba(0, 0, 0, 0.68) 52%,
    rgba(0, 0, 0, 0.82) 54%,
    rgba(0, 0, 0, 0.92) 56%,
    rgba(0, 0, 0, 0.98) 58%,
    #000 60%,
    #000
  );
  mask-image: linear-gradient(
    -30deg,
    transparent,
    transparent 40%,
    rgba(0, 0, 0, 0.02) 42%,
    rgba(0, 0, 0, 0.08) 44%,
    rgba(0, 0, 0, 0.18) 46%,
    rgba(0, 0, 0, 0.32) 48%,
    rgba(0, 0, 0, 0.5) 50%,
    rgba(0, 0, 0, 0.68) 52%,
    rgba(0, 0, 0, 0.82) 54%,
    rgba(0, 0, 0, 0.92) 56%,
    rgba(0, 0, 0, 0.98) 58%,
    #000 60%,
    #000
  );
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-size: 100% max(300%, 100vh);
  mask-size: 100% max(300%, 100vh);
  -webkit-mask-position: center 100%;
  mask-position: center 100%;
  transform: scale(1.075);
  transition: -webkit-mask-position 1.4s linear, mask-position 1.4s linear,
    transform 1.4s cubic-bezier(0.165, 0.84, 0.44, 1);
  will-change: mask-position, transform;
}

html.m-img-reveal
  :is(
    .image-mask.is-shinwa-image-visible,
    .m-page .fp-hero__media.is-shinwa-image-visible,
    .m-page .fp-single-hero__media.is-shinwa-image-visible,
    .m-page .fp-split__media.is-shinwa-image-visible,
    .m-page .fp-card__image.is-shinwa-image-visible,
    .m-page .fp-post__thumb.is-shinwa-image-visible,
    .m-page .fp-image-statement__media.is-shinwa-image-visible,
    .m-page .fp-gallery-mosaic figure.is-shinwa-image-visible,
    .m-page .fp-single-gallery figure.is-shinwa-image-visible,
    .m-page .fp-award-feature > figure.is-shinwa-image-visible,
    .m-page .fp-award-grid.is-shinwa-image-visible figure
  )
  img {
  -webkit-mask-position: center 0;
  mask-position: center 0;
  transform: scale(1);
}

@media (prefers-reduced-motion: reduce) {
  html.m-img-reveal
    :is(
      .image-mask,
      .m-page .fp-hero__media,
      .m-page .fp-single-hero__media,
      .m-page .fp-split__media,
      .m-page .fp-card__image,
      .m-page .fp-post__thumb,
      .m-page .fp-image-statement__media,
      .m-page .fp-gallery-mosaic figure,
      .m-page .fp-single-gallery figure,
      .m-page .fp-award-feature > figure,
      .m-page .fp-award-grid figure
    )
    img {
    -webkit-mask-image: none;
    mask-image: none;
    transform: none;
    transition: none;
  }
}