/* === EnGiNE Homepage — Moodle Launch CSS === */
/* Version: 2.0 | 2026-03-26 00:30 EST */
/* WCAG 2.0 AA compliant | All rules scoped via .ep / :has(.ep) so
   this file is safe to append to the global Moodle Custom CSS — it
   only fires on pages that include a <div class="ep"> wrapper. */

/* Moodle MB2 builder overrides — scoped to rows containing .ep */
.mb2-pb-row:has(.ep) .mb2-pb-row-inner{padding:0!important;max-width:none!important;width:100%!important}
.mb2-pb-row:has(.ep){--mb-pb-row_pt:0px!important;--mb-pb-row_pb:0px!important;--mb-pb-row-btw:0px!important;--mb-pb-row-bbw:0px!important;--mb-pb-row-btcolor:transparent!important;--mb-pb-row-bbcolor:transparent!important;margin:0!important;padding:0!important;border:none!important;max-width:none!important;width:100%!important}
.section-inner:has(.ep){padding:0!important;max-width:none!important;width:100%!important}
.content-col:has(.ep){padding:0!important;max-width:none!important;width:100%!important}
#region-main:has(.ep){padding:0!important;max-width:none!important}
#page-content:has(.ep){padding:0!important}
div[role="main"]:has(.ep){padding:0!important;max-width:none!important}

/* Hide engine theme chrome on homepage (only when .ep is present) */
body:has(.ep) .top-bar,
body:has(.ep) #main-header,
body:has(.ep) .header-innner,
body:has(.ep) .header-inner2,
body:has(.ep) .master-header,
body:has(.ep) .master-header-inner,
body:has(.ep) .main-navigation-inner,
body:has(.ep) #toggle-sidebar,
body:has(.ep) .tgsdb_btn,
body:has(.ep) #page-header,
body:has(.ep) .page-secnav,
body:has(.ep) .theme-footer,
body:has(.ep) footer.footer,
body:has(.ep) .page-c,
body:has(.ep) .theme-coursenav,
body:has(.ep) .drawer { display: none !important; }

/* CRITICAL: .pagelayout-b has a transform: translateX(280px) that creates
   a new containing block for position:fixed descendants. Unset it so
   .ep can fix to the viewport edges instead of being trapped inside
   the 280px-shifted main-content slot. */
body:has(.ep) .pagelayout-b,
body:has(.ep) .pagelayout,
body:has(.ep) .pagelayout-content,
body:has(.ep) #page,
body:has(.ep) .page-outer {
  transform: none !important;
  margin-left: 0 !important;
  padding: 0 !important;
}

/* Break .ep out of Moodle's flex layout — fullscreen homepage */
body:has(.ep) .ep {
  width: 100vw !important;
  margin-left: 0 !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  z-index: 9999 !important;
  overflow-y: auto !important;
  height: 100vh !important;
}

/* === USER TWEAKS === */
/* Kill the floating animation on the hero card (users found it distracting) */
body:has(.ep) .hero-card,
body:has(.ep) .hc-dot {
  animation: none !important;
  transform: none !important;
}

/* .ca-tag (content area tags) — pill shape, lighter on dark bg,
   larger, mint green icons for highlight */
body:has(.ep) .ca-tag {
  background: rgba(255, 255, 255, 0.12) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 999px !important;
  padding: 12px 22px !important;
  font-size: 0.95rem !important;
  gap: 12px !important;
  transition: none !important;
  cursor: default !important;
}
body:has(.ep) .ca-tag:hover {
  background: rgba(255, 255, 255, 0.18) !important;
  border-color: rgba(255, 255, 255, 0.32) !important;
  transform: none !important;
  box-shadow: none !important;
}
/* Larger mint icon bubble + mint green icon glyph */
body:has(.ep) .ca-tag .ca-ic {
  width: 34px !important;
  height: 34px !important;
  background: rgba(52, 211, 153, 0.12) !important;
  color: #34d399 !important;
}
body:has(.ep) .ca-tag svg {
  color: #34d399 !important;
  stroke: #34d399 !important;
}

