/* Shared desktop design: Montserrat, warm surfaces, olive accents. */
:root {
  --navy: #41453c; --ink: #34372f; --muted: #626957;
  --blue: #606d4f; --line: #d7d4c5; --bg: #f1f0ea; --white: #fbfaf5;
  --accent-soft: #e4e7da; --text-on-dark: #e5e8dc;
  --header-offset: 98px; --radius-card: 24px; --radius-button: 18px;
}

/* Final mobile rhythm for the four opening cards.  Kept last to override legacy variants. */
@media (max-width:700px){
  body .hero-points > div,
  body .hero-points > div:last-child{
    display:block !important;
    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;
    padding:0 12px !important;
    overflow:hidden !important;
  }
  body .hero-points > div p{
    display:grid !important;
    grid-template-rows:11px 23px 11px 24px 11px !important;
    height:80px !important;
    min-height:80px !important;
    max-height:80px !important;
    margin:0 !important;
    padding:0 !important;
    gap:0 !important;
    overflow:hidden !important;
  }
  body .hero-points > div strong{
    order:unset !important;
    grid-row:2 !important;
    align-self:center !important;
    margin:0 !important;
    font-size:22px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    order:unset !important;
    grid-row:4 !important;
    display:block !important;
    align-self:start !important;
    min-height:24px !important;
    max-height:24px !important;
    margin:0 !important;
    overflow:hidden !important;
    font-size:10px !important;
    line-height:12px !important;
  }
}

/* Opening-card mobile specification: 5 px / amount / 5 px / caption / 5 px. */
@media (max-width:700px){
  body .hero-points > div,
  body .hero-points > div:last-child{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:5px 12px !important;
    overflow:visible !important;
  }
  body .hero-points > div p{
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    gap:5px !important;
    overflow:visible !important;
  }
  body .hero-points > div strong{
    order:0 !important;
    margin:0 !important;
    font-size:22px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    order:1 !important;
    display:block !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    overflow:visible !important;
    font-size:10px !important;
    line-height:12px !important;
  }
}

/* Opening-card mobile specification: 5 px / amount / 5 px / caption / 5 px. */
@media (max-width:700px){
  body .hero-points > div,
  body .hero-points > div:last-child{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:5px 12px !important;
    overflow:visible !important;
  }
  body .hero-points > div p{
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    gap:5px !important;
    overflow:visible !important;
  }
  body .hero-points > div strong{
    order:0 !important;
    margin:0 !important;
    font-size:22px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    order:1 !important;
    display:block !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    overflow:visible !important;
    font-size:10px !important;
    line-height:12px !important;
  }
}

@media (max-width:700px){
  body #salary .pay-card h3{
    font-size:15px!important;
  }
}

/* v46: the third payout link has one extra legacy class, so override it directly. */
@media (max-width:700px){
  body .salary-band #salary > a.button.primary.salary-apply.salary-apply-copy{
    width:100% !important;
    max-width:none !important;
    height:64px !important;
    min-height:64px !important;
    max-height:64px !important;
  }
}
@media (max-width:1024px){
  body #advantages > .info-grid > article.info-card,
  body #salary .pay-card,
  body #bonus .bonus-tile,
  body #jobs .topic-card,
  body #situations .documents-card,
  body #situations .documents-feature,
  body #foreign-documents .documents-card,
  body #foreign-documents .documents-feature,
  body #contacts .contact-card,
  body .referral-steps article,
  body .referral-note,
  body .hero-points > div{
    transition:none !important;
    animation:none !important;
    transform:none !important;
  }
}

/* v45: verified corrections for the 320–1024px pass. */
body #support .stages-grid .info-card{
  gap:0 !important;
}
body #support .stages-grid .info-card .stage-time{
  margin:0 !important;
}
body #support .stages-grid .info-card h3{
  margin:0 !important;
  padding-top:5px !important;
}
@media (max-width:700px){
  body .salary-band #salary > a.button:nth-of-type(1),
  body .salary-band #salary > a.button:nth-of-type(2),
  body .salary-band #salary > a.button:nth-of-type(3){
    width:100% !important;
    max-width:none !important;
  }
  body #advantages > .info-grid > article.info-card{
    transition:none !important;
    animation:none !important;
    transform:none !important;
  }
  body #advantages > .info-grid > article.info-card:hover{
    transform:none !important;
  }
}

