:root {
  --ink: #17221d;
  --muted: #66716b;
  --paper: #f6f3ea;
  --card: #fffefa;
  --lime: #b8ee56;
  --lime-dark: #9fd843;
  --line: #dcded4;
  --purple: #756cf2;
  --shadow: 0 24px 70px rgba(23, 34, 29, .11);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: "DM Sans", sans-serif; }
body::before { content: ""; position: absolute; inset: 0 0 auto; height: 760px; pointer-events: none; background: radial-gradient(circle at 18% 28%, rgba(184,238,86,.16), transparent 25%), radial-gradient(circle at 86% 14%, rgba(117,108,242,.1), transparent 22%); }
.noise { position: fixed; inset: 0; opacity: .025; pointer-events: none; z-index: 20; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.shell { width: min(1160px, calc(100% - 40px)); margin-inline: auto; position: relative; }
.nav { height: 92px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(23,34,29,.12); }
.brand { display: inline-flex; align-items: center; gap: 11px; color: var(--ink); text-decoration: none; font: 800 20px "Manrope", sans-serif; }
.brand-mark { width: 29px; height: 29px; border: 2px solid var(--ink); border-radius: 8px; display: flex; align-items: end; justify-content: center; gap: 2px; padding: 5px; transform: rotate(-2deg); }
.brand-mark i { width: 4px; border-radius: 3px; background: var(--ink); display: block; }.brand-mark i:nth-child(1){height:6px}.brand-mark i:nth-child(2){height:13px}.brand-mark i:nth-child(3){height:9px}
nav { display: flex; gap: 40px; } nav a { color: #354039; text-decoration: none; font-size: 14px; font-weight: 600; }
.nav-pill { color: var(--ink); border: 1px solid #b9bdb5; border-radius: 999px; padding: 11px 17px; text-decoration: none; font-size: 13px; font-weight: 700; }
.nav-pill span { margin-left: 10px; }
.hero { padding: 94px 0 88px; text-align: center; }
.eyebrow { display: inline-flex; align-items: center; gap: 9px; text-transform: uppercase; letter-spacing: .14em; font-size: 11px; font-weight: 700; color: #59645e; }.eyebrow span { width: 7px; height: 7px; background: var(--lime-dark); border-radius: 50%; box-shadow: 0 0 0 5px rgba(184,238,86,.2); }
h1 { margin: 26px 0 22px; font: 800 clamp(48px, 7vw, 82px)/.99 "Manrope", sans-serif; letter-spacing: -.055em; }
h1 em { color: var(--purple); font-style: normal; position: relative; } h1 em::after { content:""; position:absolute; height: 5px; border-radius: 80%; background: var(--lime); left: 2%; right: 2%; bottom: -7px; transform: rotate(-1deg); }
.hero-copy { max-width: 570px; margin: 0 auto 38px; color: var(--muted); font-size: 17px; line-height: 1.65; }
.link-card { max-width: 850px; margin: 0 auto; background: var(--card); border: 1px solid #dedfd7; border-radius: 18px; padding: 10px; display: grid; grid-template-columns: 1fr auto; gap: 9px; box-shadow: var(--shadow); position: relative; }
.input-wrap { display: flex; align-items: center; gap: 12px; padding: 0 13px; }.input-wrap svg { width: 22px; fill: none; stroke: #7b837e; stroke-width: 1.8; stroke-linecap: round; }.input-wrap input { width: 100%; height: 55px; border: 0; outline: 0; background: transparent; font: 500 15px "DM Sans"; color: var(--ink); }.input-wrap input::placeholder { color: #a1a7a2; }
.link-card button, .download-button { border: 0; border-radius: 11px; background: var(--lime); color: var(--ink); font: 800 14px "DM Sans"; padding: 0 18px 0 24px; cursor: pointer; transition: transform .2s, background .2s; }.link-card button:hover,.download-button:hover { transform: translateY(-2px); background: var(--lime-dark); }.link-card button:disabled,.download-button:disabled { opacity: .55; cursor: wait; transform: none; }.link-card button b { font-size: 20px; margin-left: 14px; }
.form-status { grid-column: 1/-1; margin: 0; max-height: 0; overflow: hidden; text-align: left; font-size: 13px; color: #b34c3f; transition: .2s; }.form-status.visible { max-height: 50px; padding: 4px 14px 7px; }
.trust-row { display: flex; justify-content: center; gap: 34px; margin-top: 25px; color: #66716b; font-size: 12px; }.trust-row i { display:inline-grid; place-items:center; width:17px;height:17px;background:#e1efc8;color:#48711b;border-radius:50%;font-style:normal;margin-right:6px; }
.legal-consent{max-width:850px;margin:24px auto 0;padding:16px 18px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:15px;text-align:left;border:1px solid rgba(23,34,29,.12);border-radius:17px;background:rgba(255,254,250,.76);box-shadow:0 12px 35px rgba(23,34,29,.05);backdrop-filter:blur(12px)}.legal-shield{width:45px;height:45px;display:grid;place-items:center;border-radius:14px;background:#e9f7cf;color:#527c20}.legal-shield svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.legal-copy strong{display:block;margin-bottom:7px;font:800 13px "Manrope"}.legal-copy label{display:flex;align-items:flex-start;gap:9px;cursor:pointer;color:#65706a;font-size:11px;line-height:1.45}.legal-copy input{appearance:none;flex:0 0 auto;width:18px;height:18px;margin:0;border:1.5px solid #aeb5ae;border-radius:5px;background:#fff;display:grid;place-items:center;cursor:pointer;transition:.2s}.legal-copy input::after{content:"✓";color:var(--ink);font-size:12px;font-weight:900;transform:scale(0);transition:.18s}.legal-copy input:checked{border-color:var(--lime-dark);background:var(--lime)}.legal-copy input:checked::after{transform:scale(1)}.legal-copy input:focus-visible{outline:3px solid rgba(117,108,242,.25);outline-offset:2px}.legal-actions{display:flex;flex-direction:column;align-items:flex-end;gap:5px}.legal-actions button,.footer-legal button{padding:2px;border:0;background:transparent;color:#5e665f;font:700 10px "DM Sans";cursor:pointer;text-decoration:underline;text-decoration-color:#b9bdb7;text-underline-offset:3px}.legal-actions button:hover,.footer-legal button:hover{color:var(--purple)}.legal-actions button span{margin-left:5px;text-decoration:none}.legal-dialog{width:min(650px,calc(100% - 30px));max-height:min(760px,calc(100vh - 30px));padding:0;border:1px solid rgba(23,34,29,.14);border-radius:24px;background:var(--card);color:var(--ink);box-shadow:0 35px 100px rgba(15,25,20,.25)}.legal-dialog::backdrop{background:rgba(18,25,22,.55);backdrop-filter:blur(5px)}.dialog-head{position:sticky;top:0;z-index:2;padding:25px 27px 19px;display:flex;align-items:flex-start;justify-content:space-between;background:rgba(255,254,250,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}.dialog-head span{color:var(--purple);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.14em}.dialog-head h2{margin:5px 0 0;font:800 27px "Manrope";letter-spacing:-.035em}.dialog-close{width:36px;height:36px;border:1px solid var(--line);border-radius:50%;background:#f5f3eb;color:var(--ink);font-size:23px;line-height:1;cursor:pointer}.dialog-body{padding:22px 27px 8px;overflow:auto}.legal-updated{margin:0 0 22px;color:#8a918c;font-size:11px}.dialog-body section{margin-bottom:21px}.dialog-body h3{margin:0 0 7px;font:750 14px "Manrope"}.dialog-body section p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.dialog-accept{position:sticky;bottom:0;width:calc(100% - 54px);margin:12px 27px 25px;min-height:46px;border:0;border-radius:12px;background:var(--lime);color:var(--ink);font:800 13px "DM Sans";cursor:pointer}.dialog-accept:hover{background:var(--lime-dark)}
.partner-banner{max-width:850px;margin:13px auto 0;padding:15px 16px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:17px;position:relative;overflow:hidden;text-align:left;text-decoration:none;color:#eef0ff;border:1px solid rgba(124,92,255,.35);border-radius:18px;background:radial-gradient(circle at 8% 10%,rgba(74,222,128,.2),transparent 23%),radial-gradient(circle at 91% 100%,rgba(217,70,239,.23),transparent 30%),linear-gradient(120deg,#111424,#211b45 55%,#20133b);box-shadow:0 16px 38px rgba(32,24,71,.16);transition:transform .25s,box-shadow .25s}.partner-banner::after{content:"";position:absolute;inset:-120% auto -120% -15%;width:24%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.13),transparent);transform:rotate(18deg);transition:left .65s}.partner-banner:hover{transform:translateY(-3px);box-shadow:0 23px 48px rgba(32,24,71,.25)}.partner-banner:hover::after{left:110%}.partner-mark{width:92px;height:61px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.12);border-radius:14px;background:rgba(255,255,255,.07)}.partner-mark span,.footer-partner b{font:800 22px "Manrope";letter-spacing:-.06em;background:linear-gradient(90deg,#69e2d2,#8b7bff 55%,#e76adf);background-clip:text;-webkit-background-clip:text;color:transparent}.partner-copy{display:flex;flex-direction:column;gap:3px}.partner-kicker{display:flex;align-items:center;gap:7px;color:#a9a5c7;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.14em}.partner-kicker i{width:6px;height:6px;border-radius:50%;background:#61e4bd;box-shadow:0 0 0 4px rgba(97,228,189,.12)}.partner-copy strong{font:750 14px "Manrope"}.partner-copy small{color:#acaac1;font-size:10px}.partner-cta{padding:11px 14px;border-radius:11px;background:#fff;color:#1b1d2c;font-size:10px;font-weight:800;white-space:nowrap}.partner-cta b{margin-left:7px;font-size:14px}
.result-card { max-width: 850px; margin: 35px auto 0; padding: 14px; background: var(--card); border: 1px solid #dedfd7; border-radius: 22px; box-shadow: var(--shadow); text-align: left; grid-template-columns: 42% 1fr; gap: 24px; animation: rise .35s ease-out; }.result-card:not([hidden]) { display:grid; } @keyframes rise { from { opacity:0; transform: translateY(12px) } }
.preview { border-radius: 14px; min-height: 240px; background: #e8e8df; overflow:hidden; }.preview img { width:100%;height:100%;object-fit:cover;display:block; }
.result-content { padding: 8px 10px 8px 0; display:flex; flex-direction:column; }.platform-chip { align-self:flex-start; padding:5px 9px; border-radius:99px; background:#eae8ff; color:#544acb; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.1em; }.result-content h2 { font: 700 23px/1.25 "Manrope"; margin: 12px 0 7px; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }.result-content>p { margin:0;color:var(--muted);font-size:13px; }
.selectors { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0 12px; }.selectors label { color:#6d756f;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em; }.selectors select { width:100%;margin-top:7px;padding:10px;border:1px solid var(--line);border-radius:9px;background:#faf9f4;color:var(--ink);font-family:inherit; }.download-button { min-height:46px; }.download-button span { margin-left:9px;font-size:18px; }.download-note { min-height:16px!important;margin-top:8px!important;color:#64706a!important; }
.steps{padding:115px 0 135px;isolation:isolate}.steps::before{content:"";position:absolute;z-index:-1;inset:42px -46px 70px;border:1px solid rgba(23,34,29,.08);border-radius:44px;background:radial-gradient(circle at 8% 20%,rgba(117,108,242,.13),transparent 25%),radial-gradient(circle at 53% 90%,rgba(184,238,86,.15),transparent 28%),radial-gradient(circle at 96% 8%,rgba(255,173,95,.13),transparent 25%),rgba(255,254,250,.45);box-shadow:inset 0 1px 0 rgba(255,255,255,.8)}.section-label{text-transform:uppercase;letter-spacing:.16em;font-size:11px;font-weight:800;color:#6b756f;margin-bottom:22px}.steps-heading{display:flex;align-items:end;justify-content:space-between;gap:70px;margin-bottom:48px;padding:0 7px}.steps-heading .section-label{display:flex;align-items:center;gap:9px}.steps-heading .section-label span{width:25px;height:2px;border-radius:2px;background:var(--purple)}.steps-heading h2{font:800 clamp(36px,4.5vw,58px)/1.05 "Manrope";letter-spacing:-.05em;margin:0}.steps-heading h2 em{color:var(--purple);font-style:normal}.steps-heading>p{max-width:360px;margin:0 0 7px;color:var(--muted);font-size:15px;line-height:1.7}.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.step-card{--accent:#756cf2;--soft:#eeecff;--glow:rgba(117,108,242,.18);min-height:360px;padding:23px 25px 22px;position:relative;display:flex;flex-direction:column;overflow:visible;border:1px solid rgba(23,34,29,.11);border-radius:27px;background:linear-gradient(145deg,#fffefa 40%,var(--soft));box-shadow:0 18px 45px rgba(23,34,29,.07),0 2px 0 rgba(255,255,255,.9) inset;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s}.step-card::before{content:"";position:absolute;inset:0;overflow:hidden;border-radius:inherit;background:radial-gradient(circle at 105% -5%,var(--glow),transparent 35%);pointer-events:none}.step-card:hover{transform:translateY(-9px) rotate(-.4deg);box-shadow:0 28px 60px rgba(23,34,29,.13),0 0 0 4px var(--glow)}.step-format{--accent:#638e27;--soft:#edf8dc;--glow:rgba(150,205,67,.2)}.step-download{--accent:#d86d16;--soft:#fff0e2;--glow:rgba(242,147,67,.18)}.step-top{display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}.step-number{font:800 12px "Manrope";letter-spacing:.08em;color:var(--accent)}.step-status{padding:6px 10px;border-radius:99px;background:var(--soft);color:var(--accent);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.step-icon{margin:40px 0 29px;width:68px;height:68px;display:grid;place-items:center;border-radius:22px;background:var(--soft);color:var(--accent);box-shadow:0 12px 28px var(--glow);transform:rotate(-4deg);transition:transform .35s}.step-card:hover .step-icon{transform:rotate(4deg) scale(1.08)}.step-icon svg{width:31px;height:31px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sparkle-icon svg path:first-child{fill:currentColor;stroke:none}.step-grid h3{font:750 22px "Manrope";letter-spacing:-.025em;margin:0 0 10px}.step-grid p{color:var(--muted);font-size:14px;line-height:1.65;max-width:270px;margin:0}.step-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:20px;border-top:1px dashed rgba(23,34,29,.16);color:#7a837e;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.step-foot b{color:var(--accent);font-weight:800}.step-connector{position:absolute;z-index:3;right:-32px;top:47%;width:40px;height:40px;display:grid;place-items:center;border:1px solid rgba(23,34,29,.12);border-radius:50%;background:var(--card);box-shadow:0 8px 18px rgba(23,34,29,.1);color:var(--ink);font:600 17px "Manrope";animation:connectorPulse 2.4s ease-in-out infinite}.step-format .step-connector{animation-delay:.6s}@keyframes connectorPulse{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
.platforms { display:grid;grid-template-columns:.7fr 1.5fr;gap:80px;padding:105px 0;border-top:1px solid #cfd2c9; }.platforms h2{font:800 clamp(36px,4vw,55px)/1.07 "Manrope";letter-spacing:-.045em;margin:0}.platform-list{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #cfd2c9}.platform-list>div{display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:14px;padding:15px 10px 15px 5px;border-bottom:1px solid #cfd2c9}.platform-list>div:nth-child(odd){border-right:1px solid #cfd2c9}.platform-list>div:nth-child(even){padding-left:18px}.platform-list b{width:42px;height:42px;display:grid;place-items:center;border-radius:13px;color:#fff}.platform-list b img{display:block;width:22px;height:22px;object-fit:contain;filter:brightness(0) invert(1)}.platform-list .xiaohongshu img{width:25px;height:25px}.youtube{background:#ff4b4b}.facebook{background:#3275e4}.instagram{background:linear-gradient(135deg,#773ee7,#ec3f75,#f1a12d)}.tiktok{background:#202b27}.dailymotion{background:#1676e8}.vimeo{background:#20b9e8}.vk{background:#5584b8}.reddit{background:#f45118}.threads{background:#111}.xiaohongshu{background:#ff4050}.platform-list span{font:700 15px "Manrope"}.platform-list small{display:block;color:var(--muted);font:400 11px "DM Sans";margin-top:2px}.platform-list i{font-style:normal;color:#818985}
footer { min-height:130px;border-top:1px solid #cfd2c9;display:flex;align-items:center;justify-content:space-between;gap:20px;color:#7c847f;font-size:11px}footer p{max-width:360px;text-align:center;line-height:1.5}.footer-legal{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-wrap:wrap}.footer-legal button{font-size:11px}.footer-legal span{margin-left:4px}.footer-partner{display:flex;align-items:center;gap:4px;margin-right:5px;color:#656d68;text-decoration:none;font-size:10px}.footer-partner b{font-size:14px}.footer-partner:hover{color:var(--purple)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:900px){.platforms{grid-template-columns:1fr;gap:45px}.platform-list{grid-template-columns:1fr 1fr}}
@media(max-width:900px){.steps-heading{align-items:start;flex-direction:column;gap:20px}.steps-heading>p{max-width:520px}.step-grid{grid-template-columns:1fr;gap:28px}.step-card{min-height:320px}.step-connector{right:50%;top:auto;bottom:-34px;transform:translateX(50%) rotate(90deg);animation:none}.steps::before{inset:35px -10px 55px}}
@media(max-width:760px){.shell{width:min(100% - 24px,1160px)}.nav{height:72px}.nav nav,.nav-pill{display:none}.hero{padding:65px 0}.hero-copy{font-size:15px}.link-card{grid-template-columns:1fr}.link-card button{min-height:54px}.trust-row{gap:10px;flex-wrap:wrap}.legal-consent{grid-template-columns:auto 1fr;margin-top:20px;padding:14px}.legal-shield{align-self:start}.legal-actions{grid-column:1/-1;flex-direction:row;justify-content:center;align-items:center;padding-top:10px;border-top:1px solid var(--line)}.partner-banner{grid-template-columns:auto 1fr;padding:14px;gap:12px}.partner-mark{width:72px;height:58px}.partner-mark span{font-size:19px}.partner-copy strong{font-size:12px}.partner-copy small{line-height:1.35}.partner-cta{grid-column:1/-1;text-align:center;padding:10px}.result-card:not([hidden]){display:block}.preview{min-height:190px;margin-bottom:16px}.result-content{padding:4px}.steps{padding:80px 0 105px}.steps::before{inset:24px -4px 40px;border-radius:30px}.steps-heading{padding:0 12px;margin-bottom:34px}.steps-heading h2{font-size:38px}.step-grid{padding:0 8px}.step-card{min-height:330px;padding:21px}.step-icon{margin:32px 0 24px}.platforms{padding:75px 0}.platform-list{grid-template-columns:1fr}.platform-list>div:nth-child(odd){border-right:0}.platform-list>div:nth-child(even){padding-left:5px}.legal-dialog{border-radius:19px}.dialog-head{padding:20px}.dialog-body{padding:19px 20px 6px}.dialog-accept{width:calc(100% - 40px);margin:10px 20px 20px}footer{padding:30px 0;flex-direction:column;text-align:center}.footer-legal{justify-content:center;flex-wrap:wrap}.footer-partner{flex-basis:100%;justify-content:center;margin-bottom:5px}}
@media(prefers-reduced-motion:reduce){.step-card,.step-icon{transition:none}.step-connector{animation:none}}
