/* HOME-S1: compact navigation with actual 44px hit areas. */
@media (max-width: 1279px) {
  #nav a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; min-width: 44px; }
  #nav .nav-r { gap: 16px; }
  #nav .nav-login, #nav .nav-link { padding-block: 12px; }
  #s5 .tc-cta a, #s8 .f-link { display: inline-flex; align-items: center; min-height: 44px; min-width: 44px; }
  #s8 .f-link { font-size: 14px; }
  #s7 .pack-save, #s7 .pack-badge { font-size: 14px; }
}

/* HOME-S4: native scrolling for portrait tablets and touch devices. */
@media (max-width: 1279px) {
html.hs-flow #page-driver { height: auto !important; }
html.hs-flow #page-sticky { position: relative !important; top: auto !important; height: auto !important; overflow: visible !important; }
html.hs-flow .slide { position: relative !important; inset: auto !important; width: 100% !important; height: auto !important; min-height: 0 !important; opacity: 1 !important; pointer-events: auto !important; display: flex !important; overflow: hidden; }
html.hs-flow #s8.m-flow { background: radial-gradient(ellipse 55% 42% at 50% 60%, rgba(206,123,145,.14) 0%, rgba(206,123,145,0) 70%); }
html.hs-flow #feat-strip { display: none; }
html.hs-flow #salt-trace { display: none; }
html.hs-flow #s5 .mm-reveal, html.hs-flow #s5 .mm-reveal em,
html.hs-flow #s7 .mm-reveal, html.hs-flow #s7 .mm-reveal em,
html.hs-flow #s8 .mm-reveal, html.hs-flow #s8 .mm-reveal em { background-position: 0% 0 !important; animation: none !important; transition: none !important; }

  /* One still list replaces the console on phones and flow-mode tablets. */
  html.hs-flow #s5 .tc-shell { display: none; }
  html.hs-flow #s5 .home-sol-why { display: block !important; }
  html.hs-flow #s5 .tc-eyebrow-m { display: block; margin: 0 0 10px; font-family: 'Space Mono','Space Mono Fallback', monospace; }
  #s5 .home-sol-why ol { list-style: none; margin: 0; padding: 0; }
  #s5 .home-sol-why li { padding: 12px 0; border-bottom: 1px solid rgba(251,251,251,.16); }
  #s5 .home-sol-why h3 { font: 400 20px/1.25 'Fraunces','Fraunces Fallback','Fraunces Fallback Android', serif; color: #FBFBFB; margin: 0 0 8px; }
  #s5 .home-sol-why p { font: 400 16px/1.5 'Inter Tight','Inter Tight Fallback', sans-serif; color: rgba(251,251,251,.8); margin: 0; }
  #s5 .home-sol-why a { display: inline-flex; align-items: center; min-height: 44px; margin-top: 8px; font-size: 16px; color: #FBFBFB; text-decoration: underline; text-underline-offset: 4px; }
  #s7 .home-sol-pr-foot { display: none; }

  /* r4 · s6 Hiring Intelligence (from main) in flow mode: the heading sweep never runs
     in flow, so it rests finished (it showed at 20% ink on tablets); links and slider
     arrows are real 44px boxes; type meets the 16px body / 13px mono floors. */
  html.hs-flow #s6 .mm-reveal, html.hs-flow #s6 .mm-reveal em { background-position: 0% 0 !important; animation: none !important; transition: none !important; }
  html.hs-flow #s6 .s6-sub { font-size: 16px; line-height: 1.5; }
  html.hs-flow #s6 .s6-kick { font-size: 13px; }
  html.hs-flow #s6 .s6-cta { align-items: center; gap: 10px; }
  html.hs-flow #s6 .s6-cta-main,
  html.hs-flow #s6 .s6-cta-aside { min-height: 44px; max-width: 100%; justify-content: center; text-align: center; }
  html.hs-flow #s6 .s6-lk { display: inline-flex; align-items: center; min-height: 44px; padding: 0; border-bottom: 0; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 5px; text-decoration-color: #1B1B1F; }
  html.hs-flow #s6 .s6-cta-main, html.hs-flow #s6 .s6-lk { font-size: 16px; }
  html.hs-flow #s6 .s6-cta-aside { font-size: 14px; }
  html.hs-flow #s6 .s6-lk { margin-top: 4px; }
  html.hs-flow #s6 .s6-cd { font-size: 16px; }
  html.hs-flow #s6 .s6-nb { --nb: 44px; }
  html.hs-flow #s6 .s6-num-ctl { position: static; margin: 0 0 0 -2px; }
  html.hs-flow #s6 .s6-num-tag { padding-right: 0; }
  html.hs-flow #s6 .s6-num-tag, html.hs-flow #s6 .s6-num-m, html.hs-flow #s6 .s6-chip { font-size: 13px; }
  html.hs-flow #s6 .s6-num-t, html.hs-flow #s6 .s6-rows li { font-size: 16px; }
  html.hs-flow #s6 .s6-not, html.hs-flow #s6 .s6-notes, html.hs-flow #s6 .s6-node { font-size: 14px; }
  html.hs-flow #s6 .s6-card, html.hs-flow #s6 .s6-vis,
  html.hs-flow #s6 .s6-num-item, html.hs-flow #s6 .s6-ar { transition: none; }
}

