/* =========================================================
   v2 ADDITIONAL CSS (clean, SWELL override)
   ========================================================= */

/* --------------------------
   Base (tokens準拠)
-------------------------- */
#body_wrap.yy-content{
  font-family: var(--yy-font-sans) !important;
  font-size: var(--yy-f-text) !important;
  line-height: var(--yy-lh-text) !important;
  color: var(--yy-ink) !important;
  letter-spacing: 0 !important;
}

#body_wrap.yy-content .entry-content,
#body_wrap.yy-content .entry-content *{
  font-family: inherit !important;
  font-size: inherit !important;
  line-height: inherit !important;
}

/* SWELL .post_content h2(1.2em) 上書き */
#body_wrap.yy-content .post_content h2{
  font-size: var(--yy-f-title) !important; /* 24px */
  line-height: var(--yy-lh-title) !important;
  font-family: var(--yy-font-serif) !important;
  font-weight: 500 !important;
  letter-spacing: .08em !important;
  margin: 10px 0 0 !important;
}

/* 英字アイブロウ下線 */
#body_wrap.yy-content .yy-bh__eyebrow{
  border-bottom: 1px solid rgba(36,30,27,.25) !important;
  padding-bottom: 10px !important;
}

/* --------------------------
   Hero
-------------------------- */
#body_wrap.yy-content.yy-content--home .yy-hero--video .yy-hero__eyebrow,
#body_wrap.yy-content.yy-content--home .yy-hero--video .yy-hero__title,
#body_wrap.yy-content.yy-content--home .yy-hero--video .yy-hero__copy{
  color:#fff !important;
  text-shadow:0 6px 18px rgba(0,0,0,.25) !important;
}

#body_wrap.yy-content.yy-content--home .yy-hero.is-inview .yy-hero__eyebrow,
#body_wrap.yy-content.yy-content--home .yy-hero.is-inview .yy-hero__title,
#body_wrap.yy-content.yy-content--home .yy-hero.is-inview .yy-hero__copy{
  animation-play-state: running !important;
}

/* Full-bleed */
#body_wrap.yy-content .yy-hero{
  width: 100vw !important;
  max-width: none !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
}
#body_wrap.yy-content .yy-hero__media,
#body_wrap.yy-content .yy-hero__video{
  width: 100% !important;
  max-width: none !important;
}

/* SP: Hero 縦長 */
@media (max-width:768px){
  #body_wrap.yy-content .yy-hero--video .yy-hero__media{
    aspect-ratio: 3 / 4 !important;
  }
}

/* --------------------------
   Statement background
-------------------------- */
#body_wrap.yy-content .yy-statement{
  background: var(--yy-cream, #fdfaf6) !important;
}

/* --------------------------
   Cream text panels (Flow / Menu / MenuDetail)
   画像幅にぴったり揃える + 余白ゼロ
-------------------------- */
#body_wrap.yy-content--home .yy-flowSlide,
#body_wrap.yy-content--home .yy-menuCard,
#body_wrap.yy-content--home .yy-menuDetail{
  align-items: stretch;
  gap: 0 !important;
  row-gap: 0 !important;
}

#body_wrap.yy-content--home .yy-flowSlide__media,
#body_wrap.yy-content--home .yy-menuCard__media,
#body_wrap.yy-content--home .yy-menuDetail__media,
#body_wrap.yy-content--home .yy-flowSlide__body,
#body_wrap.yy-content--home .yy-menuCard__body,
#body_wrap.yy-content--home .yy-menuDetail__body{
  width: 100%;
  max-width: none;
  margin: 0;
  box-sizing: border-box;
}

#body_wrap.yy-content--home .yy-flowSlide__body,
#body_wrap.yy-content--home .yy-menuCard__body,
#body_wrap.yy-content--home .yy-menuDetail__body{
  background: var(--yy-cream, #fdfaf6);
  padding: 16px 18px 18px;
  margin-top: 0 !important;
}

/* 見出し・タグ・料金を中央揃え */
#body_wrap.yy-content--home .yy-flowSlide__title,
#body_wrap.yy-content--home .yy-menuCard__title,
#body_wrap.yy-content--home .yy-menuDetail__title{
  text-align: center;
}

