/* 20260730 Sec01-07 SP adjustment implementation v1.0 */
/*
 * TOP shared section-heading contract for Sec04 / Sec05 / Sec07 / Sec09.
 * Phase 5 extraction from typography-final.css.
 * Loaded after the TOP section styles by design.
 */

/* --------------------------------------------------------------------------
   07. TOP shared section-heading system v1.7
   --------------------------------------------------------------------------
   Sections 04 / 05 / 07 / 09 share one visual role. Their heading metrics,
   line count, phrase boundaries and readable width are therefore unified.
*/

@media (max-width: 767px) {
  .page-top {
    --top-section-title-size: clamp(2rem, 8.15vw, 2.5rem);
    --top-section-title-leading: 1.3;
    --top-section-title-tracking: 0.045em;
    --top-section-heading-width: min(100%, 336px);
  }

  .page-top :is(
    .p-camp__heading,
    .p-stay__heading,
    .p-scenes__heading,
    .p-ending__heading
  ) {
    width: var(--top-section-heading-width) !important;
    max-width: var(--top-section-heading-width) !important;
    margin-left: 0;
    margin-right: 0;
  }

  .page-top :is(
    .p-camp__title,
    .p-stay__title,
    .p-scenes__title,
    .p-ending__title
  ) {
    width: 100%;
    max-width: none !important;
    font-size: var(--top-section-title-size) !important;
    line-height: var(--top-section-title-leading) !important;
    letter-spacing: var(--top-section-title-tracking) !important;
    text-wrap: nowrap !important;
    white-space: nowrap !important;
    overflow: visible;
  }

  .page-top :is(
    .p-camp__title,
    .p-stay__title,
    .p-scenes__title,
    .p-ending__title
  ) span {
    display: inline-block;
    max-width: 100%;
    white-space: nowrap !important;
  }

  .page-top :is(
    .p-camp__kicker,
    .p-stay__kicker,
    .p-scenes__kicker,
    .p-ending__kicker
  ) {
    font-size: clamp(0.72rem, 2.84vw, 0.84rem) !important;
    line-height: 1 !important;
    letter-spacing: 0.18em !important;
  }

  .page-top :is(
    .p-camp__lead,
    .p-stay__lead,
    .p-scenes__lead,
    .p-ending__lead
  ) {
    font-size: clamp(0.82rem, 3.2vw, 0.96rem) !important;
    line-height: 1.78 !important;
    letter-spacing: 0.034em !important;
  }

  /* Dark photographic section keeps its left alignment; light sections share
     the same central text axis. */
  .page-top .p-camp__heading {
    margin-left: 0;
    margin-right: 0;
  }

  .page-top :is(.p-stay__heading, .p-scenes__heading, .p-ending__heading) {
    text-align: left;
  }

  .page-top :is(.p-stay__heading, .p-scenes__heading) {
    margin-left: -10px;
    margin-right: 0;
  }

  .page-top .p-ending__heading {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
  }
}

@media (max-width: 374px) {
  .page-top {
    --top-section-title-size: clamp(1.82rem, 8vw, 2rem);
    --top-section-heading-width: min(100%, 310px);
  }

  .page-top :is(.p-stay__heading, .p-scenes__heading) {
    margin-left: -8px;
  }
}
