/* =========================================================
   CLIMATE — TELEPÍTÉS
   ========================================================= */

.ct-climate-install {
  position: relative;

  padding: 140px 0;

  background:
    radial-gradient(
      circle at 80% 20%,
      rgba(0, 174, 239, 0.06),
      transparent 30%
    ),
    var(--ct-bg);
}

/* VISUAL */

.ct-climate-install__visual {
  position: relative;

  min-height: 520px;

  overflow: hidden;

  background: #111721;

  clip-path: polygon(0 0, 94% 0, 100% 13%, 100% 100%, 6% 100%, 0 87%);
}

.ct-climate-install__image {
  position: absolute;

  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;

  filter: saturate(0.62) contrast(1.06) brightness(0.68);

  transform: scale(1.02);
}

.ct-climate-install__overlay {
  position: absolute;

  inset: 0;

  background:
    linear-gradient(180deg, rgba(7, 10, 15, 0.08), rgba(7, 10, 15, 0.62)),
    linear-gradient(90deg, rgba(0, 174, 239, 0.1), transparent 50%);
}

/* BADGE */

.ct-climate-install__badge {
  position: absolute;

  left: 34px;
  bottom: 34px;

  z-index: 4;

  display: flex;
  align-items: center;

  gap: 14px;

  padding: 13px 16px;

  background: rgba(7, 10, 15, 0.76);

  border-left: 2px solid #00aeef;

  backdrop-filter: blur(8px);
}

.ct-climate-install__badge span {
  color: #00aeef;

  font-family: monospace;
  font-size: 10px;
}

.ct-climate-install__badge strong {
  color: #ffffff;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.15em;
}

/* TECH LABELS */

.ct-climate-install__tech {
  position: absolute;

  right: 34px;
  top: 34px;

  z-index: 4;

  display: flex;

  gap: 10px;
}

.ct-climate-install__tech span {
  padding: 8px 10px;

  color: rgba(255, 255, 255, 0.72);

  font-family: monospace;
  font-size: 9px;

  letter-spacing: 0.12em;

  background: rgba(7, 10, 15, 0.6);

  border: 1px solid rgba(255, 255, 255, 0.08);
}

/* CONTENT */

.ct-climate-install__content {
  display: grid;

  grid-template-columns:
    minmax(0, 1.1fr)
    minmax(320px, 0.9fr);

  gap: clamp(60px, 8vw, 140px);

  margin-top: 70px;

  align-items: start;
}

.ct-climate-install__title {
  margin: 0;

  font-family: "Space Grotesk", sans-serif;

  font-size: clamp(52px, 5vw, 88px);
  font-weight: 600;

  line-height: 0.94;
  letter-spacing: -0.05em;
}

.ct-climate-install__title span {
  display: block;

  color: #8d98a6;
}

.ct-climate-install__description {
  padding-top: 35px;
}

.ct-climate-install__description p {
  margin: 0;

  color: #a8b1bc;

  font-size: 16px;
  line-height: 1.75;
}

.ct-climate-install__description p + p {
  margin-top: 20px;
}

/* STEPS */

