/* =====================================================
   NAVYAM — PAGE-SPECIFIC STYLES
   ===================================================== */

/* ── GALLERY PAGE ── */
.gallery-page .gallery-filter {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 36px;
}
.filter-btn {
  padding: 9px 20px;
  border-radius: 24px;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .85rem;
  color: var(--blue-main);
  background: var(--white);
  border: 2px solid var(--gray-200);
  cursor: pointer;
  transition: var(--transition);
}
.filter-btn:hover, .filter-btn.active {
  background: var(--blue-main);
  color: white;
  border-color: var(--blue-main);
}
.gallery-full-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}
.gallery-full-item {
  position: relative;
  border-radius: var(--radius);
  overflow: hidden;
  aspect-ratio: 4/3;
  cursor: pointer;
  background: var(--gray-100);
  box-shadow: var(--shadow-sm);
}
.gallery-full-item img {
  width: 100%; height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
  loading: lazy;
}
.gallery-full-item:hover img { transform: scale(1.07); }
.gallery-full-item .gfi-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(13,43,110,.75), transparent 55%);
  opacity: 0;
  transition: var(--transition);
  display: flex;
  align-items: flex-end;
  padding: 16px;
}
.gallery-full-item:hover .gfi-overlay { opacity: 1; }
.gallery-full-item .gfi-overlay span {
  color: white;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .85rem;
}
.gallery-full-item .gfi-overlay .zoom-icon {
  position: absolute;
  top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 44px; height: 44px;
  background: rgba(255,255,255,.2);
  border: 2px solid rgba(255,255,255,.6);
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: white;
  font-size: 1.1rem;
  backdrop-filter: blur(4px);
}

/* Lightbox */
.lightbox {
  position: fixed; inset: 0;
  background: rgba(0,0,0,.92);
  z-index: 9999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.lightbox.open { display: flex; }
.lightbox-inner { position: relative; max-width: 900px; width: 100%; text-align: center; }
.lightbox-img {
  max-width: 100%;
  max-height: 80vh;
  border-radius: var(--radius);
  box-shadow: 0 24px 80px rgba(0,0,0,.5);
}
.lightbox-close {
  position: absolute;
  top: -48px; right: 0;
  color: white;
  font-size: 1.8rem;
  cursor: pointer;
  width: 40px; height: 40px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,.1);
  border-radius: 50%;
  transition: var(--transition);
}
.lightbox-close:hover { background: rgba(255,255,255,.2); }
.lightbox-caption {
  color: rgba(255,255,255,.8);
  font-size: .88rem;
  margin-top: 12px;
  font-style: italic;
}

/* ── ADMISSIONS PAGE ── */
.admissions-page .process-section { background: var(--off-white); }
.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 40px;
  position: relative;
}
.steps-grid::before {
  content: '';
  position: absolute;
  top: 36px; left: 10%; right: 10%;
  height: 2px;
  background: linear-gradient(90deg, var(--gold), var(--blue-light));
  z-index: 0;
}
.step-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 28px 20px;
  text-align: center;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  position: relative;
  z-index: 1;
  transition: var(--transition);
}
.step-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.step-num {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: var(--blue-dark);
  color: white;
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.2rem;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  border: 3px solid var(--gold);
}
.step-card h3 {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .98rem;
  color: var(--blue-dark);
  margin-bottom: 8px;
}
.step-card p { font-size: .83rem; color: var(--gray-500); line-height: 1.6; }

