/* Proflid — pixel-faithful to Figma 1920 / 390 */
:root {
  --c-text: #1c1e1b;
  --c-green: #365f2b;
  --c-mid: #4f6743;
  --c-muted: #6f746d;
  --c-line: #d9ded5;
  --c-bg: #fff5ed;
  --c-bg-alt: #fffbf9;
  --c-cream: #faf8f4;
  --c-panel: #f4f0ea;
  --c-request: #faf9f7;
  --c-white: #ffffff;
  --c-glow: #eef4e8b8;
  --font: "Montserrat", system-ui, sans-serif;
  --serif: "Prata", "Times New Roman", serif;
  --container: 1520px;
  --side: 200px;
  --radius-btn: 16px;
  --radius-card: 24px;
  --radius-pill: 24px;
  --header-h: 117px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--header-h); }
html, body { margin: 0; padding: 0; }
body {
  font-family: var(--font);
  font-weight: 400;
  color: var(--c-text);
  background: var(--c-bg);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; height: auto; display: block; }
button, input, textarea, select { font-family: inherit; }
a { color: inherit; }
ul, ol { margin: 0; padding: 0; list-style: none; }
p { margin: 0; }
h1, h2, h3 { margin: 0; font-family: var(--serif); font-weight: 400; color: var(--c-text); }
h1 em, h2 em, h3 em { font-style: normal; color: var(--c-mid); }

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

.container {
  width: min(var(--container), calc(100% - 40px));
  margin: 0 auto;
}
@media (min-width: 1920px) {
  .container { width: 1520px; }
}

/* ===== Buttons ===== */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  border: 0;
  cursor: pointer;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  text-decoration: none;
  white-space: nowrap;
  transition: background .2s, color .2s, box-shadow .2s, transform .15s;
}
.btn--primary {
  background: var(--c-mid);
  color: #fff;
  border-radius: var(--radius-btn);
}
.btn--primary:hover { background: #3f5536; }
.btn--primary:active { transform: translateY(1px); }
.btn--secondary {
  background: #fff;
  color: var(--c-green);
  border: 1px solid var(--c-line);
  border-radius: var(--radius-btn);
}
.btn--secondary:hover { background: var(--c-cream); }
.btn--header { width: 210px; height: 56px; flex-shrink: 0; }
.btn--lg { height: 72px; padding: 0 36px; min-width: 296px; }
.btn--secondary.btn--lg { min-width: 328px; }
.btn--submit {
  width: 100%;
  height: 68px;
  position: relative;
  min-width: 0;
}
.btn--submit img { position: absolute; right: 16px; top: 50%; transform: translateY(-50%); }
.btn--block { width: 100%; min-width: 0; height: 64px; }

/* ===== Eyebrow ===== */
.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  height: 44px;
  padding: 0 22px 0 18px;
  background: var(--c-cream);
  border: 1px solid var(--c-line);
  border-radius: 22px;
  font-size: 15px;
  line-height: 22px;
  color: var(--c-green);
  white-space: nowrap;
}
.eyebrow--on-light { background: #fff; height: 42px; border-radius: 21px; }
.eyebrow__dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-mid);
  flex-shrink: 0;
}

.section-head { display: flex; flex-direction: column; align-items: flex-start; }
.section-head--center { align-items: center; text-align: center; }
.section-head h2 {
  font-size: 72px;
  line-height: 80px;
  margin-top: 26px;
}
.section-lead {
  margin-top: 6px;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-muted);
}
.section-lead--wide { max-width: 626px; }
.section-alt { background: var(--c-bg-alt); }

/* Decorative pin (vertical line + dot at section top) */
.decor-pin {
  width: 5px;
  height: 51px;
  margin: 0 auto;
  position: relative;
}
.decor-pin::before {
  content: "";
  position: absolute;
  left: 2px; top: 0;
  width: 1px; height: 47px;
  background: var(--c-mid);
}
.decor-pin::after {
  content: "";
  position: absolute;
  left: 0; top: 46px;
  width: 5px; height: 5px;
  border-radius: 50%;
  background: var(--c-mid);
}

/* ===== Header ===== */
.site-header {
  position: sticky;
  top: 0;
  z-index: 50;
  padding-top: 30px;
  background: var(--c-bg);
}
.site-header.is-scrolled {
  box-shadow: 0 4px 16px rgba(28, 30, 27, 0.08);
}
.header__inner {
  display: flex;
  align-items: center;
  height: 87px;
  position: relative;
}
.site-header::after {
  content: "";
  display: block;
  height: 1px;
  background: var(--c-line);
  width: 100%;
}
.logo { display: flex; flex-shrink: 0; }
.logo img {
  width: 185px;
  height: 45px;
  object-fit: contain;
  object-position: left center;
}
.header__nav { margin-left: 72px; }
.header__nav ul { display: flex; align-items: center; gap: 28px; }
.header__nav a {
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  color: var(--c-text);
  text-decoration: none;
}
.header__nav a:hover { color: var(--c-green); }
.header__phone {
  margin-left: auto;
  display: flex;
  flex-direction: column;
  gap: 6px;
  width: 247px;
  margin-right: 36px;
}
.header__phone-num {
  font-weight: 600;
  font-size: 18px;
  line-height: 22px;
  color: var(--c-text);
  text-decoration: none;
}
.header__hours {
  font-size: 16px;
  line-height: 20px;
  color: var(--c-muted);
}
.header__menu-btn {
  display: none;
  width: 55px; height: 55px;
  padding: 0; border: 0;
  background: transparent;
  cursor: pointer;
}
.header__menu-btn img { width: 55px; height: 55px; }

