.ux-page{background:#090b10;color:#f4f5f7}.ux-lang{border:1px solid var(--line);background:transparent;color:#b9bdc7;border-radius:7px;padding:9px 12px;font:700 10px Manrope;cursor:pointer}.ux-hero{position:relative;min-height:820px;padding:180px 0 110px;overflow:hidden;background:radial-gradient(circle at 80% 20%,rgba(255,126,25,.14),transparent 28%),linear-gradient(145deg,#080a0f,#10131b 60%,#0c0e15)}.ux-hero:before{content:"";position:absolute;inset:0;opacity:.23;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,#000,transparent 90%)}.ux-hero-grid{position:relative;display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center}.ux-hero-copy{position:relative;z-index:2}.ux-hero-copy h1{max-width:680px;margin:25px 0 28px;font-size:clamp(56px,6.3vw,88px);line-height:.96;letter-spacing:-5px;font-weight:500}.ux-hero-copy p{max-width:610px;color:#a5aab5;font-size:16px;line-height:1.85}.ux-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px}.ux-proof{display:flex;align-items:center;gap:10px;margin-top:38px;color:#858a96;font-size:11px}.ux-proof>span:first-child{color:#ff8b22}.ux-hero-visual{height:570px;position:relative}.ux-glow{position:absolute;width:490px;height:490px;left:50%;top:50%;transform:translate(-50%,-50%);border-radius:50%;background:radial-gradient(circle,rgba(255,126,25,.2),transparent 66%);filter:blur(10px)}.ux-board{position:absolute;left:4%;top:8%;width:88%;height:78%;border:1px solid rgba(255,255,255,.2);border-radius:18px;background:rgba(20,23,31,.94);box-shadow:0 40px 90px rgba(0,0,0,.45);overflow:hidden;transform:rotate(-4deg);animation:ux-board-float 6s ease-in-out infinite}.ux-board-bar{height:42px;display:flex;align-items:center;gap:6px;padding:0 15px;border-bottom:1px solid rgba(255,255,255,.1)}.ux-board-bar span{width:7px;height:7px;border-radius:50%;background:#f47a22}.ux-board-bar span:nth-child(2){opacity:.55}.ux-board-bar span:nth-child(3){opacity:.25}.ux-board-bar b{margin-left:auto;color:#7f8591;font:8px monospace}.ux-board-body{height:calc(100% - 42px);display:flex}.ux-board-body aside{width:52px;padding:18px 13px;border-right:1px solid rgba(255,255,255,.08)}.ux-board-body aside i{display:block;width:24px;height:5px;margin-bottom:20px;border-radius:5px;background:#363b47}.ux-board-body aside i:first-child{background:#ff8520}.ux-canvas{flex:1;padding:25px}.ux-canvas-title{color:#f5f5f6;font-size:12px}.ux-canvas-title small{margin-left:8px;color:#ff932f;font-size:8px}.ux-components{position:relative;height:calc(100% - 35px);margin-top:15px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:radial-gradient(circle at 50% 30%,rgba(255,255,255,.08),transparent 52%),#171a23}.ux-phone{position:absolute;width:110px;height:215px;padding:13px 9px;border:4px solid #252a35;border-radius:19px;background:#fbfaf8;box-shadow:0 15px 30px rgba(0,0,0,.35);color:#15171c}.ux-phone strong{display:block;color:#f17417;font-size:8px}.ux-phone em{display:block;height:55px;margin-top:12px;border-radius:7px;background:linear-gradient(145deg,#f47c1c,#ffd39f)}.ux-phone span{display:block;height:7px;margin-top:9px;border-radius:5px;background:#e5e4e1}.ux-phone-a{left:17%;top:20px;transform:rotate(-6deg)}.ux-phone-b{right:15%;bottom:8px;transform:rotate(7deg)}.ux-phone-b em{background:linear-gradient(145deg,#242733,#969ba8)}.ux-palette{position:absolute;right:8%;top:15%;display:flex;gap:7px}.ux-palette i{width:17px;height:17px;border-radius:50%;background:#ff7b16}.ux-palette i:nth-child(2){background:#ffb52e}.ux-palette i:nth-child(3){background:#7859d8}.ux-palette i:nth-child(4){background:#48b6a4}.ux-float-card{position:absolute;padding:14px 16px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(20,23,31,.9);box-shadow:0 20px 45px rgba(0,0,0,.35);backdrop-filter:blur(12px)}.ux-float-card small,.ux-float-card strong,.ux-float-card span{display:block}.ux-float-card small{color:#888e9b;font-size:7px;letter-spacing:1px}.ux-float-card strong{margin-top:5px;color:#fff;font-size:20px}.ux-float-card span{margin-top:4px;color:#61d69c;font-size:8px}.ux-float-top{right:-2%;top:7%}.ux-float-bottom{left:-2%;bottom:6%;display:flex;align-items:center;gap:10px}.ux-float-bottom strong{font-size:10px}.ux-float-bottom small{margin-top:4px;letter-spacing:0}.ux-status-dot{width:8px;height:8px;border-radius:50%;background:#5cda9b;box-shadow:0 0 0 6px rgba(92,218,155,.12)}.ux-cursor{position:absolute;z-index:3;color:#ff8520;font-size:23px;filter:drop-shadow(0 0 10px rgba(255,133,32,.7));animation:ux-cursor-float 4s ease-in-out infinite}.ux-cursor-one{left:7%;top:28%}.ux-cursor-two{right:6%;bottom:22%;animation-delay:-2s}.ux-about{background:#f1efea;color:#181818}.ux-about-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px}.ux-about h2,.ux-services h2,.ux-process h2,.ux-placeholder h2{margin:18px 0;font-size:clamp(44px,5.2vw,72px);line-height:1.02;letter-spacing:-4px;font-weight:500}.ux-about p{color:#656565;font-size:16px;line-height:1.9}.ux-services{background:#0d1016}.ux-service-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.ux-service-grid article{min-height:235px;padding:25px;border:1px solid rgba(255,255,255,.1);border-radius:15px;background:linear-gradient(145deg,rgba(255,255,255,.055),rgba(255,255,255,.012));transition:transform .3s,border-color .3s}.ux-service-grid article:hover{transform:translateY(-6px);border-color:rgba(255,131,28,.55)}.ux-service-grid b{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:rgba(255,129,28,.13);color:#ff8a24;font-size:22px}.ux-service-grid h3{margin:28px 0 10px;font-size:18px}.ux-service-grid p{margin:0;color:#9197a3;font-size:11px;line-height:1.7}.ux-process{background:#f1efea;color:#181818}.ux-timeline{display:grid;grid-template-columns:repeat(7,1fr);border-top:1px solid rgba(0,0,0,.2)}.ux-timeline article{position:relative;min-height:215px;padding:26px 18px;border-right:1px solid rgba(0,0,0,.14)}.ux-timeline article:last-child{border-right:0}.ux-timeline article:before{content:"";position:absolute;top:-5px;left:18px;width:9px;height:9px;border-radius:50%;background:#f47617;box-shadow:0 0 0 5px #f1efea,0 0 0 6px rgba(244,118,23,.45)}.ux-timeline b{color:#e96d14;font:10px monospace}.ux-timeline h3{margin:40px 0 10px;font-size:18px}.ux-timeline p{margin:0;color:#6d6d6b;font-size:11px;line-height:1.7}.ux-placeholder{background:#0b0d12}.ux-placeholder-inner{min-height:360px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;border:1px dashed rgba(255,255,255,.16);border-radius:20px;background:radial-gradient(circle at 50% 20%,rgba(255,125,22,.08),transparent 50%)}.ux-placeholder h2{margin-bottom:14px}.ux-placeholder p{margin:0;color:#9298a3;font-size:15px}.ux-cta{margin-top:0;margin-bottom:80px;background:linear-gradient(130deg,#191b22,#321b0c);border-color:rgba(255,132,28,.32)}.ux-cta h2{max-width:670px;margin-top:16px;font-size:clamp(38px,4.5vw,64px);line-height:1;letter-spacing:-3px}.ux-cta .section-tag{color:#ff8a24}@keyframes ux-board-float{0%,100%{transform:rotate(-4deg) translateY(0)}50%{transform:rotate(-3deg) translateY(-9px)}}@keyframes ux-cursor-float{0%,100%{transform:translateY(0) rotate(-10deg)}50%{transform:translateY(-15px) rotate(10deg)}}
@media(max-width:1050px){.ux-service-grid{grid-template-columns:repeat(3,1fr)}.ux-timeline{grid-template-columns:repeat(4,1fr);row-gap:30px}.ux-timeline article:nth-child(4){border-right:0}.ux-timeline article:nth-child(n+5){border-top:1px solid rgba(0,0,0,.14)}}
@media(max-width:900px){.ux-hero{padding-top:140px}.ux-hero-grid,.ux-about-grid{grid-template-columns:1fr;gap:55px}.ux-hero-visual{height:500px}.ux-about-grid{gap:25px}.ux-service-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.ux-hero{min-height:auto;padding:120px 0 75px}.ux-hero-copy h1{font-size:48px;letter-spacing:-3px}.ux-hero-copy p{font-size:14px}.ux-hero-visual{height:370px}.ux-board{left:0;width:100%;height:78%}.ux-canvas{padding:16px}.ux-phone{width:82px;height:170px}.ux-phone-a{left:12%}.ux-phone-b{right:9%}.ux-float-top{right:-4%;top:0}.ux-float-bottom{left:-4%;bottom:0}.ux-about h2,.ux-services h2,.ux-process h2,.ux-placeholder h2{font-size:43px;letter-spacing:-2.5px}.ux-about p{font-size:14px}.ux-service-grid{grid-template-columns:1fr}.ux-service-grid article{min-height:190px}.ux-timeline{grid-template-columns:1fr 1fr}.ux-timeline article{min-height:185px;border-right:1px solid rgba(0,0,0,.14);border-top:1px solid rgba(0,0,0,.14)}.ux-timeline article:nth-child(2n){border-right:0}.ux-timeline article:before{top:-5px}.ux-timeline h3{margin-top:32px}.ux-cta{display:block;margin:0 15px 55px;padding:35px 24px}.ux-cta h2{font-size:40px}.ux-lang{padding:8px}.nav-actions{gap:6px}}
[dir="rtl"] .ux-page{text-align:right}[dir="rtl"] .ux-hero-grid,[dir="rtl"] .ux-about-grid{direction:rtl}[dir="rtl"] .ux-board{transform:rotate(4deg)}[dir="rtl"] .ux-board-body aside{border-right:0;border-left:1px solid rgba(255,255,255,.08)}
.alkoptan-ui-card{border-color:rgba(30,72,122,.35)}.alkoptan-ui-card:hover{border-color:rgba(220,46,28,.7);box-shadow:0 24px 60px rgba(10,30,60,.28)}.alkoptan-ui-card .portfolio-image{background:#f7f9fc}.alkoptan-ui-card .portfolio-info small{color:#d52e1f}.alkoptan-ui-card .portfolio-info p{color:#536274}.alkoptan-ui-badge{color:#12345c;background:#fff;border:1px solid #dbe5ef}.alkoptan-ui-tags span{background:rgba(30,72,122,.1);color:#1d568f}.alkoptan-ui-figma-button{background:linear-gradient(135deg,#12345c,#d52e1f)!important;box-shadow:0 12px 30px rgba(18,52,92,.22)!important}.alkoptan-ui-card .portfolio-image img{object-fit:contain!important}.ux-projects-more{padding-top:0}.ux-projects-more .ux-project-grid{max-width:1000px}@media(max-width:600px){.alkoptan-ui-card .portfolio-info{padding:26px}.alkoptan-ui-card .shopverse-figma-button{width:100%}}
.bayti-ui-card{border-color:rgba(15,45,72,.32)}.bayti-ui-card:hover{border-color:rgba(203,154,16,.72);box-shadow:0 24px 60px rgba(7,27,48,.3)}.bayti-ui-card .portfolio-image{background:#f5f7fa}.bayti-ui-card .portfolio-info small{color:#9b7310}.bayti-ui-card .portfolio-info p{color:#536274}.bayti-ui-badge{color:#12304a;background:#fff;border:1px solid #dce4eb}.bayti-ui-tags span{background:rgba(15,45,72,.09);color:#1e4969}.bayti-ui-figma-button{background:linear-gradient(135deg,#102f48,#c59a19)!important;box-shadow:0 12px 30px rgba(16,47,72,.23)!important}.bayti-ui-card .portfolio-image img{object-fit:contain!important}
