/* Analysis Article Styles */

.ep-analysis-table-wrap {
    overflow-x: auto;
    margin: 1.5em 0;
}

.ep-analysis-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    white-space: nowrap;
}

.ep-analysis-table th,
.ep-analysis-table td {
    padding: 10px 14px;
    border: 1px solid #e0e0e0;
    text-align: right;
}

.ep-analysis-table th {
    background: #1a1a2e;
    color: #fff;
    font-weight: 600;
    text-align: center;
}

.ep-analysis-table td:first-child,
.ep-analysis-table th:first-child {
    text-align: center;
}

.ep-analysis-table tbody tr:nth-child(even) {
    background: #f8f9fa;
}

.ep-analysis-table tbody tr:hover {
    background: #eef2ff;
}

.ep-analysis-cta {
    margin: 2em 0;
    padding: 1.5em;
    background: linear-gradient(135deg, #1a1a2e 0%, #16213e 100%);
    border-radius: 8px;
    color: #fff;
}

.ep-analysis-cta h2 {
    color: #fff;
    margin-top: 0;
    font-size: 1.2rem;
}

.ep-analysis-cta p {
    color: rgba(255, 255, 255, 0.9);
}

.ep-analysis-cta-link {
    display: inline-block;
    padding: 10px 24px;
    background: #c9a84c;
    color: #1a1a2e;
    text-decoration: none;
    font-weight: 600;
    border-radius: 4px;
    transition: background 0.2s;
}

.ep-analysis-cta-link:hover {
    background: #d4b85c;
    color: #1a1a2e;
}

@media (max-width: 768px) {
    .ep-analysis-table {
        font-size: 0.8rem;
    }

    .ep-analysis-table th,
    .ep-analysis-table td {
        padding: 6px 8px;
    }
}

/* ------------------------------------------------------------------
   階数比較記事（低層階 VS 上層階 / post 143）用の追加パーツ
   - .is-prose は文章セル用の修飾子（既定の nowrap・右寄せを解除する）
   - 色は design-system.css のトークンを参照（§17.1）
   ------------------------------------------------------------------ */

.ep-floor-lead {
    font-size: 1.05em;
    line-height: 1.9;
}

.ep-floor-toc {
    margin: 2em 0;
    padding: 18px 20px;
    border: 1px solid rgba(188, 149, 92, .38);
    border-radius: var(--ep-radius, 4px);
    background: rgba(188, 149, 92, .06);
}

.ep-floor-toc-title {
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--ep-ink, #23292c);
}

.ep-floor-toc ul {
    margin: 0;
    padding: 0 0 0 1.1em;
}

.ep-floor-toc li {
    margin: 0 0 4px;
    font-size: 14px;
    line-height: 1.7;
}

.ep-floor-toc a {
    color: var(--ep-gold-deep, #7b592f) !important;
    text-decoration: none;
}

.ep-floor-toc a:hover {
    text-decoration: underline;
}

/* 文章を入れる比較表（メリット・デメリット等） */
.ep-analysis-table.is-prose {
    white-space: normal;
}

.ep-analysis-table.is-prose th,
.ep-analysis-table.is-prose td {
    text-align: left;
    line-height: 1.7;
    vertical-align: top;
}

.ep-analysis-table.is-prose th {
    text-align: center;
}

.ep-analysis-table.is-prose td:first-child,
.ep-analysis-table.is-prose th:first-child {
    text-align: left;
}

.ep-analysis-table.is-prose thead th {
    text-align: center;
}

/* 数表の中の強調（倍率など）はゴールドで拾わせる */
.ep-analysis-table td strong {
    color: var(--ep-gold-deep, #7b592f);
}

.ep-floor-note {
    margin: .6em 0 1.6em;
    font-size: .86em;
    line-height: 1.7;
    color: #666;
}

@media (max-width: 768px) {
    .ep-analysis-table.is-prose th,
    .ep-analysis-table.is-prose td {
        min-width: 150px;
    }
}

/* 換算早見表のように最終列が説明文の表は、その列だけ左寄せに戻す */
.ep-analysis-table.is-lastnote td:last-child {
    text-align: left;
    white-space: normal;
}

/* 横に溢れる表であることを明示する（スクロールしても左端に残るよう sticky） */
@media (max-width: 768px) {
    .ep-floor-scroll::before {
        content: "→ 横にスクロールできます";
        display: block;
        position: sticky;
        left: 0;
        width: max-content;
        margin: 0 0 4px;
        font-size: 11px;
        line-height: 1.4;
        color: #8a8a8a;
    }
}

/* よくある質問のアコーディオン。
   typography.css 側の details/summary が !important で余白と枠を潰しているので、
   ここでも !important で上書きする（このコードベースの既定の作法）。 */
.ep-floor-faq {
    margin: 0 0 8px !important;
    padding: 0 16px;
    border: 1px solid rgba(35, 41, 44, .14) !important;
    border-radius: var(--ep-radius, 4px) !important;
    background: #fff;
    font-size: 15px;
    line-height: 1.8;
}

.ep-floor-faq:hover {
    border-color: var(--ep-gold, #BC955C) !important;
}

.ep-floor-faq > summary {
    position: relative;
    margin: 0 -16px !important;
    padding: 13px 42px 13px 16px !important;
    font-weight: 700;
    font-size: 15px;
    line-height: 1.6;
    color: var(--ep-ink, #23292c);
}

.ep-floor-faq[open] > summary {
    margin: 0 -16px 12px !important;
    border-bottom: 1px solid rgba(35, 41, 44, .10);
}

.ep-floor-faq > summary::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 18px;
    width: 8px;
    height: 8px;
    margin-top: -6px;
    border-right: 2px solid var(--ep-gold, #BC955C);
    border-bottom: 2px solid var(--ep-gold, #BC955C);
    transform: rotate(45deg);
    transition: transform .2s ease;
}

.ep-floor-faq[open] > summary::after {
    margin-top: -2px;
    transform: rotate(-135deg);
}

.ep-floor-faq[open] {
    padding-bottom: 14px;
}