/* ==============================================================================
   4ACHIEVERS HOMEPAGE - 1000% EXACT PDF REPLICA STYLESHEET
   Matches 4Achievers_Homepage_FINAL_VERY_HIGH_RES_LOSSLESS.pdf with pixel perfection
   ============================================================================== */

:root {
  --pdf-font-heading: 'Outfit', sans-serif;
  --pdf-font-body: 'Plus Jakarta Sans', sans-serif;
  --pdf-primary: #10B981;
  --pdf-primary-hover: #059669;
  --pdf-blue: #059669;
  --pdf-blue-hover: #047857;
  --pdf-dark: #07152B;
  --pdf-dark-slate: #0B1F3D;
  --pdf-navy-footer: #050F1E;
  --pdf-border-light: #E2E8F0;
  --pdf-text-dark: #0F172A;
  --pdf-text-muted: #64748B;
}

/* Master Container for PDF sections */
.pdf-container {
  max-width: 1260px;
  margin: 0 auto;
  padding: 0 20px;
  box-sizing: border-box;
}

/* ==============================================================================
   1. FEATURES BAR (6 Pill Items Floating Below Hero)
   ============================================================================== */
.pdf-features-bar-wrap {
  padding: 0;
  margin-top: -26px;
  margin-bottom: 38px;
  position: relative;
  z-index: 20;
}

.pdf-features-bar {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 12px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  box-shadow: 0 8px 30px rgba(15, 23, 42, 0.08);
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  .pdf-features-bar {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .pdf-features-bar {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
}

.pdf-feature-pill {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
}

.pdf-feature-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  box-shadow: 0 2px 6px rgba(0,0,0,0.06);
}

.pdf-feature-title {
  font-size: 13px;
  font-weight: 700;
  color: #1E293B;
  line-height: 1.3;
  font-family: var(--pdf-font-body);
}

/* ==============================================================================
   2. OUR POPULAR JOB-ORIENTED PROGRAMS (6 Clean Cards)
   ============================================================================== */
/* ==============================================================================
   2. OUR POPULAR JOB-ORIENTED PROGRAMS (1000% Exact 2nd Image Match)
   ============================================================================== */
.pdf-programs-section {
  padding: 25px 0 55px;
  background: #FFFFFF;
  position: relative;
  background-image: 
    radial-gradient(circle at 2% 40%, rgba(16, 185, 129, 0.08) 0%, transparent 28%),
    radial-gradient(circle at 98% 30%, rgba(56, 189, 248, 0.08) 0%, transparent 28%);
}

.pdf-learn-pill-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #DCFCE7;
  color: #15803D;
  padding: 6px 16px;
  border-radius: 9999px;
  font-size: 12.5px;
  font-weight: 700;
  margin-bottom: 12px;
  box-shadow: 0 1px 3px rgba(21, 128, 61, 0.08);
  font-family: var(--pdf-font-body);
}

.pdf-learn-pill-badge svg {
  flex-shrink: 0;
}

.pdf-section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 24px;
  flex-wrap: wrap;
  gap: 20px;
}

.pdf-section-title-wrap {
  display: flex;
  align-items: center;
  gap: 8px;
}

.pdf-section-title {
  font-size: 32px;
  font-weight: 800;
  color: #064E3B;
  margin: 0;
  font-family: var(--pdf-font-heading);
  letter-spacing: -0.02em;
  line-height: 1.2;
}

.pdf-title-accents {
  display: inline-flex;
  align-items: center;
  margin-left: 6px;
  color: #059669;
}

.pdf-section-subtitle {
  font-size: 15px;
  color: #64748B;
  font-weight: 400;
  margin: 8px 0 0 0;
  font-family: var(--pdf-font-body);
}

.pdf-programs-header-right {
  display: flex;
  align-items: center;
  gap: 16px;
  position: relative;
}

.pdf-career-arrow-hint {
  display: flex;
  align-items: center;
  gap: 6px;
  color: #059669;
  font-family: 'Outfit', cursive, sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 1.15;
  text-align: right;
}

.pdf-career-arrow-hint svg {
  flex-shrink: 0;
}

.pdf-btn-view-all-dark {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 26px;
  background: #064E3B;
  border: none;
  border-radius: 9px;
  color: #FFFFFF;
  font-weight: 700;
  font-size: 14px;
  text-decoration: none;
  transition: all 0.25s ease;
  font-family: var(--pdf-font-body);
  box-shadow: 0 4px 14px rgba(6, 78, 59, 0.25);
}

.pdf-btn-view-all-dark:hover {
  background: #04392B;
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(6, 78, 59, 0.35);
  color: #FFFFFF;
}

.pdf-programs-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

@media (max-width: 1240px) {
  .pdf-programs-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 18px;
  }
}

@media (max-width: 768px) {
  .pdf-programs-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
  .pdf-section-title {
    font-size: 26px;
  }
  .pdf-career-arrow-hint {
    display: none;
  }
}

@media (max-width: 520px) {
  .pdf-programs-grid {
    grid-template-columns: 1fr;
  }
}

.pdf-course-card {
  border-radius: 16px;
  padding: 20px 16px 16px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.05);
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
}

.pdf-course-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 14px 30px rgba(15, 23, 42, 0.1);
}