.fee-table-wrap { overflow-x: auto; margin-top: 32px; border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.fee-table { width: 100%; border-collapse: collapse; background: white; }
.fee-table th {
  background: var(--blue-dark);
  color: white;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .88rem;
  padding: 14px 20px;
  text-align: left;
}
.fee-table td { padding: 13px 20px; font-size: .88rem; border-bottom: 1px solid var(--gray-100); }
.fee-table tr:last-child td { border-bottom: none; }
.fee-table tr:nth-child(even) td { background: var(--off-white); }
.fee-table tr:hover td { background: rgba(26,72,153,.04); }
.badge-new { background: var(--gold); color: var(--blue-dark); font-size: .7rem; font-weight: 700; padding: 2px 8px; border-radius: 20px; margin-left: 6px; font-family: var(--font-head); }

.req-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 32px;
}
.req-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 22px;
  border-left: 4px solid var(--blue-main);
  box-shadow: var(--shadow-sm);
}
.req-card h4 {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .95rem;
  color: var(--blue-dark);
  margin-bottom: 12px;
}
.req-card ul { display: flex; flex-direction: column; gap: 8px; }
.req-card ul li {
  font-size: .85rem;
  color: var(--text-body);
  display: flex; gap: 8px; align-items: flex-start;
}
.req-card ul li::before { content: '✓'; color: var(--green); font-weight: 700; flex-shrink: 0; }

/* ── CONTACT PAGE ── */
.contact-page .contact-grid {
  display: grid;
  grid-template-columns: 1fr 1.2fr;
  gap: 40px;
  align-items: start;
}
.contact-info-cards { display: flex; flex-direction: column; gap: 16px; }
.contact-info-card {
  background: var(--white);
  border-radius: var(--radius);
  padding: 20px;
  display: flex;
  gap: 16px;
  align-items: flex-start;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  transition: var(--transition);
}
.contact-info-card:hover { transform: translateX(4px); box-shadow: var(--shadow-md); }
.ci-icon {
  width: 46px; height: 46px;
  border-radius: 12px;
  background: linear-gradient(135deg, var(--blue-main), var(--blue-light));
  color: white;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  flex-shrink: 0;
}
.ci-text .label { font-family: var(--font-head); font-weight: 800; font-size: .88rem; color: var(--blue-dark); margin-bottom: 3px; }
.ci-text a, .ci-text p { font-size: .85rem; color: var(--text-body); }
.ci-text a:hover { color: var(--blue-main); }

.contact-form-wrap {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 36px;
  box-shadow: var(--shadow-md);
  border: 1px solid var(--gray-200);
}
.contact-form-wrap h3 {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.3rem;
  color: var(--blue-dark);
  margin-bottom: 6px;
}
.contact-form-wrap p { font-size: .88rem; color: var(--gray-500); margin-bottom: 24px; }
.form-group { margin-bottom: 18px; }
.form-group label {
  display: block;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .82rem;
  color: var(--blue-dark);
  margin-bottom: 6px;
}
.form-group input,
.form-group select,
.form-group textarea {
  width: 100%;
  padding: 11px 14px;
  border: 2px solid var(--gray-200);
  border-radius: 8px;
  font-family: var(--font-body);
  font-size: .9rem;
  color: var(--text-dark);
  background: var(--white);
  transition: border-color .2s;
  outline: none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus { border-color: var(--blue-main); background: rgba(26,72,153,.02); }
.form-group textarea { resize: vertical; min-height: 110px; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.form-success {
  display: none;
  background: rgba(40,167,69,.1);
  border: 1px solid var(--green);
  border-radius: 8px;
  padding: 14px;
  color: var(--green);
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .9rem;
  text-align: center;
  margin-top: 14px;
}
.contact-map { margin-top: 40px; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-md); }
.contact-map iframe { width: 100%; height: 380px; border: none; }

/* ── WHY US / HIGHLIGHTS ── */
.why-us-section { background: var(--off-white); }
.why-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 40px;
}
.why-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  padding: 28px 22px;
  text-align: center;
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  transition: var(--transition);
}
.why-card:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); border-color: var(--blue-light); }
.why-icon {
  width: 60px; height: 60px;
  border-radius: 50%;
  margin: 0 auto 16px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.4rem;
}
.why-card:nth-child(1) .why-icon { background: rgba(26,72,153,.1); color: var(--blue-main); }
.why-card:nth-child(2) .why-icon { background: rgba(232,160,32,.12); color: var(--gold); }
.why-card:nth-child(3) .why-icon { background: rgba(40,167,69,.1); color: var(--green); }
.why-card:nth-child(4) .why-icon { background: rgba(220,53,69,.1); color: #dc3545; }
.why-card h3 { font-family: var(--font-head); font-weight: 800; font-size: .98rem; color: var(--blue-dark); margin-bottom: 8px; }
.why-card p { font-size: .84rem; color: var(--gray-500); line-height: 1.6; }

/* ── ACHIEVEMENTS ── */
.achievements-section { background: var(--blue-main); }
.achieve-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  border-radius: var(--radius-lg);
  overflow: hidden;
}
.achieve-item {
  padding: 36px 20px;
  text-align: center;
  border-right: 1px solid rgba(255,255,255,.15);
}
.achieve-item:last-child { border-right: none; }
.achieve-item .a-num {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 2.4rem;
  color: var(--gold-light);
  line-height: 1;
}
.achieve-item .a-label {
  font-size: .85rem;
  color: rgba(255,255,255,.72);
  margin-top: 6px;
  text-transform: uppercase;
  letter-spacing: .06em;
}