@media (min-width:701px){
  body #referral > .wrap > .eyebrow,
  body #referral > .wrap > h2,
  body #contacts > .eyebrow,
  body #contacts > h2{
    text-align:left!important;
    margin-left:0!important;
    margin-right:0!important;
  }
}
html { scroll-padding-top: 0; }
body, button, input, select, textarea { font-family: 'Montserrat', Arial, sans-serif; }
body { color: var(--ink); }
body h1, body h2, body h3 { color: inherit; }
body h2 { font-size: clamp(32px,3.2vw,46px); font-weight: 500; line-height: 1.16; letter-spacing: -1.1px; }
body .eyebrow { line-height: 1.5; }
body a:focus-visible, body button:focus-visible, body summary:focus-visible { outline: 2px solid #899a70; outline-offset: 4px; }
body a, body button { -webkit-tap-highlight-color: transparent; }
body .header { background: var(--navy); }
body .header.scrolled { box-shadow: 0 6px 20px #252b201a; }
body .header nav a { color: var(--text-on-dark); }
body .header .brand { font-size: 0 !important; gap: 10px; }
body .header .brand::after { content: 'КАДРОВЫЙ ШТАБ'; font-size: 16px; letter-spacing: .7px; }
body .header .brand-mark { font-size: 16px !important; }
body .header nav a:hover, body .header nav a[aria-current] { color: #fff; }
body .header nav a[aria-current] { text-decoration: underline; text-underline-offset: 7px; text-decoration-color: #bdc8ad; }
body .header-social a { background: var(--white); }
body [aria-disabled="true"] { cursor: not-allowed !important; opacity: .55; }
body .button, body .card-link, body .documents-button { min-height: 46px; line-height: 1.35; font-weight: 600; text-align: center; justify-content: center; }
body .button.primary { background: var(--blue); color: var(--white); border-color: var(--blue); }
body .button.primary:hover { background: #505e40; transform: none; }
body .hero .eyebrow, body .hero h1, body .hero .lead { color: #fff !important; }
body .hero-actions .button { min-height: 46px !important; height: auto !important; }
body .hero-points>div p { display: flex !important; flex-direction: column; gap: 14px; position: static !important; width: 100%; align-self: flex-start !important; }
body .hero-points>div .hero-card-label { position: static !important; top: auto !important; order: 2; color: #f4f5ee; line-height: 1.5; }
body .hero-points>div strong { order: 1; margin: 0 !important; font-size: clamp(22px,2.05vw,28px) !important; font-weight: 700 !important; letter-spacing: -.5px !important; }
body .hero-points>div small { color: #e4e8da; }
body .section-heading { margin-bottom: 32px; }
body .section-heading > p, body .jobs-heading-row > p { color: var(--muted) !important; font-weight: 400; }
body .info-card, body .pay-card, body .documents-card, body .foreign-payout, body .foreign-benefits, body .referral-note, body .referral-steps article, body .contact-card, body .contact-form { border-color: var(--line) !important; border-radius: var(--radius-card); box-shadow: none !important; }
body #advantages .info-card, body #salary .pay-card, body #bonus .bonus-tile { cursor: default !important; }
body #advantages .info-card:hover, body #salary .pay-card:hover, body #bonus .bonus-tile:hover { transform: translateY(-3px) !important; box-shadow: 0 8px 20px #34372f10 !important; }
body #advantages .info-card .item-no { color: var(--blue) !important; font-size: 14px !important; }
body #advantages .info-card .item-no::before, body #advantages .info-card .item-no::after { content: none !important; }
body #advantages .info-card h3, body #salary .pay-card h3, body #support .stages-grid h3 { color: var(--ink) !important; font-size: 22px !important; font-weight: 600 !important; line-height: 1.25 !important; letter-spacing: -.55px !important; }
body #advantages .info-card p, body #salary .pay-card p, body #support .stages-grid p { color: var(--muted) !important; font-size: 16px !important; line-height: 1.6 !important; }
body .salary-band, body .prepare-section { background: var(--navy) !important; color: var(--white) !important; }
body #salary .section-heading .eyebrow, body #support .section-heading .eyebrow { color: #c8d1b7 !important; }
body #salary .section-heading > p, body #support .section-heading > p { color: var(--text-on-dark) !important; }
body #salary .section-heading h2, body #support .section-heading h2, body #support .support-columns h3 { color: var(--white) !important; }
body #salary .pay-value { color: var(--ink) !important; font-size: clamp(30px,3vw,40px) !important; font-weight: 700 !important; line-height: 1.12 !important; letter-spacing: -1px; margin: 0 0 20px !important; }
body #salary .condition-row strong { color: var(--text-on-dark) !important; font-size: 15px; }
body #salary .condition-row strong { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
body #salary .condition-row span { color: var(--white) !important; font-size: clamp(24px,2.5vw,34px) !important; font-weight: 600 !important; line-height: 1.2 !important; }
body #salary .condition-row { margin-bottom: 18px !important; }
body #salary .condition-row + .button { margin-top: 0 !important; }
body #salary .button { border-radius: var(--radius-button) !important; }
body #salary .button.secondary { background: transparent !important; color: var(--white) !important; border: 1px solid #b7c1a5 !important; }
body #salary .button.secondary:hover { background: #ffffff0e !important; }
body #bonus .bonus-tile { border-radius: var(--radius-card) !important; }
body #bonus .bonus-tile.is-active { background: var(--blue) !important; border-color: var(--blue) !important; }
body #bonus .bonus-tile h3 { font-weight: 600 !important; font-size: 23px !important; }
body #bonus .bonus-tile-icon { background: var(--accent-soft) !important; }
body #bonus .bonus-tile-icon img { filter: grayscale(1); object-fit: contain; }
body #bonus .bonus-tile.is-active .bonus-tile-icon { background: #ffffff24 !important; }
body #bonus .bonus-tile.is-active .bonus-tile-icon img { filter: brightness(0) invert(1) !important; }
body #support .stages-grid .info-card { background: var(--white) !important; }
body #support .stages-grid .item-no { background: var(--blue) !important; color: var(--white) !important; font-weight: 600; }
body #support .stages-grid .stage-time { background: var(--accent-soft) !important; color: #465239 !important; font-size: 13px; line-height: 1.3; }
body #support .support-columns { border-color: #ffffff30; }
body #support .support-columns article>p { color: var(--text-on-dark) !important; font-size: 15px !important; background: #ffffff09 !important; border-left-color: #b0bd9a !important; }
body #support .support-columns li { color: var(--text-on-dark) !important; }
body #jobs .metric-number { color: var(--blue) !important; }
body #jobs .metric-label { color: var(--muted) !important; }
body #jobs .photo-card { background: var(--navy) !important; isolation: isolate; border-radius: 26px !important; }
body #jobs .photo-card::before { background: linear-gradient(180deg,#29302330 0%,#2b322651 18%,#272e24ed 49%,#242b21 100%) !important; }
body #jobs .photo-card .card-photo { filter: saturate(.55); }
body #jobs .photo-card h3 { color: var(--white) !important; font-size: 26px !important; font-weight: 600 !important; line-height: 1.2 !important; }
body #jobs .photo-card p, body #jobs .job-pay small { color: #e5e8dc !important; font-size: 16px !important; line-height: 1.55 !important; }
body #jobs .job-pay { color: var(--white) !important; font-size: 26px; font-weight: 600; }
body #jobs .card-index { background: #fbfaf526 !important; color: #fff !important; border-color: #fbfaf552 !important; }
body #jobs .card-link { border-radius: 18px !important; background: #fbfaf50c !important; border: 1px solid #c6ceb780 !important; color: #fff !important; min-height: 46px !important; font-size: 15px !important; font-weight: 600 !important; }
body #jobs .card-link:hover { background: #fbfaf51c !important; }
body .documents-redesign, body .referral-section { background: var(--bg) !important; color: var(--ink) !important; }
body .documents-redesign .documents-feature, body .documents-redesign .documents-feature-dark, body .referral-reward, body .contact-phone-card { background: var(--blue) !important; color: var(--white) !important; }
body .documents-redesign .documents-feature p, body .documents-redesign .documents-feature-dark li, body .contact-phone-card p { color: #f3f4ed !important; }
body .documents-feature .documents-icon img { filter: brightness(0) invert(1); }
body .documents-redesign h3, body .referral-note h3, body .referral-steps h3 { font-size: 24px !important; font-weight: 600 !important; line-height: 1.25 !important; letter-spacing: -.6px !important; }
body .documents-redesign .documents-button { border-radius: 14px !important; color: var(--ink) !important; background: var(--white) !important; min-height: 48px !important; font-weight: 600 !important; }
body .documents-redesign .documents-button:hover { background: var(--accent-soft) !important; }
body .documents-number { color: var(--muted) !important; }
body .foreign-payout strong { color: var(--ink) !important; font-size: clamp(32px,3.6vw,46px) !important; font-weight: 600 !important; line-height: 1.15 !important; letter-spacing: -1px; }
body .foreign-benefits { color: var(--ink) !important; }
body .foreign-heading p, body .faq-disclaimer, body .jobs-disclaimer { background: var(--accent-soft) !important; color: var(--muted) !important; border-left-color: #89966d !important; border-radius: 0 10px 10px 0; font-size: 15px !important; line-height: 1.55 !important; }
body .faq-section details { border-color: var(--line) !important; }
body .faq-section summary { color: var(--ink) !important; font-size: 18px !important; font-weight: 600 !important; line-height: 1.45 !important; }
body .faq-section details p { color: var(--muted) !important; font-size: 16px !important; line-height: 1.6 !important; }
body .faq-section details[open] p { background: var(--accent-soft) !important; }
body .faq-section summary span { background: var(--accent-soft) !important; color: #465239 !important; }
body .referral-section h2, body .referral-section h3 { color: var(--ink) !important; }
body .referral-section>.wrap>h2, body #contacts>h2 { font-size: clamp(32px,3.2vw,46px) !important; font-weight: 500 !important; line-height: 1.16 !important; letter-spacing: -1.1px !important; }
body .referral-steps b { color: var(--blue) !important; background: var(--accent-soft) !important; font-size: 18px !important; font-weight: 600 !important; }
body .referral-note { background: var(--accent-soft) !important; }
body .referral-reward>span { font-weight: 600 !important; }
body .referral-reward strong { font-size: 64px !important; font-weight: 700 !important; color: var(--white) !important; }
body .referral-form { padding: 48px 40px; border-radius: var(--radius-card); border-color: var(--line); }
body .referral-form { margin-top: 24px !important; }
body .referral-section { padding-bottom: 10px !important; }
body #contacts { padding-top: 0 !important; }
body #contacts { margin-top: -50px !important; }
body #referral { margin-top: -50px !important; }
body #foreign-documents { margin-top: -50px !important; }
body .referral-form h2 { font-size: 30px !important; line-height: 1.25 !important; }
body .referral-fields { margin-top: 28px; }
body #contacts>h2 { color: var(--ink) !important; margin-top: 12px !important; }
body #contacts>.eyebrow { margin-bottom: 12px !important; }
body #contacts>.contacts-lead { font-size: 16px !important; line-height: 1.6 !important; color: var(--muted) !important; margin-top: 20px; max-width: 740px; }
body .contact-card h3, body .contact-form h3, body .contact-form>label, body .contact-form legend, body .contact-form fieldset label { color: var(--ink) !important; }
body .contact-card h3 { font-size: 30px !important; line-height: 1.25 !important; font-weight: 600 !important; letter-spacing: -.6px; }
body .contact-phone-card h3 { color: var(--white) !important; font-size: clamp(28px,2.7vw,38px) !important; white-space: nowrap; }
body .contact-card.social-card h3 { font-size: 25px !important; font-weight: 650 !important; text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1px; }
body .contact-card.contact-note .free-consultation { white-space: nowrap; }
body .contact-card.social-card .social-links a { min-height: 34px !important; padding: 6px 10px !important; font-size: 14px !important; }
body .contact-card.social-card .social-links { justify-content: flex-start !important; gap: 10px !important; }
body .contact-card.social-card .social-links a { flex: 0 0 104px !important; width: 104px !important; padding-left: 16px !important; padding-right: 16px !important; }
body .contact-card.social-card .social-links a:nth-child(3) { flex-basis: 84px !important; width: 84px !important; padding-left: 8px !important; padding-right: 8px !important; }
body .contact-card.social-card .social-links a:nth-child(-n+2) { flex-basis: 112px !important; width: 112px !important; padding-left: 18px !important; padding-right: 18px !important; }
body .contact-card.social-card { display: grid !important; grid-template-rows: auto 1fr auto; }
body .contact-card.social-card .social-lead { align-self: center; margin: 0 !important; transform: translateY(16px); }
body .contact-card.social-card .social-links { margin-top: 18px !important; }
body .contact-card p { color: var(--muted); font-size: 16px !important; line-height: 1.6 !important; }
body .contact-card-label { color: #465239 !important; background: var(--accent-soft) !important; font-size: 12px !important; }
body .contact-form h3 { font-size: 30px !important; font-weight: 600 !important; margin-bottom: 24px; }
body .contact-form input:not([type=radio]):not([type=checkbox]), body .contact-form select, body .referral-fields input { color: var(--ink) !important; background: #e9ebdf !important; font-size: 16px !important; line-height: 1.5; font-weight: 400; min-height: 50px !important; border: 1px solid #c6ccb9 !important; border-radius: 12px !important; padding: 12px 16px !important; margin-top: 8px; width: 100%; }
body .contact-form input::placeholder, body .referral-fields input::placeholder { color: #6c7263; opacity: 1; }
body .contact-form input:not([type=radio]):not([type=checkbox]):focus, body .contact-form select:focus, body .referral-fields input:focus { outline: none !important; border-color: var(--blue) !important; box-shadow: 0 0 0 2px #606d4f40 !important; background: #e4e8d9 !important; }
body .phone-field { display: flex; align-items: center; gap: 8px; margin-top: 8px; padding-left: 16px; border: 1px solid #c6ccb9; border-radius: 12px; background: #e9ebdf; min-height: 50px; }
body .phone-field .phone-prefix { color: var(--ink) !important; font-size: 16px; font-weight: 400; user-select: none; flex-shrink: 0; }
body .contact-form .phone-field input, body .referral-fields .phone-field input { min-width: 0; margin: 0 !important; padding: 12px 12px 12px 0 !important; background: transparent !important; border: 0 !important; outline: 0 !important; box-shadow: none !important; border-radius: 0 12px 12px 0 !important; }
body .contact-form .phone-field input:focus, body .referral-fields .phone-field input:focus { border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important; }
body .phone-field:focus-within { border-color: var(--blue); box-shadow: 0 0 0 2px #606d4f40; background: #e4e8d9; }
body .contact-form input[type=radio] { width: 22px; height: 22px; accent-color: var(--blue); outline: none !important; box-shadow: none !important; }
body .contact-form fieldset label { gap: 8px; margin: 12px 24px 0 0; }
body .contact-form fieldset label:focus-within { text-decoration: underline; text-underline-offset: 4px; }
body .contact-form .privacy-consent { display: flex !important; align-items: flex-start !important; gap: 12px; font-weight: 400; }
body .contact-form input[type=checkbox], body .referral-form input[type=checkbox] { width: 18px !important; height: 18px !important; min-height: 18px !important; flex: 0 0 18px; margin: 3px 0 0 !important; padding: 0 !important; accent-color: var(--blue); box-shadow: none !important; }
body .privacy-consent-text { color: var(--muted) !important; font-size: 13px !important; line-height: 1.6; font-weight: 400; }
body .privacy-consent-text a { color: #48573b !important; text-decoration: underline; text-underline-offset: 3px; }
body .required-mark { color: #a44535 !important; }
body .required-mark.is-complete { color: var(--blue) !important; }
body .contact-form .button, body .referral-form>.button { background: var(--blue) !important; border: 0 !important; border-radius: var(--radius-button) !important; color: #fff !important; font-weight: 600 !important; min-height: 48px !important; }
body .contact-form .button:hover, body .referral-form>.button:hover { background: #505e40 !important; }
body .form-feedback, body .contact-form .phone-status { color: var(--muted) !important; font-size: 14px; line-height: 1.6; margin-top: 16px; }
body .form-feedback:empty { display: none; }
body .contact-form .phone-error { color: #9b392d !important; font-size: 14px; }
body .contact-region-suggestions { background: var(--white) !important; border: 1px solid var(--line) !important; border-radius: 12px !important; box-shadow: 0 10px 25px #34372f18; max-height: 240px; overflow: auto; z-index: 5; }
body .contact-region-suggestions[hidden] { display: none !important; }
body .contact-region-suggestion { color: var(--ink) !important; background: transparent !important; font: inherit; font-size: 15px; cursor: pointer; }
body .contact-region-suggestion:hover, body .contact-region-suggestion[aria-selected=true] { background: var(--accent-soft) !important; }
body .footer-links a, body .footer-legal a { font-size: 14px; line-height: 1.5; }

/* Final mobile override for salary card typography. Loaded after style.css. */
@media (max-width:700px) {
  body #situations .documents-cards > article {
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    column-gap: 4px !important;
    align-items: start !important;
    padding: 20px 18px !important;
  }

  body #situations .documents-cards > article .documents-icon {
    grid-column: 1 !important;
    grid-row: 1 !important;
    width: 24px !important;
    height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
  }

  body #situations .documents-cards > article h3 {
    grid-column: 2 !important;
    grid-row: 1 !important;
    align-self: center !important;
    justify-self: start !important;
    margin: 0 !important;
    font-size: 20px !important;
    line-height: 1.1 !important;
    text-align: left !important;
  }

  body #situations .documents-cards > article:nth-child(1) h3,
  body #situations .documents-cards > article:nth-child(3) h3 {
    font-size: 18px !important;
    line-height: 1.1 !important;
    white-space: nowrap !important;
    font-weight: 700 !important;
  }

  body #situations .documents-cards > article:nth-child(2) h3 {
    font-size: 22px !important;
    font-weight: 700 !important;
  }

  body #situations .documents-cards > article:nth-child(3) h3 {
    font-size: 22px !important;
    font-weight: 700 !important;
  }

  body #situations .documents-cards > article:nth-child(1),
  body #situations .documents-cards > article:nth-child(3) {
    grid-template-columns: 24px minmax(0, 1fr) !important;
    column-gap: 4px !important;
  }

  body #situations .documents-cards > article:nth-child(1) .documents-icon,
  body #situations .documents-cards > article:nth-child(3) .documents-icon {
    width: 24px !important;
    height: 24px !important;
  }

  body #situations .documents-cards > article:nth-child(1) h3 br {
    display: none !important;
  }

  body #situations .documents-cards > article:nth-child(1) h3 {
    font-size: 0 !important;
  }

  body #situations .documents-cards > article:nth-child(1) h3::after {
    content: 'Базовый список для оформления';
    display: block !important;
    font-size: 18px !important;
    line-height: 1.1 !important;
    font-weight: 700 !important;
    white-space: nowrap !important;
  }

  body #situations .documents-cards > article p,
  body #situations .documents-cards > article ul {
    grid-column: 1 / -1 !important;
    margin-top: 16px !important;
  }

  body #situations .documents-cards > article .documents-button {
    grid-column: 1 / -1 !important;
    margin-top: 18px !important;
  }

  body #jobs .jobs-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body #jobs .jobs-grid .topic-card {
    min-height: 0 !important;
    padding: 14px 12px !important;
    border-radius: 18px !important;
  }

  body #jobs .jobs-grid .topic-card:nth-child(9) {
    grid-column: auto !important;
    width: 100% !important;
    justify-self: stretch !important;
  }

  body #jobs .jobs-grid .topic-card:nth-child(8) {
    display: none !important;
  }

  body #jobs .jobs-grid .card-top {
    margin-bottom: 14px !important;
  }

  body #jobs .jobs-grid .topic-card h3 {
    font-size: 17px !important;
    line-height: 1.12 !important;
  }

  body #jobs .jobs-grid .topic-card p {
    font-size: 13px !important;
    line-height: 1.35 !important;
    margin: 10px 0 14px !important;
  }

  body #jobs .jobs-grid .job-pay {
    font-size: 16px !important;
    line-height: 1.2 !important;
  }

  body #jobs .jobs-grid .card-link {
    min-height: 34px !important;
    padding: 6px 8px !important;
    font-size: 12px !important;
  }

  body #jobs .metric-strip {
    width: calc(100% - 20px) !important;
    margin: 0 auto 8px !important;
    padding: 12px 0 8px !important;
    gap: 8px !important;
    text-align: center !important;
  }

  body #jobs .metric-strip > div {
    min-width: 0 !important;
    text-align: center !important;
  }

  body #jobs .metric-strip .metric-number,
  body #jobs .metric-strip .metric-label {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body #jobs .metric-strip .metric-label {
    min-height: 36px !important;
  }

  body #jobs .metric-strip > div:nth-child(3) .metric-label {
    font-size: 0 !important;
    line-height: 1.35 !important;
  }

  body #jobs .metric-strip > div:nth-child(3) .metric-label::before,
  body #jobs .metric-strip > div:nth-child(3) .metric-label::after {
    display: block !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
  }

  body #jobs .metric-strip > div:nth-child(3) .metric-label::before {
    content: 'Крайний возраст';
  }

  body #jobs .metric-strip > div:nth-child(3) .metric-label::after {
    content: 'кандидата';
  }

  body #jobs .metric-strip > div:nth-child(2) {
    transform: translateX(-2px) !important;
  }

  body #jobs .metric-strip > div:nth-child(3) {
    transform: translateX(-4px) !important;
  }

  body #support {
    padding-bottom: 0 !important;
  }

  body #support .support-columns article h3 {
    text-align: center !important;
  }

  body #support .support-columns article ul {
    padding-left: 28px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0 !important;
  }

  body #support .support-columns article {
    padding-bottom: 0 !important;
  }

  body #support .support-columns article li:last-child {
    margin-bottom: 7px !important;
  }

  body #support .stages-grid .info-card {
    position: relative !important;
    padding: 18px 18px 12px !important;
  }

  body #support .stages-grid .item-no {
    position: relative !important;
    z-index: 1 !important;
    margin: 0 !important;
  }

  body #support .stages-grid .stage-time {
    position: absolute !important;
    top: 18px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  body #support .stages-grid h3 {
    margin-top: -19px !important;
    text-align: center !important;
    line-height: 1.15 !important;
    font-size: 0 !important;
    text-transform: uppercase !important;
  }

  body #support .stages-grid .info-card h3::after {
    display: block !important;
    font-size: 18px !important;
    line-height: 1.15 !important;
    font-weight: 800 !important;
  }

  body #support .stages-grid p {
    text-align: center !important;
    line-height: 1.3 !important;
    margin-bottom: 0 !important;
  }

  body #support .stages-grid .info-card:not(:last-child)::after {
    content: none !important;
    display: none !important;
  }

  body #support .stages-grid .info-card:nth-child(1) h3::after {
    content: 'Консультация';
  }

  body #support .stages-grid .info-card:nth-child(2) h3::after {
    content: 'Логистика';
  }

  body #support .stages-grid .info-card:nth-child(3) h3::after {
    content: 'Встреча';
  }

  body #support .stages-grid .info-card:nth-child(4) h3::after {
    content: 'Размещение';
  }

  body #support .stages-grid .info-card:nth-child(5) h3::after {
    content: 'Оформление';
  }

  body #bonus .bonus-tiles {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }

  body #bonus .bonus-tiles .bonus-tile {
    grid-column: span 3 !important;
    min-height: 145px !important;
    padding: 12px !important;
    gap: 8px !important;
  }

  body #bonus .bonus-tiles .bonus-tile:nth-child(n + 3) {
    grid-column: span 2 !important;
  }

  body #bonus .bonus-tiles .bonus-tile-icon {
    width: 42px !important;
    height: 42px !important;
    border-radius: 12px !important;
  }

  body #bonus .bonus-tiles .bonus-tile h3 {
    font-size: 16px !important;
    line-height: 1.1 !important;
  }

  body #salary {
    padding-bottom: 24px !important;
  }

  body #salary .condition-row {
    padding-bottom: 10px !important;
  }

  body #salary .condition-row + a.button {
    margin-top: 0 !important;
  }

  body #salary > a.button:last-child {
    margin-bottom: 0 !important;
  }

  body #salary > a.button {
    width: calc(100% - 20px) !important;
    max-width: none !important;
    min-height: 40px !important;
    height: 40px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 6px 12px !important;
    border-radius: 20px !important;
    line-height: 1.15 !important;
    box-sizing: border-box !important;
  }

  body #salary .condition-row {
    display: grid !important;
    grid-template-columns: minmax(70px, .8fr) minmax(70px, .8fr) minmax(150px, 1.4fr) !important;
    justify-content: center !important;
    gap: 8px !important;
    text-align: center !important;
  }

  body #salary .condition-row > div {
    min-width: 0 !important;
  }

  body #salary .condition-row > div:nth-child(3) {
    grid-column: auto !important;
  }

  body #salary .condition-row strong,
  body #salary .condition-row span {
    display: block !important;
    text-align: center !important;
  }

  body #salary .condition-row strong {
    font-size: 13px !important;
    line-height: 1.15 !important;
  }

  body #salary .condition-row span {
    margin-top: 8px !important;
    font-size: 20px !important;
    line-height: 1.15 !important;
  }

  body #salary .condition-row > div:nth-child(3) span {
    max-width: 180px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    font-size: 0 !important;
  }


  body #salary .pay-card {
    padding-top: 10px !important;
  }

  body #salary .pay-card .pay-value {
    margin-bottom: 6px !important;
  }

  body #salary .pay-card h3 {
    font-size: 16px !important;
    line-height: 1.08 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    text-decoration-thickness: 1px !important;
  }

  body #salary .pay-card p {
    font-size: 14px !important;
    line-height: 1 !important;
    margin-top: 10px !important;
    text-align: center !important;
  }

}
body .footer-actions>a:hover { background: #ffffff0c !important; }
body .policy-page { color: var(--ink); }
body .policy-page p, body .policy-page li, body .policy-note { color: var(--muted); }
body .policy-page a { color: #48573b; }
body .policy-meta { color: var(--muted); }
body .policy-note { background: var(--accent-soft); }
body .policy-page section { scroll-margin-top: 24px; }
body .policy-page > .eyebrow { font-size: 0; }
body .policy-page > .eyebrow::after { content: 'КАДРОВЫЙ ШТАБ · ДОКУМЕНТЫ'; font-size: 14px; }
.contact-dialog { border: 1px solid var(--line); border-radius: 24px; padding: 0; width: min(640px,calc(100% - 40px)); max-height: calc(100dvh - 64px); background: var(--white); color: var(--ink); box-shadow: 0 24px 80px #151b1840; }
.contact-dialog::backdrop { background: #20281cc4; backdrop-filter: blur(3px); }
body .contact-dialog .contact-form { border: 0 !important; border-radius: 0; padding: 32px; }
body .contact-dialog .contact-form h3 { text-align: left; padding-right: 42px; }
body .contact-dialog .contact-modal-close { position: sticky; display: flex !important; align-items: center; justify-content: center; top: 16px; margin: 16px 16px -56px auto; z-index: 2; width: 40px; height: 40px; min-height: 40px; border: 1px solid var(--line); border-radius: 50%; background: var(--white); color: var(--ink); font-size: 25px; line-height: 1; }
body.dialog-open { overflow: hidden; }
@media(min-width:901px) {
  body #advantages, body #bonus { padding-block: 64px !important; }
  body #salary { padding-block: 56px !important; }
  body .prepare-section { padding-block: 56px !important; }
  body #jobs { padding-top: 64px !important; padding-bottom: 32px !important; }
  body .documents-redesign { padding-top: 32px !important; }
  body .foreign-documents { padding-top: 56px !important; padding-bottom: 20px !important; }
  body #faq { padding-top: 44px !important; padding-bottom: 56px !important; }
  body .referral-section { padding-top: 40px !important; padding-bottom: 56px !important; }
  body #contacts { padding-top: 40px !important; padding-bottom: 56px !important; }
  body .contacts-layout { gap: 24px; margin-top: 32px; }
  body .referral-steps article { padding: 24px 20px; min-height: 400px; }
  body .referral-steps h3 { margin-top: 40px; }
  body .referral-layout { margin-top: 32px; }
}
@media(min-width:901px) and (max-width:1190px) {
  body .header-inner { flex-wrap: wrap; column-gap: 16px !important; row-gap: 4px !important; padding-block: 10px; }
  body .header nav { flex: 1 0 100%; justify-content: space-between; gap: 12px !important; }
  body .header-actions { margin-left: auto; }
  body .header-cta { order: 0; }
  body .hero-points { grid-template-columns: repeat(2,minmax(0,1fr)) !important; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } *,*::before,*::after { transition: none !important; } }
/* Form controls remain identical in the page and in the dialog. */
body #phone-form.contact-form input:not([type=radio]):not([type=checkbox]):focus,
body #phone-form.contact-form select:focus,
body #referral-form .referral-fields input:focus {
  outline: none !important; outline-offset: 0 !important;
  border-color: var(--blue) !important; background: #e4e8d9 !important;
  box-shadow: 0 0 0 2px #606d4f40 !important;
}
body #phone-form.contact-form .phone-field input[type=tel],
body #phone-form.contact-form .phone-field input[type=tel]:focus,
body #referral-form .referral-fields .phone-field input[type=tel],
body #referral-form .referral-fields .phone-field input[type=tel]:focus {
  background: transparent !important; border: 0 !important; box-shadow: none !important;
  outline: 0 !important; margin: 0 !important; padding: 12px 12px 12px 0 !important;
}
body #phone-form.contact-form input[type=radio],
body #phone-form.contact-form input[type=radio]:focus,
body #phone-form.contact-form input[type=radio]:focus-visible {
  outline: none !important; box-shadow: none !important; background: transparent !important; border: 0 !important;
}
body #phone-form.contact-form .privacy-consent input[type=checkbox]:focus-visible { outline: 2px solid var(--blue) !important; outline-offset: 2px !important; }
body .contact-card .social-lead, body .contact-card.contact-note p { color: var(--muted) !important; }
body .contact-card.contact-note { background: var(--blue) !important; border-color: var(--blue) !important; }
body .contact-card.contact-note .contact-card-label,
body .contact-card.contact-note p { color: var(--white) !important; }
body .contact-card.contact-note .contact-card-label { background: #ffffff24 !important; }
body .contact-card.contact-note { background: var(--white) !important; border-color: var(--line) !important; }
body .contact-card.contact-note p { color: var(--muted) !important; }
body .contact-card.contact-note .contact-card-label { background: var(--blue) !important; color: var(--white) !important; }
body .contact-card.contact-note .contact-card-label { font-size: 14.4px !important; line-height: 1 !important; height: 30px !important; box-sizing: border-box !important; padding: 0 12px !important; display: inline-flex !important; align-items: center !important; }
body .contact-card.contact-note { display: flex !important; flex-direction: column !important; }
body .contact-card.contact-note .contact-card-label { align-self: flex-start !important; width: max-content !important; }
body .contact-card > .contact-card-label { height: 30px !important; min-height: 30px !important; box-sizing: border-box !important; display: inline-flex !important; align-items: center !important; vertical-align: middle !important; }
body .contact-card.contact-note p { margin-top: auto !important; }
body .contact-card.contact-phone-card h3 { margin-top: 18px !important; margin-bottom: 0 !important; transform: translateY(10px); }
body .contact-card.contact-phone-card p { margin-top: auto !important; }
body .contact-card.contact-phone-card + .contact-card h3 { transform: translateY(18px); }
body .contact-card.contact-phone-card + .contact-card p { margin-top: auto !important; }
body .contact-form .contact-region-field>label { color: var(--ink) !important; }
body .section-heading .eyebrow,
body .documents-title>.eyebrow,
body .foreign-documents>.eyebrow,
body .referral-section>.wrap>.eyebrow,
body #faq .eyebrow,
body #contacts>.eyebrow { display: block; margin: 0 0 12px !important; }
body .section-heading .eyebrow+h2,
body .documents-title>.eyebrow+h2,
body .foreign-documents>.eyebrow+.foreign-heading,
body .referral-section>.wrap>.eyebrow+h2,
body #faq .eyebrow+h2,
body #contacts>.eyebrow+h2 { margin-top: 0 !important; }

@media (min-width:901px) and (max-width:1190px) {
  body .header-cta { display: inline-flex !important; }
}
@media (min-width:901px) {
  body .footer-inner { grid-template-columns: 1.1fr 1.5fr 1.1fr !important; }
  body .footer-links { grid-template-columns: 1fr 1fr; gap: 10px 20px; }
  body .footer-links strong { grid-column: 1 / -1; }
}

/* Center the complete content of each document card on mobile. */
@media (max-width:700px){
  body #situations .documents-cards > article{
    grid-template-columns:24px max-content!important;
    justify-content:center!important;
  }

  body #situations .documents-cards > article:nth-child(n) > h3{
    text-align:center!important;
  }

  body #situations .documents-cards > article > p,
  body #situations .documents-cards > article > ul{
    text-align:center!important;
  }

  body #situations .documents-cards > article > ul{
    list-style-position:inside!important;
    padding-left:18px!important;
  }

  body #situations .documents-cards > article:nth-child(1) h3::after{
    font-size:16px!important;
  }

  /* Make the sticker and title behave as one shrink-to-fit centered group. */
  body #situations .documents-cards > article:nth-child(n) > h3{
    width:max-content!important;
    max-width:100%!important;
  }

  body #situations .documents-cards > article{
    grid-template-columns:1fr max-content 4px max-content 1fr!important;
  }

  body #situations .documents-cards > article:nth-child(n) > .documents-icon{
    grid-column:2!important;
  }

  body #situations .documents-cards > article:nth-child(n) > h3{
    grid-column:4!important;
  }

  body #situations .documents-cards > article:nth-child(1),
  body #situations .documents-cards > article:nth-child(2),
  body #situations .documents-cards > article:nth-child(3){
    grid-template-columns:1fr max-content 4px max-content 1fr!important;
  }

  body #situations .documents-cards > article:nth-child(1) > .documents-icon,
  body #situations .documents-cards > article:nth-child(2) > .documents-icon,
  body #situations .documents-cards > article:nth-child(3) > .documents-icon{
    grid-column:2!important;
  }

  body #situations .documents-cards > article:nth-child(1) > h3,
  body #situations .documents-cards > article:nth-child(2) > h3,
  body #situations .documents-cards > article:nth-child(3) > h3{
    grid-column:4!important;
  }

  body #situations .documents-cards > article:nth-child(1) > .documents-icon,
  body #situations .documents-cards > article:nth-child(2) > .documents-icon,
  body #situations .documents-cards > article:nth-child(3) > .documents-icon{
    width:18px!important;
    height:18px!important;
  }

  body #situations .documents-cards > article:nth-child(2) > .documents-icon,
  body #situations .documents-cards > article:nth-child(3) > .documents-icon{
    transform:translateY(2px)!important;
  }

  body #situations .documents-cards > article:nth-child(1) h3::after{
    font-size:17px!important;
  }

  body #situations .documents-cards > article:nth-child(1) .documents-button{
    min-height:40px!important;
    height:40px!important;
    border-radius:20px!important;
  }

  body #situations .documents-cards > article:nth-child(2) .documents-number,
  body #situations .documents-cards > article:nth-child(3) .documents-number{
    top:16px!important;
  }

  body #situations .documents-cards > article:nth-child(2) ul,
  body #situations .documents-cards > article:nth-child(3) ul{
    list-style:none!important;
  }

  body #situations .documents-cards > article:nth-child(2),
  body #situations .documents-cards > article:nth-child(3){
    padding-bottom:12px!important;
  }

  body #situations .documents-cards > article:nth-child(2) ul,
  body #situations .documents-cards > article:nth-child(3) ul{
    margin-bottom:0!important;
    margin-top:10px!important;
  }
}

