/* Start Here (prefix sth-). Family rules: fam-hub.css. */

/* Hero */
.sth-hero { --hero-h: 19.1rem; --hero-pos: 50% 0%; --hub-h1: 2.72rem; --hub-lead: .98rem; --hub-lead-w: 33.6rem; --hero-copy: 37rem; --card-w: 14.9rem; }
.sth-hero .hero__bg img { width: 108%; max-width: none; }
.sth-hero .hero__inner { padding-block: 1.15rem .95rem; align-items: center; }
.sth-hero .hero__title { max-width: 36rem; text-wrap: pretty; }
.sth-hero .hero__lead { line-height: 1.27; }
.sth-hero .hero__actions { gap: 1.7rem; margin-top: 1.05rem; }
.sth-hero .hero__actions .btn { min-height: 2.65rem; font-size: .96rem; padding: .5rem 1.35rem; }
.sth-hero__cta { min-width: 17rem; }
.sth-hero .hero__actions .sth-hero__video { --btn-bg: rgba(255, 255, 255, .92); border-width: 1.5px; font-size: .8rem; padding-inline: 1rem; min-width: 13.7rem; }
.sth-hero__video .icon { width: 1.35em; height: 1.35em; }
.sth-ticks { margin-top: .95rem; gap: .4rem 2.1rem; font-size: .8rem; color: #23314a; }
.sth-ticks [data-icon="users"], .sth-ticks [data-icon="shield-check"] { color: var(--ink); }
.sth-card { margin-right: clamp(0px, 4vw - 30px, 40px); align-self: start; margin-top: 1.95rem; padding: .95rem 1rem .85rem 1.25rem; }
.sth-card h2 { font-size: 1.07rem; margin-bottom: .6rem; }
.sth-card .checklist { gap: .5rem; }
.sth-card .checklist li { font-size: max(.7rem, 16px) /* rt-1019 */; padding-left: 1.5rem; }
.sth-card .hub-fine { margin-top: .7rem; padding-top: .5rem; border-top: 1px solid #e3e9f1; font-size: max(.64rem, 14px) /* rt-1019 */; }
.sth-note { right: auto; left: 66.4%; top: 1.7rem; font-size: 1.22rem; transform: rotate(-9deg); text-align: left; }
.sth-note::after { width: 60%; margin-left: .4rem; }

/* 5 steps panel */
.sth-steps-sec { padding-top: .55rem; }
.sth-panel { background: #f3f6fa; border: 1px solid #e9eef5; border-radius: var(--radius-lg); padding: .7rem 1.45rem .85rem; }
.sth-panel .hub-head { margin-bottom: .65rem; }
.sth-panel .hub-head h2 { font-size: 1.42rem; }
.sth-steps { --n: 5; gap: 1.55rem; list-style: none; margin: 0; padding: 0; }
.sth-steps > * + *::before { left: -1.33rem; width: 1.15rem; height: 1.15rem; }
.sth-step { display: flex; flex-direction: column; align-items: center; padding: .85rem .8rem .75rem; border-radius: var(--radius); border: 1px solid; background: var(--bg-c); border-color: var(--bd-c); text-align: center; }
.sth-step .num { --s: 1.85rem; left: .85rem; top: .85rem; font-size: .95rem; }
.sth-step__icon { width: 1.95rem; height: 1.95rem; color: var(--ink); margin-top: .05rem; stroke-width: 2.6; }
.sth-step h3 { font-size: .86rem; margin: .6rem 0 .25rem; }
.sth-step p { font-size: max(.72rem, 16px) /* rt-1019 */; line-height: 1.38; color: #4a566c; margin-bottom: .45rem; max-width: 11.5rem; }
.sth-step .link-arrow { margin-top: auto; font-size: .74rem; }
.sth-step--green { --bg-c: #eff7ef; --bd-c: #dcecdc; }
.sth-step--blue { --bg-c: #eef4fc; --bd-c: #dbe6f6; }
.sth-step--red { --bg-c: #fdf1f0; --bd-c: #f6dddb; }
.sth-step--yellow { --bg-c: #fdf7e7; --bd-c: #f4e8c4; }
.sth-step--purple { --bg-c: #f4f0fc; --bd-c: #e5dcf6; }

/* Resources + kit row */
.sth-res-row { display: grid; grid-template-columns: minmax(0, 1fr) 32.4rem; gap: .75rem; align-items: start; padding-block: .85rem 1.15rem; }
.sth-res .hub-head { margin-bottom: .6rem; }
.sth-res .hub-head h2 { font-size: 1.42rem; }
.sth-res__grid { --gap: .5rem; grid-template-columns: 1.17fr 1fr 1fr 1fr; }
.sth-rc { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .45rem; padding: .6rem .45rem .6rem .5rem; align-items: start; box-shadow: 0 2px 8px rgba(13, 31, 60, .07); }
.sth-rc__thumb { width: 3.3rem; display: grid; place-items: center; padding-top: .1rem; }
.sth-mini { --w: 3.6rem; transform: rotate(-4deg); box-shadow: 4px 6px 12px rgba(13, 31, 60, .25); }
.sth-mini .ebook__title { font-size: .42rem; margin: .7rem .2rem 0; }
.sth-rc__ib { --s: 3.3rem; border-radius: 10px; }
.sth-rc__ib .icon { width: 56%; height: 56%; stroke-width: 2.3; }
.sth-rc .badge { font-size: .55rem; padding: .12rem .32rem; }
.sth-rc h3 { font-size: .76rem; line-height: 1.2; margin: .3rem 0 .25rem; letter-spacing: -.02em; }
.sth-rc p { font-size: max(.66rem, 16px) /* rt-1019 */; line-height: 1.38; color: #4a566c; margin: 0 0 .4rem; }
.sth-rc .link-arrow { font-size: .7rem; white-space: nowrap; }

.sth-kit { --cover-w: 9.9rem; --cover-r: -.4rem; --cover-t: -.25rem; --cover-space: 9.9rem; --lead-title: 1.62rem; margin-top: -.4rem; padding: 1.1rem 1.2rem .95rem; background: linear-gradient(135deg, #eef8f0 0%, #e4f2e6 100%); }
.sth-kit .eyebrow { color: var(--green-700); }
.sth-kit .lead-box__text { font-size: max(.86rem, 16px) /* rt-1019 */; max-width: 19rem; }
.sth-kit__form { max-width: 19.3rem; }
.sth-kit .ticks { max-width: 21rem; }

/* Trust strip */
.sth-trust { background: #f3f6fa; border-top: 0; }
.sth-trust .trust-strip__inner { flex-wrap: nowrap; gap: 1.5rem; padding-block: .95rem; }
.sth-trust__title { margin: 0; font-family: var(--font-head); font-weight: 700; font-size: .94rem; color: var(--ink); line-height: 1.25; max-width: 9.5rem; }
.sth-trust__rating { display: grid; gap: .2rem; font-size: .76rem; color: #4a566c; }
.sth-trust__rating .stars .icon { width: 1.05rem; height: 1.05rem; }
.sth-quote { display: flex; align-items: center; justify-content: center; gap: 1rem; margin: 0; flex: 1; min-width: 0; }
.sth-quote blockquote { margin: 0; font-style: italic; font-size: max(.76rem, 16px) /* rt-1019 */; color: #3e4b62; }
.sth-quote blockquote p { margin: 0; }
.sth-quote figcaption { display: flex; align-items: center; gap: .6rem; font-size: .72rem; color: #4a566c; font-style: italic; }
.sth-quote figcaption strong { display: block; font-style: normal; color: var(--ink); font-size: .8rem; }
.sth-quote__avatar { --s: 2.8rem; }
.sth-stats { display: flex; gap: 1.8rem; list-style: none; margin: 0; padding: 0; }
.sth-stats .trust-item { font-size: max(.76rem, 16px) /* rt-1019 */; color: #4a566c; }
.sth-stats .trust-item strong { font-size: .95rem; }
.sth-stats .trust-item > .icon { width: 1.9rem; height: 1.9rem; color: var(--ink); }

@media (max-width: 1280px) {
  .sth-trust .trust-strip__inner { flex-wrap: wrap; }
}
@media (max-width: 1100px) {
  .sth-res-row { grid-template-columns: minmax(0, 1fr); }
  .sth-kit { margin-top: .5rem; }
  .sth-res__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .sth-note { display: none; }
}
@media (max-width: 1024px) {
  .sth-steps > * + *::before { display: none; }
}
@media (max-width: 760px) {
  .sth-br { display: none; }
  .sth-hero { --hero-mobile-h: 210px; --hero-pos: 60% 40%; }
  .sth-hero .hero__actions .btn { width: 100%; min-width: 0; }
  .sth-card { margin: 0; }
  .sth-card .checklist li { font-size: max(.9rem, 16px) /* rt-1019 */; }
  .sth-card .hub-fine { font-size: max(.78rem, 14px) /* rt-1019 */; }
  .sth-panel { padding: 1rem; }
  .sth-step p { font-size: max(.88rem, 16px) /* rt-1019 */; max-width: none; }
  .sth-step h3 { font-size: 1rem; }
  .sth-rc h3 { font-size: .95rem; }
  .sth-rc p, .sth-rc .link-arrow { font-size: max(.86rem, 16px) /* rt-1019 */; }
  .sth-kit { --cover-w: 6.5rem; --cover-space: 6.4rem; --lead-title: 1.4rem; }
  .sth-kit .lead-box__text { font-size: max(.88rem, 16px) /* rt-1019 */; }
  .sth-trust .trust-strip__inner { display: grid; grid-template-columns: minmax(0, 1fr); gap: .9rem; }
  .sth-trust__title { max-width: none; }
  .sth-quote { flex-wrap: wrap; }
  .sth-stats { flex-wrap: wrap; gap: 1rem 1.5rem; }
  .sth-quote blockquote, .sth-trust__rating, .sth-stats .trust-item { font-size: max(.86rem, 16px) /* rt-1019 */; }
}
@media (max-width: 640px) {
  .sth-res__grid { grid-template-columns: minmax(0, 1fr); }
}