/* Responsive pages */
@media (max-width: 900px) {
  .why-grid { grid-template-columns: repeat(2, 1fr); }
  .achieve-grid { grid-template-columns: repeat(2, 1fr); }
  .achieve-item { border-bottom: 1px solid rgba(255,255,255,.15); }
  .steps-grid { grid-template-columns: repeat(2, 1fr); }
  .steps-grid::before { display: none; }
  .gallery-full-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-page .contact-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .why-grid { grid-template-columns: 1fr 1fr; }
  .steps-grid { grid-template-columns: 1fr 1fr; }
  .req-grid { grid-template-columns: 1fr; }
  .form-row { grid-template-columns: 1fr; }
  .gallery-full-grid { grid-template-columns: repeat(2, 1fr); }
  .contact-form-wrap { padding: 22px 18px; }
}
/* ══════════════════════════════════════
   RESULTS HERO
══════════════════════════════════════ */
.results-hero {
  position: relative;
  min-height: 520px;
  display: flex;
  align-items: center;
  background: var(--blue-dark);
  overflow: hidden;
}

.results-hero-bg {
  position: absolute; inset: 0;
  background:
    url('https://images.unsplash.com/photo-1427504494785-3a9ca7044f45?w=1400&q=80')
    center / cover no-repeat;
  filter: brightness(.3);
  transform: scale(1.04);
}

.results-hero-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(
    110deg,
    rgba(13,43,110,.96) 40%,
    rgba(13,43,110,.55) 100%
  );
}

.results-hero-content {
  position: relative;
  z-index: 2;
  padding: 80px 0;
  animation: heroFadeIn .9s ease both;
}

.results-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(232,160,32,.18);
  border: 1px solid rgba(232,160,32,.4);
  color: var(--gold-light);
  font-family: var(--font-head);
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: 7px 16px;
  border-radius: 20px;
  margin-bottom: 20px;
}

.results-hero-content h1 {
  font-family: var(--font-head);
  font-size: clamp(2rem, 5vw, 3.2rem);
  font-weight: 900;
  color: var(--white);
  line-height: 1.18;
  margin-bottom: 18px;
}

.rh-gold { color: var(--gold-light); }

.results-hero-sub {
  font-size: 1rem;
  color: rgba(255,255,255,.78);
  line-height: 1.7;
  max-width: 600px;
  margin-bottom: 40px;
}
.results-hero-sub strong { color: var(--gold-light); }

/* Hero stats row */
.results-hero-stats {
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--radius);
  padding: 20px 28px;
  backdrop-filter: blur(8px);
  width: fit-content;
}

.rh-stat { padding: 0 28px; text-align: center; }
.rh-stat:first-child { padding-left: 0; }
.rh-stat:last-child  { padding-right: 0; }

.rh-num {
  font-family: var(--font-head);
  font-size: 1.9rem;
  font-weight: 900;
  color: var(--gold-light);
  line-height: 1;
}

.rh-label {
  font-size: .74rem;
  color: rgba(255,255,255,.6);
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-top: 4px;
  line-height: 1.3;
  max-width: 90px;
}

.rh-stat-divider {
  width: 1px;
  height: 44px;
  background: rgba(255,255,255,.15);
  flex-shrink: 0;
}

