/*
 * HMVIP Landing — S01 hero over a native SR6 module (ADR-017). Loaded only when
 * S01Sr6HeadPresenter::resolve() binds a module (admin-only candidate preview).
 * Ported from tools/sr6-lab-compiler/wp-lab-template (lab-verified: 320-1920 px, with and without JS).
 *
 * Layout: one-cell CSS grid. The SR6 module, the static fallback and the UI share the cell,
 * so the section is as tall as the tallest of them and the CTAs are never clipped.
 */
.hmc-stage-s01.hmc-s01-sr6 { background: #0b070e; }
.hms01 { position: relative; display: grid; color: #fff; font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; overflow: hidden; background: #0b070e; }
.hms01 > * { grid-area: 1 / 1; min-width: 0; }
.hms01 > script, .hms01 > .rs-p-wp-fix { display: none; }
.hms01-ui { position: relative; z-index: 20; pointer-events: none; }
/* Legibility scrim owned by WordPress (G1): smoke may pass behind the copy column. */
.hms01-scrim { position: absolute; inset: 0; z-index: 15; pointer-events: none;
  background: linear-gradient(90deg, rgba(11,7,14,.88) 0%, rgba(11,7,14,.72) 32%, rgba(11,7,14,0) 52%); }
.hms01-wrap { position: relative; max-width: 1240px; height: 100%; margin: 0 auto; padding: 0 32px; box-sizing: border-box; }
.hms01 a { pointer-events: auto; color: inherit; text-decoration: none; }
.hms01-header { display: flex; align-items: center; gap: 48px; height: 78px; }
.hms01-mark { font-weight: 800; font-size: 22px; letter-spacing: -.02em; }
.hms01-mark span, .hms01 .pink { color: #e72b6c; }
.hms01-nav { display: flex; gap: 28px; font-size: 14px; color: rgba(255,255,255,.82); }
.hms01-nav a:hover, .hms01-nav a:focus-visible { color: #fff; }
.hms01-account { margin-left: auto; display: flex; gap: 10px; }
.hms01-pill { border: 1px solid rgba(255,255,255,.75); border-radius: 999px; padding: 6px 14px; font-size: 13px; white-space: nowrap; }
.hms01-pill.primary { background: #e72b6c; border-color: #e72b6c; }
.hms01-copy { position: absolute; left: 32px; top: 112px; max-width: 470px; }
.hms01-copy h1 { margin: 0; font-weight: 800; font-size: clamp(40px, 5.4vw, 74px); line-height: .9; letter-spacing: -.035em; text-transform: uppercase; color: #fff; }
.hms01-copy h1 span { display: block; }
.hms01-copy p { margin: 22px 0 0; font-size: 16px; line-height: 1.45; color: rgba(255,255,255,.9); max-width: 450px; }
.hms01-ctas { display: flex; align-items: center; gap: 18px; margin-top: 34px; }
.hms01-cta { border-radius: 999px; padding: 12px 22px; font-size: 14px; font-weight: 700; }
.hms01-cta.primary { background: #e72b6c; }
.hms01-cta.secondary { display: inline-flex; align-items: center; gap: 10px; padding-left: 0; }
.hms01-cta.secondary::before { content: "\25B6"; display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid #e72b6c; border-radius: 50%; color: #e72b6c; font-size: 9px; }
.hms01 a:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.hms01-labels { position: absolute; right: 32px; top: 46%; display: grid; gap: 10px; font-size: 11px; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.55); text-align: right; }
.hms01-scroll { position: absolute; right: 40px; bottom: 26px; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; display: grid; place-items: center; font-size: 14px; color: rgba(255,255,255,.7); }
@media (max-width: 360px) { .hms01-mark { font-size: 19px; } .hms01-pill { padding: 6px 10px; font-size: 12px; } .hms01-account { gap: 6px; } }
/* Mobile and tablet: copy in normal flow at the top, CTAs at the bottom of the section. */
@media (max-width: 778px) {
  .hms01-scrim { background: linear-gradient(180deg, rgba(11,7,14,.85) 0%, rgba(11,7,14,.6) 36%, rgba(11,7,14,0) 52%, rgba(11,7,14,0) 78%, rgba(11,7,14,.7) 100%); }
  .hms01-nav, .hms01-labels, .hms01-scroll { display: none; }
  .hms01-wrap { display: flex; flex-direction: column; padding: 0 20px; }
  .hms01-header { gap: 16px; height: 64px; flex: none; }
  .hms01-copy { position: static; display: flex; flex-direction: column; flex: 1; max-width: none; padding-top: 20px; }
  .hms01-copy p { font-size: 14px; max-width: 300px; }
  .hms01-ctas { margin-top: auto; padding: 24px 0 28px; flex-direction: column; align-items: flex-start; gap: 12px; }
}
/* Video mode, phones: the figure is knees-up, so the CTAs follow the copy. */
@media (max-width: 480px) { .hms01--video .hms01-ctas { margin-top: 22px; padding: 0 0 24px; } }
@media (prefers-reduced-motion: reduce) { .hms01 * { animation: none !important; transition: none !important; } }
/* Static fallback (no JavaScript or SR6 not rendered). Boxes per breakpoint come inline. */
.hms01-static { display: none; position: relative; z-index: 1; overflow: hidden; pointer-events: none; }
.hms01.is-static .hms01-static { display: block; }
.hms01.is-static sr7-module { display: none !important; }
.hms01-static-grid { position: relative; margin: 0 auto; }
.hms01-static img { position: absolute; display: block; max-width: none; }
/* Video guard states (data-s01-video-state on the section). */
.hms01.s01-video-still .hms01-l-video { visibility: hidden !important; }
.hms01.s01-video-still .hms01-l-still { opacity: 1 !important; visibility: visible !important; }
/* SR7 keeps its sr7-poster visible during playback: hide it once the alpha-proven video plays. */
.hms01.s01-video-on .hms01-l-video sr7-poster { opacity: 0 !important; visibility: hidden !important; }