/* Section eyebrows (.sl — "Built for Everyone", "Content Areas",
   "Platform Highlights", "Voices from the Field", etc.) — mint green
   so they pair with the teal accent highlights below them. Includes
   the 20×2 "—" line decorator (::before) that sits next to the text. */
body:has(.ep) .sl {
  color: #34d399 !important;
}
body:has(.ep) .sl::before,
body:has(.ep) .sl::after {
  background: #34d399 !important;
  border-color: #34d399 !important;
}

/* Hero starts AFTER the fixed header — use margin-top (not padding-top)
   so the .hero-bg-img also shifts down. padding-top kept the image
   rendering INTO the area under the header.
   SCOPED to the PAGE hero only (<section class="hero"> as direct child
   of .ep) — Moodle's course-widget cards ALSO use .hero as a class for
   their thumbnail area, and a bare `.hero` selector would apply the
   margin-top to every card hero too. */
body:has(.ep) .ep > section.hero,
body:has(.ep) .ep > .hero {
  margin-top: 90px !important;
}
/* Top breathing room — applied to the INNER .hero-ct, not .hero itself,
   because the .ep,.ep * { padding: 0 } reset (later in the file) was
   overriding any padding-top set on .hero directly. .hero-ct is a
   distinct child so the reset doesn't fight it. */
body:has(.ep) .hero .hero-ct {
  padding-top: 60px !important;
}

/* Hero copy legibility — full white + text-shadow so the title and
   description read clearly over the photo / overlay gradient.
   IMPORTANT: exclude .hl from the h1 shadow because .hl uses
   background-clip: text for its teal→mint gradient fill. A parent
   text-shadow bleeds through the transparent text-fill-color and
   makes the gradient look muddy/darker. */
body:has(.ep) .hero h1 {
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.5) !important;
}
body:has(.ep) .hero h1 .hl {
  text-shadow: none !important;
}
body:has(.ep) .hero-desc {
  color: #fff !important;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.6) !important;
}

/* Sign In buttons (header .btn-si + hero .btn-g) — readable text on
   transparent / photo bg via stronger glass effect + bright white text */
