/* styles-sqi-articulos.css
   Estilos específicos de artículos (biblioteca).
   Ubicación: raíz del sitio.
*/

/* ===== TYPE SCALE — edit only these sizes ===== */
.article, .article p, .article li { font-size: 21px !important; }   /* body desktop */
.article h1 { font-size: 54px !important; }                         /* headline desktop */
.article .dek { font-size: 22px !important; }                       /* subhead desktop */
.article h2 { font-size: 24px !important; }                         /* H2 desktop */
@media (max-width: 640px) {
  .article, .article p, .article li { font-size: 19px !important; } /* body mobile */
  .article h1 { font-size: 32px !important; }                       /* headline mobile */
  .article .dek { font-size: 18px !important; }                     /* subhead mobile */
  .article h2 { font-size: 20px !important; }                       /* H2 mobile */
}
/* ===== end type scale ===== */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body > table { max-width: 1000px; width: 100%; margin-left: auto; margin-right: auto; }
.article { font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.7; color: #1a1a1a; max-width: 680px; padding: 12px 16px 32px 0; text-align: left; }
.article p, .article li { font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.7; }
.article a { color: #b00000; }
.article a:hover { color: #7a0000; }
.article h1 { font-family: Arial, Helvetica, sans-serif; font-weight: 800; letter-spacing: -0.04em; line-height: 1.08; margin: 10px 0 12px; color: #111; text-align: left; }
.article .dek { font-family: Arial, Helvetica, sans-serif; font-weight: 600; line-height: 1.35; color: #444; margin: 0 0 18px; text-align: left; }
.article .hero-banner { display: block; width: 100%; max-width: 1000px; height: auto; margin: 0 0 18px; }
.article .byline-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 0 28px; padding-bottom: 16px; border-bottom: 1px solid #e4e4e4; }
.article .byline-wrap { display: flex; align-items: center; gap: 12px; min-width: 0; }
.article .author-photo,
.article a .author-photo {
  width: 72px !important;
  height: 72px !important;
  max-width: 72px !important;
  max-height: 72px !important;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
  display: block;
}
.article .byline { font-style: italic; font-size: 0.92em; margin: 0; color: #333; }
.article .byline a { color: inherit; text-decoration: underline; }
.article .follow-wrap { margin-top: 6px; }
.article h2 { font-family: Arial, Helvetica, sans-serif; font-weight: 800; letter-spacing: -0.02em; margin: 2em 0 0.5em; color: #111; text-align: left; }
.article p { margin: 0 0 1.05em; }
.article img { max-width: 100%; height: auto; }
.article .figure { margin: 1.4em 0 1.6em; text-align: center; }
.article .caption { font-size: 0.78em; line-height: 1.45; text-align: center; margin: 8px 0 0; color: #555; }
.article .pdf-dl { margin-left: auto; text-align: right; flex-shrink: 0; line-height: 1; }
.article .pdf-dl img { width: 20px; height: 21px; vertical-align: middle; opacity: 0.55; }
.article .pdf-dl a { color: #888; font-family: Arial, Helvetica, sans-serif; font-size: 11px; font-weight: 700; letter-spacing: 0.04em; text-decoration: none; }
.article .pdf-dl a:hover { color: #b00000; }
.article .pdf-dl a:hover img { opacity: 1; }
.article .steps { margin: 1.2em 0 1.6em; display: flex; flex-direction: column; gap: 14px; }
.article .step { margin: 0; padding: 16px 18px; background: #f6f6f4; border: 1px solid #e6e6e2; border-radius: 10px; box-shadow: 0 1px 2px rgba(0,0,0,0.04); text-align: left; }
.article .step p { margin-bottom: 0.7em; }
.article .step p:last-child { margin-bottom: 0; }
.ad-card { max-width: 40em; margin: 8px auto 24px; padding: 0; background: #fff; border: 1px solid #e6e6e2; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.06); }
.ad-card a { display: block; }
.ad-card img { display: block; width: 100%; height: auto; }
.book-form { max-width: 40em; margin: 0 auto 40px; padding: 22px 24px 24px; background: #fffdf6; border: 1px solid #ead9a8; border-radius: 12px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); }
.book-form .book-hero { display: flex; align-items: center; gap: 18px; margin-bottom: 16px; }
.book-form .book-hero img.cover { width: 110px; height: auto; flex-shrink: 0; }
.book-form .book-hero img.gratis { width: 180px; max-width: 100%; height: auto; }
.book-form .book-copy { font-family: Georgia, "Times New Roman", Times, serif; font-size: 16px; line-height: 1.55; color: #1a1a1a; }
.book-form .book-copy p { margin: 0 0 0.8em; }
.book-form form { margin-top: 8px; }
.book-form input[type="text"], .book-form select { width: 100%; max-width: 100%; box-sizing: border-box; padding: 8px; font-size: 16px; }
.book-form .form-label { font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 14px; margin: 10px 0 4px; }
.book-form .note { font-family: Arial, Helvetica, sans-serif; font-size: 13px; margin: 0 0 8px; }
.book-form .email-row { background: #fff44a; padding: 10px 12px; border-radius: 4px; }
.book-form .submit-wrap { text-align: center; margin-top: 14px; }
.book-form input[type="submit"] { font-family: Arial, Helvetica, sans-serif; font-weight: 700; font-size: 15px; padding: 10px 18px; cursor: pointer; }
@media (max-width: 640px) {
  .article { padding: 8px 12px 24px 0; }
  .book-form .book-hero { flex-direction: column; text-align: center; }
}
.article .essence { margin: 1.4em 0 0.4em; padding: 16px 18px 8px; background: #f7f7f5; border-left: 3px solid #b00000; }
.article .essence h2 { margin-top: 0; }
.article .author-box { margin-top: 36px; padding-top: 20px; border-top: 1px solid #ddd; font-style: italic; font-size: 0.92em; color: #333; }
.article .author-copy { font-size: 12px; color: #666; text-align: right; font-style: normal; margin-top: 16px; }