/* ============================================================================
   AIFU — Bitiruvchilar profili
   Dizayn tizimi: oq / qizil / ko'k (logotipdan olingan)
   ============================================================================
   1  Design tokens          9  Statistika
   2  Reset & typography    10  Ro'yxat asboblar paneli (qidiruv, filtr, saralash)
   3  Layout utilities      11  Grant guruhlari va talaba kartochkalari
   4  Tugmalar              12  CTA
   5  Topbar                13  Footer
   6  Header va navigatsiya 14  Yuqoriga tugmasi
   7  Hero                  15  Animatsiyalar
   8  Yo'nalishlar          16  Responsive (320px → 4K)
   ============================================================================ */

/* ================================================================
   1. DESIGN TOKENS
   ================================================================ */
:root {
  /* — Brend ranglari (AIFU logotipidan) — */
  --aifu-blue:        216 69% 24%;   /* #123262 */
  --aifu-blue-mid:    215 78% 38%;
  --aifu-blue-bright: 213 86% 50%;
  --aifu-sky:         210 100% 96%;
  --aifu-red:         338 90% 48%;   /* #EC0A5E */
  --aifu-red-dark:    338 84% 38%;
  --aifu-red-soft:    338 90% 96%;
  --aifu-gold:        42 92% 52%;

  /* — Semantik — */
  --background:        212 40% 99%;
  --foreground:        216 40% 12%;
  --card:              0 0% 100%;
  --muted:             213 24% 96%;
  --muted-foreground:  216 16% 44%;
  --border:            215 28% 90%;
  --border-soft:       215 30% 94%;

  /* — Gradientlar — */
  --gradient-hero: linear-gradient(140deg, hsl(216 72% 16%) 0%, hsl(216 70% 22%) 38%, hsl(214 78% 32%) 100%);
  --gradient-red:  linear-gradient(135deg, hsl(338 90% 48%) 0%, hsl(350 86% 55%) 100%);
  --gradient-blue: linear-gradient(135deg, hsl(215 78% 38%) 0%, hsl(203 85% 53%) 100%);
  --gradient-card: linear-gradient(180deg, hsl(0 0% 100%) 0%, hsl(212 40% 99.2%) 100%);

  /* — Soyalar: yumshoq, ko'p qatlamli — */
  --shadow-xs:    0 1px 2px hsl(216 69% 24% / .05);
  --shadow-sm:    0 1px 2px hsl(216 69% 24% / .05), 0 3px 10px -3px hsl(216 69% 24% / .09);
  --shadow-md:    0 2px 4px hsl(216 69% 24% / .05), 0 10px 28px -8px hsl(216 69% 24% / .14);
  --shadow-lg:    0 4px 8px hsl(216 69% 24% / .05), 0 20px 52px -14px hsl(216 69% 24% / .20);
  --shadow-hover: 0 4px 10px hsl(216 69% 24% / .06), 0 18px 40px -12px hsl(216 69% 24% / .22);
  --shadow-red:   0 8px 24px -8px hsl(338 90% 48% / .45);

  /* — Shakl va o'lchov — */
  --radius-sm: .5rem;
  --radius:    .75rem;
  --radius-lg: 1.125rem;
  --radius-xl: 1.5rem;

  --container:   1200px;
  --container-w: 1380px;             /* header uchun kengroq */
  --header-h:    72px;
  --gutter:      clamp(16px, 4vw, 28px);

  /* — Bo'lim oralig'i ekranga qarab — */
  --section-y: clamp(56px, 8vw, 104px);

  /* — Harakat — */
  --ease: cubic-bezier(.22, 1, .36, 1);
}

/* ================================================================
   2. RESET & TYPOGRAPHY
   ================================================================ */
*, *::before, *::after { box-sizing: border-box; }

html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--header-h) + 20px);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  margin: 0;
  overflow-x: clip;
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  font-size: clamp(15px, .35vw + 14px, 16.5px);
  line-height: 1.62;
  color: hsl(var(--foreground));
  background: hsl(var(--background));
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: "cv02", "cv03", "cv04", "ss01";
}

body.is-locked { overflow: hidden; }

img, svg, video { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
ul { list-style: none; margin: 0; padding: 0; }
input, select, button { font-family: inherit; }

h1, h2, h3, h4 {
  margin: 0;
  line-height: 1.14;
  font-weight: 800;
  letter-spacing: -.025em;
  text-wrap: balance;
}
p { margin: 0; text-wrap: pretty; }

::selection { background: hsl(var(--aifu-red) / .18); }

:focus-visible {
  outline: 3px solid hsl(var(--aifu-blue-bright));
  outline-offset: 2px;
  border-radius: 6px;
}

/* Klaviatura bilan yuradiganlar uchun o'tish havolasi */
.skip-link {
  position: fixed; top: -100px; left: 16px; z-index: 200;
  padding: 12px 20px; border-radius: var(--radius);
  background: hsl(var(--aifu-blue)); color: #fff; font-weight: 600;
  box-shadow: var(--shadow-lg);
  transition: top .2s var(--ease);
}
.skip-link:focus { top: 16px; }

/* ================================================================
   3. LAYOUT UTILITIES
   ================================================================ */
.container {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: max(var(--gutter), env(safe-area-inset-left), env(safe-area-inset-right));
}
.header .container,
.topbar .container { max-width: var(--container-w); }

.section { padding-block: var(--section-y); }
.section--sky {
  background:
    radial-gradient(60% 50% at 50% 0%, hsl(var(--aifu-sky)) 0%, transparent 70%),
    linear-gradient(180deg, hsl(210 100% 97.5%) 0%, hsl(var(--background)) 100%);
}

.section-head {
  text-align: center;
  max-width: 46rem;
  margin: 0 auto clamp(32px, 4vw, 52px);
}
.section-head h2 { font-size: clamp(1.6rem, 1rem + 2.4vw, 2.6rem); }
.section-head p {
  margin-top: 14px;
  color: hsl(var(--muted-foreground));
  font-size: clamp(.95rem, .9rem + .2vw, 1.075rem);
}
.section-head p b { color: hsl(var(--aifu-blue)); font-weight: 700; }

.eyebrow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 6px 15px; margin-bottom: 16px;
  font-size: .775rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: hsl(var(--aifu-red));
  background: hsl(var(--aifu-red-soft));
  border-radius: 999px;
}
.eyebrow::before {
  content: ""; width: 6px; height: 6px; border-radius: 50%;
  background: hsl(var(--aifu-red));
  box-shadow: 0 0 0 3px hsl(var(--aifu-red) / .18);
}

