:root {
  --bg: #05070d;
  --bg-soft: #090d17;
  --surface: rgba(15, 20, 33, 0.72);
  --surface-strong: #101625;
  --line: rgba(255, 255, 255, 0.1);
  --text: #f7f9ff;
  --muted: #a9b1c3;
  --blue: #1f7aff;
  --blue-light: #5ab7ff;
  --blue-dark: #062d8c;
  --red: #ff3158;
  --red-dark: #790d27;
  --green: #20d790;
  --gold: #ffbf48;
  --container: min(92vw, 1480px);
  --radius-lg: 34px;
  --radius-md: 24px;
  --shadow: 0 32px 100px rgba(0, 0, 0, .42);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scrollbar-color: #27324a var(--bg); }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  color: var(--text);
  background:
    radial-gradient(circle at 16% 5%, rgba(23, 112, 255, .12), transparent 30%),
    radial-gradient(circle at 88% 20%, rgba(180, 12, 50, .12), transparent 28%),
    var(--bg);
  font-family: "Cairo", "Segoe UI", Tahoma, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

body.dialog-open { overflow: hidden; }
button, a { font: inherit; }
a { color: inherit; text-decoration: none; }
button { color: inherit; }
img { display: block; max-width: 100%; }
::selection { background: rgba(41, 121, 255, .38); color: #fff; }

#ambient-canvas {
  position: fixed;
  inset: 0;
  z-index: -3;
  width: 100%;
  height: 100%;
  opacity: .62;
  pointer-events: none;
}

.page-noise {
  position: fixed;
  inset: 0;
  z-index: -2;
  opacity: .035;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

.site-header {
  position: fixed;
  top: 18px;
  left: 50%;
  z-index: 90;
  width: min(94vw, 1500px);
  min-height: 74px;
  padding: 10px 12px 10px 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid rgba(255, 255, 255, .11);
  border-radius: 22px;
  background: rgba(7, 10, 18, .66);
  box-shadow: 0 18px 70px rgba(0, 0, 0, .25);
  backdrop-filter: blur(24px) saturate(135%);
  transform: translateX(-50%);
  transition: background .3s ease, top .3s ease, box-shadow .3s ease;
}

.site-header.scrolled { top: 8px; background: rgba(5, 7, 13, .9); box-shadow: 0 20px 70px rgba(0, 0, 0, .48); }
.brand { display: flex; align-items: center; gap: 12px; direction: ltr; }
.brand-mark {
  position: relative;
  width: 76px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 15px;
  background: linear-gradient(135deg, rgba(31, 122, 255, .2), rgba(255, 49, 88, .18));
  box-shadow: inset 0 1px rgba(255, 255, 255, .12), 0 12px 28px rgba(0, 0, 0, .25);
  overflow: hidden;
}
.brand-mark::before { content: ""; position: absolute; inset: -50%; background: conic-gradient(transparent, rgba(31, 122, 255, .5), transparent, rgba(255, 49, 88, .45), transparent); animation: spin 8s linear infinite; }
.brand-logo {
  width: 92px;
  height: 64px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
}
.brand-logo::before { display: none; }
.brand-logo img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; filter: drop-shadow(0 4px 10px rgba(0,0,0,.52)); }
.brand-mark b, .brand-mark i { position: absolute; z-index: 1; font-size: 17px; font-style: normal; line-height: 1; }
.brand-mark b { transform: translate(-6px, -4px); color: #8ac4ff; }
.brand-mark i { transform: translate(7px, 7px); color: #ff8197; }
.brand-copy { display: flex; flex-direction: column; line-height: 1.2; }
.brand-copy strong { font-size: 14px; letter-spacing: .08em; text-transform: uppercase; }
.brand-copy small { margin-top: 4px; color: var(--muted); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; }

.main-nav { display: flex; align-items: center; gap: 28px; }
.main-nav > a { position: relative; color: #cbd2df; font-size: 14px; font-weight: 600; transition: color .25s ease; }
.main-nav > a:not(.nav-cta)::after { content: ""; position: absolute; right: 0; bottom: -7px; width: 0; height: 2px; border-radius: 9px; background: linear-gradient(90deg, var(--blue), var(--red)); transition: width .25s ease; }
.main-nav > a:hover, .main-nav > a:focus-visible { color: #fff; }
.main-nav > a:hover::after, .main-nav > a:focus-visible::after { width: 100%; }
.main-nav .nav-cta { padding: 12px 20px; color: #fff; border: 1px solid rgba(255, 255, 255, .12); border-radius: 13px; background: linear-gradient(110deg, #164ec8, #0d72e8); box-shadow: 0 12px 28px rgba(16, 103, 232, .26); }
.nav-toggle { display: none; width: 46px; height: 46px; padding: 0; border: 0; border-radius: 13px; background: rgba(255,255,255,.06); cursor: pointer; }
.nav-toggle span { display: block; width: 20px; height: 2px; margin: 4px auto; border-radius: 2px; background: #fff; transition: transform .25s ease, opacity .25s ease; }

.hero {
  position: relative;
  width: var(--container);
  min-height: 100svh;
  margin: 0 auto;
  padding: 155px 0 110px;
  display: grid;
  grid-template-columns: minmax(0, .94fr) minmax(470px, 1.06fr);
  gap: clamp(36px, 6vw, 100px);
  align-items: center;
}

.hero::before { content: ""; position: absolute; top: 15%; right: 48%; width: 1px; height: 70%; background: linear-gradient(transparent, rgba(255,255,255,.1), transparent); }
.hero-copy { position: relative; z-index: 2; max-width: 680px; }
.availability { width: max-content; margin-bottom: 24px; padding: 7px 13px; display: flex; align-items: center; gap: 9px; color: #cbd3e1; font-size: 13px; border: 1px solid rgba(255,255,255,.11); border-radius: 999px; background: rgba(255,255,255,.04); }
.availability span { width: 8px; height: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(32,215,144,.11), 0 0 18px rgba(32,215,144,.8); animation: pulse-dot 2s ease infinite; }
.hero-kicker { margin: 0 0 16px; color: #9ba8bd; font-size: 12px; font-weight: 800; letter-spacing: .27em; direction: ltr; text-align: right; }
.hero-kicker i { color: #fff; font-style: normal; }
.hero h1 { margin: 0; font-size: clamp(3rem, 5.35vw, 6.4rem); font-weight: 900; line-height: .99; letter-spacing: -.055em; }
.blue-text { color: transparent; background: linear-gradient(135deg, #ecf7ff 10%, #61b6ff 48%, #1676ff 90%); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 0 28px rgba(38,128,255,.22)); }
.red-text { color: transparent; background: linear-gradient(135deg, #fff0f3 10%, #ff6b87 48%, #e01d45 90%); -webkit-background-clip: text; background-clip: text; filter: drop-shadow(0 0 28px rgba(255,49,88,.2)); }
.hero-intro { max-width: 620px; margin: 30px 0 0; color: #c8d1df; font-size: clamp(1.05rem, 1.32vw, 1.22rem); line-height: 2; }
.hero-intro strong { color: #fff; }
.hero-actions { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 12px; }
.button { min-height: 52px; padding: 13px 23px; display: inline-flex; align-items: center; justify-content: center; gap: 18px; border: 1px solid transparent; border-radius: 15px; font-weight: 800; transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease, background .25s ease; }
.button:hover { transform: translateY(-3px); }
.button.primary { color: #fff; background: linear-gradient(115deg, #1764e7, #1b8aff); box-shadow: 0 18px 40px rgba(25, 111, 235, .28), inset 0 1px rgba(255,255,255,.24); }
.button.primary:hover { box-shadow: 0 24px 52px rgba(25, 111, 235, .42), inset 0 1px rgba(255,255,255,.3); }
.button.ghost { border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.045); backdrop-filter: blur(12px); }
.button.ghost:hover { border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.08); }
.hero-proof { margin-top: 42px; padding-top: 25px; display: flex; gap: clamp(24px, 4vw, 58px); border-top: 1px solid rgba(255,255,255,.1); direction: ltr; }
.hero-proof > div { display: grid; grid-template-columns: auto auto; align-items: start; }
.hero-proof strong { font-size: clamp(1.75rem, 2.4vw, 2.55rem); line-height: 1; }
.hero-proof > div:nth-child(1) strong, .hero-proof > div:nth-child(1) > span { color: #ff6c86; }
.hero-proof > div:nth-child(2) strong, .hero-proof > div:nth-child(2) > span { color: #58aaff; }
.hero-proof > div:nth-child(3) strong, .hero-proof > div:nth-child(3) > span { color: #fff; }
.hero-proof > div > span { font-size: 13px; font-weight: 800; }
.hero-proof small { grid-column: 1 / -1; margin-top: 7px; color: #808a9c; font-size: 11px; font-weight: 700; letter-spacing: .06em; }

.hero-stage { position: relative; min-height: 665px; display: grid; place-items: center; perspective: 1600px; transform-style: preserve-3d; }
.hero-stage::before { content: ""; position: absolute; width: 68%; aspect-ratio: 1; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.035), transparent 62%); box-shadow: inset 0 0 100px rgba(255,255,255,.02); }
.stage-halo { position: absolute; width: 45%; aspect-ratio: 1; border-radius: 50%; filter: blur(75px); opacity: .34; animation: breathe 5s ease-in-out infinite; }
.blue-halo { left: 5%; bottom: 20%; background: var(--blue); }
.red-halo { right: 4%; top: 18%; background: var(--red-dark); animation-delay: -2.4s; }
.orbit { position: absolute; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; transform-style: preserve-3d; animation: orbit-spin 22s linear infinite; }
.orbit-one { width: 76%; aspect-ratio: 1; transform: rotateX(67deg) rotateZ(-12deg); }
.orbit-two { width: 58%; aspect-ratio: 1; transform: rotateY(70deg) rotateZ(24deg); animation-duration: 17s; animation-direction: reverse; }
.orbit i { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #fff; box-shadow: 0 0 20px #fff; }
.orbit i:nth-child(1) { top: 10%; left: 28%; background: #46a5ff; box-shadow: 0 0 22px #2789ff; }
.orbit i:nth-child(2) { right: 1%; top: 52%; background: #ff5576; box-shadow: 0 0 22px #ff3158; }
.orbit i:nth-child(3) { bottom: 7%; left: 31%; }

.portrait-frame { position: relative; z-index: 4; width: min(66%, 470px); aspect-ratio: .82; padding: 9px; border-radius: 42px; background: linear-gradient(140deg, rgba(84,171,255,.88), rgba(255,255,255,.12) 46%, rgba(255,49,88,.8)); box-shadow: 0 48px 100px rgba(0,0,0,.56), -35px 0 85px rgba(29,116,255,.12), 35px 0 85px rgba(255,49,88,.11); transform-style: preserve-3d; transition: transform .18s ease-out; }
.portrait-frame::after { content: ""; position: absolute; inset: 9px; z-index: 2; border-radius: 34px; box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); pointer-events: none; }
.portrait-frame img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 50%; border-radius: 34px; filter: saturate(.92) contrast(1.03); }
.portrait-ring { position: absolute; inset: -28px; z-index: -1; border: 1px dashed rgba(255,255,255,.16); border-radius: 55px; animation: ring-float 7s ease-in-out infinite; }
.portrait-caption { position: absolute; right: 26px; bottom: 24px; left: 26px; z-index: 3; padding: 14px 16px; display: flex; align-items: center; justify-content: space-between; gap: 10px; direction: ltr; border: 1px solid rgba(255,255,255,.16); border-radius: 15px; background: rgba(5,8,15,.65); backdrop-filter: blur(18px); }
.portrait-caption strong { font-size: 13px; letter-spacing: .12em; }
.portrait-caption span { color: #aeb9cc; font-size: 10px; }

.floating-panel { position: absolute; z-index: 6; width: 220px; padding: 17px; border: 1px solid rgba(255,255,255,.14); border-radius: 22px; background: linear-gradient(145deg, rgba(18,27,47,.88), rgba(7,10,18,.8)); box-shadow: 0 30px 70px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.11); backdrop-filter: blur(18px); transform-style: preserve-3d; transition: transform .18s ease-out; }
.data-panel { left: -2%; bottom: 17%; box-shadow: 0 30px 80px rgba(0,0,0,.48), 0 0 50px rgba(24,118,255,.15), inset 0 1px rgba(255,255,255,.11); animation: panel-float 5.6s ease-in-out infinite; }
.finance-panel { top: 13%; right: -2%; width: 245px; box-shadow: 0 30px 80px rgba(0,0,0,.48), 0 0 50px rgba(255,49,88,.13), inset 0 1px rgba(255,255,255,.11); animation: panel-float 6.4s ease-in-out -2s infinite; }
.panel-top { display: flex; justify-content: space-between; align-items: center; color: #aab3c4; direction: ltr; font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.data-panel .panel-top b { color: #4be8ae; }
.finance-panel .panel-top b { color: #ff6c87; }
.mini-bars { height: 88px; margin-top: 16px; padding: 0 4px; display: flex; align-items: end; gap: 9px; direction: ltr; border-bottom: 1px solid rgba(255,255,255,.09); }
.mini-bars i { width: 18%; height: var(--h); border-radius: 6px 6px 2px 2px; background: linear-gradient(180deg, #5dc2ff, #126eff); box-shadow: 0 0 18px rgba(26,125,255,.3); transform-origin: bottom; animation: grow-bar 2.4s cubic-bezier(.2,.8,.2,1) infinite alternate; }
.mini-bars i:nth-child(2) { animation-delay: -.6s; }.mini-bars i:nth-child(3) { animation-delay: -1.2s; }.mini-bars i:nth-child(4) { animation-delay: -1.7s; }.mini-bars i:nth-child(5) { animation-delay: -.3s; }
.panel-metric { margin-top: 12px; display: flex; justify-content: space-between; align-items: end; direction: ltr; }
.panel-metric strong { color: #66b5ff; font-size: 20px; }.panel-metric small { color: #778196; font-size: 9px; }
.finance-panel svg { width: 100%; margin: 13px 0 4px; overflow: visible; }
.finance-panel .area { fill: url(#finance-fill); }
.finance-panel .line { fill: none; stroke: #ff496c; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 7px rgba(255,49,88,.65)); stroke-dasharray: 400; animation: draw-line 4s ease-in-out infinite alternate; }
.formula { display: flex; align-items: center; justify-content: center; gap: 9px; direction: ltr; color: #cad1dd; font-family: Georgia, serif; font-size: 12px; }
.formula b, .formula em { color: #ff617e; font-style: normal; }

.skill-pill { position: absolute; z-index: 8; padding: 8px 12px; display: flex; align-items: center; gap: 8px; direction: ltr; color: #dce3ee; font-size: 10px; font-weight: 800; border: 1px solid rgba(255,255,255,.13); border-radius: 999px; background: rgba(8,12,21,.82); box-shadow: 0 15px 35px rgba(0,0,0,.34); backdrop-filter: blur(14px); transition: transform .18s ease-out; }
.skill-pill span { width: 7px; height: 7px; border-radius: 50%; }
.pill-one { left: 12%; top: 23%; }.pill-one span { background: var(--blue); box-shadow: 0 0 12px var(--blue); }
.pill-two { right: 0; bottom: 25%; }.pill-two span { background: var(--red); box-shadow: 0 0 12px var(--red); }
.pill-three { left: 17%; bottom: 7%; }.pill-three span { background: var(--gold); box-shadow: 0 0 12px var(--gold); }
.scroll-cue { position: absolute; bottom: 28px; right: 50%; display: flex; flex-direction: column; align-items: center; gap: 9px; transform: translateX(50%); color: #6f7787; }
.scroll-cue span { width: 22px; height: 34px; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; }
.scroll-cue span::after { content: ""; display: block; width: 3px; height: 7px; margin: 6px auto; border-radius: 4px; background: #fff; animation: scroll-dot 1.8s ease infinite; }
.scroll-cue small { font-size: 8px; letter-spacing: .26em; }

.credential-strip { position: relative; width: 100%; padding: 16px 0; overflow: hidden; border-block: 1px solid rgba(255,255,255,.075); background: rgba(255,255,255,.025); }
.credential-strip::before, .credential-strip::after { content: ""; position: absolute; top: 0; bottom: 0; z-index: 2; width: 100px; pointer-events: none; }
.credential-strip::before { right: 0; background: linear-gradient(270deg, var(--bg), transparent); }.credential-strip::after { left: 0; background: linear-gradient(90deg, var(--bg), transparent); }
.credential-track { width: max-content; display: flex; align-items: center; gap: 28px; direction: ltr; animation: marquee 24s linear infinite; }
.credential-track span { color: #aeb7c7; font-size: 13px; font-weight: 800; letter-spacing: .1em; }
.credential-track i { width: 5px; height: 5px; border-radius: 50%; background: linear-gradient(135deg, var(--blue), var(--red)); box-shadow: 0 0 12px rgba(52,117,255,.5); }

.section { position: relative; width: var(--container); margin: 0 auto; padding: clamp(100px, 10vw, 165px) 0; }
.section-heading { margin-bottom: 52px; display: grid; grid-template-columns: .5fr 1.1fr .8fr; gap: 34px; align-items: end; }
.section-heading > div:first-child, .projects-copy > div:first-child { align-self: start; display: flex; align-items: center; gap: 13px; direction: ltr; }
.section-index { width: 40px; height: 40px; display: grid; place-items: center; color: #c7cfdd; font-size: 11px; font-weight: 800; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.section-heading > div p, .projects-copy > div p { margin: 0; color: #7f899a; font-size: 10px; font-weight: 800; letter-spacing: .19em; }
.section-heading h2, .projects-copy h2 { margin: 0; font-size: clamp(2.25rem, 3.9vw, 4.65rem); font-weight: 900; line-height: 1.1; letter-spacing: -.045em; }
.section-heading h2 span, .projects-copy h2 span { color: #7f8a9f; }
.section-heading > p { margin: 0; color: #a3adbd; font-size: 15px; line-height: 1.9; }

.featured-courses { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.course-card { position: relative; min-height: 590px; padding: clamp(25px, 3vw, 42px); display: grid; grid-template-columns: 1.04fr .96fr; gap: 25px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: var(--radius-lg); box-shadow: var(--shadow); transform-style: preserve-3d; isolation: isolate; }
.course-card::before { content: ""; position: absolute; inset: 0; z-index: -2; }
.fmva-card::before { background: radial-gradient(circle at 85% 16%, rgba(255,56,91,.25), transparent 32%), linear-gradient(145deg, #1b0b12, #0c0b12 60%, #130710); }
.data-card::before { background: radial-gradient(circle at 84% 18%, rgba(31,122,255,.32), transparent 34%), linear-gradient(145deg, #07182d, #090d16 60%, #061127); }
.course-card::after { content: ""; position: absolute; inset: 1px; z-index: -1; border-radius: calc(var(--radius-lg) - 1px); background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px); background-size: 36px 36px; mask-image: linear-gradient(to bottom, #000, transparent 75%); }
.card-glare { position: absolute; inset: 0; z-index: 8; opacity: 0; background: radial-gradient(circle at var(--mx,50%) var(--my,50%), rgba(255,255,255,.16), transparent 28%); pointer-events: none; transition: opacity .25s ease; }
.course-card:hover .card-glare { opacity: 1; }
.course-copy { position: relative; z-index: 4; display: flex; flex-direction: column; transform: translateZ(24px); }
.course-flags { min-height: 30px; display: flex; flex-wrap: wrap; gap: 8px; }
.course-flags span { padding: 5px 10px; color: #b5bdca; font-size: 10px; font-weight: 800; border: 1px solid rgba(255,255,255,.11); border-radius: 99px; background: rgba(255,255,255,.045); }
.course-flags .live-badge { color: #ff9bad; border-color: rgba(255,65,99,.28); background: rgba(255,49,88,.09); }
.course-flags .project-badge { color: #81c5ff; border-color: rgba(52,148,255,.3); background: rgba(31,122,255,.1); }
.course-code { margin: 28px 0 7px; color: #798496; font-size: 9px; font-weight: 800; letter-spacing: .18em; direction: ltr; text-align: right; }
.course-copy h3 { margin: 0; font-size: clamp(2rem, 2.7vw, 3.5rem); line-height: 1.02; letter-spacing: -.04em; direction: ltr; text-align: right; }
.fmva-card h3 { text-shadow: 0 0 35px rgba(255,49,88,.14); }.data-card h3 { text-shadow: 0 0 35px rgba(31,122,255,.16); }
.course-copy > p:not(.course-code) { margin: 22px 0 0; color: #aeb7c6; font-size: 14px; line-height: 1.85; }
.feature-list { margin: 21px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 7px; list-style: none; }
.feature-list li { padding: 5px 9px; color: #c3cbd7; font-size: 10px; border: 1px solid rgba(255,255,255,.09); border-radius: 8px; background: rgba(255,255,255,.035); }
.price-row { margin-top: auto; padding-top: 26px; display: flex; align-items: end; justify-content: space-between; gap: 16px; }
.price-row > div { display: grid; grid-template-columns: auto auto; align-items: end; gap: 0 9px; }
.price-row small { grid-column: 1 / -1; color: #8b95a5; font-size: 10px; }
.price-row strong { font-size: 30px; line-height: 1.2; direction: ltr; }.price-row strong em, .compact-copy strong em { color: #8993a5; font-size: 10px; font-style: normal; letter-spacing: .06em; }
.price-row del { margin-bottom: 4px; color: #697182; font-size: 11px; direction: ltr; }
.round-button { width: 52px; height: 52px; padding: 0; display: grid; place-items: center; color: #eaf2ff; border: 1px solid rgba(255,255,255,.16); border-radius: 17px; background: rgba(255,255,255,.07); box-shadow: inset 0 1px rgba(255,255,255,.12), 0 12px 24px rgba(0,0,0,.2); cursor: pointer; transition: transform .25s ease, background .25s ease, border-color .25s ease; }
.fmva-card .round-button:hover { background: var(--red); }.data-card .round-button:hover { background: var(--blue); }
.round-button:hover { transform: translateY(-3px) scale(1.04); }
.details-icon { width: 23px; height: 23px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.poster-art { position: relative; align-self: center; height: 85%; max-height: 485px; transform: translateZ(52px) rotateY(-9deg) rotateX(2deg); transform-style: preserve-3d; }
.poster-art img { position: relative; z-index: 2; width: 100%; height: 100%; object-fit: cover; object-position: top; border: 1px solid rgba(255,255,255,.2); border-radius: 22px; box-shadow: -25px 34px 58px rgba(0,0,0,.48); }
.red-poster img { box-shadow: -25px 34px 58px rgba(0,0,0,.48), 0 0 60px rgba(255,49,88,.16); }.blue-poster img { box-shadow: -25px 34px 58px rgba(0,0,0,.48), 0 0 60px rgba(31,122,255,.18); }
.poster-art::before, .poster-art::after { content: ""; position: absolute; width: 80%; height: 80%; border-radius: 25px; border: 1px solid rgba(255,255,255,.08); }
.poster-art::before { top: 8%; left: -12%; z-index: 1; background: rgba(255,255,255,.03); }.poster-art::after { top: 16%; left: -22%; z-index: 0; background: rgba(255,255,255,.015); }
.poster-glow { position: absolute; inset: 15% -20%; z-index: -1; border-radius: 50%; filter: blur(50px); opacity: .45; }
.red-poster .poster-glow { background: var(--red-dark); }.blue-poster .poster-glow { background: var(--blue-dark); }

.course-grid { margin-top: 24px; display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.compact-course { position: relative; min-height: 470px; padding: 19px; display: flex; flex-direction: column; overflow: hidden; border: 1px solid rgba(255,255,255,.105); border-radius: 28px; background: linear-gradient(155deg, rgba(19,25,40,.94), rgba(7,10,17,.98)); box-shadow: 0 28px 70px rgba(0,0,0,.33); transform-style: preserve-3d; cursor: pointer; }
.compact-course::after { content: ""; position: absolute; inset: 0; z-index: -1; opacity: .6; background: radial-gradient(circle at 75% 0, var(--compact-glow, rgba(31,122,255,.2)), transparent 42%); }
.excel-card { --compact-glow: rgba(32,215,144,.26); }.accounting-card { --compact-glow: rgba(255,191,72,.22); }.career-card { --compact-glow: rgba(44,134,255,.25); }
.card-number { position: absolute; top: 26px; left: 26px; z-index: 4; width: 38px; height: 38px; display: grid; place-items: center; color: #bec7d5; font-size: 10px; font-weight: 800; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; background: rgba(7,10,18,.45); backdrop-filter: blur(10px); }
.compact-visual { height: 225px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 20px; background: #111827; transform: translateZ(25px); }
.compact-visual img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform .55s cubic-bezier(.2,.7,.2,1); }
.compact-visual.portrait-fit { background: #f4f8fb; }
.compact-visual.portrait-fit img { object-fit: contain; object-position: center; }
.compact-course:hover .compact-visual img { transform: scale(1.045); }
.compact-copy { position: relative; z-index: 2; flex: 1; padding: 21px 7px 4px; display: flex; flex-direction: column; transform: translateZ(20px); }
.compact-copy > p { margin: 0; color: #909caf; font-size: 11px; font-weight: 800; letter-spacing: .13em; direction: ltr; text-align: right; }
.compact-copy h3 { margin: 4px 0 1px; font-size: 25px; line-height: 1.2; direction: ltr; text-align: right; }
.compact-copy > span { margin-top: 6px; color: #b3bdcc; font-size: 14px; line-height: 1.75; }
.compact-copy > div { margin-top: auto; padding-top: 16px; display: flex; align-items: end; justify-content: space-between; gap: 10px; border-top: 1px solid rgba(255,255,255,.08); }
.compact-copy strong { font-size: 22px; direction: ltr; }
.compact-copy button { min-height: 40px; padding: 7px 10px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; color: #dce7f6; font-size: 13px; font-weight: 800; border: 1px solid rgba(255,255,255,.11); border-radius: 12px; background: rgba(255,255,255,.045); cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.compact-copy button:hover, .compact-copy button:focus-visible { transform: translateY(-2px); border-color: rgba(104,183,255,.42); background: rgba(31,122,255,.13); }
.compact-copy button .details-icon { width: 19px; height: 19px; }
.accounting-visual { position: relative; height: 225px; overflow: hidden; display: grid; place-items: center; border: 1px solid rgba(255,191,72,.15); border-radius: 20px; background: radial-gradient(circle at 50% 40%, rgba(255,191,72,.19), transparent 46%), linear-gradient(145deg,#16140f,#0b0c12); transform: translateZ(25px); }
.ledger { position: relative; width: 132px; height: 155px; padding: 34px 22px 18px; border: 1px solid rgba(255,220,150,.35); border-radius: 17px; background: linear-gradient(145deg, rgba(255,207,111,.2), rgba(255,255,255,.035)); box-shadow: 0 25px 45px rgba(0,0,0,.4), inset 0 1px rgba(255,255,255,.18); transform: rotate(-7deg); }
.ledger::before { content: ""; position: absolute; top: 0; bottom: 0; left: 20px; width: 7px; background: repeating-linear-gradient(to bottom, #ffcf75 0 5px, transparent 5px 11px); opacity: .5; }
.ledger i { display: block; width: 65px; height: 4px; margin: 10px 0; border-radius: 5px; background: rgba(255,222,158,.35); }
.ledger span { position: absolute; top: 15px; right: 20px; color: #ffd27c; font: 800 26px Georgia,serif; }
.gold-coin { position: absolute; width: 54px; height: 54px; display: grid; place-items: center; color: #5b3a00; font: 800 20px Georgia,serif; border: 2px solid #ffdc8e; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff3c9, #ffbf48 46%, #a96800); box-shadow: 0 16px 28px rgba(0,0,0,.36); animation: coin-float 4s ease-in-out infinite; }
.coin-one { right: 21%; bottom: 13%; }.coin-two { left: 19%; top: 16%; animation-delay: -2s; }

.free-section { overflow: hidden; }
.free-section::before { content: ""; position: absolute; inset: 8% -20% 4%; z-index: -1; border: 1px solid rgba(31,122,255,.09); border-radius: 50%; background: radial-gradient(circle, rgba(31,122,255,.055), transparent 60%); }
.free-orb { position: absolute; top: 10%; left: -4%; width: 220px; aspect-ratio: 1; border: 1px solid rgba(70,163,255,.13); border-radius: 50%; background: radial-gradient(circle at 34% 32%, rgba(100,190,255,.34), rgba(15,83,197,.08) 45%, transparent 70%); filter: drop-shadow(0 0 60px rgba(31,122,255,.16)); animation: orb-float 8s ease-in-out infinite; }
.free-orb::before, .free-orb::after { content: ""; position: absolute; inset: 16%; border: 1px solid rgba(255,255,255,.11); border-radius: 50%; transform: rotateX(70deg); }.free-orb::after { transform: rotateY(70deg); }
.free-orb span, .free-orb i, .free-orb b { position: absolute; width: 8px; height: 8px; border-radius: 50%; background: #58b7ff; box-shadow: 0 0 18px #1681ff; }
.free-orb span { top: 20%; right: 25%; }.free-orb i { bottom: 22%; right: 8%; }.free-orb b { top: 49%; left: 4%; }
.resource-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.resource-card { position: relative; min-height: 220px; padding: 28px; display: grid; grid-template-columns: 80px 1fr auto; gap: 20px; align-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.105); border-radius: 26px; background: linear-gradient(145deg, rgba(18,24,39,.87), rgba(8,11,19,.93)); box-shadow: 0 24px 70px rgba(0,0,0,.28); transition: transform .3s ease, border-color .3s ease, background .3s ease; }
.resource-card::after { content: ""; position: absolute; width: 180px; height: 180px; left: -90px; bottom: -110px; border-radius: 50%; background: var(--resource-glow, rgba(31,122,255,.2)); filter: blur(35px); opacity: .4; }
.resource-card:hover { transform: translateY(-8px); border-color: rgba(255,255,255,.22); background: linear-gradient(145deg, rgba(24,32,51,.94), rgba(9,13,22,.98)); }
.resource-icon { position: relative; width: 74px; height: 74px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.16); border-radius: 23px; background: rgba(255,255,255,.055); box-shadow: inset 0 1px rgba(255,255,255,.15); transform: rotate(-6deg); transition: transform .3s ease; }
.resource-card:hover .resource-icon { transform: rotate(0) scale(1.06); }
.resource-icon span { position: relative; z-index: 2; font: 900 22px/1 Arial,sans-serif; direction: ltr; }
.resource-icon i { position: absolute; inset: 12px; border: 1px solid currentColor; border-radius: 50%; opacity: .32; }
.red-resource { color: #ff718b; background: linear-gradient(145deg, rgba(255,49,88,.18), rgba(255,255,255,.035)); }.green-resource { color: #45e5a9; background: linear-gradient(145deg, rgba(32,215,144,.18), rgba(255,255,255,.035)); }.blue-resource { color: #64b7ff; background: linear-gradient(145deg, rgba(31,122,255,.2), rgba(255,255,255,.035)); }
.resource-card p { margin: 0; color: #7e899b; font-size: 9px; font-weight: 800; letter-spacing: .16em; direction: ltr; text-align: right; }
.resource-card h3 { margin: 4px 0 6px; font-size: 20px; line-height: 1.35; }.resource-card div > span { color: #9aa5b6; font-size: 11px; }
.resource-card > b { color: #758094; font-size: 24px; font-weight: 400; direction: ltr; transition: color .25s ease, transform .25s ease; }.resource-card:hover > b { color: #fff; transform: translate(3px,-3px); }

.projects-section { width: 100%; padding-inline: max(4vw, calc((100vw - 1480px)/2)); background: linear-gradient(180deg, transparent, rgba(15,25,47,.34) 40%, rgba(17,13,27,.23) 80%, transparent); }
.projects-shell { width: 100%; max-width: 1650px; margin: auto; padding: clamp(38px,5vw,75px); display: grid; grid-template-columns: .74fr 1.26fr; gap: clamp(40px,6vw,100px); align-items: center; border: 1px solid rgba(255,255,255,.11); border-radius: 42px; background: radial-gradient(circle at 75% 30%, rgba(31,122,255,.11), transparent 36%), linear-gradient(145deg, rgba(14,19,31,.92), rgba(7,9,15,.95)); box-shadow: 0 40px 120px rgba(0,0,0,.35); }
.projects-copy h2 { margin-top: 24px; }.projects-copy > p { max-width: 580px; margin: 22px 0 0; color: #a4aebe; line-height: 1.9; }
.project-tags { margin-top: 30px; display: flex; flex-wrap: wrap; gap: 8px; }.project-tags span { padding: 7px 11px; color: #aab5c7; font-size: 10px; font-weight: 700; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(255,255,255,.035); }
.project-display { position: relative; min-height: 510px; padding: 17px; overflow: hidden; border: 1px solid rgba(91,161,255,.21); border-radius: 27px; background: #080d18; box-shadow: -35px 45px 80px rgba(0,0,0,.4), 0 0 80px rgba(31,122,255,.09); transform: perspective(1500px) rotateY(-5deg) rotateX(2deg); }
.project-display::before { content: ""; position: absolute; inset: 0; opacity: .43; background-image: linear-gradient(rgba(46,128,255,.08) 1px, transparent 1px), linear-gradient(90deg, rgba(46,128,255,.08) 1px, transparent 1px); background-size: 38px 38px; mask-image: radial-gradient(circle at center, #000, transparent 80%); }
.display-top { position: relative; z-index: 2; height: 42px; padding: 0 10px; display: flex; align-items: center; justify-content: space-between; direction: ltr; border-bottom: 1px solid rgba(255,255,255,.07); }.display-top span { display: flex; gap: 6px; }.display-top i { width: 7px; height: 7px; border-radius: 50%; background: #263248; }.display-top i:nth-child(1) { background: #ff5575; }.display-top i:nth-child(2) { background: #ffbe47; }.display-top i:nth-child(3) { background: #28d79a; }.display-top b { color: #657188; font-size: 8px; letter-spacing: .17em; }
.display-grid { position: relative; z-index: 2; height: 420px; padding: 18px; display: grid; grid-template-columns: 1fr 1fr 1fr; grid-template-rows: .8fr 1.2fr; gap: 14px; direction: ltr; }
.display-grid > div { border: 1px solid rgba(255,255,255,.075); border-radius: 17px; background: rgba(255,255,255,.026); }
.kpi { padding: 22px; display: flex; flex-direction: column; }.kpi small { color: #69758a; font-size: 8px; letter-spacing: .16em; }.kpi strong { margin-top: 10px; color: #68b9ff; font-size: 42px; line-height: 1; }.kpi span { margin-top: auto; color: #4c5970; font-size: 8px; }
.chart-placeholder { grid-column: 2 / 4; padding: 25px 22px 13px; display: flex; align-items: end; gap: 8%; border-bottom: 1px solid rgba(255,255,255,.07); }.chart-placeholder i { flex: 1; height: var(--v); border-radius: 7px 7px 2px 2px; background: linear-gradient(180deg, #4db1ff, #1457d4); box-shadow: 0 0 20px rgba(31,122,255,.16); transform-origin: bottom; animation: grow-bar 3s ease-in-out infinite alternate; }.chart-placeholder i:nth-child(even) { animation-delay: -1.4s; }
.donut { display: grid; place-items: center; }.donut::before { content: ""; width: 112px; height: 112px; border-radius: 50%; background: conic-gradient(#237aff 0 34%, #ff365c 34% 62%, #20c98b 62% 78%, #202a3c 78%); mask: radial-gradient(circle, transparent 53%, #000 55%); animation: spin 15s linear infinite; }.donut span { position: absolute; color: #8390a5; font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.project-lock { grid-column: 2 / 4; display: grid; place-items: center; align-content: center; text-align: center; }.project-lock span { width: 44px; height: 44px; display: grid; place-items: center; color: #65b7ff; font-size: 25px; border: 1px solid rgba(82,172,255,.25); border-radius: 50%; background: rgba(31,122,255,.08); }.project-lock p { margin: 10px 0 0; color: #5f6c82; font-size: 10px; line-height: 1.5; }

.about-card { position: relative; min-height: 430px; padding: clamp(38px,5vw,70px); display: grid; grid-template-columns: .55fr 1.1fr .65fr; gap: clamp(30px,5vw,75px); align-items: center; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 38px; background: radial-gradient(circle at 10% 30%, rgba(31,122,255,.18), transparent 26%), radial-gradient(circle at 90% 70%, rgba(255,49,88,.16), transparent 26%), linear-gradient(140deg,#111827,#090c14); box-shadow: var(--shadow); }
.about-card::after { content: ""; position: absolute; inset: 0; opacity: .45; background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size: 48px 48px; mask-image: radial-gradient(circle at center,#000,transparent 75%); pointer-events: none; }
.about-monogram { position: relative; z-index: 1; width: min(100%, 260px); aspect-ratio: 1; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 35%; background: linear-gradient(145deg,rgba(31,122,255,.16),rgba(255,49,88,.12)); box-shadow: inset 0 1px rgba(255,255,255,.12), 0 30px 70px rgba(0,0,0,.34); transform: rotate(-8deg); }
.about-monogram::before { content: ""; position: absolute; inset: 13%; border: 1px dashed rgba(255,255,255,.14); border-radius: 42%; animation: spin 18s linear infinite; }
.about-monogram img { position: relative; z-index: 1; width: 86%; height: auto; filter: drop-shadow(0 14px 28px rgba(0,0,0,.42)); }
.about-copy { position: relative; z-index: 1; }.eyebrow { margin: 0 0 10px; color: #7f8a9d; font-size: 9px; font-weight: 800; letter-spacing: .18em; }.about-copy h2 { margin: 0; font-size: clamp(2rem,3.4vw,4rem); line-height: 1.15; letter-spacing: -.04em; }.about-copy > p:not(.eyebrow) { margin: 20px 0 0; color: #aab4c4; line-height: 1.95; }.score-cards { margin-top: 28px; display: flex; gap: 12px; direction: ltr; }.score-cards div { min-width: 120px; padding: 14px 18px; display: flex; align-items: baseline; justify-content: space-between; gap: 14px; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; background: rgba(255,255,255,.04); }.score-cards strong { font-size: 21px; }.score-cards div:first-child strong { color: #ff7189; }.score-cards div:last-child strong { color: #67b9ff; }.score-cards span { color: #7e899d; font-size: 9px; font-weight: 800; }
.about-actions { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: stretch; gap: 11px; }.about-actions small { color: #758095; font-size: 10px; text-align: center; }

.site-footer { width: var(--container); margin: 0 auto; padding: 55px 0 32px; display: grid; grid-template-columns: 1.4fr .7fr .7fr; gap: 50px; border-top: 1px solid rgba(255,255,255,.09); }.site-footer > div:first-child > p { max-width: 380px; margin: 20px 0 0; color: #7f899a; font-size: 13px; }.footer-links,.footer-contact { display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }.footer-links strong,.footer-contact strong { margin-bottom: 7px; color: #dfe4ed; font-size: 13px; }.footer-links a,.footer-contact a { color: #818b9c; font-size: 12px; transition: color .2s ease; }.footer-links a:hover,.footer-contact a:hover { color: #fff; }.footer-bottom { grid-column: 1 / -1; padding-top: 26px; display: flex; justify-content: space-between; gap: 20px; color: #5d6676; font-size: 9px; border-top: 1px solid rgba(255,255,255,.06); direction: ltr; }

.contact-dock { position: fixed; bottom: max(24px, env(safe-area-inset-bottom)); left: max(24px, env(safe-area-inset-left)); z-index: 95; direction: ltr; }
.contact-toggle { position: relative; min-width: 128px; height: 54px; padding: 0 14px 0 17px; display: flex; align-items: center; justify-content: space-between; gap: 11px; color: #fff; border: 1px solid rgba(255,255,255,.17); border-radius: 999px; background: rgba(12,17,29,.85); box-shadow: 0 22px 55px rgba(0,0,0,.48), inset 0 1px rgba(255,255,255,.13); backdrop-filter: blur(20px); cursor: pointer; }.contact-toggle .pulse { width: 11px; height: 11px; border-radius: 50%; background: #22d891; box-shadow: 0 0 0 7px rgba(34,216,145,.1),0 0 18px rgba(34,216,145,.62); }.contact-toggle b { font-size: 12px; }.contact-toggle i { width: 25px; height: 25px; display: grid; place-items: center; font-size: 18px; font-style: normal; border-radius: 50%; background: rgba(255,255,255,.08); transition: transform .25s ease; }.contact-toggle[aria-expanded="true"] i { transform: rotate(45deg); }
.contact-menu { position: absolute; bottom: 66px; left: 0; min-width: 190px; display: grid; gap: 8px; opacity: 0; visibility: hidden; transform: translateY(14px) scale(.96); transform-origin: bottom left; transition: opacity .24s ease, visibility .24s ease, transform .24s ease; }.contact-menu.open { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }.contact-option { min-height: 47px; padding: 7px 8px 7px 14px; display: flex; align-items: center; justify-content: space-between; gap: 15px; color: #dbe2ec; font-size: 11px; font-weight: 700; border: 1px solid rgba(255,255,255,.11); border-radius: 14px; background: rgba(11,16,27,.94); box-shadow: 0 14px 36px rgba(0,0,0,.32); backdrop-filter: blur(18px); }.contact-option b { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 10px; font-size: 10px; background: rgba(255,255,255,.07); }.contact-option.whatsapp b { color: #55e7b3; background: rgba(32,215,144,.12); }.contact-option.personal b { color: #6abaff; background: rgba(31,122,255,.12); }.contact-option.call b { color: #ff7891; background: rgba(255,49,88,.12); }

.course-dialog { width: min(1080px, 92vw); max-height: 88vh; padding: 0; overflow: hidden; color: var(--text); border: 1px solid rgba(255,255,255,.16); border-radius: 30px; background: #0b101b; box-shadow: 0 45px 130px rgba(0,0,0,.75); }.course-dialog[open] { display: grid; grid-template-columns: .78fr 1.22fr; animation: dialog-in .32s cubic-bezier(.2,.8,.2,1); }.course-dialog::backdrop { background: rgba(1,3,8,.84); backdrop-filter: blur(14px); }.dialog-close { position: absolute; top: 16px; right: 16px; z-index: 5; width: 42px; height: 42px; color: #fff; font-size: 26px; line-height: 1; border: 1px solid rgba(255,255,255,.14); border-radius: 50%; background: rgba(8,12,20,.78); backdrop-filter: blur(12px); cursor: pointer; }.dialog-poster { min-height: 620px; background: #101522 center top / cover no-repeat; }.dialog-content { padding: clamp(36px,5vw,70px); overflow-y: auto; }.dialog-eyebrow { margin: 0 0 10px; color: var(--dialog-accent,#66b7ff); font-size: 10px; font-weight: 800; letter-spacing: .17em; direction: ltr; text-align: right; }.dialog-content h2 { margin: 0; font-size: clamp(2rem,4vw,4.4rem); line-height: 1.05; letter-spacing: -.045em; direction: ltr; text-align: right; }.dialog-description { margin: 24px 0 0; color: #aeb8c8; line-height: 1.9; }.dialog-content ul { margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; list-style: none; }.dialog-content li { position: relative; padding: 10px 30px 10px 12px; color: #cad2de; font-size: 12px; border: 1px solid rgba(255,255,255,.085); border-radius: 12px; background: rgba(255,255,255,.035); }.dialog-content li::before { content: "✓"; position: absolute; right: 10px; color: var(--dialog-accent,#66b7ff); font-weight: 800; }.dialog-note { margin-top: 22px; padding: 13px 15px; color: #919cad; font-size: 11px; border-right: 3px solid var(--dialog-accent,#66b7ff); background: rgba(255,255,255,.028); }.dialog-note:empty { display: none; }.dialog-footer { margin-top: 30px; padding-top: 24px; display: flex; align-items: end; justify-content: space-between; gap: 20px; border-top: 1px solid rgba(255,255,255,.09); }.dialog-footer > div { display: grid; }.dialog-footer small { color: #788397; font-size: 10px; }.dialog-footer strong { font-size: 27px; line-height: 1.3; direction: ltr; }.dialog-footer del { color: #6d7789; font-size: 11px; direction: ltr; }.dialog-footer del:empty { display: none; }

.reveal { opacity: 0; transform: translateY(32px); transition: opacity .8s cubic-bezier(.2,.65,.2,1), transform .8s cubic-bezier(.2,.65,.2,1); transition-delay: var(--reveal-delay,0ms); }.reveal.visible { opacity: 1; transform: translateY(0); }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse-dot { 50% { box-shadow: 0 0 0 8px rgba(32,215,144,0),0 0 22px rgba(32,215,144,.9); } }
@keyframes breathe { 50% { transform: scale(1.16); opacity: .46; } }
@keyframes ring-float { 50% { transform: rotate(2deg) scale(1.025); border-color: rgba(255,255,255,.22); } }
@keyframes panel-float { 50% { translate: 0 -12px; } }
@keyframes grow-bar { from { transform: scaleY(.68); filter: saturate(.75); } to { transform: scaleY(1); filter: saturate(1.15); } }
@keyframes draw-line { from { stroke-dashoffset: 400; opacity: .55; } to { stroke-dashoffset: 0; opacity: 1; } }
@keyframes scroll-dot { 0% { opacity: 0; transform: translateY(0); } 35% { opacity: 1; } 100% { opacity: 0; transform: translateY(13px); } }
@keyframes marquee { to { transform: translateX(-50%); } }
@keyframes orbit-spin { to { rotate: 360deg; } }
@keyframes coin-float { 50% { transform: translateY(-9px) rotate(7deg); } }
@keyframes orb-float { 50% { transform: translate(16px,-14px) rotate(6deg); } }
@keyframes dialog-in { from { opacity: 0; transform: translateY(22px) scale(.975); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (min-width: 1800px) {
  :root { --container: min(90vw, 1760px); }
  .site-header { width: min(92vw, 1780px); }
  .hero { grid-template-columns: .92fr 1.08fr; }
  .hero-stage { min-height: 820px; }
  .portrait-frame { max-width: 560px; }
  .floating-panel { transform: scale(1.1); }
  .projects-section { padding-inline: max(5vw, calc((100vw - 1760px)/2)); }
}

@media (max-width: 1180px) {
  .hero { grid-template-columns: .95fr 1.05fr; gap: 25px; }
  .hero-stage { min-height: 570px; }
  .floating-panel { transform: scale(.9); }.data-panel { left: -5%; }.finance-panel { right: -5%; }
  .course-card { min-height: 550px; padding: 30px; grid-template-columns: 1.12fr .88fr; }.poster-art { height: 77%; }
  .section-heading { grid-template-columns: .4fr 1.2fr .8fr; }
  .project-display { min-height: 460px; }.display-grid { height: 375px; }
}

@media (max-width: 920px) {
  .site-header { min-height: 72px; padding: 6px 10px 6px 14px; }.brand-mark { width: 68px; height: 45px; }.brand-logo { width: 84px; height: 60px; }.nav-toggle { display: block; }
  .main-nav { position: absolute; top: calc(100% + 9px); right: 0; left: 0; padding: 17px; display: grid; gap: 5px; opacity: 0; visibility: hidden; transform: translateY(-8px); border: 1px solid rgba(255,255,255,.11); border-radius: 18px; background: rgba(6,9,16,.95); box-shadow: 0 25px 60px rgba(0,0,0,.45); backdrop-filter: blur(22px); transition: opacity .22s ease,visibility .22s ease,transform .22s ease; }.main-nav.open { opacity: 1; visibility: visible; transform: translateY(0); }.main-nav > a { padding: 10px 12px; }.main-nav .nav-cta { margin-top: 5px; text-align: center; }
  .hero { min-height: auto; padding: 135px 0 100px; grid-template-columns: 1fr; }.hero::before { display: none; }.hero-copy { max-width: 730px; }.hero h1 { font-size: clamp(3.4rem,10vw,6.4rem); }.hero-stage { width: min(100%,680px); min-height: 660px; margin: 10px auto 0; }.portrait-frame { width: min(60%,440px); }.scroll-cue { display: none; }
  .section-heading { grid-template-columns: .4fr 1.2fr; }.section-heading > p { grid-column: 2; }.featured-courses { grid-template-columns: 1fr; }.course-card { min-height: 620px; }.course-grid { grid-template-columns: 1fr 1fr; }.career-card { grid-column: 1 / -1; display: grid; grid-template-columns: .9fr 1.1fr; min-height: 300px; }.career-card .compact-visual { height: 100%; }.career-card .compact-copy { padding: 20px; }
  .resource-grid { grid-template-columns: 1fr; }.resource-card { min-height: 150px; }
  .projects-shell { grid-template-columns: 1fr; }.project-display { transform: none; }
  .about-card { grid-template-columns: .45fr 1.1fr; }.about-actions { grid-column: 1 / -1; align-items: center; }.about-actions .button { width: min(100%,400px); }
  .site-footer { grid-template-columns: 1fr 1fr; }.site-footer > div:first-child { grid-column: 1 / -1; }
}

@media (max-width: 620px) {
  :root { --container: min(91vw, 560px); --radius-lg: 26px; }
  body { font-size: 16px; }
  .site-header { top: 10px; width: 94vw; border-radius: 18px; }.brand-copy strong { font-size: 12px; }.brand-copy small { font-size: 9px; }.brand-mark { width: 62px; height: 43px; }.brand-logo { width: 76px; height: 56px; }
  .hero { padding-top: 118px; padding-bottom: 70px; }.availability { margin-bottom: 18px; }.hero-kicker { font-size: 10px; letter-spacing: .2em; }.hero h1 { font-size: clamp(2.9rem,15vw,4.7rem); line-height: 1.04; }.hero-intro { margin-top: 21px; font-size: 15px; line-height: 1.85; }.hero-actions { margin-top: 27px; }.hero-actions .button { flex: 1; min-width: 150px; padding-inline: 15px; }.hero-proof { margin-top: 35px; gap: 18px; justify-content: space-between; }.hero-proof strong { font-size: 1.75rem; }.hero-proof small { font-size: 8px; }
  .hero-stage { min-height: 540px; margin-top: 25px; }.portrait-frame { width: 68%; max-width: 340px; border-radius: 31px; }.portrait-frame img,.portrait-frame::after { border-radius: 24px; }.portrait-caption { right: 16px; bottom: 16px; left: 16px; padding: 10px; display: grid; }.portrait-caption strong { font-size: 10px; }.portrait-caption span { font-size: 8px; }.portrait-ring { inset: -17px; border-radius: 38px; }.floating-panel { width: 160px; padding: 12px; border-radius: 17px; transform: scale(.82); }.data-panel { left: -12%; bottom: 15%; }.finance-panel { top: 11%; right: -15%; width: 176px; }.mini-bars { height: 64px; gap: 6px; }.panel-metric strong { font-size: 15px; }.skill-pill { font-size: 8px; }.pill-one { left: 1%; top: 22%; }.pill-two { right: -2%; bottom: 23%; }.pill-three { left: 12%; bottom: 4%; }
  .credential-track { gap: 21px; }.credential-track span { font-size: 11px; }
  .section { padding: 90px 0; }.section-heading { margin-bottom: 34px; grid-template-columns: 1fr; gap: 16px; }.section-heading > div:first-child { grid-column: 1; }.section-heading > p { grid-column: 1; font-size: 14px; }.section-heading h2,.projects-copy h2 { font-size: clamp(2.1rem,11vw,3.2rem); }.section-index { width: 36px; height: 36px; }
  .course-card { min-height: 730px; padding: 24px; grid-template-columns: 1fr; grid-template-rows: auto 280px; gap: 18px; }.course-copy h3 { font-size: 2.45rem; }.course-copy > p:not(.course-code) { font-size: 13px; }.price-row { padding-top: 20px; }.poster-art { grid-row: 2; width: 70%; height: 270px; margin: auto; transform: rotateY(-7deg) rotateX(2deg); }.poster-art img { border-radius: 17px; }.course-grid { grid-template-columns: 1fr; }.career-card { grid-column: auto; display: flex; min-height: 470px; }.career-card .compact-visual { height: 225px; }.career-card .compact-copy { padding: 21px 7px 4px; }
  .resource-card { padding: 20px; grid-template-columns: 62px 1fr auto; gap: 14px; }.resource-icon { width: 58px; height: 58px; border-radius: 17px; }.resource-card h3 { font-size: 17px; }
  .projects-section { padding-inline: 4.5vw; }.projects-shell { padding: 26px; border-radius: 28px; }.project-display { min-height: 385px; padding: 10px; }.display-grid { height: 325px; padding: 10px; grid-template-columns: 1fr 1fr; }.kpi { padding: 15px; }.kpi strong { font-size: 28px; }.chart-placeholder { grid-column: 2; gap: 5%; padding: 18px 10px 10px; }.donut { display: none!important; }.project-lock { grid-column: 1 / -1; }.project-tags { gap: 6px; }
  .about-card { padding: 28px; grid-template-columns: 1fr; border-radius: 28px; }.about-monogram { width: 150px; margin: auto; }.about-copy h2 { font-size: 2.25rem; }.about-copy > p:not(.eyebrow) { font-size: 14px; }.score-cards div { min-width: 0; flex: 1; padding: 12px; }.about-actions { grid-column: 1; }
  .site-footer { padding-bottom: 100px; grid-template-columns: 1fr; gap: 30px; }.site-footer > div:first-child { grid-column: auto; }.footer-bottom { grid-column: auto; flex-direction: column; }
  .contact-dock { right: 16px; bottom: max(14px,env(safe-area-inset-bottom)); left: 16px; display: flex; justify-content: center; pointer-events: none; }.contact-toggle { pointer-events: auto; min-width: 132px; }.contact-menu { right: 0; bottom: 66px; left: 0; min-width: 100%; pointer-events: auto; transform-origin: bottom center; }.contact-option { min-height: 52px; }
  .course-dialog { width: 94vw; max-height: 90vh; overflow-y: auto; }.course-dialog[open] { grid-template-columns: 1fr; }.dialog-poster { min-height: 270px; background-size: cover; background-position: center top; }.dialog-content { padding: 28px 22px 25px; overflow: visible; }.dialog-content h2 { font-size: 2.25rem; }.dialog-content ul { grid-template-columns: 1fr; }.dialog-footer { align-items: stretch; flex-direction: column; }.dialog-footer .button { width: 100%; }.dialog-close { top: 10px; right: 10px; }
}

@media (hover: none) {
  .tilt-card { transform: none!important; }
  .card-glare { display: none; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  /* Keep the small, course-specific visual inside the details dialog alive.
     The rest of the page still honours the visitor's reduced-motion setting. */
  *:not(.course-art):not(.course-art *),
  *:not(.course-art):not(.course-art *)::before,
  *:not(.course-art):not(.course-art *)::after {
    animation-duration: .01ms!important;
    animation-iteration-count: 1!important;
    transition-duration: .01ms!important;
  }
  .reveal { opacity: 1; transform: none; }
  #ambient-canvas { display: none; }
}

/* Course detail artwork */
.dialog-poster {
  min-height: 620px;
  overflow: hidden;
  display: grid;
  place-items: center;
  background: #101522;
}
.dialog-poster.has-poster {
  padding: 24px;
  background: radial-gradient(circle at 50% 20%, color-mix(in srgb, var(--dialog-accent) 22%, transparent), transparent 48%), #090e18;
}
.dialog-poster.has-poster img {
  width: 100%;
  height: 100%;
  max-height: 660px;
  object-fit: contain;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 20px;
  box-shadow: 0 25px 60px rgba(0,0,0,.5);
}
.accounting-poster {
  position: relative;
  background: radial-gradient(circle at 50% 45%, rgba(255,191,72,.25), transparent 34%), linear-gradient(145deg,#19150d,#080b12);
}
.accounting-poster::before {
  content: "";
  position: absolute;
  width: 75%;
  aspect-ratio: 1;
  border: 1px dashed rgba(255,211,128,.2);
  border-radius: 50%;
  animation: spin 22s linear infinite;
}
.accounting-emblem {
  position: relative;
  width: 240px;
  aspect-ratio: .84;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255,219,151,.28);
  border-radius: 34px;
  background: linear-gradient(145deg,rgba(255,197,87,.18),rgba(255,255,255,.025));
  box-shadow: 0 35px 80px rgba(0,0,0,.45),inset 0 1px rgba(255,255,255,.16);
  transform: rotate(-5deg);
}
.accounting-emblem span { color: #ffd687; font: 800 92px/1 Georgia,serif; text-shadow: 0 0 38px rgba(255,191,72,.35); }
.accounting-emblem b { margin-top: 20px; font-size: 13px; letter-spacing: .18em; }
.accounting-emblem i { margin-top: 6px; color: #917d58; font-size: 9px; font-style: normal; letter-spacing: .15em; }

@media (max-width: 620px) {
  .dialog-poster { min-height: 270px; }
  .dialog-poster.has-poster { padding: 16px; }
  .dialog-poster.has-poster img { max-height: 330px; }
  .accounting-emblem { width: 155px; }
  .accounting-emblem span { font-size: 58px; }
}

/* Current portfolio pass */
.brand-logo { width: 112px; height: 70px; margin: -4px 0; background: transparent; }
.brand-logo img { filter: drop-shadow(0 5px 12px rgba(0,0,0,.58)); }
.hero h1 { max-width: 760px; line-height: 1.06; }
.hero-main-line, .hero-promise-line, .hero-sub-line { display: block; }
.hero-promise-line { margin-top: 14px; color: #f1f4fa; font-size: clamp(2.35rem, 4.2vw, 5rem); line-height: 1.08; letter-spacing: -.045em; }
.hero-sub-line { margin-top: 28px; color: #f1f4fa; font-size: clamp(1.75rem, 2.8vw, 3.15rem); line-height: 1.22; letter-spacing: -.035em; }
.hero-contact-actions { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px; direction: ltr; }
.contact-button { min-height: 54px; min-width: 205px; padding: 8px 16px; display: inline-flex; align-items: center; justify-content: space-between; gap: 16px; color: #f5f8ff; border: 1px solid rgba(255,255,255,.13); border-radius: 15px; box-shadow: 0 14px 32px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.13); transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease; }
.contact-button span { font-size: 11px; font-weight: 800; direction: rtl; }
.contact-button strong { font-size: 12px; letter-spacing: .04em; }
.contact-button.business { background: linear-gradient(120deg, rgba(22,155,112,.42), rgba(12,49,47,.52)); }
.contact-button.personal { background: linear-gradient(120deg, rgba(24,100,210,.46), rgba(15,36,76,.58)); }
.contact-button:hover, .contact-button:focus-visible { transform: translateY(-4px); border-color: rgba(255,255,255,.34); box-shadow: 0 22px 42px rgba(0,0,0,.34), inset 0 1px rgba(255,255,255,.2); }
.hero-socials { margin-top: 24px; display: flex; align-items: center; flex-wrap: wrap; gap: 9px; direction: ltr; }
.social-label { margin-right: 4px; color: #7f899b; font-size: 10px; font-weight: 800; letter-spacing: .08em; direction: rtl; }
.social-link { min-height: 36px; padding: 6px 10px 6px 7px; display: inline-flex; align-items: center; gap: 7px; color: #aeb8c8; border: 1px solid rgba(255,255,255,.1); border-radius: 999px; background: rgba(255,255,255,.035); transition: transform .25s ease, border-color .25s ease, color .25s ease, background .25s ease; }
.social-link:hover, .social-link:focus-visible { color: #fff; transform: translateY(-3px); border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.09); }
.social-link { min-height: 48px; padding: 6px 13px 6px 8px; gap: 9px; }
.social-link b { font-size: 12px; font-weight: 800; }
.social-mark { width: 34px; height: 34px; display: grid; place-items: center; color: #fff; font: 800 16px/1 Arial,sans-serif; border-radius: 10px; background: rgba(255,255,255,.13); box-shadow: 0 7px 18px rgba(0,0,0,.24); }
.social-link.linkedin .social-mark { background: #0a66c2; }
.social-link.facebook .social-mark { font-size: 17px; background: #1877f2; }
.social-link.instagram .social-mark { font-size: 19px; background: radial-gradient(circle at 68% 16%, #ffd66b 0 13%, #ee4d70 34%, #8b42c8 70%, #4c66d5); }
.social-link.youtube .social-mark { font-size: 10px; background: #f21d35; }

.credential-list { margin-top: 24px; display: flex; flex-wrap: wrap; gap: 7px; direction: ltr; }
.credential-list span { padding: 6px 10px; color: #d7deea; font-size: 10px; font-weight: 800; letter-spacing: .05em; border: 1px solid rgba(255,255,255,.13); border-radius: 9px; background: rgba(255,255,255,.045); }
.credential-list span:nth-child(1), .credential-list span:nth-child(2) { color: #ff8ba0; border-color: rgba(255,49,88,.25); background: rgba(255,49,88,.08); }
.credential-list span:nth-child(3), .credential-list span:nth-child(4) { color: #86c8ff; border-color: rgba(31,122,255,.28); background: rgba(31,122,255,.08); }

.hero-proof { gap: 13px; }
.hero-proof > div { position: relative; min-width: 152px; padding: 15px 17px 13px; overflow: hidden; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: rgba(255,255,255,.045); box-shadow: 0 16px 38px rgba(0,0,0,.22), inset 0 1px rgba(255,255,255,.1); animation: proof-float 4.8s ease-in-out infinite; }
.hero-proof > div:nth-child(2) { animation-delay: -.9s; }
.hero-proof > div:nth-child(3) { animation-delay: -1.8s; }
.hero-proof > div::after { content: ""; position: absolute; inset: -80% -45%; pointer-events: none; background: linear-gradient(110deg, transparent 38%, rgba(255,255,255,.18) 50%, transparent 62%); transform: translateX(-75%) rotate(8deg); animation: proof-shine 5.2s ease-in-out infinite; }
.hero-proof strong { position: relative; z-index: 1; font-size: clamp(2.45rem, 3.1vw, 3.45rem); }
.hero-proof > div > span { position: relative; z-index: 1; font-size: 16px; }
.hero-proof small { position: relative; z-index: 1; margin-top: 8px; font-size: 12px; }

.project-counter { margin-top: 32px; display: flex; align-items: baseline; gap: 9px; direction: ltr; }
.project-counter strong { color: #73baff; font-size: 42px; line-height: 1; letter-spacing: -.04em; }
.project-counter span { color: #718096; font-size: 11px; font-weight: 700; }
.project-display { min-height: 640px; }
.project-viewer { position: relative; z-index: 2; min-height: 495px; display: grid; grid-template-columns: 44px minmax(0,1fr) 44px; align-items: center; gap: 10px; direction: ltr; }
.project-figure { min-width: 0; margin: 0; display: grid; gap: 12px; }
.project-figure img { width: 100%; height: min(420px, 31vw); min-height: 270px; object-fit: contain; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: #050a13; box-shadow: 0 22px 45px rgba(0,0,0,.38); transition: opacity .24s ease, transform .24s ease; }
.project-figure img.is-switching { opacity: .28; transform: scale(.985); }
.project-figure figcaption { min-height: 46px; padding: 0 4px; display: flex; flex-direction: column; justify-content: center; direction: ltr; text-align: left; }
.project-figure figcaption strong { color: #edf4ff; font-size: 13px; line-height: 1.4; }
.project-figure figcaption span { margin-top: 2px; color: #76849b; font-size: 10px; }
.project-nav, .review-nav { width: 40px; height: 40px; display: grid; place-items: center; color: #dce8f8; font-size: 32px; line-height: 1; border: 1px solid rgba(255,255,255,.15); border-radius: 50%; background: rgba(255,255,255,.055); cursor: pointer; transition: transform .22s ease, color .22s ease, background .22s ease, border-color .22s ease; }
.project-nav:hover, .project-nav:focus-visible, .review-nav:hover, .review-nav:focus-visible { color: #fff; border-color: rgba(91,178,255,.65); background: rgba(31,122,255,.22); transform: scale(1.08); }
.project-thumbs { position: relative; z-index: 2; padding: 11px 2px 2px; display: flex; gap: 8px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: #31415d transparent; direction: ltr; }
.project-thumb { flex: 0 0 78px; width: 78px; height: 50px; padding: 2px; overflow: hidden; border: 1px solid rgba(255,255,255,.11); border-radius: 9px; background: rgba(255,255,255,.04); opacity: .58; cursor: pointer; transition: transform .22s ease, opacity .22s ease, border-color .22s ease; }
.project-thumb img { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; }
.project-thumb:hover, .project-thumb.active { opacity: 1; transform: translateY(-3px); border-color: #55aaff; }
.project-thumb.active { box-shadow: 0 0 0 2px rgba(31,122,255,.25), 0 8px 24px rgba(31,122,255,.18); }

.reviews-section { padding-top: 40px; }
.reviews-showcase { position: relative; width: min(100%, 1180px); margin: 0 auto; padding: 25px; display: grid; grid-template-columns: 48px minmax(0,1fr) 48px; align-items: center; gap: 16px; border: 1px solid rgba(255,255,255,.11); border-radius: 32px; background: radial-gradient(circle at 50% 0, rgba(255,49,88,.1), transparent 45%), linear-gradient(145deg, rgba(20,17,27,.92), rgba(9,11,18,.96)); box-shadow: 0 34px 90px rgba(0,0,0,.34); }
.review-figure { min-width: 0; margin: 0; display: grid; gap: 14px; }
.review-figure img { width: 100%; height: min(550px, 48vw); min-height: 265px; object-fit: contain; border: 1px solid rgba(255,255,255,.13); border-radius: 18px; background: #0c0c12; box-shadow: 0 22px 55px rgba(0,0,0,.42); transition: opacity .24s ease, transform .24s ease; }
.review-figure img.is-switching { opacity: .28; transform: scale(.985); }
.review-figure figcaption { display: flex; flex-direction: column; gap: 2px; direction: rtl; text-align: right; }
.review-figure figcaption strong { color: #fff; font-size: 14px; }
.review-figure figcaption span { color: #909caf; font-size: 11px; }
.review-dots { grid-column: 1 / -1; display: flex; justify-content: center; gap: 8px; direction: ltr; }
.review-dot { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 50%; background: #3c465a; cursor: pointer; transition: width .22s ease, background .22s ease, box-shadow .22s ease; }
.review-dot.active { width: 27px; border-radius: 999px; background: linear-gradient(90deg, var(--red), #ff9d6c); box-shadow: 0 0 16px rgba(255,49,88,.35); }

.dialog-contact-block { min-width: min(100%, 390px); display: grid; gap: 9px; }
.dialog-contact-block > span { color: #aab5c5; font-size: 10px; font-weight: 700; }
.dialog-contact-options { display: flex; flex-wrap: wrap; gap: 8px; }
.dialog-contact-options .button { min-height: 52px; flex: 1 1 160px; padding: 8px 13px; display: flex; flex-direction: column; gap: 1px; align-items: center; }
.dialog-contact-options .button span { font-size: 11px; line-height: 1.3; }
.dialog-contact-options .button small { color: rgba(255,255,255,.68); font-size: 10px; line-height: 1.25; letter-spacing: .04em; }

@media (max-width: 1180px) {
  .hero h1 { max-width: 650px; }
  .project-display { min-height: 585px; }
  .project-viewer { min-height: 445px; }
  .project-figure img { height: min(355px, 40vw); }
}

@media (max-width: 920px) {
  .brand-logo { width: 100px; height: 66px; }
  .hero-socials { margin-top: 22px; }
  .hero-proof > div { min-width: 136px; }
  .project-display { min-height: 570px; }
  .project-viewer { min-height: 430px; }
  .project-figure img { height: min(360px, 58vw); }
  .reviews-showcase { padding: 19px; }
  .review-figure img { height: min(470px, 60vw); }
}

@media (max-width: 620px) {
  .brand-logo { width: 90px; height: 62px; margin: -3px 0; }
  .hero h1 { max-width: 100%; font-size: clamp(2.55rem, 13.4vw, 4.4rem); line-height: 1.08; }
  .hero-sub-line { margin-top: 18px; font-size: clamp(1.45rem, 6.3vw, 2.15rem); line-height: 1.35; }
  .hero-contact-actions { gap: 8px; }
  .contact-button { min-width: 0; flex: 1 1 100%; min-height: 50px; padding-inline: 13px; }
  .hero-socials { gap: 7px; }
  .social-label { width: 100%; margin: 0 0 1px; }
  .social-link { min-height: 47px; padding-right: 10px; }
  .social-link b { font-size: 10px; }
  .social-mark { width: 32px; height: 32px; }
  .hero-proof { gap: 7px; }
  .hero-proof > div { min-width: 0; flex: 1; padding: 14px 8px 12px; border-radius: 15px; }
  .hero-proof strong { font-size: clamp(1.95rem, 9vw, 2.45rem); }
  .hero-proof > div > span { font-size: 13px; }
  .hero-proof small { font-size: 9px; white-space: nowrap; }
  .credential-list { margin-top: 20px; gap: 6px; }
  .credential-list span { padding: 5px 8px; font-size: 9px; }
  .project-counter { margin-top: 24px; }
  .project-counter strong { font-size: 34px; }
  .project-display { min-height: 470px; padding: 10px; }
  .project-viewer { min-height: 350px; grid-template-columns: 33px minmax(0,1fr) 33px; gap: 5px; }
  .project-nav, .review-nav { width: 32px; height: 32px; font-size: 25px; }
  .project-figure { gap: 8px; }
  .project-figure img { height: 255px; min-height: 0; border-radius: 13px; }
  .project-figure figcaption { min-height: 53px; }
  .project-figure figcaption strong { font-size: 11px; }
  .project-figure figcaption span { font-size: 9px; }
  .project-thumb { flex-basis: 65px; width: 65px; height: 43px; }
  .reviews-section { padding-top: 20px; }
  .reviews-showcase { padding: 13px 9px 15px; grid-template-columns: 34px minmax(0,1fr) 34px; gap: 4px; border-radius: 24px; }
  .review-figure { gap: 9px; }
  .review-figure img { height: 270px; min-height: 0; border-radius: 13px; }
  .review-figure figcaption strong { font-size: 12px; }
  .review-figure figcaption span { font-size: 10px; }
  .dialog-contact-options { flex-direction: column; }
  .dialog-contact-options .button { flex-basis: auto; }
}

@media (prefers-reduced-motion: reduce) {
  .project-figure img, .review-figure img { transition: none; }
}

@keyframes proof-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-7px); }
}
@keyframes proof-shine {
  0%, 38% { transform: translateX(-75%) rotate(8deg); }
  65%, 100% { transform: translateX(75%) rotate(8deg); }
}

/* Connection row, theme switcher and FAQ assistant */
.brand { direction: rtl; gap: 20px; }
.brand-copy { text-align: right; }
.main-nav .nav-cta { display: inline-flex; flex-direction: column; align-items: center; gap: 1px; line-height: 1.15; }
.main-nav .nav-cta small { color: rgba(255,255,255,.74); font-size: 7px; font-weight: 700; letter-spacing: .01em; }
.about-actions .button { flex-direction: column; gap: 2px; }
.about-actions .button > small { color: rgba(255,255,255,.75); font-size: 8px; line-height: 1.2; }
.theme-toggle { flex: 0 0 auto; min-width: 74px; height: 42px; padding: 0 10px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; color: #dbe7f8; border: 1px solid rgba(255,255,255,.13); border-radius: 12px; background: rgba(255,255,255,.055); box-shadow: inset 0 1px rgba(255,255,255,.1); cursor: pointer; transition: color .25s ease, background .25s ease, border-color .25s ease, transform .25s ease; }
.theme-toggle:hover, .theme-toggle:focus-visible { color: #fff; border-color: rgba(100,181,255,.52); background: rgba(31,122,255,.16); transform: translateY(-2px); }
.theme-toggle-icon { width: 22px; height: 22px; display: grid; place-items: center; color: #ffd66d; font-size: 17px; line-height: 1; }
.theme-toggle-label { font-size: 10px; font-weight: 800; }
.hero-connect { margin-top: 18px; }
.connect-label { margin: 0 0 9px; color: #8997ac; font-size: 11px; font-weight: 800; }
.hero-contact-social-row { display: flex; align-items: center; gap: 9px; direction: ltr; flex-wrap: nowrap; }
.hero-contact-actions { margin-top: 0; flex: 0 1 auto; display: flex; align-items: center; gap: 7px; flex-wrap: nowrap; }
.contact-button { min-width: 155px; min-height: 57px; padding: 8px 10px; flex-direction: column; align-items: center; justify-content: center; gap: 2px; }
.contact-button span { font-size: 10px; line-height: 1.35; }
.contact-button strong { font-size: 9px; letter-spacing: 0; white-space: nowrap; }
.hero-socials { min-width: 0; margin-top: 0; flex: 1 1 auto; flex-wrap: nowrap; gap: 6px; }
.social-link { min-height: 45px; padding: 5px 7px 5px 5px; gap: 5px; }
.social-link b { font-size: 10px; }
.social-mark { width: 30px; height: 30px; border-radius: 9px; font-size: 14px; }
.social-mark svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.social-mark svg .instagram-dot { fill: currentColor; stroke: none; }
.contact-option > span { display: grid; gap: 1px; }
.contact-option > span small { color: #91a0b4; font-size: 8px; font-weight: 600; line-height: 1.2; letter-spacing: .02em; }
.achievements-art { min-width: 0; width: min(100%, 390px); justify-self: center; aspect-ratio: 1; overflow: hidden; border-radius: 28px; background: #eaf4ff; transform: none; box-shadow: 0 30px 75px rgba(0,0,0,.36), 0 0 55px rgba(74,159,255,.16); }
.achievements-art::before { display: none; }
.achievements-art img { width: 100%; height: 100%; object-fit: cover; border-radius: inherit; filter: none; }
.about-copy h2 + p { margin-top: 20px; }
.about-copy > p:not(.eyebrow) + p { margin-top: 11px; }
.resource-icon svg { position: relative; z-index: 2; width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }
.resource-icon svg rect { fill: none; }
.resource-icon i { z-index: 1; }
.resource-card:hover .resource-icon { box-shadow: 0 0 26px currentColor, inset 0 1px rgba(255,255,255,.22); }

.faq-bot { position: fixed; right: max(24px, env(safe-area-inset-right)); bottom: max(24px, env(safe-area-inset-bottom)); z-index: 96; direction: rtl; }
.faq-bot-toggle { min-width: 150px; height: 54px; padding: 0 13px; display: flex; align-items: center; justify-content: space-between; gap: 9px; color: #fff; border: 1px solid rgba(117,194,255,.42); border-radius: 999px; background: linear-gradient(120deg, #123c82, #176fe6); box-shadow: 0 22px 50px rgba(0,0,0,.42), 0 0 35px rgba(31,122,255,.24), inset 0 1px rgba(255,255,255,.2); cursor: pointer; transition: transform .25s ease, box-shadow .25s ease; }
.faq-bot-toggle:hover, .faq-bot-toggle:focus-visible { transform: translateY(-4px); box-shadow: 0 28px 58px rgba(0,0,0,.5), 0 0 44px rgba(31,122,255,.38), inset 0 1px rgba(255,255,255,.25); }
.faq-bot-toggle > span:not(.faq-bot-spark) { font-size: 11px; font-weight: 800; }
.faq-bot-toggle i { width: 24px; height: 24px; display: grid; place-items: center; font-size: 18px; font-style: normal; border-radius: 50%; background: rgba(255,255,255,.12); transition: transform .25s ease; }
.faq-bot.open .faq-bot-toggle i { transform: rotate(45deg); }
.faq-bot-spark { width: 28px; height: 28px; display: grid; place-items: center; color: #bde1ff; font-size: 18px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(255,255,255,.1); animation: bot-spark 2.4s ease-in-out infinite; }
.faq-bot-panel { position: absolute; right: 0; bottom: 65px; width: min(370px, calc(100vw - 32px)); overflow: hidden; display: grid; grid-template-rows: auto minmax(150px, 1fr) auto auto; opacity: 0; visibility: hidden; transform: translateY(14px) scale(.97); transform-origin: bottom right; border: 1px solid rgba(110,184,255,.28); border-radius: 22px; background: rgba(10,18,34,.96); box-shadow: 0 32px 80px rgba(0,0,0,.58), 0 0 46px rgba(31,122,255,.16); backdrop-filter: blur(22px); transition: opacity .24s ease, visibility .24s ease, transform .24s ease; }
.faq-bot.open .faq-bot-panel { opacity: 1; visibility: visible; transform: translateY(0) scale(1); }
.faq-bot-panel > header { padding: 14px 15px 12px; display: flex; align-items: center; justify-content: space-between; gap: 10px; border-bottom: 1px solid rgba(255,255,255,.09); background: linear-gradient(120deg, rgba(31,122,255,.16), rgba(255,49,88,.1)); }
.faq-bot-panel > header > div { display: grid; gap: 1px; }
.faq-bot-panel > header strong { color: #fff; font-size: 16px; }
.faq-bot-panel > header small { color: #b4c1d3; font-size: 12px; line-height: 1.55; }
.faq-bot-panel > header button { width: 28px; height: 28px; display: grid; place-items: center; color: #b9c9df; font-size: 20px; line-height: 1; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; background: rgba(255,255,255,.05); cursor: pointer; }
.faq-messages { max-height: 390px; overflow-y: auto; padding: 15px; display: grid; align-content: start; gap: 10px; scrollbar-width: thin; scrollbar-color: #385074 transparent; }
.faq-message { max-width: 94%; padding: 11px 13px; color: #edf4ff; font-size: 14px; line-height: 1.85; direction: rtl; text-align: right; unicode-bidi: plaintext; white-space: pre-line; border: 1px solid rgba(255,255,255,.1); border-radius: 15px; }
.faq-message.bot { justify-self: start; border-top-left-radius: 4px; background: rgba(31,122,255,.14); }
.faq-message.user { justify-self: end; border-top-right-radius: 4px; background: rgba(255,49,88,.14); }
.faq-quick { max-height: 152px; overflow-y: auto; padding: 2px 13px 12px; display: flex; flex-wrap: wrap; gap: 7px; scrollbar-width: thin; scrollbar-color: #385074 transparent; }
.faq-quick button { min-height: 38px; max-width: 100%; padding: 7px 11px; color: #c4e3ff; font-size: 12px; line-height: 1.45; text-align: right; white-space: normal; border: 1px solid rgba(79,164,255,.34); border-radius: 12px; background: rgba(31,122,255,.1); cursor: pointer; transition: background .2s ease, color .2s ease, transform .2s ease; }
.faq-quick button:hover, .faq-quick button:focus-visible { color: #fff; background: rgba(31,122,255,.24); transform: translateY(-2px); }
.faq-form { padding: 11px; display: flex; gap: 8px; border-top: 1px solid rgba(255,255,255,.09); }
.faq-form input { min-width: 0; min-height: 46px; flex: 1; padding: 10px 12px; color: #ecf5ff; font: inherit; font-size: 14px; border: 1px solid rgba(255,255,255,.12); border-radius: 12px; outline: none; background: rgba(255,255,255,.055); }
.faq-form input::placeholder { color: #7f8da3; }
.faq-form input:focus { border-color: rgba(83,173,255,.65); box-shadow: 0 0 0 3px rgba(31,122,255,.13); }
.faq-form button { min-width: 66px; padding: 0 12px; color: #fff; font-size: 13px; font-weight: 800; border: 0; border-radius: 12px; background: #176fe6; cursor: pointer; }

body.light-theme {
  --bg: #f4f7fb;
  --bg-soft: #e9eff7;
  --surface: rgba(255,255,255,.84);
  --surface-strong: #fff;
  --line: rgba(11,37,75,.13);
  --text: #10213d;
  --muted: #5c6d86;
  --shadow: 0 28px 85px rgba(45,75,112,.18);
  color: var(--text);
  background: radial-gradient(circle at 16% 5%, rgba(23,112,255,.11), transparent 30%), radial-gradient(circle at 88% 20%, rgba(214,35,75,.08), transparent 28%), var(--bg);
}
body.light-theme .page-noise { opacity: .018; }
body.light-theme #ambient-canvas { opacity: .18; mix-blend-mode: multiply; }
body.light-theme .site-header { border-color: rgba(16,48,91,.13); background: rgba(255,255,255,.8); box-shadow: 0 18px 55px rgba(45,75,112,.16); }
body.light-theme .site-header.scrolled { background: rgba(255,255,255,.95); box-shadow: 0 18px 55px rgba(45,75,112,.2); }
body.light-theme .brand-mark, body.light-theme .theme-toggle, body.light-theme .nav-toggle { border-color: rgba(16,48,91,.13); background: rgba(16,48,91,.06); }
body.light-theme .brand-copy strong, body.light-theme .theme-toggle-label { color: #10213d; }
body.light-theme .brand-copy small, body.light-theme .main-nav > a { color: #52637c; }
body.light-theme .main-nav > a:hover, body.light-theme .main-nav > a:focus-visible { color: #10213d; }
body.light-theme .nav-toggle span { background: #173155; }
body.light-theme .hero-kicker, body.light-theme .connect-label, body.light-theme .social-label, body.light-theme .eyebrow { color: #647590; }
body.light-theme .hero-promise-line, body.light-theme .hero-sub-line { color: #263d60; }
body.light-theme .hero-intro, body.light-theme .section-heading > p, body.light-theme .course-copy > p:not(.course-code), body.light-theme .compact-copy > span, body.light-theme .about-copy > p:not(.eyebrow) { color: #4f6079; }
body.light-theme .hero-intro strong, body.light-theme .course-copy h3, body.light-theme .compact-copy h3, body.light-theme .about-copy h2 { color: #10213d; }
body.light-theme .availability, body.light-theme .button.ghost, body.light-theme .social-link, body.light-theme .credential-list span, body.light-theme .hero-proof > div { border-color: rgba(16,48,91,.14); background: rgba(255,255,255,.58); }
body.light-theme .availability { color: #38506e; }
body.light-theme .button.ghost { color: #243b5d; }
body.light-theme .social-link { color: #425a78; }
body.light-theme .social-link:hover, body.light-theme .social-link:focus-visible { color: #10213d; background: rgba(31,122,255,.08); }
body.light-theme .hero-proof > div { box-shadow: 0 16px 38px rgba(45,75,112,.13), inset 0 1px rgba(255,255,255,.85); }
body.light-theme .hero-proof small, body.light-theme .score-cards span { color: #60728c; }
body.light-theme .credential-strip { border-color: rgba(16,48,91,.1); background: rgba(255,255,255,.56); }
body.light-theme .credential-track span { color: #526984; }
body.light-theme .credential-strip::before { background: linear-gradient(270deg, var(--bg), transparent); }
body.light-theme .credential-strip::after { background: linear-gradient(90deg, var(--bg), transparent); }
body.light-theme .section-heading h2 span, body.light-theme .projects-copy h2 span { color: #5b7290; }
body.light-theme .section-index { color: #3a5272; border-color: rgba(16,48,91,.18); }
body.light-theme .fmva-card::before { background: radial-gradient(circle at 85% 16%, rgba(255,56,91,.18), transparent 32%), linear-gradient(145deg, #fff5f7, #f4f7fb 60%, #fff); }
body.light-theme .data-card::before { background: radial-gradient(circle at 84% 18%, rgba(31,122,255,.17), transparent 34%), linear-gradient(145deg, #eef7ff, #f8fbff 60%, #edf5ff); }
body.light-theme .course-card, body.light-theme .compact-course, body.light-theme .resource-card { border-color: rgba(16,48,91,.14); box-shadow: 0 28px 70px rgba(45,75,112,.14); }
body.light-theme .course-card::after { background-image: linear-gradient(rgba(16,48,91,.035) 1px, transparent 1px), linear-gradient(90deg, rgba(16,48,91,.035) 1px, transparent 1px); }
body.light-theme .compact-course { background: linear-gradient(155deg, rgba(255,255,255,.98), rgba(239,245,252,.98)); }
body.light-theme .course-flags span, body.light-theme .feature-list li { color: #52637a; border-color: rgba(16,48,91,.12); background: rgba(255,255,255,.55); }
body.light-theme .course-code, body.light-theme .compact-copy > p, body.light-theme .price-row small { color: #647590; }
body.light-theme .price-row strong, body.light-theme .compact-copy strong { color: #10213d; }
body.light-theme .price-row strong em, body.light-theme .compact-copy strong em { color: #5e728e; }
body.light-theme .compact-visual { border-color: rgba(16,48,91,.12); background: #eef4fb; }
body.light-theme .accounting-visual { background: radial-gradient(circle at 50% 40%, rgba(255,191,72,.22), transparent 46%), linear-gradient(145deg,#fffaf0,#f3f6fb); }
body.light-theme .resource-card { background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(239,245,252,.97)); }
body.light-theme .resource-card p, body.light-theme .resource-card > b { color: #5e718c; }
body.light-theme .resource-card div > span { color: #536780; }
body.light-theme .resource-card:hover { border-color: rgba(31,122,255,.34); background: #fff; }
body.light-theme .projects-section { background: linear-gradient(180deg, transparent, rgba(31,122,255,.07) 40%, rgba(255,49,88,.045) 80%, transparent); }
body.light-theme .projects-shell { border-color: rgba(16,48,91,.14); background: linear-gradient(145deg, rgba(255,255,255,.9), rgba(238,245,253,.92)); box-shadow: 0 34px 90px rgba(45,75,112,.15); }
body.light-theme .projects-copy > p, body.light-theme .project-counter span { color: #536780; }
body.light-theme .project-counter strong { color: #1676e8; }
body.light-theme .project-display { border-color: rgba(16,48,91,.13); background: rgba(255,255,255,.56); }
body.light-theme .display-top b, body.light-theme .project-figure figcaption strong { color: #183458; }
body.light-theme .project-figure img { border-color: rgba(16,48,91,.14); background: #f1f6fc; box-shadow: 0 22px 45px rgba(45,75,112,.2); }
body.light-theme .project-figure figcaption span { color: #617590; }
body.light-theme .project-nav, body.light-theme .review-nav { color: #365474; border-color: rgba(16,48,91,.16); background: rgba(255,255,255,.72); }
body.light-theme .project-thumb { border-color: rgba(16,48,91,.14); background: rgba(255,255,255,.75); }
body.light-theme .reviews-showcase { border-color: rgba(16,48,91,.14); background: linear-gradient(145deg, rgba(255,255,255,.94), rgba(245,239,246,.94)); box-shadow: 0 34px 90px rgba(45,75,112,.15); }
body.light-theme .review-figure img { border-color: rgba(16,48,91,.14); background: #fff; box-shadow: 0 22px 55px rgba(45,75,112,.2); }
body.light-theme .review-figure figcaption strong { color: #173458; }
body.light-theme .review-figure figcaption span { color: #617590; }
body.light-theme .about-card { border-color: rgba(16,48,91,.14); background: radial-gradient(circle at 10% 30%, rgba(31,122,255,.11), transparent 26%), radial-gradient(circle at 90% 70%, rgba(255,49,88,.09), transparent 26%), linear-gradient(140deg,#ffffff,#edf4fb); box-shadow: 0 32px 90px rgba(45,75,112,.16); }
body.light-theme .score-cards div { border-color: rgba(16,48,91,.14); background: rgba(255,255,255,.72); }
body.light-theme .site-footer { border-color: rgba(16,48,91,.12); }
body.light-theme .site-footer > div:first-child > p, body.light-theme .footer-links a, body.light-theme .footer-contact a { color: #60728b; }
body.light-theme .footer-links strong, body.light-theme .footer-contact strong { color: #2d4768; }
body.light-theme .footer-bottom { color: #73849b; border-color: rgba(16,48,91,.1); }
body.light-theme .contact-toggle, body.light-theme .contact-option { color: #294260; border-color: rgba(16,48,91,.16); background: rgba(255,255,255,.9); box-shadow: 0 22px 55px rgba(45,75,112,.2), inset 0 1px rgba(255,255,255,.9); }
body.light-theme .contact-option > span small { color: #6b7f99; }
body.light-theme .course-dialog { border-color: rgba(16,48,91,.16); background: #f8fbff; box-shadow: 0 45px 130px rgba(45,75,112,.34); }
body.light-theme .course-dialog::backdrop { background: rgba(22,42,70,.35); }
body.light-theme .dialog-close { color: #294260; border-color: rgba(16,48,91,.16); background: rgba(255,255,255,.85); }
body.light-theme .dialog-description { color: #526780; }
body.light-theme .dialog-content li { color: #3f5876; border-color: rgba(16,48,91,.13); background: rgba(31,122,255,.045); }
body.light-theme .dialog-note { color: #5c708b; background: rgba(31,122,255,.05); }
body.light-theme .dialog-footer { border-color: rgba(16,48,91,.12); }
body.light-theme .dialog-footer small { color: #60738e; }
body.light-theme .faq-bot-panel { border-color: rgba(31,122,255,.28); background: rgba(250,253,255,.97); box-shadow: 0 32px 80px rgba(45,75,112,.28), 0 0 46px rgba(31,122,255,.13); }
body.light-theme .faq-bot-panel > header { border-color: rgba(16,48,91,.1); }
body.light-theme .faq-bot-panel > header strong { color: #173458; }
body.light-theme .faq-bot-panel > header small, body.light-theme .faq-message { color: #526780; }
body.light-theme .faq-bot-panel > header button { color: #46617f; border-color: rgba(16,48,91,.13); background: rgba(16,48,91,.05); }
body.light-theme .faq-message { border-color: rgba(16,48,91,.1); }
body.light-theme .faq-message.bot { background: rgba(31,122,255,.09); }
body.light-theme .faq-message.user { background: rgba(255,49,88,.08); }
body.light-theme .faq-form { border-color: rgba(16,48,91,.1); }
body.light-theme .faq-form input { color: #173458; border-color: rgba(16,48,91,.15); background: rgba(16,48,91,.04); }

@keyframes bot-spark { 0%, 100% { transform: rotate(0) scale(1); } 50% { transform: rotate(12deg) scale(1.08); } }

@media (max-width: 1100px) {
  .hero-contact-social-row { flex-wrap: wrap; }
  .hero-contact-actions, .hero-socials { flex: 1 1 100%; }
  .hero-socials { justify-content: center; flex-wrap: wrap; }
}

@media (max-width: 920px) {
  .theme-toggle { min-width: 44px; width: 44px; padding: 0; }
  .theme-toggle-label { display: none; }
  .hero-contact-actions { justify-content: center; }
  .hero-socials { justify-content: center; }
  .achievements-art { width: min(100%, 420px); margin-inline: auto; }
}

@media (max-width: 620px) {
  .brand { gap: 12px; }
  .hero-contact-actions { width: 100%; gap: 6px; }
  .contact-button { min-width: 0; flex: 1 1 calc(50% - 3px); padding-inline: 5px; }
  .contact-button strong { font-size: 8px; }
  .hero-socials { width: 100%; gap: 6px; }
  .social-link { flex: 1 1 calc(50% - 6px); justify-content: center; }
  .resource-card h3 { font-size: 15px; }
  .faq-bot { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); }
  .faq-bot-toggle { min-width: 137px; height: 50px; }
  .faq-bot-panel { right: 0; bottom: 60px; width: calc(100vw - 28px); }
}

@media (prefers-reduced-motion: reduce) {
  .faq-bot-spark { animation: none; }
}

/* Professional certification library, guided assistant and responsive contacts */
.hero-contact-social-row { flex-direction: column; align-items: stretch; gap: 13px; }
.hero-contact-actions { justify-content: center; }
.hero-socials { width: 100%; justify-content: center; }
body.light-theme .hero-proof > div:nth-child(3) strong,
body.light-theme .hero-proof > div:nth-child(3) > span { color: #10213d; }

.certifications-section { overflow: hidden; }
.certifications-section::before { content: ""; position: absolute; inset: 5% -18% 4%; z-index: -1; border: 1px solid rgba(202,214,232,.08); border-radius: 50%; background: radial-gradient(circle at 72% 18%, rgba(255,255,255,.045), transparent 32%), radial-gradient(circle at 15% 78%, rgba(31,122,255,.055), transparent 34%); pointer-events: none; }
.certification-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.certification-card { position: relative; overflow: hidden; padding: clamp(24px, 3vw, 38px); border: 1px solid rgba(222,231,244,.16); border-radius: 28px; background: linear-gradient(145deg, rgba(25,33,49,.97), rgba(8,12,21,.98)); box-shadow: 0 28px 75px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.08); }
.certification-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; background: linear-gradient(90deg, rgba(236,243,252,.95), rgba(146,161,183,.4), rgba(236,243,252,.95)); opacity: .8; }
.certification-card::after { content: ""; position: absolute; inset: 1px; z-index: 0; pointer-events: none; border-radius: 27px; 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: 36px 36px; mask-image: linear-gradient(to bottom, #000, transparent 58%); }
.certification-card > * { position: relative; z-index: 1; }
.cert-card-top { display: flex; align-items: center; gap: 15px; direction: ltr; }
.cert-badge { width: 78px; min-width: 78px; height: 78px; padding: 10px 5px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: #f2f6fc; border: 1px solid rgba(230,237,247,.34); border-radius: 21px; background: linear-gradient(145deg, rgba(235,241,249,.2), rgba(109,124,147,.15)); box-shadow: 0 14px 27px rgba(0,0,0,.24), inset 0 1px rgba(255,255,255,.28); transform: rotate(-4deg); }
.cert-badge strong { font: 900 18px/1 Arial,sans-serif; letter-spacing: -.05em; }
.cert-badge small { color: #bdc9d9; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.cert-kicker { margin: 0 0 4px; color: #9eabbd; font-size: 9px; font-weight: 800; letter-spacing: .16em; direction: ltr; text-align: right; }
.cert-card-top h3 { margin: 0; color: #f2f6fc; font-size: clamp(1.45rem, 2.3vw, 2.35rem); line-height: 1.05; direction: ltr; text-align: right; }
.cert-lead { margin: 20px 0 0; color: #bcc6d5; font-size: 14px; line-height: 1.85; }
.cert-stats { margin: 20px 0 0; display: flex; flex-wrap: wrap; gap: 8px; direction: ltr; }
.cert-stats span { padding: 7px 10px; color: #c5cfdd; font-size: 10px; border: 1px solid rgba(225,233,243,.15); border-radius: 10px; background: rgba(255,255,255,.045); }
.cert-stats b { color: #fff; font-size: 13px; }
.certification-card details { margin-top: 22px; border-top: 1px solid rgba(255,255,255,.09); }
.certification-card summary { padding: 16px 0 5px; color: #f1f5fb; font-size: 13px; font-weight: 800; cursor: pointer; list-style: none; }
.certification-card summary::-webkit-details-marker { display: none; }
.certification-card summary::before { content: "+"; display: inline-grid; place-items: center; width: 22px; height: 22px; margin-inline-start: 8px; color: #e3ebf6; font-size: 18px; font-weight: 400; border: 1px solid rgba(225,233,243,.22); border-radius: 50%; vertical-align: -5px; transition: transform .2s ease; }
.certification-card details[open] summary::before { transform: rotate(45deg); }
.certification-card details > p { margin: 9px 0 0; color: #aeb9c9; font-size: 13px; line-height: 1.85; }
.cert-muted { color: #8f9bad !important; font-size: 11px !important; }
.cert-callout, .cert-fee-line { margin-top: 15px; padding: 12px 13px; color: #c9d3e0; font-size: 12px; line-height: 1.75; border: 1px solid rgba(226,234,244,.14); border-radius: 13px; background: rgba(227,236,247,.06); }
.cert-callout b, .cert-fee-line b { color: #fff; }
.cert-source { display: inline-flex; margin-top: 13px; color: #dce7f5; font-size: 11px; font-weight: 800; text-decoration: underline; text-decoration-color: rgba(220,231,245,.35); text-underline-offset: 3px; }
.cert-source:hover, .cert-source:focus-visible { color: #fff; text-decoration-color: #fff; }
.cert-topic-grid { margin: 15px 0 0; padding: 0 0 0 20px; display: grid; grid-template-columns: 1fr 1fr; gap: 7px 18px; color: #bdc9d8; font-size: 11px; line-height: 1.55; }
.cert-topic-grid li::marker { color: #e7eef8; font-weight: 800; }
.fmva-track-grid { margin-top: 13px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; direction: ltr; }
.fmva-track { padding: 11px; border: 1px solid rgba(225,233,243,.12); border-radius: 14px; background: rgba(255,255,255,.035); }
.fmva-track h4, .acca-levels h4, .cma-parts h4 { margin: 0; color: #edf3fb; font-size: 11px; line-height: 1.4; }
.course-name-list, .competency-list { margin: 9px 0 0; padding: 0; display: grid; gap: 6px; list-style: none; color: #adb9c9; font-size: 10px; line-height: 1.5; }
.course-name-list li { padding-bottom: 5px; border-bottom: 1px solid rgba(255,255,255,.06); }
.course-name-list li:last-child { padding-bottom: 0; border-bottom: 0; }
.acca-levels { margin-top: 14px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.acca-levels > div, .cma-parts > div { padding: 12px; border: 1px solid rgba(225,233,243,.12); border-radius: 14px; background: rgba(255,255,255,.035); }
.acca-levels p { margin: 8px 0 0; color: #b2bdcc; font-size: 10px; line-height: 1.8; }
.cert-dipifr .cert-stats span, .cert-fmaa .cert-stats span { min-width: 120px; }
.ifrs18-box { margin-top: 15px; padding: 13px; border: 1px solid rgba(225,233,243,.15); border-radius: 14px; background: rgba(255,255,255,.045); }
.ifrs18-box h4 { margin: 0; color: #f0f4fa; font-size: 13px; }
.ifrs18-box p { margin: 8px 0 0 !important; font-size: 11px !important; }
.ifrs18-box ul { margin: 9px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; list-style: none; direction: ltr; }
.ifrs18-box li { padding: 5px 8px; color: #c9d4e2; font-size: 10px; border: 1px solid rgba(226,234,244,.14); border-radius: 999px; background: rgba(255,255,255,.055); }
.cma-parts { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cma-parts ul { margin: 8px 0 0; padding: 0 0 0 15px; color: #b2bdcc; font-size: 10px; line-height: 1.7; }
.cma-fees { display: grid; gap: 11px; }
.cma-fees-title { display: block; color: #f2f7fc; font-size: 12px; text-align: right; }
.cma-fee-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.cma-fee-grid section { min-width: 0; padding: 10px; display: grid; gap: 6px; border: 1px solid rgba(255,255,255,.1); border-radius: 11px; background: rgba(255,255,255,.035); text-align: left; }
.cma-fee-grid h5 { margin: 0 0 3px; color: #fff; font-size: 10px; letter-spacing: .03em; }
.cma-fee-grid span { display: flex; align-items: center; justify-content: space-between; gap: 7px; color: #aebac9; font-size: 9px; white-space: nowrap; }
.cma-fee-grid span b { color: #67dfbd; font-size: 11px; }
.cma-exam-summary { margin-top: 14px; padding: 13px; border: 1px solid rgba(226,234,244,.14); border-radius: 14px; background: rgba(227,236,247,.055); }
.cma-exam-summary > strong { display: block; margin-bottom: 9px; color: #edf3fb; font-size: 12px; }
.cma-exam-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 7px; }
.cma-exam-grid span { min-width: 0; padding: 9px 7px; display: grid; gap: 4px; text-align: center; border: 1px solid rgba(255,255,255,.09); border-radius: 10px; background: rgba(255,255,255,.035); }
.cma-exam-grid b { color: #fff; font: 800 11px/1.3 "Segoe UI",Arial,sans-serif; unicode-bidi: isolate; }
.cma-exam-grid small { color: #aebac9; font-size: 9px; line-height: 1.4; }
.cma-fees > p { margin: 0 !important; color: #94a1b3 !important; font-size: 10px !important; line-height: 1.75 !important; text-align: right; }
.cpa-parts { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.cpa-parts span { padding: 10px; color: #c6d0de; font-size: 11px; border: 1px solid rgba(225,233,243,.12); border-radius: 12px; background: rgba(255,255,255,.035); }
.about-action-label { margin: 0 0 9px; color: #cbd6e4; font-size: 12px; font-weight: 800; }
.about-contact-buttons { display: flex; gap: 9px; flex-wrap: wrap; }
.about-contact-buttons .button { min-width: 160px; flex: 1 1 160px; flex-direction: column; gap: 2px; }
.about-contact-buttons .button small { color: rgba(255,255,255,.78); font-size: 9px; line-height: 1.2; }
.about-actions > small { display: block; margin-top: 9px; color: #8996aa; font-size: 10px; }

/* One clear floating control: a larger 3D AI button on every viewport */
.faq-bot { left: max(24px, env(safe-area-inset-left)); right: auto; }
.faq-bot-toggle { min-width: 194px; min-height: 72px; height: 72px; padding: 8px 12px; justify-content: flex-start; gap: 10px; }
.faq-bot-toggle > span.faq-bot-orb { position: relative; width: 50px; height: 50px; min-width: 50px; display: grid; place-items: center; color: #fff; font: 900 14px/1 Arial,sans-serif; letter-spacing: .04em; border: 1px solid rgba(255,255,255,.42); border-radius: 16px; background: linear-gradient(145deg, #71c5ff 0%, #2a7ff0 42%, #123e9b 100%); box-shadow: 8px 10px 0 rgba(10,37,96,.38), 0 0 28px rgba(64,156,255,.55), inset 5px 5px 11px rgba(255,255,255,.32), inset -8px -10px 16px rgba(7,31,92,.34); transform: perspective(160px) rotateX(12deg) rotateY(-14deg); animation: bot-orb-float 3.8s ease-in-out infinite; }
.faq-bot-orb b { position: relative; z-index: 2; font-size: 14px; }
.faq-bot-orb::before { content: ""; position: absolute; top: 7px; left: 9px; width: 17px; height: 8px; border-radius: 50%; background: rgba(255,255,255,.55); filter: blur(2px); transform: rotate(-22deg); }
.faq-bot-orb i { position: absolute; right: 7px; bottom: 7px; width: 7px; height: 7px; display: block; border-radius: 50%; background: #9df8d0; box-shadow: 0 0 12px #9df8d0; }
.faq-bot-toggle > span:nth-of-type(2) { color: #fff; font-size: 13px; font-weight: 900; white-space: nowrap; }
.faq-bot-toggle > i { width: 28px; height: 28px; margin-inline-start: auto; display: grid; place-items: center; color: #d9edff; font-size: 19px; font-style: normal; border-radius: 50%; background: rgba(255,255,255,.12); transition: transform .25s ease; }
.faq-bot.open .faq-bot-toggle > i { transform: rotate(45deg); }
.faq-bot.open .faq-bot-orb i { transform: none; }
.faq-bot-panel { left: 0; right: auto; bottom: 84px; width: min(450px, calc(100vw - 32px)); max-height: min(78vh, 660px); transform-origin: bottom left; }
.faq-messages { max-height: 390px; }
.faq-message { font-size: 14px; }
.faq-quick button { font-size: 12px; }
body.light-theme .certification-card { border-color: rgba(16,48,91,.16); background: linear-gradient(145deg, #ffffff, #edf3f9); box-shadow: 0 28px 75px rgba(45,75,112,.15), inset 0 1px rgba(255,255,255,.95); }
body.light-theme .certification-card::after { background-image: linear-gradient(rgba(16,48,91,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(16,48,91,.03) 1px, transparent 1px); }
body.light-theme .cert-badge { color: #173458; border-color: rgba(16,48,91,.2); background: linear-gradient(145deg, rgba(16,48,91,.09), rgba(255,255,255,.85)); box-shadow: 0 14px 27px rgba(45,75,112,.14), inset 0 1px rgba(255,255,255,.9); }
body.light-theme .cert-badge small, body.light-theme .cert-kicker { color: #647590; }
body.light-theme .cert-card-top h3, body.light-theme .certification-card summary, body.light-theme .cert-stats b, body.light-theme .cert-callout b, body.light-theme .cert-fee-line b, body.light-theme .ifrs18-box h4, body.light-theme .fmva-track h4, body.light-theme .acca-levels h4, body.light-theme .cma-parts h4 { color: #173458; }
body.light-theme .cert-lead, body.light-theme .certification-card details > p, body.light-theme .course-name-list, body.light-theme .competency-list, body.light-theme .acca-levels p, body.light-theme .cma-parts ul, body.light-theme .cpa-parts span, body.light-theme .cert-topic-grid { color: #536780; }
body.light-theme .cert-stats span, body.light-theme .fmva-track, body.light-theme .acca-levels > div, body.light-theme .cma-parts > div, body.light-theme .cpa-parts span, body.light-theme .ifrs18-box, body.light-theme .cert-callout, body.light-theme .cert-fee-line { border-color: rgba(16,48,91,.13); background: rgba(255,255,255,.6); color: #536780; }
body.light-theme .certification-card { border-top-color: rgba(16,48,91,.19); }
body.light-theme .certification-card summary::before { color: #294260; border-color: rgba(16,48,91,.2); }
body.light-theme .cert-source { color: #1f64ba; text-decoration-color: rgba(31,100,186,.35); }
body.light-theme .certification-card details { border-color: rgba(16,48,91,.12); }
body.light-theme .about-action-label { color: #2d4768; }
body.light-theme .about-actions > small { color: #60728b; }

/* Keep every credential badge neutral and consistent with the active theme. */
body:not(.light-theme) .credential-list span { color: #d7deea; border-color: rgba(225,233,243,.18); background: rgba(255,255,255,.045); }
body.light-theme .credential-list span { color: #173458; border-color: rgba(16,48,91,.16); background: rgba(255,255,255,.62); }

@keyframes bot-orb-float { 0%, 100% { transform: perspective(160px) rotateX(12deg) rotateY(-14deg) translateY(0); } 50% { transform: perspective(160px) rotateX(12deg) rotateY(-14deg) translateY(-5px); } }

@media (max-width: 1180px) {
  .certification-grid { grid-template-columns: 1fr; }
  .fmva-track-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 920px) {
  .hero-contact-social-row { flex-direction: column; }
  .hero-contact-actions { width: 100%; }
  .hero-socials { width: 100%; }
  .fmva-track-grid, .acca-levels { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 620px) {
  .hero-contact-actions { flex-wrap: wrap; }
  .contact-button { flex: 1 1 calc(50% - 3px); }
  .hero-socials { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .social-link { width: 100%; }
  .certification-card { padding: 22px 18px; border-radius: 23px; }
  .cert-card-top { gap: 11px; }
  .cert-badge { width: 66px; min-width: 66px; height: 66px; border-radius: 17px; }
  .cert-badge strong { font-size: 15px; }
  .cert-card-top h3 { font-size: 1.35rem; }
  .cert-lead { font-size: 13px; }
  .cert-stats span { font-size: 9px; }
  .cert-topic-grid, .cpa-parts { grid-template-columns: 1fr; }
  .fmva-track-grid, .acca-levels, .cma-parts { grid-template-columns: 1fr; }
  .about-contact-buttons { flex-direction: column; }
  .about-contact-buttons .button { width: 100%; }
  .faq-bot { left: 12px; right: auto; bottom: max(12px, env(safe-area-inset-bottom)); }
  .faq-bot-toggle { min-width: 174px; width: 174px; min-height: 64px; height: 64px; padding: 7px 9px; }
  .faq-bot-toggle > span.faq-bot-orb { width: 44px; height: 44px; min-width: 44px; border-radius: 14px; }
  .faq-bot-toggle > span:nth-of-type(2) { font-size: 11px; }
  .faq-bot-toggle > i { width: 24px; height: 24px; }
  .faq-bot-panel { left: 0; right: auto; bottom: 75px; width: calc(100vw - 24px); transform-origin: bottom left; }
}

@media (prefers-reduced-motion: reduce) {
  .faq-bot-orb { animation: none; }
}

/* Course details: keep the poster visible while the full copy scrolls beside it. */
.course-dialog {
  height: min(88vh, 860px);
  max-height: 88vh;
  min-height: 0;
  overflow: hidden;
}
.course-dialog[open] {
  min-height: 0;
  grid-template-rows: minmax(0, 1fr);
}
.course-dialog > .dialog-poster {
  min-height: 0;
  height: 100%;
}
.course-dialog > .dialog-content {
  min-height: 0;
  height: 100%;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: #385074 transparent;
}
.data-card .poster-art {
  overflow: hidden;
  border-radius: 22px;
}
.data-card .poster-art > img {
  object-position: 50% 9%;
  transform: scale(1.08);
  transform-origin: 50% 9%;
}

/* The contact action stays at the top of the scrollable course copy. */
.dialog-contact-banner {
  position: static;
  margin: 0 0 28px;
  padding: 16px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px 14px;
  align-items: center;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 18px;
  background: rgba(255,255,255,.035);
}
.dialog-contact-copy { min-width: 0; display: grid; gap: 2px; }
.dialog-contact-copy strong { color: #f3f7fd; font-size: 15px; }
.dialog-contact-copy span { color: #9daabd; font-size: 10px; line-height: 1.55; }
.dialog-contact-banner .dialog-contact-options { display: flex; flex-wrap: wrap; gap: 7px; justify-content: flex-end; }
.dialog-contact-banner .dialog-contact-options .button { min-height: 47px; min-width: 108px; flex: 0 1 auto; padding: 7px 11px; display: flex; flex-direction: column; gap: 1px; align-items: center; justify-content: center; }
.dialog-contact-banner .dialog-contact-options .button span { font-size: 10px; line-height: 1.3; }
.dialog-contact-banner .dialog-contact-options .button small { color: rgba(255,255,255,.76); font-size: 9px; line-height: 1.2; letter-spacing: .03em; }
.dialog-contact-arrow { grid-column: 1 / -1; display: flex; align-items: center; justify-content: flex-end; gap: 7px; color: #9fcaff; font-size: 10px; font-weight: 800; direction: rtl; }
.dialog-contact-arrow b { width: 28px; height: 28px; display: inline-grid; place-items: center; color: #fff; font-size: 19px; line-height: 1; border: 1px solid rgba(91,178,255,.45); border-radius: 50%; background: rgba(31,122,255,.18); animation: contact-arrow-spin 2.2s linear infinite; }
@keyframes contact-arrow-spin { to { transform: rotate(360deg); } }

/* Lightweight course-specific motion layers over the poster. */
.dialog-poster .course-art { position: absolute; inset: 0; z-index: 3; overflow: hidden; pointer-events: none; }
.dialog-poster.has-poster { position: relative; }
.dialog-poster.has-poster > img { position: relative; z-index: 1; }
.art-fmva::before, .art-fmva::after { content: ""; position: absolute; width: 170px; height: 170px; border: 1px solid rgba(255,109,137,.35); border-radius: 50%; animation: art-orbit 12s linear infinite; }
.art-fmva::before { top: 8%; right: -38px; }
.art-fmva::after { bottom: 10%; left: -62px; width: 125px; height: 125px; border-color: rgba(255,255,255,.18); animation-duration: 17s; animation-direction: reverse; }
.art-chip { position: absolute; z-index: 2; padding: 6px 9px; color: #fff; font: 800 10px/1 Arial,sans-serif; letter-spacing: .04em; border: 1px solid rgba(255,255,255,.38); border-radius: 8px; background: rgba(8,12,20,.58); box-shadow: 0 8px 20px rgba(0,0,0,.25); animation: art-chip-float 4s ease-in-out infinite; }
.chip-dcf { top: 20%; left: 10%; color: #ffb0c0; }
.chip-wacc { top: 36%; right: 8%; animation-delay: -1.2s; }
.chip-ev { bottom: 29%; left: 12%; color: #9dd2ff; animation-delay: -.8s; }
.chip-fcf { bottom: 15%; right: 14%; color: #ffd395; animation-delay: -2s; }
.art-fmva svg { position: absolute; inset: 17% 9% 14%; width: 82%; height: 70%; opacity: .7; }
.art-fmva svg path { fill: none; stroke: #ff7597; stroke-width: 3; stroke-linecap: round; stroke-dasharray: 680; stroke-dashoffset: 680; animation: art-line-draw 5s ease-in-out infinite alternate; }
.art-fmva svg .art-axis { stroke: rgba(255,255,255,.28); stroke-width: 1; stroke-dasharray: 4 9; animation: none; }
@keyframes art-line-draw { to { stroke-dashoffset: 0; } }
@keyframes art-orbit { to { transform: rotate(360deg); } }
@keyframes art-chip-float { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-8px) rotate(2deg); } }

.art-data::before { content: ""; position: absolute; inset: 12% 8%; border: 1px solid rgba(104,184,255,.25); border-radius: 22px; transform: perspective(450px) rotateX(48deg) rotateZ(-14deg); opacity: .8; }
.art-data-grid { position: absolute; inset: 17% 9%; opacity: .32; background-image: linear-gradient(rgba(115,193,255,.65) 1px, transparent 1px), linear-gradient(90deg, rgba(115,193,255,.65) 1px, transparent 1px); background-size: 30px 30px; transform: perspective(420px) rotateX(47deg) rotateZ(-12deg); animation: data-grid-drift 7s ease-in-out infinite alternate; }
.art-data-token { position: absolute; z-index: 2; padding: 7px 9px; color: #eaf6ff; font: 800 10px/1 Arial,sans-serif; letter-spacing: .04em; border: 1px solid rgba(102,190,255,.5); border-radius: 9px; background: rgba(7,25,50,.7); box-shadow: 0 12px 22px rgba(0,0,0,.25), 0 0 18px rgba(31,122,255,.16); animation: art-number-float 5s ease-in-out infinite; }
.token-one { top: 18%; left: 9%; color: #a9e3ff; }
.token-two { top: 29%; right: 11%; animation-delay: -1.3s; }
.token-three { top: 48%; left: 15%; color: #ffda84; animation-delay: -2.4s; }
.token-four { bottom: 29%; right: 12%; color: #8ff3ce; animation-delay: -.6s; }
.token-five { bottom: 16%; left: 10%; animation-delay: -3.1s; }
.token-six { bottom: 11%; right: 31%; color: #c7b4ff; animation-delay: -1.9s; }
.art-data-beam { position: absolute; top: 8%; left: 7%; width: 4px; height: 84%; border-radius: 99px; background: linear-gradient(180deg, transparent, #62c5ff, transparent); box-shadow: 0 0 18px #62c5ff; opacity: .65; animation: data-beam-scan 4.5s ease-in-out infinite; }
@keyframes art-number-float { 0%, 100% { transform: translate3d(0, 0, 0) rotate(-2deg); } 50% { transform: translate3d(8px, -14px, 0) rotate(3deg); } }
@keyframes data-grid-drift { to { transform: perspective(420px) rotateX(47deg) rotateZ(-12deg) translate3d(12px,-10px,0); } }
@keyframes data-beam-scan { 0%, 100% { left: 7%; opacity: .22; } 50% { left: 91%; opacity: .8; } }

.art-excel::before { content: ""; position: absolute; inset: 13% 9%; border: 1px solid rgba(115,243,190,.3); border-radius: 14px; transform: rotate(-8deg); }
.art-excel-grid { position: absolute; top: 18%; left: 12%; width: 66%; height: 48%; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; transform: rotate(-8deg); opacity: .74; }
.art-excel-grid i { border: 1px solid rgba(123,244,197,.47); border-radius: 3px; background: rgba(24,185,121,.2); animation: excel-cell-pulse 2.7s ease-in-out infinite; }
.art-excel-grid i:nth-child(2n) { animation-delay: -.8s; }.art-excel-grid i:nth-child(3n) { animation-delay: -1.5s; }
.art-formula { position: absolute; z-index: 2; padding: 6px 8px; color: #baffdc; font: 700 9px/1 Arial,sans-serif; border: 1px solid rgba(115,243,190,.4); border-radius: 7px; background: rgba(4,33,24,.72); animation: formula-drift 4s ease-in-out infinite; }
.formula-one { top: 19%; right: 9%; }.formula-two { bottom: 26%; left: 9%; animation-delay: -1.4s; }.formula-three { bottom: 15%; right: 16%; color: #ffe09e; animation-delay: -2.3s; }
.art-cursor { position: absolute; right: 18%; top: 45%; color: #fff; font: 900 34px/1 Arial,sans-serif; text-shadow: 0 0 15px rgba(115,243,190,.8); animation: cursor-click 1.8s ease-in-out infinite; }
@keyframes excel-cell-pulse { 0%, 100% { opacity: .35; transform: scale(.96); } 50% { opacity: 1; transform: scale(1); } }
@keyframes formula-drift { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes cursor-click { 0%, 100% { transform: translate(0,0) rotate(-15deg); } 50% { transform: translate(8px,-8px) rotate(-15deg) scale(.88); } }

.art-accounting::before { content: ""; position: absolute; inset: 11% 9%; border: 1px solid rgba(255,215,135,.23); border-radius: 17px; transform: rotate(5deg); }
.art-ledger { position: absolute; top: 20%; left: 13%; width: 74%; height: 47%; display: grid; align-content: space-between; transform: rotate(5deg); opacity: .7; }
.art-ledger i { height: 1px; display: block; background: linear-gradient(90deg, transparent, rgba(255,216,139,.8), transparent); transform-origin: left; animation: ledger-line 3s ease-in-out infinite; }
.art-ledger i:nth-child(2n) { animation-delay: -.9s; }.art-ledger i:nth-child(3n) { animation-delay: -1.8s; }
.art-ledger-token { position: absolute; z-index: 2; padding: 7px 9px; color: #ffe3a7; font: 800 10px/1 Arial,sans-serif; border: 1px solid rgba(255,216,139,.42); border-radius: 8px; background: rgba(48,31,8,.7); animation: ledger-token-bob 4.2s ease-in-out infinite; }
.token-dr { top: 16%; right: 11%; }.token-cr { top: 42%; left: 10%; animation-delay: -1.1s; }.token-gl { bottom: 22%; right: 13%; animation-delay: -2s; }.token-fs { bottom: 11%; left: 28%; animation-delay: -.4s; }
@keyframes ledger-line { 0%, 100% { transform: scaleX(.55); opacity: .35; } 50% { transform: scaleX(1); opacity: 1; } }
@keyframes ledger-token-bob { 0%, 100% { transform: translateY(0) rotate(2deg); } 50% { transform: translateY(-10px) rotate(-3deg); } }

.art-career::before { content: ""; position: absolute; inset: 13% 10%; border: 1px dashed rgba(132,192,255,.36); border-radius: 50%; animation: art-orbit 15s linear infinite; }
.art-ai-core { position: absolute; top: 32%; left: 35%; width: 104px; height: 104px; display: grid; place-items: center; color: #fff; border: 1px solid rgba(154,215,255,.55); border-radius: 32px; background: linear-gradient(145deg, rgba(86,175,255,.72), rgba(35,66,151,.8)); box-shadow: 0 0 35px rgba(61,162,255,.52), inset 8px 8px 20px rgba(255,255,255,.22); transform: rotate(-8deg); animation: ai-core-pulse 3.8s ease-in-out infinite; }
.art-ai-core b { font: 900 28px/1 Arial,sans-serif; }.art-ai-core i { position: absolute; width: 7px; height: 7px; border-radius: 50%; background: #a8f5ff; box-shadow: 0 0 12px #a8f5ff; animation: ai-dot 2.4s ease-in-out infinite; }.art-ai-core i:nth-of-type(1) { top: 18px; left: 18px; }.art-ai-core i:nth-of-type(2) { top: 20px; right: 17px; animation-delay: -.7s; }.art-ai-core i:nth-of-type(3) { bottom: 16px; left: 47%; animation-delay: -1.4s; }
.art-career-card { position: absolute; z-index: 2; padding: 7px 10px; color: #e8f5ff; font: 800 10px/1 Arial,sans-serif; border: 1px solid rgba(132,192,255,.45); border-radius: 8px; background: rgba(9,24,49,.72); animation: career-card-float 4.2s ease-in-out infinite; }.card-cv { top: 18%; left: 10%; }.card-ats { bottom: 20%; left: 12%; color: #aaf3d0; animation-delay: -1.2s; }.card-linkedin { top: 19%; right: 13%; color: #a8d5ff; animation-delay: -2.2s; }.art-career-orbit { position: absolute; inset: 24%; border: 1px solid rgba(132,192,255,.42); border-radius: 50%; animation: art-orbit 9s linear infinite reverse; }
@keyframes ai-core-pulse { 0%, 100% { transform: rotate(-8deg) translateY(0) scale(1); } 50% { transform: rotate(-5deg) translateY(-8px) scale(1.04); } }
@keyframes ai-dot { 0%, 100% { opacity: .4; transform: scale(.8); } 50% { opacity: 1; transform: scale(1.3); } }
@keyframes career-card-float { 0%, 100% { transform: translateY(0) rotate(-3deg); } 50% { transform: translateY(-11px) rotate(3deg); } }

body.light-theme .dialog-contact-banner { border-color: rgba(16,48,91,.13); background: linear-gradient(180deg, rgba(248,251,255,.98) 78%, rgba(248,251,255,.82)); }
body.light-theme .dialog-contact-copy strong { color: #173458; }
body.light-theme .dialog-contact-copy span { color: #60738e; }
body.light-theme .dialog-contact-arrow { color: #1f64ba; }
body.light-theme .dialog-contact-arrow b { color: #173458; border-color: rgba(31,100,186,.3); background: rgba(31,122,255,.1); }
body.light-theme .dialog-contact-banner .dialog-contact-options .button small { color: rgba(23,52,88,.72); }

@media (max-width: 620px) {
  .course-dialog { height: 90vh; max-height: 90vh; overflow: hidden; }
  .course-dialog[open] { grid-template-rows: 270px minmax(0, 1fr); }
  .course-dialog > .dialog-poster { height: auto; min-height: 270px; }
  .course-dialog > .dialog-content { height: auto; max-height: none; overflow-y: auto; }
  .dialog-contact-banner { grid-template-columns: 1fr; gap: 9px; margin-top: -4px; }
  .dialog-contact-banner .dialog-contact-options { flex-direction: row; justify-content: stretch; }
  .dialog-contact-banner .dialog-contact-options .button { flex: 1 1 0; min-width: 0; }
  .dialog-contact-arrow { justify-content: center; }
  .data-card .poster-art > img { transform: scale(1.06); }
  .art-ai-core { width: 76px; height: 76px; border-radius: 24px; }
  .art-ai-core b { font-size: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  .dialog-contact-arrow b { animation: none !important; }
}

/* Full poster viewer and number-free course actions. */
.dialog-view-poster {
  position: absolute;
  left: 50%;
  bottom: 18px;
  z-index: 6;
  min-width: 122px;
  min-height: 44px;
  padding: 9px 18px;
  color: #fff;
  font: 800 13px/1.2 inherit;
  border: 1px solid rgba(255,255,255,.34);
  border-radius: 999px;
  background: rgba(7,12,22,.84);
  box-shadow: 0 14px 30px rgba(0,0,0,.38), 0 0 24px color-mix(in srgb, var(--dialog-accent) 30%, transparent);
  backdrop-filter: blur(14px);
  transform: translateX(-50%);
  cursor: pointer;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.dialog-view-poster:hover, .dialog-view-poster:focus-visible {
  border-color: var(--dialog-accent, #67b8ff);
  background: color-mix(in srgb, var(--dialog-accent) 26%, #07101d);
  transform: translateX(-50%) translateY(-2px);
}
.poster-viewer {
  width: min(94vw, 980px);
  height: min(94vh, 1120px);
  max-width: 94vw;
  max-height: 94vh;
  padding: 0;
  overflow: hidden;
  color: #f4f7fc;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: 24px;
  background: #060a12;
  box-shadow: 0 40px 120px rgba(0,0,0,.78);
}
.poster-viewer[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
.poster-viewer::backdrop { background: rgba(0,2,8,.9); backdrop-filter: blur(16px); }
.poster-viewer-bar { min-height: 58px; padding: 9px 12px 9px 20px; display: flex; align-items: center; justify-content: space-between; gap: 14px; direction: rtl; border-bottom: 1px solid rgba(255,255,255,.1); }
.poster-viewer-bar strong { min-width: 0; flex: 1; overflow: hidden; color: #eef4fc; font-size: 14px; text-overflow: ellipsis; white-space: nowrap; }
.poster-viewer-counter { min-width: 62px; padding: 6px 10px; color: #9fcaff; font: 800 11px/1.2 inherit; text-align: center; direction: ltr; border: 1px solid rgba(91,178,255,.25); border-radius: 999px; background: rgba(31,122,255,.1); }
.poster-viewer-bar button { width: 40px; height: 40px; flex: 0 0 40px; display: grid; place-items: center; color: #fff; font-size: 25px; line-height: 1; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: rgba(255,255,255,.06); cursor: pointer; }
.poster-viewer-stage { min-width: 0; min-height: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr) 52px; align-items: center; gap: 8px; direction: ltr; touch-action: pan-y pinch-zoom; background: radial-gradient(circle at 50% 20%, rgba(31,122,255,.1), transparent 45%), #04070d; }
.poster-viewer-stage > img { width: 100%; height: 100%; min-width: 0; min-height: 0; padding: 12px 0; object-fit: contain; transition: opacity .2s ease, transform .2s ease; }
.poster-viewer-stage > img.is-switching { opacity: .35; transform: scale(.988); }
.poster-viewer-nav { position: relative; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center; color: #eff7ff; font-size: 34px; line-height: 1; border: 1px solid rgba(126,197,255,.28); border-radius: 50%; background: rgba(15,49,91,.72); box-shadow: 0 12px 28px rgba(0,0,0,.3); backdrop-filter: blur(12px); cursor: pointer; transition: transform .2s ease, background .2s ease, border-color .2s ease; }
.poster-viewer-nav:hover, .poster-viewer-nav:focus-visible { transform: scale(1.08); border-color: rgba(126,197,255,.75); background: rgba(24,112,215,.9); }
.poster-viewer:not(.has-gallery) .poster-viewer-nav { visibility: hidden; pointer-events: none; }
body.light-theme .poster-viewer { color: #173458; border-color: rgba(16,48,91,.18); background: #f8fbff; box-shadow: 0 40px 120px rgba(38,66,101,.38); }
body.light-theme .poster-viewer::backdrop { background: rgba(17,36,62,.68); }
body.light-theme .poster-viewer-bar { border-color: rgba(16,48,91,.12); }
body.light-theme .poster-viewer-bar strong, body.light-theme .poster-viewer-bar button { color: #173458; }
body.light-theme .poster-viewer-bar button { border-color: rgba(16,48,91,.16); background: rgba(16,48,91,.05); }
body.light-theme .poster-viewer-counter { color: #0d579f; border-color: rgba(13,87,159,.2); background: rgba(31,122,255,.08); }
body.light-theme .poster-viewer-stage { background: radial-gradient(circle at 50% 20%, rgba(31,122,255,.08), transparent 45%), #eef4fb; }
body.light-theme .poster-viewer-nav { color: #fff; border-color: rgba(13,87,159,.22); background: rgba(13,87,159,.86); box-shadow: 0 12px 25px rgba(38,66,101,.2); }

@media (max-width: 620px) {
  .dialog-view-poster { bottom: 12px; min-width: 112px; min-height: 40px; padding: 8px 15px; font-size: 12px; }
  .poster-viewer { width: 96vw; height: 94vh; max-width: 96vw; border-radius: 19px; }
  .poster-viewer-bar { min-height: 52px; padding: 7px 9px 7px 14px; }
  .poster-viewer-bar strong { font-size: 12px; }
  .poster-viewer-counter { min-width: 52px; padding-inline: 7px; font-size: 10px; }
  .poster-viewer-bar button { width: 38px; height: 38px; flex-basis: 38px; }
  .poster-viewer-stage { grid-template-columns: 39px minmax(0, 1fr) 39px; gap: 2px; }
  .poster-viewer-stage > img { padding: 7px 0; }
  .poster-viewer-nav { width: 35px; height: 35px; font-size: 28px; }
}

/* Final responsive polish: RTL contacts, swipeable courses and image previews. */
.hero-contact-actions { direction: rtl; }
.theme-toggle { min-width: 78px; height: 54px; padding: 6px 9px; flex-direction: column; gap: 2px; }
.theme-toggle-icon { width: 20px; height: 20px; font-size: 16px; }
.theme-toggle-label { display: block !important; font-size: 8px; line-height: 1.15; white-space: nowrap; }
.faq-quick button[data-action="interview-question"] { width: 100%; flex: 1 1 100%; padding: 9px 12px; line-height: 1.55; text-align: right; white-space: normal; }

.dialog-course-switcher {
  margin: 0 0 14px;
  padding: 2px 1px 9px;
  display: flex;
  gap: 8px;
  direction: rtl;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-snap-type: inline mandatory;
  scrollbar-width: thin;
  scrollbar-color: rgba(107,176,255,.55) transparent;
}
.dialog-swipe-hint { min-width: 112px; padding: 7px 8px; display: grid; align-content: center; gap: 2px; scroll-snap-align: start; color: #f1f6fc; }
.dialog-swipe-hint b { font-size: 11px; }
.dialog-swipe-hint small { color: #7f8da2; font-size: 8px; }
.dialog-course-switcher button {
  --course-tab-accent: #66b7ff;
  min-width: 164px;
  min-height: 58px;
  padding: 9px 12px;
  display: grid;
  gap: 3px;
  scroll-snap-align: center;
  color: #dbe5f2;
  text-align: right;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px;
  background: rgba(255,255,255,.035);
  cursor: pointer;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.dialog-course-switcher button span { overflow: hidden; font-size: 11px; font-weight: 900; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.dialog-course-switcher button small { color: #7f8da2; font-size: 8px; }
.dialog-course-switcher button:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--course-tab-accent) 54%, transparent); }
.dialog-course-switcher button.active { color: #fff; border-color: color-mix(in srgb, var(--course-tab-accent) 72%, #fff 8%); background: color-mix(in srgb, var(--course-tab-accent) 18%, rgba(10,15,26,.94)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--course-tab-accent) 16%, transparent), 0 10px 26px color-mix(in srgb, var(--course-tab-accent) 13%, transparent); }
.dialog-course-switcher button.active small { color: color-mix(in srgb, var(--course-tab-accent) 68%, #fff); }

.gallery-image-wrap { position: relative; min-width: 0; display: grid; }
.gallery-image-wrap > img { grid-area: 1 / 1; }
.media-view-button {
  grid-area: 1 / 1;
  align-self: end;
  justify-self: center;
  z-index: 2;
  min-height: 40px;
  margin-bottom: 14px;
  padding: 8px 15px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #fff;
  font: 800 11px/1.2 inherit;
  border: 1px solid rgba(255,255,255,.3);
  border-radius: 999px;
  background: rgba(6,12,23,.84);
  box-shadow: 0 12px 28px rgba(0,0,0,.36);
  backdrop-filter: blur(12px);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.media-view-button span { font-size: 17px; line-height: 1; }
.media-view-button:hover, .media-view-button:focus-visible { transform: translateY(-2px); border-color: rgba(100,184,255,.8); background: rgba(26,92,172,.9); }

body.light-theme .dialog-course-switcher button { color: #294766; border-color: rgba(16,48,91,.14); background: rgba(255,255,255,.65); }
body.light-theme .dialog-swipe-hint { color: #173458; }
body.light-theme .dialog-course-switcher button small { color: #687b94; }
body.light-theme .dialog-course-switcher button.active { color: #102f55; border-color: color-mix(in srgb, var(--course-tab-accent) 48%, rgba(16,48,91,.2)); background: color-mix(in srgb, var(--course-tab-accent) 11%, #fff); }
body.light-theme .media-view-button { color: #fff; border-color: rgba(255,255,255,.65); background: rgba(14,55,104,.88); }

/* Each professional path gets its own accent and a restrained motion identity. */
.cert-cfa { --cert-accent: #48a7ff; }
.cert-fmva { --cert-accent: #ff5576; }
.cert-acca { --cert-accent: #ef3340; }
.cert-dipifr { --cert-accent: #8d73ff; }
.cert-cma { --cert-accent: #20ca9a; }
.cert-fmaa { --cert-accent: #ffb744; }
.cert-cpa { --cert-accent: #bf65e4; }
.certification-card {
  border-color: color-mix(in srgb, var(--cert-accent, #dce6f4) 26%, rgba(222,231,244,.12));
  background: radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--cert-accent, #fff) 13%, transparent), transparent 35%), linear-gradient(145deg, rgba(25,33,49,.97), rgba(8,12,21,.98));
  transition: transform .35s cubic-bezier(.2,.8,.2,1), border-color .3s ease, box-shadow .3s ease;
}
.certification-card::before { background: linear-gradient(90deg, transparent, var(--cert-accent, #edf3fb), transparent); animation: cert-accent-scan 4.8s ease-in-out infinite; }
.certification-card::after { animation: cert-grid-drift 12s linear infinite; }
.certification-card:hover { transform: translateY(-6px); border-color: color-mix(in srgb, var(--cert-accent, #fff) 60%, rgba(255,255,255,.16)); box-shadow: 0 34px 84px rgba(0,0,0,.38), 0 0 38px color-mix(in srgb, var(--cert-accent, #fff) 13%, transparent), inset 0 1px rgba(255,255,255,.1); }
.certification-card .cert-badge { border-color: color-mix(in srgb, var(--cert-accent, #fff) 45%, rgba(255,255,255,.2)); background: linear-gradient(145deg, color-mix(in srgb, var(--cert-accent, #fff) 25%, rgba(255,255,255,.12)), rgba(35,42,57,.28)); box-shadow: 0 14px 27px rgba(0,0,0,.24), 0 0 22px color-mix(in srgb, var(--cert-accent, #fff) 18%, transparent), inset 0 1px rgba(255,255,255,.28); animation: cert-badge-float 4.4s ease-in-out infinite; }
.certification-card .cert-kicker, .certification-card .cert-source { color: color-mix(in srgb, var(--cert-accent, #dce7f5) 72%, #fff); }
body.light-theme .certification-card { border-color: color-mix(in srgb, var(--cert-accent, #173458) 24%, rgba(16,48,91,.12)); background: radial-gradient(circle at 88% 0%, color-mix(in srgb, var(--cert-accent, #fff) 11%, transparent), transparent 36%), linear-gradient(145deg, #fff, #edf3f9); }
body.light-theme .certification-card .cert-badge { border-color: color-mix(in srgb, var(--cert-accent, #173458) 36%, rgba(16,48,91,.15)); background: linear-gradient(145deg, color-mix(in srgb, var(--cert-accent, #fff) 13%, #fff), #edf3f9); }
body.light-theme .certification-card .cert-kicker, body.light-theme .certification-card .cert-source { color: color-mix(in srgb, var(--cert-accent, #1f64ba) 72%, #173458); }
@keyframes cert-accent-scan { 0%, 100% { opacity: .38; transform: translateX(42%); } 50% { opacity: 1; transform: translateX(-42%); } }
@keyframes cert-grid-drift { to { background-position: 36px 36px; } }
@keyframes cert-badge-float { 0%, 100% { transform: rotate(-4deg) translateY(0); } 50% { transform: rotate(-1deg) translateY(-5px); } }

@media (max-width: 620px) {
  .theme-toggle { min-width: 64px; width: 64px; height: 52px; padding: 5px 6px; }
  .hero-intro { font-size: 16px; line-height: 1.95; }
  .hero-promise-line { margin-top: 11px; font-size: clamp(2rem, 10.8vw, 3.45rem); line-height: 1.12; }
  .hero-sub-line { margin-top: 22px; }
  .course-copy > p:not(.course-code) { font-size: 15px; line-height: 1.85; }
  .dialog-course-switcher { margin-bottom: 12px; }
  .dialog-course-switcher button { min-width: 146px; min-height: 55px; }
  .dialog-contact-banner { margin-top: 0; }
  .media-view-button { min-height: 38px; margin-bottom: 10px; padding: 7px 13px; font-size: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .certification-card::before, .certification-card::after, .certification-card .cert-badge { animation: none !important; }
}

/* Premium depth pass: stronger 3D hierarchy without changing the site's layout. */
:root {
  --premium-shadow: 0 34px 90px rgba(0, 0, 0, .46), 0 10px 30px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .1);
  --premium-blue-glow: 0 0 52px rgba(31, 122, 255, .14);
  --premium-red-glow: 0 0 52px rgba(255, 49, 88, .12);
}

body {
  background:
    radial-gradient(ellipse at 12% 7%, rgba(32, 128, 255, .17), transparent 34%),
    radial-gradient(ellipse at 90% 18%, rgba(255, 38, 82, .14), transparent 31%),
    radial-gradient(ellipse at 48% 62%, rgba(83, 55, 185, .07), transparent 39%),
    linear-gradient(180deg, #05070d 0%, #070a12 48%, #04060b 100%);
  background-attachment: fixed;
}

#ambient-canvas { filter: saturate(1.18) contrast(1.06); }
.page-noise { opacity: .042; mix-blend-mode: soft-light; }

.site-header {
  isolation: isolate;
  border-color: rgba(180, 213, 255, .16);
  background: linear-gradient(135deg, rgba(15, 23, 39, .82), rgba(5, 8, 15, .72));
  box-shadow: 0 24px 75px rgba(0, 0, 0, .38), 0 4px 18px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .12), inset 0 -1px rgba(89, 153, 255, .05);
}
.site-header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(105deg, rgba(82, 167, 255, .1), transparent 27%, transparent 72%, rgba(255, 70, 104, .08));
  pointer-events: none;
}
.site-header.scrolled {
  background: linear-gradient(135deg, rgba(11, 17, 29, .96), rgba(4, 7, 13, .94));
  box-shadow: 0 28px 82px rgba(0, 0, 0, .52), inset 0 1px rgba(255, 255, 255, .1);
}
.brand-logo img { filter: drop-shadow(0 7px 16px rgba(0, 0, 0, .58)) drop-shadow(0 0 16px rgba(77, 150, 255, .1)); }

.button,
.featured-details-button,
.media-view-button,
.dialog-view-poster {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.button::before,
.featured-details-button::before,
.media-view-button::before,
.dialog-view-poster::before {
  content: "";
  position: absolute;
  top: -80%;
  bottom: -80%;
  left: -45%;
  z-index: -1;
  width: 26%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .34), transparent);
  transform: rotate(18deg) translateX(-230%);
  transition: transform .65s cubic-bezier(.2, .75, .2, 1);
  pointer-events: none;
}
.button:hover::before,
.featured-details-button:hover::before,
.media-view-button:hover::before,
.dialog-view-poster:hover::before { transform: rotate(18deg) translateX(720%); }

.hero-stage::before {
  width: 72%;
  border-color: rgba(158, 207, 255, .12);
  background: radial-gradient(circle at 42% 38%, rgba(84, 166, 255, .09), transparent 48%), radial-gradient(circle, rgba(255, 255, 255, .04), transparent 67%);
  box-shadow: inset 0 0 125px rgba(83, 157, 255, .045), 0 0 95px rgba(20, 91, 212, .07);
}
.portrait-frame {
  padding: 10px;
  background: linear-gradient(135deg, #60b9ff 0%, rgba(255, 255, 255, .18) 42%, #ff4366 100%);
  box-shadow: 0 60px 130px rgba(0, 0, 0, .62), -40px 4px 95px rgba(26, 121, 255, .17), 42px 4px 95px rgba(255, 49, 88, .14), inset 0 1px rgba(255, 255, 255, .55);
}
.portrait-frame::after { box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .2), inset 0 -50px 70px rgba(0, 0, 0, .16); }
.portrait-frame img { filter: saturate(.98) contrast(1.045); }
.portrait-caption {
  border-color: rgba(184, 218, 255, .21);
  background: linear-gradient(135deg, rgba(12, 20, 34, .78), rgba(4, 7, 13, .72));
  box-shadow: 0 18px 42px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .12);
}
.floating-panel {
  border-color: rgba(169, 211, 255, .2);
  background: linear-gradient(145deg, rgba(24, 37, 62, .92), rgba(5, 9, 17, .86));
  box-shadow: 0 38px 88px rgba(0, 0, 0, .56), inset 1px 1px rgba(255, 255, 255, .15), inset -1px -1px rgba(55, 112, 201, .08);
}
.data-panel { box-shadow: 0 38px 88px rgba(0, 0, 0, .56), var(--premium-blue-glow), inset 1px 1px rgba(255, 255, 255, .14); }
.finance-panel { box-shadow: 0 38px 88px rgba(0, 0, 0, .56), var(--premium-red-glow), inset 1px 1px rgba(255, 255, 255, .14); }
.skill-pill { border-color: rgba(175, 215, 255, .18); box-shadow: 0 19px 43px rgba(0, 0, 0, .42), inset 0 1px rgba(255, 255, 255, .08); }

.section { isolation: isolate; }
.section-heading {
  position: relative;
  padding-block: 12px 18px;
}
.section-heading::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: min(330px, 38%);
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(78, 159, 255, .6), rgba(255, 75, 109, .36));
  box-shadow: 0 0 18px rgba(43, 126, 255, .24);
}
.section-index {
  border-color: rgba(144, 199, 255, .22);
  background: linear-gradient(145deg, rgba(255, 255, 255, .1), rgba(42, 105, 191, .06));
  box-shadow: 0 14px 30px rgba(0, 0, 0, .27), inset 2px 2px rgba(255, 255, 255, .1), inset -2px -2px rgba(0, 0, 0, .15);
}

.course-card {
  border-color: rgba(180, 215, 255, .16);
  box-shadow: var(--premium-shadow);
  transition: transform .2s ease-out, border-color .35s ease, box-shadow .35s ease;
}
.fmva-card { box-shadow: var(--premium-shadow), 0 0 70px rgba(255, 49, 88, .07); }
.data-card { box-shadow: var(--premium-shadow), 0 0 70px rgba(31, 122, 255, .09); }
.fmva-card::before { background: radial-gradient(circle at 87% 14%, rgba(255, 63, 98, .33), transparent 34%), radial-gradient(circle at 18% 90%, rgba(124, 19, 48, .18), transparent 39%), linear-gradient(145deg, #210b14, #0a0b12 62%, #140710); }
.data-card::before { background: radial-gradient(circle at 87% 14%, rgba(39, 139, 255, .38), transparent 35%), radial-gradient(circle at 18% 90%, rgba(13, 76, 173, .21), transparent 40%), linear-gradient(145deg, #061d38, #080d17 62%, #051329); }
.course-card:hover {
  border-color: rgba(207, 230, 255, .29);
  box-shadow: 0 48px 118px rgba(0, 0, 0, .55), 0 14px 36px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .13);
}
.course-flags span,
.feature-list li {
  box-shadow: inset 0 1px rgba(255, 255, 255, .055), 0 8px 18px rgba(0, 0, 0, .14);
  backdrop-filter: blur(9px);
}
.featured-details-button {
  width: auto;
  min-width: 116px;
  height: 50px;
  padding: 0 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border-radius: 15px;
  font-size: 13px;
  font-weight: 900;
  white-space: nowrap;
}
.featured-details-button .details-icon { width: 21px; height: 21px; }
.fmva-card .featured-details-button { border-color: rgba(255, 112, 139, .28); background: linear-gradient(145deg, rgba(255, 73, 107, .16), rgba(255, 255, 255, .045)); box-shadow: 0 16px 34px rgba(112, 10, 36, .26), inset 0 1px rgba(255, 255, 255, .13); }
.data-card .featured-details-button { border-color: rgba(103, 184, 255, .3); background: linear-gradient(145deg, rgba(31, 122, 255, .19), rgba(255, 255, 255, .045)); box-shadow: 0 16px 34px rgba(7, 63, 152, .28), inset 0 1px rgba(255, 255, 255, .13); }
.poster-art { filter: drop-shadow(0 24px 32px rgba(0, 0, 0, .3)); transition: filter .35s ease; }
.poster-art img { box-shadow: -30px 42px 72px rgba(0, 0, 0, .55), inset 0 1px rgba(255, 255, 255, .2); transition: transform .45s cubic-bezier(.2, .75, .2, 1), box-shadow .45s ease, filter .45s ease; }
.course-card:hover .poster-art img { transform: translateY(-5px) scale(1.018); filter: saturate(1.05) contrast(1.02); }
.course-card:hover .poster-art { filter: drop-shadow(0 30px 42px rgba(0, 0, 0, .38)); }

.compact-course {
  border-color: rgba(171, 211, 255, .14);
  background: radial-gradient(circle at 78% 0, var(--compact-glow, rgba(31,122,255,.2)), transparent 42%), linear-gradient(155deg, rgba(23, 31, 49, .97), rgba(6, 9, 16, .99));
  box-shadow: 0 34px 86px rgba(0, 0, 0, .42), 0 8px 25px rgba(0, 0, 0, .22), inset 0 1px rgba(255, 255, 255, .09);
  transition: transform .2s ease-out, border-color .3s ease, box-shadow .3s ease;
}
.compact-course:hover { border-color: rgba(193, 224, 255, .25); box-shadow: 0 46px 106px rgba(0, 0, 0, .49), 0 0 48px color-mix(in srgb, var(--compact-glow) 46%, transparent), inset 0 1px rgba(255, 255, 255, .11); }
.compact-visual,
.accounting-visual { box-shadow: 0 24px 48px rgba(0, 0, 0, .3), inset 0 1px rgba(255, 255, 255, .08); }
.card-number { box-shadow: 0 12px 28px rgba(0, 0, 0, .32), inset 0 1px rgba(255, 255, 255, .11); }
.compact-copy button { box-shadow: 0 11px 24px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .08); }

.resource-card {
  border-color: rgba(167, 209, 255, .14);
  background: radial-gradient(circle at 88% 4%, color-mix(in srgb, var(--resource-glow, rgba(31,122,255,.2)) 55%, transparent), transparent 38%), linear-gradient(145deg, rgba(22, 30, 48, .94), rgba(6, 10, 18, .97));
  box-shadow: 0 32px 82px rgba(0, 0, 0, .38), 0 8px 24px rgba(0, 0, 0, .2), inset 0 1px rgba(255, 255, 255, .08);
  transform-style: preserve-3d;
}
.resource-card:hover { transform: perspective(900px) translateY(-9px) rotateX(1deg); box-shadow: 0 44px 100px rgba(0, 0, 0, .48), 0 0 48px color-mix(in srgb, var(--resource-glow, rgba(31,122,255,.2)) 42%, transparent); }
.resource-icon { box-shadow: 9px 14px 28px rgba(0, 0, 0, .3), inset 4px 4px 12px rgba(255, 255, 255, .12), inset -5px -6px 12px rgba(0, 0, 0, .12); transform: perspective(220px) rotateY(-12deg) rotateZ(-5deg); }

.projects-shell {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  border-color: rgba(154, 202, 255, .17);
  background: radial-gradient(circle at 77% 25%, rgba(36, 132, 255, .17), transparent 38%), radial-gradient(circle at 9% 87%, rgba(255, 49, 88, .08), transparent 34%), linear-gradient(145deg, rgba(17, 24, 40, .97), rgba(5, 8, 15, .98));
  box-shadow: 0 54px 135px rgba(0, 0, 0, .46), 0 12px 36px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .1);
}
.projects-shell::before {
  content: "";
  position: absolute;
  top: -38%;
  right: -9%;
  z-index: -1;
  width: 45%;
  aspect-ratio: 1;
  border: 1px solid rgba(96, 177, 255, .2);
  border-radius: 50%;
  background: conic-gradient(from 120deg, transparent, rgba(31, 122, 255, .13), transparent 42%, rgba(255, 49, 88, .08), transparent 74%);
  box-shadow: inset 0 0 75px rgba(31, 122, 255, .06), 0 0 80px rgba(31, 122, 255, .07);
  animation: premium-orbit 18s linear infinite;
  pointer-events: none;
}
.project-display {
  border-color: rgba(102, 179, 255, .29);
  box-shadow: -42px 54px 100px rgba(0, 0, 0, .5), 0 0 95px rgba(31, 122, 255, .12), inset 0 1px rgba(255, 255, 255, .07);
}
.project-figure img { box-shadow: 0 30px 62px rgba(0, 0, 0, .38), 0 0 42px rgba(31, 122, 255, .08); }

.reviews-showcase {
  overflow: hidden;
  isolation: isolate;
  border-color: rgba(204, 176, 225, .17);
  background: radial-gradient(circle at 50% -12%, rgba(255, 79, 117, .17), transparent 42%), radial-gradient(circle at 9% 85%, rgba(47, 132, 255, .08), transparent 35%), linear-gradient(145deg, rgba(25, 19, 31, .97), rgba(7, 9, 16, .98));
  box-shadow: 0 48px 118px rgba(0, 0, 0, .45), 0 10px 31px rgba(0, 0, 0, .24), inset 0 1px rgba(255, 255, 255, .09);
}
.reviews-showcase::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  opacity: .32;
  background: linear-gradient(115deg, transparent 0 37%, rgba(255,255,255,.06) 45%, transparent 54% 100%);
  transform: translateX(48%);
  animation: premium-sheen 8s ease-in-out infinite;
  pointer-events: none;
}
.review-figure img { box-shadow: 0 32px 70px rgba(0, 0, 0, .42), 0 0 40px rgba(255, 49, 88, .08); }
.project-nav,
.review-nav { box-shadow: 0 14px 30px rgba(0, 0, 0, .29), inset 0 1px rgba(255, 255, 255, .09); }

.about-card {
  isolation: isolate;
  border-color: rgba(174, 211, 255, .17);
  background: radial-gradient(circle at 8% 28%, rgba(31, 122, 255, .24), transparent 29%), radial-gradient(circle at 92% 72%, rgba(255, 49, 88, .2), transparent 29%), linear-gradient(140deg, #131d31, #070a12 58%, #110a14);
  box-shadow: 0 52px 128px rgba(0, 0, 0, .47), 0 12px 34px rgba(0, 0, 0, .23), inset 0 1px rgba(255, 255, 255, .1);
}
.about-card::before {
  content: "";
  position: absolute;
  top: -46%;
  left: 24%;
  z-index: -1;
  width: 50%;
  aspect-ratio: 1;
  border: 1px solid rgba(164, 207, 255, .13);
  border-radius: 50%;
  box-shadow: 0 0 80px rgba(31, 122, 255, .08), inset 0 0 80px rgba(255, 49, 88, .04);
  animation: ring-float 9s ease-in-out infinite;
  pointer-events: none;
}
.about-monogram { box-shadow: 16px 35px 75px rgba(0, 0, 0, .42), -15px 0 50px rgba(31, 122, 255, .1), inset 4px 4px 16px rgba(255, 255, 255, .12), inset -9px -10px 20px rgba(0, 0, 0, .18); }
.score-cards div { box-shadow: 0 16px 36px rgba(0, 0, 0, .23), inset 0 1px rgba(255, 255, 255, .08); }

.certification-card {
  box-shadow: 0 36px 92px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .2), 0 0 44px color-mix(in srgb, var(--cert-accent, #fff) 8%, transparent), inset 0 1px rgba(255, 255, 255, .1);
  transform-style: preserve-3d;
}
.certification-card:hover { transform: perspective(1000px) translateY(-8px) rotateX(1.2deg); box-shadow: 0 50px 115px rgba(0, 0, 0, .5), 0 0 54px color-mix(in srgb, var(--cert-accent, #fff) 16%, transparent), inset 0 1px rgba(255, 255, 255, .12); }
.certification-card .cert-badge { transform-style: preserve-3d; filter: saturate(1.08); }
.cert-stats span,
.cert-callout,
.cert-fee-line,
.fmva-track,
.acca-levels > div,
.cma-parts > div,
.cpa-parts span,
.ifrs18-box { box-shadow: inset 0 1px rgba(255, 255, 255, .06), 0 9px 20px rgba(0, 0, 0, .12); }

.course-dialog,
.poster-viewer,
.faq-bot-panel {
  border-color: rgba(161, 206, 255, .21);
  box-shadow: 0 58px 155px rgba(0, 0, 0, .8), 0 0 65px rgba(31, 122, 255, .08), inset 0 1px rgba(255, 255, 255, .08);
}
.dialog-poster { box-shadow: inset -30px 0 70px rgba(0, 0, 0, .28); }
.dialog-course-switcher button { box-shadow: 0 10px 24px rgba(0, 0, 0, .18), inset 0 1px rgba(255, 255, 255, .05); }
.faq-bot-toggle { box-shadow: 0 28px 68px rgba(0, 0, 0, .52), 0 0 40px rgba(31, 122, 255, .18), inset 0 1px rgba(255, 255, 255, .13); }

body.light-theme {
  --premium-shadow: 0 34px 90px rgba(38, 69, 107, .19), 0 9px 25px rgba(38, 69, 107, .1), inset 0 1px rgba(255, 255, 255, .95);
  background:
    radial-gradient(ellipse at 12% 7%, rgba(32, 128, 255, .14), transparent 34%),
    radial-gradient(ellipse at 90% 18%, rgba(230, 45, 88, .1), transparent 31%),
    radial-gradient(ellipse at 48% 62%, rgba(92, 75, 190, .055), transparent 39%),
    linear-gradient(180deg, #f8fbff 0%, #eef4fa 52%, #f8fafc 100%);
}
body.light-theme .page-noise { opacity: .022; mix-blend-mode: multiply; }
body.light-theme .site-header { border-color: rgba(38, 80, 132, .15); background: linear-gradient(135deg, rgba(255, 255, 255, .93), rgba(241, 247, 253, .84)); box-shadow: 0 24px 70px rgba(42, 73, 112, .18), inset 0 1px #fff; }
body.light-theme .site-header::before { background: linear-gradient(105deg, rgba(31, 122, 255, .08), transparent 30%, transparent 72%, rgba(255, 49, 88, .055)); }
body.light-theme .site-header.scrolled { background: linear-gradient(135deg, rgba(255, 255, 255, .98), rgba(242, 247, 253, .97)); box-shadow: 0 24px 72px rgba(42, 73, 112, .22), inset 0 1px #fff; }
body.light-theme .section-index { background: linear-gradient(145deg, #fff, #e7eff8); box-shadow: 0 13px 28px rgba(42, 73, 112, .13), inset 2px 2px #fff, inset -2px -2px rgba(30, 67, 113, .05); }
body.light-theme .section-heading::after { background: linear-gradient(90deg, transparent, rgba(31, 122, 255, .45), rgba(216, 44, 82, .25)); }
body.light-theme .fmva-card::before { background: radial-gradient(circle at 87% 14%, rgba(255, 56, 91, .2), transparent 34%), radial-gradient(circle at 18% 90%, rgba(255, 171, 190, .13), transparent 39%), linear-gradient(145deg, #fff8fa, #f5f8fc 62%, #fff); }
body.light-theme .data-card::before { background: radial-gradient(circle at 87% 14%, rgba(31, 122, 255, .2), transparent 35%), radial-gradient(circle at 18% 90%, rgba(121, 190, 255, .13), transparent 40%), linear-gradient(145deg, #f0f8ff, #f8fbff 62%, #eef6ff); }
body.light-theme .course-card { box-shadow: var(--premium-shadow); }
body.light-theme .course-card:hover { border-color: rgba(31, 122, 255, .28); box-shadow: 0 46px 108px rgba(38, 69, 107, .24), 0 10px 28px rgba(38, 69, 107, .11), inset 0 1px #fff; }
body.light-theme .fmva-card .featured-details-button { color: #9a1935; border-color: rgba(204, 43, 80, .24); background: linear-gradient(145deg, rgba(255, 49, 88, .11), rgba(255, 255, 255, .8)); box-shadow: 0 15px 30px rgba(170, 42, 72, .12), inset 0 1px #fff; }
body.light-theme .data-card .featured-details-button { color: #155daf; border-color: rgba(31, 122, 255, .25); background: linear-gradient(145deg, rgba(31, 122, 255, .11), rgba(255, 255, 255, .82)); box-shadow: 0 15px 30px rgba(31, 91, 168, .13), inset 0 1px #fff; }
body.light-theme .compact-course { background: radial-gradient(circle at 78% 0, var(--compact-glow, rgba(31,122,255,.16)), transparent 42%), linear-gradient(155deg, #fff, #edf3f9); box-shadow: 0 34px 82px rgba(42, 73, 112, .17), 0 8px 22px rgba(42, 73, 112, .08), inset 0 1px #fff; }
body.light-theme .compact-course:hover { box-shadow: 0 43px 98px rgba(42, 73, 112, .22), 0 0 43px color-mix(in srgb, var(--compact-glow) 38%, transparent), inset 0 1px #fff; }
body.light-theme .resource-card { background: radial-gradient(circle at 88% 4%, color-mix(in srgb, var(--resource-glow, rgba(31,122,255,.18)) 42%, transparent), transparent 38%), linear-gradient(145deg, #fff, #edf3f9); box-shadow: 0 32px 78px rgba(42, 73, 112, .16), 0 8px 22px rgba(42, 73, 112, .08), inset 0 1px #fff; }
body.light-theme .projects-shell { border-color: rgba(31, 91, 168, .15); background: radial-gradient(circle at 77% 25%, rgba(31, 122, 255, .12), transparent 38%), radial-gradient(circle at 9% 87%, rgba(255, 49, 88, .055), transparent 34%), linear-gradient(145deg, rgba(255,255,255,.97), rgba(235,243,251,.98)); box-shadow: 0 50px 120px rgba(42, 73, 112, .2), 0 10px 28px rgba(42, 73, 112, .09), inset 0 1px #fff; }
body.light-theme .project-display { box-shadow: -34px 47px 82px rgba(42, 73, 112, .2), 0 0 72px rgba(31, 122, 255, .07), inset 0 1px #fff; }
body.light-theme .reviews-showcase { border-color: rgba(94, 72, 132, .14); background: radial-gradient(circle at 50% -12%, rgba(255, 79, 117, .11), transparent 42%), radial-gradient(circle at 9% 85%, rgba(47, 132, 255, .055), transparent 35%), linear-gradient(145deg, #fff, #f3eef5); box-shadow: 0 44px 108px rgba(64, 54, 85, .17), 0 10px 25px rgba(42, 73, 112, .08), inset 0 1px #fff; }
body.light-theme .about-card { border-color: rgba(38, 80, 132, .15); background: radial-gradient(circle at 8% 28%, rgba(31, 122, 255, .13), transparent 29%), radial-gradient(circle at 92% 72%, rgba(255, 49, 88, .1), transparent 29%), linear-gradient(140deg, #fff, #edf4fb 58%, #fff5f8); box-shadow: 0 48px 115px rgba(42, 73, 112, .2), 0 10px 27px rgba(42, 73, 112, .08), inset 0 1px #fff; }
body.light-theme .certification-card { box-shadow: 0 35px 88px rgba(42, 73, 112, .17), 0 8px 23px rgba(42, 73, 112, .08), 0 0 40px color-mix(in srgb, var(--cert-accent, #173458) 6%, transparent), inset 0 1px #fff; }
body.light-theme .blue-text {
  background: linear-gradient(135deg, #0750a8 5%, #0879e4 52%, #0045a3 100%);
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 3px 9px rgba(0, 83, 178, .16));
}
body.light-theme .red-text {
  background: linear-gradient(135deg, #9f1532 4%, #e1254c 52%, #b20d35 100%);
  -webkit-background-clip: text;
  background-clip: text;
  filter: drop-shadow(0 3px 9px rgba(177, 15, 52, .14));
}
body.light-theme .compact-copy button {
  color: #0d4e96;
  border-color: rgba(13, 78, 150, .24);
  background: linear-gradient(145deg, rgba(226, 240, 255, .98), rgba(255, 255, 255, .94));
  box-shadow: 0 11px 24px rgba(35, 82, 137, .14), inset 0 1px #fff;
}
body.light-theme .compact-copy button .details-icon { stroke: #0d4e96; }
body.light-theme .compact-copy button:hover,
body.light-theme .compact-copy button:focus-visible { color: #fff; border-color: #146ac7; background: linear-gradient(135deg, #0e5cb3, #1789ee); }
body.light-theme .compact-copy button:hover .details-icon,
body.light-theme .compact-copy button:focus-visible .details-icon { stroke: #fff; }
body.light-theme .brand-logo img {
  filter: brightness(0) saturate(100%) drop-shadow(0 7px 13px rgba(16, 33, 61, .2));
}
body.light-theme .cma-fees-title,
body.light-theme .cma-fee-grid h5 { color: #173458; }
body.light-theme .cma-fee-grid section { border-color: rgba(16,48,91,.12); background: rgba(255,255,255,.7); }
body.light-theme .cma-fee-grid span { color: #536780; }
body.light-theme .cma-fee-grid span b { color: #08755d; }
body.light-theme .cma-exam-summary { border-color: rgba(16,48,91,.13); background: rgba(255,255,255,.6); }
body.light-theme .cma-exam-summary > strong, body.light-theme .cma-exam-grid b { color: #173458; }
body.light-theme .cma-exam-grid span { border-color: rgba(16,48,91,.11); background: rgba(255,255,255,.72); }
body.light-theme .cma-exam-grid small { color: #536780; }
body.light-theme .cma-fees > p { color: #60728b !important; }
body.light-theme .certification-card:hover { box-shadow: 0 47px 105px rgba(42, 73, 112, .22), 0 0 45px color-mix(in srgb, var(--cert-accent, #173458) 12%, transparent), inset 0 1px #fff; }
body.light-theme .course-dialog,
body.light-theme .poster-viewer,
body.light-theme .faq-bot-panel { box-shadow: 0 52px 135px rgba(38, 66, 101, .38), 0 0 54px rgba(31, 122, 255, .08), inset 0 1px #fff; }

@keyframes premium-orbit { to { transform: rotate(360deg); } }
@keyframes premium-sheen { 0%, 24%, 100% { transform: translateX(62%); opacity: 0; } 48%, 63% { transform: translateX(-58%); opacity: .38; } }

@media (max-width: 920px) {
  body { background-attachment: scroll; }
  .course-card:hover .poster-art img { transform: none; }
  .projects-shell::before { width: 68%; opacity: .65; }
  .certification-card:hover { transform: translateY(-5px); }
}

@media (max-width: 620px) {
  .site-header { box-shadow: 0 19px 54px rgba(0, 0, 0, .4), inset 0 1px rgba(255, 255, 255, .1); }
  .section-heading { padding-block: 8px 15px; }
  .section-heading::after { width: 52%; }
  .featured-details-button { min-width: 106px; height: 44px; padding-inline: 12px; font-size: 12px; }
  .featured-details-button .details-icon { width: 19px; height: 19px; }
  .cma-fee-grid { grid-template-columns: 1fr; }
  .cma-exam-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cma-exam-grid span:last-child { grid-column: 1 / -1; }
  .course-card,
  .compact-course,
  .projects-shell,
  .reviews-showcase,
  .about-card,
  .certification-card { box-shadow: 0 27px 70px rgba(0, 0, 0, .38), inset 0 1px rgba(255, 255, 255, .08); }
  body.light-theme .course-card,
  body.light-theme .compact-course,
  body.light-theme .projects-shell,
  body.light-theme .reviews-showcase,
  body.light-theme .about-card,
  body.light-theme .certification-card { box-shadow: 0 25px 62px rgba(42, 73, 112, .16), inset 0 1px #fff; }
  .resource-card:hover { transform: translateY(-5px); }
  .projects-shell::before { top: -17%; right: -27%; width: 92%; }
}

@media (prefers-reduced-motion: reduce) {
  .projects-shell::before,
  .reviews-showcase::before { animation: none !important; }
  .button::before,
  .featured-details-button::before,
  .media-view-button::before,
  .dialog-view-poster::before { display: none; }
  .resource-card:hover,
  .certification-card:hover,
  .course-card:hover .poster-art img { transform: none; }
}

/* Readable Arabic/English assistant messages: short cards with isolated LTR terms. */
.faq-messages { gap: 9px; }
.faq-message {
  font-size: 15px;
  line-height: 1.9;
  white-space: normal;
  overflow-wrap: anywhere;
  text-wrap: pretty;
}
.faq-message.segmented {
  border-inline-start: 2px solid rgba(91, 176, 255, .62);
  box-shadow: 0 12px 30px rgba(0, 0, 0, .18), inset 0 1px rgba(255, 255, 255, .045);
}
.faq-message.user.segmented { border-inline-start-color: rgba(255, 103, 134, .62); }
.faq-text-line { display: block; direction: rtl; unicode-bidi: isolate; }
.faq-text-line.has-next-line {
  margin-bottom: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid rgba(255, 255, 255, .075);
}
.faq-ltr-term {
  direction: ltr;
  unicode-bidi: isolate;
  color: #b9ddff;
  font-family: "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  letter-spacing: .005em;
}
.faq-message.user .faq-ltr-term { color: #ffd0da; }
.faq-quick button[dir="ltr"] { direction: ltr; text-align: center; unicode-bidi: isolate; }
body.light-theme .faq-message.segmented { border-inline-start-color: rgba(31, 122, 255, .5); box-shadow: 0 11px 26px rgba(42, 73, 112, .09), inset 0 1px rgba(255, 255, 255, .7); }
body.light-theme .faq-text-line.has-next-line { border-bottom-color: rgba(16, 48, 91, .09); }
body.light-theme .faq-ltr-term { color: #155cae; }
body.light-theme .faq-message.user .faq-ltr-term { color: #a52c49; }

@media (max-width: 620px) {
  .faq-message { max-width: 96%; padding: 12px 13px; font-size: 15px; line-height: 1.92; }
  .faq-quick button { font-size: 13px; }
}

/* Course motion is deliberately kept live inside the details viewer.
   Explicit timings also avoid OS/browser reduced-motion rules freezing these small visuals. */
.dialog-poster .course-art.is-motion-active {
  animation: course-art-live-float 6.4s ease-in-out infinite !important;
  animation-play-state: running !important;
  will-change: transform;
}
.dialog-poster .course-art.is-motion-active *,
.dialog-poster .course-art.is-motion-active::before,
.dialog-poster .course-art.is-motion-active::after {
  animation-play-state: running !important;
}
.dialog-poster .art-fmva.is-motion-active::before { animation: art-orbit 10s linear infinite !important; }
.dialog-poster .art-fmva.is-motion-active::after { animation: art-orbit 14s linear infinite reverse !important; }
.dialog-poster .art-fmva.is-motion-active .art-chip { animation: art-chip-float-live 3.1s ease-in-out infinite !important; }
.dialog-poster .art-fmva.is-motion-active svg path:not(.art-axis) { animation: art-line-draw 3.8s ease-in-out infinite alternate !important; }
.dialog-poster .art-data.is-motion-active .art-data-token { animation: art-number-float-live 3.2s ease-in-out infinite !important; }
.dialog-poster .art-data.is-motion-active .art-data-grid { animation: data-grid-drift-live 4.8s ease-in-out infinite alternate !important; }
.dialog-poster .art-data.is-motion-active .art-data-beam { animation: data-beam-scan-live 2.8s ease-in-out infinite !important; }
.dialog-poster .art-excel.is-motion-active .art-excel-grid i { animation: excel-cell-pulse 2.1s ease-in-out infinite !important; }
.dialog-poster .art-excel.is-motion-active .art-formula { animation: formula-drift 3s ease-in-out infinite !important; }
.dialog-poster .art-excel.is-motion-active .art-cursor { animation: cursor-click 1.55s ease-in-out infinite !important; }
.dialog-poster .art-accounting.is-motion-active .art-ledger i { animation: ledger-line 2.35s ease-in-out infinite !important; }
.dialog-poster .art-accounting.is-motion-active .art-ledger-token { animation: ledger-token-bob 3.15s ease-in-out infinite !important; }
.dialog-poster .art-career.is-motion-active::before { animation: art-orbit 11s linear infinite !important; }
.dialog-poster .art-career.is-motion-active .art-ai-core { animation: ai-core-pulse 3s ease-in-out infinite !important; }
.dialog-poster .art-career.is-motion-active .art-ai-core i { animation: ai-dot 1.9s ease-in-out infinite !important; }
.dialog-poster .art-career.is-motion-active .art-career-card { animation: career-card-float 3.2s ease-in-out infinite !important; }
.dialog-poster .art-career.is-motion-active .art-career-orbit { animation: art-orbit 7s linear infinite reverse !important; }

@keyframes course-art-live-float {
  0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(0, -7px, 0) scale(1.012); }
}
@keyframes art-chip-float-live {
  0%, 100% { transform: translate3d(0, 0, 0) rotate(-3deg); }
  50% { transform: translate3d(9px, -14px, 0) rotate(3deg); }
}
@keyframes art-number-float-live {
  0%, 100% { transform: translate3d(-5px, 4px, 0) rotate(-3deg); }
  50% { transform: translate3d(14px, -18px, 0) rotate(4deg); }
}
@keyframes data-grid-drift-live {
  from { transform: perspective(420px) rotateX(47deg) rotateZ(-12deg) translate3d(-8px, 6px, 0); }
  to { transform: perspective(420px) rotateX(47deg) rotateZ(-12deg) translate3d(18px, -14px, 0); }
}
@keyframes data-beam-scan-live {
  0%, 100% { left: 5%; opacity: .18; }
  50% { left: 92%; opacity: .95; }
}

/* Instructor credentials: the score portrait leads an autoplaying, swipeable gallery. */
.about-card {
  grid-template-columns: minmax(285px, .86fr) minmax(0, 1.22fr) minmax(235px, .62fr);
  gap: clamp(28px, 4vw, 62px);
}
.about-credentials-carousel {
  position: relative;
  z-index: 2;
  width: min(100%, 380px);
  min-width: 0;
  justify-self: center;
  direction: ltr;
  perspective: 1400px;
  touch-action: pan-y pinch-zoom;
}
.about-carousel-stage {
  position: relative;
  aspect-ratio: 1;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid rgba(154, 207, 255, .3);
  border-radius: 30px;
  background: radial-gradient(circle at 28% 12%, rgba(64, 157, 255, .2), transparent 37%), linear-gradient(145deg, rgba(18, 31, 53, .98), rgba(7, 11, 20, .98));
  box-shadow: 22px 38px 82px rgba(0, 0, 0, .46), -13px -9px 42px rgba(31, 122, 255, .1), inset 0 1px rgba(255, 255, 255, .16);
  transform: rotateY(3.5deg) rotateX(1deg);
  transform-style: preserve-3d;
  animation: instructor-gallery-float 7s ease-in-out infinite;
}
.about-carousel-stage::before {
  content: "";
  position: absolute;
  inset: -35% -70%;
  z-index: 3;
  opacity: .58;
  background: linear-gradient(112deg, transparent 43%, rgba(255, 255, 255, .17) 50%, transparent 57%);
  transform: translateX(-38%);
  animation: instructor-gallery-sheen 6.8s ease-in-out infinite;
  pointer-events: none;
}
.about-slide-view {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  overflow: hidden;
  color: #fff;
  border: 0;
  background: #f3f5f6;
  cursor: zoom-in;
}
.about-slide-view::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 58%, rgba(2, 7, 15, .86) 100%);
  pointer-events: none;
}
.about-slide-view img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  background: #f5f5f2;
  transition: opacity .34s ease, transform .55s cubic-bezier(.2, .75, .2, 1), filter .34s ease;
}
.about-slide-view img.is-score-slide { object-fit: cover; }
.about-slide-view img.is-switching { opacity: .22; transform: scale(.965) rotateY(-2deg); filter: blur(2px); }
.about-slide-expand {
  position: absolute;
  right: 50%;
  bottom: 48px;
  z-index: 4;
  min-height: 37px;
  padding: 7px 12px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: #f7fbff;
  font-size: 10px;
  font-weight: 800;
  white-space: nowrap;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 999px;
  background: rgba(6, 14, 27, .72);
  box-shadow: 0 11px 27px rgba(0, 0, 0, .3);
  backdrop-filter: blur(12px);
  transform: translateX(50%);
}
.about-slide-expand > span { font-size: 14px; }
.about-carousel-nav {
  position: absolute;
  top: 50%;
  z-index: 5;
  width: 38px;
  height: 38px;
  padding: 0;
  display: grid;
  place-items: center;
  color: #fff;
  font-size: 28px;
  line-height: 1;
  border: 1px solid rgba(155, 211, 255, .42);
  border-radius: 50%;
  background: rgba(7, 24, 47, .76);
  box-shadow: 0 12px 27px rgba(0, 0, 0, .34), inset 0 1px rgba(255, 255, 255, .16);
  backdrop-filter: blur(12px);
  transform: translateY(-50%);
  cursor: pointer;
  transition: transform .2s ease, background .2s ease, border-color .2s ease;
}
.about-carousel-prev { right: 11px; }
.about-carousel-next { left: 11px; }
.about-carousel-nav:hover,
.about-carousel-nav:focus-visible { border-color: rgba(155, 211, 255, .9); background: rgba(23, 104, 207, .94); transform: translateY(-50%) scale(1.08); }
.about-slide-meta {
  position: absolute;
  right: 16px;
  bottom: 13px;
  left: 16px;
  z-index: 4;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #fff;
  pointer-events: none;
}
.about-slide-meta span { overflow: hidden; font-size: 11px; font-weight: 800; text-overflow: ellipsis; white-space: nowrap; direction: rtl; }
.about-slide-meta strong { flex: 0 0 auto; color: #9ed3ff; font: 900 10px/1.2 "Segoe UI", Arial, sans-serif; letter-spacing: .07em; }
.about-carousel-dots {
  min-height: 27px;
  margin-top: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}
.about-carousel-dot {
  width: 7px;
  height: 7px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: #39465c;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .05);
  cursor: pointer;
  transition: width .24s ease, background .24s ease, box-shadow .24s ease;
}
.about-carousel-dot.active { width: 25px; background: linear-gradient(90deg, #2486ff, #70c2ff); box-shadow: 0 0 18px rgba(31, 122, 255, .45); }
body.light-theme .about-carousel-stage { border-color: rgba(31, 99, 174, .25); background: linear-gradient(145deg, #fff, #e9f3fe); box-shadow: 20px 35px 72px rgba(46, 75, 111, .22), -10px -8px 32px rgba(31, 122, 255, .08), inset 0 1px #fff; }
body.light-theme .about-carousel-dot { background: #b2bfd0; box-shadow: none; }
body.light-theme .about-carousel-dot.active { background: linear-gradient(90deg, #126ae2, #4aaaff); box-shadow: 0 0 14px rgba(31, 122, 255, .28); }

@keyframes instructor-gallery-float {
  0%, 100% { transform: rotateY(3.5deg) rotateX(1deg) translate3d(0, 0, 0); }
  50% { transform: rotateY(1.5deg) rotateX(.2deg) translate3d(0, -7px, 0); }
}
@keyframes instructor-gallery-sheen {
  0%, 18%, 100% { transform: translateX(-42%); opacity: 0; }
  42%, 62% { opacity: .58; }
  82% { transform: translateX(42%); opacity: 0; }
}

@media (max-width: 1180px) {
  .about-card { grid-template-columns: minmax(280px, .8fr) minmax(0, 1.2fr); }
  .about-actions { grid-column: 1 / -1; width: min(100%, 720px); justify-self: center; }
}
@media (max-width: 720px) {
  .about-card { grid-template-columns: 1fr; padding: 24px; }
  .about-credentials-carousel { width: min(100%, 430px); }
  .about-actions { grid-column: 1; width: 100%; }
}
@media (max-width: 430px) {
  .about-carousel-stage { border-radius: 23px; transform: none; }
  .about-carousel-nav { width: 35px; height: 35px; font-size: 25px; }
  .about-slide-expand { bottom: 45px; }
  .about-slide-meta { right: 13px; left: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  .about-carousel-stage, .about-carousel-stage::before { animation: none !important; }
}

/* Mobile viewport guard: prevent sideways page drift and white overscroll flashes. */
html {
  width: 100%;
  max-width: 100%;
  overflow-x: clip;
  overscroll-behavior-x: none;
  background-color: #05070d;
  color-scheme: dark;
}
html[data-theme="light"] {
  background-color: #f4f7fb;
  color-scheme: light;
}
body {
  position: relative;
  width: 100%;
  max-width: 100%;
  min-height: 100vh;
  overflow-x: clip;
  background-color: #05070d;
}
body.light-theme { background-color: #f4f7fb; }
main, .hero, .site-footer { max-width: 100%; overflow-x: clip; }

body.light-theme .main-nav > a.nav-cta,
body.light-theme .main-nav > a.nav-cta:hover,
body.light-theme .main-nav > a.nav-cta:focus-visible {
  color: #fff;
  border-color: rgba(7, 75, 168, .28);
  background: linear-gradient(110deg, #1554ca, #0878ed);
  box-shadow: 0 13px 29px rgba(16, 103, 232, .28), inset 0 1px rgba(255, 255, 255, .2);
}
body.light-theme .main-nav > a.nav-cta small { color: rgba(255, 255, 255, .82); }

@supports not (overflow: clip) {
  html, body, main, .hero, .site-footer { overflow-x: hidden; }
}