/* Welcomepro layer: last stylesheet, brings the page in line with welcomepro.ru (see WELCOMEPRO-STYLE.md). */

/* Header: full-width white bar with a thin bottom line, as on welcomepro.ru */
.site-header { padding-top: 0; }
.site-header__inner {
  width: 100%;
  max-width: none;
  min-height: 72px;
  padding: 10px max(24px, calc((100% - 1120px) / 2));
  border: 0;
  border-bottom: 1px solid var(--line);
  border-radius: 0;
  background: rgba(255, 255, 255, .97);
  box-shadow: none;
}
.site-header .wordmark img { display: block; width: auto; height: 46px; }
.header-nav a { color: var(--ink); font-size: .92rem; font-weight: 600; }
.header-nav a:hover, .header-nav a:focus-visible { color: var(--blue); }

/* Footer: plain text links, no icon column */
.site-footer__contacts a, .site-footer__channels a { display: block; }
.site-footer__contacts h2, .site-footer__channels h2 { color: var(--ink); font-weight: 700; }
.site-footer__brand img { width: 38px; height: auto; }
.site-footer__bottom { justify-content: flex-end; }
.site-footer__copyright { justify-items: end; }

@media (max-width: 850px) {
  .site-header__inner { width: 100%; min-height: 60px; padding: 8px 16px; }
  .site-header .wordmark img { height: 40px; }
}
@media (max-width: 700px) {
  .site-footer__bottom { justify-content: flex-start; }
  .site-footer__copyright { justify-items: start; }
}

