/* Undernet Articles hub
 * Component layout and editorial presentation.
 * Shared canvas, surfaces, text, borders and brand color come from the global --udc-* system.
 * P43: headings and lead follow body.udc-type-scale (site-global-system.css); this file keeps layout,
 * controls and metadata.
 */
.articles-hub{background:var(--udc-canvas);color:var(--udc-text)}
.articles-hub>section>.container{max-width:1180px}
.articles-hero{
  --udc-section-bg:
    linear-gradient(90deg,rgba(27,27,27,.98) 0%,rgba(27,27,27,.92) 38%,rgba(27,27,27,.58) 62%,rgba(27,27,27,.18) 100%),
    url('/assets/img/articles-hero.webp') center/cover no-repeat;
  min-height:360px;
  display:flex;
  align-items:center;
  text-align:left;
}
main#contenido > section.page-hero.articles-hero {
  min-height:300px;
  padding-top:36px;
  padding-bottom:36px;
}
.articles-hero-content{max-width:680px}
.articles-hero .eyebrow{color:var(--udc-orange)}
.articles-hero h1{margin:.4rem 0 .7rem}
.articles-hero .page-lead{max-width:670px;margin:0}

.articles-featured-section{padding:1.65rem 0 1rem}
.articles-featured-section>.container>.eyebrow,.articles-filter-section:before{display:block}
.articles-featured-section>.container>.eyebrow{margin:0 0 .8rem;padding-left:2.7rem;position:relative;color:var(--udc-text)}
.articles-featured-section>.container>.eyebrow:before{content:'';position:absolute;left:0;top:50%;width:2rem;height:3px;background:var(--udc-orange)}
.featured-article{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(330px,.92fr);overflow:hidden;border:1px solid var(--udc-line);border-radius:var(--udc-radius-md);background:var(--udc-card);box-shadow:none}
.featured-article-media{display:block;overflow:hidden;background:var(--udc-card)}
.featured-article-media img{display:block;width:100%;height:100%;object-fit:cover;object-position:right bottom}
.featured-article-media{position:relative;min-height:330px}
.featured-article-media img{position:absolute;inset:0}
.featured-article-body{display:flex;flex-direction:column;justify-content:center;padding:2rem 2.25rem}
.featured-article-body h2,.articles-list-section h2,.articles-cta h2,.articles-empty h2{color:var(--udc-text)}
.featured-article-body h2{margin:.35rem 0 .7rem}
.featured-article-body .article-kicker{margin:0;color:var(--udc-orange);font-size:.76rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.featured-article-body .article-summary{margin:0;color:var(--udc-muted);line-height:1.5}
/* Keep full editorial text in the DOM; clamp only catalog presentation. */
.featured-article-body h2,.featured-article-body .article-summary{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}
.featured-article-body .article-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.45rem .85rem;margin:.8rem 0;color:var(--udc-muted);font-size:.82rem}
.featured-article-body .article-meta-item{display:inline-flex;align-items:center;gap:.38rem;white-space:nowrap}
.featured-article-body .article-meta-number{font-weight:700;color:var(--udc-text)}
.featured-article-body .article-meta-number:before{display:none}
.featured-article-body .article-meta-item:before{content:'';flex:0 0 auto;width:.92rem;height:.92rem;background:currentColor;mask:center/contain no-repeat;-webkit-mask:center/contain no-repeat}
.featured-article-body .article-meta-date:before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h2v2h6V2h2v2h1a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h1V2Zm11 8H6v9a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-9ZM7 6a1 1 0 0 0-1 1v1h12V7a1 1 0 0 0-1-1H7Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2h2v2h6V2h2v2h1a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H6a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h1V2Zm11 8H6v9a1 1 0 0 0 1 1h10a1 1 0 0 0 1-1v-9ZM7 6a1 1 0 0 0-1 1v1h12V7a1 1 0 0 0-1-1H7Z'/%3E%3C/svg%3E")}
.featured-article-body .article-meta-reading:before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20Zm0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm1 3v4.59l3.2 3.2-1.4 1.42L11 12.41V7h2Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 1 1 0 20 10 10 0 0 1 0-20Zm0 2a8 8 0 1 0 0 16 8 8 0 0 0 0-16Zm1 3v4.59l3.2 3.2-1.4 1.42L11 12.41V7h2Z'/%3E%3C/svg%3E")}
.article-link{align-self:flex-start;color:var(--udc-orange);font-weight:700;text-decoration:none}
.article-link:hover,.article-link:focus-visible{color:var(--udc-orange-hover);text-decoration:underline}