/* Floating trophy decoration */
.rh-trophy-deco {
  position: absolute;
  right: 6%;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14rem;
  color: rgba(232,160,32,.06);
  pointer-events: none;
  z-index: 1;
  line-height: 1;
}

/* ══════════════════════════════════════
   100% RESULT ACHIEVEMENT BANNER
══════════════════════════════════════ */
.result-100-banner {
  background: linear-gradient(135deg, var(--blue-dark) 0%, var(--blue-main) 100%);
  padding: 48px 0;
  position: relative;
  overflow: hidden;
}

.result-100-banner::before {
  content: '100%';
  position: absolute;
  right: -2%;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 18rem;
  color: rgba(255,255,255,.03);
  line-height: 1;
  pointer-events: none;
  user-select: none;
}

.r100-inner {
  display: flex;
  align-items: center;
  gap: 32px;
  flex-wrap: wrap;
}

/* Animated ring icon */
.r100-icon-wrap { flex-shrink: 0; }

.r100-icon-ring {
  width: 90px; height: 90px;
  border-radius: 50%;
  background: rgba(232,160,32,.15);
  border: 3px solid var(--gold);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2.2rem;
  color: var(--gold-light);
  animation: ringPulse 3s ease-in-out infinite;
}

@keyframes ringPulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(232,160,32,.4); }
  50%       { box-shadow: 0 0 0 16px rgba(232,160,32,.0); }
}

.r100-text { flex: 1; min-width: 260px; }

.r100-text h2 {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: clamp(1.2rem, 2.5vw, 1.6rem);
  color: var(--white);
  margin-bottom: 12px;
  line-height: 1.3;
}

.r100-percent {
  color: var(--gold-light);
  font-size: 1.1em;
}

.r100-text p {
  font-size: .92rem;
  color: rgba(255,255,255,.75);
  line-height: 1.75;
}
.r100-text p strong { color: var(--gold-light); }

/* Badges column */
.r100-badges {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}

.r100-badge {
  display: flex;
  align-items: center;
  gap: 9px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 8px;
  padding: 10px 18px;
  color: white;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .88rem;
  white-space: nowrap;
}
.r100-badge i { color: var(--gold-light); font-size: 1rem; }

/* ══════════════════════════════════════
   RESULT STATS CARDS
══════════════════════════════════════ */
.results-stats-section { background: var(--white); }

.result-stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  margin-top: 44px;
}

.result-stat-card {
  border-radius: var(--radius-lg);
  padding: 32px 22px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: var(--transition);
  border: 1px solid transparent;
}

.result-stat-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