/* Card 1: Data Analytics */
.pdf-card-analytics {
  background: linear-gradient(180deg, #FFFFFF 70%, #E8F9F0 100%);
  border: 1.5px solid #D1FAE5;
}
.pdf-card-analytics .pdf-card-icon-square {
  background: #10B981;
  color: #FFFFFF;
}
.pdf-card-analytics .pdf-card-badge-pill {
  background: #E8F8EE;
  color: #047857;
}
.pdf-card-analytics .pdf-card-btn-solid {
  background: #065F46;
  color: #FFFFFF;
}
.pdf-card-analytics .pdf-card-btn-solid:hover {
  background: #044E39;
}

/* Card 2: Data Science */
.pdf-card-datascience {
  background: linear-gradient(180deg, #FFFFFF 70%, #EEF2FF 100%);
  border: 1.5px solid #E0E7FF;
}
.pdf-card-datascience .pdf-card-icon-square {
  background: #4F46E5;
  color: #FFFFFF;
}
.pdf-card-datascience .pdf-card-badge-pill {
  background: #EDE9FE;
  color: #6D28D9;
}
.pdf-card-datascience .pdf-card-btn-solid {
  background: #3B52D4;
  color: #FFFFFF;
}
.pdf-card-datascience .pdf-card-btn-solid:hover {
  background: #2D41BD;
}

/* Card 3: Software Testing */
.pdf-card-testing {
  background: linear-gradient(180deg, #FFFFFF 70%, #E0F2FE 100%);
  border: 1.5px solid #BAE6FD;
}
.pdf-card-testing .pdf-card-icon-square {
  background: #059669;
  color: #FFFFFF;
}
.pdf-card-testing .pdf-card-badge-pill {
  background: #E0F2FE;
  color: #0284C7;
}
.pdf-card-testing .pdf-card-btn-solid {
  background: #1D70F5;
  color: #FFFFFF;
}
.pdf-card-testing .pdf-card-btn-solid:hover {
  background: #1459CA;
}

/* Card 4: Full Stack */
.pdf-card-fullstack {
  background: linear-gradient(180deg, #FFFFFF 70%, #FFF7ED 100%);
  border: 1.5px solid #FED7AA;
}
.pdf-card-fullstack .pdf-card-icon-square {
  background: #F97316;
  color: #FFFFFF;
}
.pdf-card-fullstack .pdf-card-badge-pill {
  background: #FFEDD5;
  color: #C2410C;
}
.pdf-card-fullstack .pdf-card-btn-solid {
  background: #EA580C;
  color: #FFFFFF;
}
.pdf-card-fullstack .pdf-card-btn-solid:hover {
  background: #C2410C;
}

/* Card 5: Data Engineering */
.pdf-card-engineering {
  background: linear-gradient(180deg, #FFFFFF 70%, #F0FDFA 100%);
  border: 1.5px solid #99F6E4;
}
.pdf-card-engineering .pdf-card-icon-square {
  background: #0D9488;
  color: #FFFFFF;
}
.pdf-card-engineering .pdf-card-badge-pill {
  background: #CCFBF1;
  color: #0F766E;
}
.pdf-card-engineering .pdf-card-btn-solid {
  background: #0F766E;
  color: #FFFFFF;
}
.pdf-card-engineering .pdf-card-btn-solid:hover {
  background: #0D5C56;
}

/* Card 6: DevOps & Cloud */
.pdf-card-devops {
  background: linear-gradient(180deg, #FFFFFF 70%, #FAF5FF 100%);
  border: 1.5px solid #DDD6FE;
}
.pdf-card-devops .pdf-card-icon-square {
  background: #7C3AED;
  color: #FFFFFF;
}
.pdf-card-devops .pdf-card-badge-pill {
  background: #F3E8FF;
  color: #7E22CE;
}
.pdf-card-devops .pdf-card-btn-solid {
  background: #5438DC;
  color: #FFFFFF;
}
.pdf-card-devops .pdf-card-btn-solid:hover {
  background: #4228BA;
}

.pdf-card-head-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 14px;
}

.pdf-card-icon-square {
  width: 44px;
  height: 44px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.08);
  flex-shrink: 0;
}

.pdf-card-badge-pill {
  font-size: 11px;
  font-weight: 700;
  padding: 4px 10px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  letter-spacing: 0.01em;
  font-family: var(--pdf-font-body);
}

.pdf-card-program-title {
  font-size: 16.5px;
  font-weight: 800;
  color: #0F172A;
  margin: 0 0 8px 0;
  line-height: 1.25;
  font-family: var(--pdf-font-heading);
}

.pdf-card-program-desc {
  font-size: 12px;
  color: #64748B;
  line-height: 1.45;
  margin: 0 0 14px 0;
  font-family: var(--pdf-font-body);
  min-height: 48px;
}

.pdf-card-bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 18px 0;
  display: flex;
  flex-direction: column;
  gap: 7px;
}

.pdf-card-bullet {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 12px;
  color: #334155;
  line-height: 1.35;
  font-family: var(--pdf-font-body);
}

.pdf-card-bullet svg {
  flex-shrink: 0;
  margin-top: 1px;
}

.pdf-card-btn-solid {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 10px 0;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  transition: all 0.2s ease;
  box-sizing: border-box;
  border: none;
  font-family: var(--pdf-font-body);
}

.pdf-card-btn-solid:hover {
  transform: translateY(-1px);
}

/* ==============================================================================
   3. AI CAREER ROADMAP GENERATOR STUDIO (Interactive AI Skills Engine)
   ============================================================================== */
.pdf-ai-roadmap-section {
  padding: 20px 0 45px;
  background: #FFFFFF;
}

.pdf-ai-roadmap-card {
  background-color: #07152B;
  background: 
    radial-gradient(circle at 10% 20%, rgba(16, 185, 129, 0.18) 0%, transparent 40%),
    radial-gradient(circle at 90% 80%, rgba(56, 189, 248, 0.18) 0%, transparent 40%),
    linear-gradient(135deg, #07152B 0%, #0B1F3D 45%, #051120 100%);
  border-radius: 20px;
  padding: 34px 36px;
  color: #FFFFFF;
  display: grid;
  grid-template-columns: 1fr 1.15fr;
  gap: 32px;
  align-items: stretch;
  box-shadow: 0 20px 50px rgba(7, 21, 43, 0.45);
  border: 1px solid rgba(16, 185, 129, 0.3);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

@media (max-width: 1024px) {
  .pdf-ai-roadmap-card {
    grid-template-columns: 1fr;
    padding: 28px 24px;
    gap: 26px;
  }
}

.pdf-ai-left-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 20px;
}

.pdf-ai-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: rgba(16, 185, 129, 0.15);
  border: 1px solid rgba(16, 185, 129, 0.35);
  color: #34D399;
  padding: 5px 14px;
  border-radius: 9999px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.02em;
  margin-bottom: 12px;
  width: fit-content;
  font-family: var(--pdf-font-body);
}

.pdf-ai-badge svg {
  flex-shrink: 0;
}

.pdf-ai-title {
  font-size: 26px;
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 8px 0;
  line-height: 1.25;
  font-family: var(--pdf-font-heading);
}

.pdf-ai-title .ai-gradient-text {
  background: linear-gradient(90deg, #10B981, #38BDF8);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.pdf-ai-subtitle {
  font-size: 13.5px;
  color: #94A3B8;
  line-height: 1.45;
  margin: 0 0 20px 0;
  font-family: var(--pdf-font-body);
}

.pdf-ai-search-box {
  display: flex;
  align-items: center;
  gap: 10px;
  background: rgba(15, 23, 42, 0.85);
  border: 1.5px solid rgba(16, 185, 129, 0.4);
  border-radius: 12px;
  padding: 6px 8px 6px 14px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25), inset 0 1px 2px rgba(255, 255, 255, 0.05);
  margin-bottom: 14px;
  transition: all 0.25s ease;
}

.pdf-ai-search-box:focus-within {
  border-color: #10B981;
  box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.2), 0 6px 20px rgba(0, 0, 0, 0.35);
}

.pdf-ai-search-input {
  flex: 1;
  background: transparent;
  border: none;
  outline: none;
  color: #FFFFFF;
  font-size: 13.5px;
  font-family: var(--pdf-font-body);
  font-weight: 500;
}

.pdf-ai-search-input::placeholder {
  color: #64748B;
}

.pdf-ai-generate-btn {
  background: linear-gradient(135deg, #10B981 0%, #059669 100%);
  color: #FFFFFF;
  border: none;
  border-radius: 8px;
  padding: 10px 18px;
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: var(--pdf-font-body);
  box-shadow: 0 2px 8px rgba(16, 185, 129, 0.3);
}

.pdf-ai-generate-btn:hover {
  background: linear-gradient(135deg, #059669 0%, #047857 100%);
  transform: translateY(-1px);
}

.pdf-ai-chips-label {
  font-size: 11px;
  font-weight: 700;
  color: #64748B;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 8px;
  font-family: var(--pdf-font-body);
}

.pdf-ai-chips-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin-bottom: 22px;
}

.pdf-ai-chip {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 9999px;
  padding: 5px 12px;
  color: #CBD5E1;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.2s ease;
  user-select: none;
  font-family: var(--pdf-font-body);
}

.pdf-ai-chip:hover, .pdf-ai-chip.active {
  background: rgba(16, 185, 129, 0.2);
  border-color: #10B981;
  color: #34D399;
  transform: translateY(-1px);
}

.pdf-ai-trust-strip {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin-bottom: 22px;
  padding: 12px;
  background: rgba(255, 255, 255, 0.03);
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.06);
}

.pdf-ai-trust-col strong {
  display: block;
  font-size: 14px;
  font-weight: 800;
  color: #38BDF8;
  font-family: var(--pdf-font-heading);
}

.pdf-ai-trust-col span {
  font-size: 11px;
  color: #94A3B8;
  line-height: 1.25;
}

.pdf-ai-actions-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.pdf-btn-ai-primary {
  background: #10B981;
  color: #FFFFFF;
  border: none;
  border-radius: 8px;
  padding: 11px 20px;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--pdf-font-body);
}

.pdf-btn-ai-primary:hover {
  background: #059669;
  transform: translateY(-1px);
}

.pdf-btn-ai-secondary {
  background: rgba(255, 255, 255, 0.08);
  color: #E2E8F0;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 8px;
  padding: 11px 18px;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--pdf-font-body);
}

.pdf-btn-ai-secondary:hover {
  background: rgba(255, 255, 255, 0.14);
}

/* Right Panel: Dynamic Live Roadmap Output */
.pdf-ai-roadmap-display {
  background: rgba(11, 23, 44, 0.88);
  border: 1px solid rgba(56, 189, 248, 0.25);
  border-radius: 16px;
  padding: 22px 22px 18px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
  position: relative;
  overflow: hidden;
  box-sizing: border-box;
}

.pdf-ai-synthesizing-overlay {
  position: absolute;
  inset: 0;
  background: rgba(7, 21, 43, 0.94);
  backdrop-filter: blur(8px);
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 12px;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease;
}

.pdf-ai-synthesizing-overlay.active {
  opacity: 1;
  pointer-events: auto;
}

.pdf-ai-spinner-pulse {
  width: 44px;
  height: 44px;
  border: 3px solid rgba(16, 185, 129, 0.2);
  border-top-color: #10B981;
  border-radius: 50%;
  animation: aiSpin 0.7s linear infinite;
}

@keyframes aiSpin {
  to { transform: rotate(360deg); }
}

.pdf-ai-scan-text {
  font-size: 13px;
  font-weight: 700;
  color: #34D399;
  font-family: var(--pdf-font-heading);
}

.pdf-roadmap-out-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  padding-bottom: 14px;
  margin-bottom: 16px;
}

.pdf-roadmap-status-strip {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 6px;
}

.pdf-roadmap-ai-status {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  font-weight: 700;
  color: #10B981;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-pulse-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #10B981;
  box-shadow: 0 0 8px #10B981;
  animation: pulseDot 1.5s infinite;
}

@keyframes pulseDot {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.4; transform: scale(0.85); }
}