.articles-filter-section{padding:1.25rem 0;background:var(--udc-canvas)}
.articles-search-form{display:grid;grid-template-columns:minmax(220px,2fr) minmax(200px,1fr) auto;gap:1rem;align-items:end;padding:1.15rem;border:1px solid var(--udc-line);border-radius:var(--udc-radius-sm);background:var(--udc-card)}
.articles-search-field,.articles-area-field{display:grid;gap:.4rem;min-width:0}
.articles-search-form label{color:var(--udc-text);font-size:.82rem;font-weight:700}
.articles-search-form input,.articles-search-form select{width:100%;min-height:2.9rem;padding:.65rem .8rem;border:1px solid var(--udc-line);border-radius:var(--udc-radius-sm);background:var(--udc-canvas);color:var(--udc-text);font:inherit}
.articles-search-form input:focus-visible,.articles-search-form select:focus-visible{outline:3px solid var(--udc-orange);outline-offset:2px}
.articles-search-form .button{min-height:2.9rem}
.articles-clear-filter{grid-column:1/-1;color:var(--udc-orange);font-weight:700}
.articles-number-form{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:.6rem;margin-top:.75rem}
.articles-number-form label{color:var(--udc-muted);font-size:.85rem;font-weight:700}
.articles-number-form input{width:6.5rem;min-height:2.6rem;padding:.5rem .7rem;border:1px solid var(--udc-line);border-radius:var(--udc-radius-sm);background:var(--udc-canvas);color:var(--udc-text);font:inherit}
.articles-number-form input:focus-visible{outline:3px solid var(--udc-orange);outline-offset:2px}
.articles-number-form .button{min-height:2.6rem}
.articles-number-error{flex-basis:100%;margin:0;text-align:right;color:var(--udc-text);font-size:.85rem}

.articles-list-section{padding:1rem 0 2.75rem}
.articles-list-heading{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;margin-bottom:1rem}
.articles-list-section h2{margin:0;padding-left:2.7rem;position:relative}
.articles-list-section h2:before{content:'';position:absolute;left:0;top:50%;width:2rem;height:3px;background:var(--udc-orange)}
.articles-list-heading p{margin:0;color:var(--udc-muted);font-size:.9rem}
.articles-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}

.articles-filter-empty,.articles-empty{padding:2rem;border:1px solid var(--udc-line);border-radius:var(--udc-radius-sm);background:var(--udc-card);color:var(--udc-muted)}
.articles-filter-empty p{margin-top:0}
.articles-filter-empty a{color:var(--udc-orange);font-weight:700}
.articles-pagination{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem;margin-top:2rem}
.articles-page{display:grid;min-width:2.65rem;min-height:2.65rem;padding:.55rem .75rem;place-items:center;border:1px solid var(--udc-line);border-radius:var(--udc-radius-sm);background:var(--udc-card);color:var(--udc-text);font-weight:700;text-decoration:none}
.articles-page:hover,.articles-page:focus-visible{border-color:var(--udc-orange);color:var(--udc-orange)}
.articles-page:focus-visible{outline:3px solid var(--udc-orange);outline-offset:2px}
.articles-page.is-current{border-color:var(--udc-orange);background:var(--udc-orange);color:#fff}
.articles-page--direction{padding-inline:1rem}
.articles-page-ellipsis{padding:.5rem;color:var(--udc-muted)}

.articles-cta-section{padding:var(--udc-space-6) 0;border-top:1px solid var(--udc-line);background:var(--udc-canvas)}
.articles-cta-section>.container{max-width:1180px!important}
.articles-cta h2{max-width:720px;margin:.35rem 0 .6rem}
.articles-cta p:not(.eyebrow){max-width:720px;margin-bottom:0}

@media(max-width:900px){
  .articles-hero{
    --udc-section-bg:
      linear-gradient(90deg,rgba(27,27,27,.97) 0%,rgba(27,27,27,.88) 58%,rgba(27,27,27,.58) 100%),
      url('/assets/img/articles-hero.webp') 64% center/cover no-repeat;
  }
  .featured-article{grid-template-columns:1fr}
  .featured-article-media{min-height:0;aspect-ratio:16/9}
  .articles-search-form{grid-template-columns:1fr 1fr}
  .articles-search-field{grid-column:1/-1}
  .articles-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:620px){
  .articles-hero{min-height:0}
  .featured-article-body{padding:1.4rem}
  .articles-search-form{grid-template-columns:1fr}
  .articles-number-form{justify-content:flex-start}
  .articles-number-error{text-align:left}
  .articles-grid{grid-template-columns:1fr}
  .articles-list-heading{display:block}
  .articles-list-heading p{margin-top:.55rem}
  .articles-page--direction{flex-basis:calc(50% - .25rem)}
}