/* Tecnifum — Servicios, ventajas, sectores y plaga del mes.
   Portada y columnas viven en sitio.css. */

/* =========================================================
   SERVICIOS
   ========================================================= */
.servicios__lista {
  margin-top: var(--espacio-8);
}

.aviso {
  display: flex;
  align-items: flex-start;
  gap: var(--espacio-4);
  margin-top: var(--espacio-8);
  padding: var(--espacio-6);
  background-color: var(--marca-suave);
  border-radius: var(--radio-lg);
}

.aviso .icono {
  color: var(--marca);
}

.aviso p {
  margin: 0;
  color: var(--texto);
  font-size: var(--texto-sm);
}

/* =========================================================
   VENTAJAS
   ========================================================= */
.ventajas {
  display: grid;
  gap: var(--espacio-6);
  margin: var(--espacio-8) 0 0;
  padding: 0;
  list-style: none;
}

@media (min-width: 720px) {
  .ventajas { grid-template-columns: repeat(2, 1fr); }
}

@media (min-width: 1024px) {
  .ventajas { grid-template-columns: repeat(3, 1fr); }
}

.ventaja {
  display: flex;
  gap: var(--espacio-4);
}

.ventaja .icono {
  color: var(--conforme);
}

.ventaja h3 {
  margin-bottom: var(--espacio-2);
  font-size: var(--texto-base);
}

.ventaja p {
  margin: 0;
  color: var(--texto-secundario);
  font-size: var(--texto-sm);
}

/* =========================================================
   SECTORES
   ========================================================= */
.sectores {
  display: flex;
  flex-wrap: wrap;
  gap: var(--espacio-3);
  margin: var(--espacio-8) 0 0;
  padding: 0;
  list-style: none;
}

.sector .icono {
  width: 20px;
  height: 20px;
  color: var(--marca);
}

.sector {
  display: inline-flex;
  align-items: center;
  gap: var(--espacio-2);
  padding: var(--espacio-3) var(--espacio-6);
  background-color: var(--superficie);
  border: 1px solid var(--borde);
  border-radius: var(--radio-completo);
  font-size: var(--texto-sm);
  font-weight: var(--peso-medio);
}

.sector--mas {
  background-color: transparent;
  border-style: dashed;
  color: var(--texto-secundario);
}

/* =========================================================
   PLAGA DEL MES
   ========================================================= */
.plaga__nombre {
  margin-bottom: var(--espacio-1);
}

.plaga__cientifico {
  color: var(--texto-secundario);
  font-size: var(--texto-sm);
}

.plaga__datos {
  margin: var(--espacio-6) 0;
}

.plaga__datos dt {
  color: var(--texto-tenue);
  font-size: var(--texto-xs);
  font-weight: var(--peso-fuerte);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.plaga__datos dd {
  margin: var(--espacio-1) 0 var(--espacio-4);
  color: var(--texto-secundario);
  font-size: var(--texto-sm);
}

/* =========================================================
   GALERÍA
   ========================================================= */
.galeria__figura {
  margin: 0;
  overflow: hidden;
  border: 1px solid var(--borde);
  border-radius: var(--radio-lg);
  background-color: var(--superficie);
}

.galeria__figura img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.galeria__figura figcaption {
  padding: var(--espacio-3) var(--espacio-4);
  color: var(--texto-secundario);
  font-size: var(--texto-sm);
}