/* MYDESKS — Blog article shared styles
   Folosit de blog.php (DB-served) și de articolele statice din /blog/. */

:root{
  --ink:#0b0e1a;--ink-mid:#0f1525;--ink-surface:#141c30;--ink-raised:#1a2540;
  --border:rgba(255,255,255,0.07);--border-md:rgba(255,255,255,0.12);
  --amber:#e8a020;--amber-glow:rgba(232,160,32,0.12);--amber-hi:#f5b840;
  --teal:#22c4d4;--green:#34d399;--red:#dc2626;--yellow:#facc15;
  --text:#e8edf8;--text-mid:#8a96b0;--text-low:#3d4a65;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Syne",sans-serif;
  --mono:"JetBrains Mono",monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--ink);color:var(--text);font-family:var(--serif);font-size:18px;line-height:1.7}
a{color:var(--amber);text-decoration:none;border-bottom:1px solid rgba(232,160,32,0.3);transition:border-color 0.2s}
a:hover{border-bottom-color:var(--amber)}

nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:0 3rem;height:64px;background:rgba(11,14,26,0.95);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}
.nav-brand{display:flex;align-items:center;gap:0.75rem;border:none}
.logo-grid{width:30px;height:30px;display:grid;grid-template-columns:1fr 1fr;gap:3px;padding:4px;border:1.5px solid var(--amber)}
.logo-grid span{background:var(--amber);display:block}
.wordmark{font-family:var(--sans);font-weight:700;font-size:0.95rem;letter-spacing:0.18em;color:var(--text);text-transform:uppercase}
.wordmark em{color:var(--amber);font-style:normal}
.nav-back{font-family:var(--mono);font-size:0.78rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--text-mid);border:none}
.nav-back:hover{color:var(--amber)}

.art-hdr{padding:9rem 1.5rem 4rem;text-align:center;max-width:880px;margin:0 auto}
.art-eyebrow{display:inline-flex;align-items:center;gap:1rem;margin-bottom:1.5rem;font-family:var(--mono);font-size:0.75rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--amber)}
.art-eyebrow::before,.art-eyebrow::after{content:"";display:inline-block;width:30px;height:1px;background:var(--amber)}
.art-h1{font-family:var(--serif);font-weight:300;font-size:clamp(2rem,4.5vw,3.5rem);line-height:1.15;letter-spacing:-0.015em;color:var(--text);margin-bottom:1.5rem}
.art-h1 em{color:var(--amber);font-style:italic}
.art-sub{font-size:1.15rem;color:var(--text-mid);max-width:620px;margin:0 auto;line-height:1.7;font-family:var(--serif)}
.art-meta{display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;font-family:var(--mono);font-size:0.78rem;letter-spacing:0.06em;color:var(--text-low);text-transform:uppercase;margin-top:1.5rem}
.art-meta span{display:flex;align-items:center;gap:0.5rem}
.art-tag{padding:3px 10px;background:var(--amber-glow);border:1px solid rgba(232,160,32,0.25);color:var(--amber-hi);border-radius:3px;font-size:0.7rem}

