/* MG Skills and Training design system. Colours, type and spacing are defined once here and used by the
   public site, the learner portal and the staff back end. These colours are design proposals: change them here. */
:root{
  --mg-blue:#123C73;--mg-blue-deep:#0B2345;--mg-orange:#F28C00;--mg-orange-dark:#B35F00;--mg-red:#D93832;--mg-red-dark:#B3261F;--mg-white:#FFFFFF;
  --mg-bg:#F5F7FA;--mg-text:#172033;--mg-muted:#5D6879;--mg-border:#DDE3EB;--mg-blue-tint:#E8EEF6;--mg-orange-tint:#FFF3E0;--mg-red-tint:#FCEBEA;--mg-green:#1C6B3C;--mg-green-tint:#E5F4EA;
  --mg-font:Inter,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mg-radius:10px;--mg-radius-lg:14px;--mg-shadow:0 1px 2px rgba(11,35,69,.05),0 6px 20px rgba(11,35,69,.06);
  --mg-header-height:100px;--mg-zoom:1;--mg-gutter:clamp(20px,calc(3.125vw / var(--mg-zoom)),80px); /* side margin: content is 1500px wide on a 1600px screen and keeps filling larger ones */
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
/* Large monitors: scale the whole site up so it fills the screen in proportion. */
/* zoom also enlarges vw units, so anything sized in vw divides by --mg-zoom to stay true to the screen. */
@media (min-width:1920px){:root{zoom:1.12;--mg-zoom:1.12}}
@media (min-width:2400px){:root{zoom:1.35;--mg-zoom:1.35}}
@media (min-width:3200px){:root{zoom:1.8;--mg-zoom:1.8}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;font-family:var(--mg-font);font-size:16px;line-height:1.6;color:var(--mg-text);background:var(--mg-bg);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,video{max-width:100%;display:block}
a{color:var(--mg-blue)}
a:hover{color:var(--mg-orange-dark)}
h1,h2,h3,h4{color:var(--mg-blue-deep);line-height:1.2;letter-spacing:-.015em;margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(30px,4.4vw,48px)}
h2{font-size:clamp(24px,3vw,32px)}
h3{font-size:19px}
p{margin:0 0 1em}
:focus-visible{outline:3px solid var(--mg-orange);outline-offset:2px;border-radius:4px}
.mg-icon{flex:none;vertical-align:-4px}
.mg-container{width:100%;margin:0;padding:0 var(--mg-gutter)}
.mg-skip{position:absolute;left:-9999px;top:0;background:#fff;padding:10px 16px;z-index:100}
.mg-skip:focus{left:8px;top:8px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mg-muted{color:var(--mg-muted)}
.mg-small{font-size:14px}

/* Buttons: orange for the main action, blue outline for the second. Dark text on orange keeps contrast readable. */
.mg-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:10px 20px;border-radius:var(--mg-radius);border:2px solid var(--mg-orange);background:var(--mg-orange);color:var(--mg-blue-deep);font:inherit;font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;transition:background .15s,border-color .15s,color .15s}
.mg-btn:hover{background:#D97E00;border-color:#D97E00;color:var(--mg-blue-deep)}
.mg-btn-outline{background:#fff;border-color:var(--mg-blue);color:var(--mg-blue)}
.mg-btn-outline:hover{background:var(--mg-blue);border-color:var(--mg-blue);color:#fff}
.mg-btn-light{background:transparent;border-color:#fff;color:#fff}
.mg-btn-light:hover{background:#fff;border-color:#fff;color:var(--mg-blue-deep)}
.mg-btn-danger{background:#fff;border-color:var(--mg-red-dark);color:var(--mg-red-dark)}
.mg-btn-danger:hover{background:var(--mg-red-dark);color:#fff;border-color:var(--mg-red-dark)}
.mg-btn-small{min-height:38px;padding:6px 14px;font-size:14px}
.mg-btn[disabled]{opacity:.55;cursor:not-allowed}
.mg-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}

/* Header */
.mg-demo-bar{background:var(--mg-red-dark);color:#fff;text-align:center;font-size:14px;font-weight:600;padding:6px 12px}
.mg-header{position:sticky;top:0;z-index:40;background:#fff;box-shadow:0 1px 0 var(--mg-border)}
/* Three columns with equal sides, so the menu sits exactly in the middle of the page. */
.mg-header-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:20px;height:var(--mg-header-height)}
.mg-logo{display:flex;align-items:center;justify-self:start;text-decoration:none}
.mg-logo img{height:78px;width:auto}
.mg-nav{display:flex;align-items:center;gap:4px}
.mg-nav a{padding:10px 14px;border-radius:8px;color:var(--mg-blue-deep);text-decoration:none;font-weight:600;font-size:17px;white-space:nowrap}
.mg-nav a:hover{background:var(--mg-blue-tint);color:var(--mg-blue-deep)}
.mg-nav a.active{color:var(--mg-orange-dark);box-shadow:inset 0 -3px 0 var(--mg-orange)}
.mg-header-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}
.mg-header .mg-btn{min-height:46px;font-size:15px;padding:8px 18px}
.mg-header .mg-btn-outline{background:#fff;border-color:var(--mg-blue);color:var(--mg-blue)}
.mg-header .mg-btn-outline:hover{background:var(--mg-blue);border-color:var(--mg-blue);color:#fff}
.mg-nav-toggle{display:none;background:#fff;border:1px solid var(--mg-border);border-radius:8px;width:48px;height:48px;color:var(--mg-blue-deep);cursor:pointer;align-items:center;justify-content:center}
.mg-nav-mobile-actions{display:none}
@media (max-width:1440px){
  .mg-nav a{font-size:15px;padding:10px}
  .mg-header .mg-btn{font-size:14px;padding:8px 14px}
}
@media (max-width:1180px){
  :root{--mg-header-height:88px}
  .mg-logo img{height:68px}
  .mg-header-inner{grid-template-columns:auto 1fr}
  .mg-nav-toggle{display:inline-flex;justify-self:end}
  .mg-header-actions{display:none}
  .mg-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;box-shadow:var(--mg-shadow);flex-direction:column;align-items:stretch;padding:10px 20px 18px;gap:2px}
  .mg-nav.open{display:flex}
  .mg-nav a{padding:13px 12px;font-size:16px}
  .mg-nav a.active{box-shadow:inset 3px 0 0 var(--mg-orange)}
  .mg-nav-mobile-actions{display:flex;flex-direction:column;gap:10px;margin-top:10px}
  .mg-nav-mobile-actions a.mg-btn{color:var(--mg-blue-deep)}
  .mg-nav-mobile-actions a.mg-btn:hover{background:#D97E00;color:var(--mg-blue-deep)}
  .mg-nav-mobile-actions a.mg-btn-outline{color:var(--mg-blue)}
  .mg-nav-mobile-actions a.mg-btn-outline:hover{background:var(--mg-blue);color:#fff}
}

/* Heroes: inner pages are deep blue. On the home hero, the client's video fills the section and fades gradually into deep blue behind the text. */
.mg-hero{position:relative;background:var(--mg-blue-deep);color:#fff;overflow:hidden}
.mg-hero h1{color:#fff}
.mg-hero p{color:rgba(255,255,255,.88)}
.mg-eyebrow{display:inline-block;font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--mg-orange-dark);margin-bottom:10px}
.mg-hero .mg-eyebrow{color:#FFC266}
.mg-page-hero{padding:48px 0 44px;border-bottom:4px solid var(--mg-orange)}
.mg-page-hero h1{margin-bottom:.3em;font-size:clamp(28px,3.6vw,40px)}
.mg-page-hero p{font-size:18px;margin:0}
.mg-page-hero .mg-breadcrumbs{font-size:14px;margin-bottom:12px;color:rgba(255,255,255,.75)}
.mg-page-hero .mg-breadcrumbs a{color:#fff}
.mg-home-hero{min-height:max(560px,calc(100svh / var(--mg-zoom) - var(--mg-header-height)));display:flex;align-items:center;background:var(--mg-blue-deep);color:#fff;border-bottom:4px solid var(--mg-orange)} /* fills the first screen below the header */
.mg-home-hero-media{position:absolute;inset:0}
.mg-home-hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#0B2345 0%,#0B2345 28%,rgba(11,35,69,.93) 36%,rgba(11,35,69,.75) 44%,rgba(11,35,69,.5) 52%,rgba(11,35,69,.27) 60%,rgba(11,35,69,.11) 68%,rgba(11,35,69,.03) 76%,rgba(11,35,69,0) 82%)}
.mg-home-hero video,.mg-home-hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.mg-home-hero>.mg-container{position:relative;z-index:2;padding-top:48px;padding-bottom:48px}
.mg-home-hero-text{max-width:calc(44vw / var(--mg-zoom) - var(--mg-gutter))}
.mg-home-hero h1{color:#fff;text-wrap:balance}
.mg-home-hero-text p{font-size:18px;font-weight:500;color:#fff}
.mg-home-hero .mg-btn-white{background:#fff;border-color:#fff;color:var(--mg-blue-deep)}
.mg-home-hero .mg-btn-white:hover{background:var(--mg-blue-deep);border-color:var(--mg-blue-deep);color:#fff}
.mg-home-hero .mg-eyebrow{font-size:15px;color:#fff}
.mg-hero-points{list-style:none;padding:0;margin:26px 0 0;display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15px;font-weight:600;color:#fff}
.mg-hero-points li{display:flex;align-items:center;gap:8px}
.mg-hero-points .mg-icon{color:#fff}
/* Smaller screens: text on solid blue with the video underneath, so the two never overlap. */
@media (max-width:1100px){
  .mg-home-hero{flex-direction:column;align-items:stretch}
  .mg-home-hero-text{max-width:none}
  .mg-home-hero>.mg-container{flex:none}
  .mg-home-hero-media::after{background:linear-gradient(180deg,#0B2345 0%,rgba(11,35,69,.72) 22%,rgba(11,35,69,.38) 45%,rgba(11,35,69,.12) 68%,rgba(11,35,69,0) 88%)}
  .mg-home-hero-media{position:relative;inset:auto;order:2;flex:1 1 auto;width:100%;margin-top:-1px;aspect-ratio:16/7;overflow:hidden}
}
@media (max-width:620px){
  .mg-home-hero-media{aspect-ratio:16/9}
}

/* Sections, cards and grids */
.mg-section{padding:60px 0}
/* No double gap when the page above already ends with the same background. */
main>.mg-section:not(.mg-section-white)+.mg-why,.mg-portal+.mg-why{padding-top:0}
.mg-section-white{background:#fff;border-top:1px solid var(--mg-border);border-bottom:1px solid var(--mg-border)}
.mg-section-head{margin-bottom:30px}
.mg-section-head p{color:var(--mg-muted);font-size:17px;margin:0}
.mg-grid{display:grid;gap:22px;grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.mg-grid-3{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.mg-card{background:#fff;border:1px solid var(--mg-border);border-radius:var(--mg-radius-lg);padding:24px;box-shadow:var(--mg-shadow)}
.mg-card>:last-child{margin-bottom:0}
.mg-card h2{font-size:21px}
.mg-feature .mg-icon{color:var(--mg-orange-dark);width:28px;height:28px;margin-bottom:12px}
.mg-feature p{color:var(--mg-muted);font-size:15px}
.mg-course-card{display:flex;flex-direction:column;padding:0;overflow:hidden;transition:box-shadow .15s,transform .15s}
.mg-course-card:hover{box-shadow:0 10px 30px rgba(11,35,69,.12);transform:translateY(-2px)}
.mg-course-band{background:var(--mg-blue);color:#fff;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px;font-weight:600}
.mg-course-card.is-soon .mg-course-band{background:var(--mg-muted)}
.mg-course-body{padding:20px;display:flex;flex-direction:column;gap:10px;flex:1}
.mg-course-body h3{margin:0;font-size:18px}
.mg-course-body h3 a{color:var(--mg-blue-deep);text-decoration:none}
.mg-course-body h3 a:hover{color:var(--mg-orange-dark)}
.mg-course-body p{margin:0;color:var(--mg-muted);font-size:15px}
.mg-course-meta{list-style:none;padding:0;margin:0;display:grid;gap:4px;font-size:14px;color:var(--mg-muted)}
.mg-course-meta li{display:flex;gap:7px;align-items:center}
.mg-course-meta .mg-icon{width:16px;height:16px;color:var(--mg-blue)}
.mg-course-foot{margin-top:auto;padding-top:8px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mg-price{font-weight:700;color:var(--mg-blue-deep);font-size:15px}
.mg-steps{list-style:none;padding:0;margin:0;display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));counter-reset:step}
.mg-steps li{counter-increment:step;background:#fff;border:1px solid var(--mg-border);border-radius:var(--mg-radius-lg);padding:22px}
.mg-steps li::before{content:counter(step);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--mg-orange);color:var(--mg-blue-deep);font-weight:800;margin-bottom:12px}
.mg-steps h3{font-size:17px;margin-bottom:6px}
.mg-steps p{margin:0;color:var(--mg-muted);font-size:15px}
.mg-cta{background:var(--mg-blue);color:#fff;border-radius:var(--mg-radius-lg);padding:34px;display:flex;flex-wrap:wrap;gap:22px;align-items:center;justify-content:space-between}
.mg-cta h2{color:#fff;margin-bottom:6px}
.mg-cta p{color:rgba(255,255,255,.88);margin:0}
.mg-two{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,1fr);gap:28px;align-items:start}
@media (max-width:900px){.mg-two{grid-template-columns:1fr}}
.mg-sticky{position:sticky;top:calc(var(--mg-header-height) + 20px)}
@media (max-width:900px){.mg-sticky{position:static}}
.mg-prose h2{font-size:23px;margin-top:1.3em}
.mg-prose h2:first-child{margin-top:0}
.mg-prose ul{padding-left:20px;margin:0 0 1em}
.mg-facts{list-style:none;padding:0;margin:0}
.mg-facts li{display:flex;justify-content:space-between;gap:16px;padding:10px 0;border-bottom:1px solid var(--mg-border);font-size:15px}
.mg-facts li:last-child{border-bottom:0}
.mg-facts span:first-child{color:var(--mg-muted)}
.mg-facts span:last-child{font-weight:600;text-align:right}
.mg-filters{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end;margin-bottom:26px}
.mg-filters label{flex:1 1 180px;margin:0}
.mg-faq details{background:#fff;border:1px solid var(--mg-border);border-radius:var(--mg-radius);padding:0 18px;margin-bottom:10px}
.mg-faq summary{cursor:pointer;font-weight:600;padding:15px 0;color:var(--mg-blue-deep)}
.mg-faq details p{color:var(--mg-muted)}

/* Forms */
.mg-form label,.mg-filters label{display:block;font-weight:600;font-size:14px;margin-bottom:16px;color:var(--mg-blue-deep)}
.mg-form input:not([type=checkbox]):not([type=radio]),.mg-form select,.mg-form textarea,.mg-filters input,.mg-filters select{display:block;width:100%;margin-top:6px;min-height:46px;padding:10px 12px;font:inherit;font-weight:400;color:var(--mg-text);background:#fff;border:1px solid #AEB8C6;border-radius:8px}
.mg-form textarea{min-height:110px;resize:vertical}
.mg-form input:focus,.mg-form select:focus,.mg-form textarea:focus,.mg-filters input:focus,.mg-filters select:focus{outline:3px solid rgba(242,140,0,.45);outline-offset:0;border-color:var(--mg-orange-dark)}
.mg-form small{display:block;font-weight:400;color:var(--mg-muted);margin-top:4px}
.mg-filters label{margin-bottom:0}
.mg-filters .mg-btn{min-height:46px}
.mg-check{display:flex!important;gap:10px;align-items:flex-start;font-weight:500!important}
.mg-check input{width:20px;height:20px;margin-top:2px;flex:none;accent-color:var(--mg-orange-dark)}
.mg-form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
@media (max-width:620px){.mg-form-grid{grid-template-columns:1fr}}
.mg-hp{position:absolute;left:-9999px}
.mg-auth .mg-card>*{max-width:560px;margin-left:auto;margin-right:auto}

/* Messages and status pills */
.mg-alert{border:1px solid;border-left-width:4px;border-radius:8px;padding:12px 16px;margin-bottom:18px;font-size:15px}
.mg-alert>:last-child{margin-bottom:0}
.mg-alert-ok{background:var(--mg-green-tint);border-color:var(--mg-green);color:#124A29}
.mg-alert-error{background:var(--mg-red-tint);border-color:var(--mg-red-dark);color:#8A1C16}
.mg-alert-info{background:var(--mg-blue-tint);border-color:var(--mg-blue);color:var(--mg-blue-deep)}
.mg-alert-warn{background:var(--mg-orange-tint);border-color:var(--mg-orange-dark);color:#6B3A00}
.mg-pill{display:inline-block;font-size:13px;font-weight:600;line-height:1.3;border-radius:20px;padding:3px 10px;background:var(--mg-blue-tint);color:var(--mg-blue-deep);white-space:nowrap}
.mg-pill-ok{background:var(--mg-green-tint);color:#124A29}
.mg-pill-warn{background:var(--mg-orange-tint);color:#6B3A00}
.mg-pill-bad{background:var(--mg-red-tint);color:#8A1C16}
.mg-pill-muted{background:#EDF0F4;color:var(--mg-muted)}
.mg-pill-demo{background:var(--mg-red-dark);color:#fff}
.mg-empty{text-align:center;padding:30px 20px;color:var(--mg-muted);background:#fff;border:1px dashed #BCC6D2;border-radius:var(--mg-radius-lg)}
.mg-empty h3{margin-bottom:6px}

/* Footer */
.mg-footer{background:var(--mg-blue-deep);color:rgba(255,255,255,.85);padding:48px 0 0;font-size:15px;border-top:4px solid var(--mg-orange)}
.mg-footer h4{color:#fff;font-size:15px;margin-bottom:12px}
.mg-footer a{color:rgba(255,255,255,.88);text-decoration:none}
.mg-footer a:hover{color:#FFC266;text-decoration:underline}
.mg-footer-grid{display:grid;gap:28px;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));padding-bottom:34px}
.mg-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.mg-footer li{display:flex;gap:8px;align-items:center}
.mg-footer img{height:64px;width:auto;margin-bottom:12px}
.mg-footer-bottom{border-top:1px solid rgba(255,255,255,.15);padding:16px 72px 16px 0;font-size:14px;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:space-between}
.mg-footer-bottom nav{display:flex;flex-wrap:wrap;gap:6px 16px}
.mg-whatsapp{position:fixed;right:18px;bottom:18px;z-index:30;width:54px;height:54px;border-radius:50%;background:#1C6B3C;color:#fff;display:grid;place-items:center;box-shadow:0 8px 20px rgba(11,35,69,.3)}
.mg-whatsapp:hover{background:#124A29;color:#fff}

/* Learner portal */
.mg-portal{display:grid;grid-template-columns:240px minmax(0,1fr);gap:26px;align-items:start;padding-top:28px;padding-bottom:60px}
.mg-portal-nav{background:#fff;border:1px solid var(--mg-border);border-radius:var(--mg-radius-lg);padding:10px;position:sticky;top:calc(var(--mg-header-height) + 20px);box-shadow:var(--mg-shadow)}
.mg-portal-nav a{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:8px;color:var(--mg-blue-deep);text-decoration:none;font-weight:600;font-size:15px}
.mg-portal-nav a:hover{background:var(--mg-blue-tint)}
.mg-portal-nav a.active{background:var(--mg-blue);color:#fff}
.mg-portal-nav .mg-count{margin-left:auto;background:var(--mg-orange);color:var(--mg-blue-deep);font-size:12px;font-weight:800;border-radius:12px;padding:1px 8px}
.mg-portal-nav button{width:100%;display:flex;align-items:center;gap:10px;padding:10px 12px;border:0;background:none;font:inherit;font-weight:600;font-size:15px;color:var(--mg-muted);cursor:pointer;border-radius:8px}
.mg-portal-nav button:hover{background:var(--mg-red-tint);color:var(--mg-red-dark)}
.mg-portal-nav form{margin:6px 0 0;padding-top:6px;border-top:1px solid var(--mg-border)}
.mg-portal h1{font-size:clamp(24px,3vw,30px);margin-bottom:6px}
.mg-portal-head{margin-bottom:20px}
.mg-stack{display:grid;gap:18px}
.mg-next{background:var(--mg-blue);color:#fff;border-radius:var(--mg-radius-lg);padding:22px 24px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.mg-next h2{color:#fff;font-size:20px;margin:0 0 4px}
.mg-next p{margin:0;color:rgba(255,255,255,.88);font-size:15px}
.mg-progress{height:10px;background:#E3E8EF;border-radius:6px;overflow:hidden}
.mg-progress span{display:block;height:100%;background:var(--mg-orange)}
.mg-row{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between}
.mg-list{list-style:none;padding:0;margin:0}
.mg-list>li{padding:12px 0;border-bottom:1px solid var(--mg-border)}
.mg-list>li:last-child{border-bottom:0}
.mg-outline-module{margin-bottom:18px}
.mg-outline-module h3{font-size:16px;margin-bottom:6px}
.mg-item{display:flex;align-items:center;gap:12px;padding:11px 12px;border:1px solid var(--mg-border);border-radius:8px;margin-bottom:6px;background:#fff;text-decoration:none;color:var(--mg-text)}
a.mg-item:hover{border-color:var(--mg-blue);background:var(--mg-blue-tint);color:var(--mg-text)}
.mg-item .mg-icon{color:var(--mg-blue)}
.mg-item.is-done .mg-icon{color:var(--mg-green)}
.mg-item.is-locked{background:#F1F3F6;color:var(--mg-muted)}
.mg-item.is-locked .mg-icon{color:var(--mg-muted)}
.mg-item.is-failed .mg-icon{color:var(--mg-red-dark)}
.mg-item-title{flex:1;min-width:0;font-weight:600;font-size:15px}
.mg-item-title small{display:block;font-weight:400;color:var(--mg-muted);font-size:13px}
.mg-steps-check{list-style:none;padding:0;margin:0}
.mg-steps-check li{display:flex;gap:10px;padding:8px 0;align-items:flex-start;font-size:15px}
.mg-steps-check .mg-icon{margin-top:2px}
.mg-steps-check .ok .mg-icon{color:var(--mg-green)}
.mg-steps-check .no .mg-icon{color:var(--mg-orange-dark)}
.mg-question{padding:18px 0;border-bottom:1px solid var(--mg-border)}
.mg-question:last-of-type{border-bottom:0}
.mg-question fieldset{border:0;padding:0;margin:0}
.mg-question legend{font-weight:600;padding:0;margin-bottom:10px}
.mg-option{display:flex;gap:10px;align-items:flex-start;padding:11px 12px;border:1px solid var(--mg-border);border-radius:8px;margin-bottom:6px;cursor:pointer;font-weight:400;font-size:15px}
.mg-option:hover{background:var(--mg-blue-tint)}
.mg-option input{width:20px;height:20px;flex:none;margin-top:1px;accent-color:var(--mg-blue)}
.mg-option:has(input:checked){border-color:var(--mg-blue);background:var(--mg-blue-tint)}
.mg-video{width:100%;background:#000;border-radius:var(--mg-radius);margin-bottom:12px}
.mg-table-wrap{overflow-x:auto}
.mg-table{width:100%;border-collapse:collapse;font-size:15px}
.mg-table th,.mg-table td{padding:10px 12px;border-bottom:1px solid var(--mg-border);text-align:left;vertical-align:top}
.mg-table th{font-size:13px;color:var(--mg-muted)}
@media (max-width:900px){
  .mg-portal{grid-template-columns:minmax(0,1fr);padding-top:16px}
  .mg-portal-nav{position:relative;display:flex;overflow-x:auto;gap:2px;padding:6px}
  .mg-portal-nav a,.mg-portal-nav button{white-space:nowrap}
  .mg-portal-nav form{margin:0;padding:0;border:0}
}
