/* ═══════════════════════════════════════════
   ROOT & RESET (Shared across all pages)
═══════════════════════════════════════════ */
:root {
  --navy:    #0B1B3D;
  --navy2:   #0D2251;
  --blue:    #1347CC;
  --sky:     #2B8EF0;
  --orange:  #FF5722;
  --gold:    #FFB300;
  --teal:    #00C9A7;
  --white:   #FFFFFF;
  --offwhite:#F5F7FF;
  --light:   #EEF2FF;
  --muted:   #8A9CC2;
  --dark:    #060E25;
  --text:    #1A2B4A;
  --border:  rgba(19,71,204,0.15);

  --r: 12px;
  --r2: 20px;
  --shadow: 0 8px 40px rgba(11,27,61,0.12);
  --shadowL: 0 20px 80px rgba(11,27,61,0.2);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: 'Outfit', sans-serif;
  color: var(--text);
  background: var(--white);
  overflow-x: hidden;
  line-height: 1.6;
}

img { max-width:100%; display:block; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

/* ═══════════════════════════════════════════
   TYPOGRAPHY
═══════════════════════════════════════════ */
.display { font-family:'Syne',sans-serif; font-weight:800; line-height:1.05; }
.mono { font-family:'JetBrains Mono',monospace; }

h1,h2,h3,h4 { font-family:'Syne',sans-serif; font-weight:700; }

/* ═══════════════════════════════════════════
   UTILITY
═══════════════════════════════════════════ */
.container { max-width:1200px; margin:0 auto; padding:0 24px; }
.container-wide { max-width:1400px; margin:0 auto; padding:0 32px; }

.btn {
  display:inline-flex; align-items:center; gap:8px;
  padding:14px 32px; border-radius:50px;
  font-family:'Outfit',sans-serif; font-weight:600; font-size:1rem;
  cursor:pointer; transition:all .25s; border:none;
  white-space: nowrap;
}
.btn-primary {
  background: var(--orange); color:#fff;
  box-shadow: 0 6px 30px rgba(255,87,34,.4);
}
.btn-primary:hover { background:#e64a19; transform:translateY(-2px); box-shadow:0 10px 40px rgba(255,87,34,.5); }

.btn-outline {
  background:transparent; color:var(--white);
  border:2px solid rgba(255,255,255,.5);
}
.btn-outline:hover { background:rgba(255,255,255,.1); border-color:#fff; }

.btn-dark {
  background:var(--navy); color:#fff;
  box-shadow: 0 6px 30px rgba(11,27,61,.3);
}
.btn-dark:hover { background:var(--navy2); transform:translateY(-2px); }

.badge {
  display:inline-flex; align-items:center; gap:6px;
  padding:6px 16px; border-radius:50px;
  font-size:.8rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
}
.badge-orange { background:rgba(255,87,34,.12); color:var(--orange); }
.badge-blue { background:rgba(19,71,204,.1); color:var(--blue); }
.badge-teal { background:rgba(0,201,167,.12); color:var(--teal); }
.badge-gold { background:rgba(255,179,0,.12); color:#CC8800; }

.tag {
  display:inline-block; padding:4px 12px; border-radius:6px;
  font-size:.78rem; font-weight:600;
  background:var(--light); color:var(--blue);
}

.section-label {
  display:flex; align-items:center; gap:10px;
  font-size:.82rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:var(--blue); margin-bottom:16px;
}
.section-label::before {
  content:''; width:28px; height:3px; background:var(--orange); border-radius:2px;
}

/* ═══════════════════════════════════════════
   NAVIGATION
═══════════════════════════════════════════ */
#nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  background:rgba(6,14,37,.95);
  backdrop-filter:blur(20px);
  border-bottom:1px solid rgba(255,255,255,.08);
  transition:all .3s;
}

.nav-inner {
  display:flex; align-items:center; justify-content:space-between;
  height:70px;
}

.logo {
  display:flex; align-items:center; gap:12px;
}

.logo-mark {
  width:42px; height:42px; border-radius:10px;
  background:linear-gradient(135deg, var(--orange), #FF8A00);
  display:flex; align-items:center; justify-content:center;
  font-family:'Syne',sans-serif; font-weight:800; font-size:1.1rem; color:#fff;
}

.logo-text { display:flex; flex-direction:column; }
.logo-name { font-family:'Syne',sans-serif; font-weight:800; font-size:1.05rem; color:#fff; line-height:1.1; }
.logo-sub { font-size:.68rem; color:var(--muted); letter-spacing:.04em; }

.nav-links { display:flex; align-items:center; gap:32px; }
.nav-links a {
  color:rgba(255,255,255,.75); font-size:.9rem; font-weight:500;
  transition:color .2s; position:relative;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0; height:2px;
  background:var(--orange); border-radius:2px; transform:scaleX(0);
  transition:transform .2s;
}
.nav-links a:hover { color:#fff; }
.nav-links a:hover::after { transform:scaleX(1); }

.nav-cta { display:flex; align-items:center; gap:12px; }

.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:4px; }
.hamburger span { width:24px; height:2px; background:#fff; border-radius:2px; transition:all .3s; }

/* ═══════════════════════════════════════════
   HERO
═══════════════════════════════════════════ */
#hero {
  min-height:100vh;
  background: var(--dark);
  position:relative; overflow:hidden;
  display:flex; align-items:center;
  padding:120px 0 80px;
}

.hero-bg {
  position:absolute; inset:0; z-index:0;
  background: radial-gradient(ellipse 80% 60% at 60% 40%, rgba(19,71,204,.25) 0%, transparent 70%),
              radial-gradient(ellipse 50% 50% at 20% 80%, rgba(255,87,34,.12) 0%, transparent 60%),
              radial-gradient(ellipse 60% 60% at 80% 10%, rgba(0,201,167,.08) 0%, transparent 60%);
}

.hero-grid {
  position:absolute; inset:0; z-index:0;
  background-image:
    linear-gradient(rgba(255,255,255,.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.03) 1px, transparent 1px);
  background-size:60px 60px;
  animation: gridMove 20s linear infinite;
}
@keyframes gridMove {
  0%{transform:translateY(0)} 100%{transform:translateY(60px)}
}

.orb {
  position:absolute; border-radius:50%; filter:blur(60px); z-index:0;
  animation:orbFloat 8s ease-in-out infinite;
}
.orb1 { width:400px; height:400px; background:rgba(19,71,204,.2); top:-100px; right:10%; animation-delay:0s; }
.orb2 { width:300px; height:300px; background:rgba(255,87,34,.15); bottom:5%; left:5%; animation-delay:-3s; }
.orb3 { width:250px; height:250px; background:rgba(0,201,167,.1); top:40%; right:30%; animation-delay:-5s; }

@keyframes orbFloat {
  0%,100%{transform:translateY(0) scale(1)}
  50%{transform:translateY(-30px) scale(1.05)}
}

.hero-inner {
  position:relative; z-index:1;
  display:grid; grid-template-columns:1fr 1fr;
  gap:60px; align-items:center;
}

.hero-badge {
  display:inline-flex; align-items:center; gap:8px;
  background:rgba(255,179,0,.15); color:var(--gold);
  padding:6px 16px; border-radius:50px;
  font-size:.8rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase;
  border:1px solid rgba(255,179,0,.25); margin-bottom:24px;
}
.hero-badge .dot { width:6px; height:6px; background:var(--gold); border-radius:50%; animation:pulse 1.5s infinite; }
@keyframes pulse { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.5;transform:scale(.8)} }

.hero-h1 {
  font-family:'Syne',sans-serif; font-weight:800;
  font-size:clamp(2.4rem, 5vw, 4rem);
  color:#fff; line-height:1.08;
  margin-bottom:24px;
}

.hero-h1 .accent { color:var(--orange); position:relative; display:inline-block; }
.hero-h1 .accent::after {
  content:''; position:absolute; bottom:-4px; left:0; right:0; height:4px;
  background:var(--orange); border-radius:2px; opacity:.5;
}

.hero-h1 .highlight {
  background:linear-gradient(135deg, var(--sky), var(--teal));
  -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text;
}

.hero-desc {
  color:rgba(255,255,255,.65); font-size:1.1rem; font-weight:300;
  max-width:500px; margin-bottom:36px; line-height:1.7;
}

.hero-stats {
  display:flex; gap:32px; margin-bottom:40px;
}
.hero-stat { text-align:center; }
.hero-stat .num {
  font-family:'Syne',sans-serif; font-weight:800; font-size:1.8rem;
  color:#fff; line-height:1;
}
.hero-stat .num span { color:var(--orange); }
.hero-stat .lbl { font-size:.78rem; color:var(--muted); margin-top:4px; }

.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }

.hero-card-wrap { position:relative; }

.hero-visual {
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.1);
  border-radius:24px; overflow:hidden;
  backdrop-filter:blur(20px);
  padding:32px;
}

.hv-title {
  font-family:'Syne',sans-serif; font-weight:700; font-size:1.1rem;
  color:#fff; margin-bottom:20px;
  display:flex; align-items:center; gap:10px;
}
.hv-title .dot { width:8px; height:8px; background:var(--teal); border-radius:50%; animation:pulse 1.5s infinite; }

.module-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-bottom:20px;
}
.module-card {
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
  border-radius:12px; padding:14px;
  transition:all .3s;
}
.module-card:hover { background:rgba(255,255,255,.1); border-color:rgba(19,71,204,.5); }
.mc-icon { font-size:1.4rem; margin-bottom:8px; }
.mc-name { font-size:.82rem; font-weight:600; color:#fff; margin-bottom:4px; }
.mc-count { font-size:.72rem; color:var(--muted); }

.hv-exp {
  background:linear-gradient(135deg, rgba(255,87,34,.15), rgba(255,87,34,.05));
  border:1px solid rgba(255,87,34,.2);
  border-radius:12px; padding:16px 20px;
  display:flex; align-items:center; gap:16px;
}
.hv-exp-num { font-family:'Syne',sans-serif; font-weight:800; font-size:2.5rem; color:var(--orange); line-height:1; }
.hv-exp-txt { font-size:.82rem; color:rgba(255,255,255,.7); line-height:1.4; }
.hv-exp-txt strong { color:#fff; }

.float-badge {
  position:absolute; background:#fff; border-radius:12px;
  padding:10px 16px; display:flex; align-items:center; gap:10px;
  box-shadow:0 10px 40px rgba(0,0,0,.2);
  font-size:.8rem; font-weight:600; color:var(--navy);
  animation:badgeFloat 4s ease-in-out infinite;
}
.float-badge .fb-icon { font-size:1.2rem; }
.fb1 { top:-20px; left:-20px; animation-delay:0s; }
.fb2 { bottom:60px; right:-20px; animation-delay:-2s; }
@keyframes badgeFloat {
  0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)}
}

/* ═══════════════════════════════════════════
   MARQUEE
═══════════════════════════════════════════ */
.marquee-strip {
  background:var(--orange);
  padding:12px 0; overflow:hidden;
  display:flex;
}
.marquee-track {
  display:flex; gap:0; white-space:nowrap;
  animation: marquee 25s linear infinite;
}
.marquee-item {
  display:inline-flex; align-items:center; gap:12px;
  padding:0 32px;
  font-family:'Syne',sans-serif; font-weight:700; font-size:.85rem;
  color:#fff; text-transform:uppercase; letter-spacing:.08em;
}
.marquee-item::before { content:'★'; opacity:.7; }
@keyframes marquee { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* ═══════════════════════════════════════════
   WHY PSIM
═══════════════════════════════════════════ */
#why {
  padding:100px 0;
  background:var(--offwhite);
  position:relative; overflow:hidden;
}

.why-header { text-align:center; margin-bottom:64px; }
.why-h2 { font-size:clamp(2rem,4vw,3rem); color:var(--navy); margin-bottom:16px; }
.why-sub { font-size:1.05rem; color:var(--muted); max-width:580px; margin:0 auto; }

.why-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

.why-card {
  background:#fff; border-radius:var(--r2);
  padding:36px 28px;
  border:1px solid var(--border);
  transition:all .3s; position:relative; overflow:hidden;
}
.why-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:4px;
  background:var(--orange); transform:scaleX(0); transition:transform .3s;
}
.why-card:hover { transform:translateY(-6px); box-shadow:var(--shadowL); }
.why-card:hover::before { transform:scaleX(1); }

