:root {
  /* Colores corporativos: ajusta estos valores */
  --is-primary: #004884;   /* Azul institucional */
  --is-accent:  #FFB400;   /* Amarillo/acento */
  --is-bg:      #ffffff;   /* Fondo */
  --is-border:  #d9d9d9;   /* Bordes */
  --is-text:    #222222;   /* Texto principal */
  --is-muted:   #666666;   /* Texto secundario */

  /* Tipografía corporativa */
  --is-font: "Open Sans", "Segoe UI", Roboto, Arial, sans-serif;

  /* Espaciado y radios */
  --is-radius: 6px;
  --is-gap: 14px;
  --is-container-max: 980px;
}

.is-container {
  max-width: var(--is-container-max);
  margin: 0 auto;
  padding: 20px;
  font-family: var(--is-font);
  color: var(--is-text);
}

.is-title {
  font-size: 1.6rem;
  margin-bottom: 12px;
  font-weight: 600;
  color: var(--is-primary);
}

.is-service {
  border: 1px solid var(--is-border);
  border-radius: var(--is-radius);
  padding: 16px;
  margin-bottom: 16px;
  background: var(--is-bg);
}

.is-service h4 {
  margin: 0 0 10px 0;
  font-size: 1.05rem;
  color: var(--is-primary);
}

.is-service-form {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: var(--is-gap);
}

.is-service-form label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 0.95rem;
  color: var(--is-text);
}

.is-service-form input,
.is-service-form select {
  padding: 8px 10px;
  border: 1px solid var(--is-border);
  border-radius: 4px;
  background: #fff;
  font-size: 14px;
  color: var(--is-text);
}

.is-input-vigencia { max-width: 110px; }
.is-input-mes { max-width: 120px; }

.is-actions {
  grid-column: 1 / -1;
  display: flex;
  gap: 10px;
  margin-top: 10px;
}

.button.is-call {
  background: var(--is-primary);
  color: #fff;
  border: none;
}

.button.is-call:hover {
  background: #003366; /* tono más oscuro */
}