/* Color variants */
.result-stat-card--blue  { background: linear-gradient(145deg, #0d2b6e, #1a4899); color: white; }
.result-stat-card--gold  { background: linear-gradient(145deg, #c8820a, #e8a020); color: white; }
.result-stat-card--green { background: linear-gradient(145deg, #1a7a32, #28a745); color: white; }
.result-stat-card--red   { background: linear-gradient(145deg, #b02a37, #dc3545); color: white; }

/* Subtle shine overlay */
.result-stat-card::before {
  content: '';
  position: absolute;
  top: -30%; left: -30%;
  width: 160%; height: 160%;
  background: radial-gradient(circle at 30% 30%, rgba(255,255,255,.1), transparent 60%);
  pointer-events: none;
}

.rsc-icon {
  font-size: 2rem;
  opacity: .5;
  margin-bottom: 10px;
}

.rsc-percent {
  font-family: var(--font-head);
  font-size: 2.8rem;
  font-weight: 900;
  line-height: 1;
  color: white;
  margin-bottom: 8px;
}

.rsc-title {
  font-family: var(--font-head);
  font-weight: 800;
  font-size: 1rem;
  color: rgba(255,255,255,.95);
  margin-bottom: 4px;
}

.rsc-sub {
  font-size: .78rem;
  color: rgba(255,255,255,.65);
  margin-bottom: 14px;
  line-height: 1.4;
}

.rsc-year {
  display: inline-block;
  background: rgba(255,255,255,.15);
  padding: 3px 12px;
  border-radius: 20px;
  font-size: .72rem;
  font-family: var(--font-head);
  font-weight: 700;
  letter-spacing: .05em;
  color: rgba(255,255,255,.85);
}

/* ══════════════════════════════════════
   RESULT TABLE
══════════════════════════════════════ */
.result-table-wrap {
  overflow-x: auto;
  margin-top: 36px;
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  border: 1px solid var(--gray-200);
}

.result-table {
  width: 100%;
  border-collapse: collapse;
  background: var(--white);
  font-size: .88rem;
}

.result-table thead th {
  background: var(--blue-dark);
  color: white;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .84rem;
  padding: 15px 18px;
  text-align: center;
  white-space: nowrap;
  letter-spacing: .02em;
}

.result-table thead th:first-child { text-align: left; border-radius: 0; }

.result-table tbody td {
  padding: 13px 18px;
  text-align: center;
  border-bottom: 1px solid var(--gray-100);
  color: var(--text-body);
}

.result-table tbody td:first-child { text-align: left; }

.result-table tbody tr:last-child td { border-bottom: none; }

/* Alternate row tint */
.result-table tbody tr:nth-child(odd) td { background: rgba(244,246,251,.6); }

.result-table tbody tr:hover td {
  background: rgba(26,72,153,.05);
}

/* Highlight current year rows */
.result-row-highlight td {
  background: rgba(232,160,32,.06) !important;
  font-weight: 600;
}
.result-row-highlight:hover td {
  background: rgba(232,160,32,.12) !important;
}

/* 100% pass badge */
.pass-badge {
  display: inline-block;
  background: linear-gradient(135deg, #1a7a32, #28a745);
  color: white;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .78rem;
  padding: 4px 12px;
  border-radius: 20px;
  letter-spacing: .04em;
}

.table-note {
  margin-top: 14px;
  font-size: .82rem;
  color: var(--gray-500);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
}
.table-note i { color: var(--blue-light); }

/* ══════════════════════════════════════
   PAMPHLET SECTION
══════════════════════════════════════ */
.pamphlet-section { background: var(--white); }

.pamphlet-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 44px;
}

/* Individual pamphlet card */
.pamphlet-card {
  background: var(--white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  border: 1px solid var(--gray-200);
  overflow: hidden;
  transition: var(--transition);
}

.pamphlet-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

/* Image container */
.pamphlet-img-wrap {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--gray-100);
}

.pamphlet-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s ease;
  display: block;
}

.pamphlet-card:hover .pamphlet-img { transform: scale(1.04); }

/* Placeholder (when image missing) */
.pamphlet-placeholder {
  width: 100%;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: linear-gradient(145deg, var(--blue-dark) 0%, var(--blue-main) 100%);
  color: rgba(255,255,255,.7);
  font-family: var(--font-head);
  font-size: .95rem;
  font-weight: 700;
}

.pamphlet-placeholder i {
  font-size: 3.5rem;
  color: rgba(255,255,255,.25);
}

.pp-year {
  font-size: 1.5rem;
  font-weight: 900;
  color: var(--gold-light);
  letter-spacing: .04em;
}

/* Hover overlay with "View" button */
.pamphlet-overlay {
  position: absolute; inset: 0;
  background: rgba(13,43,110,.72);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: var(--transition);
  backdrop-filter: blur(2px);
}

.pamphlet-card:hover .pamphlet-overlay { opacity: 1; }

.pamphlet-view-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: var(--gold);
  color: var(--blue-dark);
  padding: 11px 24px;
  border-radius: 8px;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .9rem;
  transition: var(--transition);
  transform: scale(.95);
}

.pamphlet-card:hover .pamphlet-view-btn { transform: scale(1); }
.pamphlet-view-btn:hover { background: var(--gold-light); }

/* "Latest" ribbon */
.pamphlet-ribbon {
  position: absolute;
  top: 16px; right: -30px;
  background: var(--gold);
  color: var(--blue-dark);
  font-family: var(--font-head);
  font-weight: 900;
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: 5px 38px;
  transform: rotate(45deg);
  transform-origin: top right;
  box-shadow: 0 2px 8px rgba(0,0,0,.2);
}

/* Card info area */
.pamphlet-info {
  padding: 20px 22px 22px;
}

.pamphlet-year-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(26,72,153,.08);
  color: var(--blue-main);
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .75rem;
  padding: 4px 12px;
  border-radius: 20px;
  margin-bottom: 10px;
  letter-spacing: .03em;
}

.pamphlet-title {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1rem;
  color: var(--blue-dark);
  margin-bottom: 6px;
  line-height: 1.3;
}

.pamphlet-desc {
  font-size: .82rem;
  color: var(--gray-500);
  margin-bottom: 12px;
  line-height: 1.5;
}

.pamphlet-stats-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}

.pamphlet-stats-row span {
  font-size: .75rem;
  color: var(--text-body);
  display: flex;
  align-items: center;
  gap: 5px;
  background: var(--off-white);
  padding: 3px 10px;
  border-radius: 6px;
  font-family: var(--font-head);
  font-weight: 600;
}

.pamphlet-stats-row span i { color: var(--blue-main); font-size: .72rem; }

.pamphlet-dl-btn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  background: var(--blue-main);
  color: white;
  padding: 9px 20px;
  border-radius: 8px;
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .85rem;
  transition: var(--transition);
  width: 100%;
  justify-content: center;
}

.pamphlet-dl-btn:hover {
  background: var(--blue-dark);
  transform: translateY(-2px);
}

/* Note box below pamphlets */
.pamphlet-note {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  background: rgba(26,72,153,.06);
  border: 1px dashed var(--blue-light);
  border-radius: var(--radius);
  padding: 14px 20px;
  margin-top: 28px;
  font-size: .84rem;
  color: var(--gray-700);
  line-height: 1.6;
}
.pamphlet-note i { color: var(--blue-main); margin-top: 2px; flex-shrink: 0; }
.pamphlet-note code {
  background: rgba(26,72,153,.1);
  padding: 1px 6px;
  border-radius: 4px;
  font-size: .82rem;
  color: var(--blue-dark);
}

/* ══════════════════════════════════════
   TOPPERS SECTION
══════════════════════════════════════ */
.toppers-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
  margin-top: 44px;
}

.topper-card {
  border-radius: var(--radius-lg);
  padding: 28px 20px;
  text-align: center;
  position: relative;
  overflow: hidden;
  transition: var(--transition);
  border: 1px solid var(--gray-200);
  background: var(--white);
}

.topper-card:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
}

/* Top ribbon rank */
.topper-rank {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-head);
  font-weight: 800;
  font-size: .74rem;
  letter-spacing: .06em;
  text-transform: uppercase;
  padding: 5px 14px;
  border-radius: 20px;
  margin-bottom: 18px;
}

