/* HandymanPro Base components. Colors/spacing ONLY via --wp--preset-- vars. */
.wp-site-blocks > header.wp-block-template-part, header.wp-block-template-part:has(> .hp-header) { position: sticky; top: 0; z-index: 50; }
.hp-header { backdrop-filter: saturate(1.2) blur(6px); }
.hp-header > .wp-block-group { position: relative; }   /* anchor for the mobile dropdown */
.hp-header .wp-block-site-logo img { max-height: 64px; width: auto; }   /* square icons (WH) must not blow the header up */
.hp-menu__list { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--wp--preset--spacing--30); align-items: center; }
.hp-menu__list a { text-decoration: none; font-weight: 600; color: var(--wp--preset--color--ink); }
.hp-menu__list a:hover { color: var(--wp--preset--color--accent-strong); }
.hp-footer .hp-menu__list { flex-direction: column; align-items: flex-start; gap: var(--wp--preset--spacing--10); }
.hp-footer a { color: var(--wp--preset--color--base); text-decoration: none; }
.hp-footer a:hover { color: var(--wp--preset--color--accent); }
.hp-footer__legal { list-style: none; padding-left: 0; }
.hp-footer__contact { margin-top: var(--wp--preset--spacing--20); }
.hp-footer__contact a { color: var(--wp--preset--color--accent); font-weight: 600; white-space: nowrap; }
.hp-footer__contact a:hover { text-decoration: underline; }
.hp-footer__dot { margin: 0 .4em; color: var(--wp--preset--color--muted); }

.is-style-section-dark { background: var(--wp--preset--gradient--ink-fade); color: var(--wp--preset--color--base); }
.is-style-section-dark :is(h1,h2,h3,h4,p,li) { color: var(--wp--preset--color--base); }
.is-style-section-dark .hp-muted { color: var(--wp--preset--color--muted); }
.is-style-section-surface { background: var(--wp--preset--color--surface); }
.is-style-card { background: var(--wp--preset--color--base); border: 1px solid var(--wp--preset--color--border); border-radius: 14px; padding: var(--wp--preset--spacing--30); box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.is-style-section-dark .is-style-card { background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.12); }

.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--wp--preset--color--brand); border: 2px solid currentColor; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { color: var(--wp--preset--color--accent-strong); background: transparent; }
.wp-block-button.is-style-ghost-light .wp-block-button__link { background: transparent; color: var(--wp--preset--color--base); border: 2px solid rgba(255,255,255,.4); }
.wp-block-button.is-style-ghost-light .wp-block-button__link:hover { border-color: var(--wp--preset--color--base); background: transparent; }

ul.is-style-checkmark { list-style: none; padding-left: 0; }
ul.is-style-checkmark li { position: relative; padding-left: 1.75em; margin-bottom: .4em; }
ul.is-style-checkmark li::before { content: "\2713"; position: absolute; left: 0; top: 0; font-weight: 800; color: var(--wp--preset--color--success); }

.hp-eyebrow { text-transform: uppercase; letter-spacing: .14em; font-weight: 700; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--accent-strong); }
.hp-stat__num { font-size: var(--wp--preset--font-size--xxl); font-weight: 800; line-height: 1; color: var(--wp--preset--color--brand); }
.is-style-section-dark .hp-stat__num { color: var(--wp--preset--color--accent); }
.hp-step__num { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 999px; background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); font-weight: 800; }
.hp-step small { display: block; color: var(--wp--preset--color--muted); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; font-size: var(--wp--preset--font-size--xs); }

.hp-compare table { width: 100%; border-collapse: collapse; }
.hp-compare th, .hp-compare td { padding: .8rem 1rem; border-bottom: 1px solid var(--wp--preset--color--border); text-align: left; vertical-align: top; }
.hp-compare thead th { background: var(--wp--preset--color--brand); color: var(--wp--preset--color--base); }
.hp-compare td:nth-child(2) { font-weight: 700; color: var(--wp--preset--color--success); }
.hp-compare td:nth-child(3) { color: var(--wp--preset--color--muted); }

