:root{
    --bg:#080d16;
    --bg2:#0d131f;
    --card:#111824;
    --card2:#141c29;
    --line:#263143;
    --line2:#334155;
    --text:#f8fafc;
    --muted:#95a3b8;
    --blue:#3478f6;
    --blue2:#2563eb;
    --orange:#ff9f18;
    --orange2:#e6860c;
    --green:#10c989;
    --purple:#a855f7;
    --danger:#aa2f35;
    --shadow:0 18px 45px rgba(0,0,0,.35);
    --shadow2:0 24px 70px rgba(52,120,246,.18);
    --radius:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    color:var(--text);
    background:
        radial-gradient(circle at 10% 0%, rgba(52,120,246,.12), transparent 26%),
        radial-gradient(circle at 90% 10%, rgba(255,159,24,.08), transparent 22%),
        var(--bg);
    letter-spacing:-.03em;
    overflow-x:hidden;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
main{min-height:70vh;position:relative;z-index:2}
svg{width:1em;height:1em;display:block}
.bg-blur{position:fixed;border-radius:999px;filter:blur(65px);opacity:.22;pointer-events:none;z-index:0}
.bg-blur-1{width:360px;height:360px;background:var(--blue);left:-130px;top:110px}
.bg-blur-2{width:330px;height:330px;background:var(--orange);right:-120px;top:360px}

.topbar{
    height:76px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 34px;
    background:rgba(13,19,31,.86);
    border-bottom:1px solid rgba(255,255,255,.08);
    position:sticky;
    top:0;
    z-index:50;
    backdrop-filter: blur(18px);
    box-shadow:0 10px 35px rgba(0,0,0,.18);
}
.brand{
    display:flex;
    align-items:center;
    gap:12px;
    font-weight:950;
    font-size:24px;
    color:var(--blue);
}
.brand span span{color:var(--orange)}
.brand-icon{
    width:38px;
    height:38px;
    border-radius:10px;
    display:grid;
    place-items:center;
    color:#fff;
    background:linear-gradient(145deg,#005cff,#0b72ff);
    box-shadow:0 0 0 2px rgba(52,120,246,.18), 0 12px 28px rgba(52,120,246,.32);
}
.brand-icon svg{width:23px;height:23px}
.nav{
    display:flex;
    align-items:center;
    gap:32px;
}
.nav a{
    font-weight:850;
    color:#fff;
    display:flex;
    align-items:center;
    gap:9px;
    font-size:15px;
    opacity:.96;
    transition:.2s ease;
}
.nav a:hover,.nav a.active{color:var(--blue);transform:translateY(-1px)}
.nav-ico{font-size:20px;color:currentColor}
.top-actions{display:flex;align-items:center;gap:14px}
.icon-btn,.avatar-btn,.mobile-toggle{
    border:0;
    color:#fff;
    background:transparent;
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:14px;
    cursor:pointer;
    font-weight:800;
    transition:.2s ease;
}
.icon-btn svg{width:19px;height:19px}
.icon-btn:hover{background:#192334;transform:translateY(-2px)}
.avatar-btn{
    border:3px solid #fff;
    background:var(--blue);
    box-shadow:0 0 0 3px #0b4edb,0 12px 25px rgba(52,120,246,.25);
}
.avatar-btn svg{width:22px;height:22px}
.avatar-btn:hover{transform:translateY(-2px) scale(1.03)}
.mobile-toggle{display:none}
.btn{
    border:0;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    min-height:48px;
    padding:0 24px;
    border-radius:14px;
    font-weight:950;
    cursor:pointer;
    transition:.2s ease;
    box-shadow:0 14px 30px rgba(0,0,0,.18);
}
.btn svg{width:18px;height:18px}
.btn:hover{transform:translateY(-2px);filter:brightness(1.05)}
.btn-sm{min-height:44px;padding:0 20px}
.btn-blue{background:linear-gradient(135deg,var(--blue),var(--blue2));color:#fff}
.btn-orange{background:linear-gradient(135deg,var(--orange),var(--orange2));color:#fff}
.btn-dark{background:#101723;color:#fff;border:1px solid var(--line)}
.btn.full{width:100%}
.btn-big{height:58px;font-size:17px}
.user-menu{position:relative}
.dropdown{
    position:absolute;
    right:0;
    top:56px;
    width:290px;
    background:#111824;
    border:1px solid var(--line);
    border-radius:16px;
    box-shadow:var(--shadow);
    padding:16px;
    display:none;
}
.dropdown.open{display:block}
.dropdown small{display:block;color:var(--muted);margin-top:4px}
.dropdown hr{border:0;border-top:1px solid var(--line);margin:14px -16px}
.dropdown a{display:flex;align-items:center;gap:10px;padding:10px 0;color:#dce5f5;font-weight:750}
.dropdown a svg{width:18px;height:18px;color:var(--muted)}
.dropdown a:hover{color:#fff}

.hero{
    min-height:690px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:80px 20px;
    background:
        radial-gradient(circle at 50% 35%, rgba(52,120,246,.16), transparent 34%),
        linear-gradient(180deg,rgba(9,16,28,.7) 0%,rgba(8,13,22,.92) 100%);
}
.badge{
    color:var(--orange);
    background:rgba(255,159,24,.12);
    border:1px solid rgba(255,159,24,.18);
    padding:11px 22px;
    border-radius:999px;
    font-weight:950;
    margin-bottom:30px;
    display:inline-flex;
    align-items:center;
    gap:10px;
    box-shadow:0 12px 30px rgba(255,159,24,.08);
}
.badge svg{width:18px;height:18px}
.hero h1{
    font-size:clamp(42px,7vw,76px);
    line-height:.98;
    max-width:980px;
    margin:0;
    font-weight:950;
    text-shadow:0 20px 50px rgba(0,0,0,.3);
}
.hero h1 span{color:var(--blue)}
.hero p{
    color:var(--muted);
    font-size:23px;
    line-height:1.45;
    max-width:800px;
    margin:28px 0 44px;
}
.search-box{
    width:min(760px,100%);
    min-height:72px;
    display:flex;
    align-items:center;
    gap:18px;
    background:rgba(17,24,36,.9);
    border:1px solid var(--line);
    border-radius:22px;
    padding:0 14px 0 26px;
    box-shadow:0 20px 60px rgba(0,0,0,.28);
    transition:.2s ease;
}
.search-box:focus-within{border-color:rgba(52,120,246,.72);box-shadow:0 20px 60px rgba(52,120,246,.16)}
.search-icon{font-size:30px;color:var(--muted)}
.search-box input{
    flex:1;
    border:0;
    outline:0;
    background:transparent;
    color:#fff;
    font-size:17px;
    min-height:68px;
}
.search-box button{
    border:0;
    background:linear-gradient(135deg,var(--blue),var(--blue2));
    color:#fff;
    border-radius:14px;
    padding:16px 28px;
    font-weight:950;
    cursor:pointer;
    transition:.2s ease;
}
.search-box button:hover{transform:translateY(-1px)}
.hero-points{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:38px;
    color:var(--muted);
    margin-top:40px;
    font-size:17px;
}
.hero-points span{display:flex;align-items:center;gap:9px}
.hero-points svg{width:18px;height:18px;color:var(--blue)}
.hero-points span:first-child svg{color:var(--green)}
.hero-points span:last-child svg{color:var(--orange)}

.section,.page-wrap{
    width:min(1240px,calc(100% - 42px));
    margin:0 auto;
    padding:80px 0;
}
.section-head{
    display:flex;
    align-items:end;
    justify-content:space-between;
    gap:24px;
    margin-bottom:34px;
}
.section-head.compact{align-items:center;margin-bottom:16px}
.section-head.center,.page-title.center{text-align:center;display:block}
.section-head h2,.page-title h1,.form-page h1,.dashboard-head h1{
    font-size:42px;
    line-height:1.05;
    margin:0;
    font-weight:950;
}
.dashboard-head h1{display:flex;align-items:center;gap:10px}
.title-icon{color:var(--blue);font-size:36px}
.section-head p,.page-title p,.dashboard-head p{
    color:var(--muted);
    font-size:20px;
    margin:10px 0 0;
}
.see-all,.section-head a{
    color:var(--blue);
    font-weight:850;
    display:inline-flex;
    align-items:center;
    gap:8px;
}
.see-all svg{width:18px;height:18px}
.category-grid{
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:22px;
}
.category-card{
    min-height:150px;
    border:1px solid var(--line);
    background:linear-gradient(180deg,rgba(20,28,41,.92),rgba(17,24,36,.92));
    border-radius:18px;
    display:grid;
    place-items:center;
    gap:14px;
    padding:24px;
    transition:.25s ease;
    box-shadow:0 10px 24px rgba(0,0,0,.16);
    position:relative;
    overflow:hidden;
}
.category-card:before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(circle at 50% 0%,rgba(52,120,246,.14),transparent 55%);
    opacity:0;
    transition:.25s ease;
}
.category-card:hover{
    transform:translateY(-6px);
    border-color:rgba(52,120,246,.7);
    box-shadow:var(--shadow2);
}
.category-card:hover:before{opacity:1}
.category-card strong{position:relative;z-index:1}
.category-icon{
    width:64px;
    height:64px;
    display:grid;
    place-items:center;
    background:#101d32;
    color:var(--blue);
    border-radius:16px;
    font-size:30px;
    position:relative;
    z-index:1;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);
}
.category-icon svg{width:30px;height:30px}

.equipment-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:30px;
}
.equipment-card{
    background:var(--card);
    border:1px solid var(--line);
    border-radius:18px;
    overflow:hidden;
    box-shadow:0 16px 35px rgba(0,0,0,.18);
    transition:.25s ease;
}
.equipment-card:hover{
    transform:translateY(-7px);
    border-color:rgba(52,120,246,.65);
    box-shadow:0 28px 70px rgba(0,0,0,.32),0 0 0 1px rgba(52,120,246,.14);
}
.equipment-img{
    height:330px;
    background:#fff;
    position:relative;
    overflow:hidden;
}
.equipment-img img{width:100%;height:100%;object-fit:cover;transition:.35s ease}
.equipment-card:hover .equipment-img img{transform:scale(1.035)}
.tags{
    position:absolute;
    top:16px;
    left:16px;
    display:flex;
    flex-direction:column;
    gap:8px;
}
.tag{
    border-radius:999px;
    padding:7px 12px;
    font-weight:950;
    font-size:13px;
    color:#fff;
    display:inline-flex;
    align-items:center;
    gap:6px;
    box-shadow:0 12px 24px rgba(0,0,0,.16);
}
.tag svg{width:14px;height:14px}
.green{background:var(--green)}
.blue{background:var(--blue)}
.category-pill{
    position:absolute;
    left:16px;
    bottom:16px;
    background:#252d3a;
    color:#fff;
    border-radius:999px;
    padding:9px 14px;
    font-size:13px;
    font-weight:950;
}
.equipment-body{padding:26px}
.equipment-body h3{font-size:21px;margin:0 0 10px}
.location{color:var(--muted);margin:0 0 24px}
.price-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.price-row strong{color:var(--blue);font-size:28px}
.price-row small{color:var(--muted)}
.rating{color:var(--orange);font-weight:950}
.condition{
    display:inline-flex;
    margin-top:20px;
    border:1px solid var(--line);
    background:#0d1420;
    padding:8px 14px;
    border-radius:999px;
    font-size:13px;
    font-weight:950;
}
.how-preview{
    width:100%;
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:28px;
    background:#141a24;
    padding:70px 24px;
    margin-top:60px;
    border-top:1px solid rgba(255,255,255,.04);
    border-bottom:1px solid rgba(255,255,255,.04);
}
.how-preview.no-margin{margin-top:0;border-radius:24px}
.step{
    text-align:center;
    position:relative;
    padding:10px;
    border-radius:22px;
    transition:.2s ease;
}
.step:hover{transform:translateY(-4px);background:rgba(255,255,255,.025)}
.step-icon{
    width:74px;
    height:74px;
    margin:0 auto 14px;
    border-radius:18px;
    display:grid;
    place-items:center;
    font-size:34px;
}
.step-icon svg{width:34px;height:34px}
.step-icon.blue{background:rgba(52,120,246,.12);color:var(--blue)}
.step-icon.orange{background:rgba(255,159,24,.12);color:var(--orange)}
.step-icon.green{background:rgba(16,201,137,.12);color:var(--green)}
.step-icon.purple{background:rgba(168,85,247,.12);color:var(--purple)}
.step span{
    position:absolute;
    top:42px;
    right:10%;
    background:#fff;
    color:#101723;
    width:36px;
    height:36px;
    display:grid;
    place-items:center;
    border-radius:50%;
    font-weight:950;
    box-shadow:0 12px 25px rgba(0,0,0,.18);
}
.step h3{font-size:24px;margin:0 0 12px}
.step p{color:var(--muted);line-height:1.5;font-size:17px}
.cta-grid{
    width:min(1240px,calc(100% - 42px));
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:34px;
    margin:90px auto;
}
.cta-card{
    min-height:350px;
    border-radius:32px;
    padding:58px;
    box-shadow:0 24px 70px rgba(0,0,0,.26);
    transition:.25s ease;
    overflow:hidden;
    position:relative;
}
.cta-card:hover{transform:translateY(-6px)}
.cta-card:after{
    content:"";
    position:absolute;
    width:260px;
    height:260px;
    border-radius:999px;
    background:rgba(255,255,255,.13);
    right:-90px;
    top:-90px;
}
.cta-card h2{font-size:42px;line-height:1.05;margin:22px 0 14px;position:relative;z-index:1}
.cta-card p{font-size:22px;line-height:1.45;max-width:470px;position:relative;z-index:1}
.cta-card a{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#fff;
    color:var(--blue);
    border-radius:14px;
    padding:17px 26px;
    font-weight:950;
    margin-top:20px;
    position:relative;
    z-index:1;
    transition:.2s ease;
}
.cta-card a:hover{transform:translateY(-2px)}
.cta-card a svg{width:18px;height:18px}
.blue-bg{background:linear-gradient(135deg,#3c74df,#3266c5)}
.orange-bg{background:linear-gradient(135deg,#ff9f18,#d9830e)}
.orange-bg a{color:var(--orange)}
.big-icon{
    width:58px;
    height:58px;
    display:grid;
    place-items:center;
    position:relative;
    z-index:1;
    font-size:42px;
}
.big-icon svg{width:44px;height:44px}
.footer{
    background:#090e17;
    border-top:1px solid #101723;
    padding:70px 22px 30px;
}
.footer-grid{
    width:min(1240px,100%);
    margin:0 auto;
    display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1fr;
    gap:60px;
}
.footer p{color:var(--muted);line-height:1.6;font-size:18px}
.footer h4{margin:0 0 18px}
.footer a:not(.brand){display:block;color:#fff;font-weight:850;margin:13px 0}
.footer a:nth-child(n+3){color:var(--muted)}
.footer-copy{
    width:min(1240px,100%);
    margin:50px auto 0;
    border-top:1px solid var(--line);
    padding-top:28px;
    text-align:center;
    color:#66758d;
}

.page-title{margin-bottom:34px}
.filter-card,.form-card,.panel-card,.auth-card{
    background:linear-gradient(180deg,rgba(20,28,41,.94),rgba(17,24,36,.94));
    border:1px solid var(--line);
    border-radius:18px;
    padding:28px;
    box-shadow:0 18px 45px rgba(0,0,0,.2);
    margin-bottom:28px;
}
.form-grid{display:grid;gap:18px}
.form-grid.two{grid-template-columns:repeat(2,1fr)}
.form-grid.three{grid-template-columns:repeat(3,1fr)}
.form-grid.four{grid-template-columns:repeat(4,1fr)}
label{
    display:block;
    font-weight:900;
    font-size:14px;
    margin-bottom:16px;
}
input,select,textarea{
    width:100%;
    margin-top:9px;
    background:#0d131f;
    border:1px solid var(--line);
    border-radius:12px;
    color:#fff;
    min-height:48px;
    padding:0 14px;
    outline:0;
    transition:.2s ease;
}
textarea{min-height:110px;padding:14px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(52,120,246,.12)}
.auth-wrap{min-height:calc(100vh - 76px);display:grid;place-items:center;padding:40px 20px}
.auth-card{width:min(460px,100%)}
.auth-card h1{font-size:36px;margin:0 0 10px}
.auth-card p,.auth-card small{color:var(--muted)}
.auth-card a{color:var(--blue);font-weight:950}
.form-page{width:min(840px,calc(100% - 42px));margin:0 auto;padding:60px 0}
.back-link{color:var(--muted);display:inline-block;margin-bottom:18px}
.upload-box{
    width:110px;
    height:110px;
    border:1px dashed var(--line2);
    display:grid;
    place-items:center;
    border-radius:14px;
    color:var(--muted);
    transition:.2s ease;
    background:#0d131f;
}
.upload-box:hover{border-color:var(--blue);color:var(--blue);transform:translateY(-2px)}
.upload-box input{display:none}
.upload-box svg{width:28px;height:28px}
.check{display:flex;align-items:center;gap:10px}
.check input{width:auto;min-height:auto;margin:0}
.dashboard-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:40px}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-bottom:44px}
.stat-card{
    background:linear-gradient(180deg,rgba(20,28,41,.94),rgba(17,24,36,.94));
    border:1px solid var(--line);
    min-height:180px;
    border-radius:18px;
    padding:32px;
    transition:.25s ease;
    box-shadow:0 18px 45px rgba(0,0,0,.18);
}
.stat-card:hover{transform:translateY(-5px);border-color:rgba(52,120,246,.5);box-shadow:var(--shadow2)}
.stat-icon{width:56px;height:56px;display:grid;place-items:center;border-radius:15px;margin-bottom:18px}
.stat-icon svg{width:27px;height:27px}
.stat-icon.blue{background:#10213e;color:var(--blue)}
.stat-icon.green{background:#dfffee;color:var(--green)}
.stat-icon.orange{background:#332213;color:var(--orange)}
.stat-icon.purple{background:#fbf5ff;color:var(--purple)}
.stat-card strong{display:block;font-size:34px}
.stat-card small{color:var(--muted);font-size:16px}
.request-row,.admin-user-row{
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px 0;
    border-bottom:1px solid var(--line);
    transition:.2s ease;
}
.request-row:hover,.admin-user-row:hover{background:rgba(255,255,255,.025);margin-inline:-14px;padding-inline:14px;border-radius:14px}
.request-row:last-child,.admin-user-row:last-child{border-bottom:0}
.mini-logo{
    width:54px;
    height:54px;
    display:grid;
    place-items:center;
    border-radius:14px;
    border:3px solid #fff;
    background:var(--blue);
    color:#fff;
    font-weight:950;
    box-shadow:0 12px 24px rgba(52,120,246,.24);
}
.mini-logo svg{width:25px;height:25px}
.mini-logo.user{background:#10213e;border:0;color:var(--blue)}
.request-row p,.admin-user-row p{margin:4px 0;color:var(--muted)}
.status-pill,.small-pill{
    margin-left:auto;
    background:#fff1c7;
    color:#9b5600;
    font-weight:950;
    border-radius:999px;
    padding:8px 14px;
    font-size:14px;
}
.small-pill{margin-left:0;display:inline-flex;margin-right:6px;padding:5px 10px}
.green-pill{background:#dfffee;color:#08724e}
.alert-warning{
    background:#fff8d6;
    color:#a24700;
    border:1px solid #ffc84d;
    border-radius:14px;
    padding:22px 26px;
    margin-bottom:28px;
    box-shadow:0 14px 30px rgba(255,200,77,.12);
}
.tabs{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    background:#202938;
    padding:12px;
    border-radius:16px;
    margin-bottom:28px;
}
.tabs button{
    border:0;
    color:var(--muted);
    background:transparent;
    padding:10px 16px;
    border-radius:12px;
    font-weight:950;
    display:inline-flex;
    align-items:center;
    gap:8px;
    cursor:pointer;
    transition:.2s ease;
}
.tabs button svg{width:17px;height:17px}
.tabs button.active,.tabs button:hover{background:#080d16;color:#fff}
.admin-search{margin-bottom:24px}
.admin-user-row>div:nth-child(2){flex:1}
.admin-user-row select{width:150px}
.danger-btn{
    border:0;
    background:var(--danger);
    color:#fff;
    font-weight:950;
    border-radius:12px;
    padding:13px 18px;
    cursor:pointer;
    transition:.2s ease;
}
.danger-btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.wave{display:inline-block;animation:wave 1.6s ease-in-out infinite}
@keyframes wave{0%,100%{transform:rotate(0)}25%{transform:rotate(12deg)}50%{transform:rotate(-8deg)}}

body.light-mode{
    --bg:#f5f7fb;
    --bg2:#fff;
    --card:#fff;
    --card2:#fff;
    --line:#dde5f0;
    --line2:#cbd5e1;
    --text:#111827;
    --muted:#64748b;
}
body.light-mode .topbar{background:rgba(255,255,255,.88)}
body.light-mode .nav a{color:#111827}
body.light-mode input,body.light-mode select,body.light-mode textarea{background:#fff;color:#111827}
body.light-mode .search-box{background:#fff}
body.light-mode .search-box input{color:#111827}
body.light-mode .footer{background:#fff}
body.light-mode .condition{background:#fff}
body.light-mode .tabs{background:#e8edf5}
body.light-mode .tabs button.active,body.light-mode .tabs button:hover{background:#fff;color:#111827}

@media (max-width: 980px){
    .topbar{padding:0 18px}
    .nav{
        position:fixed;
        top:76px;
        left:0;
        right:0;
        display:none;
        flex-direction:column;
        background:var(--card);
        border-bottom:1px solid var(--line);
        padding:20px;
    }
    .nav.open{display:flex}
    .mobile-toggle{display:grid}
    .top-actions .icon-btn{display:none}
    .category-grid{grid-template-columns:repeat(2,1fr)}
    .equipment-grid,.cta-grid,.stats-grid{grid-template-columns:1fr}
    .how-preview{grid-template-columns:1fr}
    .footer-grid{grid-template-columns:1fr}
    .form-grid.two,.form-grid.three,.form-grid.four{grid-template-columns:1fr}
    .hero{min-height:auto;padding:90px 20px}
    .hero-points{gap:16px}
    .search-box{height:auto;padding:14px;flex-wrap:wrap}
    .search-box button{width:100%}
    .dashboard-head{align-items:flex-start;flex-direction:column}
}