/* Mobile foreign-candidate cards: center the sticker/title pair and lists. */
@media (max-width:700px){
  body #foreign-documents .foreign-cards > article{
    display:grid!important;
    grid-template-columns:1fr 28px 4px max-content 1fr!important;
    align-items:start!important;
    padding:20px 18px!important;
  }

  body #foreign-documents .foreign-cards > article:nth-child(n) > .documents-icon{
    grid-column:2!important;
    grid-row:1!important;
    width:28px!important;
    height:28px!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    background:transparent!important;
  }

  body #foreign-documents .foreign-cards > article:nth-child(n) > h3{
    grid-column:4!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:start!important;
    width:max-content!important;
    max-width:100%!important;
    margin:0!important;
    font-size:20px!important;
    line-height:1.15!important;
    font-weight:700!important;
    text-align:left!important;
  }

  body #foreign-documents .foreign-cards > article > p,
  body #foreign-documents .foreign-cards > article > ul{
    grid-column:1/-1!important;
    text-align:center!important;
    margin-top:12px!important;
  }

  body #foreign-documents .foreign-cards > article > p{
    line-height:1.3!important;
  }

  body #foreign-documents .foreign-cards > article > ul{
    list-style:none!important;
    padding-left:0!important;
    margin-bottom:0!important;
    line-height:1.3!important;
  }

  body #foreign-documents .foreign-cards > article{
    grid-template-columns:1fr 21px 8px max-content 1fr!important;
  }

  body #foreign-documents .foreign-cards > article:nth-child(n) > .documents-icon{
    width:21px!important;
    height:21px!important;
  }

  body #foreign-documents .foreign-cards > article:nth-child(2),
  body #foreign-documents .foreign-cards > article:nth-child(3){
    grid-template-columns:1fr 21px 12px max-content 1fr!important;
  }
}

@media (max-width:700px){
  body #foreign-documents .foreign-payout{
    text-align:center!important;
    padding:18px 14px!important;
  }

  body #foreign-documents .foreign-payout .eyebrow{
    display:inline-flex!important;
    padding:5px 10px!important;
    font-size:11px!important;
    line-height:1.1!important;
  }

  body #foreign-documents .foreign-payout strong{
    margin-top:0!important;
    font-size:34px!important;
    font-weight:700!important;
    line-height:1.05!important;
  }

  body #foreign-documents .foreign-payout p{
    margin-top:8px!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  body #foreign-documents .foreign-benefits{
    list-style:none!important;
    box-sizing:border-box!important;
    padding:26px 18px!important;
    padding-left:18px!important;
    text-align:center!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    font-size:13px!important;
    line-height:1.3!important;
  }

  body #foreign-documents .foreign-benefits li{
    width:100%!important;
    text-align:center!important;
  }

  body #foreign-documents .foreign-benefits li:nth-child(2),
  body #foreign-documents .foreign-benefits li:nth-child(4){
    font-weight:400!important;
  }

  body #foreign-documents .foreign-benefits li:nth-child(1),
  body #foreign-documents .foreign-benefits li:nth-child(3),
  body #foreign-documents .foreign-benefits li:nth-child(5){
    font-weight:700!important;
  }

  body #foreign-documents .foreign-benefits li::before{
    content:'•';
    display:inline-block;
    margin-right:5px;
    font-size:9px;
    line-height:1;
    vertical-align:middle;
  }
}

/* Mobile FAQ heading: shorter wording. */
@media (max-width:700px){
  body #faq > div:first-child > h2{
    font-size:0!important;
  }

  body #faq > div:first-child > h2::after{
    content:'Что важно знать';
    display:block!important;
    font-size:29px!important;
    line-height:1.12!important;
    font-weight:600!important;
  }
}