.wc-icon {
  width:56px; height:56px; border-radius:14px;
  background:var(--light); display:flex; align-items:center; justify-content:center;
  font-size:1.6rem; margin-bottom:20px;
}
.wc-title { font-size:1.1rem; font-weight:700; color:var(--navy); margin-bottom:10px; }
.wc-text { font-size:.9rem; color:var(--muted); line-height:1.7; }

/* ═══════════════════════════════════════════
   COURSE CURRICULUM
═══════════════════════════════════════════ */
#course {
  padding:100px 0;
  background:#fff;
}

.course-header {
  display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start;
  margin-bottom:64px;
}

.course-h2 { font-size:clamp(2rem,4vw,2.8rem); color:var(--navy); margin-bottom:16px; }
.course-sub { font-size:1rem; color:var(--muted); line-height:1.7; }

.course-meta { display:flex; flex-direction:column; gap:12px; }
.cm-item {
  display:flex; align-items:center; gap:14px;
  background:var(--offwhite); border-radius:12px; padding:16px 20px;
}
.cm-icon { font-size:1.3rem; }
.cm-label { font-size:.82rem; color:var(--muted); }
.cm-val { font-size:1rem; font-weight:700; color:var(--navy); }

.curriculum { display:flex; flex-direction:column; gap:12px; }

