/* ADN Light — single-post.css
   Sprint 3 fase 2 (2026-05-24). Adaptado desde mockups/articulo.html.
   Estilos para single post: hero + TOC + body + share + author + related. */

/* HERO ARTICULO */
.ahero{position:relative;padding:clamp(80px,10vw,140px) 0 clamp(60px,8vw,100px);background:var(--ink, #0a0908);color:#fff;overflow:hidden}
.ahero .ahero-bg{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.32;animation:azoom 22s ease-out forwards}
@keyframes azoom{from{transform:scale(1.06)}to{transform:scale(1)}}
.ahero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,9,8,.55) 0%,rgba(10,9,8,.88) 100%)}
.ahero .wrap{position:relative;z-index:2;max-width:880px;text-align:center}
.ahero .cat{display:inline-block;background:var(--amber, #f5ba42);color:var(--ink, #0a0908);font-family:var(--display, 'Sora', sans-serif);font-size:.72rem;font-weight:700;letter-spacing:.18em;text-transform:uppercase;padding:7px 18px;border-radius:100px;margin-bottom:20px;text-decoration:none}
.ahero h1{color:#fff;font-size:clamp(2.2rem,5vw,4rem);font-weight:800;margin-bottom:24px;line-height:1.08;letter-spacing:-.02em}
.ahero h1 em{font-style:normal;font-family:'Kaushan Script',cursive;color:var(--amber, #f5ba42);font-weight:400}
.ahero .ameta{display:flex;justify-content:center;gap:24px;font-family:var(--display, 'Sora', sans-serif);font-size:.86rem;color:#c8c0b0;flex-wrap:wrap;align-items:center}
.ahero .ameta div{display:flex;align-items:center;gap:8px}
.ahero .ameta svg{width:16px;height:16px;color:var(--amber, #f5ba42);fill:none;stroke:currentColor;stroke-width:2}
.ahero .ameta .au{font-weight:600;color:#fff}

/* MAIN: TOC + BODY */
.amain{padding:clamp(60px,8vw,90px) 0 clamp(72px,9vw,100px);background:var(--paper, #faf7f0)}
.amain .wrap{display:grid;grid-template-columns:220px 1fr;gap:80px;max-width:1080px;align-items:start}
.atoc{position:sticky;top:120px;height:fit-content}
.atoc .lab{font-family:var(--display, 'Sora', sans-serif);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--amber-text, #fcb900);font-weight:600;margin-bottom:14px}
.atoc ol,.atoc ul{list-style:none;padding-left:0;display:flex;flex-direction:column;gap:6px;border-left:1px solid var(--line, #e8e2d4);counter-reset:s;margin:0}
.atoc li{counter-increment:s;position:relative}
.atoc a{font-family:var(--display, 'Sora', sans-serif);font-size:.86rem;color:var(--muted, #8a7f6d);padding:8px 14px;display:block;transition:.18s cubic-bezier(.2,.7,.3,1);font-weight:500;line-height:1.4;text-decoration:none}
.atoc a::before{content:"0" counter(s);color:var(--amber-text, #fcb900);margin-right:8px;font-weight:600}
.atoc a:hover,.atoc a.active,.atoc a.curr{color:var(--ink, #0a0908);border-left:2px solid var(--amber, #f5ba42);margin-left:-1px;padding-left:13px}

.abody{font-family:var(--body, 'Inter', sans-serif);font-size:1.06rem;color:var(--text, #4a4439);line-height:1.85;max-width:680px}
.abody p{margin-bottom:18px}
.abody>p:first-of-type{font-size:1.18rem;color:var(--ink, #0a0908);border-left:3px solid var(--amber, #f5ba42);padding-left:22px;font-weight:400}
.abody h2{font-family:var(--display, 'Sora', sans-serif);font-size:1.9rem;font-weight:700;color:var(--ink, #0a0908);margin:42px 0 16px;letter-spacing:-.02em;line-height:1.15}
.abody h2::before{content:"";display:block;width:42px;height:2px;background:var(--amber, #f5ba42);margin-bottom:18px}
.abody h3{font-family:var(--display, 'Sora', sans-serif);font-size:1.3rem;font-weight:700;color:var(--ink, #0a0908);margin:30px 0 12px;letter-spacing:-.01em}
.abody strong{color:var(--ink, #0a0908);font-weight:600}
.abody a{color:var(--amber-text, #fcb900);text-decoration:underline;text-underline-offset:3px}
.abody a:hover{color:var(--ink, #0a0908)}
.abody ul,.abody ol{padding-left:20px;margin-bottom:18px}
.abody ul li,.abody ol li{margin-bottom:8px}
.abody blockquote{margin:30px 0;padding:30px;background:var(--cream, #f3ede1);border-left:3px solid var(--amber, #f5ba42);border-radius:0 14px 14px 0;font-family:var(--display, 'Sora', sans-serif);font-size:1.18rem;font-weight:500;color:var(--ink, #0a0908);font-style:italic;line-height:1.5}
.abody blockquote cite{display:block;margin-top:12px;font-family:var(--display, 'Sora', sans-serif);font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted, #8a7f6d);font-style:normal}
.abody figure{margin:36px 0;border-radius:18px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(21,19,15,.25)}
.abody figure img{width:100%;height:auto;display:block}
.abody figure figcaption{padding:12px 20px;font-family:var(--display, 'Sora', sans-serif);font-size:.84rem;color:var(--muted, #8a7f6d);background:var(--cream, #f3ede1);border-top:1px solid var(--line, #e8e2d4)}
.abody img{max-width:100%;height:auto;border-radius:14px}

/* COMPARTIR */
.ashare{padding:36px 0;background:var(--cream, #f3ede1);border-top:1px solid var(--line, #e8e2d4);border-bottom:1px solid var(--line, #e8e2d4)}
.ashare .wrap{display:flex;justify-content:space-between;align-items:center;max-width:880px;flex-wrap:wrap;gap:18px}
.ashare .tags{display:flex;gap:8px;flex-wrap:wrap}
.ashare .tag{font-family:var(--display, 'Sora', sans-serif);font-size:.84rem;color:var(--ink, #0a0908);background:#fff;border:1px solid var(--line, #e8e2d4);border-radius:100px;padding:6px 14px;transition:.18s cubic-bezier(.2,.7,.3,1);text-decoration:none}
.ashare .tag:hover{border-color:var(--amber, #f5ba42);color:var(--amber-text, #fcb900)}
.ashare .sbtns{display:flex;gap:10px;align-items:center;font-family:var(--display, 'Sora', sans-serif);font-size:.84rem;color:var(--muted, #8a7f6d)}
.ashare .sbtns a{width:36px;height:36px;border-radius:50%;border:1px solid var(--line, #e8e2d4);background:#fff;display:grid;place-items:center;color:var(--ink, #0a0908);transition:.18s cubic-bezier(.2,.7,.3,1);text-decoration:none}
.ashare .sbtns a:hover{background:var(--ink, #0a0908);color:var(--amber, #f5ba42);transform:translateY(-2px);border-color:var(--ink, #0a0908)}
.ashare .sbtns a svg{width:15px;height:15px;fill:currentColor}

/* AUTHOR */
.aauthor{padding:clamp(56px,7vw,90px) 0;background:var(--paper, #faf7f0)}
.aauthor .wrap{display:grid;grid-template-columns:auto 1fr;gap:30px;max-width:880px;background:var(--cream, #f3ede1);border-radius:18px;padding:32px;border:1px solid var(--line, #e8e2d4);align-items:center}
.aauthor .photo{width:96px;height:96px;border-radius:50%;background:var(--ink, #0a0908);display:grid;place-items:center;color:var(--amber, #f5ba42);font-family:'Kaushan Script',cursive;font-size:2.5rem;flex:none;overflow:hidden}
.aauthor .photo img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.aauthor h4{font-family:var(--display, 'Sora', sans-serif);font-size:1.1rem;font-weight:700;color:var(--ink, #0a0908);margin-bottom:4px}
.aauthor .rol{font-family:var(--display, 'Sora', sans-serif);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--amber-text, #fcb900);font-weight:600;margin-bottom:10px;display:block}
.aauthor p{font-size:.96rem;color:var(--text, #4a4439);line-height:1.6}

/* RELATED */
.arel{padding:clamp(64px,9vw,100px) 0;background:var(--cream, #f3ede1)}
.arel .head{text-align:center;margin-bottom:40px}
.arel h2{font-size:clamp(2rem,3.6vw,2.8rem);font-weight:800;margin:14px 0;color:var(--ink, #0a0908)}
.arel h2 em{font-style:normal;font-family:'Kaushan Script',cursive;color:var(--amber-deep, #fcb900);font-weight:400}
.arel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}

@media(max-width:1080px){
  .amain .wrap{grid-template-columns:1fr;gap:36px}
  .atoc{position:static}
  .atoc ol,.atoc ul{flex-direction:row;flex-wrap:wrap;border-left:none;border-top:1px solid var(--line, #e8e2d4);padding-top:14px;gap:14px}
  .atoc a{padding:6px 10px}
  .arel-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .arel-grid{grid-template-columns:1fr}
  .aauthor .wrap{grid-template-columns:1fr;text-align:center}
  .aauthor .photo{margin:0 auto}
  .ahero .ameta{gap:14px;font-size:.78rem}
}

/* CTA SIGUIENTE PASO (3 cards) - Sprint 4 feedback MA */
.adnl-cta-pasos{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0 18px}
@media (max-width:780px){.adnl-cta-pasos{grid-template-columns:1fr}}
.adnl-cta-paso{display:flex;flex-direction:column;gap:6px;padding:20px 22px;background:var(--cream,#f6f2ea);border:1px solid var(--line,#e8e2d5);border-radius:14px;text-decoration:none;color:var(--ink,#15130f);transition:.2s cubic-bezier(.22,.61,.36,1)}
.adnl-cta-paso:hover{border-color:var(--amber,#fcb900);background:#fff;transform:translateY(-3px);box-shadow:0 10px 30px -14px rgba(252,185,0,.55)}
.adnl-cta-label{font-family:var(--display,'Sora',sans-serif);font-size:.74rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--amber,#fcb900)}
.adnl-cta-value{font-family:var(--display,'Sora',sans-serif);font-size:1.04rem;font-weight:600;color:var(--ink,#15130f);line-height:1.3}
.adnl-cta-foot{font-family:var(--body,'Inter',sans-serif);font-size:.92rem;color:var(--muted,#8a7f6d);font-style:italic;margin-top:6px}