/* ==========================================================================
   Hartmann Software Group — 2026 homepage design system
   Scoped with the "hsg-" prefix so it never collides with /css/style.css.
   New filename on purpose: MainController sends Cache-Control max-age=1yr,
   so bump the ?v= query on the <link> when this file changes.
   ========================================================================== */

:root {
  --hsg-navy-900: #0a1630;
  --hsg-navy-800: #0f1f3d;
  --hsg-navy-700: #1c2d4f;
  --hsg-ink-600: #3f4b63;
  --hsg-ink-500: #5a6478;
  --hsg-ink-400: #7c8598;
  --hsg-line: #e3e7ef;
  --hsg-line-strong: #cfd6e3;
  --hsg-surface: #ffffff;
  --hsg-surface-soft: #f6f8fb;
  --hsg-blue-600: #1663e8;
  --hsg-blue-500: #1d72f2;
  --hsg-blue-050: #eef4ff;
  --hsg-violet-500: #5b4be0;
  /* Button orange: darkest step that keeps the mockup hue while giving white
     text 4.59:1 (WCAG AA). The brighter #f4511e is used only for decorative rules. */
  --hsg-orange-cta: #d63f0a;
  --hsg-orange-cta-hover: #b8360a;
  --hsg-orange-500: #f4511e;
  --hsg-focus: #1d72f2;

  --hsg-radius-sm: 8px;
  --hsg-radius: 12px;
  --hsg-radius-lg: 16px;
  --hsg-shadow-sm: 0 1px 2px rgba(15, 31, 61, .06);
  --hsg-shadow: 0 10px 30px -12px rgba(15, 31, 61, .18);
  --hsg-max: 1490px;
  --hsg-gutter: clamp(16px, 4vw, 40px);

  --hsg-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --hsg-serif: "Source Serif 4", Georgia, "Times New Roman", serif;
}

*, *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body.hsg {
  margin: 0;
  background: var(--hsg-surface);
  color: var(--hsg-navy-800);
  font-family: var(--hsg-font);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* Resets wrapped in :where() so they carry zero specificity and never
   override component margins/padding defined below. */
:where(.hsg) img { max-width: 100%; height: auto; display: block; }
:where(.hsg) a { color: inherit; }
:where(.hsg) :where(h1, h2, h3, p, figure, blockquote) { margin: 0; }
:where(.hsg) ul { margin: 0; padding: 0; list-style: none; }

.hsg :focus-visible {
  outline: 3px solid var(--hsg-focus);
  outline-offset: 3px;
  border-radius: 6px;
}

.hsg-container {
  width: 100%;
  max-width: calc(var(--hsg-max) + 2 * var(--hsg-gutter));
  margin: 0 auto;
  padding: 0 var(--hsg-gutter);
}

.hsg-skip {
  position: absolute; left: 16px; top: -60px; z-index: 100;
  background: var(--hsg-navy-800); color: #fff; padding: 10px 16px;
  border-radius: var(--hsg-radius-sm); text-decoration: none; font-weight: 600;
}
.hsg-skip:focus { top: 12px; }

.hsg-visually-hidden {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}

/* ---------- Buttons ---------- */
.hsg-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 0 28px;
  font: 600 17px/1 var(--hsg-font); letter-spacing: -.005em;
  border-radius: var(--hsg-radius-sm); border: 2px solid transparent;
  text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: background-color .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.hsg-btn svg { width: 18px; height: 18px; flex: none; }
.hsg-btn--primary { background: var(--hsg-orange-cta); color: #fff; box-shadow: 0 6px 16px -8px rgba(214, 63, 10, .7); }
.hsg-btn--primary:hover { background: var(--hsg-orange-cta-hover); }
.hsg-btn--outline { background: #fff; color: var(--hsg-blue-600); border-color: var(--hsg-blue-500); }
.hsg-btn--outline:hover { background: var(--hsg-blue-050); }
.hsg-btn--sm { min-height: 46px; padding: 0 22px; font-size: 16px; }

/* ---------- Header ---------- */
.hsg-header {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255, 255, 255, .97);
  border-bottom: 1px solid transparent;
  transition: border-color .2s ease, box-shadow .2s ease;
}
@supports (backdrop-filter: blur(8px)) {
  .hsg-header { background: rgba(255, 255, 255, .88); backdrop-filter: saturate(1.4) blur(10px); }
}
.hsg-header.is-scrolled { border-bottom-color: var(--hsg-line); box-shadow: var(--hsg-shadow-sm); }

.hsg-header__bar { display: flex; align-items: center; gap: 24px; min-height: 82px; }

.hsg-brand { display: inline-flex; flex-direction: column; text-decoration: none; color: var(--hsg-navy-900); line-height: 1; flex: none; }
.hsg-brand__name { font-weight: 700; font-size: 30px; letter-spacing: .11em; }
.hsg-brand__sub { margin-top: 9px; font-weight: 500; font-size: 12.5px; letter-spacing: .62em; padding-left: 2px; }

.hsg-nav { margin-left: auto; margin-right: auto; }
.hsg-nav__list { display: flex; align-items: center; gap: 4px; }
.hsg-nav__item { position: relative; }
.hsg-nav__link {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 16px; border: 0; background: none; cursor: pointer;
  font: 500 16.5px/1.2 var(--hsg-font); color: var(--hsg-navy-800); text-decoration: none;
  border-radius: var(--hsg-radius-sm);
}
.hsg-nav__link:hover, .hsg-nav__link[aria-expanded="true"] { color: var(--hsg-blue-600); background: var(--hsg-surface-soft); }
.hsg-nav__chev { width: 14px; height: 14px; color: var(--hsg-ink-400); transition: transform .15s ease; }
.hsg-nav__link[aria-expanded="true"] .hsg-nav__chev { transform: rotate(180deg); color: var(--hsg-blue-600); }

.hsg-menu {
  position: absolute; top: calc(100% + 10px); left: 0; min-width: 260px;
  background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
  box-shadow: var(--hsg-shadow); padding: 10px;
  display: none;
}
.hsg-menu.is-open { display: block; }
.hsg-menu a {
  display: block; padding: 10px 12px; border-radius: var(--hsg-radius-sm);
  text-decoration: none; color: var(--hsg-navy-800); font-size: 15px; line-height: 1.35;
}
.hsg-menu a:hover { background: var(--hsg-surface-soft); color: var(--hsg-blue-600); }
.hsg-menu a small { display: block; color: var(--hsg-ink-500); font-size: 13px; margin-top: 2px; }
.hsg-menu--wide { width: min(760px, 86vw); left: 50%; transform: translateX(-38%); }
.hsg-menu--wide .hsg-menu__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 6px; max-height: min(60vh, 460px); overflow-y: auto; }
.hsg-menu--wide .hsg-menu__grid a { padding: 8px 12px; font-size: 14.5px; }
.hsg-menu__foot { border-top: 1px solid var(--hsg-line); margin-top: 8px; padding-top: 8px; }
.hsg-menu__foot a { font-weight: 600; color: var(--hsg-blue-600); }

.hsg-header__actions { display: flex; align-items: center; gap: 14px; flex: none; }
.hsg-iconbtn {
  display: inline-grid; place-items: center; width: 44px; height: 44px;
  border: 0; background: none; border-radius: 50%; color: var(--hsg-navy-800); cursor: pointer;
}
.hsg-iconbtn:hover { background: var(--hsg-surface-soft); color: var(--hsg-blue-600); }
.hsg-iconbtn svg { width: 22px; height: 22px; }

.hsg-search { border-top: 1px solid var(--hsg-line); background: #fff; }
.hsg-search[hidden] { display: none; }
.hsg-search__form { display: flex; gap: 12px; padding: 16px 0; }
.hsg-search__input {
  flex: 1; min-width: 0; height: 50px; padding: 0 16px;
  font: 400 16px var(--hsg-font); color: var(--hsg-navy-800);
  border: 1px solid var(--hsg-line-strong); border-radius: var(--hsg-radius-sm); background: #fff;
}
.hsg-search__input:focus { outline: none; border-color: var(--hsg-blue-500); box-shadow: 0 0 0 3px rgba(29, 114, 242, .18); }

.hsg-burger { display: none; }

/* ---------- Hero ---------- */
.hsg-hero { position: relative; background: var(--hsg-surface-soft); overflow: hidden; }
.hsg-hero__media { position: absolute; inset: 0 0 0 45%; }
.hsg-hero__media picture, .hsg-hero__media img { width: 100%; height: 100%; }
.hsg-hero__media img { object-fit: cover; object-position: 72% center; }
.hsg-hero__media::before {
  content: ""; position: absolute; inset: 0 auto 0 0; width: 34%; z-index: 1;
  background: linear-gradient(90deg, var(--hsg-surface-soft) 0%, rgba(246, 248, 251, .85) 35%, rgba(246, 248, 251, 0) 100%);
}
.hsg-hero__inner { position: relative; z-index: 2; padding-top: clamp(48px, 6vw, 72px); padding-bottom: clamp(44px, 5vw, 64px); }
.hsg-hero__copy { max-width: 780px; }
.hsg-eyebrow { color: var(--hsg-blue-600); font-weight: 600; font-size: 15.5px; letter-spacing: .04em; text-transform: uppercase; }
.hsg-hero h1 {
  margin-top: 20px; font-weight: 700; color: var(--hsg-navy-900);
  font-size: clamp(38px, 3.9vw, 62px); line-height: 1.08; letter-spacing: -.035em;
}
.hsg-hero h1 .hsg-accent { color: var(--hsg-blue-500); }
.hsg-hero__lede { margin-top: 22px; max-width: 640px; color: var(--hsg-ink-600); font-size: clamp(17px, 1.45vw, 21px); line-height: 1.5; }
.hsg-hero__ctas { display: flex; flex-wrap: wrap; gap: 16px 28px; margin-top: 34px; }
.hsg-hero__ctas .hsg-btn { min-height: 56px; padding: 0 36px; }
.hsg-benefits { display: flex; flex-wrap: wrap; align-items: center; margin-top: 40px; color: var(--hsg-navy-700); font-size: 15.5px; }
.hsg-benefits li { display: inline-flex; align-items: center; gap: 12px; padding: 2px 26px; border-left: 1px solid var(--hsg-line-strong); }
.hsg-benefits li:first-child { padding-left: 0; border-left: 0; }
.hsg-benefits svg { width: 28px; height: 28px; color: var(--hsg-navy-800); flex: none; }

/* ---------- Credibility strip ---------- */
.hsg-cred { padding: 22px 0 6px; }
.hsg-cred__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--hsg-line); border-bottom: 1px solid var(--hsg-line); }
.hsg-cred__list li { display: flex; flex-direction: column; gap: 6px; padding: 22px 28px; }
.hsg-cred__list li + li { border-left: 1px solid var(--hsg-line); }
.hsg-cred strong { font-size: clamp(22px, 2vw, 28px); line-height: 1.15; font-weight: 650; letter-spacing: -.02em; color: var(--hsg-navy-900); }
.hsg-cred span { font-size: 15.5px; color: var(--hsg-ink-500); }

