/* 
    Inline-article 
*/
a.article-inline {
  text-decoration: none !important;
}

.article-inline-ad-container {
  padding: 2.5%;
  display: flex;
  flex-direction: column;
  background-color: var(--color-separator);
  border-radius: 5px;
  transition: background-color 0.3s ease, transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1), box-shadow 0.2s ease;
}
.article-inline-ad-container:hover {
  background-color: var(--color-separator-hover);
  transform: translateY(-3px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.08);
}
.article-inline-ad-container:active {
  transform: translateY(0); 
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
}

.article-inline-ad-container h3 {
  text-align: justify;
  font-size: var(--article-text-size) !important;
  margin: auto !important;
  margin-top: 2% !important;
  font-weight: bold;
  text-decoration: none;
}

.article-inline-ad-container img {
  border-radius: 5px;
  width: 100%;
  height: auto;
}

/* Small devices (landscape phones, 576px and up) */
@media (min-width: 576px) {
  .article-inline-ad-container {
    display: grid;
    grid-template-columns: 35% 5% 60%;
  }

  .article-inline-ad-container img {
    grid-column: 1 / 2;
  }

  .article-inline-ad-container h3 {
    grid-column: 3 / 4;
    text-align: left;
    margin: auto 5% !important;
  }
}

.article-inline-title {
  text-align: left;
  font-size: var(--article-text-size) !important;
  margin-top: 2% !important;
  font-weight: bold;
  text-decoration: none;
  grid-column: 3/4;
}
@media (min-width: 576px) {
.article-inline-title {
	grid-column: 3 / 4;
    text-align: left;
    margin: auto 5% !important;
  }
}