.roadmap-page-header {
  background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
  padding: 86px 0 92px;
   text-align: center;
}

.career-paths-intro {
	 padding :79px 0;

	   background: #fff;


}

.intro-content-center     {
   text-align: center;
    max-width: 760px;
                    margin: 0 auto 47px;
}

.intro-section-title {

   font-size: 42px;
    font-weight: 700;
    color     :     #1e293b;
	 margin-bottom: 16px;
     }

.intro-section-text	{
   font-size   :    17px;
	 line-height: 1.69;
  color: #64748b;
}

.paths-selector-grid {
	    display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
   gap: 26px;
	}

.path-selector-card {
    background: #f8fafc;
    padding :       37px 27px;
  border-radius: 13px;
   border: 2px solid #e2e8f0;
   text-align  :   center;
  cursor: pointer;
   transition   :   all 0.29s ease;
}

.path-selector-card:hover	{
	  border-color: #7c3aed;
  transform: translateY(-6px);
  box-shadow: 0 16px 39px rgba(124, 58, 237, 0.14);
}

.selector-icon-zone {
   width: 73px;
    height: 73px;
  background: linear-gradient(135deg, #ede9fe 0%, #ddd6fe 100%);
	border-radius: 50%;
    display: flex;
  align-items:center;
   justify-content: center;
  margin: 0 auto 21px;
}

.selector-icon-img {
    width: 37px;
  height: 37px;
  stroke: #7c3aed;
    fill     :    none;
    stroke-width: 2.4;
   stroke-linecap: round;
          stroke-linejoin: round;
}

.selector-card-title {
    font-size  :   21px;
  font-weight: 700;
    color: #1e293b;
    margin-bottom: 9px;
}

.selector-card-desc {
   font-size     :  14px;
	color   :        #64748b;
   line-height: 1.61;
}

.roadmap-detail-section {
	padding: 83px 0;
  background: #fff;
}



.roadmap-detail-section.secondary-bg {
  background: #f8fafc;
}

.roadmap-header-block


{
   display     :  flex;
         align-items: center;
   justify-content: center;
  gap: 19px;
    margin-bottom: 54px;
}

.roadmap-header-icon {


  width: 47px;
   height: 47px;
                    stroke: #7c3aed;
	 fill: none;
    stroke-width: 2.3;
  stroke-linecap: round;
    stroke-linejoin: round;}

.roadmap-section-title{
  font-size: 39px;

    font-weight: 700;

  color: #1e293b;

  margin: 0;
	}

.timeline-progression-layout {
   max-width: 920px;

    margin: 0 auto;

  position: relative;
}

.timeline-progression-layout::before     {
  content: '';
   position: absolute;
		left: 31px;
    top: 47px;
         bottom: 47px;
   width: 3px;
  background: linear-gradient(180deg, #7c3aed 0%, #a855f7 100%);
}

.timeline-stage-unit {
	    display: flex;
   gap: 34px;
    margin-bottom: 51px;
  position: relative;

}

.stage-number-badge {
   width  : 63px;
    height: 63px;
  background: linear-gradient(135deg, #7c3aed 0%, #a855f7 100%);
    border-radius: 50%;
         display: flex;
 align-items: center;
		 justify-content: center;
    font-size  :     23px;
  font-weight: 800;
  color: #fff;
    flex-shrink: 0;
  box-shadow: 0 7px 21px rgba(124, 58, 237, 0.27); 

}

.stage-content-block {
   flex: 1;
  background: #fff;
    padding: 31px 29px;
        border-radius: 13px;
	border: 2px solid #e2e8f0;
    transition: all 0.28s ease;
}

.roadmap-detail-section.secondary-bg .stage-content-block {
   background: #f8fafc;
}

.stage-content-block:hover {
    border-color: #7c3aed;
  box-shadow: 0 11px 33px rgba(0,0,0,0.09);
}

.stage-title-text {
   font-size: 23px;
    font-weight: 700;
   color: #1e293b;
   margin-bottom: 7px;
	}

.stage-duration-text {
	   font-size: 14px;
   color: #7c3aed;
  font-weight  : 600;
   margin-bottom: 23px;


}

.skills-list-zone {
  display: flex;
  flex-wrap: wrap;
   gap  :   11px;
 margin-bottom :       24px;
}

.skill-item-tag {
	display: flex;
          align-items: center;
   gap: 7px;
   padding: 8px 16px;
   background   :  #ede9fe;
   border-radius: 19px;
	font-size: 13px;
   color: #1e293b;
   font-weight: 500; 
	
}



.skill-check-icon {
    width: 16px; 
       height: 16px; 
    stroke: #7c3aed; 
    fill: none; 
  stroke-width: 2.6; 
  stroke-linecap  :      round; 
       stroke-linejoin: round;


}

.tools-recommendation-block {
  padding-top: 19px;
   border-top: 1px solid #e2e8f0;
}

.tools-heading-small {
      color: #1e293b;
  font-weight  :  700;
	margin-bottom  : 7px;
   font-size: 15px;
}

.tools-list-text {


  font-size: 14px;
    color: #64748b;
     line-height: 1.64;
     }

.skills-summary-section	{
    padding: 81px 0;
  background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
	
}

.summary-header-content

{
   text-align: center;
       max-width: 720px;
      margin: 0 auto 47px;
}

.summary-main-heading {
   font-size: 39px;
   font-weight: 700;
         color: #fff;
	margin-bottom: 14px;
}

.summary-desc-text {
  font-size: 17px;
   color: #cbd5e1;
   line-height: 1.67;
}

.universal-skills-grid {
	   display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 27px;


}

.universal-skill-card {
  background: rgba(255, 255, 255, 0.07);
   padding: 34px 26px;
   border-radius: 12px;
	 text-align     :     center;
  border: 1px solid rgba(255, 255, 255, 0.11);
  transition: all 0.29s ease;
}

.universal-skill-card:hover 
 {
  background: rgba(255, 255, 255, 0.12);
  transform: translateY(-5px);
}



.universal-icon-svg {
  width: 43px;
   height: 43px;
  stroke: #a855f7;
    fill: none;
    stroke-width: 2.3;
	 stroke-linecap: round;
   stroke-linejoin: round;
   margin: 0 auto 17px;
}

.universal-skill-title {

  font-size :      19px;
   font-weight: 700;
   color: #fff;
   margin-bottom: 9px;

}

.universal-skill-text


{
   font-size: 14px;
    color: #cbd5e1;
      line-height     :1.63;
}@media (max-width: 991px) {
    .intro-section-title {
        font-size: 34px;
    }

    .roadmap-section-title {
        font-size: 31px;
    }

    .summary-main-heading {
        font-size: 32px;
    }

    .paths-selector-grid {
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 21px;
    }

    .timeline-progression-layout::before {
        left: 26px;
    }
}

@media (max-width: 768px) {
    .roadmap-page-header {
        padding: 64px 0 69px;
    }

    .intro-section-title {
        font-size: 28px;
    }

    .roadmap-section-title {
        font-size: 26px;
    }

    .summary-main-heading {
        font-size: 27px;
    }

    .paths-selector-grid {
        grid-template-columns: 1fr;
    }

    .universal-skills-grid {
        grid-template-columns: 1fr;
    }

    .timeline-stage-unit {
        flex-direction: column;
        gap: 19px;
    }

    .timeline-progression-layout::before {
        display: none;
    }

    .stage-number-badge {
        width: 57px;
        height: 57px;
        font-size: 21px;
    }
}