/* ---------- Category cards ---------- */
.hsg-cats { padding: 14px 0 18px; }
.hsg-cats__grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.hsg-card {
  position: relative; display: flex; flex-direction: column; height: 100%;
  padding: 26px 26px 24px; background: #fff;
  border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
  text-decoration: none; color: inherit;
  transition: border-color .15s ease, box-shadow .2s ease, transform .2s ease;
}
.hsg-card:hover { border-color: #bcd0f5; box-shadow: var(--hsg-shadow); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .hsg-card:hover { transform: none; } }
.hsg-card__icon { width: 48px; height: 48px; color: var(--hsg-blue-500); }
.hsg-card__icon svg { width: 100%; height: 100%; }
.hsg-card h3 { margin-top: 20px; font-size: 20px; line-height: 1.25; font-weight: 650; letter-spacing: -.015em; color: var(--hsg-navy-900); }
.hsg-card p { margin-top: 12px; color: var(--hsg-ink-600); font-size: 15.5px; line-height: 1.5; padding-right: 22px; }
.hsg-card__arrow { position: absolute; right: 22px; bottom: 24px; width: 20px; height: 20px; color: var(--hsg-navy-800); transition: transform .15s ease, color .15s ease; }
.hsg-card:hover .hsg-card__arrow { transform: translateX(3px); color: var(--hsg-blue-600); }

/* ---------- Testimonial ---------- */
.hsg-proof { padding: clamp(36px, 4.5vw, 56px) 0 clamp(56px, 7vw, 88px); }
.hsg-proof__head { margin-bottom: 22px; }
.hsg-proof__head h2 { margin-top: 10px; font-size: clamp(26px, 2.6vw, 36px); line-height: 1.15; letter-spacing: -.025em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-quote {
  position: relative; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.3fr);
  min-height: 178px; background: #fff;
  border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
}
.hsg-quote__body { position: relative; z-index: 2; display: flex; gap: 26px; padding: 30px 32px 28px 24px; margin: 0; }
.hsg-quote__mark { flex: none; width: 64px; height: 52px; margin-top: 4px; color: #c9ced8; }
.hsg-quote__text { font: italic 500 clamp(22px, 2vw, 29px)/1.25 var(--hsg-serif); color: var(--hsg-navy-900); letter-spacing: -.005em; }
.hsg-quote__rule { width: 38px; height: 3px; margin: 16px 0 14px; background: var(--hsg-orange-500); border-radius: 2px; }
.hsg-quote cite { font-style: normal; display: block; }
.hsg-quote__name { display: block; font-size: 14px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hsg-ink-600); }
.hsg-quote__org { display: block; margin-top: 2px; font-size: 14.5px; color: var(--hsg-ink-500); }
.hsg-quote__media { position: relative; }
.hsg-quote__media picture, .hsg-quote__media img { width: 100%; height: 100%; }
.hsg-quote__media img { object-fit: cover; object-position: center 60%; }
.hsg-quote__media::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .55) 22%, rgba(255, 255, 255, 0) 55%);
}
.hsg-quote__tag {
  position: absolute; z-index: 2; right: 28px; top: 22px; margin: 0; text-align: right;
  font: italic 600 clamp(20px, 1.7vw, 26px)/1.2 var(--hsg-serif); color: var(--hsg-navy-900);
  text-shadow: 0 1px 10px rgba(255, 255, 255, .9);
}
.hsg-quote__tag span { display: block; padding-right: 4px; }
.hsg-quote__tag::after { content: ""; display: block; width: 92px; height: 3px; margin: 8px 0 0 auto; background: var(--hsg-orange-500); border-radius: 2px; }

.hsg-clients { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.hsg-clients figure { margin: 0; padding: 20px 22px; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); background: var(--hsg-surface-soft); }
.hsg-clients blockquote { margin: 0; color: var(--hsg-ink-600); font-size: 15.5px; line-height: 1.55; }
.hsg-clients figcaption { margin-top: 10px; font-size: 13.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--hsg-navy-700); }

/* ---------- Supporting sections ---------- */
.hsg-section { padding: clamp(56px, 7vw, 96px) 0; }
.hsg-section--soft { background: var(--hsg-surface-soft); border-top: 1px solid var(--hsg-line); border-bottom: 1px solid var(--hsg-line); }
.hsg-section__head { max-width: 760px; }
.hsg-section h2 { margin-top: 12px; font-size: clamp(28px, 3vw, 42px); line-height: 1.12; letter-spacing: -.028em; color: var(--hsg-navy-900); font-weight: 700; }
.hsg-section__lede { margin-top: 16px; font-size: 18px; color: var(--hsg-ink-600); }

.hsg-delivery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin-top: 40px; }
.hsg-delivery__item { padding: 28px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); }
.hsg-delivery__item svg { width: 34px; height: 34px; color: var(--hsg-blue-500); }
.hsg-delivery__item h3 { margin-top: 16px; font-size: 19px; font-weight: 650; letter-spacing: -.01em; color: var(--hsg-navy-900); }
.hsg-delivery__item p { margin-top: 8px; color: var(--hsg-ink-600); font-size: 15.5px; }

.hsg-explore { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(32px, 5vw, 72px); align-items: start; }
.hsg-explore__search { margin-top: 28px; display: flex; gap: 12px; }
.hsg-explore__search .hsg-search__input { height: 54px; }
.hsg-explore__links { display: flex; flex-wrap: wrap; gap: 10px 24px; margin-top: 22px; }
.hsg-textlink { display: inline-flex; align-items: center; gap: 6px; color: var(--hsg-blue-600); font-weight: 600; text-decoration: none; }
.hsg-textlink:hover { text-decoration: underline; text-underline-offset: 4px; }
.hsg-textlink svg { width: 16px; height: 16px; }
.hsg-topics { display: flex; flex-wrap: wrap; gap: 10px; }
.hsg-topics a {
  display: inline-block; padding: 9px 16px; border: 1px solid var(--hsg-line-strong); border-radius: 999px;
  background: #fff; color: var(--hsg-navy-800); text-decoration: none; font-size: 15px; font-weight: 500;
}
.hsg-topics a:hover { border-color: var(--hsg-blue-500); color: var(--hsg-blue-600); background: var(--hsg-blue-050); }

