/* ============================================================
   SZOLGÁLTATÁSOK OLDAL – KÖZÖS STÍLUSOK
   ============================================================ */
/* Tipográfia segédosztályok */
.text-bold   { font-family: "Raleway-Bold", "Raleway", sans-serif; font-weight: 700; }
.text-medium { font-family: "Raleway-Medium", "Raleway", sans-serif; font-weight: 500; }
.text-semi   { font-family: "Raleway-SemiBold", "Raleway", sans-serif; font-weight: 600; }
.serif-bold  { font-family: "LibreBaskerville-Bold", "Georgia", serif; font-weight: 700; }
.serif-med   { font-family: "LibreBaskerville-Medium", "Georgia", serif; font-weight: 500; }


/* Intro szekció */
.intro-section {
  padding: 2rem 20rem 3rem;
}
.intro-section h1 {
  font-family: "LibreBaskerville-Medium", "Georgia", serif;
  font-size: 1.5625rem;
  font-weight: 500;
  line-height: 2.3125rem;
  margin: 0 0 1.5rem;
}
.two-col {
  display: flex;
  gap: 5rem;
}
.two-col .col {
  flex: 1;
  font-size: 1.0625rem;
  line-height: 1.5625rem;
  color: #1c232b;
  text-align: justify;
}

/* Szekció cím és alcím */
.section-gray {
  background: #f2f2f2;
  padding: 3rem 20rem;
}
.section-white {
  background: #ffffff;
  padding: 3rem 20rem;
}
.section-center-title {
  text-align: center;
  font-family: "LibreBaskerville-Bold", "Georgia", serif;
  font-size: 1.5625rem;
  font-weight: 700;
  line-height: 2.3125rem;
  margin-bottom: 1.5rem;
  font-weight:500;
}
.left{
    text-align: left;
}
.intro-title {
  text-align: left;
  font-family: "LibreBaskerville-Bold", "Georgia", serif;
  font-size: 1.5625rem;
  font-weight: 700;
  line-height: 2.3125rem;
  margin-bottom: 0.5rem;
}
.section-tag {
  color: #e40613;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 1.0625rem;
  font-weight: 600;
  text-transform: uppercase;
  margin-bottom: 0.5rem;
}
.section-subtitle-red {
  color: #e40613;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 1.5rem;
  /* font-weight: 600; */
  text-align: center;
  margin-bottom: 2rem;
}
.section-subtitle-green {
  color: #77be3c;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  margin-bottom: 2rem;
}
.section-subtitle-blue {
  color: #2cb5df;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 1.5rem;
  font-weight: 600;
  text-align: center;
  margin-bottom: 2rem;
}

/* Felsorolások piros/zöld/kék pontokkal */
.bullet-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
.bullet-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 0.5rem;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 1.0625rem;
  line-height: 1.4rem;
}
.bullet-list li::before {
  content: "";
  display: inline-block;
  width: 0.5625rem;
  height: 0.5625rem;
  border-radius: 50%;
  margin-top: 0.5rem;
  flex-shrink: 0;
}
.bullet-red li::before   { background: #e40613; }
.bullet-green li::before { background: #77be3c; }
.bullet-blue li::before  { background: #2cb5df; }

/* Feature ikonok sor */
.feature-row {
  display: flex;
  gap: 2rem;
  justify-content: space-evenly;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.feature-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  flex: 1;
  min-width: 10rem;
  max-width: 17rem;
}
.feature-item img {
  width: 4rem;
  height: 4rem;
  object-fit: contain;
  margin-bottom: 0.75rem;
}
.feature-item .feat-title {
  font-family: "LibreBaskerville-Bold", "Georgia", serif;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.6rem;
  color: #1c232b;
}

/* Fotók mellé */
.photo-section {
  display: flex;
  gap: 0;
  align-items: stretch;
}
.photo-section img {
  width: 50%;
  object-fit: cover;
  display: block;
}
.outsource-photos {
  display: flex;
  gap: 0;
}
.outsource-photos img {
  flex: 1;
  width: 50%;
  object-fit: cover;
  display: block;
}

/* SSC lifecycle */
.ssc-lifecycle-row {
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin: 2rem 0;
}
.ssc-lifecycle-item {
  flex: 1;
  background: #ffffff;
  border-radius: 0.5rem;
  padding: 1.5rem;
  text-align: center;
}

/* Oldal-specifikus form és kapcsolat */
.contact-section {
  padding: 3rem 20rem;
  text-align: center;
}
.contact-card {
  background: #ffffff;
  border-radius: 1.25rem;
  padding: 2.5rem 3rem;
  display: flex;
  gap: 3rem;
}
.contact-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.form-field-label {
  font-family: "Raleway-Medium", sans-serif;
  font-size: 1.0625rem;
  font-weight: 500;
  line-height: 2.1875rem;
  color: #1c232b;
  text-align: left;
}
.form-input {
  background: #f7f7f7;
  border: 0.0625rem solid #dadada;
  border-radius: 0.375rem;
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
}
.form-textarea {
  background: #f7f7f7;
  border: 0.0625rem solid #dadada;
  border-radius: 0.375rem;
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  resize: vertical;
  min-height: 8rem;
}
.btn-send {
  background: #e40613;
  border: none;
  border-radius: 0.375rem;
  color: #ffffff;
  font-family: "Raleway-SemiBold", sans-serif;
  font-size: 0.9375rem;
  font-weight: 600;
  text-transform: uppercase;
  padding: 1rem 2rem;
  cursor: pointer;
  width: 100%;
}

/* ================================================================
   RESZPONZÍV TÖRÉSPONTOK
================================================================ */

@media (max-width: 1500px) {
  .intro-section,
  .section-gray,
  .section-white { padding-left: 2rem; padding-right: 2rem; }
}

@media (max-width: 768px) {
  .intro-section,
  .section-gray,
  .section-white {
    padding-top: 2rem;
    padding-bottom: 2rem;
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .two-col { flex-direction: column; gap: 1.5rem; }

  .section-center-title { font-size: 1.25rem; line-height: 1.875rem; }

  .section-subtitle-red,
  .section-subtitle-green,
  .section-subtitle-blue { font-size: 1rem; }

  /* Inline flex díszek felülírása (HTML-ben inline style) */
  div[style*="display:flex"] { flex-direction: column !important; gap: 1.5rem !important; }

  .feature-row { gap: 1rem; }
  .feature-item { min-width: 8rem; }

  .outsource-photos img { width: 100%; }
}

@media (max-width: 480px) {
  .section-center-title { font-size: 1.125rem; line-height: 1.75rem; }
  .intro-title { font-size: 1.25rem; }
  .feature-item { flex: 0 0 calc(50% - 0.5rem); max-width: none; }
}