/* Hubpile v32 | Brand alignment for six public service and product pages.
   Deliberately scoped: will not recolour the admin, checkout or other pages. */
body.hp32-branded{--hp32-blue:#1677f2;--hp32-deep:#0d55c5;--hp32-navy:#071a35;--hp32-ink:#13243d;--hp32-border:#e0e9f6;--hp32-soft:#edf5ff;--hp32-shadow:0 18px 48px rgba(9,38,83,.08);color:var(--hp32-ink)}
body.hp32-branded.hp48-public{--hp48-bg:#f5f8fd;--hp48-surface-2:#f8fbff;--hp48-dark:#081a35;--hp48-dark-2:#122d57;--hp48-text:#14253e;--hp48-muted:#60718a;--hp48-line:#e0e9f6;--hp48-line-strong:#cddff5;--hp48-brand:#1677f2;--hp48-brand-dark:#0d55c5;--hp48-brand-soft:#edf5ff;--hp48-accent:#96c8ff;--hp48-mint:#96c8ff;--hp48-shadow:0 22px 62px rgba(9,38,83,.09);--hp48-shadow-soft:0 13px 34px rgba(9,38,83,.06)}
/* A distinctly Hubpile blue-first hero, preserving each original photograph. */
body.hp32-branded.hp48-public main .hp4-hero{min-height:555px!important;background-color:#081a35!important;background-image:radial-gradient(ellipse at 85% 7%,rgba(80,153,255,.27),transparent 35%),linear-gradient(110deg,rgba(5,18,40,.98) 2%,rgba(11,35,74,.91) 57%,rgba(23,61,115,.77) 100%),var(--hp48-hero-image,none)!important;background-size:auto,auto,cover!important;background-position:center,center,center!important}
body.hp32-branded.hp48-public main .hp4-hero:after{background:rgba(66,141,250,.14)!important}
body.hp32-branded.hp48-public main .hp4-hero-grid{padding-block:clamp(56px,7vw,92px);gap:clamp(25px,4.6vw,66px)}
body.hp32-branded.hp48-public main .hp4-hero h1{font-size:clamp(43px,5.5vw,75px);line-height:1.01;max-width:13ch;letter-spacing:-.055em}
body.hp32-branded.hp48-public main .hp4-hero p{color:#d5e4f5!important;max-width:620px}
body.hp32-branded.hp48-public main .hp4-kicker{color:#e3f0ff!important;border-color:rgba(195,219,252,.27)!important;background:rgba(255,255,255,.09)!important}
body.hp32-branded.hp48-public main .hp4-kicker:before{background:#6eb4ff!important;box-shadow:0 0 0 4px rgba(99,177,255,.16)!important}
body.hp32-branded.hp48-public main .hp4-hero-card{border:1px solid rgba(226,240,255,.7)!important;border-radius:25px!important;background:rgba(255,255,255,.975)!important;box-shadow:0 32px 75px rgba(3,15,40,.28)!important}
body.hp32-branded.hp48-public main .hp4-hero-card h3,body.hp32-branded.hp48-public main .hp4-hero-card strong{color:#152842!important}
body.hp32-branded.hp48-public main .hp4-hero-card p,body.hp32-branded.hp48-public main .hp4-mini span{color:#5f7289!important}
body.hp32-branded.hp48-public main .hp4-mini{border-color:#e1e9f6!important;background:#fff!important}
/* Unified interactive actions and cleaner content rhythm. */
body.hp32-branded.hp48-public main .hp4-btn.primary,body.hp32-branded.hp48-public main .hp4-hero .hp4-btn.primary{background:#1677f2!important;border-color:#1677f2!important;color:#fff!important;box-shadow:0 12px 26px rgba(22,119,242,.2)!important}
body.hp32-branded.hp48-public main .hp4-btn.primary:hover{background:#0d55c5!important}
body.hp32-branded.hp48-public main .hp4-section{background:#f6f9fd}
body.hp32-branded.hp48-public main .hp4-section.white{background:#fff!important}
body.hp32-branded.hp48-public main .hp4-section-head h2{color:#13243d!important;letter-spacing:-.048em}
body.hp32-branded.hp48-public main .hp4-section-head p,body.hp32-branded.hp48-public main .hp4-card p{color:#62738c!important}
body.hp32-branded.hp48-public main .hp4-card{border:1px solid #e1e9f6!important;border-radius:20px!important;box-shadow:var(--hp32-shadow)!important;transition:transform .2s,border-color .2s,box-shadow .2s}
body.hp32-branded.hp48-public main .hp4-card:hover{transform:translateY(-3px);border-color:#b9d7ff!important;box-shadow:0 26px 56px rgba(8,40,96,.13)!important}
body.hp32-branded.hp48-public main .hp4-chip{background:#edf5ff!important;border-color:#d2e5ff!important;color:#2e649f!important}
body.hp32-branded.hp48-public main .hp4-price{color:#1464d4!important}
body.hp32-branded.hp48-public main .hp4-section.dark{background:radial-gradient(ellipse at 90% 0%,rgba(56,124,231,.2),transparent 41%),linear-gradient(122deg,#07172e,#0b2953)!important}
body.hp32-branded.hp48-public main .hp4-section.dark p{color:#c6d7ea!important}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-card{background:rgba(255,255,255,.065)!important;border-color:rgba(220,235,255,.15)!important;box-shadow:none!important}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-card p{color:#c2d5eb!important}
body.hp32-branded.hp48-public main .hp-cta-band{background:radial-gradient(ellipse at 90% 0%,rgba(73,144,255,.22),transparent 38%),linear-gradient(120deg,#081a35,#15417e)!important;border-color:rgba(210,232,255,.14)!important;box-shadow:0 24px 60px rgba(10,31,70,.2)!important}
body.hp32-branded.hp48-public main .hp-cta-band p{color:#cddff3!important}
body.hp32-branded.hp48-public main .hp4-input:focus,body.hp32-branded.hp48-public main .hp4-select:focus{border-color:#1677f2!important;outline:3px solid rgba(22,119,242,.15)}
body.hp32-branded .hp18-dot{background:#1677f2!important;box-shadow:0 0 0 5px #e2efff!important}
body.hp32-branded .hp18-photo-panel{box-shadow:0 25px 64px rgba(10,40,86,.14)}
/* Courses: replace v31 mint/green marketplace skin with blue without changing search, AJAX or enrollment. */
body.hp32-branded.hp31-courses{--hpf-green:#1677f2;--hpf-ink:#13243d;--hpf-line:#e0e9f6}
body.hp32-branded.hp31-courses .hpf-market-hero{background:radial-gradient(ellipse at 87% 12%,rgba(70,147,250,.3),transparent 36%),radial-gradient(ellipse at 5% 92%,rgba(59,91,201,.15),transparent 35%),linear-gradient(118deg,#07182e,#0a2955 55%,#163f7b)!important}
body.hp32-branded.hp31-courses .hpf-market-hero .hpf-badge.dark{background:rgba(172,212,255,.12);border-color:rgba(172,212,255,.28);color:#dbedff}
body.hp32-branded.hp31-courses .hpf-market-hero h1 em{color:#91c8ff!important}
body.hp32-branded.hp31-courses .hpf-market-hero p{color:#cfdef1}
body.hp32-branded.hp31-courses .hp31-hero-utilities a{color:#b9d9ff;border-color:rgba(185,217,255,.4)}
body.hp32-branded.hp31-courses .hp31-hero-utilities a:hover{color:#fff;border-color:#fff}
body.hp32-branded.hp31-courses .hpf-hero-panel{background:rgba(218,234,255,.095);border-color:rgba(232,242,255,.23);box-shadow:0 30px 75px rgba(3,17,44,.25)}
body.hp32-branded.hp31-courses .hpf-hero-panel>.hpf-eyebrow{color:#b9d9ff!important}
body.hp32-branded.hp31-courses .hpf-hero-stat span{color:#c9ddf4}
body.hp32-branded.hp31-courses .hpf-searchbar button,body.hp32-branded.hp31-courses .hpf-card-link.primary,body.hp32-branded.hp31-courses .hpf-btn.primary{background:#1677f2!important;border-color:#1677f2!important;color:#fff!important}
body.hp32-branded.hp31-courses .hpf-searchbar button:hover,body.hp32-branded.hp31-courses .hpf-card-link.primary:hover,body.hp32-branded.hp31-courses .hpf-btn.primary:hover{background:#0d55c5!important}
body.hp32-branded.hp31-courses .hpf-topic-strip a:hover{color:#0c61c8;background:#eaf3ff;border-color:#a9ceff}
body.hp32-branded.hp31-courses .hpf-input:focus{border-color:#1677f2;box-shadow:0 0 0 3px rgba(22,119,242,.16)}
body.hp32-branded.hp31-courses .hpf-course-card:hover,body.hp32-branded.hp31-courses .hpf-creator-card:hover{border-color:#b0d2ff!important;box-shadow:0 22px 51px rgba(12,49,101,.12)}
body.hp32-branded.hp31-courses .hpf-course-media{background:linear-gradient(135deg,#d9e9fb,#a5c6f2)}
body.hp32-branded.hp31-courses .hpf-course-overlay{background:linear-gradient(180deg,rgba(6,25,63,.03),transparent 60%,rgba(7,33,85,.3))}
body.hp32-branded.hp31-courses .hpf-course-meta span{background:#eef5ff;color:#3b679d}
body.hp32-branded.hp31-courses .hpf-course-card h3 a:hover{color:#0d62cf}
body.hp32-branded.hp31-courses .hpf-pagination .current{background:#1677f2;border-color:#1677f2}
/* Help Desk: scoped independent visual system. */
body.hp32-branded.hp32-help-page{--brand:#1677f2;--brand-dark:#0d55c5;--brand-soft:#edf5ff;--surface-dark:#081a35;--surface-soft:#f3f7fd;--text:#13243d;--muted:#5f728b;--line:#e1e9f5;--bg:#f5f8fd}
body.hp32-branded.hp32-help-page .hp-hero{min-height:630px;background:radial-gradient(ellipse at 85% 8%,rgba(71,142,255,.25),transparent 34%),linear-gradient(114deg,rgba(7,22,46,.97),rgba(15,48,92,.83)),var(--hp32-help-image,none)!important;background-size:auto,auto,cover!important;background-position:center!important}
body.hp32-branded.hp32-help-page .hp-hero h1 .accent{color:#a1cfff!important}
body.hp32-branded.hp32-help-page .hp-btn-primary{background:#1677f2!important;color:#fff!important;box-shadow:0 11px 28px rgba(22,119,242,.23)}
body.hp32-branded.hp32-help-page .hp-btn-primary:hover{background:#0d55c5!important}
body.hp32-branded.hp32-help-page .hp-btn-secondary{background:rgba(255,255,255,.94);color:#14243c;border-color:#d9e7f9}
body.hp32-branded.hp32-help-page .hp-hero-card{background:rgba(255,255,255,.975);border-color:#e2ebf7;box-shadow:0 28px 76px rgba(5,22,52,.24)}
body.hp32-branded.hp32-help-page .hp-launch-item{border-color:#e0e8f5;background:#f9fbff}
body.hp32-branded.hp32-help-page .hp-launch-icon{background:#eaf3ff!important;color:#155cc7!important}
body.hp32-branded.hp32-help-page .hp-mini-badge{background:#eaf3ff!important;border-color:#cfe2ff!important;color:#185bab!important}
body.hp32-branded.hp32-help-page .hp-cta-band{background:linear-gradient(120deg,#081a35,#153f7b)!important;color:#fff;box-shadow:0 24px 60px rgba(10,31,73,.19)}
body.hp32-branded.hp32-help-page .hp-card{border-color:#e0e8f5;box-shadow:0 16px 46px rgba(9,39,82,.07)}
body.hp32-branded :is(a,button,input,select,summary):focus-visible{outline:3px solid rgba(22,119,242,.38);outline-offset:3px}
@media(max-width:920px){body.hp32-branded.hp48-public main .hp4-hero{min-height:0!important}body.hp32-branded.hp32-help-page .hp-hero{min-height:0}}
@media(max-width:780px){body.hp32-branded.hp48-public main .hp4-hero-grid{grid-template-columns:1fr!important;padding-block:58px}body.hp32-branded.hp48-public main .hp4-hero h1{font-size:clamp(40px,9vw,58px)}body.hp32-branded.hp48-public main .hp4-section{padding-block:62px!important}body.hp32-branded.hp32-help-page .hp-hero{padding-block:64px}body.hp32-branded.hp32-help-page .hp-hero-grid{grid-template-columns:1fr}body.hp32-branded.hp31-courses .hpf-market-hero{padding:68px 0 80px}}
@media(max-width:540px){body.hp32-branded.hp48-public main .hp4-hero-grid{padding-block:48px}body.hp32-branded.hp48-public main .hp4-hero h1{font-size:clamp(37px,10vw,47px)}body.hp32-branded.hp48-public main .hp4-hero p{font-size:15px}body.hp32-branded.hp48-public main .hp4-hero-card{padding:19px!important;border-radius:19px!important}body.hp32-branded.hp48-public main .hp-cta-band{padding:25px!important;border-radius:18px!important}body.hp32-branded.hp32-help-page .hp-hero-actions .hp-btn{width:100%}body.hp32-branded.hp31-courses .hpf-market-hero h1{font-size:clamp(40px,10.7vw,56px)}}
@media(prefers-reduced-motion:reduce){body.hp32-branded .hp4-card{transition:none!important;transform:none!important}}

body.hp32-branded.hp48-public .hp-nav-link.is-active,body.hp32-branded.hp48-public .hp-nav-trigger.is-active{background:#eaf3ff!important;color:#0d55c5!important}
body.hp32-branded.hp48-public .hp-nav-dropdown a:hover{background:#eff6ff!important}


/* Hubpile v32.1 | Dark-section accessibility contrast hotfix.
   The v32 generic section heading rule intentionally colours light sections navy,
   but it must not override headings inside dark navy blocks.
   Scoped to the six branded pages: no changes to white cards, account or admin UIs. */
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-section-head h2,
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-section-head h2 :is(strong,em,span),
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-section-head h3 {
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-section-head p,
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-section-head > p {
  color:#d7e5f7!important;
}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-kicker {
  color:#b8d9ff!important;
}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-card h3 {
  color:#ffffff!important;
}
body.hp32-branded.hp48-public main .hp4-section.dark .hp4-card p {
  color:#cedff0!important;
}
/* Dark CTA strips may be embedded in otherwise light sections. */
body.hp32-branded.hp48-public main .hp-cta-band h2,
body.hp32-branded.hp48-public main .hp-cta-band h2 :is(strong,em,span) {
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}
body.hp32-branded.hp48-public main .hp-cta-band p {
  color:#d7e5f7!important;
}
/* The Help Desk uses its own class names for its dark call-to-action. */
body.hp32-branded.hp32-help-page main .hp-cta-band h2 {
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
}


/* Hubpile v32.2 | Critical dark-surface text contrast.
   This version has a new URL to bypass caches still serving v32.0.0.
   Keep these rules AFTER the general/light-section rules. */
body.hp32-branded.hp48-public main section.hp4-section.dark,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-container {
  color: #f8fbff !important;
}
/* Correct the broad v32 selector on genuinely dark sections. */
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h1,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h2,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h3,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h4,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h5,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head h6,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head :is(h1,h2,h3,h4,h5,h6) :is(strong,span,em,b) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head > p,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-section-head > div > p,
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-card > p {
  color: #d6e5f7 !important;
  -webkit-text-fill-color: #d6e5f7 !important;
  opacity: 1 !important;
}
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-card :is(h2,h3,h4),
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-card :is(h2,h3,h4) :is(strong,span,em) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body.hp32-branded.hp48-public main section.hp4-section.dark .hp4-kicker {
  color: #b8daff !important;
  -webkit-text-fill-color: #b8daff !important;
}
/* Dark CTA banners that appear in otherwise light sections. */
body.hp32-branded.hp48-public main .hp-cta-band :is(h1,h2,h3),
body.hp32-branded.hp48-public main .hp-cta-band :is(h1,h2,h3) :is(span,strong,em) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
body.hp32-branded.hp48-public main .hp-cta-band p {
  color: #d6e5f7 !important;
  -webkit-text-fill-color: #d6e5f7 !important;
}
body.hp32-branded.hp32-help-page main .hp-cta-band :is(h1,h2,h3) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
/* Explicit light-surface protection: the global dark rules must not
   recolour white cards or headings on white backgrounds. */
body.hp32-branded.hp48-public main section.hp4-section.white .hp4-section-head :is(h1,h2,h3),
body.hp32-branded.hp48-public main section.hp4-section:not(.dark) .hp4-section-head :is(h1,h2,h3) {
  color: #13243d !important;
  -webkit-text-fill-color: #13243d !important;
}