/* institution page css */
.yinstitution{
 background-color: #f5f7ff;
}

.y-register-your{
    background: linear-gradient(90deg, #3b82f6, #9333ea);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.icon-wrapper {
  width: 48px;
  height: 48px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* tranning */
/* Training component styles */
.training-section {
 background: linear-gradient(90deg, #063a7f, #177fdd);
  padding-top: 60px;
  padding-bottom: 60px;
  color: white;
  text-align: center;
}

.training-section h2 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 1rem;
}

.training-section p.lead {
  font-size: 18px;
  margin-bottom: 3rem;
  color: white;
}

.training-stats {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1.5rem;
}

.training-stat-item {
  flex: 1 1 20%;
  max-width: 180px;
  margin-bottom: 1.5rem;
}

.training-stat-item h3 {
  font-size: 36px;
  font-weight: 700;
  margin-bottom: 0.3rem;
  color: white;
}

.training-stat-item p {
  font-size: 16px;
  margin: 0;
  color: white;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .training-stat-item {
    flex: 1 1 45%;
    max-width: none;
  }
}

/* traning platform */

/* Trainingplatform component styles */
.trainingplatform-container {
  padding: 60px 15px;
  background-color: #f9f9f9;
}

.trainingplatform-card {
  border: 1px solid #eee;
  border-radius: 16px;
  background-color: #fff;
  height: 100%; /* makes all cards equal height */
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 24px;
  transition: box-shadow 0.3s ease;
}

.trainingplatform-card:hover {
  box-shadow: 0 8px 16px rgba(0,0,0,0.1);
}

.trainingplatform-icon {
  font-size: 36px;
  margin-bottom: 15px;
}

.trainingplatform-title {
  font-weight: 700;
  margin-bottom: 10px;
}

.trainingplatform-desc {
  color: #6c757d; /* muted text */
  font-size: 15px;
  line-height: 1.4;
}

/* registerclg */
.yfirstofregi{
     max-width: 800px;
  width: 100%;
}

.y-regibutton{
     background: linear-gradient(to right, #6366f1, #9333ea);
  border: none;
}

/* roboticssyllabus */
/* styles.css */

/* === Common Card Styling === */
.y-card {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
  transition: transform 0.3s ease;
}

.y-card:hover {
  transform: translateY(-5px);
}

.y-card-header {
  padding: 1.5rem;
  color: white;
  font-weight: 600;
  text-align: left;
  border-top-left-radius: 16px;
  border-top-right-radius: 16px;
background: #27b1e8;
background: linear-gradient(162deg, rgba(39, 177, 232, 1) 4%, rgba(44, 36, 112, 1) 85%);
}

.y-grade-title {
  font-size: 1.25rem;
  font-weight: 700;
}

.y-age-range {
  font-size: 0.9rem;
  opacity: 0.9;
}

.y-level {
  font-size: 1rem;
  font-weight: 500;
  margin-top: 5px;
}

/* === Popular Badge === */
.y-badge-popular {
  position: absolute;
  top: 1rem;
  right: 1rem;
  background: orange;
  color: white;
  padding: 4px 10px;
  border-radius: 50px;
  font-size: 0.75rem;
  font-weight: bold;
}

/* === Pricing === */

.y-level-tag{
    font-size: 25px;
   
    border-radius: 9px;
color: white;
 background: linear-gradient(to right, #4338ca, #db2777);
}
.y-pricing {
  padding: 1rem 1.5rem 0 1.5rem;
  font-size: 1.25rem;
  font-weight: bold;
  

}

/* === Level Badge === */
.y-level-badge {
  margin-left: 1rem;
  font-size: 0.85rem;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  border-radius: 1rem;
  background-color: #e0f7fa;
  color: #00796b;
  display: inline-block;
}

/* === Section Titles === */
.y-section-title {
  font-size: 1rem;
  font-weight: bold;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}

/* === Focus Areas & Adventures Box === */
.y-focus-box,
.y-adventure-box,
.y-kits-box {
  padding: 1rem;
  margin: 0 1.5rem 1rem;
  border-radius: 12px;
  background-color: #f5faff;
  font-size: 0.95rem;
}

.y-adventure-box {
  background-color: #e9fce9;
}

.y-kits-box {
  background-color: #fceeff;
}

.y-list {
  padding-left: 1.25rem;
}

.y-list li {
  margin-bottom: 0.5rem;
}

/* === Enroll Button === */
.y-enroll-btn {
  width: calc(100% - 3rem);
  margin: 1rem auto 1.5rem;
  display: block;
  border: none;
  padding: 0.75rem;
  border-radius: 12px;
 background: #222266;
background: linear-gradient(165deg, rgba(34, 34, 102, 1) 46%, rgba(255, 255, 255, 1) 100%);
  color: white;
  font-size: 1rem;
  font-weight: 600;
  text-align: center;
  transition: background 0.3s ease;
}

.y-enroll-btn:hover {
background: #e8ede9;
background: linear-gradient(162deg, rgba(232, 237, 233, 1) 4%, rgba(44, 36, 112, 1) 40%);
}

/* === Backgrounds for Cards === */
.y-bg-green {
  background: linear-gradient(to right, #3cb371, #20c997);
}

.y-bg-blue {
  background: linear-gradient(to right, #4e54c8, #8f94fb);
}

.y-bg-pink {
  background: linear-gradient(to right, #d16ba5, #ffa69e);
}
/* state css robic syllabus page */
.stats-section {
  background: linear-gradient(90deg, #2b2d92, #9b175d);
  color: white;
}

.stat-circle {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: radial-gradient(circle at top left, #cad1d3, #0072ff);
  color: white;
}
.stat-circle:nth-child(2) {
  background: radial-gradient(circle at top left, #f953c6, #b91d73);
}
.stat-circle:nth-child(3) {
  background: radial-gradient(circle at top left, #00f260, #0575e6);
}
.stat-circle:nth-child(4) {
  background: radial-gradient(circle at top left, #ff6a00, #ee0979);
}
.state-h1{
  color: #fac412;
}
/* robotical register */
 .robotical-regi-card{
 background: linear-gradient(90deg, #6a11cb, #2575fc);
}

/* otg css */
.otg-bg{background-color:#e9efff}
.otgh1{font-size:4rem;
color: #17385f;}
.otg-features-div{
  background-color:#e9efff
}
.otg-card-header{
 background: #27b1e8;
background: linear-gradient(162deg, rgba(39, 177, 232, 1) 4%, rgba(44, 36, 112, 1) 85%);
}
.ojt-faq{
  background-color:#e9efff;
}
.ojt-icon-section{
   width: 80px;
  height: 80px;
  background-color: rgba(255, 255, 255, 0.2);
}
/* reassessment test */
.large-radio {
  transform: scale(1.5);  /* You can increase the number as needed */
  margin-right: 10px;
  cursor: pointer;
}