@media (max-width:700px){
  body #referral .referral-lead{
    color:#69705e!important;
    font-family:'Montserrat',Arial,sans-serif!important;
    font-size:15px!important;
    font-weight:400!important;
    line-height:1.45!important;
    letter-spacing:normal!important;
    text-transform:none!important;
  }

  body #referral > .wrap > .referral-lead{
    font-weight:400!important;
    font-size:14px!important;
  }
}

@media (max-width:700px){
  body #referral .referral-reward{
    min-height:0!important;
    padding:20px 14px!important;
    text-align:center!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
  }

  body #referral .referral-reward > span{
    font-size:15px!important;
    font-weight:600!important;
    line-height:1.2!important;
    text-decoration:underline!important;
    text-underline-offset:3px!important;
  }

  body #referral .referral-reward strong{
    margin-top:6px!important;
    text-align:center!important;
  }

  body #referral .referral-reward p{
    margin-top:10px!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  body #referral .referral-note h3{
    font-size:18px!important;
    line-height:1.05!important;
    letter-spacing:-.5px!important;
    font-weight:700!important;
  }

  body #referral .referral-note p{
    margin-top:12px!important;
    font-size:14px!important;
    line-height:1.2!important;
    text-align:center!important;
  }

  body #referral .referral-note{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  body #referral .referral-steps article{
    min-height:0!important;
    padding:18px 14px!important;
  }

  body #referral .referral-steps article h3{
    margin-top:-34px!important;
    font-size:18px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  body #referral .referral-steps article h3 br{
    display:none!important;
  }

  body #referral .referral-steps article h3{
    font-size:0!important;
  }

  body #referral .referral-steps article:nth-child(1) h3::after,
  body #referral .referral-steps article:nth-child(2) h3::after,
  body #referral .referral-steps article:nth-child(3) h3::after{
    display:block!important;
    font-size:21px!important;
    line-height:1.1!important;
    font-weight:700!important;
    white-space:nowrap!important;
  }

  body #referral .referral-steps article:nth-child(1) h3::after{content:'Выберите кандидата';}
  body #referral .referral-steps article:nth-child(2) h3::after{content:'Заполните заявку';}
  body #referral .referral-steps article:nth-child(3) h3::after{content:'Получите выплату';}

  body #referral .referral-steps article p{
    font-family:'Montserrat',Arial,sans-serif!important;
    font-size:16px!important;
    font-weight:400!important;
    line-height:1.3!important;
    letter-spacing:normal!important;
  }
}

/* v43: stable phone geometry — no hover movement, no width-dependent variants. */
@media (max-width:700px){
  /* 01: every hero card is the same height and its label/value stay adjacent. */
  body .hero-points{
    grid-auto-rows:140px !important;
    align-items:stretch !important;
  }
  body .hero-points > div{
    height:140px !important;
    min-height:140px !important;
    padding:14px 16px !important;
    align-items:center !important;
  }
  body .hero-points > div p{
    display:flex !important;
    height:auto !important;
    justify-content:center !important;
    align-items:center !important;
    gap:4px !important;
  }
  body .hero-points > div .hero-card-label,
  body .hero-points > div strong{ margin:0 !important; }

  /* 02: one exact box for each of the three payout actions. */
  body #salary > a.button{
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:64px !important;
    min-height:64px !important;
    margin:10px 0 0 !important;
    padding:10px 14px !important;
    box-sizing:border-box !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
  }

  /* 04: the time pill and title use one fixed small gap everywhere. */
  body #support .stages-grid .info-card{
    gap:0 !important;
  }
  body #support .stages-grid .stage-time{
    margin:0 !important;
  }
  body #support .stages-grid .info-card h3{
    margin:5px 0 0 !important;
  }

  /* 06: the white action fills its card consistently and remains compact. */
  body #situations .documents-feature .documents-button{
    display:flex !important;
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    height:46px !important;
    min-height:46px !important;
    margin:18px 0 0 !important;
    padding:0 12px !important;
    box-sizing:border-box !important;
    justify-content:center !important;
    align-items:center !important;
    font-size:14px !important;
    line-height:1 !important;
    white-space:nowrap !important;
  }
  body #situations .documents-cards > article > ul,
  body #foreign-documents .foreign-cards > article > ul{
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:0 !important;
    padding-right:0 !important;
    text-align:center !important;
    list-style-position:inside !important;
  }

  /* A tap must never leave a card visually lifted or shifted on a phone. */
  body .hero-points > div,
  body .info-card,
  body .pay-card,
  body .bonus-tile,
  body .topic-card,
  body .documents-card,
  body .documents-feature,
  body .foreign-payout,
  body .foreign-benefits,
  body .referral-note,
  body .referral-steps article,
  body .contact-card,
  body .contact-form{
    transition:none !important;
    transform:none !important;
  }
  body .hero-points > div:hover,
  body .info-card:hover,
  body .pay-card:hover,
  body .bonus-tile:hover,
  body .topic-card:hover,
  body .documents-card:hover,
  body .documents-feature:hover,
  body .contact-card:hover{
    transform:none !important;
  }
}

/* v44: preserved only for the existing phone layout. */
@media (max-width:700px){
  body #salary > a.button,
  body #salary > a.button.salary-apply,
  body #salary > a.button.salary-apply.salary-apply-copy{
    display:flex !important;
    width:min(100%,480px) !important;
    height:64px !important;
    min-height:64px !important;
    max-height:64px !important;
    box-sizing:border-box !important;
    justify-content:center !important;
    align-items:center !important;
    text-align:center !important;
  }
}
body .hero-points > div,
body .hero-points > div:last-child{
  height:140px !important;
  min-height:140px !important;
  max-height:140px !important;
}

/* v47: compact first-screen cards — amount, two-line description, no spare height. */
@media (max-width:700px){
  body .hero-points{
    grid-auto-rows:94px !important;
    gap:9px !important;
  }
  body .hero-points > div,
  body .hero-points > div:last-child{
    height:94px !important;
    min-height:94px !important;
    max-height:94px !important;
    padding:10px 12px !important;
  }
  body .hero-points > div p{
    gap:7px !important;
    line-height:1.15 !important;
  }
  body .hero-points > div strong{
    font-size:21px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
    font-size:10px !important;
    line-height:1.15 !important;
  }
}

@media (max-width:700px){
  body #situations.documents-redesign .documents-cards > article.documents-feature > a.documents-button{
    display:flex !important;
    width:100% !important;
    height:46px !important;
    min-height:46px !important;
    max-height:46px !important;
    box-sizing:border-box !important;
    padding:0 12px !important;
    font-size:14px !important;
    line-height:1 !important;
  }
  body #support .stages-grid .info-card .stage-time{
    margin:0 !important;
  }
  body #support .stages-grid .info-card h3{
    margin:0 !important;
    padding-top:5px !important;
  }
  body #advantages .info-card,
  body #salary .pay-card,
  body #bonus .bonus-tile,
  body #jobs .topic-card,
  body #situations .documents-card,
  body #situations .documents-feature,
  body #foreign-documents .documents-card,
  body #foreign-documents .documents-feature,
  body #contacts .contact-card,
  body .referral-steps article,
  body .referral-note,
  body .hero-points > div{
    transition:none !important;
    animation:none !important;
    transform:none !important;
  }
  body #advantages .info-card:hover,
  body #salary .pay-card:hover,
  body #bonus .bonus-tile:hover,
  body #jobs .topic-card:hover,
  body #situations .documents-card:hover,
  body #situations .documents-feature:hover,
  body #foreign-documents .documents-card:hover,
  body #foreign-documents .documents-feature:hover,
  body #contacts .contact-card:hover,
  body .hero-points > div:hover{
    transform:none !important;
  }
}

@media (max-width:700px){
  body #referral > .wrap > h2{
    font-size:26px!important;
    font-weight:700!important;
    line-height:1.1!important;
  }

  body #referral > .wrap > h2{
    color:transparent!important;
  }

  body #referral > .wrap > h2::after{
    content:'Рекомендовать кандидата';
    display:block!important;
    color:var(--ink)!important;
    font-size:26px!important;
    font-weight:700!important;
    line-height:1.1!important;
    letter-spacing:-.4px!important;
    text-align:center!important;
  }

  body #referral > .wrap > .eyebrow{
    margin-bottom:2px!important;
  }

  body #referral .referral-layout{
    margin-top:24px!important;
  }

  body #referral .referral-steps article h3{
    margin-top:-38px!important;
  }

  body #referral .referral-steps article p{
    margin-top:28px!important;
  }

  body #referral .referral-form h2{
    font-size:22px!important;
    font-weight:700!important;
    line-height:1!important;
    letter-spacing:-.5px!important;
    text-align:center!important;
    white-space:normal!important;
  }

  body #contacts{
    margin-top:-80px!important;
  }

  body #situations .documents-cards > article:nth-child(1) > p{
    font-size:14px!important;
    line-height:1.3!important;
  }

  body #situations .documents-cards > article:nth-child(2) > ul,
  body #situations .documents-cards > article:nth-child(3) > ul{
    font-size:14px!important;
    line-height:1.35!important;
  }

  body #situations .documents-cards > article:nth-child(2) > ul > li,
  body #situations .documents-cards > article:nth-child(3) > ul > li{
    font-size:14px!important;
    line-height:1.35!important;
  }

  body #situations .documents-cards > article:nth-child(2) .documents-number,
  body #situations .documents-cards > article:nth-child(3) .documents-number{
    display:none!important;
  }

  body #situations .documents-cards > article > p,
  body #situations .documents-cards > article > ul,
  body #situations .documents-cards > article > li{
    text-align:center!important;
  }

  body #situations .documents-cards > article:nth-child(1) .documents-button{
    min-height:36px!important;
    height:36px!important;
    border-radius:18px!important;
  }

  body #foreign-documents .foreign-cards > article > p,
  body #foreign-documents .foreign-cards > article > ul,
  body #foreign-documents .foreign-cards > article > ul > li{
    font-size:14px!important;
    line-height:1.3!important;
  }

  body #faq .faqs details > p{
    font-size:14px!important;
    line-height:1.35!important;
  }


  body #referral .referral-reward p{
    margin-top:5px!important;
  }

}

@media (max-width:700px){
  body #jobs .job-pay .job-currency{
    font-size:.68em!important;
    line-height:1!important;
    vertical-align:baseline!important;
  }


  body #referral .referral-steps article p{
    font-size:14px!important;
    line-height:1.2!important;
  }

  body #phone-form fieldset{
    display:flex!important;
    flex-wrap:nowrap!important;
    justify-content:center!important;
    column-gap:2px!important;
    row-gap:0!important;
    position:relative!important;
    min-height:88px!important;
  }

  body #phone-form fieldset legend{
    position:absolute!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100%!important;
    font-size:14px!important;
    line-height:1.25!important;
    text-align:center!important;
  }

  body #phone-form fieldset label{
    flex:0 0 auto!important;
    margin:58px 0 0!important;
    gap:3px!important;
    font-size:12px!important;
    line-height:1.2!important;
    white-space:nowrap!important;
  }

  body #phone-form fieldset label input[type=radio]{
    width:14px!important;
    height:14px!important;
  }

  body #phone-form fieldset{
    flex-wrap:wrap!important;
    justify-content:center!important;
    min-height:0!important;
    padding-top:0!important;
  }

  body #phone-form fieldset legend{
    position:static!important;
    flex:0 0 100%!important;
    width:auto!important;
    margin:0!important;
    font-size:14px!important;
    line-height:1.25!important;
  }

  body #phone-form fieldset label{
    flex:0 0 calc(33.333% - 4px)!important;
    justify-content:center!important;
    margin:10px 0 0!important;
    font-size:13px!important;
  }

  body #phone-form fieldset label input[type=radio]{
    width:16px!important;
    height:16px!important;
  }
}

@media (max-width:700px){
  body #phone-form fieldset legend{
    text-align:left!important;
  }

  body #phone-form fieldset{
    flex-wrap:wrap!important;
    column-gap:0!important;
    justify-content:space-between!important;
  }

  body #phone-form fieldset label{
    flex:0 0 auto!important;
    margin:10px 0 0!important;
    gap:6px!important;
    font-size:16px!important;
    font-weight:600!important;
  }


  body #phone-form fieldset label input[type=radio]{
    width:18px!important;
    height:18px!important;
  }
}

@media (max-width:700px){

  body #contacts .contact-card p,
  body #contacts .contact-card .social-lead{
    font-size:14px!important;
    line-height:1.3!important;
  }

  body #contacts .social-links{
    justify-content:center!important;
    gap:6px!important;
  }

  body #contacts .social-links a{
    min-height:30px!important;
    height:30px!important;
    padding:4px 8px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }

  body #contacts .social-links a:nth-child(1){width:98px!important;}
  body #contacts .social-links a:nth-child(2){width:112px!important;}
  body #contacts .social-links a:nth-child(3){width:76px!important;}

  body #contacts > .contacts-lead{
    font-size:14px!important;
    line-height:1.3!important;
    margin-top:12px!important;
    margin-bottom:0!important;
    width:calc(100% - 24px)!important;
    max-width:340px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }

  body #contacts .contacts-layout{
    margin-top:18px!important;
  }

  body #contacts .contact-phone-card h3,
  body #contacts .contact-card:not(.social-card):not(.contact-note) h3{
    transform:none!important;
    margin-top:10px!important;
    margin-bottom:0!important;
  }

  body #contacts .contact-phone-card p,
  body #contacts .contact-card:not(.social-card):not(.contact-note) p{
    margin-top:10px!important;
  }

  body #contacts .social-card .social-lead{
    transform:none!important;
    margin-top:10px!important;
    text-align:center!important;
  }

  body #contacts .contact-note{
    margin-bottom:18px!important;
  }

  body #contacts .contact-form{
    margin-top:18px!important;
    text-align:left!important;
  }

  body #contacts .contact-form h3,
  body #contacts .contact-form > label,
  body #contacts .contact-form legend{
    text-align:left!important;
  }

  body #contacts .contact-card-label{
    font-size:11px!important;
  }

  body #contacts .contact-note{
    text-align:center!important;
  }

  body #contacts .contact-note .contact-card-label{
    align-self:center!important;
  }

  body #contacts .contact-note p{
    font-size:13px!important;
    line-height:1.3!important;
    text-align:center!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  body #contacts .contact-phone-card .contact-card-label,
  body #contacts .contact-info > .contact-card:nth-child(2) .contact-card-label{
    align-self:center!important;
  }

  body #contacts .contact-note .contact-card-label{
    font-size:14px!important;
    padding-left:18px!important;
    padding-right:18px!important;
  }

  body #contacts .contact-note p br{
    display:none!important;
  }

  body #contacts .contact-form > h3{
    font-weight:650!important;
  }
}

