/* ================= SERVICES ================= */

.services {
  position: relative;
  padding: 80px 0 120px;
  color: #fff;
}

.services__container {
  max-width: 1376px;
  margin: 0 auto;
  padding: 0 32px;
}

/* TITLE */
.services__title {
  font-size: 61px;
  font-weight: 500;
  line-height: 0.92;
  margin-bottom: 48px;
}

/* GRID */
.services__grid {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

/* CARD */
.service-card {
  width: calc(50% - 8px);
  height: auto;
  min-height: 460px;
  padding: 28px;
  border-radius: 28px;

  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* COLORS */
.service-card--light {
  background: #FFF6F0;
  color: #000;
  opacity: 70%;
}

.service-card--light:hover {
  background: #034743;
  color: #FCE8D5;
  opacity: 100%;
}

.service-card--dark {
  background: #034743;
  color: #FCE8D5;
}

/* ================= HEADER ================= */

.service-card__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.service-card__title {
  font-size: 40px;
  font-weight: 500;
  line-height: 36px;
}

/* ================= FACTS ================= */

.service-card__facts {
  display: flex;
  align-items: center;
  padding: 16px 0;
}

.service-card__fact {
  flex: 1;
}

.service-card__fact-label {
  font-size: 17px;
  opacity: 0.33;
  line-height: 1.33;
}

.service-card__fact-value {
  font-size: 24px;
  font-weight: 500;
  line-height: 1.3;
}

.service-card__divider {
  width: 1px;
  height: 44px;
  background: rgba(0,0,0,0.1);
  margin: 0 16px;
}

/* ================= TEXT ================= */

.service-card__text {
  font-size: 17px;
  line-height: 1.33;
  opacity: 0.6;
  padding-top: 16px;
}

/* DARK CARD TEXT FIX */
.service-card--dark .service-card__text {
  border-top: 1px solid rgba(255,255,255,0.1);
  padding-top: 16px;
  opacity: 1;
}

/* ================= TAGS ================= */

.service-card__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 12px;
}

.service-card__tag {
  background: rgba(255,255,255,0.1);
  padding: 8px 12px;
  border-radius: 12px;
  font-size: 13px;
  letter-spacing: 0.02em;
}

/* ================= LIST ================= */

.service-card__list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 5px;
}

.service-card__list-item {
  padding: 12px 0;
  font-size: 17px;
  border-top: 1px solid rgba(0, 0, 0, 0.1);
}

.service-card__list-item:nth-child(1),
.service-card__list-item:nth-child(2) {
  border-top: none;
}

/* ================= BUTTON ================= */

.service-card__btn {
  height: 48px;
  margin-top: 7px;
  border-radius: 18px;
  border: 1px solid rgba(3, 71, 67, 0.2);
  background-color: transparent;
  color: #034743;
  opacity: 1;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 17px;

  transition: 0.2s;
}

.service-card__btn:hover {
  opacity: 1;
}

/* DARK BUTTON */
.service-card--dark .service-card__btn {
  background: #FFD9BE;
  border: none;
  color: #054743;
  opacity: 1;
}

/* ================= INTEREST ================= */

.services__interest {
  margin-top: 80px;
  padding: 40px 0;
}

/* заголовок */
.services__interest-head {
  margin-bottom: 24px;
}

.services__interest-title {
  font-size: 40px;
  font-weight: 500;
  line-height: 0.9;
  color: #F6F4F1;
}

.services__interest-subtitle {
  font-size: 17px;
  color: #F3F2EF;
  opacity: 0.8;
}

/* сетка */
.services__interest-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 24px;
}

/* элемент */
.interest-item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 17px;
  line-height: 1.3;
  color: #fff;
  opacity: 0.9;
}



/* POPUP */
.services .popup {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 1000;
}

.popup.active {
  display: grid;
}

/* затемнение */
.popup__overlay {
  position: absolute;
  inset: 0;
  background: rgba(10, 10, 20, 0.6);
  backdrop-filter: blur(6px);
}

/* окно */
.popup--full .popup__content {
  position: relative;
  width: 680px;
  padding: 32px;
  border-radius: 28px;
  background: #FFF6F0;
  color: #000;
  margin: 120px auto;
}

/* закрыть */
.popup--full .popup__close {
  position: absolute;
  top: 16px;
  right: 16px;
  border: none;
  background: none;
  font-size: 20px;
  cursor: pointer;
}

/* заголовок */
.popup--full .popup__title {
  font-size: 32px;
  margin-bottom: 24px;
}

/* список */
.popup--full .popup__list {
  display: flex;
  flex-direction: row;
  gap: 40px;
  margin-bottom: 24px;
}

.popup--full .popup__col {
    width: 50%;
}

.popup--full .popup__col div {
  padding: 12px 0;
  border-top: 1px solid rgba(0,0,0,0.1);
  font-size: 17px;
}

/* кнопка */
.popup--full .popup__btn {
  width: 100%;
  height: 48px;
  border-radius: 18px;
  border: 1px solid rgba(3,71,67,0.2);
  background: transparent;
  color: #034743;
  cursor: pointer;
}

.service-card--light:hover .service-card__text {
  color: #FCE8D5;
  opacity: 1;
}

.service-card--light:hover .service-card__fact-label {
  color: rgba(252, 232, 213, 0.5);
}

.service-card--light:hover .service-card__fact-value {
  color: #FCE8D5;
}

.service-card--light:hover .service-card__divider {
  background: rgba(252, 232, 213, 0.55);
}

.service-card--light:hover svg path {
  stroke: #FCE8D5;
}

.service-card--light:hover .service-card__btn {
  background: #FFD9BE;
  color: #054743;
  border: none;
  opacity: 1;
}

.service-card,
.service-card * {
  transition: all 0.25s ease;
}