.hp-faq details { border-bottom: 1px solid var(--wp--preset--color--border); padding: var(--wp--preset--spacing--20) 0; }
.hp-faq summary { cursor: pointer; font-weight: 700; font-size: var(--wp--preset--font-size--l); list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.hp-faq summary::-webkit-details-marker { display: none; }
.hp-faq summary::after { content: "+"; font-weight: 800; color: var(--wp--preset--color--accent-strong); }
.hp-faq details[open] summary::after { content: "\2212"; }

.hp-form { display: grid; gap: var(--wp--preset--spacing--20); min-width: 0; }
.hp-form *, .hp-form *::before, .hp-form *::after { box-sizing: border-box; }
.hp-form label, .hp-form__row > * { min-width: 0; display: block; }
.hp-form__row { display: grid; gap: var(--wp--preset--spacing--20); grid-template-columns: 1fr; }
@media (min-width: 640px) { .hp-form__row { grid-template-columns: 1fr 1fr; } }
.hp-form input[type="text"], .hp-form input[type="email"], .hp-form input[type="tel"], .hp-form select, .hp-form textarea { width: 100%; padding: .9rem 1rem; border: 1px solid var(--wp--preset--color--border); border-radius: 10px; font: inherit; background: var(--wp--preset--color--base); color: var(--wp--preset--color--ink); }
.hp-form textarea { resize: vertical; min-height: 8rem; }
.hp-form select { appearance: auto; }
.hp-form__label { display: block; margin-bottom: .35rem; font-size: var(--wp--preset--font-size--s); font-weight: 700; color: var(--wp--preset--color--ink); }
.hp-form--support button { justify-self: start; min-width: 10rem; }
.hp-form__consent { display: flex; gap: .6rem; align-items: flex-start; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); }
.hp-form button { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); border: 0; border-radius: 10px; padding: .95rem 1.5rem; font: inherit; font-weight: 800; cursor: pointer; }
.hp-form button:hover { background: var(--wp--preset--color--accent-strong); }
.hp-form__success { padding: var(--wp--preset--spacing--20); border-radius: 10px; background: var(--wp--preset--color--surface); color: var(--wp--preset--color--success); font-weight: 700; }
.is-style-section-dark .hp-form__consent { color: var(--wp--preset--color--muted); }
.is-style-section-dark .hp-form__success, .is-style-section-dark p.hp-form__success { color: var(--wp--preset--color--success); }   /* beats the dark-section text rule */

.hp-price { font-size: var(--wp--preset--font-size--display); font-weight: 800; line-height: 1; color: var(--wp--preset--color--brand); }
.hp-price small { font-size: var(--wp--preset--font-size--m); font-weight: 600; color: var(--wp--preset--color--muted); }
.hp-timeline { display: grid; gap: var(--wp--preset--spacing--30); grid-template-columns: 1fr; counter-reset: step; }
@media (min-width: 900px) { .hp-timeline { grid-template-columns: repeat(4, 1fr); } }

