/* ==========================================================
   GORONTI TAILORING SKILL CENTRE — Main Stylesheet
   Palette: Burgundy #7A1F3D | Soft Pink #F7E1E8 | Cream #FFF8F3 | Gold #C9A24B
   ========================================================== */
:root {
    --maroon: #7a1f3d;
    --maroon-dark: #5c1730;
    --pink: #f9e6ec;
    --pink-soft: #fdf1f4;
    --cream: #fff8f3;
    --gold: #c9a24b;
    --text-dark: #2b2b2b;
    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Poppins', 'Segoe UI', sans-serif;
}

body {
    font-family: var(--font-body);
    color: var(--text-dark);
    background: var(--cream);
}
h1, h2, h3, .font-heading { font-family: var(--font-heading); }
a { text-decoration: none; }

.btn-maroon {
    background: var(--maroon);
    color: #fff;
    border: none;
    padding: .7rem 1.6rem;
    font-weight: 600;
    letter-spacing: .5px;
    border-radius: 4px;
    transition: .25s;
}
.btn-maroon:hover { background: var(--maroon-dark); color: #fff; }
.btn-outline-maroon {
    border: 1.5px solid var(--maroon);
    color: var(--maroon);
    background: transparent;
    padding: .65rem 1.5rem;
    border-radius: 4px;
    font-weight: 600;
}
.btn-outline-maroon:hover { background: var(--maroon); color: #fff; }
.text-maroon { color: var(--maroon); }
.text-gold { color: var(--gold); }
.bg-pink { background: var(--pink); }
.bg-maroon { background: var(--maroon); }

/* Section title */
.section-title { text-align: center; margin-bottom: 2rem; }
.section-title h2 {
    color: var(--maroon);
    font-size: 1.9rem;
    font-weight: 700;
    position: relative;
    display: inline-block;
    padding: 0 1.2rem;
}
.section-title .divider { color: var(--gold); font-size: .9rem; letter-spacing: 3px; }
.section-title p { color: #8a8a8a; margin-top: .25rem; }

/* Announcement bar */
.announcement-bar {
    background: var(--maroon);
    color: #fff;
    text-align: center;
    font-size: .85rem;
    padding: .45rem 1rem;
    letter-spacing: .3px;
}
.announcement-bar a { color: var(--gold); font-weight: 600; margin-left: .5rem; }

/* Navbar */
.site-navbar { background: #fff; box-shadow: 0 2px 10px rgba(0,0,0,.06); padding: .6rem 0; }
.brand-logo { display: flex; align-items: center; gap: .6rem; }
.brand-logo img { height: 46px; }
.brand-text .title { font-family: var(--font-heading); color: var(--maroon); font-weight: 800; font-size: 1.4rem; line-height: 1; letter-spacing: 1px; }
.brand-text .subtitle { font-size: .62rem; letter-spacing: 2px; color: var(--gold); font-weight: 600; }
.site-navbar .nav-link { color: var(--text-dark); font-weight: 500; padding: .5rem 1rem !important; }
.site-navbar .nav-link:hover { color: var(--maroon); }
.navbar-icons a { color: var(--maroon); font-size: 1.15rem; margin-left: 1.1rem; position: relative; }
.navbar-icons .badge { position: absolute; top: -8px; right: -10px; background: var(--maroon); color: #fff; border-radius: 50%; font-size: .62rem; padding: .18rem .4rem; }

/* Hero Slider */
.hero-slide {
    background: linear-gradient(120deg, var(--pink-soft) 0%, var(--pink) 60%);
    border-radius: 0 0 28px 28px;
    overflow: hidden;
    min-height: 340px;
}
.hero-slide .hero-img { object-fit: cover; width: 100%; height: 340px; display: block; }
.hero-slide .hero-img-full { width: 100%; height: auto; display: block; }
.hero-slide .eyebrow { font-family: var(--font-heading); font-style: italic; color: var(--maroon); font-size: 1rem; }
.hero-slide h1 { color: var(--maroon); font-weight: 800; font-size: 2.1rem; line-height: 1.15; }
.hero-slide p.sub { color: #6d6d6d; font-size: .95rem; }
.carousel-control-prev-icon, .carousel-control-next-icon { filter: invert(20%) sepia(40%) saturate(1500%) hue-rotate(300deg); background-color: #fff; border-radius: 50%; padding: 10px; width: 2.2rem; height: 2.2rem; }
.carousel-indicators [data-bs-target] { background-color: var(--maroon); }

/* Quick services strip */
/* Notice board — vertical scroll, bottom to top */
.notice-board {
    height: 34px;
    overflow: hidden;
    position: relative;
}
.notice-track {
    display: flex;
    flex-direction: column;
    animation: notice-scroll-up 18s linear infinite;
}
.notice-line {
    height: 34px;
    display: flex;
    align-items: center;
    font-size: .88rem;
    white-space: nowrap;
}
.notice-line a { color: var(--maroon); font-weight: 600; text-decoration: none; }
.notice-line a:hover { text-decoration: underline; }
@keyframes notice-scroll-up {
    from { transform: translateY(0); }
    to { transform: translateY(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .notice-track { animation: none; }
}

/* Marquee announcement strip */
.marquee-strip {
    background: var(--gold);
    color: var(--maroon);
    overflow: hidden;
    white-space: nowrap;
    padding: .55rem 0;
    font-weight: 600;
    font-size: .9rem;
    letter-spacing: .3px;
}
.marquee-track {
    display: inline-flex;
    animation: marquee-scroll 22s linear infinite;
    will-change: transform;
}
.marquee-track span {
    display: inline-block;
    padding-right: 4rem;
}
@keyframes marquee-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
    .marquee-track { animation: none; }
}
@media (max-width: 767.98px) {
    .marquee-strip { font-size: .8rem; }
    .marquee-track { animation-duration: 16s; }
}

.quick-services { background: #fff; border-radius: 14px; box-shadow: 0 4px 20px rgba(122,31,61,.08); margin-top: 1rem; position: relative; z-index: 3; padding: 1.1rem .5rem; }
.hero-section + .quick-services-wrap .quick-services,
.hero-section + .container .quick-services { margin-top: -1.6rem; }
.quick-services .qs-item i { color: var(--maroon); font-size: 1.6rem; }
.quick-services .qs-item .t { font-weight: 700; font-size: .9rem; }
.quick-services .qs-item .s { font-size: .75rem; color: #888; }

/* Cards - collections / courses */
.collection-card { position: relative; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 14px rgba(0,0,0,.08); }
.collection-card img { width: 100%; height: 260px; object-fit: cover; transition: transform .4s; }
.collection-card:hover img { transform: scale(1.06); }
.collection-card .label { position: absolute; bottom: 0; left: 0; right: 0; background: rgba(255,255,255,.92); text-align: center; padding: .6rem; font-weight: 700; color: var(--maroon); letter-spacing: .5px; font-size: .85rem; }
.collection-card .label small { display: block; font-weight: 400; color: #999; font-size: .7rem; }

.course-card { background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 4px 14px rgba(0,0,0,.07); height: 100%; }
.course-card img { width: 100%; height: 150px; object-fit: cover; }
.course-card .badge-best { position: absolute; top: 10px; left: 10px; background: var(--maroon); color: #fff; font-size: .65rem; padding: .3rem .55rem; border-radius: 4px; }
.course-card .body { padding: .9rem; }
.course-card .price { color: var(--maroon); font-weight: 700; font-size: 1.05rem; }
.course-card .rating i { color: var(--gold); font-size: .8rem; }

/* Tailoring CTA strip */
.tailoring-cta { background: var(--pink-soft); border-radius: 16px; overflow: hidden; }
.tailoring-cta .steps { display: flex; flex-wrap: wrap; gap: .8rem; align-items: center; }
.tailoring-cta .step i { color: var(--maroon); font-size: 1.4rem; }
.tailoring-cta .step { font-size: .82rem; font-weight: 600; text-align: center; }

/* Offline course banner */
.offline-banner { background: #fdf4e3; border-radius: 16px; }
.offline-banner .admission-badge { border: 2px dashed var(--gold); border-radius: 10px; padding: .4rem 1rem; text-align: center; color: var(--maroon); font-weight: 700; }

/* Testimonials */
.testimonial-card { background: #fff; border-radius: 12px; padding: 1.2rem; box-shadow: 0 4px 14px rgba(0,0,0,.06); }
.testimonial-card img { width: 55px; height: 55px; border-radius: 50%; object-fit: cover; }

/* Reviews */
.review-card { background: #fff; border-radius: 12px; padding: 1rem; box-shadow: 0 4px 14px rgba(0,0,0,.06); height: 100%; }
.review-card img { width: 42px; height: 42px; border-radius: 50%; object-fit: cover; }

/* Gallery */
.gallery-strip img { width: 100%; height: 190px; object-fit: cover; border-radius: 8px; }

/* Footer */
.site-footer { background: var(--maroon); color: #f4e2e8; }
.site-footer h6 { color: #fff; font-weight: 700; margin-bottom: 1rem; }
.site-footer a { color: #f4e2e8; }
.site-footer a:hover { color: var(--gold); }
.site-footer .social a { display: inline-flex; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.3); border-radius: 50%; align-items: center; justify-content: center; margin-right: .5rem; }
.footer-bottom { background: var(--maroon-dark); font-size: .8rem; text-align: center; padding: .8rem; }

/* Mobile-first tweaks */
@media (max-width: 767.98px) {
    .hero-slide h1 { font-size: 1.4rem; }
    .hero-slide { min-height: auto; }
    .hero-slide .hero-img { height: 220px; }
    .hero-slide .hero-img-full { height: 220px; object-fit: cover; }
    .section-title h2 { font-size: 1.4rem; }
    .course-card img { height: 120px; }
    .quick-services { margin-top: -1rem; }
    .gallery-strip img { height: 110px; }
}

/* Sticky bottom nav (mobile) */
.mobile-bottom-nav {
    position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030;
    background: #fff; box-shadow: 0 -2px 12px rgba(0,0,0,.1);
    display: flex; justify-content: space-around; padding: .5rem 0;
}
.mobile-bottom-nav a { color: #888; text-align: center; font-size: .68rem; }
.mobile-bottom-nav a.active, .mobile-bottom-nav a:hover { color: var(--maroon); }
.mobile-bottom-nav i { display: block; font-size: 1.2rem; margin-bottom: .15rem; }
@media (min-width: 768px) { .mobile-bottom-nav { display: none; } }
@media (max-width: 767.98px) { body { padding-bottom: 60px; } }