/* ==========================================================================
   Aparat Income Landing – style.css
   بخش اول: reset پایه (معادل Preflight تیل‌ویند که پروژهٔ اصلی روی آن سوار بود)
   بخش دوم: استایل‌های اختصاصی صفحه
   ========================================================================== */

*, ::before, ::after { box-sizing: border-box; border: 0 solid; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; tab-size: 4; line-height: 1.5; -webkit-tap-highlight-color: transparent; }
h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
a { color: inherit; text-decoration: inherit; }
b, strong { font-weight: bolder; }
small { font-size: 80%; }
ol, ul, menu { list-style: none; }
img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; }
img, video { max-width: 100%; height: auto; }
button, input, select, optgroup, textarea { font: inherit; font-feature-settings: inherit; font-variation-settings: inherit; letter-spacing: inherit; color: inherit; opacity: 1; background-color: transparent; border-radius: 0; }
::placeholder { opacity: 1; color: color-mix(in oklab, currentcolor 50%, transparent); }
textarea { resize: vertical; }
button, input:where([type=button], [type=reset], [type=submit]) { -webkit-appearance: button; appearance: button; }
[hidden]:where(:not([hidden=until-found])) { display: none !important; }

/* --------------------------------------------------------------------------
   فونت
   -------------------------------------------------------------------------- */

:root {
  --ink: #262836;
  --muted: #666977;
  --line: #e9ebee;
  --surface: #f6f7f7;
  --brand: #ed174c;
  --brand-dark: #c90f3e;
  --brand-soft: #fff0f4;
  --green: #45b978;
  --green-dark: #29975d;
  --green-soft: #e7f7ee;
  --pink: #ef2b58;
  --shadow: 0 18px 55px rgb(31 35 42 / 8%);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; }