.hsg-cta {
  display: grid; grid-template-columns: minmax(0, 1.4fr) auto; gap: 32px; align-items: center;
  padding: clamp(32px, 4.5vw, 56px); border-radius: var(--hsg-radius-lg);
  background: var(--hsg-navy-900); color: #fff;
}
.hsg-cta .hsg-eyebrow { color: #8db8ff; }
.hsg-cta h2 { color: #fff; }
.hsg-cta p { margin-top: 14px; color: #c6d0e4; font-size: 18px; max-width: 640px; }
.hsg-cta__actions { display: flex; flex-direction: column; gap: 14px; align-items: stretch; }
.hsg-cta__contact { color: #c6d0e4; font-size: 15px; text-align: center; }
.hsg-cta__contact a { color: #fff; font-weight: 600; text-decoration: none; }
.hsg-cta__contact a:hover { text-decoration: underline; }

/* ---------- Footer ---------- */
.hsg-footer { border-top: 1px solid var(--hsg-line); padding: 56px 0 28px; color: var(--hsg-ink-600); font-size: 15px; }
.hsg-footer__grid { display: grid; grid-template-columns: 1.4fr repeat(4, minmax(0, 1fr)); gap: 32px; }
.hsg-footer h2 { font-size: 13px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--hsg-navy-900); margin-bottom: 14px; }
.hsg-footer li + li { margin-top: 8px; }
.hsg-footer a { text-decoration: none; color: var(--hsg-ink-600); }
.hsg-footer a:hover { color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; }
.hsg-footer address { font-style: normal; line-height: 1.7; overflow-wrap: anywhere; }
.hsg-footer__brand p { margin-top: 16px; max-width: 300px; }
.hsg-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; margin-top: 44px; padding-top: 22px; border-top: 1px solid var(--hsg-line); font-size: 14px; color: var(--hsg-ink-500); }
.hsg-footer .hsg-brand__name { font-size: 24px; }
.hsg-footer .hsg-brand__sub { font-size: 10px; margin-top: 7px; letter-spacing: .6em; }

/* ---------- Responsive ---------- */
@media (max-width: 1240px) {
  .hsg-nav__link { padding: 10px 11px; font-size: 16px; }
  .hsg-brand__name { font-size: 26px; }
  .hsg-brand__sub { font-size: 11px; letter-spacing: .55em; }
  .hsg-cats__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hsg-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hsg-footer__brand { grid-column: 1 / -1; }
}

/* Header button reads "Request a Proposal" where the full label would crowd the nav. */
@media (max-width: 1340px) { .hsg-hide-narrow { display: none; } }

@media (max-width: 1080px) {
  /* Mobile/tablet navigation */
  /* backdrop-filter would make the header the containing block for the
     fixed-position menu panel, collapsing it to the header height. */
  .hsg-header { background: #fff; -webkit-backdrop-filter: none; backdrop-filter: none; }
  .hsg-burger { display: inline-grid; }
  .hsg-header__actions .hsg-btn { display: none; }
  .hsg-nav {
    position: fixed; inset: 82px 0 0 0; margin: 0; z-index: 49;
    background: #fff; overflow-y: auto; padding: 12px var(--hsg-gutter) 32px;
    border-top: 1px solid var(--hsg-line);
    display: none;
  }
  .hsg-nav.is-open { display: block; }
  .hsg-nav__list { flex-direction: column; align-items: stretch; gap: 0; }
  .hsg-nav__item { border-bottom: 1px solid var(--hsg-line); }
  .hsg-nav__link { width: 100%; justify-content: space-between; padding: 18px 4px; font-size: 18px; border-radius: 0; }
  .hsg-nav__link:hover, .hsg-nav__link[aria-expanded="true"] { background: none; }
  .hsg-menu, .hsg-menu--wide { position: static; transform: none; width: auto; min-width: 0; border: 0; box-shadow: none; padding: 0 0 14px; }
  .hsg-menu--wide .hsg-menu__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); max-height: none; }
  .hsg-nav__cta { display: block; padding-top: 22px; border-bottom: 0; }
  .hsg-nav__cta .hsg-btn { width: 100%; }
  body.hsg-nav-open { overflow: hidden; }

  .hsg-hero__media { position: relative; inset: auto; height: clamp(240px, 52vw, 440px); }
  .hsg-hero__media::before { display: none; }
  .hsg-hero__inner { padding-top: 40px; width: 100%; }
  .hsg-hero { display: flex; flex-direction: column-reverse; }

  .hsg-explore { grid-template-columns: 1fr; }
  .hsg-cta { grid-template-columns: 1fr; }
  .hsg-cta__actions { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .hsg-cta__contact { text-align: left; }
}
@media (min-width: 1081px) { .hsg-nav__cta { display: none; } }

@media (max-width: 860px) {
  .hsg-cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hsg-delivery { grid-template-columns: 1fr; }
  .hsg-clients { grid-template-columns: 1fr; }
  .hsg-quote { grid-template-columns: 1fr; }
  .hsg-quote__media { height: 150px; order: -1; }
  .hsg-quote__media::before { background: linear-gradient(180deg, rgba(255, 255, 255, 0) 40%, #fff 100%); }
}

@media (max-width: 600px) {
  .hsg-header__bar { min-height: 70px; gap: 8px; }
  .hsg-nav { inset: 70px 0 0 0; }
  .hsg-brand__name { font-size: 21px; letter-spacing: .1em; }
  .hsg-brand__sub { font-size: 8.5px; letter-spacing: .52em; margin-top: 6px; }
  .hsg-header__actions { gap: 2px; }
  .hsg-cats__grid { grid-template-columns: 1fr; gap: 12px; }
  .hsg-cred__list { grid-template-columns: 1fr; }
  .hsg-cred__list li { padding: 16px 4px; }
  .hsg-cred__list li + li { border-left: 0; border-top: 1px solid var(--hsg-line); }
  .hsg-card { padding: 22px; }
  .hsg-card h3 { margin-top: 14px; }
  .hsg-hero__ctas { gap: 12px; }
  .hsg-hero__ctas .hsg-btn { width: 100%; }
  .hsg-benefits { flex-direction: column; align-items: flex-start; gap: 14px; }
  .hsg-benefits li { padding: 0; border-left: 0; }
  .hsg-quote__body { flex-direction: column; gap: 10px; padding: 24px 22px; }
  .hsg-quote__mark { width: 44px; height: 36px; }
  .hsg-quote__tag { right: 18px; top: 16px; }
  .hsg-explore__search { flex-direction: column; }
  .hsg-menu--wide .hsg-menu__grid { grid-template-columns: 1fr; }
  .hsg-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media print {
  .hsg-header, .hsg-search, .hsg-hero__media, .hsg-quote__media { display: none !important; }
  .hsg-hero { background: none; }
}

/* ==========================================================================
   Training templates (Training.jsp, Search.jsp, HSG.jsp) — added Oct 28 2026.
   New classes only; nothing above this line was changed for these pages.
   ========================================================================== */

/* ---------- Header: current section ---------- */
.hsg-nav__link.is-current { color: var(--hsg-blue-600); box-shadow: inset 0 -2px 0 var(--hsg-blue-500); border-radius: 0; }

/* ---------- Page hero ---------- */
.hsg-page-hero { background: var(--hsg-surface-soft); border-bottom: 1px solid var(--hsg-line); }
.hsg-page-hero__inner { padding-top: 22px; padding-bottom: clamp(36px, 4.5vw, 56px); }
.hsg-page-hero__grid { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.hsg-page-hero__grid--single { grid-template-columns: minmax(0, 1fr); }
.hsg-page-hero__copy { max-width: 760px; padding-top: clamp(14px, 2vw, 26px); }
.hsg-page-hero h1 { margin-top: 14px; font-size: clamp(32px, 3.5vw, 50px); line-height: 1.08; letter-spacing: -.032em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-page-hero h1 .hsg-accent { color: var(--hsg-blue-500); }
.hsg-page-hero__lede { margin-top: 18px; max-width: 680px; font-size: clamp(17px, 1.35vw, 19.5px); line-height: 1.55; color: var(--hsg-ink-600); }
.hsg-page-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-top: 28px; }
.hsg-page-hero__note { margin-top: 14px; font-size: 15px; color: var(--hsg-ink-500); }

/* ---------- Breadcrumbs ---------- */
.hsg-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; margin: 0; padding: 0; list-style: none; font-size: 14px; color: var(--hsg-ink-500); }
.hsg-crumbs li { display: inline-flex; align-items: center; min-width: 0; }
.hsg-crumbs li + li::before { content: "/"; margin: 0 10px; color: var(--hsg-line-strong); }
.hsg-crumbs a { color: var(--hsg-ink-600); text-decoration: none; }
.hsg-crumbs a:hover { color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; }
.hsg-crumbs [aria-current] { color: var(--hsg-navy-800); font-weight: 500; overflow-wrap: anywhere; }

/* ---------- Side summary / panels ---------- */
.hsg-panel { background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius-lg); padding: clamp(20px, 2vw, 28px); }
.hsg-panel--soft { background: var(--hsg-surface-soft); }
.hsg-panel h2, .hsg-panel h3 { font-size: 20px; line-height: 1.25; letter-spacing: -.015em; font-weight: 650; color: var(--hsg-navy-900); }
.hsg-panel p { margin-top: 8px; color: var(--hsg-ink-600); font-size: 15.5px; }
.hsg-panel .hsg-btn { width: 100%; margin-top: 20px; white-space: normal; text-align: center; padding: 12px 20px; }
.hsg-panel__contact { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--hsg-line); font-size: 15px; color: var(--hsg-ink-600); line-height: 1.6; }
.hsg-panel__contact a { color: var(--hsg-blue-600); font-weight: 600; text-decoration: none; }
.hsg-panel__contact a:hover { text-decoration: underline; }

.hsg-points { display: grid; gap: 18px; }
.hsg-points li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; align-items: start; }
.hsg-points svg { width: 30px; height: 30px; color: var(--hsg-blue-500); }
.hsg-points strong { display: block; font-size: 16px; font-weight: 600; color: var(--hsg-navy-900); }
.hsg-points span { display: block; margin-top: 2px; font-size: 14.5px; color: var(--hsg-ink-500); line-height: 1.45; }

.hsg-checks { display: grid; gap: 10px; margin-top: 16px; }
.hsg-checks li { position: relative; padding-left: 30px; color: var(--hsg-navy-700); font-size: 15.5px; line-height: 1.45; }
.hsg-checks li::before {
  content: ""; position: absolute; left: 0; top: 1px; width: 20px; height: 20px; border-radius: 50%;
  background: var(--hsg-blue-500) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='white' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5.5 10.5l3 3 6-7'/%3E%3C/svg%3E") center / 14px no-repeat;
}

.hsg-facts { display: grid; gap: 18px; }
.hsg-facts > div { display: grid; grid-template-columns: 34px minmax(0, 1fr); column-gap: 14px; align-items: start; }
.hsg-facts svg { grid-row: 1 / span 2; width: 30px; height: 30px; color: var(--hsg-blue-500); }
.hsg-facts dt, .hsg-facts dd { grid-column: 2; }
.hsg-facts dt { font-size: 15.5px; font-weight: 600; color: var(--hsg-navy-900); }
.hsg-facts dd { margin: 2px 0 0; font-size: 15px; color: var(--hsg-ink-600); line-height: 1.45; }
.hsg-facts dd small { display: block; margin-top: 2px; font-size: 13.5px; color: var(--hsg-ink-500); }
.hsg-facts a { color: var(--hsg-blue-600); text-decoration: none; font-weight: 500; }
.hsg-facts a:hover { text-decoration: underline; }

/* ---------- Generic section heading ---------- */
.hsg-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px 32px; margin-bottom: 26px; }
.hsg-head h2 { margin-top: 10px; font-size: clamp(26px, 2.6vw, 36px); line-height: 1.15; letter-spacing: -.026em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-head p:not(.hsg-eyebrow) { margin-top: 10px; max-width: 640px; color: var(--hsg-ink-600); font-size: 17px; }
.hsg-section--cta { padding-top: clamp(24px, 3vw, 40px); }
.hsg-head__aside { color: var(--hsg-ink-500); font-size: 15px; }

/* ---------- Overview feature cards (4-up) ---------- */
.hsg-feature-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.hsg-feature-grid .hsg-card p { padding-right: 0; }
.hsg-card__cta { margin-top: auto; padding-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-size: 15px; font-weight: 600; color: var(--hsg-blue-600); }
.hsg-card__cta svg { width: 16px; height: 16px; transition: transform .15s ease; }
.hsg-card:hover .hsg-card__cta svg { transform: translateX(3px); }

/* ---------- Course rows ---------- */
.hsg-filter { display: flex; gap: 12px; margin-bottom: 16px; }
.hsg-filter .hsg-search__input { height: 54px; }
.hsg-chips { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 30px; }
.hsg-chips a {
  display: inline-block; padding: 8px 16px; border: 1px solid var(--hsg-line-strong); border-radius: 999px;
  background: #fff; color: var(--hsg-navy-800); text-decoration: none; font-size: 14.5px; font-weight: 500;
}
.hsg-chips a:hover { border-color: var(--hsg-blue-500); color: var(--hsg-blue-600); background: var(--hsg-blue-050); }

.hsg-courses { display: grid; gap: 12px; }
.hsg-courses__group { margin: 34px 0 14px; font-size: 19px; font-weight: 650; letter-spacing: -.01em; color: var(--hsg-navy-900); scroll-margin-top: 100px; }
.hsg-courses__group:first-child { margin-top: 0; }
.hsg-course {
  position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 8px 32px; align-items: center;
  padding: 22px 26px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
  transition: border-color .15s ease, box-shadow .2s ease;
}
.hsg-course:hover { border-color: #bcd0f5; box-shadow: var(--hsg-shadow); }
.hsg-course:focus-within { border-color: var(--hsg-blue-500); }
.hsg-course h3 { font-size: 18.5px; line-height: 1.3; font-weight: 650; letter-spacing: -.012em; color: var(--hsg-navy-900); }
.hsg-course h3 a { text-decoration: none; color: inherit; }
.hsg-course h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.hsg-course h3 a:focus-visible { outline: none; }
.hsg-course h3 a:focus-visible::after { outline: 3px solid var(--hsg-focus); outline-offset: 2px; }
.hsg-course p { margin-top: 6px; color: var(--hsg-ink-600); font-size: 15.5px; line-height: 1.5; text-align: left;
  display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hsg-course__meta { display: grid; gap: 2px; min-width: 136px; text-align: right; font-size: 15px; color: var(--hsg-navy-800); white-space: nowrap; }
.hsg-course__meta span:last-child { color: var(--hsg-ink-500); font-size: 14px; }
.hsg-course__meta .hsg-course__contact { color: var(--hsg-ink-500); font-size: 14px; white-space: normal; }
.hsg-course__go { display: inline-flex; align-items: center; gap: 6px; color: var(--hsg-blue-600); font-weight: 600; font-size: 15px; white-space: nowrap; }
.hsg-course__go svg { width: 16px; height: 16px; transition: transform .15s ease; }
.hsg-course:hover .hsg-course__go svg { transform: translateX(3px); }
.hsg-course[hidden] { display: none; }
.hsg-courses__empty { padding: 22px 26px; border: 1px dashed var(--hsg-line-strong); border-radius: var(--hsg-radius); color: var(--hsg-ink-600); }
.hsg-courses__empty a { color: var(--hsg-blue-600); font-weight: 600; }
.hsg-count { color: var(--hsg-ink-500); font-size: 15px; }

/* ---------- Two-column content layout ---------- */
.hsg-layout { display: grid; grid-template-columns: minmax(0, 1fr) 360px; grid-template-areas: "main aside"; gap: clamp(32px, 4vw, 56px); align-items: start; }
.hsg-layout__main { grid-area: main; min-width: 0; }
.hsg-layout__aside { grid-area: aside; display: grid; grid-template-columns: minmax(0, 1fr); gap: 20px; min-width: 0; }
.hsg-block + .hsg-block { margin-top: clamp(40px, 4.5vw, 56px); }
.hsg-block > h2, .hsg-outline__head h2 { font-size: clamp(24px, 2.2vw, 30px); line-height: 1.2; letter-spacing: -.022em; font-weight: 700; color: var(--hsg-navy-900); margin-bottom: 16px; scroll-margin-top: 100px; }
.hsg-block { scroll-margin-top: 100px; }

/* In-page section links (course page) */
.hsg-subnav { border-bottom: 1px solid var(--hsg-line); background: #fff; }
.hsg-subnav ul { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.hsg-subnav ul::-webkit-scrollbar { display: none; }
.hsg-subnav a { display: inline-block; padding: 16px 14px; white-space: nowrap; color: var(--hsg-navy-700); font-size: 15.5px; font-weight: 500; text-decoration: none; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.hsg-subnav a:hover { color: var(--hsg-blue-600); border-bottom-color: var(--hsg-blue-500); }

/* ---------- Rich text from the catalog (descriptions, prerequisites) ---------- */
.hsg-prose { max-width: 74ch; color: var(--hsg-navy-700); font-size: 16.5px; line-height: 1.7; overflow-wrap: break-word; }
.hsg-prose, .hsg-prose * { text-align: left !important; word-spacing: normal !important; font-family: inherit !important; }
.hsg-prose :where(p, ul, ol, table, div) + :where(p, ul, ol, table, div) { margin-top: 1em; }
.hsg-prose :where(p, div, td, li, span, font) { font-size: inherit !important; color: inherit; line-height: inherit; }
.hsg-prose ul, .hsg-prose ol { padding-left: 1.3em; }
.hsg-prose ul { list-style: disc; }
.hsg-prose ol { list-style: decimal; }
.hsg-prose li + li { margin-top: .35em; }
.hsg-prose a { color: var(--hsg-blue-600); }
.hsg-prose img { max-width: 100%; height: auto; }
.hsg-prose table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.hsg-prose td, .hsg-prose th { padding: 0; vertical-align: top; }
.hsg-prose h1, .hsg-prose h2, .hsg-prose h3, .hsg-prose h4 { font-size: 18px !important; font-weight: 650; margin: 1.2em 0 .4em; color: var(--hsg-navy-900); }

.hsg-learn { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 28px; }
.hsg-learn li { margin: 0; }

/* ---------- Course outline accordion ---------- */
.hsg-outline__head { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.hsg-outline__head h2 { margin: 0; }
.hsg-linkbtn { border: 0; background: none; padding: 4px 0; cursor: pointer; font: 600 15px var(--hsg-font); color: var(--hsg-blue-600); }
.hsg-linkbtn:hover { text-decoration: underline; text-underline-offset: 3px; }
.hsg-linkbtn[hidden] { display: none; }
.hsg-acc { display: grid; gap: 10px; }
.hsg-acc__item { border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); background: #fff; }
.hsg-acc__item h3 { margin: 0; font-size: inherit; }
.hsg-acc__btn {
  display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 14px; align-items: center; width: 100%;
  padding: 15px 20px; border: 0; background: none; cursor: pointer; text-align: left;
  font: 600 16px/1.35 var(--hsg-font); color: var(--hsg-navy-900); border-radius: var(--hsg-radius);
}
.hsg-acc__btn:hover { color: var(--hsg-blue-600); }
.hsg-acc__icon { position: relative; width: 16px; height: 16px; color: var(--hsg-blue-500); }
.hsg-acc__icon::before, .hsg-acc__icon::after { content: ""; position: absolute; left: 0; top: 7px; width: 16px; height: 2px; border-radius: 1px; background: currentColor; transition: transform .2s ease; }
.hsg-acc__icon::after { transform: rotate(90deg); }
.hsg-acc__btn[aria-expanded="true"] .hsg-acc__icon::after { transform: rotate(0deg); }
.hsg-acc__panel { padding: 0 20px 18px 56px; }
.hsg-acc__panel[hidden] { display: none; }
.hsg-acc__panel ul { display: grid; gap: 7px; }
.hsg-acc__panel li { position: relative; padding-left: 16px; color: var(--hsg-ink-600); font-size: 15.5px; line-height: 1.45; }
.hsg-acc__panel li::before { content: ""; position: absolute; left: 0; top: .62em; width: 5px; height: 5px; border-radius: 50%; background: var(--hsg-line-strong); }
.hsg-outline__intro { margin-bottom: 14px; color: var(--hsg-ink-600); }
.hsg-outline__note { margin-top: 12px; color: var(--hsg-ink-500); font-size: 14.5px; }
.hsg-more { margin-top: 28px; }
/* Raw syllabus (no JavaScript, or a format the script does not recognise) */
.hsg-outline--raw { padding: 22px 24px; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); background: #fff; max-width: none; }

/* ---------- Upcoming public classes ---------- */
.hsg-sessions { display: grid; gap: 12px; margin-top: 14px; }
.hsg-sessions li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding-top: 12px; border-top: 1px solid var(--hsg-line); }
.hsg-sessions li:first-child { padding-top: 0; border-top: 0; }
.hsg-sessions strong { display: block; font-size: 15px; font-weight: 600; color: var(--hsg-navy-900); }
.hsg-sessions span { display: block; font-size: 14px; color: var(--hsg-ink-500); }
.hsg-sessions a { font-size: 14.5px; font-weight: 600; color: var(--hsg-blue-600); text-decoration: none; white-space: nowrap; }
.hsg-sessions a:hover { text-decoration: underline; }
.hsg-panel__more { display: inline-block; margin-top: 14px; font-size: 15px; font-weight: 600; color: var(--hsg-blue-600); text-decoration: none; }
.hsg-panel__more:hover { text-decoration: underline; }

/* ---------- Related courses ---------- */
.hsg-related { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.hsg-related .hsg-course { grid-template-columns: minmax(0, 1fr); align-content: start; height: 100%; }
.hsg-related .hsg-course__meta { text-align: left; }

/* ---------- Notems ---------- */
.hsg-notems { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.hsg-notem {
  position: relative; display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 18px; align-items: start;
  padding: 18px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
  transition: border-color .15s ease, box-shadow .2s ease;
}
.hsg-notem:hover { border-color: #bcd0f5; box-shadow: var(--hsg-shadow); }
.hsg-notem--noimg { grid-template-columns: minmax(0, 1fr); }
.hsg-notem img { width: 112px; height: 96px; object-fit: cover; border-radius: var(--hsg-radius-sm); background: var(--hsg-surface-soft); }
.hsg-notem h3 { font-size: 17px; line-height: 1.3; font-weight: 650; color: var(--hsg-navy-900); }
.hsg-notem h3 a { color: inherit; text-decoration: none; }
.hsg-notem h3 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.hsg-notem p { margin-top: 6px; font-size: 14.5px; color: var(--hsg-ink-600); line-height: 1.45; }
.hsg-notem__go { display: inline-block; margin-top: 10px; font-size: 14.5px; font-weight: 600; color: var(--hsg-blue-600); }
.hsg-notems--single { grid-template-columns: minmax(0, 1fr); }
.hsg-notems--single .hsg-notem { grid-template-columns: 220px minmax(0, 1fr); padding: 22px; }
.hsg-notems--single .hsg-notem img { width: 220px; height: 150px; }
.hsg-notems--single .hsg-notem h3 { font-size: 21px; }

/* ---------- Training locations ---------- */
.hsg-locations { padding: 22px 26px; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); background: var(--hsg-surface-soft); }
.hsg-locations__row { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 14px; align-items: start; }
.hsg-locations__row > svg { width: 30px; height: 30px; color: var(--hsg-blue-500); }
.hsg-locations h2 { font-size: 18px; font-weight: 650; color: var(--hsg-navy-900); letter-spacing: -.01em; }
.hsg-locations p { margin-top: 4px; color: var(--hsg-ink-600); font-size: 15.5px; }
.hsg-locations details { margin-top: 10px; }
.hsg-locations summary { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; list-style: none; font-weight: 600; font-size: 15.5px; color: var(--hsg-blue-600); border-radius: 6px; }
.hsg-locations summary::-webkit-details-marker { display: none; }
.hsg-locations summary svg { width: 16px; height: 16px; transition: transform .15s ease; }
.hsg-locations details[open] summary svg { transform: rotate(90deg); }
.hsg-locations ul { margin-top: 14px; columns: 4 170px; column-gap: 24px; font-size: 14.5px; }
.hsg-locations li { break-inside: avoid; padding: 3px 0; }
.hsg-locations li a { color: var(--hsg-ink-600); text-decoration: none; }
.hsg-locations li a:hover { color: var(--hsg-blue-600); text-decoration: underline; }

/* ---------- Search results / empty states ---------- */
.hsg-empty { max-width: 680px; padding: 32px; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius-lg); background: #fff; }
.hsg-empty h2 { font-size: 24px; font-weight: 700; color: var(--hsg-navy-900); letter-spacing: -.02em; }
.hsg-empty p { margin-top: 10px; color: var(--hsg-ink-600); font-size: 16.5px; }
.hsg-empty .hsg-page-hero__actions { margin-top: 22px; }

/* ---------- Responsive (training templates) ---------- */
@media (max-width: 1240px) {
  .hsg-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hsg-notems { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 1080px) {
  .hsg-nav__link.is-current { box-shadow: none; }
  .hsg-page-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .hsg-page-hero__copy { max-width: none; }
  .hsg-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "aside" "main"; }
  .hsg-related { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .hsg-course { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 20px; }
  .hsg-course__meta { display: flex; flex-wrap: wrap; gap: 4px 14px; text-align: left; min-width: 0; white-space: normal; }
  .hsg-learn { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .hsg-feature-grid { grid-template-columns: minmax(0, 1fr); }
  .hsg-filter { flex-direction: column; }
  .hsg-page-hero__actions .hsg-btn { width: 100%; }
  .hsg-acc__btn { padding: 14px 16px; gap: 12px; }
  .hsg-acc__panel { padding: 0 16px 16px 50px; }
  .hsg-notem, .hsg-notems--single .hsg-notem { grid-template-columns: minmax(0, 1fr); }
  .hsg-notem img, .hsg-notems--single .hsg-notem img { width: 100%; height: 160px; }
  .hsg-locations { padding: 20px; }
  .hsg-empty { padding: 24px; }
}
@media print {
  .hsg-subnav, .hsg-layout__aside, .hsg-cta, .hsg-linkbtn { display: none !important; }
  .hsg-acc__panel[hidden] { display: block !important; }
}

/* ==========================================================================
   Homepage, photographic version (index.jsp) - added Oct 28 2026.
   Homepage-only classes (hsg-home-*). Images live in /img/home/.
   ========================================================================== */
:root { --hsg-warm-050: #fbf7f1; --hsg-warm-100: #f6eee3; --hsg-green-600: #1d8a5a; --hsg-green-050: #e7f5ee; --hsg-orange-050: #fdeee6; }

/* ---------- Hero ---------- */
.hsg-home-hero { position: relative; overflow: hidden; background: var(--hsg-warm-050); }
/* hero-instructor.jpg is 887x880. The photo box is right-aligned and never
   wider than 887px or taller than the hero, so the photo is shown at or below
   native resolution (cover scale <= 1.0 at 1x pixel density). */
.hsg-home-hero__media { position: absolute; top: 0; right: 0; bottom: 0; left: auto; width: min(52%, 887px); }
.hsg-home-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 12%; }
.hsg-home-hero__media::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, .78) 9%, rgba(251, 247, 241, .2) 22%, rgba(251, 247, 241, 0) 34%);
}
.hsg-home-hero::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 60% 70% at 0% 15%, rgba(244, 140, 70, .08), rgba(244, 140, 70, 0) 70%);
}
.hsg-home-hero__inner { position: relative; z-index: 2; padding-top: clamp(44px, 4.4vw, 64px); padding-bottom: clamp(48px, 4.6vw, 68px); }
.hsg-home-hero__copy { max-width: 720px; }
.hsg-home-hero h1 { margin-top: 16px; font-size: clamp(34px, 3.4vw, 54px); line-height: 1.07; letter-spacing: -.034em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-home-hero h1 .hsg-accent { color: var(--hsg-blue-500); }
.hsg-home-hero__lede { margin-top: 18px; max-width: 540px; font-size: clamp(17px, 1.35vw, 19px); line-height: 1.55; color: var(--hsg-navy-700); }
.hsg-home-hero__ctas { display: flex; flex-wrap: wrap; gap: 14px 20px; margin-top: 28px; }

/* ---------- Credibility strip ---------- */
.hsg-home-cred { background: var(--hsg-surface-soft); border-top: 1px solid var(--hsg-line); border-bottom: 1px solid var(--hsg-line); }
.hsg-home-cred ul, .hsg-home-delivery ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hsg-home-cred li { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 18px; align-items: center; padding: 26px 28px; }
.hsg-home-cred li:first-child { padding-left: 0; }
.hsg-home-cred li + li { border-left: 1px solid var(--hsg-line); }
.hsg-home-cred img { width: 40px; height: 40px; }
.hsg-home-cred strong { display: block; font-size: 17px; font-weight: 650; color: var(--hsg-navy-900); letter-spacing: -.01em; }
.hsg-home-cred span { display: block; margin-top: 3px; font-size: 15px; line-height: 1.45; color: var(--hsg-ink-500); }

/* ---------- Training topics (icon cards, no photos) ---------- */
/* 32px from the credibility strip to the eyebrow; 32px from the cards to the delivery strip. */
.hsg-home-topics { padding: 32px 0; }
.hsg-home-topics h2 { margin-top: 10px; font-size: clamp(28px, 3vw, 40px); line-height: 1.12; letter-spacing: -.028em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-home-topics__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; margin-top: 28px; }
.hsg-home-topic {
  position: relative; display: flex; flex-direction: column; height: 100%; padding: 26px 26px 24px;
  background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius);
  text-decoration: none; color: inherit; transition: border-color .15s ease, box-shadow .2s ease;
}
.hsg-home-topic:hover { border-color: #bcd0f5; box-shadow: var(--hsg-shadow); }
.hsg-home-topic__icon { display: block; width: 60px; height: 60px; object-fit: contain; }
.hsg-home-topic__chev { position: absolute; top: 28px; right: 24px; width: 18px; height: 18px; color: var(--hsg-navy-700); transition: transform .15s ease; }
.hsg-home-topic:hover .hsg-home-topic__chev { transform: translateX(3px); }
.hsg-home-topic h3 { margin-top: 18px; font-size: 19px; line-height: 1.25; font-weight: 650; letter-spacing: -.015em; color: var(--hsg-navy-900); }
.hsg-home-topic p { margin-top: 10px; font-size: 15.5px; line-height: 1.5; color: var(--hsg-ink-600); }
.hsg-home-topic__cta { margin-top: auto; padding-top: 18px; display: inline-flex; align-items: center; gap: 6px; font-size: 15.5px; font-weight: 600; color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1px; }
.hsg-home-topic__cta svg { width: 16px; height: 16px; }

/* ---------- Catalog search ---------- */
.hsg-home-search { padding: 28px 0 0; }
.hsg-home-search h2 { margin-top: 10px; font-size: clamp(28px, 3vw, 40px); line-height: 1.12; letter-spacing: -.028em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-home-search__lede { margin-top: 10px; font-size: 17px; color: var(--hsg-ink-600); }
.hsg-home-search__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 320px); gap: 24px 48px; align-items: start; margin-top: 24px; }
.hsg-home-search__browse { padding-top: 6px; }
.hsg-home-search__form { display: flex; gap: 14px; }
.hsg-home-search__field { position: relative; flex: 1; min-width: 0; }
.hsg-home-search__field svg { position: absolute; left: 16px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--hsg-ink-500); pointer-events: none; }
.hsg-home-search__field .hsg-search__input { width: 100%; height: 54px; padding-left: 46px; }
.hsg-home-search__form .hsg-btn { min-width: 132px; }
.hsg-home-search__browse p { margin-top: 4px; font-size: 15px; color: var(--hsg-ink-500); }
.hsg-home-search__chips { margin: 18px 0 0; gap: 10px 12px; }
.hsg-home-search__chips a { padding: 9px 18px; font-size: 15px; color: var(--hsg-navy-800); }
.hsg-home-search__chips a.hsg-chip--all { color: var(--hsg-blue-600); border-color: #bcd0f5; font-weight: 600; }

/* ---------- Delivery strip ---------- */
.hsg-home-delivery { background: var(--hsg-warm-050); border-top: 1px solid var(--hsg-warm-100); border-bottom: 1px solid var(--hsg-warm-100); }
.hsg-home-delivery li { display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 18px; align-items: start; padding: 28px 28px; }
.hsg-home-delivery li:first-child { padding-left: 0; }
.hsg-home-delivery li + li { border-left: 1px solid rgba(15, 31, 61, .09); }
.hsg-home-delivery__icon { display: grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; }
.hsg-home-delivery__icon svg { width: 28px; height: 28px; }
.hsg-home-delivery__icon--orange { background: var(--hsg-orange-050); color: var(--hsg-orange-cta); }
.hsg-home-delivery__icon--blue { background: var(--hsg-blue-050); color: var(--hsg-blue-600); }
.hsg-home-delivery__icon--green { background: var(--hsg-green-050); color: var(--hsg-green-600); }
.hsg-home-delivery h3 { font-size: 17px; font-weight: 650; color: var(--hsg-navy-900); letter-spacing: -.01em; }
.hsg-home-delivery p { margin-top: 4px; font-size: 15px; line-height: 1.5; color: var(--hsg-ink-600); }

/* ---------- Testimonials ---------- */
.hsg-home-quotes { position: relative; overflow: hidden; padding: clamp(48px, 6vw, 80px) 0 32px; }
/* Shown at or below the file's native 1164x432 (was 1.38x). For a fuller
   background, supply a high-resolution denver-mountains.jpg (see README). */
.hsg-home-quotes__media { position: absolute; top: 0; right: 0; left: auto; bottom: auto; width: min(68%, 1164px); height: min(100%, 432px); }
/* Full-strength photograph (no opacity or filters). */
.hsg-home-quotes__media img { width: 100%; height: 100%; object-fit: cover; object-position: 55% 55%; }
.hsg-home-quotes__media::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  /* Only a short fade into white on the left edge (behind the heading side) and
     along the bottom edge; the right half of the photo is untouched. */
  background: linear-gradient(90deg, #fff 0%, rgba(255, 255, 255, .7) 7%, rgba(255, 255, 255, 0) 24%),
              linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0) 64px);
}
.hsg-home-quotes__tag {
  position: absolute; z-index: 2; right: clamp(24px, 4vw, 64px); top: clamp(40px, 5vw, 72px); margin: 0; text-align: right;
  font: italic 600 clamp(24px, 2.1vw, 32px)/1.2 var(--hsg-serif); color: var(--hsg-navy-900);
  text-shadow: 0 1px 14px rgba(255, 255, 255, .95), 0 0 2px rgba(255, 255, 255, .9);
}
.hsg-home-quotes__tag span { display: block; }
.hsg-home-quotes__tag::after { content: ""; display: block; width: 96px; height: 3px; margin: 10px 0 0 auto; background: var(--hsg-orange-500); border-radius: 2px; }
.hsg-home-quotes__inner { position: relative; z-index: 2; }
.hsg-home-quotes h2 { margin-top: 10px; font-size: clamp(28px, 3vw, 40px); line-height: 1.12; letter-spacing: -.028em; font-weight: 700; color: var(--hsg-navy-900); }
/* One row of three equal cards on desktop; cards in a row share one height. */
.hsg-home-quotes__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 80%; margin-top: 28px; }
.hsg-home-quote { display: flex; flex-direction: column; margin: 0; padding: 26px 28px 24px; background: #fff; border: 1px solid var(--hsg-line); border-radius: 14px; box-shadow: 0 14px 34px -26px rgba(15, 31, 61, .35); }
.hsg-home-quote blockquote { margin-bottom: 16px; }
.hsg-home-quote blockquote { margin: 0 0 16px; font: italic 500 clamp(18px, 1.35vw, 20px)/1.45 var(--hsg-serif); color: var(--hsg-navy-900); }
.hsg-home-quote__rule { width: 34px; height: 3px; margin: auto 0 12px; background: var(--hsg-orange-500); border-radius: 2px; }
.hsg-home-quote figcaption { min-height: 46px; font-size: 13.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--hsg-navy-700); }
.hsg-home-quote figcaption span { display: block; margin-top: 2px; font-weight: 400; letter-spacing: 0; text-transform: none; font-size: 14.5px; color: var(--hsg-ink-500); }

/* ---------- Homepage-only spacing around the shared CTA and footer ---------- */
/* Scoped to the homepage (main.hsg-home) so the training pages are unaffected. */
.hsg-section--cta.hsg-home-cta { padding-top: 36px; padding-bottom: 24px; }
.hsg-home ~ .hsg-footer { padding-top: 26px; }

/* ---------- Responsive (homepage) ---------- */
@media (max-width: 1240px) {
  .hsg-home-topics__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hsg-home-hero__media { width: min(46%, 887px); }
}
@media (max-width: 1080px) {
  .hsg-home-quotes__inner { max-width: none; }
  .hsg-home-quotes__media { position: relative; inset: auto; width: 100%; height: 220px; margin-bottom: 32px; }
  .hsg-home-quotes { display: flex; flex-direction: column; padding-top: 0; }
  .hsg-home-quotes__media::before { background: linear-gradient(0deg, #fff 0%, rgba(255, 255, 255, 0) 45%); }
  .hsg-home-quotes__tag { top: 28px; }
  .hsg-home-quotes__grid { margin-top: 26px; max-width: none; }
}
@media (max-width: 860px) {
  .hsg-home-hero { display: flex; flex-direction: column-reverse; }
  .hsg-home-hero__media { position: relative; inset: auto; width: 100%; height: clamp(260px, 62vw, 460px); }
  .hsg-home-hero__media::before { background: linear-gradient(0deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, 0) 22%); }
  .hsg-home-hero__media { overflow: hidden; }
  /* Trim 24px from the left edge: the source file has a small stray mark there. */
  .hsg-home-hero__media img { width: calc(100% + 24px); max-width: none; margin-left: -24px; object-position: 50% 28%; }
  .hsg-home-hero__inner { padding-top: 40px; padding-bottom: 40px; }
  .hsg-home-cred ul { grid-template-columns: minmax(0, 1fr); }
  .hsg-home-cred li, .hsg-home-cred li:first-child { padding: 16px 0; }
  .hsg-home-cred li + li { border-left: 0; border-top: 1px solid var(--hsg-line); }
  .hsg-home-search__row { grid-template-columns: minmax(0, 1fr); }
  .hsg-home-delivery ul { grid-template-columns: minmax(0, 1fr); }
  .hsg-home-delivery li, .hsg-home-delivery li:first-child { padding: 20px 0; }
  .hsg-home-delivery li + li { border-left: 0; border-top: 1px solid rgba(15, 31, 61, .09); }
  .hsg-home-quotes__grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 600px) {
  .hsg-home-topics__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .hsg-home-search__form { flex-direction: column; }
  .hsg-home-hero__ctas .hsg-btn { width: 100%; }
  .hsg-home-quote { padding: 20px; }
}

/* ==========================================================================
   Contact page (Contact.jsp) - added Oct 28 2026.
   Contact-only classes (hsg-contact-*, hsg-field). Reuses buttons, eyebrow,
   container, the shared CTA (with the homepage's compact spacing) and footer.
   ========================================================================== */

/* Header: the Contact link is a plain link, so it marks the current page with aria-current. */
.hsg-nav__link[aria-current="page"] { color: var(--hsg-blue-600); box-shadow: inset 0 -2px 0 var(--hsg-blue-500); border-radius: 0; }

/* ---------- Hero (much shorter than the homepage hero) ---------- */
.hsg-contact-hero { position: relative; overflow: hidden; background: var(--hsg-warm-050); }
/* denver-mountains.jpg is 1164x432: the box is never wider than 1164px, so the
   photo is shown at or below native size on 1x screens. */
.hsg-contact-hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: min(62%, 1164px); }
.hsg-contact-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.hsg-contact-hero__media::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, .86) 14%, rgba(251, 247, 241, .35) 32%, rgba(251, 247, 241, 0) 52%);
}
.hsg-contact-hero__inner { position: relative; z-index: 2; padding-top: clamp(30px, 3.2vw, 44px); padding-bottom: clamp(26px, 2.8vw, 38px); }
.hsg-contact-hero h1 { margin-top: 10px; font-size: clamp(34px, 3.3vw, 48px); line-height: 1.06; letter-spacing: -.034em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-contact-hero__sub { margin-top: 12px; font-size: clamp(19px, 1.6vw, 23px); line-height: 1.3; color: var(--hsg-ink-600); }
.hsg-contact-hero__lede { margin-top: 10px; max-width: 34em; font-size: clamp(16px, 1.2vw, 17.5px); line-height: 1.55; color: var(--hsg-ink-600); }

/* ---------- Three cards ---------- */
.hsg-contact-main { padding: 20px 0 0; }
.hsg-contact-grid {
  display: grid; gap: 20px; align-items: stretch;
  grid-template-columns: minmax(0, 29fr) minmax(0, 42fr) minmax(0, 29fr);
  grid-template-areas: "info form map";
}
.hsg-contact-card {
  background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius-lg);
  box-shadow: var(--hsg-shadow-sm); padding: clamp(20px, 1.9vw, 28px); min-width: 0;
}
.hsg-contact-info { grid-area: info; }
.hsg-contact-form { grid-area: form; scroll-margin-top: 100px; }
.hsg-contact-form:focus { outline: none; }
.hsg-contact-map { grid-area: map; }

/* Contact information */
.hsg-contact-info__title { font-size: clamp(18px, 1.35vw, 20px); line-height: 1.25; font-weight: 700; letter-spacing: .01em; text-transform: uppercase; color: var(--hsg-navy-900); }
.hsg-contact-info__list { margin-top: 22px; display: grid; gap: 20px; }
.hsg-contact-info__list li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 16px; align-items: start; font-size: 16.5px; line-height: 1.5; color: var(--hsg-navy-800); }
.hsg-contact-info__list svg { width: 28px; height: 28px; color: var(--hsg-blue-500); }
.hsg-contact-info__list address { font-style: normal; }
.hsg-contact-info__list a { color: var(--hsg-blue-600); text-underline-offset: 3px; overflow-wrap: anywhere; }
.hsg-contact-info__list a[href^="tel:"] { color: var(--hsg-navy-800); text-decoration: none; }
.hsg-contact-info__list a[href^="tel:"]:hover { color: var(--hsg-blue-600); text-decoration: underline; }

