/* ICC Animation College - shared stylesheet (all pages use this file) */
:root{--dark:#0d1117;--dark2:#06090f;--accent:#ff6b1a;--btn:#d9500a;--btn-h:#ff8a45;--bg:#f8fafc;--text:#1a202c;--light:#e6edf3;--muted:#8b949e;--border:#e2e8f0;--r:12px;--max:1200px}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:90px}
body{margin:0;font:400 1rem/1.65 'Inter',system-ui,sans-serif;color:var(--text);background:#fff}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{font-family:'Poppins',sans-serif;line-height:1.2;margin:0 0 .6em}
h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:800}
h2{font-size:clamp(1.6rem,3.5vw,2.4rem);font-weight:700}
h3{font-size:1.15rem;font-weight:600}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.skip{position:absolute;left:-999px;top:0;background:var(--btn);color:#fff;padding:.6rem 1rem;z-index:200}
.skip:focus{left:0}
.wrap{max-width:var(--max);margin:0 auto;padding:0 1.25rem}
section{padding:4.5rem 0}
.dark{background:var(--dark);color:var(--light)}
.dark p{color:var(--muted)}
.alt{background:var(--bg)}
.center{text-align:center}
.lead{max-width:640px;margin:0 auto 2.5rem;color:#4a5568}
.dark .lead{color:var(--muted)}
.grid{display:grid;gap:1.5rem}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}

/* Buttons */
.btn{display:inline-block;background:var(--btn);color:#fff;font-weight:600;padding:.8rem 1.6rem;border-radius:var(--r);border:0;cursor:pointer;font-size:1rem;transition:background .2s,transform .2s}
.btn:hover{background:#b8420a;transform:translateY(-2px)}
.btn.ghost{background:transparent;border:2px solid var(--light);color:var(--light)}
.btn.ghost:hover{background:var(--light);color:var(--dark)}

/* Header */
.site-header{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--dark2);color:var(--light);transition:box-shadow .3s}
.site-header.scrolled{box-shadow:0 4px 20px rgba(0,0,0,.45)}
.topbar{font-size:.9rem;border-bottom:1px solid #161b22}
.tb{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.5rem 1.25rem}
.tb-l,.tb-r{display:flex;align-items:center;gap:1.2rem}
.topbar a{color:var(--light)}
.ic{display:inline-grid;place-items:center;width:18px;height:18px;border-radius:50%;background:var(--btn);margin-right:.4rem;font-size:.6rem;color:#fff}
.topbar .pill{background:#fff;color:var(--text);font-weight:600;padding:.3rem .9rem;border-radius:8px;font-size:.85rem}
.topbar .pill.hot{background:var(--btn);color:#fff}
.topbar .pill:hover{background:var(--btn-h);color:var(--dark)}
.nc{padding-bottom:.6rem}
.navcard{position:relative;display:flex;align-items:center;justify-content:space-between;min-height:64px;padding:.4rem 1.2rem;background:#fff;color:var(--text);border-radius:var(--r);box-shadow:0 6px 24px rgba(0,0,0,.35)}
.logo{font:800 1.25rem 'Poppins',sans-serif;color:var(--text)}.logo span{color:var(--btn)}
.menu{display:flex;align-items:center;gap:1rem;list-style:none;margin:0;padding:0}
.menu>li{position:relative}
.menu>li+li{border-left:1px solid #cbd5e0;padding-left:1rem}
.menu a,.dd-toggle{color:var(--text);font-size:.95rem;font-weight:600;background:none;border:0;cursor:pointer;font-family:inherit;padding:.5rem 0}
.menu a:hover,.dd-toggle:hover{color:var(--btn)}
.dropdown{position:absolute;top:100%;left:0;min-width:250px;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:0 12px 28px rgba(0,0,0,.18);list-style:none;margin:0;padding:.5rem;display:none;z-index:5}
.dropdown a{display:block;padding:.5rem .8rem;border-radius:8px;font-weight:500}
.dropdown a:hover{background:#fff1e8}
.has-dd:hover .dropdown,.has-dd.open .dropdown{display:block}
.burger{display:none;background:none;border:0;color:var(--text);font-size:1.8rem;cursor:pointer}

/* Hero */
.hero{background:linear-gradient(rgba(6,9,15,.5),rgba(6,9,15,.65)),url('images/hero.jpg') center/cover,var(--dark2);color:var(--light);padding:7rem 0 6rem}
.hero h1{max-width:820px}
.hero p{max-width:600px;font-size:1.15rem;color:#c9d1d9}
.hero .actions{display:flex;flex-wrap:wrap;gap:1rem;margin-top:2rem}

/* Counters */
.stats{padding:0;background:var(--dark);border-top:1px solid #21262d}
.stats .grid{padding:2.5rem 0;text-align:center}
.stat b{display:block;font:800 clamp(2rem,4vw,3rem) 'Poppins',sans-serif;color:var(--accent)}
.stat span{color:var(--muted)}

/* Cards */
.card{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:1.5rem;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-4px);box-shadow:0 12px 28px rgba(0,0,0,.1)}
.card .meta{color:#4a5568;font-size:.9rem;margin:0 0 1rem}
.card .more{color:var(--btn);font-weight:600}
.card img{border-radius:8px;margin-bottom:1rem;aspect-ratio:16/10;object-fit:cover;background:#e2e8f0}
.dark .card{background:#161b22;border-color:#21262d;color:var(--light)}
.dark .card p{color:var(--muted)}
.tag{display:inline-block;background:#fff1e8;color:#a63c00;font-size:.8rem;font-weight:600;padding:.15rem .6rem;border-radius:99px;margin-bottom:.6rem}

/* Scholarship banner */
.banner{background:linear-gradient(120deg,var(--btn),#ff8a45);color:#fff;border-radius:var(--r);padding:2.5rem;display:flex;flex-wrap:wrap;gap:1.5rem;align-items:center;justify-content:space-between}
.banner h2{margin:0 0 .4rem}.banner p{margin:0}
.banner .btn{background:var(--dark);}

/* Testimonial slider */
.slider{max-width:760px;margin:0 auto;overflow:hidden}
.track{display:flex;transition:transform .5s}
.slide{min-width:100%;padding:0 .5rem}
.slide blockquote{margin:0;font-size:1.15rem}
.slide cite{display:block;margin-top:1rem;color:var(--accent);font-style:normal;font-weight:600}
.dots{display:flex;justify-content:center;gap:.5rem;margin-top:1.5rem}
.dots button{width:12px;height:12px;border-radius:50%;border:0;background:#30363d;cursor:pointer}
.dots button.on{background:var(--accent)}

/* Partners */
.partners{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center}
.partners span{display:flex;align-items:center;justify-content:center;width:160px;height:80px;padding:.75rem 1rem;background:#fff;border:1px solid #e5e9f0;border-radius:var(--r)}
.partners span img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;filter:grayscale(1);opacity:.75;transition:.2s}
.partners span:hover img{filter:none;opacity:1}

/* Forms */
form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{margin-bottom:1rem}
label{display:block;font-weight:600;margin-bottom:.3rem}
input,select,textarea{width:100%;padding:.75rem;border:1px solid #cbd5e0;border-radius:8px;font:inherit}
.field.err input,.field.err select,.field.err textarea{border-color:#d92d20}
.msg{color:#d92d20;font-size:.85rem;min-height:1em}
.ok{background:#e6f9ed;color:#106b32;padding:1rem;border-radius:8px;margin-top:1rem}

/* Footer */
.site-footer{background:var(--dark2);color:var(--light);padding:4rem 0 1.5rem}
.site-footer h3{color:#fff}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:.5rem}
.site-footer a,.site-footer p{color:var(--muted)}
.site-footer a:hover{color:var(--accent)}
.copy{border-top:1px solid #21262d;margin-top:2rem;padding-top:1.5rem;text-align:center;color:var(--muted);font-size:.9rem}

/* Floating buttons */
.wa,.top{position:fixed;right:1.1rem;z-index:90;border-radius:50%;width:54px;height:54px;display:grid;place-items:center;border:0;cursor:pointer;box-shadow:0 6px 18px rgba(0,0,0,.3);color:#fff;font-weight:700}
.wa{bottom:1.1rem;background:#128c4a}
.top{bottom:5.2rem;background:var(--dark);opacity:0;pointer-events:none;transition:opacity .3s}
.top.show{opacity:1;pointer-events:auto}

/* Scroll reveal (only when JS is on) */
.js .fade{opacity:0;transition:opacity .6s}
.js .fade.in{opacity:1}
@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}.js .fade{opacity:1}}

/* Responsive */
@media (max-width:1024px){.g4{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(2,1fr)}}
@media (max-width:768px){
 section{padding:3rem 0}
 .burger{display:block}
 .menu{position:absolute;top:calc(100% + 8px);left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:var(--r);box-shadow:0 12px 28px rgba(0,0,0,.25);flex-direction:column;align-items:stretch;gap:0;padding:.5rem 1.2rem;display:none;max-height:70vh;overflow:auto}
 .menu.open{display:flex}
 .menu>li,.menu>li+li{border-left:0;padding:.3rem 0;border-bottom:1px solid var(--border)}
 .tb-l a:nth-child(2){display:none}
 .dropdown{position:static;display:none;border:0;box-shadow:none;padding-left:1rem}
 .has-dd:hover .dropdown{display:none}.has-dd.open .dropdown{display:block}
 .g2,.g3,form .row{grid-template-columns:1fr}
}
@media (max-width:480px){.g4{grid-template-columns:1fr}.hero{padding:4.5rem 0 4rem}.btn{width:100%;text-align:center}}

/* EXTRA: inner pages */
[hidden]{display:none!important}
.sub{padding:4rem 0 3.5rem}.sub p{margin:.3rem 0 1rem}
.crumb{font-size:.9rem;color:var(--muted);margin-bottom:1rem}.crumb a:hover{color:var(--accent)}
.scroll{overflow-x:auto}.tbl{width:100%;border-collapse:collapse;background:#fff;color:var(--text)}
.tbl th,.tbl td{padding:.8rem 1rem;border:1px solid var(--border);text-align:left}.tbl th{background:var(--dark);color:#fff}
.list{padding-left:1.2rem}.list li{margin-bottom:.4rem}
.faq details{border:1px solid var(--border);border-radius:var(--r);padding:1rem 1.2rem;margin-bottom:.8rem;background:#fff}
.faq summary{cursor:pointer;font-weight:600}.faq p{margin:.7rem 0 0}
.filters{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;margin-bottom:2rem}
.filters button{padding:.5rem 1.1rem;border-radius:99px;border:1px solid var(--border);background:#fff;cursor:pointer;font:inherit;font-weight:500}
.filters button.on{background:var(--btn);border-color:var(--btn);color:#fff}
.icons{display:flex;flex-wrap:wrap;gap:.8rem}.icons span{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:.7rem 1.2rem;font-weight:600}
.mason{columns:3 240px;column-gap:1rem}.mason img{margin-bottom:1rem;width:100%;border-radius:var(--r);cursor:zoom-in;background:#e2e8f0}
.prog{display:flex;list-style:none;padding:0;gap:.4rem;margin:0 0 1.5rem}.prog li{flex:1;text-align:center;font-size:.8rem;padding:.4rem 0;border-bottom:4px solid var(--border)}.prog li.on{border-color:var(--btn);font-weight:600}
fieldset.step{border:0;padding:0;margin:0}
.nav-btns{display:flex;justify-content:space-between;gap:1rem;margin-top:1rem}
dl.rev{display:grid;grid-template-columns:auto 1fr;gap:.4rem 1rem}dl.rev dt{font-weight:600}dl.rev dd{margin:0}
.side{display:grid;grid-template-columns:2fr 1fr;gap:2rem}
.clap{font:800 clamp(4rem,14vw,9rem) 'Poppins',sans-serif;color:var(--accent);animation:fl 1.6s steps(2) infinite;margin:0}
@keyframes fl{50%{opacity:.35}}
@media (max-width:768px){.side{grid-template-columns:1fr}}

/* Fixed header: top bar collapses on scroll, nav card stays put (body padding is set by JS) */
body{padding-top:124px}
.topbar{overflow:hidden;max-height:120px;transition:max-height .3s}
.site-header.scrolled .topbar{max-height:0;border-bottom-width:0}
.site-header.scrolled .nc{padding-top:.5rem}

/* ===== Student portal (student-login.html) ===== */
.card.static:hover{transform:none;box-shadow:none}
.login-card{max-width:440px;margin:0 auto}
.pw{position:relative}.pw input{padding-right:4.5rem}
.pw button{position:absolute;right:.4rem;top:50%;transform:translateY(-50%);background:none;border:0;color:var(--btn);font-weight:600;cursor:pointer;padding:.4rem .6rem}
.login-help{font-size:.9rem;color:#4a5568;margin:1rem 0 0}
.demo-note{background:#fff7ed;border:1px dashed var(--accent);border-radius:8px;padding:.6rem .8rem;font-size:.9rem;margin:1rem 0 0}
.portal-bar{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem}
.btn.out{background:transparent;color:var(--text);border:2px solid var(--text);padding:.45rem 1.1rem;font-size:.95rem}
.btn.out:hover{background:var(--text);color:#fff}
.portal{display:grid;grid-template-columns:240px 1fr;gap:1.5rem;align-items:start}
.p-side{display:flex;flex-direction:column;border-radius:var(--r);overflow:hidden;border:1px solid #21262d;position:sticky;top:140px}
.p-side a{display:block;padding:1rem 1.2rem;background:var(--dark);color:var(--light);font-weight:600;border-bottom:1px solid #21262d}
.p-side a:last-child{border-bottom:0}
.p-side a:hover{background:#1c2330}
.p-side a.on{background:var(--btn);color:#fff}
.p-preview{background:#fff;border:1px solid var(--border);border-radius:var(--r);padding:1.75rem;min-height:440px;min-width:0}
.p-panel h2{margin-top:0;scroll-margin-top:150px}.p-panel h2:focus{outline:none}
.p-panel h3{margin:1rem 0 .4rem}
.p-profile{display:flex;align-items:center;gap:1rem;margin-bottom:1.25rem}
.avatar{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--dark);color:var(--accent);font:700 1.2rem 'Poppins',sans-serif;flex:none}
.p-profile div span{color:#4a5568}
.p-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem 1.5rem;margin:0}
.p-grid div{border-bottom:1px solid var(--border);padding-bottom:.6rem}
.p-grid dt{font-size:.8rem;color:#4a5568;text-transform:uppercase;letter-spacing:.04em}
.p-grid dd{margin:.15rem 0 0;font-weight:600;overflow-wrap:anywhere}
.r-out{margin-top:1.5rem}.r-out tfoot th{background:#f1f5f9;color:var(--text)}.r-sum{font-size:1.1rem}
.idcard{max-width:420px;border:2px solid var(--dark);border-radius:14px;overflow:hidden;background:#fff}
.idc-head{background:var(--dark);color:#fff;padding:.8rem 1rem;display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.idc-head b{font-family:'Poppins',sans-serif}.idc-head span{color:var(--accent);font-size:.85rem;font-weight:600}
.idc-main{display:flex;gap:1rem;padding:1rem}
.idc-photo{display:grid;place-items:center;width:92px;height:112px;flex:none;background:#e2e8f0;border:1px solid #cbd5e0;border-radius:8px;color:#4a5568;font:700 1.6rem 'Poppins',sans-serif}
.idcard dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:.25rem .75rem;font-size:.88rem}
.idcard dt{color:#4a5568}.idcard dd{margin:0;font-weight:600}
.idc-foot{background:#f1f5f9;padding:.6rem 1rem;font-size:.75rem;color:#4a5568;text-align:center}
@media (max-width:768px){
  .portal{grid-template-columns:1fr}
  .p-side{flex-direction:row;overflow-x:auto;position:static}
  .p-side a{white-space:nowrap;border-bottom:0;border-right:1px solid #21262d;flex:none}
  .p-preview{padding:1.25rem}
  .p-grid{grid-template-columns:1fr}
}
@media print{
  body *{visibility:hidden}
  .idcard,.idcard *{visibility:visible}
  .idcard{position:fixed;left:50%;top:2cm;transform:translateX(-50%)}
}
@media (max-width:480px){.btn.out{width:auto}.portal-bar{flex-wrap:wrap}}

/* ===== LMS (student-login.html #lms) and admin panel (admin.html) ===== */
.lms-tools{display:flex;flex-wrap:wrap;gap:.8rem;align-items:center;justify-content:space-between;margin:1rem 0 1.25rem}
.lms-tools .filters{justify-content:flex-start;margin:0}
.lms-tools input[type=search]{max-width:260px;width:100%;padding:.6rem .9rem;border:1px solid var(--border);border-radius:var(--r);font:inherit}
.lms-sec{margin:1.5rem 0 .6rem;font-size:1.05rem}
.lms-list{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.lms-card{border:1px solid var(--border);border-radius:var(--r);padding:1rem 1.1rem;background:#fff;display:flex;flex-direction:column;gap:.45rem;min-width:0}
.lms-card h4{margin:0;font:600 1rem 'Poppins',sans-serif;overflow-wrap:anywhere}
.lms-card p{margin:0;font-size:.92rem;color:#4a5568}
.lms-card .lms-sub{font-size:.8rem;color:#4a5568;text-transform:uppercase;letter-spacing:.04em}
.lms-card ul{margin:.2rem 0 0;padding-left:1.1rem;font-size:.92rem}
.lms-card .lms-act{margin-top:auto;padding-top:.4rem}
.lms-card .btn{padding:.45rem 1rem;font-size:.9rem}
.lms-card.wide{grid-column:1/-1}
.badge{display:inline-block;align-self:flex-start;font-size:.72rem;font-weight:700;padding:.15rem .6rem;border-radius:99px;background:var(--dark);color:#fff;text-transform:uppercase;letter-spacing:.04em}
.badge.syllabus{background:#0b6b4b}.badge.note{background:#8a5a00}.badge.video{background:#b8420a}.badge.draft{background:#6b7280}.badge.soon{background:#e2e8f0;color:#4a5568}
.lms-player{position:relative;width:100%;aspect-ratio:16/9;background:#000;border-radius:8px;overflow:hidden;margin-top:.4rem}
.lms-player iframe,.lms-player video{position:absolute;inset:0;width:100%;height:100%;border:0}
.lms-empty{border:1px dashed var(--border);border-radius:var(--r);padding:2rem 1rem;text-align:center;color:#4a5568}
.adm-stats{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));margin:1rem 0 1.5rem}
.adm-stat{border:1px solid var(--border);border-radius:var(--r);padding:1rem;background:#fff}
.adm-stat b{display:block;font:700 1.8rem 'Poppins',sans-serif;color:var(--btn)}
.adm-filters{display:flex;flex-wrap:wrap;gap:.7rem;margin:1rem 0}
.adm-filters select,.adm-filters input{padding:.55rem .8rem;border:1px solid var(--border);border-radius:var(--r);font:inherit;min-width:0}
.adm-acts{display:flex;flex-wrap:wrap;gap:.4rem}
.adm-acts button{padding:.3rem .7rem;border:1px solid var(--border);border-radius:8px;background:#fff;cursor:pointer;font:inherit;font-size:.85rem}
.adm-acts button.del{color:#b42318;border-color:#f1b5b0}
.adm-form{max-width:640px}
.adm-form textarea,.adm-form select,.adm-form input[type=text],.adm-form input[type=url],.adm-form input[type=number]{width:100%;padding:.7rem .9rem;border:1px solid var(--border);border-radius:var(--r);font:inherit}
.adm-warn{background:#fff7ed;border:1px solid var(--accent);border-radius:8px;padding:.7rem .9rem;font-size:.92rem;margin:1rem 0}
@media print{.lms-tools,.lms-player{display:none}}