.pdf-roadmap-demand-badge {
  font-size: 11px;
  font-weight: 700;
  color: #F59E0B;
  background: rgba(245, 158, 11, 0.12);
  padding: 3px 9px;
  border-radius: 9999px;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-out-role-title {
  font-size: 20px;
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 10px 0;
  font-family: var(--pdf-font-heading);
}

.pdf-roadmap-quick-metrics {
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
}

.pdf-roadmap-metric-chip {
  background: rgba(255, 255, 255, 0.06);
  border-radius: 6px;
  padding: 4px 10px;
  font-size: 11.5px;
  color: #CBD5E1;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-metric-chip strong {
  color: #38BDF8;
  font-weight: 700;
}

/* Timeline Milestones */
.pdf-roadmap-timeline {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 16px;
}

.pdf-roadmap-timeline::before {
  content: '';
  position: absolute;
  top: 14px;
  bottom: 14px;
  left: 14px;
  width: 2px;
  background: linear-gradient(180deg, #10B981 0%, #38BDF8 50%, #818CF8 100%);
  opacity: 0.4;
}

.pdf-roadmap-step-item {
  position: relative;
  display: flex;
  gap: 14px;
  align-items: flex-start;
}

.pdf-roadmap-step-num {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #0B1F3D;
  border: 2px solid #10B981;
  color: #FFFFFF;
  font-size: 12px;
  font-weight: 800;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  z-index: 2;
  box-shadow: 0 0 10px rgba(16, 185, 129, 0.3);
  font-family: var(--pdf-font-heading);
}

.pdf-roadmap-step-info {
  flex: 1;
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 10px;
  padding: 8px 12px;
  transition: all 0.2s ease;
}

.pdf-roadmap-step-info:hover {
  background: rgba(255, 255, 255, 0.07);
  border-color: rgba(56, 189, 248, 0.3);
}

.pdf-roadmap-step-title-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 3px;
}

.pdf-roadmap-step-title {
  font-size: 12.5px;
  font-weight: 700;
  color: #F8FAFC;
  margin: 0;
  font-family: var(--pdf-font-heading);
}

.pdf-roadmap-step-weeks {
  font-size: 10.5px;
  color: #94A3B8;
  background: rgba(255, 255, 255, 0.06);
  padding: 2px 6px;
  border-radius: 4px;
}

.pdf-roadmap-step-desc {
  font-size: 11px;
  color: #94A3B8;
  line-height: 1.35;
  margin: 0 0 4px 0;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-step-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
}

.pdf-roadmap-tool-tag {
  font-size: 10px;
  font-weight: 600;
  color: #34D399;
  background: rgba(16, 185, 129, 0.12);
  padding: 1px 7px;
  border-radius: 4px;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-out-footer {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  padding-top: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  flex-wrap: wrap;
}

.pdf-roadmap-cta-text {
  font-size: 12px;
  color: #CBD5E1;
  font-family: var(--pdf-font-body);
}

.pdf-roadmap-cta-text strong {
  color: #34D399;
}

.pdf-btn-roadmap-enroll {
  background: #10B981;
  color: #FFFFFF;
  border: none;
  border-radius: 6px;
  padding: 8px 16px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  transition: all 0.2s ease;
  white-space: nowrap;
  font-family: var(--pdf-font-body);
}

.pdf-btn-roadmap-enroll:hover {
  background: #059669;
}

@media (max-width: 640px) {
  .pdf-ai-roadmap-card {
    padding: 20px 16px;
    border-radius: 14px;
  }
  .pdf-ai-search-box {
    flex-direction: column;
    align-items: stretch;
    padding: 10px;
    gap: 8px;
  }
  .pdf-ai-search-input {
    width: 100%;
    padding: 4px 0;
  }
  .pdf-ai-generate-btn {
    width: 100%;
    justify-content: center;
    padding: 10px;
  }
  .pdf-ai-metrics-row {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .pdf-ai-actions-row {
    flex-direction: column;
  }
  .pdf-btn-ai-primary, .pdf-btn-ai-secondary {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  .pdf-roadmap-step-title-row {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .pdf-roadmap-out-footer {
    flex-direction: column;
    align-items: stretch;
    text-align: center;
  }
  .pdf-btn-roadmap-enroll {
    width: 100%;
    justify-content: center;
  }
}

/* ==============================================================================
   4. STATS RIBBON (5 Key Credibility Metrics)
   ============================================================================== */
.pdf-stats-ribbon-section {
  padding: 10px 0 40px;
  background: #FFFFFF;
}

.pdf-stats-ribbon-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 18px 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
}

@media (max-width: 992px) {
  .pdf-stats-ribbon-card {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
  }
}

@media (max-width: 600px) {
  .pdf-stats-ribbon-card {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pdf-stat-cell {
  display: flex;
  align-items: center;
  gap: 14px;
}

.pdf-stat-icon-wrap {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #ECFDF5;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #2563EB;
  flex-shrink: 0;
}

.pdf-stat-num {
  font-size: 21px;
  font-weight: 800;
  color: #0F172A;
  margin: 0;
  line-height: 1.15;
  font-family: var(--pdf-font-heading);
}

.pdf-stat-label {
  font-size: 12.5px;
  color: #64748B;
  margin: 0;
  font-family: var(--pdf-font-body);
}

/* ==============================================================================
   5. STUDENT PLACEMENT SUCCESS STORIES (Exact Image 2 Match)
   ============================================================================== */
.pdf-placement-stories-section {
  padding: 15px 0 50px;
  background: #FFFFFF;
}

.pdf-placement-header-block {
  margin-bottom: 22px;
}

.pdf-placement-accent-bar {
  width: 38px;
  height: 3.5px;
  background: linear-gradient(90deg, #0284C7, #38BDF8);
  border-radius: 9999px;
  margin-bottom: 12px;
}

.pdf-stories-filter-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 14px;
}

.pdf-filter-pills-strip {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.pdf-filter-pill-btn {
  padding: 6px 18px;
  border-radius: 9999px;
  font-size: 13px;
  font-weight: 500;
  border: 1px solid #E2E8F0;
  background: #FFFFFF;
  color: #475569;
  cursor: pointer;
  transition: all 0.2s ease;
  font-family: var(--pdf-font-body);
}

.pdf-filter-pill-btn.active {
  background: #0B2545;
  color: #FFFFFF;
  border-color: #0B2545;
  font-weight: 600;
}

.pdf-filter-pill-btn:hover:not(.active) {
  background: #F8FAFC;
  border-color: #CBD5E1;
  color: #0F172A;
}

.pdf-placement-view-all {
  color: #0284C7;
  font-size: 13.5px;
  font-weight: 600;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: color 0.2s ease;
  font-family: var(--pdf-font-body);
}

.pdf-placement-view-all:hover {
  color: #0369A1;
  text-decoration: underline;
}

.pdf-carousel-wrapper {
  position: relative;
  margin-top: 6px;
}

.pdf-carousel-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #FFFFFF;
  border: 1.5px solid #CBD5E1;
  color: #0284C7;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  z-index: 10;
  transition: all 0.2s ease;
}

.pdf-carousel-arrow svg {
  stroke: #0284C7;
  transition: stroke 0.2s ease;
}

.pdf-carousel-arrow:hover {
  background: #FFFFFF;
  border-color: #0284C7;
  box-shadow: 0 6px 18px rgba(2, 132, 199, 0.2);
  transform: translateY(-50%) scale(1.06);
}

.pdf-carousel-arrow.prev {
  left: -17px;
}

.pdf-carousel-arrow.next {
  right: -17px;
}

.pdf-stories-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 14px;
}

.pdf-story-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 3px 12px rgba(15, 23, 42, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
  cursor: pointer;
  display: flex;
  flex-direction: column;
}

.pdf-story-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.09);
  border-color: #CBD5E1;
}

.pdf-story-img-full {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

@media (max-width: 1200px) {
  .pdf-stories-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .pdf-stories-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .pdf-stories-filter-bar {
    flex-direction: column;
    align-items: flex-start;
  }
}

.pdf-story-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
  transition: all 0.25s ease;
  cursor: pointer;
}

.pdf-story-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.pdf-story-img-full {
  width: 100%;
  height: auto;
  display: block;
}

/* ==============================================================================
   6. AGILE ACTIVITY @ 4ACHIEVERS
   ============================================================================== */
.pdf-agile-section {
  padding: 10px 0 45px;
  background: #FFFFFF;
}

.pdf-agile-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
}

@media (max-width: 1200px) {
  .pdf-agile-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .pdf-agile-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pdf-agile-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
  transition: all 0.25s ease;
  cursor: pointer;
}

.pdf-agile-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}

.pdf-agile-img-full {
  width: 100%;
  height: auto;
  display: block;
}

/* ==============================================================================
   7. SPLIT SECTION (Interview Preparation + Salary Calculator)
   ============================================================================== */
.pdf-split-section {
  padding: 10px 0 45px;
  background: #FFFFFF;
}

.pdf-split-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 992px) {
  .pdf-split-grid {
    grid-template-columns: 1fr;
  }
}

.pdf-white-box-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 16px;
  padding: 26px 26px;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
}

.pdf-box-title {
  font-size: 20px;
  font-weight: 800;
  color: #0F172A;
  margin: 0 0 6px 0;
  font-family: var(--pdf-font-heading);
}

.pdf-box-title small {
  font-size: 13.5px;
  font-weight: 600;
  color: #2563EB;
}

.pdf-box-subtitle {
  font-size: 13.5px;
  color: #64748B;
  margin: 0 0 20px 0;
  font-family: var(--pdf-font-body);
}

/* Interview Prep Layout */
.pdf-interview-prep-content {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  align-items: center;
}

@media (max-width: 600px) {
  .pdf-interview-prep-content {
    grid-template-columns: 1fr;
  }
}

.pdf-interview-video-box {
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 15px rgba(0,0,0,0.08);
}

.pdf-interview-video-box img {
  width: 100%;
  height: auto;
  display: block;
}

.pdf-interview-checklist {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pdf-interview-check-row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 13px;
  font-weight: 600;
  color: #334155;
  font-family: var(--pdf-font-body);
}

.pdf-interview-icon-badge {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: #ECFDF5;
  border: 1px solid #A7F3D0;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #059669;
  flex-shrink: 0;
}

/* Salary Calculator */
.pdf-calc-header-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
}

.pdf-calc-icon-badge {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: #10B981;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  flex-shrink: 0;
}

.pdf-calc-form-row {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}

@media (max-width: 600px) {
  .pdf-calc-form-row {
    grid-template-columns: 1fr;
  }
}

.pdf-calc-field-group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pdf-calc-field-group label {
  font-size: 11.5px;
  font-weight: 700;
  color: #475569;
  font-family: var(--pdf-font-body);
}

.pdf-calc-select {
  padding: 9px 12px;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 600;
  color: #1E293B;
  background: #FFFFFF;
  outline: none;
  font-family: var(--pdf-font-body);
}

.pdf-btn-calc {
  width: 100%;
  padding: 11px;
  background: #10B981;
  color: #FFFFFF;
  border: none;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.2s ease;
  margin-bottom: 16px;
  font-family: var(--pdf-font-body);
}

.pdf-btn-calc:hover {
  background: #059669;
}

.pdf-calc-results-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
}

@media (max-width: 600px) {
  .pdf-calc-results-row {
    grid-template-columns: 1fr;
  }
}

.pdf-calc-range-box {
  background: #F8FAFC;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  padding: 14px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.pdf-calc-range-title {
  font-size: 12px;
  font-weight: 700;
  color: #64748B;
  margin: 0 0 4px 0;
  font-family: var(--pdf-font-body);
}

.pdf-calc-range-num {
  font-size: 20px;
  font-weight: 800;
  color: #059669;
  margin: 0 0 2px 0;
  font-family: var(--pdf-font-heading);
}

.pdf-calc-range-sub {
  font-size: 11px;
  color: #64748B;
  margin: 0;
  font-family: var(--pdf-font-body);
}

.pdf-calc-chart-box {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  padding: 12px 14px;
}

.pdf-chart-title {
  font-size: 12px;
  font-weight: 700;
  color: #0F172A;
  margin: 0 0 10px 0;
  font-family: var(--pdf-font-body);
}

.pdf-chart-bars-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  height: 65px;
  gap: 8px;
}

.pdf-chart-bar-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  flex: 1;
}

.pdf-bar-val-text {
  font-size: 10.5px;
  font-weight: 700;
  color: #0F172A;
}

.pdf-bar-pillar {
  width: 100%;
  background: linear-gradient(180deg, #3B82F6 0%, #1D4ED8 100%);
  border-radius: 4px 4px 0 0;
  transition: height 0.3s ease;
}

.pdf-bar-exp-text {
  font-size: 9.5px;
  color: #64748B;
  font-weight: 600;
  white-space: nowrap;
}

/* ==============================================================================
   8. UPCOMING BATCHES & OUR LEARNERS WORK AT
   ============================================================================== */
.pdf-batches-section {
  padding: 10px 0 45px;
  background: #FFFFFF;
}

.pdf-batches-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}