/* ================================================================
   4. TUGMALAR
   ================================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 14px 26px;
  min-height: 48px;                      /* barmoq uchun qulay o'lcham */
  font-weight: 650; font-size: .95rem;
  border: 1px solid transparent;
  border-radius: var(--radius);
  transition: transform .2s var(--ease), box-shadow .2s var(--ease),
              background-color .2s var(--ease), border-color .2s var(--ease);
}
.btn:active { transform: translateY(1px) scale(.99); }
.btn svg { transition: transform .25s var(--ease); }

.btn--primary {
  background: var(--gradient-red); color: #fff;
  box-shadow: var(--shadow-red);
}
.btn--primary:hover { transform: translateY(-2px); box-shadow: 0 14px 34px -10px hsl(338 90% 48% / .55); }
.btn--primary:hover svg { transform: translateY(2px); }

.btn--ghost {
  background: hsl(0 0% 100% / .09); color: #fff;
  border-color: hsl(0 0% 100% / .28);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.btn--ghost:hover { background: hsl(0 0% 100% / .18); border-color: hsl(0 0% 100% / .45); transform: translateY(-2px); }

.btn--outline {
  background: hsl(var(--card)); color: hsl(var(--aifu-blue));
  border-color: hsl(var(--border)); box-shadow: var(--shadow-xs);
}
.btn--outline:hover { background: hsl(var(--muted)); border-color: hsl(var(--aifu-blue-bright) / .4); }

/* ================================================================
   5. TOPBAR
   ================================================================ */
.topbar {
  background: hsl(216 72% 18%);
  color: hsl(0 0% 100% / .78);
  font-size: .8rem;
}
.topbar__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; min-height: 40px; flex-wrap: wrap;
}
.topbar__contacts { display: flex; align-items: center; gap: clamp(12px, 2vw, 24px); flex-wrap: wrap; }
.topbar__contacts a { display: inline-flex; align-items: center; gap: 7px; transition: color .18s var(--ease); }
.topbar__contacts a:hover { color: #fff; }
.topbar__contacts svg { width: 14px; height: 14px; flex: none; opacity: .75; }
.topbar__actions { display: flex; align-items: center; gap: 12px; }

.topbar__portal {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 13px; border-radius: 999px;
  background: hsl(0 0% 100% / .12); color: #fff; font-weight: 650; font-size: .76rem;
  letter-spacing: .04em;
  transition: background-color .18s var(--ease);
}
.topbar__portal:hover { background: hsl(0 0% 100% / .22); }

.lang { display: flex; align-items: center; gap: 2px; padding: 2px; border-radius: 999px; background: hsl(0 0% 100% / .08); }
.lang button {
  padding: 4px 11px; border: 0; border-radius: 999px;
  background: transparent; color: hsl(0 0% 100% / .68);
  font-size: .74rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.lang button:hover { color: #fff; }
.lang button[aria-current="true"] { background: hsl(var(--aifu-red)); color: #fff; box-shadow: 0 2px 8px -2px hsl(var(--aifu-red) / .6); }

/* ================================================================
   6. HEADER VA NAVIGATSIYA
   ================================================================ */
.header {
  position: sticky; top: 0; z-index: 60;
  background: hsl(0 0% 100% / .82);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border-bottom: 1px solid hsl(var(--border-soft));
  transition: box-shadow .25s var(--ease), background-color .25s var(--ease);
}
.header.is-scrolled {
  background: hsl(0 0% 100% / .93);
  box-shadow: var(--shadow-sm);
}
.header__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 20px; min-height: var(--header-h);
}

.brand { display: flex; align-items: center; gap: 11px; flex: none; }
.brand__logo { width: 44px; height: 44px; flex: none; object-fit: contain; }
.brand__text { display: flex; flex-direction: column; line-height: 1.14; min-width: 0; }
.brand__name {
  font-size: 1.2rem; font-weight: 900; letter-spacing: -.02em;
  color: hsl(var(--aifu-blue));
}
.brand__sub {
  font-size: .64rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase;
  color: hsl(var(--muted-foreground));
}
/* Headerda logotip + "AIFU" yetarli — to'liq nom menyuga joy bo'shatib beradi
   (to'liq nom footerda va <title> da qoladi) */
.header .brand__sub { display: none; }

.nav { display: flex; align-items: center; gap: 1px; }
.nav a {
  position: relative;
  padding: 9px 11px; border-radius: 8px;
  font-size: .815rem; font-weight: 550; color: hsl(216 25% 30%);
  white-space: nowrap;
  transition: color .18s var(--ease), background-color .18s var(--ease);
}
.nav a:hover { color: hsl(var(--aifu-blue)); background: hsl(var(--muted)); }
.nav a.is-active { color: hsl(var(--aifu-red)); font-weight: 700; background: hsl(var(--aifu-red-soft)); }

/* Burger tugmasi — chiziqlar X ga aylanadi */
.nav-toggle {
  display: none; width: 46px; height: 46px; flex: none;
  align-items: center; justify-content: center;
  border: 1px solid hsl(var(--border)); border-radius: 12px;
  background: hsl(var(--card)); color: hsl(var(--aifu-blue));
  transition: background-color .2s var(--ease), border-color .2s var(--ease);
}
.nav-toggle:hover { background: hsl(var(--muted)); }
.nav-toggle__bars { position: relative; display: block; width: 20px; height: 14px; }
.nav-toggle__bars i {
  position: absolute; left: 0; width: 100%; height: 2px; border-radius: 2px;
  background: currentColor;
  transition: transform .3s var(--ease), opacity .2s var(--ease);
}
.nav-toggle__bars i:nth-child(1) { top: 0; }
.nav-toggle__bars i:nth-child(2) { top: 6px; }
.nav-toggle__bars i:nth-child(3) { top: 12px; }
.nav-toggle.is-open .nav-toggle__bars i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle.is-open .nav-toggle__bars i:nth-child(2) { opacity: 0; transform: scaleX(.3); }
.nav-toggle.is-open .nav-toggle__bars i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.nav-scrim {
  position: fixed; inset: 0; z-index: 55;
  background: hsl(216 60% 10% / .45);
  backdrop-filter: blur(2px);
  animation: fade-in .2s var(--ease);
}
.nav-scrim[hidden] { display: none; }

/* ================================================================
   7. HERO
   ================================================================ */
.hero {
  position: relative; overflow: hidden;
  background: var(--gradient-hero);
  color: #fff;
  padding-block: clamp(56px, 9vw, 108px) clamp(52px, 8vw, 92px);
  isolation: isolate;
}

.hero__grid {
  position: absolute; inset: 0; z-index: -1; opacity: .55;
  background-image:
    linear-gradient(hsl(0 0% 100% / .045) 1px, transparent 1px),
    linear-gradient(90deg, hsl(0 0% 100% / .045) 1px, transparent 1px);
  background-size: clamp(36px, 5vw, 60px) clamp(36px, 5vw, 60px);
  mask-image: radial-gradient(ellipse 85% 65% at 50% 35%, #000 25%, transparent 100%);
  -webkit-mask-image: radial-gradient(ellipse 85% 65% at 50% 35%, #000 25%, transparent 100%);
}

.hero__glow {
  position: absolute; z-index: -1; border-radius: 50%;
  filter: blur(10px);
  pointer-events: none;
}
.hero__glow--red {
  width: clamp(300px, 46vw, 680px); aspect-ratio: 1;
  top: clamp(-260px, -22vw, -140px); right: clamp(-180px, -12vw, -80px);
  background: radial-gradient(circle, hsl(var(--aifu-red) / .42) 0%, transparent 66%);
  animation: float-a 15s var(--ease) infinite alternate;
}
.hero__glow--blue {
  width: clamp(280px, 40vw, 580px); aspect-ratio: 1;
  bottom: clamp(-300px, -24vw, -180px); left: clamp(-160px, -10vw, -70px);
  background: radial-gradient(circle, hsl(203 90% 58% / .40) 0%, transparent 66%);
  animation: float-b 18s var(--ease) infinite alternate;
}

.hero__inner { position: relative; max-width: 58rem; }

.hero .eyebrow {
  color: #fff;
  background: hsl(0 0% 100% / .1);
  border: 1px solid hsl(0 0% 100% / .2);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.hero .eyebrow::before { background: hsl(var(--aifu-red)); box-shadow: 0 0 0 4px hsl(var(--aifu-red) / .28); }

.hero__title {
  font-size: clamp(1.95rem, 1rem + 4.6vw, 3.85rem);
  font-weight: 900;
  line-height: 1.06;
  letter-spacing: -.035em;
  margin-bottom: 20px;
}
.hero__title span { display: block; }
.hero__title .accent {
  background: linear-gradient(100deg, hsl(342 95% 70%) 0%, hsl(6 96% 72%) 55%, hsl(28 96% 70%) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  padding-bottom: .06em;              /* g, y harflari kesilmasligi uchun */
}

.hero__lead {
  font-size: clamp(.98rem, .9rem + .35vw, 1.16rem);
  color: hsl(0 0% 100% / .8);
  max-width: 40rem;
}

.hero__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: clamp(26px, 3.5vw, 38px); }

.hero__pills {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 158px), 1fr));
  gap: clamp(10px, 1.4vw, 16px);
  margin-top: clamp(34px, 5vw, 58px);
}
.hero-pill {
  padding: clamp(16px, 2vw, 22px);
  background: hsl(0 0% 100% / .09);
  border: 1px solid hsl(0 0% 100% / .16);
  border-radius: var(--radius-lg);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  transition: background-color .25s var(--ease), transform .25s var(--ease), border-color .25s var(--ease);
}
.hero-pill:hover {
  background: hsl(0 0% 100% / .15);
  border-color: hsl(0 0% 100% / .3);
  transform: translateY(-3px);
}
.hero-pill__value {
  font-size: clamp(1.55rem, 1rem + 1.7vw, 2.15rem);
  font-weight: 900; line-height: 1; letter-spacing: -.035em;
  font-variant-numeric: tabular-nums;
}
.hero-pill__label { margin-top: 8px; font-size: .8rem; line-height: 1.4; color: hsl(0 0% 100% / .7); }

/* ================================================================
   8. YO'NALISHLAR
   ================================================================ */
.programs {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr));
  gap: clamp(12px, 1.5vw, 20px);
}

.program-card {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 14px;
  padding: clamp(16px, 2vw, 22px);
  background: var(--gradient-card);
  border: 1px solid hsl(var(--border-soft));
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);
}
.program-card::after {
  content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none;
  background: radial-gradient(240px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--aifu-blue-bright) / .07), transparent 65%);
  transition: opacity .3s var(--ease);
}
.program-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-hover);
  border-color: hsl(var(--aifu-blue-bright) / .35);
}
.program-card:hover::after { opacity: 1; }