.hp-header__cta .hp-cta-short { display: none; }   /* phones swap in the short label (see max-width rule) */
/* Primary menu toggle: a no-JS <details>. Desktop: always open, summary hidden. Mobile: summary = hamburger, list drops below the header. */
.hp-menu-toggle > summary { display: none; list-style: none; cursor: pointer; align-items: center; gap: .5rem; font-weight: 700; color: var(--wp--preset--color--ink); }
.hp-menu-toggle > summary::-webkit-details-marker { display: none; }
.hp-menu-toggle__bars { display: inline-block; width: 22px; height: 2px; background: currentColor; box-shadow: 0 -7px 0 currentColor, 0 7px 0 currentColor; }
@media (max-width: 781px) {
  .hp-header__nav { gap: var(--wp--preset--spacing--20); }
  .hp-header .wp-block-site-logo img { max-width: 96px; height: auto; }
  .hp-header__nav { gap: var(--wp--preset--spacing--10); }
  .hp-menu-toggle__text { display: none; }   /* phones: hamburger only, no 'Menu' word */
  .hp-header__cta .wp-block-button__link { white-space: nowrap; font-size: var(--wp--preset--font-size--xs); padding: .6rem .8rem; }
  .hp-header__cta .hp-cta-long { display: none; }
  .hp-header__cta .hp-cta-short { display: inline; }
  .hp-header .wp-block-site-logo img { max-height: 44px; }
  .hp-menu-toggle > summary { display: inline-flex; }
  .hp-menu-toggle[open] > summary .hp-menu-toggle__bars { box-shadow: none; transform: rotate(45deg); }
  .hp-menu-toggle > .hp-menu { position: absolute; left: 0; right: 0; top: 100%; background: var(--wp--preset--color--base); border-bottom: 1px solid var(--wp--preset--color--border); padding: var(--wp--preset--spacing--20); box-shadow: 0 12px 24px rgba(0,0,0,.08); }
  .hp-menu-toggle > .hp-menu .hp-menu__list { flex-direction: column; align-items: stretch; gap: 0; }
  .hp-menu-toggle > .hp-menu .hp-menu__list li { padding: .6rem 0; border-bottom: 1px solid var(--wp--preset--color--border); }
  .hp-menu-toggle > .hp-menu .hp-menu__list li:last-child { border-bottom: 0; }
  .hp-menu-toggle > .hp-menu .hp-menu__list a { display: block; font-size: var(--wp--preset--font-size--m); }
}
@media (min-width: 782px) {
  .hp-menu-toggle:not([open]) > .hp-menu { display: block; }   /* desktop ignores the toggle state */
}

/* About page */
.hp-timeline-list p { display: flex; gap: .75rem; align-items: flex-start; margin: 0 0 .6rem; }
.hp-timeline-list .hp-step__num { flex: 0 0 auto; width: 1.75rem; height: 1.75rem; font-size: var(--wp--preset--font-size--xs); }
.hp-about-story h2 { margin-top: var(--wp--preset--spacing--40); }
.hp-about-hero .wp-block-image img { box-shadow: 0 20px 40px rgba(0,0,0,.35); }

/* Login-page brand line: "THE ULTIMATE" small gold caps, then "Business Growth System" with the last two words in gold */
.hp-brandline { display: flex; flex-direction: column; gap: .25rem; margin-bottom: var(--wp--preset--spacing--20); }
.hp-brandline__top { font-size: var(--wp--preset--font-size--s); font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--wp--preset--color--gold-soft); }
.hp-brandline__title { font-size: var(--wp--preset--font-size--xl); font-weight: 800; letter-spacing: -0.03em; line-height: 1.1; color: var(--wp--preset--color--base); }
.hp-brandline__title em { font-style: normal; color: var(--wp--preset--color--gold-soft); }
.hp-hero__shot figcaption { text-align: center; font-size: var(--wp--preset--font-size--s); font-weight: 600; color: var(--wp--preset--color--base); margin-top: .75rem; }
.hp-hl { color: var(--wp--preset--color--gold-soft); font-weight: 600; }
.hp-hero__shot img { cursor: zoom-in; box-shadow: 0 24px 48px rgba(0,0,0,.35); }

.hp-destination { margin-top: var(--wp--preset--spacing--40); }
.hp-destination strong { color: var(--wp--preset--color--accent); }

