.why-safirnet .block-1 div {
  background-color: #041492;
}

.why-safirnet .block-2 div {
  background-color: rgb(198, 179, 162);
}

.why-safirnet .block-3 div {
  background-color: rgba(255, 222, 185)
}

.why-safirnet .one-click-box {
  position: absolute;

  bottom: min(calc(30px + ((100vw - 365px) * 0.28)), 220px);
  left: 15px;
  transform: translate(-50%, 50%);

  z-index: 2;
}

@media screen and (max-width: 991px) {
  .why-safirnet .one-click-box {
    bottom: 75px;
    left: 50%;
  }
}

.why-safirnet .section-title-container h2 {
  position: relative;
}


.why-safirnet .section-title-container img:nth-of-type(1) {
  position: absolute;
  width: 100%;
  max-width: 732px;
}

.why-safirnet .section-title-container img:nth-of-type(2) {
  max-width: 100%;

  position: static;
  float: right;

  transform: none;
  z-index: 1;
}

@media screen and (max-width: 700px) {
  .why-safirnet .section-title-container img:nth-of-type(2) {
    margin-top: -40px;
  }
}

#plan-specs .header-area {
  margin-bottom: 25px;
}

#plan-specs .header-area > .title {
  display: flex;
  align-items: flex-end;

  color: var(--safir-blue-900);
  font-weight: 400;
  font-size: 24px;
  line-height: 28.15px;
  letter-spacing: 0;
}

#plan-specs .header-area > div {
  flex-grow: 1;

  min-width: 288px;
}

#plan-specs .header-area .plan-card-2 {
  min-width: 250px;
  width: clamp(250px, 100%, 288px);
  max-width: 100%;
}

#plan-specs .title-area {
  display: flex;
  flex-direction: column;

  margin-bottom: 30px;
  row-gap: 16px;
}

#plan-specs .title-area .title {
  color: var(--safir-blue-900);

  font-weight: 400;
  font-size: 24px;
  line-height: 28.15px;
  letter-spacing: 0;
}

#plan-specs .title-area .tabs  {
  display: flex;
  column-gap: 36px;

  color: var(--gray-300);

  font-weight: 400;
  font-size: 14px;
  line-height: 16.42px;
  letter-spacing: 0;
}

#plan-specs .title-area .tabs .tab {
  cursor: pointer;
}

#plan-specs .title-area .tabs .tab.selected {
  color: var(--safir-blue-900);
}

#plan-specs .title-area .button-cont {
  display: none;
  column-gap: 16px;
}

#plan-specs .title-area .button-cont button {
  color: var(--safir-blue-200);

  font-weight: 400;
  font-size: 14px;
  line-height: 16.42px;
  letter-spacing: 0;
  text-align: center;


  border-radius: 4px;
  padding: 8px 10px;

  background-color: white;
  border: 1px solid var(--safir-blue-100);
}

#plan-specs .title-area .button-cont button.selected {
  color: white;

  font-weight: 600;
  font-size: 14px;
  line-height: 16.42px;
  letter-spacing: 0;
  text-align: center;

  border-radius: 4px;
  padding: 8px 10px;

  background-color: var(--safir-blue-500);
  border: none;
}

.specs-table {
  align-items: flex-end;
}

.specs-table .comt {
  display: flex;
  flex-direction: column;
  
  justify-content: flex-end;
  min-width: 150px;
}

.specs-table .comt.hidden {
  display: none;
}

.specs-table .comt-1 {
  flex-grow: 1;
}

.specs-table .comt-2 {
  flex-grow: 1;
}

.specs-table .comt .cell {
  display: flex;
  align-items: center;
  column-gap: 8px;

  height: 32px;
  border: 0 solid var(--gray-50);
  border-bottom-width: 1px;

  color: var(--gray-500);
}

.specs-table .comt-1 .cell {
  font-weight: 700;
  font-size: 12px;
  line-height: 14.08px;
  letter-spacing: 0;
}

.specs-table .comt-2 .cell {
  font-weight: 400;
  font-size: 12px;
  line-height: 14.08px;
  letter-spacing: 0;
}

@media screen and (max-width: 1200px) {
  #plan-specs .header-area .plan-card-2 {
    width: clamp(250px, 100%, 500px);
  }

  #plan-specs .title-area  {
    margin-bottom: 16px;
  }

  #plan-specs .title-area .tabs  {
    column-gap: 12px;
  }

  #plan-specs .title-area .button-cont {
    display: flex;
  }

  #plan-specs div[data-display].temp-hidden {
    display: none;
  }

  #plan-specs .specs-table.temp-hidden {
    display: none;
  }
}
