:root{--bg:#001a33;--bg2:#00294a;--trace:#0e4568;--cy:#1ce3de;--cy2:#8af3ef;--gold:#fec724;--ink:#eaf6f8;--mute:#8fb3c4;
--panel:rgba(3,44,76,.78);--border:#1b5a82;--ok:#3ee3a6;--no:#ff9b7a;
--font:"Montserrat",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color-scheme:dark}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100vh;color:var(--ink);font:16px/1.55 var(--font);
background:radial-gradient(120% 80% at 50% 30%,var(--bg2) 0%,var(--bg) 70%) fixed,var(--bg)}
a{color:var(--cy)}a:hover{color:var(--cy2)}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{max-width:980px;margin:0 auto;padding:0 16px}
/* ---------- bosh sahifa ---------- */
.stage{position:relative;min-height:100svh;display:flex;flex-direction:column;overflow:hidden}
.traces{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;
-webkit-mask-image:radial-gradient(ellipse 34% 46% at 50% 46%,transparent 55%,#000 100%);mask-image:radial-gradient(ellipse 34% 46% at 50% 46%,transparent 55%,#000 100%)}
.traces .t{fill:none;stroke:var(--trace);stroke-width:2;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;animation:draw 1.4s cubic-bezier(.5,0,.2,1) forwards}
.traces .n{fill:var(--bg);stroke:var(--cy);stroke-width:2;opacity:0;animation:pop .4s ease-out forwards,glow 3.2s ease-in-out infinite}
.traces .z{fill:none;stroke:var(--cy);stroke-width:2.4;stroke-linecap:round;stroke-dasharray:.05 .95;stroke-dashoffset:1;opacity:0;
animation:run 4.5s linear infinite;filter:drop-shadow(0 0 4px var(--cy))}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes pop{to{opacity:.9}}
@keyframes glow{0%,100%{fill:var(--bg)}50%{fill:var(--cy)}}
@keyframes run{0%{stroke-dashoffset:1;opacity:0}8%{opacity:.9}70%{opacity:.9}100%{stroke-dashoffset:0;opacity:0}}
.center{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;
padding:clamp(28px,8vh,90px) 16px 24px;transition:padding .5s ease}
.emb{width:clamp(150px,30vw,230px);height:auto;border-radius:50%;
-webkit-mask-image:radial-gradient(circle at 50% 52%,#000 58%,transparent 71%);mask-image:radial-gradient(circle at 50% 52%,#000 58%,transparent 71%);
opacity:0;transform:scale(.55) rotate(-8deg);animation:emb .9s cubic-bezier(.2,1.4,.4,1) .55s forwards;transition:width .5s ease}
@keyframes emb{60%{opacity:1;transform:scale(1.06) rotate(1deg)}to{opacity:1;transform:none;filter:drop-shadow(0 0 28px rgba(28,227,222,.35))}}
.brand{margin:6px 0 0;font-weight:800;font-size:clamp(46px,11vw,96px);line-height:1;letter-spacing:.32em;color:var(--cy);
padding-left:.32em;opacity:0;animation:brand .9s ease-out 1.2s forwards;text-shadow:0 0 30px rgba(28,227,222,.25)}
@keyframes brand{to{opacity:1;letter-spacing:.04em;padding-left:.04em}}
.slogan{margin:8px 0 0;font-weight:700;font-size:clamp(15px,3.2vw,22px);letter-spacing:.14em;color:var(--gold);
opacity:0;animation:up .6s ease-out 1.75s forwards}
.lead{margin:10px 0 0;color:var(--mute);font-size:15px;opacity:0;animation:up .6s ease-out 1.95s forwards}
@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.sbox{position:relative;width:min(640px,100%);margin:30px auto 0;opacity:0;animation:up .7s cubic-bezier(.2,.9,.3,1) 2.2s forwards}
.sbox input{width:100%;font:600 clamp(17px,3.6vw,21px)/1.2 var(--font);color:var(--ink);background:rgba(0,26,51,.72);
border:2px solid var(--border);border-radius:999px;padding:18px 58px 18px 26px;transition:border-color .2s,box-shadow .2s}
.sbox input::placeholder{color:#6f93a6;font-weight:500}
.sbox input:focus{outline:none;border-color:var(--cy);box-shadow:0 0 0 5px rgba(28,227,222,.14),0 0 40px rgba(28,227,222,.18)}
.sbox svg{position:absolute;right:22px;top:50%;width:24px;height:24px;margin-top:-12px;stroke:var(--cy);fill:none;stroke-width:2.4;pointer-events:none}
.sbox input::-webkit-search-cancel-button{-webkit-appearance:none}
.quick{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:16px 0 0;opacity:0;animation:up .6s ease-out 2.45s forwards}
.quick button{font:600 14px/1 var(--font);color:var(--cy2);background:rgba(28,227,222,.08);border:1px solid rgba(28,227,222,.3);
border-radius:999px;padding:9px 14px;cursor:pointer;transition:background .15s,color .15s}
.quick button:hover{background:var(--cy);color:var(--bg)}
.vbtn{display:inline-flex;align-items:center;gap:10px;margin:22px 0 0;padding:13px 24px;border-radius:999px;font:700 16px/1 var(--font);
color:#00203d;background:var(--gold);text-decoration:none;opacity:0;animation:up .6s ease-out 2.6s forwards;box-shadow:0 0 30px rgba(254,199,36,.25)}
.vbtn:hover{color:#00203d;background:#ffd859}
/* vitrina */
.vgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px;margin:20px 0}
.vsbox{opacity:1;animation:none;margin:14px 0 0;width:100%}
.vcard{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--border);border-radius:20px;overflow:hidden;
color:var(--ink);text-decoration:none;opacity:0;animation:up .5s ease-out forwards;transition:border-color .2s,transform .2s}
.vcard:hover{border-color:var(--cy);transform:translateY(-3px);color:var(--ink)}
.vcard .ph{aspect-ratio:1/1;background:#fff;display:flex;align-items:center;justify-content:center}
.vcard .ph img{width:100%;height:100%;object-fit:contain}
.vcard .bd{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.vcard b{font-weight:700;font-size:16px;line-height:1.3;overflow-wrap:anywhere}
.vcard .pr{margin-top:auto;font-weight:800;font-size:20px;color:var(--gold)}
.vcard small{color:var(--mute);font-size:13px}
.vitem{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px;align-items:start}
.vitem .ph{background:#fff;border-radius:18px;overflow:hidden;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}
.vitem .ph img{width:100%;height:100%;object-fit:contain}
.bigpr{font-weight:800;font-size:clamp(28px,5vw,40px);color:var(--gold);margin:6px 0 14px}
@media (max-width:700px){.vitem{grid-template-columns:1fr}.vgrid{grid-template-columns:1fr 1fr;gap:10px}.vcard .bd{padding:10px 12px 12px}.vcard b{font-size:14px}.vcard .pr{font-size:17px}}
#res{width:min(640px,100%);margin:18px auto 0;text-align:left}
.res{background:var(--panel);border:1px solid var(--border);border-radius:16px;overflow:hidden;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.res a,.list li a{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:13px 18px;
border-bottom:1px solid rgba(27,90,130,.55);color:var(--ink);text-decoration:none}
.res a:last-child,.list li:last-child a{border-bottom:0}
.res a:hover,.list li a:hover{background:rgba(28,227,222,.08)}
.nm{min-width:0;overflow-wrap:anywhere}
#res .res a{animation:up .25s ease-out both}
.empty{color:var(--mute);text-align:center}
.mini{position:relative;z-index:1;display:flex;flex-wrap:wrap;justify-content:center;gap:6px 22px;padding:16px 16px 22px;
color:var(--mute);font-size:14px;opacity:0;animation:up .6s ease-out 2.7s forwards}
.mini a{color:var(--mute)}.mini a:hover{color:var(--cy)}
body.searching .center{padding-top:20px}body.searching .emb{width:96px}
@media (max-width:560px){.sbox input{padding:16px 52px 16px 20px}.mini{flex-direction:column;align-items:center;text-align:center;gap:4px}
.traces{-webkit-mask-image:radial-gradient(ellipse 60% 40% at 50% 45%,transparent 50%,#000 100%);mask-image:radial-gradient(ellipse 60% 40% at 50% 45%,transparent 50%,#000 100%)}}
/* ---------- ichki sahifalar ---------- */
header{position:relative;z-index:2;border-bottom:1px solid var(--border);background:rgba(0,26,51,.85);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.top{display:flex;align-items:center;gap:12px;padding:10px 0}
.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex:1;min-width:0}
.logo img{width:44px;height:44px;border-radius:50%;-webkit-mask-image:radial-gradient(circle,#000 60%,transparent 72%);mask-image:radial-gradient(circle,#000 60%,transparent 72%)}
.logo b{font-weight:800;font-size:22px;letter-spacing:.06em;color:var(--cy)}
.logo span{color:var(--gold);font-size:12px;font-weight:700;letter-spacing:.1em;white-space:nowrap}
.btn{display:inline-flex;align-items:center;gap:8px;border-radius:999px;padding:11px 18px;font:700 15px/1.2 var(--font);
border:1.5px solid var(--border);color:var(--ink);background:rgba(0,26,51,.5);text-decoration:none;white-space:nowrap;transition:border-color .15s,background .15s}
.btn:hover{border-color:var(--cy);color:var(--ink)}
.btn.p{background:var(--cy);border-color:var(--cy);color:#00203d}.btn.p:hover{background:var(--cy2);border-color:var(--cy2);color:#00203d}
main.wrap{position:relative;z-index:1}
.crumbs{font-size:14px;color:var(--mute);margin:22px 0 0}.crumbs a{color:var(--mute)}
h1.pn{font-weight:800;font-size:clamp(24px,4.4vw,38px);line-height:1.15;margin:10px 0 14px;overflow-wrap:anywhere;max-width:32ch}
h2{font-weight:800;font-size:clamp(20px,3.2vw,26px);margin:40px 0 14px}
.card{background:var(--panel);border:1px solid var(--border);border-radius:20px;padding:24px;margin:18px 0;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.card p{max-width:68ch}
.st{display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;padding:8px 14px;border-radius:999px}
.st::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 10px currentColor}
.st.bor{background:rgba(62,227,166,.12);color:var(--ok)}.st.yoq{background:rgba(255,155,122,.12);color:var(--no)}
.st .ru{color:inherit;opacity:.75;font-size:13px}
.spec{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:18px 0;font-size:15px}
.spec dt{color:var(--mute)}.spec dd{margin:0;font-weight:600}
.actions{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0 4px}
.pimg{max-width:100%;max-height:320px;border-radius:12px;display:block;margin:0 0 16px;background:#fff}
.list{list-style:none;padding:0;margin:0}
.res a.hasp{align-items:center}.res .th{width:52px;height:52px;border-radius:10px;object-fit:cover;flex:none;background:#fff}
.res .nm{flex:1}.res .rp{font-weight:800;color:var(--gold);white-space:nowrap}
.vimg{max-height:420px}
.dot{font-weight:700;font-size:13px;white-space:nowrap}.dot.bor{color:var(--ok)}.dot.yoq{color:var(--no)}
.pager{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0}
.pager a,.pager b,.pager span{font-weight:700;font-size:14px;padding:8px 12px;border-radius:999px;border:1px solid var(--border);text-decoration:none;color:var(--ink);background:rgba(0,26,51,.5)}
.pager b{background:var(--cy);color:#00203d;border-color:var(--cy)}
.meta{color:var(--mute);font-size:14px;margin:8px 0}.ru{color:var(--mute);font-size:15px}
.shop{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.shop div{background:var(--panel);border:1px solid var(--border);border-radius:16px;padding:16px 18px}
.shop small{display:block;color:var(--gold);font-weight:700;font-size:12px;letter-spacing:.08em;margin-bottom:6px}
.shop p{margin:0 0 4px}
footer{position:relative;z-index:1;margin-top:48px;padding:24px 0 40px;color:var(--mute);font-size:14px;border-top:1px solid var(--border)}
footer p{margin:6px 0 0;max-width:72ch}
@media (max-width:600px){.logo span,.hide-s{display:none}.btn{padding:10px 14px}.card{padding:18px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition:none!important}
.traces .z{display:none}}