/* =====================================================
   THEME 5 — OneSchool Inspired
   Exact same visual DNA as Theme 3 (OneSchool by Colorlib)
   Colors: Teal #2ca4ab | White bg | Muli font
   ===================================================== */
@import url('https://fonts.googleapis.com/css2?family=Muli:wght@300;400;700;900&display=swap');

:root {
  --t5-primary:  #2ca4ab;
  --t5-primary2: #1d8a90;
  --t5-dark:     #1a1c2e;
  --t5-text:     #6b7280;
  --t5-light:    #f0fbfc;
  --t5-border:   #e5e7eb;
  --t5-white:    #ffffff;
  --t5-shadow:   0 4px 20px rgba(44,164,171,.10);
  --t5-shadow-lg:0 20px 50px rgba(44,164,171,.15);
}

html, body { overflow-x: hidden; width: 100%; position: relative; margin: 0; padding: 0; }
body { font-family:'Muli',sans-serif; color:var(--t5-text); background:#fff; font-size:15px; line-height:1.7; }
a { color:var(--t5-primary); text-decoration:none; transition:.3s; }
a:hover { color:var(--t5-primary2); }
ul { list-style:none; margin:0; padding:0; }
img { max-width:100%; display:block; }
p { margin-bottom:0; }

/* ===== INFO BAR ===== */
.t5-info-bar {
  background: var(--t5-primary);
  border-bottom: 1px solid rgba(255,255,255,0.12);
  font-size: .78rem;
  overflow: hidden;
}

/* ── Desktop: single horizontal strip ── */
.t5-info-bar .container-fluid {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  padding-top: 7px;
  padding-bottom: 7px;
}

.t5-info-bar a,
.t5-info-bar span {
  color: #fff;
  margin-right: 22px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 700;
  white-space: nowrap;
  line-height: 1.4;
}
.t5-info-bar a:hover { color: rgba(255,255,255,.75); text-decoration: none; }
.t5-info-bar .ib-right { margin-left: auto; margin-right: 0; }
.t5-info-bar i { font-size: .8rem; opacity: .9; }

/* ── Tablet (500px – 991px): clean 2×2 grid, all items visible ── */
@media (max-width: 991px) {
  .t5-info-bar .container-fluid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
    padding: 0;
  }

  /* All items — equal cell, border between columns */
  .t5-info-bar a,
  .t5-info-bar span {
    margin: 0;
    padding: 7px 12px;
    font-size: .73rem;
    border-bottom: 1px solid rgba(255,255,255,.1);
    border-right: none;
    justify-content: flex-start;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* Grid item order:
     [1] timing  → col1, row1
     [2] phone   → col2, row1
     [3] email   → col1, row2
     [4] admissions (ib-right) → col2, row2
  */
  .t5-info-bar .container-fluid > *:nth-child(odd) {
    border-right: 1px solid rgba(255,255,255,.12);
  }

  /* Admissions CTA — same size cell, slightly accented */
  .t5-info-bar .ib-right {
    grid-column: auto;        /* do NOT span full width */
    margin: 0;
    background: rgba(0,0,0,.18);
    justify-content: center;
    font-weight: 800;
    padding: 7px 10px;
    border-right: none !important;
    border-bottom: none;
  }
  .t5-info-bar .ib-right a {
    color: #fff;
    padding: 0;
    margin: 0;
    border: none;
    font-size: .73rem;
    font-weight: 800;
    white-space: nowrap;
    border-right: none !important;
    border-bottom: none !important;
  }

  /* Last row — no bottom border */
  .t5-info-bar a[href^="mailto"],
  .t5-info-bar .ib-right {
    border-bottom: none;
  }
}

/* ── Mobile (≤ 575px): same 2×2 grid, tighter padding ── */
@media (max-width: 575px) {
  .t5-info-bar a,
  .t5-info-bar span {
    font-size: .68rem;
    padding: 6px 9px;
  }
  .t5-info-bar i {
    font-size: .7rem;
  }
}

/* ===== NAVBAR ===== */
.t5-site-navbar {
  position:sticky; top:0; z-index:999;
  background:#fff; border-bottom:1px solid var(--t5-border);
  padding:16px 0;
}
.t5-logo a {
  font-size:1.5rem; font-weight:900; color:var(--t5-dark);
  display:flex; flex-direction:row; align-items:center; line-height:1.1; text-decoration:none;
}
.t5-logo-text {
  display:flex; flex-direction:column;
}
.t5-logo-text small {
  font-size:.52rem; font-weight:600; letter-spacing:3px;
  color:var(--t5-text); text-transform:uppercase; margin-top:3px;
}
.t5-nav-ul { display:flex; gap:4px; }
.t5-nav-ul li a {
  font-size:.9rem; font-weight:700; color:#444;
  padding:9px 16px; border-radius:4px; transition:.3s;
}
.t5-nav-ul li a:hover,
.t5-nav-ul li.active a { color:var(--t5-primary); background:var(--t5-light); }
.t5-btn-cta {
  background:var(--t5-primary); color:#fff !important;
  font-weight:700; font-size:.9rem; padding:10px 24px;
  border-radius:4px; transition:.3s; display:inline-block;
}
.t5-btn-cta:hover { background:var(--t5-primary2); transform:translateY(-2px); box-shadow:0 8px 20px rgba(44,164,171,.3); }
.t5-hamburger { background:none; border:none; font-size:1.5rem; color:var(--t5-dark); cursor:pointer; }
.t5-mob-nav { border-top:1px solid var(--t5-border); margin-top:12px; padding-top:8px; padding-bottom:12px; }
.t5-mob-nav li a { display:block; padding:12px 16px; font-weight:700; color:var(--t5-dark); border-bottom:1px solid var(--t5-border); }
.t5-mob-nav li:last-child a { color:var(--t5-primary); border-bottom:none; }

/* ===== HERO ===== */
.t5-hero {
  position:relative; min-height:100vh; display:flex; align-items:center;
  background:url('../../../themes/theme3/images/hero_1.jpg') center/cover no-repeat;
  padding:100px 0 60px;
}
.t5-hero-overlay {
  position:absolute; inset:0;
  background:rgba(20,28,56,.72);
}
.t5-hero-badge-top {
  display:inline-block; background:var(--t5-primary); color:#fff;
  font-size:.72rem; font-weight:700; text-transform:uppercase; letter-spacing:2px;
  padding:5px 16px; border-radius:4px; margin-bottom:18px;
}
.t5-hero-h1 {
  font-size:3.2rem; font-weight:900; color:#fff; line-height:1.15;
  margin-bottom:18px;
}
.t5-hero-h1 span { color:var(--t5-primary); }
.t5-hero-p { color:rgba(255,255,255,.8); font-size:1.05rem; line-height:1.8; max-width:520px; margin-bottom:28px; }
.t5-hero-btns { display:flex; gap:14px; flex-wrap:wrap; margin-bottom:44px; }

/* ===== BUTTONS ===== */
.t5-btn-primary {
  background:var(--t5-primary); color:#fff;
  font-weight:700; font-size:.9rem; padding:12px 28px;
  border-radius:4px; display:inline-block; transition:.3s; border:2px solid var(--t5-primary);
}
.t5-btn-primary:hover { background:var(--t5-primary2); border-color:var(--t5-primary2); color:#fff; transform:translateY(-3px); box-shadow:var(--t5-shadow-lg); }
.t5-btn-wa {
  background:#25D366; color:#fff; font-weight:700; font-size:.9rem;
  padding:12px 24px; border-radius:4px; display:inline-block; transition:.3s;
}
.t5-btn-wa:hover { background:#1da851; color:#fff; transform:translateY(-2px); }
.t5-btn-outline-w {
  border:2px solid rgba(255,255,255,.5); color:#fff; font-weight:700;
  font-size:.9rem; padding:10px 22px; border-radius:4px; display:inline-block; transition:.3s;
}
.t5-btn-outline-w:hover { border-color:#fff; background:rgba(255,255,255,.1); color:#fff; }

/* ===== HERO STATS ===== */
.t5-hero-stats {
  display:flex; gap:0; border-top:1px solid rgba(255,255,255,.15);
  padding-top:24px;
}
.t5-stat {
  text-align:center; padding:0 24px;
  border-right:1px solid rgba(255,255,255,.15);
  display:flex; flex-direction:column;
}
.t5-stat:first-child { padding-left:0; }
.t5-stat:last-child { border-right:none; }
.t5-stat strong { font-size:1.8rem; font-weight:900; color:var(--t5-primary); line-height:1; }
.t5-stat span { font-size:.7rem; text-transform:uppercase; letter-spacing:1px; color:rgba(255,255,255,.55); margin-top:4px; }

/* ===== HERO FORM BOX ===== */
.t5-form-box {
  background:#fff; border-radius:8px; padding:36px 32px;
  box-shadow:0 30px 80px rgba(0,0,0,.25);
}
.t5-form-box h3 { font-size:1.3rem; font-weight:900; color:var(--t5-dark); margin-bottom:8px; }
.t5-form-box > p { font-size:.85rem; color:var(--t5-text); margin-bottom:20px; }
.t5-fc { border:1px solid var(--t5-border); border-radius:4px; padding:11px 14px; font-size:.9rem; color:var(--t5-dark); }
.t5-fc:focus { border-color:var(--t5-primary); box-shadow:0 0 0 3px rgba(44,164,171,.1); outline:none; }
.t5-fc::placeholder { color:#b0b7c3; }
.t5-btn-primary.w-100 { width:100%; text-align:center; border-radius:4px; }

/* ===== COUNTER ===== */
.t5-counter { background:var(--t5-primary); padding:55px 0; }
.t5-counter-item { text-align:center; padding:0 20px; }
.t5-counter-item h3 { font-size:2.8rem; font-weight:900; color:#fff; margin:0; }
.t5-counter-item p { font-size:.75rem; font-weight:700; text-transform:uppercase; letter-spacing:2px; color:rgba(255,255,255,.7); margin:6px 0 0; }

/* ===== SECTION ===== */
.t5-section { padding:100px 0; }
.t5-bg-light { background:var(--t5-light); }
.t5-sec-title {
  font-size:2rem; font-weight:900; color:var(--t5-dark);
  text-align:center; position:relative; padding-bottom:12px; margin-bottom:8px;
}
.t5-sec-title::after { content:''; display:block; width:50px; height:3px; background:var(--t5-primary); margin:12px auto 0; }
.t5-sec-title.text-left::after { margin-left:0; }
.t5-sec-sub { text-align:center; color:var(--t5-text); max-width:580px; margin:0 auto; font-size:.95rem; }

/* ===== PROGRAM CARDS ===== */
.t5-prog-card {
  background:#fff; border:1px solid var(--t5-border); border-radius:8px;
  padding:34px 26px; text-align:center; transition:.4s; height:100%;
  position:relative; overflow:hidden;
}
.t5-prog-card::after {
  content:''; position:absolute; bottom:0; left:0; right:0; height:3px;
  background:var(--t5-primary); transform:scaleX(0); transition:.4s; transform-origin:left;
}
.t5-prog-card:hover { transform:translateY(-8px); box-shadow:var(--t5-shadow-lg); }
.t5-prog-card:hover::after { transform:scaleX(1); }
.t5-prog-icon {
  width:70px; height:70px; border-radius:50%;
  background:var(--t5-light); display:flex; align-items:center;
  justify-content:center; font-size:1.7rem; color:var(--t5-primary);
  margin:0 auto 20px; transition:.3s;
}
.t5-prog-card:hover .t5-prog-icon { background:var(--t5-primary); color:#fff; }
.t5-prog-card h5 { font-size:1rem; font-weight:700; color:var(--t5-dark); margin-bottom:10px; }
.t5-prog-card p { font-size:.875rem; color:var(--t5-text); line-height:1.7; margin:0; }

/* ===== ABOUT ===== */
.t5-about-img {
  width:100%; height:460px; object-fit:cover;
  border-radius:8px; box-shadow:0 20px 50px rgba(0,0,0,.1);
}
.t5-why-row {
  display:flex; gap:16px; align-items:flex-start; margin-bottom:20px;
}
.t5-why-ic {
  width:48px; height:48px; background:var(--t5-light); border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  font-size:1.15rem; color:var(--t5-primary); flex-shrink:0;
}
.t5-why-row h6 { font-size:.95rem; font-weight:700; color:var(--t5-dark); margin-bottom:3px; }
.t5-why-row p { font-size:.875rem; color:var(--t5-text); margin:0; line-height:1.6; }

/* ===== TEACHER ===== */
.t5-teacher-card {
  background:#fff; border-radius:8px; overflow:hidden;
  box-shadow:0 4px 20px rgba(0,0,0,.05); transition:.4s; height:100%;
}
.t5-teacher-card:hover { transform:translateY(-8px); box-shadow:0 20px 40px rgba(0,0,0,.1); }
.t5-teacher-thumb { overflow:hidden; }
.t5-teacher-thumb img { width:100%; height:260px; object-fit:cover; object-position:top; transition:.4s; }
.t5-teacher-card:hover .t5-teacher-thumb img { transform:scale(1.05); }
.t5-teacher-body { padding:22px; text-align:center; }
.t5-teacher-body h5 { font-size:1rem; font-weight:700; color:var(--t5-dark); margin-bottom:4px; }
.t5-subj { color:var(--t5-primary); font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:1px; margin-bottom:8px; }
.t5-teacher-body p { font-size:.85rem; color:var(--t5-text); line-height:1.6; margin:0; }
.t5-exp { display:inline-block; background:var(--t5-light); color:var(--t5-primary); font-size:.75rem; font-weight:700; padding:4px 14px; border-radius:30px; margin-top:8px; }

/* ===== CTA SECTION ===== */
.t5-cta-sec {
  background:linear-gradient(135deg, var(--t5-primary) 0%, var(--t5-primary2) 100%);
  padding:70px 0;
}
.t5-cta-sec h2 { font-size:2.2rem; font-weight:900; color:#fff; margin-bottom:10px; }
.t5-cta-sec p  { color:rgba(255,255,255,.85); font-size:1rem; margin:0; }

/* ===== FOOTER ===== */
.t5-footer { background:#f8f9fa; border-top:3px solid var(--t5-primary); padding:60px 0 20px; }
.t5-footer h4 { font-size:.9rem; font-weight:700; text-transform:uppercase; letter-spacing:1.5px; color:var(--t5-dark); margin-bottom:18px; }
.t5-footer p, .t5-footer li { font-size:.875rem; color:var(--t5-text); line-height:1.9; }
.t5-footer ul li a { color:var(--t5-text); transition:.3s; }
.t5-footer ul li a:hover { color:var(--t5-primary); padding-left:4px; }
.t5-footer ul li i { color:var(--t5-primary); margin-right:6px; }
.t5-footer p i { color:var(--t5-primary); margin-right:6px; }
.t5-footer-btm { border-top:1px solid var(--t5-border); margin-top:40px; padding-top:20px; text-align:center; }
.t5-footer-btm p { font-size:.8rem; color:#9ca3af; margin:0; }

/* ===== PAGE HEADER (inner pages) ===== */
.t5-page-header {
  background:linear-gradient(135deg, var(--t5-dark) 0%, #1d2a4a 100%);
  padding:120px 0 60px; text-align:center; position:relative;
}
.t5-page-header::after { content:''; position:absolute; bottom:0; left:0; right:0; height:3px; background:var(--t5-primary); }
.t5-page-header h1 { font-size:2.6rem; font-weight:900; color:#fff; margin-bottom:8px; }
.t5-page-header p { color:rgba(255,255,255,.65); font-size:1rem; }
.t5-breadcrumb { margin-top:14px; }
.t5-breadcrumb a { color:var(--t5-primary); font-size:.875rem; font-weight:700; }
.t5-breadcrumb span { color:rgba(255,255,255,.4); margin:0 8px; }
.t5-breadcrumb .t5-current { color:rgba(255,255,255,.5); font-size:.875rem; }

/* ===== CONTACT FORM ===== */
.t5-form-wrap { background:#f8f9fa; border-radius:8px; padding:40px 36px; border:1px solid var(--t5-border); }
.t5-form-wrap h4 { font-size:1.2rem; font-weight:900; color:var(--t5-dark); margin-bottom:22px; }
.t5-form-wrap .form-control { border:1px solid var(--t5-border); border-radius:4px; padding:12px 16px; font-size:.9rem; color:var(--t5-dark); }
.t5-form-wrap .form-control:focus { border-color:var(--t5-primary); box-shadow:0 0 0 3px rgba(44,164,171,.1); }
.t5-form-wrap .btn-submit { background:var(--t5-primary); border:none; color:#fff; font-weight:700; font-size:.9rem; padding:13px 36px; border-radius:4px; cursor:pointer; transition:.3s; }
.t5-form-wrap .btn-submit:hover { background:var(--t5-primary2); transform:translateY(-2px); }

.t5-info-item { display:flex; gap:16px; align-items:flex-start; margin-bottom:26px; }
.t5-info-icon { width:50px; height:50px; border-radius:8px; background:var(--t5-light); display:flex; align-items:center; justify-content:center; font-size:1.1rem; color:var(--t5-primary); flex-shrink:0; }
.t5-info-item h6 { font-size:.9rem; font-weight:700; color:var(--t5-dark); margin-bottom:3px; }
.t5-info-item p { font-size:.875rem; color:var(--t5-text); margin:0; }

/* ===== RESPONSIVE ===== */
@media(max-width:991px) {
  
  .t5-hero { min-height:auto; padding:60px 0 40px; }
  .t5-hero-h1 { font-size:2.2rem; }
}

@media(max-width:767px) {
  .t5-site-navbar { padding: 8px 0; }
  .t5-logo a { font-size: 1.1rem; }
  .t5-logo img { height: 34px !important; margin-right: 8px !important; }
  .t5-logo-text small { font-size: .38rem; letter-spacing: 1px; }
  
  .t5-hero-h1 { font-size:1.8rem; }
  .t5-sec-title { font-size:1.5rem; }
  .t5-page-header { padding: 80px 0 40px; }
  .t5-page-header h1 { font-size:1.8rem; }
  .t5-cta-sec h2 { font-size:1.5rem; }
  
  .t5-hero-stats { flex-direction: column; gap:12px; align-items: center; border-right: none; }
  .t5-stat { border-right:none; padding:10px 0; width: 100%; }
  .t5-stat:first-child { padding-left: 0; }
  
  .t5-counter-item { margin-bottom: 30px; }
  .t5-counter-item h3 { font-size:2rem; }
  
  .t5-footer { padding: 40px 0 20px; }
  .t5-form-wrap { padding: 20px; }
  
  .t5-principal { padding: 20px; text-align: center; }
  .t5-principal-img { width: 100px; height: 100px; }
  .t5-principal::before { font-size: 5rem; top: -5px; left: 5px; }
  
  /* Prevent horizontal scroll from rows */
  .row { margin-left: -5px; margin-right: -5px; }
  .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12, .col, .col-auto, .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm, .col-sm-auto, .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12, .col-md, .col-md-auto, .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg, .col-lg-auto, .col-xl-1, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl, .col-xl-auto {
    padding-left: 5px; padding-right: 5px;
  }
}