:root {
    --circle: 50%;
    --border-radius: .375rem;
    --card-shadow: 0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3);
    
      --footer-responsive-grid--column-count: 3;
  --footer-responsive-grid--cell-min-width: 200px;
  --footer-responsive-grid--layout-gap: 2rem;
}

body {
    background-image: none;
}

.page-wrapper,
.main-content__container {
    max-width: 100%;
}


.circle {
    border-radius: var(--circle);
}

.node--type-article .wide-image {
    border-radius: var(--border-radius);
    margin-inline-start: auto;
    width: 100%;
}
.wide-image img {
    border-radius: var(--border-radius);
}
@media (min-width:767px) {
    .wide-image img {
        transform: scale(1.05);
    }
}

/* ================= Hide Page Title ====================== */
body.path-node #block-pagetitle {
    display: none;
}

/* ================= Custom Grid =================== */
.grid-container {
  grid--gap-count: calc(var(--footer-responsive-grid--column-count) - 1);
  grid--total-gap-width: calc(var(--footer-responsive-grid--gap-count) * var(--footer-responsive-grid--layout-gap));
  grid-item--max-width: calc((100% - var(--footer-responsive-grid--total-gap-width)) / var(--footer-responsive-grid--column-count));
  grid-item--calculated-min-width: min(100%, var(--footer-responsive-grid--cell-min-width));
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(max(var(--footer-responsive-grid-item--calculated-min-width), var(--footer-responsive-grid-item--max-width)), 1fr));
  gap: var(--footer-responsive-grid--layout-gap);    
    
    
  display: grid;

  /* Media query for large devices */
  @media screen and (min-width: 768px) {
    grid-template-columns: repeat(var(--footer-responsive-grid--column-count), 1fr); /* 3 columns on large devices */
  }
}

.grid-item {
}

/* ================= Header =================== */
.site-branding__inner {
    gap: 8px;
}
.site-branding__logo img {
    min-height: 4rem;
}
.site-branding__slogan {
  color: var(--color--gray-90);
  max-width: 250px;
}

/* ================= Views Categories =================== */
.view-categories-page .views-view-responsive-grid__item-inner {
    background: var(--color--gray-100);
    padding: 14px 16px;
    border-radius: var(--border-radius);
}
.view-categories-page .views-view-responsive-grid__item-inner a {
    text-decoration: none;
}
/* ================= Views Illustration Topics =================== */
.view-illustration-topics .view-header {
    margin-block-end: var(--sp1);
}
.view-illustration-topics .views-view-responsive-grid__item-inner {
    background: var(--color--gray-100);
    padding: 14px 16px;
    border-radius: var(--border-radius);
    margin-block-end: 10px;
    display: flex;
    justify-content: space-between;
}
.view-illustration-topics .views-view-responsive-grid__item-inner a {
    text-decoration: none;
}
/* ================= Views Contributors =================== */

.view-contributors h4 {
    margin-block-end: 0;
}
.view-contributors p {
    margin-block-start: 0;
}

.user__top-wrapper {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin: 0;
}
.user__top-wrapper .field--name-user-picture {
    flex-shrink: 0;
    margin: 0;
    margin-block-end: var(--sp1);
    margin-inline-end: var(--sp1);
}

.user__top-wrapper .field--name-user-picture img {
    width: calc(9 * var(--sp));
    height: calc(9 * var(--sp));
    object-fit: cover;
    border-radius: 50%;
}
.user__top-wrapper .user__meta {
    flex-basis: calc(100% - calc(10 * var(--sp)));
    margin: 0;
    margin-block-end: var(--sp1);
    color: var(--color-text-neutral-loud);
    font-size: 1.5rem;
    line-height: var(--line-height-base);
}
.user__top-wrapper h2 {
    margin-block-end: 0;
}
.user__top-wrapper h4 {
    color: var(--color-text-primary-medium);
    margin-block-start: 0;
}

/* ================= Footer =================== */
.site-footer .logo {
    max-height: 4rem;
}
.site-footer .region--footer-left h4 {
    margin-block-end: 0;
}
.site-footer .region--footer-left p {
    margin-block-start: 0;
}

.site-footer .social-icons {
    display: flex;
    gap: 1rem;
}

/* ================= Article Side Info =================== */
.view-article-side-info img {
    border-radius: var(--circle);
    margin-block-end: 1rem;
    aspect-ratio: 1/1;
    object-fit: cover;
}
.view-article-side-info h3 {
    margin-block: 0;
    
}
.view-article-side-info p {
    color: var(--color-text-neutral-medium);
    margin-block-start: 0;
}