body:has(.ep) .btn-si,
body:has(.ep) .btn.btn-g {
  background: rgba(255, 255, 255, 0.15) !important;
  color: #fff !important;
  border: 1.5px solid rgba(255, 255, 255, 0.35) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  font-weight: 600 !important;
}
body:has(.ep) .btn-si:hover,
body:has(.ep) .btn.btn-g:hover {
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: rgba(255, 255, 255, 0.5) !important;
}
/* Defensive: course-widget card heroes stay flush */
body:has(.ep) #moodle-course-widget .hero,
body:has(.ep) .card .hero {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&display=swap');
.ep{--navy:#0c1926;--navy-mid:#162d44;--navy-light:#1e3a56;--teal:#42c3f7;--teal-glow:rgba(66,195,247,0.5);--white:#fff;--text-primary:#e2e8f0;--text-muted:#94a3b8;--accent-green:#34d399;--accent-amber:#fbbf24;--accent-purple:#a78bfa;--accent-pink:#f472b6;--glass:rgba(255,255,255,0.06);--glass-border:rgba(255,255,255,0.15);--radius:16px;--radius-sm:10px;--radius-lg:24px}
.ep,.ep *{margin:0;padding:0;box-sizing:border-box}
#moodle-course-widget,#moodle-course-widget *{margin:revert;padding:revert;box-sizing:border-box}
.ep{font-family:'Plus Jakarta Sans',-apple-system,sans-serif;background:var(--navy);color:var(--text-primary);overflow-x:hidden;-webkit-font-smoothing:antialiased;line-height:1.6}
.ep a{color:inherit;text-decoration:none}
.ep .ct{max-width:1200px;margin:0 auto;padding:0 24px}
.ep .sc{padding:80px 0;position:relative}

/* grid pattern utility */
.ep .grid-bg{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:60px 60px;mask-image:radial-gradient(ellipse 80% 70% at 50% 50%,black,transparent);-webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 50%,black,transparent);pointer-events:none}

/* HEADER */
.ep .hd{position:fixed;top:0;left:0;right:0;z-index:100;transition:all .35s cubic-bezier(.4,0,.2,1);background:rgba(12,25,38,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border)}
.ep .hd.scrolled{background:rgba(12,25,38,.92);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--glass-border)}
.ep .hd-in{max-width:1200px;margin:0 auto;padding:0 24px;height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.ep .hd-logos{display:flex;align-items:center;gap:14px;flex-shrink:0}
.ep .hd-logos img{height:38px;display:block}
.ep .logo-div{width:1px;height:26px;background:rgba(255,255,255,0.15)}
.ep .logo-fb{padding:6px 12px;background:rgba(255,255,255,0.08);border:1px solid rgba(255,255,255,0.1);border-radius:6px;font-size:.75rem;font-weight:700;color:var(--text-muted);letter-spacing:.06em}
.ep .hd-nav{display:flex;align-items:center;gap:4px}
.ep .hd-nav a{padding:8px 14px;font-size:.82rem;font-weight:500;color:#b8c5d3;border-radius:8px;transition:all .2s}
.ep .hd-nav a:hover{color:var(--white);background:var(--glass)}
.ep .hd-act{display:flex;align-items:center;gap:8px;flex-shrink:0}
.ep .btn-si{padding:8px 18px;font-size:.82rem;font-weight:600;color:#b8c5d3;border-radius:50px;transition:all .2s;background:transparent;border:none;cursor:pointer;font-family:inherit}
.ep .btn-si:hover{color:var(--white)}
.ep .btn-j{padding:8px 20px;font-size:.82rem;font-weight:600;color:var(--navy);background:var(--teal);border-radius:50px;border:none;cursor:pointer;transition:all .25s;font-family:inherit}
.ep .btn-j:hover{background:#5dd4ff;transform:translateY(-1px);box-shadow:0 4px 16px var(--teal-glow)}
.ep .mob-tog{display:none;background:none;border:none;color:var(--white);cursor:pointer;padding:8px}
.ep .mob-menu{display:none;position:fixed;top:72px;left:0;right:0;bottom:0;background:rgba(12,25,38,.98);backdrop-filter:blur(20px);z-index:99;padding:32px 24px;flex-direction:column;gap:8px}
.ep .mob-menu.open{display:flex}
.ep .mob-menu a{display:block;padding:14px 16px;font-size:1rem;font-weight:500;color:#b8c5d3;border-radius:10px}
.ep .mob-act{display:flex;gap:12px;margin-top:16px;padding-top:16px;border-top:1px solid var(--glass-border)}
@media(max-width:860px){.ep .hd-nav{display:none}.ep .hd-act{display:none}.ep .mob-tog{display:block}}

/* COMMON */
.ep .sl{font-size:.75rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--teal);margin-bottom:10px;display:inline-flex;align-items:center;gap:8px}
.ep .sl::before{content:'';width:20px;height:2px;background:var(--teal)}
.ep .st{font-size:clamp(1.8rem,3.5vw,2.6rem);font-weight:800;line-height:1.15;letter-spacing:-.03em;margin-bottom:16px;color:var(--white)}
.ep .st .hl{color:var(--teal)}
.ep .btn{display:inline-flex;align-items:center;gap:8px;padding:13px 26px;border-radius:50px;font-family:inherit;font-size:.9rem;font-weight:600;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);border:none;cursor:pointer}
.ep .btn-p{background:var(--teal);color:var(--navy)}
.ep .btn-p:hover{background:#5dd4ff;transform:translateY(-2px);box-shadow:0 8px 30px var(--teal-glow)}
.ep .btn-g{background:rgba(255,255,255,0.12);color:var(--white);border:1px solid rgba(255,255,255,0.2)}
.ep .btn-g:hover{background:rgba(255,255,255,.18);transform:translateY(-2px)}
.ep .btn-sm{padding:10px 20px;font-size:.82rem}
.ep .ch{text-align:center;margin-bottom:48px}
.ep .ch .sl{justify-content:center}
.ep .ch .ss{max-width:620px;margin:0 auto;font-size:1rem;color:rgba(255,255,255,0.82)}

/* HERO */
.ep .hero{min-height:0;display:flex;align-items:center;position:relative;overflow:hidden;padding:120px 0 80px}
.ep .hero-bg-img{position:absolute;inset:0;background:url('https://engine.maine.gov/sites/default/files/2026-03/EnGiNE-Home-Banner.png') center center/cover no-repeat}
.ep .hero-overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(12,25,38,.78) 0%,rgba(22,45,68,.68) 50%,rgba(12,25,38,.80) 100%)}
.ep .hero-ct{position:relative;z-index:2;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.ep .hero h1{font-size:clamp(2.2rem,4.5vw,3.4rem);font-weight:800;line-height:1.08;letter-spacing:-.04em;margin-bottom:20px;color:var(--white)}
.ep .hero h1 .hl{background:linear-gradient(135deg,var(--teal),var(--accent-green));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.ep .hero-desc{font-size:1.05rem;line-height:1.75;color:rgba(255,255,255,.85);margin-bottom:32px;max-width:500px}
.ep .hero-btns{display:flex;gap:12px;flex-wrap:wrap}

/* FLOATING CARD */
.ep .float-wrap{perspective:800px}
.ep .hero-card{background:rgba(12,25,38,0.55);border:2px solid rgba(66,195,247,.4);border-radius:var(--radius-lg);padding:28px;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);animation:cardFloat 6s ease-in-out infinite;transform-origin:center center;box-shadow:0 20px 60px rgba(0,0,0,.3),0 0 40px rgba(66,195,247,.1)}
@keyframes cardFloat{
  0%,100%{transform:translateY(0px) rotate3d(1,0.5,0,0deg)}
  25%{transform:translateY(-8px) rotate3d(1,0.5,0,1.5deg)}
  50%{transform:translateY(-4px) rotate3d(1,-0.5,0,0.5deg)}
  75%{transform:translateY(-10px) rotate3d(1,0,0.5,-1deg)}
}
.ep .hc-hdr{display:flex;align-items:center;gap:10px;margin-bottom:20px}
.ep .hc-dot{width:8px;height:8px;border-radius:50%;background:var(--teal);box-shadow:0 0 10px var(--teal-glow);animation:pu 2s ease-in-out infinite}
@keyframes pu{0%,100%{opacity:1}50%{opacity:.4}}
.ep .hc-lbl{font-size:.75rem;font-weight:700;color:var(--teal);letter-spacing:.08em;text-transform:uppercase}
.ep .fl{list-style:none;display:flex;flex-direction:column;gap:10px}
.ep .fi{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border-radius:var(--radius-sm);background:rgba(255,255,255,.05);border:1.5px solid rgba(255,255,255,.18);transition:all .3s}
.ep .fi:hover{background:rgba(255,255,255,.1);border-color:rgba(66,195,247,.3);transform:translateX(3px)}
.ep .fic{width:42px;height:42px;border-radius:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;background:rgba(255,255,255,0.95)}
.ep .fic1{color:var(--teal)}
.ep .fic2{color:var(--accent-green)}
.ep .fic3{color:var(--accent-amber)}
.ep .fic4{color:var(--accent-purple)}
.ep .fic5{color:var(--accent-pink)}
.ep .ft strong{display:block;font-size:.9rem;font-weight:700;color:var(--teal);margin-bottom:2px}
.ep .ft span{font-size:.82rem;color:rgba(255,255,255,0.85);line-height:1.45}

/* WHO */
.ep .who-sc{background:linear-gradient(180deg,var(--navy),#1a3550)}
.ep .who-layout{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:stretch}
.ep .who-img{border-radius:var(--radius-lg);overflow:hidden;min-height:300px;background:#1e3a56;border:1px solid rgba(255,255,255,0.1)}
.ep .who-img img{width:100%;height:100%;object-fit:cover;display:block}
.ep .who-img span{font-size:.75rem}
.ep .who-roles{display:flex;flex-direction:column;gap:12px}
.ep .role-card{display:flex;align-items:flex-start;gap:14px;padding:16px 18px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;background:#f0f4f8;border:1px solid #dce4ed;border-left:4px solid var(--teal);transition:all .3s;box-shadow:0 4px 16px rgba(0,0,0,0.1)}
.ep .role-card:hover{transform:translateX(4px);box-shadow:0 6px 24px rgba(0,0,0,0.15)}
.ep .role-ic{width:42px;height:42px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:2px solid var(--navy)}
.ep .role-card h3{font-size:.95rem;font-weight:700;color:var(--navy);margin-bottom:3px}
.ep .role-card p{font-size:.85rem;color:#475569;line-height:1.6}

/* LCG */
.ep .lcg-sc{background:linear-gradient(180deg,#1a3550,#162d44);overflow:hidden}
.ep .lcg-intro{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-bottom:40px}
.ep .lcg-card{background:#f0f4f8;border:1px solid #dce4ed;border-left:4px solid var(--teal);border-radius:0 var(--radius) var(--radius) 0;padding:28px;display:flex;gap:18px;align-items:flex-start;transition:all .3s;box-shadow:0 4px 16px rgba(0,0,0,0.1)}
.ep .lcg-card:hover{transform:translateY(-3px);box-shadow:0 8px 28px rgba(0,0,0,0.15)}
.ep .lcg-card.feat{grid-column:1/-1;background:#fff;border-left:4px solid var(--accent-green)}
.ep .lcg-ic{width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;border:2px solid var(--navy)}
.ep .lcg-card h3{font-size:1.05rem;font-weight:700;color:var(--navy);margin-bottom:5px}
.ep .lcg-card p{font-size:.9rem;color:#475569;line-height:1.7}
.ep .widget-area{background:var(--glass);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:40px;text-align:center;min-height:280px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px}
.ep .widget-area .wl{font-size:.8rem;font-weight:600;color:var(--teal);letter-spacing:.08em;text-transform:uppercase}
.ep .widget-area .wn{font-size:.85rem;color:var(--text-muted);max-width:500px;line-height:1.6}
.ep .widget-area code{display:block;margin-top:8px;padding:14px;background:rgba(0,0,0,.3);border-radius:8px;font-size:.65rem;color:var(--text-muted);text-align:left;overflow-x:auto;white-space:pre;font-family:'SF Mono',Monaco,monospace;max-width:100%;border:1px solid rgba(255,255,255,.05)}

/* STATS */
.ep .stats-bar{position:relative;padding:60px 0;overflow:hidden}
.ep .stats-bar::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(66,195,247,.06),rgba(52,211,153,.04));border-top:1px solid var(--glass-border);border-bottom:1px solid var(--glass-border)}
.ep .stats-inner{position:relative;display:grid;grid-template-columns:1fr 2fr;gap:48px;align-items:center}
.ep .stat-counter{text-align:center}
.ep .stat-num{font-size:clamp(3rem,6vw,4.5rem);font-weight:800;letter-spacing:-.03em;background:linear-gradient(135deg,var(--teal),var(--accent-green));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:4px;line-height:1}
.ep .stat-label{font-size:.95rem;color:rgba(255,255,255,0.8);font-weight:500;margin-top:8px}
.ep .stat-quote{background:#f0f4f8;border:1px solid #dce4ed;border-radius:0 var(--radius) var(--radius) 0;padding:32px;border-left:4px solid var(--teal);box-shadow:0 4px 16px rgba(0,0,0,0.1)}
.ep .stat-quote blockquote{font-size:1rem;line-height:1.75;color:#475569;font-style:italic;margin:0 0 16px;border:none;padding:0}
.ep .stat-quote .ta{display:flex;align-items:center;gap:10px}
.ep .stat-quote .ti strong{color:var(--navy)}
.ep .stat-quote .ti span{color:#64748b}
@media(max-width:900px){.ep .stats-inner{grid-template-columns:1fr}}

/* CONTENT AREAS */
.ep .ca-sc{background:linear-gradient(180deg,var(--navy-mid),var(--navy));overflow:hidden}
.ep .ca-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
.ep .ca-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.ep .ca-tag{display:flex;align-items:center;gap:10px;padding:14px 18px;border-radius:var(--radius-sm);background:rgba(255,255,255,0.06);border:2px solid rgba(255,255,255,0.15);color:rgba(255,255,255,0.9);font-size:.9rem;font-weight:500;transition:all .3s}
.ep .ca-tag:hover{background:rgba(66,195,247,.08);border-color:rgba(66,195,247,.2);transform:translateY(-2px);color:var(--white)}
.ep .ca-ic{width:30px;height:30px;border-radius:8px;background:rgba(66,195,247,.1);display:flex;align-items:center;justify-content:center;color:var(--teal);flex-shrink:0}
.ep .ca-img{border-radius:var(--radius-lg);overflow:hidden;min-height:300px;background:#1e3a56;border:1px solid rgba(255,255,255,0.1)}
.ep .ca-img span{font-size:.75rem}

/* TESTIMONIALS */
.ep .test-sc{background:var(--navy);overflow:hidden}
.ep .test-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:stretch}
.ep .test-img{border-radius:var(--radius-lg);overflow:hidden;min-height:300px;background:#1e3a56;border:1px solid rgba(255,255,255,0.1)}
.ep .test-img span{font-size:.75rem}
.ep .tg{display:flex;flex-direction:column;gap:20px}
.ep .tc2{background:rgba(255,255,255,0.06);border:2px solid rgba(255,255,255,0.15);border-radius:var(--radius);padding:28px;transition:all .3s}
.ep .tc2:hover{border-color:rgba(66,195,247,.2);transform:translateY(-3px)}
.ep .tc2 .qi{color:var(--teal);opacity:.4;margin-bottom:12px}
.ep .tc2 p,.ep .tc2 blockquote{font-size:.92rem;line-height:1.7;color:rgba(255,255,255,0.8);margin:0 0 20px;font-style:italic;border:none;padding:0}
.ep .ta{display:flex;align-items:center;gap:10px}
.ep .tav{width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,var(--teal),var(--accent-green));display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.75rem;color:var(--navy);flex-shrink:0}
.ep .ti strong{display:block;font-size:.8rem;font-weight:600;color:var(--white)}
.ep .ti span{font-size:.8rem;color:#b8c5d3}

/* CTA */
.ep .cta-sc{padding:80px 0;position:relative;overflow:hidden;background:var(--navy-mid)}
.ep .cta-sc::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(66,195,247,.07),rgba(52,211,153,.04))}
.ep .cta-box{position:relative;text-align:center;max-width:640px;margin:0 auto}
.ep .cta-box h2{font-size:clamp(1.8rem,3.5vw,2.4rem);font-weight:800;letter-spacing:-.03em;margin-bottom:14px;color:var(--white)}
.ep .cta-box p{font-size:1rem;color:rgba(255,255,255,0.85);margin-bottom:32px;line-height:1.7}
.ep .cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}

/* FOOTER */
.ep .ef{background:var(--navy);border-top:1px solid var(--glass-border);padding:48px 0 32px}
.ep .fg{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;margin-bottom:40px}
.ep .fls{display:flex;gap:14px;margin-bottom:16px;flex-wrap:wrap;align-items:center}
.ep .fls img{height:36px}
.ep .fd{width:1px;height:24px;background:rgba(255,255,255,0.12)}
.ep .ef p{font-size:.8rem;color:#b8c5d3;line-height:1.7;margin-bottom:14px}
.ep .ef a{color:var(--teal);text-decoration:none}
.ep .fsoc{display:flex;gap:10px}
.ep .fsoc a{width:36px;height:36px;border-radius:9px;background:var(--glass);border:1px solid var(--glass-border);display:flex;align-items:center;justify-content:center;color:var(--text-muted);transition:all .3s}
.ep .fsoc a:hover{background:rgba(66,195,247,.12);border-color:var(--teal);color:var(--teal)}
.ep .fc h4{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--white);margin-bottom:16px}
.ep .fc ul{list-style:none}
.ep .fc li{margin-bottom:10px}
.ep .fc li a{color:#b8c5d3;font-size:.8rem;transition:color .2s;text-decoration:none}
.ep .fc li a:hover{color:var(--teal)}
.ep .fb{border-top:1px solid var(--glass-border);padding-top:24px;font-size:.8rem;color:#b8c5d3;line-height:1.6}
@media(max-width:900px){.ep .hero-ct,.ep .who-layout,.ep .fg{grid-template-columns:1fr}.ep .lcg-intro{grid-template-columns:1fr}.ep .lcg-card.feat{grid-column:auto}.ep .stats-grid{grid-template-columns:repeat(2,1fr)}.ep .tg{grid-template-columns:1fr}.ep .ca-split{grid-template-columns:1fr}.ep .test-split{grid-template-columns:1fr}.ep .test-img{aspect-ratio:16/9}}
@media(max-width:600px){.ep .sc{padding:56px 0}.ep .hero{padding:90px 0 50px;min-height:auto}.ep .ca-grid{grid-template-columns:1fr 1fr}.ep .hero-btns,.ep .cta-btns{flex-direction:column;align-items:stretch;text-align:center}.ep .btn{justify-content:center}.ep .hd-logos img{height:30px}}
/* Engine Widget Theme Variables */
#moodle-course-widget{--engine-widget-card:rgba(255,255,255,0.06);--engine-widget-panel:rgba(22,45,68,0.8);--engine-widget-border:rgba(255,255,255,0.08);--engine-widget-radius:16px;--engine-widget-shadow:0 4px 20px rgba(0,0,0,0.2);--engine-widget-accent:#42c3f7;--engine-widget-fg:#e2e8f0;--engine-widget-muted:#94a3b8;--engine-widget-columns:4;--engine-widget-md-columns:2;--engine-widget-gap:20px;font-family:'Plus Jakarta Sans',-apple-system,sans-serif}
#moodle-course-widget .card{background:var(--engine-widget-card);border:1px solid var(--engine-widget-border)}
#moodle-course-widget .body{background:var(--engine-widget-panel)}
#moodle-course-widget .title a{color:var(--engine-widget-accent)}
#moodle-course-widget .desc{color:var(--engine-widget-fg);font-size:.85rem;line-height:1.6}
#moodle-course-widget .learn-more{color:var(--engine-widget-accent)}
#moodle-course-widget .meta{color:var(--engine-widget-muted)}
#moodle-course-widget button.show-more{color:var(--teal);font-weight:600;font-size:.9rem;padding:1.5rem;cursor:pointer}
#moodle-course-widget button.show-more:hover{color:#5dd4ff}
#moodle-course-widget .hero.placeholder{background:linear-gradient(135deg,rgba(66,195,247,0.15),rgba(66,195,247,0.05))}
#moodle-course-widget select{background:var(--navy-mid);color:var(--text-primary);border:1px solid var(--glass-border);border-radius:8px;padding:8px 12px;font-family:inherit}


/* === MOODLE WIDGET === */
#moodle-course-widget{font-family:'Plus Jakarta Sans',-apple-system,sans-serif;min-height:200px;margin-top:8px}
#moodle-course-widget .grid{display:flex !important;flex-wrap:wrap !important;gap:24px !important}
#moodle-course-widget .grid .card{flex:0 0 calc(25% - 18px) !important}
@media(max-width:1200px){#moodle-course-widget .grid .card{flex:0 0 calc(50% - 12px) !important}}
@media(max-width:760px){#moodle-course-widget .grid .card{flex:0 0 100% !important}}
#moodle-course-widget .card{background:rgba(255,255,255,0.06) !important;border:1px solid rgba(255,255,255,0.08) !important;border-radius:12px !important;overflow:hidden;box-shadow:0 6px 18px rgba(0,0,0,.2) !important;transition:transform .18s ease,box-shadow .18s ease}
#moodle-course-widget .card:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.25) !important}
#moodle-course-widget .hero{display:block !important;position:relative !important;overflow:hidden !important;background:#0b1526 !important;height:auto !important;min-height:0 !important}
#moodle-course-widget .card .hero{aspect-ratio:16/9 !important}
#moodle-course-widget .hero::before{content:"" !important;display:block !important;padding-top:56.25% !important}
#moodle-course-widget .hero img{position:absolute !important;top:0 !important;left:0 !important;width:100% !important;height:100% !important;object-fit:cover !important;display:block !important}
#moodle-course-widget .hero.placeholder{background:linear-gradient(135deg,rgba(66,195,247,0.15),rgba(66,195,247,0.05)) !important}
#moodle-course-widget .body{background:#fff !important;padding:14px 16px 16px}
#moodle-course-widget .title{margin:0 0 8px;font-size:17px;line-height:1.35}
#moodle-course-widget .title a{color:#162d44 !important;font-weight:700;text-decoration:none}
#moodle-course-widget .title a:hover{color:#42c3f7 !important;text-decoration:underline}
#moodle-course-widget .desc{margin:0 0 12px;color:#334155 !important;opacity:.9;font-size:.85rem;line-height:1.6;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
#moodle-course-widget .learn-more{display:block !important;background:#162d44 !important;color:#fff !important;font-weight:600;text-decoration:none !important;padding:10px 16px;border-radius:6px;font-size:.85rem;transition:all .2s;text-align:center;margin-top:auto}
#moodle-course-widget .learn-more:hover{background:#0c1926 !important;transform:translateY(-1px)}
#moodle-course-widget .meta{display:flex;align-items:center;gap:8px;color:#6B7280 !important;font-size:13px;margin-bottom:8px}
#moodle-course-widget .meta .icon{display:inline-flex;line-height:0}
#moodle-course-widget .meta .icon svg{width:14px;height:14px}
#moodle-course-widget button.show-more{color:var(--teal) !important;font-weight:700;font-size:.9rem;padding:1.5rem;cursor:pointer;background:none !important;border:none !important}
#moodle-course-widget button.show-more:hover{color:#5dd4ff !important;text-decoration:underline}
#moodle-course-widget select,#engine-widget-course-category-selector{background:var(--navy-mid) !important;color:var(--text-primary) !important;border:1px solid rgba(255,255,255,0.12) !important;border-radius:8px !important;padding:8px 12px !important;font-family:inherit !important;font-size:.9rem !important}
#moodle-course-widget .card:has(a[href*="id=120"]){display:none !important}
/* card body flex to push learn-more to bottom */
#moodle-course-widget .body{display:flex !important;flex-direction:column !important}
/* === WCAG 2.0 AA Accessibility Fixes === */
/* Version: 2.0 | 2026-03-26 00:15 EST */

/* Focus indicators for all interactive elements */
.ep a:focus-visible,
.ep button:focus-visible,
.ep .btn:focus-visible,
.ep .btn-p:focus-visible,
.ep .btn-g:focus-visible,
.ep .btn-j:focus-visible,
.ep .btn-si:focus-visible,
.ep .ca-tag:focus-visible,
.ep .role-card:focus-visible,
.ep .lcg-card:focus-visible,
.ep .tc2:focus-visible,
#moodle-course-widget a:focus-visible,
#moodle-course-widget button:focus-visible {
  outline: 3px solid var(--teal) !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px rgba(66,195,247,0.25) !important;
}

/* Ensure footer links have underline on focus for distinguishability */
.ep .ef a:focus-visible,
.ep .fc li a:focus-visible {
  text-decoration: underline !important;
}

/* Respect prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .ep .hero-card {
    animation: none !important;
  }
  .ep .hc-dot {
    animation: none !important;
    opacity: 1 !important;
  }
  .ep .fi:hover,
  .ep .role-card:hover,
  .ep .lcg-card:hover,
  .ep .tc2:hover,
  .ep .ca-tag:hover,
  .ep .btn:hover,
  .ep .btn-p:hover,
  .ep .btn-g:hover,
  .ep .btn-j:hover,
  #moodle-course-widget .card:hover,
  #moodle-course-widget .learn-more:hover {
    transform: none !important;
    transition: none !important;
  }
}

/* Ensure links in body text are distinguishable (underline on hover/focus) */
.ep .ef a:hover,
.ep .fc li a:hover {
  text-decoration: underline;
}