.section-block {
  border:1px solid var(--border);
  border-radius:var(--r); overflow:hidden;
}

.section-header {
  display:flex; align-items:center; gap:16px; padding:18px 24px;
  background:var(--offwhite); cursor:pointer;
  transition:background .2s;
}
.section-header:hover { background:var(--light); }

.sh-icon { font-size:1.3rem; }
.sh-color {
  width:4px; height:36px; border-radius:2px; flex-shrink:0;
}
.sh-title { font-weight:700; font-size:.95rem; color:var(--navy); flex:1; }
.sh-count { font-size:.82rem; color:var(--muted); margin-right:12px; white-space:nowrap; }
.sh-arrow {
  width:24px; height:24px; border-radius:50%;
  background:var(--light); display:flex; align-items:center; justify-content:center;
  font-size:.7rem; color:var(--blue); transition:transform .3s; flex-shrink:0;
}
.section-block.open .sh-arrow { transform:rotate(180deg); }

.section-body {
  display:none; padding:20px 24px;
  background:#fff;
}
.section-block.open .section-body { display:block; }

.module-list { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.module-item {
  display:flex; align-items:flex-start; gap:10px;
  padding:10px 12px; border-radius:8px; background:var(--offwhite);
}
.mi-num {
  font-family:'JetBrains Mono',monospace; font-size:.75rem;
  color:var(--blue); background:var(--light);
  padding:2px 8px; border-radius:4px; flex-shrink:0; margin-top:1px;
}
.mi-name { font-size:.85rem; color:var(--text); font-weight:500; }

/* ═══════════════════════════════════════════
   SYLLABUS TOPICS
═══════════════════════════════════════════ */
#syllabus {
  padding:100px 0;
  background:var(--navy);
  position:relative; overflow:hidden;
}

