/* Crochet stitch directory */
.hm-stitch-directory { max-width: 56rem; margin: 0 auto; }
.hm-stitch-directory__header { margin-bottom: 3rem; }
.hm-stitch-directory__header h1 { margin: 0; color: #4a2468; }
.hm-stitch-directory__header p:last-child { max-width: 42rem; margin: .85rem 0 0; color: #746a7c; }
.hm-stitch-directory__switcher { display: inline-flex; align-items: center; gap: .45rem; margin: 0 0 1.25rem; padding: .3rem; border: 1px solid #d8c5e9; border-radius: 999px; background: #f8f3fc; }
.hm-stitch-directory__switcher button { min-height: 34px; padding: .25rem .7rem; border: 0; border-radius: 999px; background: transparent; color: #4a2468; font: inherit; font-size: .84rem; font-weight: 800; cursor: pointer; }
.hm-stitch-directory__switcher button[aria-pressed="true"] { background: #6c38a5; color: #fff; box-shadow: 0 2px 8px rgba(72, 36, 104, .22); }
.hm-stitch-directory__search { margin: 0 0 2.5rem; }
.hm-stitch-directory__search > label { display: block; margin-bottom: .55rem; color: #4a2468; font-weight: 800; }
.hm-stitch-directory__search-control { position: relative; }
.hm-stitch-directory__search input { width: 100%; min-height: 48px; box-sizing: border-box; padding: .7rem 3rem .7rem 1rem; border: 1px solid #d8c5e9; border-radius: 12px; background: #fff; color: #2d2434; font: inherit; }
.hm-stitch-directory__search input::-webkit-search-decoration,
.hm-stitch-directory__search input::-webkit-search-cancel-button,
.hm-stitch-directory__search input::-webkit-search-results-button,
.hm-stitch-directory__search input::-webkit-search-results-decoration { display: none; -webkit-appearance: none; appearance: none; }
.hm-stitch-directory__search input:focus { outline: 3px solid rgba(143, 91, 211, .28); border-color: #8f5bd3; }
.hm-stitch-directory__search-control button { position: absolute; top: 50%; right: .45rem; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; padding: 0; border: 0; border-radius: 999px; background: #f3eaff; color: #4a2468; font: inherit; font-size: 1.45rem; line-height: 1; cursor: pointer; transform: translateY(-50%); }
.hm-stitch-directory__search-control button > span[aria-hidden="true"] { display: flex; width: 1em; height: 1em; align-items: center; justify-content: center; transform: translateY(-.04em); }
.hm-stitch-directory__search-control button:hover,
.hm-stitch-directory__search-control button:focus-visible { background: #e7d8f7; }
.hm-stitch-directory__search-status { min-height: 1.35em; margin: .5rem 0 0; color: #746a7c; font-size: .86rem; }
.hm-stitch-directory__results { margin-top: -.8rem; }
.hm-stitch-directory__results-heading { margin: 0 0 .8rem; color: #4a2468; font-size: 1.2rem; }
.hm-stitch-directory__no-results { margin: 0; padding: 1rem; border-radius: 12px; background: #f8f3fc; color: #746a7c; }
.hm-stitch-directory.is-searching .hm-stitch-directory__group { display: none; }
.hm-stitch-directory[data-terminology="uk"] [data-hm-stitch-directory-name="us"],
.hm-stitch-directory[data-terminology="uk"] [data-hm-stitch-directory-terms="us"],
.hm-stitch-directory[data-terminology="us"] [data-hm-stitch-directory-name="uk"],
.hm-stitch-directory[data-terminology="us"] [data-hm-stitch-directory-terms="uk"] { display: none; }
.hm-stitch-directory__group { margin-top: 2.75rem; }
.hm-stitch-directory__group-heading { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: baseline; gap: 1rem; margin-bottom: .8rem; padding: 0 0 .65rem; border-bottom: 2px solid #e6d9f0; cursor: pointer; list-style: none; }
.hm-stitch-directory__group-heading::-webkit-details-marker { display: none; }
.hm-stitch-directory__group-heading::after { justify-self: end; content: "−"; color: #6c38a5; font-size: 1.4rem; font-weight: 700; line-height: 1; }
.hm-stitch-directory__group:not([open]) .hm-stitch-directory__group-heading::after { content: "+"; }
.hm-stitch-directory__group-title { color: #4a2468; font-family: var(--wp--preset--font-family--display); font-size: var(--wp--preset--font-size--large); font-weight: 800; }
.hm-stitch-directory__group-heading > span:not(.hm-stitch-directory__group-title) { grid-column: 2; }
.hm-stitch-directory__group-heading span { color: #746a7c; font-size: .85rem; font-weight: 700; white-space: nowrap; }
.hm-stitch-directory__list { margin: 0; padding: 0; border-top: 1px solid #eee5f5; list-style: none; }
.hm-stitch-directory__list li { margin: 0; border-bottom: 1px solid #eee5f5; }
.hm-stitch-directory__list a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 1rem; padding: 1.1rem .75rem; color: #2d2434; text-decoration: none; transition: background 160ms ease, padding 160ms ease; }
.hm-stitch-directory__list a:hover,
.hm-stitch-directory__list a:focus-visible { padding-right: 1rem; padding-left: 1rem; background: #f3eaff; }
.hm-stitch-directory__name { display: inline-flex; align-items: center; flex-wrap: wrap; gap: .5rem; color: #5c2d89; font-size: 1.08rem; font-weight: 800; }
.hm-stitch-directory__abbreviation { display: inline-flex; min-height: 1.7rem; align-items: center; padding: .12rem .5rem; border-radius: 999px; background: #e7d8f7; color: #4a2468; font-family: var(--wp--preset--font-family--sans); font-size: .75rem; font-weight: 800; line-height: 1.2; }
.hm-stitch-directory__terms { display: flex; flex-wrap: wrap; gap: .45rem 1rem; color: #746a7c; font-size: .88rem; }
.hm-stitch-directory__terms strong { color: #4a2468; font-size: .75rem; letter-spacing: .04em; }
.hm-stitch-directory__terms em { font-style: normal; }
.hm-stitch-directory__arrow { color: #6c38a5; font-size: 1.25rem; font-weight: 800; }
@media (max-width: 700px) {
  .hm-stitch-directory__header { margin-bottom: 2.25rem; }
  .hm-stitch-directory__list a { grid-template-columns: 1fr auto; gap: .45rem .75rem; padding: 1rem .35rem; }
}

.hm-brand-mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  flex: 0 0 46px;
  border-radius: 50%;
  background: #f3eaff;
}

.hm-brand-mark svg { width: 34px; height: 34px; display: block; }
.hm-brand-link { text-decoration: none !important; }
.hm-brand-link:hover .hm-brand-mark { transform: rotate(-7deg) scale(1.04); }
.hm-brand-mark { transition: transform 180ms ease; }

.hm-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.hm-hero::before,
.hm-hero::after {
  content: "";
  position: absolute;
  border-radius: 999px;
  filter: blur(2px);
  z-index: -1;
}
.hm-hero::before {
  width: 420px;
  height: 420px;
  background: rgba(174, 123, 255, 0.18);
  top: -220px;
  right: -120px;
}
.hm-hero::after {
  width: 260px;
  height: 260px;
  background: rgba(220, 192, 255, 0.24);
  bottom: -150px;
  left: -80px;
}
.hm-hero__mascot {
  display: block;
  position: absolute;
  right: 1.2rem;
  bottom: .75rem;
  z-index: 0;
  width: clamp(6rem, 10vw, 8.5rem);
  aspect-ratio: 480 / 512;
  background: url("../images/hero-bear-donkey.png") center / contain no-repeat;
  pointer-events: none;
}
.hm-hero > :not(.hm-hero__mascot) {
  position: relative;
  z-index: 1;
}

.hm-hero-intro {
  max-width: 50rem;
  margin-right: auto;
  margin-left: auto;
}

.hm-hero > :where(.wp-block-heading, .wp-block-paragraph, .wp-block-buttons) {
  margin-right: auto;
  margin-left: auto;
  text-align: center;
}

.hm-hero h1 {
  display: flex;
  width: 100%;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.hm-card {
  height: 100%;
  overflow: hidden;
  box-shadow: var(--hm-shadow);
  transition: transform 180ms ease, box-shadow 180ms ease;
}
.hm-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--hm-shadow-hover);
}
.hm-card .wp-block-post-featured-image img { transition: transform 300ms ease; }
.hm-card:hover .wp-block-post-featured-image img { transform: scale(1.025); }

.hm-home-latest__image {
  width: min(calc(100% - 2rem), 13rem);
  margin: var(--wp--preset--spacing--30) auto 0;
  border-radius: 18px !important;
  overflow: hidden;
}
.hm-home-latest__image img {
  display: block;
  width: 100%;
  height: auto;
}
.hm-show-mobile { display: none; }

.hm-category-card {
  display: flex;
  flex-direction: column;
  min-height: 13.5rem;
  transition: transform 180ms ease, background 180ms ease;
}
.hm-category-card:hover { transform: translateY(-3px); }
.hm-category-card > p:last-child { margin-top: auto; }
.wp-block-columns .wp-block-column > .hm-category-card { flex: 1; }
.wp-block-columns .wp-block-column:has(> .hm-category-card) { display: flex; }

.hm-category-card__icon {
  display: block;
  width: 48px;
  height: 72px;
  margin: 0 auto;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 48px 48px;
}

.hm-category-card__icon--knitting {
  background-image: url("../images/knitting-purple-yarn.png");
}

.hm-404__icon {
  width: 100px;
  height: 120px;
  background-size: 100px 100px;
}

.hm-category-card__icon--crochet {
  background-image: url("../images/crochet-granny-square.png");
}

.hm-category-card__icon--tools {
  background-image: url("../images/tools-craft-kit-icon.png");
}

.hm-category-card__icon--patterns {
  color: #6c38a5;
}

.wp-block-column:has(> .hm-footer-social-links) { position: relative; }
.hm-footer-social-links { position: absolute; top: .15rem; right: 2rem; margin: 0; }
.hm-footer-social-links__icons { display: flex; gap: .65rem; }
.hm-footer-social-links__link { display: inline-flex; width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border: 1px solid rgba(198, 166, 239, .62); border-radius: 50%; color: #f4edf9 !important; transition: background 160ms ease, border-color 160ms ease, color 160ms ease, transform 160ms ease; }
.hm-footer-social-links__link:hover, .hm-footer-social-links__link:focus-visible { border-color: #ffffff; background: #ffffff; color: #6c38a5 !important; transform: translateY(-2px); }
.hm-footer-social-links__link:focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; }
.hm-footer-social-links__link svg { width: 1.2rem; height: 1.2rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.hm-footer-social-links__link[href*="facebook"] svg { fill: currentColor; stroke: none; }

@media (max-width: 781px) {
  .wp-block-column:has(> .hm-footer-social-links) { position: static; }
  .hm-footer-social-links { position: static; margin-top: 1.25rem; }
  .hm-category-card {
    height: 13.5rem;
    box-sizing: border-box;
  }
}

.hm-tools-page { max-width: 56rem; margin: 0 auto; }
.hm-tools-page__intro { max-width: 38rem; margin: 0 auto 2.25rem; color: #746a7c; text-align: center; }
.hm-tools-page__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 1.25rem; }
.hm-tool-card { display: flex; min-height: 14rem; flex-direction: column; align-items: flex-start; gap: 1.15rem; padding: 1.75rem; border: 1px solid #e1d1ee; border-radius: 24px; background: linear-gradient(135deg, #faf7fd 0%, #f3eaff 100%); box-shadow: var(--hm-shadow); color: #2d2434; text-decoration: none; transition: transform 180ms ease, box-shadow 180ms ease, border-color 180ms ease; }
.hm-tool-card:hover, .hm-tool-card:focus-visible { border-color: #b58ae1; box-shadow: var(--hm-shadow-hover); color: #2d2434; transform: translateY(-4px); }
.hm-tool-card__icon { display: block; width: 58px; height: 58px; border-radius: 18px; background: #ffffff url("../images/crochet-granny-square.png") center / 42px 42px no-repeat; box-shadow: 0 7px 18px rgba(92, 45, 137, .16); }
.hm-tool-card__content { display: grid; gap: .5rem; }
.hm-tool-card__title { color: #4a2468; font-family: var(--wp--preset--font-family--display); font-size: 1.35rem; font-weight: 800; line-height: 1.2; }
.hm-tool-card__description { color: #746a7c; }
.hm-tool-card__action { margin-top: .35rem; color: #6c38a5; font-weight: 800; }
.hm-tool-card__icon--row-counter { background-color: #ffffff; background-image: url("../images/row-counter-tool-icon.png"); background-position: center; background-size: 46px auto; background-repeat: no-repeat; font-size: 0; }

.hm-row-counter-guide { max-width: 46rem; margin: 0 auto; }
.hm-row-counter-guide__intro { max-width: 39rem; margin: 0 auto 2rem; color: #746a7c; font-size: 1.1rem; text-align: center; }
.hm-row-counter-guide__steps { display: grid; gap: 1rem; }
.hm-row-counter-guide__step { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; align-items: start; padding: 1.35rem; border: 1px solid #e1d1ee; border-radius: 20px; background: #faf7fd; box-shadow: var(--hm-shadow); }
.hm-row-counter-guide__step h2 { margin: 0 0 .4rem; color: #4a2468; font-size: 1.25rem; }
.hm-row-counter-guide__step p { margin: 0; color: #746a7c; }
.hm-row-counter-guide__number { display: grid; width: 3rem; height: 3rem; place-items: center; border-radius: 50%; background: #6c38a5; color: #ffffff; font-family: var(--wp--preset--font-family--display); font-size: 1.35rem; font-weight: 800; }

@media (max-width: 480px) {
  .hm-row-counter-guide__step { grid-template-columns: 2.5rem 1fr; padding: 1.1rem; }
  .hm-row-counter-guide__number { width: 2.5rem; height: 2.5rem; }
}

.hm-pill,
.wp-block-post-terms a {
  display: inline-block;
  border-radius: 999px;
  text-decoration: none;
}

.wp-block-post-terms a {
  padding: .35rem .7rem;
  background: #f3eaff;
  color: #61358f;
  font-size: .78rem;
  font-weight: 700;
  margin-right: .35rem;
}

.wp-block-navigation a { text-decoration: none; }
.wp-block-navigation a:hover { color: #7b3fc6; }

.wp-block-button .wp-block-button__link { transition: transform 160ms ease, box-shadow 160ms ease; }
.wp-block-button:not(.is-style-outline) .wp-block-button__link,
.wp-block-post-comments-form input[type="submit"],
.comment-form input[type="submit"],
footer a[href*="wordpress.com/reader/site/subscription"] { color: var(--hm-button-light-text) !important; }
.wp-block-button .wp-block-button__link:hover { transform: translateY(-2px); box-shadow: var(--hm-button-hover-shadow); }
.hm-hero .is-style-outline .wp-block-button__link { box-sizing: border-box; padding-top: .625rem; padding-bottom: .625rem; border: 2px solid var(--hm-button-primary); background: transparent; color: var(--hm-button-primary) !important; box-shadow: none; }
.hm-hero .is-style-outline .wp-block-button__link:hover,
.hm-hero .is-style-outline .wp-block-button__link:focus-visible { background: transparent; color: var(--hm-button-primary) !important; box-shadow: var(--hm-button-hover-shadow); }

.wp-block-post-content > :where(h2,h3,h4) { scroll-margin-top: 7rem; }
.wp-block-post-content h2 { margin-top: 2.2em; }
.wp-block-post-content h3 { margin-top: 1.8em; }
.wp-block-post-content :where(ul,ol) { padding-left: 1.25em; }