/* Personal session list page (right panel "メニュー一覧" of the adopted board). Scoped to .sessions-page; the top page and
   article pages do not load this file. Palette, fonts, header/footer come from the shared files. */

.sessions-page { --s-line: #c9d6e2; --s-pale: #dfeaf3; --s-navy: #17324d; }
#sessions-root:empty { min-height: 100vh; }

/* ------------------------------------------------------------------ breadcrumb */
.s-crumb { position: relative; z-index: 2; padding-block: .25rem 0; font-size: .8125rem; line-height: 1.6; color: var(--muted); }
.s-crumb ol { display: flex; align-items: center; gap: 0 .6rem; margin: 0; padding: 0; list-style: none; }
.s-crumb__link { display: inline-flex; align-items: center; min-height: var(--target); min-width: var(--target); justify-content: center; color: var(--muted); text-decoration: underline; text-underline-offset: .25em; }

/* ------------------------------------------------------------------ hero: copy left, river photo spreads right and fades into the pane */
.s-hero { position: relative; padding-bottom: 1.5rem; }
.s-hero__photo { position: relative; height: clamp(150px, 46vw, 260px); overflow: hidden; background: #dfeaf0; }
.s-hero__photo picture { display: block; height: 100%; }
.s-hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 45%; }
.s-hero__copy { padding-top: 1.25rem; }
.s-eyebrow { margin: 0; font-family: "Hiragino Mincho ProN", "Yu Mincho", Georgia, serif; font-size: .9375rem; letter-spacing: .28em; color: var(--navy); }
.s-h1 { margin: .35rem 0 0; font-size: clamp(1.75rem, 8vw, 2.5rem); line-height: 1.35; font-weight: 500; letter-spacing: .04em; color: var(--s-navy); }
.s-rule { display: block; width: 100%; max-width: 38rem; height: 1px; margin: 1rem 0 .9rem; background: var(--s-line); }
.s-h2 { margin: 0; font-size: 1.25rem; line-height: 1.6; font-weight: 500; letter-spacing: .05em; color: var(--s-navy); }
.s-lead { margin: .25rem 0 0; font-size: .9375rem; line-height: 1.85; color: var(--site-ink); }

@media (min-width: 900px) {
  .s-hero { min-height: clamp(22rem, 30vw, 25.5rem); padding-bottom: 0; background: linear-gradient(115deg, #eef6fb 0%, #f6fafd 60%, #fbfdfe 100%); }
  .s-hero > .s-crumb { position: absolute; top: .9rem; left: 0; right: 0; }
  .s-hero__photo {
    position: absolute; top: 0; right: 0; bottom: 0; width: 62%; height: auto;
    -webkit-mask-image: linear-gradient(to right, transparent 0, rgba(0, 0, 0, .55) 18%, #000 42%);
    mask-image: linear-gradient(to right, transparent 0, rgba(0, 0, 0, .55) 18%, #000 42%);
  }
  .s-hero__copy { position: relative; padding-top: clamp(5.25rem, 7.4vw, 6.25rem); padding-bottom: 2rem; }
  .s-hero__copy > * { max-width: 62%; }
  .s-eyebrow { font-size: clamp(.9375rem, 1.2vw, 1.125rem); }
  .s-h1 { font-weight: 400; font-size: clamp(2.4rem, 4.5vw, 3.75rem); letter-spacing: .05em; white-space: nowrap; max-width: none; margin-top: .5rem; }
  .s-rule { max-width: 61%; margin: 1.25rem 0 1.1rem; }
  .s-h2 { font-size: clamp(1.4rem, 2.3vw, 1.9rem); font-weight: 400; }
  .s-lead { font-size: clamp(1rem, 1.5vw, 1.2rem); margin-top: .5rem; }
  .s-list { padding-top: 1.5rem; }
}

/* ------------------------------------------------------------------ rows: photo | name + target | spec | detail link */
.s-list { padding-block: 0; }
.s-list ul { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--s-line); }
.s-row { padding-block: 1.25rem; border-bottom: 1px solid var(--s-line); display: grid; gap: .9rem 1.5rem; grid-template-columns: 1fr; }
.s-row__photo { position: relative; width: min(100%, 15rem); aspect-ratio: 7 / 5; overflow: hidden; background: #e6eef4; } /* ~native ratio, small on phones (source is only ~132px wide) */
.s-row__photo img { display: block; width: 100%; height: 100%; object-fit: cover; } /* cover: ratio kept, never stretched */
.s-row__badge { position: absolute; left: .4rem; bottom: .35rem; padding: 0 .45rem; background: rgba(255, 255, 255, .85); color: var(--muted); font-size: .6875rem; line-height: 1.6; letter-spacing: .06em; }
.s-row__name { margin: 0; font-size: 1.375rem; line-height: 1.5; font-weight: 500; letter-spacing: .05em; color: var(--s-navy); }
.s-row__target { margin: .15rem 0 0; font-size: .9375rem; line-height: 1.8; color: var(--site-ink); }
.s-spec { display: grid; gap: .15rem; }
.s-spec__line { margin: 0; font-size: .9375rem; line-height: 1.8; color: var(--site-ink); }
.s-spec__label { color: var(--muted); font-size: .8125rem; }
.sessions-page .s-spec__label, .sessions-page .s-spec__value { display: block; }
.sessions-page .s-spec__plan { white-space: nowrap; }
.s-spec__line[data-unverified] .s-spec__value { color: var(--muted); }
.s-row__more { display: flex; align-items: center; }
.s-more { display: inline-grid; grid-template-columns: auto auto; justify-content: start; align-items: center; gap: .15rem 1rem; white-space: nowrap; min-height: var(--target); margin: 0; padding: 0 .25rem; color: var(--s-navy); font-size: 1rem; letter-spacing: .04em; }
.s-more > span:first-child { border-bottom: 1px solid #6f8aa3; padding-bottom: .1rem; }
.s-more small { grid-column: 1 / -1; font-size: .75rem; color: var(--muted); white-space: normal; }
.s-more.is-unconnected { color: var(--muted); cursor: default; }

@media (min-width: 900px) {
  .s-row { grid-template-columns: 20.4% 35.1% 25.8% 18.7%; align-items: center; gap: 0; padding-block: 1.5rem; }
  .s-row__photo { max-width: none; width: 100%; height: auto; aspect-ratio: 7 / 5; }
  .s-row__main { padding: 0 1.5rem 0 3.8%; min-width: 0; }
  .s-row__name { font-size: clamp(1.5rem, 2.75vw, 2.25rem); font-weight: 400; letter-spacing: .05em; }
  .s-row__target { font-size: clamp(.9375rem, 1.4vw, 1.15rem); margin-top: .35rem; }
  .s-spec { align-self: stretch; align-content: center; gap: .3rem; padding: .25rem clamp(.9rem, 4.6%, 2.25rem); border-left: 1px solid var(--s-line); }
  .s-spec__line { font-size: clamp(.9375rem, 1.35vw, 1.15rem); }
  .s-spec__label { font-size: .85em; }
  .s-row__more { align-self: stretch; padding: .25rem 0 .25rem clamp(1rem, 4.4%, 2.25rem); border-left: 1px solid var(--s-line); }
  .s-more { font-size: clamp(1rem, 1.55vw, 1.3rem); }
}

/* ------------------------------------------------------------------ 虹視力 band: pale strip; the decorative photo is removed (text link only) */
.s-rainbow { margin-top: 1.5rem; background: var(--s-pale); }
.s-rainbow__link { display: block; padding: 1rem var(--gutter) .75rem; color: var(--s-navy); }
.s-rainbow__title { display: block; padding-top: .25rem; font-size: 1.5rem; letter-spacing: .12em; font-weight: 400; }
.s-rainbow__go { display: inline-flex; align-items: center; gap: 1rem; min-height: var(--target); font-size: 1.0625rem; }
.s-rainbow__go > span:first-child { border-bottom: 1px solid #6f8aa3; padding-bottom: .1rem; }
@media (min-width: 900px) {
  .s-rainbow { margin-top: 0; }
  .s-rainbow__link { display: flex; align-items: center; width: min(100% - var(--gutter) * 2, 70rem); margin-inline: auto; padding: 0; min-height: 7.5rem; }
  .s-rainbow__title { padding: 0 clamp(2rem, 5vw, 4rem) 0 .25rem; border-right: 1px solid #a9bdcf; font-size: clamp(1.75rem, 2.5vw, 2.25rem); line-height: 4rem; }
  .s-rainbow__go { padding-left: clamp(2rem, 5vw, 4rem); font-size: clamp(1.125rem, 1.95vw, 1.55rem); }
}

/* ------------------------------------------------------------------ contact band: wide photo, navy text + arrow + thin line ON the photo (no box) */
.s-contact { margin-top: 0; }
.s-contact__link { position: relative; display: block; color: var(--s-navy); }
.s-contact__photo { display: block; height: 8.5rem; overflow: hidden; }
.s-contact__photo picture, .s-contact__photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.s-contact__label {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 1rem;
  width: max-content; max-width: calc(100% - 2rem); min-height: var(--target); padding: .2rem .25rem .3rem; border-bottom: 1px solid var(--s-navy);
  font-size: 1.125rem; letter-spacing: .06em; text-align: center;
}
@media (min-width: 900px) { .s-contact__photo { height: clamp(8rem, 11.8vw, 9.75rem); } .s-contact__label { font-size: clamp(1.25rem, 1.95vw, 1.55rem); } }
.s-contact__photo::after { content: ""; position: absolute; inset: 0; background: radial-gradient(ellipse 52% 110% at 50% 50%, rgba(245, 249, 244, .94) 0%, rgba(245, 249, 244, .86) 32%, rgba(245, 249, 244, 0) 88%); }
.s-contact__label { z-index: 1; color: #102b42; font-weight: 500; }
@media (max-width: 899px) {
  .sessions-page .s-contact__photo::after { background: radial-gradient(ellipse 100% 110% at 50% 50%, rgba(245, 249, 244, .94) 0%, rgba(245, 249, 244, .86) 50%, rgba(245, 249, 244, 0) 100%); }
}

@media (hover: hover) { .s-more:not(.is-unconnected):hover > span:first-child { border-color: var(--navy); } }
.sessions-page .site-footer { margin-top: 0; }