.syllabus-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 60% at 80% 50%, rgba(19,71,204,.3), transparent),
              radial-gradient(ellipse 40% 40% at 10% 80%, rgba(255,87,34,.15), transparent);
}

.syllabus-header { text-align:center; margin-bottom:60px; position:relative; z-index:1; }
.syllabus-h2 { font-size:clamp(2rem,4vw,2.8rem); color:#fff; margin-bottom:16px; }
.syllabus-sub { color:var(--muted); font-size:1rem; max-width:600px; margin:0 auto; }

.topics-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:16px;
  position:relative; z-index:1;
}

.topic-card {
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r); padding:20px;
  transition:all .3s;
}
.topic-card:hover {
  background:rgba(255,255,255,.1);
  border-color:rgba(19,71,204,.5);
  transform:translateY(-4px);
}
.tc-emoji { font-size:1.6rem; margin-bottom:10px; }
.tc-title { font-size:.9rem; font-weight:700; color:#fff; margin-bottom:6px; }
.tc-count { font-size:.78rem; color:var(--muted); }
.tc-tags { display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.tc-tag {
  font-size:.7rem; padding:3px 10px; border-radius:4px;
  background:rgba(19,71,204,.25); color:rgba(255,255,255,.7);
  font-weight:500;
}

/* ═══════════════════════════════════════════
   INSTRUCTOR
═══════════════════════════════════════════ */
#instructor {
  padding:100px 0;
  background:#fff;
}

.instructor-inner {
  display:grid; grid-template-columns:1fr 1.6fr; gap:80px; align-items:center;
}

.instructor-visual { position:relative; }

.instructor-img-wrap {
  width:100%; aspect-ratio:4/5; border-radius:24px;
  background:linear-gradient(135deg, var(--light) 0%, var(--offwhite) 100%);
  position:relative; overflow:hidden;
  border:3px solid var(--border);
}

.instructor-placeholder {
  width:100%; height:100%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:16px;
}
.ip-avatar {
  width:120px; height:120px; border-radius:50%;
  background:linear-gradient(135deg, var(--navy), var(--blue));
  display:flex; align-items:center; justify-content:center;
  font-family:'Syne',sans-serif; font-weight:800; font-size:2.5rem; color:#fff;
}
.ip-name { font-family:'Syne',sans-serif; font-weight:700; font-size:1.2rem; color:var(--navy); }
.ip-role { font-size:.85rem; color:var(--muted); }

.exp-badge {
  position:absolute; bottom:24px; right:-20px;
  background:var(--orange); color:#fff; border-radius:16px; padding:16px 20px;
  text-align:center; box-shadow:0 8px 32px rgba(255,87,34,.4);
}
.eb-num { font-family:'Syne',sans-serif; font-weight:800; font-size:2.2rem; line-height:1; }
.eb-txt { font-size:.75rem; font-weight:600; opacity:.9; }

.inst-h2 { font-size:clamp(1.8rem,3vw,2.4rem); color:var(--navy); margin-bottom:16px; }
.inst-sub { font-size:1rem; color:var(--muted); line-height:1.7; margin-bottom:32px; }

.inst-highlights { display:flex; flex-direction:column; gap:12px; margin-bottom:36px; }
.ih-item {
  display:flex; align-items:center; gap:14px;
  padding:14px 18px; border-radius:10px; background:var(--offwhite);
}
.ih-check {
  width:28px; height:28px; border-radius:50%;
  background:rgba(0,201,167,.15); color:var(--teal);
  display:flex; align-items:center; justify-content:center;
  font-size:.85rem; flex-shrink:0;
}
.ih-text { font-size:.9rem; font-weight:500; color:var(--text); }

.inst-skills { display:flex; flex-wrap:wrap; gap:8px; }
.skill-tag {
  padding:6px 14px; border-radius:6px;
  background:var(--light); color:var(--blue);
  font-size:.82rem; font-weight:600;
}

/* ═══════════════════════════════════════════
   TOOLS
═══════════════════════════════════════════ */
#tools {
  padding:80px 0;
  background:var(--offwhite);
}

