/* sh-classes-v1 (OFFER-LINK-INTERIM-1, 2026-10-25): header "Online Classes" item (.sh__classes = the Blog link style) on the sites in
   sitelib.CLASSES_NAV only (header carries .sh--classes). Keeps row 1 (wordmark at its 98px minimum + Online Classes + Blog + Members
   log in) on one line from 330px: below 520px the item reads "Classes" and the button uses its existing short label "Log in"
   (accessible names unchanged via aria-label). Pure CSS, CSP-safe, no colour changes (nebula night tokens untouched). */
.sh__classes-short{display:none}
@media (max-width:519.98px){
  .sh--classes .sh__classes-full,.sh--classes .sh__cta-full{display:none}
  .sh--classes .sh__classes-short,.sh--classes .sh__cta-short{display:inline}
}
@media (max-width:379.98px){
  .sh--classes .sh__right{gap:8px}
  .sh--classes .sh__blog{padding:0 3px}
  .sh--classes .sh__cta{padding:0 10px}
}

/* ---------- HEADER-LAYOUT-2 (founder 02:43 UTC 2026-10-25; HEADER-NAV-1 02:39): LEFT wordmark + Members log in, then the site title;
   RIGHT Online Classes (founder 02:45 label) + Blog. One shared header on all 6 sites (+ members). Title never wraps or crowds: one line with ellipsis beside
   the button from 1024px; below 1024px it moves to its own slim centred row under row 1. 44px targets unchanged. Nebula night only. */
.sh--v2 .sh__inner{grid-template-columns:auto auto minmax(0,1fr) auto;grid-template-areas:"home cta title right";column-gap:16px}
.sh--v2 .sh__cta{grid-area:cta;justify-self:start}
.sh--v2 .sh__title{grid-area:title;justify-self:stretch;min-width:0;text-align:left;font-size:1.125rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sh--v2 .sh__right{grid-area:right;justify-self:end}
@media (max-width:1023.98px){
  .sh--v2 .sh__inner{grid-template-columns:auto auto minmax(0,1fr);grid-template-areas:"home cta right" "title title title";row-gap:0;padding-top:6px;padding-bottom:8px;min-height:0}
  .sh--v2 .sh__title{text-align:center;font-size:1rem;line-height:1.4;white-space:nowrap;text-wrap:nowrap}
}
@media (max-width:419.98px){
  .sh--v2 .sh__inner{column-gap:8px}
  .sh--v2 .sh__title{font-size:.9375rem}
}
/* HEADER-TAP-44 (Orion 03:20 UTC 2026-10-25): every header nav link (Members log in, Online Classes/Classes, Blog) has a >=44x44 hit area; text centred, no visual change */
.sh--v2 .sh__blog,.sh--v2 .sh__cta{min-width:44px;min-height:44px;justify-content:center;box-sizing:border-box}
/* SH-FOCUS-FORCED-1 (Creative live header check 03:30 UTC 2026-10-25 via Orion 03:32 UTC): forced-colors keeps a ring; the box-shadow ring stays */
.sh a:focus-visible{outline:2px solid transparent;outline-offset:2px}
/* BTN-FOCUS-1 (Creative PASS a11y via Orion 03:40 UTC 2026-10-25; update one, update all): visible focus on main buttons (e.g. 'Buy the Class') */
main a.btn:focus-visible{outline:3px solid #2FD3EE;outline-offset:3px}
/* HUB-HOME-3BOX (founder Craig 16:57 UTC 2026-10-25: "the title ... in the top middle"): siqwes.com only, 1024px and up: the topic title is
   centred in the space between the left group (logo + Members log in) and the right links. Below 1024px it already sits centred on its own row. */
@media (min-width:1024px){.sh--v2[data-site="hub"] .sh__title{text-align:center}}