.hp-cta-lead { font-weight: 700; margin-bottom: var(--wp--preset--spacing--10); }
.is-style-section-dark .hp-cta-lead { color: var(--wp--preset--color--gold-soft); }
.hp-install__note { font-weight: 700; color: var(--wp--preset--color--ink); margin-top: var(--wp--preset--spacing--30); }
.hp-included__grid { display: grid; gap: var(--wp--preset--spacing--30); grid-template-columns: 1fr; }
@media (min-width: 760px) { .hp-included__grid { grid-template-columns: repeat(2, 1fr); } }
.hp-included__card .wp-block-image { margin: 0 0 var(--wp--preset--spacing--20); } .hp-included__card h3 { margin: 0 0 .35rem; } .hp-included__card p { margin: 0; }
.hp-included__shot img { width: 100%; display: block; cursor: zoom-in; }
.hp-included__more { font-weight: 700; margin-top: var(--wp--preset--spacing--40); }
.hp-brandline__abbr { font-size: var(--wp--preset--font-size--l); font-weight: 700; letter-spacing: 0; color: var(--wp--preset--color--base); opacity: .9; }
.hp-hero__shot-head { text-align: center; font-size: var(--wp--preset--font-size--s); font-weight: 600; color: var(--wp--preset--color--base); margin: 0 0 .6rem; letter-spacing: .02em; } .hp-hero__shot-head strong { color: var(--wp--preset--color--gold-soft); }
.hp-feature-group__shot { margin-top: var(--wp--preset--spacing--30); } .hp-feature-group__shot img { width: 100%; display: block; cursor: zoom-in; box-shadow: 0 16px 32px rgba(0,0,0,.25); } .hp-feature-group__shot figcaption { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); text-align: center; margin-top: .4rem; } .is-style-section-dark .hp-feature-group__shot figcaption { color: var(--wp--preset--color--base); opacity: .7; }
.hp-promise { margin-top: var(--wp--preset--spacing--30); padding: var(--wp--preset--spacing--30); border: 2px solid var(--wp--preset--color--gold-soft); border-radius: 14px; background: rgba(196,163,90,.10); }
.hp-promise__label { margin: 0 0 .4rem; font-size: var(--wp--preset--font-size--s); font-weight: 800; letter-spacing: .12em; text-transform: uppercase; color: var(--wp--preset--color--gold-soft); }
.hp-promise__body { margin: 0; font-size: var(--wp--preset--font-size--m); font-weight: 600; line-height: 1.45; color: var(--wp--preset--color--base); }
.hp-webinar__title, .is-style-section-dark :is(h1,h2).hp-webinar__title { color: var(--wp--preset--color--gold-soft); margin-bottom: .25rem; }
.hp-webinar__sub { font-size: var(--wp--preset--font-size--l); font-weight: 700; line-height: 1.25; color: var(--wp--preset--color--base); margin: 0 0 var(--wp--preset--spacing--20); }
.hp-webinar__titlerow { gap: .9rem; align-items: center; margin-bottom: .25rem; }
.hp-webinar__when { display: inline-block; margin: 0 0 var(--wp--preset--spacing--20); padding: .45rem .9rem; border-radius: 999px; background: color-mix(in srgb, var(--wp--preset--color--gold-soft) 18%, transparent); color: var(--wp--preset--color--gold-soft); font-weight: 800; font-size: var(--wp--preset--font-size--s); letter-spacing: .01em; }   /* B-5147: next live session */
.hp-webinar__when.has-text-align-center { display: table; margin-left: auto; margin-right: auto; }   /* inline-block pill ignores its own text-align; center the box itself (teaser band) */
.hp-form__choices { border: 0; margin: 0; padding: 0; min-width: 0; display: grid; gap: .5rem; }
.hp-form__choices legend { padding: 0; } .is-style-section-dark .hp-form__choices legend { color: var(--wp--preset--color--base); opacity: .85; }
.hp-form__choice { display: flex; gap: .65rem; align-items: flex-start; padding: .7rem .9rem; border: 1px solid var(--wp--preset--color--border); border-radius: 10px; background: var(--wp--preset--color--base); color: var(--wp--preset--color--ink); font-size: var(--wp--preset--font-size--s); font-weight: 600; cursor: pointer; }
.hp-form__choice:has(input:checked) { border-color: var(--wp--preset--color--accent-strong); box-shadow: 0 0 0 2px color-mix(in srgb, var(--wp--preset--color--accent) 35%, transparent); }
.hp-form__choice input { margin: .2rem 0 0; flex: 0 0 auto; accent-color: var(--wp--preset--color--accent-strong); }
.hp-form__choice small { display: block; font-weight: 500; color: var(--wp--preset--color--muted); }
.hp-webinar__titlerow .hp-webinar__title { margin-bottom: 0; }
.hp-fw-teaser { margin: 0 -8px 0 -14px; flex: 0 0 auto; width: 112px; } .hp-fw-teaser img { width: 112px; height: auto; display: block; }
@media (max-width: 600px) { .hp-fw-teaser { width: 64px; } .hp-fw-teaser img { width: 64px; } }
.hp-thanks .hp-promise { margin-top: var(--wp--preset--spacing--30); }
.hp-daily h3, .hp-textlink h3 { margin: .25rem 0 .5rem; }
.hp-textlink__phone { display: grid; gap: .6rem; margin-bottom: .75rem; }
.hp-textlink__links { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; } .hp-textlink__links a { font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.hp-textlink [hidden] { display: none; }
.hp-form--inline button { width: 100%; }
.hp-form__fine { margin: .5rem 0 0; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); } .is-style-section-dark .hp-form__fine { color: var(--wp--preset--color--base); opacity: .75; }
.hp-daily__phone { display: grid; gap: .6rem; margin-bottom: .75rem; } .hp-daily__phone[hidden] { display: none; }