@media (max-width:700px){
  body .footer-inner{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:18px!important;
  }

  body .footer-official,
  body .footer-actions{
    display:contents!important;
  }

  body .footer-official h3{
    order:1!important;
    align-self:flex-start!important;
  }

  body .footer-actions > a{
    position:absolute!important;
    top:0!important;
    right:0!important;
    border-radius:999px!important;
    font-size:0!important;
    white-space:nowrap!important;
  }

  body .footer-actions > a::before{
    content:'Наверх'!important;
    font-size:12px!important;
    line-height:1!important;
  }

  body .footer-contact{order:2!important;}
  body .footer-links{order:3!important;}
  body .footer-legal{order:4!important;}
  body .footer-actions .footer-copy{order:5!important;}
  body .footer-bottom{
    order:6!important;
    width:100%!important;
    padding-top:18px!important;
    border-top:1px solid rgba(215,212,197,.25)!important;
  }
}

@media (max-width:700px){
  body #salary .pay-card h3{
    font-size:15px!important;
  }
}
/* Safety layer for user-edited content; existing visual rules remain authoritative. */
html,body{max-width:100%;overflow-x:hidden}
img{max-width:100%}
.button,.card-link,.text-link,a{overflow-wrap:anywhere}
input,select,textarea{max-width:100%}
@media (min-width:701px) and (max-width:1100px){.topic-grid,.source-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.jobs-grid .topic-card{min-width:0}.section-heading{align-items:flex-start}}
@media (max-width:700px){.topic-card,.source-card,.pay-card,.info-card,.bonus-tile{min-width:0}.topic-card h3,.source-card h3,.pay-card h3,.info-card h3,.bonus-tile h3{overflow-wrap:anywhere}.contact-phone-card h3{white-space:normal;overflow-wrap:anywhere}}

/* Final continuous layout pass: tablet widths get balanced columns instead of
   stretched desktop cards, while the established <=700px mobile rules remain. */
@media (min-width:701px) and (max-width:1100px){
  .wrap{width:calc(100% - 48px)}
  .hero-inner{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 32px}
  .hero-points{grid-template-columns:repeat(2,minmax(0,1fr))}
  .info-grid,.pay-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .bonus-tiles,.bonus-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .stages-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .process-band .info-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .documents-cards,.foreign-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .documents-card-wide,.documents-feature-dark{grid-column:1/-1}
  .referral-layout{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px}
  .referral-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .contacts-layout{grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:28px}
  .footer-inner{gap:20px}
}
@media (max-width:700px){
  html{overflow-x:hidden}
  .wrap{max-width:100%}
  .hero-inner,.section-heading,.referral-layout,.contacts-layout{min-width:0}
  .hero-actions .button,.referral-form .button,.contact-form .button{width:100%;max-width:100%;white-space:normal}
  .referral-fields{grid-template-columns:1fr!important}
  .documents-cards,.foreign-cards,.referral-steps{grid-template-columns:1fr!important}
}
@media (max-width:359px){
  .wrap{width:calc(100% - 28px)}
  .hero .wrap{width:calc(100% - 26px)}
  .hero-points>div{padding-left:10px!important;padding-right:10px!important}
  .hero-points p{font-size:13px!important}
  .hero-points strong{font-size:13px!important}
  .section-heading h2{font-size:29px!important}
}


/* Final responsive normalization: one fluid layout between breakpoints. */
@media (max-width:700px){
  /* Document/foreign cards: prevent max-content tracks from making cards wider than their container. */
  body #situations .documents-cards > article,
  body #foreign-documents .foreign-cards > article{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  body #situations .documents-cards > article:nth-child(n){
    grid-template-columns:24px minmax(0,1fr)!important;
    justify-content:stretch!important;
  }
  body #situations .documents-cards > article:nth-child(n) > .documents-icon{
    grid-column:1!important;
    grid-row:1!important;
  }
  body #situations .documents-cards > article:nth-child(n) > h3{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    width:auto!important;
    max-width:100%!important;
    white-space:normal!important;
  }
  body #foreign-documents .foreign-cards > article:nth-child(n){
    grid-template-columns:28px minmax(0,1fr)!important;
    justify-content:stretch!important;
  }
  body #foreign-documents .foreign-cards > article:nth-child(n) > .documents-icon{
    grid-column:1!important;
    grid-row:1!important;
  }
  body #foreign-documents .foreign-cards > article:nth-child(n) > h3{
    grid-column:2!important;
    grid-row:1!important;
    min-width:0!important;
    width:auto!important;
    max-width:100%!important;
    white-space:normal!important;
  }

  /* Long card text must be allowed to wrap inside the available track. */
  body #situations .documents-cards > article > p,
  body #situations .documents-cards > article > ul,
  body #foreign-documents .foreign-cards > article > p,
  body #foreign-documents .foreign-cards > article > ul{
    min-width:0!important;
    max-width:100%!important;
    overflow-wrap:anywhere!important;
  }
}

@media (min-width:701px) and (max-width:1100px){
  /* The contact form's radio group must shrink with the form instead of keeping a min-content width. */
  body #phone-form fieldset{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px 8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  body #phone-form fieldset legend{
    grid-column:1/-1!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    white-space:normal!important;
  }
  body #phone-form fieldset label{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    width:auto!important;
    margin:0!important;
    white-space:normal!important;
    justify-content:flex-start!important;
  }
  body #phone-form fieldset label input[type=radio]{
    flex:0 0 auto!important;
    width:18px!important;
    height:18px!important;
  }
}

@media (max-width:700px){
  body #phone-form fieldset{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px 8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  body #phone-form fieldset legend{
    grid-column:1/-1!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    white-space:normal!important;
  }
  body #phone-form fieldset label{
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    width:auto!important;
    margin:0!important;
    white-space:normal!important;
  }
  body #phone-form fieldset label input[type=radio]{
    flex:0 0 auto!important;
  }
}


/* Keep salary actions inside the tablet container; desktop positioning remains untouched. */
@media (min-width:701px) and (max-width:1100px){
  body #salary > .button.secondary,
  body #salary > .salary-apply{
    position:static!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:calc(50% - 7px)!important;
    max-width:none!important;
    min-width:0!important;
    min-height:44px!important;
    height:auto!important;
    margin:10px 10px 0 0!important;
    display:inline-flex!important;
    vertical-align:top!important;
    box-sizing:border-box!important;
  }
  body #salary > a:nth-of-type(3){
    width:100%!important;
    margin-right:0!important;
  }
}

/* Referral content must shrink with the mobile column instead of using text min-content width. */
@media (max-width:700px){
  body #referral .referral-layout,
  body #referral .referral-left,
  body #referral .referral-steps,
  body #referral .referral-steps article{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    box-sizing:border-box!important;
  }
  body #referral .referral-reward p{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  body #referral .referral-steps article h3{
    width:100%!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
}


/* Tablet card density: use two columns for the eight advantages instead of four narrow tracks. */
@media (min-width:701px) and (max-width:900px){
  body #advantages > .info-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:16px!important;
  }
  body #advantages > .info-grid > .info-card{
    min-width:0!important;
    height:auto!important;
    min-height:280px!important;
  }
  body #referral .referral-steps{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
  body #referral .referral-steps article:nth-child(3){
    grid-column:1/-1!important;
  }
}


@media (max-width:379px){
  body #jobs .jobs-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }
  body #jobs .jobs-grid .topic-card:nth-child(8){
    display:flex!important;
  }
  body #jobs .jobs-grid .topic-card:nth-child(9){
    grid-column:auto!important;
  }
}

/*
   Narrow-phone layout (320–379px).
   This is a real structural mode, not a viewport-hiding patch: components
   are allowed to grow, labels wrap, and compact groups reflow before text
   can collide. The 390px composition is intentionally left untouched.
*/
@media (max-width:379px){
  /* Salary conditions: two compact columns + a full-width citizenship row. */
  body #salary .condition-row{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:14px 12px!important;
    align-items:start!important;
  }
  body #salary .condition-row > div:nth-child(3){
    grid-column:1/-1!important;
  }
  body #salary .condition-row strong{
    font-size:12px!important;
    line-height:1.2!important;
  }
  body #salary .condition-row span,
  body #salary .condition-row > div:nth-child(3) span{
    max-width:none!important;
    margin-left:auto!important;
    margin-right:auto!important;
    font-size:21px!important;
    line-height:1.18!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  /* Support stages: number/time share the first row; title and text flow below. */
  body #support .stages-grid .info-card{
    display:grid!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    grid-template-rows:auto auto auto!important;
    column-gap:12px!important;
    row-gap:8px!important;
    align-items:start!important;
    padding:18px!important;
    min-height:0!important;
  }
  body #support .stages-grid .item-no{
    position:static!important;
    grid-column:1!important;
    grid-row:1!important;
    width:54px!important;
    height:54px!important;
    margin:0!important;
    align-self:start!important;
  }
  body #support .stages-grid .stage-time{
    position:static!important;
    grid-column:2!important;
    grid-row:1!important;
    justify-self:start!important;
    margin:0!important;
    transform:none!important;
    white-space:normal!important;
    max-width:100%!important;
  }
  body #support .stages-grid h3{
    grid-column:1/-1!important;
    grid-row:2!important;
    margin:2px 0 0!important;
    padding:0!important;
    font-size:19px!important;
    line-height:1.18!important;
    text-align:center!important;
    text-transform:uppercase!important;
    white-space:normal!important;
  }
  body #support .stages-grid .info-card h3::after{
    content:none!important;
    display:none!important;
  }
  body #support .stages-grid p{
    grid-column:1/-1!important;
    grid-row:3!important;
    margin:0!important;
    font-size:15px!important;
    line-height:1.35!important;
    text-align:center!important;
  }

  /* Jobs metrics: give each label its own readable column. */
  body #jobs .metric-strip{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:10px!important;
    align-items:start!important;
  }
  body #jobs .metric-strip > div,
  body #jobs .metric-strip > div:nth-child(2),
  body #jobs .metric-strip > div:nth-child(3){
    transform:none!important;
    min-width:0!important;
    width:100%!important;
  }
  body #jobs .metric-strip .metric-number{
    font-size:34px!important;
    line-height:1!important;
    margin-bottom:7px!important;
  }
  body #jobs .metric-strip .metric-label{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    min-height:0!important;
    font-size:12px!important;
    line-height:1.3!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    text-align:center!important;
  }

  /* Documents: use the real heading text and let it wrap naturally. */
  body #situations .documents-cards > article:nth-child(1) > h3{
    font-size:17px!important;
    line-height:1.18!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  body #situations .documents-cards > article:nth-child(1) > h3::after{
    content:none!important;
    display:none!important;
  }
  body #situations .documents-cards > article:nth-child(1) > h3 br{
    display:block!important;
  }

  /* Referral steps: remove the negative overlap used by the old mobile rule. */
  body #referral .referral-steps article{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    min-height:0!important;
    padding:18px 14px!important;
  }
  body #referral .referral-steps article b{
    position:static!important;
    flex:0 0 auto!important;
    width:52px!important;
    height:52px!important;
    margin:0 auto!important;
  }
  body #referral .referral-steps article h3{
    margin:14px 0 0!important;
    width:100%!important;
    max-width:none!important;
    font-size:20px!important;
    line-height:1.15!important;
    text-align:center!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
  }
  body #referral .referral-steps article h3::after{
    content:none!important;
    display:none!important;
  }
  body #referral .referral-steps article h3 br{
    display:block!important;
  }
  body #referral .referral-steps article p{
    margin:10px 0 0!important;
    font-size:14px!important;
    line-height:1.35!important;
    text-align:center!important;
  }

  /* Contact category radios: stable two-column grid. */
  body #phone-form fieldset{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px 8px!important;
    min-height:0!important;
    white-space:normal!important;
  }
  body #phone-form fieldset legend{
    grid-column:1/-1!important;
    position:static!important;
    width:auto!important;
    margin:0!important;
    font-size:15px!important;
    line-height:1.35!important;
    text-align:left!important;
  }
  body #phone-form fieldset label{
    display:flex!important;
    flex:initial!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    justify-content:flex-start!important;
    gap:6px!important;
    font-size:14px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }
  body #phone-form fieldset label input[type=radio]{
    flex:0 0 auto!important;
    width:18px!important;
    height:18px!important;
  }
}