/* ===== Hero ===== */
.hero { padding-top: 25px; overflow: hidden; }
.hero__grid {
  display: grid;
  grid-template-columns: 720px 1fr;
  min-height: 938px;
  position: relative;
}
.hero__content { padding-top: 45px; position: relative; z-index: 2; }
.hero__title {
  margin-top: 26px;
  font-size: 104px;
  line-height: 112px;
}
.hero__lead {
  margin-top: 18px;
  max-width: 630px;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-muted);
}
.hero__actions {
  display: flex;
  gap: 24px;
  margin-top: 32px;
  flex-wrap: wrap;
}
.hero__visual {
  position: relative;
  min-height: 938px;
}
.hero__mascot {
  position: absolute;
  right: 98px; /* 1520 - (1016-200) - 606 = 98? cover at 200, mascot at 1016, so left in cover = 816, width 606, right = 1520-816-606=98 */
  bottom: 0;
  width: 606px;
  height: 938px;
  object-fit: contain;
  object-position: bottom center;
  z-index: 2;
  pointer-events: none;
}
.hero__orbits { position: absolute; inset: 0; pointer-events: none; z-index: 1; }
.hero__orbit {
  position: absolute;
  border-radius: 50%;
  border: 1px solid;
}
.hero__orbit--1 { width: 700px; height: 700px; right: 90px; top: 56px; border-color: #d9ded59e; } /* 930-200=730 from left of 1520, right=1520-730-700=90; top 198-142=56 */
.hero__orbit--2 { width: 560px; height: 560px; right: 160px; top: 126px; border-color: #d9ded58f; } /* 1000-200=800, right=1520-800-560=160; top 268-142=126 */
.hero__orbit--3 { width: 420px; height: 420px; right: 230px; top: 196px; border-color: #d9ded57a; }
.hero__dot {
  position: absolute;
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--c-mid);
  z-index: 2;
}
.hero__dot--1 { right: 439px; top: 118px; } /* 1073-200=873 from left, right=1520-873-8=639? Let me recalc: x=1073, cover starts 200, so 873 from container left. right = 1520-873-8=639. Hmm I used 439. Let me use exact: left: 873px */
.hero__dot--1 { left: 873px; top: 118px; right: auto; }
.hero__dot--2 { left: 806px; top: 474px; right: auto; } /* 1006-200=806, 616-142=474 */

.hero-card {
  position: absolute;
  z-index: 3;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 112px;
  padding: 0 16px 0 21px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 20px;
  box-shadow: 0 8px 24px #1f2e1c01;
}
.hero-card img { width: 50px; height: 50px; flex-shrink: 0; }
.hero-card__label {
  display: block;
  font-weight: 600;
  font-size: 22px;
  line-height: 20px;
  color: var(--c-muted);
}
.hero-card strong {
  display: block;
  margin-top: 10px;
  font-family: var(--font);
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: var(--c-text);
}
/* positions relative to visual column which is the 2nd grid col starting after 720px.
   Container is 1520. Visual starts at 720.
   Card "Подбор" at x=872 page, container x=872-200=672, visual-local = 672-720 = -48. So it overlaps left.
   Better: position cards relative to .hero__grid (the 1520 container).
*/
.hero__grid { position: relative; }
/* Positions are relative to .hero__visual (2nd grid column, starts at 720
   in the 1520 container). Page-x minus 200 (margin) minus 720. */
.hero-card--podbor { left: -48px; top: 174px; width: 220px; } /* 672-720 */
.hero-card--vyhod  { left: 612px; top: 244px; width: 188px; } /* 1332-720 */
.hero-card--kontrol{ left: 555px; top: 562px; width: 208px; } /* 1275-720 */
.hero-card--russia { left: -2px;  top: 603px; width: 256px; } /* 718-720 */

/* At 1440 the container is narrower — scale the visual */
@media (max-width: 1679px) and (min-width: 900px) {
  .hero__grid { grid-template-columns: 1fr 1fr; }
  .hero__title { font-size: 88px; line-height: 96px; }
  .hero-card--podbor,
  .hero-card--vyhod,
  .hero-card--kontrol,
  .hero-card--russia { /* keep absolute in visual */ }
  .hero__visual { overflow: visible; }
}

/* ===== Partners ===== */
.partners { padding: 0 0 80px; }
.partners .section-head { padding-top: 19px; } /* 1180-1080=100 total with pin 51 + leftover. pin is first. 1180-1080-51=49? eyebrow at 1180, section at 1080. pin is 51 at top. Then eyebrow. 1180-1080=100, pin 51, so 49 more. */
.partners .section-head h2 { margin-top: 26px; } /* 1250-1180-44=26 */
.partners .section-lead { margin-top: 4px; } /* 1334-1250-80=4 */
.partners__row {
  margin-top: 32px; /* 1394-1334-? body is 28, 1334+28=1362, 1394-1362=32 */
  display: flex;
  align-items: center;
  height: 164px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 24px;
  overflow: hidden;
}
.partners__track {
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
}
.partners__item {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 24px 20px;
  position: relative;
}
.partners__item + .partners__item::before,
.partners__more::before {
  content: "";
  position: absolute;
  left: 0; top: 50%;
  transform: translateY(-50%);
  width: 1px; height: 88px;
  background: var(--c-line);
}
.partners__item img {
  max-width: 100%;
  max-height: 98px;
  width: auto;
  height: auto;
  object-fit: contain;
  filter: grayscale(1);
  opacity: .85;
  transition: filter .35s ease, opacity .35s ease;
}
.partners__item:hover img {
  filter: grayscale(0);
  opacity: 1;
}
/* Touch / mobile: no hover, show logos in color immediately.
   Mobile breakpoint (899) plus devices that cannot hover or use a coarse pointer (tablets). */
@media (max-width: 899px), (hover: none), (pointer: coarse) {
  .partners__item img {
    filter: grayscale(0);
    opacity: 1;
  }
}
.partners__more {
  flex: 0 0 200px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  font-size: 18px;
  line-height: 23px;
  color: var(--c-text);
  text-align: left;
  padding: 0 28px;
}

/* ===== About / Team ===== */
.about { padding: 80px 0; } /* 1683-1080-578=25? partners ends 1080+578=1658, about 1683, gap 25. Then about h 572. padding top ~25, but previous section padding-bottom 80 is too much.
   Let me recalculate section spacing from Y positions:
   hero ends: 142+938=1080
   partners: 1080, h 578, ends 1658
   about: 1683, h 572, ends 2255, gap after partners = 25
   professions: 2280, so gap 25
   So section gaps are 25px, partners padding should be 0 (it starts immediately after hero).
   partners bg is full 578 including the pin.
*/
.about { padding: 25px 0 0; }
.partners { padding: 0; padding-bottom: 0; min-height: 578px; padding-top: 0; }
.about__grid {
  display: grid;
  grid-template-columns: 622px 1fr;
  gap: 46px;
  align-items: start;
  min-height: 572px;
}
.about__content { padding-top: 75px; } /* 1758-1683=75 */
.about__content h2 { font-size: 72px; line-height: 80px; }
.about__lead {
  margin-top: 18px; /* 2016-1758-240=18 */
  max-width: 440px;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-muted);
}
.about__lead-m { display: none; }
.about__content .hero__actions { margin-top: 32px; flex-wrap: nowrap; gap: 16px; } /* 2132-2016-84=32 */
.about__content .btn--lg,
.about__content .btn--secondary.btn--lg { min-width: 0; padding: 0 22px; height: 64px; }

.about__visual { position: relative; }
.about__visual img {
  width: 852px;
  max-width: 100%;
  height: auto;
  object-fit: contain;
  object-position: right center;
}

/* ===== Professions ===== */
.professions { padding: 0 0 60px; min-height: 1258px; }
.professions .section-head { padding-top: 49px; } /* pin 51, eyebrow 2380, section 2280, 100-51=49 */
.professions__grid-wrap {
  margin-top: 52px; /* tabs were at 2596, heading body at 2544+28=2572, 2596-2572=24 then tabs 48, then grid 2676. Without tabs: grid was 2676, body 2544+28=2572, gap 104 including tabs. Without tabs I'll use ~32-40 to not leave a huge hole. Originally: h2 2458, body 2544 (80px title so 6px gap), tabs 2596 (24 after body), grid 2676 (32 after tabs). Without tabs: 32 after body. */
  margin-top: 32px;
}
.professions__grid {
  display: grid;
  grid-template-columns: repeat(5, 280px);
  grid-template-rows: repeat(2, 300px);
  column-gap: 20px; /* 320-20-280? items at x 20, 320, 620, 920, 1220 — gap 20, padding 20 in the 1520 wrap. 20+280*5+20*4=20+1400+80=1500, +20=1520. */
  row-gap: 32px; /* 365-33-300=32 */
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 24px;
  padding: 33px 20px;
  justify-content: center;
}
.prof-card {
  width: 280px;
  height: 300px;
  background: #fff;
  border: 0;
  border-radius: 20px;
  padding: 0 14px;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  text-align: center;
  color: inherit;
  transition: transform .2s, box-shadow .2s;
}
.prof-card:hover { transform: translateY(-4px); box-shadow: 0 8px 24px rgba(31,46,28,.08); }
.prof-card__img {
  height: 203px;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  width: 100%;
}
.prof-card__img img {
  height: 203px;
  width: auto;
  max-width: 202px;
  object-fit: contain;
}
.prof-card__title {
  margin-top: 4px;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: var(--c-text);
}
.prof-card__body {
  margin-top: 6px;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-muted);
  max-width: 252px;
}
.professions__more {
  display: flex;
  justify-content: center;
  margin-top: 32px; /* 3406 - (2676+698)=32 */
}