/* ================ Featured Display Mode ================= */
.featured-display-link {
    text-decoration: none;
}
.featured-display {
    display: flex;
    flex-flow: column;
    align-items: center;
    cursor: pointer;
    min-height: 400px;
    justify-content: center;
    padding-inline: var(--sp4);
    background-size: cover;
    background-repeat: no-repeat;
}
.featured-display h1 span {
    text-decoration: none;
}
.featured-display * {
    color: white;
}
.featured-meta {
    margin-block-start: var(--sp);
}

/* ================ View More Link =====================*/
.more-link a {
    display: inline-block;
    height: var(--sp3);
    margin-block: var(--sp1);
    margin-inline-start: 0;
    margin-inline-end: var(--sp1);
    padding-block: calc((var(--sp3) - var(--line-height-s)) / 2);
    padding-inline: var(--sp1-5);
    cursor: pointer;
    text-align: center;
    text-decoration: none;
    color: var(--color-text-primary-medium);
    border: solid 2px currentColor;
    border-radius: var(--border-radius);
    background-color: var(--color--white);
    font-family: var(--font-sans);
    font-size: var(--font-size-l);
    font-weight: 700;
    -webkit-appearance: none;
    appearance: none;
    -webkit-font-smoothing: antialiased;
}
@supports (display: inline-flex) {
.more-link a {
    @include button-style;
    display: inline-flex;
    align-items: center;
    padding-block: 1px 0;
    padding-inline: var(--sp1-5);
    line-height: var(--line-height-s);
}
}

/* ================ Blockquote =====================*/
.text-content blockquote,
.cke_editable blockquote {
  position: relative;
  margin-block: var(--sp2);
  margin-inline-start: 0;
  margin-inline-end: 0;
  padding-inline-start: var(--sp2);
  letter-spacing: -0.01em;
  font-family: var(--font-serif);
  font-size: inherit;
  line-height: var(--sp2);
}

.text-content blockquote:before,
.cke_editable blockquote:before {
  position: absolute;
  inset-block-start: 0;
  inset-inline-start: 0;
  content: "";
  color: var(--color--primary-60);
  font-size: inherit;
}

.text-content blockquote:after,
.cke_editable blockquote:after {
  position: absolute;
  inset-block-end: 0;
  inset-inline-start: 0;
  width: var(--sp0-5);
  height: calc(100% - 0rem);
  margin-inline-start: 0.25rem;
  content: "";
  background: var(--color--gray-70);
}

.sidebar-grid .layout--content-narrow .text-content blockquote {
    padding-inline-start: 2rem;
}

@media (min-width: 43.75rem) {

  .text-content blockquote,
  .cke_editable blockquote {
  font-size: inherit;
  }
  .sidebar-grid .layout--content-narrow .text-content blockquote {
    padding-inline-start: 3rem;
}
}

@media (min-width: 62.5rem) {

  .text-content blockquote,
  .cke_editable blockquote {
  font-size: inherit;
  }
}

@media (min-width: 43.75rem) {

  .layout--content-narrow.text-content blockquote:before,
  .layout--pass--content-narrow > *.text-content blockquote:before,
  .layout--content-narrow .text-content blockquote:before,
  .layout--pass--content-narrow > * .text-content blockquote:before {
    /*inset-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));*/
    inset-inline-start: 0;
  }
}

@media (min-width: 43.75rem) {

  .layout--content-narrow.text-content blockquote:after,
  .layout--pass--content-narrow > *.text-content blockquote:after,
  .layout--content-narrow .text-content blockquote:after,
  .layout--pass--content-narrow > * .text-content blockquote:after {
    /*inset-inline-start: calc(-1 * (var(--grid-col-width) + var(--grid-gap)));*/
    inset-inline-start: 0;
    width: .75rem;
    height: calc(100% - 0rem);
    margin-inline-start: 2px;
  }
}

@media (min-width: 43.75rem) {

  .layout--content-narrow.text-content blockquote,
  .layout--pass--content-narrow > *.text-content blockquote,
  .layout--content-narrow .text-content blockquote,
  .layout--pass--content-narrow > * .text-content blockquote {
    width: calc(10 * var(--grid-col-width) + 9 * var(--grid-gap));
    margin-block: var(--sp3);
    padding-inline-start: 0;
  }
}