/* ============================================================
   IIGJ shared site shell — header, navigation, footer, flash
   messages and the login/apply modal.
   Extracted from the home page so every front-end page renders
   exactly the same chrome. Page-specific CSS must load AFTER
   this file.
   ============================================================ */

/* chrome-only tokens: never overridden by page level :root blocks */
:root{--shell-gold:#ddc072}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;font-family:Inter,Arial,sans-serif;color:#171717;background:#fff;overflow-x:clip}
body.modal-open{overflow:hidden}
a{text-decoration:none;color:inherit}
button,input{font:inherit}
.container{width:min(1180px,calc(100% - 32px));margin:auto}
.btn{border:0;border-radius:10px;padding:13px 21px;font-weight:800;cursor:pointer}
.btn-gold{background:var(--shell-gold);color:#111}
.btn-black{background:#111;color:#fff}
/* The bar and the menu it drops carry their own ink. A page is free to paint
   its body dark — the class recording page does — and the white bar must not
   turn white-on-white along with it. */
.navbar,.mobile-menu{color:#171717}
.navbar{height:82px;background:#fff;border-bottom:1px solid #ececec;position:sticky;top:0;z-index:50}
.nav-inner{height:100%;display:flex;align-items:center;gap:28px}
.logos{display:flex;gap:10px}
.logo{min-width:74px;height:44px;border:1px solid #ddd3b9;border-radius:9px;display:grid;place-items:center;font-weight:900}
.logo.gold{background:var(--shell-gold);border-color:var(--shell-gold)}
.menu{margin-left:auto;display:flex;align-items:center;gap:7px}
.menu a{padding:12px 13px;font-weight:750;border-radius:8px}
.menu a:hover{background:#f8f5ec}
.mobile-toggle{display:none;margin-left:auto;width:42px;height:42px;border:0;border-radius:9px;background:#111;color:#fff;font-size:21px}
.mobile-menu{display:none}
.btn-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.4);transition:background .18s ease,border-color .18s ease}
.btn-outline:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.7)}
.footer{background:#0b0b0b;border-top:5px solid var(--shell-gold);padding:54px 0 22px;color:#fff}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.1fr;gap:35px}
.footer-col-last{grid-column:-2 / -1}
.footer h4{color:var(--shell-gold);margin:0 0 15px}
.footer a,.footer p{color:#bdbdbd;font-size:14px;line-height:1.9}
.footer a{display:block}
.footer-bottom{border-top:1px solid #292929;margin-top:34px;padding-top:18px;color:#888;font-size:12px;display:flex;justify-content:space-between}
.footer-bottom a{display:inline;color:inherit;text-decoration:none}
.footer-bottom a:hover{color:#bdbdbd;text-decoration:underline}
.auth-backdrop{position:fixed;inset:0;background:rgba(10,9,6,.72);backdrop-filter:blur(4px);z-index:100;display:none;place-items:center;padding:20px;animation:authFade .16s ease}
.auth-backdrop.open{display:grid}
@keyframes authFade{from{opacity:0}to{opacity:1}}
.auth-modal{width:min(500px,100%);max-height:calc(100vh - 40px);overflow:auto;background:#fff;border-radius:22px;box-shadow:0 34px 90px rgba(0,0,0,.45);position:relative;animation:authRise .22s cubic-bezier(.2,.8,.3,1)}
@keyframes authRise{from{opacity:0;transform:translateY(14px) scale(.97)}to{opacity:1;transform:none}}

/* head: the brand's black, warmed by a gold glow behind the crest */
.auth-modal-head{position:relative;display:flex;align-items:flex-start;gap:15px;padding:26px 26px 24px;color:#fff;
  background:radial-gradient(circle at 88% -20%,rgba(221,192,114,.30),transparent 58%),linear-gradient(140deg,#1a1712,#0b0b0b 62%)}
.auth-crest{flex:0 0 46px;width:46px;height:46px;display:grid;place-items:center;border-radius:14px;
  background:linear-gradient(150deg,#f2dfa6,#ddc072);color:#1a1610;box-shadow:0 10px 22px rgba(221,192,114,.28)}
.auth-crest svg{width:23px;height:23px}
.auth-modal-titles{min-width:0;padding-right:34px}
.auth-modal-head h3{margin:0 0 6px;font-size:23px;line-height:1.15;letter-spacing:-.02em}
.auth-modal-head p{margin:0;color:#b3ab9a;font-size:13px;line-height:1.55}
.auth-modal-close{position:absolute;right:16px;top:16px;width:34px;height:34px;display:grid;place-items:center;
  border:1px solid rgba(255,255,255,.16);border-radius:50%;background:rgba(255,255,255,.08);color:#efe6d2;
  font-size:19px;line-height:1;cursor:pointer;transition:.15s}
.auth-modal-close:hover{background:rgba(255,255,255,.18);color:#fff;border-color:rgba(255,255,255,.3)}

.auth-modal-body{padding:22px 26px 26px}

/* one switch, instead of a link buried under each form */
.auth-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:20px;padding:4px;border-radius:12px;background:#f4f0e6;border:1px solid #eadfc6}
.auth-switch-btn{min-height:38px;border:0;border-radius:9px;background:transparent;color:#7d745f;font-size:13px;font-weight:850;cursor:pointer;transition:.16s}
.auth-switch-btn:hover{color:#2b2620}
.auth-switch-btn.active{background:#fff;color:#191510;box-shadow:0 3px 10px rgba(60,50,25,.10)}

.auth-pane{display:none}
.auth-pane.active{display:block;animation:authPane .18s ease}
@keyframes authPane{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.auth-field{margin-bottom:15px}
.auth-field-top{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.auth-field label{display:block;font-size:12px;font-weight:850;letter-spacing:.02em;color:#3a342a;margin-bottom:7px}
.auth-field input{width:100%;height:48px;border:1px solid #e2d8c2;border-radius:11px;padding:0 13px;background:#fdfbf6;color:#191510;font-size:14px;transition:.16s}
.auth-field input::placeholder{color:#a89f8c}
.auth-field input:hover{border-color:#d2c39f}
.auth-field input:focus{outline:none;background:#fff;border-color:#c9ac63;box-shadow:0 0 0 3px rgba(221,192,114,.22)}

.auth-submit{width:100%;min-height:50px;margin-top:6px;border:0;border-radius:12px;font-size:14.5px;font-weight:850;cursor:pointer;transition:.16s}
.auth-submit-dark{background:linear-gradient(180deg,#26211a,#0d0c0a);color:#fff;box-shadow:0 12px 26px rgba(12,11,9,.26)}
.auth-submit-dark:hover{background:linear-gradient(180deg,#332c22,#151310)}
.auth-submit-gold{background:linear-gradient(180deg,#e6cd8a,#d0ae5c);color:#1a1610;box-shadow:0 12px 26px rgba(198,166,90,.32)}
.auth-submit-gold:hover{background:linear-gradient(180deg,#eed79a,#d8b866)}

.auth-demo{display:flex;align-items:center;justify-content:center;gap:9px;margin-top:14px;padding:10px 12px;border:1px dashed #e0d2ae;border-radius:11px;background:#fdfaf1;font-size:12.5px;color:#6f6653}
.auth-demo b{color:#8a7027;font-weight:850}
.account-note{border-top:1px solid #efe7d5;margin-top:18px;padding-top:16px;text-align:center;color:#7c7466;font-size:13px;line-height:1.6}
.link-btn{border:0;background:none;color:#9b7e31;font-weight:850;text-decoration:none;cursor:pointer;padding:0 2px;font-size:12.5px;transition:.15s}
.link-btn:hover{color:#7a6120;text-decoration:underline;text-underline-offset:3px}
@media(max-width:520px){.auth-row{grid-template-columns:1fr}.auth-modal-head{padding:22px}.auth-modal-body{padding:20px}}
@media(max-width:900px){.menu{display:none}.mobile-toggle{display:block}.mobile-menu{position:fixed;top:82px;left:0;right:0;background:#fff;border-bottom:1px solid #ddd;z-index:49;padding:14px 16px;box-shadow:0 15px 35px rgba(0,0,0,.1)}.mobile-menu.open{display:grid}.mobile-menu a,.mobile-menu button{padding:13px;text-align:left;border:0;background:#fff;font-weight:800}.footer-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.navbar{height:72px}.mobile-menu{top:72px}.logo{min-width:60px;height:38px;font-size:12px}.footer-grid{grid-template-columns:1fr}.footer-grid>div{text-align:center}.footer-bottom{flex-direction:column;gap:8px;align-items:center;text-align:center}}
.logo-img-wrap{
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}


.iigj-logo{
  display:block;
  width:auto;
  height:46px;
  max-width:155px;
  object-fit:contain;
}
.footer-logo-wrap{background:#fff;border-radius:9px;padding:4px 8px;height:46px}
.footer-iigj-logo{height:38px;max-width:130px}
@media(max-width:900px){.logo-img-wrap{height:46px}.iigj-logo{height:40px;max-width:138px}}
@media(max-width:560px){.logo-img-wrap{height:40px}.iigj-logo{height:34px;max-width:118px}.footer-logo-wrap{height:40px}.footer-iigj-logo{height:31px;max-width:108px}}
@media(max-width:380px){.iigj-logo{height:30px;max-width:102px}}
.iitm-logo-wrap{
  height:52px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}
.iitm-logo{
  display:block;
  width:auto;
  height:44px;
  max-width:170px;
  object-fit:contain;
}
.footer .iitm-logo-wrap{
  background:#fff;
  border-radius:9px;
  padding:4px 8px;
  height:46px;
}
.footer .iitm-logo{
  height:36px;
  max-width:145px;
}
@media(max-width:900px){.iitm-logo-wrap{height:46px}.iitm-logo{height:39px;max-width:150px}}
@media(max-width:560px){.iitm-logo-wrap{height:40px}.iitm-logo{height:33px;max-width:125px}.footer .iitm-logo-wrap{height:40px}.footer .iitm-logo{height:30px;max-width:112px}}
@media(max-width:380px){.iitm-logo{height:29px;max-width:108px}}
.navbar{height:96px}
.nav-inner{gap:34px}
.logo-img-wrap,
.iitm-logo-wrap{
  height:70px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.iigj-logo{
  height:62px;
  max-width:205px;
}
.iitm-logo{
  height:60px;
  max-width:220px;
}
.logos{gap:16px;align-items:center}
@media(max-width:1200px){.navbar{height:90px}.logo-img-wrap,.iitm-logo-wrap{height:64px}.iigj-logo{height:56px;max-width:188px}.iitm-logo{height:54px;max-width:200px}}
@media(max-width:900px){.navbar{height:82px}.mobile-menu{top:82px}.logo-img-wrap,.iitm-logo-wrap{height:56px}.iigj-logo{height:49px;max-width:165px}.iitm-logo{height:47px;max-width:175px}.logos{gap:12px}}
@media(max-width:560px){.navbar{height:74px}.mobile-menu{top:74px}.logo-img-wrap,.iitm-logo-wrap{height:48px}.iigj-logo{height:41px;max-width:138px}.iitm-logo{height:39px;max-width:145px}.logos{gap:8px}}
@media(max-width:380px){.iigj-logo{height:36px;max-width:120px}.iitm-logo{height:34px;max-width:126px}}
.navbar{height:112px}
.nav-inner{gap:40px}
.logo-img-wrap,
.iitm-logo-wrap{
  height:84px;
}
.iigj-logo{
  height:76px;
  max-width:250px;
}
.iitm-logo{
  height:74px;
  max-width:270px;
}
.logos{gap:20px}
@media(max-width:1200px){.navbar{height:102px}.logo-img-wrap,.iitm-logo-wrap{height:76px}.iigj-logo{height:68px;max-width:225px}.iitm-logo{height:66px;max-width:240px}}
@media(max-width:900px){.navbar{height:92px}.mobile-menu{top:92px}.logo-img-wrap,.iitm-logo-wrap{height:66px}.iigj-logo{height:58px;max-width:190px}.iitm-logo{height:56px;max-width:205px}.logos{gap:14px}}
@media(max-width:560px){.navbar{height:80px}.mobile-menu{top:80px}.logo-img-wrap,.iitm-logo-wrap{height:56px}.iigj-logo{height:48px;max-width:155px}.iitm-logo{height:46px;max-width:165px}.logos{gap:9px}}
@media(max-width:380px){.navbar{height:76px}.mobile-menu{top:76px}.iigj-logo{height:42px;max-width:135px}.iitm-logo{height:40px;max-width:142px}}
.navbar,
.logo-img-wrap,
.iitm-logo-wrap,
.iigj-logo,
.iitm-logo{
  transition:height .28s ease, max-width .28s ease, padding .28s ease, box-shadow .28s ease;
}
.navbar.scrolled{
  height:76px;
  box-shadow:0 8px 28px rgba(0,0,0,.08);
}
.navbar.scrolled .logo-img-wrap,
.navbar.scrolled .iitm-logo-wrap{
  height:54px;
}
.navbar.scrolled .iigj-logo{
  height:46px;
  max-width:155px;
}
.navbar.scrolled .iitm-logo{
  height:44px;
  max-width:165px;
}
@media(max-width:900px){.navbar.scrolled{height:70px}.navbar.scrolled + .mobile-menu{top:70px}.navbar.scrolled .logo-img-wrap,
  .navbar.scrolled .iitm-logo-wrap{height:48px}.navbar.scrolled .iigj-logo{height:40px;max-width:135px}.navbar.scrolled .iitm-logo{height:38px;max-width:145px}}
@media(max-width:560px){.navbar.scrolled{height:66px}.navbar.scrolled + .mobile-menu{top:66px}.navbar.scrolled .logo-img-wrap,
  .navbar.scrolled .iitm-logo-wrap{height:44px}.navbar.scrolled .iigj-logo{height:36px;max-width:120px}.navbar.scrolled .iitm-logo{height:34px;max-width:128px}}
.navbar{
  position:sticky;
}
.navbar::after{
  content:"";
  position:absolute;
  left:50%;
  bottom:0;
  transform:translateX(-50%);
  width:min(94%,1180px);
  height:4px;
  border-radius:999px 999px 0 0;
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(221,192,114,.35) 7%,
    #ddc072 22%,
    #b89b50 50%,
    #ddc072 78%,
    rgba(221,192,114,.35) 93%,
    transparent 100%
  );
  box-shadow:0 3px 12px rgba(221,192,114,.28);
  transition:height .28s ease,width .28s ease,opacity .28s ease;
}
.navbar.scrolled::after{
  width:min(88%,1080px);
  height:3px;
  opacity:.9;
}
@media(max-width:900px){.navbar::after{width:94%;height:3px}.navbar.scrolled::after{width:90%;height:2px}}
@media(max-width:560px){.navbar::after{width:92%;height:2px}.navbar.scrolled::after{width:88%;height:2px}}
.navbar{
  height:96px;
}
.nav-inner{
  height:100%;
  align-items:center;
}
.logo-img-wrap,
.iitm-logo-wrap{
  height:76px;
}
.iigj-logo{
  height:76px;
  max-width:250px;
}
.iitm-logo{
  height:74px;
  max-width:270px;
}
.navbar.scrolled{
  height:72px;
}
@media(max-width:1200px){.navbar{height:90px}}
@media(max-width:900px){.navbar{height:84px}.mobile-menu{top:84px}}
@media(max-width:560px){.navbar{height:76px}.mobile-menu{top:76px}}
.footer-logo-stack{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:16px;
  margin-bottom:20px;
}
.footer-brand-logo{
  width:auto;
  object-fit:contain;
  display:block;
}
.footer-iigj{
  height:58px;
  max-width:185px;
}
.footer-gjepc{
  height:50px;
  max-width:165px;
}
@media(max-width:900px){.footer-iigj{height:54px;max-width:175px}.footer-gjepc{height:46px;max-width:155px}}
@media(max-width:560px){.footer-logo-stack{gap:13px}.footer-iigj{height:50px;max-width:165px}.footer-gjepc{height:42px;max-width:145px}}
.footer-logo-stack{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:flex-start;
  gap:14px;
  margin:0 0 22px;
}
.footer-logo-stack .footer-brand-logo{
  display:block;
  width:auto;
  object-fit:contain;
  object-position:left center;
  flex:none;
}
.footer-logo-stack .footer-iigj{
  height:64px;
  max-width:205px;
}
.footer-logo-stack .footer-gjepc{
  height:48px;
  max-width:178px;
}
@media(max-width:900px){.footer-logo-stack .footer-iigj{height:58px;max-width:190px}.footer-logo-stack .footer-gjepc{height:44px;max-width:164px}}
@media(max-width:560px){.footer-logo-stack{gap:12px;align-items:center;text-align:center}.footer-logo-stack .footer-iigj{height:54px;max-width:178px}.footer-logo-stack .footer-gjepc{height:41px;max-width:152px}}
.footer{
  background:#e8ecef;
  color:#111;
  border-top:5px solid var(--shell-gold);
}
.footer h4{
  color:#111;
}
.footer a,
.footer p{
  color:#4d545a;
}
.footer a:hover{
  color:#8d742f;
}
.footer-bottom{
  border-top:1px solid #cfd5da;
  color:#6c7379;
}
.footer .logo,
.footer-logo-wrap,
.footer .iitm-logo-wrap{
  background:transparent;
}
.footer-logo-stack .footer-iigj{
  height:78px;
  max-width:245px;
}
@media(max-width:900px){.footer-logo-stack .footer-iigj{
    height:70px;
    max-width:225px;
  }}
@media(max-width:560px){.footer-logo-stack .footer-iigj{
    height:62px;
    max-width:200px;
  }}
.footer-logo-stack .footer-iigj{
  height:92px;
  max-width:285px;
}
@media(max-width:900px){.footer-logo-stack .footer-iigj{
    height:82px;
    max-width:255px;
  }}
@media(max-width:560px){.footer-logo-stack .footer-iigj{
    height:70px;
    max-width:220px;
  }}
.login-helper{margin-top:10px;text-align:right;font-size:13px}
.account-menu{position:relative}
.account-btn{width:44px;height:44px;border-radius:50%;border:1px solid #ddd3b9;background:#fff;display:grid;place-items:center;font-size:18px;font-weight:900;cursor:pointer;transition:.2s}
.account-btn:hover{background:#f7f2e5;border-color:#ddc072}
.account-dropdown{display:none;position:absolute;right:0;top:54px;width:235px;background:#fff;border:1px solid #e5dfd0;border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.15);padding:8px;z-index:70}
.account-dropdown{box-shadow:0 24px 60px rgba(24,18,6,.20)}
.account-dropdown.open{display:block;animation:accountRise .17s cubic-bezier(.2,.8,.3,1)}
@keyframes accountRise{from{opacity:0;transform:translateY(-6px) scale(.985)}to{opacity:1;transform:none}}
.account-dropdown a{transition:.15s ease}
.account-dropdown .account-head{padding:11px;border-bottom:1px solid #eee8dc;margin-bottom:5px}
.account-dropdown .account-head b{display:block;font-size:13px}
.account-dropdown .account-head span{font-size:11px;color:#777}
.account-dropdown a{display:block;padding:10px 11px;border-radius:9px;font-size:13px;font-weight:750;color:#333}
.account-dropdown a:hover{background:#f7f4ec}
.notif-menu{position:relative}
.notif-btn{position:relative;width:44px;height:44px;border-radius:50%;border:1px solid #ddd3b9;background:#fff;color:#365269;display:grid;place-items:center;font-size:17px;cursor:pointer;transition:.18s ease}
.notif-btn i{font-size:18px;line-height:1}
.notif-btn:hover,.notif-btn[aria-expanded="true"]{background:#fff;border-color:#bfd0dc;box-shadow:0 8px 20px rgba(31,55,75,.08);color:#254f6a}
.notif-count{position:absolute;top:-5px;right:-6px;min-width:19px;height:19px;padding:0 4px;border-radius:999px;background:#de4e56;border:2px solid #fff;color:#fff;display:grid;place-items:center;font-size:9px;line-height:1;font-weight:900}
.notif-dropdown{display:none;position:absolute;right:0;top:54px;width:320px;max-width:calc(100vw - 32px);background:#fff;border:1px solid #e5dfd0;border-radius:14px;box-shadow:0 24px 60px rgba(24,18,6,.20);padding:8px;z-index:70;max-height:420px;overflow:auto}
.notif-dropdown.open{display:block;animation:accountRise .17s cubic-bezier(.2,.8,.3,1)}
.notif-dropdown .notif-head{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-bottom:1px solid #eee8dc;margin-bottom:5px}
.notif-dropdown .notif-head b{font-size:13px}
.notif-dropdown .notif-head span{display:flex;align-items:center;gap:8px;font-size:11px;color:#8b7440;font-weight:800}
.notif-dropdown .notif-head form{margin:0}.notif-dropdown .notif-head button{border:0;background:transparent;color:#a64444;font-size:11px;font-weight:850;cursor:pointer;padding:3px 0}
.notif-entry{display:grid;grid-template-columns:minmax(0,1fr) 28px;align-items:stretch;gap:2px}.notif-entry>form{margin:0;display:grid;place-items:center}.notif-entry>form button{width:25px;height:25px;border:0;border-radius:7px;background:transparent;color:#a36d6d;font-size:18px;line-height:1;cursor:pointer}.notif-entry>form button:hover{background:#fff0f0;color:#b63838}
.notif-item{display:block;padding:10px 11px;border-radius:9px;transition:.15s ease}
.notif-item:hover{background:#f7f4ec}
.notif-item b{display:block;font-size:12.5px;font-weight:750;color:#222}
.notif-item span{display:block;font-size:11px;color:#888;margin-top:2px}
.notif-item.is-unread{background:#fdf8ec}
.notif-item.is-unread b{font-weight:850}
.notif-empty{padding:18px 11px;text-align:center;font-size:12.5px;color:#888}
.notif-viewall{display:block;text-align:center;padding:10px 11px;border-radius:9px;font-size:12.5px;font-weight:800;color:#8b7440;border-top:1px solid #eee8dc;margin-top:5px}
.notif-viewall:hover{background:#f7f4ec}
@media(max-width:900px){.account-menu{margin-left:auto}.notif-menu{margin-left:auto}.notif-menu~.account-menu{margin-left:0}.mobile-toggle{margin-left:0}}
.flash-stack{position:fixed;right:18px;top:112px;z-index:200;width:min(420px,calc(100% - 36px));display:grid;gap:9px}
.flash{background:#fff;border-left:4px solid #ddc072;border-radius:12px;padding:14px 16px;box-shadow:0 16px 54px rgba(0,0,0,.22),0 4px 14px rgba(0,0,0,.10);display:flex;align-items:flex-start;justify-content:space-between;gap:12px;font-size:14px;line-height:1.5;animation:flashSlideIn .22s cubic-bezier(.2,.8,.3,1)}
@keyframes flashSlideIn{from{opacity:0;transform:translateX(20px)}to{opacity:1;transform:none}}
.flash-success{border-color:#438262}
.flash-error{border-color:#b43d3d}
.flash button{border:0;background:none;cursor:pointer;font-size:20px;line-height:1;color:#999;transition:.15s;padding:0 2px;flex:0 0 auto}
.flash button:hover{color:#333}

/* keep chrome typography identical on every page */
.navbar,.mobile-menu,.footer,.auth-backdrop{font-family:Inter,Arial,sans-serif}

/* learner workspace: two column layout with the shared account sidebar
   (used by My Account and the Payment Center) */
.layout{display:grid;grid-template-columns:245px 1fr;gap:22px;align-items:start}
.side{background:#fff;border:1px solid #e5e7eb;border-radius:17px;padding:12px;height:max-content;position:sticky;top:106px;display:grid;gap:6px;font-family:Inter,Arial,sans-serif}
.side a,.side button{display:block;width:100%;border:0;background:#fff;padding:12px;text-align:left;border-radius:9px;font-weight:800;font-size:15px;color:#444;cursor:pointer;transition:background .18s,color .18s}
.side a.active,.side a:hover,.side button.active,.side button:hover{background:var(--shell-gold);color:#111}
@media(max-width:800px){.layout{grid-template-columns:1fr}.layout>*{min-width:0}.side{position:static;overflow:visible}.side a,.side button{min-width:0}}

/* the way back into a live class, from wherever the learner wandered to */
.roam-player{position:fixed;right:20px;bottom:20px;width:min(330px,calc(100vw - 32px));background:#fff;border:1px solid #e5dfd0;border-radius:16px;box-shadow:0 24px 70px rgba(0,0,0,.28);overflow:hidden;z-index:90;animation:roamIn .3s cubic-bezier(.22,.61,.36,1)}
.roam-close{border:0;background:#111;color:#fff;width:26px;height:26px;border-radius:50%;font-size:17px;line-height:1;cursor:pointer;flex:none}
.roam-live{display:flex;align-items:center;gap:11px;padding:12px 13px}
.roam-live b{display:block;font-size:13px}
.roam-live small{color:#777;font-size:11px}
.roam-dot{width:9px;height:9px;border-radius:50%;background:#d72626;flex:none;box-shadow:0 0 0 4px rgba(215,38,38,.15)}
.roam-btn{background:#ddc072;color:#111;border-radius:9px;padding:8px 12px;font-size:12px;font-weight:800}
@keyframes roamIn{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@media(max-width:560px){.roam-player{right:10px;bottom:10px;width:calc(100vw - 20px)}}

/* Partner marks in the shared top bar. Keep the original IIGJ mark first,
   followed by the supplied IITM, InCent-LGD and GJEPC artwork. */
.navbar{height:88px}
.nav-inner{gap:24px}
.logos{gap:11px;align-items:center;min-width:0;flex:0 1 auto}
.logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:62px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.iigj-logo{height:54px;max-width:158px}
.iitm-logo{height:54px;width:54px;max-width:54px;object-fit:contain}
.partner-logo{display:block;width:auto;height:auto;max-height:54px;object-fit:contain}
.partner-logo-icflgd{width:126px}.partner-logo-icflgd .partner-logo{width:126px}
.partner-logo-gjepc{width:148px}.partner-logo-gjepc .partner-logo{width:148px}
.navbar.scrolled{height:70px}
.navbar.scrolled .logo-img-wrap,.navbar.scrolled .iitm-logo-wrap,.navbar.scrolled .partner-logo-wrap{height:48px}
.navbar.scrolled .iigj-logo{height:43px;max-width:137px}
.navbar.scrolled .iitm-logo{height:42px;width:42px;max-width:42px}
.navbar.scrolled .partner-logo{max-height:42px}
.navbar.scrolled .partner-logo-icflgd,.navbar.scrolled .partner-logo-icflgd .partner-logo{width:104px}
.navbar.scrolled .partner-logo-gjepc,.navbar.scrolled .partner-logo-gjepc .partner-logo{width:122px}
@media(max-width:1200px){
  .navbar{height:82px}.nav-inner{gap:18px}.logos{gap:8px}
  .logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:58px}
  .iigj-logo{height:49px;max-width:143px}.iitm-logo{height:48px;width:48px;max-width:48px}
  .partner-logo{max-height:48px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:108px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:128px}
}
@media(max-width:900px){
  .navbar{height:76px}.mobile-menu{top:76px}.logos{gap:7px}
  .logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:52px}
  .iigj-logo{height:43px;max-width:126px}.iitm-logo{height:43px;width:43px;max-width:43px}
  .partner-logo{max-height:43px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:92px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:108px}
  .navbar.scrolled{height:66px}.navbar.scrolled + .mobile-menu{top:66px}
}
@media(max-width:560px){
  .navbar{height:68px}.mobile-menu{top:68px}.nav-inner{gap:10px}.logos{gap:5px}
  .logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:46px}
  .iigj-logo{height:36px;max-width:105px}.iitm-logo{height:36px;width:36px;max-width:36px}
  .partner-logo{max-height:36px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:73px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:87px}
  .navbar.scrolled{height:60px}.navbar.scrolled + .mobile-menu{top:60px}
  .navbar.scrolled .logo-img-wrap,.navbar.scrolled .iitm-logo-wrap,.navbar.scrolled .partner-logo-wrap{height:40px}
  .navbar.scrolled .iigj-logo{height:31px;max-width:91px}.navbar.scrolled .iitm-logo{height:31px;width:31px;max-width:31px}
  .navbar.scrolled .partner-logo{max-height:31px}.navbar.scrolled .partner-logo-icflgd,.navbar.scrolled .partner-logo-icflgd .partner-logo{width:63px}.navbar.scrolled .partner-logo-gjepc,.navbar.scrolled .partner-logo-gjepc .partner-logo{width:75px}
}
@media(max-width:380px){
  .nav-inner{gap:7px}.logos{gap:3px}.iigj-logo{height:32px;max-width:94px}.iitm-logo{height:32px;width:32px;max-width:32px}
  .partner-logo{max-height:32px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:64px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:76px}
}

/* Compact action controls on phone and tablet widths. The three circular
   controls share one size so the bell, profile and menu stay balanced beside
   the partner marks without crowding or clipping each other. */
@media(max-width:900px){
  .navbar{height:70px}.mobile-menu{top:70px}.nav-inner{gap:7px}.logos{gap:4px}
  .logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:38px}
  .iigj-logo{height:31px;max-width:92px}.iitm-logo{height:31px;width:31px;max-width:31px}
  .partner-logo{max-height:31px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:61px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:72px}
  .notif-btn,.account-btn,.mobile-toggle{width:36px;height:36px}
  .notif-btn{font-size:15px}.notif-btn i{font-size:16px}.account-btn{font-size:16px}.mobile-toggle{font-size:18px}
  .notif-count{top:-6px;right:-7px;min-width:18px;height:18px;padding:0 3px;font-size:8px}
  .notif-dropdown{position:fixed;top:78px;left:12px;right:12px;width:auto;max-width:none;max-height:calc(100dvh - 92px);z-index:90}
  .account-dropdown{top:46px}
}
@media(max-width:560px){
  .navbar{height:62px}.mobile-menu{top:62px}.nav-inner{gap:5px}.logos{gap:3px}
  .logo-img-wrap,.iitm-logo-wrap,.partner-logo-wrap{height:40px}
  .iigj-logo{height:31px;max-width:90px}.iitm-logo{height:31px;width:31px;max-width:31px}
  .partner-logo{max-height:31px}.partner-logo-icflgd,.partner-logo-icflgd .partner-logo{width:58px}.partner-logo-gjepc,.partner-logo-gjepc .partner-logo{width:68px}
  .notif-btn,.account-btn,.mobile-toggle{width:32px;height:32px}
  .notif-btn{font-size:14px}.notif-btn i{font-size:15px}.account-btn{font-size:15px}.mobile-toggle{font-size:16px}
  .notif-count{top:-6px;right:-8px;min-width:17px;height:17px;font-size:8px}
  .notif-dropdown{top:68px;left:8px;right:8px;max-height:calc(100dvh - 78px)}
  .account-dropdown{top:42px}
}

/* A flex logo group does not follow text-align. Centre the actual logo/text
   row on phones so the footer mark and every column line up on the viewport. */
@media(max-width:560px){
  .footer-grid{justify-items:center}
  .footer-grid>div{width:100%;text-align:center}
  .footer-col-last{grid-column:auto}
  .footer-logo-stack{width:100%;justify-content:center!important;align-items:center!important;text-align:center}
  .footer-logo-stack>a,.footer-logo-stack>div{justify-content:center!important;align-items:center!important}
  .footer-logo-text{display:block;text-align:center}
  .footer h4,.footer p{margin-left:auto;margin-right:auto}
}

/* Footer content is data-driven: with the brand, Follow Us and Contact visible it
   forms three equal, deliberate columns instead of leaving space for hidden cards. */
.footer-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));align-items:start;gap:clamp(28px,4vw,62px)}
.footer-logo-column,.footer-social,.footer-link-column{order:var(--footer-layout-order,0)}
.footer-bottom{position:relative;border-top:0}
.footer-bottom:before{content:"";position:absolute;top:0;left:50%;width:100vw;height:1px;transform:translateX(-50%);background:#cfd5da}
.footer-col-last{grid-column:auto}
.footer-social{display:flex;align-items:center;gap:14px}
.footer-social h4,.footer-link-column h4{color:var(--footer-social-title-color,#111);font-family:var(--footer-social-title-font,inherit);font-size:var(--footer-social-title-desktop,20px);font-weight:var(--footer-social-title-weight,700);font-style:var(--footer-social-title-style,normal);margin:0;white-space:nowrap;flex:0 0 auto}
.footer-social-links{display:flex;flex-wrap:nowrap;align-items:center;gap:10px}
.footer-social-link{display:inline-grid!important;place-items:center;width:42px;height:42px;border:1px solid color-mix(in srgb,var(--footer-social-icon-color,#4d545a) 30%,transparent);border-radius:50%;color:var(--footer-social-icon-color,#4d545a)!important;font-size:var(--footer-social-icon-desktop,21px)!important;line-height:1;text-decoration:none;transition:color .18s ease,border-color .18s ease,background .18s ease,transform .18s ease}
.footer-social-link:hover,.footer-social-link:focus-visible{color:var(--footer-social-icon-hover,#8d742f)!important;border-color:var(--footer-social-icon-hover,#8d742f);background:color-mix(in srgb,var(--footer-social-icon-hover,#8d742f) 11%,transparent);transform:translateY(-2px);text-decoration:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.footer-social h4,.footer-link-column h4{font-size:var(--footer-social-title-tablet,var(--footer-social-title-desktop,20px))}.footer-social-link{font-size:var(--footer-social-icon-tablet,var(--footer-social-icon-desktop,21px))!important}}
@media(min-width:901px){.footer-grid{grid-template-columns:minmax(230px,1.15fr) minmax(400px,1.55fr) minmax(220px,1fr);align-items:center}.footer-link-column{justify-self:end}}
@media(max-width:560px){.footer-grid{grid-template-columns:1fr}.footer-social{width:100%;flex-direction:column;align-items:center;gap:10px;text-align:center}.footer-social-links{justify-content:center;flex-wrap:wrap}.footer-social h4,.footer-link-column h4{font-size:var(--footer-social-title-mobile,var(--footer-social-title-tablet,20px))}.footer-social-link{font-size:var(--footer-social-icon-mobile,var(--footer-social-icon-tablet,21px))!important}.footer-bottom>span:first-child{order:2}.footer-bottom>span:last-child{order:1}}

/* Shared header: readable partner marks, including the scrolled state. */
.navbar,.navbar.scrolled{height:100px}
.navbar .nav-inner{gap:18px}
.navbar .logos{gap:14px;flex-shrink:0;align-items:center}
.navbar .logos > div{height:76px;padding:0;background:transparent}
.navbar .logos .iigj-logo{height:66px;width:auto;max-width:174px;object-fit:contain}
.navbar .logos .iitm-logo{height:66px;width:66px;max-width:66px;object-fit:contain}
.navbar .logos .partner-logo{height:auto;max-height:66px;object-fit:contain}
.navbar .logos .partner-logo-icflgd,.navbar .logos .partner-logo-icflgd .partner-logo{width:146px}
.navbar .logos .partner-logo-gjepc,.navbar .logos .partner-logo-gjepc .partner-logo{width:168px}
@media(max-width:1200px){
  .navbar,.navbar.scrolled{height:88px}
  .navbar .menu{display:none}
  .navbar .mobile-toggle{display:block}
  .navbar + .mobile-menu{position:fixed;left:0;right:0;background:#fff;border-bottom:1px solid #ddd;z-index:49;padding:14px 16px;box-shadow:0 15px 35px rgba(0,0,0,.1)}
  .navbar + .mobile-menu.open{display:grid}
  .navbar + .mobile-menu a,.navbar + .mobile-menu button{padding:13px;text-align:left;border:0;background:#fff;font-weight:800}
  .navbar .logos{gap:10px;margin-right:auto}
  .navbar .logos > div{height:66px}
  .navbar .logos .iigj-logo{height:56px;max-width:146px}
  .navbar .logos .iitm-logo{height:56px;width:56px;max-width:56px}
  .navbar .logos .partner-logo{max-height:56px}
  .navbar .logos .partner-logo-icflgd,.navbar .logos .partner-logo-icflgd .partner-logo{width:122px}
  .navbar .logos .partner-logo-gjepc,.navbar .logos .partner-logo-gjepc .partner-logo{width:142px}
  .navbar + .mobile-menu,.navbar.scrolled + .mobile-menu{top:88px}
  .navbar .notif-dropdown{top:94px}
}
@media(max-width:700px){
  .navbar,.navbar.scrolled{height:120px}
  .navbar .nav-inner{width:calc(100% - 24px);flex-wrap:wrap;align-content:center;justify-content:flex-end;gap:6px 10px}
  .navbar .logos{flex:0 0 100%;width:100%;display:grid;grid-template-columns:1.1fr .65fr 1.25fr 1.45fr;gap:8px;margin:0}
  .navbar .logos > div{height:60px;min-width:0;width:100%}
  .navbar .logos .iigj-logo,.navbar .logos .iitm-logo,.navbar .logos .partner-logo{width:100%;max-width:100%;height:52px;max-height:52px;object-fit:contain}
  .navbar .logos .partner-logo-icflgd,.navbar .logos .partner-logo-gjepc,.navbar .logos .partner-logo-icflgd .partner-logo,.navbar .logos .partner-logo-gjepc .partner-logo{width:100%}
  .navbar .mobile-toggle{margin-left:0}
  .navbar .notif-btn,.navbar .account-btn,.navbar .mobile-toggle{width:36px;height:36px}
  .navbar + .mobile-menu,.navbar.scrolled + .mobile-menu{top:120px}
  .navbar .notif-dropdown{top:126px;max-height:calc(100dvh - 138px)}
}

/* Scroll compaction remains proportional; menus follow the actual header edge. */
.navbar.scrolled{height:82px;top:0}
.navbar.scrolled .logos > div{height:62px}
.navbar.scrolled .logos .iigj-logo{height:54px;max-width:150px}
.navbar.scrolled .logos .iitm-logo{height:54px;width:54px;max-width:54px}
.navbar.scrolled .logos .partner-logo{max-height:54px}
.navbar.scrolled .logos .partner-logo-icflgd,.navbar.scrolled .logos .partner-logo-icflgd .partner-logo{width:124px}
.navbar.scrolled .logos .partner-logo-gjepc,.navbar.scrolled .logos .partner-logo-gjepc .partner-logo{width:144px}
@media(max-width:1200px){
  .navbar.scrolled{height:76px}
  .navbar.scrolled .logos > div{height:56px}
  .navbar.scrolled .logos .iigj-logo{height:48px;max-width:130px}
  .navbar.scrolled .logos .iitm-logo{height:48px;width:48px;max-width:48px}
  .navbar.scrolled .logos .partner-logo{max-height:48px}
  .navbar.scrolled .logos .partner-logo-icflgd,.navbar.scrolled .logos .partner-logo-icflgd .partner-logo{width:108px}
  .navbar.scrolled .logos .partner-logo-gjepc,.navbar.scrolled .logos .partner-logo-gjepc .partner-logo{width:124px}
  .navbar + .mobile-menu,.navbar.scrolled + .mobile-menu{top:var(--site-header-bottom,88px);max-height:calc(100dvh - var(--site-header-bottom,88px));overflow-y:auto}
}
@media(max-width:900px){.navbar .notif-dropdown{top:calc(var(--site-header-bottom,88px) + 6px);max-height:calc(100dvh - var(--site-header-bottom,88px) - 18px)}}
@media(max-width:700px){
  .navbar.scrolled{height:104px}
  .navbar.scrolled .logos > div{height:48px;width:100%}
  .navbar.scrolled .logos .iigj-logo,.navbar.scrolled .logos .iitm-logo,.navbar.scrolled .logos .partner-logo{height:44px;max-height:44px;max-width:100%;width:100%}
  .navbar.scrolled .logos .partner-logo-icflgd,.navbar.scrolled .logos .partner-logo-gjepc,.navbar.scrolled .logos .partner-logo-icflgd .partner-logo,.navbar.scrolled .logos .partner-logo-gjepc .partner-logo{width:100%}
}

/* Give the primary IIGJ mark more of the available brand space. */
.navbar .logos .iigj-logo{height:90px;max-width:210px}
.navbar.scrolled .logos .iigj-logo{height:70px;max-width:178px}
@media(max-width:1200px){
  .navbar .logos .iigj-logo{height:76px;max-width:180px}
  .navbar.scrolled .logos .iigj-logo{height:64px;max-width:160px}
}
@media(max-width:700px){
  .navbar .logos{grid-template-columns:1.65fr .65fr 1.25fr 1.45fr;gap:4px}
  .navbar .logos .iigj-logo{width:100%;max-width:100%;height:60px;max-height:60px}
  .navbar.scrolled .logos .iigj-logo{width:100%;max-width:100%;height:48px;max-height:48px}
}

/* Use the free brand area without allowing it to crowd navigation. */
@media(min-width:1201px){
  .navbar:not(.scrolled){height:112px}
  .navbar:not(.scrolled) .logos > div{height:100px}
  .navbar:not(.scrolled) .logos .iigj-logo{height:100px;max-width:220px}
  .navbar:not(.scrolled) .logos .iitm-logo{height:82px;width:82px;max-width:82px}
  .navbar:not(.scrolled) .logos .partner-logo{max-height:82px}
  .navbar:not(.scrolled) .logos .partner-logo-icflgd,.navbar:not(.scrolled) .logos .partner-logo-icflgd .partner-logo{width:170px}
  .navbar:not(.scrolled) .logos .partner-logo-gjepc,.navbar:not(.scrolled) .logos .partner-logo-gjepc .partner-logo{width:198px}
}
@media(min-width:701px) and (max-width:1200px){
  .navbar:not(.scrolled){height:106px}
  .navbar:not(.scrolled) .logos > div{height:92px}
  .navbar:not(.scrolled) .logos .iigj-logo{height:92px;max-width:206px}
  .navbar:not(.scrolled) .logos .iitm-logo{height:74px;width:74px;max-width:74px}
  .navbar:not(.scrolled) .logos .partner-logo{max-height:74px}
  .navbar:not(.scrolled) .logos .partner-logo-icflgd,.navbar:not(.scrolled) .logos .partner-logo-icflgd .partner-logo{width:148px}
  .navbar:not(.scrolled) .logos .partner-logo-gjepc,.navbar:not(.scrolled) .logos .partner-logo-gjepc .partner-logo{width:170px}
  .navbar .nav-inner{gap:8px}
}
@media(max-width:700px){
  .navbar .nav-inner{width:calc(100% - 12px)}
  .navbar .logos{gap:1px}
  .navbar:not(.scrolled) .logos .iigj-logo{height:66px;max-height:66px}
  .navbar:not(.scrolled) .logos .iitm-logo,.navbar:not(.scrolled) .logos .partner-logo{height:60px;max-height:60px}
}

/* Fill the existing compact header; do not increase its height. */
@media(min-width:701px){
  .navbar.scrolled .logos > div{height:68px}
  .navbar.scrolled .logos .iigj-logo{height:72px;max-width:180px}
  .navbar.scrolled .logos .iitm-logo{height:66px;width:66px;max-width:66px}
  .navbar.scrolled .logos .partner-logo{max-height:66px}
  .navbar.scrolled .logos .partner-logo-icflgd,.navbar.scrolled .logos .partner-logo-icflgd .partner-logo{width:132px}
  .navbar.scrolled .logos .partner-logo-gjepc,.navbar.scrolled .logos .partner-logo-gjepc .partner-logo{width:152px}
}
@media(max-width:700px){
  .navbar.scrolled .logos > div{height:54px}
  .navbar.scrolled .logos{grid-template-columns:2.45fr .58fr 1.12fr 1.25fr;gap:0}
  .navbar.scrolled .logos .iigj-logo{height:60px;max-height:60px}
  .navbar.scrolled .logos .iitm-logo,.navbar.scrolled .logos .partner-logo{height:54px;max-height:54px}
}

/* Keep the header on a single row on phones and portrait tablets: the four
   brand marks share the row with the notification/profile/menu icons instead
   of wrapping onto a second line. !important is needed because several of
   the older per-breakpoint rules above (including :not(.scrolled) variants)
   out-specificity a plain override here. The scrolled state stays visibly
   smaller than the resting state so the shrink-on-scroll effect survives. */
@media(max-width:700px){
  .navbar{height:68px!important}
  .navbar.scrolled{height:54px!important}
  .navbar .nav-inner{flex-wrap:nowrap!important;justify-content:flex-start!important;gap:5px!important}
  .navbar .logos{display:flex!important;flex:1 1 auto;width:auto!important;min-width:0;gap:4px!important;margin:0}
  .navbar .logos>div{width:auto!important;min-width:0;flex:0 1 auto;display:flex;align-items:center}
  .navbar .logos img{width:100%!important;height:100%!important;max-width:none!important;max-height:none!important;object-fit:contain!important}
  .navbar:not(.scrolled) .logos>div{height:40px!important}
  .navbar:not(.scrolled) .logos .logo-img-wrap{flex-basis:86px}
  .navbar:not(.scrolled) .logos .iitm-logo-wrap{flex-basis:38px}
  .navbar:not(.scrolled) .logos .partner-logo-icflgd{flex-basis:62px}
  .navbar:not(.scrolled) .logos .partner-logo-gjepc{flex-basis:74px}
  .navbar.scrolled .logos>div{height:32px!important}
  .navbar.scrolled .logos .logo-img-wrap{flex-basis:70px}
  .navbar.scrolled .logos .iitm-logo-wrap{flex-basis:32px}
  .navbar.scrolled .logos .partner-logo-icflgd{flex-basis:52px}
  .navbar.scrolled .logos .partner-logo-gjepc{flex-basis:62px}
  .navbar .notif-btn,.navbar .account-btn,.navbar .mobile-toggle{width:32px!important;height:32px!important;font-size:14px!important}
  .navbar .notif-btn i{font-size:14px!important}
  .navbar+.mobile-menu{top:68px!important}
  .navbar.scrolled+.mobile-menu{top:54px!important}
  .navbar:not(.scrolled) .notif-dropdown{top:74px!important;max-height:calc(100dvh - 86px)!important}
  .navbar.scrolled .notif-dropdown{top:60px!important;max-height:calc(100dvh - 72px)!important}
}
@media(max-width:340px){
  .navbar:not(.scrolled) .logos .logo-img-wrap{flex-basis:70px}
  .navbar:not(.scrolled) .logos .iitm-logo-wrap{flex-basis:32px}
  .navbar:not(.scrolled) .logos .partner-logo-icflgd{flex-basis:52px}
  .navbar:not(.scrolled) .logos .partner-logo-gjepc{flex-basis:62px}
  .navbar.scrolled .logos .logo-img-wrap{flex-basis:54px}
  .navbar.scrolled .logos .iitm-logo-wrap{flex-basis:26px}
  .navbar.scrolled .logos .partner-logo-icflgd{flex-basis:42px}
  .navbar.scrolled .logos .partner-logo-gjepc{flex-basis:50px}
  .navbar .notif-btn,.navbar .account-btn,.navbar .mobile-toggle{width:28px!important;height:28px!important}
}
@media(min-width:701px){
  .navbar.scrolled .logos > div{height:72px}
  .navbar.scrolled .logos .iigj-logo{height:80px;max-width:200px}
}
@media(min-width:701px) and (max-width:1200px){
  .navbar.scrolled .logos > div{height:68px}
  .navbar.scrolled .logos .iigj-logo{height:72px;max-width:180px}
}

/* Shared page width: keep navigation and page content aligned across the site.
   These dimensions override legacy per-page container widths, including inline
   max-widths. Card padding and full-bleed image slides remain independent. */
:root{--site-content-max:1600px;--site-gutter:32px}
@media(max-width:1200px){:root{--site-gutter:24px}}
@media(max-width:720px){:root{--site-gutter:16px}}
@media(max-width:560px){:root{--site-gutter:12px}}
body .container,body .cms-wrap{
  width:min(var(--site-content-max),calc(100% - var(--site-gutter) * 2))!important;
  max-width:var(--site-content-max)!important;
  margin-left:auto;
  margin-right:auto;
}
body .cms-wrap,body .lead-public-shell{padding-left:0;padding-right:0}
body .banner.hero-image-only .banner-inner{width:100%!important;max-width:none!important}

/* Keep the drawer control square even when partner logos consume the row. */
.navbar .mobile-toggle{flex:0 0 auto;box-sizing:border-box;aspect-ratio:1;padding:0;min-width:0;min-height:0;line-height:1;border-radius:4px;appearance:none;align-items:center;justify-content:center;cursor:pointer}
.navbar .mobile-toggle svg{display:block;width:18px;height:18px;flex:none}
@media(max-width:1200px){.navbar .mobile-toggle{display:flex}}

/* Top bar at its normal (not scrolled) size: the four logos a little smaller, on every screen size. */
.navbar:not(.scrolled) .logos{zoom:.8}
@media(min-width:901px){.navbar:not(.scrolled){height:96px}}
@media(min-width:561px) and (max-width:900px){.navbar:not(.scrolled){height:80px}.navbar:not(.scrolled)+.mobile-menu{top:80px}}
@media(max-width:560px){.navbar:not(.scrolled) .logos{zoom:.88}}
/* Scrolled: smaller again than the normal top bar. */
.navbar.scrolled .logos{zoom:.75}
@media(min-width:561px){.navbar.scrolled{height:72px}.navbar.scrolled+.mobile-menu{top:72px}}
@media(max-width:560px){.navbar.scrolled .logos{zoom:.85}}

/* Small windows: the footer icons wrap instead of pushing the page wider, and the tablet-size logos fit inside the bar. */
.footer-social,.footer-social-links{min-width:0;max-width:100%}
.footer-social-links{flex-wrap:wrap}
@media(min-width:561px) and (max-width:900px){.navbar:not(.scrolled) .logos{zoom:.66}.navbar.scrolled .logos{zoom:.58}}