:root{
  --bg:#07080f;
  --bg2:#0d0e1a;
  --bg3:#12142a;
  --card:#111328;
  --border:#1e2240;
  --accent:#ff3c3c;
  --accent2:#ff6a3c;
  --accent3:#3caaff;
  --text:#e8ecff;
  --muted:#7a82a8;
  --radius:14px;
  --glow: 0 0 24px rgba(255,60,60,0.3);
  --glow2: 0 0 24px rgba(60,170,255,0.25);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:'Outfit','DM Sans',sans-serif;
  background:var(--bg);
  color:var(--text);
  min-height:100vh;
  overflow-x:hidden;
}

/* ── GLOBAL SVG OUTLINES ── */
svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  vertical-align: middle;
}

/* ── NOISE OVERLAY ── */
body::before{
  content:'';position:fixed;inset:0;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events:none;z-index:0;opacity:.4;
}

/* ── NAVBAR ── */
nav{
  position:sticky;top:0;z-index:900;
  background:rgba(7,8,15,.85);
  backdrop-filter:blur(18px);
  border-bottom:1px solid var(--border);
  padding:0 5%;
  display:flex;align-items:center;justify-content:space-between;
  height:64px;
}
.logo{
  font-family:'Outfit',sans-serif;font-weight:800;font-size:1.5rem;
  background:linear-gradient(90deg,#ff3c3c,#ff6a3c);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  letter-spacing:-0.5px;cursor:pointer;
}
.logo span{color:#3caaff;-webkit-text-fill-color:#3caaff;}
.nav-links{display:flex;gap:2rem;list-style:none;}
.nav-links a{
  color:var(--muted);font-size:.9rem;text-decoration:none;
  transition:color .2s;font-weight:500;cursor:pointer;
}
.nav-links a:hover,.nav-links a.active{color:var(--text);}
.nav-cta{
  background:linear-gradient(135deg,#ff3c3c,#ff6a3c);
  color:#fff;border:none;padding:.45rem 1.2rem;
  border-radius:8px;font-size:.85rem;font-weight:600;cursor:pointer;
  transition:opacity .2s;
}
.nav-cta:hover{opacity:.85}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px;}
.hamburger span{display:block;width:24px;height:2px;background:var(--text);border-radius:2px;transition:.3s;}
.mobile-menu{
  display:none;position:fixed;top:64px;left:0;right:0;
  background:rgba(7,8,15,.97);border-bottom:1px solid var(--border);
  padding:1.5rem 5%;z-index:899;flex-direction:column;gap:1.2rem;
}
.mobile-menu.open{display:flex;}
.mobile-menu a{color:var(--muted);font-size:1rem;text-decoration:none;cursor:pointer;padding:.4rem 0;border-bottom:1px solid var(--border);}

/* ── PAGES ── */
.page{display:none;animation:fadeIn .3s ease;}
.page.active{display:block;}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}

/* ── HERO ── */
.hero{
  position:relative;padding:5rem 5% 3rem;
  text-align:center;overflow:hidden;min-height:520px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
}
.hero-blob{
  position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none;
  animation:pulse 6s ease-in-out infinite;
}
.blob1{width:500px;height:500px;background:rgba(255,60,60,.12);top:-100px;left:-100px;}
.blob2{width:400px;height:400px;background:rgba(60,170,255,.1);bottom:-80px;right:-80px;animation-delay:-3s;}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.1)}}
.hero-badge{
  display:inline-flex;align-items:center;gap:.4rem;
  background:rgba(255,60,60,.1);border:1px solid rgba(255,60,60,.3);
  color:#ff7a7a;padding:.3rem .9rem;border-radius:50px;font-size:.78rem;
  font-weight:600;margin-bottom:1.5rem;letter-spacing:.5px;text-transform:uppercase;
}
.hero-badge::before{content:'●';animation:blink 1.4s infinite;color:#ff3c3c;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
h1{
  font-family:'Outfit',sans-serif;font-weight:800;
  font-size:clamp(2rem,5vw,3.8rem);line-height:1.1;
  margin-bottom:1.2rem;max-width:860px;
}
h1 .red{color:#ff3c3c;}
h1 .blue{color:#3caaff;}
.hero-sub{
  color:var(--muted);font-size:clamp(.95rem,2vw,1.1rem);
  max-width:600px;line-height:1.7;margin-bottom:2.5rem;
}

/* ── SEARCH BOX ── */
.search-wrap{
  width:100%;max-width:780px;
  background:var(--card);border:1px solid var(--border);
  border-radius:16px;padding:6px 6px 6px 20px;
  display:flex;align-items:center;gap:8px;
  box-shadow:0 4px 40px rgba(0,0,0,.4);
  transition:border-color .3s,box-shadow .3s;
}
.search-wrap:focus-within{border-color:rgba(255,60,60,.5);box-shadow:var(--glow);}
#mainSearch{
  flex:1;background:none;border:none;outline:none;
  color:var(--text);font-size:1rem;font-family:'Outfit','DM Sans',sans-serif;
  min-width:0;
}
#mainSearch::placeholder{color:var(--muted);}
.search-btn{
  background:linear-gradient(135deg,#ff3c3c,#ff6a3c);
  color:#fff;border:none;padding:.7rem 1.4rem;
  border-radius:10px;font-weight:600;font-size:.95rem;cursor:pointer;
  transition:transform .15s,box-shadow .15s;white-space:nowrap;
  display:flex;align-items:center;gap:.4rem;
}
.search-btn:hover{transform:scale(1.03);box-shadow:0 4px 20px rgba(255,60,60,.4);}
.search-tabs{display:flex;gap:.5rem;margin-top:1rem;}
.stab{
  background:var(--card);border:1px solid var(--border);
  color:var(--muted);padding:.3rem .9rem;border-radius:50px;
  font-size:.8rem;font-weight:500;cursor:pointer;transition:.2s;
}
.stab.active,.stab:hover{background:rgba(255,60,60,.1);border-color:rgba(255,60,60,.4);color:#ff7a7a;}
.trust-badges{
  display:flex;flex-wrap:wrap;justify-content:center;gap:1.2rem;
  margin-top:2rem;
}
.tbadge{
  display:flex;align-items:center;gap:.4rem;
  color:var(--muted);font-size:.8rem;
}
.tbadge .ic{font-size:1rem;}

/* ── RESULTS SECTION ── */
#resultsSection{
  padding:2rem 5%;max-width:1300px;margin:0 auto;
  display:none;
}
.results-header{
  display:flex;justify-content:space-between;align-items:center;
  margin-bottom:1.5rem;flex-wrap:wrap;gap:.8rem;
}
.results-header h2{font-family:'Outfit',sans-serif;font-size:1.2rem;}
.results-count{color:var(--muted);font-size:.85rem;}
.video-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.2rem;
}
.v-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:var(--radius);overflow:hidden;cursor:pointer;
  transition:transform .2s,border-color .2s,box-shadow .2s;
  position:relative;
}
.v-card:hover{transform:translateY(-4px);border-color:rgba(255,60,60,.4);box-shadow:0 8px 32px rgba(0,0,0,.4);}
.v-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;background:#0d0e1a;}
.v-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .3s;}
.v-card:hover .v-thumb img{transform:scale(1.05);}
.v-dur{
  position:absolute;bottom:6px;right:6px;
  background:rgba(0,0,0,.82);color:#fff;
  font-size:.72rem;padding:2px 6px;border-radius:4px;font-weight:600;
}
.v-play-overlay{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,0);transition:background .2s;
}
.v-card:hover .v-play-overlay{background:rgba(255,60,60,.12);}
.play-icon{
  width:44px;height:44px;background:rgba(255,60,60,.9);border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  opacity:0;transform:scale(.8);transition:.2s;
}
.v-card:hover .play-icon{opacity:1;transform:scale(1);}
.play-icon svg{margin-left:3px;}
.v-info{padding:.9rem;}
.v-title{
  font-size:.88rem;font-weight:500;line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:2;
  line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
  margin-bottom:.5rem;
}
.v-meta{display:flex;justify-content:space-between;align-items:center;}
.v-channel{font-size:.75rem;color:var(--muted);}
.v-views{font-size:.72rem;color:var(--muted);}
.v-dl-btn{
  width:100%;margin-top:.8rem;
  background:rgba(255,60,60,.1);border:1px solid rgba(255,60,60,.25);
  color:#ff7a7a;padding:.45rem;border-radius:8px;
  font-size:.8rem;font-weight:600;cursor:pointer;transition:.2s;
  display:flex;align-items:center;justify-content:center;gap:4px;
}
.v-dl-btn:hover{background:rgba(255,60,60,.2);}