/* Message form */
.hsg-contact-form h2 { font-size: clamp(22px, 1.8vw, 26px); line-height: 1.2; letter-spacing: -.022em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-contact-form__intro { margin-top: 6px; font-size: 15px; color: var(--hsg-ink-600); }
.hsg-contact-fields { margin-top: 16px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 14px; }
.hsg-contact-ref { grid-column: 1 / -1; margin: 0; padding: 9px 12px; border-radius: var(--hsg-radius-sm); background: var(--hsg-blue-050); color: var(--hsg-navy-700); font-size: 14px; }
.hsg-field { min-width: 0; }
.hsg-field--full { grid-column: 1 / -1; }
.hsg-field label { display: block; margin-bottom: 5px; font-size: 14px; font-weight: 500; color: var(--hsg-navy-700); }
.hsg-req { color: var(--hsg-orange-cta); }
.hsg-opt { color: var(--hsg-ink-500); font-weight: 400; }
.hsg-field input, .hsg-field select, .hsg-field textarea {
  display: block; width: 100%; min-height: 46px; padding: 10px 13px;
  font: 400 16px/1.4 var(--hsg-font); color: var(--hsg-navy-800);
  background: #fff; border: 1px solid var(--hsg-line-strong); border-radius: var(--hsg-radius-sm);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.hsg-field textarea { min-height: 104px; resize: vertical; }
.hsg-field input:hover, .hsg-field select:hover, .hsg-field textarea:hover { border-color: #b3bdcf; }
.hsg-field input:focus, .hsg-field select:focus, .hsg-field textarea:focus { outline: none; border-color: var(--hsg-blue-500); box-shadow: 0 0 0 3px rgba(29, 114, 242, .18); }
.hsg-select { position: relative; }
.hsg-select select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; }
.hsg-select::after {
  content: ""; position: absolute; right: 16px; top: 50%; width: 8px; height: 8px; margin-top: -6px; pointer-events: none;
  border-right: 2px solid var(--hsg-ink-500); border-bottom: 2px solid var(--hsg-ink-500); transform: rotate(45deg);
}
.hsg-field.is-invalid input, .hsg-field.is-invalid select, .hsg-field.is-invalid textarea { border-color: #c4320a; }
.hsg-field.is-invalid input:focus, .hsg-field.is-invalid select:focus, .hsg-field.is-invalid textarea:focus { box-shadow: 0 0 0 3px rgba(196, 50, 10, .16); }
.hsg-field__err { margin-top: 5px; font-size: 13.5px; line-height: 1.4; color: #b42318; }
.hsg-field__err[hidden] { display: none; }
.hsg-contact-hp { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.hsg-contact-fields__foot { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 4px; }
.hsg-contact-fields__foot .hsg-btn { min-height: 48px; padding: 0 26px; }
.hsg-contact-fields__foot .hsg-btn[disabled] { opacity: .7; cursor: progress; }
.hsg-contact-fields__note { font-size: 14px; color: var(--hsg-ink-500); }
.hsg-contact-fields__note span { color: var(--hsg-orange-cta); }

.hsg-contact-alert { margin-top: 14px; padding: 12px 14px; border: 1px solid #f3c2b0; border-left: 4px solid #c4320a; border-radius: var(--hsg-radius-sm); background: #fef3ef; color: #7a1d06; font-size: 14.5px; }
.hsg-contact-alert[hidden] { display: none; }
.hsg-contact-alert:focus { outline: none; box-shadow: 0 0 0 3px rgba(196, 50, 10, .2); }
.hsg-contact-alert ul { margin-top: 6px; padding-left: 18px; list-style: disc; }
.hsg-contact-alert a { color: inherit; text-underline-offset: 2px; }

.hsg-contact-done { display: grid; justify-items: start; gap: 10px; padding: 6px 0; }
.hsg-contact-done svg { width: 48px; height: 48px; }
.hsg-contact-done h2 { margin-top: 4px; }
.hsg-contact-done p { color: var(--hsg-ink-600); font-size: 16px; max-width: 36em; }
.hsg-contact-done a { color: var(--hsg-blue-600); font-weight: 600; text-underline-offset: 3px; }
.hsg-contact-done__again { margin-top: 4px; }

/* Map */
.hsg-contact-map { display: flex; flex-direction: column; padding: 8px; }
.hsg-contact-map__frame { display: block; flex: 1 1 auto; width: 100%; min-height: 300px; border: 0; border-radius: 10px; background: var(--hsg-surface-soft); }
.hsg-contact-map__foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 14px; padding: 10px 8px 4px; font-size: 14px; color: var(--hsg-ink-600); }
.hsg-contact-map__foot a { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--hsg-blue-600); text-decoration: none; }
.hsg-contact-map__foot a:hover { text-decoration: underline; text-underline-offset: 3px; }
.hsg-contact-map__foot svg { width: 16px; height: 16px; }

.hsg-contact ~ .hsg-footer { padding-top: 26px; }

@media (max-width: 1240px) {
  .hsg-contact-grid { grid-template-columns: minmax(0, 27fr) minmax(0, 44fr) minmax(0, 29fr); gap: 16px; }
  .hsg-contact-info__list li { grid-template-columns: 24px minmax(0, 1fr); gap: 12px; font-size: 15.5px; }
  .hsg-contact-info__list svg { width: 24px; height: 24px; }
}
/* Tablet: contact details beside the form, map full width below. */
@media (max-width: 1080px) {
  .hsg-contact-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); grid-template-areas: "info form" "map map"; }
  .hsg-contact-map__frame { min-height: 320px; }
}
/* Mobile: contact information, then the form, then the map. */
@media (max-width: 860px) {
  .hsg-contact-hero { display: flex; flex-direction: column; }
  .hsg-contact-hero__media { position: relative; order: 2; width: 100%; height: 140px; }
  .hsg-contact-hero__media::before { background: linear-gradient(180deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, 0) 45%); }
  .hsg-contact-hero__inner { padding-bottom: 8px; }
  .hsg-contact-grid { grid-template-columns: minmax(0, 1fr); grid-template-areas: "info" "form" "map"; gap: 14px; }
  .hsg-contact-main { padding-top: 16px; }
  .hsg-contact-map__frame { min-height: 280px; }
}
@media (max-width: 600px) {
  .hsg-contact-fields { grid-template-columns: minmax(0, 1fr); }
  .hsg-contact-fields__foot .hsg-btn { width: 100%; }
  .hsg-contact-hero__media { height: 120px; }
}
@media print {
  .hsg-contact-hero__media, .hsg-contact-map, .hsg-contact-form { display: none !important; }
}

/* ==========================================================================
   Information pages (About.jsp, Consulting.jsp) - added Oct 28 2026.
   Generic classes: hsg-photo-hero, hsg-glance, hsg-info-*, hsg-split, hsg-copy,
   hsg-apart, hsg-ticks, hsg-tiles/hsg-tile, hsg-values, hsg-svc.
   ========================================================================== */

/* ---------- Compact photo hero (same treatment as the Contact hero) ---------- */
.hsg-photo-hero { position: relative; overflow: hidden; background: var(--hsg-warm-050); }
.hsg-photo-hero__media { position: absolute; top: 0; right: 0; bottom: 0; width: min(58%, 1164px); }
.hsg-photo-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 62%; }
.hsg-photo-hero__media::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(90deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, .88) 16%, rgba(251, 247, 241, .35) 36%, rgba(251, 247, 241, 0) 56%);
}
.hsg-photo-hero__inner { position: relative; z-index: 2; padding-top: clamp(34px, 3.6vw, 52px); padding-bottom: clamp(34px, 3.6vw, 52px); }
.hsg-photo-hero h1 { margin-top: 12px; max-width: 15em; font-size: clamp(34px, 3.4vw, 50px); line-height: 1.06; letter-spacing: -.034em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-photo-hero h1 .hsg-accent { color: var(--hsg-blue-500); }
.hsg-photo-hero__lede { margin-top: 16px; max-width: 36em; font-size: clamp(16.5px, 1.3vw, 18.5px); line-height: 1.55; color: var(--hsg-ink-600); }
.hsg-photo-hero__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin-top: 24px; }
.hsg-photo-hero__actions .hsg-tile__link { margin-top: 0; padding-top: 0; }
/* Training overview: the instructor photo (887x880). Box never wider than 887px, so it is shown at or below native size. */
.hsg-photo-hero--people .hsg-photo-hero__media { width: min(50%, 887px); }
.hsg-photo-hero--people .hsg-photo-hero__media img { object-position: 50% 14%; }
.hsg-photo-hero__copy { max-width: 640px; }
.hsg-photo-hero--people .hsg-photo-hero__copy { max-width: 700px; }
.hsg-photo-hero--people h1 { max-width: none; font-size: clamp(30px, 2.95vw, 44px); }
/* Topic logo images on Training.jsp cards (same PNG files as the homepage). */
.hsg-card__icon--logo { display: block; width: 56px; height: 56px; object-fit: contain; }