.program-card__icon {
  display: grid; place-items: center; flex: none;
  width: 50px; height: 50px; border-radius: 14px;
  background: hsl(var(--aifu-sky)); color: hsl(var(--aifu-blue));
  transition: transform .3s var(--ease), background-color .3s var(--ease);
}
.program-card:hover .program-card__icon { transform: scale(1.06) rotate(-3deg); }
.program-card__icon svg { width: 25px; height: 25px; }

.program-card__body { min-width: 0; flex: 1; }
.program-card__name { font-size: .97rem; font-weight: 700; line-height: 1.3; letter-spacing: -.01em; }
.program-card__meta { margin-top: 4px; font-size: .8rem; color: hsl(var(--muted-foreground)); }

.program-card__count {
  display: grid; place-items: center; flex: none;
  min-width: 44px; height: 42px; padding-inline: 12px;
  border-radius: 12px;
  background: hsl(var(--aifu-red-soft)); color: hsl(var(--aifu-red-dark));
  font-size: 1.1rem; font-weight: 800; font-variant-numeric: tabular-nums;
}

/* ================================================================
   9. STATISTIKA
   ================================================================ */
.stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr));
  gap: clamp(12px, 1.5vw, 20px);
}

.stat-card {
  position: relative; overflow: hidden;
  padding: clamp(20px, 2.4vw, 28px);
  background: hsl(var(--card));
  border: 1px solid hsl(var(--border-soft));
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease);
}
.stat-card::before {
  content: ""; position: absolute; top: -46px; right: -46px;
  width: 130px; height: 130px; border-radius: 50%;
  background: hsl(var(--aifu-sky)); opacity: .8;
}
.stat-card--accent::before { background: hsl(var(--aifu-red-soft)); }
.stat-card::after {
  content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none;
  background: radial-gradient(260px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--aifu-blue-bright) / .08), transparent 65%);
  transition: opacity .3s var(--ease);
}
.stat-card > * { position: relative; z-index: 1; }
.stat-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-hover); }
.stat-card:hover::after { opacity: 1; }

