.resource-band { border-top: 1px solid rgba(168,183,200,.2); padding: 88px 24px; background: #01050b; color: #f7fbff; scroll-margin-top: 82px; }
.resource-inner { max-width: 1180px; margin-inline: auto; }
.resource-eyebrow { color: #5fe0ba; font-size: 14px; font-weight: 700; letter-spacing: 0; }
.resource-band h2 { max-width: 760px; font-size: 40px; line-height: 1.16; margin: 16px 0 24px; letter-spacing: 0; }
.resource-lead { max-width: 770px; color: #bdc8d4; font-size: 18px; line-height: 1.65; }
.resource-links { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 32px; margin-top: 44px; }
.resource-links > a { padding: 28px 0; border-top: 1px solid rgba(168,183,200,.3); text-decoration: none; }
.resource-links > a > span:first-child { color: #5fe0ba; font-size: 13px; }
.resource-links h3 { font-size: 24px; line-height: 1.3; margin: 20px 0 14px; }
.resource-links p { color: #bdc8d4; font-size: 16px; line-height: 1.6; }
.resource-link-label, .resource-all { color: #5fe0ba; font-size: 15px; line-height: 1.6; }
.resource-all { display: inline-block; margin-top: 28px; text-underline-offset: 5px; }
.resource-links a:hover h3 { text-decoration: underline; text-underline-offset: 5px; }
.resource-band a:focus-visible { outline: 2px solid #5fe0ba; outline-offset: 6px; }
.resource-faq details { border-bottom: 1px solid rgba(168,183,200,.25); padding: 22px 0; max-width: 850px; }
.resource-faq summary { font-size: 19px; line-height: 1.5; cursor: pointer; font-weight: 650; }
.resource-faq details p { color: #bdc8d4; font-size: 16px; line-height: 1.7; max-width: 75ch; margin: 18px 0 0; }
.resource-faq a { color: #5fe0ba; text-underline-offset: 3px; }
.resource-page h1 { font-size: 54px; line-height: 1.08; overflow-wrap: anywhere; }
.resource-page .article-hero { align-items: center; grid-template-columns: minmax(0,1fr) 260px; padding-block: 64px; min-height: auto; }
.resource-visual { margin: 0; width: 100%; }
.resource-visual img { width: 100%; height: auto; aspect-ratio: 1 / 2; object-fit: contain; }
.resource-visual figcaption { color: #a8b7c8; font-size: 12px; text-align: center; }
.resource-page .hero-lead { font-size: 21px; }
.resource-page .article-body h2 { font-size: 30px; scroll-margin-top: 100px; }
.resource-page .eyebrow { letter-spacing: 0; }
.resource-byline { color: #a8b7c8; font-size: 13px; margin-top: 24px; }
.resource-page .hero-actions { margin-top: 26px; }
.resource-toc { border-bottom: 1px solid var(--line); padding-bottom: 28px; margin-bottom: 32px; }
.resource-toc a { display: block; margin-top: 12px; font-size: 15px; line-height: 1.5; color: #bdc8d4; text-underline-offset: 4px; }
.resource-page .related-guides { margin-top: 32px; }
.resource-page .related-guides a { display: block; padding: 16px 0; border-bottom: 1px solid var(--line); color: #5fe0ba; }
.resource-example { border-left: 3px solid #5fe0ba; padding: 8px 0 8px 24px; margin: 30px 0; }
.resource-example p:last-child { margin-bottom: 0; }
.resource-page table { width: 100%; border-collapse: collapse; margin-block: 24px; font-size: 15px; }
.resource-table { max-width: 100%; overflow-x: auto; }
.resource-page .article-body { min-width: 0; }
.resource-page caption { text-align: left; color: #a8b7c8; margin-bottom: 12px; }
.resource-page th, .resource-page td { padding: 12px 8px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.resource-page th { color: #5fe0ba; }
.resource-page td { color: #bdc8d4; }
.resource-page :focus-visible { outline: 2px solid #5fe0ba; outline-offset: 5px; }
.resource-page .resource-index { margin-bottom: 80px; }
.resource-page .resource-index .resource-links { grid-template-columns: repeat(2,minmax(0,1fr)); }
.resource-page .site-header nav a[href$="recursos/"] { display: inline-flex; }
@media(max-width:820px) {
  .resource-band { padding: 56px 24px; }
  .resource-band h2 { font-size: 30px; }
  .resource-links, .resource-page .resource-index .resource-links { grid-template-columns: 1fr; gap: 12px; }
  .resource-page .article-hero { grid-template-columns: 1fr; gap: 28px; padding-block: 44px; }
  .resource-page h1 { font-size: 40px; }
  .resource-page .hero-lead { font-size: 18px; }
  .resource-visual { width: 210px; margin-inline: auto; }
  .resource-page .article-body h2 { font-size: 27px; }
}
@media(max-width:360px) { .resource-page h1 { font-size: 34px; } .resource-page .site-header nav a { padding-inline: 8px; } }