.topper-card--gold  .topper-rank { background: var(--gold);         color: var(--blue-dark); }
.topper-card--blue  .topper-rank { background: var(--blue-main);     color: white;            }
.topper-card--green .topper-rank { background: var(--green);         color: white;            }
.topper-card--purple .topper-rank { background: #7c3aed;             color: white;            }

/* Card top border */
.topper-card--gold::before   { content:''; position:absolute; top:0; left:0; right:0; height:4px; background: linear-gradient(90deg, var(--gold), var(--gold-light)); }
.topper-card--blue::before   { content:''; position:absolute; top:0; left:0; right:0; height:4px; background: linear-gradient(90deg, var(--blue-dark), var(--blue-light)); }
.topper-card--green::before  { content:''; position:absolute; top:0; left:0; right:0; height:4px; background: linear-gradient(90deg, #1a7a32, #28a745); }
.topper-card--purple::before { content:''; position:absolute; top:0; left:0; right:0; height:4px; background: linear-gradient(90deg, #5b21b6, #7c3aed); }

/* Photo */
.topper-photo-wrap {
  width: 100px; height: 100px;
  border-radius: 50%;
  margin: 0 auto 14px;
  position: relative;
}

.topper-photo {
  width: 100%; height: 100%;
  border-radius: 50%;
  object-fit: cover;
  object-position: top;
  border: 4px solid var(--white);
  box-shadow: 0 4px 16px rgba(0,0,0,.15);
  display: block;
}

/* Fallback avatar */
.topper-fallback {
  width: 100%; height: 100%;
  border-radius: 50%;
  background: var(--gray-100);
  border: 4px solid var(--white);
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  align-items: center;
  justify-content: center;
  font-size: 2.4rem;
  color: var(--gray-200);
}

.topper-name {
  font-family: var(--font-head);
  font-weight: 900;
  font-size: 1.05rem;
  color: var(--blue-dark);
  margin-bottom: 6px;
}

.topper-score {
  font-family: var(--font-head);
  font-size: 2rem;
  font-weight: 900;
  color: var(--blue-main);
  line-height: 1;
  margin-bottom: 8px;
}

.topper-card--gold   .topper-score { color: #b8780a; }
.topper-card--green  .topper-score { color: #1a7a32; }
.topper-card--purple .topper-score { color: #5b21b6; }

.topper-stream {
  font-size: .8rem;
  color: var(--gray-500);
  margin-bottom: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.topper-subjects {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
}

.topper-subjects span {
  background: var(--off-white);
  color: var(--text-body);
  font-size: .72rem;
  font-family: var(--font-head);
  font-weight: 700;
  padding: 3px 9px;
  border-radius: 6px;
  border: 1px solid var(--gray-200);
}

/* ══════════════════════════════════════
   PRIDE QUOTE STRIP
══════════════════════════════════════ */
.pride-strip {
  background: var(--blue-dark);
  padding: 52px 0;
  position: relative;
  overflow: hidden;
}

.pride-strip::before {
  content: '"';
  position: absolute;
  left: -2%;
  top: -20%;
  font-family: var(--font-head);
  font-size: 28rem;
  font-weight: 900;
  color: rgba(255,255,255,.03);
  line-height: 1;
  pointer-events: none;
}

.pride-strip-inner {
  max-width: 820px;
  margin: 0 auto;
  text-align: center;
  position: relative;
  z-index: 1;
}

.pride-icon {
  font-size: 2rem;
  color: rgba(232,160,32,.35);
  margin-bottom: 14px;
}

.pride-quote {
  font-family: var(--font-body);
  font-size: clamp(.95rem, 2vw, 1.15rem);
  font-style: italic;
  color: rgba(255,255,255,.85);
  line-height: 1.85;
  margin: 0 0 20px;
  border: none;
  padding: 0;
}

.pride-author {
  font-family: var(--font-head);
  font-weight: 700;
  font-size: .88rem;
  color: var(--gold-light);
  letter-spacing: .04em;
}

/* ══════════════════════════════════════
   RESPONSIVE
══════════════════════════════════════ */
@media (max-width: 1024px) {
  .result-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .toppers-grid      { grid-template-columns: repeat(2, 1fr); }
  .pamphlet-grid     { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 768px) {
  .results-hero-stats {
    padding: 16px 16px;
    gap: 0;
    width: 100%;
    justify-content: space-around;
  }
  .rh-stat { padding: 0 12px; }
  .rh-num  { font-size: 1.4rem; }
  .rh-stat-divider { height: 32px; }
  .rh-trophy-deco  { display: none; }

  .r100-inner      { flex-direction: column; text-align: center; }
  .r100-badges     { flex-direction: row; flex-wrap: wrap; justify-content: center; }
  .r100-icon-ring  { margin: 0 auto; }

  .result-stats-grid { grid-template-columns: repeat(2, 1fr); }
  .pamphlet-grid     { grid-template-columns: repeat(2, 1fr); }
  .toppers-grid      { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 580px) {
  .results-hero-stats { flex-direction: column; gap: 14px; align-items: flex-start; }
  .rh-stat-divider    { width: 40px; height: 1px; }
  .result-stats-grid  { grid-template-columns: 1fr 1fr; }
  .pamphlet-grid      { grid-template-columns: 1fr; }
  .toppers-grid       { grid-template-columns: 1fr 1fr; }
  .result-table       { font-size: .78rem; }
  .result-table thead th,
  .result-table tbody td { padding: 10px 12px; }
}

@media (max-width: 420px) {
  .toppers-grid { grid-template-columns: 1fr; }
}