.stat-card__icon {
  display: grid; place-items: center;
  width: 44px; height: 44px; margin-bottom: 16px; border-radius: 13px;
  background: var(--gradient-blue); color: #fff;
  box-shadow: 0 6px 16px -6px hsl(var(--aifu-blue-bright) / .6);
}
.stat-card--accent .stat-card__icon {
  background: var(--gradient-red);
  box-shadow: 0 6px 16px -6px hsl(var(--aifu-red) / .6);
}
.stat-card__icon svg { width: 22px; height: 22px; }

.stat-card__value {
  font-size: clamp(1.85rem, 1.2rem + 1.6vw, 2.5rem);
  font-weight: 900; line-height: 1; letter-spacing: -.04em;
  color: hsl(var(--aifu-blue));
  font-variant-numeric: tabular-nums;
}
.stat-card--accent .stat-card__value { color: hsl(var(--aifu-red-dark)); }
.stat-card__label { margin-top: 11px; font-size: .9rem; font-weight: 700; letter-spacing: -.01em; }
.stat-card__hint { margin-top: 5px; font-size: .79rem; line-height: 1.45; color: hsl(var(--muted-foreground)); }

/* ================================================================
   10. RO'YXAT ASBOBLAR PANELI
   ================================================================ */
.roster-toolbar {
  --toolbar-pad: clamp(15px, 1.8vw, 20px);
  position: sticky; top: calc(var(--header-h) + 8px); z-index: 30;
  display: grid; gap: 15px;
  margin-bottom: 24px;
  padding: var(--toolbar-pad);
  background:
    linear-gradient(180deg, hsl(0 0% 100% / .95) 0%, hsl(210 40% 99% / .92) 100%);
  backdrop-filter: blur(16px) saturate(180%);
  -webkit-backdrop-filter: blur(16px) saturate(180%);
  border: 1px solid hsl(var(--border));
  border-radius: var(--radius-xl);
  box-shadow: var(--shadow-md);
}
/* min-width:0 — grid/flex elementlari ichidagi keng kontent panelni cho'zib
   yubormasligi uchun (mobilda chiplar qatori yon tomonga suriladi) */
.roster-toolbar > * { min-width: 0; }
.roster-toolbar__row { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; min-width: 0; }

/* — Qidiruv — */
.search { position: relative; flex: 1 1 260px; min-width: 0; }
.search__icon {
  position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
  color: hsl(var(--muted-foreground)); pointer-events: none;
  transition: color .2s var(--ease);
}
.search__input {
  width: 100%; height: 46px;
  padding: 0 42px 0 42px;
  font-size: .9rem; color: hsl(var(--foreground));
  background: hsl(213 26% 96.5%);
  border: 1px solid hsl(var(--border-soft)); border-radius: 999px;
  transition: background-color .2s var(--ease), border-color .2s var(--ease), box-shadow .2s var(--ease);
  -webkit-appearance: none; appearance: none;
}
.search__input::placeholder { color: hsl(var(--muted-foreground)); }
.search__input::-webkit-search-cancel-button { display: none; }
.search__input:focus {
  outline: none;
  background: hsl(var(--card));
  border-color: hsl(var(--aifu-blue-bright) / .55);
  box-shadow: 0 0 0 4px hsl(var(--aifu-blue-bright) / .12);
}
.search__input:focus + .search__clear,
.search:focus-within .search__icon { color: hsl(var(--aifu-blue)); }

.search__clear {
  position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
  display: grid; place-items: center; width: 30px; height: 30px;
  border: 0; border-radius: 8px;
  background: transparent; color: hsl(var(--muted-foreground));
  transition: background-color .18s var(--ease), color .18s var(--ease);
}
.search__clear:hover { background: hsl(var(--border)); color: hsl(var(--foreground)); }
.search__clear[hidden] { display: none; }