/* ---------- Facts strip ---------- */
.hsg-glance { border-bottom: 1px solid var(--hsg-line); background: #fff; }
.hsg-facts__list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hsg-facts__list li { display: flex; flex-direction: column; gap: 4px; padding: 22px 26px; }
.hsg-facts__list li:first-child { padding-left: 0; }
.hsg-facts__list li + li { border-left: 1px solid var(--hsg-line); }
.hsg-glance strong { font-size: clamp(21px, 1.9vw, 26px); line-height: 1.15; font-weight: 650; letter-spacing: -.02em; color: var(--hsg-navy-900); }
.hsg-glance span { font-size: 15px; color: var(--hsg-ink-500); }

/* ---------- Sections ---------- */
.hsg-info-section { padding: clamp(40px, 4.6vw, 64px) 0; }
.hsg-info-section--soft { background: var(--hsg-surface-soft); border-top: 1px solid var(--hsg-line); border-bottom: 1px solid var(--hsg-line); }
.hsg-info-section + .hsg-info-section--soft, .hsg-info-section--soft + .hsg-info-section { border-top: 0; }
.hsg-info-head { margin-bottom: 26px; }
.hsg-info-head h2, .hsg-copy h2 { margin-top: 10px; font-size: clamp(26px, 2.5vw, 36px); line-height: 1.15; letter-spacing: -.026em; font-weight: 700; color: var(--hsg-navy-900); }

.hsg-split { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: clamp(28px, 4vw, 64px); align-items: start; }
.hsg-copy { max-width: 760px; }
.hsg-copy p:not(.hsg-eyebrow) { margin-top: 16px; font-size: 17px; line-height: 1.65; color: var(--hsg-ink-600); }
.hsg-copy h2 + p { margin-top: 18px; }
.hsg-apart { margin-top: 6px; }
.hsg-apart p { font-size: 16px; line-height: 1.6; }
.hsg-apart__motto { margin-top: 16px !important; padding-top: 14px; border-top: 1px solid var(--hsg-line); font: italic 600 19px/1.35 var(--hsg-serif); color: var(--hsg-navy-900) !important; }

.hsg-ticks { margin-top: 14px; display: grid; gap: 10px; }
.hsg-ticks li { position: relative; padding-left: 28px; font-size: 15.5px; line-height: 1.5; color: var(--hsg-ink-600); }
.hsg-ticks li::before {
  content: ""; position: absolute; left: 2px; top: 6px; width: 13px; height: 7px;
  border-left: 2.2px solid var(--hsg-blue-500); border-bottom: 2.2px solid var(--hsg-blue-500); transform: rotate(-45deg);
}

/* ---------- Tiles ---------- */
.hsg-tiles { display: grid; gap: 18px; }
.hsg-tiles--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hsg-tiles--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hsg-tile { display: flex; flex-direction: column; padding: clamp(22px, 2.2vw, 30px); background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius-lg); box-shadow: var(--hsg-shadow-sm); }
.hsg-tile h2, .hsg-tile h3 { font-size: clamp(20px, 1.6vw, 23px); line-height: 1.25; letter-spacing: -.018em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-tile p { margin-top: 12px; font-size: 16px; line-height: 1.6; color: var(--hsg-ink-600); }
.hsg-tile a:not(.hsg-tile__link), .hsg-svc a { color: var(--hsg-blue-600); text-underline-offset: 3px; }
.hsg-tile__link { display: inline-flex; align-items: center; gap: 6px; margin-top: auto; padding-top: 16px; font-size: 15.5px; font-weight: 600; color: var(--hsg-blue-600); text-decoration: none; }
.hsg-tile__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.hsg-tile__link svg { width: 18px; height: 18px; }
.hsg-page-hero__actions .hsg-tile__link { margin-top: 0; padding-top: 0; }

/* ---------- Numbered values / expertise ---------- */
.hsg-values { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 16px; }
.hsg-values li { padding: 22px 20px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); }
.hsg-values__num { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--hsg-blue-050); color: var(--hsg-blue-600); font-weight: 700; font-size: 15px; }
.hsg-values h3 { margin-top: 14px; font-size: 18px; line-height: 1.25; font-weight: 650; letter-spacing: -.012em; color: var(--hsg-navy-900); }
.hsg-values p { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--hsg-ink-600); }

