/* Rasmiy sayt uslubi.
 *
 * Palitra `resolver/portal.go` va `api/src/ommaviy/layout.ts` bilan
 * AYNAN bir xil — foydalanuvchi rasmiy saytdan qidiruv yoki yozuv
 * sahifasiga o'tganda bitta saytda qolayotganini his qilishi kerak.
 * Birini o'zgartirsangiz — qolganlarini ham o'zgartiring. */
:root{
  --qogoz:#f7f5f0; --karta:#fffdf9; --siyoh:#16181d; --sust:#5d6470;
  --chiziq:#ded8cc; --asos:#1d4e6f; --asos-toq:#143850; --asos-och:#e8eff4;
  --oxra:#8a5618; --oxra-och:#fbf3e6;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--qogoz); color:var(--siyoh);
  font:16px/1.65 "Segoe UI",-apple-system,Arial,sans-serif;
  background-image:repeating-linear-gradient(0deg,rgba(22,24,29,.014) 0 1px,transparent 1px 3px);
}
a{color:var(--asos)}

/* ------------------------------------------------------------ tepa */
.tepa{border-bottom:1px solid var(--chiziq);background:rgba(255,253,249,.8)}
.tepa-ich{max-width:1020px;margin:0 auto;padding:14px 24px;display:flex;
  align-items:baseline;gap:22px;flex-wrap:wrap}
.belgi{font:600 17px/1 Cambria,"Palatino Linotype",Georgia,serif;
  color:var(--asos-toq);text-decoration:none;letter-spacing:-.01em}
.belgi span{color:var(--oxra)}
.tepa nav{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap;font-size:14.5px}
.tepa nav a{color:var(--sust);text-decoration:none;padding:4px 10px;border-radius:6px}
.tepa nav a:hover{color:var(--asos);background:var(--asos-och)}
.tepa nav a[aria-current=page]{color:var(--asos-toq);background:var(--asos-och);font-weight:600}

main{max-width:1020px;margin:0 auto;padding:0 24px 70px}
main.tor{max-width:760px}

/* ------------------------------------------------------------ hero */
.hero{padding:64px 0 46px;text-align:left}
.hero h1{font-family:Cambria,"Palatino Linotype",Georgia,serif;
  font-size:clamp(30px,5vw,44px);line-height:1.15;letter-spacing:-.02em;
  margin:0 0 14px;color:var(--asos-toq);max-width:17em}
.hero h1 em{font-style:normal;color:var(--oxra)}
.hero .tag{color:var(--sust);font-size:18px;margin:0 0 26px;max-width:38em}
.muhr{display:inline-block;font-family:ui-monospace,Consolas,monospace;
  font-size:15px;background:var(--asos-och);color:var(--asos-toq);
  border:1px solid #c9dbe6;padding:5px 14px;border-radius:7px;letter-spacing:.03em}
.hero .harakat{margin-top:30px;display:flex;gap:12px;flex-wrap:wrap}
.tugma{display:inline-block;padding:12px 24px;border-radius:8px;
  font:600 15px/1.2 "Segoe UI",Arial,sans-serif;text-decoration:none;
  border:1px solid var(--asos-toq)}
.tugma-asosiy{background:var(--asos);color:#fff}
.tugma-asosiy:hover{background:var(--asos-toq)}
.tugma-ochiq{background:transparent;color:var(--asos)}
.tugma-ochiq:hover{background:var(--asos-och)}

/* -------------------------------------------------------- bo'limlar */
h2{font-family:Cambria,"Palatino Linotype",Georgia,serif;font-size:26px;
  letter-spacing:-.015em;margin:52px 0 6px;color:var(--asos-toq)}
h3{font-family:Cambria,"Palatino Linotype",Georgia,serif;font-size:18.5px;
  margin:0 0 8px;color:var(--asos-toq)}
.izoh{color:var(--sust);margin:0 0 22px;max-width:44em}

.kartalar{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
  gap:14px;margin:22px 0}
.karta{background:var(--karta);border:1px solid var(--chiziq);
  border-radius:10px;padding:20px 22px}
.karta p{margin:0;color:var(--sust);font-size:14.5px}
.karta .raqam{display:block;font-family:Cambria,Georgia,serif;font-size:15px;
  color:var(--oxra);margin-bottom:6px}

/* qadamlar */
.qadamlar{counter-reset:q;list-style:none;margin:22px 0;padding:0;
  display:grid;gap:10px}
.qadamlar li{background:var(--karta);border:1px solid var(--chiziq);
  border-radius:10px;padding:16px 20px 16px 62px;position:relative}
.qadamlar li::before{counter-increment:q;content:counter(q);
  position:absolute;left:18px;top:14px;width:30px;height:30px;
  border-radius:50%;background:var(--asos-och);color:var(--asos-toq);
  font:600 15px/30px Cambria,Georgia,serif;text-align:center}
.qadamlar b{color:var(--asos-toq)}
.qadamlar p{margin:3px 0 0;color:var(--sust);font-size:14.5px}

/* jadval */
table{width:100%;border-collapse:collapse;font-size:15px;margin:18px 0;
  background:var(--karta);border:1px solid var(--chiziq);border-radius:10px;
  overflow:hidden}
th,td{text-align:left;padding:11px 16px;border-bottom:1px solid var(--chiziq);
  vertical-align:top}
tbody tr:last-child td{border-bottom:0}
thead th{background:#f1eee7;color:var(--sust);font-size:12.5px;
  text-transform:uppercase;letter-spacing:.05em;font-weight:600}
code,.mono{font-family:ui-monospace,Consolas,monospace;font-size:13.5px;
  background:var(--asos-och);color:var(--asos-toq);padding:1px 6px;border-radius:4px}
td .yoq{color:var(--sust);font-style:italic}

.ogoh{background:var(--oxra-och);border:1px solid #e2cba1;color:var(--oxra);
  padding:13px 16px;border-radius:8px;margin:18px 0;font-size:14.5px;max-width:52em}

/* --------------------------------------------------------- hujjatlar */
.hujjat h1{font-family:Cambria,"Palatino Linotype",Georgia,serif;
  font-size:30px;letter-spacing:-.02em;margin:46px 0 4px;color:var(--asos-toq)}
.hujjat .versiya{color:var(--sust);font-size:14px;margin:0 0 30px}
.hujjat h2{font-size:21px;margin:38px 0 12px}
.hujjat p{max-width:52em;margin:0 0 12px}
.hujjat p.band>b:first-child{color:var(--asos-toq)}
.hujjat p.t{margin:0 0 8px 26px;max-width:50em}

/* ------------------------------------------------------------- past */
footer{border-top:1px solid var(--chiziq);margin-top:60px;
  background:rgba(255,253,249,.6)}
.past-ich{max-width:1020px;margin:0 auto;padding:26px 24px;display:flex;
  gap:26px;flex-wrap:wrap;color:var(--sust);font-size:14px}
.past-ich a{color:var(--sust)}
.past-ich a:hover{color:var(--asos)}
.past-ich .oz{margin-left:auto}
@media(max-width:700px){.past-ich .oz{margin-left:0}}