


@media (max-width: 1024px) {
  .hero-inner { grid-template-columns: 1fr; text-align: center; }
  .hero-content { padding-top: 0; order: 2; }
  .hero-visual { order: 1; padding-top: 120px; }
  .hero-sub { margin: 0 auto 2rem; }
  .hero-actions { justify-content: center; }
  .hero-image-frame { width: min(380px, 72vw); }
  .hero-float-card.card-1 { right: 0; }
  .hero-float-card.card-2 { left: 0; }
  .about-split { grid-template-columns: 1fr; }
  .about-img-float { display: none; }
  .event-detail-grid { grid-template-columns: 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 2rem; }
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-item { border-right: none; border-bottom: 1px solid var(--border); }
  .stat-item:nth-child(2n) { border-right: none; }
  
  .bento-card-1 { grid-column: span 12; grid-row: span 1; min-height: 320px; }
  .bento-card-2,.bento-card-3,.bento-card-4,.bento-card-5,.bento-card-6 { grid-column: span 6; grid-row: span 1; min-height: 200px; }
  
  .events-section .section-header { margin-bottom: 2rem; }
}
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-hamburger { display: inline-flex; }
  
  .bento-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
    gap: 10px;
  }
  .bento-card-1 { grid-column: span 2; grid-row: span 1; min-height: 240px; }
  .bento-card-2 { grid-column: span 2; grid-row: span 1; min-height: 180px; }
  .bento-card-3,
  .bento-card-4,
  .bento-card-5,
  .bento-card-6 { grid-column: span 1; grid-row: span 1; min-height: 150px; }
  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  .footer-bottom { flex-direction: column; gap: 8px; text-align: center; }
  .gallery-grid { grid-template-columns: 1fr 1fr; }
  
  .role-group-grid { grid-template-columns: repeat(2, 1fr); }
  .faculty-grid { grid-template-columns: repeat(2, 1fr); }
  
  .alumni-wall { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  
  #eventsGrid { grid-template-columns: 1fr; }
  
  .stats-grid { grid-template-columns: 1fr 1fr; }
  .stat-item { border-right: none; border-bottom: 1px solid var(--border); padding: 1.5rem; }
  .stat-item:nth-child(2n) { border-right: none; }
  .stat-number { font-size: clamp(2rem, 7vw, 3rem); }
}
@media (max-width: 480px) {
  .hero-headline { font-size: clamp(2.4rem, 11vw, 3.5rem); }
  .cert-form-card { padding: 24px 20px; }
  .cert-preview-card { padding: 28px 20px; }
  .cert-recipient-name { font-size: 1.8rem; }
  
  .bento-card-1,
  .bento-card-2,
  .bento-card-3,
  .bento-card-4,
  .bento-card-5,
  .bento-card-6 { grid-column: span 2; grid-row: span 1; min-height: 180px; }
  
  .role-group-grid { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .core-card { height: 240px; }
  
  .alumni-wall { grid-template-columns: 1fr 1fr; gap: 10px; }
  
  .hero-float-card { display: none; }
  
  .hero-orbit-ring, .hero-particle-chip { display: none; }
  
  .section-header-inner { flex-direction: column; align-items: flex-start; gap: 1rem; }
  
  #nav { width: calc(100% - 24px); padding: 10px 14px; }
  .nav-brand-text { display: none; }
}



.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
.text-accent { color: var(--csi-accent); }
.text-blue { color: var(--csi-blue); }
[data-aos] { transition-property: opacity, transform; }

@media (max-width: 600px) {
  .gallery-grid-creative {
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 140px;
    gap: 8px;
  }
  .gg-item:nth-child(1) { grid-column: span 2; grid-row: span 1; }
  .gg-item:nth-child(4) { grid-column: span 2; }
}