/*
 * P-SIX Theme — npo.css
 * NPO法人ページ群の固有スタイル
 */

/* Values / Pillars */
.values { background: var(--snow); }
.values-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 48px; }
.value-card { padding: 40px 32px; background: var(--white); border: 1px solid var(--pearl); border-radius: 2px; text-align: center; transition: all .4s; }
.value-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(0,0,0,.05); border-color: transparent; }
.value-icon { font-size: 36px; margin-bottom: 16px; }
.value-card h3 { font-size: 16px; font-weight: 600; margin-bottom: 12px; color: var(--ink); }
.value-card p { font-size: 13px; font-weight: 300; color: var(--steel); line-height: 2; }

/* Activities */
.activities { background: var(--white); }
.act-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 48px; }
.act-card { border: 1px solid var(--pearl); border-radius: 2px; overflow: hidden; transition: all .4s; }
.act-card:hover { transform: translateY(-4px); box-shadow: 0 16px 48px rgba(0,0,0,.05); }
.act-card img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.act-card-body { padding: 28px; }
.act-nm { font-size: 16px; font-weight: 600; color: var(--ink); margin-bottom: 8px; }
.act-card-body p { font-size: 13px; color: var(--steel); line-height: 2; font-weight: 300; }

/* Activity detail (activities page) */
.activity-block { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; padding: 100px 60px; }
.activity-block:nth-child(even) { background: var(--snow); }
.activity-block.reverse { direction: rtl; }
.activity-block.reverse > * { direction: ltr; }
.activity-block h2 { font-family: 'Playfair Display', serif; font-size: clamp(24px, 3vw, 34px); font-weight: 400; color: var(--ink); line-height: 1.7; margin-bottom: 20px; }
.activity-block h2 em { font-style: italic; color: var(--green); }
.activity-block p { font-size: 14px; font-weight: 300; color: var(--steel); line-height: 2.4; }
.activity-block img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 2px; display: block; box-shadow: 0 24px 64px rgba(0,0,0,.08); }

/* Support cards (donate page) */
.support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; margin-top: 48px; }
.support-card { padding: 40px 32px; background: var(--white); border: 1px solid var(--pearl); border-radius: 2px; transition: all .4s; }
.support-card:hover { transform: translateY(-4px); box-shadow: 0 12px 40px rgba(0,0,0,.05); }
.support-card h3 { font-size: 18px; font-weight: 600; color: var(--ink); margin-bottom: 12px; }
.support-card .fee { font-family: 'DM Sans', sans-serif; font-size: 14px; color: var(--green); margin-bottom: 16px; }
.support-card p { font-size: 13px; color: var(--steel); line-height: 2; font-weight: 300; }

/* Corp info table */
.corp-info { background: var(--snow); }

/* Volunteer / Sponsor */
.volunteer, .sponsor { background: var(--white); }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }
.two-col h2 { font-family: 'Playfair Display', serif; font-size: clamp(24px, 3vw, 34px); font-weight: 400; color: var(--ink); line-height: 1.7; margin-bottom: 20px; }
.two-col h2 em { font-style: italic; color: var(--green); }
.two-col p { font-size: 14px; font-weight: 300; color: var(--steel); line-height: 2.4; }
.two-col img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border-radius: 2px; display: block; }

/* Contact section */
.contact { background: var(--snow); }
.contact-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 40px; }

/* ═══ RESPONSIVE ═══ */
@media (max-width: 1024px) {
  .values-grid, .support-grid { grid-template-columns: 1fr; }
  .act-grid { grid-template-columns: 1fr; }
  .activity-block, .two-col, .contact-grid { grid-template-columns: 1fr; gap: 48px; }
  .activity-block.reverse { direction: ltr; }
}

@media (max-width: 768px) {
  .activity-block { padding: 60px 24px; }
}