@media (max-width: 992px) {
  .pdf-batches-grid {
    grid-template-columns: 1fr;
  }
}

.pdf-batches-card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.pdf-batches-title-row {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pdf-batches-title-row h3 {
  font-size: 20px;
  font-weight: 800;
  color: #0F172A;
  margin: 0;
  font-family: var(--pdf-font-heading);
}

.pdf-batches-table-box {
  width: 100%;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  overflow: hidden;
}

.pdf-batches-table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--pdf-font-body);
}

.pdf-batches-table th {
  background: #EDF2F7;
  color: #1E293B;
  font-size: 12.5px;
  font-weight: 700;
  padding: 10px 12px;
  text-align: left;
  border-bottom: 1px solid #CBD5E1;
}

.pdf-batches-table td {
  padding: 11px 12px;
  font-size: 12.5px;
  color: #334155;
  border-bottom: 1px solid #F1F5F9;
}

.pdf-batches-table tr:last-child td {
  border-bottom: none;
}

.pdf-seat-badge-green {
  background: #10B981;
  color: #FFFFFF;
  padding: 3px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 700;
  display: inline-block;
}

.pdf-seat-badge-orange {
  background: #F59E0B;
  color: #FFFFFF;
  padding: 3px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 700;
  display: inline-block;
}

/* Our Learners Work At Logo Grid */
.pdf-partners-logo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

@media (max-width: 600px) {
  .pdf-partners-logo-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.pdf-partner-logo-item {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 10px;
  height: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 6px 12px;
  box-shadow: 0 2px 6px rgba(15, 23, 42, 0.02);
  transition: all 0.2s ease;
}

.pdf-partner-logo-item:hover {
  border-color: #CBD5E1;
  box-shadow: 0 4px 12px rgba(15, 23, 42, 0.06);
}

.pdf-brand-txt {
  font-weight: 800;
  font-size: 14.5px;
  font-family: var(--pdf-font-heading);
}

/* ==============================================================================
   9. WHY CHOOSE 4ACHIEVERS (7 Modern Cards)
   ============================================================================== */
.pdf-why-section {
  padding: 10px 0 45px;
  background: #FFFFFF;
}

.pdf-why-cards-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 14px;
}

@media (max-width: 1200px) {
  .pdf-why-cards-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (max-width: 768px) {
  .pdf-why-cards-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pdf-why-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 14px;
  padding: 22px 14px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 4px 15px rgba(15, 23, 42, 0.03);
  transition: all 0.25s ease;
}

.pdf-why-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.pdf-why-icon-box {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 14px;
  border: 1px solid rgba(0,0,0,0.06);
}

.pdf-why-card-title {
  font-size: 14px;
  font-weight: 800;
  color: #0F172A;
  margin: 0 0 6px 0;
  line-height: 1.25;
  font-family: var(--pdf-font-heading);
}

.pdf-why-card-desc {
  font-size: 11.5px;
  color: #64748B;
  margin: 0;
  line-height: 1.35;
  font-family: var(--pdf-font-body);
}

/* ==============================================================================
   10. LATEST BLOGS & LEARNER TESTIMONIALS
   ============================================================================== */
.pdf-blogs-testimonials-section {
  padding: 10px 0 45px;
  background: #FFFFFF;
}

.pdf-blogs-testimonials-grid {
  display: grid;
  grid-template-columns: 1.55fr 0.85fr;
  gap: 24px;
}

@media (max-width: 992px) {
  .pdf-blogs-testimonials-grid {
    grid-template-columns: 1fr;
  }
}

.pdf-blogs-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
}

@media (max-width: 768px) {
  .pdf-blogs-row {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pdf-blog-item-card {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.03);
  transition: all 0.25s ease;
  display: flex;
  flex-direction: column;
}

.pdf-blog-item-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
}

.pdf-blog-thumb-img {
  width: 100%;
  height: auto;
  display: block;
}

.pdf-blog-details {
  padding: 10px 12px 12px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}

.pdf-blog-heading {
  font-size: 12.5px;
  font-weight: 700;
  color: #0F172A;
  margin: 0 0 8px 0;
  line-height: 1.3;
  font-family: var(--pdf-font-heading);
}

.pdf-blog-date {
  font-size: 11px;
  color: #3B82F6;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 4px;
  font-family: var(--pdf-font-body);
}

/* Learner Testimonials Card */
.pdf-testimonial-box {
  background: #FFFFFF;
  border: 1px solid #E2E8F0;
  border-radius: 14px;
  padding: 24px;
  box-shadow: 0 4px 18px rgba(15, 23, 42, 0.04);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.pdf-testi-quote-mark {
  font-size: 32px;
  color: #0F172A;
  line-height: 1;
  font-family: serif;
  margin-bottom: 6px;
}

.pdf-testi-quote-text {
  font-size: 13.5px;
  font-style: italic;
  color: #334155;
  line-height: 1.5;
  margin: 0 0 20px 0;
  font-family: var(--pdf-font-body);
}

.pdf-testi-author-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-top: 1px solid #F1F5F9;
  padding-top: 14px;
}

.pdf-testi-author-left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.pdf-testi-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 1.5px solid #059669;
}

.pdf-testi-name {
  font-size: 14px;
  font-weight: 800;
  color: #0F172A;
  margin: 0;
  font-family: var(--pdf-font-heading);
}

.pdf-testi-role {
  font-size: 12px;
  color: #64748B;
  margin: 0;
  font-family: var(--pdf-font-body);
}

.pdf-testi-brand-wrap {
  text-align: right;
}

.pdf-testi-tcs-logo {
  font-weight: 900;
  color: #E11D48;
  font-size: 18px;
  letter-spacing: -0.02em;
}

.pdf-testi-stars {
  color: #F59E0B;
  font-size: 13px;
  letter-spacing: 2px;
}

/* ==============================================================================
   11. BOTTOM CTA BANNER (Ready to Build Your Career? - Handcrafted 3D Suite)
   ============================================================================== */
.career-section {
  width: 100%;
  padding: 35px 20px;
  background:
    radial-gradient(
      circle at 50% 0%,
      rgba(0, 212, 255, 0.06),
      transparent 35%
    ),
    #ffffff;
}

.career-card {
  width: min(1220px, 100%);
  min-height: 430px;
  margin: auto;
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1.45fr 1fr 1.1fr;
  align-items: center;
  gap: 25px;
  padding: 45px 40px;
  border-radius: 24px;
  background:
    radial-gradient(
      circle at 62% 50%,
      rgba(0, 191, 255, 0.10),
      transparent 27%
    ),
    linear-gradient(
      135deg,
      #07152c 0%,
      #091a36 55%,
      #07152d 100%
    );
  box-shadow:
    0 24px 70px rgba(7, 21, 44, 0.20),
    inset 0 1px 0 rgba(255, 255, 255, 0.05);
  isolation: isolate;
  box-sizing: border-box;
}

.career-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      135deg,
      transparent 0%,
      rgba(255,255,255,0.025) 48%,
      transparent 49%
    ),
    linear-gradient(
      25deg,
      transparent 0%,
      rgba(0, 217, 255, 0.035) 46%,
      transparent 47%
    );
  pointer-events: none;
  z-index: -2;
}

.career-card::after {
  content: "";
  position: absolute;
  width: 340px;
  height: 340px;
  right: 30%;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(0, 200, 255, 0.10),
      transparent 68%
    );
  filter: blur(8px);
  pointer-events: none;
  z-index: -1;
}

.career-content {
  position: relative;
  z-index: 2;
}

.career-kicker {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  margin-bottom: 16px;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #aac1dc;
}

.career-kicker::before {
  content: "";
  width: 29px;
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(
    90deg,
    #10e7c7,
    #00b7ff
  );
}

.career-title {
  max-width: 590px;
  font-size: clamp(34px, 3.8vw, 54px);
  line-height: 1.02;
  letter-spacing: -0.045em;
  font-weight: 800;
  color: #ffffff;
  margin: 0;
}

.career-title span {
  color: #12d8c4;
  position: relative;
}

.career-title span::after {
  content: "";
  position: absolute;
  left: 3px;
  right: 8px;
  bottom: -7px;
  height: 5px;
  border-radius: 50%;
  background: #f4b52f;
  transform: rotate(-2deg);
  opacity: 0.95;
}

.career-description {
  max-width: 590px;
  margin-top: 20px;
  color: #aabed7;
  font-size: 15.5px;
  line-height: 1.6;
}

.career-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 28px;
}

.career-btn {
  min-height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0 24px;
  border-radius: 10px;
  text-decoration: none;
  font-size: 15px;
  font-weight: 750;
  cursor: pointer;
  border: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease,
    background 0.25s ease;
}

.career-btn-primary {
  min-width: 250px;
  color: #ffffff;
  background:
    linear-gradient(
      135deg,
      #10e3c1,
      #08bea9
    );
  box-shadow:
    0 12px 28px rgba(9, 217, 183, 0.22);
}

.career-btn-primary:hover {
  transform: translateY(-2px);
  box-shadow:
    0 17px 35px rgba(9, 217, 183, 0.30);
  color: #ffffff;
}

.career-btn-secondary {
  color: #eaf4ff;
  border: 1px solid rgba(185, 208, 234, 0.44);
  background: rgba(255,255,255,0.03);
  min-width: 175px;
}

.career-btn-secondary:hover {
  transform: translateY(-2px);
  background: rgba(255,255,255,0.08);
  color: #ffffff;
}

/* CENTER ILLUSTRATION */
.career-art {
  height: 340px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}