/* ---------- Services grid ---------- */
.hsg-svc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.hsg-svc li { padding: 20px 22px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); border-top: 3px solid var(--hsg-blue-500); }
.hsg-svc h3 { font-size: 17.5px; line-height: 1.3; font-weight: 650; letter-spacing: -.01em; color: var(--hsg-navy-900); }
.hsg-svc p { margin-top: 8px; font-size: 15px; line-height: 1.55; color: var(--hsg-ink-600); }

.hsg-info ~ .hsg-footer { padding-top: 26px; }

@media (max-width: 1240px) {
  .hsg-values { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1080px) {
  .hsg-split { grid-template-columns: minmax(0, 1fr); }
  .hsg-facts__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hsg-facts__list li:nth-child(3) { border-left: 0; padding-left: 0; }
  .hsg-facts__list li:nth-child(n+3) { border-top: 1px solid var(--hsg-line); }
  .hsg-svc { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hsg-tiles--3 { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 860px) {
  .hsg-photo-hero { display: flex; flex-direction: column; }
  .hsg-photo-hero__media { position: relative; order: 2; width: 100%; height: 140px; }
  .hsg-photo-hero__media::before { background: linear-gradient(180deg, var(--hsg-warm-050) 0%, rgba(251, 247, 241, 0) 45%); }
  .hsg-photo-hero__inner { padding-bottom: 12px; }
  .hsg-tiles--2 { grid-template-columns: minmax(0, 1fr); }
  .hsg-values { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 600px) {
  .hsg-facts__list { grid-template-columns: minmax(0, 1fr); }
  .hsg-facts__list li { padding: 14px 0; border-left: 0 !important; }
  .hsg-facts__list li + li { border-top: 1px solid var(--hsg-line); }
  .hsg-svc, .hsg-values { grid-template-columns: minmax(0, 1fr); }
  .hsg-photo-hero__media { height: 120px; }
}
@media print {
  .hsg-photo-hero__media { display: none !important; }
}
@media (max-width: 860px) {
  .hsg-photo-hero--people .hsg-photo-hero__media { width: 100%; height: clamp(200px, 46vw, 340px); }
  .hsg-photo-hero--people .hsg-photo-hero__media img { object-position: 50% 22%; }
}

/* ---------- Course catalog (/Course_Catalog, hsg2026-catalog.jspf) ---------- */
.hsg-cat__jump { margin-top: 18px; }
.hsg-cat__jump a { padding: 7px 13px; font-size: 14px; }
.hsg-cat__list { gap: 8px; }
.hsg-cat .hsg-courses__group a { color: inherit; text-decoration: none; }
.hsg-cat .hsg-courses__group a:hover { color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; }
.hsg-course--compact { padding: 14px 20px; gap: 6px 24px; }
.hsg-course--compact h4 { margin: 0; font-size: 16.5px; line-height: 1.35; font-weight: 600; color: var(--hsg-navy-900); }
.hsg-course--compact h4 a { text-decoration: none; color: inherit; }
.hsg-course--compact h4 a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.hsg-course--compact h4 a:focus-visible { outline: none; }
.hsg-course--compact h4 a:focus-visible::after { outline: 3px solid var(--hsg-focus); outline-offset: 2px; }
.hsg-course--compact .hsg-course__meta { min-width: 70px; font-size: 14.5px; color: var(--hsg-ink-500); }
@media (max-width: 600px) {
  .hsg-course--compact { grid-template-columns: minmax(0, 1fr) auto; }
  .hsg-course--compact .hsg-course__go { display: none; }
}

/* ---------- Public class schedule (PublicTraining.jsp, hsg2026-public-group.jspf) ---------- */
.hsg-sched-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 470px); gap: clamp(28px, 3.6vw, 52px); align-items: start; }
.hsg-sched-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; }
.hsg-sched-head h2 { font-size: clamp(28px, 2.6vw, 38px); line-height: 1.15; letter-spacing: -.026em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-sched-head .hsg-btn { gap: 8px; }
.hsg-sched-intro { margin-top: 12px; max-width: 62ch; font-size: 16.5px; line-height: 1.6; color: var(--hsg-ink-600); }
.hsg-sched { margin-top: 30px; scroll-margin-top: 100px; }
.hsg-sched__title { padding-bottom: 10px; border-bottom: 2px solid #cfe0fb; font-size: 15.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--hsg-blue-600); }
.hsg-sched__rows { margin-top: 12px; display: grid; gap: 10px; }
.hsg-sched__row { display: grid; grid-template-columns: 44px minmax(150px, 210px) minmax(0, 1fr) auto; gap: 8px 20px; align-items: center; padding: 14px 18px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); box-shadow: var(--hsg-shadow-sm); }
.hsg-sched__cal svg { width: 34px; height: 34px; color: var(--hsg-blue-500); }
.hsg-sched__when strong { display: block; font-size: 15.5px; font-weight: 650; color: var(--hsg-navy-900); white-space: nowrap; }
.hsg-sched__when span { display: block; margin-top: 2px; font-size: 14px; color: var(--hsg-ink-500); }
.hsg-sched__what { min-width: 0; }
.hsg-sched__what a, .hsg-sched__what > span[itemprop] { font-size: 16px; font-weight: 650; color: var(--hsg-navy-900); text-decoration: none; }
.hsg-sched__what a:hover { color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; }
.hsg-sched__price { display: block; margin-top: 2px; font-size: 14px; color: var(--hsg-ink-500); }
.hsg-sched__row .hsg-btn { min-height: 42px; padding: 0 20px; font-size: 15px; }

/* Course directory sidebar */
.hsg-dir { padding: clamp(20px, 2vw, 28px); background: #f7f9fd; }
.hsg-dir > h2 { font-size: 21px; font-weight: 700; letter-spacing: .01em; text-transform: uppercase; color: var(--hsg-navy-900); }
.hsg-dir > h2 span { font-size: 12.5px; font-weight: 600; letter-spacing: 0; text-transform: none; color: var(--hsg-ink-500); }
.hsg-dir__group { margin-top: 20px; }
.hsg-dir__group + .hsg-dir__group { padding-top: 18px; border-top: 1px solid var(--hsg-line); }
.hsg-dir__head { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; align-items: center; }
.hsg-dir__head svg { width: 40px; height: 40px; color: var(--hsg-blue-500); }
.hsg-dir__head h3 { font-size: 15.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--hsg-blue-600); }
.hsg-dir__head p { margin-top: 2px; font-size: 14px; color: var(--hsg-ink-600); }
.hsg-dir__list { margin-top: 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; }
.hsg-dir__list a { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 8px; align-items: start; font-size: 14.5px; line-height: 1.35; color: var(--hsg-navy-800); text-decoration: none; }
.hsg-dir__list a:hover span { color: var(--hsg-blue-600); text-decoration: underline; text-underline-offset: 3px; }
.hsg-dir__list svg { width: 17px; height: 17px; margin-top: 1px; color: var(--hsg-blue-500); }
@media (max-width: 1080px) {
  .hsg-sched-layout { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .hsg-sched__row { grid-template-columns: 40px minmax(0, 1fr); padding: 14px; }
  .hsg-sched__what { grid-column: 1 / -1; }
  .hsg-sched__row .hsg-btn { grid-column: 1 / -1; width: 100%; }
}
@media (max-width: 420px) { .hsg-dir__list { grid-template-columns: minmax(0, 1fr); } }

/* ==========================================================================
   Course and category pages, matched to HSG's mockups - Oct 28 2026 (evening).
   ========================================================================== */
/* Hero side panel: soft background, larger icons (course facts + category points) */
.hsg-panel--facts { padding: clamp(22px, 2.2vw, 32px); border-color: #e1e8f5; background: #f3f6fc; }
.hsg-panel--facts .hsg-facts { gap: 22px; }
.hsg-panel--facts .hsg-facts > div { grid-template-columns: 46px minmax(0, 1fr); column-gap: 18px; }
.hsg-panel--facts .hsg-facts svg, .hsg-panel--facts .hsg-points svg { width: 38px; height: 38px; }
.hsg-panel--facts .hsg-facts dt, .hsg-panel--facts .hsg-points strong { font-size: 17px; }
.hsg-panel--facts .hsg-facts dd, .hsg-panel--facts .hsg-points span { font-size: 15.5px; }
.hsg-panel--facts .hsg-points { gap: 22px; }
.hsg-panel--facts .hsg-points li { grid-template-columns: 46px minmax(0, 1fr); gap: 18px; }
.hsg-page-hero__actions .hsg-btn--outline { gap: 10px; }

/* Section tabs (course page) */
.hsg-subnav--tabs { position: sticky; top: 82px; z-index: 20; }
.hsg-subnav--tabs ul { justify-content: space-between; gap: 0; }
.hsg-subnav--tabs li { flex: 1 1 0; text-align: center; }
.hsg-subnav--tabs a { display: block; padding: 18px 12px; font-size: 16.5px; color: var(--hsg-navy-800); border-bottom-width: 3px; }
.hsg-subnav--tabs a.is-active { color: var(--hsg-blue-600); border-bottom-color: var(--hsg-blue-500); }
@media (max-width: 1080px) { .hsg-subnav--tabs { top: 82px; } .hsg-subnav--tabs li { flex: 0 0 auto; } .hsg-subnav--tabs ul { justify-content: flex-start; } }
@media (max-width: 600px) { .hsg-subnav--tabs { top: 70px; } .hsg-subnav--tabs a { padding: 14px 12px; font-size: 15px; } }
.hsg-course-body { padding-top: clamp(32px, 3.6vw, 48px); }
.hsg-course-body .hsg-block, .hsg-course-body .hsg-duo { scroll-margin-top: 160px; }

/* What you'll learn */
.hsg-lead { font-size: 17.5px; line-height: 1.65; color: var(--hsg-ink-600); max-width: 70ch; }
.hsg-course-body #learn .hsg-prose { color: var(--hsg-ink-600); font-size: 17px; }
.hsg-course-body .hsg-learn { margin-top: 18px; grid-template-columns: minmax(0, 1fr) !important; }
.hsg-course-body .hsg-learn li { font-size: 16.5px; }

/* Who should attend + Prerequisites cards */
.hsg-duo { margin-top: clamp(32px, 3.6vw, 44px); display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; align-items: stretch; }
.hsg-duo--single { grid-template-columns: minmax(0, 1fr); }
.hsg-card-block { padding: 24px 26px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius-lg); box-shadow: var(--hsg-shadow-sm); scroll-margin-top: 160px; }
.hsg-card-block h2 { font-size: clamp(21px, 1.8vw, 25px); line-height: 1.2; letter-spacing: -.02em; font-weight: 700; color: var(--hsg-navy-900); }
.hsg-card-block p, .hsg-card-block .hsg-prose { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--hsg-ink-600); }
.hsg-duo + .hsg-block { margin-top: clamp(36px, 4vw, 52px); }
@media (max-width: 700px) { .hsg-duo { grid-template-columns: minmax(0, 1fr); } }

/* Sidebar: related training list */
.hsg-related-list { margin-top: 14px; display: grid; gap: 10px; }
.hsg-related-list:empty { display: none; }
.hsg-related-list a { position: relative; display: grid; grid-template-columns: 48px minmax(0, 1fr) 18px; gap: 14px; align-items: center; padding: 14px; background: #fff; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); text-decoration: none; color: inherit; }
.hsg-related-list a:hover { border-color: #bcd0f5; box-shadow: var(--hsg-shadow); }
.hsg-related-list__icon { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 12px; background: var(--hsg-blue-050); color: var(--hsg-blue-600); }
.hsg-related-list__icon svg { width: 26px; height: 26px; }
.hsg-related-list__text strong { display: block; font-size: 15.5px; line-height: 1.3; color: var(--hsg-navy-900); }
.hsg-related-list__text span { display: block; margin-top: 3px; font-size: 14px; line-height: 1.45; color: var(--hsg-ink-500); }
.hsg-related-list__chev { width: 18px; height: 18px; color: var(--hsg-blue-600); }
.hsg-notems--aside { grid-template-columns: minmax(0, 1fr); margin-top: 14px; }

/* Course rows: duration and price stacked, chevron at the end */
.hsg-course__meta span:last-child { color: inherit; font-size: inherit; }
.hsg-course__meta span { font-size: 15.5px; color: var(--hsg-navy-800); }
.hsg-course__chev { width: 22px; height: 22px; color: var(--hsg-blue-600); transition: transform .15s ease; }
.hsg-course:hover .hsg-course__chev { transform: translateX(3px); }

/* Category filter: icon inside the field, topic chips as toggles, "View all" */
.hsg-filter__field { position: relative; flex: 1; min-width: 0; }
.hsg-filter__field svg { position: absolute; left: 18px; top: 50%; width: 22px; height: 22px; margin-top: -11px; color: var(--hsg-ink-500); pointer-events: none; }
.hsg-filter__field .hsg-search__input { width: 100%; padding-left: 52px; }
.hsg-chips--filter button {
  padding: 9px 18px; border: 1px solid var(--hsg-line-strong); border-radius: 999px; background: #fff; cursor: pointer;
  font: 500 15px/1.2 var(--hsg-font); color: var(--hsg-navy-800);
}
.hsg-chips--filter button:hover { border-color: var(--hsg-blue-500); color: var(--hsg-blue-600); }
.hsg-chips--filter button[aria-pressed="true"] { border-color: var(--hsg-blue-500); background: var(--hsg-blue-050); color: var(--hsg-blue-600); font-weight: 600; }
.hsg-linkbtn--more { border: 0; background: none; padding: 0; cursor: pointer; font: 600 16px var(--hsg-font); }
.hsg-linkbtn--more[hidden] { display: none; }

/* Category Notems feature ("Ideas that make a difference") */
.hsg-notems-feature { padding: clamp(32px, 3.6vw, 48px) 0 0; }
.hsg-notems-feature .hsg-head { align-items: center; }
.hsg-notem__tag { margin: 0 0 6px; font-size: 13.5px; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--hsg-blue-600); }
/* Training locations card */
.hsg-locations { padding: clamp(22px, 2.4vw, 30px); border-color: #e1e8f5; background: #f3f6fc; border-radius: var(--hsg-radius-lg); }
.hsg-locations__row { grid-template-columns: 46px minmax(0, 1fr); gap: 18px; }
.hsg-locations__row > svg { width: 40px; height: 40px; }
.hsg-locations .hsg-eyebrow { font-size: 14px; }
.hsg-locations h2 { margin-top: 6px; font-size: clamp(20px, 1.8vw, 25px); line-height: 1.2; font-weight: 700; letter-spacing: -.02em; }
.hsg-locations p:not(.hsg-eyebrow) { margin-top: 8px; font-size: 16px; }
.hsg-locations__inline { margin-top: 12px; display: flex; flex-wrap: wrap; gap: 6px 0; font-size: 15.5px; }
.hsg-locations__inline li { display: inline-flex; align-items: center; color: var(--hsg-ink-500); }
.hsg-locations__inline li + li::before { content: "\2022"; margin: 0 12px; color: var(--hsg-ink-400); }
.hsg-locations__inline a { color: var(--hsg-blue-600); text-decoration: none; }
.hsg-locations__inline a:hover { text-decoration: underline; text-underline-offset: 3px; }
.hsg-locations .hsg-locations__inline { columns: auto; font-size: 15.5px; }
.hsg-locations .hsg-locations__inline a { color: var(--hsg-blue-600); font-weight: 500; }
/* Course page: 65 / 35 columns and denser vertical rhythm (approved SharePoint design) */
.hsg-course-body .hsg-layout { grid-template-columns: minmax(0, 65fr) minmax(300px, 35fr); gap: clamp(28px, 3vw, 44px); }
.hsg-course-body { padding-top: clamp(28px, 3vw, 40px); padding-bottom: clamp(36px, 4vw, 56px); }
.hsg-course-body .hsg-block + .hsg-block, .hsg-course-body .hsg-duo + .hsg-block { margin-top: clamp(28px, 3vw, 40px); }
.hsg-course-body .hsg-duo { margin-top: clamp(24px, 2.6vw, 32px); }
.hsg-course-body .hsg-block > h2, .hsg-course-body .hsg-outline__head h2 { margin-bottom: 12px; }
.hsg-course-body .hsg-more { margin-top: 18px; }
.hsg-course-body .hsg-block--locations { margin-top: clamp(28px, 3vw, 40px); }
.hsg-course-body h1, .hsg-page-hero h1 { overflow-wrap: anywhere; }
.hsg-course-body .hsg-acc__item + .hsg-acc__item { margin-top: 8px; }
@media (max-width: 1080px) { .hsg-course-body .hsg-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 1080px) { .hsg-course-body .hsg-layout { grid-template-areas: "main" "aside"; } }

/* ---------- Category pages: final refinements (Oct 29 2026) ---------- */
/* Compact category hero: about 17% less vertical padding (Search.jsp category branch only). */
.hsg-page-hero--compact .hsg-page-hero__inner { padding-top: 18px; padding-bottom: clamp(30px, 3.75vw, 46px); }
.hsg-page-hero--compact .hsg-page-hero__copy { padding-top: clamp(12px, 1.65vw, 22px); }
.hsg-page-hero--compact .hsg-page-hero__actions { margin-top: 24px; }
/* Course card descriptions: two lines; the full text stays in the HTML (and in data-hsg-text for the filter). */
.hsg-course p { max-height: 3em; overflow-wrap: anywhere; }
.hsg-course h3 { overflow-wrap: anywhere; }
/* Notems editorial card (category pages, layout "feature"): wide image left, text right. */
.hsg-notems--single .hsg-notem--noimg { grid-template-columns: minmax(0, 1fr); }
.hsg-notems-feature .hsg-notem { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 28px; align-items: center; padding: 20px; }
.hsg-notems-feature .hsg-notem--noimg { grid-template-columns: minmax(0, 1fr); padding: 24px 26px; }
.hsg-notems-feature .hsg-notem img { width: 100%; height: auto; aspect-ratio: 16 / 10; }
.hsg-notems-feature .hsg-notem h3 { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.28; overflow-wrap: anywhere; }
.hsg-notems-feature .hsg-notem p:not(.hsg-notem__tag) { max-width: 68ch; font-size: 15.5px; line-height: 1.5;
  display: -webkit-box; -webkit-line-clamp: 3; line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 700px) {
  .hsg-notems-feature .hsg-notem { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .hsg-notems-feature .hsg-notem img { aspect-ratio: 16 / 9; height: auto; }
}
/* Tablet/mobile course cards: duration and price share a row with the arrow (no extra row). */
@media (max-width: 860px) {
  .hsg-course { grid-template-columns: minmax(0, 1fr) auto; }
  .hsg-course > div:first-child { grid-column: 1 / -1; }
  .hsg-course__chev { justify-self: end; }
}

/* ---------- Course icons (hsg2026-course-icon.jspf) - Oct 29 2026 ---------- */
.hsg-ico { --ico: var(--hsg-blue-600); --ico-bg: #eaf1ff; display: grid; place-items: center; width: 52px; height: 52px; flex: none; border-radius: 14px; background: var(--ico-bg); color: var(--ico); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--ico) 14%, transparent); }
.hsg-ico svg { width: 28px; height: 28px; }
.hsg-ico img { width: 40px; height: 40px; object-fit: contain; }
.hsg-ico img + svg { display: none; }
.hsg-ico:has(img) { background: #fff; box-shadow: inset 0 0 0 1px var(--hsg-line); }
.hsg-ico--navy   { --ico: #1e3a8a; --ico-bg: #e8edf9; }
.hsg-ico--blue   { --ico: #1d5fd6; --ico-bg: #e7f0ff; }
.hsg-ico--sky    { --ico: #0a76b8; --ico-bg: #e2f3fc; }
.hsg-ico--teal   { --ico: #0b7f77; --ico-bg: #def5f2; }
.hsg-ico--green  { --ico: #18794a; --ico-bg: #e2f5ea; }
.hsg-ico--amber  { --ico: #a35a00; --ico-bg: #fff2d9; }
.hsg-ico--orange { --ico: #c2410c; --ico-bg: #ffeadf; }
.hsg-ico--red    { --ico: #b42318; --ico-bg: #fde8e6; }
.hsg-ico--purple { --ico: #5b3fc4; --ico-bg: #eee9fd; }
.hsg-ico--violet { --ico: #7a2fb8; --ico-bg: #f4e8fc; }
.hsg-ico--slate  { --ico: #334155; --ico-bg: #edf0f4; }
.hsg-related-list a { grid-template-columns: 52px minmax(0, 1fr) 18px; }
.hsg-related-list a:focus-visible { outline: 3px solid var(--hsg-focus); outline-offset: 2px; }
.hsg-related-list__text strong { overflow-wrap: anywhere; }
.hsg-related-list__text span { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hsg-related-list a:hover .hsg-related-list__chev { transform: translateX(3px); }
.hsg-related-list__chev { transition: transform .15s ease; }

/* Course directory in the course-page sidebar */
.hsg-dir__list a.is-current span { color: var(--hsg-blue-600); font-weight: 650; }
.hsg-course-body .hsg-dir > h2 { font-size: 19px; }
/* Line-icon tiles: solid colour so each course stands out (logo images keep a white tile). */
.hsg-ico { width: 56px; height: 56px; border-radius: 15px; color: #fff; box-shadow: 0 6px 14px -8px var(--ico);
  background: linear-gradient(140deg, color-mix(in srgb, var(--ico) 78%, #fff) 0%, var(--ico) 100%); }
.hsg-ico svg { width: 30px; height: 30px; }
.hsg-ico img { width: 44px; height: 44px; }
.hsg-ico:has(img) { background: #fff; box-shadow: inset 0 0 0 1px var(--hsg-line), 0 4px 10px -8px rgba(15, 30, 60, .5); }
.hsg-related-list a { grid-template-columns: 56px minmax(0, 1fr) 18px; }

/* ---------- Full-width course directory (index.jsp, Training.jsp) - Oct 29 2026 ---------- */
.hsg-dirwide .hsg-head { align-items: end; }
.hsg-dirwide h2 span { font-size: 15px; font-weight: 600; letter-spacing: 0; color: var(--hsg-ink-500); }
.hsg-dirwide__panel { display: grid; gap: 28px; padding: clamp(22px, 2.6vw, 36px); background: #f7f9fd; border: 1px solid var(--hsg-line); border-radius: var(--hsg-radius); }
.hsg-section--soft .hsg-dirwide__panel { background: #fff; }
.hsg-dirwide__group + .hsg-dirwide__group { padding-top: 24px; border-top: 1px solid var(--hsg-line); }
.hsg-dirwide .hsg-dir__head svg { width: 40px; height: 40px; color: var(--hsg-blue-500); }
.hsg-dirwide .hsg-dir__head h3 { font-size: 15.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--hsg-blue-600); }
.hsg-dirwide .hsg-dir__head p { margin-top: 2px; font-size: 14px; color: var(--hsg-ink-600); }
/* Columns read top-to-bottom, so the alphabetical order stays easy to scan. */
.hsg-dirwide__list { display: block; margin-top: 16px; columns: 4 210px; column-gap: 28px; }
.hsg-dirwide__list li { break-inside: avoid; padding: 4px 0; }
.hsg-dirwide__list a { font-size: 15px; }
.hsg-dirwide__list a:focus-visible { outline: 3px solid var(--hsg-focus); outline-offset: 2px; border-radius: 4px; }
@media (max-width: 600px) { .hsg-dirwide .hsg-head { align-items: start; } .hsg-dirwide__list { columns: 2 150px; column-gap: 16px; } }
.hsg-dirwide .hsg-head__aside.hsg-textlink { color: var(--hsg-blue-600); font-weight: 600; }
@media (max-width: 600px) { .hsg-dirwide__list { columns: 2 120px; } .hsg-dirwide__list a { font-size: 14.5px; } }

/* ---------- Back to top button - Oct 29 2026 ---------- */
.hsg-totop {
  position: fixed; right: clamp(16px, 2.5vw, 32px); bottom: clamp(16px, 2.5vw, 32px); z-index: 60;
  display: grid; place-items: center; width: 48px; height: 48px; padding: 0;
  border: 0; border-radius: 50%; background: var(--hsg-blue-600); color: #fff; cursor: pointer;
  box-shadow: 0 10px 24px -10px rgba(15, 40, 100, .55);
  opacity: 0; visibility: hidden; transform: translateY(12px);
  transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s, background-color .15s ease;
}
.hsg-totop.is-visible { opacity: 1; visibility: visible; transform: none; transition: opacity .2s ease, transform .2s ease, visibility 0s, background-color .15s ease; }
.hsg-totop:hover { background: var(--hsg-navy-900); }
.hsg-totop:focus-visible { outline: 3px solid var(--hsg-focus); outline-offset: 3px; }
.hsg-totop svg { width: 22px; height: 22px; }
@media (prefers-reduced-motion: reduce) { .hsg-totop, .hsg-totop.is-visible { transition: none; } }
@media print { .hsg-totop { display: none !important; } }