/* — Yo'nalish va saralash ro'yxatlari — */
.picker { display: flex; align-items: center; gap: 9px; flex: 0 1 auto; min-width: 0; }
.picker label { font-size: .84rem; color: hsl(var(--muted-foreground)); white-space: nowrap; }
.picker select {
  height: 46px; padding: 0 38px 0 16px;
  font-size: .86rem; font-weight: 600; color: hsl(var(--foreground));
  background-color: hsl(var(--card));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23516079' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 15px;
  border: 1px solid hsl(var(--border)); border-radius: 999px;
  -webkit-appearance: none; appearance: none;
  cursor: pointer; max-width: 100%;
  transition: border-color .2s var(--ease), box-shadow .2s var(--ease), background-color .2s var(--ease);
}
.picker select:hover { border-color: hsl(var(--aifu-blue-bright) / .45); }
/* Tanlangan yo'nalish ko'zga tashlanib tursin */
.picker select.is-set {
  border-color: hsl(var(--aifu-blue)); background-color: hsl(var(--aifu-sky));
  color: hsl(var(--aifu-blue)); font-weight: 700;
}
#programSelect { max-width: 320px; }

/* — Fasetlar —
   Har bir guruh bitta "yo'lak" (segmented control) ichida turadi: nomi yo'lak
   boshida ikonka bilan, variantlar esa ichida. Guruhlar yonma-yon oqadi. */
.facets { display: flex; flex-wrap: wrap; gap: 10px; min-width: 0; }

.facet {
  display: inline-flex; align-items: center; gap: 3px; min-width: 0;
  padding: 4px;
  background: hsl(213 26% 96.5%);
  border: 1px solid hsl(var(--border-soft));
  border-radius: 999px;
  transition: border-color .25s var(--ease), background-color .25s var(--ease);
}
.facet.is-active {
  background: hsl(var(--aifu-sky));
  border-color: hsl(var(--aifu-blue-bright) / .3);
}

.facet__label {
  display: inline-flex; align-items: center; gap: 7px; flex: none;
  padding: 0 13px 0 10px; margin-right: 3px;
  border-right: 1px solid hsl(var(--border));
  font-size: .715rem; font-weight: 750; letter-spacing: .05em; text-transform: uppercase;
  color: hsl(var(--muted-foreground));
  white-space: nowrap;
}
.facet__label svg { flex: none; opacity: .55; }
.facet.is-active .facet__label { color: hsl(var(--aifu-blue)); }
.facet.is-active .facet__label svg { opacity: .85; }

.facet__badge {
  display: grid; place-items: center;
  min-width: 17px; height: 17px; padding-inline: 4px;
  border-radius: 999px;
  background: hsl(var(--aifu-blue)); color: #fff;
  font-size: .62rem; font-weight: 800; font-style: normal;
  font-variant-numeric: tabular-nums;
}

.facet__chips { display: flex; align-items: center; gap: 3px; min-width: 0; }

/* — Yo'lak ichidagi variantlar — */
.filter-chip {
  display: inline-flex; align-items: center; gap: 6px;
  min-height: 34px; padding: 6px 13px;
  font-size: .815rem; font-weight: 600; white-space: nowrap;
  color: hsl(216 22% 34%);
  background: transparent;
  border: 0; border-radius: 999px;
  transition: background-color .2s var(--ease), color .2s var(--ease),
              box-shadow .2s var(--ease), opacity .2s var(--ease);
}
.filter-chip:hover:not(:disabled) {
  background: hsl(0 0% 100%);
  color: hsl(var(--aifu-blue));
  box-shadow: var(--shadow-xs);
}
.filter-chip[aria-pressed="true"] {
  background: linear-gradient(135deg, hsl(216 69% 26%), hsl(214 74% 36%));
  color: #fff; font-weight: 650;
  box-shadow: 0 4px 12px -4px hsl(var(--aifu-blue) / .55);
}
.filter-chip.is-empty { opacity: .3; cursor: not-allowed; }

.filter-chip__count {
  font-size: .7rem; font-weight: 700; opacity: .5;
  font-variant-numeric: tabular-nums;
}
.filter-chip[aria-pressed="true"] .filter-chip__count { opacity: .72; }

/* — Panel oyoqchasi — */
.facets__foot {
  flex: 0 0 100%;                 /* har doim alohida qatorda */
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  margin-top: 3px; padding-top: 13px;
  border-top: 1px solid hsl(var(--border-soft));
}
.link-btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 7px 14px; border-radius: 999px;
  border: 1px solid hsl(var(--border)); background: hsl(var(--card));
  font-size: .8rem; font-weight: 650; color: hsl(var(--aifu-blue));
  transition: background-color .18s var(--ease), border-color .18s var(--ease),
              color .18s var(--ease), transform .18s var(--ease);
}
.link-btn:hover { background: hsl(var(--aifu-sky)); border-color: hsl(var(--aifu-blue-bright) / .4); transform: translateY(-1px); }
.link-btn svg { opacity: .7; }
.link-btn--reset { color: hsl(var(--aifu-red-dark)); margin-left: auto; }
.link-btn--reset:hover { background: hsl(var(--aifu-red-soft)); border-color: hsl(var(--aifu-red) / .35); }

.roster-count {
  margin-bottom: 22px;
  font-size: .875rem; color: hsl(var(--muted-foreground));
}
.roster-count b { color: hsl(var(--aifu-blue)); font-weight: 800; }

/* ================================================================
   11. GRANT GURUHLARI VA TALABA KARTOCHKALARI
   ================================================================ */
.tier { margin-bottom: clamp(30px, 4vw, 46px); }
.tier:last-child { margin-bottom: 0; }