.art-body{max-width:780px;margin:0 auto;padding:2rem 1.5rem 5rem}
.art-body p{margin:0 0 1.4em;color:var(--text);font-size:1.1rem;line-height:1.85}
.art-body p.lead{font-size:1.3rem;color:var(--text);font-weight:300;font-style:italic;border-left:3px solid var(--amber);padding-left:1.25rem;margin-bottom:2.5rem}
.art-body h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,3vw,2.2rem);color:var(--text);margin:3.5rem 0 1.25rem;line-height:1.3;letter-spacing:-0.01em}
.art-body h2 em{color:var(--amber);font-style:italic}
.art-body h2::before{content:"§ ";color:var(--amber);font-family:var(--mono);font-weight:400;font-size:0.7em}
.art-body h3{font-family:var(--sans);font-weight:600;font-size:1.15rem;color:var(--text);margin:2.5rem 0 0.85rem;letter-spacing:0.01em}
.art-body h4{font-family:var(--sans);font-weight:600;font-size:1rem;color:var(--text);margin:2rem 0 0.6rem}
.art-body strong{color:var(--text);font-weight:600}
.art-body em{color:var(--text-mid);font-style:italic}
.art-body ul,.art-body ol{margin:0 0 1.6em 1.5rem;color:var(--text)}
.art-body ul li,.art-body ol li{margin:0.4em 0;line-height:1.7}
.art-body ul{list-style:none;padding-left:1rem}
.art-body ul li{position:relative;padding-left:1.2rem}
.art-body ul li::before{content:"—";position:absolute;left:0;color:var(--amber)}
.art-body code{background:var(--ink-mid);padding:2px 6px;border-radius:3px;font-family:var(--mono);font-size:0.92rem;color:var(--amber)}
.art-body pre{background:var(--ink-mid);border:1px solid var(--border);padding:1rem;border-radius:4px;overflow-x:auto;margin:1.5em 0}
.art-body pre code{background:transparent;padding:0;color:var(--text)}
.art-body blockquote{margin:1.5em 0;padding:1rem 1.4rem;background:var(--ink-mid);border-left:3px solid var(--amber);font-style:italic;color:var(--text-mid)}
.art-body table{width:100%;border-collapse:collapse;margin:2em 0;font-family:var(--sans);font-size:0.92rem}
.art-body table th,.art-body table td{padding:11px 14px;text-align:left;border:1px solid var(--border)}
.art-body table th{background:var(--ink-mid);color:var(--amber);font-weight:600;font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase}
.art-body table td{color:var(--text)}

