/* Mobile horizontal-scroll guard */
html { width: 100%; max-width: 100%; overflow-x: hidden; }
body { width: 100%; max-width: 100%; overflow-x: hidden; }
*, *::before, *::after { box-sizing: border-box; }
img, svg, video, iframe { max-width: 100%; }

:root{--blue:#1769e8;--blue2:#2b7bea;--text:#172033;--muted:#667085;--border:#e8edf4;--bg:#fff;--soft:#f7faff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:#fff;-webkit-font-smoothing:antialiased}.header{height:65px;background:#fff;border-bottom:1px solid #edf0f4;position:relative;z-index:10}.nav-wrap{width:min(1180px,94%);height:100%;margin:auto;display:flex;align-items:center;justify-content:space-between}.logo{font-size:20px;font-weight:800;letter-spacing:-.04em;text-decoration:none;color:#151b27}.logo span{color:#1469e8}.nav-links{display:flex;gap:34px;margin-left:80px}.nav-links a{font-size:14px;color:#3e4757;text-decoration:none}.nav-links a:hover{color:var(--blue)}.language{border:1px solid #dfe4ea;background:#fff;border-radius:10px;height:40px;padding:0 13px;font-size:13px;color:#303746;display:flex;align-items:center;gap:8px}.language b{font-size:16px;font-weight:500;margin-left:2px}.hero{min-height:370px;height:auto;position:relative;overflow:visible;background:linear-gradient(115deg,#1768e5 0%,#2676e8 55%,#1671dd 100%);color:#fff;text-align:center}.hero-content{position:relative;z-index:2;width:min(980px,92%);margin:auto;padding-top:65px;padding-bottom:42px}.hero h1{font-size:46px;line-height:1.15;letter-spacing:-.045em;margin:0 0 23px;font-weight:800}.hero p{font-size:18px;line-height:1.55;margin:0 auto 40px;color:#eaf2ff;max-width:690px}.download-form{display:flex;gap:11px;justify-content:center;max-width:672px;margin:auto}.url-box{height:58px;display:flex;align-items:center;background:#fff;border-radius:12px;flex:1;box-shadow:0 7px 18px rgba(7,55,130,.14)}.url-box input{width:100%;height:100%;border:0;outline:0;padding:0 12px 0 20px;font:400 14px Inter;color:#344054;background:transparent}.url-box input::placeholder{color:#98a2b3}.paste{height:38px;border:1px solid #d7e4f7;background:#f5f9ff;color:#1769e8;border-radius:9px;padding:0 14px;margin-right:9px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font:600 12px Inter,Arial,sans-serif;white-space:nowrap;box-shadow:0 1px 3px rgba(16,24,40,.04);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}.paste svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;display:block}.paste:hover{background:#edf5ff;border-color:#b9d1f2;box-shadow:0 4px 10px rgba(23,105,232,.10);transform:translateY(-1px)}.paste:active{background:#e7f0fd;transform:translateY(0);box-shadow:0 1px 3px rgba(16,24,40,.07)}.paste:focus-visible{outline:3px solid rgba(23,105,232,.18);outline-offset:2px}.paste svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block}.download-main{height:58px;border:0;border-radius:12px;padding:0 31px;background:#fff;color:#1265d9;font-size:15px;font-weight:700;box-shadow:0 7px 18px rgba(7,55,130,.14);cursor:pointer;min-width:141px}.download-main:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(7,55,130,.2)}.download-main:disabled{opacity:.7;cursor:wait;transform:none}.bubble{position:absolute;border-radius:50%;background:rgba(255,255,255,.08);z-index:1}.bubble-left{width:260px;height:260px;left:-52px;top:-55px}.bubble-mid{width:190px;height:190px;left:43%;top:145px}.bubble-right{width:285px;height:285px;right:-70px;top:113px}.status{position:relative;z-index:3;max-width:672px;margin:12px auto 0;padding:11px 15px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);border-radius:9px;font-size:13px;color:#fff}.status.error{background:rgba(180,25,40,.2);border-color:rgba(255,255,255,.25)}.result{position:relative;z-index:20;max-width:780px;margin:22px auto 0;text-align:left;background:#fff;color:var(--text);border-radius:13px;padding:18px;box-shadow:0 12px 35px rgba(14,43,85,.18)}.result h3{font-size:16px;margin:0 0 13px}.thumb{display:block;width:100%;max-height:270px;object-fit:cover;border-radius:9px;margin-bottom:13px}.format{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid #e6ebf2;border-radius:9px;padding:10px;margin-top:8px}.formatInfo{display:flex;align-items:center;gap:9px}.qualityBadge{display:grid;place-items:center;min-width:48px;height:28px;padding:0 9px;border-radius:7px;color:#fff;font-size:10px;font-weight:800}.qualityBadge.hd{background:linear-gradient(135deg,#7c3aed,#db2777)}.qualityBadge.sd{background:linear-gradient(135deg,#0284c7,#0f9f8b)}.formatName{font-size:12px;font-weight:600;color:#475467}.format button{border:0;border-radius:7px;color:#fff;padding:9px 15px;font-size:12px;font-weight:700;cursor:pointer}.format button.hdBtn{background:linear-gradient(135deg,#7c3aed,#db2777)}.format button.sdBtn{background:linear-gradient(135deg,#0284c7,#0f9f8b)}.ad-space{height:165px}.info-card{width:min(835px,88%);margin:0 auto 72px;padding:42px 50px 44px;text-align:center;border:1px solid #e7ebf0;border-radius:20px;background:#fff;box-shadow:0 5px 20px rgba(16,24,40,.035);position:relative;overflow:hidden}.info-card:before,.info-card:after{content:"";position:absolute;width:125px;height:125px;border-radius:50%;background:#eef8ff}.info-card:before{right:-35px;top:-40px}.info-card:after{left:-45px;bottom:-55px}.info-icon{position:relative;z-index:1;width:48px;height:48px;margin:0 auto 30px;border-radius:14px;background:#eef8ff;color:#1269df;display:grid;place-items:center;font-size:25px}.info-card h2{position:relative;z-index:1;margin:0;color:#1469df;font-size:28px;line-height:1.3;letter-spacing:-.03em}.title-line{position:relative;z-index:1;width:64px;height:4px;background:#2691ed;border-radius:5px;margin:18px auto 30px}.info-card p{position:relative;z-index:1;max-width:735px;margin:0 auto 18px;color:#596579;font-size:15px;line-height:1.8}.info-card p:last-child{margin-bottom:0}.how-section,.faq-section{background:#f8fafc;border-top:1px solid #f0f2f5;padding:70px 0}.section-title{text-align:center;width:min(900px,90%);margin:0 auto}.section-title h2{font-size:30px;letter-spacing:-.035em;margin:0 0 9px}.section-title p{color:#667085;margin:0;font-size:14px}.steps{width:min(900px,90%);margin:35px auto 0;display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.step{background:#fff;border:1px solid #e6ebf1;border-radius:14px;padding:25px;box-shadow:0 5px 20px rgba(16,24,40,.035)}.step>span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#eaf3ff;color:#1269df;font-size:13px;font-weight:800}.step h3{font-size:16px;margin:18px 0 7px}.step p{font-size:13px;line-height:1.65;color:#667085;margin:0}.faq-section{background:#fff}.faq-list{width:min(760px,90%);margin:32px auto 0}.faq-list details{border-bottom:1px solid #e4e8ee;padding:17px 4px}.faq-list summary{cursor:pointer;font-weight:600;font-size:14px}.faq-list p{color:#667085;font-size:13px;line-height:1.6;margin:12px 0 2px}footer{background:#f7f9fc;border-top:1px solid #edf0f4;padding:26px 0}.footer-wrap{width:min(1180px,94%);margin:auto;display:flex;justify-content:space-between;align-items:center}.footer-logo{font-size:16px}.footer-logo span{color:#1469e8}.footer-wrap p{font-size:11px;color:#98a2b3;margin:0}@media(max-width:700px){.header{height:auto}.nav-wrap{min-height:64px;flex-wrap:wrap;padding:10px 0;gap:10px}.nav-links{order:3;width:100%;justify-content:center;margin:0;gap:25px;padding-bottom:4px}.language{margin-left:auto}.hero{height:auto;min-height:385px}.hero-content{padding-top:49px;padding-bottom:45px}.hero h1{font-size:34px}.hero p{font-size:15px;margin-bottom:28px}.download-form{display:block}.url-box{height:55px}.download-main{width:100%;height:53px;margin-top:10px}.ad-space{height:95px}.info-card{padding:35px 23px;margin-bottom:55px}.info-card h2{font-size:23px}.info-card p{font-size:14px}.steps{grid-template-columns:1fr}.how-section,.faq-section{padding:55px 0}.section-title h2{font-size:25px}.footer-wrap{flex-direction:column;gap:12px;text-align:center}.bubble-mid{left:20%;top:185px}.bubble-right{right:-120px}}



/* Mobile overflow fix */
html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
img, video, iframe, svg { max-width: 100%; }
.nav-wrap, .hero-content, .download-form, .result, .steps, .faq-list, .section-title, .footer-wrap, .info-card { min-width: 0; }
@media (max-width:700px){
  .nav-wrap { width: calc(100% - 28px); }
  .hero-content { width: calc(100% - 28px); }
  .hero h1 { max-width: 100%; overflow-wrap: anywhere; }
  .hero p { max-width: 100%; }
  .download-form { width: 100%; }
  .url-box { width: 100%; max-width: 100%; min-width: 0; }
  .url-box input { min-width: 0; width: 1px; flex: 1 1 auto; }
  .paste { flex: 0 0 auto; }
  .download-main { max-width: 100%; }
  .result { width: calc(100% - 28px); max-width: calc(100% - 28px); padding: 14px; }
  .format { flex-wrap: wrap; }
  .formatInfo { min-width: 0; flex: 1 1 auto; }
  .format button { flex: 0 0 auto; }
  .info-card { width: calc(100% - 28px); max-width: calc(100% - 28px); }
  .steps { width: calc(100% - 28px); }
  .faq-list { width: calc(100% - 28px); }
  .footer-wrap { width: calc(100% - 28px); }
}

/* FINAL MOBILE VIEWPORT HARDENING */
html{width:100%;max-width:100%;overflow-x:clip!important}
body{width:100%;max-width:100%;overflow-x:clip!important}
main,header,footer{width:100%;max-width:100%;overflow-x:clip}
*{max-width:100%}
@media (max-width:700px){
  .header,.nav-wrap,.hero,.hero-content,.download-form,.url-box,.status,.result,.info-card,.how-section,.faq-section,.steps,.faq-list,footer,.footer-wrap{max-width:100%;min-width:0}
  .nav-wrap{width:100%;padding-left:14px;padding-right:14px}
  .nav-links{gap:18px;white-space:nowrap}
  .nav-links a{font-size:13px}
  .language{font-size:12px;padding:0 10px;flex-shrink:0}
  .hero{overflow:hidden}
  .hero-content{width:100%;padding-left:14px;padding-right:14px}
  .hero h1{font-size:32px;word-break:normal;overflow-wrap:break-word}
  .hero p{overflow-wrap:break-word}
  .download-form{width:100%;display:flex;flex-direction:column;gap:10px}
  .url-box{width:100%;height:54px;display:flex;overflow:hidden;border-radius:11px}
  .url-box input{min-width:0;flex:1 1 auto;width:0;padding-left:14px;padding-right:6px;font-size:13px}
  .paste{flex:0 0 auto;margin-right:6px;padding:0 10px;height:36px}
  .paste span{display:inline}
  .download-main{width:100%;min-width:0;margin-top:0}
  .status{width:100%;overflow-wrap:anywhere}
  .result{width:100%;margin-left:0;margin-right:0;overflow:hidden}
  .thumb{width:100%;height:auto}
  .format{width:100%;min-width:0;display:flex;flex-wrap:wrap}
  .formatInfo{min-width:0;max-width:calc(100% - 105px)}
  .format button{max-width:100%;white-space:nowrap}
  .bubble-left{left:-100px}
  .bubble-right{right:-170px}
  .bubble-mid{left:30%;max-width:none}
  .info-card,.steps,.faq-list,.section-title{width:calc(100% - 28px);max-width:calc(100% - 28px)}
  .info-card{overflow:hidden}
}

/* Prevent decorative/positioned elements from expanding the document width */
.site-header, main, section, footer, .hero, .hero-inner, .container, .wrap, .content, .result, .result-card, .steps, .features { max-width: 100%; }
@media (max-width: 768px) {
  .hero, .hero-inner, .hero::before, .hero::after, .ambient, .ambient-one, .ambient-two, .ambient-three { overflow: hidden; }
  .hero { width: 100%; max-width: 100vw; }
  .hero-inner, main, section, footer { width: 100%; max-width: 100%; min-width: 0; }
  .url-form, .input-wrap, .result-row, .quality-row { min-width: 0; max-width: 100%; }
  input, button, a { max-width: 100%; }
}

/* FINAL: disable horizontal page panning on touch devices */
html, body {
  overflow-x: hidden !important;
  overscroll-behavior-x: none !important;
  overscroll-behavior-inline: none !important;
}
body {
  position: relative;
  left: 0 !important;
  right: 0 !important;
  touch-action: pan-y;
}
@media (max-width: 700px) {
  html, body {
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  .hero, .how-section, .faq-section, footer, main, header {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
  }
  .bubble { pointer-events: none !important; }
}