/* ========================================================= Asistentes Cabrero — hoja de estilos compartida del sitio Mismos tokens de color que la calculadora Art. 13/33, para que toda la plataforma se sienta como un solo sistema. ========================================================= */ :root{ --bg:#f5f6f8; --card:#ffffff; --text:#1a1d23; --muted:#6b7280; --border:#e5e7eb; --accent:#2563eb; --accent-ink:#ffffff; --good:#15803d; --good-bg:#ecfdf3; --zero:#b91c1c; --zero-bg:#fef2f2; --shadow: 0 1px 3px rgba(16,24,40,0.08), 0 1px 2px rgba(16,24,40,0.06); --radius:16px; --header-h:56px; --nav-h:64px; /* Sistema de confiabilidad de fuentes */ --trust-norma:#15803d; --trust-norma-bg:#ecfdf3; --trust-dictamen:#2563eb; --trust-dictamen-bg:#eff6ff; --trust-gremio:#b45309; --trust-gremio-bg:#fffbea; --trust-noticia:#c2410c; --trust-noticia-bg:#fff2ea; --trust-analisis:#b91c1c; --trust-analisis-bg:#fef2f2; } @media (prefers-color-scheme: dark){ :root{ --bg:#121317; --card:#1c1e24; --text:#f2f3f5; --muted:#9aa0aa; --border:#2c2f37; --accent:#3b82f6; --accent-ink:#ffffff; --good:#4ade80; --good-bg:#0f2a1a; --zero:#f87171; --zero-bg:#2a1414; --shadow: 0 1px 3px rgba(0,0,0,0.4); --trust-norma:#4ade80; --trust-norma-bg:#0f2a1a; --trust-dictamen:#60a5fa; --trust-dictamen-bg:#0f1e33; --trust-gremio:#fbbf24; --trust-gremio-bg:#2a2412; --trust-noticia:#fb923c; --trust-noticia-bg:#2a1c0f; --trust-analisis:#f87171; --trust-analisis-bg:#2a1414; } } *{ box-sizing:border-box; } html,body{ margin:0; padding:0; } body{ background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; min-height:100vh; padding-bottom:calc(var(--nav-h) + 12px); } a{ color:inherit; } .container{ width:100%; max-width:640px; margin:0 auto; padding:0 16px; } /* ---------- Header ---------- */ .site-header{ position:sticky; top:0; z-index:20; height:var(--header-h); display:flex; align-items:center; background:var(--card); border-bottom:1px solid var(--border); } .site-header .container{ display:flex; align-items:center; justify-content:space-between; } .brand{ display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); } .brand-mark{ width:32px; height:32px; border-radius:9px; background:var(--accent); color:var(--accent-ink); display:flex; align-items:center; justify-content:center; font-weight:800; font-size:0.95rem; flex-shrink:0; } .brand-text{ line-height:1.15; } .brand-text strong{ display:block; font-size:0.95rem; font-weight:800; } .brand-text span{ display:block; font-size:0.68rem; color:var(--muted); } .desktop-nav{ display:none; gap:4px; } .desktop-nav a{ text-decoration:none; font-size:0.88rem; font-weight:600; color:var(--muted); padding:8px 12px; border-radius:8px; } .desktop-nav a.active, .desktop-nav a:hover{ color:var(--text); background:var(--bg); } .desktop-nav .soon{ opacity:0.55; cursor:default; } @media (min-width:760px){ .desktop-nav{ display:flex; } .bottom-nav{ display:none; } body{ padding-bottom:24px; } } /* ---------- Bottom nav (mobile) ---------- */ .bottom-nav{ position:fixed; bottom:0; left:0; right:0; height:var(--nav-h); background:var(--card); border-top:1px solid var(--border); display:flex; z-index:20; } .bottom-nav a{ flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; text-decoration:none; color:var(--muted); font-size:0.68rem; font-weight:600; } .bottom-nav a svg{ width:20px; height:20px; } .bottom-nav a.active{ color:var(--accent); } .bottom-nav a.soon{ opacity:0.5; } /* ---------- Layout blocks ---------- */ main{ padding:20px 0 8px; } .card{ background:var(--card); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow); padding:20px; margin-bottom:16px; } .hero{ text-align:center; padding:8px 0 4px; } .hero h1{ font-size:1.4rem; margin:0 0 8px; font-weight:800; text-wrap:balance; } .hero p{ margin:0; color:var(--muted); font-size:0.92rem; line-height:1.5; } .eyebrow{ display:inline-block; font-size:0.7rem; font-weight:700; letter-spacing:0.05em; text-transform:uppercase; color:var(--accent); margin-bottom:6px; } h2.section-title{ font-size:1.02rem; font-weight:800; margin:28px 0 12px; } h2.section-title:first-of-type{ margin-top:8px; } .action-card{ display:flex; align-items:center; gap:14px; text-decoration:none; color:var(--text); } .action-icon{ width:44px; height:44px; border-radius:12px; background:var(--good-bg); color:var(--good); display:flex; align-items:center; justify-content:center; flex-shrink:0; } .action-icon svg{ width:22px; height:22px; } .action-body strong{ display:block; font-size:0.95rem; } .action-body span{ display:block; font-size:0.8rem; color:var(--muted); margin-top:2px; } .action-arrow{ margin-left:auto; color:var(--muted); } .soon-card{ opacity:0.72; } .soon-card .action-icon{ background:var(--bg); color:var(--muted); } .pill{ display:inline-block; font-size:0.65rem; font-weight:700; padding:2px 8px; border-radius:999px; background:var(--bg); color:var(--muted); margin-left:8px; vertical-align:middle; } /* ---------- Leyenda de confiabilidad ---------- */ .trust-grid{ display:flex; flex-direction:column; gap:8px; } .trust-row{ display:flex; align-items:center; gap:10px; font-size:0.84rem; } .trust-dot{ width:12px; height:12px; border-radius:50%; flex-shrink:0; } .trust-row b{ font-weight:700; } .trust-row span{ color:var(--muted); } /* ---------- Footer ---------- */ .site-footer{ padding:24px 0 8px; text-align:center; color:var(--muted); font-size:0.76rem; line-height:1.6; } .site-footer a{ color:var(--accent); text-decoration:none; font-weight:600; } /* ---------- Utility ---------- */ .text-wrap-balance{ text-wrap:balance; }