/* metodo.css — Method pages (gallmur.com/es/metodo/*)
   Design system: carbon #030608 / cyan #00B8E6 / off-white #fffdf8
   Pattern: forensic-audit.css — page sheet layered over site.css.
   Rules: ONLY page-specific additions. .article layout, .micro, .button,
   .closing base, .article-deck and .article-end live in site.css — not
   redefined here. No !important, no glow, no decorative gradients. */

/* 1 · HEADER — authority page signature
   Micro-label mono in cyan; header hairline brightened to line-hi;
   short cyan rule under the h1 as the authority marker (::after, no DOM). */
.article>header{border-bottom-color:var(--line-hi)}
.article>header>.micro{color:var(--cyan-hi)}
.article>header h1::after{content:"";display:block;width:3.2rem;height:2px;background:var(--cyan);margin-top:1rem}

/* 2 · SECTION TITLES — cyan dash prefix on every h2 (::before, no DOM) */
.article-body section h2::before{content:"";display:inline-block;width:.9rem;height:2px;background:var(--cyan);margin-right:.65rem;vertical-align:.32em}

/* 3 · LISTS — evidence rows: hairline left edge, strong in cyan-hi */
.article-body section ul{list-style:none;margin:1.4rem 0 0;padding:0;display:flex;flex-direction:column;gap:.9rem}
.article-body section ul li{font:400 1.05rem/1.75 var(--body);color:#c2ccd0;padding:.3rem 0 .3rem 1.2rem;border-left:1px solid var(--line-hi)}
.article-body section ul li strong{color:var(--cyan-hi);font-weight:700}
.article-body section ul li a{color:var(--cyan-hi);text-decoration:underline;text-decoration-color:var(--line-hi);text-underline-offset:3px;transition:color .15s var(--ease),text-decoration-color .15s var(--ease)}
.article-body section ul li a:hover{color:var(--text-strong);text-decoration-color:var(--cyan-hi)}

/* 4 · SOURCES — verification appendix: editorial rows, mono SRC index */
.article-body .article-sources{margin-top:4rem;padding-top:2.2rem;border-top:1px solid var(--line)}
.article-body .article-sources ul{counter-reset:src;list-style:none;margin:1.6rem 0 0;padding:0;display:flex;flex-direction:column}
.article-body .article-sources ul li{display:flex;align-items:baseline;gap:.9rem;border-left:0;padding:.9rem 0;border-bottom:1px solid var(--line)}
.article-body .article-sources ul li:last-child{border-bottom:0}
.article-body .article-sources ul li::before{counter-increment:src;content:"SRC·0" counter(src);font:700 .62rem var(--mono);letter-spacing:.08em;color:var(--cyan-hi);flex:0 0 auto}
.article-body .article-sources ul li a{font:650 .72rem var(--mono);letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--muted);transition:color .15s var(--ease)}
.article-body .article-sources ul li a:hover{color:var(--cyan-hi)}

/* 5 · CLOSING — contextual panel: flat panel bg, line-hi top edge, cyan micro */
.closing.contextual{background:var(--panel);border-top:1px solid var(--line-hi)}
.closing.contextual .micro{color:var(--cyan-hi)}

/* 6 · MÓVIL — h1 steps down, paddings tighten.
   Rules that would collide with site.css ≤600px handling are guarded
   to 601–720px so the existing mobile values keep winning below. */
@media(max-width:720px){
  .article>header h1{font-size:clamp(2.35rem,6.4vw,2.85rem)}
  .article>header h1::after{margin-top:.8rem}
  .article-body{margin:3.5rem auto}
  .article-body section{margin-bottom:3rem}
  .article-body .article-sources{margin-top:3rem;padding-top:1.8rem}
}
@media(max-width:720px) and (min-width:601px){
  .article{padding:3.5rem 20px}
  .closing.contextual{padding-top:3.5rem;padding-bottom:3.5rem}
}