/* ═══════════════════════════════════════════════
   AlignData — article.css
   Estilos compartidos de las guías (ley-21719-que-es, multas-ley-21719, preparar-empresa-2026)
   y de la página de privacidad.
   ═══════════════════════════════════════════════ */
:root { --navy:#0F1E38; --teal:#00B894; --teal-ink:#007a63; --blue:#2563EB; --text:#1a202c; --muted:#4a5568; --border:#e2e8f0; }
* { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:#fff; color:var(--text); font-family:'DM Sans',sans-serif; font-size:16px; line-height:1.8; }
a { color:var(--teal-ink); }
a:focus-visible, button:focus-visible { outline:2px solid var(--blue); outline-offset:2px; }
.skip { position:absolute; left:-9999px; top:8px; background:#fff; color:var(--navy); padding:8px 14px; border-radius:6px; z-index:999; }
.skip:focus { left:8px; }

.topbar { background:var(--navy); padding:14px 24px; display:flex; align-items:center; justify-content:space-between; }
.topbar-logo { color:#fff; font-size:16px; font-weight:600; text-decoration:none; }
.topbar-logo span { color:var(--teal); }
.topbar-back { color:rgba(255,255,255,.75); font-size:13px; text-decoration:none; transition:color .15s; }
.topbar-back:hover { color:#fff; }

.hero-article { background:var(--navy); padding:56px 24px 64px; text-align:center; }
.article-tag { display:inline-block; background:rgba(0,184,148,.16); color:#2fe0bb; font-size:11px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; padding:5px 14px; border-radius:20px; margin-bottom:20px; }
.article-h1 { font-family:'DM Serif Display',serif; font-size:38px; font-weight:400; color:#fff; line-height:1.2; max-width:700px; margin:0 auto 16px; }
.article-h1 em { color:#2fe0bb; font-style:italic; }
.article-meta { font-size:13px; color:rgba(255,255,255,.68); }

.article-body { max-width:720px; margin:0 auto; padding:56px 24px; }
h2 { font-family:'DM Serif Display',serif; font-weight:400; font-size:26px; color:var(--navy); margin:40px 0 16px; line-height:1.3; }
h3 { font-size:18px; font-weight:600; color:var(--navy); margin:28px 0 10px; }
p { margin-bottom:18px; color:var(--muted); }
ul, ol { margin:0 0 18px 24px; color:var(--muted); }
li { margin-bottom:8px; }

.highlight { background:#f0fdf4; border-left:4px solid var(--teal); border-radius:0 8px 8px 0; padding:16px 20px; margin:24px 0; }
.highlight p { margin:0; color:#166534; font-size:14px; }
.warning { background:#fef3c7; border-left:4px solid #f59e0b; border-radius:0 8px 8px 0; padding:16px 20px; margin:24px 0; }
.warning p { margin:0; color:#92400e; font-size:14px; }
.notice { background:#eff6ff; border-left:4px solid var(--blue); border-radius:0 8px 8px 0; padding:16px 20px; margin:24px 0; }
.notice p { margin:0; color:#1e3a8a; font-size:14px; }
.notice a { color:#1e40af; }
.disclaimer { font-size:13px; color:#5a6a7c; border-top:1px solid var(--border); padding-top:20px; margin-top:40px; }

.data-table { width:100%; border-collapse:collapse; margin:24px 0; font-size:14px; }
.data-table th { background:var(--navy); color:#fff; padding:12px 16px; text-align:left; font-weight:500; }
.data-table td { padding:12px 16px; border-bottom:1px solid var(--border); color:var(--muted); vertical-align:top; }
.data-table tr:last-child td { border-bottom:none; }
.data-table tr:nth-child(even) td { background:#f8fafc; }
.table-wrap { overflow-x:auto; }

.cta-box { background:var(--navy); border-radius:16px; padding:36px; text-align:center; margin:48px 0 0; }
.cta-box h3 { font-family:'DM Serif Display',serif; font-weight:400; font-size:24px; color:#fff; margin:0 0 10px; }
.cta-box p { color:rgba(255,255,255,.75); margin-bottom:24px; }
.btn-cta { display:inline-block; background:linear-gradient(135deg,var(--blue),#00957a); color:#fff; font-size:14px; font-weight:500; padding:12px 28px; border-radius:8px; text-decoration:none; transition:opacity .15s; }
.btn-cta:hover { opacity:.9; color:#fff; }
.divider { border:none; border-top:1px solid var(--border); margin:40px 0; }

/* Multas */
.sancion-card { border:1px solid var(--border); border-radius:12px; padding:20px 24px; margin-bottom:16px; display:flex; align-items:flex-start; gap:16px; }
.sancion-badge { min-width:92px; padding:6px 0; border-radius:8px; text-align:center; font-size:12px; font-weight:700; flex-shrink:0; }
.sancion-leve { background:#fef3c7; color:#92400e; }
.sancion-grave { background:#fee2e2; color:#991b1b; }
.sancion-gravisima { background:#fce7f3; color:#9d174d; }
.sancion-info h4 { font-size:15px; font-weight:600; color:var(--navy); margin-bottom:4px; }
.sancion-info p { font-size:13.5px; margin:0; color:var(--muted); }
.sancion-monto { font-size:18px; font-weight:700; color:var(--navy); margin-top:6px; }
.sancion-monto small { font-size:13px; font-weight:500; color:var(--muted); }

/* Plan de acción */
.step-card { display:flex; gap:20px; align-items:flex-start; margin-bottom:28px; padding:20px 24px; border:1px solid var(--border); border-radius:12px; }
.step-num { width:40px; height:40px; border-radius:50%; background:var(--navy); color:#fff; font-size:16px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.step-body h3 { font-size:16px; font-weight:600; color:var(--navy); margin:0 0 6px; }
.step-body p { font-size:14px; margin:0; color:var(--muted); }
.step-body ul { font-size:13.5px; margin:8px 0 0 16px; }
.timeline { position:relative; margin:24px 0; }
.tl-item { display:flex; gap:16px; margin-bottom:20px; align-items:flex-start; }
.tl-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; margin-top:8px; }
.tl-content h4 { font-size:14.5px; font-weight:600; color:var(--navy); margin-bottom:3px; }
.tl-content p { font-size:13.5px; color:var(--muted); margin:0; }

/* Pie */
.site-foot { background:#162843; padding:24px; text-align:center; font-size:12.5px; color:rgba(255,255,255,.65); }
.site-foot a { color:rgba(255,255,255,.85); text-decoration:none; margin:0 10px; }
.site-foot a:hover { color:#2fe0bb; text-decoration:underline; }

@media (max-width:600px) {
  .article-h1 { font-size:27px; }
  .article-body { padding:36px 20px; }
  .step-card { padding:16px; gap:14px; }
  .sancion-card { flex-direction:column; gap:10px; }
}