/* 天文台についてページ（style.css に追加で読み込む） */

/* ---------- 冒頭（写真と数字） ---------- */
.about-hero { padding-block: 8px clamp(16px, 3vw, 32px); }
.about-hero-figure { margin: 0; }
.about-hero-figure img {
  width: 100%;
  aspect-ratio: 21 / 9;
  object-fit: cover;
  object-position: 50% 45%;
  border-radius: var(--radius-lg);
}

@media (max-width: 760px) {
  .about-hero-figure img { aspect-ratio: 3 / 2; }
}

/* ---------- 文章のみの欄 ---------- */
.prose { max-width: 46em; }

/* ---------- 文章と写真の2列 ---------- */
.about-split {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  gap: clamp(24px, 5vw, 56px);
  align-items: center;
}
.about-split--media { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }

@media (max-width: 860px) {
  .about-split, .about-split--media { grid-template-columns: 1fr; }
}


/* ---------- 研究 ---------- */
.research-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.research-card {
  padding: 24px;
  background: var(--card);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
}
.research-card p { margin: 0; max-width: none; }
.research-more { margin: 18px 0 0; }

@media (max-width: 760px) {
  .research-grid { grid-template-columns: 1fr; }
}

/* ---------- むりかぶし望遠鏡 ---------- */
.telescope-figure { margin: 0; }
.telescope-figure img {
  width: 100%;
  max-width: 440px;
  margin-inline: auto;
  background: #fff;
  border: 1px solid var(--hairline);
  border-radius: var(--radius-lg);
}
.spec-list { margin: 1.25rem 0; border-top: 1px solid var(--hairline); }
.spec-list div {
  display: grid;
  grid-template-columns: 7.5em minmax(0, 1fr);
  gap: 12px;
  padding: 10px 0;
  border-bottom: 1px solid var(--hairline);
  font-size: .93rem;
}
.spec-list dt { color: var(--muted); }
.spec-list dd { margin: 0; }
.telescope-note {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin: 0;
  color: var(--muted);
  font-size: .9rem;
}

/* ---------- 運営 ---------- */
.partners {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 1.25rem 0 0;
  padding: 0;
  list-style: none;
}
.partners li {
  padding: 8px 16px;
  background: var(--card);
  border: 1px solid var(--hairline);
  border-radius: 999px;
  font-size: .93rem;
  font-weight: 500;
}
.partners .is-main { background: var(--sea); border-color: var(--sea); color: #fff; font-weight: 700; }

/* ---------- 来館への誘導 ---------- */
.cta-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}
.cta-card {
  display: block;
  padding: 24px;
  background: var(--card);
  border: 1px solid var(--hairline);
  border-radius: var(--radius);
  color: inherit;
  text-decoration: none;
  transition: transform .2s, box-shadow .2s;
}
.cta-card:hover { color: inherit; transform: translateY(-2px); box-shadow: 0 12px 28px rgba(31, 42, 51, .08); }
.cta-card h3 { margin: 10px 0 6px; }
.cta-card p { margin: 0; color: var(--muted); font-size: .93rem; }

@media (max-width: 760px) {
  .cta-row { grid-template-columns: 1fr; }
}