/* r4 · s6 on upright tablets: three 190px columns of 11-14px type become one column of
   wide cards, the copy and link left and the card's proof right. */
@media (min-width: 768px) and (max-width: 1023px) {
  html.hs-flow #s6 .s6-cards { grid-template-columns: 1fr; }
  html.hs-flow #s6 .s6-card {
    display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
    grid-template-rows: auto auto 1fr; column-gap: 28px; align-items: start;
  }
  html.hs-flow #s6 .s6-ct, html.hs-flow #s6 .s6-cd, html.hs-flow #s6 .s6-lk { grid-column: 1; }
  html.hs-flow #s6 .s6-lk { justify-self: start; }
  html.hs-flow #s6 .s6-vis { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; align-self: stretch; }
}

@media (min-width: 768px) and (max-width: 1279px) {
  html.hs-flow .slide { padding-block: 32px; }
  html.hs-flow #s5, html.hs-flow #s7, html.hs-flow #s8 { padding-block: 24px; }
  html.hs-flow #s0 { padding-top: 100px; }
  html.hs-flow #s5 .tc-inner { padding: 0 32px; }
  html.hs-flow #s5 .home-sol-why ol { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
  html.hs-flow #s5 .home-sol-why li:last-child { grid-column: 1 / -1; }
  html.hs-flow #s4 .s4x-tab { min-height: 44px; min-width: 44px; }
  html.hs-flow #s7 #s7-inner { padding: 0 32px; }
  html.hs-flow #s7 #pr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 24px !important; }
  html.hs-flow #s7 #pr-zone-subscribe { grid-column: 1 / -1 !important; }
  html.hs-flow #s7 #pr-stage { min-height: 0 !important; }
  /* Retained tablet cards follow the brief's body and secondary type floors. */
  html.hs-flow #s7 .pack-desc, html.hs-flow #s7 .pack-buy-btn { font-size: 16px; }
  html.hs-flow #s7 .pr-feat { font-size: 16px !important; }
  html.hs-flow #s7 .pack-resumes, html.hs-flow #s7 .pack-per-resume,
  html.hs-flow #s7 .pack-tag, html.hs-flow #s7 .pr-foot,
  html.hs-flow #s7 .pr-feat-more { font-size: 14px; }
  html.hs-flow #s8 .cta-footer { position: relative; }
  html.hs-flow #s8 .cta-note, html.hs-flow #s8 .f-copy { font-size: 14px; }
}

/* HOME-S5: comfortable controls in the smaller desktop composition. */
@media (min-width: 1024px) and (max-width: 1279px) {
  #s4 .s4x.s4x-mw .s4x-tab, #s4 .s4x-tab, #s5 .tc-nav-item, .hero-steps button { min-height: 44px; min-width: 44px; }
  /* The deck fit script can scale this console to .72: preserve 44px on screen. */
  html:not(.hs-flow) #s5 .tc-nav-item, html:not(.hs-flow) #s5 .tc-cta a { min-height: 62px; }
}

