/* 紹介セクション：上下の曲線・文章・写真・表示アニメーション（トップページ必須CSS） */

.home-introduction__top-curve {
 position: absolute;
 z-index: 1;
 left: 0;
 bottom: calc(100% - 2px);
 display: block;
 width: 100%;
 pointer-events: none;
 opacity: var(--home-intro-curve-opacity, 0);
 transform: translate3d(0, var(--home-intro-curve-offset, 36px), 0);
 transition: opacity .18s ease-out, transform .18s ease-out;
 will-change: opacity, transform;
 height: clamp(80px, 7.29167vw, 140px);
}

.home-introduction__top-curve::after {
 content: '';
 position: absolute;
 inset: calc(100% - 80px) 0 auto;
 height: 160px;
 background: linear-gradient(to bottom, transparent, var(--color-surface-cream) 80px);
 pointer-events: none;
}

.home-introduction__top-curve img {
 display: block;
 width: 100%;
 height: 100%;
}

@media (max-width: 767px) {
 .home-introduction__top-curve {
  height: clamp(70px, 15vw, 110px);
 }
}

@media (prefers-reduced-motion: reduce) {
 .home-introduction__top-curve {
  transform: none;
  transition: none;
 }

 .home-introduction__top-curve img {
  opacity: 1;
  transform: none;
  transition: none;
 }
}

.home-introduction {
 position: relative;
 background: var(--color-surface-cream);
 color: var(--color-text);
 padding-block: clamp(24px, 2.08333vw, 40px) calc(clamp(60px, 6.25vw, 120px) + clamp(50px, 7.29167vw, 140px));
 word-break: normal;
 overflow-wrap: anywhere;
}

@media (min-width: 768px) {
 .home-introduction {
  padding-bottom: calc(clamp(40px, 3.125vw, 60px) + clamp(50px, 7.29167vw, 140px));
 }
}

.home-introduction__inner {
 width: clamp(688px, calc(186.66667px + 65.27778vw), var(--content-width-1400));
 max-width: calc(100% - 80px);
 margin-inline: auto;
 display: grid;
 grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
 gap: clamp(32px, 4.16667vw, 80px);
 align-items: center;
 position: relative;
 z-index: 2;
}

.home-introduction__eyebrow {
 margin: 0 0 14px;
 color: var(--color-brand-gold);
 font-size: var(--font-size-36);
 font-weight: var(--font-weight-bold);
}

.home-introduction__title {
 margin: 0 0 clamp(28px, 2.5vw, 48px);
 font-family: var(--font-family-base);
 font-size: var(--font-size-60);
 font-weight: var(--font-weight-bold);
 line-height: 1.4;
 letter-spacing: .04em;
}

.home-introduction__text {
 font-size: var(--font-size-24);
 line-height: 1.9;
}

.home-introduction__text p {
 margin: 0;
}

.home-introduction__text p + p {
 margin-top: 1.2em;
}

.home-introduction__link {
 box-sizing: border-box;
 display: inline-flex;
 align-items: center;
 justify-content: space-between;
 gap: 20px;
 max-width: 100%;
 margin-top: clamp(28px, 2.5vw, 48px);
 padding: 16px clamp(20px, 2.08333vw, 40px);
 border: 1px solid var(--color-brand-gold);
 border-radius: 999px;
 background: var(--color-white);
 color: var(--color-brand-gold);
 font-family: var(--font-family-base);
 font-weight: var(--font-weight-bold);
 font-size: var(--font-size-24);
 text-decoration: none;
 transition: background-color .25s ease, color .25s ease;
}

.home-introduction__link:hover {
 background: var(--color-brand-gold);
 color: var(--color-white);
}

.home-introduction__link:focus-visible {
 outline: 2px solid var(--color-focus);
 outline-offset: 5px;
}

.home-introduction__figure {
 position: relative;
 margin: 0;
 overflow: hidden;
 border-radius: clamp(12px, 1.25vw, 24px);
}

.home-introduction__image {
 display: block;
 width: 100%;
 height: auto;
 aspect-ratio: 5 / 4;
 object-fit: cover;
 object-position: center;
}

.home-introduction__figure figcaption {
 position: absolute;
 left: 0;
 bottom: 10%;
 max-width: 100%;
 box-sizing: border-box;
 padding: 10px 24px;
 background: var(--color-header-surface);
 color: var(--color-brand-gold);
 font-size: var(--font-size-30);
 font-weight: var(--font-weight-bold);
}

.home-introduction__curve {
 position: absolute;
 inset: auto 0 -1px;
 display: block;
 width: 100%;
 height: clamp(50px, 7.29167vw, 140px);
 fill: var(--color-white);
 pointer-events: none;
}

@media (max-width: 1199px) {
 .home-introduction__break {
  display: none;
 }
}

@media (max-width: 980px) {
 .home-introduction__inner {
  width: min(var(--content-width-768), calc(100% - clamp(40px, 6.12245vw, 60px)));
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(32px, 4.6875vw, 36px);
  text-align: center;
 }

 .home-introduction__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
 }

 .home-introduction__link,
 .home-introduction__figure {
  margin-inline: auto;
 }
}

@media (max-width: 767px) {
 .home-introduction {
  padding-block: 24px 100px;
 }

 .home-introduction__inner {
  width: calc(100% - clamp(40px, 7.823vw, 60px));
  max-width: none;
  grid-template-columns: minmax(0, 1fr);
  gap: 36px;
 }

 .home-introduction__title {
  font-size: var(--font-size-42);
 }

 .home-introduction__eyebrow {
  font-size: var(--font-size-30);
 }

 .home-introduction__text {
  font-size: var(--font-size-16);
  text-align: left;
 }

 .home-introduction__link {
  font-size: var(--font-size-14);
  gap: 12px;
  padding-inline: 20px;
 }

 .home-introduction__curve {
  height: clamp(30px, 6.5189vw, 50px);
 }
}

@media (prefers-reduced-motion: reduce) {
 .home-introduction__link {
  transition: none;
 }
}

.home-main > .home-introduction {
 z-index: 1;
}

.home-introduction .is-reveal-ready {
 opacity: 0;
 transform: translateY(12px);
 transition: opacity .7s ease, transform .7s ease;
}

.home-introduction .is-reveal-ready.is-revealed {
 opacity: 1;
 transform: translateY(0);
}

@media (prefers-reduced-motion: reduce) {
 .home-introduction .is-reveal-ready {
  opacity: 1;
  transform: none;
  transition: none;
 }
}