.tier__head { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; flex-wrap: wrap; }
.tier__badge {
  display: inline-flex; align-items: baseline; gap: 2px;
  padding: 7px 16px; border-radius: 999px;
  font-weight: 900; font-size: 1.02rem; color: #fff;
  font-variant-numeric: tabular-nums;
  box-shadow: var(--shadow-sm);
}
.tier__badge small { font-size: .68em; font-weight: 700; opacity: .85; }
.tier--full .tier__badge { background: var(--gradient-red); box-shadow: var(--shadow-red); }
.tier--high .tier__badge { background: linear-gradient(135deg, hsl(216 69% 24%), hsl(213 86% 48%)); }
.tier--mid  .tier__badge { background: linear-gradient(135deg, hsl(205 80% 40%), hsl(196 85% 52%)); }
.tier--low  .tier__badge { background: linear-gradient(135deg, hsl(216 22% 46%), hsl(214 24% 60%)); }
.tier--zero .tier__badge { background: hsl(216 12% 62%); }

.tier__title { font-size: 1.05rem; font-weight: 700; letter-spacing: -.015em; }
.tier__line { flex: 1 1 40px; height: 1px; background: linear-gradient(90deg, hsl(var(--border)), transparent); }
.tier__count { font-size: .82rem; font-weight: 600; color: hsl(var(--muted-foreground)); white-space: nowrap; }

.student-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr));
  gap: clamp(12px, 1.4vw, 18px);
}

.student-card {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column;
  padding: clamp(18px, 2vw, 22px);
  background: var(--gradient-card);
  border: 1px solid hsl(var(--border-soft));
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-sm);
  transition: transform .28s var(--ease), box-shadow .28s var(--ease), border-color .28s var(--ease);
}
.student-card::after {
  content: ""; position: absolute; inset: 0; opacity: 0; pointer-events: none;
  background: radial-gradient(280px circle at var(--mx, 50%) var(--my, 50%), hsl(var(--aifu-blue-bright) / .09), transparent 62%);
  transition: opacity .3s var(--ease);
}
.student-card > * { position: relative; z-index: 1; }
.student-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow-hover);
  border-color: hsl(var(--aifu-blue-bright) / .32);
}
.student-card:hover::after { opacity: 1; }

.student-card__rank {
  position: absolute; top: 14px; right: 15px; z-index: 2;
  font-size: .7rem; font-weight: 800; color: hsl(var(--muted-foreground));
  font-variant-numeric: tabular-nums; opacity: .65;
}

.student-card__top { display: flex; align-items: center; gap: 13px; margin-bottom: 14px; padding-right: 28px; }
.student-card__id { min-width: 0; }
.student-card__avatar {
  display: grid; place-items: center; flex: none;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--gradient-blue); color: #fff;
  font-size: 1.1rem; font-weight: 800; letter-spacing: -.02em;
  box-shadow: 0 6px 16px -7px hsl(var(--aifu-blue-bright) / .7);
  transition: transform .3s var(--ease);
}
.student-card:hover .student-card__avatar { transform: scale(1.05); }
.student-card__name {
  font-size: 1rem; font-weight: 750; line-height: 1.28; letter-spacing: -.015em;
  overflow-wrap: anywhere;
}
.student-card__program {
  margin-top: 3px; font-size: .79rem; line-height: 1.4;
  color: hsl(var(--muted-foreground)); overflow-wrap: anywhere;
}

.student-card__meta { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 13px; }
.chip {
  padding: 3px 9px; border-radius: 7px; white-space: nowrap;
  font-size: .705rem; font-weight: 650; letter-spacing: -.005em;
  color: hsl(var(--muted-foreground));
  background: hsl(var(--muted));
  border: 1px solid hsl(var(--border-soft));
}
.chip--degree { color: hsl(var(--aifu-blue)); background: hsl(var(--aifu-sky)); border-color: transparent; }
.chip--year   { color: hsl(var(--aifu-red-dark)); background: hsl(var(--aifu-red-soft)); border-color: transparent; }

.badges { display: flex; flex-wrap: wrap; gap: 6px; }
.badge {
  display: inline-flex; align-items: center; gap: 5px;
  padding: 5px 11px; border-radius: 999px;
  font-size: .735rem; font-weight: 650; line-height: 1.3;
}
.badge--gold   { background: hsl(var(--aifu-gold) / .18); color: hsl(38 85% 30%); }
.badge--champ  { background: hsl(338 90% 48% / .12); color: hsl(var(--aifu-red-dark)); }
.badge--cert   { background: hsl(213 86% 50% / .12); color: hsl(var(--aifu-blue)); }
.badge--milliy { background: hsl(150 55% 42% / .14); color: hsl(150 60% 25%); }

.student-card__grant {
  display: flex; align-items: center; gap: 7px;
  margin-top: auto; padding-top: 13px;
  border-top: 1px dashed hsl(var(--border));
  font-size: .775rem; font-weight: 650; line-height: 1.35;
  color: hsl(var(--aifu-red-dark));
}
.student-card__grant svg { flex: none; opacity: .75; }
.badges:empty + .student-card__grant { border-top: 0; padding-top: 0; }

/* — Bo'sh natija — */
.roster-empty {
  display: grid; place-items: center; gap: 6px;
  padding: clamp(44px, 7vw, 72px) 24px; text-align: center;
  background: hsl(var(--card));
  border: 1px dashed hsl(var(--border));
  border-radius: var(--radius-lg);
  color: hsl(var(--muted-foreground));
}
.roster-empty svg { opacity: .3; margin-bottom: 8px; }
.roster-empty__title { font-size: 1.02rem; font-weight: 700; color: hsl(var(--foreground)); }
.roster-empty__hint { font-size: .875rem; }
.roster-empty .btn { margin-top: 16px; }

/* ================================================================
   12. CTA
   ================================================================ */