.ct-climate-install__steps {
  display: grid;

  grid-template-columns: repeat(3, minmax(0, 1fr));

  margin-top: 70px;

  border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.ct-climate-install__step {
  position: relative;

  min-height: 220px;

  padding: 30px;

  border-right: 1px solid rgba(255, 255, 255, 0.08);
}

.ct-climate-install__step:first-child {
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}

.ct-climate-install__step > span {
  display: block;

  margin-bottom: 40px;

  color: #00aeef;

  font-family: monospace;
  font-size: 10px;
}

.ct-climate-install__step h3 {
  margin: 0;

  font-family: "Space Grotesk", sans-serif;

  font-size: 22px;
  font-weight: 600;

  letter-spacing: -0.03em;
}

.ct-climate-install__step p {
  margin: 12px 0 0;

  color: #7f8a96;

  font-size: 14px;
  line-height: 1.7;
}

/* RESPONSIVE */

@media (max-width: 900px) {
  .ct-climate-install__content {
    grid-template-columns: 1fr;

    gap: 30px;
  }

  .ct-climate-install__description {
    padding-top: 0;

    max-width: 720px;
  }
}

@media (max-width: 700px) {
  .ct-climate-install__steps {
    grid-template-columns: 1fr;
  }

  .ct-climate-install__step,
  .ct-climate-install__step:first-child {
    border-left: 0;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  }
}

@media (max-width: 620px) {
  .ct-climate-install {
    padding: 90px 0;
  }

  .ct-climate-install__visual {
    min-height: 410px;
  }

  .ct-climate-install__tech {
    display: none;
  }

  .ct-climate-install__badge {
    left: 20px;
    bottom: 20px;
  }

  .ct-climate-install__content {
    margin-top: 50px;
  }

  .ct-climate-install__title {
    font-size: clamp(46px, 13vw, 64px);
  }
}

/* =========================================================
   CLIMATE — KARBANTARTÁS
   ========================================================= */

.ct-climate-maintenance {
  position: relative;

  padding: 150px 0;

  background:
    radial-gradient(
      circle at 78% 70%,
      rgba(0, 174, 239, 0.05),
      transparent 30%
    ),
    #090d13;
}

/* HEADER */

.ct-climate-maintenance__header {
  display: grid;

  grid-template-columns:
    minmax(0, 1.1fr)
    minmax(320px, 0.9fr);

  gap: clamp(60px, 8vw, 140px);

  align-items: end;

  margin-bottom: 70px;
}

.ct-climate-maintenance__title {
  margin: 0;

  font-family: "Space Grotesk", sans-serif;

  font-size: clamp(52px, 5vw, 88px);
  font-weight: 600;

  line-height: 0.94;
  letter-spacing: -0.05em;
}

.ct-climate-maintenance__title span {
  display: block;

  color: #8d98a6;
}

.ct-climate-maintenance__lead {
  margin: 0;

  color: #a8b1bc;

  font-size: 16px;
  line-height: 1.75;
}

/* MAIN PANEL */

.ct-climate-maintenance__panel {
  display: grid;

  grid-template-columns:
    minmax(300px, 0.8fr)
    minmax(0, 1.2fr);

  min-height: 610px;

  background: #0d1219;

  border: 1px solid rgba(255, 255, 255, 0.07);

  clip-path: polygon(0 0, 96% 0, 100% 8%, 100% 100%, 4% 100%, 0 92%);
}

/* VISUAL */

.ct-climate-maintenance__visual {
  position: relative;

  min-height: 610px;

  overflow: hidden;
}

.ct-climate-maintenance__image {
  position: absolute;

  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;

  filter: saturate(0.5) contrast(1.08) brightness(0.58);

  transform: scale(1.02);
}

.ct-climate-maintenance__overlay {
  position: absolute;

  inset: 0;

  background:
    linear-gradient(90deg, rgba(7, 10, 15, 0.08), rgba(7, 10, 15, 0.68)),
    linear-gradient(180deg, transparent, rgba(7, 10, 15, 0.55));
}

.ct-climate-maintenance__badge {
  position: absolute;

  left: 28px;
  bottom: 28px;

  z-index: 4;

  display: flex;
  align-items: center;

  gap: 14px;

  padding: 12px 15px;

  background: rgba(7, 10, 15, 0.78);

  border-left: 2px solid #00aeef;
}

.ct-climate-maintenance__badge span {
  color: #00aeef;

  font-family: monospace;
  font-size: 10px;
}

.ct-climate-maintenance__badge strong {
  color: #ffffff;

  font-size: 9px;
  font-weight: 600;

  letter-spacing: 0.15em;
}

.ct-climate-maintenance__status {
  position: absolute;

  top: 28px;
  left: 28px;

  z-index: 4;

  display: flex;
  align-items: center;

  gap: 9px;

  color: rgba(255, 255, 255, 0.55);

  font-family: monospace;
  font-size: 9px;

  letter-spacing: 0.14em;
}

.ct-climate-maintenance__status-dot {
  width: 7px;
  height: 7px;

  background: #00aeef;

  box-shadow: 0 0 0 5px rgba(0, 174, 239, 0.08);
}

/* CARDS */

.ct-climate-maintenance__cards {
  display: grid;

  grid-template-columns: repeat(2, minmax(0, 1fr));

  padding: 34px;
}

.ct-climate-maintenance__card {
  padding: 34px;

  border-left: 1px solid rgba(255, 255, 255, 0.07);
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}

.ct-climate-maintenance__card:nth-child(2n) {
  border-right: 1px solid rgba(255, 255, 255, 0.07);
}

.ct-climate-maintenance__card:nth-last-child(-n + 2) {
  border-bottom: 0;
}

.ct-climate-maintenance__card > span {
  display: block;

  margin-bottom: 52px;

  color: #00aeef;

  font-family: monospace;
  font-size: 10px;
}

.ct-climate-maintenance__card h3 {
  margin: 0;

  font-family: "Space Grotesk", sans-serif;

  font-size: 23px;
  font-weight: 600;

  letter-spacing: -0.03em;
}

.ct-climate-maintenance__card p {
  margin: 13px 0 0;

  color: #7f8a96;

  font-size: 14px;
  line-height: 1.7;
}

/* RESPONSIVE */

@media (max-width: 1000px) {
  .ct-climate-maintenance__header {
    grid-template-columns: 1fr;

    gap: 30px;
  }

  .ct-climate-maintenance__lead {
    max-width: 720px;
  }

  .ct-climate-maintenance__panel {
    grid-template-columns: 1fr;
  }

  .ct-climate-maintenance__visual {
    min-height: 500px;
  }
}

@media (max-width: 700px) {
  .ct-climate-maintenance__cards {
    grid-template-columns: 1fr;

    padding: 20px;
  }

  .ct-climate-maintenance__card,
  .ct-climate-maintenance__card:nth-child(2n),
  .ct-climate-maintenance__card:nth-last-child(-n + 2) {
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  }

  .ct-climate-maintenance__card:last-child {
    border-bottom: 0;
  }
}

@media (max-width: 620px) {
  .ct-climate-maintenance {
    padding: 90px 0;
  }

  .ct-climate-maintenance__title {
    font-size: clamp(46px, 13vw, 64px);
  }

  .ct-climate-maintenance__visual {
    min-height: 420px;
  }

  .ct-climate-maintenance__card {
    padding: 28px 20px;
  }

  .ct-climate-maintenance__card > span {
    margin-bottom: 35px;
  }
}