#body_wrap.yy-content--home .yy-menuCard__symptoms,
#body_wrap.yy-content--home .yy-flowSlide .yy-menuCard__symptoms,
#body_wrap.yy-content--home .yy-menuDetail__symptoms{
  justify-content: center;
}

#body_wrap.yy-content--home .yy-menuCard__meta,
#body_wrap.yy-content--home .yy-menuDetail__meta{
  justify-content: center;
}

/* --------------------------
   Swiper Carousel (center + side peek + opacity)
-------------------------- */
#body_wrap.yy-content .yy-carousel{
  position: relative;
  overflow: visible !important;
}

#body_wrap.yy-content .yy-carousel .swiper-wrapper{
  align-items: stretch;
}

#body_wrap.yy-content .yy-carousel .swiper-slide{
  opacity: .35;
  transition: opacity .35s ease;
}

#body_wrap.yy-content .yy-carousel .swiper-slide-active{
  opacity: 1;
}

#body_wrap.yy-content .yy-carousel .swiper-slide-prev,
#body_wrap.yy-content .yy-carousel .swiper-slide-next{
  opacity: .5;
}

/* セクション別カード幅 */
#body_wrap.yy-content .yy-carousel--flow .swiper-slide{
  width: clamp(420px, 46vw, 560px);
}
#body_wrap.yy-content .yy-carousel--reviews .swiper-slide{
  width: clamp(420px, 46vw, 560px);
}
#body_wrap.yy-content .yy-carousel--menu .swiper-slide{
  width: clamp(360px, 40vw, 520px);
}

/* SP */
@media (max-width:768px){
  #body_wrap.yy-content .yy-carousel--flow .swiper-slide,
  #body_wrap.yy-content .yy-carousel--reviews .swiper-slide,
  #body_wrap.yy-content .yy-carousel--menu .swiper-slide{
    width: min(86vw, 480px);
  }
}

/* ナビ */
#body_wrap.yy-content .yy-carousel__nav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: transparent;
  border: none;
  font-size: 24px;
  color: var(--yy-ink);
  cursor: pointer;
}
#body_wrap.yy-content .yy-carousel__nav--prev{ left: -12px; }
#body_wrap.yy-content .yy-carousel__nav--next{ right: -12px; }

@media (max-width:768px){
  #body_wrap.yy-content .yy-carousel__nav--prev{ left: -6px; }
  #body_wrap.yy-content .yy-carousel__nav--next{ right: -6px; }
}

/* --------------------------
   Media+Text (SP: 画像→見出し→本文)
-------------------------- */
@media (max-width:768px){
  #body_wrap.yy-content .yy-mediaGrid--equal .yy-mediaCard{
    display: flex !important;
    flex-direction: column !important;
    row-gap: 14px !important;
  }
  #body_wrap.yy-content .yy-mediaCard .yy-media__image{
    order: 1 !important;
    width: 100% !important;
    aspect-ratio: 1 / 1 !important;
  }
  #body_wrap.yy-content .yy-mediaCard .yy-media__body{
    order: 2 !important;
    width: 100% !important;
  }
}

/* --------------------------
   Place & Space gallery speed
-------------------------- */
#body_wrap.yy-content .yy-placeGallery__track{
  animation-duration: 23s !important;
}

/* --------------------------
   Salon info (spacing + tags left)
-------------------------- */
#body_wrap.yy-content .yy-salonCard__media{
  margin-bottom: 14px !important;
}
#body_wrap.yy-content .yy-salonCard__label{
  margin: 0 0 6px !important;
}
#body_wrap.yy-content .yy-salonCard__name{
  margin: 0 0 10px !important;
}
#body_wrap.yy-content .yy-salonCard__tags{
  justify-content: flex-start !important;
  text-align: left !important;
  margin: 0 0 12px !important;
}
#body_wrap.yy-content .yy-salonCard__info{
  margin-top: 8px !important;
}

/* --------------------------
   SP CTA bar (2列維持) + 展開後縦配置
-------------------------- */
@media (max-width:640px){
  #body_wrap.yy-content .yy-fixedCta__bar{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width:768px){
  #body_wrap.yy-content .yy-fixedCta__panelInner{
    display: flex;
    flex-direction: column;
    gap: 16px;
  }
  #body_wrap.yy-content .yy-fixedCta__hours--row{
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
  }
  #body_wrap.yy-content .yy-fixedCta__hoursItem{
    white-space: normal;
  }
}