/*
   320px corrective pass based on visual QA feedback.
   Keep desktop untouched and preserve the 390px reference layout.
*/
@media (max-width:379px){
  /* 01 / Hero: tiles 03–04 must grow with their text instead of clipping upward. */
  body .hero-points > div{
    min-height:0!important;
    height:auto!important;
    align-items:flex-start!important;
    padding:14px 10px!important;
  }
  body .hero-points > div p{
    min-width:0!important;
    width:100%!important;
    font-size:11.5px!important;
    line-height:1.32!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  body .hero-points > div strong{
    display:block!important;
    margin-top:6px!important;
    font-size:0!important;
    line-height:1.05!important;
    white-space:nowrap!important;
  }

  /* Salary buttons: never force a two-line label into a 40px box. */
  body #salary > a.button{
    height:auto!important;
    min-height:48px!important;
    padding:10px 14px!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
  }

  /* Citizenship: show the real content once; remove the duplicate pseudo-copy. */
  body #salary .condition-row > div:nth-child(3) span{
    font-size:18px!important;
    line-height:1.15!important;
    max-width:100%!important;
    white-space:normal!important;
  }
  body #salary .condition-row > div:nth-child(3) span::before,
  body #salary .condition-row > div:nth-child(3) span::after{
    content:none!important;
    display:none!important;
  }

  /* 04 / Support: keep number, title and time on the same top line.
     Long titles may wrap inside their own track; they are not pushed below. */
  body #support .stages-grid .info-card{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) auto!important;
    grid-template-rows:auto auto!important;
    column-gap:9px!important;
    row-gap:9px!important;
    align-items:start!important;
    padding:16px 14px 14px!important;
    min-height:0!important;
  }
  body #support .stages-grid .item-no{
    grid-column:1!important;
    grid-row:1!important;
    position:static!important;
    width:42px!important;
    height:42px!important;
    margin:0!important;
    display:grid!important;
    place-items:center!important;
    font-size:18px!important;
    line-height:1!important;
  }
  body #support .stages-grid .stage-time{
    grid-column:3!important;
    grid-row:1!important;
    position:static!important;
    transform:none!important;
    justify-self:end!important;
    align-self:start!important;
    margin:0!important;
    padding:5px 7px!important;
    font-size:10px!important;
    line-height:1.1!important;
    white-space:nowrap!important;
  }
  body #support .stages-grid h3{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    font-size:14px!important;
    line-height:1.12!important;
    text-align:left!important;
    text-transform:uppercase!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }
  body #support .stages-grid .info-card h3::after{
    content:none!important;
    display:none!important;
  }
  body #support .stages-grid p{
    grid-column:1/-1!important;
    grid-row:2!important;
    margin:0!important;
    font-size:13px!important;
    line-height:1.35!important;
    text-align:center!important;
  }

  /* 06 / Documents and 07 / Foreign citizens: card headings stay centered. */
  body #situations .documents-cards > article:nth-child(n),
  body #foreign-documents .foreign-cards > article:nth-child(n){
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    text-align:center!important;
    gap:0!important;
  }
  body #situations .documents-cards > article:nth-child(n) > .documents-icon,
  body #foreign-documents .foreign-cards > article:nth-child(n) > .documents-icon{
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body #situations .documents-cards > article:nth-child(n) > h3,
  body #foreign-documents .foreign-cards > article:nth-child(n) > h3{
    grid-column:auto!important;
    grid-row:auto!important;
    width:100%!important;
    max-width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
    justify-self:center!important;
  }

  /* 09 / 10 section labels: center only on mobile; desktop remains unchanged. */
  body .referral-section > .wrap > .eyebrow,
  body #contacts > .eyebrow{
    width:100%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
  }
  body .referral-section > .wrap > h2,
  body #contacts > h2{
    text-align:center!important;
  }

  /* 10 / Contacts: keep the phone on one line by reducing type, not wrapping it. */
  body #contacts .contact-phone-card h3{
    font-size:19px!important;
    line-height:1.15!important;
    letter-spacing:-.45px!important;
    white-space:nowrap!important;
    overflow:visible!important;
    transform:none!important;
  }
  body #contacts .contact-phone-card h3 a{
    white-space:nowrap!important;
  }

  /* Footer: prevent the compact "Наверх" control from colliding with the brand. */
  body .footer-official h3{
    font-size:16px!important;
    line-height:1.2!important;
    max-width:155px!important;
    padding-right:4px!important;
  }
  body .footer-actions > a{
    top:0!important;
    right:0!important;
    font-size:0!important;
  }
}

@media (max-width:379px){
  body .hero-actions .button{
    height:auto!important;
    min-height:56px!important;
    padding:12px 16px!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow-wrap:normal!important;
    text-align:center!important;
    justify-content:center!important;
  }
}


/* ===== 320–379px follow-up corrections ===== */
@media (max-width: 379px) {

  /* Civil professions: CTA must stay on one line and fit the card. */
  .jobs-section .job-card .job-card__cta,
  .jobs-section .job-card a,
  .jobs-section .job-card button,
  .civil-professions .job-card a,
  .civil-professions .job-card button {
    white-space: nowrap !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
    font-size: 12px !important;
    line-height: 1.1 !important;
    min-width: 0 !important;
    width: 100% !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    box-sizing: border-box !important;
  }

  /* Documents: sticker/icon stays left of the title, never centered above it. */
  .documents-section .doc-card,
  .documents .doc-card,
  .documents-grid .doc-card,
  section[data-section="documents"] .doc-card {
    text-align: center !important;
  }

  .documents-section .doc-card .sticker,
  .documents-section .doc-card .badge,
  .documents-section .doc-card .icon,
  .documents .doc-card .sticker,
  .documents .doc-card .badge,
  .documents .doc-card .icon,
  .documents-grid .doc-card .sticker,
  .documents-grid .doc-card .badge,
  .documents-grid .doc-card .icon,
  section[data-section="documents"] .doc-card .sticker,
  section[data-section="documents"] .doc-card .badge,
  section[data-section="documents"] .doc-card .icon {
    position: static !important;
    display: inline-flex !important;
    vertical-align: middle !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 6px 0 0 !important;
    transform: none !important;
  }

  .documents-section .doc-card h3,
  .documents .doc-card h3,
  .documents-grid .doc-card h3,
  section[data-section="documents"] .doc-card h3 {
    display: inline !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* Document request CTA: give the larger label enough horizontal room. */
  .documents-section a,
  .documents-section button,
  .documents .cta,
  .documents-grid .cta,
  section[data-section="documents"] .cta {
    min-height: 44px !important;
    height: auto !important;
    min-width: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 10px 14px !important;
    font-size: 13px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
  }

  /* Document lists: visually centered inside the card. */
  .documents-section .doc-card ul,
  .documents-section .doc-card ol,
  .documents .doc-card ul,
  .documents .doc-card ol,
  .documents-grid .doc-card ul,
  .documents-grid .doc-card ol,
  section[data-section="documents"] .doc-card ul,
  section[data-section="documents"] .doc-card ol {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: left !important;
  }

  /* 09 / ЗАРАБОТАТЬ and 10 / КОНТАКТЫ: centered on mobile only. */
  .earn-section > .container > .section-title,
  .earn-section .section-title,
  section[data-section="earn"] .section-title,
  .contacts-section > .container > .section-title,
  .contacts-section .section-title,
  section[data-section="contacts"] .section-title {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* Reduce the gap from 09 title to "Рекомендовать кандидата". */
  .earn-section .section-title,
  section[data-section="earn"] .section-title {
    margin-bottom: 18px !important;
  }

  .earn-section .recommendation,
  .earn-section .recommend,
  .earn-section .candidate-recommendation,
  section[data-section="earn"] .recommendation,
  section[data-section="earn"] .recommend {
    margin-top: 0 !important;
  }

  /* Contacts subtitle centered. */
  .contacts-section h2,
  .contacts-section h3,
  .contacts-section .subtitle,
  .contacts-section .section-subtitle,
  section[data-section="contacts"] h2,
  section[data-section="contacts"] h3,
  section[data-section="contacts"] .subtitle,
  section[data-section="contacts"] .section-subtitle {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}


/* ===== 320–379px: document card stickers removed ===== */
@media (max-width: 379px) {
  .documents-section .doc-card .sticker,
  .documents-section .doc-card .badge,
  .documents-section .doc-card .icon,
  .documents .doc-card .sticker,
  .documents .doc-card .badge,
  .documents .doc-card .icon,
  .documents-grid .doc-card .sticker,
  .documents-grid .doc-card .badge,
  .documents-grid .doc-card .icon,
  section[data-section="documents"] .doc-card .sticker,
  section[data-section="documents"] .doc-card .badge,
  section[data-section="documents"] .doc-card .icon {
    display: none !important;
  }
}

/* ===== 320px exact corrections based on actual DOM ===== */
@media (max-width: 379px) {

  /* HERO: "Позвонить или оставить заявку" must be one line. */
  body .hero-actions .button.primary[href="#contacts"] {
    width: 100% !important;
    min-width: 0 !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 6px 8px !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    word-break: normal !important;
    overflow-wrap: normal !important;
  }

  /* 06 / DOCUMENTS: remove all decorative stickers from mobile cards. */
  body #situations .documents-cards > article .documents-icon {
    display: none !important;
  }

  /* Restore clean single-column card flow after removing the icon column. */
  body #situations .documents-cards > article {
    display: block !important;
    text-align: center !important;
  }

  body #situations .documents-cards > article h3 {
    display: block !important;
    width: 100% !important;
    margin: 0 0 12px !important;
    text-align: center !important;
  }

  body #situations .documents-cards > article > p,
  body #situations .documents-cards > article > ul {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: left !important;
  }

  /* "ОСТАВИТЬ ЗАЯВКУ": smaller label, comfortable padding, no clipping. */
  body #situations .documents-cards > article .documents-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 42px !important;
    height: auto !important;
    padding: 8px 10px !important;
    font-size: 11px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
    margin-top: 16px !important;
  }

  /* 09 / EARN: tight, deliberate gap between eyebrow and main heading. */
  body #referral > .wrap > .eyebrow {
    width: 100% !important;
    margin: 0 0 5px !important;
    text-align: center !important;
    line-height: 1 !important;
  }

  body #referral > .wrap > h2 {
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1.12 !important;
  }

  /* 10 / CONTACTS: keep both headings centered. */
  body #contacts > .eyebrow,
  body #contacts > h2 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
}

/* ===== FINAL 320px corrections — verified against actual index.html DOM ===== */
@media (max-width:379px) {

  /* Hero CTA: same width as the hero cards, larger readable one-line label. */
  body .hero-actions {
    width: 100% !important;
    max-width: 100% !important;
  }
  body .hero-actions .button.primary[href="#contacts"] {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 46px !important;
    min-height: 46px !important;
    box-sizing: border-box !important;
    padding: 8px 10px !important;
    font-size: 13px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-align: center !important;
  }
/* Documents: restore centered text/list alignment. */
  body #situations .documents-cards > article {
    text-align: center !important;
  }
  body #situations .documents-cards > article > h3,
  body #situations .documents-cards > article > p {
    text-align: center !important;
  }
  body #situations .documents-cards > article > ul {
    width: fit-content !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
    padding-left: 0 !important;
    list-style-position: inside !important;
  }
  body #situations .documents-cards > article > ul > li {
    text-align: center !important;
  }

  /* 09: exact real DOM is #referral > .wrap > .eyebrow + h2. */
  body #referral > .wrap > .eyebrow {
    display: block !important;
    width: 100% !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: center !important;
    float: none !important;
    transform: none !important;
    line-height: 1 !important;
  }
  body #referral > .wrap > h2 {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1.08 !important;
  }

  /* 10: exact real DOM is #contacts > .eyebrow + h2. */
  body #contacts > .eyebrow {
    display: block !important;
    width: 100% !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: center !important;
    float: none !important;
    transform: none !important;
    line-height: 1 !important;
  }
  body #contacts > h2 {
    display: block !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 !important;
    text-align: center !important;
    line-height: 1.08 !important;
  }
}

/* ===== VERIFIED 320px corrections v7 ===== */
@media (max-width:379px) {

  /* 01 / Advantages, card 06: the calendar sticker sits directly before
     "Возможность", on the same baseline. The real DOM uses .info-card. */
  body #advantages > .info-grid > .info-card:nth-child(6) .advantage-icon {
    display: none !important;
  }
  body #advantages > .info-grid > .info-card:nth-child(6) h3 {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    white-space: nowrap !important;
    font-size: 14px !important;
    line-height: 1.15 !important;
    letter-spacing: -.35px !important;
  }
  body #advantages > .info-grid > .info-card:nth-child(6) h3::before {
    content: "" !important;
    display: inline-block !important;
    width: 18px !important;
    height: 18px !important;
    margin: 0 5px 0 0 !important;
    vertical-align: -4px !important;
    background: url("calendar-icon.png") center / contain no-repeat !important;
  }

  /* 09 / Earn: make the eyebrow itself a flex row, so centering is
     independent of inline width:max-content styles. */
  body #referral > .wrap > .eyebrow {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: center !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
  body #referral > .wrap > h2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  /* 10 / Contacts: same robust centering for both the eyebrow and title. */
  body #contacts > .eyebrow {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    text-align: center !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
  }
  body #contacts > h2 {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }
}

/* ===== 320px v8: advantages + third-block cards ===== */
@media (max-width:379px) {

  /* Advantages / 06: use the available horizontal space instead of shrinking the label. */
  body #advantages > .info-grid > .info-card:nth-child(6) h3 {
    font-size: 16px !important;
    letter-spacing: -.45px !important;
  }
  body #advantages > .info-grid > .info-card:nth-child(6) h3::before {
    width: 19px !important;
    height: 19px !important;
    margin-right: 5px !important;
  }

  /* Third block: five vehicle cards -> 2 columns on mobile.
     The helicopter card is hidden, leaving plane, tank, special equipment and drone. */
  body .vehicles-grid,
  body .equipment-grid,
  body .military-grid,
  body .profession-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  /* Hide only the vehicle card whose actual content says "Вертолет/Вертолёт".
     This is content-scoped, so it does not affect unrelated cards elsewhere. */
  body .vehicles-grid > article:has(h3),
  body .equipment-grid > article:has(h3),
  body .military-grid > article:has(h3),
  body .profession-grid > article:has(h3) {
    min-width: 0 !important;
  }

  body .vehicles-grid > article:has(h3:where(:is(*))) { }
}

/* ===== 320px v9: final corrections for Advantages + bonus tiles ===== */
@media (max-width:379px) {

  /* "Возможность выбора срока": use more of the card width. */
  body #advantages > .info-grid > .info-card:nth-child(6) h3 {
    font-size: 16px !important;
    line-height: 1.1 !important;
    letter-spacing: -.5px !important;
    white-space: nowrap !important;
  }
  body #advantages > .info-grid > .info-card:nth-child(6) h3::before {
    width: 19px !important;
    height: 19px !important;
    margin-right: 4px !important;
    vertical-align: -4px !important;
  }

  /* Third block: 4 remaining tiles, exactly 2 per row. */
  body .bonus-tiles {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    width: 100% !important;
  }
  body .bonus-tiles > .bonus-tile {
    min-width: 0 !important;
    width: auto !important;
  }
  /* 03 is the helicopter in the actual DOM: hide only this tile. */
  body .bonus-tiles > .bonus-tile:nth-child(3) {
    display: none !important;
  }
}

/* ===== Remove helicopter from the 5-card block below 420px ===== */
@media (max-width:419px) {
  body .bonus-tiles > .bonus-tile:nth-child(3) {
    display: none !important;
  }
}

/* ===== 320-419: four bonus cards fill the available width ===== */
@media (max-width:419px) {
  body .bonus-tiles {
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    width:100% !important;
    max-width:none !important;
    gap:10px !important;
  }
  body .bonus-tiles > .bonus-tile {
    display:flex !important;
    width:100% !important;
    max-width:none !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }
  body .bonus-tiles > .bonus-tile:nth-child(3) {
    display:none !important;
  }
}

/* ===== 320: 09 / 10 final geometry ===== */
@media (max-width:379px) {
  body #referral > .wrap > .eyebrow {
    width:100% !important;
    display:block !important;
    margin:0 0 28px !important;
    padding:0 !important;
    text-align:center !important;
    float:none !important;
    position:static !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
  }
  body #referral > .wrap > h2 {
    width:100% !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
  }
  body #contacts > .eyebrow {
    width:100% !important;
    display:block !important;
    margin:0 0 8px !important;
    padding:0 !important;
    text-align:center !important;
    float:none !important;
    position:static !important;
    left:auto !important;
    right:auto !important;
    transform:none !important;
  }
  body #contacts > h2 {
    width:100% !important;
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
  }
}

