/*
 * Hephaestusによる静的ページの美の法典 Ver. 2.0 (究極進化版)
 */

/* ============================================= */
/* 0. 全ての静的ページに共通する“器”            */
/* ============================================= */
.static-page-card {
    background-color: #ffffff; border-radius: 16px; padding: 30px 40px 40px 40px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.05); border: 1px solid #e2e8f0;
}
.static-page-header {
    text-align: center; margin-bottom: 40px; padding-bottom: 25px; border-bottom: 1px solid #e2e8f0;
}
.static-page-header h1 {
    font-size: 2.5em; color: var(--primary-color); margin: 0 0 10px 0; font-weight: bold;
}
.static-page-header p { font-size: 1.1em; color: #4a5568; margin: 0; }

.page-content { max-width: 800px; margin: 0 auto; }
.page-content .content-section { margin-bottom: 50px; }
.page-content .content-section h2 {
    font-size: 1.8em; color: var(--primary-color); text-align: center;
    margin-bottom: 30px; padding-bottom: 15px; border-bottom: 2px solid #eaf2fa;
}
.page-content p { font-size: 1.1em; line-height: 2; color: #2d3748; }

/* ============================================= */
/* 1. 対話セクション (真・完全無欠版)             */
/* ============================================= */
.commentary-section { margin-bottom: 40px; }
.commentary { display:flex; align-items:flex-start; gap:15px; margin-bottom:25px; }
.commentary:last-child { margin-bottom:0; }
.commentary img { width: 60px; height: auto; flex-shrink: 0; } /* ★★【絶対の掟】魂の比率を、ここに宣言する ★★ */
.commentary .bubble { padding:18px 22px; border-radius:18px; position:relative; line-height:1.8; font-size:1.1em; width:100%; border:1px solid; }
.chisamaru-comment .bubble { background-color:#ebf8ff; color:#2c5282; border-color:#bee3f8;}
.chisamaru-comment .bubble::before { content:''; position:absolute; top:20px; left:-9px; width:0; height:0; border:9px solid transparent; border-right-color:#bee3f8; }
.chisamaru-comment .bubble::after { content:''; position:absolute; top:20px; left:-8px; width:0; height:0; border:9px solid transparent; border-right-color:#ebf8ff; } /* しっぽに色をつけるトリック */
.correct-comment { flex-direction:row-reverse; }
.correct-comment .bubble { background-color:#f7fafc; color:#4a5568; border-color:#e2e8f0; }
.correct-comment .bubble::before { content:''; position:absolute; top:20px; right:-9px; width:0; height:0; border:9px solid transparent; border-left-color:#e2e8f0; }
.correct-comment .bubble::after { content:''; position:absolute; top:20px; right:-8px; width:0; height:0; border:9px solid transparent; border-left-color:#f7fafc; }
.connect-comment { flex-direction: row-reverse; }
.connect-comment .bubble { background-color: #fffaf0; color: #744210; border-color:#feebc8;}
.connect-comment .bubble::before { content:''; position:absolute; top:20px; right:-9px; width:0; height:0; border:9px solid transparent; border-left-color:#feebc8; }
.connect-comment .bubble::after { content:''; position:absolute; top:20px; right:-8px; width:0; height:0; border:9px solid transparent; border-left-color:#fffaf0; }
/* ============================================= */
/* 2. `about.php` 専用                         */
/* ============================================= */
.about-intro { margin: 0 auto 50px auto; }
.features-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 30px; }
.feature-item { text-align: center; padding: 25px; background: #f7fafc; border-radius: 12px; border: 1px solid #e2e8f0; }
.feature-icon { font-size: 3.5em; line-height: 1; margin-bottom: 15px; }
.feature-item h3 { font-size: 1.3em; color: var(--secondary-color); margin: 0 0 10px 0; }
.feature-item p { font-size: 1em; line-height: 1.8; color: #4a5568; }
.about-section { padding: 25px; border-left: 5px solid #cbd5e0; background-color: #f7fafc; border-radius: 8px; }

/* ============================================= */
/* 3. `coop.php` 専用                          */
/* ============================================= */
.credit-section { margin-bottom: 35px; }
.credit-section h2 { font-size: 1.6em; color: var(--secondary-color); border-bottom: 2px solid #eaf2fa; padding-bottom: 10px; margin-bottom: 20px; font-weight: bold; }
.credit-list { list-style: none; padding: 0; font-size: 1.1em; line-height: 2; }
.credit-list li { padding-left: 10px; border-left: 3px solid #cbd5e0; margin-bottom: 10px; }
.credit-list li strong { color: #2d3748; }
.credit-list .small-note { font-size: 0.9em; color: #a0aec0; border-left: none; padding-left: 0; text-align: right; }

/* ============================================= */
/* 4. `terms.php` & `faq.php` 専用 (アコーディオン) */
/* ============================================= */
.legal-accordion { border-bottom: 1px solid #e2e8f0; }
.legal-accordion summary { display: flex; justify-content: space-between; align-items: center; padding: 20px 10px; cursor: pointer; list-style: none; transition: background-color 0.2s; }
.legal-accordion summary::-webkit-details-marker { display: none; }
.legal-accordion summary:hover { background-color: #f7fafc; }
.legal-accordion summary h3 { margin: 0; font-size: 1.5em; color: var(--primary-color); }
.legal-accordion summary::after { content: '▼'; font-size: 0.8em; color: var(--primary-color); transition: transform 0.3s; }
.legal-accordion[open] summary::after { transform: rotate(180deg); }
.legal-content { padding: 10px 20px 30px 20px; }
.legal-text .preamble { background-color: #f7fafc; padding: 25px; margin-bottom: 30px; border-radius: 8px; border-left: 5px solid var(--secondary-color); }

/* ============================================= */
/* 5. `sitemap.php` (コネクト思想・再鋳造)        */
/* ============================================= */
.sitemap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 30px; }
.sitemap-category-card { background-color: #f7fafc; border-radius: 12px; padding: 25px; border: 1px solid #e2e8f0; }
.sitemap-category-title { font-size: 1.5em; font-weight: bold; color: var(--primary-color); border-bottom: 2px solid var(--accent-color); display: flex; align-items: center; gap: 10px; padding-bottom: 10px; margin-bottom: 15px; }
.sitemap-category-card .sitemap-list { list-style: none; padding: 0; }
.sitemap-category-card .sitemap-list li { margin-bottom: 12px; }
.sitemap-category-card .sitemap-list li::before { content: '»'; color: var(--secondary-color); font-weight: bold; margin-right: 10px; }
.sitemap-category-card a { text-decoration: none; color: var(--secondary-color); font-size: 1.1em; font-weight: 500; }
.sitemap-category-card a:hover { text-decoration: underline; color: var(--accent-color); }

/* ============================================= */
/* 6. 汎用スタイル (日付など)                     */
/* ============================================= */
.revision-date { margin-top: 50px; padding-top: 20px; border-top: 1px solid #e2e8f0; text-align: right; font-size: 1em; color: #718096; }