/* =========================================================================
   Guides family (group 5, prefix gd-) — shared by the seven guide pages.
   A  "landing guide" template (flat header): big photo hero, trust strip, step cards, guide lead box,
      FAQ in two columns, navy CTA panel.  Pages: affiliate-marketing-for-beginners (amb-),
      how-affiliate-marketing-works (haw-), how-to-start-affiliate-marketing (hts-),
      how-to-choose-an-affiliate-niche (hcn-), how-to-find-affiliate-programs (hfp-).
   B  "article + sidebar" template (default header): desk hero, icon strip, main column + sidebar.
      Pages: email-marketing-for-affiliates (emf-), seo-for-affiliate-marketing (seo-).
   Sizes: the designs are 1024px compositions; at 1280px 1 design px = 0.085rem.
   1 hero · 2 trust strip · 3 section heads · 4 cards & steps · 5 guide lead box · 6 quotes · 7 FAQ
   8 CTA panel · 9 template B · 10 page specifics · 11 responsive
   ========================================================================= */

/* ---------- 1. Photo hero with a right-anchored figure (overlays stay aligned at every width) ---------- */
.gd-hero { position: relative; isolation: isolate; overflow: hidden; background: #f6f9fc; min-height: var(--gd-hero-h, 32.3rem); display: flex; align-items: center; }
.gd-hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: var(--gd-hero-blur) left center / cover no-repeat; filter: blur(18px) saturate(.9); opacity: .55; transform: scale(1.1); }
.gd-hero__fig { position: absolute; top: 0; right: 0; z-index: 0; height: 100%; aspect-ratio: var(--gd-ratio, 16 / 9); margin: 0; container-type: inline-size; }
.gd-hero__fig > img { display: block; width: 100%; height: 100%; }
.gd-hero__fig::before { content: ""; position: absolute; inset: 0 auto 0 0; width: var(--gd-fade-w, 34%); background: linear-gradient(90deg, rgba(246, 249, 252, 1) 0%, rgba(246, 249, 252, .82) 35%, rgba(246, 249, 252, 0) 100%); }
.gd-hero::after { content: ""; position: absolute; inset: 0 auto 0 0; z-index: -1; width: var(--gd-wash, 46%); background: linear-gradient(90deg, rgba(247, 250, 253, .97) 0%, rgba(247, 250, 253, .93) 72%, rgba(247, 250, 253, 0) 100%); }
.gd-hero__inner { position: relative; z-index: 1; width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; padding-block: 1.05rem .9rem; }
.gd-hero__copy { max-width: var(--gd-copy, 38.5rem); }
.gd-hero .breadcrumb { font-size: .78rem; margin-bottom: .4rem; }
.gd-hero .pill { font-size: .98rem; padding: .1rem .55rem; letter-spacing: .01em; border-radius: 5px; background: #dbeafc; color: #1662c9; font-weight: 600; }
.gd-hero__title { margin: .5rem 0 .2rem; font-size: clamp(2.3rem, 1.2rem + 3.6vw, 4.95rem); line-height: .97; letter-spacing: -.035em; color: #0c1f45; }
.gd-hero__lead { margin: 0 0 .55rem; font-size: max(clamp(1rem, .9rem + .45vw, 1.32rem), 16px) /* rt-1019 */; line-height: 1.32; color: #1d2b45; }
.gd-checks { gap: .24rem; margin-bottom: .85rem; }
.gd-checks li { font-size: max(clamp(.95rem, .88rem + .3vw, 1.2rem), 16px) /* rt-1019 */; padding-left: 2.15rem; color: #1f2c44; line-height: 1.3; }
.gd-checks li::before { width: 1.35rem; height: 1.35rem; top: .02em; background-color: #22a447; }
.gd-hero__cta { width: min(100%, 33.6rem); min-height: 3.2rem; font-size: clamp(1.02rem, .95rem + .3vw, 1.3rem); font-weight: 700; border-radius: 4px; background: #127a31; border-color: #127a31; }
.gd-hero__cta .icon { width: 1.3em; height: 1.3em; }
.gd-fine { display: flex; align-items: center; justify-content: center; gap: .35rem; margin: .5rem 0 0; font-size: max(.9rem, 14px) /* rt-1019 */; color: #3d4a60; }
.gd-hero .gd-fine { width: min(100%, 33.6rem); }
.gd-fine .icon { width: 1.05em; height: 1.05em; color: #f2a516; }
/* Handwritten notes and arrows over the photo (positions in % of the figure, sizes in cqw so they scale with it) */
.gd-note { position: absolute; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(2.55cqw, 14px) /* rt-1019 */; line-height: 1.1; color: #0f1c36; text-align: center; transform: rotate(-7deg); }
.gd-arrow { position: absolute; width: 4.2cqw; height: 4.2cqw; fill: none; stroke: #13213d; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

/* ---------- 2. Trust strip under the hero ---------- */
.gd-trust { background: #f2f6fb; border-top: 1px solid #e3eaf3; border-bottom: 1px solid #e8eef5; }
.gd-trust__list { list-style: none; margin: 0 auto; padding: 0; width: min(100% - 2 * var(--gutter), var(--container)); min-height: 5.35rem; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); align-items: center; gap: .75rem 1.5rem; }
.gd-trust__item { display: flex; align-items: center; gap: 1.05rem; padding-left: .5rem; }
.gd-trust__item > .icon { width: 3.3rem; height: 3.3rem; }
.gd-trust__item strong { display: block; font-family: var(--font-head); font-size: 1.16rem; font-weight: 800; color: #0c1f45; letter-spacing: -.01em; }
.gd-trust__item div > span { display: block; font-size: 1.05rem; color: #3d4a60; line-height: 1.3; }
.gd-ico-green { color: #1f9d44; } .gd-ico-blue { color: #1673e6; } .gd-ico-purple { color: #7b3fe0; } .gd-ico-orange { color: #f39a12; }
.gd-ico-red { color: #e5484d; } .gd-ico-teal { color: #14a8a8; } .gd-ico-pink { color: #e63e7a; } .gd-ico-navy { color: #0c2b5c; }
.gd-trust__badge { display: inline-grid; place-items: center; flex: none; width: 3.3rem; height: 3.3rem; border-radius: 50%; color: #fff; }
.gd-trust__badge .icon { width: 58%; height: 58%; }
.gd-trust__badge.gd-bg-purple { background: #7b3fe0; }

/* ---------- 3. Section heads ---------- */
.gd-sec { padding-block: .5rem .1rem; }
.gd-head { text-align: center; margin-bottom: .7rem; }
.gd-head h2 { margin: 0 0 .25rem; font-size: clamp(1.45rem, 1.1rem + 1vw, 2.05rem); letter-spacing: -.03em; color: #0c1f45; }
.gd-head p { margin: 0; font-size: 1.06rem; color: #3d4a60; }
.gd-earn { margin: .35rem 0 0; font-size: max(.82rem, 16px) /* rt-1019 */; color: var(--muted); }
span.gd-earn { display: inline; margin: 0; }
.gd-earn a { color: inherit; }

/* ---------- 4. Cards & steps ---------- */
.gd-learn { --gap: .75rem; }
.gd-learn__card { display: flex; gap: 1.6rem; align-items: flex-start; padding: 1.4rem 1.25rem 1.25rem 1.6rem; min-height: 8.25rem; border-color: #e3e9f1; box-shadow: 0 1px 3px rgba(13, 31, 60, .05); }
.gd-learn__card > .icon { width: 3.7rem; height: 3.7rem; margin-top: .2rem; }
.gd-learn__card h3 { margin: 0 0 .3rem; font-size: 1.16rem; color: #0c1f45; }
.gd-learn__card p { margin: 0; font-size: max(1.04rem, 16px) /* rt-1019 */; line-height: 1.38; color: #3d4a60; }
.gd-ico-fill { fill: currentColor; stroke: none; }

/* Numbered process cards with a coloured number circle on top and arrows between */
.gd-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 2.6rem; }
.gd-steps > li { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: 3.5rem 1.1rem .95rem; border-radius: 6px; background: var(--gd-tint, #f1f6fd); border: 1px solid var(--gd-tint-bd, #e2ebf7); }
.gd-steps > li + li::before { content: ""; position: absolute; left: -2.05rem; top: 50%; width: 1.5rem; height: 1.5rem; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E"); }
.gd-steps .gd-num { position: absolute; top: .85rem; left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--gd-c, #1673e6); color: #fff; font-family: var(--font-head); font-weight: 800; font-size: 1.3rem; }
.gd-steps .gd-step__ico { width: 3.1rem; height: 3.1rem; color: var(--gd-c, #1673e6); margin-bottom: .4rem; }
.gd-steps h3 { margin: 0 0 .3rem; font-size: 1.16rem; color: #0c1f45; line-height: 1.18; }
.gd-steps p { margin: 0; font-size: max(1rem, 16px) /* rt-1019 */; line-height: 1.34; color: #3d4a60; }
.gd-t-blue { --gd-c: #1673e6; --gd-tint: #f0f6fe; --gd-tint-bd: #dfeaf9; }
.gd-t-green { --gd-c: #1f9d44; --gd-tint: #f0f8f1; --gd-tint-bd: #dcefdf; }
.gd-t-purple { --gd-c: #7b3fe0; --gd-tint: #f6f2fd; --gd-tint-bd: #e8def9; }
.gd-t-orange { --gd-c: #f39a12; --gd-tint: #fff7ec; --gd-tint-bd: #f8e6c8; }
.gd-t-red { --gd-c: #e5484d; --gd-tint: #fdf2f2; --gd-tint-bd: #f6dcdd; }
.gd-t-teal { --gd-c: #14a8a8; --gd-tint: #eef9f8; --gd-tint-bd: #d3eeec; }

/* Row of four "why" items in a tinted band */
.gd-why { background: #f2f6fc; border: 1px solid #e3ebf6; border-radius: 6px; padding: .9rem 2rem 1.1rem; }
.gd-why .gd-head { margin-bottom: .9rem; }
.gd-why__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem 2rem; }
.gd-why__list li { display: flex; align-items: flex-start; gap: 1.6rem; }
.gd-why__list .gd-circle { margin-top: -.2rem; }
.gd-why__list h3 { margin: 0 0 .2rem; font-size: 1.04rem; color: #0c1f45; }
.gd-why__list p { margin: 0; font-size: max(.98rem, 16px) /* rt-1019 */; color: #3d4a60; line-height: 1.38; }
.gd-circle { display: inline-grid; place-items: center; flex: none; width: var(--s, 4.1rem); height: var(--s, 4.1rem); border-radius: 50%; background: var(--gd-c, #1f9d44); color: #fff; }
.gd-circle .icon { width: 52%; height: 52%; }
.gd-c-green { --gd-c: #1f9d44; } .gd-c-blue { --gd-c: #1673e6; } .gd-c-purple { --gd-c: #7b3fe0; } .gd-c-orange { --gd-c: #f39a12; }
.gd-c-red { --gd-c: #e5484d; } .gd-c-teal { --gd-c: #14a8a8; } .gd-c-pink { --gd-c: #e63e7a; } .gd-c-navy { --gd-c: #0c2b5c; } .gd-c-gold { --gd-c: #f2b705; }

/* ---------- 5. Guide lead box (ebook + copy + optional photo) ---------- */
.gd-guide { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: var(--gd-guide-cols, 30% minmax(0, 1fr)); align-items: center; gap: 1rem 2rem; padding: 1.2rem 2rem 1.1rem 1.5rem; border-radius: 6px; background: linear-gradient(100deg, #eef4fc 0%, #f4f8fd 55%, #eaf2fb 100%); border: 1px solid #dfe9f6; }
.gd-guide__media { position: relative; display: flex; align-items: flex-end; justify-content: center; min-height: 22rem; }
.gd-guide__media .ebook { --w: 17rem; z-index: 1; margin-left: 4.5rem; transform: perspective(900px) rotateY(-10deg); }
.gd-guide__plant { position: absolute; z-index: 2; left: -.5rem; bottom: -.4rem; width: 11rem; height: auto; mix-blend-mode: multiply; }
.gd-guide__note { position: absolute; left: 0; top: .5rem; z-index: 2; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: 1.5rem; line-height: 1.12; color: #13213d; text-align: center; transform: rotate(-12deg); }
.gd-guide__note .gd-arrow { position: static; display: block; margin: .2rem 0 0 3.5rem; width: 2.6rem; height: 2.6rem; transform: rotate(-10deg); }
.gd-guide .pill { font-size: .98rem; padding: .1rem .55rem; letter-spacing: .01em; border-radius: 5px; background: #dbeafc; color: #1662c9; font-weight: 600; }
.gd-guide h2 { margin: .45rem 0 .45rem; font-size: clamp(1.6rem, 1.2rem + 1.2vw, 2.45rem); line-height: 1.02; letter-spacing: -.035em; color: #0c1f45; }
.gd-guide__text { margin: 0 0 .6rem; font-size: 1.06rem; line-height: 1.38; color: #2c3a52; max-width: 31rem; }
.gd-guide .checklist { gap: .3rem; margin-bottom: 1rem; }
.gd-guide .checklist li { font-size: max(1.02rem, 16px) /* rt-1019 */; padding-left: 2rem; color: #2c3a52; }
.gd-guide .checklist li::before { width: 1.3rem; height: 1.3rem; top: -.04em; background-color: #22a447; }
.gd-guide .btn { min-height: 3.25rem; padding-inline: 2.4rem; font-size: 1.28rem; font-weight: 700; border-radius: 4px; background: #127a31; border-color: #127a31; }
.gd-guide .btn .icon { width: 1.3em; height: 1.3em; }
.gd-guide .gd-fine { justify-content: flex-start; padding-left: 5.5rem; }
/* Ebook covers in this family: navy with HTML title, green band and an icon row */
.gd-book { background: linear-gradient(160deg, #13305e 0%, #0b2149 60%, #091a3a 100%); }
.gd-book .ebook__brand { background: none; color: #fff; font-size: .6rem; margin-top: 1.1rem; }
.gd-book .ebook__brand img { width: 22px; filter: brightness(0) invert(1); }
.gd-book .ebook__title { font-family: "Plus Jakarta Sans", var(--font-head); font-size: calc(var(--w) * .118); letter-spacing: -.02em; margin-top: .9rem; }
.gd-book .ebook__band { margin-top: .8rem; padding: .45rem .4rem; font-size: calc(var(--w) * .056); background: #19a245; }
.gd-book__icons { position: relative; z-index: 1; display: flex; justify-content: center; align-items: flex-end; gap: .6rem; margin: auto 0 1.2rem; }
.gd-book__icons .icon { width: calc(var(--w) * .17); height: calc(var(--w) * .17); }
.gd-book__icons .gd-coin { display: inline-grid; place-items: center; width: calc(var(--w) * .19); height: calc(var(--w) * .19); border-radius: 50%; background: #f5b700; color: #0b2149; }
.gd-book__icons .gd-coin .icon { width: 70%; height: 70%; }
/* Photo on the right side of a lead box (fades into the box) */
.gd-guide__photo { position: absolute; top: 0; right: 0; z-index: -1; height: 100%; aspect-ratio: var(--gd-photo-ratio, 8 / 7); margin: 0; container-type: inline-size; }
.gd-guide__photo img { width: 100%; height: 100%; }
.gd-guide__photo::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 45%; background: linear-gradient(90deg, #f1f6fc, rgba(241, 246, 252, 0)); }

/* ---------- 6. Reader quotes (placeholders until real, verified quotes exist) ---------- */
.gd-quote { margin: 0; height: 100%; display: flex; gap: 1.6rem; align-items: flex-start; padding: 1rem 1.2rem 1rem 1rem; min-height: 9.9rem; border-color: #e3e9f1; box-shadow: 0 1px 3px rgba(13, 31, 60, .05); }
.gd-quote .avatar { --s: 5.6rem; background: #e8eef7; color: #8a9ab3; }
.gd-quote .stars { font-size: 1.15rem; margin-bottom: .45rem; }
.gd-quote blockquote { margin: 0; font-size: 1.06rem; line-height: 1.4; color: #2c3a52; }
.gd-quote figcaption { margin-top: .4rem; font-size: 1.04rem; color: #3d4a60; }

/* ---------- 7. FAQ (two columns of chevron accordions) ---------- */
.gd-faq { gap: .4rem 2.5rem; }
.gd-faq details { border-color: #dfe6ef; border-radius: 4px; box-shadow: 0 1px 2px rgba(13, 31, 60, .04); }
.gd-faq summary { padding: .3rem 1.4rem; min-height: 2.05rem; font-size: .98rem; font-weight: 600; color: #0c1f45; }
.gd-faq summary::after { width: 7px; height: 7px; border-width: 0 2px 2px 0; }
.gd-faq .accordion__body { padding: 0 1.4rem .9rem; font-size: max(.98rem, 16px) /* rt-1019 */; line-height: 1.5; }

/* ---------- 8. Navy CTA panel with a sunset photo on the right ---------- */
.gd-cta { position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem 2.2rem; min-height: 8.6rem; padding: 1rem 10.5rem 1rem 2.4rem; border-radius: 4px; background: linear-gradient(90deg, #0b2347 0%, #0d2a55 55%, #102d57 100%); color: #dfe7f3; }
.gd-cta__ico { width: 5.4rem; height: 5.4rem; color: #fff; }
.gd-cta h2 { margin: 0 0 .3rem; font-size: clamp(1.25rem, 1rem + .8vw, 1.65rem); color: #fff; letter-spacing: -.025em; }
.gd-cta p { margin: 0; font-size: 1.06rem; line-height: 1.45; color: #e1e8f3; max-width: 38rem; }
.gd-cta__act { display: grid; justify-items: center; gap: .55rem; }
.gd-cta .btn { min-height: 3rem; padding-inline: 1.8rem; font-size: 1.05rem; font-weight: 700; border-radius: 3px; background: #127a31; border-color: #127a31; }
.gd-cta .btn .icon { width: 1.3em; height: 1.3em; }
.gd-cta .gd-fine { margin: 0; color: #d6deea; font-size: max(.82rem, 14px) /* rt-1019 */; }
.gd-cta__photo { position: absolute; inset: 0 0 0 auto; z-index: -1; width: 24%; margin: 0; }
.gd-cta__photo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--gd-cta-pos, 60% 60%); }
.gd-cta__photo::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #0d2a55 0%, rgba(13, 42, 85, .55) 30%, rgba(13, 42, 85, 0) 65%); }
.gd-cta__note { position: absolute; right: 7.5rem; top: .9rem; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: 1.5rem; line-height: 1.05; color: #fff; text-align: center; transform: rotate(-8deg); }
.gd-cta__note::after { content: ""; display: block; width: 70%; height: 3px; margin: .3rem auto 0; border-radius: 3px; background: #26a646; transform: rotate(-3deg); }
.gd-cta--stack { grid-template-columns: minmax(0, 1fr); padding-left: 3.5rem; }
.gd-cta--stack .gd-cta__act { justify-items: start; }

/* Page wrapper spacing for template A */
.gd-page { padding-bottom: 1.4rem; }
.gd-page > * + * { margin-top: .75rem; }

/* ---------- 9. Template B: desk hero, icon strip, article column + sidebar ---------- */
.gd-hero--desk { --gd-hero-h: 14.6rem; --gd-ratio: 16 / 5; --gd-copy: 35rem; --gd-wash: 52%; --gd-fade-w: 26%; }
.gd-hero--desk .gd-hero__inner { padding-block: .4rem .9rem; }
.gd-hero--desk .breadcrumb { font-size: .8rem; margin-bottom: .45rem; }
.gd-eyebrow { display: block; margin: 0 0 .2rem; font-size: .85rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; color: #17803a; }
.gd-hero--desk .gd-hero__title { margin: 0 0 .45rem; font-size: clamp(1.9rem, 1.2rem + 1.6vw, 2.6rem); line-height: 1.05; letter-spacing: -.03em; }
.gd-hero--desk .gd-hero__lead { font-size: max(clamp(.95rem, .9rem + .15vw, 1.06rem), 16px) /* rt-1019 */; line-height: 1.32; margin-bottom: .75rem; }
.gd-hero--desk .btn-row { gap: 1.1rem; flex-wrap: nowrap; }
.gd-hero--desk .btn { min-height: 2.15rem; padding: .3rem 1.25rem; font-size: .8rem; white-space: nowrap; font-weight: 700; border-radius: 3px; }
.gd-hero--desk .btn--outline { --btn-bg: rgba(255, 255, 255, .9); border-width: 1.5px; border-color: #1b2c4a; }
.gd-screen { position: absolute; display: grid; place-items: center; align-content: center; font-family: var(--font-script); font-weight: 600; color: #13213d; text-align: left; line-height: 1.08; }

.gd-icons { padding-block: .7rem; }
.gd-icons__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .4rem; }
.gd-icons__list li { display: flex; align-items: center; gap: .65rem; padding: .5rem .45rem .5rem .7rem; min-height: 5.3rem; background: #f3f7fc; border-radius: 4px; }
.gd-icons__list .gd-circle { --s: 2.75rem; }
.gd-icons__list strong { display: block; white-space: nowrap; font-size: .8rem; color: #0c1f45; margin-bottom: .1rem; }
.gd-icons__list div > span { display: block; font-size: .77rem; line-height: 1.32; color: #4a5770; }
.gd-icons--plain .gd-icons__list li { background: none; }

.gd-art { padding-block: .9rem 1.6rem; }
.gd-art .layout { --aside: 22.8rem; gap: 1.45rem; }
.gd-main > section + section { margin-top: 1.25rem; }
.gd-main h2 { margin: 0 0 .25rem; font-size: clamp(1.25rem, 1.05rem + .5vw, 1.46rem); letter-spacing: -.02em; color: #0c1f45; }
.gd-main .gd-intro { margin: 0 0 .7rem; font-size: max(1.04rem, 16px) /* rt-1019 */; line-height: 1.38; color: #44516a; }
.gd-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: .75rem; }
.gd-cards > li { padding: .85rem .9rem .9rem; background: #fff; border: 1px solid #e1e7ef; border-radius: 4px; box-shadow: 0 1px 2px rgba(13, 31, 60, .04); }
.gd-cards > li > .icon { display: block; width: 2.4rem; height: 2.4rem; margin-bottom: .55rem; }
.gd-cards h3 { margin: 0 0 .2rem; font-size: .96rem; line-height: 1.22; color: #0c1f45; }
.gd-cards p { margin: 0; font-size: max(.86rem, 16px) /* rt-1019 */; line-height: 1.38; color: #4a5770; }
.gd-cards--row > li { display: flex; gap: .85rem; align-items: flex-start; }
.gd-cards--row .gd-circle, .gd-cards--row .gd-sq { margin-top: .1rem; }
.gd-sq { display: inline-grid; place-items: center; flex: none; width: var(--s, 2.1rem); height: var(--s, 2.1rem); border-radius: 4px; background: var(--gd-c); color: #fff; }
.gd-sq .icon { width: 62%; height: 62%; }
.gd-numc { display: inline-grid; place-items: center; flex: none; width: var(--s, 2.15rem); height: var(--s, 2.15rem); border-radius: 50%; background: var(--gd-c, #1673e6); color: #fff; font-family: var(--font-head); font-weight: 800; font-size: 1.12rem; }

/* Tool cards (brand marks are neutral icon circles, never logos) */
.gd-tools { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .75rem; }
.gd-tools > li { display: flex; flex-direction: column; padding: 1rem .95rem .95rem; border: 1px solid #e1e7ef; border-radius: 4px; background: #fff; box-shadow: 0 1px 2px rgba(13, 31, 60, .04); }
.gd-tools__name { display: flex; align-items: center; gap: .6rem; margin: 0 0 .7rem; font-size: 1.24rem; letter-spacing: -.02em; }
.gd-tools .tool-mark { --s: 2.7rem; }
.gd-tools .rating { margin-bottom: .75rem; font-size: .86rem; }
.gd-tools .stars .icon { width: 1.05rem; height: 1.05rem; }
.gd-tools .checklist { gap: .35rem; margin-bottom: .9rem; flex: 1; }
.gd-tools .checklist li { font-size: max(.86rem, 16px) /* rt-1019 */; padding-left: 1.6rem; }
.gd-tools .checklist li::before { width: 1.05rem; height: 1.05rem; background-color: #22a447; }
.gd-tools .btn { min-height: 2.35rem; font-size: .86rem; font-weight: 700; border-radius: 3px; background: #127a31; border-color: #127a31; }

/* Wide lead strip inside the article (checklist sheet + copy + button) */
.gd-strip { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1rem 1.4rem; padding: .6rem 1.4rem .6rem .8rem; background: #eaf5ec; border: 1px solid #d5ebd9; border-radius: 4px; }
.gd-strip h2 { margin: 0 0 .3rem; font-size: 1.08rem; }
.gd-strip p { margin: 0; font-size: max(.82rem, 16px) /* rt-1019 */; color: #44516a; line-height: 1.4; }
.gd-strip .btn { min-height: 2.6rem; padding-inline: 1.2rem; font-size: .88rem; font-weight: 700; border-radius: 3px; background: #127a31; border-color: #127a31; }
.gd-sheet { --w: 8.2rem; transform: rotate(-6deg); padding: .7rem .65rem; margin: -.2rem 0 -.4rem; aspect-ratio: 4 / 5; }
.gd-sheet .sheet__title { font-size: max(.78rem, 16px) /* rt-1019 */; text-align: center; margin-bottom: .45rem; }
.gd-sheet .sheet__line { margin-bottom: .45rem; }

/* Sidebar */
.gd-side { display: grid; gap: 1rem; align-content: start; }
.gd-box { padding: 1.05rem 1.1rem 1.1rem; border-radius: 4px; background: #f3f7fc; border: 1px solid #e3ebf6; }
.gd-box--green { background: #eff7f0; border-color: #d9ecdc; }
.gd-box__head { display: flex; align-items: center; gap: .7rem; margin-bottom: .65rem; }
.gd-box__head .icon { width: 1.9rem; height: 1.9rem; flex: none; }
.gd-box__head h2 { margin: 0; font-size: 1.16rem; letter-spacing: -.015em; color: #0c1f45; }
.gd-box p { font-size: max(.88rem, 16px) /* rt-1019 */; color: #44516a; margin: 0 0 .75rem; line-height: 1.4; }
.gd-box .toc a { font-size: .86rem; padding: .22rem 0; }
.gd-box .toc li { border-bottom: 0; }
.gd-box .field { margin-bottom: .55rem; }
.gd-box .input { min-height: 2.6rem; font-size: .88rem; }
.gd-box .btn { min-height: 2.6rem; font-size: .9rem; font-weight: 700; border-radius: 3px; background: #127a31; border-color: #127a31; }
.gd-box .form-fine { justify-content: center; font-size: max(.78rem, 14px) /* rt-1019 */; }
.gd-iconfield { position: relative; }
.gd-iconfield > .icon { position: absolute; left: .8rem; top: 1.3rem; transform: translateY(-50%); width: 1rem; height: 1rem; color: #5b6880; pointer-events: none; }
.gd-iconfield .input { padding-left: 2.4rem; }
.gd-side-tools { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.gd-side-tools > li { display: flex; align-items: center; gap: .85rem; padding: .55rem .6rem; background: #fff; border-radius: 4px; }
.gd-side-tools .tool-mark { --s: 2.4rem; }
.gd-side-tools strong { display: block; font-size: .88rem; color: #0c1f45; }
.gd-side-tools div > span { display: block; font-size: .8rem; color: #4a5770; line-height: 1.3; }
.gd-side-tools .link-arrow { font-size: .8rem; margin-top: .15rem; }
.gd-posts { list-style: none; margin: 0; padding: 0; display: grid; gap: .45rem; }
.gd-posts > li { position: relative; display: grid; grid-template-columns: 6.7rem minmax(0, 1fr); gap: .9rem; align-items: center; padding: .4rem; background: #fff; border-radius: 4px; }
.gd-posts img { width: 100%; height: 5.2rem; object-fit: cover; border-radius: 3px; }
.gd-posts h3 { margin: 0 0 .2rem; font-size: .86rem; line-height: 1.25; }
.gd-posts h3 a { color: #0c1f45; text-decoration: none; }
.gd-posts h3 a:hover { color: var(--blue-600); text-decoration: underline; }
.gd-posts p { margin: 0; font-size: max(.78rem, 16px) /* rt-1019 */; color: #4a5770; line-height: 1.35; }
.gd-faq-plus summary { padding: .55rem 1rem; font-size: .96rem; font-weight: 500; color: #13213d; }
.gd-faq-plus details { border-color: #dbe3ee; border-radius: 3px; }
.gd-faq-plus .accordion__body { font-size: max(.9rem, 16px) /* rt-1019 */; line-height: 1.5; }

/* ---------- 10. Page specifics ---------- */
/* affiliate-marketing-for-beginners */
.amb-n1 { left: 24%; top: 7%; }
.amb-a1 { left: 28%; top: 19%; transform: rotate(-12deg); }
.amb-n2 { left: 72%; top: 4%; }
.amb-a2 { left: 72%; top: 14.5%; transform: scaleX(-1) rotate(-20deg); }
.amb-n3 { left: 87.5%; top: 13%; }
.amb-a3 { left: 88%; top: 25%; transform: scaleX(-1) rotate(-20deg); }
.amb-guide { --gd-guide-cols: 37% minmax(0, 1fr); }
.amb-guide .gd-guide__copy { max-width: 33rem; position: relative; z-index: 1; }
.amb-signs { position: absolute; inset: 0; margin: 0; padding: 0; list-style: none; }
.amb-signs li { position: absolute; left: 73.5%; width: 20%; white-space: nowrap; font-family: var(--font-script); font-weight: 600; font-size: max(4.1cqw, 16px) /* rt-1019 */; line-height: 1; color: #fff6e6; text-shadow: 0 1px 2px rgba(40, 20, 5, .6); text-align: center; transform: translateY(-50%) rotate(-3deg); }
.amb-signs li:nth-child(1) { top: 26.9%; transform: translateY(-50%) rotate(-5deg); } .amb-signs li:nth-child(2) { top: 35.3%; } .amb-signs li:nth-child(3) { top: 43.6%; } .amb-signs li:nth-child(4) { top: 52%; }
.amb-guide__note { position: absolute; right: 22%; top: 1.2rem; z-index: 1; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: 1.45rem; line-height: 1.1; color: #13213d; text-align: center; transform: rotate(-8deg); }
.amb-guide__note .gd-arrow { position: static; display: block; margin: .2rem auto 0 2.2rem; width: 2.6rem; height: 2.6rem; transform: rotate(10deg); }
.amb-cta { --gd-cta-pos: 22% 75%; }

/* how-affiliate-marketing-works */
.haw-hero .gd-hero__fig { right: -8%; }
.haw-hero .gd-hero__fig::before { width: 22%; }
.haw-hero { --gd-copy: 37rem; }
.haw-nutshell { position: absolute; left: 24.4%; top: 30.6%; width: 39%; height: 43.4%; display: grid; align-content: center; justify-items: center; gap: 1.6cqw; color: #0c1f45; }
.haw-nutshell__t { margin: 0; font-family: var(--font-head); font-weight: 800; font-size: max(2.7cqw, 16px) /* rt-1019 */; line-height: 1.15; text-align: center; letter-spacing: -.02em; }
.haw-nutshell ol { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 1.6cqw; width: 92%; }
.haw-nutshell li { position: relative; display: grid; justify-items: center; gap: .6cqw; font-size: max(1.15cqw, 16px) /* rt-1019 */; font-weight: 600; line-height: 1.2; text-align: center; }
.haw-nutshell li + li::before { content: "→"; position: absolute; left: -1.5cqw; top: 1.2cqw; font-size: max(2cqw, 16px) /* rt-1019 */; font-weight: 700; color: #0c1f45; }
.haw-nutshell .icon { width: 4.6cqw; height: 4.6cqw; }
.haw-nutshell .gd-coin { display: grid; place-items: center; width: 4.6cqw; height: 4.6cqw; border-radius: 50%; background: #f5a800; color: #fff; }
.haw-nutshell .gd-coin .icon { width: 70%; height: 70%; }
.haw-n1 { left: 35%; top: 6%; }
.haw-a1 { left: 32%; top: 15.5%; transform: rotate(-30deg); }
.haw-mug { position: absolute; left: 73%; top: 60.5%; width: 11%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(1.75cqw, 16px) /* rt-1019 */; line-height: 1.12; color: #0f1c36; text-align: center; transform: rotate(-4deg); }
.haw-duo { display: grid; grid-template-columns: minmax(0, 1.88fr) minmax(0, 1fr); gap: .6rem; }
.haw-example { position: relative; isolation: isolate; overflow: hidden; padding: 1.25rem 1.6rem 1.3rem; border-radius: 6px; background: linear-gradient(90deg, #f1f6fd 0%, #f1f6fd 48%, #f6f9fd 100%); border: 1px solid #e2ebf7; display: grid; grid-template-columns: minmax(0, 1fr) 43%; gap: .6rem; }
.haw-example h2, .haw-types h2 { margin: 0 0 .25rem; font-size: clamp(1.3rem, 1.1rem + .6vw, 1.62rem); letter-spacing: -.03em; color: #0c1f45; }
.haw-example__intro, .haw-types__intro { margin: 0 0 .6rem; font-size: max(1.04rem, 16px) /* rt-1019 */; line-height: 1.38; color: #2c3a52; }
.haw-example ol { list-style: none; margin: 0 0 .9rem; padding: 0; display: grid; gap: .55rem; }
.haw-example ol li { display: flex; align-items: center; gap: .75rem; font-size: max(.98rem, 16px) /* rt-1019 */; color: #1f2c44; }
.haw-example .gd-numc { --s: 1.75rem; font-size: .95rem; }
.haw-good { display: flex; gap: 1rem; padding: .75rem 1rem; background: #edf7ee; border: 1px solid #d7ecda; border-radius: 4px; }
.haw-good > .icon { width: 2.4rem; height: 2.4rem; color: #22a447; flex: none; }
.haw-good p { margin: 0; font-size: max(.92rem, 16px) /* rt-1019 */; line-height: 1.38; color: #2c3a52; }
.haw-good strong { display: block; color: #0c1f45; }
.haw-example__fig { position: relative; margin: 0 -.8rem 0 0; align-self: center; container-type: inline-size; }
.haw-example__fig img { width: 100%; height: auto; border-radius: 4px; }
.haw-example__fig .haw-post { position: absolute; left: 23.5%; top: 12.6%; width: 52%; margin: 0; padding: 1.4cqw 2cqw; background: #fff; font-family: var(--font-head); font-weight: 800; font-size: 3.6cqw; line-height: 1.15; color: #0c1f45; border-radius: 1cqw 1cqw 0 0; }
.haw-example__fig .haw-buy { position: absolute; left: 34%; top: 54%; width: 30%; padding: 1cqw 0; background: #1673e6; color: #fff; font-size: 3.2cqw; font-weight: 700; text-align: center; border-radius: 1cqw; }
.haw-example__note1 { position: absolute; left: -4%; top: 2%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(6.5cqw, 14px) /* rt-1019 */; line-height: 1.05; color: #13213d; transform: rotate(-12deg); }
.haw-example__note2 { position: absolute; right: 2%; top: 66%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(6.2cqw, 14px) /* rt-1019 */; line-height: 1.05; color: #13213d; transform: rotate(-8deg); padding: .6cqw 1.2cqw; background: rgba(255, 255, 255, .85); border-radius: 1cqw; }
.haw-types { padding: 1.25rem 1.3rem; border-radius: 6px; background: #f2f6fc; border: 1px solid #e2ebf7; }
.haw-types ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; }
.haw-types li { display: flex; align-items: center; gap: 1.6rem; padding: .7rem 1rem; background: #fff; border-radius: 4px; }
.haw-types li > .icon, .haw-types li > .gd-circle { width: 3.4rem; height: 3.4rem; flex: none; }
.haw-types h3 { margin: 0 0 .15rem; font-size: 1.06rem; color: #0c1f45; }
.haw-types p { margin: 0; font-size: max(.94rem, 16px) /* rt-1019 */; color: #3d4a60; line-height: 1.35; }
.haw-video { display: grid; grid-template-columns: 7.5rem 23.5rem minmax(0, 1fr); gap: 1.5rem 1.9rem; align-items: center; }
.haw-video__note { margin: 0; font-family: var(--font-script); font-weight: 600; font-size: 1.55rem; line-height: 1.1; color: #13213d; transform: rotate(-10deg); text-align: center; }
.haw-video__note .gd-arrow { position: static; display: block; margin: .3rem auto 0; width: 2.8rem; height: 2.8rem; transform: rotate(-30deg); }
.haw-video__thumb { position: relative; display: block; border-radius: 4px; overflow: hidden; box-shadow: var(--shadow-sm); }
.haw-video__thumb img { width: 100%; height: auto; }
.haw-video__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 4rem; height: 4rem; border-radius: 50%; background: rgba(255, 255, 255, .92); color: #13213d; box-shadow: 0 4px 16px rgba(0, 0, 0, .25); }
.haw-video__play .icon { width: 45%; height: 45%; margin-left: 8%; }
.haw-video h2 { margin: 0 0 .35rem; font-size: clamp(1.15rem, 1rem + .5vw, 1.45rem); letter-spacing: -.025em; color: #0c1f45; }
.haw-video p { margin: 0 0 .85rem; font-size: 1.06rem; line-height: 1.38; color: #2c3a52; max-width: 39rem; }
.haw-video .btn { min-height: 2.9rem; padding-inline: 1.9rem; font-size: 1.18rem; font-weight: 700; border-radius: 3px; background: #127a31; border-color: #127a31; }

/* how-to-start-affiliate-marketing */
.hts-screen { position: absolute; left: 48.5%; top: 19.5%; width: 34.3%; height: 52%; display: grid; align-content: center; justify-items: center; gap: 1.1cqw; color: #fff; text-align: center; }
.hts-screen__brand { display: flex; align-items: center; gap: .6cqw; font-family: var(--font-head); font-weight: 800; font-size: 1cqw; line-height: 1.05; letter-spacing: .04em; text-transform: uppercase; text-align: left; }
.hts-screen__brand img { width: 2.6cqw; height: auto; filter: brightness(0) invert(1); }
.hts-screen__t { margin: 0; font-family: var(--font-head); font-weight: 800; font-size: max(3.15cqw, 16px) /* rt-1019 */; line-height: 1.02; letter-spacing: -.01em; text-transform: uppercase; }
.hts-screen__band { padding: .5cqw 1.2cqw; background: #127a31; font-size: 1.15cqw; font-weight: 700; text-transform: uppercase; letter-spacing: .02em; }
.hts-screen__icons { display: flex; gap: 2.2cqw; align-items: center; }
.hts-screen__icons .icon { width: 3.2cqw; height: 3.2cqw; }
.hts-screen__icons .gd-coin { display: grid; place-items: center; width: 3.6cqw; height: 3.6cqw; border-radius: 50%; background: #fff; color: #0b2149; }
.hts-screen__icons .gd-coin .icon { width: 70%; height: 70%; }
.hts-n1 { left: 78%; top: 3%; }
.hts-a1 { left: 84%; top: 17%; transform: scaleX(-1) rotate(-30deg); }
.hts-books { position: absolute; left: 0; top: 37.6%; width: 22%; margin: 0; padding: 0; list-style: none; display: grid; gap: 0; }
.hts-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .75rem; }
.hts-step { position: relative; padding: .8rem 1.2rem .85rem; border-radius: 6px; background: var(--gd-tint); border: 1px solid var(--gd-tint-bd); }
.hts-step__head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 1.1rem; margin-bottom: .5rem; }
.hts-step__head .gd-numc { --s: 2.5rem; font-size: 1.3rem; }
.hts-step__head h3 { margin: 0; font-size: 1.18rem; line-height: 1.15; color: #0c1f45; }
.hts-step__head > .icon { width: 3rem; height: 3rem; color: var(--gd-c); }
.hts-step .boxlist { --c: var(--gd-c); gap: .12rem; margin: 0 0 .6rem .4rem; }
.hts-step .boxlist li { font-size: max(.96rem, 16px) /* rt-1019 */; color: #2c3a52; padding-left: 1.8rem; }
.hts-step .boxlist li::before { width: 1rem; height: 1rem; top: .18em; border-width: 1.5px; border-radius: 2px; }
.hts-step p { margin: 0; font-size: max(.95rem, 16px) /* rt-1019 */; line-height: 1.34; color: #3d4a60; }
.hts-dl { display: grid; grid-template-columns: 36% minmax(0, 1fr); grid-template-rows: auto 1fr auto; gap: .3rem .8rem; padding: .8rem .9rem .7rem 1rem; border-radius: 6px; background: #eef7ef; border: 1px solid #d7ecda; }
.hts-dl__head { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; gap: .9rem; }
.hts-dl__head .icon { width: 2.9rem; height: 2.9rem; color: #22a447; }
.hts-dl__head h2 { margin: 0; font-size: 1.32rem; line-height: 1.1; color: #0c1f45; letter-spacing: -.02em; }
.hts-dl .ebook { --w: 8.4rem; grid-row: 2 / 4; align-self: center; justify-self: center; transform: perspective(700px) rotateY(-14deg); }
.hts-dl .ebook__title { font-size: 1rem; }
.hts-dl .ebook__band { font-size: .5rem; }
.hts-dl .checklist { gap: .32rem; align-self: center; }
.hts-dl .checklist li { font-size: max(.86rem, 16px) /* rt-1019 */; padding-left: 1.6rem; }
.hts-dl .checklist li::before { width: 1.1rem; height: 1.1rem; background-color: #22a447; }
.hts-dl__act { grid-column: 2; display: grid; gap: .3rem; justify-items: end; }
.hts-dl .btn { min-height: 2.5rem; padding-inline: 1rem; font-size: .92rem; font-weight: 700; white-space: nowrap; border-radius: 3px; background: #127a31; border-color: #127a31; }
.hts-dl .gd-fine { font-size: max(.75rem, 14px) /* rt-1019 */; justify-content: flex-end; margin: 0; }

/* how-to-choose-an-affiliate-niche */
.hcn-bubble { position: absolute; display: grid; justify-items: center; align-content: center; gap: .4cqw; margin: 0; padding: 1.6cqw 2cqw; background: #fff; border: .25cqw solid #1a2540; border-radius: 50%; font-family: var(--font-script); font-weight: 600; font-size: max(1.9cqw, 16px) /* rt-1019 */; line-height: 1.08; color: #13213d; text-align: center; }
.hcn-bubble .icon { width: 2.6cqw; height: 2.6cqw; }
.hcn-bubble::after { content: ""; position: absolute; width: 1.2cqw; height: 1.2cqw; border: .25cqw solid #1a2540; border-radius: 50%; background: #fff; }
.hcn-b1 { left: 14%; top: 4%; width: 17cqw; height: 12.5cqw; transform: rotate(-6deg); }
.hcn-b1::after { right: 8%; bottom: -12%; }
.hcn-b1 .icon { color: #0c1f45; }
.hcn-b2 { left: 16%; top: 36%; width: 13cqw; height: 13cqw; transform: rotate(-6deg); }
.hcn-b2::after { right: -10%; bottom: 14%; }
.hcn-b3 { left: 60%; top: 4%; width: 16.5cqw; height: 12.5cqw; transform: rotate(4deg); }
.hcn-b3::after { left: 8%; bottom: -10%; }
.hcn-b3 .gd-coin { display: grid; place-items: center; width: 3cqw; height: 3cqw; border-radius: 50%; background: #0c2b5c; color: #fff; }
.hcn-b3 .gd-coin .icon { width: 70%; height: 70%; }
.hcn-sticky { position: absolute; left: 67%; top: 33%; width: 19cqw; margin: 0; padding: 1.4cqw 1.6cqw 1.6cqw; background: #fdf2b2; box-shadow: .6cqw .8cqw 1.6cqw rgba(13, 31, 60, .18); transform: rotate(-3deg); font-family: var(--font-script); font-weight: 600; color: #13213d; }
.hcn-sticky strong { display: block; margin-bottom: .8cqw; font-size: 2.5cqw; font-weight: 600; }
.hcn-sticky ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .5cqw; font-size: 2.1cqw; }
.hcn-sticky li { display: flex; align-items: center; gap: .9cqw; }
.hcn-sticky li::before { content: ""; width: 1.3cqw; height: 1.3cqw; border: .2cqw solid #13213d; border-radius: .2cqw; }
.hcn-mid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.13fr); gap: .9rem; align-items: stretch; }
.hcn-pop { padding: 1.3rem 1.2rem 1.2rem; border-radius: 6px; background: #f2f6fc; border: 1px solid #e2ebf7; }
.hcn-pop h2 { margin: 0 0 .3rem; font-size: clamp(1.35rem, 1.1rem + .7vw, 1.72rem); line-height: 1.05; letter-spacing: -.03em; color: #0c1f45; }
.hcn-pop > p { margin: 0 0 .85rem; font-size: max(1.04rem, 16px) /* rt-1019 */; line-height: 1.38; color: #2c3a52; }
.hcn-niches { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .55rem; }
.hcn-niches li { display: grid; justify-items: center; align-content: start; padding: .6rem .4rem .55rem; background: #fff; border-radius: 4px; text-align: center; min-height: 6.4rem; }
.hcn-niches .icon { width: 2.6rem; height: 2.6rem; margin-bottom: .25rem; }
.hcn-niches h3 { margin: 0 0 .15rem; font-size: .98rem; color: #0c1f45; }
.hcn-niches p { margin: 0; font-size: max(.88rem, 16px) /* rt-1019 */; line-height: 1.3; color: #4a5770; }
.hcn-right { display: grid; gap: .8rem; grid-template-rows: 1fr auto; }
.hcn-guide { --gd-guide-cols: 44% minmax(0, 1fr); padding: 1rem 1.3rem .9rem 1rem; gap: .8rem 1rem; }
.hcn-guide .gd-guide__media { min-height: 0; height: 100%; align-items: center; }
.hcn-guide .ebook { --w: 13.2rem; }
.hcn-guide .gd-guide__plant { width: 8.5rem; left: -1.4rem; bottom: -.4rem; }
.hcn-guide h2 { font-size: clamp(1.45rem, 1.1rem + 1vw, 2.05rem); margin-top: .35rem; }
.hcn-guide .gd-guide__text { font-size: max(1.02rem, 16px) /* rt-1019 */; }
.hcn-guide .checklist li { font-size: max(.98rem, 16px) /* rt-1019 */; }
.hcn-guide .btn { padding-inline: 1.3rem; font-size: 1.08rem; min-height: 2.85rem; white-space: nowrap; }
.hcn-guide .gd-fine { padding-left: 0; justify-content: center; font-size: max(.8rem, 14px) /* rt-1019 */; }
.gd-tip { display: flex; align-items: flex-start; gap: 1.6rem; padding: 1rem 1.6rem 1.1rem 2rem; border-radius: 6px; background: #eef7ef; border: 1px solid #d7ecda; }
.gd-tip > .icon { width: 3.6rem; height: 3.6rem; color: #22a447; flex: none; }
.gd-tip h2 { margin: 0 0 .15rem; font-size: 1.26rem; color: #0c1f45; }
.gd-tip p { margin: 0; font-size: 1.08rem; line-height: 1.38; color: #2c3a52; }
.gd-mistakes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .8rem; }
.gd-mistakes li { display: flex; align-items: center; gap: 1.3rem; padding: .85rem 1rem; background: #fff; border-radius: 4px; border: 1px solid #e6ecf3; }
.gd-mistakes .gd-circle { --s: 3.6rem; }
.gd-mistakes .gd-plain-ico { width: 3.4rem; height: 3.4rem; flex: none; }
.gd-mistakes h3 { margin: 0 0 .2rem; font-size: 1rem; line-height: 1.2; color: #0c1f45; }
.gd-mistakes p { margin: 0; font-size: max(.9rem, 16px) /* rt-1019 */; line-height: 1.3; color: #3d4a60; }
.gd-band { padding: .75rem 1rem .85rem; border-radius: 6px; background: #f2f6fc; border: 1px solid #e2ebf7; }
.gd-band .gd-head { margin-bottom: .85rem; }

/* how-to-find-affiliate-programs */
.hfp-mid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: .8rem; }
.hfp-where { padding: 1.1rem 1rem 1rem; border-radius: 6px; background: #f2f6fc; border: 1px solid #e2ebf7; }
.hfp-where h2 { margin: 0 0 .25rem; padding-left: .3rem; font-size: clamp(1.35rem, 1.1rem + .7vw, 1.72rem); letter-spacing: -.03em; color: #0c1f45; }
.hfp-where > p { margin: 0 0 .65rem; padding-left: .3rem; font-size: max(1.04rem, 16px) /* rt-1019 */; line-height: 1.38; color: #2c3a52; }
.hfp-nets { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; }
.hfp-nets li { display: grid; justify-items: center; align-content: start; padding: .7rem .5rem .65rem; min-height: 8.6rem; background: #fff; border-radius: 4px; text-align: center; }
.hfp-nets .gd-sq { --s: 3.1rem; margin-bottom: .5rem; }
.hfp-nets h3 { margin: 0 0 .25rem; font-size: 1rem; color: #0c1f45; }
.hfp-nets p { margin: 0; font-size: max(.88rem, 16px) /* rt-1019 */; line-height: 1.3; color: #4a5770; }
.hfp-guide { --gd-guide-cols: 40% minmax(0, 1fr); padding: 1.6rem 1rem 1rem .9rem; gap: .6rem .9rem; align-items: start; }
.hfp-guide .pill { position: absolute; left: .9rem; top: .6rem; font-size: .92rem; }
.hfp-guide .gd-guide__media { min-height: 0; height: 100%; align-items: center; }
.hfp-guide .ebook { --w: 10.8rem; }
.hfp-guide .ebook__title { font-size: 1.28rem; }
.hfp-guide .gd-guide__plant { width: 5.8rem; left: -.6rem; bottom: .2rem; }
.hfp-guide h2 { font-size: 1.32rem; line-height: 1.08; margin: .4rem 0 .4rem; }
.hfp-guide .gd-guide__text { font-size: max(.92rem, 16px) /* rt-1019 */; }
.hfp-guide .checklist li { font-size: max(.86rem, 16px) /* rt-1019 */; padding-left: 1.75rem; }
.hfp-guide .checklist li::before { width: 1.1rem; height: 1.1rem; }
.hfp-guide .btn { padding-inline: 1.2rem; font-size: .98rem; min-height: 2.55rem; }
.hfp-guide .gd-fine { padding-left: 0; font-size: max(.76rem, 14px) /* rt-1019 */; justify-content: flex-start; }
.hfp-tips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .6rem; }
.hfp-tips li { display: flex; align-items: flex-start; gap: .8rem; padding: .65rem .7rem .7rem; background: #fff; border: 1px solid #e6ecf3; border-radius: 4px; }
.hfp-tips li > .icon, .hfp-tips li > .gd-circle { width: 2.9rem; height: 2.9rem; flex: none; }
.hfp-tips h3 { margin: 0 0 .15rem; font-size: .88rem; color: #0c1f45; }
.hfp-tips p { margin: 0; font-size: max(.8rem, 16px) /* rt-1019 */; line-height: 1.28; color: #3d4a60; }
.hfp-pop { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: .55rem; }
.hfp-pop li { text-align: center; }
.hfp-pop .wordmark { display: grid; place-items: center; height: 3.3rem; margin-bottom: .35rem; border: 1px solid #e3e9f1; border-radius: 4px; background: #fff; font-size: 1.3rem; box-shadow: 0 1px 2px rgba(13, 31, 60, .04); }
.hfp-pop strong { display: block; font-size: .86rem; font-weight: 600; color: #0c1f45; }
.hfp-pop span { display: block; font-size: .8rem; color: #4a5770; }

/* email-marketing-for-affiliates */
.emf-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_email-marketing-for-affiliates__hero-640.webp"); }
.emf-screen { left: 33.9%; top: 10.6%; width: 37.8%; height: 77.4%; grid-template-columns: auto auto; gap: 0 2.4cqw; font-size: 3.15cqw; }
.emf-screen .icon { width: 7.5cqw; height: 7.5cqw; color: #2a7de1; stroke-width: 1.6; }
.emf-mug { position: absolute; left: 81.5%; top: 55%; width: 9%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(1.85cqw, 16px) /* rt-1019 */; line-height: 1.05; color: #1f2a40; text-align: center; transform: rotate(-4deg); }
.emf-books { position: absolute; left: 27.3%; top: 74%; width: 11%; margin: 0; padding: 0; list-style: none; display: none; }

/* seo-for-affiliate-marketing */
.seo-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_seo-for-affiliate-marketing__hero-640.webp"); --gd-copy: 33.5rem; }
.seo-screen { left: 44.1%; top: 14.2%; width: 34.7%; height: 75%; justify-items: center; text-align: center; font-size: 3.5cqw; }
.seo-screen .icon { width: 4.2cqw; height: 4.2cqw; color: #1f9d44; margin-bottom: .6cqw; }
.seo-mug { position: absolute; left: 82%; top: 50%; width: 9%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: max(1.7cqw, 16px) /* rt-1019 */; line-height: 1.05; color: #1f2a40; text-align: center; transform: rotate(-4deg); }
.seo-what { display: grid; grid-template-columns: minmax(0, 1fr) 11.6rem; gap: 1.4rem; align-items: center; padding-bottom: .9rem; border-bottom: 1px solid #e3e9f1; }
.seo-what p { font-size: max(.94rem, 16px) /* rt-1019 */; line-height: 1.4; color: #44516a; margin: 0 0 .55rem; }
.seo-pad { position: relative; margin: 0; container-type: inline-size; }
.seo-pad img { width: 100%; height: auto; border-radius: 4px; box-shadow: var(--shadow-sm); }
.seo-pad p { position: absolute; left: 21%; top: 31%; width: 62%; margin: 0; font-family: var(--font-script); font-weight: 600; font-size: 7.6cqw; line-height: 1.1; color: #13213d; transform: rotate(-14deg); }
.seo-flow { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1rem; }
.seo-flow li { position: relative; }
.seo-flow li + li::before { content: ""; position: absolute; left: -2.1rem; top: .9rem; width: 3rem; height: 1rem; background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 16' fill='none' stroke='%2394a3b8' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2 8h43M39 2l6 6-6 6'/%3E%3C/svg%3E"); }
.seo-flow .gd-numc { --s: 2.55rem; font-size: 1.25rem; margin-bottom: .55rem; }
.seo-flow h3 { margin: 0 0 .25rem; font-size: .98rem; line-height: 1.18; color: #0c1f45; }
.seo-flow p { margin: 0; font-size: max(.82rem, 16px) /* rt-1019 */; line-height: 1.32; color: #4a5770; }
.seo-sec { padding-top: .85rem; border-top: 1px solid #e3e9f1; }
.gd-main > .seo-sec { margin-top: .85rem; }
.seo-sec h2 { font-size: clamp(1.3rem, 1.1rem + .6vw, 1.62rem); }
.seo-table .table { font-size: max(.76rem, 16px) /* rt-1019 */; }
.seo-table .table thead th { font-size: .7rem; padding: .4rem .55rem; }
.seo-table .table td, .seo-table .table th { padding: .35rem .55rem; }
.seo-table .table-tool { font-size: .78rem; gap: .45rem; }
.seo-table .tool-mark { --s: 1.5rem; }
.seo-table .btn { min-height: 1.75rem; padding: .2rem .6rem; font-size: .7rem; font-weight: 700; border-radius: 3px; white-space: nowrap; background: #127a31; border-color: #127a31; }
.seo-table .stars .icon { width: .85rem; height: .85rem; }
.seo-table .rating { font-size: .74rem; flex-wrap: nowrap; }
.seo-faq { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 1.3rem; }
.seo-faq > .gd-circle { --s: 3rem; margin-top: .1rem; }
.seo-faq h2 { margin-bottom: .2rem; }
.seo-faq .accordion summary { justify-content: flex-start; padding: .3rem .3rem; font-size: .8rem; font-weight: 500; }
.seo-faq .accordion summary::before { content: ""; flex: none; width: 6px; height: 6px; margin-right: .65rem; border-right: 2px solid #13213d; border-top: 2px solid #13213d; transform: rotate(45deg); }
.seo-faq .accordion summary::after { margin-left: auto; width: 7px; height: 7px; border-color: #1a66d9; }
.seo-faq .accordion details { border-color: #e3e9f1; }
.seo-faq .accordion__body { padding: 0 .9rem .7rem 1.4rem; font-size: max(.86rem, 16px) /* rt-1019 */; line-height: 1.5; }
.seo-side-tools .stars { color: var(--gold); }
.seo-side-tools .stars .icon { width: .78rem; height: .78rem; }
.seo-side-tools .btn { margin-left: auto; min-height: 1.85rem; padding: .2rem .55rem; font-size: .7rem; font-weight: 700; border-radius: 3px; white-space: nowrap; background: #127a31; border-color: #127a31; }
.seo-side-tools li { gap: .7rem; padding: .5rem .3rem; background: none; border-bottom: 1px solid #e3ebf6; border-radius: 0; }
.seo-side-tools li:last-child { border-bottom: 0; }
.seo-side-tools .tool-mark { --s: 2.1rem; }
.seo-cta-band .cta-band__inner { justify-content: space-between; padding-block: 1rem; }
.seo-cta-band .cta-band__copy { padding-left: 10%; }
.seo-cta-band .btn { min-height: 2.5rem; font-size: .84rem; font-weight: 700; }

/* ---------- 11. Responsive ---------- */
@media (max-width: 1180px) {
  .gd-steps { gap: 1.6rem; }
  .gd-steps > li + li::before { left: -1.4rem; width: 1.1rem; }
  .hfp-pop { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .hfp-tips { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .gd-icons__list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1024px) {
  .gd-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-steps > li + li::before { display: none; }
  .gd-why__list, .gd-mistakes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-trust__list { grid-template-columns: repeat(2, minmax(0, 1fr)); padding-block: .8rem; }
  .hts-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hcn-mid, .hfp-mid, .haw-duo { grid-template-columns: minmax(0, 1fr); }
  .gd-tools { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-cta { padding-right: 12rem; }
  .seo-flow { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 1.2rem; }
  .seo-flow li + li::before { display: none; }
}
@media (max-width: 960px) {
  .gd-guide { grid-template-columns: minmax(0, 1fr); padding: 1.2rem; }
  .gd-guide__media { min-height: 17rem; }
  .gd-guide__photo { display: none; }
  .amb-guide__note, .gd-guide__note { display: none; }
  .gd-guide__media .ebook { margin-left: 0; }
  .gd-learn__card { gap: 1rem; padding: 1rem; min-height: 0; }
  .gd-guide .gd-fine { padding-left: 0; justify-content: center; }
  .gd-cta { grid-template-columns: auto minmax(0, 1fr); padding: 1.2rem 1.4rem; }
  .gd-cta__act { grid-column: 1 / -1; justify-items: start; }
  .gd-cta__photo, .gd-cta__note { display: none; }
  .haw-video { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .haw-video__note { display: none; }
  .hts-dl { grid-template-columns: 40% minmax(0, 1fr); }
  .gd-art .layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 760px) {
  .gd-learn.cols-3 { grid-template-columns: minmax(0, 1fr); }
  .gd-icons__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .haw-example { grid-template-columns: minmax(0, 1fr); }
  .haw-video { grid-template-columns: minmax(0, 1fr); }
  .hts-steps { grid-template-columns: minmax(0, 1fr); }
  .hcn-niches, .hfp-nets { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hfp-tips { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-strip { grid-template-columns: auto minmax(0, 1fr); }
  .gd-strip .btn { grid-column: 1 / -1; }
  .seo-what { grid-template-columns: minmax(0, 1fr); }
  .seo-pad { max-width: 14rem; }
  .gd-faq { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .gd-steps, .gd-why__list, .gd-mistakes, .gd-trust__list, .gd-tools { grid-template-columns: minmax(0, 1fr); }
  .gd-cards { grid-template-columns: minmax(0, 1fr); }
  .gd-icons__list { grid-template-columns: minmax(0, 1fr); }
  .hfp-pop { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hfp-tips { grid-template-columns: minmax(0, 1fr); }
  .gd-quote { flex-direction: column; gap: .8rem; }
  .gd-cta { grid-template-columns: minmax(0, 1fr); }
  .gd-cta__ico { width: 3.4rem; height: 3.4rem; }
  .gd-cta .btn, .gd-guide .btn { width: 100%; padding-inline: 1rem; }
  .hts-dl { grid-template-columns: minmax(0, 1fr); }
  .hts-dl__act { grid-column: 1; }
  .hts-dl .btn { margin-left: 0; }
  .seo-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gd-strip { grid-template-columns: minmax(0, 1fr); justify-items: start; }
  .gd-sheet { display: none; }
  .gd-hero__title { font-size: 2.35rem; }
  .gd-note, .gd-arrow:not(.gd-guide__note .gd-arrow) { display: none; }
}

/* ---------- 12. Helpers added during the build ---------- */
.gd-plainlink { color: inherit; text-decoration: none; }
.gd-plainlink:hover { color: var(--blue-600); text-decoration: underline; }
.gd-fill { fill: currentColor; }
.gd-fill path[d^="M7 11V7"], .gd-fill path[d="M22 10v6"] { fill: none; }
.gd-cta__lead { display: grid; place-items: center; }
.gd-cta--below { grid-template-columns: auto minmax(0, 1fr); }
.gd-cta--below { row-gap: .5rem; padding-block: .9rem; }
.gd-cta--below .gd-cta__act { grid-column: 2; justify-items: start; margin-top: -.2rem; gap: .3rem; }
.gd-cta--below .gd-cta__act .gd-fine { padding-left: 2.5rem; }
.amb-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_affiliate-marketing-for-beginners__hero-640.webp"); }
.haw-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_how-affiliate-marketing-works__hero-640.webp"); }
.hts-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_how-to-start-affiliate-marketing__hero-640.webp"); }
.hcn-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_how-to-choose-an-affiliate-niche__hero-640.webp"); }
.hfp-hero { --gd-hero-blur: url("../../images/wealthgenerationacademy.com_how-to-find-affiliate-programs__hero-640.webp"); }
.amb-guide__note .amb-ga { position: static; display: block; margin: .2rem auto 0 2.2rem; width: 2.6rem; height: 2.6rem; transform: rotate(10deg); }

.gd-fill-soft { fill: currentColor; fill-opacity: .18; }
.haw-video__note .haw-va { position: static; display: block; margin: .3rem auto 0; width: 2.8rem; height: 2.8rem; transform: rotate(-30deg); }
.haw-cta { --gd-cta-pos: 85% 40%; }
.haw-cta .gd-cta__note { right: 1.6rem; top: .7rem; font-size: 1.35rem; }
.haw-n1, .hts-n1 { white-space: nowrap; }
.haw-video__note { font-size: 1.95rem; }
.haw-cta .gd-cta__photo img { width: 135%; max-width: none; margin-left: -35%; }
.hts-step__head .gd-coin { display: grid; place-items: center; width: 2.9rem; height: 2.9rem; border-radius: 50%; background: #f5a800; color: #fff; }
.hts-step__head .gd-coin .icon { width: 62%; height: 62%; }
.hts-dl .gd-book__icons .icon { width: 2.6rem; height: 2.6rem; }
.hts-cta { --gd-cta-pos: 60% 45%; }
.hts-cta .gd-cta__note { right: 12rem; top: 1.4rem; }
.gd-cta--stack h2 { font-size: clamp(1.3rem, 1rem + .9vw, 1.85rem); }
.gd-cta--stack { padding-right: 2.4rem; }
.gd-cta--stack .gd-cta__copy { max-width: 42rem; }
.gd-cta--stack .gd-cta__photo { width: 56%; }
.gd-cta--stack .gd-cta__photo::before { background: linear-gradient(90deg, #0d2a55 0%, rgba(13, 42, 85, .6) 35%, rgba(13, 42, 85, 0) 70%); }
.hts-cta .gd-cta__note { right: 18%; top: 1.6rem; font-size: 1.6rem; }
.hts-cta { --gd-cta-pos: 50% 42%; }
.hts-dl .gd-fine { white-space: nowrap; font-size: max(.7rem, 14px) /* rt-1019 */; }

.hcn-hero .gd-hero__fig { right: -10%; }
.hcn-steps, .hfp-steps { --n: 5; gap: 2.3rem; }
.hcn-steps > li + li::before, .hfp-steps > li + li::before { left: -1.9rem; }
.hcn-steps > li, .hfp-steps > li { padding-inline: .8rem; }
.hcn-cta { --gd-cta-pos: 50% 45%; }
.hcn-cta .gd-cta__note { right: 12%; top: 1.2rem; }

.hfp-n1 { left: 27%; top: 6%; }
.hfp-a1 { left: 36%; top: 22%; transform: rotate(-20deg); }
.hfp-n2 { left: 86%; top: 5%; }
.hfp-a2 { left: 88%; top: 23%; transform: scaleX(-1) rotate(-25deg); }
.hfp-cta { --gd-cta-pos: 20% 50%; }
.hfp-cta .gd-cta__note { right: 9%; top: 1rem; }
.gd-sqmark { border-radius: 10px; }
/* template B additions */
.tool-mark[class*="gd-c-"] { background: var(--gd-c); }
.gd-box__title { margin: 0 0 .7rem; font-size: 1.16rem; letter-spacing: -.015em; color: #0c1f45; }
.emf-strat { --n: 3; }
.emf-strat h3 { font-size: .95rem; }
.emf-strat .gd-numc { --s: 2.1rem; }
.emf-prac .gd-cards { --n: 5; gap: .6rem; }
.emf-prac .gd-cards > li { padding: .75rem .7rem .8rem; }
.emf-prac h3 { font-size: .86rem; }
.emf-prac p { font-size: max(.8rem, 16px) /* rt-1019 */; }
.emf-ready { background: #f3f7fc; }
.emf-ready .gd-box__head { align-items: flex-start; gap: .9rem; }
.emf-ready .gd-box__head > .icon { width: 3rem; height: 3rem; }
.emf-ready p { margin: .3rem 0 0; font-size: max(.82rem, 16px) /* rt-1019 */; }
.emf-ready .btn { margin-top: .3rem; }
.gd-main .disclosure { margin-top: .7rem; }
.gd-main .gd-earn { margin-top: .5rem; }
.gd-tools__sub { display: block; margin: -.5rem 0 .55rem; font-size: .76rem; color: var(--muted); }
/* seo additions */
.seo-wrap { width: min(100% - 2 * var(--gutter), 1110px); }
.seo-hero .gd-hero__inner { width: min(100% - 2 * var(--gutter), 1110px); }
.seo-row { --n: 3; }
.seo-row h3 { font-size: .9rem; }
.seo-row p { font-size: max(.82rem, 16px) /* rt-1019 */; }
.seo-row .gd-circle { --s: 2.6rem; }
.seo-sq { --n: 4; gap: .65rem; }
.seo-sq > li { padding: .75rem .8rem .8rem; }
.seo-sq .gd-sq { --s: 1.75rem; margin-bottom: .55rem; }
.seo-sq h3 { font-size: .86rem; }
.seo-sq p { font-size: max(.8rem, 16px) /* rt-1019 */; }
.seo-sec--first { border-top: 0; padding-top: 1.1rem; }
.seo-posts > li { grid-template-columns: 6rem minmax(0, 1fr) auto; padding: .35rem .4rem; }
.seo-posts img { height: 4.3rem; }
.seo-posts h3 { font-size: .84rem; }
.seo-chev { width: 1rem; height: 1rem; color: var(--blue-600); }
.seo-side-note { margin: .5rem 0 0 !important; font-size: max(.74rem, 14px) !important /* rt-1019 */; color: var(--muted) !important; }
.seo-side-note a { color: inherit; }
.seo-ready .gd-box__head { align-items: flex-start; }
.seo-ready .gd-box__head .icon { width: 2.4rem; height: 2.4rem; }
.seo-toc a { font-size: .84rem; padding: .14rem 0; }
.gd-box .form-fine { justify-content: center; }
.seo-side-tools .stars { flex: none; }
.seo-table .table { font-size: max(.72rem, 16px) /* rt-1019 */; }
.seo-table .table td, .seo-table .table th { padding: .28rem .5rem; line-height: 1.3; }
.seo-table tbody th { width: 9.5rem; }
.seo-table td:nth-child(2) { width: 7rem; }
.seo-table td:nth-child(4) { width: 4.5rem; }
.seo-table .table-tool { white-space: normal; font-size: .74rem; }
.seo-table .btn { min-height: 1.6rem; font-size: .66rem; padding: .15rem .55rem; }
.seo-table .stars .icon { width: .74rem; height: .74rem; }
.seo-faq .accordion summary { padding-block: .22rem; }
.seo-cta-band .cta-band__inner { padding-block: .55rem; }
.seo-cta-band h2 { font-size: 1.12rem; }
.seo-cta-band p { font-size: max(.8rem, 16px) /* rt-1019 */; }

.gd-side > *, .gd-quote > div, .gd-side-tools li > div { min-width: 0; }
.seo-side-tools li { flex-wrap: wrap; }
.seo-side-tools li > div { flex: 1 1 8rem; }
@media (max-width: 760px) { .gd-hero--desk .btn-row { flex-wrap: wrap; } .gd-hero--desk .btn { white-space: normal; } }
@media (max-width: 1100px) { .gd-quote { flex-direction: column; gap: .7rem; } }
.seo-table { position: relative; }

@media (max-width: 1100px) {
  /* Hero: the photo becomes a banner above the copy; overlays keep their % positions because the box keeps its ratio */
  .gd-hero { flex-direction: column; align-items: stretch; min-height: 0; }
  .gd-hero::before, .gd-hero::after { display: none; }
  .gd-hero__fig, .haw-hero .gd-hero__fig, .hcn-hero .gd-hero__fig { position: relative; right: auto; width: 100%; height: auto; z-index: 0; }
  .gd-hero__fig::before { display: none; }
  .gd-hero__copy { max-width: 46rem; }
  .gd-hero .gd-fine, .gd-hero__cta { width: min(100%, 33.6rem); }
}
@media (max-width: 760px) { .gd-hero .gd-fine, .gd-hero__cta { width: 100%; } }
.hfp-guide .ebook { --w: 10rem; }
.hfp-guide .ebook__title { font-size: 1.08rem; }
.hfp-guide .btn { white-space: nowrap; padding-inline: 1rem; font-size: .92rem; }
.hfp-cta .gd-cta__photo img { width: 130%; max-width: none; margin-left: 15%; }
.hfp-cta .gd-cta__photo { width: 30%; }
.gd-guide__plant { filter: brightness(1.07) contrast(1.05); }
.hfp-guide .ebook__title { font-size: .98rem; margin-top: .6rem; }
.hfp-guide .ebook__brand { margin-top: .7rem; }
.hfp-guide .ebook__band { font-size: .48rem; margin-top: .5rem; }
.hfp-guide .gd-book__icons { margin-bottom: .7rem; }
.hfp-guide .gd-book__icons .icon { width: 1.5rem; height: 1.5rem; }
.hfp-guide { --gd-guide-cols: 46% minmax(0, 1fr); }
.hfp-guide .ebook { --w: 11.6rem; }
.hfp-guide .ebook__title { font-size: 1.12rem; }
.hfp-guide .gd-guide__text { font-size: max(.86rem, 16px) /* rt-1019 */; }
.hfp-guide .checklist li { font-size: max(.8rem, 16px) /* rt-1019 */; }
.hfp-guide .gd-guide__plant { width: 5rem; left: -.4rem; bottom: 1.2rem; }
.hfp-guide .btn { font-size: .86rem; padding-inline: .85rem; }
.gd-note { text-shadow: 0 0 6px rgba(255, 255, 255, .95), 0 0 2px #fff; }
.hts-n1 { left: 73%; top: 3%; }
.hts-a1 { left: 80%; top: 19%; }
.hts-a1 { left: 86%; top: 17%; }

/* Affiliate Marketing for Beginners: "Is it worth it?" section (2026-10-11 repositioning) */
.amb-proscons { margin-top: .4rem; }
.amb-proscons h3 { display: flex; align-items: center; gap: .45rem; }
.amb-bottomline { max-width: 54rem; margin: 1rem 0 .6rem; font-size: max(1.02rem, 16px) /* rt-1019 */; line-height: 1.55; color: var(--text); }
.amb-next { margin: .4rem 0 0; }

/* UX audit W01 (2026-10-19): hero text sits on its own opaque panel, never over the photo */
.gd-hero__copy { position: relative; z-index: 2; background: #fff; border-radius: 14px; padding: .9rem 1.2rem 1rem; box-shadow: 0 8px 28px rgba(12, 31, 69, .10); }

/* UX audit 2026-10-19: with readable text the download button may wrap instead of overflowing */
.hts-dl__act { min-width: 0; }
.hts-dl__act .btn { max-width: 100%; white-space: normal; text-align: center; }
.hts-dl__act { grid-template-columns: minmax(0, 1fr); }
.hts-dl__act .gd-fine { width: auto; max-width: 100%; padding-left: 0; flex-wrap: wrap; justify-content: flex-end; }