/**
 * フロントページ セクション（PBAチケットセンター等）
 * Collegium Vocale Gent 風・濃いグリーン/ティール / 文字: 白
 */

:root {
  --pba-section-green-dark: #1c3e4b;
  --pba-section-text: #fff;
}

/* TICKETS セクション（全画面幅・上部を斜め直線でHeroに重なる） */
.pba-section-tickets {
  position: relative;
  z-index: 15;
  background-color: var(--pba-section-green-dark);
  color: var(--pba-section-text);
  padding: clamp(1rem, 4vw, 2rem) clamp(1.5rem, 5vw, 2.5rem);
  width: 100vw;
  max-width: 100vw;
  /* 親パディングに影響されず左端まで届く full-bleed */
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  box-sizing: border-box;
  margin-bottom: 0;
  overflow: visible;
  /* 上部を斜め直線で切り取り（右斜め上・傾斜を緩やかに） */
  clip-path: polygon(0 30px, 100% 0, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 30px, 100% 0, 100% 100%, 0 100%);
  margin-top: clamp(-40px, -8vw, -80px) !important;
  padding-top: calc(clamp(1rem, 4vw, 2rem) + clamp(44px, 8vw, 80px));
}

/* Hero直後の斜めオーバーラップ */
body.home .hero-full + .pba-section-tickets {
  margin-top: clamp(-40px, -8vw, -80px) !important;
}

/* MAGAZINE セクション（TICKETS直下・全幅・タイトル上の余白を確保） */
body.home .pba-section-tickets + .pba-section--magazine,
body.home .pba-section--magazine {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: 0;
  box-sizing: border-box;
  padding-top: clamp(0.75rem, 2.5vw, 1.25rem) !important;
  padding-left: clamp(1.5rem, 5vw, 2.5rem);
  padding-right: clamp(1.5rem, 5vw, 2.5rem);
}

.pba-section--magazine .pba-section-magazine-inner {
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

/* NEWS セクション（MAGAZINE直下・全幅・ぎゅっと詰める） */
body.home .pba-section--magazine + .pba-section--news {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: 0;
  padding-top: 0.2rem !important;
  box-sizing: border-box;
  padding-left: clamp(1.5rem, 5vw, 2.5rem);
  padding-right: clamp(1.5rem, 5vw, 2.5rem);
}

.pba-section--news .pba-section-news-inner {
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

/* SUPPORTS セクション（NEWS直下・全幅・上部左斜め上） */
body.home .pba-section--news + .pba-section--supports {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: clamp(-30px, -6vw, -60px) !important;
  padding-top: calc(clamp(0.5rem, 2vw, 1rem) + clamp(30px, 6vw, 60px)) !important;
  box-sizing: border-box;
  padding-left: clamp(1.5rem, 5vw, 2.5rem);
  padding-right: clamp(1.5rem, 5vw, 2.5rem);
  overflow: visible;
  clip-path: polygon(0 0, 100% 30px, 100% 100%, 0 100%);
  -webkit-clip-path: polygon(0 0, 100% 30px, 100% 100%, 0 100%);
}

.pba-section--supports .pba-section-supports-inner {
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

/* CHORUS セクション（SUPPORTS直下・全幅） */
body.home .pba-section--supports + .pba-section--chorus,
body.home .pba-section--chorus {
  position: relative;
  width: 100vw;
  max-width: 100vw;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  margin-top: 0;
  padding-top: clamp(0.5rem, 2vw, 1rem) !important;
  box-sizing: border-box;
  padding-left: clamp(1.5rem, 5vw, 2.5rem);
  padding-right: clamp(1.5rem, 5vw, 2.5rem);
}

.pba-section--chorus .pba-section-chorus-inner {
  max-width: 640px;
  margin: 0 auto;
  width: 100%;
}

/* CHORUS 直後のコンテンツ（固定ページブロック・Instagram埋め込み等）の上余白を消す（ACF/ブロック由来の大きな gap 対策） */
body.home .pba-section--chorus + * {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* モバイル：TICKETS・MAGAZINE・NEWS・SUPPORTS・CHORUS を確実に全幅表示 + 縦余白を抑える */
@media (max-width: 768px) {
  body.home .pba-section-tickets,
  body.home .pba-section-tickets + .pba-section--magazine,
  body.home .pba-section--magazine + .pba-section--news,
  body.home .pba-section--news + .pba-section--supports,
  body.home .pba-section--supports + .pba-section--chorus {
    width: 100vw !important;
    max-width: 100vw !important;
    left: 50% !important;
    right: auto !important;
    margin-left: -50vw !important;
    margin-right: -50vw !important;
    transform: none !important;
  }
  /* 縦に広がりすぎないよう padding-top を抑える */
  body.home .pba-section-tickets {
    padding-top: calc(0.75rem + 36px) !important;
  }
  body.home .pba-section--magazine + .pba-section--news {
    padding-top: 0.15rem !important;
  }
  body.home .pba-section--news + .pba-section--supports {
    padding-top: calc(0.5rem + 18px) !important;
  }
  body.home .pba-section--chorus,
  body.home .pba-section--supports + .pba-section--chorus {
    padding-top: 0.5rem !important;
  }
}

.pba-section-tickets a {
  color: var(--pba-section-text);
}

.pba-section-tickets .pba-section-inner {
  position: relative;
  z-index: 1;
  max-width: 640px;
  margin: 0 auto;
}

/* TICKETS見出し：右上配置 */
.pba-section-tickets .pba-section-title {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.5rem;
  font-size: clamp(1.2rem, 3.2vw, 1.5rem);
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.3;
  margin: -0.5rem 0 1.25rem 0;
}

/* 菱形オーナメント ♢ */
.pba-diamond-ornament {
  display: inline-block;
  width: 0.4em;
  height: 0.4em;
  background: currentColor;
  transform: rotate(45deg);
  flex-shrink: 0;
}

.pba-section-tickets .pba-section-desc {
  font-size: clamp(0.9375rem, 2.2vw, 1.0625rem);
  line-height: 1.35;
  margin-bottom: 0.75rem;
  margin-top: 0.5rem;
  opacity: 0.95;
  text-align: justify;
}

.pba-section-tickets .pba-section-cta {
  font-size: clamp(0.9375rem, 2vw, 1rem);
  margin-bottom: 0.5rem;
  opacity: 0.95;
}

.pba-section-tickets .pba-section-link {
  display: inline;
  font-size: 0.9375rem;
  text-decoration: underline;
  text-underline-offset: 0.2em;
  transition: opacity 0.2s;
  margin-left: 0.4em;
}

.pba-section-tickets .pba-section-link:hover {
  opacity: 0.85;
}