/* Issue boxes (din articolul existent — păstrate) */
.art-body .quote{background:var(--ink-mid);border-left:3px solid var(--text-low);padding:1rem 1.4rem;margin:1.5em 0;font-family:Georgia,serif;font-size:0.98rem;color:var(--text-mid);line-height:1.65;font-style:italic;border-radius:0 4px 4px 0}
.art-body .quote::before{content:"„";font-size:2.5rem;line-height:0;vertical-align:-0.5em;color:var(--amber);margin-right:0.2em}
.art-body .quote-src{display:block;margin-top:0.6rem;font-family:var(--mono);font-size:0.72rem;letter-spacing:0.08em;color:var(--text-low);font-style:normal;text-transform:uppercase}
.art-body .sev{display:inline-flex;align-items:center;gap:0.4rem;padding:3px 9px;border-radius:3px;font-family:var(--mono);font-size:0.66rem;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;vertical-align:middle;margin-right:0.5rem}
.art-body .sev-crit{background:rgba(220,38,38,0.12);border:1px solid rgba(220,38,38,0.4);color:#fca5a5}
.art-body .sev-high{background:rgba(232,160,32,0.12);border:1px solid rgba(232,160,32,0.4);color:var(--amber-hi)}
.art-body .sev-med{background:rgba(250,204,21,0.10);border:1px solid rgba(250,204,21,0.35);color:#fcd34d}
.art-body .sev-low{background:rgba(138,150,176,0.10);border:1px solid rgba(138,150,176,0.3);color:var(--text-mid)}
.art-body .issue{background:var(--ink-mid);border:1px solid var(--border);border-left:3px solid var(--amber);padding:1.5rem 1.75rem;margin:1.75em 0;border-radius:0 4px 4px 0}
.art-body .issue.crit{border-left-color:var(--red)}
.art-body .issue h4{margin:0 0 0.5rem;font-size:1.05rem}
.art-body .issue p{font-size:0.98rem;line-height:1.7;color:var(--text-mid);margin-bottom:0.75em}
.art-body .issue p:last-child{margin-bottom:0}
.art-body .issue p strong{color:var(--text)}

/* TOC + disclaim — păstrate din articolul existent */
.art-body .toc{background:var(--ink-mid);border:1px solid var(--border);padding:1.5rem 1.75rem;margin:2.5em 0;border-radius:6px}
.art-body .toc-title{font-family:var(--mono);font-size:0.75rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--amber);margin-bottom:0.8rem}
.art-body .toc ol{margin:0 0 0 1.2rem;padding:0;color:var(--text-mid)}
.art-body .toc ol li{margin:0.35em 0;font-size:0.95rem;line-height:1.5;font-family:var(--sans)}
.art-body .toc ol li a{color:var(--text-mid);border:none}
.art-body .toc ol li a:hover{color:var(--amber)}
.art-body .disclaim{background:rgba(220,38,38,0.06);border:1px solid rgba(220,38,38,0.2);padding:1.1rem 1.4rem;border-radius:4px;margin:2.5em 0;font-family:var(--sans);font-size:0.88rem;color:#fca5a5;line-height:1.6}
.art-body .disclaim strong{color:#fecaca}

/* Sumar table — din articol */
.art-body .sumar{width:100%;border-collapse:collapse;margin:2em 0;font-family:var(--sans);font-size:0.92rem}
.art-body .sumar th,.art-body .sumar td{padding:11px 14px;text-align:left;border:1px solid var(--border)}
.art-body .sumar th{background:var(--ink-mid);color:var(--amber);font-weight:600;font-size:0.78rem;letter-spacing:0.08em;text-transform:uppercase}
.art-body .sumar td{color:var(--text)}
.art-body .sumar td.sev-cell{font-family:var(--mono);font-size:0.72rem;font-weight:600;letter-spacing:0.06em;text-transform:uppercase}

/* CTA */
.art-cta,.art-body .cta-box{background:var(--ink-mid);border:1px solid var(--border-md);padding:2.5rem 2rem;margin:3.5rem auto;border-radius:8px;text-align:center;max-width:780px}
.art-cta h3,.art-body .cta-box h3{font-family:var(--serif);font-weight:300;font-size:1.6rem;margin-bottom:0.6rem;color:var(--text);font-style:normal}
.art-cta h3 em,.art-body .cta-box h3 em{color:var(--amber);font-style:italic}
.art-cta p,.art-body .cta-box p{font-size:1rem;color:var(--text-mid);margin-bottom:1.5rem;font-style:normal}
.cta-row{display:inline-flex;gap:0.85rem;flex-wrap:wrap;justify-content:center}
.btn-p{display:inline-flex;align-items:center;gap:0.6rem;background:var(--amber);color:var(--ink);font-family:var(--mono);font-size:0.78rem;letter-spacing:0.1em;text-transform:uppercase;font-weight:500;padding:0.85rem 1.75rem;text-decoration:none;cursor:pointer;border:none;transition:all 0.2s}
.btn-p:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(232,160,32,0.3)}
.btn-s{display:inline-flex;align-items:center;gap:0.6rem;background:transparent;color:var(--text-mid);font-family:var(--mono);font-size:0.78rem;letter-spacing:0.1em;text-transform:uppercase;padding:0.85rem 1.6rem;text-decoration:none;border:1px solid var(--border-md);transition:all 0.2s;border-radius:0}
.btn-s:hover{border-color:var(--amber);color:var(--amber)}

footer{background:var(--ink);border-top:1px solid var(--border);padding:2.5rem 1.5rem;text-align:center;font-family:var(--mono);font-size:0.74rem;color:var(--text-low);letter-spacing:0.08em}
footer a{color:var(--text-mid);margin:0 0.85rem;border:none}
footer a:hover{color:var(--amber)}

@media(max-width:720px){
  nav{padding:0 1.2rem}
  .art-hdr{padding:7rem 1.25rem 3rem}
  .art-body{padding:1rem 1.25rem 4rem}
  .art-body p{font-size:1.02rem}
  .art-body .issue{padding:1.2rem}
  .art-body .sumar{font-size:0.85rem}
  .art-body .sumar th,.art-body .sumar td{padding:8px 10px}
  .cta-row{flex-direction:column;width:100%}
  .cta-row a{justify-content:center}
}