/* Vision School - sodda va tez sayt. Tashqi kutubxona YO'Q:
   har qanday hostingga faylni tashlash bilan ishlaydi. */

:root {
  --brand-1: #7C5CFF;
  --brand-2: #4A9BFF;
  --matn: #1B2438;
  --matn-2: #5B6478;
  --fon: #F5F7FC;
  --karta: #FFFFFF;
  --chek: #E4E9F2;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  font: 16px/1.65 -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif;
  color: var(--matn);
  background: var(--fon);
  -webkit-text-size-adjust: 100%;
}

a { color: #4A6BFF; }

.sahifa { max-width: 760px; margin: 0 auto; padding: 0 20px; }

/* --- Tepa --- */
header.tepa {
  background: linear-gradient(135deg, var(--brand-1), var(--brand-2));
  color: #fff;
  padding: 28px 0 34px;
}
header.tepa a { color: #fff; }
.brend { display: flex; align-items: center; gap: 12px; font-weight: 700; font-size: 19px; }
.brend .belgi {
  width: 38px; height: 38px; border-radius: 11px;
  background: rgba(255,255,255,.18);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px;
}
.menyu { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 16px; font-size: 15px; }
.menyu a { opacity: .92; text-decoration: none; }
.menyu a:hover { opacity: 1; text-decoration: underline; }

h1 { font-size: 30px; line-height: 1.25; margin: 26px 0 10px; }
header.tepa h1 { margin-top: 22px; }
header.tepa p.izoh { margin: 0; opacity: .93; font-size: 17px; max-width: 560px; }

/* --- Mazmun --- */
main { padding: 34px 0 10px; }
h2 { font-size: 22px; margin: 34px 0 12px; }
h3 { font-size: 18px; margin: 24px 0 8px; }
p { margin: 0 0 14px; }
ul, ol { margin: 0 0 14px; padding-left: 22px; }
li { margin-bottom: 6px; }

.karta {
  background: var(--karta);
  border: 1px solid var(--chek);
  border-radius: 14px;
  padding: 18px 20px;
  margin-bottom: 16px;
}

.imkoniyat { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.imkoniyat .karta { margin: 0; }
.imkoniyat b { display: block; margin-bottom: 4px; }
.imkoniyat span { color: var(--matn-2); font-size: 15px; }

table { width: 100%; border-collapse: collapse; margin: 0 0 16px; font-size: 15px; }
th, td { border: 1px solid var(--chek); padding: 8px 10px; text-align: left; vertical-align: top; }
th { background: #EEF2FA; }

blockquote {
  margin: 0 0 16px; padding: 10px 16px;
  border-left: 3px solid var(--brand-1);
  background: #fff; color: var(--matn-2);
}

hr { border: 0; border-top: 1px solid var(--chek); margin: 26px 0; }

code { background: #EEF2FA; padding: 1px 5px; border-radius: 4px; font-size: 14px; }

/* --- Past --- */
footer {
  margin-top: 40px;
  border-top: 1px solid var(--chek);
  background: #fff;
  padding: 24px 0 34px;
  color: var(--matn-2);
  font-size: 15px;
}
footer .qator { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-bottom: 10px; }

@media (max-width: 560px) {
  h1 { font-size: 25px; }
  header.tepa { padding: 22px 0 26px; }
}