.tools-header { text-align:center; margin-bottom:48px; }
.tools-h2 { font-size:clamp(1.8rem,3vw,2.4rem); color:var(--navy); margin-bottom:12px; }

.tools-row { display:flex; flex-wrap:wrap; gap:12px; justify-content:center; }

.tool-pill {
  display:flex; align-items:center; gap:10px;
  background:#fff; border:1px solid var(--border);
  padding:10px 20px; border-radius:50px;
  font-size:.88rem; font-weight:600; color:var(--navy);
  transition:all .25s; cursor:default;
}
.tool-pill:hover {
  background:var(--navy); color:#fff;
  border-color:var(--navy); transform:translateY(-2px);
  box-shadow:var(--shadow);
}
.tool-pill .ti { font-size:1.1rem; }

/* ═══════════════════════════════════════════
   OUTCOMES
═══════════════════════════════════════════ */
#outcomes {
  padding:100px 0;
  background:#fff;
}

.outcomes-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:center; }

.out-h2 { font-size:clamp(1.8rem,3vw,2.5rem); color:var(--navy); margin-bottom:16px; }
.out-sub { color:var(--muted); line-height:1.7; margin-bottom:36px; }

.outcome-list { display:flex; flex-direction:column; gap:12px; }
.outcome-item {
  display:flex; align-items:center; gap:14px;
  padding:14px 18px; border-radius:12px;
  border:1px solid var(--border); background:var(--offwhite);
  transition:all .3s;
}
.outcome-item:hover { background:var(--light); border-color:rgba(19,71,204,.3); transform:translateX(4px); }
.oi-icon {
  width:32px; height:32px; border-radius:8px;
  background:rgba(255,87,34,.1); color:var(--orange);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; flex-shrink:0;
}
.oi-text { font-size:.9rem; font-weight:500; color:var(--text); }

