.school-page {
    background: var(--c-bg-card);
    border-radius: var(--r);
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
    padding: 32px;
    margin: 16px 0 32px;
}

.school-page__head {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
    flex-wrap: wrap;
}

.school-page__logo {
    width: 140px;
    height: 96px;
    flex-shrink: 0;
    border: 1px solid var(--c-border);
    border-radius: 10px;
    background: var(--c-bg-card);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: 8px;
}

.school-page__logo img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.school-page__logo .logo-fallback { font-size: 40px; }

.school-page__title-wrap h1 {
    font-size: 32px;
    margin: 0 0 8px;
    color: var(--c-text-heading);
}

.school-page__category {
    color: var(--c-text-body);
    margin: 0 0 12px;
    font-size: 14px;
}

.school-page__category a { color: var(--c-primary); }

.school-page__cta {
    display: inline-block;
    background: var(--c-primary);
    color: #fff;
    padding: 10px 20px;
    border-radius: var(--r-sm);
    font-size: 15px;
    font-weight: 600;
    transition: background .15s;
}

.school-page__cta:hover {
    background: var(--c-primary-hover);
    color: #fff;
    text-decoration: none;
}

.school-page h2 {
    font-size: 20px;
    margin: 28px 0 12px;
    color: var(--c-text-heading);
}

.school-page__description p { color: var(--c-text-body); line-height: 1.7; }

.school-promo-list { display: flex; flex-direction: column; gap: 12px; }

.school-promo {
    border: 1px solid var(--c-border);
    border-left: 3px solid var(--c-orange-border);
    border-radius: var(--r-sm);
    padding: 14px 16px;
    background: var(--c-orange-bg-light);
}

.school-promo a { color: inherit; display: block; }
.school-promo a:hover { text-decoration: none; }
.school-promo a:hover .school-promo__title { color: var(--c-orange); }

.school-promo__title {
    font-size: 15px;
    font-weight: 600;
    margin: 0 0 4px;
    color: var(--c-dark);
}

.school-promo__desc { font-size: 13px; color: var(--c-text-faint); margin: 0 0 6px; }

.school-promo__meta {
    display: flex;
    gap: 12px;
    align-items: center;
    flex-wrap: wrap;
    font-size: 13px;
}

.school-promo__discount { color: var(--c-orange); font-weight: 700; }
.school-promo__period { color: var(--c-text-faint); }

.school-page__external { margin-top: 24px; font-size: 15px; }
.school-page__faq { margin-top: 32px; }

.faq-list { display: flex; flex-direction: column; gap: 8px; }

.faq-item {
    border: 1px solid var(--c-border);
    border-radius: var(--r-sm);
    background: var(--c-bg-subtle);
    overflow: hidden;
}

.faq-item__question {
    padding: 14px 16px;
    font-weight: 600;
    color: var(--c-dark);
    cursor: pointer;
    list-style: none;
    position: relative;
    font-size: 15px;
}

.faq-item__question::-webkit-details-marker { display: none; }

.faq-item__question::after {
    content: "+";
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--c-text-faint);
    font-size: 20px;
    font-weight: 400;
    transition: transform .15s;
}

.faq-item[open] .faq-item__question::after { content: "−"; }
.faq-item__question:hover { color: var(--c-primary); }

.faq-item__answer {
    padding: 0 16px 16px;
    color: var(--c-text-body);
    font-size: 14px;
    line-height: 1.6;
}

.school-page__compare-links {
    background: var(--c-bg-card);
    border-radius: var(--r);
    padding: 24px 32px;
    margin-bottom: 32px;
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
}

.school-page__compare-links h2 { font-size: 18px; margin: 0 0 16px; }

.compare-links { display: flex; flex-wrap: wrap; gap: 8px; }

.compare-link {
    display: inline-block;
    background: var(--c-primary-light);
    border: 1px solid var(--c-primary-tag-hover);
    color: var(--c-primary-tag-text);
    padding: 6px 12px;
    border-radius: var(--r-sm);
    font-size: 13px;
}

.compare-link:hover { background: var(--c-primary-tag); text-decoration: none; }

.school-page__related h2 { font-size: 20px; margin: 0 0 16px; }

.compare-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    margin-bottom: 32px;
}

@media (min-width: 768px) {
    .compare-cards { grid-template-columns: 1fr 1fr; }
}

.compare-card {
    background: var(--c-bg-card);
    border-radius: var(--r);
    padding: 24px;
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
}

.compare-card__head {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 12px;
}

.compare-card__head img {
    width: 80px;
    height: 56px;
    object-fit: contain;
    border: 1px solid var(--c-border);
    border-radius: var(--r-sm);
    background: var(--c-bg-card);
    padding: 4px;
}

.compare-card h2 { margin: 0; font-size: 20px; }
.compare-card h2 a { color: var(--c-text-heading); }
.compare-card__cat { color: var(--c-text-faint); font-size: 13px; margin: 8px 0 0; }

.compare-section {
    background: var(--c-bg-card);
    border-radius: var(--r);
    padding: 20px 24px;
    margin-bottom: 16px;
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
}

.compare-section h2 { font-size: 18px; margin: 0 0 12px; }

.compare-list li {
    padding: 8px 0;
    border-bottom: 1px solid var(--c-border-light);
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    align-items: baseline;
}

.compare-list li:last-child { border-bottom: none; }

.about-page,
.legal-page {
    background: var(--c-bg-card);
    border-radius: var(--r);
    padding: 32px;
    box-shadow: 0 4px 12px rgba(0,0,0,.05);
    max-width: 860px;
}

.about-page h2,
.legal-page h2 {
    font-size: 20px;
    margin: 24px 0 8px;
    color: var(--c-text-heading);
}

.about-page p, .about-page li,
.legal-page p, .legal-page li {
    color: var(--c-text-body);
    line-height: 1.7;
}

.about-page ul,
.legal-page ul { list-style: disc; padding-left: 20px; }
.about-page li,
.legal-page li { margin-bottom: 4px; }

.legal-page__meta {
    color: var(--c-text-faint);
    font-size: 13px;
    margin: 0 0 24px;
}

@media (max-width: 640px) {
    .school-page { padding: 20px; }
    .school-page__title-wrap h1 { font-size: 24px; }
    .legal-page { padding: 20px; }
}