/* ===== 340–360px refinements ===== */
@media (min-width:340px) and (max-width:360px) {

  /* 10 / Contacts — three social buttons in one row. */
  body #contacts .social-links {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body #contacts .social-links > a {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }

  /* 06 / Documents — feature title same font size as the two other card titles. */
  body #situations .documents-cards > article.documents-feature > h3,
  body #situations .documents-cards > article.documents-card > h3 {
    font-size: 18px !important;
    line-height: 1.15 !important;
  }
}

/* ===== v13: override the older, more-specific #bonus grid rule ===== */
@media (max-width:419px) {
  body #bonus .bonus-tiles {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    grid-auto-flow: row !important;
    width: 100% !important;
    max-width: none !important;
    gap: 10px !important;
  }
  body #bonus .bonus-tiles > .bonus-tile {
    display: flex !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    grid-column: auto !important;
    box-sizing: border-box !important;
  }
  body #bonus .bonus-tiles > .bonus-tile:nth-child(3) {
    display: none !important;
  }
}

/* Keep the requested 340–360 adjustments explicit at the end of the cascade. */
@media (min-width:340px) and (max-width:360px) {
  body #contacts .social-card .social-links {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
  }
  body #contacts .social-card .social-links > a {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
  }
  body #situations .documents-cards > article.documents-feature > h3,
  body #situations .documents-cards > article.documents-card > h3 {
    font-size: 18px !important;
    line-height: 1.15 !important;
  }
}

/* ===== v14: override the old nth-child span rules in #bonus ===== */
@media (max-width:419px) {
  body #bonus .bonus-tiles .bonus-tile:nth-child(n) {
    grid-column: span 1 !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  body #bonus .bonus-tiles .bonus-tile:nth-child(3) {
    display: none !important;
  }
}

/* ===== v15: 09 / ЗАРАБОТАТЬ — remove the excessive gap ===== */
@media (max-width:379px) {
  body #referral {
    padding-top: 0 !important;
  }
  body #referral > .wrap {
    padding-top: 0 !important;
  }
  body #referral > .wrap > .eyebrow {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 6px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1 !important;
  }
  body #referral > .wrap > h2 {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 1.08 !important;
  }
}

/* ===== v16: 375px + 390px corrections ===== */

/* 375: social buttons must remain one row. */
@media (min-width:361px) and (max-width:379px) {
  body #contacts .social-card .social-links {
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
  }
  body #contacts .social-card .social-links > a {
    width:100% !important;
    min-width:0 !important;
    max-width:none !important;
    box-sizing:border-box !important;
    margin:0 !important;
  }
}

/* 390: keep the third hero payment description to two lines. */
@media (min-width:380px) and (max-width:399px) {
  body .hero-points > div:nth-child(3) p {
    font-size:10.5px !important;
    line-height:1.22 !important;
    letter-spacing:-.15px !important;
  }

  /* 06 / Documents: remove all three stickers and center all card headings. */
  body #situations .documents-cards > article .documents-icon {
    display:none !important;
  }
  body #situations .documents-cards > article,
  body #situations .documents-cards > article h3 {
    text-align:center !important;
  }
  body #situations .documents-cards > article h3 {
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* 07 / Foreign citizens: center "Страны" and "Документы". */
  body #foreign-documents .foreign-cards > article:nth-child(1) h3,
  body #foreign-documents .foreign-cards > article:nth-child(2) h3 {
    width:100% !important;
    text-align:center !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  /* 09 / Earn: equal, deliberate distance from the 01/02/03 square to each title. */
  body #referral .referral-steps article {
    align-items:center !important;
  }
  body #referral .referral-steps article b {
    flex:0 0 auto !important;
    margin:0 auto !important;
  }
  body #referral .referral-steps article h3 {
    width:100% !important;
    margin:10px 0 0 !important;
    padding:0 !important;
    text-align:center !important;
    line-height:1.15 !important;
  }
}

/* ===== v17: 414px — documents + foreign citizen card headings ===== */
@media (min-width:400px) and (max-width:419px) {

  /* 06 / Documents: remove stickers from all three cards and center headings. */
  body #situations .documents-cards > article .documents-icon {
    display:none !important;
  }
  body #situations .documents-cards > article {
    text-align:center !important;
  }
  body #situations .documents-cards > article > h3 {
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    justify-self:center !important;
  }

  /* 07 / Foreign citizens: center all card headings. */
  body #foreign-documents .foreign-cards > article > h3 {
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    justify-self:center !important;
  }
}

/* ===== v18: 414px — 07 / Foreign citizens headings ===== */
@media (min-width:400px) and (max-width:419px) {
  body #foreign-documents .foreign-cards > article:nth-child(1) > h3,
  body #foreign-documents .foreign-cards > article:nth-child(2) > h3 {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    justify-self:center !important;
    align-self:center !important;
  }
}

/* ===== v19: 09 / ЗАРАБОТАТЬ — remove hidden duplicate heading line on mobile ===== */
@media (max-width:700px) {
  body #referral > .wrap > h2 {
    color: var(--ink) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    position: static !important;
    transform: none !important;
  }
  body #referral > .wrap > h2::after {
    content: none !important;
    display: none !important;
  }
}

/* 320px: keep the eyebrow-to-heading gap at 12px. */
@media (max-width:379px) {
  body #referral > .wrap > .eyebrow {
    margin-bottom: 12px !important;
  }
  body #referral > .wrap > h2 {
    margin-top: 0 !important;
  }
}


/* v22: 09 / ЗАРАБОТАТЬ — restore the same top breathing room below 379px.
   The 380px+ mobile layout already receives 36px from the base mobile rule. */
@media (max-width:379px){
  body #referral{
    padding-top:36px !important;
  }
}

/* v24: desktop 10 / Social Networks — use the site's olive/neutral button style.
   Mobile rules are intentionally untouched. */
@media (min-width:701px){
  body #contacts .social-links{
    display:flex !important;
    flex-wrap:nowrap !important;
    width:auto !important;
    max-width:none !important;
    gap:12px !important;
    margin-top:18px !important;
  }
  body #contacts .social-links > a{
    display:inline-flex !important;
    flex:0 0 auto !important;
    align-items:center !important;
    justify-content:center !important;
    min-width:auto !important;
    max-width:none !important;
    width:auto !important;
    min-height:46px !important;
    height:auto !important;
    box-sizing:border-box !important;
    padding:10px 16px !important;
    border:1px solid #c8cdb8 !important;
    border-radius:20px !important;
    background:#e0e3d2 !important;
    color:#41453c !important;
    font-family:'Montserrat',Arial,Helvetica,sans-serif !important;
    font-size:16px !important;
    font-weight:600 !important;
    line-height:1.4 !important;
    letter-spacing:0 !important;
    text-align:center !important;
    text-decoration:none !important;
    transform:none !important;
  }
  body #contacts .social-links > a:hover,
  body #contacts .social-links > a:focus-visible{
    background:#d5dac5 !important;
    border-color:#aeb89a !important;
    color:#41453c !important;
    text-decoration:none !important;
    transform:translateY(-1px) !important;
  }
}

/* ===== v23: 380–700px — 07 / Foreign citizens: remove stickers and center headings ===== */
@media (min-width:380px) and (max-width:700px) {
  body #foreign-documents .foreign-cards > article > .documents-icon {
    display:none !important;
  }

  body #foreign-documents .foreign-cards > article > h3 {
    grid-column:1 / -1 !important;
    width:100% !important;
    max-width:100% !important;
    margin:0 !important;
    justify-self:center !important;
    align-self:center !important;
    text-align:center !important;
  }
}

/* v26: 701–791px tablet correction.
   At this narrow desktop/tablet range the two-column contacts layout becomes
   too narrow and the earlier -50px section offsets pull sections upward.
   Keep the established desktop layout from 792px onward. */
@media (min-width:701px) and (max-width:791px){
  body #referral{
    margin-top:0 !important;
  }

  body #contacts{
    margin-top:0 !important;
  }

  body #contacts .contacts-layout{
    grid-template-columns:minmax(0,1fr) !important;
    gap:24px !important;
    width:100% !important;
    min-width:0 !important;
  }

  body #contacts .contact-info,
  body #contacts .contact-card,
  body #contacts .contact-form{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
  }

  body #contacts .contact-form{
    margin:0 !important;
  }
}

/* ===== v27: 430px — 06 / Documents + 07 / Foreign citizens heading alignment ===== */
@media (min-width:420px) and (max-width:479px) {
  /* 06 / Documents: remove the decorative stickers and center all three headings. */
  body #situations .documents-cards > article > .documents-icon {
    display:none !important;
  }
  body #situations .documents-cards > article {
    text-align:center !important;
  }
  body #situations .documents-cards > article > h3 {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    justify-self:center !important;
    align-self:center !important;
  }

  /* 07 / Foreign citizens: center the requested headings (and the third one for consistency). */
  body #foreign-documents .foreign-cards > article > h3 {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    justify-self:center !important;
    align-self:center !important;
  }
}

/* 768px fix: keep the section 05 disclaimer below the heading instead of pulling it upward. */
@media (min-width:701px) and (max-width:791px) {
  body #jobs > .jobs-section-heading .jobs-disclaimer {
    top: 0 !important;
  }
}


/* v33 clean text-source normalization: content is authored in HTML, not CSS pseudo-elements. */
body .header .brand::after,
body #situations .documents-cards > article:nth-child(1) h3::after,
body #support .stages-grid .info-card h3::after,
body #referral .referral-steps article h3::after,
body #referral .referral-reward strong::before,
body #referral .referral-reward strong::after,
body #foreign-documents .foreign-payout strong::before,
body #foreign-documents .foreign-payout strong::after,
body #salary .pay-card .pay-value::before,
body #salary .pay-card .pay-value::after,
body #salary .condition-row > div:nth-child(3) span::before,
body #salary .condition-row > div:nth-child(3) span::after,
body .footer-actions > a::before,
body .hero-points > div > p > strong::before,
body .hero-points > div > p > strong::after{
  content:none !important;
  display:none !important;
}

@media (max-width:700px){
  body .hero-points > div > p > strong{
    display:block !important;
    font-size:21px !important;
    line-height:1.15 !important;
    font-weight:700 !important;
    white-space:normal !important;
    margin:0 0 10px !important;
  }
  body #salary .pay-card .pay-value{
    font-size:clamp(22px,7vw,30px) !important;
    line-height:1.08 !important;
    text-align:center !important;
    white-space:normal !important;
  }
}

/* v33: restore the real HTML text sizing after disabling duplicate pseudo-text. */
body .header .brand { font-size:16px !important; }
@media (max-width:700px){
  body #situations .documents-cards > article:nth-child(1) h3 { font-size:18px !important; line-height:1.1 !important; }
  body #support .stages-grid .info-card h3 { font-size:22px !important; }
  body #referral .referral-steps article h3 { font-size:18px !important; line-height:1.1 !important; }
  body #referral .referral-reward strong { font-size:clamp(42px,13vw,64px) !important; line-height:1 !important; white-space:nowrap !important; }
  body #foreign-documents .foreign-payout strong { font-size:34px !important; line-height:1.05 !important; white-space:nowrap !important; }
}

/* v34: do not synthesize business values with pseudo-elements; use the editable HTML/data text. */
body #salary .pay-card .pay-value::before,
body #salary .pay-card .pay-value::after,
body #referral .referral-reward strong::before,
body #referral .referral-reward strong::after,
body #foreign-documents .foreign-payout strong::before,
body #foreign-documents .foreign-payout strong::after,
body #referral .referral-form h2::before,
body #referral .referral-form h2::after {
  content: none !important;
  display: none !important;
}
@media (max-width:700px){
  body #salary .pay-card .pay-value {
    font-size: clamp(22px,7vw,30px) !important;
    line-height: 1.08 !important;
    text-align: center !important;
    white-space: normal !important;
  }
  body #referral .referral-reward strong {
    font-size: clamp(42px,13vw,64px) !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }
  body #foreign-documents .foreign-payout strong {
    font-size: 34px !important;
    line-height: 1.05 !important;
    white-space: nowrap !important;
  }
}
/* v35: hero values are real text only; never generate a second value with pseudo-elements. */
body .hero-points > div > p > strong::before,
body .hero-points > div > p > strong::after,
body .hero-points > div > p > .hero-card-label::before,
body .hero-points > div > p > .hero-card-label::after {
  content: none !important;
  display: none !important;
}

/* v34: restore real editable citizenship text after removing its old pseudo-text split. */
@media (max-width:700px){
  body #salary .condition-row > div:nth-child(3) span{
    display:block !important;
    font-size:20px !important;
    line-height:1.15 !important;
    white-space:normal !important;
  }
}

/* v36: targeted responsive repairs, kept at the end of the cascade. */
@media (max-width:700px){
  body #salary > .button,
  body #salary > .button.salary-apply,
  body #salary > .button.salary-apply-copy{
    position:static !important; left:auto !important; right:auto !important; bottom:auto !important;
    display:flex !important; width:100% !important; max-width:none !important;
    min-height:46px !important; height:auto !important; margin:10px 0 0 !important;
    padding:10px 14px !important; white-space:normal !important;
    justify-content:center !important; text-align:center !important;
  }

  /* Editable seven-digit values remain a single line in the payment tiles. */
  body #bonus .bonus-tile .bonus-tile-number{
    display:block !important; width:100% !important; min-width:0 !important;
    font-size:clamp(18px,6vw,28px) !important; line-height:1 !important;
    letter-spacing:clamp(-1.2px,-.3vw,0px) !important; white-space:nowrap !important;
    font-variant-numeric:tabular-nums !important;
  }

  /* The long third hero caption fits in two readable lines without clipping. */
  body .hero-points > div:nth-child(3){ padding-left:10px !important; padding-right:10px !important; }
  body .hero-points > div:nth-child(3) .hero-card-label{
    display:block !important; font-size:clamp(8px,2.5vw,12px) !important;
    line-height:1.12 !important; letter-spacing:-.15px !important;
  }

  /* Documents and foreign-citizen cards share one centered mobile axis. */
  body #situations .documents-cards > article .documents-icon,
  body #foreign-documents .foreign-cards > article .documents-icon{ display:none !important; }
  body #situations .documents-cards > article,
  body #foreign-documents .foreign-cards > article{
    display:block !important; width:100% !important; min-width:0 !important;
    box-sizing:border-box !important; text-align:center !important;
  }
  body #situations .documents-cards > article > h3,
  body #foreign-documents .foreign-cards > article > h3{ width:100% !important; margin-left:auto !important; margin-right:auto !important; text-align:center !important; }
  body #foreign-documents .foreign-bottom{ display:grid !important; grid-template-columns:minmax(0,1fr) !important; gap:14px !important; }
  body #foreign-documents .foreign-payout,
  body #foreign-documents .foreign-benefits{ width:100% !important; min-width:0 !important; box-sizing:border-box !important; padding-left:24px !important; padding-right:24px !important; }

  /* Contact buttons and four choices never wrap on narrow phones. */
  body #contacts .social-card .social-links{
    display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    flex-wrap:nowrap !important; gap:6px !important; width:100% !important;
  }
  body #contacts .social-card .social-links > a{
    width:100% !important; min-width:0 !important; min-height:34px !important;
    height:auto !important; padding:5px 3px !important; font-size:clamp(10px,3.25vw,13px) !important;
    line-height:1.1 !important; white-space:nowrap !important;
  }
  body #phone-form fieldset{ display:flex !important; flex-wrap:nowrap !important; align-items:center !important; gap:6px !important; min-width:0 !important; }
  body #phone-form fieldset legend{ width:100% !important; }
  body #phone-form fieldset label{
    display:flex !important; align-items:center !important; flex:0 1 auto !important;
    min-width:0 !important; margin:0 !important; font-size:clamp(10px,3.15vw,13px) !important;
    line-height:1.1 !important; white-space:nowrap !important;
  }
  body #phone-form fieldset input[type=radio]{ width:13px !important; height:13px !important; margin:0 3px 0 0 !important; flex:0 0 auto !important; }

  /* The sixth advantage title is allowed to use its second line below 380px. */
  body #advantages > .info-grid > .info-card:nth-child(6) h3{
    width:100% !important; max-width:100% !important; white-space:normal !important; overflow-wrap:normal !important;
  }
}

