@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Manrope:wght@600;700;800&display=swap');

:root{--ink:#111827;--muted:#667085;--surface:#fff;--soft:#f7f8fc;--line:#e8eaf0;--primary:#7c3aed;--primary-2:#ec4899;--success:#12b76a;--danger:#d92d20;--shadow:0 18px 55px rgba(16,24,40,.10);--radius:22px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;background:#fff;line-height:1.65;-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:'Manrope','Inter',sans-serif;font-weight:800;letter-spacing:-.035em;color:var(--ink)}a{color:inherit}a:hover{text-decoration:none}.container{max-width:1120px}

.site-nav{background:rgba(255,255,255,.88)!important;border-bottom:1px solid rgba(17,24,39,.07);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);padding:14px 0;position:sticky;top:0;z-index:1030}.brand{font-family:'Manrope',sans-serif;font-weight:800;font-size:1.15rem;letter-spacing:-.03em;display:flex;align-items:center;gap:10px}.brand-mark{width:38px;height:38px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 9px 22px rgba(124,58,237,.25)}.brand-mark svg{width:20px;height:20px}.nav-link{font-size:.93rem;font-weight:600;color:#475467!important;padding:.65rem .8rem!important}.nav-link:hover{color:var(--primary)!important}.navbar-toggler{border:0;padding:.4rem}.navbar-toggler:focus{outline:0;box-shadow:none}.navbar-light .navbar-toggler-icon{background-image:none;position:relative;width:24px;height:18px;border-top:2px solid var(--ink);border-bottom:2px solid var(--ink)}.navbar-light .navbar-toggler-icon:after{content:'';position:absolute;left:0;right:0;top:7px;border-top:2px solid var(--ink)}

.hero{position:relative;overflow:hidden;background:linear-gradient(180deg,#faf9ff 0%,#fff 100%);padding:82px 0 72px}.hero:before,.hero:after{content:'';position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.hero:before{width:430px;height:430px;right:-190px;top:-220px;background:radial-gradient(circle,rgba(236,72,153,.16),rgba(236,72,153,0) 68%)}.hero:after{width:500px;height:500px;left:-260px;bottom:-320px;background:radial-gradient(circle,rgba(124,58,237,.13),rgba(124,58,237,0) 68%)}.hero-inner{position:relative;z-index:1}.eyebrow{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border:1px solid #e8defe;border-radius:999px;background:#fff;color:#6d28d9;font-size:.78rem;font-weight:700;letter-spacing:.02em;box-shadow:0 7px 25px rgba(124,58,237,.07)}.eyebrow-dot{width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-2))}.hero h1{font-size:clamp(2.45rem,5vw,4.5rem);line-height:1.04;max-width:820px;margin:22px auto 18px}.gradient-text{background:linear-gradient(135deg,#6d28d9,#db2777);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-copy{max-width:680px;margin:0 auto;color:var(--muted);font-size:1.08rem}.tool-card{max-width:820px;margin:34px auto 0;background:rgba(255,255,255,.92);border:1px solid rgba(17,24,39,.08);border-radius:28px;padding:10px;box-shadow:var(--shadow)}.tool-form{display:flex;gap:8px}.tool-input{height:62px;border:0!important;box-shadow:none!important;border-radius:19px!important;padding:0 20px;font-size:1rem;color:var(--ink);background:#f7f7fb}.tool-input::placeholder{color:#98a2b3}.tool-button{height:62px;border:0;border-radius:19px;padding:0 25px;font-weight:800;color:#fff;background:linear-gradient(135deg,var(--primary),var(--primary-2));box-shadow:0 12px 25px rgba(124,58,237,.24);transition:transform .18s ease,box-shadow .18s ease}.tool-button:hover{color:#fff;transform:translateY(-1px);box-shadow:0 16px 30px rgba(124,58,237,.3)}.tool-button:disabled{opacity:.65;transform:none}.tool-note{font-size:.78rem;color:#98a2b3;margin:11px 4px 1px}.tool-note svg{vertical-align:-2px;margin-right:4px}

.ad-slot{display:flex;justify-content:center;align-items:center;min-height:18px}.ad-slot img{border-radius:12px;max-width:100%;height:auto}.result-wrap{max-width:820px;margin:22px auto 0}.loader{display:inline-flex;align-items:center;gap:10px;color:#6941c6;font-weight:700;font-size:.9rem}.loader-spinner{width:20px;height:20px;border:3px solid #e9d7fe;border-top-color:#7c3aed;border-radius:50%;animation:spin .75s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}

.section{padding:82px 0}.section-soft{background:var(--soft)}.section-head{text-align:center;max-width:680px;margin:0 auto 45px}.section-kicker{font-size:.78rem;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:#7c3aed;margin-bottom:10px}.section-head h2{font-size:clamp(1.9rem,3vw,2.65rem);margin-bottom:12px}.section-head p{color:var(--muted);margin:0}.feature-card{height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:0 8px 30px rgba(16,24,40,.045);transition:transform .2s ease,box-shadow .2s ease}.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.feature-icon{width:50px;height:50px;border-radius:15px;display:flex;align-items:center;justify-content:center;color:#6d28d9;background:#f1eaff;margin-bottom:20px}.feature-icon svg{width:23px;height:23px}.feature-card h3{font-size:1.12rem;margin-bottom:8px}.feature-card p{font-size:.94rem;color:var(--muted);margin:0}

.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.step{position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px}.step-number{display:inline-flex;width:34px;height:34px;border-radius:10px;align-items:center;justify-content:center;background:#f1eaff;color:#6d28d9;font-weight:800;font-size:.85rem;margin-bottom:18px}.step h3{font-size:1rem;margin-bottom:7px}.step p{color:var(--muted);font-size:.88rem;margin:0}

.content-section{padding:80px 0}.prose{max-width:820px;margin:auto}.prose h1{font-size:clamp(2rem,4vw,3.2rem);margin-bottom:14px}.prose h2{font-size:1.45rem;margin-top:36px;margin-bottom:10px}.prose h3{font-size:1.12rem;margin-top:25px}.prose p,.prose li{color:#667085;font-size:.98rem}.prose ul{padding-left:20px}.meta{color:#98a2b3;font-size:.84rem;margin-bottom:34px}.faq-item{border:1px solid var(--line);border-radius:18px;background:#fff;padding:22px 24px;margin-bottom:14px}.faq-item h3{font-size:1.03rem;margin:0 0 7px}.faq-item p{margin:0;color:var(--muted);font-size:.92rem}

.contact-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:32px;box-shadow:var(--shadow)}.contact-card label{font-weight:700;font-size:.86rem;color:#344054}.contact-card .form-control{border:1px solid #dfe3ea;border-radius:13px;padding:.8rem 1rem;box-shadow:none}.contact-card .form-control:focus{border-color:#a78bfa;box-shadow:0 0 0 4px rgba(124,58,237,.08)}.contact-card .btn{border-radius:13px;font-weight:800;padding:.8rem 1.2rem}.info-card{background:#f8f7ff;border:1px solid #ece8ff;border-radius:20px;padding:24px;height:100%}.info-card h3{font-size:1.05rem}.info-card p{color:var(--muted);font-size:.9rem;margin:0}

.result-card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:16px;margin-top:16px;box-shadow:0 10px 32px rgba(16,24,40,.06)}.result-media{overflow:hidden;border-radius:16px;background:#f2f4f7}.result-media img{display:block;width:100%;max-height:430px;object-fit:cover}.download-btn{display:inline-flex;align-items:center;gap:8px;margin-top:14px;border:0;border-radius:13px;padding:11px 18px;font-weight:800;color:#fff;background:#111827;transition:transform .18s ease,background .18s ease}.download-btn:hover{color:#fff;background:#000;transform:translateY(-1px)}.download-meta{font-size:.8rem;color:#98a2b3;margin:10px 0 0}.alert{border-radius:16px;border:0;padding:15px 18px;text-align:left}.alert-danger{background:#fff1f0;color:#b42318}.alert-success{background:#ecfdf3;color:#027a48}

.footer{background:#101828;color:#d0d5dd;padding:56px 0 28px}.footer-brand{color:#fff}.footer-copy{font-size:.84rem;color:#98a2b3;max-width:460px;margin-top:15px}.footer h4{font-family:'Inter',sans-serif;color:#fff;font-size:.86rem;letter-spacing:0;margin-bottom:15px}.footer-links{list-style:none;padding:0;margin:0}.footer-links li{margin-bottom:9px}.footer-links a{font-size:.84rem;color:#98a2b3}.footer-links a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:38px;padding-top:22px;color:#667085;font-size:.78rem}.heart{color:#f43f5e}

@media(max-width:767.98px){.site-nav{padding:10px 0}.nav-link{padding:.7rem 0!important}.hero{padding:60px 0 52px}.hero h1{font-size:2.55rem}.hero-copy{font-size:.98rem}.tool-card{padding:8px;border-radius:22px}.tool-form{display:block}.tool-input,.tool-button{width:100%;height:56px}.tool-button{margin-top:8px}.section,.content-section{padding:62px 0}.steps{grid-template-columns:1fr 1fr}.feature-card{padding:23px}.footer{padding-top:44px}.footer-col{margin-bottom:28px}}
@media(max-width:480px){.steps{grid-template-columns:1fr}.hero h1{font-size:2.2rem}.tool-note{font-size:.72rem}}


/* =========================================================
   UI/UX refinement v3
   Keeps the original page structure and downloader workflow.
   ========================================================= */
:root{
  --pd3-bg:#f6f7fb;
  --pd3-card:#fff;
  --pd3-text:#171923;
  --pd3-muted:#737987;
  --pd3-line:#e5e7ed;
  --pd3-accent:#e1306c;
  --pd3-accent2:#833ab4;
  --pd3-radius:16px;
  --pd3-shadow:0 10px 30px rgba(20,23,35,.07);
}
body{
  background:var(--pd3-bg);
  color:var(--pd3-text);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
.navbar{
  min-height:64px;
}
.navbar .container{
  padding-left:16px;
  padding-right:16px;
}
.navbar-brand{
  font-family:Manrope,Inter,sans-serif;
  font-size:1.08rem;
}
@media (max-width:767.98px){
  .navbar-brand{font-size:1rem}
}
.form-control{
  min-height:54px;
  padding:13px 15px;
  background:#fff;
  border:1px solid #dfe2e9;
}
.input-group>.form-control{
  min-width:0;
}
.btn{
  min-height:50px;
  padding:11px 20px;
}
@media (max-width:575.98px){
  .input-group{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
  }
  .input-group>.form-control{
    width:100%;
    flex:0 0 100%;
    border-radius:13px!important;
  }
  .input-group>.btn{
    width:100%;
    border-radius:13px!important;
  }
}

/* Existing result container gets a polished card without changing its markup. */
.pd-result-shell{
  margin-top:20px;
  overflow:hidden;
  background:var(--pd3-card);
  border:1px solid var(--pd3-line);
  border-radius:var(--pd3-radius);
  box-shadow:var(--pd3-shadow);
}
.pd-result-shell .pd-preview-image{
  display:block;
  width:100%;
  max-height:620px;
  object-fit:contain;
  background:#f0f1f5;
}
.pd-result-shell .pd-download-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  margin:6px 4px;
  padding:10px 16px;
  border-radius:11px;
  text-decoration:none!important;
  font-weight:700;
}
.pd-result-shell .pd-download-action:hover{
  transform:translateY(-1px);
}

/* Better media preview area for common result markup. */
.result img,.download-result img,.download-box img{
  border-radius:14px;
}
.result video,.download-result video,.download-box video{
  display:block;
  width:100%;
  max-height:650px;
  border-radius:14px;
  background:#111;
}

/* Make cards and common content blocks consistent. */
.card,.box,.download-box,.result{
  border-color:var(--pd3-line);
  border-radius:var(--pd3-radius);
  box-shadow:var(--pd3-shadow);
}
h1,h2,h3,h4,h5,h6{
  font-family:Manrope,Inter,sans-serif;
  letter-spacing:-.025em;
}
.text-muted,small{color:var(--pd3-muted)!important}

/* Avoid horizontal overflow on phones. */
html,body{max-width:100%;overflow-x:hidden}
img,video,iframe{max-width:100%}
table{max-width:100%}

