
:root{--bg:#090f1a;--panel:#0d1726;--text:#ecf5ff;--muted:#9aa6b2;--accent:#00c27a;--glass:hsla(0,0%,100%,.05)}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:Inter,sans-serif;line-height:1.6}
a{color:inherit;text-decoration:none;transition:.3s}
.container{margin:0 auto;max-width:1100px;padding:0 20px}
.hidden{display:none!important}


.site-header{backdrop-filter:blur(10px);background:rgba(8,18,38,.9);border-bottom:1px solid var(--glass);position:sticky;top:0;z-index:1000}
.header-inner{align-items:center;display:flex;justify-content:space-between;padding:15px 0}
.brand{font-size:22px;font-weight:800}
.header-right{align-items:center;display:flex;gap:15px}
.fi{border-radius:2px;height:14px!important}
.fi,.fi-globe{width:20px!important}
.fi-globe{background-image:url(/assets/img/Globe_icon.svg);background-size:cover;display:inline-block;filter:invert(1);height:20px!important}
.language-box{position:relative}
.lang-btn{align-items:center;background:var(--glass);border:1px solid hsla(0,0%,100%,.1);border-radius:8px;color:#fff;cursor:pointer;display:flex;font-weight:600;gap:10px;padding:8px 16px}
.lang-menu{background:var(--panel);border:1px solid var(--glass);border-radius:12px;box-shadow:0 15px 35px rgba(0,0,0,.6);display:flex;flex-direction:column;min-width:160px;padding:8px;position:absolute;right:0;top:50px}
.lang-item{align-items:center;border-radius:8px;display:flex;font-size:14px;gap:12px;padding:10px}
.lang-item:hover{background:var(--glass)}
.menu-btn{background:none;border:none;color:#fff;cursor:pointer;display:none;font-size:24px}
.mobile-lang-panel{align-items:center;background:rgba(8,18,38,.98);display:flex;inset:0;justify-content:center;position:fixed;z-index:2000}
.mobile-lang-content{background:var(--panel);border:1px solid var(--glass);border-radius:20px;padding:25px;width:85%}
.mobile-lang-head{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}
.mobile-close{background:none;border:none;color:#fff;font-size:22px}


.site-footer{background:rgba(8,18,38,.9);border-top:1px solid var(--glass);margin-top:60px;padding:50px 0}
.footer-grid{align-items:start;display:grid;grid-template-columns:1fr 1fr 1fr}
.f-left{font-weight:600;text-align:left}
.f-center{color:var(--muted);font-size:14px;text-align:center;margin:20px 0px}
.f-right{align-items:flex-start;display:flex;flex-direction:column;margin-left:auto;width:fit-content}
.footer-stack{display:flex;flex-direction:column;gap:8px}
.footer-stack a{align-items:center;color:var(--muted);display:flex;gap:8px;text-decoration:none;transition:.3s}
.footer-stack svg{opacity:.7;transition:.3s}
.footer-stack a:hover svg{opacity:1;stroke:var(--accent)}


.hero{padding:60px 0;text-align:center}
.hero-title{display:block;font-size:clamp(24px,5vw,35px);font-weight:700;margin-bottom:15px}
.hero-sub{color:var(--muted);margin-bottom:40px}


.section-title{border-left:4px solid var(--accent);font-size:22px;margin:40px 0 20px;padding-left:15px}
.features{color:var(--muted);padding-left:20px}
.acc-item,.features li{margin-bottom:12px}
.acc-item{background:var(--panel);border:1px solid var(--glass);border-radius:12px}
summary{cursor:pointer;font-weight:600;padding:18px}
.acc-body{color:var(--muted);font-size:15px;padding:0 18px 18px}


.converter-tabs{display:flex;gap:10px;justify-content:center;margin-bottom:20px}
.tab-btn{background:var(--panel);border:1px solid var(--glass);border-radius:30px;color:var(--muted);cursor:pointer;font-weight:600;padding:10px 20px;transition:.3s}
.tab-btn:hover{background:var(--glass);color:#fff}
.tab-btn.active{background:var(--accent);border-color:var(--accent);box-shadow:0 0 15px rgba(0,194,122,.3);color:#081226}

.upload-wrap{background:var(--panel);border:1px solid var(--glass);border-radius:24px;margin:0 auto;max-width:800px;padding:30px}
.upload-drop{border:2px dashed hsla(0,0%,100%,.1);border-radius:16px;cursor:pointer;display:block;overflow:hidden;padding:50px 20px;position:relative;transition:.3s}
.upload-drop:active{transform:scale(0.98);background-color:#090f1a;border-color:#00c27a;transition:all 0.1s}
.upload-drop.drag{background:rgba(0,194,122,.05);border-color:var(--accent)}
.upload-drop.uploading{border-color:var(--accent)!important;box-shadow:0 0 40px var(--accent)!important;transition:.3s}
#dropZone.uploading{opacity:.85;transform:translateY(-1px);transition:all .18s ease}
.upload-icon{color:var(--accent);font-size:45px;margin-bottom:15px}
#fileInput{display:none}

.upload-progress-container{align-items:center;background:rgba(8,18,38,.5);display:flex;height:100%;justify-content:center;left:0;pointer-events:none;position:absolute;top:0;width:100%;z-index:20}
.upload-percentage{color:var(--accent);font-size:70px;font-weight:900;text-shadow:0 0 20px rgba(0,194,122,.9)}
.upload-inner.is-hidden{opacity:0;transition:.3s ease;visibility:hidden}
.dropzone-limit{border:2px solid #e74c3c!important;box-shadow:0 6px 18px rgba(231,76,60,.12)}
.limit-message{color:#e74c3c;display:none;font-weight:700;margin-top:8px}
.limit-message.show{display:block}


.btn{border:none;border-radius:12px;cursor:pointer;font-weight:700;padding:12px 28px}
.btn.primary{background:var(--accent);color:#081226}
.btn.ghost{background:var(--accent);border:1px solid var(--glass);color:#fff}
.btn:disabled{cursor:not-allowed;opacity:.3}
.btn-zip{background-color:#95a5a6;border:none;border-radius:5px;color:#fff;cursor:not-allowed;font-weight:700;padding:10px 20px;transition:background-color .3s}
.btn-zip.success{background-color:#00C27A;cursor:pointer}
.btn-zip:hover.success{background-color:#219150}
#downloadZipBtn.active{background-color:#00C27A!important;color:#fff!important;cursor:pointer!important;opacity:1!important}
#downloadZipBtn:disabled{color:hsla(0,0%,100%,.8)!important;filter:brightness(.85) contrast(1.1);opacity:1!important;transition:all .3s ease}

.smart-alert-box{animation:zoomInBounce .4s cubic-bezier(.175,.885,.32,1.275);backdrop-filter:blur(5px);background:rgba(0,0,0,.95);border:1px solid rgba(8,18,38,.9);border-radius:50px;box-shadow:0 15px 50px rgba(8,18,38,.9);box-sizing:border-box;color:#fff;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;font-size:16px;left:50%;line-height:1.5;max-width:90vw;min-width:300px;padding:20px 40px;pointer-events:none;position:fixed;text-align:center;top:50%;transform:translate(-50%,-50%);width:auto;z-index:100000}
.smart-alert-box.fade-out{opacity:0;transition:opacity .5s ease}
@keyframes zoomInBounce{0%{opacity:0;transform:translate(-50%,-50%) scale(.5)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}


@media (min-width:851px) {
    .hero{padding-top:25px}
}
@media (max-width:850px) {
    .hero{padding:20px 0}
    .hero-title{font-size:24px;margin-bottom:10px}
    .hero-sub{font-size:14px;margin-bottom:20px}
    .converter-tabs{flex-direction:row;flex-wrap:nowrap;gap:8px;width:100%}
    .converter-tabs a,.converter-tabs button{flex:1;font-size:12px;padding:10px 5px;text-align:center;white-space:nowrap}
    .upload-wrap{border-radius:16px;padding:15px}
    .upload-drop{padding:30px 10px}
    .header-inner{align-items:center;display:flex;height:60px;justify-content:space-between;padding:0 15px!important}
    .brand{font-size:1.1rem!important;font-weight:800}
    .menu-btn{display:block}
    .language-box{display:none}
    .header-right{gap:10px}
    .lang-btn{background:none!important;border:none!important;font-size:1.2rem!important;padding:5px!important}
    .lang-menu{right:15px!important;top:55px!important;width:140px!important}
    .caret,.lang-label{display:none!important}
    .footer-grid{gap:25px!important;grid-template-columns:1fr!important}
    .f-center,.f-left,.f-right,.footer-grid{text-align:center!important}
    .f-left,.f-right,.footer-stack{align-items:center!important;margin:0 auto!important}
    .f-left,.f-right{width:100%!important}
    .footer-stack,.footer-stack a{width:auto!important}
    .footer-stack a{justify-content:center!important}
    .footer-col.f-center{margin-top:15px!important;order:3!important}
}
@media (max-width:768px) {
    .fi-globe{filter:none}
    .upload-controls{flex-direction:column;gap:15px;margin-top:10px;text-align:center}
    .buttons{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
    .btn,.btn-zip{flex:1 1 140px;font-size:14px}
    .smart-alert-box{font-size:15px;min-width:280px;padding:18px 30px}
    .footer-grid{flex-direction:column!important;gap:20px!important}
    .footer-col{display:block!important;width:100%!important}
    .footer-stack{align-items:flex-start!important;display:flex!important;flex-direction:column!important;gap:15px!important;margin:0 auto!important;width:180px!important}
    .footer-stack a{display:flex!important;justify-content:flex-start!important;width:100%!important}
    .footer-col.f-center{margin-top:15px!important;order:3!important;position:static!important;text-align:center!important;transform:none!important;width:100%!important}
}
@media (max-width:600px) {
    .upload-percentage{font-size:45px}
}
@media (max-width:500px) {
    .tab-btn{font-size:13px;padding:8px 15px}
}
@media (max-width:480px) {
    .smart-alert-box{border-radius:30px;box-shadow:0 10px 30px rgba(8,18,38,.8);font-size:14px;min-width:unset;padding:15px 25px;width:85%}
}