:root {
  --ink: #30203f;
  --muted: #6c6275;
  --purple: #7950bc;
  --line: #e8e2ee;
  --yellow: #f7cc66;
  --soft: #f7f4fb;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  color: var(--ink);
  background: white;
  font-synthesis: none;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 28px; }
body { margin: 0; background: radial-gradient(ellipse 720px 640px at 100% 260px, #f4effc, transparent 80%), #fff; }
a { color: inherit; text-underline-offset: 4px; }
button { font: inherit; }
img { display: block; max-width: 100%; height: auto; }
a, button { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible { outline: 3px solid #af7210; outline-offset: 5px; }
.wrap { width: min(1180px, calc(100% - 64px)); margin-inline: auto; }
.skip { position: fixed; top: 12px; left: 12px; z-index: 10; padding: 12px; background: white; transform: translateY(-200%); }
.skip:focus { transform: none; }
.header { min-height: 104px; display: flex; align-items: center; justify-content: space-between; gap: 30px; border-bottom: 1px solid var(--line); }
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand img { width: 82px; }
.brand span { font-size: 1.5rem; font-weight: 700; letter-spacing: -.8px; }
.nav { display: flex; gap: 28px; align-items: center; }
.nav a { text-decoration: none; font-size: .875rem; color: var(--muted); }
.nav a:hover { color: var(--purple); }
.hero { display: grid; grid-template-columns: 1.12fr 1fr; align-items: center; gap: 74px; padding-block: 82px 90px; }
.eyebrow { font-size: .75rem; text-transform: uppercase; letter-spacing: 1.15px; line-height: 1.7; font-weight: 600; display: flex; align-items: center; gap: 12px; margin: 0 0 30px; color: var(--muted); }
.eyebrow-line { height: 2px; width: 26px; background: var(--purple); flex: none; }
h1 { font-size: clamp(3rem, 5.5vw, 4.625rem); line-height: 1.06; font-weight: 600; letter-spacing: -3.8px; margin: 0 0 30px; }
h1 span { color: var(--purple); }
h1, h2, h3 { overflow-wrap: anywhere; }
.hero-points { list-style: none; margin: 0 0 34px; padding: 0; display: grid; gap: 13px; }
.hero-points li { font-size: 1.0625rem; line-height: 1.55; display: flex; align-items: baseline; gap: 12px; }
.hero-points li::before { content: "↗"; color: var(--purple); font-size: 1rem; }
.button { min-height: 56px; display: inline-flex; align-items: center; justify-content: center; gap: 36px; border: 1px solid transparent; border-radius: 12px; padding: 17px 24px; text-decoration: none; font-weight: 600; font-size: 1rem; transition: background .18s, transform .18s; }
.button-dark { background: var(--ink); color: #fff; }
.button:hover { background: #503266; transform: translateY(-2px); }
.button span { font-size: 1.25rem; }
.promo-side { position: relative; }
.promo-side::before { content: ""; position: absolute; inset: -25px -18px 58px 20px; border: 1px solid #d8cbe9; border-radius: 26px; transform: rotate(4deg); pointer-events: none; }
.promo-card { position: relative; isolation: isolate; overflow: hidden; color: #fff; padding: 28px 34px 24px; border-radius: 24px; background: radial-gradient(ellipse at 100% 0%, #664683, transparent 70%), #30203f; box-shadow: 0 18px 45px rgb(48 32 63 / 12%); }
.promo-card::before { content: ""; position: absolute; width: 350px; height: 350px; right: -225px; top: -205px; border: 1px solid rgb(255 255 255 / 12%); border-radius: 50%; box-shadow: 0 0 0 32px rgb(255 255 255 / 3%), 0 0 0 64px rgb(255 255 255 / 3%); z-index: -1; pointer-events: none; }
.promo-card-top { display: flex; justify-content: space-between; align-items: center; gap: 20px; font-size: .875rem; color: #e1d3ed; }
.promo-star { color: var(--yellow); font-size: 2.5rem; line-height: 1; }
.promo-value { font-size: clamp(4.5rem, 6.9vw, 6rem); letter-spacing: -5px; line-height: 1.1; font-weight: 500; margin-top: 22px; white-space: nowrap; }
.promo-value span { font-size: 1rem; letter-spacing: 1px; margin-left: 12px; color: var(--yellow); }
.promo-description { margin: 8px 0 28px; font-size: 1rem; color: #d4c5e1; }
.promo-divider { border-top: 1px dashed rgb(255 255 255 / 25%); margin: 0 -34px 22px; }
.copy-code { padding: 0; color: var(--yellow); border: 0; background: transparent; display: flex; justify-content: space-between; align-items: center; width: 100%; gap: 10px; cursor: pointer; text-align: left; }
.copy-code > span { font-size: clamp(2rem, 3.4vw, 3rem); font-weight: 600; letter-spacing: 1px; }
.copy-code sup { font-size: 1.125rem; font-weight: 400; vertical-align: top; }
.copy-code svg { width: 24px; height: 24px; flex: none; opacity: .8; }
.copy-code:hover svg { opacity: 1; }
.copy-feedback { display: block; min-height: 20px; margin-top: 8px; font-size: .8125rem; color: #e6dcec; }
.promo-terms { position: relative; font-size: .875rem; line-height: 1.7; color: var(--muted); margin: 25px 8px 0; }
.section { padding-block: 76px; border-top: 1px solid var(--line); }
.section-head { display: flex; align-items: baseline; gap: 23px; margin-bottom: 38px; }
.section-number { flex: none; font-size: .8125rem; letter-spacing: 1px; font-weight: 600; color: var(--purple); }
h2 { font-size: clamp(2rem, 3.2vw, 2.75rem); font-weight: 550; letter-spacing: -1.5px; line-height: 1.2; margin: 0; }
h3 { font-size: 1.5625rem; font-weight: 600; line-height: 1.3; letter-spacing: -.6px; margin: 0 0 18px; }
p { font-size: 1rem; line-height: 1.75; }
.bonus-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.bonus-card { position: relative; isolation: isolate; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; padding: 32px; background: #faf8fe; }
.bonus-card-top { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 32px; min-height: 126px; }
.big-number { font-size: 5.5rem; font-weight: 500; letter-spacing: -5px; line-height: 1; color: var(--purple); }
.big-number span { font-size: .6em; letter-spacing: -2px; }
.bonus-image { width: 160px; height: 126px; border-radius: 16px; overflow: hidden; flex: none; background: #d8c0ff; }
.bonus-image img { width: 100%; height: 100%; object-fit: cover; }
.bonus-card p { color: var(--muted); margin: 0 0 18px; }
.bonus-card p:last-child { margin-bottom: 0; }
.bonus-card-period { background: #fffcf3; border-color: #efe7d5; }
.bonus-card-period .big-number { color: #9c6a14; }
.bonus-card-period::after { content: ""; position: absolute; top: -170px; right: -120px; width: 360px; height: 360px; border: 1px solid #eddeb7; border-radius: 50%; box-shadow: 0 0 0 30px rgb(247 204 102 / 7%), 0 0 0 60px rgb(247 204 102 / 5%); z-index: -1; pointer-events: none; }
.bonus-card-period .bonus-card-top { justify-content: flex-start; }
.commission-intro { max-width: 650px; font-size: 1.1875rem; color: var(--muted); margin: -14px 0 34px 45px; }
.commission-grid { display: grid; grid-template-columns: 1fr 1.15fr; gap: 64px; }
.method { position: relative; }
.method-index { width: 37px; height: 37px; display: grid; place-items: center; border-radius: 11px; background: #ede6f8; color: #654399; font-size: .875rem; font-weight: 700; margin-bottom: 22px; }
.method p { color: var(--muted); margin: 0 0 24px; font-size: 1.0625rem; }
.method-first { padding: 30px; background: linear-gradient(140deg, #f6f2fc, #fff); border: 1px solid var(--line); border-radius: 22px; }
.method-first::after { content: ""; display: block; width: 140px; height: 65px; margin-top: 25px; background: radial-gradient(circle, rgb(121 80 188 / 25%) 1px, transparent 1.5px) 0 0 / 14px 14px; mask-image: linear-gradient(90deg, #000, transparent); }
.rate-list { margin: 0; padding: 0; list-style: none; }
.rate-list li { display: flex; justify-content: space-between; gap: 20px; padding: 19px 0; border-top: 1px solid var(--line); font-size: 1rem; line-height: 1.5; }
.rate-list strong { font-size: 1.5rem; font-weight: 550; letter-spacing: -.4px; line-height: 1; color: var(--purple); white-space: nowrap; }
.notice { display: flex; align-items: flex-start; gap: 17px; padding: 25px 30px; background: #faf8fe; border: 1px solid var(--line); border-radius: 16px; margin-top: 34px; }
.notice svg { width: 22px; height: 22px; flex: none; color: var(--purple); margin-top: 3px; }
.notice p { margin: 0; color: var(--muted); }
.steps-shell { position: relative; isolation: isolate; overflow: hidden; background: #30203f; color: white; }
.steps-shell::after { content: ""; position: absolute; width: 480px; height: 480px; top: -300px; right: -70px; border: 1px solid rgb(255 255 255 / 13%); border-radius: 50%; box-shadow: 0 0 0 45px rgb(255 255 255 / 3%), 0 0 0 90px rgb(255 255 255 / 2%); pointer-events: none; z-index: -1; }
.steps-shell .section { border: 0; }
.steps-shell .section-number { color: var(--yellow); }
.steps { list-style: none; padding: 0; margin: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 44px; }
.step-number { display: block; color: var(--yellow); font-size: 2.5rem; line-height: 1.2; font-weight: 400; letter-spacing: -1.5px; padding-bottom: 24px; margin-bottom: 26px; border-bottom: 1px solid rgb(255 255 255 / 20%); }
.steps h3 { font-size: 1.3125rem; letter-spacing: -.3px; }
.steps p { margin: 0; color: #d5c9df; }
.footer { padding-block: 46px; display: grid; grid-template-columns: 1.05fr 1fr 1fr; gap: 40px; }
.footer-logo { width: 115px; margin-bottom: 20px; }
.footer p { font-size: .875rem; color: var(--muted); margin: 0 0 13px; }
.footer a { font-size: .875rem; }
.footer-code { font-size: 1.5rem; font-weight: 650; color: var(--purple); letter-spacing: 1px; }
.support-links { display: grid; gap: 10px; }
.footer a:hover { color: var(--purple); }
@media(max-width:1000px) {
  .nav { gap: 16px; } .nav a { font-size: .8125rem; }
  .hero { gap: 40px; padding-block: 60px 64px; }
  h1 { letter-spacing: -2.5px; }
  .promo-card { padding: 26px; } .promo-divider { margin-inline: -26px; }
  .promo-value { font-size: 4.5rem; }
  .bonus-card { padding: 26px; } .bonus-image { width: 125px; height: 110px; }
  .big-number { font-size: 4.75rem; }
  .commission-grid { gap: 35px; } .steps { gap: 25px; }
}
@media(max-width:900px) {
  .wrap { width: calc(100% - 40px); }
  .header { min-height: 0; padding: 23px 0 18px; display: block; }
  .brand { width: fit-content; } .brand span { font-size: 1.375rem; }
  .nav { display: flex; flex-wrap: wrap; column-gap: 20px; row-gap: 13px; margin-top: 22px; }
  .nav a { font-size: .875rem; }
  .hero { grid-template-columns: 1fr; gap: 45px; padding-block: 40px 48px; }
  .hero h1 { font-size: 3.5rem; letter-spacing: -2.5px; }
  .eyebrow { font-size: .6875rem; letter-spacing: 1px; margin-bottom: 25px; }
  .hero-points li { font-size: 1rem; } .button { gap: 25px; padding-inline: 21px; }
  .promo-side { margin-inline: 4px; }
  .promo-side::before { inset: -12px -4px 110px 12px; transform: rotate(2deg); }
  .promo-card { padding: 26px; }
  .promo-value { font-size: 5.25rem; }
  .copy-code > span { font-size: 2.5rem; }
  .promo-terms { margin: 22px 0 0; }
  .section { padding-block: 48px; } .section-head { gap: 15px; margin-bottom: 28px; }
  h2 { font-size: 2rem; letter-spacing: -1px; } h3 { font-size: 1.4375rem; }
  .bonus-grid { grid-template-columns: 1fr; gap: 18px; }
  .bonus-card { padding: 26px; } .bonus-card-top { margin-bottom: 24px; min-height: 105px; }
  .bonus-image { width: 135px; height: 105px; }
  .big-number { font-size: 5rem; }
  .commission-intro { margin: -10px 0 28px; font-size: 1.0625rem; }
  .commission-grid { grid-template-columns: 1fr; gap: 32px; }
  .method-first { padding: 25px; } .method p { font-size: 1rem; }
  .method-first::after { height: 40px; margin-top: 15px; }
  .notice { padding: 22px; gap: 12px; } .notice p { font-size: .9375rem; }
  .steps { grid-template-columns: 1fr; gap: 30px; }
  .step-number { padding-bottom: 14px; margin-bottom: 20px; font-size: 2.125rem; }
  .steps h3 { font-size: 1.375rem; margin-bottom: 12px; }
  .footer { grid-template-columns: 1fr; gap: 26px; padding-block: 32px; }
  .footer > div + div { border-top: 1px solid var(--line); padding-top: 25px; }
}
@media(max-width:370px) {
  .wrap { width: calc(100% - 32px); }
  .hero h1 { font-size: 3rem; }
  .button { font-size: .9375rem; gap: 18px; }
  .promo-value { font-size: 4.5rem; }
  .bonus-image { width: 100px; height: 95px; }
  .big-number { font-size: 4.25rem; }
}
@media(prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
@media print {
  body { background: white; }
  .nav, .skip, .button, .copy-code svg, .copy-feedback { display: none; }
  .wrap { width: 100%; }
  .promo-card, .steps-shell { background: #fff; color: #30203f; box-shadow: none; border: 1px solid #ddd; }
  .steps p, .promo-card-top, .promo-description, .copy-code { color: #30203f; }
  .promo-side::before, .promo-card::before, .steps-shell::after { display: none; }
}

/* Free start for self-employed customers. */
.self-employed-panel { display: grid; grid-template-columns: 1.2fr 1fr; gap: 44px; padding: 40px; border: 1px solid var(--line); border-radius: 24px; background: radial-gradient(ellipse at 0 0, #f1eafa, transparent 65%), #faf8fe; }
.self-employed-label { display: block; margin: 0 0 18px; font-size: .8125rem; letter-spacing: .7px; text-transform: uppercase; font-weight: 600; color: var(--purple); }
.self-employed-price { font-size: 4.5rem; letter-spacing: -3px; line-height: 1.1; margin: 0 0 24px; font-weight: 550; }
.self-employed-price span { font-size: 1.125rem; letter-spacing: 0; font-weight: 400; }
.self-employed-copy > p:not(.self-employed-label):not(.self-employed-price) { color: var(--muted); }
.self-employed-features { padding-left: 20px; margin: 20px 0; color: var(--muted); line-height: 1.7; }
.self-employed-features li { padding-left: 5px; margin-bottom: 12px; }
.self-employed-features li::marker { color: var(--purple); }
.self-employed-copy .self-employed-note { font-size: .875rem; margin-bottom: 0; }
.self-employed-note a { display: inline-block; }
.self-employed-bonus { position: relative; isolation: isolate; overflow: hidden; align-self: center; padding: 34px; border: 1px solid #ecdfbd; border-radius: 20px; background: #fffaeb; }
.self-employed-bonus::before { content: ''; position: absolute; z-index: -1; width: 280px; height: 280px; border: 1px solid #e9d7a4; border-radius: 50%; right: -190px; top: -185px; box-shadow: 0 0 0 26px #f7cc6614, 0 0 0 52px #f7cc660e; }
.self-employed-bonus .self-employed-label { color: #87611b; }
.self-employed-amount { font-size: clamp(2.2rem, 3.8vw, 3.25rem); font-weight: 550; letter-spacing: -2px; line-height: 1.2; margin: 30px 0 12px; }
.self-employed-amount span { font-size: .65em; }
.self-employed-bonus h3 { font-size: 1.5rem; }
.self-employed-bonus p:not(.self-employed-amount) { color: #736447; }
.self-employed-bonus .self-employed-bonus-note { font-size: .875rem; border-top: 1px solid #ecdfbd; padding-top: 18px; margin-bottom: 0; }
@media(max-width:1000px) { .self-employed-panel { gap: 26px; padding: 28px; } .self-employed-bonus { padding: 26px; } }
@media(max-width:900px) { .self-employed-panel { grid-template-columns: 1fr; } .self-employed-amount { font-size: 3rem; } }
@media(max-width:370px) { .self-employed-panel { padding: 20px; } .self-employed-bonus { padding: 20px; } .self-employed-amount { font-size: 2.25rem; } }