/* Competitor feature matrix (hp-base/compare-competitors) — scrolls sideways on phones, first column pinned */
.hp-vs__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--wp--preset--color--border); border-radius: 12px; background: var(--wp--preset--color--base); }
.hp-vs table { width: 100%; min-width: 760px; border-collapse: separate; border-spacing: 0; font-size: var(--wp--preset--font-size--s); }
.hp-vs th, .hp-vs td { padding: .75rem .9rem; border-bottom: 1px solid var(--wp--preset--color--border); text-align: center; vertical-align: middle; }
.hp-vs tbody tr:last-child td { border-bottom: 0; }
.hp-vs th:first-child, .hp-vs td:first-child { text-align: left; position: sticky; left: 0; z-index: 1; background: var(--wp--preset--color--base); min-width: 11rem; max-width: 16rem; box-shadow: 1px 0 0 var(--wp--preset--color--border); }
.hp-vs thead th { background: var(--wp--preset--color--brand); color: var(--wp--preset--color--base); font-weight: 700; white-space: nowrap; }
.hp-vs thead th:first-child { background: var(--wp--preset--color--brand); }
.hp-vs thead th.hp-vs__hp { background: var(--wp--preset--color--accent); color: var(--wp--preset--color--ink); }
.hp-vs td.hp-vs__hp { background: color-mix(in srgb, var(--wp--preset--color--accent) 9%, var(--wp--preset--color--base)); font-weight: 700; color: var(--wp--preset--color--ink); }
.hp-vs td.hp-vs__hp .hp-vs__mark { color: var(--wp--preset--color--success); }
.hp-vs__feature { font-weight: 700; display: block; }
.hp-vs__feature small { display: block; font-weight: 400; color: var(--wp--preset--color--muted); font-size: var(--wp--preset--font-size--xs); line-height: 1.35; margin-top: .15rem; }
.hp-vs__mark { font-weight: 800; font-size: 1.1em; }
.hp-vs__mark--y { color: var(--wp--preset--color--success); }
.hp-vs__mark--p { color: var(--wp--preset--color--accent-strong); font-size: var(--wp--preset--font-size--xs); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.hp-vs__mark--n { color: var(--wp--preset--color--muted); }
.hp-vs__mark--n::after { content: "\2014"; }
.hp-vs__mark--y::after { content: "\2713"; }
.hp-vs sup { color: var(--wp--preset--color--muted); font-weight: 600; margin-left: .15em; }
.hp-vs__legend, .hp-vs__notes { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); margin: var(--wp--preset--spacing--20) 0 0; }
.hp-vs__legend span { display: inline-block; margin: 0 1.25rem .35rem 0; }
.hp-vs__notes ol { margin: .35rem 0 0; padding-left: 1.25rem; }
.hp-vs__notes li { margin: 0 0 .2rem; }
.hp-vs__scrollhint { display: none; font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); text-align: center; margin: 0 0 .5rem; }
@media (max-width: 781px) { .hp-vs__scrollhint { display: block; } .hp-vs th:first-child, .hp-vs td:first-child { min-width: 9.5rem; max-width: 11rem; } }
.hp-vs td.hp-vs__text { font-size: var(--wp--preset--font-size--xs); color: var(--wp--preset--color--muted); line-height: 1.35; }
