/* ============ TOKENS ============ */
:root{
  --navy-deep:#123a7a;
  --navy:#1c4fa0;
  --navy-soft:#255dc0;
  --gold-1:#f7e7a6;
  --gold-2:#d4af37;
  --gold-3:#a9781f;
  --gold-grad: linear-gradient(120deg,#fdf3c8 0%, #e8c766 22%, #d4af37 45%, #b8862b 60%, #f6e6a8 78%, #d4af37 100%);
  --teal:#12b3a6;
  --teal-soft:#8ee8de;
  --rose:#e8637a;
  --ink:#eef2ff;
  --ink-dim:#b7c3e0;
  --glass-bg: rgba(255,255,255,0.055);
  --glass-bg-strong: rgba(255,255,255,0.09);
  --glass-border: rgba(247,231,166,0.28);
  --glass-shadow: 0 8px 32px rgba(0,0,0,0.45), inset 0 1px 0 rgba(255,255,255,0.12);
  --radius: 20px;
  --maxw: 1240px;
  --font-display: 'Playfair Display', 'Noto Sans Bengali', serif;
  --font-script: 'Cormorant Garamond', serif;
  --font-body: 'Poppins', 'Noto Sans Bengali', sans-serif;
}
html[data-theme="light"]{
  --navy-deep:#f3f1e8;
  --navy:#ffffff;
  --navy-soft:#fbf7ec;
  --ink:#1b2440;
  --ink-dim:#5a6488;
  --glass-bg: rgba(20,30,60,0.045);
  --glass-bg-strong: rgba(20,30,60,0.07);
  --glass-border: rgba(169,120,31,0.35);
  --glass-shadow: 0 8px 28px rgba(120,100,40,0.14), inset 0 1px 0 rgba(255,255,255,0.6);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-body);
  background:
    radial-gradient(circle at 15% 0%, rgba(212,175,55,0.10), transparent 45%),
    radial-gradient(circle at 100% 20%, rgba(18,179,166,0.08), transparent 40%),
    var(--navy-deep);
  color:var(--ink);
  overflow-x:hidden;
  transition:background .4s ease, color .4s ease;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.container{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.bn{font-family:'Noto Sans Bengali', var(--font-body);}
::selection{background:var(--gold-2); color:#1a1200;}

/* scrollbar */
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--navy-deep);}
::-webkit-scrollbar-thumb{background:var(--gold-3); border-radius:10px;}

/* ============ GLASS 3D CARD SYSTEM ============ */
.glass{
  position:relative;
  background:var(--glass-bg);
  border:1px solid var(--glass-border);
  border-radius:var(--radius);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  box-shadow:var(--glass-shadow);
  transition:transform .45s cubic-bezier(.2,.8,.2,1), box-shadow .45s ease, border-color .45s ease;
}
.glass::before{
  content:"";
  position:absolute; inset:0; border-radius:inherit; padding:1.6px;
  background:linear-gradient(115deg, #ffd76a, #ff6a9e, #8a6bff, #6ae3ff, #7dff9e, #ffd76a);
  background-size:300% 300%;
  animation:borderflow 7s linear infinite;
  -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor; mask-composite:exclude;
  pointer-events:none;
  opacity:.75;
}
@keyframes borderflow{
  0%{background-position:0% 50%;}
  50%{background-position:100% 50%;}
  100%{background-position:0% 50%;}
}
.glass-glow:hover{
  transform:translateY(-8px) scale(1.012);
  box-shadow:0 22px 50px rgba(138,107,255,0.25), 0 0 30px rgba(106,227,255,0.2), 0 0 0 1px rgba(212,175,55,0.3), inset 0 1px 0 rgba(255,255,255,0.18);
  border-color:rgba(247,231,166,0.6);
}
.glass-glow:hover::before{animation-duration:2.4s; opacity:1;}

/* ============ GOLD TEXT ============ */
.gold-text{
  background:var(--gold-grad);
  background-size:220% auto;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shine 7s linear infinite;
  text-shadow:0 2px 18px rgba(212,175,55,0.35);
}
@keyframes shine{ to{ background-position:220% center; } }

/* ============ TOP INFO BAR ============ */
.topbar{
  background:var(--gold-grad); background-size:220% auto; animation:shine 14s linear infinite;
  border-bottom:1px solid rgba(11,23,48,0.25);
  font-size:13px; color:#3a2c05; position:relative; z-index:60;
}
.topbar .container{display:flex; justify-content:space-between; align-items:center; height:38px; gap:12px; flex-wrap:wrap;}
.topbar-left{display:flex; gap:20px; flex-wrap:wrap;}
.topbar-left span{font-weight:600;}
.topbar-left span i{color:#1a1200; margin-right:6px;}
.topbar-right{display:flex; align-items:center; gap:14px;}
.topbar-right a{width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(11,23,48,0.85); border:1px solid rgba(11,23,48,0.3); color:var(--gold-1); font-size:12px; transition:.3s;}
.topbar-right a:hover{background:#0b1730; color:var(--gold-1); transform:translateY(-2px);}
.topbar-badge{background:rgba(11,23,48,0.85); border:1px solid rgba(11,23,48,0.3); color:var(--teal-soft); padding:3px 10px; border-radius:20px; font-weight:700; font-size:11px; letter-spacing:.3px;}

/* ============ HEADER ============ */
header.main-header{
  position:sticky; top:0; z-index:50;
  background:linear-gradient(120deg, #6fa8f5 0%, #2e6fd9 42%, #123b7c 100%);
  background-size:220% auto;
  animation:shine 12s linear infinite;
  box-shadow:0 6px 30px rgba(0,0,0,0.35);
  border-top:1px solid rgba(255,255,255,0.25);
  border-bottom:2px solid rgba(212,175,55,0.4);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:14px 24px; max-width:var(--maxw); margin:0 auto;
}
.brand{display:flex; align-items:center; gap:14px;}
.brand-emblem{
  width:64px; height:64px; border-radius:50%; flex:none;
  background:#fff;
  border:3px solid #fffbe6; box-shadow:0 4px 18px rgba(0,0,0,0.4), inset 0 0 12px rgba(212,175,55,0.35);
  display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden;
}
.brand-emblem img{width:100%; height:100%; object-fit:cover;}
.brand-text .name{
  font-family:var(--font-display); font-weight:900; font-size:clamp(24px,2.6vw,36px); line-height:1.05;
  color:#ffffff; letter-spacing:.3px; white-space:nowrap;
  text-shadow:0 2px 8px rgba(10,20,50,0.6), 0 1px 0 rgba(255,255,255,0.15);
}
.brand-text .name .accent{color:#ffffff; -webkit-text-stroke:.3px rgba(11,23,48,0.2);}
.brand-text .sub{font-size:12.5px; font-weight:600; color:rgba(255,255,255,0.85); opacity:.95; letter-spacing:.4px; margin-top:2px;}
.brand-text .tags{display:flex; gap:8px; margin-top:6px; flex-wrap:wrap;}
.brand-text .tags span{
  font-size:10.5px; font-weight:700; padding:3px 9px; border-radius:20px;
  background:rgba(11,23,48,0.85); color:var(--gold-1); border:1px solid rgba(255,255,255,0.25);
}
.header-actions{display:flex; align-items:center; gap:8px; flex-wrap:wrap;}
.h-btn{
  font-size:11px; font-weight:700; padding:7px 12px; border-radius:30px; white-space:nowrap;
  background:linear-gradient(160deg, #4d8fe6, #1a4fa0 55%, #0e2e63); color:#fff;
  border:1px solid rgba(255,255,255,0.35);
  box-shadow:0 3px 0 #0a1f45, 0 6px 12px rgba(10,30,70,0.4), inset 0 1px 0 rgba(255,255,255,0.4);
  transition:.15s; cursor:pointer;
}
.h-btn:hover{transform:translateY(-2px); box-shadow:0 5px 0 #0a1f45, 0 10px 18px rgba(10,30,70,0.45), inset 0 1px 0 rgba(255,255,255,0.4);}
.h-btn:active{transform:translateY(2px); box-shadow:0 1px 0 #0a1f45, 0 2px 6px rgba(10,30,70,0.4), inset 0 1px 0 rgba(255,255,255,0.3);}
.h-btn.h-btn-gold{
  background:var(--gold-grad); background-size:200% auto; animation:shine 6s linear infinite; color:#1a1200;
  border:1px solid rgba(255,255,255,0.5); box-shadow:0 4px 0 #8a6a1a, 0 8px 16px rgba(140,100,20,0.4), inset 0 1px 0 rgba(255,255,255,0.5);
}
.h-btn.h-btn-gold:hover{box-shadow:0 6px 0 #8a6a1a, 0 12px 22px rgba(140,100,20,0.45), inset 0 1px 0 rgba(255,255,255,0.5);}
.h-btn.h-btn-gold:active{box-shadow:0 1px 0 #8a6a1a, 0 2px 6px rgba(140,100,20,0.4), inset 0 1px 0 rgba(255,255,255,0.4);}
.icon-toggle{
  width:38px; height:38px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:rgba(11,23,48,0.9); color:var(--gold-1); border:1px solid rgba(255,255,255,0.2); cursor:pointer; transition:.3s;
}
.icon-toggle:hover{transform:rotate(15deg) scale(1.08);}
.lang-switch{
  display:flex; background:linear-gradient(160deg, #4d8fe6, #1a4fa0 55%, #0e2e63); border-radius:30px; padding:3px;
  border:1px solid rgba(255,255,255,0.35);
  box-shadow:0 4px 0 #0a1f45, 0 8px 16px rgba(10,30,70,0.4), inset 0 1px 0 rgba(255,255,255,0.35);
}
.lang-switch button{
  border:none; background:transparent; color:#eaf2ff; font-size:11.5px; font-weight:700; padding:6px 12px; border-radius:30px; cursor:pointer; transition:.25s;
}
.lang-switch button.active{background:linear-gradient(160deg,#ffffff,#cfe0ff); color:#0e2e63; box-shadow:0 2px 6px rgba(0,0,0,0.25);}

/* card click animation */
@keyframes cardFlash{
  0%{box-shadow:0 0 0 0 rgba(212,175,55,0.6), 0 0 0 0 rgba(18,179,166,0.4);}
  55%{box-shadow:0 0 0 10px rgba(212,175,55,0), 0 0 0 18px rgba(18,179,166,0);}
  100%{box-shadow:0 0 0 0 rgba(212,175,55,0), 0 0 0 0 rgba(18,179,166,0);}
}
.card-clicked{animation:cardFlash .65s ease-out;}

/* login/register modal */
.modal-overlay{
  position:fixed; inset:0; background:rgba(5,15,40,0.6); backdrop-filter:blur(5px);
  display:flex; align-items:center; justify-content:center; z-index:200; padding:20px;
  opacity:0; visibility:hidden; transition:.3s;
}
.modal-overlay.open{opacity:1; visibility:visible;}
.modal-card{width:100%; max-width:420px; padding:36px 32px; position:relative; max-height:88vh; overflow-y:auto; overflow-x:hidden;}
.modal-close{position:absolute; top:14px; right:18px; background:none; border:none; font-size:24px; line-height:1; color:var(--ink-dim); cursor:pointer; z-index:5;}
.modal-close:hover{color:var(--gold-1);}
.modal-title{font-family:var(--font-display); font-size:21px; margin-bottom:20px; text-align:center; color:var(--gold-1);}
.modal-tabs{display:flex; gap:6px; margin-bottom:24px; background:var(--navy); border-radius:30px; padding:4px;}
.modal-tabs button{flex:1; padding:10px; border:none; background:transparent; border-radius:30px; font-weight:700; font-size:13px; color:var(--ink-dim); cursor:pointer; transition:.25s;}
.modal-tabs button.active{background:var(--gold-grad); color:#1a1200;}
.modal-form{display:flex; flex-direction:column; gap:16px;}
.modal-card.modal-wide{max-width:680px;}
.modal-card::-webkit-scrollbar{width:8px;}
.modal-card::-webkit-scrollbar-thumb{background:var(--gold-3); border-radius:10px;}
.security-note{
  font-size:11.5px; line-height:1.6; color:var(--ink-dim); background:rgba(18,179,166,0.08);
  border:1px solid rgba(18,179,166,0.28); border-radius:12px; padding:12px 14px; margin-bottom:20px;
}
.security-note i{color:var(--teal-soft); margin-right:6px;}
.demo-credentials{font-size:11px; color:var(--gold-1); margin-top:6px; display:block;}
.portal-head{display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; flex-wrap:wrap; gap:10px;}
.portal-head h4{font-family:var(--font-display); font-size:18px; color:var(--gold-1);}
.portal-head .logout-btn{font-size:11.5px; font-weight:700; color:var(--ink-dim); border:1px solid rgba(255,255,255,0.2); background:rgba(255,255,255,0.05); padding:7px 14px; border-radius:20px; cursor:pointer;}
.fee-summary{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-bottom:22px;}
.fee-summary div{text-align:center; padding:14px 8px; border-radius:12px; background:rgba(212,175,55,0.08); border:1px solid rgba(212,175,55,0.22);}
.fee-summary b{display:block; font-family:var(--font-display); font-size:19px; color:var(--gold-1);}
.fee-summary span{font-size:10.5px; color:var(--ink-dim);}
.due-banner{
  text-align:center; padding:16px; border-radius:12px; margin-bottom:22px;
  background:rgba(232,99,122,0.1); border:1px solid rgba(232,99,122,0.3);
}
.due-banner b{display:block; font-family:var(--font-display); font-size:22px; color:var(--rose);}
.due-banner span{font-size:11px; color:var(--ink-dim);}
.fee-block{margin-bottom:20px;}
.fee-block > label{font-size:12.5px; font-weight:700; color:var(--ink-dim); display:block; margin-bottom:8px;}
.fee-inline{display:flex; gap:10px; align-items:center;}
.fee-inline select, .fee-inline input{flex:1;}
.fee-row{display:flex; gap:8px; align-items:center; margin-bottom:8px;}
.fee-row input[type="text"]{flex:1.3;}
.fee-row input[type="number"]{flex:1; text-align:right;}
.fee-row .fee-del{width:32px; height:32px; flex:none; border-radius:8px; border:1px solid rgba(232,99,122,0.4); background:rgba(232,99,122,0.12); color:var(--rose); cursor:pointer; font-size:14px;}
.add-fee-row{display:flex; gap:8px; margin-top:6px;}
.add-fee-row input{flex:1;}
.add-fee-row button{flex:none; padding:0 16px; border-radius:10px; border:none; background:rgba(18,179,166,0.15); color:var(--teal-soft); font-weight:700; font-size:13px; cursor:pointer; border:1px solid rgba(18,179,166,0.35);}
.upload-box{border:1.5px dashed rgba(212,175,55,0.4); border-radius:12px; padding:16px; text-align:center; font-size:12.5px; color:var(--ink-dim);}
.upload-box input{margin-top:8px;}
.fee-chip-list{display:flex; flex-wrap:wrap; gap:10px;}
.fee-chip{
  display:inline-flex; align-items:center; gap:6px; padding:6px 8px 6px 16px; border-radius:30px;
  background:linear-gradient(135deg, rgba(212,175,55,0.16), rgba(18,179,166,0.1));
  border:1px solid rgba(212,175,55,0.35); transition:.25s;
}
.fee-chip:hover{border-color:var(--gold-2); box-shadow:0 4px 14px rgba(212,175,55,0.2);}
.fee-chip input[type="text"]{
  background:transparent; border:none; color:var(--ink); font-size:13px; font-weight:600;
  width:auto; min-width:70px; max-width:160px; padding:0;
}
.fee-chip input[type="text"]:focus{outline:none;}
.fee-chip .fee-del{
  width:24px; height:24px; flex:none; border-radius:50%; border:1px solid rgba(232,99,122,0.4);
  background:rgba(232,99,122,0.15); color:var(--rose); cursor:pointer; font-size:13px; line-height:1; padding:0;
}
.add-fee-chip{
  display:inline-flex; align-items:center; gap:8px; padding:6px 8px 6px 16px; border-radius:30px;
  background:rgba(255,255,255,0.05); border:1.5px dashed rgba(255,255,255,0.25);
}
.add-fee-chip input{background:transparent; border:none; color:var(--ink); font-size:13px; width:130px; padding:0;}
.add-fee-chip input:focus{outline:none;}
.add-fee-chip button{
  flex:none; width:26px; height:26px; border-radius:50%; border:none; cursor:pointer;
  background:var(--gold-grad); color:#1a1200; font-size:13px;
}

/* ============ NAV ============ */
nav.mainnav{
  background:linear-gradient(180deg, var(--navy-soft), var(--navy));
  border-bottom:1px solid rgba(212,175,55,0.25);
  position:sticky; top:var(--header-h, 92px); z-index:49;
}
.navwrap{display:flex; align-items:center; justify-content:space-between; max-width:var(--maxw); margin:0 auto; padding:0 24px;}
.navlist{display:flex; align-items:center; flex-wrap:wrap;}
.navlist > li{position:relative;}
.navlist > li > a, .navlist > li > button{
  display:flex; align-items:center; gap:6px; padding:16px 18px; font-size:14px; font-weight:600; color:var(--ink);
  background:none; border:none; cursor:pointer; font-family:var(--font-body); transition:.25s;
}
.navlist > li > a:hover, .navlist > li > button:hover, .navlist > li.open > button{color:var(--gold-1);}
.navlist > li > button i.chev{font-size:10px; transition:.3s;}
.navlist > li.open > button i.chev{transform:rotate(180deg);}
.dropdown{
  position:absolute; top:100%; left:0; min-width:260px; padding:10px;
  background:linear-gradient(165deg, var(--navy-soft), var(--navy) 85%);
  border:1px solid var(--glass-border); border-top:2px solid var(--gold-2); border-radius:14px; backdrop-filter:blur(16px);
  box-shadow:0 20px 40px rgba(0,0,0,0.45);
  opacity:0; visibility:hidden; transform:translateY(8px);
  transition:.28s ease; z-index:80;
}
li.open > .dropdown{opacity:1; visibility:visible; transform:translateY(0);}
.dropdown a{display:block; padding:10px 14px; border-radius:10px; font-size:13.5px; color:var(--ink); font-weight:500;}
.dropdown a:hover{background:rgba(212,175,55,0.18); color:var(--gold-1); padding-left:18px;}
.apply-now{
  background:var(--gold-grad); background-size:200% auto; color:#1a1200; font-weight:800; font-size:13px;
  padding:11px 22px; border-radius:30px; margin-left:6px; box-shadow:0 6px 20px rgba(212,175,55,0.35);
  animation:shine 6s linear infinite;
}
.burger{display:none; background:none; border:none; color:var(--gold-1); font-size:22px; padding:14px 24px; cursor:pointer;}

/* ============ TICKER ============ */
.ticker{
  background:var(--navy-deep); border-bottom:1px solid rgba(212,175,55,0.25);
  display:flex; align-items:center; overflow:hidden; position:relative; z-index:5;
}
.ticker-label{
  background:var(--gold-grad); color:#1a1200; font-weight:800; font-size:12.5px; padding:9px 20px; white-space:nowrap; flex:none;
  clip-path:polygon(0 0,100% 0,92% 100%,0% 100%); padding-right:32px;
}
.ticker-track{display:flex; white-space:nowrap; animation:tickmove 28s linear infinite;}
.ticker-track span{padding:9px 34px; font-size:13px; color:var(--ink-dim); border-right:1px solid rgba(212,175,55,0.2);}
.ticker-track span i{color:var(--teal); margin-right:8px;}
@keyframes tickmove{ 0%{transform:translateX(0);} 100%{transform:translateX(-50%);} }

/* ============ HERO ============ */
.hero{position:relative; padding:90px 0 120px; overflow:hidden;}
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(125deg, rgba(31,79,163,0.93), rgba(18,58,124,0.9) 50%, rgba(46,100,196,0.93)),
    url('images/college-building.jpg');
  background-size:cover; background-position:center 20%;
  filter:saturate(1.1);
}
.hero-bg::before{
  content:""; position:absolute; inset:0;
  background-image:
    repeating-linear-gradient(135deg, rgba(255,255,255,0.08) 0px, rgba(255,255,255,0.08) 2px, transparent 2px, transparent 14px),
    radial-gradient(circle at 2px 2px, rgba(255,255,255,0.1) 1.4px, transparent 1.6px);
  background-size:auto, 22px 22px;
  mix-blend-mode:overlay;
  opacity:.6;
}
.hero-bg::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 80% 10%, rgba(212,175,55,0.2), transparent 45%),
             radial-gradient(circle at 10% 90%, rgba(18,179,166,0.18), transparent 40%);
}
.hero .container{position:relative; z-index:2;}
.hero-grid{display:grid; grid-template-columns:1.15fr .85fr; gap:50px; align-items:center;}
.badge-pill{
  display:inline-flex; align-items:center; gap:8px; padding:8px 18px; border-radius:30px; font-size:12.5px; font-weight:700;
  background:rgba(18,179,166,0.16); border:1px solid rgba(18,179,166,0.5); color:var(--teal-soft); margin-bottom:22px;
}
.badge-pill i{color:var(--gold-1);}
.hero h1{
  font-family:var(--font-display); font-size:clamp(34px,4.6vw,58px); font-weight:800; line-height:1.1; margin-bottom:20px;
  color:#ffffff;
}
.hero h1 .gold-text{display:block; text-shadow:0 2px 18px rgba(212,175,55,0.4);}
.hero p.lead{font-size:17px; color:#dbe6ff; max-width:560px; line-height:1.7; margin-bottom:32px;}
.hero-ctas{display:flex; gap:16px; flex-wrap:wrap; margin-bottom:44px;}
.btn-primary{
  background:var(--gold-grad); background-size:200% auto; color:#1a1200; font-weight:800; padding:15px 30px; border-radius:14px;
  box-shadow:0 12px 30px rgba(212,175,55,0.35); animation:shine 6s linear infinite; font-size:14.5px;
}
.btn-outline{
  padding:15px 30px; border-radius:14px; border:1.5px solid rgba(255,255,255,0.3); font-weight:700; font-size:14.5px;
  color:#ffffff; backdrop-filter:blur(10px); background:rgba(255,255,255,0.1);
}
.btn-outline:hover{border-color:var(--gold-2); color:var(--gold-1);}
.hero-strip{display:flex; gap:14px; flex-wrap:wrap;}
.mini-stat{padding:10px 16px; border-radius:12px; background:rgba(255,255,255,0.14); border:1px solid rgba(255,255,255,0.18);}
.mini-stat b{display:block; font-size:20px; color:var(--gold-1); font-family:var(--font-display);}
.mini-stat span{font-size:11.5px; color:#cfdcf9;}

/* stat card */
.stat-card{padding:30px; position:relative; background:rgba(31,79,163,0.35);}
.stat-card .sc-head{display:flex; align-items:center; gap:12px; margin-bottom:22px; padding-bottom:18px; border-bottom:1px dashed rgba(212,175,55,0.4);}
.stat-card .sc-head .brand-emblem{width:48px; height:48px;}
.stat-card .sc-head b{font-family:var(--font-display); font-size:17px; color:var(--gold-1); display:block;}
.stat-card .sc-head small{color:#cfdcf9; font-size:11.5px;}
.sc-row{display:flex; justify-content:space-between; padding:9px 0; font-size:13.5px; border-bottom:1px solid rgba(255,255,255,0.1);}
.sc-row span:first-child{color:#b9c9f2;}
.sc-row span:last-child{font-weight:700; color:#ffffff;}
.sc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:20px;}
.sc-grid div{text-align:center; padding:14px 6px; border-radius:12px; background:rgba(255,255,255,0.1); border:1px solid rgba(212,175,55,0.3);}
.sc-grid b{display:block; font-family:var(--font-display); font-size:22px; color:var(--gold-1);}
.sc-grid span{font-size:10.5px; color:#cfdcf9;}

/* ============ SECTION GENERIC ============ */
.section{padding:96px 0;}
.section-head{text-align:center; max-width:720px; margin:0 auto 56px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px; font-size:12px; font-weight:700; letter-spacing:2px; text-transform:uppercase;
  color:var(--teal-soft); margin-bottom:14px;
}
.eyebrow::before, .eyebrow::after{content:""; width:26px; height:1px; background:var(--gold-2);}
.section-head h2{font-family:var(--font-display); font-size:clamp(28px,3.4vw,42px); font-weight:800; margin-bottom:14px;}
.section-head p{color:var(--ink-dim); font-size:15.5px; line-height:1.7;}
.section-alt{background:linear-gradient(180deg, transparent, rgba(212,175,55,0.03) 15%, rgba(212,175,55,0.03) 85%, transparent);}

/* ABOUT */
.about-grid{display:grid; grid-template-columns:1fr 1fr; gap:36px; margin-bottom:50px;}
.about-copy p{color:var(--ink-dim); line-height:1.85; font-size:15px; margin-bottom:16px;}
.about-copy p:first-child{color:var(--ink); font-size:16.5px;}
.about-photo{border-radius:var(--radius); overflow:hidden; position:relative; min-height:320px;}
.about-photo img{width:100%; height:100%; object-fit:cover; position:absolute; inset:0;}

.messages{display:grid; grid-template-columns:1fr 1fr; gap:30px;}
.msg-card{padding:34px;}
.msg-card-head{display:flex; align-items:center; gap:16px; margin-bottom:14px;}
.msg-photo{width:74px; height:74px; border-radius:50%; object-fit:cover; flex:none; border:3px solid rgba(212,175,55,0.5); box-shadow:0 6px 18px rgba(0,0,0,0.35);}
.msg-card .quote-i{font-size:30px; color:var(--gold-2); opacity:.6;}
.msg-card h3{font-family:var(--font-display); font-size:20px; margin-bottom:4px; color:var(--gold-1);}
.msg-card .role{font-size:12.5px; color:var(--teal-soft); font-weight:700; display:block;}
.msg-card p{font-size:14px; line-height:1.9; color:var(--ink-dim); max-height:230px; overflow:auto; padding-right:6px;}
.msg-card p::-webkit-scrollbar{width:5px;}
.msg-card .sign{margin-top:18px; padding-top:14px; border-top:1px dashed rgba(212,175,55,0.3); font-weight:700; color:var(--ink); font-size:14px;}
.msg-card.flower-deco{overflow:visible;}
.flower{position:absolute; font-size:32px; pointer-events:none; z-index:6; filter:drop-shadow(0 3px 8px rgba(0,0,0,0.35));}
.flower-tl{top:-16px; left:-16px; transform:rotate(-18deg);}
.flower-tr{top:-16px; right:-16px; transform:rotate(18deg) scaleX(-1);}
.flower-bl{bottom:-16px; left:-16px; transform:rotate(14deg);}
.flower-br{bottom:-16px; right:-16px; transform:rotate(-14deg) scaleX(-1);}

/* FACULTY */
.faculty-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:24px;}
.faculty-card{padding:22px 18px; text-align:center;}
.faculty-photo{width:104px; height:104px; border-radius:50%; object-fit:cover; margin:0 auto 16px; border:3px solid rgba(212,175,55,0.45); box-shadow:0 8px 20px rgba(0,0,0,0.3);}
.faculty-card h4{font-family:var(--font-display); font-size:15.5px; margin-bottom:4px;}
.faculty-card span{font-size:11.5px; color:var(--teal-soft); font-weight:600;}

/* COURSES */
.course-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.course-card{padding:34px 28px; text-align:center;}
.course-icon{
  width:74px; height:74px; margin:0 auto 20px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  background:#fff; box-shadow:0 10px 25px rgba(212,175,55,0.3); border:3px solid var(--gold-2); overflow:hidden;
}
.course-icon img{width:100%; height:100%; object-fit:cover;}
.course-card h3{font-family:var(--font-display); font-size:19px; margin-bottom:8px;}
.course-dur{display:inline-block; font-size:11.5px; font-weight:700; color:var(--teal-soft); background:rgba(18,179,166,0.12); border:1px solid rgba(18,179,166,0.35); padding:4px 12px; border-radius:20px; margin-bottom:16px;}
.course-card ul{text-align:left; margin-bottom:20px;}
.course-card ul li{font-size:13.5px; color:var(--ink-dim); padding:6px 0; display:flex; gap:8px;}
.course-card ul li i{color:var(--gold-2); margin-top:3px;}
.course-fee{font-size:15px; font-weight:800; color:var(--gold-1); margin-bottom:18px;}
.course-fee small{display:block; font-weight:500; font-size:11px; color:var(--ink-dim);}
.course-card .btn-outline{width:100%; text-align:center; display:block; padding:11px;}

/* FACILITIES */
.fac-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:20px;}
#facilities .fac-grid{grid-template-columns:repeat(5,1fr);}
@media (max-width:900px){ #facilities .fac-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:600px){ #facilities .fac-grid{grid-template-columns:repeat(2,1fr);} }
.fac-card{padding:30px 22px; text-align:left;}
.fac-card i{font-size:26px; color:var(--gold-1); margin-bottom:14px; display:block;}
.fac-card h4{font-size:14.5px; font-weight:700; margin-bottom:6px;}
.fac-card p{font-size:12.5px; color:var(--ink-dim); line-height:1.6;}
.fac-card.with-photo{padding:0; overflow:hidden;}
.fac-card.with-photo img{width:100%; height:170px; object-fit:cover; display:block;}
.fac-card.with-photo .fac-body{padding:22px;}
.highlight-showcase{display:grid; grid-template-columns:1fr 1fr; gap:26px;}
.highlight-photo{position:relative; border-radius:var(--radius); overflow:hidden; min-height:280px;}
.highlight-photo img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.highlight-photo:hover img{transform:scale(1.06);}
.highlight-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(0deg, rgba(5,15,40,0.88), transparent 55%);}
.highlight-cap{position:absolute; left:0; right:0; bottom:0; padding:20px 24px; z-index:2;}
.highlight-cap h4{font-family:var(--font-display); font-size:20px; color:#fff; margin-bottom:6px; text-shadow:0 2px 8px rgba(0,0,0,0.5);}
.highlight-cap p{font-size:12.5px; color:#dbe6ff; max-width:340px;}

/* LABS GALLERY */
.lab-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:30px;}
.lab-card{overflow:hidden; padding:0;}
.lab-photo{height:280px; position:relative; overflow:hidden;}
.lab-photo img{width:100%; height:100%; object-fit:cover; transition:transform .6s ease;}
.lab-card:hover .lab-photo img{transform:scale(1.07);}
.lab-photo::after{content:""; position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(5,11,26,0.85));}
.lab-num{
  position:absolute; top:16px; left:16px; z-index:2; width:38px; height:38px; border-radius:50%;
  background:var(--gold-grad); color:#1a1200; font-weight:800; font-size:14px; display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,0.4);
}
.lab-body{padding:22px 26px 26px; position:relative; z-index:2;}
.lab-body h3{font-family:var(--font-display); font-size:19px; margin-bottom:8px;}
.lab-body p{font-size:13.5px; color:var(--ink-dim); line-height:1.65;}
.lab-caption{position:absolute; bottom:16px; left:26px; z-index:2; font-family:var(--font-display); font-size:22px; color:#fff; text-shadow:0 2px 10px rgba(0,0,0,0.6);}

/* CAMPUS PHOTO GALLERY */
.photo-grid{columns:4 260px; column-gap:22px;}
.photo-item{break-inside:avoid; margin-bottom:22px; overflow:hidden; position:relative;}
.photo-item img{width:100%; display:block; transition:transform .6s ease;}
.photo-item:hover img{transform:scale(1.06);}
.photo-cap{position:absolute; left:0; right:0; bottom:0; padding:14px 16px; font-size:12.5px; font-weight:600; color:#fff;
  background:linear-gradient(0deg, rgba(5,15,40,0.88), transparent);}

/* CODE OF CONDUCT */
.coc-note{
  max-width:760px; margin:0 auto 40px; text-align:center; font-size:13px; color:var(--ink-dim);
  background:rgba(212,175,55,0.06); border:1px solid rgba(212,175,55,0.25); border-radius:14px; padding:16px 24px; line-height:1.8;
}
.coc-note b{color:var(--gold-1);}
.coc-grid{display:grid; grid-template-columns:1fr 1fr; gap:26px; margin-bottom:36px;}
.coc-card{padding:30px;}
.coc-card-head{display:flex; align-items:center; gap:14px; margin-bottom:18px; padding-bottom:14px; border-bottom:1px dashed rgba(212,175,55,0.3);}
.coc-num{
  width:38px; height:38px; border-radius:50%; flex:none; display:flex; align-items:center; justify-content:center;
  background:var(--gold-grad); color:#1a1200; font-weight:800; font-family:var(--font-display); font-size:16px;
}
.coc-card h3{font-family:var(--font-display); font-size:16.5px; color:var(--gold-1);}
.coc-card ul li{display:flex; gap:10px; padding:9px 0; font-size:13px; color:var(--ink-dim); line-height:1.75; border-bottom:1px solid rgba(255,255,255,0.05);}
.coc-card ul li:last-child{border-bottom:none;}
.coc-card ul li i{color:var(--teal); margin-top:4px; flex:none; font-size:11px;}
.coc-attendance{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-bottom:36px;}
.coc-attendance div{text-align:center; padding:22px 10px; border-radius:14px; background:rgba(212,175,55,0.08); border:1px solid rgba(212,175,55,0.28);}
.coc-attendance b{display:block; font-family:var(--font-display); font-size:30px; color:var(--gold-1); margin-bottom:4px;}
.coc-attendance span{font-size:12px; color:var(--ink-dim); font-weight:600; text-transform:uppercase; letter-spacing:.5px;}
.coc-warning{
  background:rgba(232,99,122,0.08); border:1px solid rgba(232,99,122,0.35); border-radius:16px; padding:26px 28px; margin-bottom:20px;
}
.coc-warning h4{font-family:var(--font-display); font-size:16px; color:var(--rose); margin-bottom:10px; display:flex; align-items:center; gap:8px;}
.coc-warning p{font-size:13px; color:var(--ink-dim); line-height:1.8;}
.coc-warning-bar{
  background:var(--gold-grad); color:#1a1200; text-align:center; font-weight:800; font-size:13.5px;
  padding:14px 20px; border-radius:12px; margin-bottom:36px;
}
.coc-signature{text-align:right; padding-top:20px; border-top:1px solid rgba(255,255,255,0.08);}
.coc-signature b{display:block; font-family:var(--font-display); font-size:15px; color:var(--gold-1);}
.coc-signature span{font-size:12px; color:var(--ink-dim);}

/* ADMISSION */
.adm-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:36px;}
.adm-card{padding:32px;}
.adm-card h3{font-family:var(--font-display); font-size:20px; margin-bottom:16px; color:var(--gold-1);}
.adm-list li{display:flex; gap:12px; padding:11px 0; border-bottom:1px solid rgba(255,255,255,0.06); font-size:14px; color:var(--ink-dim); line-height:1.6;}
.adm-list li i{color:var(--teal); margin-top:3px; flex:none;}
.timeline{display:flex; flex-direction:column; gap:0;}
.tl-item{display:flex; gap:16px; padding:14px 0; border-bottom:1px solid rgba(255,255,255,0.07);}
.tl-item:last-child{border-bottom:none;}
.tl-dot{width:12px; height:12px; border-radius:50%; background:var(--gold-grad); margin-top:5px; flex:none; box-shadow:0 0 0 4px rgba(212,175,55,0.15);}
.tl-item b{display:block; font-size:13.5px; color:var(--ink);}
.tl-item span{font-size:12.5px; color:var(--ink-dim);}
.fee-box{margin-top:22px; padding:18px; border-radius:14px; background:rgba(18,179,166,0.08); border:1px solid rgba(18,179,166,0.3);}
.fee-box b{color:var(--teal-soft); font-size:13px;}

/* ACADEMIC */
.acad-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:20px;}
.acad-card{padding:26px 18px; text-align:center;}
.acad-card i{font-size:24px; color:var(--gold-1); margin-bottom:10px; display:block;}
.acad-card span{font-size:13px; font-weight:600;}

/* IN MEMORIAM */
#memoriam{
  position:relative; overflow:hidden;
  background:
    radial-gradient(ellipse 700px 500px at 15% 10%, rgba(212,175,55,0.14), transparent 60%),
    radial-gradient(ellipse 600px 500px at 85% 30%, rgba(212,175,55,0.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 50% 95%, rgba(212,175,55,0.08), transparent 60%),
    linear-gradient(180deg, #000000 0%, #0a0a0c 45%, #000000 100%);
}
.memoriam-bg-candles{position:absolute; inset:0; pointer-events:none; overflow:hidden; z-index:1;}
.memoriam-bg-candles i{position:absolute; color:rgba(212,175,55,0.07); animation:candleFlicker 4.5s ease-in-out infinite;}
.memoriam-bg-candles i:nth-child(1){top:-30px; left:4%; font-size:220px;}
.memoriam-bg-candles i:nth-child(2){bottom:-70px; right:6%; font-size:300px; animation-delay:.8s;}
.memoriam-bg-candles i:nth-child(3){top:42%; left:44%; font-size:170px; animation-delay:1.6s;}
.memoriam-note{
  max-width:680px; margin:0 auto 40px; text-align:center; font-size:12.5px; color:var(--ink-dim);
  background:rgba(255,255,255,0.03); border:1px solid rgba(255,255,255,0.08); border-radius:14px; padding:16px 22px; line-height:1.7;
}
.memoriam-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:22px;}
.memoriam-card{
  background:linear-gradient(160deg, rgba(255,255,255,0.05), rgba(0,0,0,0.3));
  border:1px solid rgba(212,175,55,0.25); border-radius:18px; padding:26px 18px; text-align:center;
  position:relative; transition:transform .4s ease, box-shadow .4s ease, border-color .4s ease; cursor:pointer;
}
.memoriam-card:hover{transform:translateY(-6px); box-shadow:0 16px 34px rgba(0,0,0,0.5); border-color:rgba(212,175,55,0.6);}
.memoriam-avatar{
  width:80px; height:80px; border-radius:50%; margin:0 auto 14px; overflow:hidden;
  background:radial-gradient(circle at 30% 30%, #2a3a68, #0d1326);
  border:2px solid rgba(212,175,55,0.4); display:flex; align-items:center; justify-content:center;
}
.memoriam-avatar img{width:100%; height:100%; object-fit:cover;}
@keyframes candleFlicker{0%,100%{opacity:.9;} 50%{opacity:.55;}}
.memoriam-avatar i{font-size:28px; color:var(--gold-1); animation:candleFlicker 3s ease-in-out infinite;}
.memoriam-card h4{font-family:var(--font-display); font-size:15.5px; margin-bottom:3px; color:var(--ink);}
.memoriam-course{font-size:10.5px; color:var(--teal-soft); font-weight:600; display:block; margin-bottom:12px; line-height:1.5;}
.memoriam-meta{font-size:11px; color:var(--ink-dim); line-height:1.9; text-align:left; padding-top:12px; border-top:1px dashed rgba(212,175,55,0.25);}
.memoriam-meta b{color:var(--ink); font-weight:600;}
.memoriam-quote{margin-top:12px; font-size:10.5px; font-style:italic; color:var(--gold-1); opacity:.85;}
.memoriam-edit-hint{margin-top:10px; font-size:10px; color:rgba(212,175,55,0.6); text-transform:uppercase; letter-spacing:.5px;}

/* NOTICE BOARD */
.notice-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.notice-card{padding:24px 20px;}
.notice-card .tag{font-size:10.5px; font-weight:800; color:var(--gold-1); letter-spacing:1px; text-transform:uppercase;}
.notice-card h4{font-family:var(--font-display); font-size:16px; margin:8px 0 6px;}
.notice-card p{font-size:12px; color:var(--ink-dim);}

/* DOWNLOAD */
.dl-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.dl-card{padding:24px 20px; display:flex; flex-direction:column; align-items:flex-start; gap:10px;}
.dl-card i{font-size:22px; color:var(--teal-soft);}
.dl-card h4{font-size:14.5px; font-weight:700;}
.dl-card span{font-size:12px; color:var(--ink-dim);}
.dl-card .dl-btn{margin-top:auto; font-size:12px; font-weight:700; color:var(--gold-1); display:flex; align-items:center; gap:6px;}

/* CONTACT */
.contact-grid{display:grid; grid-template-columns:.85fr 1.15fr; gap:36px;}
.contact-info-card{padding:32px;}
.ci-row{display:flex; gap:16px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,0.06);}
.ci-row i{width:42px; height:42px; border-radius:12px; background:rgba(212,175,55,0.12); border:1px solid rgba(212,175,55,0.3); display:flex; align-items:center; justify-content:center; color:var(--gold-1); flex:none;}
.ci-row b{display:block; font-size:13.5px;}
.ci-row span{font-size:13px; color:var(--ink-dim);}
.form-card{padding:34px;}
.form-grid{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-grid .full{grid-column:1/-1;}
.field label{font-size:12.5px; font-weight:600; color:var(--ink-dim); display:block; margin-bottom:7px;}
.field input, .field select, .field textarea{
  width:100%; padding:12px 14px; border-radius:10px; border:1px solid rgba(255,255,255,0.14);
  background:rgba(255,255,255,0.04); color:var(--ink); font-family:var(--font-body); font-size:13.5px; outline:none; transition:.25s;
}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--gold-2); box-shadow:0 0 0 3px rgba(212,175,55,0.15);}
.field select option{color:#000;}
.field input:disabled, .field select:disabled{opacity:.55; cursor:not-allowed; background:rgba(255,255,255,0.02);}

/* FOOTER */
footer{background:linear-gradient(180deg, var(--navy), var(--navy-deep)); border-top:1px solid rgba(212,175,55,0.25); padding-top:70px;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr 1.2fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,0.07);}
.foot-brand p{font-size:13.5px; color:var(--ink-dim); line-height:1.8; margin:16px 0 20px;}
.foot-social{display:flex; gap:10px;}
.foot-social a{width:36px; height:36px; border-radius:50%; background:rgba(212,175,55,0.1); border:1px solid rgba(212,175,55,0.3); display:flex; align-items:center; justify-content:center; color:var(--gold-1); transition:.3s;}
.topbar-right a i, .foot-social a i{font-size:14px; line-height:1;}
.foot-social a:hover{background:var(--gold-2); color:#1a1200; transform:translateY(-3px);}
.foot-col h4{font-family:var(--font-display); font-size:16px; margin-bottom:18px; color:var(--gold-1);}
.foot-col ul li{padding:7px 0;}
.foot-col ul li a{font-size:13.5px; color:var(--ink-dim);}
.foot-col ul li a:hover{color:var(--gold-1); padding-left:4px;}
.foot-bottom{display:flex; justify-content:space-between; align-items:center; padding:24px 0; font-size:12.5px; color:var(--ink-dim); flex-wrap:wrap; gap:10px;}
.dev-credit{
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap; text-align:center;
  padding:18px 0 26px; border-top:1px solid rgba(255,255,255,0.07); font-size:11.5px; color:var(--ink-dim);
}
.dev-credit img{height:34px; width:auto; border-radius:6px; background:#fff; padding:3px;}
.dev-credit b{color:var(--gold-1);}

/* FLOATING */
.floating-btns{position:fixed; right:22px; bottom:26px; display:flex; flex-direction:column; gap:14px; z-index:70;}
.fab{width:54px; height:54px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:22px; color:#fff;
  box-shadow:0 10px 26px rgba(0,0,0,0.35); animation:float 3s ease-in-out infinite;}
.fab.fb{background:linear-gradient(135deg,#00B2FF,#006AFF);}
.fab.wa{background:linear-gradient(135deg,#25D366,#128C7E); animation-delay:.4s;}
.fab.top{background:var(--gold-grad); color:#1a1200; font-size:18px; animation:none; opacity:.9;}
@keyframes float{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}

/* reveal anim */
.reveal{opacity:0; transform:translateY(28px); transition:opacity .8s ease, transform .8s ease;}
.reveal.show{opacity:1; transform:translateY(0);}

/* language visibility */
.bnblock{display:none;}
html.lang-bn .bnblock{display:block;}
html.lang-bn .enblock{display:none;}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .about-grid, .adm-grid, .contact-grid{grid-template-columns:1fr;}
  .coc-grid{grid-template-columns:1fr;}
  .coc-attendance{grid-template-columns:1fr 1fr 1fr;}
  .messages{grid-template-columns:1fr;}
  .highlight-showcase{grid-template-columns:1fr;}
  .memoriam-grid{grid-template-columns:repeat(3,1fr);}
  .course-grid{grid-template-columns:1fr 1fr;}
  .lab-grid{grid-template-columns:1fr 1fr;}
  .acad-grid{grid-template-columns:repeat(3,1fr);}
  .notice-grid, .dl-grid{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .hero-grid{grid-template-columns:1fr;}
}
@media (max-width:760px){
  .topbar .container{justify-content:center; text-align:center;}
  .topbar-left{display:none;}
  .burger{display:block;}
  .navlist{display:none; position:absolute; top:100%; left:0; right:0; flex-direction:column; background:var(--navy); border-bottom:1px solid rgba(212,175,55,0.3);}
  .navlist.open{display:flex;}
  .navlist > li{width:100%;}
  .navlist > li > a, .navlist > li > button{width:100%; justify-content:space-between;}
  .dropdown{position:static; opacity:1; visibility:visible; transform:none; display:none; box-shadow:none;}
  li.open .dropdown{display:block;}
  .apply-now{margin:12px 18px;}
  .header-inner{flex-wrap:wrap;}
  .course-grid, .lab-grid, .acad-grid, .notice-grid, .dl-grid, .foot-grid, .memoriam-grid{grid-template-columns:1fr;}
  .form-grid{grid-template-columns:1fr;}
  .brand-text .name{font-size:20px; white-space:normal;}
}
