/* Academy / Artigos — scoped editorial hub, preserves the portal shell. */
#edu-artigos.academy-articles { --articles-ink: #0b1730; --articles-muted: #58657a; --articles-line: #d9e1eb; --articles-paper: #fff; --articles-blue: #0757d3; color: var(--articles-ink); scroll-margin-top: 104px; }
[data-theme="dark"] #edu-artigos { --articles-ink: #f4f7fc; --articles-muted: #a5b1c4; --articles-line: #25334c; --articles-paper: #091126; --articles-blue: #75bcff; }
#edu-artigos *, #edu-artigos *::before, #edu-artigos *::after { box-sizing: border-box; }
#edu-artigos button, #edu-artigos input, #edu-artigos select { font: inherit; }
#edu-artigos button, #edu-artigos a, #edu-artigos select { -webkit-tap-highlight-color: transparent; }
#edu-artigos a { text-decoration: none; }
#edu-artigos :is(a,button,input,select):focus-visible { outline: 3px solid #078bff; outline-offset: 4px; }
#edu-artigos ::selection { background: #c8e5ff; color: #0b1730; }
#edu-artigos [hidden] { display: none !important; }
#edu-artigos .articles-sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
#edu-artigos .articles-hero { position: relative; display: grid; grid-template-columns: minmax(0,65fr) minmax(0,35fr); align-items: center; min-height: 400px; padding: 48px; gap: 40px; overflow: hidden; border-radius: 14px; background: #020714; color: #fff; }
#edu-artigos .articles-hero-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; opacity: .5; }
#edu-artigos .articles-hero::after { position: absolute; inset: 0; content: ''; background: linear-gradient(90deg,rgba(2,7,20,.95),rgba(2,7,20,.64) 62%,rgba(2,7,20,.84)); }
#edu-artigos .articles-hero-copy, #edu-artigos .articles-hero-statement { position: relative; z-index: 1; min-width: 0; }
#edu-artigos .articles-signature { display: block; margin-bottom: 16px; color: #a7cfff; font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
#edu-artigos .articles-hero h1 { margin: 0 0 20px; font: 800 clamp(2.6rem,3.6vw,3.6rem)/1.08 Archivo,sans-serif; letter-spacing: -.035em; color: #fff; }
#edu-artigos .articles-hero h1 span { color: #50adff; }
#edu-artigos .articles-hero-copy > p { max-width: 64ch; margin: 0 0 28px; color: #cad7eb; font-size: .95rem; line-height: 1.7; }
#edu-artigos .articles-explore { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: #fff; border-bottom: 1px solid #66b8ff; font-size: .88rem; font-weight: 700; }
#edu-artigos .articles-explore span { font-size: 20px; transition: transform .2s ease; }
#edu-artigos .articles-explore:hover span { transform: translateY(3px); }
#edu-artigos .articles-hero-statement { padding-left: 24px; }
#edu-artigos .articles-hero-statement::before { content: ''; display: block; width: 44px; height: 2px; background: #078bff; margin-bottom: 24px; }
#edu-artigos .articles-hero-statement p { margin: 0 0 32px; color: #fff; font: 700 clamp(1rem,1.6vw,1.4rem)/1.7 Archivo,sans-serif; letter-spacing: .09em; text-transform: uppercase; }
#edu-artigos .articles-hero-statement img { display: block; width: 150px; height: auto; max-height: 42px; object-fit: contain; object-position: left; filter: brightness(0) invert(1); }
#edu-artigos .articles-controls { margin: 28px 0 48px; scroll-margin-top: 100px; }
#edu-artigos .articles-categories { display: flex; gap: 8px; max-width: 100%; overflow-x: auto; padding: 4px 4px 12px; scrollbar-width: thin; scrollbar-color: #9bbfe6 transparent; }
#edu-artigos .articles-categories button { flex: 0 0 auto; min-height: 44px; padding: 0 18px; border: 1px solid var(--articles-line); border-radius: 999px; color: var(--articles-muted); background: var(--articles-paper); font-size: .8rem; font-weight: 700; cursor: pointer; }
#edu-artigos .articles-categories button:hover { color: var(--articles-blue); border-color: #85baf2; }
#edu-artigos .articles-categories button[aria-pressed="true"] { color: #fff; background: #0757d3; border-color: #0757d3; }
#edu-artigos .articles-tools { display: flex; align-items: center; gap: 24px; margin-top: 12px; }
#edu-artigos .articles-search { display: flex; flex: 1; min-width: 0; align-items: center; gap: 12px; min-height: 48px; padding: 0 16px; border: 1px solid var(--articles-line); border-radius: 10px; background: var(--articles-paper); }
#edu-artigos .articles-search > span:first-child { font-size: 22px; color: var(--articles-muted); }
#edu-artigos .articles-search input { width: 100%; min-width: 0; min-height: 46px; border: 0; background: transparent; color: var(--articles-ink); font-size: .88rem; caret-color: var(--articles-blue); }
#edu-artigos .articles-search input::placeholder { color: var(--articles-muted); opacity: 1; }
#edu-artigos .articles-sort { display: flex; align-items: center; gap: 12px; color: var(--articles-muted); font-size: .75rem; }
#edu-artigos .articles-sort select { min-height: 48px; padding: 0 36px 0 14px; max-width: 100%; border: 1px solid var(--articles-line); border-radius: 10px; background: var(--articles-paper); color: var(--articles-ink); font-size: .8rem; cursor: pointer; }
#edu-artigos .articles-results { min-height: 20px; margin-top: 12px; color: var(--articles-muted); font-size: .75rem; }
#edu-artigos .articles-section { margin-bottom: 64px; min-width: 0; }
#edu-artigos .articles-heading { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 24px; }
#edu-artigos .articles-heading h2 { margin: 0 0 8px; color: var(--articles-ink); font: 700 clamp(1.45rem,2vw,1.9rem)/1.15 Archivo,sans-serif; letter-spacing: -.03em; }
#edu-artigos .articles-heading p { margin: 0; color: var(--articles-muted); font-size: .85rem; line-height: 1.6; }
#edu-artigos .articles-featured-layout { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,3fr); gap: 24px; }
#edu-artigos .articles-featured-side { display: grid; gap: 16px; }
#edu-artigos .articles-card { display: block; min-width: 0; overflow: hidden; border: 1px solid var(--articles-line); border-radius: 12px; background: var(--articles-paper); color: var(--articles-ink); transition: transform .2s ease,border-color .2s ease; }
#edu-artigos .articles-card:hover { border-color: #85baf2; transform: translateY(-2px); }
#edu-artigos .articles-media { display: block; position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: #0b1730; }
#edu-artigos .articles-media img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
#edu-artigos .articles-card:hover .articles-media img { transform: scale(1.02); }
#edu-artigos .articles-card-body { min-width: 0; padding: 20px; }
#edu-artigos .articles-category { display: inline-block; align-self: flex-start; margin-bottom: 10px; padding: 4px 8px; border-radius: 4px; background: #e9f2ff; color: #0757d3; font-size: .7rem; font-weight: 700; line-height: 1.3; }
[data-theme="dark"] #edu-artigos .articles-category { background: #122a48; color: #a8d5ff; }
#edu-artigos .articles-card h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; min-height: 3.9em; margin: 0 0 12px; color: inherit; font: 700 1rem/1.3 Archivo,sans-serif; letter-spacing: -.02em; }
#edu-artigos .articles-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; min-height: 3.2em; margin: 0 0 20px; color: var(--articles-muted); font-size: .78rem; line-height: 1.6; }
#edu-artigos .articles-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; color: var(--articles-muted); font-size: .75rem; line-height: 1.5; }
#edu-artigos .articles-author { display: flex; width: 100%; align-items: center; gap: 6px; }
#edu-artigos .articles-author .material-symbols-outlined { font-size: 16px; }
#edu-artigos .articles-author img { width: 20px; height: 20px; border-radius: 50%; object-fit: cover; }
#edu-artigos .articles-read-cue { display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; color: var(--articles-blue); font-size: .75rem; font-weight: 700; }
#edu-artigos .articles-read-cue span { font-size: 16px; }
#edu-artigos .articles-featured-card { position: relative; min-height: 480px; height: 100%; color: #fff; border-color: #182d49; background: #020714; }
#edu-artigos .articles-featured-card .articles-media { position: absolute; inset: 0; width: 100%; height: 100%; aspect-ratio: auto; }
#edu-artigos .articles-featured-card .articles-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(2,7,20,.98),rgba(2,7,20,.88) 48%,rgba(2,7,20,.12)); }
#edu-artigos .articles-featured-card .articles-card-body { position: relative; display: flex; flex-direction: column; justify-content: end; min-height: 480px; height: 100%; padding: 36px; }
#edu-artigos .articles-featured-card h3 { min-height: 0; max-width: 26ch; font-size: clamp(1.65rem,2.4vw,2.4rem); line-height: 1.15; }
#edu-artigos .articles-featured-card .articles-summary { max-width: 65ch; min-height: 0; color: #cbd8ec; font-size: .9rem; }
#edu-artigos .articles-featured-card .articles-meta { color: #cbd8ec; font-size: .75rem; }
#edu-artigos .articles-featured-card .articles-author { width: auto; }
#edu-artigos .articles-featured-card .articles-read-cue { color: #85c9ff; }
#edu-artigos .articles-compact-card { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); min-height: 144px; }
#edu-artigos .articles-compact-card .articles-media { aspect-ratio: auto; height: 100%; }
#edu-artigos .articles-compact-card .articles-card-body { padding: 16px; }
#edu-artigos .articles-compact-card h3 { min-height: 0; margin-bottom: 12px; font-size: .9rem; }
#edu-artigos .articles-compact-card .articles-category { margin-bottom: 8px; padding: 0; background: transparent; }
#edu-artigos .articles-compact-card .articles-meta { font-size: .75rem; }
#edu-artigos .articles-arrows { display: flex; flex-shrink: 0; gap: 8px; }
#edu-artigos .articles-arrows button { display: grid; place-items: center; min-width: 44px; min-height: 44px; border: 1px solid var(--articles-line); border-radius: 8px; background: var(--articles-paper); color: var(--articles-ink); cursor: pointer; }
#edu-artigos .articles-arrows button:disabled { color: var(--articles-muted); opacity: .4; cursor: default; }
#edu-artigos .articles-arrows button:not(:disabled):hover { border-color: #85baf2; color: var(--articles-blue); }
#edu-artigos .articles-recent-track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 80px)/5); gap: 20px; max-width: 100%; overflow-x: auto; padding: 2px 2px 14px; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; scrollbar-width: thin; scrollbar-color: #9bbfe6 transparent; }
#edu-artigos .articles-recent-track .articles-card { scroll-snap-align: start; }
#edu-artigos .articles-recent-track .articles-card-body { padding: 16px; }
#edu-artigos .articles-recent-track h3 { font-size: .9rem; }
#edu-artigos .articles-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; }
#edu-artigos .articles-empty { padding: 48px 20px; text-align: center; border: 1px dashed var(--articles-line); border-radius: 12px; }
#edu-artigos .articles-empty > span { color: var(--articles-muted); font-size: 32px; }
#edu-artigos .articles-empty h3 { margin: 16px 0 8px; font: 700 1.2rem/1.3 Archivo,sans-serif; }
#edu-artigos .articles-empty p { color: var(--articles-muted); font-size: .85rem; }
#edu-artigos .articles-empty button, #edu-artigos .articles-load { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 0 24px; border: 1px solid var(--articles-line); border-radius: 8px; background: var(--articles-paper); color: var(--articles-blue); cursor: pointer; font-weight: 700; font-size: .85rem; }
#edu-artigos .articles-empty button { margin-top: 24px; }
#edu-artigos .articles-load-wrap { margin: 32px 0 0; text-align: center; }
#edu-artigos .articles-reveal { animation: articles-enter .4s cubic-bezier(.16,1,.3,1) both; animation-delay: var(--articles-delay,0ms); }
@keyframes articles-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (min-width: 900px) and (max-width: 1299px) {
  #edu-artigos .articles-featured-layout { grid-template-columns: minmax(0,65fr) minmax(0,35fr); gap: 20px; }
  #edu-artigos .articles-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  #edu-artigos .articles-recent-track { grid-auto-columns: calc((100% - 60px)/4); }
}
@media (max-width: 899px) {
  #edu-artigos .articles-hero { padding: 36px; gap: 24px; grid-template-columns: minmax(0,2fr) minmax(0,1fr); }
  #edu-artigos .articles-hero-statement { padding-left: 0; }
  #edu-artigos .articles-hero-statement p { font-size: .85rem; }
  #edu-artigos .articles-featured-layout { grid-template-columns: minmax(0,1fr); }
  #edu-artigos .articles-featured-side { grid-template-columns: repeat(3,minmax(0,1fr)); }
  #edu-artigos .articles-compact-card { display: block; }
  #edu-artigos .articles-compact-card .articles-media { height: auto; aspect-ratio: 16/9; }
  #edu-artigos .articles-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; }
  #edu-artigos .articles-recent-track { grid-auto-columns: 40%; }
  #edu-artigos .articles-sort > span { display: none; }
}
@media (max-width: 599px) {
  #edu-artigos.academy-articles { scroll-margin-top: 88px; }
  #edu-artigos .articles-hero { min-height: 400px; grid-template-columns: minmax(0,1fr); padding: 32px 24px; gap: 32px; }
  #edu-artigos .articles-hero h1 { font-size: 2.5rem; }
  #edu-artigos .articles-hero-copy > p { font-size: .86rem; }
  #edu-artigos .articles-hero-statement p { margin: 0; font-size: .75rem; line-height: 1.6; }
  #edu-artigos .articles-hero-statement p br { display: none; }
  #edu-artigos .articles-hero-statement::before { margin-bottom: 12px; width: 32px; }
  #edu-artigos .articles-hero-statement img { display: none; }
  #edu-artigos .articles-controls { margin-bottom: 40px; }
  #edu-artigos .articles-tools { flex-direction: column; align-items: stretch; gap: 12px; }
  #edu-artigos .articles-sort, #edu-artigos .articles-sort select { width: 100%; }
  #edu-artigos .articles-section { margin-bottom: 48px; }
  #edu-artigos .articles-heading { gap: 12px; }
  #edu-artigos .articles-heading p { font-size: .78rem; }
  #edu-artigos .articles-arrows { gap: 6px; }
  #edu-artigos .articles-grid { grid-template-columns: minmax(0,1fr); }
  #edu-artigos .articles-featured-card, #edu-artigos .articles-featured-card .articles-card-body { min-height: 400px; }
  #edu-artigos .articles-featured-card .articles-card-body { padding: 24px; }
  #edu-artigos .articles-featured-card h3 { font-size: 1.7rem; }
  #edu-artigos .articles-featured-side { grid-template-columns: minmax(0,1fr); }
  #edu-artigos .articles-compact-card { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,2fr); }
  #edu-artigos .articles-compact-card .articles-media { height: 100%; aspect-ratio: auto; }
  #edu-artigos .articles-recent-track { grid-auto-columns: 82%; }
  #edu-artigos .articles-results { font-size: .7rem; }
}
@media (prefers-reduced-motion: reduce) {
  #edu-artigos *, #edu-artigos *::before, #edu-artigos *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