.career-cards { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.career-card {
  background:var(--navy); border-radius:var(--r2);
  padding:28px 24px; transition:all .3s;
}
.career-card:hover { transform:translateY(-4px); box-shadow:var(--shadowL); }
.career-card.accent-card { background:linear-gradient(135deg, var(--orange), #FF8A00); }
.career-card.tall { grid-row:span 2; display:flex; flex-direction:column; justify-content:flex-end; }

.cc-icon { font-size:2rem; margin-bottom:16px; }
.cc-title { font-family:'Syne',sans-serif; font-weight:700; font-size:1.05rem; color:#fff; margin-bottom:6px; }
.cc-range { font-size:.82rem; color:rgba(255,255,255,.65); }
.cc-salary { font-family:'Syne',sans-serif; font-weight:800; font-size:1.5rem; color:var(--gold); margin-top:8px; }

/* ═══════════════════════════════════════════
   AUDIENCE
═══════════════════════════════════════════ */
#audience {
  padding:100px 0;
  background:var(--dark);
  position:relative; overflow:hidden;
}

.audience-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 50% 60% at 30% 50%, rgba(19,71,204,.2), transparent);
}

.audience-header { text-align:center; margin-bottom:60px; position:relative; z-index:1; }
.aud-h2 { font-size:clamp(2rem,4vw,2.8rem); color:#fff; margin-bottom:12px; }
.aud-sub { color:var(--muted); font-size:1rem; }

.audience-grid {
  display:grid; grid-template-columns:repeat(3,1fr); gap:20px;
  position:relative; z-index:1;
}

.audience-card {
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.08);
  border-radius:var(--r2); padding:32px 28px;
  transition:all .3s; position:relative; overflow:hidden;
}
.audience-card::before {
  content:''; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, var(--orange), var(--gold));
  transform:scaleX(0); transition:transform .3s;
}
.audience-card:hover { background:rgba(255,255,255,.1); transform:translateY(-4px); }
.audience-card:hover::before { transform:scaleX(1); }

.ac-icon { font-size:2.5rem; margin-bottom:16px; }
.ac-title { font-family:'Syne',sans-serif; font-weight:700; font-size:1.1rem; color:#fff; margin-bottom:10px; }
.ac-text { font-size:.88rem; color:rgba(255,255,255,.6); line-height:1.7; }

/* ═══════════════════════════════════════════
   TESTIMONIALS
═══════════════════════════════════════════ */
#testimonials {
  padding:100px 0;
  background:var(--offwhite);
}

.test-header { text-align:center; margin-bottom:60px; }
.test-h2 { font-size:clamp(1.8rem,3vw,2.5rem); color:var(--navy); margin-bottom:12px; }

.test-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }

.test-card {
  background:#fff; border-radius:var(--r2);
  padding:32px 28px; border:1px solid var(--border);
  position:relative; transition:all .3s;
}
.test-card:hover { transform:translateY(-4px); box-shadow:var(--shadowL); }

.test-quote-icon {
  font-size:3rem; color:var(--light);
  font-family:Georgia,serif; line-height:1;
  position:absolute; top:16px; right:24px;
}

.test-stars { color:var(--gold); font-size:.9rem; margin-bottom:14px; letter-spacing:2px; }
.test-text { font-size:.9rem; color:var(--muted); line-height:1.7; margin-bottom:24px; font-style:italic; }

.test-author { display:flex; align-items:center; gap:12px; }
.ta-avatar {
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg, var(--navy), var(--blue));
  display:flex; align-items:center; justify-content:center;
  font-family:'Syne',sans-serif; font-weight:700; color:#fff; font-size:.9rem;
}
.ta-name { font-weight:700; font-size:.9rem; color:var(--navy); }
.ta-role { font-size:.78rem; color:var(--muted); }

/* ═══════════════════════════════════════════
   PRICING
═══════════════════════════════════════════ */
#pricing {
  padding:100px 0;
  background:#fff;
}

.pricing-header { text-align:center; margin-bottom:60px; }
.price-h2 { font-size:clamp(1.8rem,3vw,2.5rem); color:var(--navy); margin-bottom:12px; }
.price-sub { color:var(--muted); font-size:1rem; }

.pricing-grid { display:grid; grid-template-columns:1fr 1.1fr 1fr; gap:24px; align-items:start; }

.price-card {
  border-radius:var(--r2); padding:36px 32px;
  border:2px solid var(--border); background:#fff;
  transition:all .3s; position:relative;
}
.price-card:hover { transform:translateY(-6px); box-shadow:var(--shadowL); }

.price-card.featured {
  background:var(--navy); border-color:var(--navy);
  transform:scale(1.02);
}
.price-card.featured:hover { transform:scale(1.02) translateY(-6px); }

.popular-badge {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--orange); color:#fff;
  padding:4px 20px; border-radius:50px;
  font-size:.75rem; font-weight:700; letter-spacing:.08em; white-space:nowrap;
}

.pc-name { font-size:.82rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); margin-bottom:12px; }
.price-card.featured .pc-name { color:rgba(255,255,255,.6); }

