.elementor-4162 .elementor-element.elementor-element-002c0c1{--display:flex;overflow:visible;}/* Start custom CSS for html, class: .elementor-element-23c754c */.sr-article {
  --sr-primary: #17a2b8;
  --sr-primary-light: #eefafd;
  --sr-text: #222;
  --sr-muted: #666;
  --sr-border: #ddd;

  max-width: 1080px;
  margin: 0 auto;
  padding: 32px 20px;
  font-family: Arial, Helvetica, sans-serif;
  color: var(--sr-text);
  line-height: 1.7;
  font-size: 16px;
  background: #fff;
}

.sr-article * {
  box-sizing: border-box;
}

.sr-hero {
  margin-bottom: 36px;
  padding: 28px 24px;
  border: 1px solid var(--sr-border);
  border-left: 5px solid var(--sr-primary);
  background: #f8fcfd;
}

.sr-kicker {
  display: inline-block;
  margin: 0 0 12px;
  color: var(--sr-primary);
  font-size: 13px;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  font-weight: 700;
}

.sr-article h1 {
  margin: 0 0 18px;
  font-size: 38px;
  line-height: 1.2;
  color: #111;
}

.sr-intro {
  margin: 0;
  font-size: 18px;
  color: #444;
}

.sr-article a {
  color: var(--sr-primary);
  font-weight: 700;
  text-decoration: underline;
}

.sr-article section {
  margin: 32px 0;
}

.sr-article h2 {
  margin: 0 0 14px;
  padding-bottom: 8px;
  font-size: 26px;
  line-height: 1.3;
  color: #111;
  border-bottom: 2px solid var(--sr-primary);
}

.sr-article p {
  margin: 0 0 16px;
}

.sr-highlight {
  padding: 22px;
  border: 1px solid var(--sr-border);
  border-left: 5px solid var(--sr-primary);
  background: var(--sr-primary-light);
}

.sr-table-wrap {
  overflow-x: auto;
  margin: 22px 0 30px;
  border: 1px solid var(--sr-border);
}

.sr-article table {
  width: 100%;
  border-collapse: collapse;
  min-width: 760px;
  font-size: 15px;
  background: #fff;
}

.sr-article th,
.sr-article td {
  padding: 13px 14px;
  border: 1px solid var(--sr-border);
  vertical-align: top;
  text-align: left;
}

.sr-article th {
  background: var(--sr-primary);
  color: #fff;
  font-weight: 700;
}

.sr-article tr:nth-child(even) td {
  background: #f7f7f7;
}

.sr-image {
  margin: 30px 0;
  padding: 10px;
  border: 1px solid var(--sr-border);
  background: #fff;
}

.sr-hero-image {
  margin-top: 24px;
  margin-bottom: 0;
}

.sr-image img {
  display: block;
  width: 100%;
  height: auto;
}

.sr-image figcaption {
  margin-top: 8px;
  font-size: 14px;
  color: var(--sr-muted);
  text-align: center;
}

@media (max-width: 768px) {
  .sr-article {
    padding: 24px 16px;
    font-size: 15px;
  }

  .sr-hero {
    padding: 22px 16px;
  }

  .sr-article h1 {
    font-size: 30px;
  }

  .sr-article h2 {
    font-size: 22px;
  }

  .sr-intro {
    font-size: 16px;
  }

  .sr-highlight {
    padding: 18px;
  }
}/* End custom CSS */