/* Start:/services/selection/style.css?178702999513451*/
@font-face {
  font-family: "Fira Sans";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/services/selection/assets/fira-sans-400.ttf") format("truetype");
}

@font-face {
  font-family: "Fira Sans Condensed";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/services/selection/assets/fira-sans-condensed-500.ttf") format("truetype");
}

@font-face {
  font-family: "Fira Sans Condensed";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/services/selection/assets/fira-sans-condensed-700.ttf") format("truetype");
}

@font-face {
  font-family: "Fira Sans Condensed";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/services/selection/assets/fira-sans-condensed-900.ttf") format("truetype");
}

@import url('https://fonts.googleapis.com/css2?family=Fira+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900&family=Fira+Sans+Condensed:wght@500;600;700;800;900&display=swap');

:root {
  --sizod-blue: #174161;
  --sizod-green: #60791e;
  --sizod-green-dark: #536b16;
  --sizod-text: #17344c;
  --sizod-light: #f3f6f8;
  --sizod-white: #ffffff;
  --sizod-border: #dce1e5;
  --sizod-shadow: 0 2px 10px rgba(23, 65, 97, .12);
  --sizod-container: 924px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: #fff; color: var(--sizod-text); }

.sizod-page {
  min-width: 320px;
  overflow: hidden;
  font-family: "Fira Sans", Arial, sans-serif;
  color: var(--sizod-text);
  background: #fff;
}

.sizod-page img, .sizod-page svg { display: block; max-width: 100%; }
.sizod-page h1, .sizod-page h2, .sizod-page h3, .sizod-page p, .sizod-page ul { margin: 0; }

/* Desktop content width: 924px */
.sizod-container {
  width: min(100%, var(--sizod-container));
  margin-inline: auto;
  padding-inline: 10px;
}

.sizod-page h2 {
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  color: var(--sizod-blue);
  text-align: center;
  text-transform: uppercase;
  font-size: clamp(21px, 2vw, 26px);
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: .2px;
}

.sizod-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  min-height: 48px;
  padding: 0 22px;
  border-radius: 6px;
  border: 2px solid var(--sizod-green);
  background: var(--sizod-green);
  color: #fff;
  text-decoration: none;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 16px;
  line-height: 1;
  font-weight: 700;
  text-transform: uppercase;
  box-shadow: none;
  transition: background .2s ease, border-color .2s ease, transform .2s ease;
}

.sizod-btn span { font-size: 31px; line-height: 1; margin-top: -2px; }

.sizod-hero .sizod-btn {
  margin-top: 18px;
}
.sizod-btn:hover { background: var(--sizod-green-dark); border-color: var(--sizod-green-dark); transform: translateY(-1px); }

/* HERO */
.sizod-hero {
  min-height: 540px;
  background: url('/services/selection/assets/hero-bg-block1.webp') center center / cover no-repeat;
  border-top: 4px solid var(--sizod-green);
}

.sizod-hero__grid { min-height: inherit; display: flex; align-items: flex-start; }

.sizod-hero__content {
  width: 700px;
  padding-top: 42px;
  padding-bottom: 42px;
}

.sizod-hero h1 {
  color: var(--sizod-blue);
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: clamp(42px, 4.6vw, 58px);
  line-height: 1.12;
  font-weight: 700;
  letter-spacing: 2.50px;
}

.sizod-lead {
  position: relative;
  margin-top: 27px;
  margin-bottom: 27px;
  padding-left: 20px;
  color: #243a4c;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: clamp(16px, 1.45vw, 19px);
  line-height: 1.28;
  font-weight: 700;
}

.sizod-lead::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 1px;
  width: 3px;
  background: var(--sizod-green);
}

.sizod-hero-list {
  list-style: none;
  display: grid;
  gap: 10px;
  padding: 0;
  margin: 38px 0 42px;
  width: 360px;
}

.sizod-hero-list li {
  display: grid;
  grid-template-columns: 32px 1fr;
  gap: 12px;
  align-items: start;
  min-height: 34px;
  color: var(--sizod-text);
  font-size: 15px;
  line-height: 1.25;
}

.sizod-hero-list b {
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 16px;
  font-weight: 500;
}

.hero-list__text span { font-weight: 400; }

.hero-list__icon {
  width: 32px;
  height: 32px;
  display: block;
}

.hero-list__icon img,
.hero-list__icon svg,
.round-icon svg,
.benefit-icon svg,
.step-icon svg,
.audience-icon svg,
.final-list img {
  width: 29px;
  height: 29px;
  object-fit: contain;
}

