/* Blog Trivium — artículo */

.trivium-blog-article-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  height: 692px;
  margin-top: calc(-1 * var(--trivium-header-height, 90px));
  padding: calc(var(--trivium-header-height, 90px) + var(--trivium-page-gutter)) var(--trivium-page-gutter) var(--spacing-padding-30, 160px) var(--trivium-page-gutter);
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-gap-15, 60px);
  align-self: stretch;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.trivium-blog-article-hero__media {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.trivium-blog-article-hero__image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.trivium-blog-article-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: var(--foundations-overlay-hard, rgba(26, 71, 33, 0.8));
  pointer-events: none;
}

.trivium-blog-article-hero__content {
  position: relative;
  z-index: 2;
  display: flex;
  max-width: 1024px;
  width: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-gap-15, 60px);
  align-self: center;
}

.trivium-blog-article-hero__heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--spacing-gap-8, 24px);
  align-self: stretch;
}

.trivium-blog-article-hero__title {
  margin: 0;
  color: var(--text-heading-default, #eeebe2);
  font-family: "Latienne Pro", latienne-pro, serif;
  font-size: var(--text-size-heading-xxlg, 48px);
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
  max-width: 720px;
  width: 100%;
}

.trivium-blog-article-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--spacing-gap-10, 30px);
}

