:root {
  --eez-primary: #1a56db;
  --eez-primary-dark: #1443ab;
  --eez-bg-light: #f5f8ff;
}

body {
  font-family: 'Poppins', sans-serif;
  color: #1f2937;
  background-color: #ffffff;
}

.text-purple { color: #7c3aed !important; }
.bg-purple { background-color: #7c3aed !important; }

a { text-decoration: none; }

.navbar-brand { color: var(--eez-primary) !important; }
.nav-link.active { color: var(--eez-primary) !important; }

.btn-primary {
  background-color: var(--eez-primary);
  border-color: var(--eez-primary);
}
.btn-primary:hover, .btn-primary:focus {
  background-color: var(--eez-primary-dark);
  border-color: var(--eez-primary-dark);
}
.btn-outline-primary {
  color: var(--eez-primary);
  border-color: var(--eez-primary);
}
.btn-outline-primary:hover {
  background-color: var(--eez-primary);
  border-color: var(--eez-primary);
}
.text-primary { color: var(--eez-primary) !important; }

.hero-section {
  background: linear-gradient(180deg, #eef3ff 0%, #ffffff 100%);
}

.course-card {
  transition: transform .2s ease, box-shadow .2s ease;
  border-radius: 14px;
  overflow: hidden;
  position: relative;
}
.course-card-link { position: absolute; inset: 0; z-index: 1; }
.course-card > *:not(.course-card-link) { position: relative; z-index: 2; }
.course-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(26,86,219,.12) !important;
}
.course-thumb {
  height: 170px;
  object-fit: cover;
}

.category-card {
  border-radius: 14px;
  transition: all .2s ease;
  border: 1px solid #eef0f4;
}
.category-card:hover {
  border-color: var(--eez-primary);
  box-shadow: 0 8px 20px rgba(26,86,219,.1);
}

.auth-card {
  border-radius: 18px;
}

.progress-thin { height: 8px; border-radius: 10px; }

.badge.bg-purple { background-color: #7c3aed !important; }

.step-circle {
  width: 34px; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 50%;
  background: #e9edf7;
  color: #64748b;
  font-weight: 600;
}
.step-circle.active { background: var(--eez-primary); color: #fff; }
.step-circle.done { background: #22c55e; color: #fff; }

.certificate-frame {
  border: 2px solid #d4af37;
  border-radius: 10px;
  background: #fff;
  position: relative;
  overflow: hidden;
}

footer a:hover { color: #fff !important; }

.toast-container { z-index: 2000; }
.cart-added-toast { position: fixed; z-index: 2050; left: 50%; bottom: 24px; display: flex; align-items: center; gap: 11px; width: min(440px, calc(100% - 28px)); padding: 12px 14px; color: #17233c; background: #fff; border: 1px solid #dce8f5; border-radius: 12px; box-shadow: 0 12px 32px rgba(17, 55, 97, .2); transform: translate(-50%, 130%); opacity: 0; transition: transform .25s ease, opacity .25s ease; }
.cart-added-toast.show { transform: translate(-50%, 0); opacity: 1; }
.cart-added-icon { display: grid; place-items: center; flex: 0 0 35px; width: 35px; height: 35px; color: #fff; background: #168b62; border-radius: 9px; font-size: 18px; }
.cart-added-copy { display: grid; gap: 2px; min-width: 0; flex: 1; }
.cart-added-copy strong { font-size: 13px; }
.cart-added-copy span { overflow: hidden; color: #66758a; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.cart-added-count { display: grid; place-items: center; width: 25px; height: 25px; color: #fff; background: var(--eez-primary); border-radius: 50%; font-size: 12px; font-weight: 800; }
.cart-added-link { padding: 7px 10px; color: #fff; background: var(--eez-primary); border-radius: 6px; font-size: 11px; font-weight: 700; text-decoration: none; white-space: nowrap; }
.cart-added-link:hover { color: #fff; background: #1247bb; }

/* EduEze landing-page visual system */
:root {
  --eez-ink: #071735;
  --eez-muted: #63708a;
  --eez-line: #e7edf6;
  --eez-sky: #edf6ff;
}
body { color: var(--eez-ink); font-size: 14px; }
.navbar { min-height: 58px; border-bottom: 1px solid #eef2f8; box-shadow: none !important; }
.navbar-brand { letter-spacing: -.04em; }
.navbar-brand i { background: linear-gradient(135deg, #16a8ff, #1556d7); color: #fff !important; border-radius: 8px; padding: 3px 6px; font-size: 1.25rem !important; }
.nav-link { color: var(--eez-ink); font-size: 12px; font-weight: 600; padding: 1.05rem .85rem !important; }
.nav-link.active { border-bottom: 2px solid var(--eez-primary); }
.home-hero { overflow: hidden; background: linear-gradient(110deg, #f8fbff 5%, #fff 60%, #effaff); }
.hero-grid { display: grid; grid-template-columns: 46% 54%; align-items: center; min-height: 475px; }
.hero-copy { padding: 45px 0 34px; position: relative; z-index: 2; }
.eyebrow { display: inline-flex; gap: 7px; align-items: center; border-radius: 30px; padding: 6px 13px; color: #1864d9; background: #eaf4ff; font-size: 11px; font-weight: 600; }
.hero-copy h1 { color: var(--eez-ink); font-size: clamp(2.25rem, 4vw, 3.35rem); line-height: 1.08; letter-spacing: -.05em; margin: 17px 0 12px; font-weight: 800; }
.hero-copy h1 span { color: var(--eez-primary); }
.hero-copy > p { color: var(--eez-muted); line-height: 1.65; max-width: 455px; margin-bottom: 17px; }
.hero-search { display: flex; align-items: center; gap: 10px; max-width: 470px; border: 1px solid #dbe5f2; background: #fff; border-radius: 7px; padding: 4px 5px 4px 13px; box-shadow: 0 5px 17px rgba(16, 55, 105, .08); }
.hero-search > i { color: #7c8ca5; }.hero-search input { min-width: 0; flex: 1; border: 0; outline: 0; font: inherit; font-size: 11px; }.hero-search button { border: 0; border-radius: 6px; background: var(--eez-primary); color: #fff; padding: 10px 18px; font-size: 11px; font-weight: 700; }
.hero-actions { display: flex; gap: 11px; margin: 18px 0 22px; }.hero-actions .btn { padding: 10px 17px; font-size: 11px; font-weight: 700; border-radius: 6px; }.hero-actions i { margin-left: 7px; }
.hero-stats { display: flex; gap: 0; max-width: 465px; }.hero-stats > div { flex: 1; display: grid; grid-template-columns: 25px 1fr; column-gap: 5px; border-right: 1px solid #dce5f0; }.hero-stats > div:last-child { border: 0; }.hero-stats i { grid-row: span 2; color: #1671e9; background: #e9f4ff; border-radius: 50%; width: 23px; height: 23px; text-align: center; line-height: 23px; }.hero-stats strong { font-size: 12px; line-height: 12px; }.hero-stats small { color: var(--eez-muted); font-size: 9px; }
.hero-art { height: 450px; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; }.hero-banner { display: block; width: 100%; max-width: none; height: 450px; object-fit: cover; object-position: right center; }
.laptop { position: absolute; z-index: 1; top: 105px; left: 90px; width: 415px; transform: rotate(-4deg); }.laptop-screen { height: 245px; background: #fff; border: 8px solid #10253c; border-radius: 13px 13px 5px 5px; box-shadow: 0 18px 24px #62809a66; padding: 9px; }.laptop-base { height: 17px; margin-left: -25px; width: 465px; background: #b7c4cb; border-radius: 3px 3px 50% 50%; box-shadow: 0 8px 8px #55708066; }.screen-top { display: flex; align-items: center; gap: 8px; font-size: 6px; color: #142238; }.screen-top b { color: #125bd0; margin-right: auto; }.screen-top b span { color: #15aee7; }.screen-top em { background: #1665de; color: #fff; border-radius: 2px; padding: 3px 6px; font-style: normal; }.video-screen { height: 145px; margin-top: 8px; background: linear-gradient(140deg, #102f45, #2d688c); color: #fff; display: flex; align-items: center; justify-content: center; position: relative; }.video-screen i { font-size: 27px; opacity: .85; }.video-screen span { position: absolute; bottom: 8px; left: 10px; font-size: 8px; }.screen-lines { display: flex; gap: 8px; margin-top: 8px; }.screen-lines b { height: 23px; flex: 1; background: #e7eff5; border-radius: 3px; }.art-card, .certificate-art { position: absolute; z-index: 2; background: #fff; border-radius: 9px; box-shadow: 0 10px 22px #44708a2b; }.progress-card { left: 3px; top: 145px; width: 130px; padding: 13px; font-size: 9px; }.progress-card b { float: right; color: #142b53; }.progress-card span { display: block; height: 5px; margin-top: 11px; background: #e6eff7; border-radius: 6px; }.progress-card span i { display: block; width: 75%; height: 100%; background: #19b9d4; border-radius: inherit; }.live-card { top: 230px; left: 25px; padding: 11px; width: 105px; font-size: 8px; }.live-card i { color: #e84950; margin-right: 5px; }.live-card strong, .live-card small { display: block; margin-left: 20px; }.live-card small, .certificate-art small { color: var(--eez-muted); font-size: 7px; }.certificate-art { right: 4px; bottom: 20px; width: 112px; height: 145px; padding: 18px 10px; transform: rotate(7deg); border: 4px solid #d9e4f1; text-align: center; color: #1d3866; }.certificate-art i { display: block; color: #e9a82c; font-size: 32px; margin: 12px 0; }.certificate-art strong, .certificate-art small { display: block; }
.home-section { padding: 28px 0; }.section-heading h2 { font-size: 19px; margin: 0; font-weight: 800; letter-spacing: -.03em; }.section-heading p { color: var(--eez-muted); font-size: 11px; margin: 4px 0 14px; }.section-heading.centered { text-align: center; }.section-heading.split { display: flex; justify-content: space-between; align-items: end; margin-bottom: 2px; }.section-heading.split a { color: var(--eez-primary); font-size: 11px; font-weight: 700; margin-bottom: 14px; }
.category-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; }.category-tile { min-height: 155px; padding: 15px 12px; text-align: center; border: 1px solid var(--eez-line); border-radius: 10px; color: var(--eez-ink); box-shadow: 0 3px 10px #1e497b08; transition: .2s; }.category-tile:hover { transform: translateY(-3px); border-color: #a9c9f4; box-shadow: 0 10px 20px #1e497b14; }.category-icon { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: linear-gradient(145deg, #1489e7, #1253cc); color: #fff; font-size: 23px; margin-bottom: 8px; }.category-tile:nth-child(2) .category-icon { background: linear-gradient(145deg, #19bfa7, #0c9d91); }.category-tile:nth-child(3) .category-icon { background: linear-gradient(145deg, #8657cf, #6336a8); }.category-tile:nth-child(4) .category-icon { background: linear-gradient(145deg, #f17b24, #d84d0d); }.category-tile:nth-child(5) .category-icon { background: linear-gradient(145deg, #14c9c3, #00a6a3); }.category-tile h3 { font-size: 12px; font-weight: 800; margin: 0 0 6px; }.category-tile p { min-height: 32px; color: var(--eez-muted); font-size: 9px; line-height: 1.45; margin: 0 0 5px; }.category-tile strong { color: var(--eez-primary); font-size: 10px; }
.featured-section { background: #f8fbff; }.featured-section .course-card { box-shadow: 0 5px 15px #173d6b12 !important; }.featured-section .col-md-6 { flex: 0 0 auto; width: 33.333333%; }.course-card .card-body { padding: 14px; }.course-card .btn { font-size: 10px; font-weight: 700; }.course-card .buy-now-btn { display: none; }.course-thumb { height: 125px; }.course-card h6 { font-size: 12px; }.course-card p { font-size: 10px !important; }.course-card .fs-5 { font-size: 15px !important; }
.learning-points { padding: 16px 0; }.points-grid { display: grid; grid-template-columns: repeat(4, 1fr); border: 1px solid var(--eez-line); border-radius: 12px; padding: 14px 10px; box-shadow: 0 3px 12px #173d6b08; }.points-grid > div { display: flex; gap: 11px; padding: 0 16px; border-right: 1px solid var(--eez-line); }.points-grid > div:last-child { border: 0; }.points-grid i { flex: 0 0 45px; width: 45px; height: 45px; line-height: 45px; text-align: center; border-radius: 50%; color: var(--eez-primary); background: #e8f3ff; font-size: 20px; }.points-grid strong, .points-grid small { display: block; }.points-grid strong { font-size: 11px; }.points-grid small { color: var(--eez-muted); font-size: 9px; line-height: 1.4; margin-top: 4px; }
.testimonial-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.testimonial-grid article { position: relative; border: 1px solid var(--eez-line); border-radius: 12px; padding: 16px 18px; min-height: 135px; box-shadow: 0 4px 14px #173d6b08; }.testimonial-grid p { min-height: 55px; font-size: 10px; line-height: 1.55; }.testimonial-grid strong, .testimonial-grid small { display: block; }.testimonial-grid strong { font-size: 11px; }.testimonial-grid small { color: var(--eez-muted); font-size: 9px; margin-top: 3px; }.quote { color: var(--eez-primary); font-size: 27px; line-height: 10px; }
.final-cta { padding-bottom: 48px; }.cta-grid { display: grid; grid-template-columns: 1.2fr .7fr 1.5fr; align-items: center; min-height: 160px; padding: 25px 35px; border-radius: 12px; color: #fff; background: linear-gradient(110deg, #1877ed, #70b5f5); overflow: hidden; }.cta-grid h2 { font-size: 19px; line-height: 1.25; }.cta-grid p { font-size: 10px; max-width: 240px; }.cta-grid .btn { color: var(--eez-primary); font-size: 10px; font-weight: 700; }.cta-certificate { justify-self: center; width: 105px; height: 125px; padding: 17px 10px; text-align: center; background: #fff; color: var(--eez-ink); transform: rotate(5deg); box-shadow: 0 8px 15px #1351ad44; }.cta-certificate i, .cta-certificate strong, .cta-certificate small { display: block; }.cta-certificate i { color: #e9a82c; font-size: 34px; margin: 10px; }.cta-certificate small { color: var(--eez-muted); }.why-learn { background: #f6fbff; color: var(--eez-ink); align-self: stretch; margin: -25px -35px -25px 0; padding: 25px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.why-learn h3 { grid-column: span 2; font-size: 14px; }.why-learn span { display: grid; grid-template-columns: 22px 1fr; font-size: 9px; }.why-learn i { grid-row: span 2; color: var(--eez-primary); }.why-learn small { color: var(--eez-muted); }
@media (max-width: 991px) { .hero-grid { grid-template-columns: 1fr; }.hero-copy { padding-bottom: 10px; }.hero-art { height: 370px; transform: scale(.85); transform-origin: top center; }.category-grid { grid-template-columns: repeat(3, 1fr); }.points-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }.points-grid > div:nth-child(2) { border: 0; }.featured-section .col-md-6 { width: 50%; }.nav-link.active { border: 0; } }
@media (max-width: 575px) { .hero-copy h1 { font-size: 2.45rem; }.hero-actions { flex-wrap: wrap; }.hero-stats { gap: 7px; }.hero-stats > div { grid-template-columns: 1fr; text-align: center; border: 0; }.hero-stats i { margin: auto; }.hero-art { transform: scale(.68); height: 290px; width: 145%; margin-left: -22%; }.category-grid, .testimonial-grid { grid-template-columns: 1fr 1fr; }.category-tile:last-child { grid-column: span 2; }.featured-section .col-md-6 { width: 100%; }.points-grid, .cta-grid { grid-template-columns: 1fr; }.points-grid > div { border: 0; }.why-learn { margin: 20px -35px -25px; }.why-learn h3 { grid-column: span 2; } }

/* Keep home featured cards consistent with the courses listing cards. */
.featured-section .course-card { border: 1px solid #e6edf5 !important; box-shadow: 0 4px 13px #173d6b0d !important; }
.featured-section .course-card:hover { box-shadow: 0 10px 22px #1a56db1b !important; }
.featured-section .course-thumb { height: 155px; object-fit: cover; }
.featured-section .course-card .card-body { padding: 15px; }
.featured-section .course-card h6 { font-size: 14px; line-height: 1.35; }
.featured-section .course-card p { font-size: 11px !important; line-height: 1.5; }
.featured-section .course-card .card-body > .d-flex.gap-3 { font-size: 10px; }
.featured-section .course-card .btn { padding: 8px 6px; font-size: 11px; }

/* Keep the rotated certificate fully inside the CTA panel. */
.cta-certificate { box-sizing: border-box; height: 125px; padding: 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.cta-certificate i { margin: 4px 0; }

/* Explore page */
.explore-hero { min-height: 235px; overflow: hidden; border-bottom: 1px solid #edf2f8; background: linear-gradient(100deg, #fbfdff 20%, #fff 62%, #effaff); }
.explore-hero-grid { display: grid; grid-template-columns: 53% 47%; align-items: center; height: 235px; }.explore-breadcrumb { display: flex; align-items: center; gap: 9px; margin-bottom: 18px; font-size: 11px; }.explore-breadcrumb a { color: var(--eez-primary); font-weight: 700; }.explore-breadcrumb strong { color: var(--eez-primary); }.explore-breadcrumb span { color: #98a8bb; font-size: 19px; }.explore-hero h1 { margin: 0 0 7px; font-weight: 800; letter-spacing: -.045em; font-size: 36px; }.explore-hero p { color: var(--eez-muted); font-size: 12px; line-height: 1.55; }.explore-stats { display: flex; gap: 25px; margin-top: 18px; }.explore-stats span { display: grid; grid-template-columns: 25px 1fr; column-gap: 5px; }.explore-stats i { grid-row: span 2; color: #176be2; background: #e9f3ff; border-radius: 50%; height: 25px; width: 25px; text-align: center; line-height: 25px; }.explore-stats b { font-size: 12px; line-height: 12px; }.explore-stats small { color: var(--eez-muted); font-size: 9px; }
.explore-hero-art { height: 235px; position: relative; }.explore-orb { position: absolute; width: 310px; height: 310px; top: 0; left: 100px; border-radius: 50%; background: radial-gradient(circle at 35% 25%, #bfe3ff, #77baf2); opacity: .72; }.explore-orb:after { content: ''; position: absolute; right: -100px; top: 60px; width: 190px; height: 200px; border-radius: 50%; background: #b9edf2; }.explore-laptop { position: absolute; z-index: 1; top: 38px; left: 75px; width: 350px; transform: rotate(-3deg); }.explore-screen { height: 195px; background: #fff; border: 7px solid #14283c; border-radius: 11px 11px 3px 3px; padding: 8px; box-shadow: 0 15px 20px #55789055; }.explore-screen > b { display: block; font-size: 7px; color: #1768d9; }.explore-screen > b span { color: #12a9df; }.explore-screen > div { height: 127px; margin-top: 7px; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, #14394e, #39799b); }.explore-screen > div i { font-size: 28px; }.explore-laptop > em { display: block; width: 400px; height: 13px; margin-left: -25px; border-radius: 2px 2px 50% 50%; background: #bac7ce; }.explore-float { position: absolute; z-index: 2; background: #fff; border-radius: 9px; box-shadow: 0 9px 18px #44708a25; font-size: 8px; }.progress-float { top: 83px; left: -2px; width: 120px; padding: 12px; }.progress-float strong { float: right; }.progress-float span { display: block; height: 4px; margin-top: 10px; background: linear-gradient(90deg, #19bad2 75%, #e5edf6 75%); border-radius: 5px; }.live-float { top: 162px; left: 5px; padding: 11px; width: 106px; }.live-float i { color: #ef434b; margin-right: 4px; }.live-float b, .live-float small { display: block; margin-left: 20px; }.live-float small { color: var(--eez-muted); font-size: 7px; }
.explore-layout { padding-top: 24px; }.filter-panel { border: 1px solid var(--eez-line); border-radius: 10px; box-shadow: 0 4px 14px #173d6b0b; }.filter-panel h6 { color: var(--eez-ink); }.filter-panel > .d-flex { padding-bottom: 11px; border-bottom: 1px solid var(--eez-line); }.filter-panel .form-check { margin: 8px 0; }.filter-panel .form-check-label { color: #3c4a61; font-size: 10px !important; }.filter-panel .form-check-input { border-color: #c6d0dd; margin-top: .2em; }.filter-panel .form-check-input:checked { background-color: var(--eez-primary); border-color: var(--eez-primary); }.filter-title { display: flex; justify-content: space-between; align-items: center; padding-top: 8px; margin: 0 0 8px; font-size: 12px; }.filter-title i { font-size: 10px; }.duration-filter > div { display: flex; justify-content: space-between; color: var(--eez-muted); font-size: 9px; }.duration-filter input { width: 100%; accent-color: var(--eez-primary); }.duration-filter output { display: none; }.explore-layout .col-lg-9 > .d-flex { margin-bottom: 18px !important; }.explore-layout .form-select { border-color: #dbe4ef; border-radius: 6px; font-size: 10px; min-width: 120px; }.explore-layout .course-card { border: 1px solid #e6edf5 !important; box-shadow: 0 4px 13px #173d6b0d !important; }.explore-layout .course-card:hover { box-shadow: 0 10px 22px #1a56db1b !important; }.explore-layout .course-thumb { height: 126px; }.explore-layout .course-card .buy-now-btn { display: none; }.explore-layout .course-card .card-body { padding: 12px; }.explore-layout .course-card .card-body > .d-flex.gap-3 { font-size: 9px; gap: 8px !important; }.explore-layout .course-card .card-body > .d-flex.align-items-baseline { margin-bottom: 10px !important; }.explore-layout .course-card .btn { padding: 7px 5px; }.explore-layout .pagination .page-link { border-color: #e1e9f3; color: var(--eez-ink); border-radius: 5px; margin: 0 3px; font-size: 11px; }.explore-layout .pagination .active .page-link { background: var(--eez-primary); border-color: var(--eez-primary); color: #fff; }
@media (max-width: 991px) { .explore-hero-grid { grid-template-columns: 1fr; height: auto; padding-top: 25px; }.explore-hero-art { height: 235px; }.explore-hero { height: auto; }.filter-panel { margin-bottom: 10px; }.explore-layout .course-card .buy-now-btn { display: none; } }
@media (max-width: 575px) { .explore-hero h1 { font-size: 31px; }.explore-stats { gap: 10px; }.explore-stats span { grid-template-columns: 1fr; text-align: center; }.explore-stats i { margin: auto; }.explore-hero-art { transform: scale(.72); transform-origin: top left; width: 140%; margin-bottom: -55px; }.explore-layout .col-lg-9 > .d-flex { align-items: stretch !important; }.explore-layout .col-lg-9 > .d-flex form { width: 100%; justify-content: space-between; } }

.explore-hero-art { overflow: hidden; }
.explore-banner { display: block; width: 100%; height: 235px; object-fit: cover; object-position: right center; }
.course-details-buy-box { top: 100px !important; z-index: 10 !important; }
@media (max-width: 991px) { .course-details-buy-box { position: static !important; } }

/* About and contact pages */
.about-hero { overflow: hidden; background: linear-gradient(115deg, #f7fbff, #eef7ff 60%, #e7f5ff); }
.about-hero-grid { display: grid; grid-template-columns: 48% 52%; align-items: center; min-height: 420px; }
.about-hero-copy { padding: 55px 0; }
.about-hero-copy h1 { max-width: 560px; margin: 18px 0 14px; color: var(--eez-ink); font-size: clamp(2.3rem, 4vw, 3.7rem); line-height: 1.06; letter-spacing: -.055em; font-weight: 800; }
.about-hero-copy h1 span, .contact-hero h1 span { color: var(--eez-primary); }
.about-hero-copy p { max-width: 480px; color: var(--eez-muted); line-height: 1.7; margin-bottom: 22px; }
.about-hero-visual { position: relative; height: 420px; overflow: hidden; }
.about-hero-visual img { width: 100%; height: 100%; object-fit: cover; object-position: right center; mix-blend-mode: multiply; }
.about-visual-note { position: absolute; left: 28px; bottom: 38px; display: flex; gap: 10px; align-items: center; padding: 12px 15px; border: 1px solid #d8e6f5; border-radius: 10px; background: #ffffffed; box-shadow: 0 10px 25px #17518c18; }
.about-visual-note > i { color: #13a77d; font-size: 23px; }.about-visual-note strong, .about-visual-note small { display: block; }.about-visual-note strong { color: var(--eez-ink); font-size: 11px; }.about-visual-note small { color: var(--eez-muted); font-size: 9px; margin-top: 2px; }
.about-section { padding: 65px 0; }.about-intro { max-width: 650px; margin-bottom: 32px; }.section-kicker { color: var(--eez-primary); font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }.about-intro h2, .contact-info h2 { margin: 9px 0 10px; color: var(--eez-ink); font-size: clamp(1.7rem, 3vw, 2.35rem); letter-spacing: -.045em; }.about-intro p, .contact-info > p { max-width: 580px; color: var(--eez-muted); line-height: 1.7; }
.about-stats > div > div { height: 100%; padding: 20px; border: 1px solid #dfeaf5; border-radius: 12px; background: #fff; box-shadow: 0 5px 18px #17477909; }.about-stats strong { display: block; color: var(--eez-primary); font-size: 27px; letter-spacing: -.05em; }.about-stats span { display: block; color: var(--eez-muted); font-size: 10px; margin-top: 4px; }
.about-values { background: #f7fbff; }.value-card { height: 100%; padding: 26px; border: 1px solid #e1ebf5; border-radius: 14px; background: #fff; box-shadow: 0 5px 18px #17477909; }.value-card > i { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 18px; border-radius: 12px; color: #fff; background: linear-gradient(145deg, #1489e7, #1253cc); font-size: 21px; }.value-card h3 { color: var(--eez-ink); font-size: 15px; }.value-card p { color: var(--eez-muted); font-size: 11px; line-height: 1.65; margin: 0; }
.contact-hero { padding: 70px 0 62px; background: linear-gradient(115deg, #f7fbff, #edf7ff); }.contact-hero h1 { margin: 12px 0 10px; color: var(--eez-ink); font-size: clamp(2.2rem, 4vw, 3.5rem); line-height: 1.05; letter-spacing: -.055em; font-weight: 800; }.contact-hero p { max-width: 560px; color: var(--eez-muted); line-height: 1.7; }
.contact-section { padding: 58px 0 75px; }.contact-info { height: 100%; padding: 30px; border-radius: 14px; color: #fff; background: linear-gradient(145deg, #105bd5, #168bdc); box-shadow: 0 12px 28px #0e5cc52b; }.contact-info h2 { color: #fff; font-size: 26px; }.contact-info > p { color: #dcecff; font-size: 11px; }.contact-detail { display: flex; gap: 13px; align-items: center; margin-top: 24px; }.contact-detail > i { display: grid; place-items: center; flex: 0 0 37px; width: 37px; height: 37px; border-radius: 10px; color: #fff; background: #ffffff24; font-size: 16px; }.contact-detail small, .contact-detail strong { display: block; }.contact-detail small { color: #bfddff; font-size: 9px; margin-bottom: 3px; }.contact-detail strong { font-size: 11px; font-weight: 600; }
.contact-form { height: 100%; padding: 30px; border: 1px solid #e0eaf4; border-radius: 14px; background: #fff; box-shadow: 0 6px 22px #1747790b; }.contact-form .form-label { color: var(--eez-ink); font-size: 11px; font-weight: 700; }.contact-form .form-control { padding: 12px 13px; border-color: #d7e2ed; border-radius: 7px; font-size: 11px; }.contact-form .form-control:focus { border-color: var(--eez-primary); box-shadow: 0 0 0 3px #1a56db12; }.contact-success { margin-bottom: 18px; font-size: 11px; }
@media (max-width: 991px) { .about-hero-grid { grid-template-columns: 1fr; }.about-hero-copy { padding-bottom: 25px; }.about-hero-visual { height: 320px; }.contact-info { min-height: 0; } }
@media (max-width: 575px) { .about-hero-copy h1, .contact-hero h1 { font-size: 2.45rem; }.about-section { padding: 45px 0; }.about-hero-visual { height: 265px; }.about-visual-note { left: 12px; bottom: 18px; }.contact-hero { padding: 52px 0 45px; }.contact-section { padding: 38px 0 55px; }.contact-info, .contact-form { padding: 22px; } }

/* Full-width home banner with the hero content layered over the image. */
.home-hero { position: relative; min-height: 520px; background: #0b2348; }
.home-hero .hero-grid { position: relative; display: block; min-height: 520px; }
.home-hero .hero-copy { position: relative; z-index: 2; width: 52%; padding: 95px 0 55px; }
.home-hero .hero-art { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; overflow: hidden; }
.home-hero .hero-art::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 22, 52, .78) 0%, rgba(5, 22, 52, .38) 43%, rgba(5, 22, 52, .05) 74%); }
.home-hero .hero-banner { width: 100%; max-width: none; height: 100%; object-fit: cover; object-position: center; }
.home-hero .eyebrow { color: #d9edff; background: #ffffff1c; border: 1px solid #ffffff40; }
.home-hero .hero-copy h1 { color: #fff; }
.home-hero .hero-copy h1 span { color: #63c3ff; }
.home-hero .hero-copy > p { color: #e4effd; }
.home-hero .hero-stats > div { border-color: #ffffff55; }
.home-hero .hero-stats strong, .home-hero .hero-stats small { color: #fff; }
.home-hero .hero-stats i { color: #fff; background: #ffffff24; }
.home-hero .hero-stats > div { min-height: 62px; padding: 0 14px; align-content: start; }
.home-hero .hero-stats > div:first-child { padding-left: 0; }
.home-hero .hero-stats i { margin-top: 2px; }
@media (max-width: 991px) { .home-hero, .home-hero .hero-grid { min-height: 610px; }.home-hero .hero-copy { width: 70%; padding-top: 70px; }.home-hero .hero-art { transform: none; margin: 0; width: 100%; } }
@media (max-width: 575px) { .home-hero, .home-hero .hero-grid { min-height: 700px; }.home-hero .hero-copy { width: 100%; padding: 55px 0 35px; }.home-hero .hero-art { height: 100%; }.home-hero .hero-banner { object-position: 62% center; }.home-hero .hero-stats { max-width: 100%; }.home-hero .hero-stats > div { min-height: 0; padding: 0 5px; } }

/* Slightly larger explore controls and course cards */
.explore-layout .filter-panel .form-check-label { font-size: 11px !important; }
.explore-layout .filter-title { font-size: 13px; }
.explore-layout .course-thumb { height: 155px; }
.explore-layout .course-card .card-body { padding: 15px; }
.explore-layout .course-card h6 { font-size: 14px; line-height: 1.35; }
.explore-layout .course-card p { font-size: 11px !important; line-height: 1.5; }
.explore-layout .course-card .card-body > .d-flex.gap-3 { font-size: 10px; }
.explore-layout .course-card .btn { padding: 8px 6px; font-size: 11px; }

/* Shared header typography and spacing */
html { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
.navbar .container { max-width: 1180px; }
.navbar-brand { gap: 9px !important; font-size: 1.45rem !important; font-weight: 800 !important; letter-spacing: -.055em; }
.navbar-brand i { width: 32px; height: 32px; display: inline-grid; place-items: center; padding: 0; border-radius: 8px; box-shadow: 0 5px 12px rgba(26, 86, 219, .2); }
.navbar-collapse { align-items: center; }
.navbar-nav.mx-auto { gap: 9px !important; }
.navbar .nav-link { position: relative; display: inline-flex; align-items: center; gap: 5px; min-height: 58px; color: #17233c; font-size: 12px; font-weight: 600; letter-spacing: -.01em; }
.navbar .nav-link:hover { color: var(--eez-primary) !important; }
.navbar .nav-link.active { color: var(--eez-primary) !important; font-weight: 700 !important; }
.navbar .nav-link.active { border-bottom: 0 !important; }
.navbar .nav-link.active:after { content: ''; position: absolute; left: 12px; right: 12px; bottom: 7px; height: 2px; border-radius: 3px; background: var(--eez-primary); }
.navbar .dropdown-toggle:after { margin-left: 2px; font-size: 9px; }
.navbar .navbar-nav.align-items-lg-center .nav-link { min-height: 40px; padding-left: 8px !important; padding-right: 8px !important; }
.navbar .navbar-nav.align-items-lg-center .nav-link:after { display: none; }
.navbar .btn-primary { border-radius: 6px; padding: 9px 20px !important; font-size: 11px; font-weight: 700; box-shadow: 0 5px 12px rgba(26, 86, 219, .2); }
.navbar .bi-cart3 { font-size: 22px !important; }
.cart-nav .nav-link { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; padding: 0 !important; color: var(--eez-ink); border: 1px solid #d9e5f2; border-radius: 8px; background: #fff; }
.cart-nav .nav-link:hover { color: var(--eez-primary) !important; border-color: #9fc2ef; background: #f5f9ff; }
.cart-nav .badge { font-size: .7rem !important; }
.dropdown-menu { border-radius: 8px; padding: 7px; }.dropdown-item { border-radius: 5px; font-size: 11px; padding: 8px 10px; }
@media (max-width: 991px) { .navbar .nav-link { min-height: 42px; }.navbar .nav-link.active:after { display: none; }.navbar-nav.mx-auto { gap: 0 !important; }.navbar .navbar-nav.align-items-lg-center .nav-link { min-height: 42px; } }

/* Readable type scale used consistently across every page */
body { font-size: 15px; }
p { font-size: 14px; }
h1 { font-size: 2.35rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.4rem; }
h4 { font-size: 1.25rem; }
h5, h6 { font-size: 1.05rem; }
.small, small { font-size: .82rem !important; }
.btn { font-size: .88rem; }
.form-control, .form-select, .form-check-label, .input-group-text { font-size: .88rem; }
.navbar .nav-link { font-size: 13px; }
.navbar .navbar-brand { font-size: 1.55rem !important; }
footer { font-size: 13px; }
footer p, footer li, footer a, footer .small { font-size: 12px !important; line-height: 1.65; }
footer h4 { font-size: 1.35rem; }
footer h6 { font-size: 1rem; }
.course-card h6 { font-size: 14px; }
.course-card p { font-size: 12px !important; }

/* Extend only the image layer to the viewport edges. */
.home-hero .hero-art { left: 50%; right: auto; width: 100vw; transform: translateX(-50%); }

/* Use readable, responsive paragraph sizing throughout the pages. */
p { font-size: clamp(.9rem, 1vw, 1rem) !important; line-height: 1.6; }
.category-tile p, .section-heading p, .testimonial-grid p, .cta-grid p { font-size: clamp(.9rem, 1vw, 1rem) !important; line-height: 1.55; }

/* Refined typography and positioning for the full-width home banner. */
.home-hero .hero-copy { width: 50%; transform: translateX(-28px); }
.home-hero .hero-copy h1 {  font-size: clamp(2.8rem, 4.8vw, 4.2rem); line-height: 1.08; letter-spacing: -.03em; font-weight: 800; }
.home-hero .hero-copy > p { max-width: 510px; font-family:  'Poppins', sans-serif; font-size: clamp(1rem, 1.25vw, 1.15rem) !important; line-height: 1.65; letter-spacing: 0; }
.home-hero .eyebrow { font-size: 12px; }
.home-hero .hero-actions .btn { font-size: 14px; }

@media (max-width: 991px) { .home-hero .hero-copy { width: 70%; transform: translateX(-15px); } }
@media (max-width: 575px) { .home-hero .hero-copy { width: 100%; transform: none; }.home-hero .hero-copy h1 { font-size: 2.75rem; }.home-hero .hero-copy > p { font-size: 1rem !important; } }

/* Login page */
.login-hero { min-height: 930px; overflow: hidden; background: linear-gradient(120deg, #f7fbff, #eef5ff 72%, #e8f4ff); }.login-grid { display: grid; grid-template-columns: 48% 52%; align-items: center; min-height: 930px; }.login-welcome { padding-top: 25px; }.login-welcome h1 { margin: 20px 0 13px; font-size: 48px; line-height: 1.04; letter-spacing: -.05em; font-weight: 800; }.login-welcome h1 span { color: var(--eez-primary); }.login-welcome > p { max-width: 390px; color: #43516b; line-height: 1.75; }.login-art { position: relative; height: 355px; margin: 15px 0 16px -40px; }.login-orb { position: absolute; width: 390px; height: 290px; left: 15px; bottom: 15px; border-radius: 50%; background: radial-gradient(circle at 50% 30%, #d9edff, #b4dcfb); opacity: .8; }.login-laptop { position: absolute; z-index: 1; left: 38px; top: 54px; width: 330px; transform: rotate(-4deg); }.login-screen { height: 190px; border: 7px solid #12263a; border-radius: 11px 11px 4px 4px; padding: 9px; background: #fff; box-shadow: 0 14px 20px #5b789055; }.login-screen > b { display: block; color: #1663d6; font-size: 7px; }.login-screen > b span { color: #18a9e0; }.login-screen > div { height: 120px; display: grid; place-items: center; margin-top: 7px; background: linear-gradient(140deg, #17384b, #37809c); color: #fff; }.login-screen > div i { font-size: 28px; }.login-screen > small { color: #1c2d49; font-size: 7px; }.login-laptop > em { display: block; width: 375px; height: 12px; margin-left: -23px; border-radius: 2px 2px 50% 50%; background: #b7c5cc; }.login-certificate { position: absolute; z-index: 2; left: 275px; bottom: 32px; display: grid; place-items: center; width: 100px; height: 130px; padding: 10px; border: 4px solid #dce7f0; background: #fff; color: #1c355d; transform: rotate(6deg); box-shadow: 0 8px 16px #496d8b44; }.login-certificate i { color: #e4a52a; font-size: 29px; }.login-certificate b, .login-certificate small { display: block; font-size: 9px; }.login-certificate small { color: #697890; font-size: 7px; }.book-stack { position: absolute; z-index: 0; left: 295px; bottom: 19px; display: grid; gap: 1px; }.book-stack b { width: 130px; padding: 7px 5px; color: #fff; background: #2061a5; font-size: 8px; }.book-stack b:nth-child(2) { background: #1a83a1; }.book-stack b:nth-child(3) { background: #e88b18; }.login-benefits { display: grid; grid-template-columns: repeat(4, 1fr); max-width: 420px; text-align: center; }.login-benefits span { display: grid; justify-items: center; gap: 7px; color: #142544; font-size: 10px; }.login-benefits i { color: #0871ec; font-size: 24px; }.login-benefits b { font-size: 10px; line-height: 1.35; }.login-card { width: 100%; max-width: 440px; justify-self: end; padding: 40px 32px; background: #fff; border-radius: 24px; box-shadow: 0 8px 26px #5178a51c; }.login-tabs { display: grid; grid-template-columns: 1fr 1fr; border-bottom: 1px solid #dbe3ed; margin-bottom: 34px; }.login-tabs button, .login-tabs a { padding: 13px 0; border: 0; background: transparent; color: #0c1731; text-align: center; font-size: 16px; font-weight: 700; }.login-tabs button.active { color: var(--eez-primary); border-bottom: 3px solid var(--eez-primary); margin-bottom: -2px; }.login-tabs a:hover { color: var(--eez-primary); }.login-field { margin-bottom: 26px; }.login-field label { display: block; margin-bottom: 10px; color: #0c1731; font-size: 13px; font-weight: 700; }.login-input { display: flex; align-items: center; gap: 10px; min-height: 54px; padding: 0 13px; border: 1px solid #cbd6e3; border-radius: 7px; }.login-input:focus-within { border-color: var(--eez-primary); box-shadow: 0 0 0 3px #1a56db12; }.login-input > i, .login-input .toggle-password { color: #7789a3; }.login-input input { flex: 1; min-width: 0; border: 0; outline: 0; color: #182844; font: inherit; font-size: 13px; }.login-input input::placeholder { color: #8a98ac; }.login-options { display: flex; justify-content: space-between; align-items: center; margin: -5px 0 27px; font-size: 12px; }.login-options label { color: #42516a; }.login-options input { width: 17px; height: 17px; vertical-align: -4px; accent-color: var(--eez-primary); }.login-options a, .login-register a { color: var(--eez-primary); font-weight: 700; }.login-submit, .google-login { width: 100%; min-height: 55px; border-radius: 7px; font: inherit; font-size: 14px; font-weight: 700; }.login-submit { border: 0; color: #fff; background: linear-gradient(100deg, #116be7, #1453d6); box-shadow: 0 7px 15px #1a56db26; }.login-divider { display: flex; align-items: center; gap: 14px; margin: 23px 0; color: #68768b; font-size: 12px; }.login-divider:before, .login-divider:after { content: ''; height: 1px; flex: 1; background: #e0e6ee; }.google-login { border: 1px solid #b9c9dc; background: #fff; color: #101c35; }.google-login b { color: #4285f4; font-size: 20px; margin-right: 9px; }.login-register { margin: 30px 0 0; text-align: center; color: #66758c; font-size: 12px; }.login-why { padding: 31px 0 38px; background: #f5f9ff; }.login-why .container { padding: 30px 25px; border-radius: 15px; background: #fff; box-shadow: 0 6px 22px #496d8b12; }.login-why h2 { margin: 0 0 24px; text-align: center; font-size: 21px; }.login-why .container > div { display: grid; grid-template-columns: repeat(4, 1fr); }.login-why span { display: grid; grid-template-columns: 47px 1fr; column-gap: 11px; padding: 0 18px; border-right: 1px solid #e1e8f1; }.login-why span:last-child { border: 0; }.login-why i { grid-row: span 2; width: 43px; height: 43px; line-height: 43px; text-align: center; border-radius: 12px; color: var(--eez-primary); background: #eaf4ff; font-size: 21px; }.login-why b, .login-why small { display: block; }.login-why b { font-size: 11px; }.login-why small { color: #64728a; font-size: 10px; line-height: 1.5; margin-top: 4px; }
@media (max-width: 991px) { .login-hero { min-height: auto; }.login-grid { grid-template-columns: 1fr; min-height: auto; padding: 42px 0; }.login-welcome { text-align: center; }.login-welcome > p { margin-right: auto; margin-left: auto; }.login-art { margin-left: 0; }.login-benefits { margin: auto; }.login-card { justify-self: center; margin-top: 40px; }.login-why .container > div { grid-template-columns: repeat(2, 1fr); gap: 22px; }.login-why span:nth-child(2) { border: 0; } }
@media (max-width: 575px) { .login-welcome h1 { font-size: 40px; }.login-art { transform: scale(.78); transform-origin: top center; height: 285px; margin-bottom: -28px; }.login-benefits { gap: 8px; }.login-card { padding: 28px 20px; border-radius: 16px; }.login-why .container > div { grid-template-columns: 1fr; }.login-why span { border: 0; } }

/* Cart page */
.cart-hero { min-height: 225px; overflow: hidden; background: linear-gradient(105deg, #fbfdff 15%, #fff 62%, #eaf8ff); }.cart-hero-grid { display: grid; grid-template-columns: 55% 45%; align-items: center; min-height: 225px; }.cart-hero h1 { margin: 30px 0 8px; font-size: 47px; letter-spacing: -.05em; font-weight: 800; }.cart-hero p { color: #53627c; font-size: 13px; }.cart-hero-art { position: relative; height: 225px; }.cart-hero-art:before { content: ''; position: absolute; width: 380px; height: 280px; top: -28px; left: 15px; border-radius: 50%; background: radial-gradient(circle at 45% 35%, #c6e7ff, #8adbf0); opacity: .8; }.cart-hero-art:after { content: ''; position: absolute; top: 26px; left: 13px; width: 70px; height: 80px; background-image: radial-gradient(#7fbfff 1.5px, transparent 1.5px); background-size: 10px 10px; }.cart-hero-art i { position: absolute; z-index: 1; top: 48px; left: 175px; color: #0f79e7; font-size: 108px; transform: rotate(-8deg); filter: drop-shadow(8px 11px 4px #1875b244); }.cart-shell { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 22px; padding-top: 0; }.cart-list { overflow: hidden; border: 1px solid var(--eez-line); border-radius: 11px; background: #fff; }.cart-list-head { display: grid; grid-template-columns: minmax(230px, 2.5fr) 1fr 1fr .55fr .9fr .7fr; padding: 23px 20px 14px; color: #182743; font-size: 12px; }.cart-items { padding: 0 7px; }.cart-item { display: grid; grid-template-columns: minmax(230px, 2.5fr) 1fr 1fr .55fr .9fr .7fr; align-items: center; min-height: 175px; padding: 18px 13px; border-top: 1px solid #edf1f6; color: #14213b; }.cart-course { display: flex; align-items: center; gap: 14px; min-width: 0; }.cart-course img { width: 140px; height: 125px; flex: 0 0 140px; object-fit: cover; border-radius: 9px; }.cart-course strong, .cart-course small, .cart-course em { display: block; }.cart-course strong { font-size: 15px; line-height: 1.25; }.cart-course small { max-width: 165px; margin: 12px 0; color: #60708b; font-size: 10px; line-height: 1.65; }.cart-course em { width: max-content; padding: 6px 9px; border-radius: 5px; color: #1467dd; background: #edf5ff; font-size: 10px; font-style: normal; }.cart-mode, .cart-duration, .cart-qty { font-size: 11px; line-height: 1.5; }.cart-mode i, .cart-duration i { display: inline-block; margin-right: 7px; color: #1a4a8d; font-size: 17px; }.cart-price { color: #075dd4; font-size: 16px; }.cart-remove { border: 0; background: transparent; color: #e5454f; font-size: 11px; }.cart-remove i { display: block; font-size: 17px; }.coupon-panel { display: flex; align-items: center; gap: 17px; margin-top: 30px; padding: 23px; border: 1px solid #bcd8ff; border-radius: 11px; background: #fbfdff; }.coupon-panel > i { display: grid; place-items: center; flex: 0 0 44px; width: 44px; height: 55px; color: #fff; background: #126ae3; border-radius: 50%; font-size: 25px; }.coupon-panel h3 { margin: 0 0 5px; font-size: 15px; }.coupon-panel p { margin: 0; color: #65738a; font-size: 10px; }.coupon-panel form { display: flex; margin-left: auto; }.coupon-panel input { width: 180px; padding: 12px; border: 1px solid #dce5f0; border-radius: 6px 0 0 6px; outline: 0; font: inherit; font-size: 11px; }.coupon-panel button { width: 100px; border: 1px solid var(--eez-primary); border-radius: 0 6px 6px 0; background: #fff; color: var(--eez-primary); font-size: 11px; font-weight: 700; }.summary-card { border: 1px solid #dae5f0; border-radius: 14px; padding: 25px 16px 0; background: #fff; box-shadow: 0 4px 14px #173d6b0b; }.summary-card h2 { display: flex; gap: 9px; align-items: center; margin: 0 0 28px; font-size: 16px; }.summary-card h2 i { color: var(--eez-primary); font-size: 25px; }.summary-row, .summary-total { display: flex; justify-content: space-between; margin-bottom: 25px; color: #5a6880; font-size: 11px; }.summary-row > span:last-child { color: #182743; }.summary-row.discount > span:last-child { color: #0da86b; font-weight: 700; }.summary-card hr { border-color: #e4eaf2; }.summary-total { align-items: center; margin: 25px 0; color: #14213b; font-size: 13px; }.summary-total strong { color: var(--eez-primary); font-size: 21px; }.saving-note { padding: 13px 8px; border: 1px solid #abe9d0; border-radius: 7px; color: #0b9863; background: #eafbf4; font-size: 10px; text-align: center; }.summary-checkout { display: flex; justify-content: center; gap: 8px; align-items: center; margin: 25px -1px 20px; padding: 17px 5px; border-radius: 7px; color: #fff; background: linear-gradient(100deg, #116be7, #1453d6); font-size: 11px; font-weight: 700; }.secure-note { display: flex; gap: 9px; margin: 0 -16px; padding: 22px 16px; border-top: 1px solid #e4eaf2; }.secure-note > i { color: var(--eez-primary); font-size: 23px; }.secure-note b, .secure-note small { display: block; }.secure-note b { font-size: 11px; }.secure-note small { margin-top: 5px; color: #64728a; font-size: 9px; line-height: 1.45; }.cart-trust { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin: 55px -5px 35px; padding: 25px 10px; border: 1px solid var(--eez-line); border-radius: 12px; }.cart-trust span { display: grid; grid-template-columns: 45px 1fr; column-gap: 11px; padding: 0 14px; border-right: 1px solid var(--eez-line); }.cart-trust span:last-child { border: 0; }.cart-trust i { grid-row: span 2; width: 42px; height: 48px; line-height: 48px; text-align: center; color: var(--eez-primary); background: #edf5ff; border-radius: 11px; font-size: 21px; }.cart-trust b, .cart-trust small { display: block; }.cart-trust b { font-size: 11px; }.cart-trust small { margin-top: 4px; color: #65738b; font-size: 9px; line-height: 1.45; }
@media (max-width: 991px) { .cart-hero-grid { grid-template-columns: 1fr; }.cart-hero-art { height: 180px; }.cart-shell { grid-template-columns: 1fr; }.cart-list-head { display: none; }.cart-item { grid-template-columns: minmax(220px, 2fr) 1fr 1fr .6fr .9fr .7fr; }.cart-trust { grid-template-columns: repeat(2, 1fr); }.cart-trust span:nth-child(2) { border: 0; } }
@media (max-width: 700px) { .cart-item { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 18px 8px; }.cart-course { grid-column: span 2; }.cart-course img { width: 110px; height: 100px; flex-basis: 110px; }.cart-course strong { font-size: 13px; }.cart-mode, .cart-duration, .cart-qty, .cart-price, .cart-remove { align-self: start; }.coupon-panel { flex-wrap: wrap; }.coupon-panel form { width: 100%; margin-left: 0; }.coupon-panel input { flex: 1; width: auto; }.cart-trust { grid-template-columns: 1fr; }.cart-trust span { border: 0; } }
.cart-shell > .col-lg-8, .cart-shell > .col-lg-4 { width: auto; }
.login-tabs a.active { color: var(--eez-primary); border-bottom: 3px solid var(--eez-primary); margin-bottom: -2px; }
.checkout-page .checkout-steps { width: 310px; max-width: 100%; margin: 4px auto 28px !important; }
.checkout-steps .step-circle.active { color: #fff !important; }
.checkout-steps { position: relative; gap: 78px !important; max-width: 310px; margin: 4px auto 28px !important; }
.checkout-steps .step-circle { position: relative; z-index: 1; }
.checkout-steps .step-circle:not(:last-child)::after { content: ''; position: absolute; z-index: -1; top: 50%; left: calc(100% + 1px); width: 78px; border-top: 1px dashed #8394ad; }
@media (max-width: 575px) { .checkout-steps { gap: 48px !important; max-width: 240px; }.checkout-steps .step-circle:not(:last-child)::after { width: 48px; } }
.login-required-modal .modal-content { border-radius: 16px; box-shadow: 0 18px 50px rgba(7, 23, 53, .18); }.login-modal-icon { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; color: var(--eez-primary); background: #eaf4ff; font-size: 24px; }.login-required-modal h5 { color: var(--eez-ink); font-weight: 700; }.login-required-modal .btn-primary { padding: 11px; font-size: 13px; font-weight: 700; }

/* Checkout and enrollment completion pages */
.checkout-page, .success-page { background: #fff; color: var(--eez-ink); }.checkout-page > .container, .success-page > .container { max-width: 1180px; }.checkout-page h1 { font-size: 42px; letter-spacing: -.05em; }.checkout-steps { margin: 4px 0 28px !important; }.checkout-steps .step-circle { width: 38px; height: 38px; border: 1px solid #cfdae8; background: #fff; color: #60718a; }.checkout-steps .step-circle.active { background: var(--eez-primary); border-color: var(--eez-primary); }.checkout-security { border: 1px solid #b8d5ff; border-radius: 10px; padding: 15px 18px; color: #135bd0; background: #f4f8ff; font-size: 12px; }.checkout-security .badge { padding: 9px 15px; color: #67758a !important; }.checkout-card, .checkout-summary { border: 1px solid #e4ebf4 !important; border-radius: 13px !important; box-shadow: 0 5px 17px #173d6b0b !important; }.checkout-card .card-body, .checkout-summary .card-body { padding: 22px; }.checkout-card h6 { font-size: 16px; }.checkout-card .form-label { font-size: 12px; color: #26354e; }.checkout-card .form-control { min-height: 45px; border-color: #d5dfeb; border-radius: 8px; font-size: 12px; }.payment-card .list-group { gap: 9px; }.payment-card .list-group-item { border: 1px solid #e1e8f1; border-radius: 9px; padding: 13px; font-size: 12px; }.payment-card .list-group-item:has(input:checked) { border-color: #4d8cff; box-shadow: inset 0 0 0 1px #4d8cff; }.payment-card .list-group-item i { color: var(--eez-primary); }.payment-card .badge { font-size: 9px; }.checkout-summary { top: 90px; }.checkout-summary h6 { font-size: 17px; }.checkout-summary .btn { min-height: 52px; font-size: 13px; font-weight: 700; }.success-page { background: radial-gradient(circle at 85% 20%, #f3fbff, transparent 28%), #fff; }.success-page > .container { padding-top: 25px !important; }.success-heading { max-width: 700px; margin: 46px auto 20px; }.success-check { width: 86px !important; height: 86px !important; background: #16bc8f !important; box-shadow: 0 0 0 13px #e2f9f0; }.success-heading h2 { font-size: 30px; margin-top: 7px; color: var(--eez-ink) !important; }.success-heading h2:first-letter { color: #10ae82; }.success-heading p { max-width: 590px; margin: 0 auto; font-size: 12px; line-height: 1.6; }.success-details { max-width: 820px !important; padding: 15px 24px; border-radius: 14px !important; }.success-details .card-body { padding: 0; }.success-details .d-flex { min-height: 43px; align-items: center; border-color: #edf1f6 !important; font-size: 12px; }.success-details .d-flex > span:first-child { display: flex; gap: 10px; align-items: center; min-width: 215px; color: #334764 !important; }.success-details .d-flex > span:first-child i { display: grid; place-items: center; width: 25px; height: 25px; border-radius: 50%; color: var(--eez-primary); background: #eef5ff; }.success-actions .btn { min-width: 190px; padding: 12px 18px; font-size: 12px; font-weight: 700; }.next-steps { border-radius: 13px !important; }.next-steps .card-body { padding: 25px 28px; }.next-steps h5 { font-size: 19px; }.next-steps .col-md-4 { padding: 0 25px; border-right: 1px solid #e2eaf2; }.next-steps .col-md-4:last-child { border: 0; }.next-steps i { display: inline-grid; place-items: center; width: 53px; height: 53px; border-radius: 50%; background: #edf5ff; font-size: 28px; }.next-steps h6 { font-size: 13px; margin-top: 12px; }.next-steps p { font-size: 11px; line-height: 1.55; }.next-steps a, .recommended-heading a { font-size: 11px; color: var(--eez-primary); font-weight: 700; }.recommended-heading { display: flex; justify-content: space-between; align-items: center; }.recommended-heading h5 { font-size: 18px; }.success-page .course-card { box-shadow: 0 4px 14px #173d6b10 !important; }.success-page .course-card .buy-now-btn { display: none; }.success-page .course-card .card-body { padding: 13px; }.success-page .course-card h6 { font-size: 13px; }.success-page .course-thumb { height: 135px; }
@media (min-width: 992px) { .success-page .row.g-4 > .col-md-6 { width: 25%; } }
@media (max-width: 991px) { .checkout-summary { position: static !important; }.cart-shell { grid-template-columns: 1fr; }.success-details { max-width: 100% !important; } }
@media (max-width: 575px) { .checkout-page h1 { font-size: 34px; }.checkout-security { gap: 12px; align-items: flex-start !important; }.checkout-security .badge { display: none; }.success-heading { margin-top: 30px; }.success-heading h2 { font-size: 24px; }.success-details { padding: 8px 12px; }.success-details .d-flex { align-items: flex-start; flex-direction: column; gap: 4px; padding: 11px 0 !important; }.success-details .d-flex > span:first-child { min-width: 0; }.next-steps .col-md-4 { border: 0; padding: 14px; }.success-actions { flex-wrap: wrap; }.recommended-heading { margin-top: 15px; } }
p{
  font-size:25px;
}