/* @import url('http://example.com/example_style.css'); */

/***********************************************/
/* CSS @imports must be at the top of the file */
/* Add them above this section                 */
/***********************************************/

/*****************************************/
/* Start your style declarations here    */
/*****************************************/

.blog-index__post-summary-link {
  color: rgb(29, 33, 58);
  text-decoration: none;
  transition: color 0.2s ease;
}

.blog-index__post-summary-link:hover {
  color: rgb(29, 33, 58); /* Keep same colour on hover if desired */
  text-decoration: none; /* Optional: add subtle hover effect */
}

.blog-index__tag-title {
  margin: 30px 0 10px;
  text-align: left;
}
.blog-index__tag-title h2 {
  font-size: 1.8rem;
  font-weight: 600;
  color: rgb(29, 33, 58);
}

.blog-post__body blockquote {
  border-left: 2px solid rgb(9, 152, 205);
  margin: 2.5em 0;
  padding: 1em 1.5em;
  background-color: #F5FAFC;
}
.blog-post__body blockquote p {
  font-weight: bold;
  color: #333;
  font-size: 1.125rem; /* slightly larger than base (typically 16px × 1.125 = 18px) */
  margin: 0;
}
.blog-post__body blockquote.pullquote {
  border-top: 1px solid rgb(9, 152, 205);
  border-bottom: 1px solid rgb(9, 152, 205);
    border-left: none;
  margin: 3em auto;
  padding: 1.3em 2em;
   background: #F5FAFC);
  position: relative;
}
.blog-post__body blockquote.pullquote p {
   font-weight: 600;
  font-style: italic;
  font-size: 1.5rem;
  color: #1D213A;
  text-align: center;

}
.blog-post__body blockquote.pullquote::before {
  content: "!";
  font-size: 6rem;
  position: absolute;
  top: 50%;
  left: 1.5rem;
  transform: translateY(-50%);
  color: rgba(9, 152, 205, 0.2); /* Light blue, semi-transparent */
}
.blog-post__body h2,
.blog-post__body h3 {
  margin-top: 1.5em;
}
}