:root{
  --red:#d32f2f;
  --red-2:#b71c1c;
  --yellow:#ffc107;
  --bg:#0b0e14;
  --card:#111827;
}

*{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;}

body{
  background: linear-gradient(180deg, #0b0e14 0%, #0e1220 35%, #0b0e14 100%);
  color: #e5e7eb;
}

a{color:inherit; text-decoration:none;}
a:hover{color:var(--yellow);}

.navbar-school{
  background: linear-gradient(90deg, var(--red-2), var(--red));
  box-shadow: 0 10px 25px rgba(0,0,0,.25);
}

.brand-mark{
  width: 34px; height: 34px; border-radius: 8px;
  background: conic-gradient(from 180deg, var(--yellow), #fff1b8, var(--yellow));
  box-shadow: inset 0 0 0 3px rgba(0,0,0,.2), 0 8px 20px rgba(0,0,0,.25);
}

.brand-badge{
  width: 48px; height: 48px; border-radius: 14px;
  background: linear-gradient(135deg, var(--yellow), #fff1b8);
  color: #111827; font-weight: 800;
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 12px 25px rgba(0,0,0,.35);
}

.hero{
  position: relative;
  overflow: hidden;
  background: radial-gradient(80% 110% at 20% 10%, rgba(255,193,7,.18) 0%, transparent 60%),
              radial-gradient(80% 120% at 90% 0%, rgba(211,47,47,.22) 0%, transparent 55%),
              linear-gradient(180deg, rgba(17,24,39,.55), rgba(11,14,20,.95));
  border-bottom: 1px solid rgba(255,255,255,.06);
}

.hero .card{
  background: rgba(17,24,39,.55);
  border: 1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}

.section-title{
  display:flex; align-items:end; justify-content:space-between;
  gap: 12px; margin-bottom: 14px;
}
.section-title h2{font-size:1.25rem; margin:0;}
.section-title .line{height:2px; flex:1; background: linear-gradient(90deg, var(--yellow), transparent); border-radius:99px; opacity:.65;}

.card{
  background: rgba(17,24,39,.65);
  color: #e5e7eb;
  border: 1px solid rgba(255,255,255,.08);
}

.btn-primary{
  --bs-btn-bg: var(--red);
  --bs-btn-border-color: rgba(255,255,255,.12);
  --bs-btn-hover-bg: var(--red-2);
  --bs-btn-hover-border-color: rgba(255,255,255,.16);
}

.btn-warning{
  --bs-btn-bg: var(--yellow);
  --bs-btn-border-color: rgba(0,0,0,.08);
  --bs-btn-hover-bg: #ffb300;
}

.badge-soft{
  background: rgba(255,193,7,.12);
  border: 1px solid rgba(255,193,7,.25);
  color: var(--yellow);
}

.footer{
  background: linear-gradient(180deg, rgba(17,24,39,.4), rgba(11,14,20,1));
  border-top: 1px solid rgba(255,255,255,.06);
}

.swiper{
  width: 100%;
  height: 360px;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 20px 45px rgba(0,0,0,.35);
}
@media (max-width: 576px){
  .swiper{height: 260px;}
}

.slide{
  position: relative;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.slide::after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(11,14,20,.75) 0%, rgba(11,14,20,.25) 55%, rgba(11,14,20,.75) 100%);
}
.slide-content{
  position:absolute; inset:0;
  display:flex; align-items:end;
  padding: 24px;
  z-index: 2;
}

.kpi{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 576px){
  .kpi{grid-template-columns: 1fr;}
}

.kpi .kpi-item{
  padding: 14px 16px;
  border-radius: 14px;
  background: rgba(0,0,0,.2);
  border: 1px solid rgba(255,255,255,.08);
}

.table{color:#e5e7eb;}
.table thead th{color:#e5e7eb; border-color:rgba(255,255,255,.12)}
.table td,.table th{border-color:rgba(255,255,255,.08)}

.form-control, .form-select{
  background: rgba(17,24,39,.75);
  border: 1px solid rgba(255,255,255,.12);
  color: #e5e7eb;
}
.form-control:focus, .form-select:focus{
  border-color: rgba(255,193,7,.45);
  box-shadow: 0 0 0 .25rem rgba(255,193,7,.12);
  background: rgba(17,24,39,.85);
  color: #e5e7eb;
}

.dropdown-menu{background:#0f172a; border:1px solid rgba(255,255,255,.12)}
.dropdown-item{color:#e5e7eb}
.dropdown-item:hover{background:rgba(255,193,7,.12); color:#fff}

.small-muted{color:rgba(229,231,235,.72)}

.img-cover{width:100%; height: 180px; object-fit:cover; border-radius: 14px;}

/* Panel */
.sidebar{
  position: sticky;
  top: 84px;
}

.panel-nav a{
  display:flex; align-items:center; gap:10px;
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(17,24,39,.55);
  margin-bottom: 8px;
}
.panel-nav a.active, .panel-nav a:hover{
  border-color: rgba(255,193,7,.35);
  background: rgba(255,193,7,.08);
}

/* Editor content */
.content :is(h2,h3){margin-top: 1.2rem;}
.content p{line-height:1.7;}
.content img{max-width:100%; height:auto; border-radius:12px;}