.pc-price {
  font-family:'Syne',sans-serif; font-weight:800; font-size:2.8rem;
  color:var(--navy); line-height:1; margin-bottom:4px;
}
.price-card.featured .pc-price { color:#fff; }

.pc-price .currency { font-size:1.5rem; vertical-align:super; }
.pc-period { font-size:.85rem; color:var(--muted); margin-bottom:24px; }
.price-card.featured .pc-period { color:rgba(255,255,255,.6); }

.pc-features { display:flex; flex-direction:column; gap:10px; margin-bottom:32px; }
.pc-feat {
  display:flex; align-items:center; gap:10px;
  font-size:.88rem; color:var(--text);
}
.price-card.featured .pc-feat { color:rgba(255,255,255,.8); }
.pc-feat .check { color:var(--teal); font-size:1rem; flex-shrink:0; }
.pc-feat.dim { opacity:.4; }
.pc-feat.dim .check { color:var(--muted); }

.btn-price {
  width:100%; justify-content:center;
  padding:14px; border-radius:12px;
}
.btn-price-white {
  background:#fff; color:var(--navy);
}
.btn-price-white:hover { background:var(--light); transform:none; }

/* ═══════════════════════════════════════════
   FAQ
═══════════════════════════════════════════ */
#faq {
  padding:100px 0;
  background:var(--offwhite);
}

.faq-inner { display:grid; grid-template-columns:1fr 1.4fr; gap:80px; align-items:start; }

.faq-left { position:sticky; top:100px; }
.faq-h2 { font-size:clamp(1.8rem,3vw,2.4rem); color:var(--navy); margin-bottom:16px; }
.faq-sub { color:var(--muted); line-height:1.7; margin-bottom:32px; }