.hero-list__icon img,
.hero-list__icon svg {
  object-fit: contain;
}

/* COMMON SECTIONS */
.sizod-section { padding: 48px 0 54px; }
.sizod-section--tools { background: var(--sizod-light); }
.sizod-section--why { background: #fff; padding-top: 58px; padding-bottom: 51px; }
.sizod-section--steps { background: #fff; padding-top: 4px; padding-bottom: 50px; }
.sizod-section--audience { background: var(--sizod-light); padding-top: 48px; padding-bottom: 50px; }

/* TOOL CARDS */
.tool-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 30px;
}

.tool-card {
  min-height: 285px;
  padding: 24px 15px 20px;
  border: 2px solid var(--sizod-border);
  border-radius: 12px;
  background: #fff;
  text-align: center;
  box-shadow: var(--sizod-shadow);
}

.round-icon {
  width: 98px;
  height: 98px;
  margin: 0 auto 20px;
  border-radius: 50%;
  padding: 22px;
  background: var(--sizod-green);
  color: #fff;
}

.round-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.tool-card h3 {
  min-height: 51px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 18px;
  color: var(--sizod-blue);
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.08;
  font-weight: 700;
}

.tool-card p {
  width: 98%;
  margin-inline: auto;
  font-size: 14px;
  line-height: 1.24;
  letter-spacing: .15px;
}

/* WHY */
.benefit-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 30px;
}

.benefit-card {
  min-height: 105px;
  padding: 15px 13px;
  border-radius: 4px;
  background: var(--sizod-green);
  color: #fff;
  display: grid;
  grid-template-columns: 46px 1fr;
  align-items: center;
  gap: 10px;
}

.benefit-icon {
  width: 46px;
  height: 46px;
  color: #fff;
}

.benefit-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.benefit-card h3 {
  margin-bottom: 4px;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.08;
  font-weight: 700;
}

.benefit-card p {
  font-size: 14px;
  line-height: 1.24;
  font-weight: 400;
}

/* STEPS */
.step-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 32px;
}

.step-card {
  position: relative;
  text-align: center;
}

.step-num {
  position: absolute;
  top: -3px;
  left: 50%;
  transform: translateX(-63px);
  width: 31px;
  height: 31px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sizod-green);
  color: #fff;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 21px;
  line-height: 1;
  font-weight: 900;
  z-index: 2;
}

.step-icon {
  width: 104px;
  height: 104px;
  margin: 0 auto 18px;
  padding: 25px;
  border: 2px solid #e0e4e7;
  border-radius: 50%;
  background: #fff;
  color: var(--sizod-blue);
  box-shadow: 0 1px 3px rgba(23, 65, 97, .06);
}

.step-icon svg { stroke-width: 2.3; }

.step-icon path[fill] { fill: var(--sizod-green); }


.step-icon-img {
  width: 100%;
  height: 100%;
  display: block;
  background: var(--sizod-blue);
  mask-repeat: no-repeat;
  mask-position: center;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  -webkit-mask-size: contain;
}

.step-icon-img--1 {
  mask-image: url('/services/selection/assets/step-icon-1.svg');
  -webkit-mask-image: url('/services/selection/assets/step-icon-1.svg');
}

.step-icon-img--2 {
  mask-image: url('/services/selection/assets/step-icon-2.svg');
  -webkit-mask-image: url('/services/selection/assets/step-icon-2.svg');
}

.step-icon-img--3 {
  mask-image: url('/services/selection/assets/step-icon-3.svg');
  -webkit-mask-image: url('/services/selection/assets/step-icon-3.svg');
}

.step-icon-img--4 {
  mask-image: url('/services/selection/assets/step-icon-4.svg');
  -webkit-mask-image: url('/services/selection/assets/step-icon-4.svg');
}

.step-card p {
  width: 178px;
  max-width: 100%;
  margin: 0 auto;
  font-size: 14px;
  line-height: 1.18;
  font-weight: 400;
}


.step-ready-icon {
  width: 134px;
  height: 114px;
  margin: 0 auto 18px;
  display: block;
  object-fit: contain;
}

/* AUDIENCE */
.audience-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 16px;
  margin-top: 36px;
}

.audience-card { text-align: center; }
.audience-icon {
  width: 68px;
  height: 68px;
  margin: 0 auto 13px;
  color: var(--sizod-blue);
}

.audience-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
.audience-icon svg { stroke-width: 2.1; }
.audience-icon circle,
.audience-icon path:nth-last-child(-n + 2) { stroke: var(--sizod-green); }
.audience-card p {
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 14px;
  line-height: 1.08;
  font-weight: 400;
  color: #101820;
}


