/* ===============================
   css/about.css（完成版：背景のみクリック透過）
   ※既存スタイルはそのまま。最後に追記するだけでもOK
   =============================== */

/* ---- Design Tokens ---- */
:root{
  --brand:#2D8CFF; --brand-ink:#1a6edc;
  --ink:#333; --ink-2:#444; --paper:#fff;
  --shadow:0 4px 12px rgba(0,0,0,0.05);
  --shadow-lg:0 8px 24px rgba(0,0,0,0.12);
  --gold:#D19529; --accent-green:#44a02c;
  --greet-width: min(680px, 94%);
}

/* ---- Base sections ---- */
.section,.foundation-box,.president-box,.philosophy{
  max-width:1100px; margin:0 auto; padding:2rem 1.5rem;
  border-radius:12px; box-shadow:var(--shadow); background:var(--paper);
  line-height:1.8; font-size:1rem; color:var(--ink);
}

/* ---- Section title ---- */
.section-title{
  font-size:clamp(1.55rem,1.9vw,1.9rem); color:var(--brand); text-align:center;
  margin:1.6rem auto 1rem; font-weight:650; letter-spacing:.04em; position:relative;
}
.section-title::after{
  content:''; display:block; width:60px; height:2px; background:var(--brand);
  margin:.5rem auto 0; border-radius:1px;
}

/* === Greeting === */
.greeting-section{ background:transparent; }
.greeting-card{
  max-width:1100px; margin:0 auto; background:#fdfaf4; border:2px solid #4a3624;
  border-radius:16px; box-shadow:0 8px 24px rgba(50,40,30,.15); padding:2rem 1.5rem;
}
.greeting-photo img{
  display:block; width:var(--greet-width); height:auto; border-radius:12px; object-fit:cover;
  box-shadow:0 4px 14px rgba(0,0,0,.12); border:4px solid #fff; margin:0 auto 1rem;
}
.greeting-text{
  width:var(--greet-width); margin:0 auto; font-family:'Yu Mincho','Hiragino Mincho ProN',serif;
  color:#1a1a1a; font-size:1.1rem; font-weight:700; line-height:1.95; letter-spacing:.02em;
  text-align:left; font-kerning:normal; text-rendering:optimizeLegibility; box-sizing:border-box;
}
.greeting-text p{ margin:0 0 .9rem; text-indent:1em; }
.greeting-text p:last-of-type{ margin-bottom:.15rem; }
.greeting-sign-block{
  display:flex; flex-direction:column; align-items:flex-end; width:var(--greet-width);
  margin:.05rem auto 0; padding-top:0; gap:0; border-radius:8px; transition:all .3s ease-in-out;
}
.greeting-meta{ margin:0; font-size:1rem; color:#2c1f17; line-height:1; text-indent:0; }
.signature-image{
  display:block; width:180px; height:auto; margin-top:-.28rem;
  filter:drop-shadow(2px 2px 5px rgba(0,0,0,.2));
}

/* ---- 財団概要 ---- */
.foundation-info-section{ margin:2rem auto 3rem; max-width:1100px; }
.foundation-info-section .section-title{
  font-size:clamp(1.55rem,1.9vw,1.9rem); letter-spacing:.04em; margin:1.8rem auto 1rem;
}
.foundation-info-table{
  background:#fff; border-radius:14px; box-shadow:0 6px 24px rgba(45,140,255,.06);
  padding:1.5rem 1.25rem; margin:0 auto; font-size:1rem; line-height:1.75;
}
.foundation-info-table table{
  width:100%; border-collapse:collapse; font-size:inherit; font-family:'Yu Gothic UI','YuGothic',sans-serif;
}
.foundation-info-table th, .foundation-info-table td{
  padding:.7rem .9rem; border-bottom:1px solid #e7e7e7; vertical-align:top; text-align:left;
}
.foundation-info-table th{
  width:12rem; color:var(--accent-green); font-weight:700; letter-spacing:.06em; white-space:nowrap;
}
.foundation-info-table td{ color:#212121; }
.foundation-info-table tr:last-child th, .foundation-info-table tr:last-child td{ border-bottom:none; }
.foundation-info-table a{ color:var(--brand); text-decoration:underline; word-break:break-all; }

/* ---- Buttons ---- */
.button{
  display:inline-block; padding:.5rem 1.1rem; background-color:var(--brand); color:#fff;
  text-decoration:none; border-radius:6px; font-weight:600; font-size:.95rem; transition:background-color .3s ease;
}
.button:hover{ background-color:var(--brand-ink); }

/* ---- Footer spacing ---- */
footer.footer{ margin-top:4rem; }

/* ---- Responsive ---- */
@media (max-width: 768px){
  .section,.foundation-box,.president-box,.philosophy{ padding:1.25rem 1rem; }
  .signature-image{ width:160px; }
}

/* ========== Smartphone (～767px) only ========== */
@media (max-width: 767px) {
  .hero .hero-text h1 { font-size: 1.35rem; letter-spacing: .04em; }

  .greeting-card { padding: 1.25rem 1rem; }
  .greeting-photo img { width: min(520px, 94%); }
  .greeting-text { width: min(520px, 94%); font-size: 1rem; line-height: 1.9; }
  .signature-image { width: 160px; }

  .foundation-info-section { padding: 0 1rem; }
  .foundation-info-table { padding: 1rem; box-shadow: 0 6px 18px rgba(0,0,0,.06); border-radius: 12px; }
  .foundation-info-table table,
  .foundation-info-table tbody,
  .foundation-info-table tr,
  .foundation-info-table th,
  .foundation-info-table td { display: block; width: 100%; }
  .foundation-info-table tr { background:#fff; border:1px solid #e7e7e7; border-radius:12px; padding:12px 14px; margin:12px 0; }
  .foundation-info-table th { border:0; padding:0 0 6px 0; color:var(--accent-green); font-weight:800; letter-spacing:.04em; }
  .foundation-info-table td { border:0; padding:0; color:#212121; line-height:1.8; word-break:break-word; overflow-wrap:anywhere; }

  .container { padding: 1.25rem 1rem 2rem; }
  .floating-nav { display: none !important; }
}

/* 小画面微調整（任意） */
@media (max-width: 480px) {
  .greeting-text { font-size: .98rem; }
  .foundation-info-table tr { padding: 10px 12px; }
}

/* =========================================
   追加：見た目はそのまま／操作だけ通す（スマホ限定）
   ========================================= */
@media (max-width: 768px) {
  /* 背景はクリック不可 → 背後のヘッダー/ハンバーガーに届く */
  .hero { pointer-events: none; }
  /* 文字は通常通り操作可（リンク等も可） */
  .hero .hero-text,
  .hero .hero-text * { pointer-events: auto; }
}