/* ── VIDEO MODAL ── */
.modal-overlay{
  display:none;position:fixed;inset:0;z-index:1000;
  background:rgba(0,0,0,.85);backdrop-filter:blur(8px);
  align-items:center;justify-content:center;padding:1rem;
}
.modal-overlay.open{display:flex;}
.modal{
  background:var(--bg2);border:1px solid var(--border);
  border-radius:20px;max-width:820px;width:100%;
  max-height:90vh;overflow-y:auto;position:relative;
  animation:modalIn .3s cubic-bezier(.34,1.56,.64,1);
}
@keyframes modalIn{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}
.modal-close{
  position:absolute;top:1rem;right:1rem;z-index:10;
  background:var(--card);border:1px solid var(--border);
  color:var(--text);width:36px;height:36px;border-radius:50%;
  cursor:pointer;font-size:1.1rem;display:flex;align-items:center;justify-content:center;
  transition:.2s;
}
.modal-close:hover{background:rgba(255,60,60,.2);border-color:rgba(255,60,60,.4);}
.modal-preview{border-radius:16px 16px 0 0;overflow:hidden;aspect-ratio:16/9;background:#000;}
.modal-preview iframe,.modal-preview video{width:100%;height:100%;border:none;}
.modal-body{padding:1.5rem;}
.modal-title{font-family:'Outfit',sans-serif;font-size:1.2rem;font-weight:700;margin-bottom:.5rem;}
.modal-meta{display:flex;gap:1rem;flex-wrap:wrap;margin-bottom:1.2rem;}
.modal-meta span{
  background:var(--card);border:1px solid var(--border);
  padding:.2rem .7rem;border-radius:6px;font-size:.78rem;color:var(--muted);
}
.format-section h3{font-family:'Outfit',sans-serif;font-size:1rem;margin-bottom:.8rem;color:var(--muted);letter-spacing:.5px;text-transform:uppercase;}
.format-tabs{display:flex;gap:.5rem;margin-bottom:1rem;}
.ftab{
  flex:1;padding:.6rem;border-radius:10px;
  background:var(--card);border:2px solid var(--border);
  color:var(--muted);font-weight:600;font-size:.9rem;cursor:pointer;
  transition:.2s;text-align:center;
}
.ftab.active{border-color:#ff3c3c;color:#ff3c3c;background:rgba(255,60,60,.08);}
.quality-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.6rem;margin-bottom:1.2rem;}
.q-opt{
  padding:.55rem .4rem;border-radius:9px;text-align:center;
  background:var(--card);border:2px solid var(--border);
  color:var(--muted);font-size:.82rem;font-weight:600;cursor:pointer;transition:.2s;
}
.q-opt:hover{border-color:#3caaff;color:#3caaff;}
.q-opt.selected{border-color:#3caaff;color:#3caaff;background:rgba(60,170,255,.1);}
.q-opt .badge{
  display:block;font-size:.65rem;color:#3caaff;
  background:rgba(60,170,255,.12);border-radius:4px;
  padding:1px 4px;margin-top:3px;
}
.dl-start-btn{
  width:100%;padding:1rem;border-radius:12px;
  background:linear-gradient(135deg,#ff3c3c,#ff6a3c);
  color:#fff;border:none;font-size:1rem;font-weight:700;
  cursor:pointer;transition:transform .15s,box-shadow .15s;
  font-family:'Outfit',sans-serif;letter-spacing:.3px;
  display:flex;align-items:center;justify-content:center;gap:.5rem;
}
.dl-start-btn:hover{transform:scale(1.01);box-shadow:0 6px 28px rgba(255,60,60,.4);}

/* ── TIMER MODAL ── */
.timer-modal{
  display:none;position:fixed;inset:0;z-index:1100;
  background:rgba(0,0,0,.9);backdrop-filter:blur(10px);
  align-items:center;justify-content:center;flex-direction:column;padding:1rem;
}
.timer-modal.open{display:flex;}
.timer-box{
  background:var(--bg2);border:1px solid var(--border);
  border-radius:20px;max-width:440px;width:100%;
  padding:2rem;text-align:center;
  animation:modalIn .3s cubic-bezier(.34,1.56,.64,1);
}
.ad-slot{
  width:300px;height:250px;background:var(--card);
  border:2px dashed var(--border);border-radius:10px;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  margin:1.2rem auto;color:var(--muted);font-size:.8rem;
}
.ad-slot .ad-text{font-size:.7rem;color:#444;margin-top:.3rem;}
.timer-ring{
  width:80px;height:80px;margin:0 auto .8rem;
  position:relative;
}
.timer-ring svg{transform:rotate(-90deg);}
.timer-ring circle.bg{fill:none;stroke:var(--border);stroke-width:6;}
.timer-ring circle.prog{
  fill:none;stroke:#ff3c3c;stroke-width:6;
  stroke-linecap:round;stroke-dasharray:220;
  stroke-dashoffset:0;transition:stroke-dashoffset 1s linear;
}
.timer-num{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-family:'Outfit',sans-serif;font-size:1.6rem;font-weight:800;color:#ff3c3c;
}
.timer-label{color:var(--muted);font-size:.9rem;margin-bottom:.3rem;}
.timer-title{font-family:'Outfit',sans-serif;font-size:1rem;font-weight:700;margin-bottom:.4rem;}
.download-now-btn{
  display:none;width:100%;padding:1rem;border-radius:12px;
  background:linear-gradient(135deg,#22c55e,#16a34a);
  color:#fff;border:none;font-size:1.05rem;font-weight:700;
  cursor:pointer;animation:popIn .4s cubic-bezier(.34,1.56,.64,1);
  font-family:'Outfit',sans-serif;margin-top:.5rem;
}
.download-now-btn.show{display:block;}
@keyframes popIn{from{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}

/* ── SECTIONS ── */
.section{padding:4rem 5%;}
.section-inner{max-width:1100px;margin:0 auto;}
.section-header{text-align:center;margin-bottom:3rem;}
.section-header .pill{
  display:inline-block;background:rgba(60,170,255,.1);
  border:1px solid rgba(60,170,255,.3);color:#6cc9ff;
  font-size:.75rem;font-weight:600;padding:.25rem .8rem;
  border-radius:50px;text-transform:uppercase;letter-spacing:.5px;margin-bottom:.8rem;
}
.section-header h2{
  font-family:'Outfit',sans-serif;font-size:clamp(1.5rem,3vw,2.4rem);
  font-weight:800;margin-bottom:.8rem;
}
.section-header p{color:var(--muted);max-width:560px;margin:0 auto;line-height:1.7;}
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.2rem;}
.feat-card{
  background:var(--card);border:1px solid var(--border);
  border-radius:16px;padding:1.5rem;
  transition:transform .2s,border-color .2s;
}
.feat-card:hover{transform:translateY(-4px);border-color:rgba(255,60,60,.3);}
.feat-icon{
  width:48px;height:48px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.4rem;margin-bottom:1rem;
}
.feat-card h3{font-family:'Outfit',sans-serif;font-size:1rem;font-weight:700;margin-bottom:.4rem;}
.feat-card p{color:var(--muted);font-size:.85rem;line-height:1.6;}

/* ── HOW IT WORKS ── */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.5rem;position:relative;}
.step{text-align:center;padding:1.5rem 1rem;}
.step-num{
  width:52px;height:52px;border-radius:50%;
  background:linear-gradient(135deg,#ff3c3c,#ff6a3c);
  display:flex;align-items:center;justify-content:center;
  font-family:'Outfit',sans-serif;font-size:1.2rem;font-weight:800;
  margin:0 auto 1rem;color:#fff;
  box-shadow:0 4px 20px rgba(255,60,60,.35);
}
.step h3{font-family:'Outfit',sans-serif;font-size:.95rem;font-weight:700;margin-bottom:.4rem;}
.step p{color:var(--muted);font-size:.83rem;line-height:1.6;}

/* ── FOOTER (utdo Style) ── */
.footer-centered{
  text-align:center;padding:5rem 5% 3rem;
  background:var(--bg2);border-top:1px solid var(--border);
}
.footer-logo .logo-f{
  font-family:'Outfit',sans-serif;font-weight:800;font-size:2.2rem;
  background:linear-gradient(90deg,#ff3c3c,#ff0055);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  display:inline-block;margin-bottom:1rem;
}
.footer-desc{
  max-width:600px;margin:0 auto 2.5rem;
  color:var(--muted);font-size:.92rem;line-height:1.6;
}
.footer-links{
  display:flex;justify-content:center;flex-wrap:wrap;
  gap:1rem;margin-bottom:2.5rem;
}
.f-pill{
  color:var(--text);text-decoration:none;font-size:.85rem;font-weight:600;
  padding:.5rem 1.4rem;border:1px solid var(--border);
  border-radius:50px;transition:.2s;cursor:pointer;
}
.f-pill:hover{border-color:var(--accent);color:var(--accent);background:rgba(255,60,60,.05);}
.footer-social{display:flex;justify-content:center;gap:1.2rem;margin-bottom:3rem;}
.footer-social a{
  width:42px;height:42px;border-radius:50%;
  border:1px solid var(--border);color:var(--muted);
  display:flex;align-items:center;justify-content:center;
  transition:.2s;text-decoration:none;
}
.footer-social a:hover{
  border-color:var(--text);color:var(--text);background:rgba(255,255,255,0.05);
}
.footer-copy p{color:var(--muted);font-size:.8rem;letter-spacing:.3px;}

/* ── STATIC PAGES ── */
.static-page{max-width:820px;margin:0 auto;padding:3rem 5%;}
.static-page h1{font-family:'Outfit',sans-serif;font-size:2rem;font-weight:800;margin-bottom:.5rem;}
.static-page .updated{color:var(--muted);font-size:.83rem;margin-bottom:2rem;}
.static-page h2{font-family:'Outfit',sans-serif;font-size:1.1rem;margin:1.5rem 0 .5rem;color:#ff7a7a;}
.static-page p{color:var(--muted);line-height:1.8;font-size:.92rem;margin-bottom:.8rem;}
.contact-form{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:2rem;margin-top:1.5rem;}
.form-group{margin-bottom:1.2rem;}
.form-group label{display:block;font-size:.85rem;font-weight:500;margin-bottom:.4rem;color:var(--text);}
.form-group input,.form-group textarea{
  width:100%;background:var(--bg);border:1px solid var(--border);
  color:var(--text);padding:.7rem 1rem;border-radius:9px;
  font-family:'Outfit',sans-serif;font-size:.9rem;outline:none;
}
.submit-btn{
  background:linear-gradient(135deg,#ff3c3c,#ff6a3c);
  color:#fff;border:none;padding:.75rem 2rem;border-radius:10px;
  font-weight:600;cursor:pointer;
}

/* ── TOAST ── */
.toast{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:2000;
  background:var(--card);border:1px solid var(--border);
  border-radius:10px;padding:.8rem 1.2rem;font-size:.88rem;
  display:none;animation:slideUp .3s ease;box-shadow:0 4px 20px rgba(0,0,0,.4);
}
.toast.show{display:flex;align-items:center;gap:.5rem;}
@keyframes slideUp{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}

/* ── BACK TO TOP ── */
.btt{
  position:fixed;bottom:1.5rem;right:1.5rem;z-index:800;
  width:50px;height:50px;border-radius:50%;
  background:linear-gradient(135deg,#ff3c3c,#ff0055);
  color:#fff;border:none;display:none;align-items:center;justify-content:center;
  cursor:pointer;transition:.2s;font-size:1.2rem;
  box-shadow:0 8px 24px rgba(255, 60, 85, 0.4);
}
.btt.visible{display:flex;}
.btt:hover{transform:translateY(-4px);box-shadow:0 12px 32px rgba(255, 60, 85, 0.5);}

/* ── AD SLOTS ── */
.ad-container{
  display:flex;justify-content:center;align-items:center;
  padding:1.5rem 0;
}
.ad-box{
  width:300px;height:250px;
  background:var(--card);border:2px dashed var(--border);
  border-radius:12px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  color:var(--muted);font-size:.8rem;gap:.5rem;
  transition:border-color .2s;
}
.ad-box:hover{border-color:rgba(255,60,60,.3);}
.ad-box svg{opacity:.4;}
.ad-label{font-size:.65rem;text-transform:uppercase;letter-spacing:1px;color:#444;}

/* Ad in results grid - spans full row */
.ad-row{
  grid-column: 1 / -1;
  display:flex;justify-content:center;
  padding:1rem 0;
}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  .video-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
  .nav-links,.nav-cta{display:none;}
  .hamburger{display:flex;}
  .video-grid{grid-template-columns:1fr;}
  .footer-links{gap:.5rem;}
  .f-pill{padding:.4rem 1rem;font-size:.8rem;}
  .ad-box{width:250px;height:200px;}
}
.divider{height:1px;background:linear-gradient(90deg,transparent,var(--border),transparent);margin:0;}