.audience-card:nth-child(3) .audience-icon img {
  transform: scale(1.18);
  transform-origin: center;
}

/* FINAL BANNER */
.sizod-final { background: #fff; padding: 32px 0 0; }
.final-banner {
  min-height: 230px;
  position: relative;
  overflow: hidden;
  border-radius: 24px 24px 24px 24px;
  background: url('/services/selection/assets/banner.webp') center right / cover no-repeat;
}



.final-content {
  position: relative;
  z-index: 1;
  width: 700px;
  max-width: 58%;
  padding: 30px 0 22px 36px;
  color: #fff;
}
.final-content h2 {
  color: #fff;
  text-align: left;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: clamp(34px, 4.8vw, 50px);
  line-height: .95;
  font-weight: 700;
  letter-spacing: 2.5px;
}
.final-content p {
  margin-top: 8px;
  font-size: clamp(21px, 2.6vw, 31px);
  line-height: 1;
  font-weight: 400;
}
.sizod-btn--white {
  min-height: 32px;
  margin-top: 25px;
  padding: 0 17px;
  background: #fff;
  border-color: #fff;
  color: var(--sizod-blue);
  font-size: 14px;
  gap: 7px;
  border-radius: 4px;
}
.sizod-btn--white span { font-size: 23px; }
.sizod-btn--white:hover { background: #edf2f5; border-color: #edf2f5; color: var(--sizod-blue); }

.final-content .sizod-btn--white {
  display: flex;
  width: fit-content;
  margin-bottom: 28px;
}
.final-list {
  display: grid;
  grid-template-columns: repeat(4, max-content);
		/*gap: 18px;*/
  list-style: none;
  margin-top: 0;
  padding: 0;
  color: #fff;
}
.final-list li {
  display: grid;
  grid-template-columns: 30px max-content;
  align-items: center;
  gap: 9px;
  font-family: "Fira Sans Condensed", "Arial Narrow", Arial, sans-serif;
  font-size: 10px;
  line-height: 1.05;
  font-weight: 500;
}
.final-list svg { width: 29px; height: 29px; color: #fff; stroke-width: 1.9; }

@media (max-width: 860px) {
  .sizod-container { width: 100%; padding-inline: 18px; }
  .sizod-hero { min-height: 560px; background-position: 58% center; }
  .sizod-hero__content { width: 480px; }
  .tool-grid, .benefit-grid, .step-grid { grid-template-columns: repeat(2, 1fr); }
  .step-grid { gap: 35px 50px; }
  .audience-grid { grid-template-columns: repeat(3, 1fr); gap: 35px 22px; }
  .final-content { max-width: 68%; }
  .final-list { grid-template-columns: repeat(2, max-content); gap: 16px 28px; }
}

@media (max-width: 760px) {
  .sizod-container { padding-inline: 18px; }
  .sizod-hero {
    min-height: auto;
    background-position: 63% center;
  }
  .sizod-hero::before {
    content: "";
    position: absolute;
  }
  .sizod-hero__content {
    width: 100%;
    padding-top: 44px;
    padding-bottom: 44px;
  }
  .sizod-hero h1 { font-size: clamp(39px, 12vw, 58px); }
  .sizod-lead { font-size: 18px; }
  .sizod-hero-list { width: 100%; margin-top: 42px; }
  .sizod-btn { min-height: 52px; width: 100%; padding: 0 18px; font-size: 16px; }
  .sizod-section { padding: 42px 0; }
  .tool-grid, .benefit-grid, .step-grid, .audience-grid { grid-template-columns: 1fr; }
  .tool-card { min-height: auto; }
  .benefit-card { min-height: 105px; }
  .step-grid { gap: 38px; }
  .audience-grid { gap: 30px; }
  .final-banner { border-radius: 18px; min-height: auto; }

}

@media (max-width: 420px) {
  .sizod-page h2 { font-size: 22px; }
  .sizod-hero h1 { font-size: 36px; }
  .round-icon { width: 105px; height: 105px; padding: 23px; }
  .benefit-card { grid-template-columns: 50px 1fr; }
  .benefit-icon { width: 50px; height: 50px; }
  .final-list { grid-template-columns: 1fr; }
}


html body .body .sizod-page ul li::before,
html body .body .sizod-page ul li:before,
html body .sizod-page ul li::before,
html body .sizod-page ul li:before {
  content: none !important;
  display: none !important;
  position: static !important;
  width: 0 !important;
  height: 0 !important;
  background: transparent !important;
}

/* End */
/* /services/selection/style.css?178702999513451 */