/*
Theme Name: SaveVideo Studio
Theme URI: https://savevideo.studio
Author: SaveVideo Studio
Description: Video downloader and editor
Version: 1.3.0
Text Domain: savevideo-studio
*/
@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap");
:root{
  --bg:#070b12;
  --panel:#101722;
  --panel2:#161e2c;
  --line:#223044;
  --teal:#1ee0c6;
  --teal2:#14c4ad;
  --text:#f4f7fb;
  --muted:#8b98ad;
  --radius:18px;
  --shadow:0 22px 50px rgba(0,0,0,.4);
  --display:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--display);background:radial-gradient(1200px 500px at 50% -10%,#122033 0%,var(--bg) 55%);color:var(--text);line-height:1.5}
a{color:inherit;text-decoration:none}
img,svg{max-width:100%;display:block}
.container{max-width:1120px;margin:0 auto;padding:0 1.25rem}
.site-header{position:sticky;top:0;z-index:50;background:rgba(7,11,18,.86);backdrop-filter:blur(16px);border-bottom:1px solid rgba(255,255,255,.05)}
.header-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem 0}
.logo{display:flex;align-items:center;gap:.65rem;font-weight:800;font-size:1.08rem;letter-spacing:-.02em}
.logo-mark{width:40px;height:40px;flex:0 0 40px;filter:drop-shadow(0 8px 16px rgba(30,224,198,.28))}
.logo-mark svg{width:40px;height:40px}
.logo-text em{font-style:normal;color:var(--teal)}
.main-nav{display:flex;gap:1.15rem}
.main-nav a{color:var(--muted);font-size:.92rem;font-weight:600}
.main-nav a:hover{color:var(--text)}
.lang-wrap{display:flex;align-items:center;gap:.4rem;background:var(--panel);border:1px solid var(--line);border-radius:999px;padding:.28rem .7rem .28rem .65rem;color:var(--muted)}
.lang-select{background:transparent;border:0;color:var(--text);font:inherit;font-size:.85rem;font-weight:700;outline:0}
.menu-btn{display:none;width:42px;height:42px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:11px 10px;flex-direction:column;justify-content:space-between}
.menu-btn span{display:block;height:2px;background:var(--text);border-radius:2px}
.hero{padding:3.6rem 0 1.6rem;text-align:center}
.hero h1{font-size:clamp(2rem,5vw,3.35rem);line-height:1.08;margin:0 0 .8rem;font-weight:800;letter-spacing:-.035em}
.hero h1 em{font-style:normal;color:var(--teal)}
.hero-title-mob,.hero-pills{display:none}
.hero-sub-desk{color:var(--muted);max-width:680px;margin:0 auto 1.6rem;font-size:1.05rem}
.downloader-box{max-width:820px;margin:0 auto;background:rgba(16,23,34,.92);border:1px solid var(--line);border-radius:24px;padding:1.05rem;box-shadow:var(--shadow)}
.input-row{display:flex;gap:.65rem;align-items:stretch}
.input-wrap{flex:1;min-width:180px;display:flex;align-items:center;gap:.6rem;background:#0b111b;border:1px solid var(--line);border-radius:999px;padding:.78rem 1rem}
.input-wrap svg{width:18px;height:18px;color:var(--muted);flex:0 0 auto}
.input-wrap input{flex:1;background:transparent;border:0;outline:0;color:var(--text);font-size:.98rem;min-width:0}
.btn{border:0;border-radius:999px;padding:.78rem 1.2rem;font-weight:800;cursor:pointer;font-size:.95rem;display:inline-flex;align-items:center;justify-content:center;gap:.4rem;transition:.15s transform,.15s background}
.btn:active{transform:scale(.98)}
.btn-ghost{background:#1a2332;color:var(--text);border:1px solid var(--line)}
.btn-teal{background:var(--teal);color:#041018}
.btn-teal:hover{background:var(--teal2)}
.btn-block{width:100%}
.platforms{display:flex;justify-content:center;gap:.5rem;flex-wrap:wrap;margin-top:1rem}
.plat{background:#151d2b;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.42rem .85rem;font-size:.82rem;font-weight:700}
.section{padding:3.1rem 0}
.section-head{text-align:center;margin-bottom:1.7rem}
.section-head h2{margin:0 0 .4rem;font-size:clamp(1.5rem,3vw,2.1rem);letter-spacing:-.03em}
.section-head p{margin:0;color:var(--muted)}
.kicker{color:var(--teal);font-weight:800;font-size:.78rem;letter-spacing:.08em;margin:0 0 .5rem}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:1.25rem 1.2rem 1.3rem;text-align:left}
.card .ico{width:46px;height:46px;border-radius:14px;background:rgba(30,224,198,.12);display:grid;place-items:center;color:var(--teal);margin-bottom:.8rem;font-size:1.15rem;font-weight:800}
.card h3{margin:0 0 .3rem;font-size:1.02rem}
.card p{margin:0;color:var(--muted);font-size:.9rem}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;position:relative}
.step{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:1.25rem;text-align:center}
.step-num{width:36px;height:36px;border-radius:999px;background:var(--teal);color:#041018;display:grid;place-items:center;font-weight:800;margin:0 auto .7rem}
.platform-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem}
.platform-card{background:var(--panel);border:1px solid var(--line);border-radius:18px;padding:1.05rem .7rem;text-align:center}
.platform-card span{display:block;font-size:1.25rem;margin-bottom:.35rem}
.editor-split{display:grid;grid-template-columns:.9fr 1.1fr;gap:1.4rem;align-items:center}
.editor-split ul{margin:1rem 0 0;padding:0;list-style:none}
.editor-split li{padding:.35rem 0 .35rem 1.4rem;position:relative;color:var(--muted)}
.editor-split li::before{content:"✓";position:absolute;left:0;color:var(--teal);font-weight:800}
.editor-ui{background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:1rem}
.editor-stage{position:relative;border-radius:14px;overflow:hidden;background:linear-gradient(180deg,#16324a 0%,#0b1a24 55%,#071018 100%)}
.editor-stage::after{content:"";position:absolute;inset:auto 0 0 0;height:42%;background:linear-gradient(180deg,transparent,rgba(10,40,50,.35) 30%,#0a2a28);pointer-events:none}
.editor-ui video{width:100%;aspect-ratio:16/9;background:transparent;position:relative;z-index:1}
.voice-box{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line)}
.voice-box h3{margin:.2rem 0 .35rem}
.voice-note,.voice-bal{color:var(--muted);font-size:.84rem;margin:.2rem 0 .55rem}
.voice-box textarea,.voice-box select{width:100%;background:#0b111b;color:var(--text);border:1px solid var(--line);border-radius:12px;padding:.7rem .8rem;font:inherit}
.voice-row{display:grid;grid-template-columns:1.4fr .6fr;gap:.5rem;margin:.55rem 0}
.voice-actions{display:flex;gap:.5rem}
.voice-actions .btn{flex:1}
.editor-controls{display:flex;gap:.45rem;flex-wrap:wrap;margin-top:.75rem}
.chip{background:#0b111b;border:1px solid var(--line);color:var(--text);border-radius:999px;padding:.35rem .7rem;font-size:.82rem;cursor:pointer}
.chip.active{border-color:var(--teal);color:var(--teal)}
.range-row{margin-top:.7rem}
.range-row label{display:flex;justify-content:space-between;font-size:.82rem;color:var(--muted);margin-bottom:.2rem}
input[type=range]{width:100%;accent-color:var(--teal)}
.faq{max-width:760px;margin:0 auto}
.faq-item{border:1px solid var(--line);border-radius:14px;background:var(--panel);margin-bottom:.65rem;overflow:hidden}
.faq-q{width:100%;text-align:left;background:transparent;border:0;color:var(--text);padding:1rem 1.1rem;font-weight:700;cursor:pointer}
.faq-a{display:none;padding:0 1.1rem 1rem;color:var(--muted);font-size:.92rem}
.faq-item.open .faq-a{display:block}
.site-footer{border-top:1px solid var(--line);padding:1.4rem 0 5.2rem;color:var(--muted);font-size:.88rem}
.footer-row{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.footer-links a{margin:0 .15rem}
.result-panel{display:none;margin-top:1rem;text-align:left;border-top:1px solid var(--line);padding-top:1rem}
.result-panel.show{display:block}
.result-head,.result-panel.show{animation:rise .25s ease}
@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.thumb{width:100%;max-height:220px;aspect-ratio:16/9;border-radius:16px;object-fit:cover;background:#0b111b;margin-bottom:.85rem}
.result-meta h3{margin:0 0 .2rem;font-size:1.05rem}
.result-meta p{margin:0 0 .85rem;color:var(--muted);font-size:.85rem}
.quality-list{display:grid;gap:.55rem;margin:0 0 1rem}
.quality-opt{display:flex;align-items:center;gap:.75rem;padding:.85rem .95rem;border:1px solid var(--line);border-radius:16px;background:#0b111b;cursor:pointer}
.quality-opt.selected{border-color:var(--teal);background:rgba(30,224,198,.1)}
.quality-opt input{accent-color:var(--teal)}
.quality-opt .q-copy{flex:1}
.quality-opt .q-copy strong{display:block}
.quality-opt .q-copy small{color:var(--muted);font-size:.78rem}
.quality-opt .q-ico{color:var(--teal);font-weight:800}
.status-msg{margin:.85rem 0 0;font-size:.92rem;color:var(--muted);min-height:1.2em}
.status-msg.error{color:#f87171}
.status-msg.ok{color:var(--teal);font-weight:700}
.status-msg.ok::before{content:"✓ ";}
.edit-cta{margin-top:1.05rem;padding-top:.9rem;border-top:1px solid var(--line)}
.edit-cta-k{margin:0;font-weight:800}
.edit-cta-d{margin:.2rem 0 .7rem;color:var(--muted);font-size:.88rem}
.edit-cta-btn{display:flex;align-items:center;justify-content:center;background:rgba(30,224,198,.12);border:1px solid rgba(30,224,198,.35);color:var(--teal);border-radius:14px;padding:.85rem 1rem;font-weight:800}
.tip-bar{position:fixed;bottom:1rem;left:50%;transform:translateX(-50%);background:#121a26;border:1px solid var(--line);color:var(--text);padding:.65rem 1rem;border-radius:999px;font-size:.82rem;max-width:calc(100% - 2rem);z-index:40;display:flex;gap:.6rem;align-items:center}
.tip-bar button{background:transparent;border:0;color:var(--teal);cursor:pointer;font-size:1rem}
.tip-bar.hidden{display:none}
.btn-savefrom{display:none}
@media(max-width:900px){
  .cards3,.steps,.platform-grid{grid-template-columns:1fr 1fr}
  .editor-split{grid-template-columns:1fr}
  .main-nav{display:none}
  .menu-btn{display:flex}
  .main-nav.open{display:flex;flex-direction:column;position:absolute;top:100%;left:0;right:0;background:#070b12;padding:1rem 1.25rem 1.2rem;border-bottom:1px solid var(--line)}
}
@media(max-width:720px){
  .hero{padding:2.1rem 0 1.2rem;text-align:left}
  .hero-title-desk,.hero-sub-desk{display:none}
  .hero-title-mob,.hero-pills{display:block}
  .hero-title-mob{font-size:2.15rem;margin-bottom:.45rem}
  .hero-pills{color:var(--muted);margin:0 0 1.2rem;font-size:.92rem}
  .downloader-box{padding:.9rem;border-radius:22px}
  .input-row{flex-direction:column}
  .input-wrap{border-radius:16px}
  .btn{width:100%;border-radius:16px}
  .cards3,.steps,.platform-grid{grid-template-columns:1fr}
  .card{display:grid;grid-template-columns:46px 1fr;grid-template-rows:auto auto;column-gap:.8rem}
  .card .ico{grid-row:1 / span 2;margin:0}
  .thumb{max-height:none}
}