.trivium-blog-article-hero__category {
  margin: 0;
  color: var(--text-label-action, #b7963e);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-sm, 14px);
  font-weight: 700;
  line-height: 150%;
}

.trivium-blog-article-hero__date {
  margin: 0;
  color: var(--text-label-secondary, #bbb3a9);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-sm, 14px);
  font-weight: 400;
  line-height: 150%;
}

.trivium-blog-article__body {
  display: flex;
  padding: var(--spacing-padding-13, 48px) var(--trivium-page-gutter);
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  width: 100%;
  box-sizing: border-box;
  background: var(--foundations-surface-default, #1a4721);
}

.trivium-blog-article__layout {
  max-width: 1024px;
}

.trivium-blog-article__main {
  flex: 1 1 0;
  min-width: 0;
}

.trivium-blog-article__rich-text {
  color: var(--text-body-secondary, #bbb3a9);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-md, 16px);
  font-weight: 400;
  line-height: 150%;
}

.trivium-blog-article__rich-text :where(p, span, h1, h2, h3, h4, h5, h6, li, em, strong, b, u, blockquote, mark, div) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

.trivium-blog-article__rich-text [class*="ql-bg-"] {
  background: transparent !important;
  background-color: transparent !important;
}

/* Sin gap del layout: el espaciado lo define layouts.css entre hijos directos */
.trivium-blog-article__rich-text.container-col-lg {
  gap: 0;
}

.trivium-blog-article__rich-text > p:first-child {
  color: var(--text-heading-default, #eeebe2);
  font-size: var(--text-size-heading-md, 20px);
  font-weight: 700;
  line-height: 150%;
}

.trivium-blog-article__rich-text > p:first-child,
.trivium-blog-article__rich-text > p:first-child span,
.trivium-blog-article__rich-text > p:first-child strong {
  color: var(--text-heading-default, #eeebe2) !important;
  font-weight: 700 !important;
}

.trivium-blog-article__rich-text h1,
.trivium-blog-article__rich-text h2,
.trivium-blog-article__rich-text h3,
.trivium-blog-article__rich-text h4 {
  color: var(--text-heading-default, #eeebe2) !important;
  background: transparent !important;
  font-family: "Latienne Pro", latienne-pro, serif !important;
  font-weight: 700;
  line-height: 120%;
}

.trivium-blog-article__rich-text h2 {
  font-size: 32px;
}

.trivium-blog-article__rich-text h3 {
  font-size: var(--text-size-heading-lg, 24px);
}

.trivium-blog-article__rich-text h4 {
  font-size: var(--text-size-heading-sm, 18px);
}

.trivium-blog-article__rich-text > :where(img, video, iframe) {
  border: 0;
  border-radius: var(--radius-100, 3px);
}

/* Bloque de imagen / galería en el artículo */
.trivium-blog-media__frame {
  position: relative;
  width: 100%;
  overflow: hidden;
  border-radius: var(--radius-100, 3px);
}

.trivium-blog-media__frame img {
  display: block;
  width: 100%;
  height: auto;
  margin: 0;
}

.trivium-blog-media__gallery-btn {
  position: absolute;
  right: 24px;
  bottom: 23.625px;
  display: flex;
  height: 44px;
  margin: 0;
  padding: 0 var(--spacing-padding-4, 12px);
  justify-content: center;
  align-items: center;
  gap: var(--spacing-gap-3, 9px);
  border: none;
  border-radius: var(--radius-100, 3px);
  background: var(--foundations-surface-deep, #050905);
  color: var(--text-label-default, #eeebe2);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-sm, 14px);
  font-style: normal;
  font-weight: 700;
  line-height: 150%;
  cursor: pointer;
}

.trivium-blog-media__gallery-btn:hover {
  background: var(--foundations-surface-deep, #050905);
  opacity: 0.9;
}

.trivium-blog-media__gallery-icon {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
}

.trivium-blog-media__caption {
  margin: var(--gap-400, 12px) 0 0;
  color: var(--text-label-secondary, #bbb3a9);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-sm, 14px);
  font-weight: 400;
  line-height: 150%;
  text-align: right;
}

.trivium-blog-article__rich-text > figure figcaption {
  color: var(--text-label-secondary, #bbb3a9);
  font-size: var(--text-size-body-sm, 14px);
}

.trivium-blog-article__rich-text p,
.trivium-blog-article__rich-text li,
.trivium-blog-article__rich-text em {
  color: var(--text-body-secondary, #bbb3a9) !important;
  background: transparent !important;
  font-family: Manrope, "Manrope", sans-serif;
  font-weight: 400;
}

.trivium-blog-article__rich-text span:not([class*="ql-font-"]) {
  color: var(--text-body-secondary, #bbb3a9) !important;
  background: transparent !important;
}

.trivium-blog-article__rich-text .ql-font-manrope {
  font-family: Manrope, "Manrope", sans-serif !important;
}

.trivium-blog-article__rich-text .ql-font-latienne-pro {
  font-family: "Latienne Pro", latienne-pro, serif !important;
}

.trivium-blog-article__rich-text u {
  text-decoration: underline;
  background: transparent !important;
}

.trivium-blog-article__rich-text strong,
.trivium-blog-article__rich-text b {
  color: var(--text-heading-default, #eeebe2);
  font-weight: 700;
}

.trivium-blog-article__rich-text ul,
.trivium-blog-article__rich-text ol {
  padding-left: 1.25rem;
}

.trivium-blog-article__rich-text li + li {
  margin-top: var(--gap-400, 12px);
}

.trivium-blog-article__rich-text blockquote {
  padding-left: var(--gap-400, 12px);
  border-left: 3px solid var(--text-label-action, #b7963e);
  color: var(--text-body-secondary, #bbb3a9);
  font-style: italic;
}

.trivium-blog-article__rich-text > :where(p, ul, ol, blockquote) + blockquote {
  margin-top: var(--gap-1000, 30px);
}

.trivium-blog-article__rich-text a {
  color: var(--text-label-action, #b7963e);
  text-decoration: underline;
}

.trivium-blog-article__rich-text a:hover {
  color: var(--text-heading-default, #eeebe2);
}

.trivium-blog-article__aside {
  flex: 0 0 200px;
  max-width: 200px;
  position: sticky;
  top: calc(var(--trivium-header-height, 90px) + var(--spacing-gap-8, 24px));
}

.trivium-blog-article__aside-block + .trivium-blog-article__aside-block {
  margin-top: var(--spacing-gap-15, 60px);
}

.trivium-blog-article__aside-label {
  margin: 0 0 var(--gap-400, 12px);
  color: var(--text-label-secondary, #bbb3a9);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-sm, 14px);
  font-style: normal;
  font-weight: 400;
  line-height: 120%;
}

.trivium-blog-article__author {
  margin: 0;
  color: var(--text-heading-default, #eeebe2);
  font-family: "Latienne Pro", latienne-pro, serif;
  font-size: var(--text-size-heading-md, 20px);
  font-style: normal;
  font-weight: 700;
  line-height: 120%;
}

.trivium-blog-article__author ~ .trivium-blog-article__author {
  font-size: var(--text-size-heading-sm, 18px);
}

.trivium-blog-article__author-role {
  margin: var(--gap-400, 12px) 0 0;
  color: var(--text-label-secondary, #bbb3a9);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-xsm, 12px);
  font-weight: 400;
  line-height: 120%;
}

.trivium-blog-article__author + .trivium-blog-article__author,
.trivium-blog-article__author-role + .trivium-blog-article__author {
  margin-top: var(--spacing-gap-4, 12px);
}

.trivium-blog-article__share {
  display: flex;
  align-items: center;
  gap: var(--spacing-gap-4, 12px);
}

.trivium-blog-article__share-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  padding: 0;
  border: none;
  border-radius: var(--radius-100, 3px);
  background: transparent;
  cursor: pointer;
  text-decoration: none;
}

.trivium-blog-article__share-link:focus-visible {
  outline: 2px solid var(--text-label-action, #b7963e);
  outline-offset: 2px;
}

.trivium-blog-article__share-toast {
  margin: var(--gap-400, 12px) 0 0;
  color: var(--text-label-action, #b7963e);
  font-family: Manrope, "Manrope", sans-serif;
  font-size: var(--text-size-body-xsm, 12px);
  font-weight: 600;
  line-height: 150%;
}

.trivium-blog-article__share-link img {
  transition: filter 0.2s ease;
}

.trivium-blog-article__share-link:hover img {
  filter: brightness(0.7);
}

@media (max-width: 900px) {
  .trivium-blog-article__aside {
    position: static;
    flex: 1 1 auto;
    max-width: none;
    width: 100%;
  }
}

@media (max-width: 440px) {
  .trivium-blog-article-hero {
    height: auto;
    min-height: 480px;
    padding: calc(var(--trivium-header-height, 90px) + var(--trivium-page-gutter)) var(--trivium-page-gutter) var(--spacing-padding-30, 120px);
  }

  .trivium-blog-article-hero__title {
    font-size: var(--text-size-heading-xxlg, 36px);
  }

  .trivium-blog-article__aside-label {
    font-size: var(--text-size-body-sm, 13px);
  }

  .trivium-blog-article__body {
    padding: var(--spacing-gap-15, 60px) var(--trivium-page-gutter) var(--spacing-padding-30, 120px);
  }

  .trivium-blog-article__author {
    font-size: var(--text-size-heading-sm, 16px);
  }

  .trivium-blog-article-hero__category {
    font-size: var(--text-size-body-sm, 13px);
  }
  
  .trivium-blog-article-hero__date {
    font-size: var(--text-size-body-sm, 13px);
  }
}