.art-floor {
  position: absolute;
  width: 285px;
  height: 92px;
  left: 50%;
  bottom: 34px;
  transform:
    translateX(-50%)
    rotateX(62deg)
    rotateZ(-2deg);
  border-radius: 18px;
  background:
    linear-gradient(
      135deg,
      #0a2443,
      #0e3960
    );
  border:
    1px solid rgba(0, 203, 255, 0.40);
  box-shadow:
    0 22px 35px rgba(0,0,0,0.28),
    inset 0 1px 0 rgba(255,255,255,0.07);
}

.art-floor::before {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: 13px;
  border:
    1px solid rgba(0, 197, 255, 0.33);
}

.art-floor::after {
  content: "";
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: -10px;
  height: 14px;
  border-radius: 0 0 14px 14px;
  background:
    linear-gradient(
      90deg,
      #008cff,
      #12d9cf 58%,
      #f7b92d
    );
  box-shadow:
    0 5px 15px rgba(0, 195, 255, 0.24);
}

.books {
  position: absolute;
  bottom: 91px;
  width: 220px;
  height: 150px;
  left: 50%;
  transform: translateX(-50%);
}

.book {
  position: absolute;
  left: 50%;
  width: 210px;
  height: 44px;
  transform: translateX(-50%);
  border-radius: 8px 12px 9px 8px;
  display: flex;
  align-items: center;
  padding-left: 25px;
  font-size: 15px;
  font-weight: 850;
  letter-spacing: 0.04em;
  box-shadow:
    0 9px 16px rgba(0,0,0,0.22),
    inset 0 1px 0 rgba(255,255,255,0.10);
  box-sizing: border-box;
}

.book-1 {
  bottom: 0;
  color: #052a2b;
  background:
    linear-gradient(
      135deg,
      #14e0c1,
      #09bda9
    );
}

.book-2 {
  bottom: 41px;
  color: #213249;
  background:
    linear-gradient(
      135deg,
      #f6f8fb,
      #dce4ef
    );
}

.book-3 {
  bottom: 82px;
  color: #ffffff;
  background:
    linear-gradient(
      135deg,
      #159be7,
      #0872c9
    );
}

.book::after {
  content: "";
  position: absolute;
  right: 14px;
  width: 26px;
  height: 20px;
  opacity: 0.24;
  background:
    repeating-linear-gradient(
      to bottom,
      currentColor 0 2px,
      transparent 2px 6px
    );
}

.cap {
  position: absolute;
  left: 50%;
  top: 64px;
  width: 142px;
  height: 75px;
  transform: translateX(-50%);
}

.cap-top {
  position: absolute;
  width: 135px;
  height: 62px;
  left: 4px;
  top: 0;
  transform:
    rotateX(55deg)
    rotateZ(-2deg);
  border-radius: 8px;
  background:
    linear-gradient(
      135deg,
      #183a68,
      #0a1b38
    );
  border:
    1px solid rgba(148, 192, 245, 0.24);
  box-shadow:
    0 12px 22px rgba(0,0,0,0.26);
}

.cap-top::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 10px;
  height: 10px;
  transform: translate(-50%,-50%);
  border-radius: 50%;
  background: #f5b82f;
  box-shadow:
    0 0 12px rgba(245,184,47,0.5);
}

.cap-base {
  position: absolute;
  width: 88px;
  height: 32px;
  left: 28px;
  top: 42px;
  border-radius: 0 0 45px 45px;
  background:
    linear-gradient(
      180deg,
      #193961,
      #091a36
    );
  box-shadow:
    0 10px 15px rgba(0,0,0,0.26);
}

.tassel {
  position: absolute;
  width: 74px;
  height: 90px;
  right: -5px;
  top: 8px;
}

.tassel-line {
  position: absolute;
  width: 2px;
  height: 61px;
  left: 10px;
  top: 8px;
  background: #f8bd31;
  transform: rotate(-5deg);
}

.tassel-ball {
  position: absolute;
  width: 10px;
  height: 10px;
  left: 6px;
  top: 62px;
  border-radius: 50%;
  background: #f8bd31;
  box-shadow:
    0 0 10px rgba(248,189,49,0.5);
}

.tassel-fringe {
  position: absolute;
  left: 0;
  top: 71px;
  width: 20px;
  height: 15px;
  border-radius: 0 0 8px 8px;
  background:
    repeating-linear-gradient(
      90deg,
      #f5b72e 0 3px,
      transparent 3px 5px
    );
}

.floating-card {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  background:
    rgba(15, 46, 78, 0.84);
  border:
    1px solid rgba(110, 194, 255, 0.28);
  box-shadow:
    0 13px 25px rgba(0,0,0,0.18);
  backdrop-filter: blur(8px);
}

.chart-card {
  left: 4px;
  top: 75px;
  width: 98px;
  height: 102px;
}

.chart-bars {
  width: 63px;
  height: 55px;
  display: flex;
  align-items: flex-end;
  gap: 7px;
}

.chart-bars span {
  flex: 1;
  border-radius: 4px 4px 2px 2px;
  background:
    linear-gradient(
      to top,
      #07bde9,
      #12e0cc
    );
}

.chart-bars span:nth-child(1) { height: 32%; }
.chart-bars span:nth-child(2) { height: 51%; }
.chart-bars span:nth-child(3) { height: 73%; }
.chart-bars span:nth-child(4) { height: 95%; }

.message-card {
  right: 18px;
  top: 39px;
  width: 82px;
  height: 60px;
}

.message-dots {
  display: flex;
  gap: 6px;
}

.message-dots span {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #7bdfff;
}

.check-card {
  right: 2px;
  bottom: 123px;
  width: 82px;
  height: 116px;
  align-items: flex-start;
  padding-top: 17px;
}

.check-lines {
  width: 44px;
}

.check-row {
  height: 17px;
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 9px;
}

.check-circle {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  border-radius: 50%;
  background: #0fd0ae;
}

.check-line {
  width: 26px;
  height: 4px;
  border-radius: 99px;
  background: rgba(190, 219, 245, 0.45);
}

.growth-arrow {
  position: absolute;
  width: 125px;
  height: 95px;
  left: 62px;
  top: 30px;
  border-top: 5px solid #14dbbf;
  border-right: 5px solid #14dbbf;
  transform:
    rotate(-15deg)
    skewX(-15deg);
  border-radius: 7px;
  opacity: 0.75;
}

.growth-arrow::after {
  content: "";
  position: absolute;
  width: 0;
  height: 0;
  right: -9px;
  top: -12px;
  border-left: 14px solid #14dbbf;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  transform: rotate(15deg);
}

.career-benefits {
  width: 100%;
  max-width: 430px;
  justify-self: end;
}

.benefit-item {
  display: grid;
  grid-template-columns: 54px 1fr;
  align-items: center;
  gap: 15px;
  padding: 14px 0;
  position: relative;
}

.benefit-item + .benefit-item {
  border-top:
    1px solid rgba(182, 209, 240, 0.16);
}

.benefit-icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 13px;
  border:
    1px solid rgba(255,255,255,0.12);
  box-shadow:
    0 7px 18px rgba(0,0,0,0.15);
  position: relative;
  overflow: hidden;
}

.benefit-icon::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    linear-gradient(
      140deg,
      rgba(255,255,255,0.17),
      transparent 45%
    );
}

.icon-green {
  background:
    linear-gradient(
      135deg,
      #09d8b9,
      #0aaf95
    );
}

.icon-blue {
  background:
    linear-gradient(
      135deg,
      #10baf3,
      #087dca
    );
}

.icon-gold {
  background:
    linear-gradient(
      135deg,
      #ffcc3e,
      #dfa400
    );
}

.icon-purple {
  background:
    linear-gradient(
      135deg,
      #aa63ff,
      #7044db
    );
}

.benefit-icon svg {
  width: 25px;
  height: 25px;
  position: relative;
  z-index: 1;
}

.benefit-title {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.25;
  color: #ffffff;
}

.benefit-text {
  margin-top: 5px;
  font-size: 13px;
  line-height: 1.45;
  color: #9eb5cf;
}

/* RESPONSIVE */
@media (max-width: 1050px) {
  .career-card {
    grid-template-columns: 1.2fr 0.8fr;
    padding: 38px 30px;
  }
  .career-benefits {
    grid-column: 1 / -1;
    max-width: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 25px;
  }
  .benefit-item:nth-child(3) {
    border-top:
      1px solid rgba(182, 209, 240, 0.16);
  }
}

@media (max-width: 760px) {
  .career-section {
    padding: 20px 12px;
  }
  .career-card {
    grid-template-columns: 1fr;
    gap: 30px;
    padding: 32px 24px;
    border-radius: 20px;
  }
  .career-title {
    max-width: 500px;
    font-size: 38px;
  }
  .career-description {
    font-size: 15px;
  }
  .career-art {
    height: 310px;
    order: 2;
  }
  .career-benefits {
    order: 3;
    display: block;
  }
  .career-actions {
    flex-direction: column;
    align-items: stretch;
  }
  .career-btn-primary,
  .career-btn-secondary {
    width: 100%;
  }
  .benefit-item {
    grid-template-columns: 50px 1fr;
  }
}

@media (max-width: 440px) {
  .career-card {
    padding: 28px 18px;
  }
  .career-title {
    font-size: 32px;
  }
  .career-description {
    font-size: 14px;
  }
  .chart-card {
    left: -4px;
  }
  .message-card {
    right: -7px;
  }
  .check-card {
    right: -9px;
  }
  .books {
    transform: translateX(-50%) scale(0.88);
  }
  .cap {
    transform:
      translateX(-50%)
      scale(0.88);
  }
}

/* ==============================================================================
   12. MASTER SITE FOOTER & FLOATING WHATSAPP
   ============================================================================== */
.pdf-site-footer-exact {
  background: #050F1E;
  color: #94A3B8;
  padding: 50px 0 25px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  font-family: var(--pdf-font-body);
}

.pdf-footer-cols-grid {
  display: grid;
  grid-template-columns: 1.3fr 1fr 1fr 1fr 1fr 1.2fr;
  gap: 28px;
  margin-bottom: 40px;
}

@media (max-width: 1100px) {
  .pdf-footer-cols-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 28px;
  }
}