/* ===== Metrics ===== */
.metrics { padding: 60px 0; overflow-x: clip; } /* 3598-2280-1258=60 */
.metrics__panel {
  display: flex;
  align-items: stretch;
  height: 276px;
  background: var(--c-panel);
  border: 1px solid var(--c-line);
  border-radius: 24px;
  padding: 0;
  overflow: visible;
}
.metrics__stats {
  display: flex;
  flex: 1 1 0;
  align-items: stretch;
  min-width: 0;
}
.metrics__lead {
  width: 400px;
  padding: 31px 31px 31px 31px;
  flex-shrink: 0;
  position: relative;
}
.metrics__lead::after {
  content: "";
  position: absolute;
  right: 0; top: 31px;
  width: 1px; height: 214px;
  background: var(--c-line);
}
.metrics__lead h2 { font-size: 36px; line-height: 48px; }
.metrics__lead p {
  margin-top: 12px;
  max-width: 330px;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-muted);
}
.metrics__lead .btn { margin-top: 18px; width: 220px; height: 48px; min-width: 0; }
.metrics__stat {
  width: 240px; /* dividers at 400, 650 (250), 890 (240), 1130 (240). Groups: 426, 670, 910. */
  flex: 1 1 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 31px 10px 0;
  text-align: center;
  position: relative;
}
.metrics__stat::after {
  content: "";
  position: absolute;
  right: 0; top: 31px;
  width: 1px; height: 214px;
  background: var(--c-line);
}
.metrics__badge { width: 52px; height: 52px; }
.metrics__badge img { width: 52px; height: 52px; }
.metrics__value {
  margin-top: 10px;
  font-family: var(--serif);
  font-size: 56px;
  line-height: 64px;
  color: var(--c-mid);
}
.metrics__stat p {
  margin-top: 6px;
  max-width: 200px;
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  color: var(--c-muted);
  text-align: center;
}
.metrics__support {
  width: 390px;
  flex-shrink: 0;
  margin: 22px 20px 22px 12px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 20px;
  padding: 22px 12px 18px 22px;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: visible;
  z-index: 2;
}
.metrics__stat:last-of-type::after { display: none; } /* support is not a stat. last stat still has divider. */
.metrics__support-text {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  max-width: 175px;
  min-height: 0;
}
.metrics__support-text strong {
  font-weight: 500;
  font-size: 20px;
  line-height: 24px;
  color: var(--c-text);
}
.metrics__support-text p {
  margin-top: 10px;
  font-size: 16px;
  line-height: 20px;
  color: var(--c-muted);
}
.metrics__support-cta {
  margin-top: auto;
  margin-left: 0;
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  gap: 6px;
  background: none;
  border: 0;
  cursor: pointer;
  font-weight: 600;
  font-size: 15px;
  line-height: 22px;
  color: var(--c-mid);
  padding: 0;
}
.metrics__support-cta:hover { color: var(--c-green); }
.metrics__support-hero {
  position: absolute;
  right: -18px;
  bottom: 0;
  height: calc(100% + 28px);
  width: auto;
  pointer-events: none;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
.metrics__support-hero img {
  height: 100%;
  width: auto;
  max-width: none;
  object-fit: contain;
  object-position: right bottom;
  display: block;
  pointer-events: none;
}

/* ===== Gallery ===== */
.gallery { padding: 0 0 50px; min-height: auto; }
.gallery .section-head { padding-top: 49px; }
.gallery .section-lead { margin-top: 6px; max-width: 626px; }
.gallery__tabs {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 32px;
}
.pill {
  height: 48px;
  padding: 0 34px;
  border-radius: 24px;
  border: 1px solid var(--c-line);
  background: #fff;
  font-size: 15px;
  line-height: 22px;
  color: var(--c-text);
  cursor: pointer;
  min-width: 150px;
}
.pill.is-active {
  background: var(--c-mid);
  color: #fff;
  border-color: var(--c-mid);
}
.pill:hover:not(.is-active) { background: var(--c-cream); }
.gallery__pane { margin-top: 24px; }
.gallery__grid {
  display: grid;
  grid-template-columns: repeat(4, 365px);
  gap: 24px 20px;
  justify-content: center;
}
.gallery__item {
  position: relative;
  width: 365px;
  height: 380px;
  padding: 0;
  border: 0;
  border-radius: 16px;
  overflow: hidden;
  cursor: pointer;
  background: #ddd;
}
.gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .4s ease;
}
.gallery__item:hover img { transform: scale(1.04); }
.gallery__item.is-extra { display: none; }
.gallery__play {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.gallery__more {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

/* ===== Request ===== */
.request { padding: 60px 0 80px; } /* form at 5248, gallery 3934+1254=5188, gap 60 */
.request__panel {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 561px;
  gap: 36px;
  min-height: 784px;
  background: var(--c-request);
  border: 1px solid var(--c-line);
  border-radius: 28px;
  padding: 61px;
  overflow: hidden;
}
.request__left { position: relative; z-index: 2; max-width: 650px; }
.request__left h2 {
  margin-top: 32px; /* 5383-5309-42? eyebrow at 61, h2 at 135, 135-61-42=32 */
  font-size: 72px;
  line-height: 80px;
  max-width: 650px;
}
.request__lead {
  margin-top: 12px;
  max-width: 432px;
  font-size: 18px;
  line-height: 28px;
  color: var(--c-muted);
}
.request__benefits {
  margin-top: 32px; /* 5671-5555-84=32 */
  display: flex;
  flex-direction: column;
  gap: 37px;
  max-width: 370px;
}
.request__benefits li {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.request__benefits img { width: 52px; height: 52px; flex-shrink: 0; }
.request__benefits strong {
  display: block;
  font-weight: 600;
  font-size: 22px;
  line-height: 20px;
  color: var(--c-text);
}
.request__benefits span {
  display: block;
  margin-top: 8px;
  font-size: 16px;
  line-height: 21px;
  color: var(--c-muted);
  max-width: 300px;
}
/* Positions are relative to .request__panel (1520×784), from the dump:
   glow 486,202 560×560; mascot 493,229 414×517; form card 898,61 561×662.
   Text column ends at ~431, so the character sits BETWEEN text and the card. */
.request__glow {
  position: absolute;
  left: 486px;
  top: 202px;
  width: 560px;
  height: 560px;
  background: var(--c-glow);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
  transform: none;
}
.request__mascot .request__cook {
  display: none;
}
.request__mascot {
  position: absolute;
  left: 493px;
  top: 229px;
  width: 414px;
  height: 517px;
  z-index: 1;
  pointer-events: none;
  margin: 0;
}
.request__mascot img {
  width: 414px;
  height: 517px;
  max-width: none;
  object-fit: contain;
  object-position: center bottom;
  display: block;
}
.request__card {
  position: relative;
  z-index: 3;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 24px;
  padding: 36px;
  box-shadow: 0 8px 24px #1f2e1c01;
}
.request__card h3 { font-size: 48px; line-height: 56px; }
.request__card-lead {
  margin-top: 12px;
  font-size: 18px;
  line-height: 23px;
  color: var(--c-muted);
}

/* ===== Form ===== */
.pf-form { margin-top: 24px; display: flex; flex-direction: column; gap: 18px; }
.pf-row { display: flex; gap: 15px; }
.pf-field {
  position: relative;
  flex: 1;
  display: flex;
  align-items: center;
  height: 64px;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 12px;
}
.pf-field--full { width: 100%; }
.pf-field--area { height: 138px; align-items: flex-start; }
.pf-field--name { flex: 0 0 214px; }
.pf-field--phone { flex: 1; }
.pf-field__icon {
  position: absolute;
  left: 16px; top: 20px;
  width: 24px; height: 24px;
  display: flex;
  pointer-events: none;
}
.pf-field--area .pf-field__icon { top: 18px; }
.pf-field input,
.pf-field textarea,
.pf-field select,
.pf-select {
  width: 100%;
  height: 100%;
  border: 0;
  background: transparent;
  padding: 20px 16px 20px 52px;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-text);
  outline: none;
  resize: none;
  appearance: none;
  -webkit-appearance: none;
}
.pf-field textarea { padding-top: 20px; height: 100%; }
.pf-field input::placeholder,
.pf-field textarea::placeholder { color: var(--c-muted); }
.pf-field--select { height: 64px; }
.pf-select {
  padding-right: 36px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%236f746d' stroke-width='1.5' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position: right 16px center;
}
.pf-consent {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-muted);
}
.pf-consent input { position: absolute; opacity: 0; pointer-events: none; }
.pf-consent__box {
  flex-shrink: 0;
  width: 22px; height: 22px;
  border: 1px solid var(--c-line);
  border-radius: 6px;
  background: #fff;
  margin-top: 1px;
}
.pf-consent__lock {
  width: 18px; height: 18px;
  flex-shrink: 0;
  margin-right: 4px;
  vertical-align: -3px;
  display: inline-block;
}
.pf-consent input:checked + .pf-consent__box {
  background-color: var(--c-mid);
  border-color: var(--c-mid);
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='11' viewBox='0 0 14 11'><path d='M1 5.5l4 4 8-8' stroke='white' stroke-width='2' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}
.pf-consent input:focus-visible + .pf-consent__box { outline: 2px solid var(--c-mid); outline-offset: 2px; }
.pf-consent a { color: var(--c-mid); text-decoration: underline; }
.pf-consent a:hover { color: var(--c-green); }
.pf-form__status { font-size: 14px; line-height: 20px; min-height: 0; }
.pf-form__status.is-ok { color: var(--c-green); }
.pf-form__status.is-err { color: #a33; }
.pf-form.is-sending .btn--submit { opacity: .7; pointer-events: none; }

/* ===== Footer ===== */
.site-footer {
  background: var(--c-request);
  border-top: 1px solid var(--c-line);
  padding: 51px 0 0;
}
.footer__grid {
  display: grid;
  grid-template-columns: 365px 1fr 360px;
  grid-template-areas:
    "brand nav contacts"
    "brand nav socials";
  column-gap: 40px;
  row-gap: 0;
  min-height: 250px;
  padding-bottom: 36px;
  align-items: start;
}
.footer__brand { grid-area: brand; }
.footer__nav { grid-area: nav; }
.footer__contacts { grid-area: contacts; }
.footer__desc {
  margin-top: 12px; /* 6175-6118-45=12 */
  font-size: 14px;
  line-height: 18px;
  color: var(--c-muted);
  max-width: 365px;
}
.footer__nav-title {
  font-weight: 500;
  font-size: 16px;
  line-height: 20px;
  margin-bottom: 14px;
}
.footer__nav ul { display: flex; flex-direction: column; gap: 14px; }
.footer__nav a {
  font-size: 15px;
  line-height: 22px;
  color: var(--c-muted);
  text-decoration: none;
}
.footer__nav a:hover { color: var(--c-text); }
.footer__contacts { width: 360px; }
.footer__contact {
  display: flex;
  align-items: flex-start;
  gap: 18px;
  font-size: 18px;
  line-height: 28px;
  margin-bottom: 10px;
}
.footer__contact img { width: 26px; height: 26px; flex-shrink: 0; margin-top: 1px; }
.footer__contact a { text-decoration: none; color: var(--c-text); }
.footer__contact--muted,
.footer__contact--muted a { color: var(--c-muted); font-size: 18px; }
.footer__contact--addr { font-size: 15px; line-height: 22px; max-width: 360px; }
.footer__socials {
  grid-area: socials;
  display: flex;
  gap: 12px;
  margin-top: 22px;
}
.footer__socials a img { width: 60px; height: 60px; }
.footer__socials a:hover { opacity: .85; }
.footer__bottom {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 18px 0 28px;
  border-top: 1px solid var(--c-line);
  font-size: 14px;
  line-height: 20px;
  color: var(--c-muted);
}
.footer__legal-links { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.footer__legal-links a { color: var(--c-muted); text-decoration: none; }
.footer__legal-links a:hover { color: var(--c-text); text-decoration: underline; }

/* ===== Mobile menu ===== */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 80;
  background: rgba(28,30,27,.4);
  display: flex;
  justify-content: flex-end;
}
.mobile-menu[hidden] { display: none; }
.mobile-menu__panel {
  width: min(390px, 100%);
  height: 100%;
  background: var(--c-bg);
  padding: 30px 20px 40px;
  display: flex;
  flex-direction: column;
  overflow: auto;
  animation: slideIn .28s ease;
}
@keyframes slideIn { from { transform: translateX(30px); opacity: 0; } to { transform: none; opacity: 1; } }
.mobile-menu__top { display: flex; align-items: center; justify-content: space-between; }
.mobile-menu__close {
  width: 55px; height: 55px;
  border: 0; background: transparent;
  position: relative;
  cursor: pointer;
}
.mobile-menu__close span {
  position: absolute;
  left: 16px; right: 16px; height: 2px;
  background: var(--c-mid);
  top: 50%;
}
.mobile-menu__close span:first-child { transform: rotate(45deg); }
.mobile-menu__close span:last-child { transform: rotate(-45deg); }
.mobile-menu__nav { margin-top: 40px; }
.mobile-menu__nav a {
  display: block;
  font-family: var(--serif);
  font-size: 28px;
  line-height: 38px;
  color: var(--c-text);
  text-decoration: none;
  padding: 10px 0;
}
.mobile-menu__nav a:hover { color: var(--c-mid); }
.mobile-menu__contacts { margin-top: 36px; display: flex; flex-direction: column; gap: 10px; }
.mobile-menu__socials { display: flex; gap: 12px; margin-top: 28px; }
.mobile-menu__socials img { width: 60px; height: 60px; }

/* ===== Popups ===== */
.popup {
  position: fixed;
  inset: 0;
  z-index: 90;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
}
.popup[hidden] { display: none; }
.popup__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(28,30,27,.45);
}
.popup__dialog {
  position: relative;
  z-index: 1;
  width: 561px;
  max-width: 100%;
  max-height: calc(100vh - 48px);
  overflow: auto;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 24px;
  padding: 36px;
  box-shadow: 0 16px 48px rgba(31,46,28,.12);
}
.popup__dialog--wide { width: 1200px; }
.popup__dialog h3 { font-size: 48px; line-height: 56px; padding-right: 40px; }
.popup__close,
.lightbox__close {
  position: absolute;
  top: 20px; right: 20px;
  width: 40px; height: 40px;
  border: 0;
  background: transparent;
  cursor: pointer;
  z-index: 2;
}
.popup__close span,
.lightbox__close span {
  position: absolute;
  left: 10px; right: 10px; height: 2px;
  background: var(--c-text);
  top: 50%;
}
.popup__close span:first-child,
.lightbox__close span:first-child { transform: rotate(45deg); }
.popup__close span:last-child,
.lightbox__close span:last-child { transform: rotate(-45deg); }
.gallery__grid--popup {
  margin-top: 24px;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.gallery__grid--popup .gallery__item {
  width: 100%;
  height: 230px;
  display: block;
}

.lightbox {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: center;
}
.lightbox[hidden] { display: none; }
.lightbox__backdrop { position: absolute; inset: 0; background: rgba(28,30,27,.85); }
.lightbox__stage {
  position: relative;
  z-index: 1;
  max-width: 92vw;
  max-height: 90vh;
}
.lightbox__img, .lightbox__video {
  max-width: min(92vw, 100%);
  max-height: 88vh;
  max-height: 88dvh;
  width: auto;
  height: auto;
  display: none;
  margin: 0 auto;
  border-radius: 12px;
  background: transparent;
  object-fit: contain;
  object-position: center center;
}
.lightbox.is-image .lightbox__img { display: block; }
.lightbox.is-video .lightbox__video { display: block; }
.lightbox__close { color: #fff; top: 16px; right: 16px; z-index: 3; }
.lightbox__close span { background: #fff; }
.lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  width: 48px; height: 48px;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.15);
  cursor: pointer;
  color: #fff;
}
.lightbox__nav:hover { background: rgba(255,255,255,.3); }
.lightbox__nav--prev { left: 16px; }
.lightbox__nav--next { right: 16px; }
.lightbox__nav--prev::before,
.lightbox__nav--next::before {
  content: "";
  display: block;
  width: 12px; height: 12px;
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
  margin: 0 auto;
}
.lightbox__nav--prev::before { transform: rotate(-135deg); }
.lightbox__nav--next::before { transform: rotate(45deg); }

/* ===== Legal pages ===== */
.legal-main { padding: 60px 0 80px; min-height: 60vh; }
.legal-wrap { max-width: 860px; }
.legal-doc h1 { font-size: 48px; line-height: 56px; margin-bottom: 20px; }
.legal-doc h2 { font-size: 28px; line-height: 36px; margin: 32px 0 12px; }
.legal-doc p, .legal-doc li {
  font-size: 16px;
  line-height: 26px;
  color: var(--c-text);
  margin-bottom: 10px;
}
.legal-doc ul { padding-left: 22px; list-style: disc; margin-bottom: 12px; }
.legal-lead { color: var(--c-muted); }
.legal-operator { background: var(--c-cream); border: 1px solid var(--c-line); border-radius: 16px; padding: 24px; margin: 24px 0; }
.legal-operator ul { list-style: none; padding: 0; }
.legal-doc a { color: var(--c-mid); }

/* ===== Mobile 390 ===== */
@media (max-width: 899px) {
  .container { width: calc(100% - 40px); }
  .header__nav, .header__phone, .btn--header { display: none; }
  .header__menu-btn { display: block; margin-left: auto; }
  .header__inner { height: 70px; }
  .site-header { padding-top: 16px; }
  :root { --header-h: 87px; }
  .logo img { width: 185px; height: 45px; }

  .hero { padding-top: 16px; overflow: visible; }
  .hero__grid {
    display: flex;
    flex-direction: column;
    min-height: 0;
    grid-template-columns: 1fr;
  }
  .hero__content { padding-top: 0; }
  .hero__title {
    font-size: 32px;
    line-height: 38px;
    margin-top: 14px;
  }
  /* Mobile title uses .hero__title-m with a single <br> (“Надёжный персонал / для вашего бизнеса”). */
  .hero__title { max-width: 350px; }
  .hero__lead {
    margin-top: 12px;
    font-size: 18px;
    line-height: 26px;
    max-width: none;
  }
  .hero__actions { flex-direction: column; gap: 12px; margin-top: 16px; }
  .btn--lg, .btn--secondary.btn--lg { width: 100%; min-width: 0; height: 64px; }

  .hero__visual {
    min-height: 0;
    margin-top: 0;
    height: 355px;
    overflow: visible;
    position: relative;
  }
  .hero__mascot {
    width: 200px !important;
    height: 300px !important;
    max-width: none;
    right: 0;
    bottom: 0;
    left: auto;
    object-fit: contain;
    object-position: bottom center;
  }
  .hero__orbit--1 { width: 300px; height: 300px; right: 0; top: 40px; }
  .hero__orbit--2 { width: 240px; height: 240px; right: 30px; top: 70px; }
  .hero__orbit--3 { width: 180px; height: 180px; right: 60px; top: 100px; }
  .hero__dot { display: none; }
  .hero-card {
    height: auto;
    min-height: 0;
    padding: 10px 12px 10px 10px;
    gap: 8px;
    width: auto !important;
    left: 0 !important;
    right: auto !important;
  }
  .hero-card img { width: 36px; height: 36px; }
  .hero-card__label { font-size: 13px; line-height: 16px; }
  .hero-card strong { font-size: 12px; line-height: 14px; margin-top: 2px; }
  /* stack on left: Контроль, Выход, Подбор, Работаем — matching mobile mockup from bottom-ish */
  .hero-card--kontrol { top: 8px; left: 0 !important; }
  .hero-card--vyhod   { top: 90px; left: 0 !important; }
  .hero-card--podbor  { top: 172px; left: 0 !important; }
  .hero-card--russia  { top: 254px; left: 0 !important; }

  .section-head h2 { font-size: 28px; line-height: 34px; margin-top: 16px; }
  .section-lead { font-size: 16px; line-height: 21px; }

  .partners { min-height: 0; padding: 0 0 0; } /* section 437: 844–1281 */
  .partners .section-head { padding-top: 70px; } /* 914-844 */
  .partners .section-head h2 { font-size: 28px; line-height: 34px; margin-top: 16px; }
  .partners__row {
    height: 164px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
    justify-content: flex-start;
    padding: 0;
    margin-top: 24px; /* 1082-1016-42 */
    overscroll-behavior-x: contain;
    scrollbar-width: none;
    -ms-overflow-style: none;
  }
  .partners__row::-webkit-scrollbar { display: none; }
  .partners__track {
    width: max-content;
    flex: 0 0 auto;
  }
  .partners__item {
    flex: 0 0 152px;
    width: 152px;
    height: 164px;
    scroll-snap-align: start;
    padding: 24px 10px;
  }
  .partners__item img { max-height: 98px; }
  .partners__more { flex: 0 0 140px; font-size: 16px; line-height: 23px; }

  .about { padding: 35px 0 0; } /* 1316-1281=35 */
  .about__grid { display: flex; flex-direction: column; gap: 24px; min-height: 0; }
  .about__content { padding-top: 0; }
  .about__content h2 { font-size: 32px; line-height: 38px; }
  .about__lead { max-width: none; font-size: 18px; line-height: 28px; }
  .about__lead-d { display: none; }
  .about__lead-m { display: inline; }
  .about__visual img { width: 100%; }

  .professions { min-height: 0; padding: 0 0 20px; }
  .professions .section-head { padding-top: 70px; } /* 2018-1948 */
  .professions .section-head h2 { font-size: 28px; line-height: 34px; }
  .professions__grid-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 22px -20px 0; padding: 0 20px 8px; }
  .professions__grid {
    display: flex;
    grid-template-columns: none;
    grid-template-rows: none;
    gap: 20px;
    padding: 0;
    width: max-content;
    background: transparent;
    border: 0;
    border-radius: 0;
  }
  .prof-card { flex: 0 0 280px; width: 280px; height: 300px; background: #fff; border: 1px solid var(--c-line); border-radius: 20px; }
  .professions__more { margin-top: 24px; }

  .metrics { padding: 0; }
  .metrics .container { width: 100%; }
  .metrics__panel {
    flex-direction: column;
    height: auto;
    min-height: 796px;
    padding: 35px 20px 35px;
    overflow: visible;
    align-items: stretch;
    border-radius: 0;
    border-left: 0;
    border-right: 0;
    width: 100%;
  }
  .metrics__lead { width: 100%; padding: 0 0 32px; } /* button 2860, body 2802+40=2842, gap 18? button after 2860-2842. dump button 2860, body ends 2842, actually 18; we use 18 after p + 32 after block to include button */
  .metrics__lead::after { display: none; }
  .metrics__lead h2 { font-size: 36px; line-height: 48px; }
  .metrics__lead p { font-size: 14px; line-height: 20px; max-width: 330px; margin-top: 12px; }
  .metrics__lead .btn { width: 100%; height: 72px; margin-top: 18px; }
  .metrics__stats {
    display: flex;
    flex-direction: row;
    flex: none;
    align-items: flex-start;
    gap: 42px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    margin: 0 -20px;
    padding: 32px 20px 32px;
    width: auto;
  }
  .metrics__stat {
    flex: 0 0 200px;
    width: 200px;
    padding: 0;
    align-items: center;
  }
  .metrics__stat::after { display: none; }
  .metrics__value { font-size: 56px; line-height: 64px; margin-top: 10px; }
  .metrics__stat p { font-size: 16px; line-height: 20px; max-width: 200px; font-weight: 500; }
  .metrics__support {
    width: 100%;
    margin: 8px 0 0;
    min-height: 232px;
    padding: 26px 16px 22px 20px;
    overflow: visible;
  }
  .metrics__support-text { max-width: 158px; }
  .metrics__support-text strong { font-size: 18px; line-height: 22px; }
  .metrics__support-cta { white-space: nowrap; font-size: 14px; }
  .metrics__support-hero {
    right: -32px;
    height: 248px;
    width: auto;
  }
  .metrics__support-text p { font-size: 15px; line-height: 20px; }

  .gallery { padding: 0 0 20px; min-height: 0; }
  .gallery .section-head { padding-top: 68px; } /* 3593-3525=68 */
  .gallery .section-head h2 { font-size: 28px; line-height: 34px; }
  .gallery .section-lead { font-size: 16px; line-height: 21px; max-width: none; }
  .gallery__grid {
    display: flex;
    justify-content: flex-start;
    overflow-x: auto;
    gap: 20px; /* 280-260 */
    grid-template-columns: none;
    margin: 0 -20px;
    padding: 0 20px 8px;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
  }
  .gallery__item { flex: 0 0 260px; width: 260px; height: 271px; border-radius: 16px; scroll-snap-align: start; }
  .gallery__pane .gallery__grid { scrollbar-width: none; }
  .gallery__pane .gallery__grid::-webkit-scrollbar { display: none; }
  .gallery__grid--popup {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    overflow: visible;
    margin: 16px 0 0;
    padding: 0 0 12px;
    width: 100%;
    gap: 12px;
    scroll-snap-type: none;
  }
  .gallery__grid--popup .gallery__item {
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: 3 / 4;
    scroll-snap-align: none;
  }
  .gallery__grid--popup .gallery__item img { object-fit: cover; }
  .gallery__grid--popup .gallery__item:only-child {
    grid-column: 1 / -1;
    width: auto;
    height: min(62dvh, 520px);
    aspect-ratio: 9 / 16;
    justify-self: center;
  }
  .gallery__tabs { justify-content: center; margin-top: 22px; }
  .gallery__tabs .pill { flex: 1 1 0; min-width: 0; max-width: 168px; padding: 0 20px; }
  .gallery__more { margin-top: 24px; }

  .request { padding: 20px 0 0; }
  .request .container { width: 100%; }
  .request__panel {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-height: 0;
    padding: 32px 24px 8px;
    background: var(--c-request);
    border: 0;
    border-radius: 0;
    overflow: visible;
  }
  .request__left {
    background: transparent;
    border: 0;
    border-radius: 0;
    padding: 0;
    max-width: none;
    margin: 0;
    width: 100%;
    z-index: 2;
  }
  .request__left h2 { font-size: 32px; line-height: 38px; margin-top: 20px; max-width: none; }
  .request__lead { max-width: none; font-size: 18px; line-height: 28px; }
  .request__benefits { max-width: none; margin-top: 18px; gap: 26px; }
  .request__benefits span { max-width: 284px; }
  .request__glow {
    position: relative;
    left: auto;
    top: auto;
    width: 300px;
    height: 210px;
    margin: 8px auto -150px;
    transform: none;
    z-index: 0;
  }
  .request__mascot {
    position: relative;
    left: auto;
    top: auto;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    width: auto;
    height: auto;
    margin: 6px auto 0;
    z-index: 1;
  }
  .request__mascot .request__cook {
    display: block;
    position: relative;
    width: auto;
    height: 214px;
    margin: 0 -18px 0 0;
    z-index: 1;
    flex: 0 0 auto;
  }
  .request__mascot img { width: auto; height: 228px; max-width: none; object-fit: contain; flex: 0 0 auto; position: relative; z-index: 2; }
  .request__card {
    margin: 20px 0 0;
    width: 100%;
    padding: 35px 20px 28px;
    border-radius: 24px;
    z-index: 3;
  }
  .request__card h3, .popup__dialog h3 { font-size: 32px; line-height: 38px; }
  .pf-row { flex-direction: column; }
  .pf-field--name { flex: 1; }
  .pf-field, .pf-field--select { height: 60px; }
  .pf-field--area { height: 60px; }
  .btn--submit { height: 80px; }

  .footer__grid {
    grid-template-columns: 1fr 52px;
    grid-template-areas:
      "brand brand"
      "nav socials"
      "contacts contacts";
    column-gap: 16px;
    row-gap: 28px;
    min-height: 0;
    padding-bottom: 24px;
  }
  .footer__brand { grid-area: brand; }
  .footer__nav { grid-area: nav; }
  .footer__contacts { grid-area: contacts; width: 100%; }
  .footer__socials {
    grid-area: socials;
    flex-direction: column;
    gap: 20px;
    margin-top: 0;
    align-items: center;
  }
  .footer__socials a img { width: 52px; height: 52px; }
  .footer__bottom { flex-direction: column; align-items: flex-start; gap: 10px; }
  .footer__legal-links { justify-content: flex-start; }
  .site-footer { padding-top: 36px; }

  .popup { padding: 12px; align-items: flex-end; }
  .popup__dialog {
    width: 100%;
    border-radius: 24px 24px 0 0;
    max-height: 92vh;
    max-height: 92dvh;
    padding: 28px 20px calc(20px + env(safe-area-inset-bottom));
  }
  .popup__dialog--wide { width: 100%; }
}

/* Mid desktop tweaks */
@media (max-width: 1599px) and (min-width: 900px) {
  .hero__title { font-size: 84px; line-height: 92px; }
  .hero__grid { grid-template-columns: 1fr 1fr; min-height: 760px; }
  .hero__visual { min-height: 760px; overflow: hidden; }
  .hero__mascot { width: 480px; height: auto; right: 0; }
  .hero-card--podbor { left: auto; right: 52%; top: 80px; }
  .hero-card--vyhod  { left: auto; right: 4%; top: 140px; }
  .hero-card--kontrol{ left: auto; right: 6%; top: 420px; }
  .hero-card--russia { left: auto; right: 48%; top: 460px; }
  .hero__orbit--1 { right: 0; }
  .section-head h2, .about__content h2, .request__left h2 { font-size: 56px; line-height: 64px; }
  .professions__grid {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    column-gap: 12px;
  }
  .prof-card { width: auto; }
  .gallery__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .gallery__item { width: auto; }
  .about__grid { grid-template-columns: 1fr 1fr; }
  .request__panel { grid-template-columns: minmax(0, 1fr) 480px; padding: 48px; min-height: 720px; }
  .request__left { max-width: 500px; }
  .request__left h2 { max-width: 500px; }
  .request__lead, .request__benefits { max-width: 360px; }
  /* Scale dump positions (493/1520 ≈ 32.4%, 414/1520 ≈ 27.2%) so the character
     stays between the text column and the form card. */
  .request__mascot {
    left: 34%;
    top: 26%;
    width: 28%;
    height: auto;
  }
  .request__mascot img { width: 100%; height: auto; max-width: none; }
  .request__glow { left: 33%; top: 22%; width: 38%; height: auto; aspect-ratio: 1; }
  .metrics__panel { height: 276px; flex-wrap: nowrap; overflow: visible; }
  .metrics__lead { width: 300px; }
  .metrics__support { width: 360px; margin: 16px 16px 16px 8px; padding: 18px 8px 16px 18px; }
  .metrics__support-text { max-width: 160px; }
  .metrics__support-hero { right: -14px; height: calc(100% + 24px); }
  .partners__more { flex: 0 0 140px; font-size: 16px; padding: 0 12px; }
}

.hero__title-m { display: none; }
@media (max-width: 899px) {
  .hero__title-d { display: none; }
  .hero__title-m { display: inline; }
  .hero__title { max-width: none; }
}

/* WP admin bar offset */
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) {
  .admin-bar .site-header { top: 46px; }
}
.admin-bar .mobile-menu, .admin-bar .popup, .admin-bar .lightbox { top: 32px; }

/* Body default links */
body { overflow-x: clip; }


/* ===== Custom profession select ===== */
.pf-combo { position: relative; }
.pf-combo.is-enhanced .pf-select {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0);
  white-space: nowrap; border: 0;
  appearance: none;
}
.pf-combo:not(.is-enhanced) .pf-combo__btn,
.pf-combo:not(.is-enhanced) .pf-combo__list { display: none; }

