/* Robotics Page Styles */

.program-hero--robotics{background:linear-gradient(135deg,var(--color-robotics) 0%,#ffa94d 100%);color:#fff;padding:160px 0 80px}
@media(max-width:767px){.program-hero--robotics{padding-top:var(--space-6)}}
.program-hero__badge{display:inline-block;padding:var(--space-1) var(--space-3);background:rgba(255,255,255,.2);border-radius:var(--radius-full);font-size:var(--text-sm);font-weight:var(--font-semibold);margin-bottom:var(--space-4)}
.program-hero__title{font-size:var(--text-5xl);font-weight:var(--font-extrabold);color:#fff;margin-bottom:var(--space-4)}
.program-hero__desc{font-size:var(--text-xl);opacity:.9;max-width:600px;margin-bottom:var(--space-6)}
.program-hero__meta{display:flex;flex-wrap:wrap;gap:var(--space-6)}
.program-meta-item{display:flex;align-items:center;gap:var(--space-2);opacity:.9}

.intro-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-12);align-items:center}
@media(max-width:767px){.intro-grid{grid-template-columns:1fr}}
.intro-image img{width:320px;height:auto;border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl)}

.robot-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
@media(max-width:767px){.robot-steps{grid-template-columns:1fr}}
.robot-step{position:relative;text-align:center;padding:var(--space-8);background:#fff;border-radius:var(--radius-2xl);box-shadow:var(--shadow-md)}
.robot-step__num{position:absolute;top:-15px;left:50%;transform:translateX(-50%);width:30px;height:30px;background:var(--color-robotics);color:#fff;border-radius:var(--radius-full);font-weight:var(--font-bold);display:flex;align-items:center;justify-content:center}
.robot-step__icon{display:inline-flex;align-items:center;justify-content:center;width:80px;height:80px;background:linear-gradient(135deg,var(--color-robotics),#ffa94d);border-radius:var(--radius-xl);color:#fff;margin-bottom:var(--space-4)}
.robot-step h3{font-size:var(--text-lg);margin-bottom:var(--space-2)}
.robot-step p{font-size:var(--text-sm);color:var(--color-gray-600);margin:0}

.robot-highlights{display:flex;flex-direction:column;gap:var(--space-8)}
.robot-highlight{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-8);align-items:center}
.robot-highlight--reverse{direction:rtl}
.robot-highlight--reverse>*{direction:ltr}
@media(max-width:767px){.robot-highlight,.robot-highlight--reverse{grid-template-columns:1fr;direction:ltr}}
.robot-highlight__content h3{font-size:var(--text-2xl);margin-bottom:var(--space-4)}
.robot-highlight__content p{color:var(--color-gray-600);line-height:var(--leading-relaxed)}
.robot-highlight__image img{border-radius:var(--radius-2xl);box-shadow:var(--shadow-lg)}

.level-curriculum-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4)}
@media(max-width:480px){.level-curriculum-grid{grid-template-columns:1fr}}
.level-curriculum-item{display:block;padding:0;border:none;background:none;cursor:zoom-in;font:inherit}
.level-curriculum-item img{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-base)}
.level-curriculum-item:hover img{transform:scale(1.03)}

.lightbox{position:fixed;inset:0;z-index:var(--z-modal);display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:opacity var(--transition-base),visibility var(--transition-base)}
.lightbox.is-open{opacity:1;visibility:visible}
.lightbox__overlay{position:absolute;inset:0;background:rgba(0,0,0,.85);z-index:var(--z-modal-backdrop)}
.lightbox__image{position:relative;max-width:90vw;max-height:90vh;object-fit:contain;border-radius:var(--radius-lg);z-index:calc(var(--z-modal) + 1)}
.lightbox__close{position:fixed;top:var(--space-4);right:var(--space-4);width:44px;height:44px;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.15);border:none;border-radius:var(--radius-full);color:#fff;cursor:pointer;z-index:calc(var(--z-modal) + 2);transition:background var(--transition-base)}
.lightbox__close:hover{background:rgba(255,255,255,.3)}

.robot-benefits{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6)}
@media(max-width:767px){.robot-benefits{grid-template-columns:1fr}}
.robot-benefit{text-align:center;padding:var(--space-6);background:#fff;border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}
.robot-benefit__icon{display:flex;align-items:center;justify-content:center;height:40px;margin-bottom:var(--space-3);color:var(--color-gray-800)}
.robot-benefit h3{font-size:var(--text-base);margin-bottom:var(--space-1)}
.robot-benefit p{font-size:var(--text-sm);color:var(--color-gray-600);margin:0}