:root {
  --navy: #0f2c59;
  --navy-deep: #081d3a;
  --emerald: #10b981;
  --gold: #f59e0b;
  --paper: #f7f9fb;
  --white: #ffffff;
  --ink: #12243b;
  --muted: #68798f;
  --line: #dbe4eb;
  --soft-blue: #eaf1f7;
  --sans: 'DM Sans', sans-serif;
  --display: 'Manrope', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 400 15px/1.6 var(--sans); }
body::before { content: ''; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .38; background-image: linear-gradient(rgba(15,44,89,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(15,44,89,.035) 1px, transparent 1px); background-size: 40px 40px; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }

.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid rgba(219,228,235,.86); background: rgba(247,249,251,.9); backdrop-filter: blur(18px); }
.nav-shell { display: flex; align-items: center; justify-content: space-between; width: min(100%, 1240px); min-height: 76px; margin: auto; padding: 0 28px; }
.brand { display: flex; align-items: center; width: 190px; color: var(--navy); }
.brand img, .brand-fallback { display: block; width: 180px; height: 50px; object-fit: contain; object-position: left center; }
.nav-menu { display: flex; align-items: center; gap: 27px; color: #52657c; font-size: 12px; font-weight: 700; }
.nav-menu a:not(.button) { transition: color .2s ease; }
.nav-menu a:not(.button):hover { color: var(--navy); }
.menu-toggle { display: none; border: 0; color: var(--navy); background: transparent; font-weight: 700; cursor: pointer; }

.button { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 0 21px; border: 1px solid var(--emerald); border-radius: 2px; color: #052d24; background: var(--emerald); box-shadow: 0 11px 24px rgba(16,185,129,.15); font-weight: 700; transition: transform .2s ease, background .2s ease, box-shadow .2s ease; }
.button:hover { background: #0da874; box-shadow: 0 15px 28px rgba(16,185,129,.23); transform: translateY(-2px); }
.button svg, .text-button svg, .program-row > svg { width: 16px; height: 16px; stroke-width: 2.2; }
.button-small { min-height: 40px; padding: 0 15px; font-size: 11px; }

.hero { display: grid; grid-template-columns: minmax(0, .94fr) minmax(470px, 1.06fr); gap: clamp(35px, 6vw, 90px); align-items: center; width: min(100%, 1240px); min-height: 625px; margin: auto; padding: 76px 28px 86px; }
.hero-copy { position: relative; z-index: 2; max-width: 590px; }
.eyebrow, .section-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 19px; color: var(--emerald); font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.eyebrow-mark { width: 26px; height: 2px; background: var(--emerald); }
h1, h2, h3, p { margin-top: 0; }
h1 { max-width: 610px; margin-bottom: 24px; color: var(--navy); font: 800 clamp(43px, 5vw, 72px)/1.04 var(--display); letter-spacing: -.055em; }
h1 em, h2 em { color: var(--emerald); font-style: normal; }
.hero-lede { max-width: 500px; margin-bottom: 31px; color: var(--muted); font-size: 16px; line-height: 1.75; }
.hero-actions { display: flex; align-items: center; gap: 28px; margin-bottom: 42px; }
.text-button { display: inline-flex; align-items: center; gap: 9px; padding-bottom: 4px; border-bottom: 1px solid #a7b4c2; color: var(--navy); font-size: 12px; font-weight: 700; }
.text-button svg { color: var(--emerald); }
.trust-line { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 11px; }
.trust-line p { margin: 0; }.trust-line strong { color: var(--navy); }
.avatar-stack { display: flex; }.avatar-stack span { display: grid; place-items: center; width: 27px; height: 27px; margin-left: -6px; border: 2px solid var(--paper); border-radius: 50%; color: #fff; background: var(--navy); font-size: 9px; }.avatar-stack span:first-child { margin-left: 0; background: #ca8964; }.avatar-stack span:last-child { background: var(--emerald); }

.hero-visual { position: relative; display: flex; align-items: center; justify-content: center; min-height: 505px; overflow: visible; border-radius: 4px; background: url('https://images.unsplash.com/photo-1576091160399-112ba8d25d1d?auto=format&fit=crop&w=1400&q=88') center/cover; box-shadow: 0 26px 60px rgba(15,44,89,.17); }
.hero-visual::before { content: ''; position: absolute; inset: 0; border-radius: 4px; background: linear-gradient(135deg, rgba(8,29,58,.92) 0%, rgba(15,44,89,.57) 52%, rgba(15,44,89,.15) 100%); }
.visual-orbit { display: none; }
.prep-card { position: relative; z-index: 1; width: min(82%, 445px); margin-top: 24px; padding: 24px 25px 21px; border: 1px solid rgba(255,255,255,.5); border-radius: 3px; background: rgba(255,255,255,.94); box-shadow: 0 25px 55px rgba(0,0,0,.22); }
.card-topline { color: var(--muted); font-size: 10px; font-weight: 700; }.card-topline svg { width: 15px; height: 15px; vertical-align: middle; }.live-dot, .pulse-dot { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; background: var(--emerald); box-shadow: 0 0 0 4px var(--mint); }.card-menu { float: right; color: #9eacba; }.score-row { display: flex; align-items: end; justify-content: space-between; margin-top: 25px; }.muted-label { display: block; color: var(--muted); font-size: 10px; }.score-row strong { display: block; margin-top: 3px; color: var(--navy); font: 800 43px/.95 var(--display); letter-spacing: -.05em; }.score-row strong span { color: var(--emerald); font-size: 23px; }.score-delta { color: var(--emerald); font-size: 11px; font-weight: 700; }.score-delta small { display: block; margin-top: 3px; color: var(--muted); font-size: 9px; font-weight: 400; }.chart { position: relative; height: 135px; margin-top: 19px; }.chart-grid { position: absolute; inset: 0; background: repeating-linear-gradient(to bottom, transparent 0, transparent 33px, #e8eef2 34px); }.chart svg { position: absolute; width: 100%; height: 100%; overflow: visible; }.chart-labels { display: flex; justify-content: space-between; color: #9aa9b8; font-size: 9px; }.card-divider { height: 1px; margin: 18px 0 15px; background: var(--line); }.next-test { display: flex; align-items: center; gap: 11px; }.test-icon { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; color: var(--emerald); background: var(--mint); }.test-icon svg { width: 14px; height: 14px; }.next-test strong, .next-test span { display: block; font-size: 10px; }.next-test span { margin-top: 2px; color: var(--muted); font-size: 9px; }.next-test .arrow { margin-left: auto; color: var(--navy); }.next-test .arrow svg { width: 16px; height: 16px; }
.countdown-card { position: absolute; z-index: 2; top: 24px; right: 25px; padding: 11px 13px; border: 1px solid rgba(245,158,11,.55); border-radius: 2px; color: #fff; background: rgba(8,29,58,.92); box-shadow: 0 12px 22px rgba(0,0,0,.16); }.countdown-label { display: block; color: var(--gold); font-size: 8px; font-weight: 700; letter-spacing: .15em; }.countdown-card strong { display: block; margin-top: 3px; font: 800 14px var(--display); }.countdown-card small { display: block; margin-top: 2px; color: #b8c7d8; font-size: 8px; }.floating-badge { position: absolute; z-index: 2; display: flex; align-items: center; gap: 9px; padding: 10px 12px; border: 1px solid rgba(255,255,255,.65); border-radius: 2px; background: rgba(255,255,255,.95); box-shadow: 0 13px 25px rgba(0,0,0,.15); }.floating-badge > span { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; color: var(--emerald); background: var(--mint); }.floating-badge > span svg { width: 13px; height: 13px; }.floating-badge strong, .floating-badge small { display: block; line-height: 1.2; }.floating-badge strong { color: var(--navy); font-size: 10px; }.floating-badge small { margin-top: 3px; color: var(--muted); font-size: 8px; }.badge-success { top: 67px; left: -22px; }.badge-location { right: -21px; bottom: 50px; }.badge-location > span { color: var(--navy); background: var(--soft-blue); }.visual-caption { position: absolute; z-index: 2; right: 27px; bottom: 20px; color: rgba(255,255,255,.9); font-size: 10px; letter-spacing: .04em; }.visual-action { border: 0; background: transparent; cursor: pointer; font: inherit; }.visual-action svg { width: 13px; height: 13px; margin-left: 4px; vertical-align: middle; color: var(--emerald); }

.proof-strip { display: grid; grid-template-columns: 1.15fr 1fr 1fr 1fr; gap: 28px; width: min(100%, 1240px); margin: auto; padding: 54px 28px 58px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.proof-heading .section-kicker { margin-bottom: 14px; }.proof-heading h2, .bottom-section h2, .program-copy h2, .results-section h2, .registration-band h2 { margin-bottom: 0; color: var(--navy); font: 800 25px/1.17 var(--display); letter-spacing: -.045em; }.proof-item { display: flex; gap: 13px; padding-top: 27px; }.proof-icon { display: grid; place-items: center; flex: 0 0 31px; height: 31px; border-radius: 50%; color: var(--emerald); background: var(--mint); }.proof-icon svg { width: 15px; height: 15px; }.proof-item h3 { margin: 1px 0 6px; color: var(--navy); font: 700 12px/1.25 var(--display); }.proof-item p { max-width: 150px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.5; }
.programs-section { display: grid; grid-template-columns: minmax(340px, .9fr) minmax(420px, 1fr); gap: clamp(55px, 8vw, 115px); align-items: center; width: min(100%, 1240px); margin: auto; padding: 104px 28px; }.program-image { position: relative; min-height: 500px; }.program-image::after { content: ''; position: absolute; right: -16px; bottom: -16px; z-index: -1; width: 76%; height: 75%; background: var(--mint); }.program-image img { display: block; width: 100%; height: 500px; object-fit: cover; filter: saturate(.75) contrast(1.02); }.image-note { position: absolute; right: -29px; bottom: 25px; display: flex; align-items: center; gap: 11px; width: 202px; padding: 15px; color: #fff; background: var(--navy); box-shadow: 0 17px 32px rgba(15,44,89,.2); }.image-note svg { flex: 0 0 20px; color: var(--emerald); }.image-note strong, .image-note small { display: block; line-height: 1.25; }.image-note strong { font-size: 10px; }.image-note small { margin-top: 4px; color: #afc0d2; font-size: 8px; }.program-copy { max-width: 515px; }.program-copy .section-kicker { margin-bottom: 14px; }.program-copy p { max-width: 460px; margin: 22px 0 28px; color: var(--muted); line-height: 1.7; }.program-list { border-top: 1px solid var(--line); }.program-row { display: flex; align-items: center; gap: 13px; padding: 15px 0; border-bottom: 1px solid var(--line); transition: padding .2s ease; }.program-row:hover { padding-left: 7px; }.program-row > span:nth-child(2) { flex: 1; }.program-row strong, .program-row small { display: block; line-height: 1.25; }.program-row strong { color: var(--navy); font: 700 12px var(--display); }.program-row small { margin-top: 4px; color: var(--muted); font-size: 10px; }.program-row > svg { color: var(--emerald); }.program-icon { display: grid; place-items: center; width: 32px; height: 32px; color: var(--navy); background: var(--soft-blue); }.program-icon svg { width: 16px; height: 16px; }
.results-section { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 28px; align-items: end; width: min(100%, 1240px); margin: auto; padding: 48px 28px 53px; background: var(--mint); }.results-section .section-kicker { margin-bottom: 12px; }.results-stat { display: flex; align-items: center; gap: 12px; padding-left: 22px; border-left: 1px solid rgba(15,44,89,.18); }.results-stat strong { color: var(--navy); font: 800 37px/1 var(--display); letter-spacing: -.05em; }.results-stat span { color: #466379; font-size: 10px; line-height: 1.35; }
.bottom-section { display: grid; grid-template-columns: 1.3fr 1fr auto; gap: 45px; align-items: end; width: min(100%, 1240px); margin: auto; padding: 94px 28px 100px; }.bottom-section .section-kicker { margin-bottom: 14px; }.bottom-section > p { max-width: 340px; margin: 0; color: var(--muted); font-size: 13px; line-height: 1.7; }.button-dark { border-color: var(--navy); color: #fff; background: var(--navy); box-shadow: 0 11px 24px rgba(15,44,89,.18); }.button-dark:hover { background: #173f70; }
.registration-band { display: flex; align-items: center; justify-content: space-between; gap: 30px; width: min(100%, 1240px); margin: auto; padding: 65px 28px; color: #fff; background: var(--navy); }.registration-band .section-kicker { margin-bottom: 12px; }.registration-band h2 { color: #fff; }.registration-band .button { flex: 0 0 auto; }
footer { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 30px; padding: 42px max(28px, calc((100% - 1184px)/2)); color: #d9e4ef; background: var(--navy-deep); }.footer-brand img, .footer-fallback { width: 130px; height: 38px; object-fit: contain; object-position: left center; color: #fff; }.footer-brand span { display: block; margin-top: 11px; color: #8095af; font-size: 11px; }.footer-label { color: var(--emerald); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }.footer-brand + div p, footer > div:last-child p { margin: 10px 0 0; color: #d9e4ef; font-size: 11px; line-height: 1.75; }footer a:hover { color: var(--emerald); }

.modal[hidden] { display: none; }.modal { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; padding: 24px; }.modal-backdrop { position: absolute; inset: 0; background: rgba(8,29,58,.72); backdrop-filter: blur(8px); }.modal-panel { position: relative; z-index: 1; width: min(100%, 470px); padding: 34px; background: var(--paper); box-shadow: 0 28px 80px rgba(0,0,0,.25); animation: modal-in .25s ease-out; }.modal-panel h2 { margin: 0 0 9px; color: var(--navy); font: 800 31px/1.08 var(--display); letter-spacing: -.04em; }.modal-panel > p { margin-bottom: 22px; color: var(--muted); font-size: 12px; }.modal-close { position: absolute; top: 15px; right: 15px; display: grid; place-items: center; width: 31px; height: 31px; border: 1px solid var(--line); color: var(--navy); background: #fff; cursor: pointer; }.modal-close svg { width: 15px; }.modal form { display: grid; gap: 7px; }.modal label { margin-top: 7px; color: var(--navy); font-size: 10px; font-weight: 700; }.modal input, .modal select { width: 100%; min-height: 43px; padding: 0 11px; border: 1px solid var(--line); border-radius: 2px; color: var(--ink); background: #fff; font-size: 12px; }.modal input:focus, .modal select:focus { outline: 2px solid rgba(16,185,129,.27); border-color: var(--emerald); }.modal form .button { margin-top: 14px; }.form-status { min-height: 19px; margin: 7px 0 0; color: var(--emerald); font-size: 11px; }body.modal-open { overflow: hidden; }@keyframes modal-in { from { opacity: 0; transform: translateY(12px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 1000px) { .nav-shell, .hero, .proof-strip, .programs-section, .results-section, .bottom-section { padding-left: 24px; padding-right: 24px; }.nav-menu { gap: 15px; }.hero { gap: 25px; }.proof-strip { grid-template-columns: 1fr 1fr; }.proof-heading { grid-column: 1 / -1; }.programs-section { gap: 48px; }.results-section { grid-template-columns: 1.2fr repeat(3, 1fr); gap: 14px; } }
@media (max-width: 760px) { .nav-shell { min-height: 68px; }.brand { width: auto; }.brand img, .brand-fallback { width: 145px; height: 43px; }.menu-toggle { display: block; }.nav-menu { display: none; position: absolute; top: 68px; right: 0; left: 0; flex-direction: column; align-items: stretch; gap: 0; padding: 8px 24px 20px; border-bottom: 1px solid var(--line); background: rgba(247,249,251,.98); }.nav-menu.is-open { display: flex; }.nav-menu a { padding: 11px 0; }.nav-menu .button { margin-top: 8px; }.hero { display: block; min-height: auto; padding-top: 58px; padding-bottom: 40px; }.hero-lede { font-size: 15px; }.hero-actions { align-items: flex-start; flex-direction: column; gap: 17px; margin-bottom: 34px; }.hero-visual { min-height: 460px; margin-top: 47px; }.prep-card { width: 86%; }.countdown-card { top: 17px; right: 17px; }.badge-success { left: -12px; }.badge-location { right: -12px; }.visual-caption { right: 18px; }.proof-strip { grid-template-columns: 1fr; gap: 20px; padding-top: 45px; }.proof-heading { grid-column: auto; }.proof-item { padding-top: 0; }.proof-item p { max-width: none; }.programs-section { display: flex; flex-direction: column; gap: 56px; padding-top: 76px; padding-bottom: 76px; }.program-image { width: calc(100% - 16px); min-height: 400px; }.program-image img { height: 400px; }.image-note { right: -17px; }.program-copy { max-width: none; }.results-section { grid-template-columns: 1fr 1fr; gap: 25px 16px; padding-top: 42px; padding-bottom: 42px; }.results-section > div:first-child { grid-column: 1 / -1; }.results-stat { padding-left: 13px; }.bottom-section { display: block; padding-top: 67px; padding-bottom: 72px; }.bottom-section > p { margin: 25px 0; }.bottom-section .button, .registration-band .button { width: 100%; }.registration-band { display: block; padding: 53px 24px; }.registration-band .button { margin-top: 25px; }footer { grid-template-columns: 1fr; gap: 24px; padding: 37px 24px; }.modal-panel { padding: 31px 22px 25px; } }
@media (max-width: 480px) { h1 { font-size: 42px; }.hero-visual { min-height: 410px; }.prep-card { width: 88%; padding: 21px 19px 18px; }.chart { height: 118px; }.badge-success { left: -8px; }.badge-location { right: -8px; }.countdown-card { transform: scale(.9); transform-origin: top right; }.program-image { min-height: 340px; }.program-image img { height: 340px; }.image-note { right: -10px; bottom: 17px; }.results-stat strong { font-size: 31px; } }

.catalogue-section { width: min(100%, 1240px); margin: auto; padding: 102px 28px 110px; }
.catalogue-heading { display: flex; align-items: end; justify-content: space-between; gap: 40px; margin-bottom: 34px; }.catalogue-heading h2 { margin: 0; color: var(--navy); font: 800 35px/1.12 var(--display); letter-spacing: -.05em; }.catalogue-heading > p { max-width: 350px; margin: 0 0 3px; color: var(--muted); font-size: 13px; line-height: 1.7; }
.catalogue-filters { display: flex; flex-wrap: wrap; gap: 9px; margin-bottom: 24px; }.filter-button { padding: 9px 14px; border: 1px solid var(--line); border-radius: 2px; color: var(--muted); background: transparent; cursor: pointer; font-size: 11px; font-weight: 700; }.filter-button:hover, .filter-button.is-active { border-color: var(--navy); color: #fff; background: var(--navy); }
.course-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }.course-card { display: flex; flex-direction: column; min-height: 430px; padding: 23px; border: 1px solid var(--line); background: rgba(255,255,255,.78); animation: card-in .45s both; animation-delay: var(--delay); transition: transform .2s ease, box-shadow .2s ease; }.course-card:hover { transform: translateY(-4px); box-shadow: 0 16px 30px rgba(15,44,89,.1); }.course-card-top { display: flex; align-items: center; justify-content: space-between; }.course-icon { display: grid; place-items: center; width: 38px; height: 38px; color: var(--emerald); background: #d9f7eb; }.course-icon svg { width: 18px; }.course-category { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.course-card h3 { margin: 25px 0 16px; color: var(--navy); font: 800 20px/1.15 var(--display); letter-spacing: -.035em; }.course-card h3 small { display: block; margin-top: 5px; color: var(--emerald); font: 700 13px var(--sans); direction: rtl; text-align: left; }.course-meta { display: flex; flex-wrap: wrap; gap: 7px 12px; padding: 11px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }.course-meta strong { color: var(--navy); font-size: 11px; }.course-meta span { color: var(--muted); font-size: 10px; }.course-card > p { margin: 16px 0; color: var(--muted); font-size: 12px; line-height: 1.65; }.course-features { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 22px; }.course-features span { padding: 5px 8px; color: #3f6170; background: #edf6f5; font-size: 9px; }.course-actions { display: grid; gap: 9px; margin-top: auto; }.course-actions .button { width: 100%; min-height: 42px; padding: 0 10px; font-size: 10px; }.course-more { display: flex; align-items: center; justify-content: center; gap: 6px; min-height: 34px; border-bottom: 1px solid var(--line); color: var(--navy); font-size: 10px; font-weight: 700; }.course-more svg { width: 14px; color: var(--emerald); }.empty-state { grid-column: 1 / -1; padding: 30px; color: var(--muted); text-align: center; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }.form-grid > div { display: grid; gap: 7px; }.form-success { display: grid; gap: 5px; margin-top: 15px; padding: 15px; color: #07523c; background: #d9f7eb; font-size: 11px; }.form-success span { color: #427366; }.button-whatsapp { width: fit-content; min-height: 37px; margin-top: 7px; padding: 0 13px; border-color: #128c7e; color: #fff; background: #128c7e; box-shadow: none; font-size: 10px; }.button-whatsapp:hover { background: #0d766a; }
.admin-overlay { position: fixed; inset: 0; z-index: 40; overflow: auto; padding: 24px; background: rgba(8,29,58,.78); backdrop-filter: blur(10px); }.admin-login-panel { position: relative; width: min(100%, 440px); margin: 8vh auto; padding: 36px; background: var(--paper); box-shadow: 0 28px 80px rgba(0,0,0,.27); }.admin-login-panel h2 { margin: 0 0 8px; color: var(--navy); font: 800 30px/1.1 var(--display); }.admin-login-panel > p { color: var(--muted); font-size: 12px; }.admin-login-panel form, .course-admin-form { display: grid; gap: 8px; }.admin-login-panel label, .course-admin-form label { margin-top: 5px; color: var(--navy); font-size: 10px; font-weight: 700; }.admin-login-panel input, .course-admin-form input, .course-admin-form select, .course-admin-form textarea { width: 100%; min-height: 42px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 2px; color: var(--ink); background: #fff; font-size: 12px; }.course-admin-form textarea { min-height: 80px; resize: vertical; }.login-hint { margin-top: 7px; color: var(--muted); font-size: 10px; }.login-error { min-height: 18px; margin: 4px 0 0; color: #b42318; font-size: 11px; }.dashboard-shell { width: min(100%, 1184px); margin: 0 auto; padding: 24px 0 50px; }.dashboard-header, .dashboard-section-head { display: flex; align-items: end; justify-content: space-between; gap: 20px; }.dashboard-header h2, .dashboard-section h3 { margin: 0; color: #fff; font: 800 31px/1.1 var(--display); }.dashboard-section h3 { color: var(--navy); font-size: 22px; }.dashboard-actions { display: flex; align-items: center; gap: 9px; }.dashboard-actions .button { min-height: 40px; font-size: 10px; }.dashboard-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 28px 0 16px; }.dashboard-stats > div { padding: 18px 20px; background: var(--mint); }.dashboard-stats span, .dashboard-stats strong { display: block; }.dashboard-stats span { color: #466379; font-size: 10px; }.dashboard-stats strong { margin-top: 5px; color: var(--navy); font: 800 30px var(--display); }.dashboard-section { margin-top: 16px; padding: 25px; background: var(--paper); }.dashboard-section .section-kicker { margin-bottom: 8px; }.dashboard-section-head .text-button { border: 0; background: transparent; cursor: pointer; }.dashboard-section-head .text-button svg { width: 14px; }.table-wrap { overflow-x: auto; margin-top: 22px; }table { width: 100%; border-collapse: collapse; min-width: 720px; }th, td { padding: 12px 10px; border-bottom: 1px solid var(--line); color: var(--muted); text-align: left; font-size: 10px; }th { color: var(--navy); font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }td strong, td small { display: block; }td strong { color: var(--navy); }td small { margin-top: 3px; font-size: 9px; }.status-select { padding: 6px; border: 1px solid var(--line); color: var(--navy); background: #fff; font-size: 10px; }.course-manager { display: grid; grid-template-columns: .8fr 1.2fr; gap: 23px; }.course-manager > .dashboard-section-head { grid-column: 1 / -1; }.course-admin-form { grid-column: 1; }.course-admin-form h4 { margin: 0 0 4px; color: var(--navy); font: 700 14px var(--display); }.checkbox-label { display: flex; align-items: center; gap: 8px; font-weight: 400 !important; }.checkbox-label input { width: auto; min-height: 0; }.admin-course-list { grid-column: 2; border-top: 1px solid var(--line); }.admin-course-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 0; border-bottom: 1px solid var(--line); }.admin-course-row strong, .admin-course-row span { display: block; }.admin-course-row strong { color: var(--navy); font: 700 11px var(--display); }.admin-course-row span { margin-top: 3px; color: var(--muted); font-size: 9px; }.icon-button { display: inline-grid; place-items: center; width: 33px; height: 33px; border: 1px solid var(--line); color: var(--navy); background: #fff; cursor: pointer; }.icon-button:hover { color: var(--emerald); }.icon-button svg { width: 14px; }.admin-dashboard .section-kicker { color: var(--emerald); }
@keyframes card-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 900px) { .course-grid { grid-template-columns: repeat(2, 1fr); }.course-manager { grid-template-columns: 1fr; }.admin-course-list { grid-column: 1; } }
@media (max-width: 600px) { .catalogue-section { padding: 72px 24px 76px; }.catalogue-heading { display: block; }.catalogue-heading h2 { font-size: 29px; }.catalogue-heading > p { margin-top: 18px; }.course-grid, .dashboard-stats { grid-template-columns: 1fr; }.course-card { min-height: 0; }.form-grid { grid-template-columns: 1fr; }.admin-overlay { padding: 14px; }.admin-login-panel { margin: 4vh auto; padding: 29px 21px; }.dashboard-shell { padding-top: 12px; }.dashboard-header { align-items: start; }.dashboard-header h2 { font-size: 25px; }.dashboard-section { padding: 18px; }.dashboard-section-head { align-items: start; }.dashboard-section-head .text-button { white-space: nowrap; }.dashboard-actions .button { padding: 0 10px; }.course-manager { gap: 20px; } }