.cta { position: relative; overflow: hidden; background: var(--gradient-hero); color: #fff; isolation: isolate; }
.cta::before {
  content: ""; position: absolute; z-index: -1;
  width: min(680px, 120%); aspect-ratio: 1;
  top: 50%; left: 50%; transform: translate(-50%, -50%);
  background: radial-gradient(circle, hsl(var(--aifu-red) / .32) 0%, transparent 62%);
  animation: pulse-soft 9s ease-in-out infinite;
}
.cta__inner { max-width: 44rem; margin-inline: auto; text-align: center; }
.cta h2 { font-size: clamp(1.6rem, 1rem + 2.4vw, 2.6rem); margin-bottom: 14px; }
.cta p { color: hsl(0 0% 100% / .82); font-size: clamp(.95rem, .9rem + .25vw, 1.08rem); }
.cta__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 30px; }

/* ================================================================
   13. FOOTER
   ================================================================ */
.footer {
  background: hsl(216 52% 10%);
  color: hsl(0 0% 100% / .66);
  padding-block: clamp(44px, 6vw, 66px) 0;
  font-size: .885rem;
}
.footer__grid {
  display: grid;
  grid-template-columns: minmax(240px, 1.6fr) repeat(3, minmax(150px, 1fr));
  gap: clamp(28px, 3.5vw, 44px);
}
.footer .brand__name { color: #fff; }
.footer .brand__sub { color: hsl(0 0% 100% / .45); }
.footer .brand__logo { background: #fff; border-radius: 50%; padding: 3px; }

.footer__about { margin-top: 16px; max-width: 34ch; line-height: 1.7; }

.footer__social { display: flex; gap: 9px; margin-top: 18px; }
.footer__social a {
  display: grid; place-items: center; width: 38px; height: 38px; border-radius: 11px;
  background: hsl(0 0% 100% / .07); color: hsl(0 0% 100% / .78);
  transition: background-color .22s var(--ease), color .22s var(--ease), transform .22s var(--ease);
}
.footer__social a:hover { background: hsl(var(--aifu-red)); color: #fff; transform: translateY(-3px); }

.footer__col h4 {
  margin-bottom: 16px; font-size: .78rem; font-weight: 800;
  letter-spacing: .12em; text-transform: uppercase; color: #fff;
}
.footer__col li + li { margin-top: 10px; }
.footer__col a { transition: color .18s var(--ease); }
.footer__col a:hover { color: #fff; }

.footer__contact li { display: flex; gap: 11px; align-items: flex-start; line-height: 1.55; }
.footer__contact li + li { margin-top: 13px; }
.footer__contact svg { width: 16px; height: 16px; flex: none; margin-top: 4px; color: hsl(var(--aifu-red)); }

.footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  margin-top: clamp(36px, 5vw, 54px);
  padding-block: 20px;
  padding-bottom: max(20px, env(safe-area-inset-bottom));
  border-top: 1px solid hsl(0 0% 100% / .09);
  font-size: .82rem; color: hsl(0 0% 100% / .48);
}

/* ================================================================
   14. YUQORIGA TUGMASI
   ================================================================ */
.to-top {
  position: fixed; z-index: 50;
  right: max(18px, env(safe-area-inset-right));
  bottom: max(18px, env(safe-area-inset-bottom));
  display: grid; place-items: center;
  width: 46px; height: 46px;
  border: 1px solid hsl(var(--border)); border-radius: 50%;
  background: hsl(0 0% 100% / .9); color: hsl(var(--aifu-blue));
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  box-shadow: var(--shadow-md);
  animation: fade-up .3s var(--ease);
  transition: transform .22s var(--ease), background-color .22s var(--ease), color .22s var(--ease);
}
.to-top:hover { transform: translateY(-3px); background: hsl(var(--aifu-blue)); color: #fff; }
.to-top[hidden] { display: none; }

/* ================================================================
   15. ANIMATSIYALAR
   ================================================================ */
.reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s var(--ease), transform .6s var(--ease);
}
.reveal.is-visible { opacity: 1; transform: none; }

@keyframes fade-in { from { opacity: 0 } to { opacity: 1 } }
@keyframes fade-up { from { opacity: 0; transform: translateY(10px) } to { opacity: 1; transform: none } }
@keyframes float-a {
  from { transform: translate3d(0, 0, 0) scale(1) }
  to   { transform: translate3d(-40px, 34px, 0) scale(1.12) }
}
@keyframes float-b {
  from { transform: translate3d(0, 0, 0) scale(1) }
  to   { transform: translate3d(46px, -30px, 0) scale(1.1) }
}
@keyframes pulse-soft {
  0%, 100% { opacity: .75; transform: translate(-50%, -50%) scale(1) }
  50%      { opacity: 1;   transform: translate(-50%, -50%) scale(1.1) }
}

/* ================================================================
   16. RESPONSIVE — 320px dan 4K gacha
   ================================================================ */

/* Juda katta ekranlar */
@media (min-width: 1600px) {
  :root { --container: 1320px; --container-w: 1520px; }
}

/* Menyu bir qatorga sig'may qolganda burgerga o'tadi.
   Chegara piksel bilan emas — main.js dagi fitNav() haqiqiy kenglikni o'lchaydi,
   shuning uchun uzunroq tarjimalarda (ru/en) ham to'g'ri ishlaydi. */
.header.is-compact .nav-toggle { display: inline-flex; }

.header.is-compact .nav {
  position: absolute; top: 100%; left: 0; right: 0;
  display: none; flex-direction: column; align-items: stretch; gap: 2px;
  padding: 12px max(var(--gutter), env(safe-area-inset-left)) 20px;
  background: hsl(0 0% 100% / .98);
  backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
  border-bottom: 1px solid hsl(var(--border));
  box-shadow: var(--shadow-lg);
  max-height: calc(100dvh - var(--header-h)); overflow-y: auto;
  overscroll-behavior: contain;
  animation: fade-up .22s var(--ease);
}
.header.is-compact .nav.is-open { display: flex; }
.header.is-compact .nav a { padding: 13px 14px; font-size: .95rem; border-radius: 10px; }

/* O'lchash paytida menyu ko'zga tashlanmasin */
.header.is-measuring .nav { visibility: hidden; }

/* Planshet */
@media (max-width: 1024px) {
  .footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .footer__brand { grid-column: 1 / -1; }
  .footer__about { max-width: 48ch; }
}

/* Kichik planshet / katta telefon */
@media (max-width: 860px) {
  :root { --header-h: 64px; }

  .topbar { font-size: .76rem; }
  .topbar__inner { justify-content: space-between; min-height: 0; padding-block: 7px; }
  .topbar__contacts { gap: 12px; }
  .topbar__hide-md { display: none; }

  .roster-toolbar { position: static; }   /* kichik ekranda joy egallamasin */
}

/* Telefon */
@media (max-width: 640px) {
  .topbar__hide-sm { display: none; }
  .topbar__inner { justify-content: center; gap: 10px; }

  .brand__logo { width: 38px; height: 38px; }
  .brand__name { font-size: 1.05rem; }
  .brand__sub { display: none; }

  .hero__actions { gap: 10px; }
  .hero__actions .btn { flex: 1 1 100%; }
  .hero__pills { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* nowrap muhim: ustun yo'nalishida "wrap" qolsa flex ko'p ustunga bo'linadi
     va qatorning kengligi konteynerdan emas, kontentdan olinadi */
  .roster-toolbar__row { flex-direction: column; flex-wrap: nowrap; align-items: stretch; }
  .search { flex: 0 0 auto; }
  .picker { justify-content: space-between; }
  /* flex-basis: 0 — ro'yxat o'zining eng uzun variantiga qarab kengaymasin,
     qolgan joyni egallasin */
  .picker select { flex: 1 1 0; min-width: 0; max-width: 100%; }
  #programSelect { max-width: 100%; }

  /* Yo'laklar ustma-ust joylashadi va har biri yon tomonga suriladi.
     Guruh nomi chap chetda qotib turadi — surganda ham qaysi guruh ekani ko'rinadi. */
  /* Grid — chunki ustunli flex yo'laklarning balandligini siqib qo'yadi,
     kengligini esa kontentdan oladi. Gridda har bir yo'lak alohida qator. */
  .facets { display: grid; grid-auto-flow: row; gap: 9px; }

  /* scroll-snap ataylab ishlatilmadi: u qatorni surib, birinchi variantni
     yopishqoq nom ostida yashirib qo'yardi */
  .facet {
    flex-wrap: nowrap; justify-content: flex-start;
    overflow-x: auto; scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 26px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 26px), transparent 100%);
  }
  .facet::-webkit-scrollbar { display: none; }

  .facet__label {
    position: sticky; left: 0; z-index: 1;
    padding-left: 12px; margin-left: -4px;
    background: hsl(213 26% 96.5%);
    border-radius: 999px 0 0 999px;
  }
  .facet.is-active .facet__label { background: hsl(var(--aifu-sky)); }

  .facet__chips { flex-wrap: nowrap; }
  .filter-chip { flex: none; }

  .facets__foot { gap: 8px; }
  .link-btn { flex: 1 1 auto; justify-content: center; }
  .link-btn--reset { margin-left: 0; }

  .cta__actions .btn { flex: 1 1 100%; }
  .footer__bottom { justify-content: center; text-align: center; }
}

/* Kichik telefonlar — iPhone SE va shunga o'xshash 360–390px */
@media (max-width: 420px) {
  :root { --gutter: 14px; }

  .student-grid, .programs, .stats { grid-template-columns: 1fr; }
  .hero__pills { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .hero-pill { padding: 14px; }
  .hero-pill__label { font-size: .74rem; }

  .student-card__avatar { width: 46px; height: 46px; font-size: 1rem; }
  .student-card__top { gap: 11px; }

  /* Guruh sarlavhasi ikki qatorga bo'linib ketmasin */
  .tier__head { gap: 10px; }
  .tier__line { display: none; }
  .tier__count { margin-left: auto; }
  .tier__title { font-size: .98rem; }
  .stat-card__icon { width: 40px; height: 40px; margin-bottom: 13px; }
  .to-top { width: 42px; height: 42px; }
}

/* Eng tor ekran — 320px (iPhone SE 1-avlod) */
@media (max-width: 340px) {
  .hero__pills { grid-template-columns: 1fr; }
  .lang button { padding: 4px 8px; }
  .topbar__portal { display: none; }
}

/* Bo'yi past, eni keng — telefon yotiq holatda */
@media (max-height: 460px) and (orientation: landscape) {
  .hero { padding-block: 40px 36px; }
  .nav { max-height: calc(100dvh - var(--header-h)); }
}

/* Sichqonchasiz qurilmalarda hover effektlari kerak emas */
@media (hover: none) {
  .program-card:hover, .stat-card:hover, .student-card:hover, .hero-pill:hover { transform: none; }
  .student-card:hover::after, .stat-card:hover::after, .program-card:hover::after { opacity: 0; }
  .btn:hover { transform: none; }
}

/* Animatsiyani kamaytirish so'ralgan bo'lsa */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .reveal { opacity: 1; transform: none; }
}

/* Chop etish */
@media print {
  .topbar, .header, .nav-scrim, .cta, .roster-toolbar, .hero__actions, .to-top, .skip-link { display: none !important; }
  .hero, .footer { background: #fff !important; color: #000 !important; }
  .hero__glow, .hero__grid { display: none !important; }
  .student-card, .stat-card, .program-card { break-inside: avoid; box-shadow: none; border: 1px solid #ccc; }
  .reveal { opacity: 1 !important; transform: none !important; }
}