@media (max-width: 640px) {
  .pdf-footer-cols-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

.pdf-footer-brand-wrap {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.pdf-footer-logo-row {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.pdf-footer-logo-main {
  font-size: 24px;
  font-weight: 900;
  color: #2563EB;
  letter-spacing: -0.01em;
  font-family: var(--pdf-font-heading);
}

.pdf-footer-logo-main span {
  color: #10B981;
}

.pdf-footer-logo-tagline {
  font-size: 10px;
  color: #64748B;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.pdf-footer-social-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}

.pdf-social-circle-link {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #CBD5E1;
  text-decoration: none;
  font-size: 13px;
  transition: all 0.2s ease;
}

.pdf-social-circle-link:hover {
  background: rgba(255, 255, 255, 0.12);
  color: #FFFFFF;
  border-color: #FFFFFF;
}

.pdf-footer-heading {
  font-size: 14px;
  font-weight: 800;
  color: #FFFFFF;
  margin: 0 0 14px 0;
  font-family: var(--pdf-font-heading);
}

.pdf-footer-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.pdf-footer-link {
  font-size: 13px;
  color: #94A3B8;
  text-decoration: none;
  transition: all 0.2s ease;
}

.pdf-footer-link:hover {
  color: #FFFFFF;
  padding-left: 2px;
}

.pdf-footer-contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pdf-footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  font-size: 13px;
  color: #94A3B8;
  line-height: 1.4;
}

.pdf-footer-contact-item svg {
  color: #10B981;
  flex-shrink: 0;
  margin-top: 2px;
}

.pdf-footer-contact-item a {
  color: #94A3B8;
  text-decoration: none;
}

.pdf-footer-contact-item a:hover {
  color: #FFFFFF;
}

.pdf-footer-bottom-bar {
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  padding-top: 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 12.5px;
  color: #64748B;
}

.pdf-footer-bottom-links {
  display: flex;
  align-items: center;
  gap: 14px;
}

.pdf-footer-bottom-links a {
  color: #64748B;
  text-decoration: none;
}

.pdf-footer-bottom-links a:hover {
  color: #CBD5E1;
}

/* Floating WhatsApp Button */
.pdf-floating-whatsapp-btn {
  position: fixed;
  bottom: 24px;
  right: 24px;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: #25D366;
  color: #FFFFFF;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px rgba(37, 211, 102, 0.4);
  z-index: 999;
  cursor: pointer;
  transition: all 0.25s ease;
  text-decoration: none;
}

.pdf-floating-whatsapp-btn:hover {
  transform: scale(1.08) translateY(-3px);
  box-shadow: 0 12px 30px rgba(37, 211, 102, 0.55);
}

/* ==============================================================================
   LAUNCHPAD PRO (Exact 2nd Image Match)
   ============================================================================== */
.pdf-course-launchpad-section {
  padding: 24px 0 45px;
  background: #FFFFFF;
}

.pdf-launchpad-banner-card {
  background: #001733;
  border: 1px solid rgba(80, 160, 220, 0.22);
  border-radius: 20px;
  padding: 30px 32px;
  color: #FFFFFF;
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) 250px 315px;
  gap: 24px;
  align-items: stretch;
  box-shadow: 0 16px 42px rgba(0, 18, 42, 0.38);
  box-sizing: border-box;
}

@media (max-width: 1120px) {
  .pdf-launchpad-banner-card {
    grid-template-columns: 1fr;
    padding: 26px 20px;
    gap: 22px;
  }
}

.pdf-launchpad-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 5px 13px;
  background: rgba(0, 36, 68, 0.85);
  border: 1px solid rgba(0, 194, 136, 0.45);
  border-radius: 20px;
  margin-bottom: 12px;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: #ffffff;
  width: fit-content;
  line-height: 1;
}

.pdf-launchpad-pill .lp-rocket-icon {
  width: 14px;
  height: 14px;
  color: #00c288;
  flex-shrink: 0;
}

.pdf-launchpad-pill .text-green,
.pdf-launchpad-h2 .text-green,
.pdf-launchpad-card-h3 .text-green {
  color: #00c288;
}

.pdf-launchpad-h2 {
  font-size: 23px;
  font-weight: 800;
  line-height: 1.25;
  color: #FFFFFF;
  margin: 0 0 8px 0;
  letter-spacing: -0.02em;
}

.pdf-launchpad-tagline {
  font-size: 12.5px;
  color: #8fa5b8;
  line-height: 1.45;
  margin: 0 0 18px 0;
}

.pdf-launchpad-feature-boxes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
  margin-bottom: 20px;
}

@media (max-width: 600px) {
  .pdf-launchpad-feature-boxes {
    grid-template-columns: repeat(2, 1fr);
  }
}

.pdf-lp-box {
  background: rgba(0, 26, 54, 0.65);
  border: 1px solid rgba(56, 189, 248, 0.22);
  border-radius: 9px;
  padding: 10px 10px 8px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  min-height: 66px;
  box-sizing: border-box;
  transition: all 0.2s ease;
}

.pdf-lp-box:hover {
  border-color: rgba(56, 189, 248, 0.5);
  background: rgba(0, 36, 75, 0.8);
  transform: translateY(-2px);
}

.pdf-lp-icon {
  margin-bottom: 6px;
  display: flex;
  align-items: center;
  color: #38bdf8;
}

.pdf-lp-box-title {
  font-size: 11px;
  font-weight: 600;
  color: #f1f5f9;
  line-height: 1.25;
}

.lp-green-dash {
  display: block;
  width: 15px;
  height: 2px;
  background: #00c288;
  border-radius: 2px;
  margin-top: 5px;
}

.pdf-launchpad-actions {
  display: flex;
  gap: 12px;
  align-items: center;
}

@media (max-width: 600px) {
  .pdf-launchpad-actions {
    flex-direction: column;
    align-items: stretch;
  }
}

.pdf-btn-launchpad-green {
  background: #00c288;
  color: #FFFFFF;
  border: none;
  border-radius: 25px;
  padding: 11px 22px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: 0 6px 18px rgba(0, 194, 136, 0.32);
  transition: all 0.2s ease;
}

.pdf-btn-launchpad-green:hover {
  background: #00a875;
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0, 194, 136, 0.45);
  color: #FFFFFF;
}

.pdf-btn-launchpad-outline {
  background: rgba(0, 24, 52, 0.65);
  color: #FFFFFF;
  border: 1px solid rgba(80, 160, 220, 0.4);
  border-radius: 25px;
  padding: 11px 22px;
  font-size: 13px;
  font-weight: 700;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  transition: all 0.2s ease;
}

.pdf-btn-launchpad-outline:hover {
  border-color: #38bdf8;
  background: rgba(0, 38, 80, 0.85);
  color: #38bdf8;
  transform: translateY(-2px);
}

.pdf-launchpad-photo-col {
  display: flex;
  align-items: stretch;
  justify-content: center;
}

.pdf-lp-photo-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 280px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
}

@media (max-width: 1120px) {
  .pdf-lp-photo-wrap {
    max-width: 320px;
    height: 260px;
    margin: 0 auto;
  }
}

.pdf-launchpad-man-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.pdf-launchpad-white-card {
  background: #FFFFFF;
  border-radius: 18px;
  padding: 24px 20px 18px 20px;
  color: #07152B;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  box-sizing: border-box;
}

.pdf-launchpad-card-h3 {
  font-size: 18.5px;
  font-weight: 800;
  color: #07152B;
  margin: 0 0 6px 0;
  line-height: 1.28;
  letter-spacing: -0.02em;
}

.pdf-launchpad-card-sub {
  font-size: 11.5px;
  color: #64748B;
  line-height: 1.4;
  margin: 0 0 14px 0;
}

.pdf-launchpad-check-list {
  list-style: none;
  padding: 0;
  margin: 0 0 14px 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}

.pdf-launchpad-check-row {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 11.5px;
  font-weight: 600;
  color: #1e293b;
}

.lp-check-circle {
  width: 17px;
  height: 17px;
  border-radius: 50%;
  background: #00c288;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #FFFFFF;
  flex-shrink: 0;
}

.pdf-lp-learner-badge {
  background: #eefaf6;
  border-radius: 9px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: auto;
}

.lp-mentor-icon {
  color: #00c288;
  flex-shrink: 0;
}

.lp-badge-divider {
  width: 1px;
  height: 15px;
  background: #bbf0de;
}

.lp-badge-text {
  font-size: 11px;
  font-weight: 700;
  color: #064e3b;
}



/* ==============================================================================
   EXACT IMAGE 2 REPLICATION: BLOGS & RESOURCES + LEARNER TESTIMONIALS
   ============================================================================== */

.exact-blogs-section {
  padding: 56px 0 48px;
  background: #ffffff;
  position: relative;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
}

.exact-blogs-top-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  margin-bottom: 32px;
  gap: 20px;
}

.exact-section-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: #dcfce7;
  color: #065f46;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 5px 12px;
  border-radius: 9999px;
  margin-bottom: 12px;
  text-transform: uppercase;
}

.exact-section-badge.center-badge {
  margin: 0 auto 12px;
}

.exact-blogs-h2 {
  font-size: 32px;
  font-weight: 800;
  color: #06392c;
  line-height: 1.2;
  margin: 0 0 8px;
  letter-spacing: -0.02em;
}

.exact-blogs-h2 .text-green,
.exact-testi-h2 .text-green {
  color: #009966;
}

.exact-blogs-sub {
  font-size: 14.5px;
  color: #64748b;
  margin: 0;
  line-height: 1.5;
  max-width: 620px;
}

.exact-btn-view-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 8px 18px;
  background: #f0fdf9;
  border: 1px solid #a7f3d0;
  color: #065f46;
  font-size: 13px;
  font-weight: 600;
  border-radius: 9999px;
  text-decoration: none;
  transition: all 0.2s ease;
  white-space: nowrap;
  flex-shrink: 0;
}

.exact-btn-view-all:hover {
  background: #009966;
  color: #ffffff;
  border-color: #009966;
  transform: translateX(3px);
}

/* 4-Card Grid */
.exact-blogs-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.exact-blog-card {
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.exact-blog-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 50, 30, 0.09);
  border-color: #a7f3d0;
}

