/* ==========================================================================
   Design tokens — light theme
   ========================================================================== */
:root {
    --sig-brand-900: #1e1b4b;
    --sig-brand-800: #312e81;
    --sig-brand-700: #4338ca;
    --sig-brand-600: #4f46e5;
    --sig-brand-500: #6366f1;
    --sig-brand-400: #818cf8;
    --sig-brand-200: #c7d2fe;
    --sig-brand-100: #e0e7ff;
    --sig-brand-50:  #eef2ff;

    --sig-accent-600: #d97706;
    --sig-accent-500: #f59e0b;
    --sig-accent-100: #fef3c7;
    --sig-accent-50:  #fffbeb;

    --sig-ink:     #0f172a;
    --sig-body:    #475569;
    --sig-muted:   #8a93a6;
    --sig-border:  #e3e6ee;
    --sig-white:   #ffffff;
    --sig-bg:      #f8fafc;
    --sig-bg-soft: #f1f5f9;

    --sig-success: #16a34a;
    --sig-danger:  #dc2626;

    --sig-radius-xl: 1rem;
    --sig-radius-lg: .85rem;
    --sig-radius:    .6rem;
    --sig-radius-sm: .45rem;

    --sig-shadow-xs: 0 1px 2px rgba(15, 23, 42, .05);
    --sig-shadow-sm: 0 1px 3px rgba(15, 23, 42, .07);
    --sig-shadow:    0 6px 20px -8px rgba(15, 23, 42, .14);

    --sig-sans: 'Inter', 'Segoe UI', system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }

body {
    background-color: var(--sig-bg);
    font-family: var(--sig-sans);
    color: var(--sig-body);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4 {
    font-family: var(--sig-sans);
    font-weight: 700;
    color: var(--sig-ink);
    letter-spacing: -.015em;
    line-height: 1.2;
}
h5, h6 { font-family: var(--sig-sans); font-weight: 700; color: var(--sig-ink); }

a { color: var(--sig-brand-600); }
a:hover { color: var(--sig-brand-700); }

.text-muted { color: var(--sig-muted) !important; }

/* Eyebrow labels ----------------------------------------------------- */
.sig-eyebrow {
    display: inline-block;
    font-family: var(--sig-sans); font-weight: 700; font-size: .72rem;
    text-transform: uppercase; letter-spacing: .08em; color: var(--sig-brand-600);
}

/* ==========================================================================
   Buttons & form controls
   ========================================================================== */
.btn { border-radius: var(--sig-radius-sm); font-weight: 600; padding: .62rem 1.3rem; font-size: .875rem; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.btn-primary {
    --bs-btn-bg: var(--sig-brand-600);
    --bs-btn-border-color: var(--sig-brand-600);
    --bs-btn-hover-bg: var(--sig-brand-700);
    --bs-btn-hover-border-color: var(--sig-brand-700);
    --bs-btn-active-bg: var(--sig-brand-700);
    --bs-btn-active-border-color: var(--sig-brand-700);
}
.btn-outline-primary {
    --bs-btn-color: var(--sig-brand-600);
    --bs-btn-border-color: var(--sig-brand-200);
    --bs-btn-hover-bg: var(--sig-brand-600);
    --bs-btn-hover-border-color: var(--sig-brand-600);
}
.btn-light { border-radius: var(--sig-radius-sm); background: #fff; border: 1px solid var(--sig-border); font-weight: 600; }
.btn-light:hover { background: var(--sig-bg-soft); }
.btn-sm { padding: .4rem 1rem; }

.form-control, .form-select {
    border-radius: var(--sig-radius-sm); border-color: var(--sig-border); padding-block: .6rem;
    font-size: .9rem; background: #fff;
}
.form-control:focus, .form-select:focus { border-color: var(--sig-brand-400); box-shadow: 0 0 0 .18rem rgba(99, 102, 241, .13); }
.form-label { font-weight: 600; font-size: .82rem; color: var(--sig-ink); }

.alert { border-radius: var(--sig-radius); border: none; }
.alert-success { background: #ecfdf5; color: #047857; }
.alert-danger { background: #fef2f2; color: #b91c1c; }

.pagination .page-link { border: none; color: var(--sig-body); font-weight: 600; font-size: .85rem; margin: 0 2px; border-radius: var(--sig-radius-sm); min-width: 2.1rem; text-align: center; }
.pagination .page-item.active .page-link { background: var(--sig-brand-600); color: #fff; }
.pagination .page-link:hover { background: var(--sig-brand-50); color: var(--sig-brand-700); }

/* Pills / tags --------------------------------------------------------- */
.sig-pill {
    display: inline-flex; align-items: center; gap: .3rem;
    border: 1px solid var(--sig-border); background: #fff; color: var(--sig-body);
    border-radius: 999px; padding: .42rem .95rem; font-size: .8rem; font-weight: 600;
    text-decoration: none; transition: background-color .15s ease, color .15s ease, border-color .15s ease;
}
.sig-pill:hover { border-color: var(--sig-brand-400); color: var(--sig-brand-700); }
.sig-pill.active { background: var(--sig-brand-600); border-color: var(--sig-brand-600); color: #fff; }

.sig-chip {
    display: inline-block; border: 1px solid var(--sig-brand-100); border-radius: var(--sig-radius-sm);
    padding: .18rem .55rem; font-size: .72rem; font-weight: 700; color: var(--sig-brand-700);
    background: var(--sig-brand-50);
}

/* ==========================================================================
   Announcement bar + Navbar
   ========================================================================== */
.sig-announce {
    background: var(--sig-brand-50);
    color: var(--sig-brand-700);
    border-bottom: 1px solid var(--sig-brand-100);
    font-size: .76rem; font-weight: 600; text-align: center; padding: .5rem 1rem; letter-spacing: .01em;
}

.navbar {
    background: var(--sig-white) !important;
    border-bottom: 1px solid var(--sig-border);
    padding-block: .85rem;
}
.navbar-brand { font-weight: 700; font-size: 1.05rem; color: var(--sig-ink) !important; display: flex; align-items: center; gap: .55rem; }
.sig-logo-badge {
    width: 34px; height: 34px; border-radius: var(--sig-radius-sm);
    background: var(--sig-brand-600);
    color: #fff; display: flex; align-items: center; justify-content: center;
    font-family: var(--sig-sans); font-weight: 700; font-size: .76rem;
}
.navbar .nav-link { font-weight: 600; color: var(--sig-body) !important; padding: .5rem .9rem !important; font-size: .875rem; }
.navbar .nav-link:hover, .navbar .nav-link.active { color: var(--sig-brand-700) !important; }

/* ==========================================================================
   Hero
   ========================================================================== */
.sig-hero {
    background-image:
        linear-gradient(90deg, rgba(255, 255, 255, .97) 0%, rgba(255, 255, 255, .93) 32%, rgba(255, 255, 255, .72) 58%, rgba(255, 255, 255, .4) 100%),
        linear-gradient(0deg, rgba(255, 255, 255, .55), rgba(255, 255, 255, 0) 45%),
        url('../img/hero-bg.jpg');
    background-size: cover;
    background-position: center;
    border-bottom: 1px solid var(--sig-border);
}
.sig-hero h1 { font-size: 2.6rem; }
.sig-hero .lead { color: var(--sig-body); font-size: 1.05rem; max-width: 46ch; }

.sig-search-bar {
    background: #fff; border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg);
    box-shadow: var(--sig-shadow-sm); padding: .6rem;
}
.sig-search-bar .form-control, .sig-search-bar .form-select { border: none; background: transparent; }
.sig-search-bar .form-control:focus, .sig-search-bar .form-select:focus { box-shadow: none; }
.sig-search-bar .divider { width: 1px; background: var(--sig-border); }

.sig-stats-row { display: flex; gap: 2rem; margin-top: 2.25rem; flex-wrap: wrap; }
.sig-stats-row .stat { display: flex; flex-direction: column; }
.sig-stats-row .stat b { font-family: var(--sig-sans); font-size: 1.7rem; font-weight: 700; color: var(--sig-ink); line-height: 1; }
.sig-stats-row .stat span { font-size: .76rem; color: var(--sig-muted); font-weight: 600; margin-top: .3rem; max-width: 14ch; }

.sig-hero-card {
    background: #fff;
    border: 1px solid var(--sig-border);
    color: var(--sig-ink); border-radius: var(--sig-radius-lg);
    padding: 1.75rem; box-shadow: var(--sig-shadow-sm);
}
.sig-hero-card h2 { font-size: 1.3rem; }
.sig-hero-card ol { list-style: none; padding: 0; margin: 0; }
.sig-hero-card ol li { display: flex; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--sig-border); font-size: .85rem; color: var(--sig-body); }
.sig-hero-card ol li:last-child { border-bottom: none; }
.sig-hero-card ol li .num {
    flex: none; width: 22px; height: 22px; border-radius: 50%; background: var(--sig-brand-50); border: 1px solid var(--sig-brand-100);
    color: var(--sig-brand-600); font-weight: 700; font-size: .7rem; display: flex; align-items: center; justify-content: center;
}
.sig-hero-card .note { background: var(--sig-bg); border-left: 2px solid var(--sig-brand-400); border-radius: 0 var(--sig-radius-sm) var(--sig-radius-sm) 0; padding: .75rem .95rem; font-size: .76rem; color: var(--sig-muted); margin-top: 1.1rem; }

/* ==========================================================================
   Section shells
   ========================================================================== */
.sig-section { padding: 5rem 0; }
.sig-section.bg-sage { background: var(--sig-bg-soft); }
.sig-section.bg-white { background: var(--sig-white); }
.sig-section.bg-cream { background: var(--sig-bg); }
.sig-section.bg-tint { background: var(--sig-brand-50); color: var(--sig-body); }
.sig-section.bg-tint h2, .sig-section.bg-tint h3 { color: var(--sig-ink); }
.sig-section.bg-tint p { color: var(--sig-body); }

/* ==========================================================================
   Cards
   ========================================================================== */
.sig-card {
    background: #fff; border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg);
    box-shadow: var(--sig-shadow-sm);
}

/* Curriculum cards */
.sig-curriculum-card {
    background: #fff; border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg);
    padding: 1.3rem; height: 100%; transition: border-color .15s ease, box-shadow .15s ease;
}
.sig-curriculum-card:hover { border-color: var(--sig-brand-200); box-shadow: var(--sig-shadow-sm); }
.sig-curriculum-card .mono {
    width: 38px; height: 38px; border-radius: var(--sig-radius-sm); background: var(--sig-brand-50); color: var(--sig-brand-600);
    display: flex; align-items: center; justify-content: center; font-weight: 700; font-size: .78rem; margin-bottom: .85rem;
}

/* School cards (monogram style, no photo) */
.school-card {
    background: #fff; border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg);
    padding: 1.3rem; height: 100%; position: relative;
    transition: box-shadow .15s ease, border-color .15s ease;
}
.school-card:hover { box-shadow: var(--sig-shadow-sm); border-color: var(--sig-brand-200); }

.mono {
    width: 40px; height: 40px; border-radius: var(--sig-radius-sm); background: var(--sig-brand-600); color: #fff;
    display: inline-flex; align-items: center; justify-content: center; font-weight: 700; font-size: .8rem; letter-spacing: .01em;
    flex: none;
}
.school-card .save-icon { color: var(--sig-muted); font-size: 1rem; }
.school-card h3 { font-family: var(--sig-sans); font-weight: 700; font-size: 1rem; color: var(--sig-ink); }
.school-card .desc { font-size: .84rem; color: var(--sig-muted); line-height: 1.55; }
.school-card .foot { border-top: 1px solid var(--sig-border); padding-top: .8rem; margin-top: 1rem; font-size: .76rem; }
.school-card .foot .source { color: var(--sig-muted); text-transform: uppercase; letter-spacing: .05em; font-weight: 700; font-size: .68rem; }

.badge-facility { background: var(--sig-brand-50); color: var(--sig-brand-700); font-weight: 600; border-radius: var(--sig-radius-sm); padding: .35em .7em; font-size: .74rem; }

.rating-pill { display: inline-flex; align-items: center; gap: .3rem; background: var(--sig-accent-100); color: var(--sig-accent-600); font-weight: 700; font-size: .8rem; border-radius: var(--sig-radius-sm); padding: .25rem .55rem; }
.rating-pill i { color: var(--sig-accent-500); }
.rating-stars { color: var(--sig-accent-500); letter-spacing: 1px; }

/* Area explorer */
.sig-area-panel { background: var(--sig-bg-soft); border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg); padding: 1.75rem; height: 100%; }
.sig-area-graphic {
    background: var(--sig-bg-soft); border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg); min-height: 260px; position: relative; overflow: hidden;
    display: flex; align-items: flex-end; padding: 1.3rem;
}
.sig-area-graphic svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .5; }
.sig-area-graphic .overlay-card { background: #fff; border-radius: var(--sig-radius-sm); padding: 1rem 1.15rem; box-shadow: var(--sig-shadow); position: relative; z-index: 1; max-width: 320px; }

/* Checklist */
.sig-checklist-card {
    background: #fff; border: 1px solid var(--sig-border);
    border-radius: var(--sig-radius-lg); padding: 1.45rem; height: 100%;
}
.sig-checklist-card .num { font-family: var(--sig-sans); font-size: 1.4rem; color: var(--sig-brand-600); font-weight: 700; }
.sig-checklist-card h4 { color: var(--sig-ink); font-size: 1rem; font-family: var(--sig-sans); font-weight: 700; margin-top: .4rem; }
.sig-checklist-card p { color: var(--sig-muted); font-size: .84rem; margin-bottom: 0; }

/* Blog / guides */
.sig-featured-guide { background: var(--sig-bg-soft); border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg); padding: 1.75rem; height: 100%; }
.sig-guide-item { border-bottom: 1px solid var(--sig-border); padding: 1rem 0; }
.sig-guide-item:last-child { border-bottom: none; }
.sig-guide-item .cat { font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--sig-brand-600); }
.blog-card { padding: 0; overflow: hidden; }
.blog-card img { height: 175px; object-fit: cover; width: 100%; display: block; }
.sig-blog-placeholder {
    height: 175px; display: flex; align-items: center; justify-content: center;
    background: var(--sig-bg-soft);
    color: var(--sig-brand-400); font-size: 1.75rem;
}

/* FAQ accordion */
.sig-faq .accordion-item { background: transparent; border: none; border-bottom: 1px solid var(--sig-border); border-radius: 0; }
.sig-faq .accordion-button {
    background: transparent; font-family: var(--sig-sans); font-weight: 700; color: var(--sig-ink);
    padding: 1.1rem 0; font-size: .95rem; box-shadow: none;
}
.sig-faq .accordion-button:not(.collapsed) { background: transparent; color: var(--sig-brand-600); box-shadow: none; }
.sig-faq .accordion-button::after { display: none; }
.sig-faq .accordion-button .toggle-icon { margin-left: auto; font-size: 1.1rem; color: var(--sig-muted); transition: transform .15s ease; }
.sig-faq .accordion-button:not(.collapsed) .toggle-icon { color: var(--sig-brand-600); transform: rotate(45deg); }
.sig-faq .accordion-body { padding: 0 0 1.1rem; color: var(--sig-muted); font-size: .88rem; max-width: 70ch; }

/* CTA banner */
.sig-cta-banner {
    background: var(--sig-bg-soft);
    border: 1px solid var(--sig-border); border-left: 3px solid var(--sig-brand-600);
    border-radius: var(--sig-radius-lg); padding: 2rem; color: var(--sig-ink);
}
.sig-cta-banner h3 { color: var(--sig-ink); }
.sig-cta-banner p { color: var(--sig-body); }

/* ==========================================================================
   Filter sidebar / listing page
   ========================================================================== */
.sig-filter-card { background: #fff; border: 1px solid var(--sig-border); border-radius: var(--sig-radius-lg); box-shadow: var(--sig-shadow-sm); }
.school-cover-hero { height: 260px; object-fit: cover; background: var(--sig-bg-soft); }
.school-gallery img { width: 100%; height: 110px; object-fit: cover; border-radius: var(--sig-radius-sm); transition: opacity .15s ease; }
.school-gallery a:hover img { opacity: .85; }

/* ==========================================================================
   Footer
   ========================================================================== */
footer.sig-footer { background: var(--sig-bg-soft); color: var(--sig-body); border-top: 1px solid var(--sig-border); }
footer.sig-footer h5, footer.sig-footer h6 { color: var(--sig-ink); font-family: var(--sig-sans); }
footer.sig-footer a { color: var(--sig-body); text-decoration: none; font-size: .87rem; }
footer.sig-footer a:hover { color: var(--sig-brand-600); }
footer.sig-footer hr { border-color: var(--sig-border); }

.shadow-soft { box-shadow: var(--sig-shadow-sm); }
.rounded-xl { border-radius: var(--sig-radius-lg) !important; }

@media (max-width: 767.98px) {
    .sig-hero h1 { font-size: 2rem; }
    .sig-section { padding: 3.25rem 0; }
    .sig-stats-row { gap: 1.35rem; }
    .sig-cta-banner { padding: 1.5rem; text-align: center; }
    .sig-cta-banner .d-flex.justify-content-between { flex-direction: column; align-items: center !important; }
}