/* Trang cơ sở (theme.includes.branch_page): /trung-tam-tieng-anh-chau-doc, /trung-tam-tieng-anh-an-chau */
.cs{--cs-red:#e31e36;--cs-dark:#1f2937;--cs-text:#4b5563;--cs-gray:#f5f6f8;--cs-line:#e5e7eb;color:var(--cs-text)}
.cs a{color:var(--cs-red)}
.cs-narrow{max-width:860px}
.cs-sec{padding:56px 0}
.cs-sec--gray{background:var(--cs-gray)}
.cs-h2{color:var(--cs-dark);font-size:1.75rem;font-weight:800;margin-bottom:12px}
.cs-sub{margin-bottom:24px}

.cs-hero{padding:32px 0 48px;background:linear-gradient(180deg,#fff5f6 0%,#fff 100%)}
.cs-crumb .breadcrumb{margin-bottom:12px;font-size:14px}
.cs-crumb .breadcrumb-item a{color:var(--cs-text)}
.cs-crumb .breadcrumb-item+.breadcrumb-item::before{color:#9ca3af}
.cs-hero__title{color:var(--cs-red);font-size:2.4rem;font-weight:900;line-height:1.2;margin-bottom:12px}
.cs-hero__lead{font-size:1.05rem;margin-bottom:20px}
.cs-hero__img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.12)}
.cs-info{list-style:none;padding:0;margin:0 0 24px}
.cs-info li{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px;color:var(--cs-dark)}
.cs-info i{color:var(--cs-red);width:18px;margin-top:4px;text-align:center}
.cs-info a{color:var(--cs-dark);font-weight:700;text-decoration:none}
.cs-cta{display:flex;flex-wrap:wrap;gap:12px}
.cs-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 22px;border-radius:999px;font-weight:700;text-decoration:none;border:2px solid var(--cs-red)}
.cs .cs-btn--red{background:var(--cs-red);color:#fff}
.cs .cs-btn--red:hover{background:#c4142b;color:#fff}
.cs .cs-btn--line{background:#fff;color:var(--cs-red)}
.cs .cs-btn--line:hover{background:#fff5f6}

.cs-intro p{font-size:1.05rem;line-height:1.75}

.cs-card{display:flex;flex-direction:column;height:100%;padding:22px;background:#fff;border:1px solid var(--cs-line);border-top:4px solid var(--cs-red);border-radius:12px;text-decoration:none;transition:transform .15s,box-shadow .15s}
.cs-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(0,0,0,.08)}
.cs-card__age{align-self:flex-start;font-size:12px;font-weight:700;color:var(--cs-red);background:#fff0f2;padding:3px 10px;border-radius:999px;margin-bottom:10px}
.cs-card__title{color:var(--cs-dark);font-size:1.2rem;font-weight:800;margin-bottom:6px}
.cs-card__levels{color:var(--cs-text);flex:1;margin-bottom:12px}
.cs-card__more{font-weight:700;font-size:14px;color:var(--cs-red)}

.cs-facts{margin-bottom:24px}
.cs-fact{height:100%;padding:20px;border-radius:12px;background:var(--cs-gray);text-align:center}
.cs-fact b{display:block;color:var(--cs-red);font-size:1.8rem;font-weight:900;line-height:1.1}
.cs-fact span{font-size:14px}
.cs-list{padding-left:1.2rem}
.cs-list li{margin-bottom:8px}

.cs-map{position:relative;height:100%;min-height:340px;border-radius:12px;overflow:hidden;background:#e5e7eb}
.cs-map iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.cs-box{height:100%;padding:24px;background:#fff;border-radius:12px;border:1px solid var(--cs-line)}
.cs-box h3{color:var(--cs-dark);font-size:1.15rem;font-weight:800;margin-bottom:12px}
.cs-box p{margin-bottom:8px}
.cs-box i{color:var(--cs-red);width:18px}
.cs-note{font-size:14px;font-style:italic}
.cs-others{padding-left:1.1rem;margin:0;font-size:14px}
.cs-others li{margin-bottom:6px}

.cs-news{display:block;height:100%;background:#fff;border:1px solid var(--cs-line);border-radius:12px;overflow:hidden;text-decoration:none}
.cs-news img{width:100%;aspect-ratio:16/10;object-fit:cover}
.cs-news__date{display:block;padding:12px 16px 0;font-size:13px;color:#9ca3af}
.cs .cs-news__title{display:block;padding:4px 16px 16px;color:var(--cs-dark);font-weight:700;line-height:1.4}
.cs-news:hover .cs-news__title{color:var(--cs-red)}

.cs-faq{background:#fff;border:1px solid var(--cs-line);border-radius:10px;margin-bottom:10px}
.cs-faq summary{cursor:pointer;padding:16px 20px;font-weight:700;color:var(--cs-dark);list-style:none;position:relative;padding-right:44px}
.cs-faq summary::-webkit-details-marker{display:none}
.cs-faq summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);color:var(--cs-red);font-size:1.4rem;font-weight:400}
.cs-faq[open] summary::after{content:"−"}
.cs-faq>div{padding:0 20px 8px}

@media (max-width:767.98px){
    .cs-sec{padding:40px 0}
    .cs-hero__title{font-size:1.8rem}
    .cs-h2{font-size:1.4rem}
    .cs-map{min-height:280px}
}
