/*
    Hestia's Definitive Blueprint for the "Legal" Sanctuaries (Commentary Edition)
    ------------------------------------------------------------------------------
    File: legal.css
    Role: To create a sacred space of covenants, now with an intelligent guide.
*/

/* --- [O] The Unbreakable Vows: Global Elements & The Oath of 1100px --- */
:root { /* (style.cssから、基本変数を、継承) */ }
.container { max-width: 1100px; margin-left: auto; margin-right: auto; padding-left: 2rem; padding-right: 2rem; }
@media (max-width: 768px) { .container { padding-left: 1.5rem; padding-right: 1.5rem; } }

/* --- [I] The Sanctuary Gate: Hero Section --- */
.hero-legal { min-height: 300px; background-image: linear-gradient(to top, rgba(62, 62, 62, 0.8), rgba(120, 120, 120, 0.4)), url('../images/common/legal-hero.jpg'); }
.hero-project { display: flex; align-items: center; padding: 4rem 0; }
.hero-project-content { text-align: left; color: white; }
.project-title { font-family: 'Noto Serif JP', serif; font-size: clamp(2.5rem, 5vw, 3.5rem); margin: 0; border-left: 4px solid var(--color-secondary); padding-left: 1.5rem; }
.project-catchcopy { font-size: 1.2rem; opacity: 0.9; margin-top: 1rem; padding-left: calc(1.5rem + 4px); }
.legal-body { padding: 5rem 0; font-size: 1.1rem; line-height: 1.8; background-color: #ffffff; }
.legal-body .container { max-width: 800px; }
.legal-preface.with-guide { display: flex; align-items: center; gap: 2rem; background-color: #e3f2fd; padding: 2rem; border-radius: 8px; margin-bottom: 4rem; }
.guide-character { flex-shrink: 0; }
.guide-character img { height: 80px; }
.guide-text h3 { margin: 0 0 0.5rem 0; font-size: 1.3rem; color: var(--color-primary); }
.guide-text p { margin: 0; font-size: 1rem; }
.lang-switcher { display: flex; border-bottom: 2px solid #e0e0e0; margin-bottom: 2rem; }
.lang-tab { padding: 1rem 1.5rem; border: none; background-color: transparent; cursor: pointer; font-size: 1.1rem; font-weight: bold; color: #777; position: relative; bottom: -2px; }
.lang-tab.active { color: var(--color-primary); border-bottom: 2px solid var(--color-primary); }
.lang-content-wrapper { position: relative; }
.lang-content { display: none; }
.lang-content.is-visible { display: block; animation: fade-in 0.5s; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } }
.legal-article { margin-bottom: 3rem; }
.legal-article h2 { font-family: var(--font-family-title); font-size: 1.8rem; color: var(--color-primary); margin: 0 0 1rem 0; padding-bottom: 0.5rem; border-bottom: 2px solid #e0e0e0; }
.legal-article p { margin: 0; }
.legal-article ul { list-style: none; padding: 0; margin-top: 1rem; background-color: #f8f9fa; border-left: 5px solid var(--color-secondary); padding: 1.5rem 1.5rem 1.5rem 2.5rem; border-radius: 8px; }
.legal-article li { position: relative; padding-left: 1.5em; margin-bottom: 0.5rem; }
.legal-article li::before { content: '・'; position: absolute; left: 0; }
.legal-article li:last-child { margin-bottom: 0; }
.legal-footer { margin-top: 4rem; padding-top: 2rem; border-top: 1px solid #e0e0e0; text-align: right; font-size: 0.9rem; color: #555; }

/*
    Hestia's Definitive Blueprint for the "Legal" Sanctuaries (Recruitment Edition)
    --------------------------------------------------------------------------------
    File: legal.css
    Role: To create a sacred space of covenants, now adapted for our future crew.
*/

/* (前略：.container, .hero-legal, .legal-body, .legal-article などの、基本スタイルは、前回の、美しい、意匠のままとします) */

/* Hestia's Ultimate Creation: “比較表”の、意匠 */
.comparison-table {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    margin-top: 1.5rem;
}
@media (max-width: 768px) { .comparison-table { grid-template-columns: 1fr; } }
.table-col {
    background-color: #f8f9fa;
    padding: 1.5rem;
    border-radius: 8px;
}
.table-col h3 {
    margin: 0 0 1rem 0;
    text-align: center;
    border-bottom: 2px solid #ddd;
    padding-bottom: 0.5rem;
}
.table-col ul {
    font-size: 0.9rem;
    padding-left: 1.5rem;
}

/* Hestia's Ultimate Creation: “模擬試験”の、意匠 */
.quiz-block {
    margin-top: 1.5rem;
    padding: 1.5rem;
    border: 1px dashed #b0bec5;
    border-radius: 8px;
}
.quiz-block h4 {
    margin: 0 0 1rem 0;
    font-size: 1.2rem;
    color: var(--color-primary);
}
.quiz-block p {
    font-size: 1rem;
}
.quiz-block ol {
    padding-left: 2rem;
    font-size: 1rem;
}
.quiz-block strong {
    color: #43a047;
}


/* (後略：.correct-commentary, .legal-footer などの、スタイルは、変更ございません) */