body { margin: 0; background: #fff; color: var(--ink); font-family: IRANSansX, 'Open Sans', Tahoma, Arial, sans-serif; font-feature-settings: 'ss02'; font-synthesis: none; -webkit-font-smoothing: antialiased; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
p { margin: 0; }

.site-header { position: sticky; top: 0; z-index: 50; height: 76px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 24px; padding: 0 clamp(24px, 5vw, 76px); background: rgb(255 255 255 / 92%); border-bottom: 1px solid var(--line); backdrop-filter: blur(18px); }
.brand { display: inline-flex; align-items: center; justify-self: start; }
.brand-logo { display: block; width: 96px; height: auto; }
.site-header > nav { height: 100%; display: flex; align-items: center; gap: 30px; color: #606270; font-size: 13px; font-weight: 700; }
.site-header > nav a { position: relative; height: 100%; display: grid; place-items: center; }
.site-header > nav a.active { color: var(--pink); }
.site-header > nav a.active::after { content: ''; position: absolute; bottom: 0; width: 34px; height: 3px; border-radius: 3px; background: var(--pink); }
.header-side { justify-self: end; display: flex; align-items: center; gap: 16px; }
.header-link { color: var(--muted); font-size: 13px; font-weight: 700; }
.menu-button { display: none; width: 42px; height: 42px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.menu-button span { display: block; width: 100%; height: 2px; margin: 4px 0; border-radius: 2px; background: var(--ink); }

.hero { min-height: 675px; display: grid; grid-template-columns: minmax(420px, .92fr) minmax(500px, 1.08fr); align-items: center; max-width: 1320px; margin: 0 auto; padding: 30px clamp(26px, 4vw, 64px) 40px; overflow: hidden; }
.hero-content { position: relative; z-index: 2; }
.eyebrow, .section-kicker { color: var(--brand); font-size: 12px; font-weight: 900; letter-spacing: .02em; }
.eyebrow { margin-bottom: 22px; }
.hero h1 { margin: 0; font-size: clamp(40px, 3.8vw, 58px); line-height: 1.28; letter-spacing: -2.4px; font-weight: 900; }
.hero-title-line { display: block; white-space: nowrap; }
.hero h1 em { color: var(--green-dark); font-style: normal; }
.hero-lead { max-width: 610px; margin-top: 24px; color: var(--muted); font-size: 17px; line-height: 2.05; }
.hero-actions { display: flex; gap: 12px; margin-top: 30px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 22px; border: 0; border-radius: 14px; cursor: pointer; font-size: 14px; font-weight: 900; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button:focus-visible, .faq-item button:focus-visible, .menu-button:focus-visible, .modal-close:focus-visible { outline: 3px solid rgb(237 23 76 / 28%); outline-offset: 3px; }
.button.primary { color: #fff; background: var(--brand); box-shadow: 0 12px 24px rgb(237 23 76 / 22%); }
.button.primary:hover { background: var(--brand-dark); }
.button:disabled { opacity: .6; pointer-events: none; transform: none; }
.button.secondary { border: 1px solid #dfe2e5; background: #fff; }
.hero-visual { min-height: 520px; position: relative; display: grid; place-items: center; }
.hero-glow { position: absolute; width: 76%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgb(237 23 76 / 10%), transparent 68%); filter: blur(4px); }
.hero-visual > img { position: relative; z-index: 1; width: min(690px, 112%); max-width: none; height: auto; transform: translateX(-1%); filter: drop-shadow(0 28px 34px rgb(25 27 33 / 13%)); }
.floating-stat { position: absolute; z-index: 2; display: grid; border: 1px solid rgb(255 255 255 / 90%); background: rgb(255 255 255 / 80%); box-shadow: 0 15px 34px rgb(37 41 46 / 13%); backdrop-filter: blur(12px); }
.stat-a { left: 0; bottom: 48px; min-width: 202px; padding: 16px 18px; border-color: rgb(69 185 120 / 34%); border-right: 4px solid var(--green); border-radius: 16px; }
.stat-a strong { color: var(--green-dark); font-size: 18px; }
.stat-a small { margin-top: 5px; color: #747881; font-size: 10px; }

.metrics { max-width: 1180px; margin: 0 auto 96px; display: grid; grid-template-columns: repeat(3, 1fr); padding: 25px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: var(--shadow); }
.metrics div { display: flex; flex-direction: column; align-items: center; gap: 9px; padding: 4px 24px; text-align: center; }
.metrics div + div { border-right: 1px solid var(--line); }
.metrics strong { color: var(--brand); font-size: 24px; }
.metrics span { color: var(--muted); font-size: 12px; }

.republish-section { max-width: 1180px; margin: 0 auto 70px; display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: center; padding: 68px; border-radius: 30px; background: #242731; color: #fff; }
.republish-copy h2 { margin: 10px 0 16px; font-size: clamp(38px, 4.3vw, 60px); line-height: 1.38; letter-spacing: -1.8px; }
.republish-title-line { display: block; white-space: nowrap; }
.republish-copy > p { max-width: 520px; color: #c4c7cf; font-size: 14px; line-height: 2; }
.republish-copy .button { margin-top: 26px; }
.republish-benefits { display: grid; gap: 12px; }
.republish-benefits article { display: grid; grid-template-columns: 52px 1fr; gap: 17px; align-items: start; padding: 21px; border: 1px solid #3b3e48; border-radius: 18px; background: #2b2e38; }
.republish-benefits article { border-color: rgb(237 23 76 / 44%); background: linear-gradient(110deg, rgb(237 23 76 / 15%), #2b2e38 56%); }
.republish-benefits article > span { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: #ff7598; background: #3a2932; font-size: 11px; font-weight: 900; }
.republish-benefits strong { font-size: 14px; }
.republish-benefits p { margin-top: 7px; color: #aeb1bb; font-size: 11px; line-height: 1.9; }

.section { max-width: 1180px; margin: 0 auto; padding: 96px 0; }
.section.earnings { padding-bottom: 48px; }
.section.calculator { padding-top: 48px; }
.section-heading { max-width: 700px; margin: 0 auto 44px; text-align: center; }
.section-heading h2, .earnings-header h2, .shorts-copy h2, .consultation h2, .faq-intro h2, .final-cta h2 { margin: 10px 0 14px; font-size: clamp(30px, 3vw, 44px); line-height: 1.45; letter-spacing: -1.2px; }
.section-heading p { color: var(--muted); font-size: 15px; line-height: 1.9; }
.factor-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.factor-card { position: relative; min-height: 290px; padding: 30px; overflow: hidden; border: 1px solid var(--line); border-radius: 22px; background: #fff; transition: transform .25s ease, box-shadow .25s ease; }
.factor-card:hover { transform: translateY(-5px); box-shadow: var(--shadow); }
.factor-icon { width: 52px; height: 52px; display: grid; place-items: center; border-radius: 16px; font-size: 22px; font-weight: 900; }
.icon-1 { color: #e9315c; background: #ffe9ee; }
.icon-2 { color: var(--brand); background: var(--brand-soft); }
.icon-3 { color: #7b63c8; background: #eeeafb; }
.factor-card h3 { margin: 28px 0 12px; font-size: 19px; }
.factor-card p { color: var(--muted); font-size: 13px; line-height: 2; }
.factor-number { position: absolute; left: 20px; bottom: 3px; color: #f2f3f4; font-size: 72px; font-weight: 900; }
.settlement-callout { margin-top: 24px; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; padding: 24px 26px; border-radius: 20px; background: #252833; color: #fff; }
.callout-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 15px; color: #fff; background: var(--green); font-weight: 900; }
.settlement-callout strong { font-size: 16px; }
.settlement-callout p { margin-top: 7px; color: #bfc1c9; font-size: 12px; line-height: 1.8; }
.settlement-callout a { color: #ff7598; font-size: 13px; font-weight: 900; }

.shorts-section { position: relative; isolation: isolate; max-width: 1260px; min-height: 650px; margin: 60px auto; padding: 50px clamp(30px, 5vw, 70px); display: grid; grid-template-columns: 1.05fr .95fr; align-items: center; gap: 54px; border: 1px solid #f2dce3; border-radius: 34px; background: linear-gradient(135deg, #fff3f6 0%, #fff 52%, #edf8f2 100%); color: var(--ink); box-shadow: 0 22px 60px rgb(62 38 47 / 9%); overflow: hidden; }
.shorts-section::after { content: ''; position: absolute; z-index: -1; left: -130px; bottom: -170px; width: 390px; height: 390px; border-radius: 50%; background: rgb(69 185 120 / 10%); filter: blur(4px); }
.shorts-image { position: relative; z-index: 1; height: 560px; display: grid; place-items: center; overflow: hidden; border: 1px solid rgb(237 23 76 / 15%); border-radius: 120px 28px 120px 28px; background: radial-gradient(circle at 50% 45%, #4a2733, #181a21 66%); box-shadow: 0 28px 55px rgb(40 32 36 / 16%); }
.shorts-image::before { content: ''; position: absolute; width: 420px; height: 420px; border-radius: 50%; background: linear-gradient(145deg, rgb(237 23 76 / 18%), rgb(69 185 120 / 13%)); filter: blur(20px); }
.shorts-image img { position: relative; width: 100%; height: 100%; max-height: 560px; max-width: 100%; object-fit: contain; }
.shorts-copy { position: relative; z-index: 2; }
.shorts-copy h2 { margin-top: 10px; font-size: clamp(38px, 4vw, 58px); }
.shorts-copy > p { max-width: 570px; color: var(--muted); font-size: 15px; line-height: 2; }
.shorts-features { margin-top: 32px; display: grid; gap: 12px; }
.shorts-features > div { display: grid; grid-template-columns: 42px 1fr; gap: 2px 14px; align-items: center; padding: 15px 16px; border: 1px solid rgb(230 224 227 / 90%); border-radius: 16px; background: rgb(255 255 255 / 82%); box-shadow: 0 8px 24px rgb(53 45 49 / 5%); backdrop-filter: blur(8px); }
.shorts-features span { grid-row: 1 / 3; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: var(--brand); background: var(--brand-soft); font-weight: 900; }
.shorts-features strong { font-size: 14px; }
.shorts-features small { color: #858995; font-size: 11px; }

.earnings-header { display: grid; grid-template-columns: 1.1fr .9fr; grid-template-areas: 'heading summary' 'period summary'; align-items: end; column-gap: 50px; row-gap: 4px; margin-bottom: 40px; }
.earnings-heading-copy { grid-area: heading; }
.earnings-header h2 { max-width: 650px; font-size: clamp(30px, 2.7vw, 42px); }
.earnings-title-line { display: block; white-space: nowrap; }
.earnings-period { grid-area: period; justify-self: start; display: inline-flex; align-items: center; min-height: 34px; padding: 0 13px; border: 1px solid #f0dce2; border-radius: 10px; color: var(--brand-dark); background: var(--brand-soft); font-size: 10px; font-weight: 900; }
.earnings-header > p { grid-area: summary; padding-bottom: 9px; color: var(--muted); font-size: 14px; line-height: 2; }
.earnings-header > p strong { color: var(--brand); }
.earnings-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.earning-card { display: grid; grid-template-columns: 56px 1fr auto; align-items: center; gap: 15px; padding: 21px; border: 1px solid var(--line); border-radius: 18px; background: #fff; }
.category-mark { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 15px; }
.mark-1, .mark-4 { color: #8d5a2d; background: #f8eadc; }
.mark-2, .mark-5 { color: #6951bb; background: #eeeafa; }
.mark-3, .mark-6 { color: var(--green-dark); background: var(--green-soft); }
.earning-card > div { display: flex; align-items: baseline; gap: 5px; }
.earning-card strong { color: var(--brand); font-size: 26px; }
.earning-card small { color: var(--muted); font-size: 9px; }
.earning-card p { color: var(--muted); font-size: 11px; }
.demo-note { margin-top: 14px; color: #999ba3; font-size: 10px; }

.steps-section { padding: 100px max(24px, calc((100vw - 1180px) / 2)); background: #242731; color: #fff; }
.section-heading.light p { color: #b7bac3; }
.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.step-card { position: relative; min-height: 252px; padding: 28px; border: 1px solid #3b3e48; border-radius: 22px; background: #2b2e39; }
.step-number { width: 44px; height: 44px; display: grid; place-items: center; margin-bottom: 28px; border-radius: 14px; color: #fff; background: var(--brand); font-weight: 900; }
.step-card small { color: #8f939e; font-size: 10px; }
.step-card h3 { margin: 7px 0 10px; font-size: 17px; }
.step-card p { color: #bfc2ca; font-size: 12px; line-height: 1.9; }
.step-arrow { position: absolute; left: -24px; top: 50%; z-index: 2; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; color: #8a8f99; background: #242731; }
.requirements { margin-top: 18px; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); align-items: center; border: 1px solid #3b3e48; border-radius: 20px; background: #20232b; }
.requirements > div { min-height: 92px; display: flex; flex-direction: column; justify-content: center; gap: 5px; padding: 18px 24px; }
.requirements > div + div { border-right: 1px solid #3b3e48; }
.requirements-title { flex-direction: row !important; align-items: center; gap: 14px !important; }
.requirements-title > span { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 14px; color: #ff7598; background: #3a2932; }
.requirements-title > span svg { display: block; }
.requirements small, .requirements span { color: #90949f; font-size: 10px; }
.requirements strong { font-size: 16px; }
.steps-actions { margin-top: 28px; display: flex; align-items: center; justify-content: center; gap: 24px; }
.policy-link { color: #c9cbd1; font-size: 12px; font-weight: 800; }

.success-section { padding: 100px 0 90px; overflow: hidden; }
.success-section .section-heading { padding: 0 24px; }
.testimonial-marquee { width: 100%; overflow-x: auto; overflow-y: hidden; padding: 10px 0 28px; direction: ltr; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.testimonial-marquee:focus-visible { outline: 3px solid rgb(237 23 76 / 28%); outline-offset: 3px; }
.testimonial-marquee::-webkit-scrollbar { height: 6px; }
.testimonial-marquee::-webkit-scrollbar-track { background: transparent; }
.testimonial-marquee::-webkit-scrollbar-thumb { background: var(--line); border-radius: 3px; }
.testimonial-track { width: max-content; display: flex; direction: ltr; }
.testimonial-group { display: flex; gap: 18px; padding-left: 18px; }
.creator-card { width: 318px; min-height: 300px; flex: 0 0 318px; display: flex; flex-direction: column; padding: 24px; border: 1px solid var(--line); border-radius: 22px; background: #fff; box-shadow: 0 12px 35px rgb(31 35 42 / 6%); direction: rtl; }
.creator-top { display: flex; align-items: center; gap: 13px; }
.creator-avatar { width: 62px; height: 62px; flex: 0 0 auto; border: 4px solid #fff; border-radius: 50%; object-fit: cover; box-shadow: 0 6px 18px rgb(31 35 42 / 14%); }
.creator-meta { display: flex; flex-direction: column; gap: 5px; }
.creator-meta strong { font-size: 14px; }
.creator-card blockquote { flex: 1; margin: 22px 0 20px; color: #555966; font-size: 12px; line-height: 2.1; }
.creator-card > a { align-self: flex-start; color: var(--brand); font-size: 11px; font-weight: 900; }
.media-cards { max-width: 1180px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; padding: 0; }
.media-cards article { display: grid; grid-template-columns: 72px 1fr; gap: 20px; align-items: start; padding: 28px; border: 1px solid var(--line); border-radius: 22px; background: #f8f8f9; }
.media-cards article > span { width: 68px; height: 68px; display: grid; place-items: center; border-radius: 20px; color: #fff; background: var(--brand); font-size: 16px; font-weight: 900; }
.media-cards article:nth-child(2) > span { color: #ff7598; background: #292c36; }
.media-cards h3 { margin: 1px 0 8px; font-size: 18px; }
.media-cards p { color: var(--muted); font-size: 11px; line-height: 1.9; }
.media-cards a { display: inline-flex; align-items: center; gap: 8px; margin-top: 14px; color: var(--brand); font-size: 11px; font-weight: 900; }
.media-cards i { font-style: normal; }

.consultation { max-width: 1180px; margin: 60px auto; padding: 46px 54px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 40px; border-radius: 28px; background: linear-gradient(115deg, #242731 0%, #312832 58%, #7d1736 140%); color: #fff; overflow: hidden; }
.consultation > div { max-width: 720px; }
.consultation > div > span { color: #ff89a6; font-size: 11px; font-weight: 900; }
.consultation h2 { margin: 9px 0 10px; font-size: 31px; }
.consultation p { color: #d6d8de; font-size: 13px; line-height: 1.9; }
.consultation-button { color: var(--brand-dark); background: #fff; box-shadow: 0 14px 30px rgb(0 0 0 / 18%); }

.faq-section { display: grid; grid-template-columns: .38fr .62fr; gap: 70px; align-items: start; }
.faq-intro { position: sticky; top: 110px; }
.faq-intro p { margin-bottom: 22px; color: var(--muted); font-size: 13px; line-height: 1.9; }
.faq-intro a { color: var(--brand); font-size: 12px; font-weight: 900; }
.faq-links { display: flex; flex-direction: column; align-items: flex-start; gap: 12px; }
.faq-list { border-top: 1px solid var(--line); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item h3 { margin: 0; }
.faq-item button { width: 100%; min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 16px 2px; border: 0; background: transparent; color: var(--ink); cursor: pointer; text-align: right; font-size: 14px; font-weight: 900; }
.faq-item button i { width: 30px; height: 30px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 10px; color: var(--brand); background: var(--brand-soft); font-style: normal; font-size: 18px; }
.faq-answer p { max-width: 720px; padding: 0 2px 24px; color: var(--muted); font-size: 12px; line-height: 2.05; }

.final-cta { max-width: 1180px; margin: 60px auto 100px; padding: 74px 30px; position: relative; overflow: hidden; border-radius: 30px; background: #242731; color: #fff; text-align: center; }
.final-cta::before, .final-cta::after { content: ''; position: absolute; width: 260px; height: 260px; border-radius: 50%; background: rgb(237 23 76 / 12%); filter: blur(5px); }
.final-cta::before { top: -130px; right: -80px; }
.final-cta::after { bottom: -150px; left: -70px; background: rgb(239 43 88 / 10%); }
.final-cta > span { color: #ff7598; font-size: 11px; font-weight: 900; }
.final-cta h2 { position: relative; z-index: 1; margin: 11px 0 13px; font-size: clamp(34px, 4vw, 54px); }
.final-cta p { color: #bfc2ca; font-size: 13px; }
.final-cta > div { position: relative; z-index: 1; display: flex; justify-content: center; gap: 12px; margin-top: 28px; }
.dark-outline { color: #fff; border: 1px solid #50535d; background: #2c2f39; }

footer { min-height: 140px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 30px; padding: 36px max(24px, calc((100vw - 1180px) / 2)); border-top: 1px solid var(--line); background: #fafafa; }
.footer-brand { display: flex; align-items: center; gap: 12px; }
.footer-logo { display: block; width: 88px; height: auto; }
footer nav { display: flex; gap: 22px; color: var(--muted); font-size: 11px; font-weight: 700; }
footer > p { justify-self: end; color: #9699a0; font-size: 10px; }

.modal-backdrop { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 20px; background: rgb(18 20 25 / 62%); backdrop-filter: blur(5px); }
.modal { width: min(600px, 100%); max-height: calc(100vh - 40px); position: relative; padding: 36px; overflow-y: auto; border-radius: 24px; background: #fff; box-shadow: 0 32px 90px rgb(0 0 0 / 28%); }
.modal-close { position: absolute; top: 18px; left: 18px; width: 38px; height: 38px; border: 0; border-radius: 12px; background: #f1f2f3; cursor: pointer; font-size: 23px; }
.modal-header { margin-bottom: 24px; text-align: center; }
.modal h2 { margin: 10px 0 12px; font-size: 27px; }
.modal-lead { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.9; }
.modal form { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
.modal label { display: flex; flex-direction: column; gap: 7px; color: #525562; font-size: 11px; font-weight: 800; }
.modal .modal-full-field, .modal form .button, .form-error { grid-column: 1 / -1; }
.form-error { margin: -3px 0 0; color: var(--brand-dark); font-size: 10px; line-height: 1.7; }
.modal input, .modal select { width: 100%; height: 48px; padding: 0 13px; border: 1px solid #dfe2e5; border-radius: 12px; background: #fff; color: var(--ink); font-size: 16px; outline: none; }
.modal input:focus, .modal select:focus { border-color: var(--brand); box-shadow: 0 0 0 3px rgb(237 23 76 / 10%); }
.modal input[name='link'], .modal input[name='email'] { direction: ltr; }
.modal input[name='link']::placeholder, .modal input[name='email']::placeholder { text-align: right; }
.modal form .button { margin-top: 10px; }
.page-toast { position: fixed; bottom: 24px; left: 50%; z-index: 200; max-width: min(420px, calc(100% - 32px)); padding: 12px 18px; border-radius: 14px; background: #262836; color: #fff; font-size: 13px; font-weight: 700; box-shadow: 0 16px 40px rgb(0 0 0 / 22%); transform: translateX(-50%); }
.form-success { min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.form-success > span { width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: var(--brand); font-size: 28px; }
.form-success p { max-width: 360px; margin: 0 0 22px; color: var(--muted); font-size: 12px; line-height: 1.9; }

@media (max-width: 1220px) {
  .section, .metrics, .consultation, .final-cta, .republish-section { margin-left: 24px; margin-right: 24px; }
  .section { padding-left: 0; padding-right: 0; }
  .shorts-section { margin-left: 24px; margin-right: 24px; }
  .media-cards { margin-left: 24px; margin-right: 24px; }
}

@media (max-width: 980px) {
  .site-header { grid-template-columns: 1fr auto; }
  .site-header > nav { display: none; position: absolute; top: 64px; left: 18px; right: 18px; height: auto; flex-direction: column; gap: 0; padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--shadow); }
  .site-header > nav.open { display: flex; }
  .site-header > nav a { width: 100%; min-height: 48px; }
  .site-header > nav a.active::after { display: none; }
  .menu-button { display: block; }
  .hero { grid-template-columns: 1fr; padding-top: 22px; text-align: center; }
  .hero-content { display: flex; flex-direction: column; align-items: center; }
  .hero-visual { grid-row: 1; min-height: 390px; }
  .hero-visual > img { width: min(660px, 100%); }
  .stat-a { left: 7%; bottom: 18px; }
  .republish-section { grid-template-columns: 1fr; gap: 40px; padding: 54px; text-align: center; }
  .republish-copy { display: flex; flex-direction: column; align-items: center; }
  .republish-benefits { width: min(680px, 100%); margin: 0 auto; text-align: right; }
  .factor-grid, .earnings-grid { grid-template-columns: 1fr 1fr; }
  .earnings-header h2 { font-size: clamp(30px, 3.9vw, 38px); }
  .shorts-section { grid-template-columns: 1fr; gap: 34px; text-align: center; }
  .shorts-image { width: min(600px, 100%); height: 460px; margin: 0 auto; }
  .shorts-copy { display: flex; flex-direction: column; align-items: center; }
  .shorts-features { width: min(540px, 100%); text-align: right; }
  .steps-grid { grid-template-columns: 1fr; }
  .step-card { min-height: 180px; display: grid; grid-template-columns: 60px 1fr; align-items: start; gap: 16px; }
  .step-arrow { display: none; }
  .requirements { grid-template-columns: 1fr 1fr; }
  .requirements > div + div { border-right: 0; }
  .requirements > div:nth-child(even) { border-right: 1px solid #3b3e48; }
  .requirements > div:nth-child(n+3) { border-top: 1px solid #3b3e48; }
  .media-cards { grid-template-columns: 1fr; }
  .faq-section { grid-template-columns: 1fr; gap: 30px; }
  .faq-intro { position: static; text-align: center; }
  .faq-links { align-items: center; }
  footer { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  footer > p { justify-self: center; }
}

@media (max-width: 680px) {
  html { scroll-padding-top: 70px; }
  .site-header { height: 64px; padding: 0 18px; }
  .brand-logo { width: 82px; }
  .header-link { display: none; }
  .hero { min-height: 0; padding: 14px 18px 44px; }
  .hero-visual { min-height: 0; display: block; width: 100%; margin-bottom: 26px; }
  .hero-visual > img { display: block; width: 100%; margin: 0 auto; transform: none; }
  .eyebrow { margin-bottom: 16px; }
  .hero h1 { width: 100%; font-size: clamp(24px, 8.7vw, 37px); letter-spacing: -1.3px; }
  .hero-lead { margin-top: 18px; font-size: 14px; line-height: 1.95; }
  .hero-actions { width: 100%; flex-direction: column; }
  .button { width: 100%; }
  .stat-a { right: 8px; left: auto; bottom: 10px; min-width: 0; padding: 9px 11px; border-right-width: 3px; border-radius: 12px; text-align: right; transform: none; }
  .stat-a strong { font-size: 13px; line-height: 1.35; white-space: nowrap; }
  .stat-a small { margin-top: 2px; font-size: 8px; }
  .metrics { grid-template-columns: 1fr; margin: 0 18px 45px; padding: 10px 20px; }
  .metrics div { padding: 18px 10px; }
  .metrics div + div { border-right: 0; border-top: 1px solid var(--line); }
  .republish-section { margin: 0 18px 40px; padding: 40px 22px; border-radius: 24px; }
  .republish-copy h2 { font-size: 38px; }
  .republish-copy .button { width: 100%; }
  .republish-benefits article { grid-template-columns: 44px 1fr; padding: 17px; }
  .republish-benefits article > span { width: 42px; height: 42px; }
  .section { margin: 0 18px; padding: 66px 0; }
  .section.earnings { padding-bottom: 33px; }
  .section.calculator { padding-top: 33px; }
  .section-heading { margin-bottom: 30px; }
  .section-heading h2, .earnings-header h2, .consultation h2, .faq-intro h2 { font-size: 30px; }
  .factor-grid, .earnings-grid { grid-template-columns: 1fr; }
  .factor-card { min-height: 250px; }
  .factor-number { top: 18px; bottom: auto; left: 18px; font-size: 54px; line-height: 1; }
  .settlement-callout { grid-template-columns: auto 1fr; padding: 20px; }
  .settlement-callout a { grid-column: 1 / -1; padding-right: 64px; }
  .shorts-section { margin: 30px 18px; padding: 38px 20px 24px; gap: 28px; border-radius: 24px; }
  .shorts-image { width: 100%; height: auto; aspect-ratio: 2 / 3; overflow: hidden; border-radius: 72px 22px 72px 22px; }
  .shorts-image img { width: 100%; height: 100%; max-height: 100%; object-fit: contain; }
  .shorts-copy h2 { font-size: 38px; }
  .earnings-header { grid-template-columns: 1fr; grid-template-areas: 'heading' 'summary' 'period'; gap: 20px; text-align: center; }
  .earnings-header h2 { font-size: 30px; }
  .earnings-title-line { white-space: normal; }
  .earnings-header > p { padding-bottom: 0; }
  .earnings-period { justify-self: center; }
  .steps-section { padding: 74px 18px; }
  .step-card { grid-template-columns: 48px 1fr; padding: 22px; }
  .step-number { width: 42px; height: 42px; }
  .requirements { grid-template-columns: 1fr; }
  .requirements > div + div, .requirements > div:nth-child(even) { border-right: 0; border-top: 1px solid #3b3e48; }
  .requirements-title { border-top: 0 !important; }
  .steps-actions { flex-direction: column; }
  .success-section { padding: 70px 0 60px; }
  .creator-card { width: 282px; min-height: 280px; flex-basis: 282px; }
  .media-cards { margin: 0 18px; }
  .media-cards article { grid-template-columns: 58px 1fr; padding: 20px; }
  .media-cards article > span { width: 56px; height: 56px; border-radius: 17px; font-size: 13px; }
  .consultation { margin: 30px 18px; padding: 34px 24px; grid-template-columns: 1fr; text-align: center; }
  .faq-item button { min-height: 68px; font-size: 13px; }
  .final-cta { margin: 30px 18px 70px; padding: 58px 20px; }
  .final-cta > div { flex-direction: column; }
  footer { padding: 36px 20px; }
  footer nav { flex-wrap: wrap; justify-content: center; gap: 15px; }
  .modal { padding: 30px 20px; }
  .modal form { grid-template-columns: 1fr; }
  .modal label, .modal .modal-full-field, .modal form .button, .form-error { grid-column: 1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
