/* =========================================================
   DATA ANALYSIS & INSIGHTS SERVICE PAGE

   Reuses the finalized shared service-page layout, typography,
   spacing and responsive rules from Data Collection & Mining.
   ========================================================= */

@import url("data-collection.css");


/* =========================================================
   ANALYTICAL METHODS
   ========================================================= */

.analysis-methods {
  margin-top: var(--section-gap);
  padding-top: var(--section-split-gap);

  border-top: 1px solid var(--line);
}

.analysis-methods-title {
  max-width: 900px;

  margin-bottom: 40px;

  font-size: clamp(2.3rem, 4vw, 4.4rem);
  line-height: 1.08;
}


/* =========================================================
   METHOD GRID
   ========================================================= */

.analysis-methods-grid {
  display: grid;

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

  gap: 18px;
}


/* =========================================================
   METHOD CARD
   ========================================================= */

.analysis-method-card {
  display: grid;

  grid-template-columns:
    42px
    minmax(0, 1fr);

  column-gap: 18px;

  min-width: 0;

  padding: 30px;

  border: 1px solid var(--line);
  border-radius: var(--radius-md);

  background:
    linear-gradient(
      145deg,
      rgba(14, 210, 218, 0.025),
      rgba(95, 41, 199, 0.035)
    ),
    #fff;

  box-shadow:
    0 5px 14px rgba(17, 20, 27, 0.06);
}

.analysis-method-number {
  display: grid;

  width: 42px;
  height: 42px;

  place-items: center;

  border: 1px solid rgba(17, 20, 27, 0.12);
  border-radius: 50%;

  background: #fff;

  font-family: "Manrope", sans-serif;

  font-size: 0.7rem;
  font-weight: 800;

  color: var(--ink);

  box-shadow:
    0 4px 12px rgba(17, 20, 27, 0.05);
}

.analysis-method-content {
  min-width: 0;
}

.analysis-method-label {
  display: flex;
  align-items: center;

  min-height: 42px;

  margin-bottom: 12px;

  font-family: "Manrope", sans-serif;

  font-size: 0.78rem;
  font-weight: 800;

  line-height: 1.3;
  letter-spacing: 0.1em;

  color: var(--violet);
}

.analysis-method-content h3 {
  max-width: 520px;

  margin-bottom: 12px;

  font-size: 1.35rem;
  font-weight: 700;

  line-height: 1.18;
  letter-spacing: -0.03em;
}

.analysis-method-content p {
  max-width: 560px;

  margin-bottom: 0;

  color: var(--muted);

  font-size: clamp(1.1rem, 1.2vw, 1.4rem);
  line-height: 1.6;
}


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

.analysis-method-tags {
  display: flex;
  flex-wrap: wrap;

  gap: 7px;

  margin-top: 18px;
}

.analysis-method-tags span {
  padding: 6px 9px;

  border: 1px solid rgba(17, 20, 27, 0.09);
  border-radius: 8px;

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

  font-size: 0.7rem;
  font-weight: 700;

  line-height: 1.3;

  color: #5c616c;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 980px) {

  .analysis-methods-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .analysis-method-card {
    grid-template-columns:
      42px
      minmax(0, 1fr);

    column-gap: 20px;
  }

  .analysis-method-content h3 {
    max-width: 680px;
  }

  .analysis-method-content p {
    max-width: 760px;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 680px) {

  .analysis-methods {
    margin-top: var(--section-gap);
    padding-top: var(--section-split-gap);
  }

  .analysis-methods-title {
    max-width: none;

    margin-bottom: 26px;

    font-size: clamp(2.05rem, 9.5vw, 2.65rem);
    line-height: 1.06;
  }

  .analysis-methods-grid {
    grid-template-columns: minmax(0, 1fr);

    gap: 14px;
  }

  .analysis-method-card {
    grid-template-columns:
      38px
      minmax(0, 1fr);

    column-gap: 16px;

    padding: 22px 24px;

    border-radius: 18px;
  }

  .analysis-method-number {
    width: 38px;
    height: 38px;

    font-size: 0.64rem;
  }

  .analysis-method-label {
    min-height: 38px;

    margin-bottom: 12px;

    font-size: 0.76rem;
  }

  .analysis-method-content h3 {
    max-width: none;

    margin-bottom: 8px;

    font-size: 1.18rem;
    line-height: 1.2;
  }

  .analysis-method-content p {
    max-width: none;

    font-size: clamp(1.1rem, 1.2vw, 1.4rem);
    line-height: 1.55;
  }

  .analysis-method-tags {
    margin-top: 16px;
  }

}


/* =========================================================
   SMALL MOBILE
   ========================================================= */

@media (max-width: 420px) {

  .analysis-method-card {
    grid-template-columns:
      36px
      minmax(0, 1fr);

    column-gap: 14px;

    padding: 21px 22px;
  }

  .analysis-method-number {
    width: 36px;
    height: 36px;

    font-size: 0.8rem;
  }

  .analysis-method-label {
    min-height: 36px;

    margin-bottom: 11px;

    font-size: 1rem;
  }

  .analysis-method-content h3 {
    font-size: 1.2rem;
  }

}