.exact-blog-img-wrap {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #0b1a20;
  overflow: hidden;
}

.exact-blog-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.exact-blog-card:hover .exact-blog-img {
  transform: scale(1.04);
}

.exact-blog-tag {
  position: absolute;
  top: 10px;
  left: 10px;
  background: rgba(8, 28, 24, 0.85);
  backdrop-filter: blur(4px);
  color: #ffffff;
  font-size: 10.5px;
  font-weight: 600;
  padding: 4px 9px;
  border-radius: 9999px;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.25);
  z-index: 2;
}

.exact-blog-body {
  padding: 16px 16px 14px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.exact-blog-title {
  font-size: 14.5px;
  font-weight: 700;
  color: #0a2920;
  line-height: 1.35;
  margin: 0 0 8px;
  min-height: 38px;
}

.exact-blog-desc {
  font-size: 12px;
  color: #64748b;
  line-height: 1.48;
  margin: 0 0 14px;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.exact-blog-footer {
  border-top: 1px solid #f1f5f9;
  padding-top: 10px;
  margin-top: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.exact-blog-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: #64748b;
}

.exact-blog-meta span {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.exact-blog-arrow-btn {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #e6f9f0;
  color: #065f46;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  text-decoration: none;
  font-weight: 700;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.exact-blog-arrow-btn:hover {
  background: #009966;
  color: #ffffff;
  transform: translateX(2px);
}

/* ==============================================================================
   LEARNER TESTIMONIALS (Exact Mint Gradient Section)
   ============================================================================== */

.exact-testimonials-section {
  padding: 56px 0 64px;
  background: linear-gradient(180deg, #f0fdf9 0%, #e6f7f2 100%);
  position: relative;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  overflow: hidden;
}

/* Optional subtle dot decoration on corners matching image */
.exact-testimonials-section::before {
  content: '';
  position: absolute;
  top: 15px;
  left: 20px;
  width: 90px;
  height: 90px;
  background-image: radial-gradient(#a7f3d0 1.5px, transparent 1.5px);
  background-size: 12px 12px;
  opacity: 0.6;
  pointer-events: none;
}

.exact-testimonials-section::after {
  content: '';
  position: absolute;
  top: 20px;
  right: 25px;
  width: 90px;
  height: 90px;
  background-image: radial-gradient(#a7f3d0 1.5px, transparent 1.5px);
  background-size: 12px 12px;
  opacity: 0.6;
  pointer-events: none;
}

.exact-testi-top-center {
  text-align: center;
  max-width: 650px;
  margin: 0 auto 36px;
  position: relative;
  z-index: 1;
}

.exact-testi-h2 {
  font-size: 32px;
  font-weight: 800;
  color: #06392c;
  line-height: 1.2;
  margin: 0 0 8px;
  letter-spacing: -0.02em;
}

.exact-testi-sub {
  font-size: 14.5px;
  color: #475569;
  margin: 0;
  line-height: 1.5;
}

/* 3 Testimonials Grid */
.exact-testi-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 22px;
  position: relative;
  z-index: 1;
}

.exact-testi-card {
  background: #ffffff;
  border: 1px solid rgba(16, 185, 129, 0.16);
  border-radius: 16px;
  padding: 22px 20px 22px;
  box-shadow: 0 4px 18px rgba(0, 60, 40, 0.04);
  transition: transform 0.25s ease, box-shadow 0.25s ease;
  display: flex;
  flex-direction: column;
}

.exact-testi-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 28px rgba(0, 60, 40, 0.08);
}

.exact-testi-card-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.exact-testi-user {
  display: flex;
  align-items: center;
  gap: 12px;
}

.exact-testi-avatar {
  width: 44px;
  height: 44px;
  border-radius: 50%;
  object-fit: cover;
  border: 2px solid #10b981;
  background: #e6f9f0;
  flex-shrink: 0;
}

.exact-testi-name {
  font-size: 14px;
  font-weight: 700;
  color: #06392c;
  margin: 0 0 2px;
}

.exact-testi-role {
  font-size: 11.5px;
  color: #64748b;
  margin: 0;
}

.exact-testi-stars {
  color: #f59e0b;
  font-size: 13px;
  letter-spacing: 1.5px;
  flex-shrink: 0;
}

.exact-testi-quote-wrap {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.exact-quote-icon {
  color: #10b981;
  flex-shrink: 0;
  margin-top: 1px;
}

.exact-testi-quote {
  font-size: 12.5px;
  line-height: 1.62;
  color: #334155;
  margin: 0;
  font-style: normal;
}

/* Responsive */
@media (max-width: 1024px) {
  .exact-blogs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .exact-testi-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .exact-blogs-grid {
    grid-template-columns: 1fr;
  }
  .exact-blogs-top-row {
    flex-direction: column;
    align-items: flex-start;
  }
  .exact-blogs-h2,
  .exact-testi-h2 {
    font-size: 26px;
  }
}




/* ==============================================================================
   IMAGE 2 EXACT FOOTER: CYBER BLUE GLOW AESTHETIC
   ============================================================================== */
.footer-exact-img2 {
  position: relative;
  background: radial-gradient(circle at 15% 0%, rgba(0, 140, 255, 0.22) 0%, transparent 45%),
              radial-gradient(circle at 85% 0%, rgba(0, 90, 220, 0.2) 0%, transparent 45%),
              #010c1c;
  background-image: radial-gradient(rgba(0, 180, 255, 0.12) 1.2px, transparent 1.2px);
  background-size: 20px 20px;
  color: #94a3b8;
  padding: 44px 0 0 0;
  border-top: 1.5px solid #00d2ff;
  box-shadow: 0 -4px 25px rgba(0, 210, 255, 0.45);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  overflow: hidden;
}

.footer-exact-container {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 24px;
}

.footer-exact-grid {
  display: grid;
  grid-template-columns: 1.3fr 1.05fr 1fr 1.05fr 1fr 1.2fr;
  gap: 24px;
  padding-bottom: 36px;
}

@media (max-width: 1200px) {
  .footer-exact-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 32px 24px;
  }
}

@media (max-width: 768px) {
  .footer-exact-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* Col 1: Brand */
.footer-exact-brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-exact-logo-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.footer-logo-tagline {
  font-size: 11.5px;
  font-weight: 600;
  color: #7dd3fc;
  letter-spacing: 1.5px;
  margin-top: 4px;
}

.footer-social-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}

.footer-social-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(0, 180, 216, 0.45);
  background: rgba(2, 24, 48, 0.7);
  color: #38bdf8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: all 0.22s ease;
}

.footer-social-btn:hover {
  border-color: #00f0ff;
  background: rgba(0, 210, 255, 0.25);
  color: #ffffff;
  box-shadow: 0 0 14px rgba(0, 210, 255, 0.6);
  transform: translateY(-2px);
}

/* Columns Header */
.footer-col-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

.footer-col-icon {
  width: 18px;
  height: 18px;
  color: #00d2ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.footer-col-title {
  font-size: 14.5px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

/* Links List */
.footer-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.footer-link-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  text-decoration: none;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  transition: all 0.15s ease;
  padding: 2px 0;
}

.footer-link-item .footer-arrow {
  color: #0284c7;
  font-size: 11px;
  font-weight: 800;
  transition: all 0.15s ease;
}

.footer-link-item:hover {
  color: #ffffff;
}

.footer-link-item:hover .footer-arrow {
  color: #00f0ff;
  transform: translateX(3px);
}

/* Get in touch items */
.footer-contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #cbd5e1;
  font-size: 13px;
  line-height: 1.45;
}

.footer-contact-item a {
  color: #cbd5e1;
  text-decoration: none;
  transition: color 0.15s;
}

.footer-contact-item a:hover {
  color: #00f0ff;
  text-decoration: underline;
}

.footer-contact-icon {
  width: 16px;
  height: 16px;
  color: #00d2ff;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Bottom Strip */
.footer-exact-bottom {
  border-top: 1px solid rgba(0, 180, 216, 0.18);
  padding: 16px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 12.5px;
  color: #64748b;
}

.footer-bottom-left {
  color: #94a3b8;
}

.footer-bottom-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.footer-bottom-right a {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.15s;
}

.footer-bottom-right a:hover {
  color: #00f0ff;
}

.footer-bottom-pipe {
  color: rgba(0, 180, 216, 0.35);
}

/* Mega menu and dropdowns handled centrally by style.css */

/* ==============================================================================
   IMAGE 2 EXACT FOOTER: CYBER BLUE GLOW AESTHETIC
   ============================================================================== */
.footer-exact-img2 {
  position: relative;
  background: radial-gradient(circle at 15% 0%, rgba(0, 140, 255, 0.22) 0%, transparent 45%),
              radial-gradient(circle at 85% 0%, rgba(0, 90, 220, 0.2) 0%, transparent 45%),
              #010c1c;
  background-image: radial-gradient(rgba(0, 180, 255, 0.12) 1.2px, transparent 1.2px);
  background-size: 20px 20px;
  color: #94a3b8;
  padding: 44px 0 0 0;
  border-top: 1.5px solid #00d2ff;
  box-shadow: 0 -4px 25px rgba(0, 210, 255, 0.45);
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  overflow: hidden;
}

.footer-exact-container {
  max-width: 1360px;
  margin: 0 auto;
  padding: 0 24px;
}

.footer-exact-grid {
  display: grid;
  grid-template-columns: 1.3fr 1.05fr 1fr 1.05fr 1fr 1.2fr;
  gap: 24px;
  padding-bottom: 36px;
}

@media (max-width: 1200px) {
  .footer-exact-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 32px 24px;
  }
}

@media (max-width: 768px) {
  .footer-exact-grid {
    grid-template-columns: 1fr;
    gap: 28px;
  }
}

/* Col 1: Brand */
.footer-exact-brand {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.footer-exact-logo-wrap {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.footer-logo-tagline {
  font-size: 11.5px;
  font-weight: 600;
  color: #7dd3fc;
  letter-spacing: 1.5px;
  margin-top: 4px;
}

.footer-social-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}

.footer-social-btn {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 1.5px solid rgba(0, 180, 216, 0.45);
  background: rgba(2, 24, 48, 0.7);
  color: #38bdf8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  font-size: 13px;
  font-weight: 700;
  transition: all 0.22s ease;
}

.footer-social-btn:hover {
  border-color: #00f0ff;
  background: rgba(0, 210, 255, 0.25);
  color: #ffffff;
  box-shadow: 0 0 14px rgba(0, 210, 255, 0.6);
  transform: translateY(-2px);
}

/* Columns Header */
.footer-col-header {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
}

.footer-col-icon {
  width: 18px;
  height: 18px;
  color: #00d2ff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.footer-col-title {
  font-size: 14.5px;
  font-weight: 700;
  color: #ffffff;
  letter-spacing: 0.2px;
  white-space: nowrap;
}

/* Links List */
.footer-links-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.footer-link-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  text-decoration: none;
  color: #94a3b8;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.35;
  transition: all 0.15s ease;
  padding: 2px 0;
}

.footer-link-item .footer-arrow {
  color: #0284c7;
  font-size: 11px;
  font-weight: 800;
  transition: all 0.15s ease;
}

.footer-link-item:hover {
  color: #ffffff;
}

.footer-link-item:hover .footer-arrow {
  color: #00f0ff;
  transform: translateX(3px);
}

/* Get in touch items */
.footer-contact-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.footer-contact-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: #cbd5e1;
  font-size: 13px;
  line-height: 1.45;
}

.footer-contact-item a {
  color: #cbd5e1;
  text-decoration: none;
  transition: color 0.15s;
}

.footer-contact-item a:hover {
  color: #00f0ff;
  text-decoration: underline;
}

.footer-contact-icon {
  width: 16px;
  height: 16px;
  color: #00d2ff;
  margin-top: 2px;
  flex-shrink: 0;
}

/* Bottom Strip */
.footer-exact-bottom {
  border-top: 1px solid rgba(0, 180, 216, 0.18);
  padding: 16px 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 14px;
  font-size: 12.5px;
  color: #64748b;
}

.footer-bottom-left {
  color: #94a3b8;
}

.footer-bottom-right {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.footer-bottom-right a {
  color: #94a3b8;
  text-decoration: none;
  transition: color 0.15s;
}

.footer-bottom-right a:hover {
  color: #00f0ff;
}

.footer-bottom-pipe {
  color: rgba(0, 180, 216, 0.35);
}





/* ==============================================================================
   EXACT IMAGE 2 REPLICATION: LIGHT BOTTOM CTA CARD WITH GIRL PHOTO & FEATURES
   ============================================================================== */
.pdf-bottom-cta-card.exact-cta-img2 {
  background: #ffffff !important;
  border: 1px solid #e2e8f0;
  border-radius: 24px;
  padding: 40px 42px;
  color: #0f172a !important;
  display: grid;
  grid-template-columns: 1.25fr 0.95fr 1fr;
  gap: 32px;
  align-items: center;
  box-shadow: 0 16px 45px -10px rgba(15, 23, 42, 0.08);
  position: relative;
  overflow: visible;
}

.cta-img2-left-col {
  display: flex;
  flex-direction: column;
}

.cta-img2-badge-pill {
  background: #ECFDF5;
  color: #059669;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: 12.5px;
  font-weight: 700;
  margin-bottom: 16px;
  align-self: flex-start;
}

.cta-img2-title {
  font-size: 32px;
  font-weight: 900;
  color: #0f172a;
  line-height: 1.22;
  margin: 0 0 12px;
  letter-spacing: -0.5px;
}

.text-cta-blue {
  color: #059669;
}

.cta-img2-subtitle {
  font-size: 14px;
  color: #64748b;
  line-height: 1.6;
  margin: 0 0 22px;
  max-width: 480px;
}

.cta-img2-metrics-row {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 26px;
  flex-wrap: wrap;
}

.cta-metric-unit {
  display: flex;
  align-items: center;
  gap: 8px;
}

.cta-metric-icon-box {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #ECFDF5;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.cta-metric-text {
  display: flex;
  flex-direction: column;
}

.cta-metric-val {
  font-size: 13.5px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}

.cta-metric-lbl {
  font-size: 11px;
  color: #64748b;
  font-weight: 600;
}

.cta-img2-btns-row {
  display: flex;
  align-items: center;
  gap: 14px;
  flex-wrap: wrap;
}

.cta-btn-primary-blue {
  background: #10B981;
  color: #ffffff !important;
  border: none;
  border-radius: 12px;
  padding: 13px 24px;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  box-shadow: 0 8px 20px -4px rgba(16, 185, 129, 0.35);
  transition: all 0.2s ease;
}

.cta-btn-primary-blue:hover {
  background: #059669;
  transform: translateY(-1px);
}

.cta-btn-outline-blue {
  background: #ffffff;
  color: #059669 !important;
  border: 1.5px solid #10B981;
  border-radius: 12px;
  padding: 12px 22px;
  font-size: 14px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: all 0.2s ease;
}

.cta-btn-outline-blue:hover {
  background: #ECFDF5;
  border-color: #1d4ed8;
  color: #1d4ed8 !important;
}

.cta-img2-center-col {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cta-girl-photo-container {
  position: relative;
  width: 100%;
  max-width: 290px;
  margin: 0 auto;
}

.cta-girl-img-wrap {
  border-radius: 24px;
  overflow: hidden;
  box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.16);
  background: #ffffff;
  position: relative;
}

.cta-girl-img {
  width: 100%;
  height: 280px;
  object-fit: cover;
  display: block;
}

.cta-doodle-left {
  position: absolute;
  top: -14px;
  left: -46px;
  font-size: 12px;
  font-weight: 800;
  color: #334155;
  line-height: 1.25;
  font-family: 'Inter', sans-serif;
  text-align: right;
  z-index: 2;
}

.cta-doodle-rays {
  position: absolute;
  top: -16px;
  right: 28px;
  z-index: 2;
}

.cta-floating-badge {
  position: absolute;
  background: #ffffff;
  border-radius: 14px;
  padding: 8px 14px;
  box-shadow: 0 12px 28px -6px rgba(15, 23, 42, 0.14);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  z-index: 3;
}

.badge-top-right {
  top: 18px;
  right: -28px;
  border: 1px solid rgba(16, 185, 129, 0.25);
}

.badge-bottom-left {
  bottom: 22px;
  left: -32px;
  border: 1px solid rgba(124, 58, 237, 0.25);
}

.floating-badge-icon {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.icon-green {
  background: #d1fae5;
}

.icon-purple {
  background: #ede9fe;
}

.f-badge-title {
  font-size: 12.5px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.2;
}

.f-badge-sub {
  font-size: 10.5px;
  color: #64748b;
  font-weight: 600;
}

.cta-img2-right-card {
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  border-radius: 20px;
  padding: 26px 22px;
}

.cta-right-card-title {
  font-size: 18px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.3;
  margin: 0 0 6px;
}

.cta-right-card-sub {
  font-size: 12px;
  color: #64748b;
  margin: 0 0 18px;
  line-height: 1.5;
}

.cta-features-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.cta-feature-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.cta-feat-icon-box {
  width: 32px;
  height: 32px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 2px;
}

.bg-purple {
  background: #ede9fe;
}

.bg-blue {
  background: #e0f2fe;
}

.bg-amber {
  background: #fef3c7;
}

.bg-pink {
  background: #fce7f3;
}

.cta-feat-title {
  font-size: 13px;
  font-weight: 800;
  color: #0f172a;
  margin-bottom: 2px;
  line-height: 1.3;
}

.cta-feat-desc {
  font-size: 11.5px;
  color: #64748b;
  line-height: 1.45;
}

@media (max-width: 1080px) {
  .pdf-bottom-cta-card.exact-cta-img2 {
    grid-template-columns: 1fr !important;
    gap: 36px;
    padding: 32px 24px;
  }
  .badge-top-right {
    right: 0;
  }
  .badge-bottom-left {
    left: 0;
  }
  .cta-doodle-left {
    display: none;
  }
}


/* ==============================================================================
   Emerald Green Theme Harmonization (Brand Consistency)
   ============================================================================== */
.cta-img2-badge-pill {
  background: #ECFDF5 !important;
  color: #059669 !important;
  border: 1px solid #A7F3D0 !important;
}

.text-cta-blue, .text-cta-green {
  color: #059669 !important;
}

.cta-metric-icon-box {
  background: #ECFDF5 !important;
  color: #059669 !important;
}

.cta-btn-primary-blue, .cta-btn-primary-green {
  background: #10B981 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 13px 24px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  box-shadow: 0 8px 20px -4px rgba(16, 185, 129, 0.35) !important;
  transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}

.cta-btn-primary-blue:hover, .cta-btn-primary-green:hover {
  background: #059669 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 10px 24px -4px rgba(5, 150, 105, 0.45) !important;
}

.cta-btn-outline-blue, .cta-btn-outline-green {
  background: #ffffff !important;
  color: #059669 !important;
  border: 1.5px solid #10B981 !important;
  border-radius: 12px !important;
  padding: 12px 22px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.cta-btn-outline-blue:hover, .cta-btn-outline-green:hover {
  background: #ECFDF5 !important;
  border-color: #059669 !important;
  color: #047857 !important;
}

.pdf-btn-outline-link {
  border: 1.5px solid #059669 !important;
  color: #059669 !important;
}

.pdf-btn-outline-link:hover {
  background: #059669 !important;
  color: #FFFFFF !important;
}

.pdf-program-card:hover {
  border-color: #10B981 !important;
  box-shadow: 0 12px 24px -4px rgba(16, 185, 129, 0.15) !important;
}

.pdf-btn-card-action {
  border: 1.5px solid #A7F3D0 !important;
  background: #ECFDF5 !important;
  color: #059669 !important;
}

.pdf-program-card:hover .pdf-btn-card-action {
  background: #059669 !important;
  color: #FFFFFF !important;
  border-color: #059669 !important;
}