@media (max-width: 767px) {
  /* r4 S-E: a 60px bar so Log in and the pill are real 44px boxes (8px air each side) */
  #nav { height: 60px; padding-inline: 16px; }
  #nav .nav-r { gap: 8px; }
  #nav .nav-link { display: none; }
  #nav .nav-login { font-size: 16px; padding-inline: 1px; min-width: 44px; }
  #nav .nav-cta { padding: 10px 16px; font-size: 16px; }
  #nav .nav-login, #nav .nav-cta { height: auto; min-height: 44px; box-sizing: border-box; }
  #nav .nav-login, #nav .nav-cta { white-space: nowrap; flex-shrink: 0; }
  #nav .nav-logo { min-width: 0; }
  #nav .nav-logo { gap: 5px; justify-content: flex-start; }
  #nav .logo-text { font-size: 22px; }
  #nav .salt-mark--nav { width: 28px; height: 28px; }

  /* r4 S-B: The case on phones, compact: the three headlines and the one mid-page
     sign-up link (body lines stay on tablets). */
  #s5.m-flow { padding: 24px 0 8px; }
  #s5.m-flow .tc-inner { padding: 0 20px; }
  #s5 .tc-shell { display: none; }
  #s5 .home-sol-why { display: block !important; }
  #s5 .home-sol-why li { padding: 10px 0; }
  #s5 .home-sol-why h3 { font-size: 18px; line-height: 1.3; margin: 0; }
  #s5 .home-sol-why p { display: none; }
  #s5 .home-sol-why a { margin-top: 4px; }
  #s5 .tc-eyebrow-m, #s7 .pr-eye, #s8 .cta-label { font-family: 'Space Mono','Space Mono Fallback', monospace; }

  /* r4 · s6 on phones, condensed: one light panel instead of panel > card > box. The
     cards become ruled sections, their one-line descriptions go (the headline and the
     link say it), the proof boxes lose their fill and padding. All proof stays. */
  #s6.m-flow { padding: 32px 16px 24px; }
  #s6 .s6-panel { padding: 24px 18px 8px; }
  #s6 .s6-cta { margin-top: 8px; }
  #s6 .s6-cards { gap: 0; margin-top: 12px; }
  #s6 .s6-card, #s6 .s6-card:hover { background: transparent; border-radius: 0; padding: 18px 0 20px; border-top: 1px solid #E7E2E3; }
  #s6 .s6-cd { display: none; }
  #s6 .s6-vis, #s6 .s6-card:hover .s6-vis { background: transparent; border-radius: 0; padding: 0; margin-top: 12px; gap: 12px; }
  #s6 .s6-rows { gap: 0; }
  #s6 .s6-rows li { padding: 6px 0; background: transparent; border-radius: 0; }


  #s7.m-flow { padding: 24px 0 8px; }
  #s7.m-flow #s7-inner { padding: 0 20px; align-items: stretch; }
  #s7 .pr-eye, #s7 .pr-h, #s7 .pr-sub { text-align: left; }
  #s7 .pr-sub { font-size: 16px; line-height: 1.5; margin: 4px 0 12px; text-wrap: balance; }
  #s7 .home-sol-pr-foot { display: inline; }
  #s7 .home-sol-pr-foot-full { display: none; }
  #s7 .pr-toggle { align-self: flex-start; margin: 0 0 12px; }
  #s7 .pr-tbtn { min-height: 44px; font-size: 16px; }
  #s7 #pr-stage { min-height: 0 !important; }
  #s7 #pr-grid { grid-template-columns: 1fr !important; gap: 0 !important; margin-bottom: 0 !important; }
  #s7 #pr-zone-subscribe > div { grid-template-columns: 1fr !important; gap: 0 !important; }
  #s7 .pack-card {
    display: grid; grid-template-columns: minmax(0, 1fr) 132px; gap: 2px 12px;
    padding: 10px 0; border: 0; border-top: 1px solid rgba(251,251,251,.22); border-radius: 0;
    background: transparent; box-shadow: none; transform: none !important; --lift: 0px;
    text-align: left;
  }
  #s7 .pack-tag, #s7 .pack-price-amt, #s7 .pack-per-resume { justify-self: start; text-align: left; }
  #s7 #pr-zone-subscribe .pack-card { display: grid !important; }
  #s7 .pack-card[style*="display: none"] { display: none; }
  #s7 .pack-card > .mb-6, #s7 .pack-desc, #s7 .pack-flash { display: none; }
  #s7 .pr-feats { display: none !important; }
  #s7 .pack-badges { position: static; grid-column: 1 / -1; grid-row: 1; justify-content: flex-start; margin-bottom: 4px; }
  #s7 .pack-badge { padding: 0; background: transparent; border-radius: 0; font: 400 14px/1.5 'Space Mono','Space Mono Fallback', monospace; letter-spacing: .08em; }
  #s7 .pack-tag { grid-column: 1; grid-row: 2; align-self: baseline; padding: 0; background: transparent; color: #FBFBFB; font-size: 16px; }
  #s7 .pack-resumes { grid-column: 2; grid-row: 2; align-self: baseline; margin: 0; text-align: right; font-size: 14px; letter-spacing: 0; text-transform: none; color: rgba(251,251,251,.8); }
  #s7 .pack-price-amt { grid-column: 1; grid-row: 3; font: 500 24px/1.2 'Space Grotesk','Space Grotesk Fallback', sans-serif; margin: 0; }
  #s7 .pack-per-resume { grid-column: 1; grid-row: 4; display: block; margin: 0; font-size: 14px; line-height: 1.4; }
  #s7 .pack-save { display: block; padding: 0; margin-top: 2px; background: transparent; font: 400 14px/1.5 'Space Mono','Space Mono Fallback', monospace; letter-spacing: 0; }
  #s7 .pack-buy-btn { grid-column: 2; grid-row: 3 / span 2; align-self: center; display: flex; align-items: center; justify-content: center; min-height: 44px; padding: 8px; margin: 0; font-size: 16px; }
  #s7 .pack-card--free .pack-price-amt { grid-row: 2; align-self: baseline; }
  #s7 .pack-card--free .pack-per-resume { grid-row: 3; }
  #s7 .pack-card--free .pack-buy-btn { grid-row: 3; }
  #s7 #pr-zone-subscribe .pack-card { row-gap: 0; padding-block: 8px; }
  #s7 #pr-zone-subscribe .pack-badges { margin-bottom: 0; }
  #s7 #pr-zone-subscribe .pack-desc { display: block; grid-column: 1 / -1; grid-row: 5; margin: 4px 0 0; font-size: 16px; line-height: 1.5; }
  #s7 #pr-zone-subscribe .pr-feats { display: flex !important; grid-column: 1 / -1; grid-row: 6; margin: 0 !important; gap: 0 !important; }
  #s7 #pr-zone-subscribe .pr-feat { font-size: 16px !important; line-height: 1.375; }
  #s7 #pr-zone-subscribe .pr-feat:nth-child(n+4) { display: none !important; }
  #s7 #pr-zone-subscribe .pr-feat-more { display: block !important; font-size: 14px; line-height: 1.5; }
  #s7 .home-sol-feat-more { display: inline; }
  #s7 .home-sol-feat-more-full { display: none; }
  #s7 .pr-foot { font-size: 14px; line-height: 1.5; margin-top: 8px; }
  /* Keep one existing closing line still while the desktop rotator runs hidden. */
  #s8 #cta-rotate { display: none; }
  #s8.m-flow { padding: 0 !important; }
  #s8 #s8-inner { padding: 40px 20px 8px; }
  #s8 .cta-label { margin-bottom: 8px; }
  #s8 .home-sol-cta { display: block !important; font: 400 clamp(26px, 6vw, 36px)/1.12 'Fraunces','Fraunces Fallback','Fraunces Fallback Android', serif; color: #FBFBFB; margin: 0 0 8px; }
  #s8 .home-sol-cta em { color: var(--p); }
  #s8 .cta-s, #s8 .btn-p-inv, #s8 .btn-ghost-inv { font-size: 16px; }
  #s8 .cta-s { line-height: 1.5; margin-bottom: 8px; }
  #s8 .cta-acts { gap: 8px; margin-bottom: 0; }
  #s8 .btn-p-inv, #s8 .btn-ghost-inv { min-height: 44px; padding-block: 10px; }
  #s8 .cta-note { font-size: 14px; line-height: 1.5; margin-top: 6px; letter-spacing: .02em; text-wrap: balance; }
  #s8 .cta-footer { display: grid; grid-template-columns: auto 1fr; gap: 4px 8px; margin-top: 10px; padding: 10px 0 0; text-align: left; }
  #s8 .f-logo { font-size: 16px; gap: 6px; }
  #s8 .f-logo .salt-mark { width: 22px; height: 22px; }
  #s8 .f-links { grid-column: 1 / -1; }
  #s8 .f-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 0 16px; text-align: left; }
  #s8 .f-link { display: flex; align-items: center; min-height: 44px; font-size: 16px; }
  #s8 .f-copy { font-size: 14px; text-align: right; }
  #s5 *, #s5 *::before, #s5 *::after, #s7 *, #s7 *::before, #s7 *::after, #s8 *, #s8 *::before, #s8 *::after { animation: none !important; transition: none !important; }
  #s7 .pr-pill { transition: transform 180ms ease-out !important; }
}

@media (max-width: 767px) and (prefers-reduced-motion: reduce) {
  #s7 .pr-pill { transition: none !important; }
}