.pf-combo__btn {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  height: 100%;
  padding: 0 40px 0 12px;
  border: 0;
  background: transparent;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' stroke='%236f746d' stroke-width='1.5' fill='none'/></svg>");
  background-repeat: no-repeat;
  background-position: right 16px center;
  cursor: pointer;
  font-family: var(--font);
  font-size: 14px;
  line-height: 20px;
  font-weight: 400;
  color: var(--c-text);
  text-align: left;
  border-radius: 12px;
}
.pf-combo__btn:focus-visible {
  outline: 2px solid var(--c-mid);
  outline-offset: -2px;
}
.pf-combo.is-open .pf-combo__btn {
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 7l5-5 5 5' stroke='%236f746d' stroke-width='1.5' fill='none'/></svg>");
}
.pf-combo__btn.is-placeholder .pf-combo__label { color: var(--c-muted); }
.pf-combo__thumb-wrap {
  flex: 0 0 44px;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #eef4e8;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}
.pf-combo__thumb-wrap[hidden] { display: none; }
.pf-combo__thumb {
  width: 40px;
  height: 40px;
  object-fit: contain;
  object-position: center 60%;
  max-width: none;
  pointer-events: none;
}
.pf-combo__label {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pf-combo__list {
  position: fixed;
  margin: 0;
  padding: 8px;
  list-style: none;
  background: #fff;
  border: 1px solid var(--c-line);
  border-radius: 16px;
  box-shadow: 0 12px 36px rgba(28, 30, 27, 0.14);
  max-height: min(360px, 50vh);
  overflow-y: auto;
  z-index: 120;
  box-sizing: border-box;
}
.pf-combo__list[hidden] { display: none; }
.pf-combo__option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 10px 6px 6px;
  border-radius: 12px;
  cursor: pointer;
  font-size: 14px;
  line-height: 20px;
  color: var(--c-text);
  min-height: 52px;
}
.pf-combo__option:hover,
.pf-combo__option.is-active { background: #eef4e8; }
.pf-combo__option[aria-selected="true"] { font-weight: 500; }
.pf-combo__option .pf-combo__thumb-wrap { flex-basis: 40px; width: 40px; height: 40px; }
.pf-combo__option .pf-combo__thumb { width: 36px; height: 36px; }
.pf-combo__option-label { flex: 1; }

@media (max-width: 899px) {
  .pf-combo__btn { font-size: 14px; padding-left: 10px; }
  .pf-combo__list { max-height: min(280px, 45vh); }
}


/* Partners: mobile/touch scroll affordance (peek, edge fade, one-shot nudge).
   Same media query as the colour logos in 1.0.9. Desktop is unchanged. */
@media (max-width: 899px), (hover: none), (pointer: coarse) {
  .partners__row.has-fade-right {
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 56px), transparent 100%);
    mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 56px), transparent 100%);
  }
  .partners__row.has-fade-left {
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 48px, #000 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 48px, #000 100%);
  }
  .partners__row.has-fade-left.has-fade-right {
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 48px, #000 calc(100% - 56px), transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 48px, #000 calc(100% - 56px), transparent 100%);
  }
  .partners__track.is-hinting {
    animation: partners-nudge 1.2s cubic-bezier(0.4, 0, 0.2, 1) both;
  }
}
@keyframes partners-nudge {
  0%   { transform: translateX(0); }
  38%  { transform: translateX(-72px); }
  52%  { transform: translateX(-72px); }
  100% { transform: translateX(0); }
}
@media (prefers-reduced-motion: reduce) {
  .partners__track.is-hinting { animation: none; }
}
