/* ===== shacsimdev.uz — maket asosida (qorong'u, binafsha-ko'k gradient, kartalar) ===== */
:root{--bg:#070a14;--bg2:#0b0f1c;--card:#0f1424;--card2:#121a2e;--line:rgba(255,255,255,.08);--line2:rgba(255,255,255,.14);--fg:#eef1ff;--muted:#8d95b3;--p1:#6d5cff;--p2:#3b82f6;--p3:#a855f7;--teal:#14b8a6;--r:18px;--rl:26px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
body{margin:0;background:var(--bg);color:var(--fg);font-family:Inter,system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}img{max-width:100%;display:block}
.wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:1.1rem}@media(min-width:768px){.wrap{padding-inline:2rem}}
.muted{color:var(--muted)}.small{font-size:.85rem}.mono{font-family:ui-monospace,Menlo,monospace;font-size:.85rem}
h1,h2,h3{margin:0;letter-spacing:-.02em;line-height:1.15}h1{font-size:clamp(2.1rem,5.2vw,3.4rem);font-weight:800}h2,.h2{font-size:clamp(1.55rem,3vw,2.1rem);font-weight:800}h3,.h3{font-size:1.1rem;font-weight:700}
.grad{background:linear-gradient(90deg,#8b7cff,#4f8cff);-webkit-background-clip:text;background-clip:text;color:transparent}.grad2{background:linear-gradient(90deg,#4f8cff,#7aa7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.h1big{font-size:6rem;font-weight:800;margin:0}.center{text-align:center}
/* fon */
.bg{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(900px 500px at 15% -10%,rgba(109,92,255,.22),transparent 60%),radial-gradient(700px 500px at 90% 20%,rgba(59,130,246,.16),transparent 60%),var(--bg)}
.orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.45;will-change:transform}.o1{width:46vw;height:46vw;max-width:620px;max-height:620px;left:-12vw;top:-12vw;background:radial-gradient(circle,rgba(109,92,255,.8),transparent 70%);animation:o1 26s ease-in-out infinite alternate}.o2{width:40vw;height:40vw;max-width:540px;max-height:540px;right:-10vw;top:30vh;background:radial-gradient(circle,rgba(59,130,246,.6),transparent 70%);animation:o2 32s ease-in-out infinite alternate}
@keyframes o1{to{transform:translate(14vw,12vh) scale(1.15)}}@keyframes o2{to{transform:translate(-14vw,18vh) scale(.9)}}
/* header */
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,10,20,.72);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.header-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:64px}
.brand{display:inline-flex;align-items:center;gap:.5rem;font-weight:800;font-size:1.15rem}.brand-ico{color:#8b7cff;font-weight:800;font-family:ui-monospace,Menlo,monospace;font-size:.95rem}
.nav{display:none;gap:1.6rem}@media(min-width:1024px){.nav{display:flex}}.nav a{font-size:.9rem;color:rgba(255,255,255,.75);padding:.3rem 0;border-bottom:2px solid transparent}.nav a:hover,.nav a.active{color:#fff;border-color:#6d5cff}
.header-actions{display:flex;align-items:center;gap:.6rem}.langs{display:inline-flex;border:1px solid var(--line2);border-radius:999px;padding:.2rem;gap:.1rem}.lang{border-radius:999px;padding:.3rem .55rem;font-size:.75rem;font-weight:700;color:rgba(255,255,255,.6)}.lang:hover{color:#fff}.lang.active{background:rgba(255,255,255,.12);color:#fff}
.burger{display:inline-flex;flex-direction:column;gap:5px;background:none;border:0;padding:.5rem;cursor:pointer}@media(min-width:1024px){.burger{display:none}}.burger span{width:22px;height:2px;background:#fff;border-radius:2px;transition:.2s}
.burger[aria-expanded=true] span:nth-child(1){transform:translateY(7px) rotate(45deg)}.burger[aria-expanded=true] span:nth-child(2){opacity:0}.burger[aria-expanded=true] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav[hidden]{display:none}.mobile-nav{position:absolute;inset-inline:.75rem;top:70px;background:#0b0f1c;border:1px solid var(--line2);border-radius:var(--r);padding:.6rem;display:flex;flex-direction:column;gap:.2rem;box-shadow:0 30px 60px -20px #000}.mobile-nav a{padding:.8rem 1rem;border-radius:12px;font-weight:600}.mobile-nav a:hover{background:rgba(255,255,255,.06)}.mobile-nav .btn{margin-top:.4rem}
.hide-m{display:none}@media(min-width:1024px){.hide-m{display:inline-flex}}
/* tugmalar */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.7rem 1.3rem;border-radius:12px;font-weight:700;font-size:.92rem;border:1px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s,border-color .2s}
.btn:active{transform:translateY(1px)}.btn-grad{background:linear-gradient(90deg,#6d5cff,#3b82f6);color:#fff;box-shadow:0 10px 30px -12px rgba(109,92,255,.9)}.btn-grad:hover{box-shadow:0 14px 34px -10px rgba(109,92,255,1);transform:translateY(-1px)}
.btn-ghost{background:rgba(255,255,255,.04);border-color:var(--line2);color:#fff}.btn-ghost:hover{background:rgba(255,255,255,.09);border-color:#fff}.btn-sm{min-height:38px;padding:.5rem 1rem;font-size:.85rem}
.arrow{transition:transform .2s}.btn:hover .arrow{transform:translateX(3px)}
.pill-link{display:inline-flex;align-items:center;gap:.4rem;border:1px solid var(--line2);border-radius:999px;padding:.5rem 1rem;font-size:.85rem;font-weight:600;color:rgba(255,255,255,.85);background:rgba(255,255,255,.03)}.pill-link:hover{border-color:#fff}
.chip{display:inline-flex;align-items:center;border:1px solid rgba(109,92,255,.5);background:rgba(109,92,255,.12);color:#c7c1ff;border-radius:999px;padding:.35rem .8rem;font-size:.78rem;font-weight:600}
.tag{display:inline-flex;border:1px solid var(--line2);background:rgba(255,255,255,.04);border-radius:999px;padding:.28rem .7rem;font-size:.75rem;font-weight:600;color:rgba(255,255,255,.85)}.tags{display:flex;flex-wrap:wrap;gap:.4rem}.tag-accent{border-color:rgba(109,92,255,.6);background:rgba(109,92,255,.15);color:#c7c1ff}.role{margin:0}.role-line{margin:.8rem 0 0}
/* kartalar */
.card{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--line);border-radius:var(--r);transition:transform .25s cubic-bezier(.2,.8,.2,1),border-color .25s,box-shadow .25s}
.card:hover{transform:translateY(-4px);border-color:var(--line2);box-shadow:0 30px 60px -30px rgba(109,92,255,.5)}
.section{padding-block:3rem}@media(min-width:768px){.section{padding-block:4.5rem}}
.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1.6rem}.section-head p{margin:.3rem 0 0}
.page-top{padding-top:2.5rem}@media(min-width:768px){.page-top{padding-top:3.5rem}}
/* hero */
.hero{padding-top:1rem}@media(min-width:768px){.hero{padding-top:1.5rem}}
.hero-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:var(--rl);background:radial-gradient(800px 400px at 80% 0%,rgba(59,130,246,.2),transparent 60%),radial-gradient(600px 400px at 10% 100%,rgba(109,92,255,.18),transparent 60%),var(--card);display:grid;gap:2rem;padding:1.6rem}
@media(min-width:1024px){.hero-card{grid-template-columns:1.05fr .95fr;align-items:center;padding:2.4rem 2.6rem;min-height:480px}}
.hero h1{margin-top:1rem}.lead{color:rgba(255,255,255,.78);font-size:1.02rem;line-height:1.65;margin:1rem 0 0;max-width:36rem}@media(min-width:768px){.lead{font-size:1.1rem}}
.actions{display:flex;flex-wrap:wrap;gap:.7rem;margin-top:1.5rem;align-items:center}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin:1.8rem 0 0;padding:0}@media(min-width:640px){.stats{grid-template-columns:repeat(4,auto);justify-content:start;gap:2.2rem}}
.stats div{padding-left:.9rem;border-left:1px solid var(--line2)}.stats dt{font-size:1.5rem;font-weight:800;background:linear-gradient(90deg,#fff,#b8b0ff);-webkit-background-clip:text;background-clip:text;color:transparent}.stats dd{margin:.15rem 0 0;font-size:.78rem;color:var(--muted)}
.stats-mini{margin-top:1rem;background:rgba(0,0,0,.35);border:1px solid var(--line);border-radius:14px;padding:.9rem 1rem;grid-template-columns:repeat(3,1fr);gap:1rem}@media(min-width:640px){.stats-mini{grid-template-columns:repeat(3,1fr)}}
/* hero visual (CSS bilan chizilgan ish stoli) */
.hero-visual{position:relative;min-height:320px}@media(min-width:1024px){.hero-visual{min-height:400px}}
.neon-quote{position:absolute;left:0;top:0;z-index:3;font-family:Caveat,cursive;font-size:1.5rem;color:#c9c2ff;text-shadow:0 0 12px rgba(139,124,255,.9),0 0 30px rgba(109,92,255,.6);transform:rotate(-8deg);max-width:9rem;line-height:1.05}.neon-quote .curl{display:block;font-size:1.3rem;margin-top:.1rem;padding-left:2rem}.neon-quote.q2{left:auto;right:1rem;top:-.5rem;max-width:8rem}
.desk{position:relative;height:100%;min-height:320px;border-radius:var(--r);overflow:hidden;background:radial-gradient(500px 260px at 60% 30%,rgba(59,130,246,.35),transparent 60%),linear-gradient(180deg,#0d1327 0%,#0a0e1c 100%);border:1px solid var(--line)}
.desk-2{min-height:260px}
.glow{position:absolute;inset:auto 10% -30% 10%;height:60%;background:radial-gradient(closest-side,rgba(109,92,255,.55),transparent);filter:blur(30px)}
.monitor{position:absolute;left:12%;top:12%;width:62%;aspect-ratio:16/10;background:#050813;border:2px solid #2a3355;border-radius:10px;box-shadow:0 0 0 1px #0b1020,0 30px 60px -20px rgba(59,130,246,.6);overflow:hidden}
.monitor::after{content:"";position:absolute;left:40%;bottom:-18px;width:20%;height:18px;background:#1b2340}
.code{padding:.7rem .9rem;font-family:ui-monospace,Menlo,monospace;font-size:clamp(.5rem,1.05vw,.72rem);line-height:1.6;color:#c8d0ff}.code .ln{display:block;white-space:pre}.code .k{color:#c792ea;font-style:normal}.code .f{color:#82aaff;font-style:normal}.code .s{color:#c3e88d;font-style:normal}.code .d{color:#ffcb6b;font-style:normal}.code .c{color:#f78c6c;font-style:normal}
.code .cursor::after{content:"";display:inline-block;width:.5em;height:1em;background:#82aaff;vertical-align:-.15em;animation:blink 1s step-end infinite}@keyframes blink{50%{opacity:0}}
.laptop{position:absolute;left:4%;bottom:6%;width:34%;aspect-ratio:16/11;background:#0a0f20;border:2px solid #2a3355;border-radius:8px 8px 4px 4px;transform:perspective(600px) rotateY(18deg);box-shadow:0 20px 40px -20px #000}.laptop-screen{padding:10% 10% 0;display:grid;gap:6%}.laptop-screen span{height:6px;border-radius:3px;background:linear-gradient(90deg,#6d5cff,#3b82f6);opacity:.8}.laptop-screen span:nth-child(2){width:70%;opacity:.5}.laptop-screen span:nth-child(3){width:85%;opacity:.6}.laptop-screen span:nth-child(4){width:50%;opacity:.4}
.phone{position:absolute;right:8%;bottom:8%;width:14%;aspect-ratio:9/18;background:#0a0f20;border:2px solid #2a3355;border-radius:14px;transform:perspective(600px) rotateY(-16deg);box-shadow:0 20px 40px -20px #000}.phone-screen{padding:14% 12%;display:grid;gap:8%}.phone-screen b{height:14%;border-radius:4px;background:linear-gradient(90deg,#6d5cff,#3b82f6)}.phone-screen i{height:7%;border-radius:3px;background:rgba(255,255,255,.25)}.phone-screen em{height:20%;border-radius:6px;background:rgba(59,130,246,.35)}
.badge-card{position:absolute;right:-.2rem;bottom:-.6rem;z-index:3;display:flex;align-items:center;gap:.7rem;background:rgba(10,14,28,.9);border:1px solid rgba(109,92,255,.6);border-radius:999px;padding:.6rem 1.1rem .6rem .6rem;box-shadow:0 20px 40px -18px rgba(109,92,255,.9);backdrop-filter:blur(10px)}.badge-card b{display:block;font-size:.85rem}.badge-card small{color:var(--muted);font-size:.72rem}.badge-ico{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#6d5cff,#3b82f6);font-family:ui-monospace,Menlo,monospace;font-weight:800;font-size:.8rem}
/* texnologiyalar */
.tech-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem}@media(min-width:640px){.tech-grid{grid-template-columns:repeat(5,1fr)}}@media(min-width:1024px){.tech-grid{grid-template-columns:repeat(10,1fr)}}
.tech{display:flex;flex-direction:column;align-items:center;gap:.6rem;padding:1rem .5rem;background:var(--card);border:1px solid var(--line);border-radius:14px;font-size:.8rem;font-weight:600;transition:transform .2s,border-color .2s,background .2s}.tech:hover{transform:translateY(-4px);border-color:rgba(109,92,255,.7);background:var(--card2)}.tech img{width:36px;height:36px}
.tech-more{display:none}.tech-grid.open .tech-more{display:flex}
/* loyihalar */
.projects-grid{display:grid;gap:1rem}@media(min-width:640px){.projects-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.projects-grid{grid-template-columns:repeat(3,1fr)}}
.project-card{overflow:hidden;display:flex;flex-direction:column}.project-img{display:block;aspect-ratio:16/10;overflow:hidden;background:#0a0f20}.project-img img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform .6s}.project-card:hover .project-img img{transform:scale(1.04)}
.project-body{padding:1rem 1.1rem 1.2rem;display:flex;flex-direction:column;gap:.55rem}.project-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem}.project-body p{margin:0;font-size:.88rem}.ext{color:var(--muted);font-size:1.1rem}.ext:hover{color:#fff}
/* xizmatlar */
.services-grid{display:grid;gap:1rem}@media(min-width:640px){.services-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.services-grid{grid-template-columns:repeat(3,1fr)}}
.service{position:relative;padding:1.3rem;display:flex;flex-direction:column;gap:.5rem;min-height:190px}.service p{margin:0;font-size:.86rem;line-height:1.5}.service-ico{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border-radius:12px;background:var(--c);box-shadow:0 12px 30px -12px var(--c);color:#fff;margin-bottom:.4rem}
.circle-arrow{position:absolute;right:1rem;bottom:1rem;width:30px;height:30px;border:1px solid var(--line2);border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:.9rem;color:rgba(255,255,255,.8);transition:.2s}.service:hover .circle-arrow{background:#fff;color:#070a14;border-color:#fff}
/* about */
.about-card{display:grid;gap:2rem;border:1px solid var(--line);border-radius:var(--rl);background:var(--card);padding:1.6rem}@media(min-width:1024px){.about-card{grid-template-columns:1.05fr .95fr;padding:2.4rem 2.6rem;align-items:center}}
.underline{display:block;width:44px;height:3px;border-radius:3px;background:linear-gradient(90deg,#6d5cff,#3b82f6);margin:.8rem 0 1rem}.about-text p{color:rgba(255,255,255,.8);line-height:1.7;margin:0}.fullname{margin:.2rem 0 0;font-size:.95rem;color:#c7c1ff;font-weight:600}.fullname small{display:block;color:var(--muted);font-weight:500;font-size:.8rem}
.checks{list-style:none;padding:0;margin:1.2rem 0 0;display:grid;gap:.6rem}.checks li{display:flex;align-items:center;gap:.6rem;font-size:.95rem}.checks li::before{content:"✓";color:#3b82f6;font-weight:800}
.about-visual{position:relative}
/* aloqa */
.contact-grid{display:grid;gap:1.5rem}@media(min-width:1024px){.contact-grid{grid-template-columns:1fr .9fr;align-items:start}}
.contact-cards{display:grid;gap:.8rem;margin-top:1.5rem}@media(min-width:640px){.contact-cards{grid-template-columns:repeat(3,1fr)}}@media(min-width:1024px){.contact-cards{grid-template-columns:repeat(3,1fr)}}
.contact-card{display:flex;align-items:center;gap:.8rem;padding:1rem}.contact-card b{display:block;font-size:.9rem}.contact-card small{color:var(--muted);font-size:.75rem;word-break:break-all}.c-ico{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:12px;background:var(--c);color:#fff;flex-shrink:0}
.form{padding:1.4rem;display:grid;gap:.8rem}.form h3{margin-bottom:0}.form-hint{display:flex;align-items:center;gap:.5rem;margin:0 0 .3rem;color:#a5b4fc}.form-hint svg{flex-shrink:0;width:16px;height:16px}.form input,.form textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid var(--line2);border-radius:12px;padding:.8rem 1rem;color:#fff;font:inherit;font-size:.95rem}.form input::placeholder,.form textarea::placeholder{color:rgba(255,255,255,.4)}.form input:focus,.form textarea:focus{outline:none;border-color:#6d5cff;box-shadow:0 0 0 3px rgba(109,92,255,.25)}
.row2{display:grid;gap:.8rem}@media(min-width:640px){.row2{grid-template-columns:1fr 1fr}}.hp{position:absolute;left:-9999px}.form-msg{margin:0;font-size:.88rem;min-height:1.2em}.form-msg.ok{color:#6ee7b7}.form-msg.err{color:#fca5a5}.form .btn{width:100%}
/* detal */
.shot{position:relative;margin-top:1.8rem;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:#0a0f20}.shot>img:first-child{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top}.shot-m{position:absolute;right:1.5%;bottom:-2%;width:22%;border:2px solid var(--line2);border-radius:14px;box-shadow:0 30px 60px -20px #000;display:none}@media(min-width:640px){.shot-m{display:block}}
.detail-grid{display:grid;gap:1.5rem;margin-top:2rem}@media(min-width:1024px){.detail-grid{grid-template-columns:1.2fr .8fr}}.prose p{color:rgba(255,255,255,.82);line-height:1.75;margin:0 0 1rem;font-size:1.02rem}.side{padding:1.2rem;height:fit-content}.side .tags{margin-top:.6rem}
/* footer */
.site-footer{border-top:1px solid var(--line);margin-top:3rem;padding:2rem 0 1.2rem}.footer-in{display:grid;gap:1.2rem;align-items:center}@media(min-width:768px){.footer-in{grid-template-columns:1fr auto auto}}.footer-in .muted{margin:.4rem 0 0}
.footer-nav{display:flex;flex-wrap:wrap;gap:1rem;font-size:.85rem;color:rgba(255,255,255,.7)}.footer-nav a:hover{color:#fff}
.socials{display:flex;gap:.5rem}.socials a{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:1px solid var(--line2);border-radius:50%;color:rgba(255,255,255,.8)}.socials a:hover{border-color:#fff;color:#fff}.socials .up{background:linear-gradient(135deg,#6d5cff,#3b82f6);border:0;color:#fff;font-weight:800}
.copy{margin-top:1.4rem}
/* reveal */
.reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.8,.2,1)}.reveal.in{opacity:1;transform:none}
@media(max-width:639px){.btn{width:100%}.btn-inline,header .btn,.actions .btn{width:auto}.actions .btn{flex:1 1 auto}.section-head{flex-direction:column;align-items:flex-start}.badge-card{right:0;bottom:-.4rem;padding:.45rem .8rem .45rem .45rem}.neon-quote{font-size:1.2rem}}