/* ============================================================
   LEARNING MODEL
============================================================ */
.learn{ position:relative;background:var(--navy); padding:5.5rem 0; overflow:hidden; }
.learn-eyebrow{ color:#fff; font-weight:700; margin-bottom:.4rem; }
.learn-h,.learn-h .yellow{
	font-family:var(--font-polymath-bold); 
	font-weight:700;
	font-size:58px; 
}
.learn-h{
  line-height:1.25;
  color:#fff; 
	margin-bottom:1rem;
}
.learn-h .yellow{ color:var(--pu-insight-yellow); }
.learn-p{ color:#fff; font-size:18px; max-width:820px; margin-bottom:2.5rem; }

.learn-slider{ position:relative; margin-bottom:3.5rem; }

.lcard-wrap{ width:38vw; max-width:460px; padding:0 .6rem; }

.lcard{ background:#12093f; border-radius:18px; overflow:hidden; border:1px solid rgba(255,255,255,.08); }
.lcard-media{
  position:relative; min-height:400px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:space-between;
  padding:1rem;
}
.lcard-media-img{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  z-index:0;
	border-radius: 16px;
border: 2px solid rgba(255, 255, 255, 0.30);
	
}
.lcard-media::before{ 
	content:""; 
	position:absolute; 
	inset:0; 
	z-index:1; 
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 33.26%, #000000 100%);
}
.lcard-session{
	display: flex;
	padding: 8px 16px;
	justify-content: center;
	align-self: start;
	gap: 8px;
	border-radius: 45.53px;
	border: 0.965px solid #FFF;
	background: var(--pu-insight-yellow);
	backdrop-filter: blur(1.9295017719268799px);
	color: #160A4D;
	text-align: center;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: 127.038%; /* 17.785px */
	z-index:1;
}
.lcard-chips{ position:relative; z-index:2; display:flex; gap:.4rem; flex-wrap:wrap; margin-bottom:10px;}
.lcard-chips span{
	display: flex;
	padding: 2px 8px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	border-radius: 13.532px;
	border: 0.965px solid #FFF;
	background: #FFF;
	backdrop-filter: blur(1.9295017719268799px);
	font-size: 12px;
	font-weight: 700;
	line-height: 127.038%; /* 15.245px */
}
.lcard-body{ 
	position:absolute;
	bottom:20px;
	padding:1.1rem 0rem 0rem; 
	z-index:1;
}
.lcard-content{
	display:flex;
	row-gap:8px;
	flex-direction:column;
}
.lcard-tag{ 
	color: #FFF;
	font-size: 14px;
	font-style: normal;
	font-weight: 700;
	line-height: normal;
}
.lcard-body h3{ 
	font-family:var(--font-polymath-bold);
	font-size: 24px;
	font-style: normal;
	line-height: 100%; /* 24px */
	font-weight:700; 
	color:var(--pu-insight-yellow); 
}
.lcard-body p{
	color: #FFF;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 1.4; /* 12px */
}
.learn .slick-slide{ height:auto; }
.learn .slick-slide > div{ height:100%; }

/* Bottom bar: one continuous progress line + arrow buttons */
.learn-bottom-bar{
  display:flex;
  align-items:center;
  gap:1.25rem;
  margin-top:2rem;
  padding:0rem 0rem 0rem 1rem;
}
.learn-progress{
  position:relative;
  flex:1 1 auto;
  height:4px;
  border-radius:999px;
  background:rgba(255,255,255,.35);
  overflow:hidden;
}
.learn-progress-fill{
  position:absolute;
  top:0; left:0;
  height:100%;
  width:0%;
  border-radius:999px;
  background:var(--pu-insight-yellow);
  transition:width .5s ease;
}

.learn-arrows{ display:flex; align-items:center; gap:.6rem; flex:0 0 auto; }
.learn-arrow{
	background:transparent;
	border:0px;
}
.learn-arrows svg{
	stroke:#fff;
	width:24px;
}
.learn-arrow:disabled{ opacity:.35; cursor:default; }

@media (max-width:767.98px){
	.learn{
		padding:3rem 0rem !important;
	}
	
	.learn-p{
		font-size:16px;
		text-align:justify;
	}
	.learn-bottom-bar .slick-dots{
		bottom:30px;
		left:0px;
	}
	.learn-bottom-bar .slick-dots li button:before{
		content:unset;
	}
	.learn-bottom-bar .slick-dots .slick-active button{
		background: #FFC800;
		width: 16px;
		opacity:1;
	}
	.learn-bottom-bar .slick-dots button{
		border-radius: 8px;
		opacity: 0.2;
		background: #FFF;
		width: 8px;
		height: 6px;
	}
	.learn-progress,.learn-arrows{
		display:none;
	}
}
@media (max-width:575.98px){
	.learn-p{
		font-size:15px !important;
	}
}
@media (max-width:375.98px){
	
	
	.lcard-session{
		font-size:12px !important;
		padding:6px 10px !important;
	}
	.lcard-chips span{
		font-size:10px !important;
	}
	.lcard-body h3{
		font-size:20px !important;
	}
}