.faq-contact {
  background:var(--navy); border-radius:var(--r2); padding:28px;
}
.fc-title { font-weight:700; color:#fff; margin-bottom:8px; }
.fc-text { font-size:.88rem; color:rgba(255,255,255,.6); margin-bottom:20px; }
.fc-btn {
  display:inline-flex; align-items:center; gap:8px;
  background:var(--orange); color:#fff;
  padding:10px 24px; border-radius:50px;
  font-size:.88rem; font-weight:600; cursor:pointer;
  transition:all .25s;
}
.fc-btn:hover { background:#e64a19; }

.faq-list { display:flex; flex-direction:column; gap:12px; }

.faq-item {
  background:#fff; border-radius:var(--r);
  border:1px solid var(--border); overflow:hidden;
}

.faq-q {
  display:flex; align-items:center; justify-content:space-between;
  padding:20px 24px; cursor:pointer; gap:16px;
  font-weight:600; font-size:.95rem; color:var(--navy);
  transition:background .2s;
}
.faq-q:hover { background:var(--offwhite); }

.fq-arrow {
  width:28px; height:28px; border-radius:50%;
  background:var(--light); display:flex; align-items:center; justify-content:center;
  font-size:.7rem; color:var(--blue); transition:transform .3s; flex-shrink:0;
}
.faq-item.open .fq-arrow { transform:rotate(180deg); background:var(--blue); color:#fff; }

.faq-a {
  display:none; padding:0 24px 20px;
  font-size:.9rem; color:var(--muted); line-height:1.7;
}
.faq-item.open .faq-a { display:block; }

/* ═══════════════════════════════════════════
   CTA SECTION
═══════════════════════════════════════════ */
#cta {
  padding:100px 0;
  background:linear-gradient(135deg, var(--navy) 0%, #0D2251 50%, #1A1060 100%);
  position:relative; overflow:hidden; text-align:center;
}

.cta-bg {
  position:absolute; inset:0;
  background:radial-gradient(ellipse 60% 70% at 50% 50%, rgba(19,71,204,.3), transparent);
}

.cta-inner { position:relative; z-index:1; max-width:700px; margin:0 auto; }
.cta-h2 { font-size:clamp(2rem,4vw,3.2rem); color:#fff; margin-bottom:20px; }
.cta-sub { font-size:1.05rem; color:rgba(255,255,255,.65); margin-bottom:40px; line-height:1.7; }

.cta-form {
  display:flex; gap:12px; max-width:520px; margin:0 auto 32px;
}

.cta-input {
  flex:1; padding:14px 20px; border-radius:50px;
  border:none; background:rgba(255,255,255,.12);
  color:#fff; font-family:'Outfit',sans-serif; font-size:1rem;
  backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.2);
  outline:none;
}
.cta-input::placeholder { color:rgba(255,255,255,.4); }
.cta-input:focus { border-color:rgba(255,255,255,.4); }

.cta-note { font-size:.82rem; color:rgba(255,255,255,.4); }

/* ═══════════════════════════════════════════
   FOOTER
═══════════════════════════════════════════ */
#footer {
  background:var(--dark);
  border-top:1px solid rgba(255,255,255,.06);
  padding:60px 0 0;
}

.footer-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:48px; margin-bottom:60px; }

.fg-brand { }
.fg-logo { margin-bottom:16px; }
.fg-desc { font-size:.88rem; color:var(--muted); line-height:1.7; margin-bottom:24px; }

.social-links { display:flex; gap:10px; }
.social-link {
  width:38px; height:38px; border-radius:10px;
  background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.08);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; color:var(--muted); transition:all .25s; cursor:pointer;
}
.social-link:hover { background:var(--orange); color:#fff; border-color:var(--orange); }

.fg-title {
  font-family:'Syne',sans-serif; font-weight:700; font-size:.9rem;
  color:#fff; text-transform:uppercase; letter-spacing:.08em;
  margin-bottom:20px;
}

.fg-links { display:flex; flex-direction:column; gap:10px; }
.fg-links a {
  font-size:.88rem; color:var(--muted); transition:color .2s;
}
.fg-links a:hover { color:#fff; }

.footer-contact { display:flex; flex-direction:column; gap:10px; }
.fc-item { display:flex; align-items:flex-start; gap:10px; }
.fc-item .ci { font-size:1rem; color:var(--orange); margin-top:1px; flex-shrink:0; }
.fc-item span { font-size:.85rem; color:var(--muted); line-height:1.5; }

.footer-bottom {
  border-top:1px solid rgba(255,255,255,.06);
  padding:20px 0;
  display:flex; align-items:center; justify-content:space-between;
}
.fb-copy { font-size:.82rem; color:var(--muted); }
.fb-links { display:flex; gap:20px; }
.fb-links a { font-size:.8rem; color:var(--muted); transition:color .2s; }
.fb-links a:hover { color:#fff; }

/* ═══════════════════════════════════════════
   WHATSAPP FLOAT
═══════════════════════════════════════════ */
.wa-float {
  position:fixed; bottom:28px; right:28px; z-index:999;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-size:1.7rem; box-shadow:0 4px 24px rgba(37,211,102,.5);
  cursor:pointer; transition:all .3s;
  animation:waPulse 3s infinite;
}
.wa-float:hover { transform:scale(1.1); box-shadow:0 8px 40px rgba(37,211,102,.6); }
@keyframes waPulse {
  0%,100%{box-shadow:0 4px 24px rgba(37,211,102,.5)}
  50%{box-shadow:0 4px 40px rgba(37,211,102,.8)}
}

/* ═══════════════════════════════════════════
   SCROLL ANIMATIONS
═══════════════════════════════════════════ */
.reveal {
  opacity:0; transform:translateY(30px);
  transition:opacity .7s, transform .7s;
}
.reveal.visible { opacity:1; transform:translateY(0); }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media(max-width:1024px) {
  .why-grid { grid-template-columns:1fr 1fr; }
  .topics-grid { grid-template-columns:repeat(3,1fr); }
  .instructor-inner { grid-template-columns:1fr; gap:48px; }
  .instructor-visual { max-width:400px; margin:0 auto; }
  .outcomes-grid { grid-template-columns:1fr; }
  .pricing-grid { grid-template-columns:1fr; max-width:480px; margin:0 auto; }
  .price-card.featured { transform:none; }
  .audience-grid { grid-template-columns:1fr 1fr; }
  .faq-inner { grid-template-columns:1fr; }
  .faq-left { position:static; }
  .footer-grid { grid-template-columns:1fr 1fr; }
}

@media(max-width:768px) {
  .nav-links, .nav-cta { display:none; }
  .hamburger { display:flex; }

  .hero-inner { grid-template-columns:1fr; }
  .hero-card-wrap { display:none; }
  .hero-stats { gap:20px; }

  .why-grid { grid-template-columns:1fr; }
  .module-list { grid-template-columns:1fr; }
  .topics-grid { grid-template-columns:1fr 1fr; }
  .audience-grid { grid-template-columns:1fr; }
  .test-grid { grid-template-columns:1fr; }
  .career-cards { grid-template-columns:1fr; }
  .course-header { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom { flex-direction:column; gap:12px; text-align:center; }
  .cta-form { flex-direction:column; }
}