/* v37: keep editable payment values inside every narrow special-payment tile. */
@media (max-width:700px){
  body #bonus .bonus-tile .bonus-tile-number{
    font-size:clamp(11px,4.2vw,18px) !important;
    letter-spacing:-1.8px !important;
    word-spacing:-.28em !important;
    transform:scaleX(.9) !important;
    transform-origin:center !important;
    white-space:nowrap !important;
  }
}

/* On wider phones the stage marker, time badge and heading share one centered axis. */
@media (min-width:380px) and (max-width:700px){
  body #support .stages-grid .info-card{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    min-height:0 !important;
    height:auto !important;
    padding:18px !important;
  }
  body #support .stages-grid .item-no,
  body #support .stages-grid .stage-time,
  body #support .stages-grid .info-card h3,
  body #support .stages-grid .info-card p{
    position:static !important;
    grid-column:auto !important;
    grid-row:auto !important;
    justify-self:center !important;
    align-self:center !important;
    text-align:center !important;
    transform:none !important;
  }
  body #support .stages-grid .item-no{ margin:0 0 10px !important; }
  body #support .stages-grid .stage-time{ margin:0 0 12px !important; white-space:nowrap !important; }
  body #support .stages-grid .info-card h3{ width:100% !important; margin:0 !important; line-height:1.15 !important; }
  body #support .stages-grid .info-card p{ width:100% !important; margin:10px 0 0 !important; }
}

/* The two support notes are deliberately secondary to the card content. */
body #support .support-columns article > p{
  font-size:11px !important;
  line-height:1.1 !important;
}

/* Use the actual link text for the footer action on all phone widths. */
@media (max-width:700px){
  body .footer-actions > a{
    display:inline-flex !important;
    width:auto !important;
    min-width:74px !important;
    min-height:38px !important;
    padding:8px 12px !important;
    font-size:13px !important;
    line-height:1.1 !important;
    color:#fbfaf5 !important;
  }
  body .footer-actions > a::before{ content:none !important; display:none !important; }
}

/* The final footer note stays compact without overlapping its own lines. */
body .footer-bottom .footer-copy{ line-height:1 !important; }

/* Support cards below 380px use the same calm vertical flow as wider phones. */
@media (max-width:379px){
  body #support .stages-grid .info-card{
    display:flex !important; flex-direction:column !important; align-items:flex-start !important;
    min-height:0 !important; height:auto !important; padding:18px !important; overflow:visible !important;
  }
  body #support .stages-grid .item-no{ position:static !important; width:42px !important; height:42px !important; margin:0 0 10px !important; font-size:18px !important; }
  body #support .stages-grid .stage-time{ position:static !important; margin:0 0 12px !important; font-size:12px !important; }
  body #support .stages-grid .info-card h3{ position:static !important; width:100% !important; margin:0 !important; font-size:20px !important; line-height:1.15 !important; }
  body #support .stages-grid .info-card p{ position:static !important; width:100% !important; margin:10px 0 0 !important; }
}

/* Footer note is supporting copy in every layout. */
body .footer-bottom .footer-copy{ font-size:10px !important; line-height:1.15 !important; }

/* The sixth advantage card keeps a dedicated left lane for its sticker. */
@media (max-width:700px){
  body #advantages > .info-grid > .info-card:nth-child(6) h3{
    box-sizing:border-box !important;
    padding-left:30px !important;
    padding-right:18px !important;
    min-width:0 !important;
    white-space:normal !important;
    overflow-wrap:normal !important;
  }
  body #advantages > .info-grid > .info-card:nth-child(6) .advantage-icon{
    z-index:3 !important;
  }
}

@media (max-width:700px){
  body #salary > .button,
  body #salary > .button.salary-apply,
  body #salary > .button.salary-apply-copy{
    box-sizing:border-box !important;
  }
}

/* v38: corrections to match the approved mobile brief exactly. */
@media (max-width:700px){
  /* All three payout actions are one real container width, including padding. */
  body #salary > a.button,
  body #salary > a.button.secondary,
  body #salary > a.button.salary-apply{
    display:flex !important;
    inline-size:100% !important;
    max-inline-size:100% !important;
    flex:0 0 100% !important;
    align-self:stretch !important;
    box-sizing:border-box !important;
  }

  /* 03: retain the intended large, bold amount; only tighten its spacing. */
  body #bonus .bonus-tile .bonus-tile-number{
    display:block !important;
    font-size:26px !important;
    font-weight:700 !important;
    line-height:1 !important;
    letter-spacing:-2px !important;
    word-spacing:-6px !important;
    transform:none !important;
    white-space:nowrap !important;
  }

  /* 04: the decorative numbers stay left; the actual content is centered. */
  body #support .stages-grid .info-card{
    position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
    min-height:0 !important;
    height:auto !important;
    padding:18px !important;
  }
  body #support .stages-grid .item-no{
    position:absolute !important;
    top:18px !important;
    left:18px !important;
    width:42px !important;
    height:42px !important;
    margin:0 !important;
    font-size:18px !important;
  }
  body #support .stages-grid .stage-time{
    position:static !important;
    margin:0 0 12px !important;
    transform:none !important;
    justify-self:center !important;
    align-self:center !important;
    white-space:nowrap !important;
  }
  body #support .stages-grid .info-card h3,
  body #support .stages-grid .info-card p{
    position:static !important;
    grid-column:auto !important;
    grid-row:auto !important;
    width:100% !important;
    margin:0 !important;
    text-align:center !important;
  }
  body #support .stages-grid .info-card p{ margin-top:10px !important; }

  /* 06 / 07: titles and the foreign-payout note share the card centre. */
  body #situations .documents-cards > article > h3,
  body #foreign-documents .foreign-cards > article > h3,
  body #foreign-documents .documents-feature > h3{
    display:block !important;
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
  }
  body #foreign-documents .foreign-payout p{
    display:block !important;
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
    white-space:normal !important;
    overflow-wrap:normal !important;
  }

  /* 10: both top contact-card values use one mobile scale. */
  body #contacts .contact-phone-card h3,
  body #contacts .contact-phone-card h3 a,
  body #contacts .contact-phone-card + .contact-card h3{
    font-size:clamp(28px,8vw,36px) !important;
    line-height:1.15 !important;
  }

  /* Remove spare vertical space around the small footer copy. */
  body .footer-bottom{ padding-top:8px !important; }
  body .footer-bottom .footer-copy{
    display:block !important;
    margin:0 !important;
    line-height:.9 !important;
  }
}

/* The two support notes are 10% larger than the original 15px treatment. */
body #support .support-columns article > p{
  font-size:16.5px !important;
  line-height:1.2 !important;
}

/* v39: final refinements from the device check. */
/* The support notes stay visibly secondary: 10% above the compact version,
   not at the same size as normal paragraph copy. */
body #support .support-columns article > p{
  font-size:12px !important;
  line-height:1.14 !important;
}

/* Desktop uses the same compact rhythm already approved on phones. */
body .footer-bottom .footer-copy{ line-height:.9 !important; }

@media (max-width:700px){
  /* 01: number and caption sit on a fixed, balanced three-gap rhythm. */
  body .hero-points > div,
  body .hero-points > div:last-child{
    display:block !important;
    height:82px !important;
    min-height:82px !important;
    max-height:82px !important;
    padding:0 12px !important;
  }
  body .hero-points > div p{
    display:grid !important;
    grid-template-rows:11px 23px 11px 24px 11px !important;
    height:80px !important;
    min-height:80px !important;
    align-content:start !important;
    gap:0 !important;
    padding:0 !important;
  }
  body .hero-points > div strong{
    grid-row:2 !important;
    align-self:center !important;
    margin:0 !important;
  }
  body .hero-points > div .hero-card-label{
    grid-row:4 !important;
    align-self:start !important;
    min-height:24px !important;
    max-height:24px !important;
    margin:0 !important;
  }

  /* 01: four opening cards — compact, identical and limited to two caption lines. */
  body .hero-points{
    grid-auto-rows:86px !important;
    gap:9px !important;
  }
  body .hero-points > div,
  body .hero-points > div:last-child{
    box-sizing:border-box !important;
    height:86px !important;
    min-height:86px !important;
    max-height:86px !important;
    padding:12px !important;
  }
  body .hero-points > div p{
    gap:8px !important;
    line-height:1 !important;
  }
  body .hero-points > div strong{
    font-size:22px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    overflow:hidden !important;
    font-size:10px !important;
    line-height:1.15 !important;
  }

  /* 01: keep the label and value together, with real breathing room around them. */
  body .hero-points > div{
    min-height:0 !important;
    height:auto !important;
    padding:14px 16px !important;
    align-items:center !important;
  }
  body .hero-points > div p{
    height:auto !important;
    min-height:0 !important;
    justify-content:flex-start !important;
    gap:7px !important;
    padding:0 !important;
  }
  body .hero-points > div strong{ margin-top:0 !important; }

  /* 02: the three actions are one fixed, safe height at every phone width. */
  body #salary > a.button{
    min-height:64px !important;
    height:64px !important;
  }

  /* 04: keep the pill close to its heading and make card titles quieter. */
  body #support .stages-grid .stage-time{ display:block !important; margin:0 0 5px !important; }
  body #support .stages-grid .info-card h3{
    font-size:18px !important;
    line-height:1.12 !important;
  }

  /* 05: this explanatory note remains less prominent than its section copy. */
  body #jobs .jobs-disclaimer{
    font-size:13px !important;
    line-height:1.3 !important;
  }

  /* 06 / 07: align the actual heading/content wrappers, including iPhone widths. */
  body #situations .documents-cards > article > h3,
  body #situations .documents-cards > article .documents-card-title,
  body #foreign-documents .foreign-cards > article > h3,
  body #foreign-documents .foreign-cards > article .documents-card-title,
  body #foreign-documents .documents-feature > h3,
  body #foreign-documents .documents-feature > p,
  body #foreign-documents .documents-feature > ul{
    width:100% !important;
    margin-left:auto !important;
    margin-right:auto !important;
    text-align:center !important;
  }
  body #foreign-documents .documents-feature > ul{
    padding-left:0 !important;
    list-style-position:inside !important;
  }
  body #situations .documents-cards > article > h3,
  body #foreign-documents .foreign-cards > article > h3,
  body #foreign-documents .documents-feature > h3{
    position:static !important;
    transform:none !important;
  }

  /* 06 / 07: override the legacy two-column sticker layout completely.
     Every card uses one centred mobile column at every phone width. */
  body #situations .documents-cards > article,
  body #foreign-documents .foreign-cards > article{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    text-align:center !important;
  }
  body #situations .documents-cards > article > .documents-icon,
  body #foreign-documents .foreign-cards > article > .documents-icon{
    display:none !important;
  }
  body #situations .documents-cards > article > h3,
  body #foreign-documents .foreign-cards > article > h3{
    grid-column:auto !important;
    grid-row:auto !important;
    justify-self:center !important;
    align-self:center !important;
    width:100% !important;
    text-align:center !important;
  }
  body #situations .documents-cards > article > ul,
  body #foreign-documents .foreign-cards > article > ul,
  body #foreign-documents .foreign-cards > article > p{
    width:100% !important;
    text-align:center !important;
  }

  /* 09: the step names are single lines, with an actual text space between words. */
  body #referral .referral-steps article h3{
    font-size:18px !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
    letter-spacing:-.35px !important;
  }
}

/* Final mobile rhythm: 5 px / amount / 5 px / caption / 5 px. */
@media (max-width:700px){
  body .hero-points > div,
  body .hero-points > div:last-child{
    display:block !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:5px 12px !important;
    overflow:visible !important;
  }
  body .hero-points > div p{
    display:flex !important;
    flex-direction:column !important;
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    padding:0 !important;
    gap:5px !important;
    overflow:visible !important;
  }
  body .hero-points > div strong{
    order:0 !important;
    margin:0 !important;
    font-size:22px !important;
    line-height:1 !important;
  }
  body .hero-points > div .hero-card-label{
    order:1 !important;
    display:block !important;
    min-height:0 !important;
    max-height:none !important;
    margin:0 !important;
    overflow:visible !important;
    font-size:10px !important;
    line-height:12px !important;
  }
}
/* 02: одинаковые компактные поля внутри трёх кнопок на телефоне. */
@media (max-width:700px){
  body .salary-band #salary > a.button:nth-of-type(1),
  body .salary-band #salary > a.button:nth-of-type(2),
  body .salary-band #salary > a.button.primary.salary-apply.salary-apply-copy{
    height:auto !important;
    min-height:0 !important;
    max-height:none !important;
    padding:5px 12px !important;
  }
}

@media (max-width:700px){
  body #support .stages-grid .info-card{ gap:5px !important; }
  body #support .stages-grid .stage-time{ margin:0 !important; }
}

@media (max-width:700px){
  body #situations .documents-cards > article > h3,
  body #situations .documents-cards > article > p,
  body #situations .documents-cards > article > ul,
  body #situations .documents-cards > article > a{
    width:100% !important;
    text-align:center !important;
    align-self:center !important;
  }
}

@media (max-width:700px){
  body #faq .faqs summary{
    font-size:16px!important;
    line-height:1.25!important;
  }
}