.materials-section{background:linear-gradient(135deg,#f8fafc 0%,#f1f5f9 100%);padding:60px 0;position:relative}.materials-container{flex-direction:column;gap:50px;max-width:1200px;margin:0 auto;padding:0 20px;display:flex}.grade-card{background:#fff;border-radius:32px;transition:transform .4s,box-shadow .4s;overflow:hidden;box-shadow:0 20px 40px #00000014}.grade-card:hover{transform:translateY(-8px);box-shadow:0 30px 50px #0000001f}.grade-header{text-align:center;padding:40px;position:relative;overflow:hidden}.grade-10 .grade-header{background:linear-gradient(135deg,#1e293b 0%,#0f172a 100%)}.grade-11 .grade-header{background:linear-gradient(135deg,#991b1b 0%,#7f1d1d 100%)}.grade-icon{color:#fbbf24;background:#ffffff26;border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 20px;font-size:2.5rem;display:flex}.grade-title{color:#fff;margin-bottom:10px;font-size:2.5rem;font-weight:700}.grade-description{color:#cbd5e1;font-size:1.1rem}.semester-grid{background:#e2e8f0;grid-template-columns:repeat(2,1fr);gap:1px;display:grid}.semester-card{text-align:center;background:#fff;padding:40px 30px;text-decoration:none;transition:all .3s;position:relative;overflow:hidden}.semester-card:hover{background:#f8fafc;transform:scale(1.02)}.semester-card:hover .arrow-btn{color:#dc2626;transform:translate(5px)}.semester-icon{color:#fff;background:linear-gradient(135deg,#3b82f6,#0ea5e9);border-radius:16px;justify-content:center;align-items:center;width:60px;height:60px;margin:0 auto 20px;font-size:1.8rem;display:flex}.semester-card h3{color:#1e293b;margin-bottom:10px;font-size:1.5rem;font-weight:600}.semester-card p{color:#64748b;margin-bottom:20px;font-size:.9rem;line-height:1.5}.arrow-btn{color:#94a3b8;font-size:1.5rem;transition:all .3s;display:inline-block}.extras-card{background:#fff;border-radius:32px;transition:transform .4s;overflow:hidden;box-shadow:0 20px 40px #00000014}.extras-card:hover{transform:translateY(-5px)}.extras-header{text-align:center;background:linear-gradient(135deg,#475569 0%,#334155 100%);padding:35px}.extras-icon{color:#fbbf24;background:#ffffff26;border-radius:50%;justify-content:center;align-items:center;width:70px;height:70px;margin:0 auto 15px;font-size:2rem;display:flex}.extras-header h2{color:#fff;margin-bottom:8px;font-size:1.8rem}.extras-header p{color:#cbd5e1}.extras-grid{background:#e2e8f0;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1px;display:grid}.extra-link{color:#1e293b;background:#fff;justify-content:center;align-items:center;gap:15px;padding:25px 20px;font-weight:500;text-decoration:none;transition:all .3s;display:flex}.extra-link:hover{color:#dc2626;background:#f8fafc}.extra-link i:first-child{color:#3b82f6;font-size:1.3rem}.extra-link:hover i:first-child{color:#dc2626}.extra-link i:last-child{color:#94a3b8;font-size:.9rem;transition:transform .3s}.extra-link:hover i:last-child{color:#dc2626;transform:translate(5px)}@media (width<=768px){.materials-section{padding:40px 0}.grade-header{padding:30px 20px}.grade-title{font-size:1.8rem}.semester-grid{grid-template-columns:1fr}.semester-card{padding:30px 20px}.semester-card h3{font-size:1.3rem}.extras-header{padding:25px 20px}.extras-header h2{font-size:1.5rem}.extras-grid{grid-template-columns:1fr}.extra-link{padding:20px}}@media (width<=480px){.grade-icon{width:60px;height:60px;font-size:2rem}.semester-icon{width:50px;height:50px;font-size:1.5rem}}