/* Green panels: the light end of the welcomepro.ru gradient is too pale under small white text, so it stays mid-green */
.fee { background: linear-gradient(110deg, #279b6c 0%, #31ac7a 55%, #4fc493 100%); }

/* More contrast (user, 05.10): darker text, denser body weight, saturated green hero as on welcomepro.ru/consulting */
:root { --ink: #000; --text-2: #262626; --text-3: #4d4d4d; --line: #e4e4e4; --line-strong: #bdbdbd; }
body { font-weight: 500; }
strong, b { font-weight: 800; }

/* Stage numerals and section headings read stronger */
.cooperation-stage__number { color: #e3e3e3; }
.cooperation-stage h3 { color: var(--dark-blue); font-weight: 800; }
h2 { font-weight: 800; }

/* Timeline cards on the light mint gradient of the direction map (user, 05.10) */
.timeline-phase { border-color: #cfeadc; background: linear-gradient(145deg, var(--sky-deep) 0%, var(--sky) 70%, #fff 100%); }

/* Solid header: nothing shows through while scrolling */
.site-header__inner { background: #fff; }

/* Drawn arrows instead of the ↗ character: iOS turned the character into an emoji (user, 05.10) */
.ico-arrow {
  display: inline-block;
  flex: 0 0 auto;
  width: .78em;
  height: .78em;
  vertical-align: -.02em;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13 13 3M5 3h8v8'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23000' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13 13 3M5 3h8v8'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Second accent: welcomepro.ru violet (event date pills, #9243bd), only for small accents.
   User, 05.10: no violet or lilac text, hero and fee block stay green. */
:root { --violet: #9243bd; --violet-light: #f6effc; }
.gantt__badge { background: var(--violet); color: #fff; font-weight: 700; }
.gantt__badge::before { background: #fff; }
.gantt__bar--diagnostics { background: var(--violet); }
.automation-item__icon { background: var(--violet-light); color: var(--violet); }
.cooperation-stage__node { border-color: var(--violet); }

/* Hero (user, 06.10): light mint, no grid. Heading, CTA and facts on the left, the team photo on the right.
   The stairs photo moved here from the request block. */
.hero.hero--proof {
  min-height: clamp(660px, 100svh, 940px);
  place-items: stretch;
  background: linear-gradient(160deg, #f3fff8 0%, #e4f5ec 100%);
  color: var(--ink);
}
.hero--proof .hero__inner {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-content: center;
  align-items: center;
  gap: 0 clamp(40px, 5vw, 72px);
  padding-block: 128px 72px;
}
.hero--proof .hero__content { grid-column: 1; grid-row: 1; justify-self: start; max-width: 660px; margin: 0; text-align: left; }
.hero.hero--proof h1 { max-width: none; margin: 0; color: var(--ink); font-size: clamp(2.4rem, 3.75vw, 3.4rem); font-weight: 800; letter-spacing: -.02em; line-height: 1.05; }
.hero__accent { color: var(--dark-blue); }
.hero--proof .hero__copy { max-width: 540px; margin: 26px 0 0; color: var(--text-2); font-size: clamp(1.1rem, 1.4vw, 1.3rem); font-weight: 500; line-height: 1.5; }
.hero .cta-link { min-height: 58px; margin-top: 34px; padding: 0 32px; background: var(--blue); color: #fff; font-size: 1.05rem; font-weight: 700; box-shadow: 0 14px 30px -16px rgba(49, 172, 122, .8); }
.hero .cta-link:hover, .hero .cta-link:focus-visible { background: var(--green-hover); color: #fff; }
.hero__photo { grid-column: 2; grid-row: 1 / span 2; align-self: center; justify-self: end; position: relative; width: 100%; max-width: 440px; aspect-ratio: 4 / 5; margin: 0; overflow: hidden; border-radius: 32px; background: var(--sky-deep); box-shadow: 0 34px 60px -38px rgba(13, 53, 39, .5); }
.hero__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%; }
/* The small face avatars clashed with the team photo (user, 06.10): the line «Практики ресторанного бизнеса» became the photo caption */
.hero__photo-caption { position: absolute; left: 18px; bottom: 18px; z-index: 1; display: inline-flex; align-items: center; gap: 9px; max-width: calc(100% - 36px); padding: 10px 16px 10px 14px; border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--ink); font-size: .92rem; font-weight: 700; line-height: 1.2; box-shadow: 0 10px 24px -14px rgba(0, 0, 0, .45); }
.hero__photo-caption::before { flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: var(--blue); content: ""; }
.hero--proof .hero-proof { grid-column: 1; grid-row: 2; justify-self: stretch; grid-template-columns: repeat(2, minmax(0, auto)); justify-content: start; gap: 0; margin: 52px 0 0; padding: 28px 0 0; border-top: 1px solid #cfe7da; color: var(--ink); }
.hero--proof .hero-proof__item { flex-direction: column; align-items: flex-start; gap: 10px; padding: 0 26px; }
.hero--proof .hero-proof__item:first-child { padding-left: 0; }
.hero--proof .hero-proof__item + .hero-proof__item { border-left: 1px solid #cfe7da; }
.hero--proof .hero-proof__value { color: var(--dark-blue); font-size: 2rem; }
.hero-proof__text span { color: var(--text-3); }
.hero-proof__faces img { border-color: #fff; }

@media (max-width: 1100px) {
  .hero--proof .hero-proof { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .hero--proof .hero-proof__item { flex-direction: row; align-items: center; gap: 14px; padding: 0; }
  .hero--proof .hero-proof__item + .hero-proof__item { border-left: 0; }
}
@media (max-width: 850px) {
  .hero.hero--proof { min-height: 0; }
  .hero--proof .hero__inner { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; padding-block: 100px 44px; }
  .hero--proof .hero__content, .hero--proof .hero-proof, .hero__photo { grid-column: 1; grid-row: auto; }
  .hero.hero--proof h1 { font-size: clamp(2.1rem, 8.6vw, 2.7rem); }
  .hero--proof .hero__copy { margin-top: 18px; font-size: 1.06rem; }
  .hero .cta-link { width: 100%; justify-content: center; margin-top: 26px; }
  .hero--proof .hero-proof { margin-top: 34px; padding-top: 24px; }
  .hero__photo { order: 3; width: 100%; max-width: none; margin: 34px 0 0; border-radius: 24px; }
}

/* Request block (user, 06.10): a full-width green band. Heading and direct contacts on the left,
   the form in a white card on the right, fields one under another so it reads as a form. */
.request-section { background: linear-gradient(110deg, #237f59 0%, #279b6c 45%, #31ac7a 100%); color: #fff; }
.section.request-section { padding-block: clamp(64px, 8vw, 112px); }
.request-v3 { display: grid; grid-template-columns: minmax(0, .95fr) minmax(0, 1fr); grid-template-rows: auto auto; align-content: center; gap: 0 clamp(36px, 6vw, 96px); }
.request-v3 .request-v3__copy { grid-column: 1; grid-row: 1; align-self: end; }
.request-v3 h2 { max-width: 520px; color: #fff; font-size: clamp(2.3rem, 4.2vw, 3.6rem); }
.request-v3__direct { grid-column: 1; grid-row: 2; align-self: start; margin: 26px 0 0; color: rgba(255, 255, 255, .92); font-size: 1rem; line-height: 1.7; }
.request-v3__direct a { display: block; width: fit-content; margin-top: 6px; color: #fff; font-size: 1.2rem; font-weight: 700; text-underline-offset: 4px; }
.request-v3 .request-form { grid-column: 2; grid-row: 1 / span 2; display: grid; gap: 16px; margin: 0; padding: clamp(26px, 3vw, 40px); border: 0; border-radius: 24px; background: #fff; color: var(--ink); box-shadow: 0 30px 70px -40px rgba(0, 0, 0, .5); }
.request-form .form-field label, .request-form .contact-channel legend { color: var(--ink); font-size: .9rem; font-weight: 700; }
.request-form .form-field input { min-height: 52px; padding-inline: 18px; border: 1px solid var(--line-strong); border-radius: 14px; background: #fff; color: var(--ink); }
.request-form .form-field input:hover, .request-form .form-field input:focus { border: 1px solid var(--blue); background: #fff; }
.request-form .form-field input:focus-visible { outline: 3px solid rgba(49, 172, 122, .35); outline-offset: 1px; }
.request-form .contact-channel label span { min-height: 42px; border: 1px solid var(--line-strong); border-radius: 999px; background: #fff; color: var(--ink); font-weight: 600; }
.request-form .contact-channel label:hover input:not(:checked) + span { border-color: var(--blue); background: var(--sky); color: var(--dark-blue); }
.request-form .contact-channel input:checked + span { border-color: var(--blue); background: var(--blue); color: #fff; }
.request-form .contact-channel input:focus-visible + span { outline: 3px solid rgba(49, 172, 122, .45); outline-offset: 2px; }
.request-form .cta-button { min-height: 56px; margin-top: 4px; border-radius: 999px; background: var(--blue); color: #fff; font-weight: 700; }
.request-form .cta-button:hover, .request-form .cta-button:focus-visible { background: var(--green-hover); color: #fff; }
.request-form .request-form__consent { color: var(--text-3); }
.request-form .request-form__consent a { color: var(--ink); }
.request-form .request-form__consent a:hover { color: var(--dark-blue); }
.request-form .request-form__status, .request-form.is-sent .request-form__status { color: var(--ink); }
.request-form .request-interest { background: var(--sky); }
.request-form .request-interest p { color: var(--dark-blue); }

@media (max-width: 850px) {
  .request-v3 { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; gap: 0; }
  .request-v3 .request-v3__copy, .request-v3 .request-form, .request-v3__direct { grid-column: 1; grid-row: auto; align-self: auto; }
  .request-v3 h2 { font-size: clamp(2rem, 8vw, 2.6rem); }
  .request-v3 .request-form { margin-top: 26px; }
  .request-v3__direct { margin-top: 22px; }
}
